ruleModelEdit.vue 10.1 KB
<route lang="yaml">
    name: ruleModelEdit
  </route>

<script lang="ts" setup name="ruleModelEdit">
import { ref } from "vue";
import ruleForm from "../data_quality/ruleForm.vue";
import { useRouter, useRoute } from "vue-router";
import {
  getRuleConfDetail,
  getRuleTypeList,
  getSmallCategoryList,
  getLargeCategoryList,
  updateModelRule
} from '@/api/modules/dataQuality';
import { ElMessage, ElMessageBox } from "element-plus";
import useUserStore from "@/store/modules/user";
import useDataQualityStore from "@/store/modules/dataQuality";

const userStore = useUserStore();
const dataQualityStore = useDataQualityStore();

const { proxy } = getCurrentInstance() as any;

const router = useRouter();
const route = useRoute();
const ruleGuid = route.query.guid;
const fullPath = route.fullPath;

const fullScreenLoading = ref(false);

const detailLoading = ref(false);

const detailInfo: any = ref({});

const toSubjectTables: any = ref([]);

const ruleType = ref('');

const ruleFormRef = ref();

const cancel = () => {
  ElMessageBox.confirm(
    "当前页面尚未保存,确定放弃修改吗?",
    "提示",
    {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }
  )
    .then(() => {
      userStore.setTabbar(userStore.tabbar.filter((tab: any) => tab.fullPath !== fullPath));
      router.push({
        name: 'qualityRules',
      });
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "已取消",
      });
    });
}

/** 将新建规则之后转化为对应质检表的规则。 */
const transformRulesInfo = (info: any) => {
  if (info.ruleCode == "volatility_check") {//表行数波动率。
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
    });
  }
  else if (info.ruleCode == 'null_value_check' || info.ruleCode == 'repeate_data_check') {
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      ruleField: info.modelFields[detailInfo.value.subjectZhName] || []
    });
  } else if (info.ruleCode === 'logic_check') {
    let subjectName = detailInfo.value.subjectName;
    let fields = info.ruleFields[subjectName];
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      ruleField: [{
        guid: fields.guid,
        enName: fields.enName,
        chName: fields.chName
      }],
      conditionSql: info.conditionSqls?.[subjectName],
      conditionSqls: '',
      ruleFields: ''
    });
  } else if (info.ruleCode === 'custom_sql') {
    let subjectGuid = detailInfo.value.subjectGuid;
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      customSql: info.customSqls?.[detailInfo.value.subjectName],
      ruleField: info.ruleFields?.[detailInfo.value.subjectName]?.map(f => {
        return {
          enName: f
        }
      }) || [],
      fieldSelects: info.sqlFieldsList?.[detailInfo.value.subjectName] || [],
      customSqls: '',
      ruleFields: ''
    });
  } else if (info.ruleCode == 'rows_check') {
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      contrastSubjectGuid: info.rows[0].contrastSubjectGuid,
      differenceRange: info.rows[0].differenceRange,
      rows: ''
    });
  } else if (info.ruleCode == 'value_of_range') {
    let subjectName = detailInfo.value.subjectName;
    let fields = info.ruleFields[subjectName];
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      ruleField: fields.map(f => {
            return {
              guid: f.guid,
              enName: f.enName,
              chName: f.chName,
              dataType: f.dataType,
              startValue: f.startValue,
              endValue: f.endValue,
              dataRange: f.dataRange
            }
      }),
      ruleFields: ''
    });
  } else if (info.ruleCode == 'norm_check') {
    let subjectName = detailInfo.value.subjectName;
    let fields = info.ruleFields[subjectName];
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      ruleField: fields.map(f => {
            return {
              guid: f.guid,
              enName: f.enName,
              chName: f.chName,
              dataType: f.dataType,
              checkRule: f.checkRule,
              configValue: f.configValue
            }
      }),
      ruleFields: ''
    });
  } else if (info.ruleCode == 'ref_integrality') {
    return Object.assign({}, info, {
      guid: ruleGuid,
      qualityModelGuid: detailInfo.value.qualityModelGuid,
      ruleCode: detailInfo.value.ruleCode,
      ruleField: info.ruleFields.map(row => {
        return {
          enName: row.mainTableField,
          compareTableGuid: row.compareTableGuid,
          compareTableName: row.compareTableName,
          compareEnName: row.compareEnName
        }
      }),
      ruleFields: ''
    });
  }
}

const save = () => {
  ruleFormRef.value?.ruleFormRef?.ruleFormRef?.validate((valid) => {
    if (valid) {
      let v = ruleFormRef.value?.getFormInfo();
      let params = transformRulesInfo(v);
      fullScreenLoading.value = true;
      updateModelRule(params).then((res: any) => {
        fullScreenLoading.value = false;
        if (res.code == proxy.$passCode) {
          ElMessage.success(`【${params.ruleConfName}】` + '质量规则编辑成功');
          //跳到对应的分组下
          router.push({
            name: 'qualityRules'
          });
          userStore.setTabbar(userStore.tabbar.filter((tab: any) => tab.fullPath !== fullPath));
          dataQualityStore.setModelGuid(params.qualityModelGuid);
        } else {
          ElMessage.error(res.msg);
        }
      })
    }
  });
}

const getRuleDetailInfo = () => {
  detailLoading.value = true;
  getRuleConfDetail(ruleGuid).then((res: any) => {
    detailLoading.value = false;
    if (res.code == proxy.$passCode) {
      let data = res.data || {};
      detailInfo.value = data;
      ruleType.value = detailInfo.value.ruleCode;
      toSubjectTables.value = [{
        guid: detailInfo.value.subjectGuid, //编辑的时候显示的是主题表
        enName: detailInfo.value.subjectName,
        chName: detailInfo.value.subjectZhName,
        label: `${detailInfo.value.subjectName}(${detailInfo.value.subjectZhName})`
      }]
      detailInfo.value.qualityModelGuids = [detailInfo.value.subjectGuid];
      if (fullPath === route.fullPath) {
        document.title = `编辑-${data.ruleConfName}(${data.subjectZhName})`;
      }
      let tab: any = userStore.tabbar.find((tab: any) => tab.fullPath === fullPath);
      if (tab) {
        tab.meta.title = `编辑-${data.ruleConfName}(${data.subjectZhName})`;
      }
    } else {
      ElMessage.error(res.msg);
    }
  })
}

const ruleTypeList = ref([]);
const smallCategoryList = ref([]);
const largeCategoryList = ref([]);

onBeforeMount(() => {
  getRuleDetailInfo();
  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;
      }) || [];
    } else {
      ElMessage.error(res.msg);
    }
  })
  getSmallCategoryList().then((res: any) => {
    if (res.code == proxy.$passCode) {
      smallCategoryList.value = res.data || [];
    } else {
      ElMessage.error(res.msg);
    }
  })
  getLargeCategoryList().then((res: any) => {
    if (res.code == proxy.$passCode) {
      largeCategoryList.value = res.data || [];
    } else {
      ElMessage.error(res.msg);
    }
  })
})

</script>

<template>
  <div class="content_main" v-loading="fullScreenLoading">
    <div class="operator_panel_wrap">
      <div class="operator_panel is-block" v-loading="detailLoading">
        <div class="panel_title">
          <div class="title_text">
            <span>规则</span>
          </div>
        </div>
        <div class="panel_content">
          <div class="form_panel">
            <ruleForm ref="ruleFormRef" :toSubjectTables="toSubjectTables" :ruleTypeValue="ruleType" :value="detailInfo"
              :ruleTypeList="ruleTypeList" :largeCategoryList="largeCategoryList"
              :smallCategoryList="smallCategoryList"></ruleForm>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom_tool_wrap">
      <el-button @click="cancel">取消</el-button>
      <el-button type="primary" @click="save">保存</el-button>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.content_main {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.operator_panel_wrap {
  height: auto;
  min-height: 200px;
  display: flex;
  justify-content: space-between;
  margin: 16px;
  max-height: calc(100% - 72px);

  :deep(.el-button) {
    &.is-text {
      height: auto;
      padding: 0;
    }
  }

  .operator_panel {
    width: calc(50% - 5px);
    height: 100%;
    border: 1px solid #d9d9d9;
    overflow: hidden;

    &.is-block {
      width: 100%;
    }

    .panel_title {
      height: 48px;
      padding: 0 15px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: var(--el-color-regular);
      font-weight: 600;
      border-bottom: 1px solid #d9d9d9;

      .tips_text {
        font-size: 14px;
        color: #999;
        font-weight: normal;
        margin-left: 8px;
      }
    }

    .panel_content {
      height: calc(100% - 46px);

      >div {
        width: 100%;
        height: 100%;
        overflow: hidden;
      }

      .form_panel {
        padding: 8px 16px 0;
        overflow: hidden auto;
      }
    }
  }
}

.bottom_tool_wrap {
  height: 40px;
  padding: 0 16px;
  border-top: 1px solid #d9d9d9;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
</style>