<template>
  <div class="app-container">
    <div>
      <el-steps :active="active" finish-status="success">
        <el-step title="基本信息"></el-step>
        <el-step title="监控策略"></el-step>
        <el-step title="信息确认"></el-step>
      </el-steps>
      <!--    内容区   -->
      <div style="margin-top: 30px;">
        <!--    active:0    -->
        <div v-show="active === 0">
           <Form ref="formRef" style="text-align: center;" :formList="formList" :ruleFormData="ruleFormData" :config="config" @fnClick="callback"></Form>
        </div>
        <!--    active:2    -->
        <div v-show="active === 1">
          <el-tabs type="border-card">
            <!--    2-1    -->
            <el-tab-pane v-if="resourceType === 'linux'" label="Linux系统">
              <el-tabs v-model="linuxActiveName">
                <!--    2-1-1    -->
                <el-tab-pane label="监控项" name="first">
                  <el-collapse v-model="activeNames">
                    <el-collapse-item v-for="(item,index) of linuxSystem.monitorItem" :title="item.title" :name="index">
                      <template v-if="item.modelName === 'other'">
                        <div class="plr-50">
                          <div v-for="city of item.checkList" class="w100 mt10 mb10 disInlineBlock fontSize15">
                            <div class="disInlineBlock w45">
                              <span style="width: 200px" class="disInlineBlock">{{ city.metricKey }}</span>
                              <span>{{city.metricName}}</span>
                            </div>
                            <div class="disInlineBlock" style="color: #606266">
                              采集周期：<el-select v-model="city['time']" placeholder="请选择" clearable @change="(changeVal) => handleCheckedCitiesChange(changeVal, item)">
                              <el-option v-for="val in option" :key="val.value" :label="val.label" :value="val.value"></el-option>
                            </el-select>
                            </div>
                          </div>
                        </div>
                      </template>
                      <template v-else>
                        <template slot="title">
                          {{item.title}}
                          <div style="font-size: 13px;margin-left: 15%;">
                            采集周期：<el-select v-model="item['time']" placeholder="请选择" clearable @change="(changeVal) => handleCheckedCitiesChange(changeVal, item)">
                            <el-option v-for="val in option" :key="val.value" :label="val.label" :value="val.value"></el-option>
                          </el-select>
                          </div>
                        </template>
                        <div class="plr-50">
                          <div v-for="city of item.checkList" class="w45 mt10 mb10 disInlineBlock fontSize15">
                            <span style="width: 200px" class="disInlineBlock">{{ city.metricKey }}</span>
                            <span>{{city.metricName}}</span>
                          </div>
                        </div>
                      </template>
                    </el-collapse-item>
                  </el-collapse>
                </el-tab-pane>
                <!--    2-1-2    -->
                <el-tab-pane label="自动发现项" name="second">
                  <el-collapse v-model="activeNames">
                    <el-collapse-item v-for="(item,index) of linuxSystem.autodiscoverItem" :title="item.title" :name="index">
                      <template slot="title">
                        {{item.title}}
                        <div style="font-size: 13px;margin-left: 15%;">
                          采集周期：<el-select v-model="item['time']" id="selDisabled" clearable :disabled="item.modelName === 'net' ? true : false" placeholder="请选择" @change="(changeVal) => handleCheckedCitiesChange(changeVal, item)">
                          <el-option v-for="val in option" :key="val.value" :label="val.label" :value="val.value"></el-option>
                        </el-select>
                        </div>
                      </template>
                      <div style="display: flex;justify-content: center;">
                        <div class="plr-50">
                          <div v-for="city of item.checkList" class="w100 mt10 mb10 disBlock fontSize15">
                            <span style="width: 200px" class="disInlineBlock">{{city.metricKey}}</span>
                            <span>{{city.metricName}}</span>
                          </div>
                        </div>
                      </div>
                    </el-collapse-item>
                  </el-collapse>
                </el-tab-pane>
              </el-tabs>
            </el-tab-pane>
            <!--    2-2    -->
            <el-tab-pane v-if="resourceType === 'switch'" label="华为交换机">
              <span slot="label">
                华为交换机
                <el-tooltip trigger="click" effect="dark" placement="top">
                  <template #content>针对CloudEngine 58&68&78&88&98系列</template>
                  <i class="el-icon-question"></i>
                </el-tooltip>
              </span>
              <el-tabs v-model="hwActiveName">
                <!--    2-2-1    -->
                <el-tab-pane label="监控项" name="first">
                  <template v-for="(item,index) of monitorTable['nodeOne']">
                    <div class="plr-50">
                      <div v-for="city of item.checkList" class="w100 mt10 mb10 disInlineBlock fontSize15">
                        <div class="disInlineBlock w60">
                          <span style="width: 200px" class="disInlineBlock">{{ city.metricKey }}</span>
                          <span>{{city.metricName}}</span>
                        </div>
                        <div class="disInlineBlock" style="color: #606266">
                          采集周期：<el-select v-model="city['time']" placeholder="请选择" clearable @change="(changeVal) => handleCheckedCitiesChange(changeVal, item)">
                          <el-option v-for="val in option" :key="val.value" :label="val.label" :value="val.value"></el-option>
                        </el-select>
                        </div>
                      </div>
                    </div>
                  </template>
                </el-tab-pane>
                <!--    2-2-2    -->
                <el-tab-pane label="自动发现项" name="second">
                  <el-collapse v-model="activeNames">
                    <el-collapse-item v-for="(item,index) of monitorTable['nodeTow']" :title="item.title" :name="index">
                      <template slot="title">
                        {{item.title}}
                        <div style="font-size: 13px;margin-left: 15%;">
                          采集周期：<el-select v-model="item['time']" id="selDisabled" clearable :disabled="item.modelName === 'switchNet' ? true : false" placeholder="请选择" @change="(changeVal) => handleCheckedCitiesChange(changeVal, item)">
                          <el-option v-for="val in option" :key="val.value" :label="val.label" :value="val.value"></el-option>
                        </el-select>
                        </div>
                      </template>
                      <div style="display: flex;justify-content: center;">
                        <div class="plr-50">
                          <div v-for="city of item.checkList" class="w100 mt10 mb10 disBlock fontSize15">
                            <span style="width: 200px" class="disInlineBlock">{{city.metricKey}}</span>
                            <span>{{city.metricName}}</span>
                          </div>
                        </div>
                      </div>
                    </el-collapse-item>
                  </el-collapse>
                </el-tab-pane>
              </el-tabs>
            </el-tab-pane>
          </el-tabs>
        </div>
        <!--    active:3    -->
        <div v-if="active === 2">
          <MonitorStategyView :ruleForm="ruleFormData" :otherList="synthesisList"></MonitorStategyView>
        </div>
      </div>
    </div>
    <el-button type="primary" v-show="active > 1" style="float: right;margin-top: 12px;margin-left: 10px;" @click="submit">提交</el-button>
    <el-button type="primary" v-show="active < 2" style="float: right;margin-top: 12px;" @click="next('1')">下一步</el-button>
    <el-button type="primary" v-show="active > 0" style="float: right;margin-top: 12px;" @click="next('-1')">上一步</el-button>
    <el-button type="primary" style="float: right;margin-top: 12px;" @click="goBack">返回</el-button>
  </div>
</template>

<script setup>
  import Form from '@/components/form/index.vue';
  import TableList from "@/components/table/index.vue"
  import MonitorStategyView from './view'
  import {addMonitorPolicy, updateMonitorPolicy,getMonitorTemp, getMonitorPolicy, getMonitorPolicyTemp, getResMonitorGroup} from "@/api/disRevenue/resource"
  export default {
    name: 'MonitorStategyDetails',
    components: {Form, TableList, MonitorStategyView},
    dicts: ['collection_cycle'],
    data() {
      return {
        active: 0,
        activeNames: [0, 1,2,3,4],
        linuxActiveName: 'first',
        hwActiveName: 'first',
        resourceType: '',
        checkAllParams: {},
        checkParams: {week: '',cpu: [], other: [], mount: [], netPort:[]},
        allSelectedData: {},
        synthesisList: {},
        tempContent: {},
        // 第一节点
        ruleFormData: {},
        config: {
          buttonGroup: []
        },
        policyTemp: {},
        formList: [],
        paramsList: [],
        // 第二节点 1栏
        option: [],
        linuxSystem: {
          monitorItem: [
            {firstTitle: 'Linux系统', secondTitle: '监控项', title: 'CPU监控', modelName: 'cpu',time: '', checkList: []},
            {firstTitle: 'Linux系统', secondTitle: '监控项', title: '其他监控', modelName: 'other', checkList: []}
          ],
          autodiscoverItem: [
            {firstTitle: 'Linux系统', secondTitle: '自动发现项', title: '发现挂载文件系统', modelName: 'vfs', time: '', checkList: []},
            {firstTitle: 'Linux系统', secondTitle: '自动发现项', title: '发现网络接口', modelName: 'net', time: '300', checkList: []},
            {firstTitle: 'Linux系统', secondTitle: '自动发现项', title: '发现硬盘设备', modelName: 'disk', time: '', checkList: []},
            {firstTitle: 'Linux系统', secondTitle: '自动发现项', title: '发现docker', modelName: 'docker', time: '', checkList: []}
          ],
        },
        // 第二节点 2栏 列显隐信息
        monitorTable: {
          nodeOne: [{firstTitle: '华为交换机', secondTitle: '监控项', modelName: 'switchOther', checkList: []}],
          nodeTow: [
            {firstTitle: '华为交换机', secondTitle: '自动发现项', title: '网络端口发现', modelName: 'switchNet', time: '300', checkList: []},
            {firstTitle: '华为交换机', secondTitle: '自动发现项',title: '光模块发现', modelName: 'switchModule', time: '', checkList: []},
            {firstTitle: '华为交换机', secondTitle: '自动发现项',title: 'MPU发现', modelName: 'switchMpu', time: '', checkList: []},
            {firstTitle: '华为交换机', secondTitle: '自动发现项',title: '电源发现', modelName: 'switchPwr', time: '', checkList: []},
            {firstTitle: '华为交换机', secondTitle: '自动发现项',title: '风扇发现', modelName: 'switchFan', time: '', checkList: []},
        ]},
      }
    },
    created() {
      this.option = this.dict.type.collection_cycle;
      this.paramsData = this.$route && this.$route.query;
      // console.log('paramsData===',this.paramsData);
      if (this.paramsData && this.paramsData.id) {
        this.getFormDataList(this.paramsData.id);
      }
      this.fnFormList();
      this.fnResMonitorGroup();
      this.fnMonitorPolicyTemp();
    },
    methods: {
      fnFormList(){
        this.formList = [{
          config: {title: ''},
          controls: {
            id: {label: 'ID',hidden: true},
            policyName: {label: '策略名称', span: 12, type: 'input', style: 'display: block;margin: 0 auto;', required: true},
            description: {label: '描述', span: 12, type: 'textarea', style: 'display: block;margin: 0 auto;'},
            templateId: {label: '关联监控模版', span: 12, type: 'select', required: true, options: [], eventName: 'change', style: 'display: block;margin: 0 auto;'},
            resourceGroupId: {label: '关联资源组', span: 12, type: 'select', required: true, options:[]}
          }
        }];
      },
      // 资源组
      fnResMonitorGroup(){
        getResMonitorGroup().then(res => {
          if (res && res.data) {
            this.formList[0].controls['resourceGroupId']['options']= res && res.data.map(item => {
              return Object.assign({label: item.groupName, value: item.id});
            });
          }
        });
      },
      // 监控模版
      fnMonitorPolicyTemp(){
        getMonitorPolicyTemp().then(res => {
          if (res && res.data) {
            this.policyTemp = {};
            this.formList[0].controls['templateId']['options']= res && res.data.map(item => {
                this.policyTemp[item.id] = item;
              return Object.assign({label: item.templateName, value: item.id});
            });
          }
        });
      },
      // 获取详情
      getFormDataList(id) {
        this.tempContent = {};
        getMonitorPolicy(id).then(val => {
          if (val && val.data) {
            this.ruleFormData = val.data.policy;
            this.resourceType = val.data.resourceType;
            this.tempContent[val.data.resourceType] = val.data[val.data.resourceType];
          }
        }).catch(() => {
          // this.$modal.msgError("操作失败")
        });
      },
      // 通过监控模版选项 查询监控策略展示项
      fnGetMonitorTempList(id) {
        getMonitorTemp(id).then(res => {
          if (res && res.data) {
            if (this.resourceType === 'linux') {
              // cpu 详情
              this.linuxSystem.monitorItem[0].checkList = res.data && res.data['linux'] && res.data['linux'].cpu || [];
              if (this.tempContent['linux'] && this.tempContent['linux'].cpu && this.tempContent['linux'].cpu.length > 0) {
                if (this.tempContent['linux'].cpu[0] && this.tempContent['linux'].cpu[0].collectionCycle) {
                  this.linuxSystem.monitorItem[0].time = this.tempContent['linux'].cpu[0].collectionCycle.toString();
                  this.handleCheckedCitiesChange(this.linuxSystem.monitorItem[0].time, this.linuxSystem.monitorItem[0]);
                }
              }
              // other
              if (this.tempContent['linux'] && this.tempContent['linux'].other && this.tempContent['linux'].other.length > 0) {
                this.tempContent['linux'].other.forEach(item => {
                  if (item && item.collectionCycle) {
                    item.time = item.collectionCycle.toString();
                  }
                });
                this.linuxSystem.monitorItem[1].checkList = this.tempContent['linux'].other;
                this.handleCheckedCitiesChange(null, this.linuxSystem.monitorItem[1]);
              } else {
                this.linuxSystem.monitorItem[1].checkList = res.data && res.data['linux'] && res.data['linux'].other || [];
              }
              // 自动发现项
              let linuxArr = [];
              // 1
              if (res.data && res.data['linux'] && res.data['linux'].vfs && res.data['linux'].vfs.length > 0) {
                this.linuxSystem.autodiscoverItem[0].checkList = res.data && res.data['linux'] && res.data['linux'].vfs;
                // 详情
                if (this.tempContent['linux'] && this.tempContent['linux'].vfs && this.tempContent['linux'].vfs.length > 0) {
                  if (this.tempContent['linux'].vfs[0] && this.tempContent['linux'].vfs[0].collectionCycle) {
                    this.linuxSystem.autodiscoverItem[0].time = this.tempContent['linux'].vfs[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.linuxSystem.autodiscoverItem[0].time, this.linuxSystem.autodiscoverItem[0]);
                  }
                }
                linuxArr.push(this.linuxSystem.autodiscoverItem[0]);
              }
              // 2
              if (res.data && res.data['linux'] && res.data['linux'].net && res.data['linux'].net.length > 0) {
                this.linuxSystem.autodiscoverItem[1].checkList = res.data && res.data['linux'] && res.data['linux'].net;
                linuxArr.push(this.linuxSystem.autodiscoverItem[1]);
                // 带有默认时间的情况下，调用指定方法进行存储
                if (this.linuxSystem.autodiscoverItem[1].time) {
                  this.handleCheckedCitiesChange(this.linuxSystem.autodiscoverItem[1].time, this.linuxSystem.autodiscoverItem[1]);
                }
              }
              // 3
              if (res.data && res.data['linux'] && res.data['linux'].disk && res.data['linux'].disk.length > 0) {
                this.linuxSystem.autodiscoverItem[2].checkList = res.data && res.data['linux'] && res.data['linux'].disk;
                if (this.tempContent['linux'] && this.tempContent['linux'].disk && this.tempContent['linux'].disk.length > 0) {
                  if (this.tempContent['linux'].disk[0] && this.tempContent['linux'].disk[0].collectionCycle) {
                    this.linuxSystem.autodiscoverItem[2].time = this.tempContent['linux'].disk[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.linuxSystem.autodiscoverItem[2].time, this.linuxSystem.autodiscoverItem[2]);
                  }
                }
                linuxArr.push(this.linuxSystem.autodiscoverItem[2]);
              }
              // 4
              if (res.data && res.data['linux'] && res.data['linux'].docker && res.data['linux'].docker.length > 0) {
                this.linuxSystem.autodiscoverItem[3].checkList = res.data && res.data['linux'] && res.data['linux'].docker;
                if (this.tempContent['linux'] && this.tempContent['linux'].docker && this.tempContent['linux'].docker.length > 0) {
                  if (this.tempContent['linux'].docker[0] && this.tempContent['linux'].docker[0].collectionCycle) {
                    this.linuxSystem.autodiscoverItem[3].time = this.tempContent['linux'].docker[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.linuxSystem.autodiscoverItem[3].time, this.linuxSystem.autodiscoverItem[3]);
                  }
                }
                linuxArr.push(this.linuxSystem.autodiscoverItem[3]);
              }
              this.linuxSystem.autodiscoverItem = linuxArr;
            } else {
              // one
              if (res.data && res.data['switch'] && res.data['switch'].switchOther && res.data['switch'].switchOther.length > 0) {
                if (this.tempContent['switch'] && this.tempContent['switch'].switchOther && this.tempContent['switch'].switchOther.length > 0) {
                  this.tempContent['switch'].switchOther.forEach(item => {
                    if (item && item.collectionCycle) {
                      item.time = item.collectionCycle.toString();
                    }
                  });
                  this.monitorTable.nodeOne[0].checkList = this.tempContent['switch'].switchOther;
                  this.handleCheckedCitiesChange(null, this.monitorTable.nodeOne[0]);
                } else {
                  this.monitorTable.nodeOne[0].checkList = res.data && res.data['switch'] && res.data['switch'].switchOther || [];
                }
              }
              let newArr = [];
              // tow-1
              if (res.data && res.data['switch'] && res.data['switch'].switchNet && res.data['switch'].switchNet.length > 0) {
                this.monitorTable.nodeTow[0].checkList = res.data && res.data['switch'] && res.data['switch'].switchNet;
                if (this.tempContent['switch'] && this.tempContent['switch'].switchNet && this.tempContent['switch'].switchNet.length > 0) {
                  if (this.tempContent['switch'].switchNet[0] && this.tempContent['switch'].switchNet[0].collectionCycle) {
                    this.monitorTable.nodeTow[0].time = this.tempContent['switch'].switchNet[0].collectionCycle.toString();
                  }
                }
                newArr.push(this.monitorTable.nodeTow[0]);
                if (this.monitorTable.nodeTow[0].time) {
                  this.handleCheckedCitiesChange(this.monitorTable.nodeTow[0].time, this.monitorTable.nodeTow[0]);
                }
              }
              // tow-2
              if (res.data && res.data['switch'] && res.data['switch'].switchModule && res.data['switch'].switchModule.length > 0) {
                this.monitorTable.nodeTow[1].checkList = res.data && res.data['switch'] && res.data['switch'].switchModule;
                if (this.tempContent['switch'] && this.tempContent['switch'].switchModule && this.tempContent['switch'].switchModule.length > 0) {
                  if (this.tempContent['switch'].switchModule[0] && this.tempContent['switch'].switchModule[0].collectionCycle) {
                    this.monitorTable.nodeTow[1].time = this.tempContent['switch'].switchModule[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.monitorTable.nodeTow[1].time, this.monitorTable.nodeTow[1]);
                  }
                }
                newArr.push(this.monitorTable.nodeTow[1]);
              }
              // tow-3
              if (res.data && res.data['switch'] && res.data['switch'].switchMpu && res.data['switch'].switchMpu.length > 0) {
                this.monitorTable.nodeTow[2].checkList = res.data && res.data['switch'] && res.data['switch'].switchMpu;
                if (this.tempContent['switch'] && this.tempContent['switch'].switchMpu && this.tempContent['switch'].switchMpu.length > 0) {
                  if (this.tempContent['switch'].switchMpu[0] && this.tempContent['switch'].switchMpu[0].collectionCycle) {
                    this.monitorTable.nodeTow[2].time = this.tempContent['switch'].switchMpu[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.monitorTable.nodeTow[2].time, this.monitorTable.nodeTow[2]);
                  }
                }
                newArr.push(this.monitorTable.nodeTow[2]);
              }
              // tow-4
              if (res.data && res.data['switch'] && res.data['switch'].switchPwr && res.data['switch'].switchPwr.length > 0) {
                this.monitorTable.nodeTow[3].checkList = res.data && res.data['switch'] && res.data['switch'].switchPwr;
                if (this.tempContent['switch'] && this.tempContent['switch'].switchPwr && this.tempContent['switch'].switchPwr.length > 0) {
                  if (this.tempContent['switch'].switchPwr[0] && this.tempContent['switch'].switchPwr[0].collectionCycle) {
                    this.monitorTable.nodeTow[3].time = this.tempContent['switch'].switchPwr[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.monitorTable.nodeTow[3].time, this.monitorTable.nodeTow[3]);
                  }
                }
                newArr.push(this.monitorTable.nodeTow[3]);
              }
              // tow-5
              if (res.data && res.data['switch'] && res.data['switch'].switchFan && res.data['switch'].switchFan.length > 0) {
                this.monitorTable.nodeTow[4].checkList = res.data && res.data['switch'] && res.data['switch'].switchFan;
                if (this.tempContent['switch'] && this.tempContent['switch'].switchFan && this.tempContent['switch'].switchFan.length > 0) {
                  if (this.tempContent['switch'].switchFan[0] && this.tempContent['switch'].switchFan[0].collectionCycle) {
                    this.monitorTable.nodeTow[4].time = this.tempContent['switch'].switchFan[0].collectionCycle.toString();
                    this.handleCheckedCitiesChange(this.monitorTable.nodeTow[4].time, this.monitorTable.nodeTow[4]);
                  }
                }
                newArr.push(this.monitorTable.nodeTow[4]);
              }
              this.monitorTable.nodeTow = newArr;
            }
          }
        });
      },
      async next(num) {
        if (num === '-1') {
          this.active--;
        } else {
          if (this.active === 0) {
            if (!await this.fnFormValid()) {
              return;
            } else {
              this.dataProcess();
              this.fnGetMonitorTempList(this.ruleFormData.templateId);
            }
          }
          if (this.active === 1) {
            this.selectAllChange();
          }
          this.active++;
        }
      },
      // 数据处理
      dataProcess() {
        let typeVal = {};
        if (this.resourceType === 'linux') {
          typeVal = this.linuxSystem;
        } else {
          typeVal = this.monitorTable;
        }
        Object.keys(typeVal).forEach(res => {
          typeVal[res].forEach(item => {
            this.checkParams[item.modelName] = [];
            this.checkAllParams[item.modelName] = {
              firstTitle: item.firstTitle,
              secondTitle: item.secondTitle,
              lastTitle: item.title,
              data: []
            };
          });
        })
      },
      // form验证
      fnFormValid() {
        return new Promise((resolve) => {
          this.ruleFormData = {};
          const formValid = this.$refs.formRef.$refs.ruleForm;
          // 3. 操作form（如验证）
          formValid.validate((valid) => {
            if (valid) {
              this.ruleFormData = formValid.model;
              resolve(true);
            } else {
              resolve(false);
            }
          });
        });
      },
      // 点击下一步，获取多个table列表中所选中的行数据
      selectAllChange () {
        let obj = {};
        this.option.forEach(item => {
          obj[item.value] = item.label;
        });
        this.paramsList = [];
        Object.keys(this.checkAllParams).forEach(item => {
          if (this.checkAllParams[item].data && this.checkAllParams[item].data.length > 0) {
            if (this.checkAllParams[item].time) {
              this.checkAllParams[item]['timeLabel'] = obj[this.checkAllParams[item].time];
              // 摘取数据 {id: '', collectionCycle: ''}
              this.checkAllParams[item].data.forEach(val => {
                this.paramsList.push({id: val.id,collectionCycle: this.checkAllParams[item].time});
              });
            } else {
              let lastTimeList = [];
              this.checkAllParams[item].data.forEach(val => {
                if (val && val.time) {
                  val['timeLabel'] = obj[val.time];
                  lastTimeList.push(val);
                  this.paramsList.push({id: val.id,collectionCycle: val.time});
                }
              });
              this.checkAllParams[item].data = lastTimeList;
            }
          }
        });
        this.synthesisList = Object.assign({}, this.checkAllParams);
      },
      // 单个选择按钮
      handleCheckedCitiesChange(changeVal,iteListAll) {
        if ('time' in iteListAll) {
          if (changeVal) {
            this.checkAllParams[iteListAll.modelName]['time'] = iteListAll && iteListAll.time;
            this.checkAllParams[iteListAll.modelName].data = iteListAll['checkList'];
          } else {
            delete this.checkAllParams[iteListAll.modelName];
          }
        } else {
          this.checkAllParams[iteListAll.modelName].data = iteListAll['checkList'];
        }
      },
      // 提交
      submit() {
        let params = Object.assign(this.ruleFormData, {resourceType: this.resourceType}, {collectionAndIdList: this.paramsList});
        let fnType = addMonitorPolicy;
        if (this.paramsData && this.paramsData.id) {
          fnType = updateMonitorPolicy;
        }
        this.$modal.loading();
        fnType(params).then(response => {
          this.$modal.msgSuccess(response.msg);
          this.$router.push("/resource/monitorStategy");
          this.$modal.closeLoading();
        }).catch(error => {
          this.$modal.closeLoading();
        });
      },
      // 返回
      goBack() {
        this.$router.push({path:'/resource/monitorStategy'});
      },
      // 监听事件
      callback(result, dataVal, formVal) {
        if (result && result.fnCode) {
          switch (result.fnCode) {
            case 'templateId':
              if (dataVal) {
                this.resourceType = this.policyTemp[dataVal].resourceType;
              }
              break;
            default:
          }
        }
      }
    }
  }
</script>
<style scoped>
  ::v-deep .el-collapse-item__header {
    background-color: #d4e3fc!important;
    /*color: #fff!important;*/
    padding-left: 20px;
    font-size: 1rem;
  }
  ::v-deep #selDisabled{
    color: #303133!important;
  }
</style>
