目录管理添加批量添加

Surpriseplus

2023-02-07 6c086fae275e7f3579654e374cadb85e7e054949

目录管理添加批量添加

 package.json

@@ -10,7 +10,7 @@
  },
  "dependencies": {
    "@turf/turf": "^6.5.0",
    "@vue/cli-shared-utils": "^5.0.8",
    "aws-sdk": "^2.963.0",
    "axios": "^0.21.1",
    "cesium": "^1.84.0",
    "core-js": "^3.6.5",
@@ -20,17 +20,23 @@
    "element-theme-chalk": "^2.15.10",
    "element-ui": "^2.14.1",
    "esri-loader": "^2.14.0",
    "install": "^0.13.0",
    "jquery": "^3.6.0",
    "moment": "^2.29.4",
    "node-sass": "^7.0.3",
    "npm": "^8.15.1",
    "object-assign": "^4.1.1",
    "ol": "^6.15.1",
    "sql.js": "^1.5.0",
    "sqlite3": "^5.0.2",
    "terraformer-wkt-parser": "^1.2.1",
    "theme-vue": "0.0.8",
    "vant": "^2.12.25",
    "vue": "^2.6.11",
    "vue-i18n": "^8.27.2",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0"
    "vuex": "^3.4.0",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",

 src/App.vue

@@ -1,5 +1,8 @@
<template>
  <div id="app">
  <div
    id="app"

  >
    <router-view />
  </div>
</template>
@@ -14,12 +17,12 @@
    return {};
  },
  created() {

 
  },
  beforeDestroy() {},
  beforeDestroy() { },
};
</script>
<style lang="less">
<style lang="less" scoped>
// #app {
//   font-family: Avenir, Helvetica, Arial, sans-serif;
//   -webkit-font-smoothing: antialiased;
@@ -34,14 +37,9 @@
  scrollbar-face-color: #dfebff;
  /*滚动条整体颜色*/
  scrollbar-track-color: #536c97;
  
}
// ::-webkit-scrollbar-thumb {
//   //滑块部分
//   background-color: #dfebff;
// }
// ::-webkit-scrollbar-track {
//   //轨道部分
//   box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
//   background: #536c97;
// }

 

</style>

 src/assets/css/config.css

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,196 @@
.Black_theme {
    color: white;
}

.Black_theme .box_div {
    background: #303030;
}

.Black_theme .el-menu-item {
    color: white;
}

.Black_theme .el-menu-item:hover {
    background: transparent !important;
}

.Black_theme .el-submenu__title {
    color: white;
}

.Black_theme .el-submenu :hover {
    background: transparent !important;
}

.Black_theme .el-menu-item.is-active {
    color: #409eff;
}

.Black_theme .el-tree {
    color: #FFF;
    background: transparent !important;
}

.Black_theme .el-tree .el-tree-node:focus>.el-tree-node__content {
    background-color: transparent;
}

.Black_theme .el-tree .el-tree-node__content:hover {
    background: transparents !important;
}

.Black_theme .el-tree .el-tree-node__content {
    background: transparents !important;
}

.Black_theme .el-form-item__label {
    color: #FFF !important;
}

.Black_theme .el-tree-node__content:hover {
    background: transparent !important;
}

.Black_theme .el-tree-node__content:hover {
    background: transparent !important;
}

.Black_theme .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
    background: transparent !important;
}

.Black_theme li:hover {
    background: transparent !important;
}

.Black_theme .el-input__inner {
    background-color: transparent !important;
    border: 1px solid;
    color: white;
}

.Black_theme .el-pagination__total {
    color: white;
}

.Black_theme .el-pagination__jump {
    color: white;
}

.Black_theme .el-pager li.active {
    color: #409eff;
}

.Black_theme .el-pager li {
    color: white;
    background: transparent;
}

.Black_theme .el-pager li {
    color: white;
}

.Black_theme .btn-prev {
    background: transparent !important;
}

.Black_theme .btn-next {
    background: transparent !important;
}

.Black_theme .btn-next i {
    color: white;
}

.Black_theme .btn-prev i {
    color: white;
}

.Black_theme .el-dialog {
    background: #303030;

}

.Black_theme .el-dialog {
    background: #303030;

}

.Black_theme .el-dialog__title {
    color: #FFF;
}

.Black_theme .el-table {
    background: transparent;
}

.Black_theme .el-table {
    background: transparent;
}

.Black_theme .el-table td {
    background-color: #303030;
    color: white;
}

.Black_theme .el-table th {
    background-color: #303030;
    color: white;
}

.Black_theme .el-table--enable-row-transition .el-table__body td.el-table__cell {
    background-color: #303030;
}


.Black_theme .el-table tr:hover>td {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.Black_theme .el-table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;

}

.Black_theme .el-select-dropdown {
    background: #303030 !important;
    color: white;
    z-index: 99999999 !important;
    position: absolute;
}

.Black_theme .el-select-dropdown__item {

    color: white;
}

.Black_theme .el-select-dropdown__item.selected {

    color: #409eff;
}

.Black_theme .el-select-dropdown__item.hover {
    background: transparent;
}


.Black_theme .el-textarea__inner {
    background: #303030 !important;
    border: 1px solid white;
    color: white;
}

.Black_theme .el-cascader__panel {
    background: #303030 !important;
}
.Black_theme .el-icon-close {
    color: #FFF !important;
}

.Black_theme .el-icon-plus {
    color: #FFF !important;
}
.Black_theme .el-icon-upload2 {
    color: #FFF !important;
}
 

 src/assets/css/configure.css

@@ -1,21 +1,25 @@
/*  æ»šåŠ¨æ¡æ ·å¼ */
 
::-webkit-scrollbar{
    width:8px;
    height:8px;

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #409eff;
}
::-webkit-scrollbar-track{

::-webkit-scrollbar-track {
    background: #eee;
}
::-webkit-scrollbar-thumb{

::-webkit-scrollbar-thumb {
    background: #409eff;
    border-radius:100px;
    border-radius: 100px;
}
::-webkit-scrollbar-thumb:hover{

::-webkit-scrollbar-thumb:hover {
    background: #409eff;
}
::-webkit-scrollbar-corner{

::-webkit-scrollbar-corner {
    background: #409eff;
}

@@ -23,7 +27,7 @@
.box_div {
    background: #F4F8FF;
}
 

.subpage_Div {
    border: 1px solid #dcdfe6;
}
@@ -33,7 +37,10 @@
}

.el-tree {
    background: transparent;
    background: transparent !important;
}
.el-tree {
    background: transparent !important;
}

.el-tree-node.is-current>.el-tree-node__content {
@@ -44,4 +51,17 @@
.el-tree-node__content :hover {

    background-color: transparent !important;
}

.el-pager li {

    background: transparent;
}

.btn-prev {
    background: transparent !important;
}

.btn-next {
    background: transparent !important;
}

 src/assets/css/content.css

@@ -183,9 +183,7 @@
.infoBox .contentBox {
    margin: 0 aotu 10px;
    overflow: auto;
    height: 500px;
    background-color: white;

    height: 90%;
}

.infoBox p {

 src/components/navMenu.vue

@@ -51,17 +51,22 @@
          </div>

        </div>
        <div
          @click="switchLang"
          class="userLanguage"
        >
        <div class="userLanguage">
          <div class="userImage user2"></div>
          <div class="TextLanguage">
            <el-link
              @click="switchLang"
              :underline="false"
              class="elLink"
            >{{$t("common.language")}}</el-link>
          </div>
          <!-- <div class="TextLanguage">
            <el-link
              @click="themeChange"
              :underline="false"
              class="elLink"
            > ä¸»é¢˜åˆ‡æ¢</el-link>
          </div> -->
        </div>

      </div>
@@ -78,6 +83,7 @@
import colorChange from '../views/maintenance/colorChange.vue';
import { containsCoordinate } from 'ol/extent';
import Vue from 'vue';
import $ from 'jquery'
export default {
  name: 'navMenu',
  //import引入的组件需要注入到对象中才能使用
@@ -87,6 +93,7 @@
  },
  data() {
    return {

      themeColor: true,
      oriData: [], //原始树数据
      dirData: [], //el树数据
@@ -109,7 +116,8 @@
      changeSelectdiv: false,
      listMenu: [],
      showFlag: null,
      language: true
      language: true,

    };
  },
  created() { },
@@ -118,6 +126,16 @@
  },
  computed: {},
  methods: {
    themeChange() {
          this.$store.state.themeflag = !this.$store.state.themeflag;
      if (this.$store.state.themeflag == true) {
        $("#app").addClass("Black_theme");

      } else {
        $("#app").removeClass("Black_theme");
      }

    },
    async getCookies() {
      var boolean = this.getTimeCookies();
      if (boolean != true) {
@@ -128,11 +146,11 @@
        const data = await getPerms();
        this.$store.state.permsEntity = data.result;
      }
 

      this.$store.state.uname = JSON.parse(
        localStorage.getItem('LFToken')
      ).uname;
        this.$store.state.unid = JSON.parse(
      this.$store.state.unid = JSON.parse(
        localStorage.getItem('LFToken')
      ).userid;
      this.$router.push('/');
@@ -238,7 +256,7 @@
        res[i].show = false; //控制显隐
        if (res[i].perms == null) {
          const result = await selectMenuRecursive({ id: res[i].id });

 
          if (result.code == 200) {
            res[i].children = result.result.filter((value) => {
              return value.pid == res[i].id;
@@ -356,6 +374,5 @@
  },
};
</script>
<style lang="less" scoped>

</style>
 
 

 src/main.js

@@ -14,6 +14,7 @@
import '@/assets/css/index.css'
import '@/assets/css/content.css'
import '@/assets/css/configure.css'
import '@/assets/css/config.css'
Vue.prototype.$echarts = echarts;
import * as echarts from 'echarts';
Vue.use(ElementUI, { locale });

 src/store/index.js

@@ -52,6 +52,7 @@
    pipelineEntity: [],
    reporturl: null,
    layerMnage: false,
    themeflag:false,
  },
  mutations: {
    //获取权限合集

 src/views/AuthorizationManagement/roleMenuAuthorization.vue

@@ -45,7 +45,6 @@
          style="width: 100%"
          @row-click="singleElection"
          highlight-current-row
   
        >
          <el-table-column
            align="center"
@@ -533,8 +532,8 @@
      padding: 10px;
      width: 30%;
      height: 94%;
 overflow-y: auto;
 overflow-x: hidden;
      overflow-y: auto;
      overflow-x: hidden;
      border-radius: 5px;
    }
  }

 src/views/datamanage/SpatialData.vue

@@ -392,6 +392,7 @@
          tabDesc: '基础数据',
          label: '基础数据',
          value: 'BD',
          ns: 'bd',
          id: 1,
          children: [],
        },
@@ -400,12 +401,14 @@
          tabDesc: '业务数据',
          label: '业务数据',
          value: 'BS',
          ns: 'bs',
          children: [],
        }, {
          id: 3,
          tabDesc: '元数据',
          label: '元数据',
          value: 'MD',
          ns: 'md',
          children: [],
        },
      ],
@@ -614,12 +617,17 @@
        // val_Data.label = val_Data.tabDesc + "(" + val_Data.tab + ")"
        val_Data.label = val_Data.tabDesc
        option[i].id = parseInt(option[i].id)
        if (option[i].ns == 'bd') {

          this.tree[0].children.push(val_Data);
        } else {
          this.tree[1].children.push(val_Data);
        for (var j in this.tree) {
          if (this.tree[j].ns == option[i].ns) {
            this.tree[j].children.push(val_Data);
          }
        }
        // if (option[i].ns == 'bd') {

        //   this.tree[0].children.push(val_Data);
        // } else {
        //   this.tree[1].children.push(val_Data);
        // }
      }
      this.handleNodeClick(this.tree[0].children[0])
    },
@@ -1116,6 +1124,5 @@
      overflow-y: auto;
    }
  }
 
}
</style>

 src/views/datamanage/catalogueManage.vue

@@ -30,46 +30,84 @@
          }}</el-breadcrumb-item>
          </el-breadcrumb>
          <div>
            <el-button
              v-if="menuStatus.update"
              :disabled="itemdetail.pid == null ? true : false"
              @click="setEditNode(1)"
              type="info"
              icon="el-icon-top"
              size="small"
            >向上移动</el-button>
            <el-button
              v-if="menuStatus.update"
              :disabled="itemdetail.pid == null ? true : false"
              @click="setEditNode(2)"
              type="info"
              icon="el-icon-bottom"
              size="small"
            >向下移动</el-button>
            <el-button
              v-if="menuStatus.insert"
              :disabled="itemdetail.pid == null ? true : false"
              @click="setNewNode(1)"
              type="success"
              icon="el-icon-plus"
              size="small"
            >新增同级</el-button>
            <el-button
              v-if="menuStatus.insert"
              :disabled="itemdetail.pid == null ? true : false"
              @click="setNewNode(2)"
              type="success"
              icon="el-icon-plus"
              size="small"
            >新增子级</el-button>
            <el-button
              v-if="menuStatus.delete"
              @click="setDelNode()"
              :disabled="itemdetail.pid == null ? true : false"
              type="danger"
              icon="el-icon-delete"
              size="small"
            >删除</el-button>

            <div class="menuTop">
              <el-form
                :inline="true"
                class="demo-form-inline"
              >
                <el-form-item>

                  <el-upload
                    action
                    accept=".xlsx, .xls"
                    :auto-upload="false"
                    :show-file-list="false"
                    :on-change="handleChange"
                    :file-list="fileList"
                  >
                    <el-button
                      type="info"
                      icon="el-icon-plus"
                      size="small"
                    >上传文件</el-button>
                  </el-upload>

                </el-form-item>
                <el-form-item>
                  <el-button
                    v-if="menuStatus.update"
                    :disabled="itemdetail.pid == null ? true : false"
                    @click="setEditNode(1)"
                    type="info"
                    icon="el-icon-top"
                    size="small"
                  >向上移动</el-button>
                </el-form-item>
                <el-form-item>
                  <el-button
                    v-if="menuStatus.update"
                    :disabled="itemdetail.pid == null ? true : false"
                    @click="setEditNode(2)"
                    type="info"
                    icon="el-icon-bottom"
                    size="small"
                  >向下移动</el-button>
                </el-form-item>
                <el-form-item>
                  <el-button
                    v-if="menuStatus.insert"
                    :disabled="itemdetail.pid == null ? true : false"
                    @click="setNewNode(1)"
                    type="success"
                    icon="el-icon-plus"
                    size="small"
                  >新增同级</el-button>
                </el-form-item>
                <el-form-item>
                  <el-button
                    v-if="menuStatus.insert"
                    :disabled="itemdetail.pid == null ? true : false"
                    @click="setNewNode(2)"
                    type="success"
                    icon="el-icon-plus"
                    size="small"
                  >新增子级</el-button>
                </el-form-item>
                <el-form-item>
                  <el-button
                    v-if="menuStatus.delete"
                    @click="setDelNode()"
                    :disabled="itemdetail.pid == null ? true : false"
                    type="danger"
                    icon="el-icon-delete"
                    size="small"
                  >删除</el-button>
                </el-form-item>

              </el-form>
            </div>

          </div>
        </div>
        <el-divider />
@@ -207,7 +245,9 @@
  deleteDir,
  getPerms,
} from '../../api/api';
import * as XSLX from 'xlsx';
import MyBread from '../../components/MyBread.vue';
import clone from '@turf/clone';
export default {
  name: 'catalogueManage',
  components: {
@@ -256,9 +296,129 @@
      },
      newNode: null,
      expandData: [],
      fileList: [],
      file: null,
      tableData: [],
    };
  },
  methods: {
    handleChange(file, fileList) {
      this.file = file;
      if (fileList.length > 0) {
        this.fileList = [fileList[fileList.length - 1]]; //这一步，是 å±•ç¤ºæœ€åŽä¸€æ¬¡é€‰æ‹©æ–‡ä»¶;
        this.handle();
      }
    },
    async handle() {
      let file = this.file?.raw;
      if (!this.file) {
        console.log("文件打开失败");
        return;
      } else {
        const reader = new FileReader();
        let that = this;
        reader.readAsArrayBuffer(file);
        reader.onload = function () {
          const buffer = reader.result;
          const bytes = new Uint8Array(buffer);
          const length = bytes.byteLength;
          let binary = "";
          for (let i = 0; i < length; i++) {
            binary += String.fromCharCode(bytes[i]);
          }
          const XLSX = require("xlsx");
          const wb = XLSX.read(binary, {
            type: "binary"
          });
          const outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]], { defval: null }); // é»˜è®¤ç¬¬ä¸€è¡Œä¸‹ä¸ºç©ºä¹Ÿèƒ½è§£æžå‡ºç¬¬ä¸€å››è¡Œ
          var data = [...outdata];
          const arr = [];
          data.map(v => {
            const obj = {};
            obj.name = v.name;
            obj.pname = v.pname;
            obj.descr = v.explain;
            obj.bak = v.bak;
            obj.orderNum = null;
            obj.pid = null;
            arr.push(obj);
          });
          that.tableData = arr
          that.setInsertData(that.tableData)
        }
      }
    },
    setInsertData(res) {
      var list = this.excelData(res);

      if (list.length != 0) {
        if (list[0].pname != null) {
          return this.$message.error('上传数据错误，第一条数据不为空');
        }

        this.getAllNodeId(list)
      }
    },
    async getAllNodeId(res) {
      for (let i = 0; i < res.length; i++) {

        var val = res[i];

        if (val.pname == null) {
          val.orderNum = this.dirList[this.dirList.length - 1].orderNum + 1;
          val.pid = 0;
        } else {
          this.tableData.filter((child) => {
            if (child.name == val.pname) {

              val.pid = child.id;
              val.orderNum = i + 1;
            }
          })
        }

        const data = await insertDir(val);
        if (data.code != 200) {

        }
        this.tableData.filter((child) => {
          if (child.name == val.name && child.pname == val.pname) {
            child.id = data.result;
          }
        })
        this.itemaName = data.result;
        this.getDirTree();



        if (res[i].children) {
          this.getAllNodeId(res[i].children)
        }
      }
    },
    excelData(source) {
      let cloneData = JSON.parse(JSON.stringify(source)); // å¯¹æºæ•°æ®æ·±åº¦å…‹éš†
      return cloneData.filter((father) => {
        // å¾ªçŽ¯æ‰€æœ‰é¡¹
        let branchArr = cloneData.filter((child) => father.name == child.pname); // å¯¹æ¯”ID，分别上下级菜单，并返回数据

        branchArr.length > 0 ? (father.children = branchArr) : ''; // ç»™çˆ¶çº§æ·»åŠ ä¸€ä¸ªchildren属性，并赋值
        // å±žäºŽåŒä¸€å¯¹è±¡é—®é¢˜ï¼Œä¾‹å¦‚：令 a=b、c=1 ï¼Œç„¶åŽå†ä»¤ b.c=c ï¼Œ é‚£ä¹ˆ a.c=b.c=c=1 ï¼›åŒç†ï¼ŒåŽç»­ä»¤ c.d=2 ,那么 a.c.d ä¹Ÿæ˜¯=2；
        // ç”±æ­¤å¾ªçŽ¯å¤šæ¬¡åŽï¼Œå°±èƒ½å½¢æˆç›¸åº”的树形数据结构
        return father.pname == null; // è¿”回一级菜单
      });
    },
    readFile(file) {
      //文件读取
      return new Promise(resolve => {
        let reader = new FileReader();
        reader.readAsBinaryString(file); //以二进制的方式读取
        reader.onload = ev => {
          resolve(ev.target.result);
        };
      });
    },

    // è¯·æ±‚目录树
    getDirTree() {
      //获取目录树最大ID，新建节点使用
@@ -461,8 +621,8 @@
      });
    },
    remove(node, data) {
      this.itemaName =node.parent.data.id;
 
      this.itemaName = node.parent.data.id;

      this.$confirm('此操作将删除该节点, æ˜¯å¦ç»§ç»­?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
@@ -505,7 +665,6 @@
              this.$message.error('删除失败');
              this.itemdetail = {};
            });

          //重置要删除的子ID
          this.delChildIDs = [];
        })
@@ -673,7 +832,7 @@
      }
      for (var i = 0; i < permsEntity.length; i++) {
        if (val === permsEntity[i].perms) {
          console.log(i, permsEntity[i])

          this.showPermsMenu(permsEntity[i]);
        }
      }
@@ -708,6 +867,11 @@
      height: 91%;
      border-radius: 5px;
      padding: 1%;
      .menuTop {
        /deep/ .el-form-item {
          margin-bottom: 0px;
        }
      }
    }
  }
}

 src/views/datamanage/dataUpdata.vue

@@ -30,6 +30,8 @@
                :disabled="tableData.length == 0 ? false : true"
                v-model="formInline.uploadType"
                @change="uploadTypeChange"

                :popper-append-to-body="false"
                placeholder="请选择"
              >
                <el-option
@@ -950,16 +952,20 @@
      :close-on-click-modal="false"
      title="上传进度"
      :visible.sync="jindudialogVisible"
      width="30%">
      width="30%"
    >
      <div>
        <div>
          æ–‡ä»¶ä¼ è¾“进度：
        </div>
        <div>
          <el-progress :percentage="jindutiao" :format="format"></el-progress>
          <el-progress
            :percentage="jindutiao"
            :format="format"
          ></el-progress>
        </div>
      </div>
      

    </el-dialog>
  </div>
</template>
@@ -1807,24 +1813,24 @@
          this.$message.error('数据上传失败');
        },
        xhr: function () {
            var myXhr = $.ajaxSettings.xhr();
            if (myXhr.upload) { //检查upload属性是否存在
                myXhr.upload.addEventListener('progress', that.progressHandlingFunction, false); //绑定progress事件的回调函数
            }
            return myXhr; //xhr对象返回给jQuery使用
          var myXhr = $.ajaxSettings.xhr();
          if (myXhr.upload) { //检查upload属性是否存在
            myXhr.upload.addEventListener('progress', that.progressHandlingFunction, false); //绑定progress事件的回调函数
          }
          return myXhr; //xhr对象返回给jQuery使用
        }
      });
    },
      progressHandlingFunction(event) {
        var loaded = event.loaded;//已上传
        var loaded = Math.floor(100 * (event.loaded / event.total) - 1); //计算已经上传的百分比
        $("#prog").html(loaded + "%"); //应用到显示UI，可根据自己需要修改
        this.jindutiao = loaded
        this.$set(this, 'jindutiao', loaded)
      },
      format(percentage) {
        return percentage === 100 ? '上传完毕' : `${percentage}%`;
      },
    progressHandlingFunction(event) {
      var loaded = event.loaded;//已上传
      var loaded = Math.floor(100 * (event.loaded / event.total) - 1); //计算已经上传的百分比
      $("#prog").html(loaded + "%"); //应用到显示UI，可根据自己需要修改
      this.jindutiao = loaded
      this.$set(this, 'jindutiao', loaded)
    },
    format(percentage) {
      return percentage === 100 ? '上传完毕' : `${percentage}%`;
    },
    //获取文件上传路径
    async getFilePath() {
      const res = await dataUploadSelectPath();
@@ -2248,3 +2254,4 @@
  }
};
</script>
 

 src/views/datamanage/styleDirTree.vue

@@ -318,37 +318,7 @@
    height: 94%;
    overflow: auto;

    .el-tree {
      background: transparent;
      font-size: 15px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #000000;

      // /deep/ .el-tree-node__label {
      //   font-size: 18px;
      // }
      /deep/ .el-tree-node {
        padding-top: 10px;
        // padding-bottom: 10px;
      }

      /deep/ .el-tree-node:focus > .el-tree-node__content {
        background-color: #b9b9b9;
      }

      /deep/ .el-tree-node__content:hover {
        background-color: rgb(153, 153, 153);
      }

      .btnBox {
        margin-left: 5px;

        .el-button + .el-button {
          margin-left: 5px;
        }
      }
    }
    
  }
}
</style>

 src/views/maintenance/menuSettings.vue

@@ -121,6 +121,7 @@
            >
              <el-select
                style="width: 400px"
                :popper-append-to-body="false"
                v-model="itemdetail.isShow"
                placeholder=""
              >
@@ -158,6 +159,7 @@
            >
              <el-select
                style="width: 400px"
                :popper-append-to-body="false"
                v-model="itemdetail.type"
                :placeholder="$t('common.choose')"
              >
@@ -246,6 +248,8 @@
          :label-width="formLabelWidth"
        >
          <el-select
            :popper-append-to-body="false"
            style="width:100%"
            v-model="ruleForm.isShow"
            placeholder=""
          >
@@ -282,6 +286,8 @@
          :label-width="formLabelWidth"
        >
          <el-select
            :popper-append-to-body="false"
            style="width:100%"
            v-model="ruleForm.type"
            :placeholder="$t('common.choose')"
          >

 src/views/maintenance/mochaitmo.vue

@@ -117,8 +117,53 @@
  created() { },
  mounted() {
    this.getTreeData();
    //左右拖動
    this.dragControllerDiv();
  },
  methods: {
    //左右拖動
    dragControllerDiv: function () {
      var resize = document.getElementsByClassName('resize');
      var left = document.getElementsByClassName('left');
      var mid = document.getElementsByClassName('mid');
      var box = document.getElementsByClassName('box');
      for (let i = 0; i < resize.length; i++) {
        // é¼ æ ‡æŒ‰ä¸‹äº‹ä»¶
        resize[i].onmousedown = function (e) {
          //颜色改变提醒
          resize[i].style.background = '#818181';
          var startX = e.clientX;
          resize[i].left = resize[i].offsetLeft;
          // é¼ æ ‡æ‹–动事件
          document.onmousemove = function (e) {
            var endX = e.clientX;
            var moveLen = resize[i].left + (endX - startX); // ï¼ˆendx-startx）=移动的距离。resize[i].left+移动的距离=左边区域最后的宽度
            var maxT = box[i].clientWidth - resize[i].offsetWidth; // å®¹å™¨å®½åº¦ - å·¦è¾¹åŒºåŸŸçš„宽度 = å³è¾¹åŒºåŸŸçš„宽度

            if (moveLen < 205) moveLen = 205; // å·¦è¾¹åŒºåŸŸçš„最小宽度为32px
            if (moveLen > maxT - 300) moveLen = maxT - 300; //右边区域最小宽度为150px

            resize[i].style.left = moveLen; // è®¾ç½®å·¦ä¾§åŒºåŸŸçš„宽度

            for (let j = 0; j < left.length; j++) {
              left[j].style.width = moveLen + 'px';
              mid[j].style.width = (box[i].clientWidth - moveLen - 10) + 'px';
            }
          };
          // é¼ æ ‡æ¾å¼€äº‹ä»¶
          document.onmouseup = function (evt) {
            //颜色恢复
            resize[i].style.background = '#d6d6d6';
            document.onmousemove = null;
            document.onmouseup = null;
            resize[i].releaseCapture && resize[i].releaseCapture(); //当你不在需要继续获得鼠标消息就要应该调用ReleaseCapture()释放掉
          };
          resize[i].setCapture && resize[i].setCapture(); //该函数在属于当前线程的指定窗口里设置鼠标捕获
          return false;
        };
      }
    },

    async getCookies() {
      var boolean = this.getTimeCookies();
      if (boolean != true) {

 src/views/userManage/resourceManage.vue

@@ -144,93 +144,93 @@
      class="infoBox box_div "
      v-show="showinfoBox"
    >
      <el-card class="box-card">

      <div
        slot="header"
        class="clearfix"
      >
        <span>{{ $t('dataManage.styleObj.deInformation') }}</span>
        <div
          slot="header"
          class="clearfix"
          style="float: right; cursor: pointer"
          @click="closeDetial"
        >
          <span>{{ $t('dataManage.styleObj.deInformation') }}</span>
          <div
            style="float: right; cursor: pointer"
            @click="closeDetial"
          >
            <i class="el-icon-close"></i>
          </div>
          <i class="el-icon-close"></i>
        </div>
      </div>
      <el-divider></el-divider>
      <div class="contentBox">
        <p>
          <label> {{ $t('userManage.resManageObj.name') }}:</label>
          <label class="boxlabel">{{ itemdetail.name }}</label>
        </p>
        <el-divider></el-divider>
        <div class="contentBox">
          <p>
            <label> {{ $t('userManage.resManageObj.name') }}:</label>
            <label class="boxlabel">{{ itemdetail.name }}</label>
          </p>
          <el-divider></el-divider>
          <p>
          <p>
            <label> {{ $t('userManage.resManageObj.server') }}:</label>
            <label class="boxlabel">{{ itemdetail.server }}</label>
          </p>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.source') }}:</label>
            <label class="boxlabel">{{ itemdetail.source }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.depid') }}:</label>
            <label class="boxlabel">{{ itemdetail.depName }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.dirid') }}:</label>
            <label class="boxlabel">{{ itemdetail.dirName }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.descr') }}:</label>
            <label class="boxlabel">{{ itemdetail.descr }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.img') }}:</label>
            <label class="boxlabel">
              <div style="width:440px;height:200px;">
                <img
                  style="width:100%; height:100%"
                  :src="itemdetail.imageFile"
                  alt=""
                />
              </div>
            </label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.createUser') }}:</label>
            <label class="boxlabel">{{ itemdetail.createUser }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.createTime') }}:</label>
            <label class="boxlabel">{{ itemdetail.createTime }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.updateUser') }}:</label>
            <label class="boxlabel">{{ itemdetail.updateUser }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.updateTime') }}:</label>
            <label class="boxlabel">{{ itemdetail.updateTime }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            <label> {{ $t('userManage.resManageObj.bak') }}:</label>
            <label class="boxlabel">{{ itemdetail.bak }}</label>
          </p>
          <el-divider></el-divider>
        </div>
      </el-card>
        <p>
        <p>
          <label> {{ $t('userManage.resManageObj.server') }}:</label>
          <label class="boxlabel">{{ itemdetail.server }}</label>
        </p>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.source') }}:</label>
          <label class="boxlabel">{{ itemdetail.source }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.depid') }}:</label>
          <label class="boxlabel">{{ itemdetail.depName }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.dirid') }}:</label>
          <label class="boxlabel">{{ itemdetail.dirName }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.descr') }}:</label>
          <label class="boxlabel">{{ itemdetail.descr }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.img') }}:</label>
          <label class="boxlabel">
            <div style="width:440px;height:200px;">
              <img
                style="width:100%; height:100%"
                :src="itemdetail.imageFile"
                alt=""
              />
            </div>
          </label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.createUser') }}:</label>
          <label class="boxlabel">{{ itemdetail.createUser }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.createTime') }}:</label>
          <label class="boxlabel">{{ itemdetail.createTime }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.updateUser') }}:</label>
          <label class="boxlabel">{{ itemdetail.updateUser }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.updateTime') }}:</label>
          <label class="boxlabel">{{ itemdetail.updateTime }}</label>
        </p>
        <el-divider></el-divider>
        <p>
          <label> {{ $t('userManage.resManageObj.bak') }}:</label>
          <label class="boxlabel">{{ itemdetail.bak }}</label>
        </p>
        <el-divider></el-divider>
      </div>

    </div>
    <el-dialog
      :title="dialogTitle"
@@ -894,16 +894,16 @@
  height: 98%;
  width: 98%;
  padding: 1%;
 

  .el-input {
    width: 730px;
  }
 

  .power_quire {
    padding: 10px;

    border-radius: 5px;
    

    margin-bottom: 10px;
    .el-form-item {
      margin: 5px;
@@ -912,8 +912,7 @@
      width: 467px;
    }
  }
 
 

  .leftTree {
    position: absolute;
    z-index: 10;
@@ -922,19 +921,18 @@
    left: 800px;
    width: 400px;
    height: 600px;
  

    .treeBox {
      height: 550px;
      overflow: auto;
    
    }
    .btnBox {
      width: 160px;
      margin: 10px auto 0;
      // background-color: red;
    }
   
  }
 
 
}
</style>