<route lang="yaml">
  name: qualityRules
</route>

<script lang="ts" setup name="qualityRules">
import { ref } from 'vue'
import { ElMessage, ElMessageBox } from "element-plus";
import Tree from "@/components/Tree/index.vue";
import TableTools from '@/components/Tools/table_tools.vue'
import Table from "@/components/Table/index.vue";
import Dialog from '@/components/Dialog/index.vue'
import { useRouter } from "vue-router";
import useCatchStore from "@/store/modules/catch";
import {
  getQualityTreeData,
  getQualityGroupData,
  deleteGroup,
  updateQualityGroup,
  addQualityGroup,
  getQualityTable,
  deleteQualityTable,
  getQualityTableRule,
  deleteQualityTableRule,
  updateRuleBizState,
  getDatabase,
  getRuleTypeList
} from '@/api/modules/dataQuality';
import { getDamCatalogList } from '@/api/modules/dataPricing';
import useDataQualityStore from "@/store/modules/dataQuality";
import { useValidator } from '@/hooks/useValidator';
import { TableColumnWidth } from '@/utils/enum';

const dataQualityStore = useDataQualityStore();
const userData = JSON.parse(localStorage.userData);
const { proxy } = getCurrentInstance() as any;
const { orderNum, description } = useValidator();

const router = useRouter();
const cacheStore = useCatchStore();
/** 可选择的质量规则列表。 */
const ruleTypeList: any = ref([]);

const productList: any = ref([]);

/** 质量规则集表对象。 */
const qualityModelTreeRef = ref();
/** 树选中不同层级的，代表的类型， model, group, table */
const treeType = ref('model')
const treeData = ref([
  {
    guid: '1',
    name: "数据质量规则集",
    type: 0,
    children: [],
  }
])

const getQualityGroupTreePromise: any = ref(null);

/** 展示质量规则集，分组树形结构数据。 */
const getQualityGroupTreeData = (groupGuid?: string) => {
  treeInfo.value.loading = true;
  return getQualityGroupTreePromise.value = getQualityTreeData(groupGuid ? groupGuid : null).then((res: any) => {
    treeInfo.value.loading = false;
    getQualityGroupTreePromise.value = null;
    if (res.code == proxy.$passCode) {
      //return res.data || [];
      treeData.value[0].children = res.data || []
    } else {
      ElMessage({
        type: 'error',
        message: res.msg,
      })
    }
  })
}

/** 质量模型树形信息。 */
const treeInfo = ref({
  id: "data-quality-tree",
  filter: true,
  loading: false,
  //  expandOnNodeClick: false, // 定位会由于未展开而失败。
  queryValue: "",
  queryPlaceholder: "输入名称搜索",
  props: {
    value: 'guid',
    label: 'name',
    isLeaf: 'isLeaf'
  },
  prefix: {
    type: 'prefixIcon'
  },
  nodeKey: 'guid',
  lazy: false, // 方便实现搜索，改为直接全部加载。
  expandedKey: ['1'],
  currentNodeKey: '1',
  data: treeData.value
});

/** 指定分组下展示的质检表，表格搜索时下拉选择的数据源。 */
const databaseList: any = ref([]);

/** 指定分组下展示的质检表，上方搜索项配置。 */
const tableSearchItemList = ref([
  {
    type: 'select',
    label: '',
    field: 'dataSourceGuid',
    default: '',
    placeholder: '数据源',
    props: {
      label: 'databaseNameZh',
      value: 'guid'
    },
    options: databaseList.value,
    clearable: true,
    visible: true
  }, {
    type: 'input',
    label: '',
    field: 'modelName',
    maxlength: 50,
    default: '',
    placeholder: '表名',
    clearable: true,
    visible: true
  }
])

/** 指定质检表展示的规则列表，上方搜索项配置。 */
const searchItemList = ref([
  {
    type: 'input',
    label: '',
    field: 'ruleName',
    default: '',
    maxlength: 50,
    placeholder: '规则名称',
    clearable: true,
    visible: true
  }, {
    type: 'select',
    label: '',
    field: 'ruleField',
    default: '',
    placeholder: '规则字段',
    options: [
      { label: '字段1', value: '1' },
      { label: '字段2', value: '2' },
    ],
    clearable: true,
    visible: false, //徐鹏接口未支持，数据量较少，没必要做。
  }, {
    type: 'select',
    label: '',
    field: 'ruleCode',
    default: '',
    placeholder: '规则类型',
    options: ruleTypeList.value,
    props: {
      value: 'ruleCode',
      label: 'ruleName'
    },
    clearable: true,
    visible: true
  }
])

const page = ref({
  limit: 50,
  curr: 1,
  sizes: [
    { label: "10", value: 10 },
    { label: "50", value: 50 },
    { label: "100", value: 100 },
    { label: "150", value: 150 },
    { label: "200", value: 200 },
  ],
  modelGroupGuid: '',
  dataSourceGuid: '',
  modelName: ''
});

/** 当前分组列表数据勾选选中的行，用于批量删除。 */
const tableSelectRowData: any = ref([]);
const tableInfo = ref({
  id: 'quality-table',
  multiple: true,
  loading: false,
  fields: [
    { label: "序号", type: "index", width: TableColumnWidth.INDEX, align: "center" },
    { label: "表名", field: "name", width: 150, type: 'text_btn', value: 'view', columClass: 'text_btn' },
    { label: "表英文名", field: "subjectName", width: 160 },
    { label: "数据源", field: "databaseName", width: 160 },
    { label: "规则数量", field: "ruleNum", width: 90, align: 'right' },
    { label: "修改人", field: "updateUserName", width: TableColumnWidth.USERNAME },
    { label: "修改时间", field: "updateTime", width: TableColumnWidth.DATETIME, },
  ],
  data: [],
  page: {
    type: "normal",
    rows: 0,
    ...page.value,
  },
  actionInfo: {
    label: "操作",
    type: "btn",
    width: 215,
    btns: [
      { label: "新建规则", value: "create" },
      { label: "删除", value: "delete" },
      { label: "查看表目录", value: "locateDataCatalog" },
    ],
  }
});

const groupPage = ref({
  limit: 50,
  curr: 1,
  sizes: [
    { label: "10", value: 10 },
    { label: "50", value: 50 },
    { label: "100", value: 100 },
    { label: "150", value: 150 },
    { label: "200", value: 200 },
  ],
});
const groupSelectRowData = ref([]);
const groupTableInfo = ref({
  id: 'group-table',
  //multiple: true,
  loading: false,
  fields: [
    { label: "序号", type: "index", width: TableColumnWidth.INDEX, align: "center", fixed: "left" },
    { label: "分组名称", field: "name", width: 150, type: 'text_btn', value: 'locate', columClass: 'text_btn' },
    { label: "排序", field: 'orderNum', width: TableColumnWidth.INDEX, align: "center" },
    { label: "质检表数量", field: "qualityModelNum", width: 120, align: 'right' },
    {
      label: "生效/总规则数", field: "ruleNum", width: 120, align: 'right', getName: (scope) => {
        let row = scope.row;
        return `${row.effectRuleNum}/${row.ruleNum}`;
      }
    },
    { label: "修改人", field: "updateUserName", width: TableColumnWidth.USERNAME },
    { label: "修改时间", field: "updateTime", width: TableColumnWidth.DATETIME, },
    { label: "描述", field: "description", width: TableColumnWidth.DESCRIPTION }
  ],
  data: [],
  page: {
    type: "normal",
    rows: 0,
    ...groupPage.value,
  },
  actionInfo: {
    label: "操作",
    type: "btn",
    width: 92,
    btns: (scope) => {
      return [
      { label: "编辑", value: "edit", disabled: scope.row.dataSource != '5' },
      { label: "删除", value: "delete", disabled: scope.row.dataSource != '5' },
    ]
    },
  }
});

const formItems: any = ref([
  {
    label: '分组名称',
    type: 'input',
    placeholder: '请输入',
    field: 'name',
    default: '',
    maxlength: 50,
    required: true
  },
  {
    label: '排序',
    type: 'input',
    placeholder: '由数字组成',
    field: 'orderNum',
    inputType: 'integerNumber',
    default: '',
    maxlength: 6,
    required: true
  },
  {
    label: '数据产品',
    type: 'select',
    field: 'damGuid',
    default: '',
    placeholder: '请选择',
    options: productList.value,
    props: {
      value: 'guid',
      label: 'damName'
    },
    clearable: true,
    filterable: true
  },
  {
    label: '描述',
    type: 'textarea',
    placeholder: '请输入',
    field: 'description',
    default: '',
    block: true,
    required: false,
  },
])

const formRules = ref({
  name: [
    { required: true, trigger: 'blur', message: "请填写分组名称" }
  ],
  orderNum: [orderNum()],
  description: [description()]
});

/** 新建分组对话框。 */
const dialogInfo = ref({
  visible: false,
  size: 700,
  direction: "column",
  header: {
    title: "",
  },
  type: '',
  contents: [
    {
      type: 'form',
      title: '',
      formInfo: {
        id: 'add-staff-form',
        items: formItems.value,
        rules: formRules.value
      }
    }
  ],
  footer: {
    btns: [
      { type: "default", label: "取消", value: "cancel" },
      { type: "primary", label: "确定", value: "submit" },
    ],
  },
});

/** 根据树形选择的第一层级显示对应的分组数据，用表格分页展示。 */
const getGroupTableData = () => {
  groupTableInfo.value.loading = true;
  getQualityGroupData({ pageIndex: groupPage.value.curr, pageSize: groupPage.value.limit }).then((res: any) => {
    groupTableInfo.value.loading = false;
    if (res.code == proxy.$passCode) {
      const data = res.data || {};
      groupTableInfo.value.data = data.records ?? [];
      groupTableInfo.value.page.curr = data.pageIndex;
      groupTableInfo.value.page.rows = data.totalRows;
    } else {
      ElMessage({
        type: 'error',
        message: res.msg,
      })
    }
  })
};

const getTableData = () => {
  tableInfo.value.loading = true;
  getQualityTable({ pageIndex: page.value.curr, pageSize: page.value.limit, modelGroupGuid: page.value.modelGroupGuid, dataSourceGuid: page.value.dataSourceGuid, name: page.value.modelName }).then((res: any) => {
    tableInfo.value.loading = false;
    if (res.code == proxy.$passCode) {
      const data = res.data || {};
      tableInfo.value.data = data.records ?? [];
      tableInfo.value.page.curr = data.pageIndex;
      tableInfo.value.page.rows = data.totalRows;
    } else {
      ElMessage.error(res.msg);
    }
  })
}

const getRuleTableData = () => {
  ruleTableInfo.value.loading = true;
  getQualityTableRule({ modelGuid: lastSelectNode.value.data.guid, ruleName: modelRulesSerchParams.value.ruleName, ruleCode: modelRulesSerchParams.value.ruleCode }).then((res: any) => {
    ruleTableInfo.value.loading = false;
    if (res.code == proxy.$passCode) {
      ruleTableInfo.value.data = res.data || [];
    } else {
      ElMessage.error(res.msg);
    }
  })
}

const tableSelectionChange = (val) => {
  tableSelectRowData.value = val;
};

const tablePageChange = (info) => {
  page.value.curr = Number(info.curr);
  page.value.limit = Number(info.limit);
  tableInfo.value.page.limit = page.value.limit;
  tableInfo.value.page.curr = page.value.curr;
  getTableData();
};

/** 当前选中的规则行，用于操作列按钮。 */
const currTableData: any = ref({});
const tableBtnClick = (scope, btn) => {
  const type = btn.value;
  const row = scope.row;
  currTableData.value = row;
  if (type == "view") {
    if (!qualityModelTreeRef.value) {
      return;
    }
    qualityModelTreeRef.value.setCurrentKey(row.guid, true);
  } else if (type == 'create') {
    router.push({
      name: 'ruleTemplate',
      query: {
        modelGuid: row.guid,
        name: row.name,
        dataSource: row.dataSource
      }
    });
  } else if (type == "delete") {
    open("此操作将永久删除, 是否继续?", "warning");
  } else if (type == 'locateDataCatalog') {
    // dataCatalogStore.setLocateSubjectName(row.name);
    // router.push({
    //   name: 'dataWarehouse'
    // });
    if (row.dataSource == '4') {
      router.push({
        name: 'classifyGradeCatalogue',
        query: {
          databaseGuid: row.dataSourceGuid,
          tableGuid: row.subjectGuid
        }
      });
    } else {
      router.push({
        name: 'metaSheet',
        query: {
          id: row.subjectGuid,
          name: row.name
        }
      });
    }
  }
};

const open = (msg, type, isBatch = false) => {
  ElMessageBox.confirm(msg, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: type,
  }).then(() => {
    let guids = [currTableData.value.guid]
    if (isBatch) {
      guids = tableSelectRowData.value.map(s => s.guid);
    }
    deleteQualityTable(guids).then((res: any) => {
      if (res.code == proxy.$passCode) {
        page.value.curr = 1;
        getTableData();
        getQualityGroupTreeData();
        nextTick(() => {
          let node = qualityModelTreeRef.value.treeRef.store.nodesMap[currTableData.value.modelGroupGuid];
         node.loaded = false;
         node.expand();
        })
        ElMessage.success('删除成功');
      } else {
        ElMessage.error(res.msg);
      }
    });
  });
};

const batchingDelete = () => {
  if (tableSelectRowData.value.length == 0) {
    ElMessage({
      type: 'error',
      message: '请选择需要删除的数据',
    })
    return
  }
  open("此操作将永久删除, 是否继续?", "warning", true);
};

const groupTableSelectionChange = (val) => {
  groupSelectRowData.value = val;
};

const groupTablePageChange = (info) => {
  groupPage.value.curr = Number(info.curr);
  groupPage.value.limit = Number(info.limit);
  groupTableInfo.value.page.limit = groupPage.value.limit;
  groupTableInfo.value.page.curr = groupPage.value.curr;
  getGroupTableData();
};

const currGroupTableData: any = ref({});
const groupTableBtnClick = (scope, btn) => {
  const type = btn.value;
  const row = scope.row;
  currGroupTableData.value = row;
  if (type == "edit") {
    dialogInfo.value.visible = true;
    dialogInfo.value.header.title = "编辑分组";
    dialogInfo.value.type = type
    formItems.value.map(item => {
      item.default = row[item.field];
    });
  } else if (type == "delete") {
    ElMessageBox.confirm('此操作将永久删除该分组，确认删除吗？', "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: type,
    }).then(() => {
      deleteGroup([row.guid]).then((res: any) => {
        if (res.code == proxy.$passCode) {
          groupPage.value.curr = 1;
          getGroupTableData();
          ElMessage({
            type: "success",
            message: "删除分组成功",
          });
          getQualityGroupTreeData();
        } else {
          ElMessage({
            type: "error",
            message: res.msg,
          });
        }
      });
    });
  } else if (type == 'locate') {
    qualityModelTreeRef.value.setCurrentKey(row.guid, true);
    let node = qualityModelTreeRef.value.treeRef.store.nodesMap[row.guid];
    node && node.expand();
  }
};

const ruleTableInfo = ref({
  id: 'rule-table',
  loading: false,
  fields: [
    { label: "规则名称", field: "ruleConfName", width: 150 },
    { label: "规则大类", field: "largeCategoryName", width: 120 },
    { label: "规则小类", field: "smallCategoryName", width: 140 },
    { label: "规则类型", field: "ruleName", width: 120 },
    { label: '状态', field: 'bizState', type: 'switch', activeText: '启用', inactiveText: '停用', activeValue: 'Y', inactiveValue: 'S', switchWidth: 56, width: 100, align: 'center' },
    { label: "字段", field: "ruleField", width: 160 },
    { label: "修改人", field: "updateUserName", width: TableColumnWidth.USERNAME },
    { label: "修改时间", field: "updateTime", width: TableColumnWidth.DATETIME, },
  ],
  data: [],
  showPage: false,
  actionInfo: {
    label: "操作",
    type: "btn",
    width: 100,
    btns: (scope) => {
      return [
        { label: "编辑", value: "edit" },
        { label: "删除", value: "delete" },
      ]
    }
  }
});

const ruleTableSwitchBeforeChange = (scope, field, callback) => {
  let stateName = scope.row[field] == 'Y' ? '停用' : '启用';
  const msg = `确定【${stateName}】该规则吗?`
  ElMessageBox.confirm(
    msg,
    '提示',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  ).then(() => {
    const state = scope.row[field] == 'Y' ? 'S' : 'Y';
    const result = ruleTableSwitchChange(state, scope, field)
    callback(result)
  }).catch(() => {
    callback(false)
  })
}

const ruleTableSwitchChange = (val, scope, field) => {
  return new Promise((resolve, reject) => {
    let params = {
      ruleConfGuid: scope.row.guid,
      bizState: val
    }
    updateRuleBizState(params).then((res: any) => {
      if (res.code == proxy.$passCode && res.data) {
        getRuleTableData();
        ElMessage({
          type: "success",
          message: `该规则 ${val == 'Y' ? '启用' : '停用'} 成功`,
        });
        resolve(true)
      } else {
        ElMessage({
          type: "error",
          message: res.msg,
        });
        getRuleTableData();
        reject(false)
      }
    }).catch(() => {
      getRuleTableData();
      reject(false)
    })
  })
}

const currTableRuleData: any = ref({});
const ruleTableBtnClick = (scope, btn) => {
  const type = btn.value;
  const row = scope.row;
  currTableRuleData.value = row;
  if (type == "edit") {
    router.push({
      name: 'ruleModelEdit',
      query: {
        guid: row.guid
      }
    });
  } else if (type == "delete") {
    ruleOpen("此操作将永久删除该质检规则, 是否继续?", "warning");
  }
};

const ruleOpen = (msg, type, isBatch = false) => {
  ElMessageBox.confirm(msg, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: type,
  }).then(() => {
    let guids = currTableRuleData.value.guid;
    deleteQualityTableRule(guids).then((res: any) => {
      if (res.code == proxy.$passCode) {
        getRuleTableData();
        let node = qualityModelTreeRef.value.treeRef.store.nodesMap[lastSelectNode.value.data.guid];
        node.loaded = false;
        node.expand();
        ElMessage.success('删除质检规则成功');
      } else {
        ElMessage.error(res.msg);
      }
    });
  });
};

/** 新建分组 */
const clickCreateGroup = () => {
  dialogInfo.value.visible = true;
  dialogInfo.value.header.title = "新建分组";
  dialogInfo.value.type = 'add';
  formItems.value.map(item => {
    if (item.field === 'orderNum') {
      item.default = null;
    } else if(item.field === 'damGuid'){
      item.options = productList.value;
      item.default = '';
    } else {
      item.default = "";
    }
  });
}

/** 新建质检表 */
const clickCreateTable = () => {
  router.push({
    name: 'ruleModel',
    query: {
      groupGuid: page.value.modelGroupGuid,
      name: lastSelectNode.value.data.name,
      dataSource: lastSelectNode.value.data.dataSource
    }
  });
}

/** 新建规则 */
const clickCreateRule = () => {
  router.push({
    name: 'ruleTemplate',
    query: {
      modelGuid: lastSelectNode.value.data.guid,
      name: lastSelectNode.value.data.name,
      dataSource: lastSelectNode.value.parent.data.dataSource
    }
  });
}

/** 跳转配置质量评估方案页面。 */
const configPlan = () => {
  if (lastSelectNode.value.data.type == 1) {//按照分组配置评估方案。
    router.push({
      name: 'assessTemplate',
      query: {
        groupGuid: lastSelectNode.value.data.guid
      }
    });
  } else {
    router.push({
      name: 'assessTemplate',
      query: {
        modelGuid: lastSelectNode.value.data.guid,
        groupGuid: lastSelectNode.value.parent.data.guid
      }
    });
  }
}

const toPath = (url) => {
  router.push({
    path: url,
  });
}

const lastSelectNode: any = ref({});

const modelRulesSerchParams = ref({
  ruleName: '',
  ruleCode: '',
  ruleField: ''
});

const handleNodeSelectChange = (node) => {
  console.log(node);
  let data = node.data;
  lastSelectNode.value = node;
  if (node.level === 1) {
    treeType.value = 'model';
    groupPage.value.curr = 1;
    getGroupTableData();
  } else if (node.level === 2) {
    treeType.value = 'group';
    page.value.curr = 1;
    page.value.modelGroupGuid = data.guid;
    toTableSearch(groupTableTools.value?.toolSearch?.formInline || {}, false);
  } else if (node.level === 3) {
    treeType.value = 'table';
    toRuleSearch(ruleTableTools.value?.toolSearch?.formInline || {}, false);
  }

}

const groupTableTools: any = ref(null);

const toTableSearch = (val, clear) => {
  page.value.curr = 1;
  if (clear) {
    page.value.modelName = '';
    page.value.dataSourceGuid = '';
    getTableData();
    return;
  }
  page.value.modelName = val.modelName;
  page.value.dataSourceGuid = val.dataSourceGuid;
  getTableData();
}

const ruleTableTools: any = ref(null);
const toRuleSearch = (val, clear) => {
  if (clear) {
    modelRulesSerchParams.value = {
      ruleName: '',
      ruleCode: '',
      ruleField: ''
    };
  } else {
    modelRulesSerchParams.value = val;
  }
  getRuleTableData();
}

let submitPromise: any = ref(null);
let editSubmitPromise: any = ref(null);

/** 新建分组对话框确定。 */
const dialogBtnClick = (btn, info) => {
  if (btn.value == 'submit') {
    info.dataSource = '5';
    if (dialogInfo.value.type == 'add') {
      if (submitPromise.value) {
        return;
      }
      submitPromise.value = addQualityGroup(info).then((res: any) => {
        submitPromise.value = null;
        if (res.code == proxy.$passCode) {
          groupPage.value.curr = 1;
          getGroupTableData();
          getQualityGroupTreeData();
          ElMessage({
            type: 'success',
            message: '新建分组成功'
          })
          dialogInfo.value.visible = false;
        } else {
          ElMessage({
            type: 'error',
            message: res.msg,
          })
        }
      })
    } else {
      const params = { ...info };
      params.guid = currGroupTableData.value.guid;
      if (editSubmitPromise.value) {
        return;
      }
      editSubmitPromise.value = updateQualityGroup(params).then((res: any) => {
        editSubmitPromise.value = null;
        if (res.code == proxy.$passCode) {
          getGroupTableData();
          ElMessage({
            type: 'success',
            message: '编辑分组成功'
          })
          getQualityGroupTreeData();
          dialogInfo.value.visible = false;
        } else {
          ElMessage({
            type: 'error',
            message: res.msg,
          })
        }
      })
    }
  } else if (btn.value == 'cancel') {
    dialogInfo.value.visible = false;
  }
};

/** 导入按分组 */
const uploadDialog = () => {
  const info = {
    type: 'qualityModelGroup'
  }
  cacheStore.setCatch('uploadSetting', info)
  nextTick(() => {
    router.push({
      name: 'importFiles',
    });
  })
}

/** 导出按照分组。 */
const exportData = () => {
  if (groupSelectRowData.value.length == 0) {
    // const fieldTemplate = "/files/set.xlsx";
    // downFile(fieldTemplate, '标准集模板.xlsx')
  } else {
    // exportDataStandardSet(groupSelectRowData.value).then((res: any) => {
    //   download(res, '标准集.xls', 'excel')
    // });
  }
}

/** 导入质检规则 */
const ruleUploadDialog = () => {
  const info = {
    type: 'qualityRule'
  }
  cacheStore.setCatch('uploadSetting', info)
  nextTick(() => {
    router.push({
      name: 'importFiles',
    });
  })
}

/** 导出质检规则。 */
const ruleExportData = () => {
  if (groupSelectRowData.value.length == 0) {
    // const fieldTemplate = "/files/set.xlsx";
    // downFile(fieldTemplate, '标准集模板.xlsx')
  } else {
    // exportDataStandardSet(groupSelectRowData.value).then((res: any) => {
    //   download(res, '标准集.xls', 'excel')
    // });
  }
}

const getDatabaseList = () => {
  getDatabase({ connectStatus: 1 }).then((res: any) => {
    databaseList.value = [];
    if (res.code == proxy.$passCode) {
      databaseList.value = res.data || [];
      tableSearchItemList.value[0].options = databaseList.value;
    }
  })
};

onActivated(async () => {
  if (dataQualityStore.modelGroupGuid) {
    await nextTick();
    if (getQualityGroupTreePromise.value) {
      getQualityGroupTreePromise.value.then(() => {
        qualityModelTreeRef.value.setCurrentKey(dataQualityStore.modelGroupGuid);
        if (lastSelectNode.value && lastSelectNode.value.data.guid == dataQualityStore.modelGroupGuid) {
          getTableData();
        }
        // let node = qualityModelTreeRef.value.treeRef.store.nodesMap[dataQualityStore.modelGroupGuid];
        // node?.expand();
        getQualityGroupTreeData();
        dataQualityStore.set(null);
      });
    } else {
      qualityModelTreeRef.value.setCurrentKey(dataQualityStore.modelGroupGuid);
      if (lastSelectNode.value && lastSelectNode.value.data.guid == dataQualityStore.modelGroupGuid) {
        getTableData();
      }
      getQualityGroupTreeData();
      nextTick(() => {
        let node = qualityModelTreeRef.value.treeRef.store.nodesMap[dataQualityStore.modelGroupGuid];
        node.expand();
      })
      dataQualityStore.set(null);
    }
  }
  if (dataQualityStore.modelGuid) {
    if (lastSelectNode.value?.data && lastSelectNode.value.data.guid == dataQualityStore.modelGuid) {
      qualityModelTreeRef.value.setCurrentKey(dataQualityStore.modelGuid);
      getRuleTableData();
    } else {
      if (getQualityGroupTreePromise.value) {
        getQualityGroupTreePromise.value.then(() => {
          nextTick(() => {
            qualityModelTreeRef.value.setCurrentKey(dataQualityStore.modelGuid);
            dataQualityStore.setModelGuid(null);
          })
        })
      } else {
        nextTick(() => {
          qualityModelTreeRef.value.setCurrentKey(dataQualityStore.modelGuid);
          dataQualityStore.setModelGuid(null);
        })
      }
    }
  }
})

// 获取数据产品列表
const getProducts = () => {
  getDamCatalogList({ dataType: userData.superTubeFlag == 'Y' ? "P" : "D", sceneType: "Z" }).then((res: any) => {
    if (res.code == proxy.$passCode) {
      const data = res.data || [];
      productList.value = data;
    }
  })
}

onBeforeMount(() => {
  getQualityGroupTreeData();
  getGroupTableData();
  getDatabaseList();
  getRuleTypeList().then((res: any) => {
    if (res.code == proxy.$passCode) {
      ruleTypeList.value = res.data?.map((d: any) => {
        d.label = d.ruleName;
        d.value = d.ruleCode;
        return d;
      })?.filter(d => d.ruleCode != 'rows_check' && d.ruleCode != 'volatility_check' && d.ruleCode != 'ref_integrality') || [];
      searchItemList.value[2].options = ruleTypeList.value;
    } else {
      ElMessage.error(res.msg);
    }
  })
  getProducts();
})

</script>

<template>
  <div class="container_wrap flex">
    <div class="box_left aside_wrap">
      <div class="aside_title">质量规则集列表</div>
      <Tree ref="qualityModelTreeRef" :treeInfo="treeInfo" @nodeSelectChange="handleNodeSelectChange" />
    </div>
    <div class="box_right">
      <div class="table_tool_wrap">
        <TableTools ref="groupTableTools" v-if="treeType == 'group'" :init="false" :searchItems="tableSearchItemList"
          :searchId="'quality-table-search'" @search="toTableSearch" />
        <TableTools ref="ruleTableTools" v-if="treeType == 'table'" :init="false" :searchItems="searchItemList"
          :searchId="'table-rule-search'" @search="toRuleSearch" />
        <div class="tools_btns" v-if="treeType == 'model'">
          <el-button type="primary" @click="clickCreateGroup">新建分组</el-button>
          <!-- <el-button @click="uploadDialog">导入</el-button>
          <el-button @click="exportData">导出</el-button> -->
        </div>
        <div class="tools_btns" style="padding-bottom: 8px;" v-else-if="treeType == 'group'">
          <el-button type="primary" @click="clickCreateTable">新建质检表</el-button>
          <el-button @click="batchingDelete">批量删除</el-button>
          <el-button v-if="lastSelectNode?.data?.isHaveModel" @click="configPlan">配置评估方案</el-button>
          <!-- <el-button @click="ruleUploadDialog">导入</el-button>
          <el-button @click="ruleExportData">导出</el-button> -->
        </div>
        <div class="tools_btns" style="padding-bottom: 8px;" v-else>
          <el-button type="primary" @click="clickCreateRule">新建规则</el-button>
          <el-button @click="configPlan">配置评估方案</el-button>
        </div>
      </div>
      <div class="table_panel_wrap"
        :style="{ height: treeType === 'model' ? 'calc(100% - 44px)' : (treeType === 'table' ? 'calc(100% - 100px)' : 'calc(100% - 84px)') }">
        <Table v-if="treeType === 'model'" :tableInfo="groupTableInfo" @tableBtnClick="groupTableBtnClick"
          @tableSelectionChange="groupTableSelectionChange" @tablePageChange="groupTablePageChange" />
        <Table v-if="treeType === 'group'" :tableInfo="tableInfo" @tableBtnClick="tableBtnClick"
          @tableSelectionChange="tableSelectionChange" @tablePageChange="tablePageChange" />
        <Table v-if="treeType === 'table'" :tableInfo="ruleTableInfo" @tableBtnClick="ruleTableBtnClick"
          @tableSwitchBeforeChange="ruleTableSwitchBeforeChange" />
      </div>
    </div>

    <Dialog :dialogInfo="dialogInfo" @btnClick="dialogBtnClick" />
  </div>
</template>

<style lang="scss" scoped>
.container_wrap {
  padding: 0;
  display: flex;
  justify-content: space-between;

  .box_left {
    width: 200px;
    box-shadow: 1px 0 0 0 #d9d9d9;

    .tree_panel {
      height: calc(100% - 36px);
      padding-top: 0;

      :deep(.el-tree) {
        margin: 0;
        overflow: hidden auto;
      }
    }
  }

  .box_right {
    width: calc(100% - 200px);
    height: 100%;
    padding: 0 16px;
    overflow: hidden auto;
  }

  .panel_title {
    line-height: 40px;
    font-size: 16px;
    font-weight: 600;
    color: var(--el-color-regular);
  }
}

.table_tool_wrap {
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;

  .tools_btns {
    padding: 0;
  }
}

.table_panel_wrap {
  width: 100%;
  height: calc(100% - 84px);
}
</style>