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

@@ -2,110 +2,128 @@
<template>
  <el-container>
    <!--    左侧菜单-->
    <el-aside style="width: 20%;">
    <el-aside>
      <basic-container>
        <el-collapse accordion>
          <el-collapse-item style="padding-left: 3px;">
            <template slot="title">
              <div style="display: flex;justify-content: space-around;">
                <el-button v-if="permissionList.TreeAddStatus" plain size="mini" type="primary" @click="TreeAdd">添加
        <div>
          <div>
            <div style="display: flex; flex-direction: column;">
              <div style="display: flex;">
                <el-button v-if="permissionList.TreeAddStatus" plain size="small" type="primary" @click="TreeAdd">添加
                </el-button>
                <el-button v-if="permissionList.TreeEditStatus" plain size="mini" type="primary" @click="TreeEdit">修改
                <el-button v-if="permissionList.TreeEditStatus" plain size="small" type="primary" @click="TreeEdit">修改
                </el-button>
                <el-button v-if="permissionList.TreeDelStatus" plain size="mini" type="primary" @click="TreeDel">删除
                <el-button v-if="permissionList.TreeDelStatus" plain size="small" type="primary" @click="TreeDel">删除
                </el-button>
                <el-button v-if="permissionList.flushedStatus" plain size="mini" type="primary" @click="flushed">刷新
                <el-button v-if="permissionList.flushedStatus" plain size="small" type="primary" @click="flushed">刷新
                </el-button>
              </div>
            </template>
            <div>
              <el-button v-if="permissionList.EnableStatus" plain size="mini" type="primary" @click="Enable">启用
              <div style="display: flex; margin-top: 10px">
                <el-button v-if="permissionList.EnableStatus" plain size="small" type="primary" @click="Enable">启用
                </el-button>
                <el-button v-if="permissionList.DeactivateStatus" plain size="small" type="primary" @click="Deactivate">
                  停用
                </el-button>
                <el-button v-if="permissionList.ImportExcelStatus" plain size="small" type="primary"
                           @click.native="ImportExcel">导入
                </el-button>
                <el-button v-if="permissionList.ExportExcelStatus" plain size="small" type="primary"
                           @click="ExportExcel">导出
                </el-button>
              </div>
            </div>
            <div style="display: flex;margin-top: 5px;margin-bottom: 5px">
              <el-button v-if="permissionList.flowingBtnStuatus" plain size="mini" type="primary"
                         @click="flowingDependHandler">流水处理
              </el-button>
              <el-button v-if="permissionList.DeactivateStatus" plain size="mini" type="primary" @click="Deactivate">
                停用
              </el-button>
              <el-button v-if="permissionList.ImportExcelStatus" plain size="mini" type="primary"
                         @click.native="ImportExcel">导入
              </el-button>
              <el-button v-if="permissionList.ExportExcelStatus" plain size="mini" type="primary"
                         @click="ExportExcel">导出
              <el-button v-if="permissionList.classifyAuth" plain size="mini" type="primary"
                         @click="classifyAuthHandler">分类授权
              </el-button>
            </div>
            <div style="margin-top: 10px;margin-bottom: 10px">
              <el-button v-if="permissionList.ExportExcelStatus" plain size="mini" type="primary" @click="testHandler">流水处理
              </el-button>
            </div>
          </el-collapse-item>
        </el-collapse>

          <!--          左侧树-->
          <div style="height: calc(100vh - 194px);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>
        </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 - 290px)"
                     @node-click="nodeClick"
          >
            <template slot-scope="{ node, data }" class="el-tree-node__label">
              <el-tooltip :content="$createElement('div', { domProps: { innerHTML: node.label } })" class="item"
                          effect="dark"
                          open-delay="500"
                          placement="right-start">
                <span style="font-size: 14px;">
                {{ (node || {}).label }}
              </span>
              </el-tooltip>
            </template>
          </avue-tree>
        </div>

          <!--        树节点添加对话框-->
          <el-dialog v-loading="AddLoading" :before-close="TreeEscHandler"
                     :title="this.TreeFlag ? '添加分类' :'添加主题库'" :visible.sync="TreeAddFormVisible" append-to-body
                     style="width: 1700px;margin: auto">
            <el-form ref="myForm" :model="TreeAddform" :rules="rules">
              <el-form-item :label="this.TreeFlag ? '分类编号：' :'主题库编号：'" label-width="150px" prop="id"
                            style="display: inline-block">
                <el-input v-model="TreeAddform.id" autocomplete="off" style="width: 170px"></el-input>
              </el-form-item>
              <el-form-item :label="this.TreeFlag ? '分类名称：' :'主题库名称：'" label-width="110px" prop="name"
                            style="display: inline-block">
                <el-input v-model="TreeAddform.name" autocomplete="off" style="width: 170px"></el-input>
              </el-form-item>
              <el-form-item v-if="TreeFlagCode" label="存储的业务类型：" label-width="150px" prop="btmTypeName">
                <el-input v-model="TreeAddform.btmTypeName" autocomplete="off" style="width: 585px"
                          @focus="btmFoucus"></el-input>
              </el-form-item>
              <el-form-item label="描述：" label-width="150px">
                <el-input v-model="TreeAddform.description" autocomplete="off" style="width: 585px"></el-input>
              </el-form-item>
              <el-form-item label="编码规则：" label-width="150px">
                <el-input v-model="TreeAddform.codeRuleOidName" autocomplete="off" style="width: 585px"
                          @focus="CodeFoucus"></el-input>
              </el-form-item>
              <el-form-item label="关键属性查询规则：" label-width="150px">
                <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-color="#13ce66"
                  active-text="是"
                  inactive-color="#ff4949"
                  inactive-text="否"
                  @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>
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button @click="TreeEscHandler">取 消</el-button>
              <el-button type="primary" @click="TreeAddHandler">确 定</el-button>
            </div>
          </el-dialog>
          <!--        修改对话框-->
          <el-dialog :visible.sync="TreeEditFormVisible" append-to-body title="修改分类">
            <classifyTreeform ref="childForm" :Editclose=" ()=>{TreeEditFormVisible=false}" :TreeFlag="editTreeFLagCode"
                              :flag="'edit'"
                              :loneTreeNewForm="TreeList" :nodeClickList="nodeClickList"
                              :nodeList="nodeList" @MasterHandler="MasterHandler" @flushed="flushed"
                              @referTreeForm="referTreeForm"></classifyTreeform>
          </el-dialog>
        <!-- 树节点添加对话框-->
        <el-dialog v-loading="AddLoading" :before-close="TreeEscHandler"
                   :title="this.TreeFlag ? '添加分类' :'添加主题库'" :visible.sync="TreeAddFormVisible" append-to-body
                   style="width: 1700px;margin: auto">
          <el-form ref="myForm" :model="TreeAddform" :rules="rules">
            <el-form-item :label="this.TreeFlag ? '分类编号：' :'主题库编号：'" label-width="150px" prop="id"
                          style="display: inline-block">
              <el-input v-model="TreeAddform.id" autocomplete="off" style="width: 170px"></el-input>
            </el-form-item>
            <el-form-item :label="this.TreeFlag ? '分类名称：' :'主题库名称：'" label-width="110px" prop="name"
                          style="display: inline-block">
              <el-input v-model="TreeAddform.name" autocomplete="off" style="width: 170px"></el-input>
            </el-form-item>
            <el-form-item v-if="TreeFlagCode" label="存储的业务类型：" label-width="150px" prop="btmTypeName">
              <el-input v-model="TreeAddform.btmTypeName" autocomplete="off" style="width: 585px"
                        @focus="btmFoucus"></el-input>
            </el-form-item>
            <el-form-item label="描述：" label-width="150px">
              <el-input v-model="TreeAddform.description" autocomplete="off" style="width: 585px"></el-input>
            </el-form-item>
            <el-form-item label="编码规则：" label-width="150px">
              <el-input v-model="TreeAddform.codeRuleOidName" autocomplete="off" style="width: 585px"
                        @focus="CodeFoucus"></el-input>
            </el-form-item>
            <el-form-item label="关键属性查询规则：" label-width="150px">
              <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-color="#13ce66"
                active-text="是"
                inactive-color="#ff4949"
                inactive-text="否"
                @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>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="TreeEscHandler">取 消</el-button>
            <el-button type="primary" @click="TreeAddHandler">确 定</el-button>
          </div>
        </el-dialog>
        <!-- 修改对话框-->
        <el-dialog :visible.sync="TreeEditFormVisible" append-to-body title="修改分类">
          <classifyTreeform ref="childForm" :Editclose=" ()=>{TreeEditFormVisible=false}" :TreeFlag="editTreeFLagCode"
                            :flag="'edit'"
                            :loneTreeNewForm="TreeEditObj" :nodeClickList="nodeClickList"
                            :nodeList="nodeList" @MasterHandler="MasterHandler" @flushed="flushed"
                            @referTreeForm="referTreeForm"></classifyTreeform>
        </el-dialog>
        <!-- 分类授权对话框-->
        <classify-auth-dialog
          :classifyData="classifyData"
          :visible.sync="classifyAuthVisible"
        ></classify-auth-dialog>
      </basic-container>
    </el-aside>
    <el-main>
@@ -113,7 +131,7 @@
        <!--        右侧表格-->
        <avue-tabs :option="tabOption" @change="handleChange"></avue-tabs>
        <span v-if="type.prop==='tab1'">
           <classifyTreeform ref="childForm" :flag="'renonly'" :loneTreeNewForm="TreeList"
           <classifyTreeform ref="childForm" :flag="'renonly'" :loneTreeNewForm="TreeEditObj"
                             :nodeList="nodeList"></classifyTreeform>
        </span>
        <span v-else-if="type.prop==='tab2'">
@@ -432,8 +450,10 @@
import {defaultReferDataGrid, referDataGrid} from '@/api/MasterData/master'
import func from "@/util/func";
import {mapGetters} from "vuex";
import ClassifyAuth from './ClassifyAuthDialog.vue';

export default {
  components: {ClassifyAuth},
  name: "classifyTrees.vue",
  data() {
    return {
@@ -477,6 +497,8 @@
      masterOption: {
        addBtn: false,
        index: true,
        refreshBtn: false,
        columnBtn: false,
        border: true,
        menu: false,
        height: 380,
@@ -505,6 +527,7 @@
        addBtn: false,
        index: true,
        columnBtn: false,
        refreshBtn: false,
        border: true,
        menu: false,
        height: 380,
@@ -596,6 +619,8 @@
      TreeEditFormVisible: false,
      //添加对话框
      TreeAddFormVisible: false,
      //分类授权对话框
      classifyAuthVisible: false,
      //当前点击项
      nodeClickList: "",
      ClonenodeClickList: "",
@@ -767,7 +792,7 @@
        }
      ],
      //传递给子组件动态渲染的数据
      TreeList: {},
      TreeEditObj: {},
      codeClassifyOid: "",
      upAndStopAndStartData: {
        upVersion: {
@@ -791,6 +816,8 @@
      },
      //模板管理编辑
      showEditBtn: false,
      //传递给分类授权子组件对话框的当前选中的分类节点信息
      classifyData: "",
    }
  },
  watch: {},
@@ -800,9 +827,8 @@
    const treeEle = this.$refs.tree.$el
    treeEle.addEventListener('click', (e) => {
      if (e.target.nodeName !== 'SPAN') {
        this.$refs.tree.setCurrentKey(null)
        this.nodeClickList = {}
        this.TreeList = []
        this.$refs.tree.setCurrentKey(null);
        this.nodeClickList = {};
        this.TreeFlagCode = true;
      }
    }, true)
@@ -822,6 +848,8 @@
        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),
        flowingBtnStuatus: this.vaildData(this.permission.classifyTree.tree_flowing, false),
        classifyAuth: this.vaildData(this.permission.classifyTree.classify_auth, false),
      }
    },
    crudTreeOption() {
@@ -884,15 +912,20 @@
  created() {
  },
  methods: {
    handleTabClick(){

    },
    testHandler(){
      if(this.nodeClickList.length <=0 ){
    // 分类授权对话框打开
    classifyAuthHandler() {
      if (this.nodeClickList.oid === '' || this.nodeClickList.oid === undefined) {
        this.$message.warning('请至少选择一条数据！')
        return;
      }
      console.log(this.nodeClickList.oid)
      this.classifyData = this.nodeClickList;
      this.classifyAuthVisible = true;
    },
    flowingDependHandler() {
      if (this.nodeClickList.length <= 0) {
        this.$message.warning('请至少选择一条数据！')
        return;
      }
      flowingDependencyGen(this.nodeClickList.oid).then(res => {
        this.$message.success('操作成功')
      }).catch(res => {
@@ -902,7 +935,6 @@
    // switch
    switchChange() {
      this.TreeAddform.isParticipateCheck = this.TreeAddform.codeKeyAttrValue === true ? 1 : 0;
      // console.log(this.TreeAddform.isParticipateCheck)
    },
    //存储的业务类型关闭
    BtmEscHandler() {
@@ -1123,7 +1155,7 @@
    },
    //子传父
    MasterHandler(val) {
      this.TreeList = val;
      this.TreeEditObj = val;
    },
    rowHandle(row, column) {
      this.selectRow = row.$index;
@@ -1303,11 +1335,11 @@
    },
    //树刷新
    async flushed() {
        await this.getAttr()
        this.$refs.tree.setCurrentKey(null);
        this.nodeClickList = {}
        this.TreeList = []
        this.TreeFlagCode = true;
      await this.getAttr()
      this.$refs.tree.setCurrentKey(null);
      this.nodeClickList = {};
      this.TreeEditObj = {};
      this.TreeFlagCode = true;
    },
    //启用和停用都先判断状态
    //启用
@@ -1346,7 +1378,7 @@
          });
        }
      } catch (error) {
        console.error(error);
        // console.error(error);
      } finally {
        this.loading = false;
      }
@@ -1389,7 +1421,7 @@
          });
        }
      } catch (error) {
        console.error(error);
        // console.error(error);
      } finally {
        this.loading = false;
      }
@@ -1425,9 +1457,9 @@
          this.ProData = [];
          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)
        this.TreeEditObj = res3.data.data;
        if (this.TreeEditObj.isParticipateCheck === null || this.TreeEditObj.isParticipateCheck === undefined || this.TreeEditObj.isParticipateCheck === "") {
          this.$set(this.TreeEditObj, "isParticipateCheck", 1)
          return
        }
      } catch (error) {
@@ -1459,12 +1491,12 @@
      }
    },
    treeClick(e) {
      console.log(e);
      // console.log(e);
    },
    //基本信息表单刷新
    referTreeForm() {
      getObjectByOid(this.nodeClickList.oid).then(res => {
        this.TreeList = res.data.data;
        this.TreeEditObj = res.data.data;
      }).catch(res => {
        this.$message.error(res)
      })