Source/UBCS-WEB/src/components/Theme/ThemeClassifyTrees.vue

@@ -3,26 +3,38 @@
  <el-container>
    <!--    左侧菜单-->
    <el-aside>
      <basic-container style="overflow:hidden;">
      <basic-container>
        <div>
          <div>
            <div style="display: flex; flex-direction: column;">
              <div style="display: flex;">
                <el-button plain size="small" type="primary" @click="TreeAdd">添加</el-button>
                <el-button plain size="small" type="primary" @click="TreeEdit">修改</el-button>
                <el-button plain size="small" type="primary" @click="TreeDel">删除</el-button>
                <el-button plain size="small" type="primary" @click="flushed">刷新</el-button>
                <el-button plain size="small" type="primary" @click="TreeAdd" v-if="permissionList.TreeAddStatus">添加</el-button>
                <el-button plain size="small" type="primary" @click="TreeEdit" v-if="permissionList.TreeEditStatus">修改</el-button>
                <el-button plain size="small" type="primary" @click="TreeDel" v-if="permissionList.TreeDelStatus">删除</el-button>
                <el-button plain size="small" type="primary" @click="flushed" v-if="permissionList.flushedStatus">刷新</el-button>
              </div>
              <div style="display: flex; margin-top: 10px">
                <el-button plain size="small" type="primary" @click="Enable">启用</el-button>
                <el-button plain size="small" type="primary" @click="Deactivate">停用</el-button>
                <el-button plain size="small" type="primary" @click.native="ImportExcel">导入</el-button>
                <el-button plain size="small" type="primary" @click="ExportExcel">导出</el-button>
                <el-button plain size="small" type="primary" @click="Enable" v-if="permissionList.EnableStatus">启用</el-button>
                <el-button plain size="small" type="primary" @click="Deactivate" v-if="permissionList.DeactivateStatus">停用</el-button>
                <el-button plain size="small" type="primary" @click.native="ImportExcel" v-if="permissionList.ImportExcelStatus">导入</el-button>
                <el-button plain size="small" type="primary" @click="ExportExcel" v-if="permissionList.ExportExcelStatus">导出</el-button>
              </div>
            </div>
            <div style="display: flex;justify-content: space-around;margin-top: 5px;margin-bottom: 5px">
            </div>
          </div>
<!--          左侧树-->
          <div style="height: calc(100vh - 230px);overflow: auto">
            <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="CloneTreedata"
                       :defaultExpandAll="false"
                       :option="Treeoption"
                       class="classifyTree"
                       style="height: calc(100vh - 280px)"
                       @node-click="nodeClick"
            >
            </avue-tree>
          </div>

          <!--        树节点添加对话框-->
          <el-dialog v-loading="AddLoading" :before-close="TreeEscHandler"
                     :title="this.TreeFlag ? '添加分类' :'添加主题库'" :visible.sync="TreeAddFormVisible" append-to-body
@@ -51,6 +63,16 @@
                <el-input v-model="TreeAddform.codeKeyAttrRepeatOidName" autocomplete="off" style="width: 585px"
                          @focus="Keyfouce"></el-input>
              </el-form-item>
              <el-form-item label="是否参与关键属性校验：" label-width="170px">
                <el-switch
                  v-model="TreeAddform.codeKeyAttrValue"
                  active-text="是"
                  inactive-text="否"
                  active-color="#13ce66"
                  inactive-color="#ff4949"
                  @change="switchChange">
                </el-switch>
              </el-form-item>
              <el-form-item label="相似查询规则：" label-width="150px">
                <el-input v-model="TreeAddform.codeResembleRuleOidName" autocomplete="off" style="width: 585px"
                          @focus="simFouce"></el-input>
@@ -69,15 +91,6 @@
                              :nodeList="nodeList" @MasterHandler="MasterHandler" @flushed="flushed"
                              @referTreeForm="referTreeForm"></classifyTreeform>
          </el-dialog>
<!--          左侧树-->
          <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="CloneTreedata"
                     :defaultExpandAll="false"
                     :option="Treeoption"
                     class="classifyTree"
                     style="height: calc(100vh - 230px);"
                     @node-click="nodeClick"
          >
          </avue-tree>
        </div>
      </basic-container>
    </el-aside>
@@ -104,9 +117,9 @@
                  </template>

            <template slot="menuLeft">
              <el-button plain size="small" type="primary" @click="FindeHanler">查询</el-button>
              <el-button plain size="small" type="primary" @click="TemRefresh">刷新</el-button>
              <el-button plain size="small" type="primary" @click="CloneBtn">从其它模板克隆</el-button>
              <el-button plain size="small" type="primary" @click="FindeHanler" v-if="permissionList.FindStatus">查询</el-button>
              <el-button plain size="small" type="primary" @click="TemRefresh" v-if="permissionList.TemRefreshStatus">刷新</el-button>
              <el-button plain size="small" type="primary" @click="CloneBtn" v-if="permissionList.CloneBtnStuatus">从其它模板克隆</el-button>
              <!--              查询对话框-->
           <el-dialog :visible.sync="FindFormVisible" append-to-body title="高级查询">
              <div>
@@ -143,7 +156,7 @@
                        <avue-tree ref="cloneTree" v-model="TreeAvueform" v-loading="loading" :data="Treedata"
                                   :defaultExpandAll="false"
                                   :option="Treeoption"
                                   style="height: 50.5vh;margin-right: 10px"
                                   style="height: 50.5vh;margin-right: 10px;width: 300px"
                                   @node-click="ClonenodeClick"
                        >
                        </avue-tree>
@@ -401,13 +414,9 @@
} from "@/api/template/templateAttr";
import {defaultReferDataGrid, referDataGrid} from '@/api/MasterData/master'
import func from "@/util/func";

import {mapGetters} from "vuex";
export default {
  name: "classifyTrees.vue",
  //使用inject接收参数
  //Treeoption左侧树新增表单项 Treedata左侧树节点 配置项 crudTreeOption右侧表格配置项 crudTreeData右侧表格显示内容
  //Treeform右侧表单配置项
  inject: ["crudTreeData"],
  data() {
    return {
      masterRow: null,
@@ -476,6 +485,7 @@
      Option: {
        addBtn: false,
        index: true,
        columnBtn:false,
        border: true,
        menu: false,
        height: 380,
@@ -586,7 +596,9 @@
        //编码规则
        codeRuleOidName: "",
        //存储的业务类型
        btmTypeName: ""
        btmTypeName: "",
        codeKeyAttrValue:true,
        isParticipateCheck:1
      },
      rules: {
        id: [
@@ -667,6 +679,7 @@
      CloneSelect: [],
      //克隆模板option
      ClonecrudTreeOption: {
        columnBtn:false,
        index: true,
        border: true,
        menu: false,
@@ -762,7 +775,6 @@
    }
  },
  watch: {},
  //tab栏默认是表格
  mounted() {
    this.type = this.tabOption.column[0];
    this.getAttr();
@@ -777,10 +789,27 @@
    }, true)
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList(){
      return{
        TreeAddStatus:this.vaildData(this.permission.classifyTree.tree_add,false),
        TreeEditStatus:this.vaildData(this.permission.classifyTree.tree_edit,false),
        TreeDelStatus:this.vaildData(this.permission.classifyTree.tree_delete,false),
        flushedStatus:this.vaildData(this.permission.classifyTree.tree_break,false),
        EnableStatus:this.vaildData(this.permission.classifyTree.tree_enable,false),
        DeactivateStatus:this.vaildData(this.permission.classifyTree.tree_stop,false),
        ImportExcelStatus:this.vaildData(this.permission.classifyTree.tree_import,false),
        ExportExcelStatus:this.vaildData(this.permission.classifyTree.tree_export,false),
        FindStatus:this.vaildData(this.permission.classifyTree.manage_search,false),
        TemRefreshStatus:this.vaildData(this.permission.classifyTree.manage_break,false),
        CloneBtnStuatus:this.vaildData(this.permission.classifyTree.manage_clone,false),
      }
    },
    crudTreeOption() {
      return {
        index: true,
        border: true,
        columnBtn:false,
        height: 180,
        addBtn: this.Formlist.length <= 0 && this.nodeClickList != "",
        editBtn: false,
@@ -834,9 +863,13 @@
    }
  },
  created() {

  },
  methods: {
    // switch
    switchChange(){
      this.TreeAddform.isParticipateCheck = this.TreeAddform.codeKeyAttrValue === true ? 1 : 0;
      // console.log(this.TreeAddform.isParticipateCheck)
    },
    //存储的业务类型关闭
    BtmEscHandler() {
      this.SelectFInd = '';
@@ -911,6 +944,7 @@
        this.$set(this.TreeAddform, 'codeRuleOidName', this.masterName)
        this.$set(this.TreeAddform, 'codeRuleOid', this.masterOid)
        this.$emit('MasterHandler', this.loneTreeNewForm)
        this.masterRow=null;
      }
    },
    //编码接口
@@ -940,6 +974,7 @@
        this.KeySelectLIst = []
        this.$set(this.TreeAddform, 'codeKeyAttrRepeatOidName', this.KeyName)
        this.$set(this.TreeAddform, 'codeKeyAttrRepeatOid', this.KeyOid)
        this.masterRow=null;
      }
    },
    //关键属性查询
@@ -984,6 +1019,7 @@
        this.$set(this.TreeAddform, 'codeResembleRuleOidName', this.simName)
        this.$set(this.TreeAddform, 'codeResembleRuleOid', this.simOid)
        this.$emit('MasterHandler', this.loneTreeNewForm)
        this.masterRow=null;
      }
    },
    //相似项查询
@@ -1029,6 +1065,7 @@
        this.$set(this.TreeAddform, 'btmTypeName', this.btmName)
        this.$set(this.TreeAddform, 'btmTypeId', this.btmOid)
        this.$emit('MasterHandler', this.loneTreeNewForm)
        this.masterRow=null;
      }
    },
    //业务类型查询
@@ -1117,7 +1154,13 @@
    },
    //树节点取消事件
    TreeEscHandler() {
      this.TreeAddform = {};
      for (let key in this.TreeAddform) {
        if (key !== 'codeKeyAttrValue' && key !== 'isParticipateCheck') {
          this.TreeAddform[key] = "";
        }
      }
      this.TreeAddform.codeKeyAttrValue = true;
      this.TreeAddform.isParticipateCheck = 1;
      this.TreeAddFormVisible = false;
      // 关闭弹窗清空校验
      this.$refs.myForm.clearValidate();
@@ -1137,6 +1180,8 @@
            });
            Object.keys(this.TreeAddform).forEach(key => {
              this.TreeAddform[key] = "";
              this.TreeAddform.codeKeyAttrValue = true;
              this.TreeAddform.isParticipateCheck = 1;
            });
            this.getAttr();
            this.TreeAddFormVisible = false;
@@ -1225,7 +1270,10 @@
      this.getAttr()
      setTimeout(() => {
        this.loading = false;
        this.nodeClickList = ""
        this.$refs.tree.setCurrentKey(null);
        this.nodeClickList = {}
        this.TreeList = []
        this.TreeFlagCode = true;
      }, 600);
    },
    //启用和停用都先判断状态
@@ -1327,6 +1375,10 @@
          this.crudOid = ''
        }
        this.TreeList = res3.data.data;
        if(this.TreeList.isParticipateCheck === null || this.TreeList.isParticipateCheck === undefined ||this.TreeList.isParticipateCheck === ""){
          this.$set(this.TreeList,"isParticipateCheck",1)
          return
        }
      } catch (error) {
        this.$message.error(error);
      }
@@ -1612,7 +1664,7 @@
}

.el-aside {
  height: calc(100% - 30px);
  //height: calc(100% - 30px);
}

.el-main {
@@ -1638,6 +1690,3 @@
}

</style>
/sa[pr
[
syulep