saber/src/views/manager/projectinfo/archivetreeRule.vue

<template>
  <basic-container
    ref="container"
    style="height:100%;"
  >
  <el-row class="h-100p">
    <el-col :span="12"  class=" h-100p">
      <basic-container  class=" h-100p  ">
        <div class="h-100p flex flex-d-c ov-hidden">
          <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="竣工档案目录" name="first">
            </el-tab-pane>
            <el-tab-pane label="文书档案目录" name="second">
            </el-tab-pane>
          </el-tabs>
          <div class="scrollClass " style="height:100%">
                    <!-- <h2>归档目录树</h2> -->
                    <el-input
                      placeholder="输入关键字进行过滤"
                      clearable
                      v-model="filterText"
                    >
                    </el-input>
                  <div  style="height:100%;overflow-y: auto;" class="scrollClass ">
                    <el-scrollbar style="height:100%">
                      <el-tree
                        style="box-sizing: border-box;"
                        v-show="!filterText"
                        ref="trees1"
                        :props="props"
                        :load="loadNode"
                        node-key="id"
                        :default-expanded-keys="defaultExpandedKeys"
                        :current-node-key="curreenttid"
                        @node-click="nodeClick"
                        lazy >
                        <span
                        class="custom-tree-node flexStar"
                        :class="data.moreShow ? 'show' : ''"
                          slot-scope="{ node, data }"
                          @mouseover="mouseOver(data)"
                          @mouseleave="mouseLeave(data)"

                        >
                   
                           <div v-if="data.title&&data.title.length<=30">{{data.title | ellipsis}}</div>
                  
                            <el-tooltip v-if="data.title&&data.title.length>30" :content="data.title" raw-content placement="top-start"  effect="light">
                              <span v-if="data.title &&data.title.length <=30">{{ data.title }}</span>
                              <span v-if="data.title && data.title.length > 30"> {{data.title | ellipsis}}</span>
                            </el-tooltip>
                    

                          <span
                            class="marleft10"
                            v-show="data.moreShow"
                           
                          >
                          <div class="normal-black ">
                                <div >
                                    <el-link :underline="false">
                                      <i
                                        class="el-icon-menu "
                                        @click="showMenu($event,data, node)"
                                        v-if="node.level != 1"
                                      
                                      ></i>
                                      <i
                                        class="el-icon-refresh"
                                        @click="synctree(data, node)"
                                        v-if="node.level == 1"
                                      
                                      ></i>
                                    </el-link>
                            
                                
                              <!-- 因右键自定义菜单事件需要获取当前点击的位置，所以此处绑定动态样式来控制菜单实时跟踪鼠标右键点击位置 -->
                                    <ul
                                      v-show="menuvisible"
                                      :style="{ left: menuleft + 'px', top: menutop + 'px' }"
                                      class="contextmenu"
                                    >
                                 
                                        <li v-for="item in menusData" :key="item"  @click="menuClick($event,item,data,node)"> 
                                            <i :class="item.icon"></i>
                                            <span>{{item.label}}</span>
                                        </li>
                                  
                                    
                            
                                    </ul>
                                </div>

                              </div>
                          </span>
                        </span>
                      </el-tree>

                      <el-tree
                      v-show="filterText"
                      :props="props"
                      :data="data"
                      node-key="id"
                      ref="trees2"
                      :default-expand-all="true"
                      :filter-node-method="filterNode"
                      :default-expanded-keys="defaultExpandedKeys"
                      :current-node-key="curreenttid"
                       @node-click="nodeClick"
                    >
                    
                         <span
                         class="custom-tree-node flexStar"
                        :class="data.moreShow ? 'show' : ''"
                          slot-scope="{ node, data }"
                          @mouseover="mouseOver(data)"
                          @mouseleave="mouseLeave(data)"

                        >
                           <div v-if="data.title&&data.title.length<=30">{{data.title | ellipsis}}</div>
                  
                            <el-tooltip v-if="data.title&&data.title.length>30" :content="data.title" raw-content placement="top-start"  effect="light">
                              <span v-if="data.title &&data.title.length <=30">{{ data.title }}</span>
                              <span v-if="data.title && data.title.length > 30"> {{data.title | ellipsis}}</span>
                            </el-tooltip>
                    

                          <span
                            class="marleft10"
                            v-show="data.moreShow"
                           
                          >
                          <div class="normal-black ">
                                <div >
                                    <el-link :underline="false">
                                      <i
                                        class="el-icon-menu "
                                        @click="showMenu($event,data, node)"
                                        v-if="node.level != 1"
                                      
                                      ></i>
                                      <i
                                        class="el-icon-refresh"
                                        @click="synctree(data, node)"
                                        v-if="node.level == 1"
                                      
                                      ></i>
                                    </el-link>
                              <!-- 因右键自定义菜单事件需要获取当前点击的位置，所以此处绑定动态样式来控制菜单实时跟踪鼠标右键点击位置 -->
                                    <ul
                                      v-show="menuvisible"
                                      :style="{ left: menuleft + 'px', top: menutop + 'px' }"
                                      class="contextmenu"
                                    >
                                      <li v-for="item in menusData" :key="item"  @click="menuClick($event,item,data,node)"> 
                                            <i :class="item.icon"></i>
                                            <span>{{item.label}}</span>
                                      </li>
                            
                                    </ul>
                                </div>
                              </div>
                          </span>
                        </span>
                      </el-tree>
                    </el-scrollbar >
                  </div>

          </div>
        </div>
      </basic-container>
    </el-col>
    <el-col :span="12"  class=" h-100p">
      <basic-container  class=" h-100p ">
        <div class="peizhi h-100p ov-hidden" v-loading="rightTreeLoading">
            <el-tabs v-model="activetabName" @tab-click="handletabClick">
                <el-tab-pane label="立卷规则" name="second">
                   <el-row style="margin-bottom:15px">
                    <el-button type="primary" plain @click="setHigh">设置为最高并卷层级</el-button>
                    <el-button type="primary" plain @click="setType">设置为分类卷并卷</el-button>
                    <el-button type="primary" plain @click="setAlone">设置为独立组卷</el-button>
                  </el-row>
                </el-tab-pane>
                <el-tab-pane label="工程文件入口配置" name="first"></el-tab-pane>
          </el-tabs>

          <div class="scrollClass"  v-if="activetabName==='second'" style="height:100%;">
                 <el-scrollbar style="height:100%">
                    <el-tree
                    :props="Rightprops"
                    :data="rightData"
                    node-key="id"
                    ref="settree"
                    class="filter-tree"
                    show-checkbox :check-strictly="true"
                    @check="handleCheckChange"
                  >
                   <div class="custom-tree-node" slot-scope="{ node, data }"   @mouseover="mouseOver(data)"
                    @mouseleave="mouseLeave(data)">
                       <!-- <span>{{ node.label }}</span> -->
                          <span v-if="node.label&&node.label.length<=25">{{node.label | ellipsis1}}</span>
                  
                            <el-tooltip v-if="node.label&&node.label.length>25" :content="node.label" raw-content placement="top-start"  effect="light">
                              <span v-if="node.label &&node.label.length <=25">{{node.label}}</span>
                              <span v-if="node.label && node.label.length > 25"> {{node.label | ellipsis1}}</span>
                            </el-tooltip>
                       <span  class="marleft10"
                              v-show="data.moreShow">
                              <div class="config_type" v-if="data.archiveAutoType == 1&&data.archiveAutoGroupSelect == 1">最</div>
                              <div class="config_type" v-if="data.archiveAutoType == 2&&data.archiveAutoGroupSelect == 1">分</div>
                              <div  class="config_type" v-if="data.archiveAutoType == 3&&data.archiveAutoGroupSelect == 1">独</div>
                          <el-button
                            type="text"
                            size="mini"
                            @click.stop="() => viewConfig(data)">
                            查看配置
                          </el-button>
                          <el-link @click.stop="removeArchive(data)" type="danger" :underline="false" class="marleft10"><i class="el-icon-delete"></i></el-link>
                        </span>
                         
                   </div>
                  </el-tree>
                 </el-scrollbar>
          </div>
          <div class="flexEnd"  v-if="isentryTree&&activetabName==='first'">
            <i
              @click="rightPushTree"
              class="el-icon-plus"
              style="backgroundColor:#2A97DF;color:#fff;fontSize:20px;cursor: pointer;"
            ></i>
          </div>
              <div class="scrollClass"  v-if="isentryTree&&activetabName==='first'" style="height:100%">
                 <el-scrollbar style="height:100%">
                    <el-tree
                    :props="Rightprops"
                    :data="rightData"
                    node-key="id"
                    ref="tree"
                    class="filter-tree"

                  >
                   <div class="custom-tree-node" slot-scope="{ node, data }"   @mouseover="mouseOver(data)"
                    @mouseleave="mouseLeave(data)">
                       <!-- <span>{{ node.label }}</span> -->
                          <span v-if="node.label&&node.label.length<=25">{{node.label | ellipsis1}}</span>
                  
                            <el-tooltip v-if="node.label&&node.label.length>25" :content="node.label" raw-content placement="top-start"  effect="light">
                              <span v-if="node.label &&node.label.length <=25">{{node.label}}</span>
                              <span v-if="node.label && node.label.length > 25"> {{node.label | ellipsis1}}</span>
                            </el-tooltip>
                         
                   </div>
                  </el-tree>
                  
                 </el-scrollbar>
              </div>

        </div>
      </basic-container>
    </el-col>
  </el-row>
    <!-- 新增编辑 -->
    <el-dialog
      :title="form.id?'编辑':'新增'"
      :visible.sync="treeTap"
      width="700px"
      :modal-append-to-body="false"
      @close="treeClose"
    >
      <div>
        <el-form
          ref="form"
          :model="form"
          label-width="120px"
          :rules="rules"
        >
          <el-form-item
            label="节点名称"
            prop="nodeName"
          >
            <el-input
              v-model="form.nodeName"
              style="width:400px;"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="岗位类型"
            prop="postType"
          >
            <el-select
              v-model="form.postType"
              placeholder="请选择岗位"
              style="width:400px;"
              disabled
            >
              <el-option
                v-for="item in JobTypeList"
                :key="item.id"
                :label="item.title"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="节点类型"
            prop="nodeType"
            
          >
            <el-select
           
              v-model="form.nodeType"
              placeholder="请选择节点"
              style="width:400px;"
            >
              <el-option
                v-for="item in nodeTypeList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="工程类型"
            prop="projectType"
          >
            <el-select
              v-model="form.projectType"
              placeholder="工程类型"
              style="width:400px;"
            >
              <el-option
                v-for="item in projectTypeList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>

          <el-form-item
              label="储存类型"
              prop="storageType"
              v-if="form.nodeType==1"
            >
              <el-select
                v-model="form.storageType"
                style="width:400px;"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in storageTypeList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
          </el-form-item>

          <template v-if="form.nodeType==2">
            <el-form-item
              label="是否存储节点"
              prop="isStorageNode"
            >
              <el-select
               
                v-model="form.isStorageNode"
                style="width:400px;"
              >
                <el-option
                  v-for="item in storageNodeList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <template v-if="form.isStorageNode==1">
              <el-form-item
                label="储存类型"
                prop="storageType"
              >
                <el-select
                  v-model="form.storageType"
                  style="width:400px;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in storageTypeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
              <!-- <el-form-item
                label="是否竣工图"
                prop="isBuiltDrawing"
              >
                <el-select
                  v-model="form.isBuiltDrawing"
                  style="width:400px;"
                >
                  <el-option
                    v-for="item in builtDrawingList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item> -->
              <el-form-item
                label="是否接口节点"
                prop="isInterfaceNode"
              >
                <el-select
                  v-model="form.isInterfaceNode"
                  style="width:400px;"
                >
                  <el-option
                    v-for="item in interfaceNodeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
              <template v-if="form.isInterfaceNode==1">
                <el-form-item label="选择接口类型">
                  <el-select
                    v-model="form.interfaceType"
                    style="width:400px;"
                  >
                    <el-option
                      v-for="item in interfaceTypeList"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </template>
          </template>
          <!-- 数字化文件上传 -->
          <template v-if="form.nodeType==1">
            <el-form-item
              label="关联类型"
              prop="associationType"
            >
              <el-select
                v-model="form.associationType"
                style="width:400px;"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in associationTypeList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <template v-if="form.associationType==1">
              <el-form-item
                label="业内资料类型"
                prop="majorDataType"
              >
                <el-checkbox-group v-model="form.majorDataType">
                  <el-checkbox
                    v-for="item in majorDataTypeList"
                    :key="item.dictKey"
                    :label="item.dictKey"
                    name="type"
                  >{{item.dictValue}}</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
              <el-form-item
                label="显示层级"
                prop="displayHierarchy"
              >
                <el-select
                  v-model="form.displayHierarchy"
                  style="width:400px;"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in displayHierarchyList"
                    :key="item.dictKey"
                    :label="item.dictValue"
                    :value="item.dictKey"
                  ></el-option>
                </el-select>
              </el-form-item>
            </template>
            <template v-if="form.associationType==2">
              <el-form-item
                label="文件类型"
                prop="expDataType"
              >
                <el-checkbox-group v-model="form.expDataType">
                  <el-checkbox
                    v-for="item in fileTypeList"
                    :key="item.value"
                    :label="item.label"
                  >{{item.label}}</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </template>
          </template>
        </el-form>
      </div>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="treeTap=false">取 消</el-button>
        <el-button
          type="primary"
          @click="saveTree"
        >保 存</el-button>
      </span>
    </el-dialog>

    <!-- 右侧树 -->
    <el-dialog
      title="上传文件入口显示配置"
      :visible.sync="pushfileTap"
      :modal-append-to-body='false'
      width="800px"
      @close="pushFileClose"
    >
      <div>
        <el-tree
          :props="dialogProps"
          show-checkbox
          :data="dialogData"
          node-key="id"
          accordion
          ref="trees"
          class="filter-tree"
        >
        </el-tree>
      </div>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="pushfileTap = false">取 消</el-button>
        <el-button
          type="primary"
          @click="saveFile"
        >确 定</el-button>
      </span>
    </el-dialog>

    <!-- wbs树排序弹框 -->
    <el-dialog
      title="调整排序"
      :visible="sortTag"
      width="50%"
      append-to-body
    >
      <ManualSorting
        v-if="sortTag2"
        @bianhua='bianhua()'
        :sort='sort'
      />
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="sortTag=false,sortTag2=false">取 消</el-button>
        <el-button
          type="primary"
          @click="editSort()"
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 设置最高层级 -->
     <el-dialog
      :title="setName"
      :visible.sync="highVisible"
      width="50%"
      append-to-body
    >
     <el-checkbox-group v-model="checkList"  class="wraplabel">
      <div v-for="node in nodesList" :key="node.id">
        <el-checkbox :label="node.id" style="margin-bottom:10px;">{{node.pathName}}</el-checkbox>
      </div>
    </el-checkbox-group>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="highVisible=false,highVisible=false">取 消</el-button>
        <el-button
          type="primary"
          @click="setRecordsHandle()"
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 查看配置 -->
    <!-- <el-dialog
        title="设置最高并卷层级"
        :visible.sync="configVisible"
        width="50%"
        append-to-body
      >
       <el-tabs v-model="configactiveName" @tab-click="confighandleClick">
          <el-tab-pane label="最高层级配置" name="first"></el-tab-pane>
          <el-tab-pane label="分类并卷配置" name="second"></el-tab-pane>
          <el-tab-pane label="独立组卷配置" name="third"></el-tab-pane>
         
        </el-tabs>
      <el-checkbox-group v-model="checkList">
        <el-checkbox label="复选框 A" style="margin-bottom:10px"></el-checkbox><br/>
        <el-checkbox label="复选框 B" style="margin-bottom:10px"></el-checkbox><br/>
        <el-checkbox label="复选框 C" style="margin-bottom:10px"></el-checkbox><br/>
      </el-checkbox-group>
        <span
          slot="footer"
          class="dialog-footer"
        >
          <el-button @click="configVisible=false,configVisible=false">取 消</el-button>
          <el-button
            type="primary"
            @click="editSort()"
          >确 定</el-button>
        </span>
      </el-dialog> -->
      <el-dialog
        :visible.sync="configVisible"
        width="50%"
        append-to-body
      >
        <div v-if="configInfo && configInfo.type">
          <div class="config-type-name">
            <span>配置类别：</span>
            <span v-if="configInfo.type == 1">最高并卷层级</span>
            <span v-if="configInfo.type == 2">分类并卷</span>
            <span v-if="configInfo.type == 3">独立组卷</span>
          </div>
          <template v-if="configInfo.type !== 2">
            <div class="config-allname">
              {{configInfo.data.allName}}
            </div>
          </template>
          <template v-else>
            <el-tree :data="configInfo.data.tree" :props="{label: 'nodeName'}" show-checkbox :check-strictly="true" :default-checked-keys="checkedKeys" :default-expanded-keys="checkedKeys" node-key="id" ref="configtree" @check="configCheckChange" class="config-allname"></el-tree>
          </template>
        </div>
        <div style="text-align: center;font-size: 22px;" v-else>
          该节点尚未配置
        </div>

        <span
          slot="footer"
          class="dialog-footer"
        >
          <el-button @click="configVisible=false">取消查看</el-button>
          <el-button v-if="configInfo && configInfo.type == 2"
            type="primary"
            @click="changeConfig"
          >确认修改配置</el-button>
        </span>
      </el-dialog>
  </basic-container>
</template>

<script>
import ManualSorting from '@/components/WbsTree/ManualSorting'
import { archiveTreeInit, lazyTree, dictionary, remove, archiveTreeSave, archiveTreeUpdate, archiveTreeDetail, archiveTreetree, submitDisplayConfigTree, getSameGradeNode, submitArchiveTreeSort,syncProjectTree,saveArchiveAutoRule,getArchiveAutoRule,updateArchiveAutoRule,removeArchiveAutoRule } from "@/api/manager/archivetree";
import {getWbsList} from "@/api/manager/wbsinfo";
import { getToken } from '@/util/auth';
import { roletree } from "@/api/system/role.js";
// import logoVue from '../../page/index/logo.vue';
import { getStore, setStore } from "@/util/store";
export default {
  components: {
    ManualSorting,
  },
  data () {
    return {
      publictreeoptions: [],
      publictreevalue:'',
      testtreeoptions: [],
      testtreevalue:'',
       activeName: 'second',
       activetabName:'second',
       configactiveName:'second',
       isentryTree:true,
       checkList:[],
      //#region 左侧树
      defaultExpanded: [],//默认选中的节点
      filterText: '',//筛选条件
      rulefilterText:'',
      treeNode: {},
      nodeNames: '',
      token: '',
      props: {
        label: 'title',
        children: 'children',
        isLeaf: 'hasChildren'
      },
      data: [],//树节点枚举值
      //#endregion

      //#region 新增编辑节点弹框
      treeTap: false,
      form: {
        id: '',//新增还是编辑
        parentId: '',  //上级节点id
        nodeName: "",  //节点名称
        nodeType: '',  // 节点类型  2 = 数字化上传文件
        postType: '',  //岗位类型
        isStorageNode: '',  //是否为存储节点
        // isBuiltDrawing: '',  //竣工图
        isInterfaceNode: '',  //是否接口节点
        interfaceType: '',  //选择接口类型
        associationType: '',  //关联类型
        majorDataType: [],  //内业资料类型
        displayHierarchy: '',  //显示层级

        projectType:'',//工程类型
        storageType:'',//储存类型
        expDataType:[],//文件类型
      },
      rules: {
        nodeName: [{ required: true, message: '请输入节点名称', trigger: 'blur' }],
        postType: [{ required: true, message: '请选择岗位类型', trigger: 'change' }],
        nodeType: [{ required: true, message: '请选择节点类型', trigger: 'change' }],
        isStorageNode: [{ required: true, message: '请选择存储节点', trigger: 'change' }],
        // isBuiltDrawing: [{ required: true, message: '请选择竣工图', trigger: 'change' }],
        isInterfaceNode: [{ required: true, message: '请选择接口节点', trigger: 'change' }],
        interfaceType: [{ required: true, message: '请选择接口类型', trigger: 'change' }],
        associationType: [{ required: true, message: '请选择关联类型', trigger: 'change' }],
        majorDataType: [{ required: true, message: '请选择业内资料类型', trigger: 'change' }],
        displayHierarchy: [{ required: true, message: '请选择显示层级', trigger: 'change' }],
        projectType: [{ required: true, message: '请选择工程类型', trigger: 'change' }],
        storageType: [{ required: true, message: '请选择储存类型', trigger: 'change' }],
        expDataType: [{ required: true, message: '请选择文件类型', trigger: 'change' }],
      },
      JobTypeList: [],//岗位类型枚举
      nodeTypeList: [
        {
          label: '关联电子原生文件',
          value: 1
        }, {
          label: '数字化上传文件',
          value: 2
        },
      ],//节点类型枚举
      projectTypeList:[
        {
          label: '水利水电工程',
          value: 1
        }, {
          label: '公路工程',
          value: 2
        }, {
          label: '全部',
          value: 3
        },
      ],//工程类型枚举
      storageTypeList:[
        {
          label: '普通',
          value: 1
        },{
          label: '竣工图',
          value: 2
        },{
          label: '计量',
          value: 3
        },{
          label: '质检',
          value: 4
        },{
          label: '声像',
          value: 5
        },{
          label: '隐蔽',
          value: 6
        },{
          label: '原材试验',
          value: 7
        },{
          label: '管理文件',
          value: 8
        },{
          label: '变更令',
          value: 9
        },
      ],//储存类型枚举
      storageNodeList: [{
        label: '是',
        value: 1
      }, {
        label: '否',
        value: 2
      },],//存储节点枚举
      builtDrawingList: [{
        label: '是',
        value: 1
      }, {
        label: '否',
        value: 2
      },],//竣工图枚举
      interfaceNodeList: [{
        label: '是',
        value: 1
      }, {
        label: '否',
        value: 2
      },],//接口节点枚举
      interfaceTypeList: [
        {
          label: '试验接口',
          value: 1
        }, {
          label: '计量接口',
          value: 2
        },
      ],//选择接口类型枚举
      associationTypeList: [{
        label: '质检资料',
        value: 1
      },
      {
        label: '试验资料',
        value: 2
      },
      {
        label: '影像资料',
        value: 3
      },
      {
        label: '台账资料',
        value: 4
      },{
        label: '首件资料',
        value: 5
      },{
        label: '日志文件',
        value: 6
      },
      ],//

      fileTypeList:[
        {
          label: '配合比',
          value: 1
        },
        {
          label: '原材',
          value: 2
        },{
          label: '汇总',
          value: 3
        },{
          label: '设备',
          value: 4
        },{
          label: '外委(第三方)',
          value: 5
        },
      ],

      majorDataTypeList: [],//
      displayHierarchyList: [],//
      //#endregion

      //#region 右侧树节点
      pushfileTap: false,//开关
      Rightprops: {
        label: 'title'
      },
      rightData: [],
      rightTreeLoading:false,//右侧树加载
      //#endregion

      //#region 右侧树弹框
      dialogProps: {
        label: 'title'
      },
      dialogData: [],
      checkXuan: [],
      //#endregion
      heights: '',

      sortTag2: false,
      sortTag: false,
      sort: [],
      ruledata: [{
          id: 1,
          label: '一级 1',
          children: [{
            id: 4,
            label: '二级 1-1',
            children: [{
              id: 9,
              label: '三级 1-1-1'
            }, {
              id: 10,
              label: '三级 1-1-2'
            }]
          }]
        }, {
          id: 2,
          label: '一级 2',
          children: [{
            id: 5,
            label: '二级 2-1'
          }, {
            id: 6,
            label: '二级 2-2'
          }]
        }, {
          id: 3,
          label: '一级 3',
          children: [{
            id: 7,
            label: '二级 3-1'
          }, {
            id: 8,
            label: '二级 3-2'
          }]
        }],
        ruledefaultProps: {
          children: 'children',
          label: 'label'
        },
        highVisible:false,
        configVisible:false,

        projectId:'',
	      archiveAutoType:'',//最高1  分类2  独立3
        nodesList:[],

        configInfo:null,
        checkedKeys:[],//分类并卷 回显 勾选数组

        treeSelectId:'',//选中的划分树
        menusData:[
          {icon: 'el-icon-plus', label: '新增', key: "add"},
          {icon: 'el-icon-s-promotion', label: '编辑', key: "edit"},
          {icon: 'el-icon-sort', label: '排序', key: "sort"},
       
          {icon: 'el-icon-delete', label: '删除', key: "del"},
          {icon: 'el-icon-refresh', label: '同步', key: "sync"},
      
      ],//树组件操作菜单
      menuvisible:false,
      menuleft:20,
      menutop:0,
      defaultExpandedKeys:[],
      expandName: this.$route.fullPath,
      curreenttid:''
    }
  },
  computed:{
    setName(){
      let name = '';
      switch (this.archiveAutoType) {
        case 1:
          name = '设置最高并卷层级';
          break;
        case 2:
          name = '设置分类并卷层级';
          break;
        case 3:
          name = '设置单独并卷层级';
          break;
      }
      return name;
    }
  },
  methods: {
    //切换tabs
     handleClick(tab, event) {
        console.log(tab, event);

     },
     handletabClick(tab, event) {
        console.log(tab, event);
     },
     confighandleClick(tab, event) {
        console.log(tab, event);
     },
     setHigh(){
      if(this.showHighVisible()){
        this.archiveAutoType =1;
      }
        
       //console.log('设置最高');
     },
     setType(){
      if(this.showHighVisible()){
        this.archiveAutoType =2;
      }
        //console.log('设置类型');
     },
    setAlone(){
      if(this.showHighVisible()){
        this.archiveAutoType =3;
      }
      //console.log('设置独立');
     },
      
    showHighVisible(){
      let nodes = this.$refs.settree.getCheckedNodes();
      if(nodes.length < 1){
        this.$message({
          message: '请先勾选节点，再进行设置',
          type: 'warning'
        });
        return false;
      }

      let ids = [];
      nodes.forEach((element)=>{
        element.pathName = this.getTreeNodePath(element,'settree')
        ids.push(element.id);
      })
      //console.log(nodes)
      this.checkList = ids;
      this.nodesList = nodes;
      this.highVisible=true;
      return true;
    },

    async viewConfig(data){
       console.log(data,'查看配置');
       this.configInfo = null;
       const { data: res } = await  getArchiveAutoRule({
        nodeId:data.id,//归档树节点的id 或者 挂载wbs节点的ID（具体哪个ID待定）
        iswbsNode:data.iswbsNode,//是否是wbs节点
        projectId:this.projectId,//   系统级为0  项目级为项目id
        wbsNode2ArchiveTreeNodeId:data.wbsNode2ArchiveTreeNodeId,// 这个树节点里面有（iswbsNode为true需传）
        wbsId:this.treeSelectId // 这个就是一开始上面选择划分树的id（iswbsNode为true需传）
       })

       if (res.code == 200 && res.msg == "操作成功") {
        //console.log(res.data)
        if(res.data.type){
          this.configInfo = res.data;
        }else if(res.data.archiveAutoType){
          this.configInfo = {
            type:2,
            data:res.data
          }
          this.checkedKeys = res.data.selectNodeIds.split(',');
        }
        this.configVisible=true
      }
     },
     handleCheckChange(data, checks) {
        //console.log(data, checks);
        let array = checks.checkedNodes;
        for (let index = 1; index < array.length; index++) {
          const element = array[index];
          if(element.iswbsNode !== array[0].iswbsNode){
            //取消勾选
            this.$refs.settree.setChecked(data.id,false,false)
            this.$message({
              message: '非wbs节点不能和wbs节点一起设置规则',
              type: 'warning'
            });
            return;
          }
        }
      },
     handleentrybtn(){
       console.log(this.entrybtn,'entrybtn');
       this.isentryTree=false;

     },
    handlerulebtn(){
        this.isentryTree=true;
        console.log(this.rulebtn,'rulebtn');
     },
     savebtn(){
         this.isentryTree=true;
     },
    paixuMD (data) {
      this.sortTag = true
      this.sortTag2 = true
      this.curTreeData = data;
      this.findWbsTreeSameLevel(data.id)
    },
    async findWbsTreeSameLevel (parentId) {//查询当前节点的同级节点
      const { data: res } = await getSameGradeNode({ id: parentId })
      //console.log(res);
      if (res.code === 200) {
        this.sort = res.data
      }
    },
    bianhua () {
      this.sortTag2 = false
      this.$nextTick(() => {
        this.sortTag2 = true
      })
    },
    editSort () {//修改排序
      let sortArr = this.sort, newArr = []
      for (let i = 0; i < sortArr.length; i++) {
        newArr.push({
          id: sortArr[i].id,
          nodeName: sortArr[i].nodeName
        })
      }
      this.wbsTreeSort(newArr)
    },
    async wbsTreeSort (newArr) {//修改排序
      const { data: res } = await submitArchiveTreeSort(newArr)
      //console.log(res);
      if (res.code == 200) {
        this.sortTag = false
        this.sortTag2 = false
        //刷新页面
        window.location.reload()
      }
    },
    //#region 左侧树方法
    async loadNode (node, resolve) {
      console.log(node);
      if (node.level === 0) {
        let ks = await this.lazyTree(0)
        if (ks.length) {
          resolve(ks)
        } else {
          this.archiveTreeInit()
        }
      } else {
        resolve(await this.lazyTree(node.data.id))
      }
    },
    async archiveTreeInit () {//添加根节点
      const { data: res } = await archiveTreeInit({

        projectId:this.projectId//项目id
      })
      console.log(res);
      if (res.code == 200 && res.msg == '操作成功') {
        res.data.forEach(val => {
          val.hasChildren = !val.hasChildren
        });
        return res.data
      } else if (res.code == 200 && res.msg == "未查询到信息") {
        return []
      }
    },
    async lazyTree (parentId) {//树节点懒加载
      const { data: res } = await lazyTree({
        parentId,
        token: this.token,
        projectId:this.projectId
      })
      console.log(res);
      if (res.code == 200 && res.msg == '操作成功') {
        res.data.forEach(val => {
          val.hasChildren = !val.hasChildren
        });
        return res.data
      } else if (res.code == 200 && res.msg == "未查询到信息") {
        return []
      }
    },
    mouseLeave (data) {
      if (data.moreShow) {
        this.$set(data, 'moreShow', false)
        this.menuvisible=false
      }
    },
    mouseOver (data) {
      if (!data.moreShow) {
        this.$set(data, 'moreShow', true)
      }
    },
         //获取节点展开路径
    getExpandedKeys(node) {
      //console.log(node)
      let expandedKeys = [];
      while (node.parent) {
        expandedKeys.push(node.data.id);
        node = node.parent;
      }
      setStore({
        name: this.expandName,
        content: expandedKeys,
        type: true, //sessionStorage
      });
      //console.log(expandedKeys)
    },
    nodeClick(data,node){
       //获取节点展开路径
       this.getExpandedKeys(node);
       setStore({
        name: 'curreenttid',
        content: data.id,
        type: true, //sessionStorage
      });
    },
    addtree (data, node) {//添加树
      console.log(data);
      if (this.JobTypeList.length == 0) {
        this.roletree()
      }
      if (this.majorDataTypeList.length == 0) {
        this.major_data_type()//内业资料类型
      }
      if (this.displayHierarchyList.length == 0) {
        this.display_hierarchy()//显示层级
      }
      this.form.postType = data.postType
     
      this.form.id = ''
      this.form.parentId = data.id
      if (this.filterText) {
        this.defaultExpanded = [data.id]
      }
      this.treeTap = true
    },
    async edittree (data) {//编辑树
      if (this.JobTypeList.length == 0) {
        this.roletree()
      }
      if (this.majorDataTypeList.length == 0) {
        this.major_data_type()//内业资料类型
      }
      if (this.displayHierarchyList.length == 0) {
        this.display_hierarchy()//显示层级
      }
      await this.archiveTreeDetail(data)
      this.form.id = data.id
      this.form.parentId = ''
      this.treeNode = data
      this.treeTap = true
    },
    deletetree (node) {//删除树
      let _that = this
      this.$confirm('是否删除此数据', '提示', {
        distinguishCancelAndClose: true,
        confirmButtonText: '确认',
        cancelButtonText: '取消'
      })
        .then(() => {
          this.remove(node.id).then(()=>{
            _that.$refs.trees1.remove(node) //删除界面上的节点
            this.archiveTreetree4()//全加载左侧树
          }).catch(()=>{

          })

        })
        .catch(() => {

        });
    },
    async remove (id) {//删除接口
      const { data: res } = await remove({ id })
      console.log(res);
      if (res.code == 200) {
        this.$message({
          type: 'success',
          message: '删除成功'
        })
      }
    },
    async archiveTreeDetail (data) {//详情接口
      console.log(data);
      const { data: res } = await archiveTreeDetail({ id: data.id })
      console.log(res);
      if (res.code == 200) {
        this.form.nodeName = res.data.fullName  //节点名称
        this.form.nodeType = res.data.nodeType   // 节点类型  2 = 数字化上传文件
        this.form.postType = res.data.postType   //岗位类型
        this.form.isStorageNode = res.data.isStorageNode   //是否为存储节点
        // this.form.isBuiltDrawing = res.data.isBuiltDrawing   //竣工图
        this.form.isInterfaceNode = res.data.isInterfaceNode   //是否接口节点
        this.form.interfaceType = res.data.interfaceType   //选择接口类型
        this.form.associationType = res.data.associationType   //关联类型
        this.form.majorDataType = res.data.majorDataType.split(',')   //内业资料类型
        this.form.displayHierarchy = res.data.displayHierarchy   //显示层级

        this.form.projectType = res.data.projectType   //工程类型
        this.form.storageType = res.data.storageType   //储存类型

        if(res.data.expDataType){
          this.form.expDataType = res.data.expDataType.split(',')   //文件类型
        }else{
          this.form.expDataType = [];
        }
      }
    },
    async archiveTreetree4 () {//全加载左侧树
      const { data: res } = await archiveTreetree({
        token: this.token,
        projectId:this.projectId
      })
      console.log(res);
      if (res.code == 200 && res.msg == "操作成功") {
        this.data = res.data
      }
    },
    filterNode (value,data,node) {//筛选条件
      if (!value) return true;
      return data.title.indexOf(value) !== -1;
    },
    rulefilterNode (value,data,node) {//筛选条件
      if (!value) return true;
      return data.title.indexOf(value) !== -1;
    },
    //判断节点是否匹配
    getReturnNode(node,_array,value){
      let isPass = node.data &&  node.data.title && node.data.title.indexOf(value) !== -1;
      isPass?_array.push(isPass):'';

      //判断节点是否是父节点
      if(!isPass && node.level!=1 && node.parent){
          this.getReturnNode(node.parent,_array,value);
      }
    },

    //#endregion

    //#region 新增编辑节点弹框
    treeClose () {//弹框关闭事件
      this.form = {
        parentId: '',  //上级节点id
        nodeName: "",  //节点名称
        nodeType: '',  // 节点类型  2 = 数字化上传文件
        postType: '',  //岗位类型
        isStorageNode: '',  //是否为存储节点
        // isBuiltDrawing: '',  //竣工图
        isInterfaceNode: '',  //是否接口节点
        interfaceType: '',  //选择接口类型
        associationType: '',  //关联类型
        majorDataType: [],  //内业资料类型
        displayHierarchy: '',  //显示层级

        projectType:'',//工程类型
        storageType:'',//储存类型
        expDataType:[],//文件类型
      }
      this.$refs.form.resetFields();
      this.form.id = ''
      this.treeTap = false
    },
    async roletree () {//岗位类型枚举
      const { data: res } = await roletree()
      console.log(res);
      if (res.code == 200) {
        this.JobTypeList = res.data
      }
    },
    async major_data_type () {//内业资料类型
      const { data: res } = await dictionary({ code: 'major_data_type' })
      console.log(res);
      if (res.code == 200) {
        this.majorDataTypeList = res.data
      }
    },
    async display_hierarchy () {//显示层级
      const { data: res } = await dictionary({ code: 'display_hierarchy' })
      console.log(res);
      if (res.code == 200) {
        this.displayHierarchyList = res.data
      }
    },
    saveTree () {//保存按钮
      this.$refs.form.validate(val => {
        if (val) {
          if (this.form.nodeType == 2) {
            if (this.form.isStorageNode == 1) {
              if (this.form.isInterfaceNode == 1) {
                this.baocun({
                  id: this.form.id,
                  parentId: this.form.parentId, //上级节点id
                  nodeName: this.form.nodeName,  //节点名称
                  nodeType: this.form.nodeType,  // 节点类型
                  postType: this.form.postType,  //岗位类型
                  isStorageNode: this.form.isStorageNode,  //是否为存储节点
                  // isBuiltDrawing: this.form.isBuiltDrawing,  //竣工图
                  isInterfaceNode: this.form.isInterfaceNode,  //是否接口节点
                  interfaceType: this.form.interfaceType,  //选择接口类型

                  projectType:this.form.projectType, //工程类型
                  storageType:this.form.storageType, //储存类型
                  projectId:this.projectId,//项目id
                })
              } else {
                this.baocun({
                  id: this.form.id,
                  parentId: this.form.parentId, //上级节点id
                  nodeName: this.form.nodeName,  //节点名称
                  nodeType: this.form.nodeType,  // 节点类型
                  postType: this.form.postType,  //岗位类型
                  isStorageNode: this.form.isStorageNode,  //是否为存储节点
                  // isBuiltDrawing: this.form.isBuiltDrawing,  //竣工图
                  isInterfaceNode: this.form.isInterfaceNode,  //是否接口节点

                  projectType:this.form.projectType, //工程类型
                  storageType:this.form.storageType, //储存类型
                  projectId:this.projectId,//项目id
                })
              }
            } else {
              this.baocun({
                id: this.form.id,
                parentId: this.form.parentId, //上级节点id
                nodeName: this.form.nodeName,  //节点名称
                nodeType: this.form.nodeType,  // 节点类型
                postType: this.form.postType,  //岗位类型
                isStorageNode: this.form.isStorageNode,  //是否为存储节点

                projectType:this.form.projectType, //工程类型
                projectId:this.projectId,//项目id
              })
            }
          } else if (this.form.nodeType == 1) {
            if (this.form.associationType == 1) {
              this.baocun({
                id: this.form.id,
                parentId: this.form.parentId, //上级节点id
                nodeName: this.form.nodeName,  //节点名称
                nodeType: this.form.nodeType,  // 节点类型
                postType: this.form.postType,  //岗位类型
                associationType: this.form.associationType,  //关联类型
                majorDataType: this.form.majorDataType, //内业资料类型
                displayHierarchy: this.form.displayHierarchy,  //显示层级

                projectType:this.form.projectType, //工程类型
                storageType:this.form.storageType, //储存类型
                projectId:this.projectId,//项目id
              })
            } else if(this.form.associationType == 2){
              //试验资料
              this.baocun({
                id: this.form.id,
                parentId: this.form.parentId, //上级节点id
                nodeName: this.form.nodeName,  //节点名称
                nodeType: this.form.nodeType,  // 节点类型
                postType: this.form.postType,  //岗位类型
                associationType: this.form.associationType,  //关联类型

                expDataType:this.form.expDataType.join(','),//文件类型
                projectType:this.form.projectType, //工程类型
                storageType:this.form.storageType, //储存类型
                projectId:this.projectId,//项目id
              })
            }else {
              this.baocun({
                id: this.form.id,
                parentId: this.form.parentId, //上级节点id
                nodeName: this.form.nodeName,  //节点名称
                nodeType: this.form.nodeType,  // 节点类型
                postType: this.form.postType,  //岗位类型
                associationType: this.form.associationType,  //关联类型

                projectType:this.form.projectType, //工程类型
                storageType:this.form.storageType, //储存类型
                projectId:this.projectId,//项目id
              })
            }
          }
        }
      })
      if(this.menuKey='edit'){
        //刷新页面
       window.location.reload()
      }
       
    },
    async baocun (da) {
      if (da.majorDataType) {
        if (da.majorDataType.length > 0) {
          let das = ''
          da.majorDataType.forEach((val, key) => {
            das += val
            if (da.majorDataType.length - 1 != key) {
              das += ','
            }
          })
          da.majorDataType = das
        }
      }
      if (this.form.id) {
        await this.archiveTreeUpdate(da)
      } else {
        await this.archiveTreeSave(da)
      }
      if (this.filterText) {
        this.archiveTreetree4()
      }
    },
    async archiveTreeSave (da) {//新增
      console.log(da);
      const { data: res } = await archiveTreeSave(da)
      console.log(res);
      if (res.code == 200) {
        this.$message({
          type: 'success',
          message: '新增成功'
        })
        this.treeTap = false
        let das = await this.lazyTree(da.parentId)
        this.$refs.trees1.updateKeyChildren(da.parentId, das)
        let node = this.$refs.trees1.getNode(da.parentId);
        node.isLeaf = false;
        node.isLeafByUser = false;
      }
    },
    async archiveTreeUpdate (da) {//编辑
      const { data: res } = await archiveTreeUpdate(da)
      console.log(res);
      if (res.code == 200) {
        this.$message({
          type: 'success',
          message: '编辑成功'
        })
        this.treeTap = false
        this.treeNode.title = da.nodeName
        this.treeNode.postType = da.postType
      }
    },
    //#endregion

    //#region 右侧树节点
    async rightPushTree () {//右侧节点树
      this.checkXuan = []
      await this.archiveTreetree2({
        token: this.token,
        nodeType: 2,
      })
      this.pushfileTap = true
      await this.saixuan(this.dialogData)
      console.log(this.checkXuan);
      this.$refs.trees.setCheckedKeys(this.checkXuan);
    },
    // 赛选
    saixuan (da) {//赛选
      if (da.length > 0) {
        let tag = true
        da.forEach(val => {
          if (val.isDisplayTree == 1 && val.hasChildren) {
            let ks = this.saixuan(val.children)
            if (ks) {
              this.checkXuan.push(val.id)
            }
          } else if (val.isDisplayTree == 1 && !val.hasChildren) {
            this.checkXuan.push(val.id)
          } else {
            tag = false
          }
        })
        return tag
      }
    },
    pushFileClose () {//弹框关闭事件
      this.checkXuan = []
    },
    async archiveTreetree (da) {//右侧树全加载接口
      da = Object.assign(da,{projectId:this.projectId})
      const { data: res } = await archiveTreetree(da)
      console.log(res);
      if (res.code == 200 && res.msg == "操作成功") {
        this.rightData = res.data
      }
    },
    //#endregion

    //#region 右侧树弹框
    async submitDisplayConfigTree (ids) {//保存接口
      const { data: res } = await submitDisplayConfigTree({ ids })
      console.log(res);
      if (res.code == 200) {
        this.$message({
          type: 'success',
          message: '设置成功'
        })
        this.archiveTreetree({
          token: this.token,
          disPlayTree: 1,
          nodeType: 2,
        })
        this.pushfileTap = false
      }
    },
    async archiveTreetree2 (da) {//右侧树全加载接口
      da = Object.assign(da,{projectId:this.projectId})
      //console.log(da,'ddddddda')
      const { data: res } = await archiveTreetree(da)
      console.log(res);
      if (res.code == 200 && res.msg == "操作成功") {
        this.dialogData = res.data
      }
    },
    saveFile () {//保存按钮
      let zi = this.$refs.trees.getCheckedKeys() //返回选中子节点的key
      let fu = this.$refs.trees.getHalfCheckedKeys()//返回选中子节点的父节点的key
      let arr = [...zi, ...fu]
      if (arr.length > 0) {
        let ids = ''
        arr.forEach((val, key) => {
          ids += val
          if (key != arr.length - 1) {
            ids += ','
          }
        })
        this.submitDisplayConfigTree(ids)
      } else {
        this.$message({
          type: 'error',
          message: '请先设置配置文件'
        })
      }
    },
    //#endregion

    async getWbsList(){
      const datas = await Promise.all([
        getWbsList(1),
        getWbsList(2),
      ])
      //console.log(datas,'ressssss');
      this.publictreeoptions = datas[0].data.data;
      this.testtreeoptions = datas[1].data.data;
    },


    synctree(data){
      this.$confirm('是否同步该节点?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(() => {
          syncProjectTree({
            id:data.id
          }).then((res)=>{
            if(res.data.code==200){
              this.$message.success(res.data.msg)
              setTimeout(()=>{
                 // 刷新页面
                this.$router.go(0)
              },1000)
            }else{
              this.$message.warning(res.data.msg)
            }
           
           
          })
        }).catch(() => {
                   
        });
    },

    //获取树节点名字路径
    getTreeNodePath(node,refName){
      let nodeInfo = this.$refs[refName].getNode(node.id);
      //console.log(nodeInfo)
      let pathArr = [];
      while (nodeInfo.parent) {
        pathArr.push(nodeInfo.data.title)
        nodeInfo = nodeInfo.parent
      }
      return pathArr.reverse().join('/');
    },

    async setRecordsHandle(){
      const { data: res } = await saveArchiveAutoRule({
        archiveAutoType:this.archiveAutoType,//最高1  分类2  独立3
        selectNodeIds:this.checkList.join(','),//鼠标选择的节点ID（只要鼠标选择的节点，选择节点的下级子节点那种不要），逗号拼接
        iswbsNode:this.nodesList[0].iswbsNode,//是否是wbs节点 
        projectId:this.projectId,//   系统级为0  项目级为项目id
      })

      if (res.code == 200 && res.msg == "操作成功") {
        this.$message({
          type: 'success',
          message: '设置成功'
        })
        this.highVisible = false;
      }
    },

    //立卷树勾选修改
    configCheckChange(data, checks){
      let array = checks.checkedNodes;
        for (let index = 1; index < array.length; index++) {
          const element = array[index];
          if(element.iswbsNode !== array[0].iswbsNode){
            //取消勾选
            this.$refs.configtree.setChecked(data.id,false,false)
            this.$message({
              message: '非wbs节点不能和wbs节点一起设置规则',
              type: 'warning'
            });
            return;
          }
        }
    },

    //立卷规则修改
    async changeConfig(){
      let keys = this.$refs.configtree.getCheckedKeys();
      let nodes = this.$refs.configtree.getCheckedNodes();
      console.log(nodes)
      const { data: res } = await updateArchiveAutoRule({
        archiveAutoType:2,//最高1  分类2  独立3
        archiveAutoGroupId:this.configInfo.data.archiveAutoGroupId,
        selectNodeIds:keys.join(','),//鼠标选择的节点ID（只要鼠标选择的节点，选择节点的下级子节点那种不要），逗号拼接
        iswbsNode:nodes[0].iswbsNode,//是否是wbs节点 
        projectId:this.projectId,//   系统级为0  项目级为项目id
      })

      if (res.code == 200 && res.msg == "操作成功") {
        this.$message({
          type: 'success',
          message: '修改成功'
        })
        this.configVisible = false;
      }
    },

    async removeArchive(data){
      this.$confirm('此操作将永久删除配置, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          removeArchiveAutoRule({
            nodeId:data.id,
            iswbsNode:data.iswbsNode,//是否是wbs节点   flase 不是 true 是 （先false,具体怎么区分后面再看）
            projectId:this.projectId,//   系统级为0  项目级为项目id
          }).then((res)=>{
            //console.log(res)
            if (res.data.code == 200 && res.data.msg == "操作成功") {
              this.$message({
                type: 'success',
                message: '修改成功'
              })
            }
          })
        });
    },
         //树形控件菜单相关方法
  mouseout(){
      this.menuvisible=false
  },
    //展示菜单
  showMenu(e,data,node){
    e.preventDefault();
    console.log(e,'e');
    var x = e.pageX; //这个应该是相对于整个浏览器页面的x坐标，左上角为坐标原点（0,0）
    var y = e.pageY; //这个应该是相对于整个浏览器页面的y坐标，左上角为坐标原点（0,0）
    this.menutop = y;
    this.menuleft = x;
    this.menuvisible=true

    },
    menuClick(e,item,data,node){
       this.menuKey=''
         //获取节点展开路径
         this.getExpandedKeys(node);
        e.preventDefault();
        if(item.key==='add'){
          if(data.isStorageNode!=1){
            this.addtree(data,node)
            this.menuKey='add'
          }else{
            this.$message.warning('该节点下不允许新增节点')
          }
          
        }
        
        else if(item.key==='edit'){
          this.edittree(data,node)
          this.menuKey='edit'
        }
         else if(item.key==='del'){
            this.menuKey='del'
          this.deletetree(data,node)
        }else if(item.key==='copy'){
          this.$message.info('暂无相关接口')
        }
        else if(item.key==='sort'){
            this.menuKey='sort'
         this.paixuMD(data,node)
        }
        else if(item.key==='sync'){
            this.menuKey='sync'
         this.synctree(data,node)
        }
    },



  },
  watch: {
    filterText (val) {
      this.$refs.trees2.filter(val);
    },
    rulefilterText(val) {
        this.$refs.ruletree.filter(val);
      }
  },
  created () {
    this.token = 'bearer ' + getToken()

    this.projectId = this.$route.query.projectId;
    this.defaultExpandedKeys = getStore({ name: this.expandName });
    this.curreenttid= getStore({ name:'curreenttid' });

    this.archiveTreetree({
      token: this.token,
      //disPlayTree: 1,
      //nodeType: 2,
    })
    this.archiveTreetree4()//全加载左侧树
    
    this.getWbsList();
  },
  mounted () {
    this.heights = this.$refs.container.$el.offsetHeight;
  },
  filters:{
    ellipsis(value) {
      if (!value) return "";
      if (value.length > 30) {
        return value.slice(0, 30) + "...";
      }
      return value;
    },
    ellipsis1(value) {
      if (!value) return "";
      if (value.length > 25) {
        return value.slice(0, 25) + "...";
      }
      return value;
    },
    
  },

}
</script>

<style lang="scss" scoped>
.peizhi {
  border: 1px solid #e5e5e5;
  border-radius: 5px;
  padding: 15px 10px;
}
.btnground{
  background-color: #e5e5e5;
}

.el-tree .el-tree-node__content{
   display: block !important;
 }

/deep/ .el-tree .el-tree-node__children{
   overflow: visible!important;
 }

.config-type-name{
  font-size: 18px;
}
.config-allname{
  margin-top: 20px;
}

.wraplabel /deep/ .el-checkbox__label {
  display: inline-grid;
  white-space: pre-line;
  word-wrap: break-word;
  overflow: hidden;
  line-height: 20px;
}
.treeBox{
 
  overflow-y: auto;
  width: 100%;
  height: 650px;
 font-size: 14px;

}
.treebox .el-tree{
        display: inline-block;
        min-width: 100%;
        font-size: s;
        
}

.contextmenu {
margin: 0;
background: #fff;
z-index: 1000;
position: fixed; //关键样式设置固定定位
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
}
.contextmenu li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
}
.contextmenu li:hover {
background: #eee;
}
.config_type{
  display: inline-block;
  background: rgb(254, 110, 34);
    color: #fff;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    margin-right: 8px;
}
</style>