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

<script lang="ts" setup name="qualityEvaluate">

import { ref } from 'vue';
import TableTools from "@/components/Tools/table_tools.vue";
import DialogApproval from '@/components/ApprovalProcess/dialog_approval.vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import {
  getQualityEvaList,
  getRegisteredList,
  saveQuality,
  qualityAllow,
  deleteQuality,
  updatQuality,
} from "@/api/modules/dataAsset";
import useUserStore from "@/store/modules/user";
import useDataAssetStore from "@/store/modules/dataAsset";
import {
  getStaffDetailInfo
} from "@/api/modules/queryService";
import { rejectFlowData, revokeFlowData, getCamundaDeploymentId, getProcessNodesPromise, isMyFirstNode, passFlowData } from "@/api/modules/workFlowService";

const assetStore = useDataAssetStore();

const router = useRouter();
const { proxy } = getCurrentInstance() as any;

const userStore = useUserStore();
const userData = JSON.parse(userStore.userData)

const systemApproveCurrentRowInfo: any = ref({})

const approvalDialogVisible = ref(false);

const handleApprovalDialogCancel = (reSubmit) => {
  approvalDialogVisible.value = false;
  if (reSubmit) {
    getTableData();
  }
}

/** 数据来源于该企业申请登记的数据资产已通过且剔除数据质量评价中已通过、审批中的资产。 */
const assetListData: any = ref([]);

const tableFields = ref([
  { label: "序号", type: "index", width: 56, align: "center" },
  { label: "资产名称", field: "daName", width: 160, align: "left", type: 'text_btn', value: 'productDetail', columClass: 'text_btn' },
  { label: "登记时间", field: "registerTime", width: 120 },
  //   { label: "企业名称", field: "tenantName", width: 240, align: "left" },
  { label: "评估机构", field: "evaluationAgencyName", width: 250, align: "left" },
  { label: "审批状态", field: "approveVO", type: "approveTag", width: 96, align: 'center' },
  {
    label: "主平台审批状态", field: "crossPlatformApproveState", type: "approveTagBtn", width: 150, align: 'center', btn: {
      label: '查看', visible: (scope) => {
        return scope.row.crossPlatformApproveState != null;
      }, click: (scope) => {
        systemApproveCurrentRowInfo.value = scope.row;
        approvalDialogVisible.value = true;
      }
    }
  },
]);

const deploymentId = ref('');

onMounted(() => {
});

onActivated(() => {
  getRegisteredList(1).then((res: any) => {
    if (res.code == proxy.$passCode) {
      assetListData.value = res.data || [];
      formItems.value[0].options = assetListData.value;
    } else {
      ElMessage.error(res.msg);
    }
  })
  if (assetStore.isRefresh) {//如果是首次加载，则不需要调用
    page.value.curr = 1;
    getTableData();
    assetStore.set(false);
  }
})

const searchItemList = ref([
  {
    type: "input",
    label: "",
    field: "daName",
    default: "",
    placeholder: "资产名称",
    clearable: true,
  },
  {
    type: 'select',
    label: '',
    field: 'approveState',
    default: '',
    placeholder: '全部状态',
    options: [
      { label: '审批中', value: 'A' },
      { label: '已通过', value: 'Y' },
      { label: '已驳回', value: 'R' },
      { label: '已撤销', value: 'C' }
    ],
    clearable: true
  },
]);

const toSearch = (val: any, clear: boolean = false) => {
  page.value.curr = 1;
  if (clear) {
    searchItemList.value.map((item) => (item.default = ""));
    page.value.daName = '';
    page.value.approveState = "";
  } else {
    page.value.daName = val.daName;
    page.value.approveState = val.approveState;
  }
  getTableData();
};

const getTableData = () => {
  tableInfo.value.loading = true;
  getQualityEvaList({
    pageSize: page.value.limit,
    pageIndex: page.value.curr,
    daName: page.value.daName,
    approveState: page.value.approveState,
    currentStaffGuid: userData.staffGuid
  }).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 || 0;
    } else {
      ElMessage.error(res.msg);
    }
  })
}

const handleCreate = () => {
  if (!assetListData.value.length) {
    ElMessage.warning('当前没有可发起质量评价的资产！');
    return;
  }
  formItems.value[0].visible = true;
  formItems.value[0].default = '';
  formItems.value[1].visible = true;
  formItems.value[1].default = [];
  dialogInfo.value.visible = true;
  dialogInfo.value.type = '';
  getCamundaDeploymentId('10018', userData.tenantGuid, userData.staffGuid).then((res: any) => {
    if (res.code == proxy.$passCode) {
      deploymentId.value = res.data;
    } else {
      deploymentId.value = '';
      proxy.$ElMessage.error(res.msg);
    }
  })
}

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 },
  ],
  daName: '',
  approveState: ''
});

const tableInfo = ref({
  id: 'asset-data-table',
  rowKey: 'guid',
  loading: false,
  fields: tableFields.value,
  data: [],
  page: {
    type: "normal",
    rows: 0,
    ...page.value,
  },
  actionInfo: {
    label: "操作",
    type: "btn",
    width: 175,
    btns: (scope) => {
      let row = scope.row;
      return getTableBtns(row);
    }
  }
});

const getTableBtns = (row) => {
  let btnsArr: any[] = [];
  const approveVO = row.approveVO || {};
  const approveState = row.approveVO.approveState || null;
  const approveStaffGuids = approveVO.approveStaffGuids || [];
  const staffGuid = approveVO.staffGuid || '';
  const bizApproveState = row.approveState;
  const currentStaffGuid = userData.staffGuid
  let isShowCancel = false;
  let flowState;
  if (approveState == 'N') {
    flowState = 1;
  }
  if (approveState == 'A' && approveStaffGuids.indexOf(currentStaffGuid) > -1) {
    flowState = 2;
  }
  if ((approveState == 'C' || approveState == 'R' || row.crossPlatformApproveState == 'E') && staffGuid == currentStaffGuid) {
    flowState = 3;
  }
  if (approveVO && approveVO.approveState == 'A' && staffGuid == currentStaffGuid) {
    isShowCancel = true;
  }
  if (flowState === 1) {
    btnsArr = [{ label: "删除", value: "del" }]
  }
  if (flowState === 2) {
    btnsArr = [{ label: "通过", value: "pass" }, { label: "驳回", value: "reject" }]
  }
  if (flowState === 3) {
    btnsArr.push({ label: "删除", value: "del" })
  }
  if (flowState === 3 && (bizApproveState != 'D' || row.crossPlatformApproveState == 'E')) {
    btnsArr.push({ label: "重新提交", value: "redit" })
  }
  if (isShowCancel) {
    btnsArr.push({ label: "撤销", value: "revoke" })
  }
  if (flowState !== 1) {
    btnsArr.push({ label: "详情", value: "detail" })
  }
  return btnsArr;
}

const currTableData: any = ref({});

let getFirstNodePromise: any = ref({});

const tableBtnClick = (scope, btn) => {
  const type = btn.value;
  const row = scope.row;
  currTableData.value = row;
  console.log(row, '-------');
  if (type == "redit") {
    dialogInfo.value.visible = true;
    dialogInfo.value.type = 'reSubmit';
    formItems.value[0].visible = false;
    formItems.value[0].default = row.registerGuid;
    formItems.value[1].default = row.qualityEvaluationFile || [];
  } else if (type == "del") {
    delTableOpen("此操作将永久删除该资产质量评价，是否继续?", "warning");
  } else if (type === 'reject') {
    rejectDialogInfo.value.visible = true;
  } else if (type === 'pass') {
    if (getFirstNodePromise.value[row.guid]) {
      return;
    }
    getFirstNodePromise.value[row.guid] = isMyFirstNode({
      deploymentId: row.approveVO.camundaDeploymentId,
      processInstanceId: row.approveVO.camundaInstanceId,
      staffGuid: userData.staffGuid
    }).then((res: any) => {
      getFirstNodePromise.value[row.guid] = null;
      if (res?.code == proxy.$passCode) {
        if (res.data) {
          passDialogInfo.value.visible = true;
          if (row.dataStartDate) {
            passFormItems.value[1].disabled = true;
            passFormItems.value[1].default = [row.dataStartDate, row.dataEndDate];
          } else {
            passFormItems.value[1].disabled = false;
            passFormItems.value[1].default = null;
          }
          passFormItems.value[2].placeholder = `本次评估数据资产总体质量得分为**分\n准确性：\n一致性：\n可访问性：\n规范性：\n完整性：`;
        } else {
          passCommonDialogInfo.value.visible = true;
        }
      } else {
        proxy.$ElMessage.error(res.msg);
      }
    })
  } else if (type === 'revoke') { // 撤销，状态为审批中时可以撤销。
    ElMessageBox.confirm(`撤销后，该流程将不再进行审核，确定这样操作吗？`, "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: 'warning',
    }).then(() => {
      revokeFlowData({
        guid: row.approveVO.approveGuid,
        flowType: row.approveVO.flowType,
        approveStaffGuid: userData.staffGuid,
        serviceTenantGuid: row.tenantGuid
      }).then((res: any) => {
        if (res.code == '00000') {
          ElMessage.success('撤销成功！')
          getTableData();
        } else {
          ElMessage.error(res.msg)
        }
      })
    }).catch(() => {
      ElMessage({
        type: 'info',
        message: '已取消撤销'
      });
    });
  } else if (type === 'detail') { // 详情
    if (row.registerApproveState == 'Y') {
      router.push({
        name: 'registerDetail',
        query: { guid: row.registerGuid, evaGuid: row.guid, type: 'qualityEvaluate', tenantGuid: row.tenantGuid, tenantName: row.tenantName }
      });
    } else {
      router.push({
        name: 'evaCatalogDetail',
        query: { guid: row.damGuid, evaGuid: row.guid, type: 'qualityEvaluate', tenantGuid: row.tenantGuid }
      });
    }
  } else if (type == 'productDetail') {
    router.push({
      name: 'registerCatalogDetail',
      query: { guid: row.damGuid, tenantGuid: row.tenantGuid }
    });
  }
};

const delTableOpen = (msg, type, isBatch: boolean = false) => {
  ElMessageBox.confirm(msg, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: type,
  }).then(() => {
    let guids: any = [];
    guids = [currTableData.value.guid]
    deleteQuality(guids).then((res: any) => {
      if (res.code == proxy.$passCode) {
        page.value.curr = 1;
        getTableData();
        ElMessage({
          type: "success",
          message: "删除资产质量评价成功",
        });
      } else {
        ElMessage({
          type: "error",
          message: res.msg,
        });
      }
    })
  }).catch(() => {
    ElMessage({
      type: 'info',
      message: '已取消删除'
    });
  });
};

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

const formItems = ref([{
  label: '资产名称',
  type: 'select',
  placeholder: '请选择',
  field: 'damGuid',
  default: '',
  block: true,
  options: assetListData.value,
  props: {
    value: 'guid',
    label: 'damName'
  },
  visible: true,
  required: true
}, {
  label: '附件上传',
  tip: '支持格式：xls .xlsx .doc .docx .rar .zip',
  type: 'upload-file',
  accept: '.xls, .xlsx, .doc, .docx, .rar, .zip',
  templateUrl: 'auto',
  templateClick: () => {
    const link = document.createElement('a');
    link.href = "/files/数据质量评价.docx";
    link.download = '数据质量评价.docx';
    document.body.appendChild(link);
    link.click();
    link.remove();
  },
  required: true,
  block: true,
  visible: true,
  default: [],
  field: 'qualityEvaluationFile',
  limit: 1,
}]);

const formRules = ref({
  damGuid: [
    { required: true, trigger: 'change', message: "请选择资产名称" }
  ],
  qualityEvaluationFile: [{
    validator: (rule: any, value: any, callback: any) => {
      if (!value?.length) {
        callback(new Error('请上传数据质量评价附件'))
      } else {
        callback();
      }
    }, trigger: 'change'
  }],
});

const dialogInfo = ref({
  visible: false,
  size: 510,
  direction: "column",
  header: {
    title: "质量评价发起",
  },
  type: '',
  contents: [
    {
      type: 'form',
      title: '',
      formInfo: {
        id: 'quality-start-level',
        items: formItems.value,
        rules: formRules.value
      }
    }
  ],
  footer: {
    btns: [
      { type: "default", label: "取消", value: "cancel" },
      { type: "primary", label: "确定", value: "submit", loading: false },
    ],
  },
});

/** 编辑质量评价发起资产申请按钮处理。 */
const dialogBtnClick = (btn, info) => {
  if (btn.value == 'submit') {
    dialogInfo.value.footer.btns[1].loading = true;
    let submitFunc = () => {
      getProcessNodesPromise({
        deploymentId: deploymentId.value,
        processInstanceId: null,
      }).then((res: any) => {
        if (res?.code == proxy.$passCode) {
          getStaffDetailInfo(res.data?.[1]?.candidateUsers?.[0]?.staffGuid).then((resUser: any) => {
            if (resUser?.code == proxy.$passCode) {
              if (dialogInfo.value.type == 'reSubmit') {
                updatQuality({
                  guid: currTableData.value.guid,
                  tenantGuid: userData.tenantGuid,
                  damGuid: currTableData.value.damGuid,
                  daName: currTableData.value.daName,
                  immediateApprove: true,
                  evaluationAgencyGuid: resUser.data?.tenantGuid,
                  qualityEvaluationFile: info.qualityEvaluationFile?.map(file => {
                    return {
                      name: file.name,
                      url: file.url
                    }
                  }) || []
                }).then((res: any) => {
                  dialogInfo.value.footer.btns[1].loading = false;
                  if (res?.code == proxy.$passCode) {
                    ElMessage.success('该资产质量评价重新提交成功');
                    dialogInfo.value.visible = false;
                    page.value.curr = 1;
                    getTableData();
                  } else {
                    ElMessage.error(res.msg);
                  }
                })
              } else {
                let daInfo = assetListData.value.find(a => a.guid == info.damGuid);
                saveQuality({
                  tenantGuid: userData.tenantGuid,
                  damGuid: info.damGuid,
                  daName: daInfo.damName,
                  immediateApprove: true,
                  evaluationAgencyGuid: resUser.data?.tenantGuid,
                  qualityEvaluationFile: info.qualityEvaluationFile?.map(file => {
                    return {
                      name: file.name,
                      url: file.url
                    }
                  }) || []
                }).then((res: any) => {
                  dialogInfo.value.footer.btns[1].loading = false;
                  if (res?.code == proxy.$passCode) {
                    ElMessage.success('质量评价发起成功');
                    dialogInfo.value.visible = false;
                    page.value.curr = 1;
                    getTableData();
                  } else {
                    ElMessage.error(res.msg);
                  }
                })
              }
            } else {
              dialogInfo.value.footer.btns[1].loading = false;
              ElMessage.error(res.msg);
            }
          })
        } else {
          dialogInfo.value.footer.btns[1].loading = false;
          ElMessage.error(res.msg);
        }
      })
    }
    if (deploymentId.value) {
      submitFunc();
    } else {
      getCamundaDeploymentId('10018', userData.tenantGuid, userData.staffGuid).then((res: any) => {
        if (res.code == proxy.$passCode) {
          deploymentId.value = res.data;
          submitFunc();
        } else {
          dialogInfo.value.footer.btns[1].loading = false;
          proxy.$ElMessage.error(res.msg);
        }
      })
    }
  } else if (btn.value == 'cancel') {
    dialogInfo.value.visible = false;
  }
};

const passFormItems = ref([
  {
    label: '质量得分',
    type: 'input',
    inputType: 'scoreNumber',
    placeholder: '请输入数值',
    field: 'qualityScore',
    default: null,
    min: 0,
    max: 100,
    required: true
  },
  {
    label: "评价对象范围",
    type: "date-picker",
    field: "evaluationRange",
    default: null,
    placeholder: "开始时间~结束时间",
    clearable: true,
    required: true,
  },
  {
    label: '质量评价说明',
    type: 'textarea',
    field: 'evaluationNote',
    focusValue: true,
    example: '示例：本次评估数据资产总体质量得分为99.80分。从评价维度分析，准确性、一致性和可访问性均为 100 分;规范性 99.42 分、完整性 99.50分。',
    placeholder: `本次评估数据资产总体质量得分为**分\n准确性：\n一致性：\n可访问性：\n规范性：\n完整性：`,
    default: '',
    rows: 6,
    clearable: true,
    required: true,
    block: true,
  },
  {
    label: '质量评价报告',
    tip: '支持扩展名：PDF',
    type: 'upload-file',
    required: true,
    limit: 1,
    block: true,
    accept: '.pdf',
    default: [],
    field: 'evaluationFile',
  }
]);

const passFormRules = ref({
  qualityScore: [{
    validator: (rule: any, value: any, callback: any) => {
      if (value === 0) {
        callback();
        return;
      }
      if (!value) {
        callback(new Error('请填写质量得分'));
        return;
      }
      //TODO 请填写1~100以内的整数
      // const r = /(^[0-9]([0-9]*)$|^[0-9]$)/; // 正整数（可以以0打头）
      // if (value && !r.test(value)) {
      //   callback(new Error('请填写大于或等于零整数'));
      //   return;
      // }
      // if ((value + '').length > 6) {
      //   callback(new Error('请填写1~100以内的整数'));
      //   return;
      // }
      callback();
    },
    trigger: "blur",
  }],
  evaluationRange: [{
    type: 'array', required: true, message: '请填写评价对象范围', trigger: 'change',
  }],
  evaluationNote: [{
    validator: (rule: any, value: any, callback: any) => {
      if (!value) {
        callback(new Error('请填写质量评价说明'));
        return;
      }
      if (value && value.length > 500) {
        callback(new Error('请填写小于500个字的质量评价说明'));
        return;
      }
      callback();
    },
    trigger: "blur",
  }],
  evaluationFile: [{
    validator: (rule: any, value: any, callback: any) => {
      if (!value?.length) {
        callback(new Error('请上传质量评价报告'));
        return;
      }
      callback();
    },
    trigger: "blur",
  }]
});

const passDialogInfo = ref({
  visible: false,
  size: 700,
  direction: "column",
  header: {
    title: "通过",
  },
  type: '',
  contents: [
    {
      type: 'form',
      title: '',
      formInfo: {
        id: 'quality-pass-dialog',
        items: passFormItems.value,
        rules: passFormRules.value
      }
    }
  ],
  footer: {
    btns: [
      { type: "default", label: "取消", value: "cancel" },
      { type: "primary", label: "确定", value: "submit", loading: false },
    ],
  },
});

const passDialogInputChange = (val, item) => {
  if (item.field == 'qualityScore') {
    passFormItems.value[2].placeholder = `本次评估数据资产总体质量得分为${val}分\n准确性：\n一致性：\n可访问性：\n规范性：\n完整性：`;
  }
}

const passDialogBtnClick = (btn, info) => {
  if (btn.value == 'submit') {
    passDialogInfo.value.footer.btns[1].loading = true;
    qualityAllow({
      guid: currTableData.value.approveVO.approveGuid,
      bizGuid: currTableData.value.guid,
      flowType: currTableData.value.approveVO.flowType,
      approveStaffGuid: userData.staffGuid,
      qualityScore: info.qualityScore,
      evaluationRangeStart: info.evaluationRange[0],
      evaluationRangeEnd: info.evaluationRange[1],
      evaluationNote: info.evaluationNote,
      evaluationFile: info.evaluationFile?.map(file => {
        return {
          name: file.name,
          url: file.url
        }
      }) || [],
    }, currTableData.value.tenantGuid).then((res: any) => {
      passDialogInfo.value.footer.btns[1].loading = false;
      if (res?.code == proxy.$passCode) {
        if (res.data) {
          ElMessage.success('审批成功');
          passDialogInfo.value.visible = false;
          getTableData();
        } else {
          ElMessage.error('审批失败');
        }
      } else {
        ElMessage.error(res.msg);
      }
    })
  } else if (btn.value == 'cancel') {
    passDialogInfo.value.visible = false;
  }
};

const rejectDialogInfo = ref({
  visible: false,
  size: 460,
  direction: "column",
  header: {
    title: "驳回",
  },
  type: '',
  contents: [
    {
      type: 'form',
      title: '',
      formInfo: {
        id: 'batch-reject-form',
        items: [
          {
            label: '',
            type: "textarea",
            placeholder: "请填写驳回理由（必填）",
            field: "approveSuggest",
            clearable: true,
            block: true,
            col: 'margin_b_0',
          }
        ]
      }
    }
  ],
  footer: {
    btns: [
      { type: "default", label: "取消", value: "cancel" },
      { type: "primary", label: "确定", value: "submit", loading: false },
    ],
  },
});

const rejectDialogBtnClick = (btn, info) => {
  if (btn.value == 'submit') {
    if (info.approveSuggest == '') {
      ElMessage.error('请填写驳回理由');
      return
    }
    let row = currTableData.value;
    rejectDialogInfo.value.footer.btns[1].loading = true;
    let params = {
      guid: row.approveVO.approveGuid,
      flowType: row.approveVO.flowType,
      approveStaffGuid: userData.staffGuid,
      approveSuggest: info.approveSuggest
    }
    rejectFlowData(params, currTableData.value.tenantGuid).then((res: any) => {
      rejectDialogInfo.value.footer.btns[1].loading = false;
      if (res?.code == proxy.$passCode) {
        if (res.data) {
          ElMessage.success('驳回成功');
          getTableData();
          rejectDialogInfo.value.visible = false;
        } else {
          ElMessage.error('驳回失败');
        }
      } else {
        ElMessage.error(res.msg);
      }
    });
  } else if (btn.value == 'cancel') {
    rejectDialogInfo.value.visible = false;
  }
};

const passCommonDialogInfo = ref({
  visible: false,
  size: 460,
  direction: "column",
  header: {
    title: "通过",
  },
  type: '',
  contents: [
    {
      type: 'form',
      title: '',
      formInfo: {
        id: 'batch-pass-form',
        items: [
          {
            label: '',
            type: "textarea",
            placeholder: "请填写通过备注（选填）",
            field: "approveSuggest",
            clearable: true,
            maxlength: 400,
            block: true,
            col: 'margin_b_0',
          }
        ]
      }
    }
  ],
  footer: {
    btns: [
      { type: "default", label: "取消", value: "cancel" },
      { type: "primary", label: "确定", value: "submit", loading: false },
    ],
  },
});

const passCommonDialogBtnClick = (btn, info) => {
  if (btn.value == 'submit') {
    passCommonDialogInfo.value.footer.btns[1].loading = true;
    let params = {
      guid: currTableData.value.approveVO.approveGuid,
      flowType: currTableData.value.approveVO.flowType,
      approveSuggest: info.approveSuggest,
      approveStaffGuid: userData.staffGuid
    }
    passFlowData(params, currTableData.value.tenantGuid).then((res: any) => {
      passCommonDialogInfo.value.footer.btns[1].loading = false;
      if (res?.code == proxy.$passCode) {
        if (res.data) {
          ElMessage.success('审批成功');
          passCommonDialogInfo.value.visible = false;
          getTableData();
        } else {
          ElMessage.error('审批失败');
        }
      } else {
        ElMessage.error(res.msg);
      }
    })
  } else if (btn.value == 'cancel') {
    passCommonDialogInfo.value.visible = false;
  }
}

</script>

<template>
  <div class="container_wrap">
    <div class="table_tool_wrap">
      <TableTools :searchItems="searchItemList" :searchId="'register-data-search'" @search="toSearch" :init="true" />
      <div class="tools_btns">
        <el-button type="primary" @click="handleCreate">质量评价发起</el-button>
      </div>
    </div>
    <div class="table_panel_wrap">
      <Table :tableInfo="tableInfo" @tableBtnClick="tableBtnClick" @tablePageChange="tablePageChange" />
    </div>
    <Dialog :dialogInfo="dialogInfo" @btnClick="dialogBtnClick" />
    <Dialog :dialogInfo="passDialogInfo" @btnClick="passDialogBtnClick" @inputChange=passDialogInputChange />
    <Dialog :dialogInfo="rejectDialogInfo" @btnClick="rejectDialogBtnClick" />
    <Dialog :dialogInfo="passCommonDialogInfo" @btnClick="passCommonDialogBtnClick" />
    <DialogApproval :visible="approvalDialogVisible" :currentRowInfo="systemApproveCurrentRowInfo"
      @dialog-cancel="handleApprovalDialogCancel"></DialogApproval>
  </div>
</template>

<style scoped lang="scss">
.container_wrap {
  padding: 0 16px;
}
</style>