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

@@ -4,50 +4,26 @@
    <!--    左侧菜单-->
    <el-aside>
      <basic-container>
        <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="small" type="primary" @click="TreeEdit">修改
                </el-button>
                <el-button v-if="permissionList.TreeDelStatus" plain size="small" type="primary" @click="TreeDel">删除
                </el-button>
                <el-button v-if="permissionList.flushedStatus" plain size="small" type="primary" @click="flushed">刷新
                </el-button>
              </div>
              <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.classifyAuth" plain size="mini" type="primary"
                         @click="classifyAuthHandler">分类授权
              </el-button>
            </div>
        <div  style="height: calc(100vh - 142px);!important;">
          <div class="headerCon" style="display: flex; flex-wrap: wrap;margin-bottom: 5px">
            <el-button v-if="permissionList.TreeAddStatus" plain size="small" type="primary" @click="TreeAdd">添加</el-button>
            <el-button v-if="permissionList.TreeEditStatus" plain size="small" type="primary" @click="TreeEdit">修改</el-button>
            <el-button v-if="permissionList.TreeDelStatus" plain size="small" type="primary" @click="TreeDel">删除</el-button>
            <el-button v-if="permissionList.flushedStatus" plain size="small" type="primary" @click="flushed">刷新</el-button>
            <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>
            <el-button style="width: 56px;text-align: center;padding-left: 3px" v-if="permissionList.flowingBtnStuatus" plain size="small" type="primary" @click="flowingDependHandler">流水处理</el-button>
            <el-button style="width: 56px;text-align: center;padding-left: 3px"  v-if="permissionList.classifyAuth" plain size="small" type="primary" @click="classifyAuthHandler">分类授权</el-button>
          </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)"
                     style="height: 690px"
                     @node-click="nodeClick"
          >
            <template slot-scope="{ node, data }" class="el-tree-node__label">
@@ -61,8 +37,8 @@
              </el-tooltip>
            </template>
          </avue-tree>
        </div>

        </div>
        <!-- 树节点添加对话框-->
        <el-dialog v-loading="AddLoading" :before-close="TreeEscHandler"
                   :title="this.TreeFlag ? '添加分类' :'添加主题库'" :visible.sync="TreeAddFormVisible" append-to-body
@@ -279,7 +255,7 @@
          </basic-container>
          <templatePro :Formlist="this.Formlist" :ProData="this.ProData" :codeClassifyOid="this.codeClassifyOid"
                       :crudArray="this.crudArray" :crudLCStatus="this.crudLCStatus" :crudOid="this.crudOid"
                       :rowIndex="this.selectRow"></templatePro>
                       :rowIndex="this.selectRow" :btnAuthList="btnAuthList"></templatePro>
        </span>
        <!--     编码规则-->
        <el-dialog :before-close="masterEscHandler" :visible.sync="MasterdialogVisible" append-to-body
@@ -451,12 +427,14 @@
import func from "@/util/func";
import {mapGetters} from "vuex";
import ClassifyAuth from './ClassifyAuthDialog.vue';
import {getAuthButtonList} from '@/api/system/classifyAuth'

export default {
  components: {ClassifyAuth},
  name: "classifyTrees.vue",
  data() {
    return {
      btnAuthList: [],
      activeName: 'first',
      masterRow: null,
      AddLoading: false,
@@ -830,6 +808,9 @@
        this.$refs.tree.setCurrentKey(null);
        this.nodeClickList = {};
        this.TreeFlagCode = true;
        // this.$nextTick(()=>{
        //   this.btnAuthList = [];
        // })
      }
    }, true)
  },
@@ -837,20 +818,25 @@
    ...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),
        flowingBtnStuatus: this.vaildData(this.permission.classifyTree.tree_flowing, false),
        classifyAuth: this.vaildData(this.permission.classifyTree.classify_auth, false),
        TreeAddStatus: this.vaildData(this.btnAuthList.tree_add, false),
        TreeEditStatus: this.vaildData(this.btnAuthList.tree_edit, false),
        TreeDelStatus: this.vaildData(this.btnAuthList.tree_delete, false),
        flushedStatus: this.vaildData(this.btnAuthList.tree_break, false),
        EnableStatus: this.vaildData(this.btnAuthList.tree_enable, false),
        DeactivateStatus: this.vaildData(this.btnAuthList.tree_stop, false),
        ImportExcelStatus: this.vaildData(this.btnAuthList.tree_import, false),
        ExportExcelStatus: this.vaildData(this.btnAuthList.tree_export, false),
        FindStatus: this.vaildData(this.btnAuthList.manage_search, false),
        TemRefreshStatus: this.vaildData(this.btnAuthList.manage_break, false),
        CloneBtnStuatus: this.vaildData(this.btnAuthList.manage_clone, false),
        flowingBtnStuatus: this.vaildData(this.btnAuthList.tree_flowing, false),
        classifyAuth: this.vaildData(this.btnAuthList.classify_auth, false),
      }
    },
    treeStyle() {
      return {
        height: this.btnAuthList.length > 0 ? '620px' : '785px',
      };
    },
    crudTreeOption() {
      return {
@@ -1428,6 +1414,11 @@
    },
    //树点击事件
    async nodeClick(data) {
      getAuthButtonList({classifyId: data.oid}).then(res => {
        this.btnAuthList = res.data.data;
      }).catch(error => {
        console.log(error)
      })
      //操作新增和修改的业务类型隐藏
      this.TreeFlagCode = !data;
      this.editTreeFLagCode = !data.parentId;
@@ -1772,4 +1763,18 @@
  width: 500px;
}

.headerCon{
  .el-button+.el-button {
    margin-left: 5px;
  }
  .el-button {
    margin-top: 5px;
  }
}
.headerCon > .el-button:nth-child(5) {
  margin-left: 0;
}
.headerCon > .el-button:nth-child(9) {
  margin-left: 0;
}
</style>