<template>
 <div class="rule position-re">
  <el-breadcrumb separator="/" class="my-breadcrumb">
    <el-breadcrumb-item>知识库</el-breadcrumb-item>
    <el-breadcrumb-item>清洗规则</el-breadcrumb-item>
  </el-breadcrumb>
   <div class="back" @click="$emit('changeOperation','',{})"><span class="fa fa-reply cur-po " @click="changeOperation('')">返回</span></div>
   <div class="filter-form">
     <diy-el-form :span-attrs="{
     span:5
   }" :forms="clearRuleDetailFilterFormConfig" v-model:model-form="forms">
       <template #searchBtn>
         <el-button type="primary" :icon="Search" @click="getTableList">查询</el-button>
       </template>
     </diy-el-form>
   </div>
   <div class="data-source-a">
     <span class="data-source">数据资源</span>
     <span class="total">共 <strong>{{totalCount}}</strong> 个规则项</span>
   </div>
   <div class="my-detail-main">
     <my-table
       border
       :table-data="tableData"

       :page-size="8"
       :has-operation="true"
       :headers="editClearRuleTableHeader"
     >
       <template #operation="{data}">
         <el-button v-if="!data.DEPLOY_STATUS" type="info"  size="small" @click="openDialog('set',data)">配置</el-button>
         <template v-else-if="data.DEPLOY_STATUS === '0'">
           <el-button type="primary"  size="small" @click="changeClearRuleStateF(data)">启用</el-button>
           <el-button type="primary" size="small" @click="openDialog('edit',data)">编辑</el-button>
         </template>
         <template v-else-if="data.DEPLOY_STATUS === '1'">
           <el-button type="danger"  size="small" @click="changeClearRuleStateF(data)">禁用</el-button>
           <el-button type="primary" size="small" @click="openDialog('detail',data)">查看</el-button>
         </template>
         <template v-else-if="data.DEPLOY_STATUS === '1'">

           <el-button type="primary" size="small"  @click="openDialog('edit','detail')">查看</el-button>
         </template>
       </template>
       <template #CLEANING_RULE_UUID="{data}">
         {{getCLEANING_RULE_UUID(data)}}
       </template>
       <template #CLEANING_RULE="{data}">
         {{getAddedRule(data)}}
       </template>
       <template #QUALITY_RULE="{data}">
         {{getPznr(data.QUALITY_RULE,data)}}
       </template>
     </my-table>
     <ele-pagination  ref="refEl"

                      @sizeOrPageChange="handleSizeChange"
                      class="page hidden"
                      :default-page-size="pageSize"


                      :total-count="totalCount">

       <template #default>
         <div class="m-s">
           显示第 {{pageSize * (pageIndex -1) + 1 }} 到第 {{pageSize * pageIndex}} 条记录，总共 {{totalCount}} 条记录 共显示

         </div>
       </template>
     </ele-pagination>
     <div class="m-s">
       显示第 {{1}} 到第 {{totalCount}} 条记录，总共 {{totalCount}} 条记录

     </div>
   </div>
   <template v-if="isEditDictionaryDialogShow">
     <clear-rule-seting-dialog
       @editRuleSer="editRuleSer"
       :current-op-obj="currentOpObj" :current-dialog-op-obj="currentDialogObj" :operation-type="operationType" v-model:dialog-visible="isEditDictionaryDialogShow"/>
   </template>
 </div>


</template>

<script>
import DiyElForm from "@/components/common/DiyElForm.vue";
import {onBeforeMount, ref} from "vue";
import {clearRuleDetailFilterForm, editDataDictionaryForm, syncDetailFilterForm} from "@/data/all-forms";
import {Search} from "@element-plus/icons-vue";
import MyTable from "@/components/common/MyTable.vue";
import {useDetailOrEdit, usePagination} from "@/unit/use-method/usePagination";
import ElePagination from "@/components/common/ElePagination.vue";
import {
  editClearRuleTableHeader,
  editDataDictionaryTableHeader,
  editSyncRuleTableHeader
} from "@/data/all-table-header";
import DataDictionarySetingDialog
  from "@/view/other/c-views/data-handle/zsk/data-dictionary/DataDictionarySetingDialog.vue";
import SyncRuleSetingDialog from "@/view/other/c-views/data-handle/zsk/sync-rule/SyncRuleSetingDialog.vue";
import ClearRuleSetingDialog from "@/view/other/c-views/data-handle/zsk/clear-rule/ClearRuleSetingDialog.vue";
import {getQualityDetailRuleSelect} from "@/service/zsk/quality-check-rule";
import {
  addClearRuleInfo,
  changeClearRuleState,
  getClearRuleDetailClearSelect,
  getClearRuleDetailTableData
} from "@/service/zsk/clear-rule";
import {isEmptyCheck} from "@/unit/validate";
import {useRootStore} from "@/stores/useStore";
import {handleMes} from "@/unit/element-ui/tip";
import {set_random_id} from "@/unit/random";

export default {
  name: "ClearRuleEdit",
  computed: {
    Search() {
      return Search
    }
  },
  components: {
    ClearRuleSetingDialog,
    SyncRuleSetingDialog, DataDictionarySetingDialog, ElePagination, MyTable, DiyElForm},
  props:{
    currentOpObj:{

    },

  },
  setup(props) {
    function getAddedRule(data){
      try {
        let data2 = JSON.parse(data.CLEANING_RULE)
        return data2.IllegalCharacter || data2.DefaultValue
      }catch {
        return data.CLEANING_RULE
      }

    }
    function editRuleSer(data) {

      if (currentDialogObj.value.CLEANING_RULE_UUID){

      //   有清洗规则，直接修改
        changeClearRuleState({
          cleaningDeployUUID:data.CLEANING_DEPLOY_UUID,
          deployStatus:data.DEPLOY_STATUS,
          cleaningRule:data.CLEANING_RULE || '',
          cleaningRuleUUID:data.CLEANING_RULE_UUID,
        }).then(res => {
          handleMes(res,() => {
            isEditDictionaryDialogShow.value = false
            getTableList()
          },()=>{})
        })
      }
      else {
        addClearRuleInfo({
          cid:data.CATALOG_CODE,
          UUID:currentDialogObj.value.CLEANING_DEPLOY_UUID ||set_random_id() ,
          inspRuleUuid:data.UUID,
          deployStatus:'0',
          cleaningRule:data.CLEANING_RULE || '',
          cleaningRuleUUID:data.CLEANING_RULE_UUID,

        }).then(res => {
          handleMes(res,() => {
            isEditDictionaryDialogShow.value = false
            getTableList()
          },()=>{})
        })
      }

    }
    const store = useRootStore()

    function getCLEANING_RULE_UUID(data) {
      let findNameOptions = clearRuleDetailFilterFormConfig.value.formItemsArr.find(i => i.modelValue === 'TYPE_CODE').options
      let iisHasName = findNameOptions.find(i => i.value === data.CLEANING_RULE_UUID)
      if (iisHasName){
        return iisHasName.CLEANNAME
      }else {
        return '-'
      }
    }

    function changeClearRuleStateF(data) {
      changeClearRuleState({
        cleaningDeployUUID:data.CLEANING_DEPLOY_UUID,
        deployStatus:data.DEPLOY_STATUS === '0'?'1':'0',
        cleaningRule:data.CLEANING_RULE || '',
        cleaningRuleUUID:data.CLEANING_RULE_UUID,
      }).then(res => {
        handleMes(res,() => {
          getTableList()
        },()=>{},data.DEPLOY_STATUS === '0'?'已启用':'已禁用')
      })
    }


    function getConfigName(code,type) {
      let para_configs = store.paraArr
      var json_configs_rule = '';
      for (var i = 0 ; i < para_configs.length ; i++) {
        if (para_configs[i]["CODE"] == type && para_configs[i]["PARA_CODE"] == code) {
          var json_configs_rule = para_configs[i]["NAME"];
          break;
        }
      }

      return json_configs_rule;
    }
    // 配置内容

    function getPznr(value,row){
      if (value != '[]' && value != '' && value != undefined) {
        var rule_value = JSON.parse(value);
        var rule_string = '';
        switch (row.CODE) {
          case "C0001":
            rule_string = '是否非空：'
            rule_string += rule_value[0].NOT_NULL == '1' ? '是' : '否';
            return rule_string;
          case "C0002":

            rule_string = getConfigName('90', rule_value[0].CHACK_TYPE) + ":" + rule_value[0].CHACK_VALUE + ";";
            return rule_string;
          case "C0003":
            rule_string = '是否唯一：'
            rule_string += rule_value[0].ONLY == '1' ? '是' : '否';
            return rule_string;
          case "C0004":
            getConfigName('92', rule_value[0].DATA_FORMAT);
            rule_string += getConfigName('92', rule_value[0].DATA_FORMAT) + ";";
            return rule_string;
          case "C0005":
            getConfigName('90', rule_value[0].CHACK_TYPE);
            getConfigName('91', rule_value[0].DATA_TYPE);;
            rule_string += getConfigName('91', rule_value[0].DATA_TYPE) + ":" + getConfigName('90', rule_value[0].CHACK_TYPE) + ":" + rule_value[0].VALUE + ";";
            return rule_string;
          case "C0006":

            return rule_string;
        }
      }
    }
    const isEditDictionaryDialogShow =  ref(false)
    const clearRuleDetailFilterFormConfig =  ref({...clearRuleDetailFilterForm})
    getClearRuleDetailClearSelect().then(res => {
      let findGz = clearRuleDetailFilterFormConfig.value.formItemsArr.find(i => i.modelValue === 'TYPE_CODE')
      findGz.options = [
        {
          value:'',
          label:'全部'
        },

      ].concat(res.msg[0].Rows.map(i => ({
        ...i,
        value:i.CLEANING_RULE_UUID,
        label:i.CLEANNAME
      })))
    })
    function getTableList() {
      getClearRuleDetailTableData({
        CleaningRuleUUID:forms.value.TYPE_CODE,
        CleaningRuleStatus:forms.value.STATE ||'',
        cid:props.currentOpObj.CATALOG_CODE
      }).then(res => {
        tableData.value  = res.msg[0].Rows || []
        totalCount.value = res.msg[0].TotalRowCount
      })

    }
    const {currentOpObj:currentDialogObj,changeOperation,operationType} = useDetailOrEdit()
    const {pageIndex,pageSize,tableData,totalCount,handleSizeChange,refEl}  = usePagination(getTableList.bind(null))
    const forms = ref({

    })
    function openDialog(operationType,item){
      changeOperation(operationType,item)
      isEditDictionaryDialogShow.value = true
    }
    return {
      forms,
      clearRuleDetailFilterFormConfig,
      pageIndex,pageSize,tableData,totalCount,handleSizeChange,refEl,getTableList,
      editClearRuleTableHeader,
      isEditDictionaryDialogShow,
      openDialog,
      getCLEANING_RULE_UUID,
      getPznr,
      changeClearRuleStateF,
      currentDialogObj,changeOperation,operationType,
      editRuleSer,
      getAddedRule
    }
  }
}
</script>

<style scoped lang="scss">
.filter-form{
  margin-top: 20px;
  border-bottom: 1px solid #e7eaec !important;
}
.my-breadcrumb{
  padding: 20px 20px 20px 20px;
  border-bottom: 1px solid #e7eaec !important;
}
.data-source-a{
  margin: 20px 0;
}
.data-source{

  margin-right: 10px;
  color: rgb(103, 106, 108);
  font-size: 16px;
  font-weight: 600;
}
.total{
  strong{
    color: rgb(55, 99, 156);
    font-weight: 700;
  }
  color: rgb(103, 106, 108);
  font-size: 13px;
}
.data-source-a,.filter-form{
  margin-left: 20px;
  margin-right: 20px;
}

</style>
