ludc
2023-07-11 9d8be8e7580ef577def96c852288a5a95eab4ea3
Source/UBCS-WEB/src/components/Tree/classifyTreeform.vue
@@ -1,24 +1,104 @@
<template>
  <div>
    <avue-form v-model="loneTreeNewForm" :option="option" @submit="submit" v-if="flag == 'renonly'">
    <avue-form v-model="loneTreeNewForm" :option="option" v-if="flag == 'renonly'">
    </avue-form>
    <avue-form v-model="loneTreeNewForm" :option="options" @submit="submit" v-else-if="flag == 'edit'">
    <avue-form v-model="loneTreeNewForm" :option="this.options" @submit="submits" v-else-if="flag == 'edit'">
    </avue-form>
    <div>
      <el-dialog  :visible.sync="dialogVisible"   title="为【编码规则】选取值" append-to-body>
        <div>
          <el-input placeholder="请选择内容" v-model="masterInput" class="input-with-select">
            <el-select v-model="MasterSearchSelects"  placeholder="请选择">
              <el-option label="英文名称" value="0"></el-option>
              <el-option label="中文名称" value="1"></el-option>
            </el-select>
            <el-button slot="append" icon="el-icon-search"></el-button>
          </el-input>
        </div>
<!--     编码规则-->
      <el-dialog  :visible.sync="MasterdialogVisible"   title="为【编码规则】选取值" append-to-body>
        <template>
          <el-select v-model="SelectValue" placeholder="请选择" style="width: 135px">
            <el-option
              v-for="item in SelectOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              style="width: 150px">
            </el-option>
          </el-select>
          <el-input style="width: 260px;margin-left: 15px" placeholder="输入值后进行模糊查询" v-model="SelectFInd"></el-input>
          <el-button size="small"  type="primary" plain @click="SelectFindeHandler" style="margin-left: 20px">查询</el-button>
        </template>
        <avue-crud :data="masterData" :option="masterOption" @select="masterSelect"></avue-crud>
        <div style="padding-top: 10px;display: flex; justify-content: flex-end" >
          <el-button type="primary" size="small" @click="MasterHandlerClick">确定</el-button>
          <el-button  size="small" @click="dialogVisible=false">取消</el-button>
        <div style="height: 30px">
          <div style="display: inline-block;float: left;border: 1px solid #eee;padding: 5px;margin-top: 5px;font-size: 14px " >已设置的值为:[{{this.loneTreeNewForm.coderuleoidName}}]</div>
          <div style="padding-top: 10px;display: flex; justify-content: flex-end;float: right;overflow: hidden" >
            <el-button type="primary" size="small" @click="MasterHandlerClick">确定</el-button>
            <el-button  size="small" @click="MasterdialogVisible=false">取消</el-button>
          </div>
        </div>
      </el-dialog>
<!--      关键属性查询规则-->
      <el-dialog  :visible.sync="KeydialogVisible"   title="为【关键属性查询规则】选取值" append-to-body>
        <template>
          <el-select v-model="SelectValue" placeholder="请选择" style="width: 135px">
            <el-option
              v-for="item in SelectOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              style="width: 150px">
            </el-option>
          </el-select>
          <el-input style="width: 260px;margin-left: 15px" placeholder="输入值后进行模糊查询" v-model="SelectFInd"></el-input>
          <el-button size="small"  type="primary" plain @click="KeySelectFindeHandler" style="margin-left: 20px">查询</el-button>
        </template>
        <avue-crud :data="KeyData" :option="masterOption" @select="KeySelect"></avue-crud>
        <div style="height: 30px">
          <div style="display: inline-block;float: left;border: 1px solid #eee;padding: 5px;margin-top: 5px;font-size: 14px " >已设置的值为:[{{this.loneTreeNewForm.codekeyattrrepeatoidName}}]</div>
          <div style="padding-top: 10px;display: flex; justify-content: flex-end;float: right;overflow: hidden" >
            <el-button type="primary" size="small" @click="KeyHandlerClick">确定</el-button>
            <el-button  size="small" @click="KeydialogVisible=false">取消</el-button>
          </div>
        </div>
      </el-dialog>
      <!--      相似项查询规则-->
      <el-dialog  :visible.sync="SimidialogVisible"   title="为【相似项查询规则】选取值" append-to-body>
        <template>
          <el-select v-model="SelectValue" placeholder="请选择" style="width: 135px">
            <el-option
              v-for="item in SelectOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              style="width: 150px">
            </el-option>
          </el-select>
          <el-input style="width: 260px;margin-left: 15px" placeholder="输入值后进行模糊查询" v-model="SelectFInd"></el-input>
          <el-button size="small"  type="primary" plain @click="SimSelectFindeHandler" style="margin-left: 20px">查询</el-button>
        </template>
        <avue-crud :data="simData" :option="masterOption" @select="simSelect"></avue-crud>
        <div style="height: 30px">
          <div style="display: inline-block;float: left;border: 1px solid #eee;padding: 5px;margin-top: 5px;font-size: 14px " >已设置的值为:[{{this.loneTreeNewForm.codeResembleRuleOidName}}]</div>
          <div style="padding-top: 10px;display: flex; justify-content: flex-end;float: right;overflow: hidden" >
            <el-button type="primary" size="small" @click="simHandlerClick">确定</el-button>
            <el-button  size="small" @click="SimidialogVisible=false">取消</el-button>
          </div>
        </div>
      </el-dialog>
<!--      存储的业务类型-->
      <el-dialog  :visible.sync="BtmdialogVisible"   title="为【业务类型】选取值" append-to-body>
        <template>
          <el-select v-model="SelectValue" placeholder="请选择" style="width: 135px !important;">
            <el-option
              v-for="item in SelectOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              style="width: 130px">
            </el-option>
          </el-select>
          <el-input style="width: 260px;margin-left: 15px" placeholder="输入值后进行模糊查询" v-model="SelectFInd"></el-input>
          <el-button size="small"  type="primary" plain @click="BtmSelectFindeHandler" style="margin-left: 20px">查询</el-button>
        </template>
        <avue-crud :data="BtmData" :option="masterOption" @select="btmSelect"></avue-crud>
        <div style="height: 30px">
          <div style="display: inline-block;float: left;border: 1px solid #eee;padding: 5px;margin-top: 5px;font-size: 14px " >已设置的值为:[{{this.loneTreeNewForm.btmtypename}}]</div>
          <div style="padding-top: 10px;display: flex; justify-content: flex-end;float: right;overflow: hidden" >
            <el-button type="primary" size="small" @click="btmHandlerClick">确定</el-button>
            <el-button  size="small" @click="BtmdialogVisible=false">取消</el-button>
          </div>
        </div>
      </el-dialog>
    </div>
@@ -26,30 +106,67 @@
</template>
<script>
import {defaultReferDataGrid,referDataGrid} from '@/api/MasterData/master'
import {TreeEditSave} from '@/api/template/templateAttr'
export default {
  name: "classifyTreeform.vue",
  props: ['loneTreeNewForm','flag'],
  props: ['loneTreeNewForm','flag','Editclose','TreeFlag','nodeClickList'],
  data() {
    return {
      SelectFInd:"",
      masterName:"",
      masterOid:"",
      KeyName:"",
      KeyOid:"",
      simName:"",
      simOid:"",
      btmName:"",
      btmOid:"",
      masterInput:'',
      MasterSearchSelects:"",
      masterData:[
      masterData:[],
      KeyData:[],
      simData:[],
      BtmData:[],
      SelectOption:[
        {
          id:'001',
          name:'001',
          description:'001'
          value: 'name',
          label: '中文名称'
        },
        {
          id:'002',
          name:'002',
          description:'002'
          value: 'id',
          label: '英文名称'
        }
      ],
      SelectValue:"",
      btmOption:{
        addBtn:false,
        index:true,
        border:true,
        selection:true,
        menu:false,
        height:380,
        column:[
          {
            label:'业务类型编号',
            prop:'id'
          },
          {
            label:'业务类型名称',
            prop:'name'
          },
          {
            label:'描述',
            prop:'description'
          }
        ]
      },
      masterOption:{
        addBtn:false,
        index:true,
        border:true,
        selection:true,
        menu:false,
        height:380,
        column:[
          {
@@ -66,7 +183,10 @@
          }
        ]
      },
      dialogVisible:false,
      MasterdialogVisible:false,
      KeydialogVisible:false,
      SimidialogVisible:false,
      BtmdialogVisible:false,
      form: {
        name: "哈哈",
        sex: "男"
@@ -78,9 +198,9 @@
        column: [
          {
            label: '主题库/分类编号',
            prop: 'btmtypeid',
            labelWidth:128,
            readonly: true,
            prop: 'id',
            labelWidth:135,
            disabled: true,
            rules: [{
              required: true,
              message: "主题库/分类编号",
@@ -90,8 +210,8 @@
          {
            label: '主题库/分类名称',
            prop: 'name',
            readonly: true,
            labelWidth:128,
            disabled: true,
            labelWidth:135,
            rules: [{
              required: true,
              message: "主题库/分类名称",
@@ -102,13 +222,13 @@
            label:"描述",
            prop:"description",
            labelWidth:128,
            readonly: true,
            disabled: true,
          },
          {
            label: '存储的业务类型',
            prop: 'btmtypename',
            labelWidth:128,
            readonly: true,
            disabled: true,
            rules: [{
              required: true,
              message: "存储的业务类型",
@@ -119,111 +239,342 @@
            label:"编码规则",
            prop:"coderuleoidName",
            labelWidth:128,
            readonly: true,
            disabled: true,
          },
          {
            label:"关键属性查询规则",
            prop:"codekeyattrrepeatoidName",
            labelWidth:128,
            readonly: true,
            disabled: true,
          },
          {
            label:"相似查询规则",
            prop:"codeResembleRuleOidName",
            labelWidth:128,
            readonly: true,
            disabled: true,
          },
        ]
      },
      options: {
        submitBtn:false,
        emptyBtn:false,
        column: [
          {
            label: '主题库/分类编号',
            prop: 'btmtypeid',
            labelWidth:128,
            rules: [{
              required: true,
              message: "主题库/分类编号",
              trigger: "blur"
            }]
          },
          {
            label: '主题库/分类名称',
            prop: 'name',
            labelWidth:128,
            rules: [{
              required: true,
              message: "主题库/分类名称",
              trigger: "blur"
            }]
          },
          {
            label:"描述",
            prop:"description",
            labelWidth:128,
          },
          {
            label: '存储的业务类型',
            prop: 'btmtypename',
            labelWidth:128,
            rules: [{
              required: true,
              message: "存储的业务类型",
              trigger: "blur"
            }]
          },
          {
            label:"编码规则",
            prop:"coderuleoidName",
            labelWidth:128,
            focus:this.CodeFoucus
          },
          {
            label:"关键属性查询规则",
            prop:"codekeyattrrepeatoidName",
            labelWidth:128,
          },
          {
            label:"相似查询规则",
            prop:"codeResembleRuleOidName",
            labelWidth:128,
          },
        ]
      },
      FormList: {},
      masterSelectList:[]
      masterSelectList:[],
      KeySelectLIst:[],
      simSelectList:[],
      btmSelectList:[]
    }
  },
  computed:{
    options(){
      return{
          column: [
            {
              label: '主题库/分类编号',
              prop: 'id',
              labelWidth:128,
              rules: [{
                required: true,
                message: "主题库/分类编号",
                trigger: "blur"
              }]
            },
            {
              label: '主题库/分类名称',
              prop: 'name',
              labelWidth:128,
              rules: [{
                required: true,
                message: "主题库/分类名称",
                trigger: "blur"
              }]
            },
            {
              label:"描述",
              prop:"description",
              labelWidth:128,
            },
            {
              label: '存储的业务类型',
              prop: 'btmtypename',
              labelWidth:128,
              focus:this.btmFoucus,
                // readonly: true,
              display:this.TreeFlag,
              rules: [{
                required: true,
                message: "存储的业务类型",
                trigger: "blur"
              }]
            },
            {
              label:"编码规则",
              prop:"coderuleoidName",
              labelWidth:128,
              focus:this.CodeFoucus,
              readonly: true,
            },
            {
              label:"关键属性查询规则",
              prop:"codekeyattrrepeatoidName",
              labelWidth:128,
              focus:this.Keyfouce,
              readonly: true,
            },
            {
              label:"相似查询规则",
              prop:"codeResembleRuleOidName",
              labelWidth:128,
              focus: this.simFouce,
              readonly: true,
            },
          ]
      }
    }
  },
  watch:{
    nodeClickList:{
      handler(newval,oldval){
        console.log('newVal',newval,oldval)
      },
      deep:true,
      immediate:true
    },
    TreeFlag:{
      handler(newval,oldval){
        console.log('树状态',newval,oldval)
      },
      deep:true,
      immediate:true
    }
  },
  created() {
  },
  methods: {
    submit(form, done) {
      this.$message.success(JSON.stringify(form));
      done()
    submits(form,done){
      TreeEditSave(this.loneTreeNewForm).then(res=>{
        this.$message.success('修改成功');
        this.Editclose()
        done()
      })
    },
    error(err) {
      this.$message.success('请查看控制台');
      console.log(err)
    },
    CodeFoucus(){
      this.dialogVisible=true;
      console.log(this.dialogVisible)
    //编码规则查询
    SelectFindeHandler(){
      if(this.SelectValue == 'id'){
        const masterParameter={
          'conditionMap[id]':this.SelectFInd
        }
        this.MasterdefaultRend(masterParameter);
        this.SelectValue=""
        this.SelectFInd=""
      }else if(this.SelectValue == 'name'){
        const masterParameter={
          'conditionMap[name]':this.SelectFInd
        }
        this.MasterdefaultRend(masterParameter)
        this.SelectValue=""
        this.SelectFInd=""
      }
    },
    //编码规则失焦
    CodeFoucus(){
      this.MasterdialogVisible=true;
      this.MasterdefaultRend()
    },
    //编码规则确定
    MasterHandlerClick(){
      if(this.masterSelectList.length>1){
        this.$message.warning('只能选择一条数据')
      }else if(this.masterSelectList.length<=0){
        this.$message.warning('请选择一条数据')
      }else {
        this.dialogVisible=false;
        console.log(this.masterInput)
        console.log(this.MasterSearchSelect)
        this.MasterdialogVisible=false;
        this.masterSelectList=[]
        this.$set(this.loneTreeNewForm,'coderuleoidName',this.masterName)
        this.$set(this.loneTreeNewForm,'coderuleoid',this.masterOid)
        this.$emit('MasterHandler',this.loneTreeNewForm)
        // console.log(this.loneTreeNewForm)
      }
    },
    //编码多选
    masterSelect(row){
      console.log(row)
      this.masterSelectList=row;
      this.masterName=row[0].name;
      this.masterOid=row[0].oid;
      // console.log('oid',this.oid)
    },
    //编码接口
    MasterdefaultRend(masterParameter){
      defaultReferDataGrid({
        referType:'coderule',
        isMuti:'false',
        'conditionMap["lcstatus"]':'Released',
        ...masterParameter
      }).then(res=>{
        this.masterData=res.data.records;
      })
    },
    //关键属性失焦
    Keyfouce(){
      this.KeydialogVisible=true;
      this.KeydefaultRend()
    },
    //关键属性确定
    KeyHandlerClick(){
      if(this.KeySelectLIst.length>1){
        this.$message.warning('只能选择一条数据')
      }else if(this.KeySelectLIst.length<=0){
        this.$message.warning('请选择一条数据')
      }else {
        this.KeydialogVisible=false;
        this.KeySelectLIst=[]
        this.$set(this.loneTreeNewForm,'codekeyattrrepeatoidName',this.KeyName)
        this.$set(this.loneTreeNewForm,'codekeyattrrepeatoid',this.KeyOid)
        this.$emit('MasterHandler',this.loneTreeNewForm)
        console.log(this.loneTreeNewForm)
      }
    },
    //关键属性查询
    KeySelectFindeHandler(){
      if(this.SelectValue == 'id'){
        const masterParameter={
          'conditionMap[id]':this.SelectFInd
        }
        this.KeydefaultRend(masterParameter);
        this.SelectValue=""
        this.SelectFInd=""
      }else if(this.SelectValue == 'name'){
        const masterParameter={
          'conditionMap[name]':this.SelectFInd
        }
        this.KeydefaultRend(masterParameter)
        this.SelectValue=""
        this.SelectFInd=""
      }
    },
    //关键属性接口
    KeydefaultRend(){
      defaultReferDataGrid({
        referType:'codekeyattrrepeat',
        isMuti:'false',
        'conditionMap["lcstatus"]':'Enabled'
      }).then(res=>{
        this.KeyData=res.data.records;
      })
    },
    //关键多选
    KeySelect(row){
      this.KeySelectLIst=row;
      this.KeyName=row[0].name;
      this.KeyOid=row[0].oid;
    },
    //相似项失焦
    simFouce(){
      this.SimidialogVisible=true;
      this.simdefaultRend()
    },
    //相似项确定
    simHandlerClick(){
      if(this.simSelectList.length>1){
        this.$message.warning('只能选择一条数据')
      }else if(this.simSelectList.length<=0){
        this.$message.warning('请选择一条数据')
      }else {
        this.SimidialogVisible=false;
        this.simSelectList=[]
        this.$set(this.loneTreeNewForm,'codeResembleRuleOidName',this.simName)
        this.$set(this.loneTreeNewForm,'codeResembleRuleOid',this.simOid)
        this.$emit('MasterHandler',this.loneTreeNewForm)
      }
    },
    //相似项查询
    SimSelectFindeHandler(){
      if(this.SelectValue == 'id'){
        const masterParameter={
          'conditionMap[id]':this.SelectFInd
        }
        this.simdefaultRend(masterParameter);
        this.SelectValue=""
        this.SelectFInd=""
      }else if(this.SelectValue == 'name'){
        const masterParameter={
          'conditionMap[name]':this.SelectFInd
        }
        this.simdefaultRend(masterParameter)
        this.SelectValue=""
        this.SelectFInd=""
      }
    },
    //相似项多选
    simSelect(row){
      this.simSelectList=row;
      this.simName=row[0].name;
      this.simOid=row[0].oid;
      console.log('oid',this.oid)
    },
    //相似项项接口
    simdefaultRend(){
      defaultReferDataGrid({
        referType:'coderesemblerule',
        isMuti:'false',
        'conditionMap["lcstatus"]':'Enabled'
      }).then(res=>{
        this.simData=res.data.records;
      })
    },
    //业务类型失焦
    btmFoucus(){
      this.BtmdialogVisible=true;
      this.btmdefaultRend()
    },
    //业务类型确定
    btmHandlerClick(){
      if(this.btmSelectList.length>1){
        this.$message.warning('只能选择一条数据')
      }else if(this.btmSelectList.length<=0){
        this.$message.warning('请选择一条数据')
      }else {
        this.BtmdialogVisible=false;
        this.btmSelectList=[]
        this.$set(this.loneTreeNewForm,'btmtypename',this.btmName ||this.btmOid)
        this.$set(this.loneTreeNewForm,'btmtypeid',this.btmOid)
        this.$emit('MasterHandler',this.loneTreeNewForm)
      }
    },
    //业务类型查询
    BtmSelectFindeHandler(){
      if(this.SelectValue == 'id'){
        const masterParameter={
          'conditionMap[id]':this.SelectFInd
        }
        this.btmdefaultRend(masterParameter);
        this.SelectValue=""
        this.SelectFInd=""
      }else if(this.SelectValue == 'name'){
        const masterParameter={
          'conditionMap[name]':this.SelectFInd
        }
        this.btmdefaultRend(masterParameter)
        this.SelectValue=""
        this.SelectFInd=""
      }
    },
    //业务类型多选
    btmSelect(row){
      this.btmSelectList=row;
      this.btmName=row[0].name;
      this.btmOid=row[0].oid;
    },
    //业务类型接口
    btmdefaultRend(masterParameter){
      referDataGrid({valueField:'id',isMuti:'false',...masterParameter}).then(res=>{
        // console.log(res)
        this.BtmData=res.data.data.records
      })
    }
  }
}