Source/UBCS-WEB/src/components/Tree/classifyTrees.vue

@@ -1,3 +1,4 @@
<!--suppress ALL -->
<template>
  <el-container>
    <!--    左侧菜单-->
@@ -70,16 +71,43 @@
        <avue-tabs :option="tabOption" @change="handleChange"></avue-tabs>
        <span v-if="type.prop==='tab1'">
          <basic-container>
               <avue-crud v-model="crudForm" :data="this.Formlist" :option="this.crudTreeOption" v-loading="FormLoing"
               <avue-crud v-model="crudForm" v-loading="FormLoing" :data="this.Formlist" :option="this.crudTreeOption"
                          @row-save="CrudRowSave"
                          @row-del="CrudRowDel"
                          @row-update="CrudRowUpdata"
               >
            <template slot="menuLeft">
              <el-button plain size="small" type="primary">查询</el-button>
              <el-button plain size="small" type="primary" @click="FindFormVisible = true;">查询</el-button>
              <el-button plain size="small" type="primary" @click="TemRefresh">刷新</el-button>
              <el-button plain size="small" type="primary">从其它模板克隆</el-button>
              <div style="display: inline-block"> <el-input v-model="FindText" placeholder="请输入关键字按回车查询"
                                                            size="small"
                                                            @keyup.enter.native="EnterFind"></el-input></div>

           <el-dialog :visible.sync="FindFormVisible" append-to-body title="高级查询">
              <div>
                <el-button size="small" type="primary" @click="AdvQueries">查询</el-button>
                <el-button size="small" type="primary">重置</el-button>
              </div>
             <div style="padding-left: 80px;margin-top: 15px;">
               <template v-for="(value, key) in FindSelect">
                <div style="display: flex;justify-content: space-around;width: 85%;margin-bottom: 15px">
                <el-select v-model="FindSelect[key]" placeholder="请选择" style="width: 28%" @change="handleSelectChange(key)">
                  <el-option label="模板编号" value="0"></el-option>
                  <el-option label="模板名称" value="1"></el-option>
                  <el-option label="模板描述" value="2"></el-option>
                  <el-option label="版本号" value="3"></el-option>
                  <el-option label="状态" value="4"></el-option>
                 </el-select>
                <el-select v-model="condition[0]" placeholder="请选择" style="width: 15%">
                  <el-option label="包含" value="0"></el-option>
                  <el-option label="等于" value="1"></el-option>
                </el-select>
              <el-input v-model="QueryArray[key]" style="width: 49%"></el-input>
          <span> <i class="el-icon-delete" style="font-size: 22px;margin-top:8px;margin-left: 10px"/></span>
    </div>
  </template>
</div>
           </el-dialog>
            </template>
          </avue-crud>
          </basic-container>
@@ -108,7 +136,11 @@
  importClassify,
  gridCodeClassifyTemplate,
  getObjectByOid,
  gridCodeClassifyTemplateAttr
  gridCodeClassifyTemplateAttr,
  gridCodeClassifyFindTemplate,
  addSave,
  deleteData,
  editSave
} from "@/api/template/templateAttr";

export default {
@@ -119,9 +151,33 @@
  inject: ['crudTreeOption', "crudTreeData"],
  data() {
    return {
      //模板属性展示内容
      ProData: [],
      //回车键搜索绑定值
      FindText: "",
      fileList: [],
      //高级查询对话框
      FindFormVisible: false,
      //高级查询下拉框
      FindSelect: {
        id: "0",
        name: "1",
        description: "2",
        revisionValue: "3",
        lcStatus: "4"
      },
      //高级查询条件
      condition: ["0", "0", "0", "0", "0"],
      //高级查询 等于/不等于
      Equalto: "0",
      //高级查询 输入框数据
      QueryArray: {
        id: "",
        name: "",
        description: "",
        revisionValue: "",
        lcStatus: ""
      },
      //停用启用接收数组
      FlagObj: {},
      //修改对话框
      TreeEditFormVisible: false,
@@ -133,7 +189,7 @@
      TreeFlag: false,
      //树加载
      loading: false,
      FormLoing:false,
      FormLoing: false,
      TreeAddform: {
        id: "",
        name: "",
@@ -191,7 +247,7 @@
      ],
      //传递给子组件动态渲染的数据
      TreeList: {},
      //定义一个模板属性id，数据是模板管理表格里面的oid
      codeClassifyOid:""
    }
  },
  //tab栏默认是表格
@@ -215,7 +271,7 @@
        this.$message.error(res)
      })
    },
    //定义一个修改对象属性名的方法
    //定义一个修改对象属性名的方法 这里别改！！！好像是后台接口数据字段不一致，添加的方法。具体什么原因我也忘记了
    ModifyProperties(obj, oldName, newName) {
      for (let key in obj) {
        if (key === oldName) {
@@ -388,10 +444,11 @@
        });
      }
    },
    //树点击事件
    async nodeClick(data) {
      //定义一个模板属性id，数据是模板管理表格里面的oid
      this.nodeClickList = data
      console.log(data.oid)
      //console.log(data.oid)
      try {
        await TreeObjcet(data.oid).then(res => {
          this.FlagObj = res.data.data
@@ -399,11 +456,12 @@
          this.$message.error(res)
        })
        //模板管理表格数据
        await gridCodeClassifyTemplate(data.oid).then(res => {
        await gridCodeClassifyTemplate({'conditionMap[codeClassifyOid]':data.oid }).then(res => {
          this.Formlist = res.data.data.filter(item => {
          if(item.codeclassifyoid != ""){
            return  item.codeclassifyoid == this.nodeClickList.oid
          }
            if (item.codeclassifyoid != "") {
              this.codeClassifyOid=item.codeclassifyoid
              return item.codeclassifyoid == this.nodeClickList.oid
            }
          })
          console.log("formlist", this.Formlist)
          gridCodeClassifyTemplateAttr({'conditionMap[classifyTemplateOid]': this.Formlist[0].oid}).then(res => {
@@ -413,7 +471,7 @@
            this.$message.error(res)
          })
        }).catch(res => {
              console.log(res)
          console.log(res)
        })
        //  基本信息表单数据
        await getObjectByOid(this.nodeClickList.oid).then(res => {
@@ -430,6 +488,114 @@
    handleChange(column) {
      this.type = column
    },
    // //高级查询按钮
    // handleSelectChange(key) {
    //   const selectedValue = this.FindSelect[key];
    //   console.log(selectedValue)
    //   console.log(this.QueryArray[0])
    //   switch (this.FindSelect[key]) {
    //     case '0':
    //       this.QueryArray[key] = '';
    //       this.$set(this.QueryArray, key, '');
    //       // 如果选中的是模板编号，相应的输入框双向绑定关系为 QueryArray.id
    //       this.$set(this.QueryArray, 'id', this.QueryArray[key]);
    //       break;
    //     case '1':
    //       this.QueryArray[key] = '';
    //       this.$set(this.QueryArray, key, '');
    //       // 如果选中的是模板名称，相应的输入框双向绑定关系为 QueryArray.name
    //       this.$set(this.QueryArray, 'name', this.QueryArray[key]);
    //       break;
    //     case '2':
    //       this.QueryArray[key] = '';
    //       this.$set(this.QueryArray, key, '');
    //       // 如果选中的是模板描述，相应的输入框双向绑定关系为 QueryArray.description
    //       this.$set(this.QueryArray, 'description', this.QueryArray[key]);
    //       break;
    //     case '3':
    //       this.QueryArray[key] = '';
    //       this.$set(this.QueryArray, key, '');
    //       // 如果选中的是版本号，相应的输入框双向绑定关系为 QueryArray.revisionValue
    //       this.$set(this.QueryArray, 'revisionValue', this.QueryArray[key]);
    //       break;
    //     case '4':
    //       this.QueryArray[key] = '';
    //       this.$set(this.QueryArray, key, '');
    //       // 如果选中的是状态，相应的输入框双向绑定关系为 QueryArray.lcStatus
    //       this.$set(this.QueryArray, 'lcStatus', this.QueryArray[key]);
    //       break;
    //   }
    // },
    AdvQueries() {
      this.FindFormVisible = false
      //如果全部为空 allEmpty为true
      const allEmpty = Object.values(this.QueryArray).every(value => !value);
      //如果全部为空，点击查询出现所有数据
      if (allEmpty) {
        gridCodeClassifyTemplate().then(res => {
          this.Formlist = res.data.data
        })
      } else {
        //默认是等于
        gridCodeClassifyFindTemplate({'conditionMap[id]': this.QueryArray.id},
          {'conditionMap[name]': this.QueryArray.name},
          {'conditionMap[description]': this.QueryArray.description},
          {'conditionMap[revisionValue]': this.QueryArray.revisionValue},
          {'conditionMap[lcStatus]': this.QueryArray.lcStatus}
        ).then(res => {
          this.Formlist = res.data.data
        })
      }
    },
    //模板管理渲染
    CrudRend(){
      gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]':this.nodeClickList.oid }).then(res=>{
        this.Formlist = res.data.data
      })
    },
    //模板管理表格添加
    CrudRowSave(row){
      if(this.nodeClickList.length <= 0){
        this.$message({
          type: 'warning',
          message: '请先从树上选择一条数据!'
        });
      }else {
        console.log(this.nodeClickList)
        let codeClassifyOid=this.codeClassifyOid
        this.$set(row,"codeclassifyoid",codeClassifyOid)
        addSave(row).then(res=>{
          this.CrudRend()
        }).catch(res=>{
          this.$message({
            type: 'info',
            message: res
          });
        })
      }
    },
    //模板管理修改
    CrudRowUpdata(row){
      editSave(row).then(()=>{
        this.CrudRend()
      }).catch(res=>{
        this.$message({
          type: 'info',
          message: res
        });
      })
    },
    //模板管理删除
    CrudRowDel(row){
      deleteData(row).then(res=>{
        this.CrudRend()
      }).catch(res=>{
        this.$message({
          type: 'info',
          message: res
        });
      })
    },
    //模板管理表格查询
    EnterFind() {
      console.log(this.Formlist)
@@ -439,27 +605,26 @@
        })
      } else {
        gridCodeClassifyTemplate().then(res => {
            this.Formlist = res.data.data.filter(item => {
                  return item.name.includes(this.FindText)
              }
            )
          }
        )
      }
    },
    TemRefresh(){
      this.FormLoing=true
      if(this.nodeClickList.oid != ""){
        gridCodeClassifyTemplate(this.nodeClickList.oid).then(res=>{
          this.Formlist = res.data.data.filter(item => {
            return  item.codeclassifyoid == this.nodeClickList.oid
            return item.name.includes(this.FindText)
          })
        })
      }else {
        this.FormLoing=true
      }
    },
    //刷新
    TemRefresh() {
      this.FormLoing = true
      if (this.nodeClickList.oid != "") {
        gridCodeClassifyTemplate({'conditionMap[codeclassifyoid]':this.nodeClickList.oid}).then(res => {
          this.Formlist = res.data.data.filter(item => {
            return item.codeclassifyoid == this.nodeClickList.oid
          })
        })
      } else {
        this.FormLoing = true
      }
      setTimeout(() => {
        this.FormLoing=false
        this.FormLoing = false
      }, 600);
    },
    // 左树多选