From 1494c7949d90e1e8407b71606947dc8d9cb60778 Mon Sep 17 00:00:00 2001
From: lxl <lixuliang_hd@126.com>
Date: 星期三, 12 十月 2022 10:58:38 +0800
Subject: [PATCH] 1

---
 src/store/index.js                           |   14 
 src/router/index.js                          |    1 
 src/views/maintenance/databaseMonitoring.vue |   25 
 src/api/api.js                               |   51 
 src/components/catalogueTree.vue             |  115 -
 src/assets/lang/zh.js                        |   18 
 src/views/userManage/orgManage.vue           | 1081 +++++++------------
 src/components/customElMenu.vue              |   45 
 src/views/datamanage/catalogueManage.vue     |  525 +++++++-
 src/assets/lang/en.js                        |   17 
 src/views/userManage/userInfoManage.vue      |  604 ++--------
 src/views/maintenance/menuSettings.vue       |  514 +++++---
 src/components/navMenu.vue                   |  278 +---
 13 files changed, 1,543 insertions(+), 1,745 deletions(-)

diff --git a/src/api/api.js b/src/api/api.js
index 374c747..bf869b5 100644
--- a/src/api/api.js
+++ b/src/api/api.js
@@ -159,18 +159,7 @@
   return request.get('/sign/logout', { params: params });
 }
 
-//璇锋眰鐩綍鏍戞暟鎹�
-export function queryDirTree() {
-  return service.get('/dir/selectDirAll');
-}
-//鏇存柊鍗曟潯鐩綍鏍�
-export function updateDirTree(params) {
-  return service.post('/dir/updateDir', params);
-}
-//鏇存柊鏁翠綋鐩綍鏍�
-export function updateDirTrees(params) {
-  return service.post('/dir/updateDirs', params);
-}
+
 //璇锋眰鑿滃崟鏍忔暟鎹�
 export function queryMenuTree() {
   return request.get('/Menu/selectMenuAll');
@@ -183,25 +172,43 @@
 export function updateMenuTrees(params) {
   return request.post('/Menu/updateMenus', params);
 }
+
+//璇锋眰鐩綍鏍戞暟鎹�
+export function queryDirTree() {
+  return request.get('/dir/selectDirAll');
+}
+//鏂板鍗曟潯鐩綍
+export function insertDir(params) {
+  return request.post('/dir/insertDir', params);
+}
+//鍒犻櫎澶氭潯鐩綍
+export function deleteDir(params) {
+  return request.get('/dir/deleteDirs?' + params);
+}
+//鏇存柊鍗曟潯鐩綍鏍�
+export function updateDirTree(params) {
+  return request.post('/dir/updateDir', params);
+}
+//鏇存柊鏁翠綋鐩綍鏍�
+export function updateDirTrees(params) {
+  return request.post('/dir/updateDirs', params);
+}
+
+
 //璇锋眰鍗曚綅鏍�
 export function queryDepTree() {
-  return service.get('/dep/selectDepAll');
+  return request.get('/dep/selectDepAll');
 }
 //鏇存柊鍗曟潯鍗曚綅鏁版嵁
 export function updateDepTree(params) {
-  return service.post('/dep/updateDep', params);
+  return request.post('/dep/updateDep', params);
 }
 //鏇存柊鏁翠綋鍗曚綅鏍�
 export function updateDepTrees(params) {
-  return service.post('/dep/updateDeps', params);
+  return request.post('/dep/updateDeps', params);
 }
 
 // 璇锋眰鐢ㄦ埛绠$悊鏁版嵁
-export function queryPageUser(pageIndex, pageSize) {
-  return service.get(
-    '/user/selectByPageAndCount?pageIndex=' +
-      pageIndex +
-      '&pageSize=' +
-      pageSize
-  );
+export function queryPageUser(params) {
+  return request.get('/user/selectByPageAndCount', { params: params });
 }
diff --git a/src/assets/lang/en.js b/src/assets/lang/en.js
index 3c2eb48..65ef71e 100644
--- a/src/assets/lang/en.js
+++ b/src/assets/lang/en.js
@@ -18,6 +18,7 @@
     preservation: 'Preservation',
     close: 'Close',
     see: 'See',
+    index: 'index',
   },
   dataManage: {
     dataManage: 'Data Manage',
@@ -368,9 +369,23 @@
       delete: 'Delete',
       apply: 'Apply',
       rejection: 'Rejection',
-      companyName: 'Company name',
+      depName: 'department name',
       userexport: 'Excel user export',
       userinput: 'Excel user input',
+      userStatus: "User Status",
+      addr: "address",
+      bak: "notes",
+      contact: "contact",
+      edu: "education",
+      email: "email",
+      idcard: "idcard",
+      job: "job",
+      natives: "natives",
+      pwd: "password",
+      sex: "gender",
+      status: "status",
+      uname: "username",
+      depid: "department",
       chineseName: 'Chinese Name [User Name]',
       affiliatedUnit: 'Affiliated unit [on-the-job]',
       mobileNumber: 'Mobile number [receive SMS]',
diff --git a/src/assets/lang/zh.js b/src/assets/lang/zh.js
index 284f81c..daae6e2 100644
--- a/src/assets/lang/zh.js
+++ b/src/assets/lang/zh.js
@@ -18,6 +18,8 @@
     preservation: '淇濆瓨',
     close: '鍏抽棴',
     see: '鏌ョ湅',
+    index: '搴忓彿',
+
   },
   dataManage: {
     dataManage: '鏁版嵁绠$悊',
@@ -370,9 +372,23 @@
       delete: '鍒犻櫎',
       apply: '鐢宠',
       rejection: '鎷掓壒',
-      companyName: '鍗曚綅鍚嶇О',
+      depName: '鍗曚綅鍚嶇О',
       userexport: 'Excel鐢ㄦ埛瀵煎嚭',
       userinput: 'Excel鐢ㄦ埛瀵煎叆',
+      userStatus: "鐢ㄦ埛鐘舵��",
+      uname: "鐢ㄦ埛鍚�",
+      pwd: "瀵嗙爜",
+      sex: "鎬у埆",
+      natives: "绫嶈疮",
+      idcard: "璇佷欢鍙�",
+      job: "宸ヤ綔",
+      edu: "鏁欒偛",
+      addr: "鍦板潃",
+      email: "鐢靛瓙閭欢",
+      contact: "鑱旂郴鏂瑰紡",
+      status: "鐘舵��",
+      bak: "澶囨敞",
+      depid: "鎵�灞為儴闂�",
       chineseName: '涓枃鍚峓鐢ㄦ埛鍚峕',
       affiliatedUnit: '鎵�灞炲崟浣峓鍦ㄨ亴]',
       mobileNumber: '鎵嬫満鍙穂鎺ユ敹鐭俊]',
diff --git a/src/components/catalogueTree.vue b/src/components/catalogueTree.vue
index 75b3536..756d757 100644
--- a/src/components/catalogueTree.vue
+++ b/src/components/catalogueTree.vue
@@ -1,10 +1,5 @@
 <template>
   <div class="wrap">
-    <div class="bread">
-      <el-breadcrumb separator="el-icon-arrow-right">
-        <el-breadcrumb-item>{{ breadLabel }}</el-breadcrumb-item>
-      </el-breadcrumb>
-    </div>
     <div class="treeBox">
       <el-tree
         ref="tree"
@@ -15,12 +10,11 @@
         :default-expanded-keys="[1, 2, 3, 4, 5, 6, 7, 8, 9]"
         :draggable="draggable"
         @node-drag-start="handleDragStart"
-        @node-click="handleNodeClick"
         @node-drop="handleDrop"
       >
         <span class="custom-tree-node" slot-scope="{ node, data }">
           <span>{{ node.label }}</span>
-          <span class="btnBox" v-show="showEdit">
+          <span class="btnBox">
             <el-button type="text" size="mini" @click="() => append(data)">
               <i class="el-icon-circle-plus"></i>
             </el-button>
@@ -34,10 +28,8 @@
           </span>
         </span>
       </el-tree>
-      <!-- <div style="margin-left:130px;">
-        <el-button @click="sendChange">淇濆瓨</el-button>
-      </div> -->
     </div>
+    <button @click="sendChange">淇濆瓨</button>
   </div>
 </template>
 
@@ -45,25 +37,20 @@
 import {
   queryDirTree,
   queryMaxId,
-  updateDirTree,
-  deleteDirTree,
+  updateDirTrees,
+  // deleteDirTree,
 } from "../api/api";
 export default {
   name: "catalogueTree",
   props: ["showBtn"],
   data() {
     return {
-      draggable: false,
+      draggable: true,
       id: null,
-      showEdit: false,
-      showBread: false,
       oriData: [], //鍘熷鏍戞暟鎹�
       dirData: [], //el鏍戞暟鎹�
       old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�)
       newData: [], //鎷栧姩鍚庡師濮嬫暟鎹�
-      breadList: [], //闈㈠寘灞戞暟缁�
-      breadLabel: "", //闈㈠寘灞戞枃瀛�
-      filterText: "",
       defaultProps: {
         children: "children",
         label: "name",
@@ -75,17 +62,16 @@
     // 璇锋眰鐩綍鏍�
     getDirTree() {
       //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
-      queryMaxId().then((res) => {
-        this.id = res.data;
-      });
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
       // 鑾峰彇鐩綍鏍戞暟鎹�
       queryDirTree().then((res) => {
         // console.log(res);
-        if (res.status == 200) {
-          this.oriData = res.data;
-          this.newData = res.data;
-          this.dirData = this.treeData(res.data);
-          // console.log(this.treeData(this.dirData));
+        if (res.code == 200) {
+          this.oriData = res.result;
+          this.newData = res.result;
+          this.dirData = this.treeData(res.result);
         } else {
           console.log("鎺ュ彛鎶ラ敊");
         }
@@ -99,7 +85,7 @@
         branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
         // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛�
         // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋�
-        return father.pid == -1; // 杩斿洖涓�绾ц彍鍗�
+        return father.pid == 0; // 杩斿洖涓�绾ц彍鍗�
       });
     },
     append(data) {
@@ -113,7 +99,7 @@
             name: value,
             pid: data.id,
             // children: [],
-            oid: data.children ? data.children.length + 1 : 1,
+            orderNum: data.children ? data.children.length + 1 : 1,
           };
           this.id = newChild.id; //淇敼鏂扮殑鏈�澶
           console.log(newChild);
@@ -123,7 +109,7 @@
           }
           data.children.push(newChild);
           this.newData.push(newChild);
-          this.sendChange();
+          // this.sendChange();
         })
         .catch(() => {
           this.$message({
@@ -147,7 +133,7 @@
           for (var i in res) {
             std.push(res[i].id);
           }
-          deleteDirTree(std);
+          // deleteDirTree(std);
           this.getDirTree();
           this.$message({
             type: "success",
@@ -185,73 +171,39 @@
         return p.concat(v.children ? this.flaten(v.children).concat(v) : v);
       }, []);
     },
-    handleNodeClick(data) {
-      // console.log(data);
-      this.$store.commit("changeNode", data);
-      this.breadList = [];
-      this.getTreeNode(this.$refs.tree.getNode(data.id));
-    },
-    getTreeNode(node) {
-      if (node && node.label) {
-        this.breadList.unshift(node.label);
-        this.getTreeNode(node.parent); //閫掑綊
-        this.breadLabel = this.breadList.join(">");
-        this.$store.commit("changeCata", this.breadLabel);
-      }
-    },
     handleDragStart(node, ev) {
       this.old_dirDat = JSON.parse(JSON.stringify(this.dirData)); //灏嗗浠界殑dir閲嶆柊璧嬪��
     },
-
     handleDrop(draggingNode, dropNode, dropType, ev) {
-      // console.log("琚嫋鎷借妭鐐�", draggingNode);
-      // console.log("杩涘叆鐨勮妭鐐�", dropNode);
-      // console.log("鏀剧疆浣嶇疆", dropType);
-      // console.log("浜嬩欢", ev);
-      // if (dropType !== "inner") {
-      //   // 1.淇敼鐖惰妭鐐筽id
-      //   draggingNode.data.pid = dropNode.data.pid;
-      //   dropNode.parent.childNodes.forEach((item, index) => {
-      //     // 2.淇敼鑷韩椤哄簭oid
-      //     item.data.oid = index + 1;
-      //   });
-      // }
-      // // console.log(draggingNode.data.id);
-      // let res = this.oriData.filter((item) => item.id == draggingNode.data.id);
-      // console.log(res);
       this.$confirm("姝ゆ搷浣滃皢淇濆瓨鐩綍鏇存敼, 鏄惁缁х画?", "鎻愮ず", {
         confirmButtonText: "纭畾",
         cancelButtonText: "鍙栨秷",
         type: "warning",
       })
         .then(() => {
-          let paramData = [];
+          //鐖惰妭鐐�
           let data = dropType != "inner" ? dropNode.parent.data : dropNode.data;
+          // 鐖惰妭鐐逛腑鍏ㄩ儴瀛愯妭鐐�
           let nodeData =
             dropNode.level == 1 && dropType != "inner" ? data : data.children;
-          let pid = "";
+          //鍙樻洿鑺傜偣
           nodeData.forEach((item, i) => {
             if (dropType != "inner") {
               if (draggingNode.data.pid === dropNode.data.pid) {
-                pid = item.pid;
+                item.pid = item.pid;
               } else {
-                pid = dropNode.data.pid;
+                item.pid = dropNode.data.pid;
               }
             } else {
-              pid = data.id;
+              item.pid = data.id;
             }
-            let collection = {
-              id: item.id,
-              name: item.name,
-              pid,
-              oid: i + 1,
-            };
-            paramData.push(collection);
+            item.orderNum = i + 1;
           });
-          // console.log(paramData);
+          // console.log(nodeData);
+          //鏇存柊鍘熷鏁翠綋鏁版嵁
           let arr = [];
           this.oriData.forEach((e) => {
-            paramData.forEach((item) => {
+            nodeData.forEach((item) => {
               if (item.id === e.id) {
                 e = item;
               }
@@ -259,11 +211,6 @@
             arr.push(e);
           });
           this.newData = arr;
-          this.sendChange();
-          this.$message({
-            type: "success",
-            message: "鏇存敼鎴愬姛!",
-          });
         })
         .catch(() => {
           this.$message({
@@ -273,9 +220,8 @@
           this.dirData = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪��
         });
     },
-
     sendChange() {
-      updateDirTree(this.newData).then((res) => {
+      updateDirTrees(this.newData).then((res) => {
         console.log(res);
         if (res.status == 200) {
           this.$message({
@@ -294,15 +240,8 @@
       immediate: true,
       handler(val) {
         if (val) {
-          this.showEdit = val;
           this.draggable = val;
         }
-      },
-    },
-    showBread: {
-      immediate: true,
-      handler(val) {
-        if (val) this.showBread = val;
       },
     },
   },
diff --git a/src/components/customElMenu.vue b/src/components/customElMenu.vue
new file mode 100644
index 0000000..f6f38fb
--- /dev/null
+++ b/src/components/customElMenu.vue
@@ -0,0 +1,45 @@
+<template>
+  <div class="faSub">
+    <template v-for="item in menuData">
+      <el-submenu
+        v-if="item.children && item.children.length > 0"
+        :key="item.id"
+        :index="item.id + ''"
+      >
+        <template slot="title">{{
+          $store.state.lang == "zh" ? item.cnName : item.enName
+        }}</template>
+        <MenuTree :menuData="item.children"></MenuTree>
+      </el-submenu>
+      <el-menu-item
+        v-else
+        :key="item.id"
+        :index="item.url == null ? null : item.url + ''"
+      >
+        <span slot="title">{{
+          $store.state.lang == "zh" ? item.cnName : item.enName
+        }}</span>
+      </el-menu-item>
+    </template>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["menuData"],
+  name: "MenuTree",
+  data() {
+    return {
+      name: "",
+    };
+  },
+};
+</script>
+<style lang="less" scoped>
+.faSub {
+  /deep/ .el-submenu__title i {
+    background-color: transparent !important;
+    color: #fff;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/navMenu.vue b/src/components/navMenu.vue
index f54eb4b..830cf14 100644
--- a/src/components/navMenu.vue
+++ b/src/components/navMenu.vue
@@ -7,144 +7,13 @@
       <div class="menu">
         <el-menu
           active-text-color="#ffd04b"
-          background-color="#3B4D6E"
           class="el-menu-vertical-demo"
-          default-active="2"
+          :default-active="activeIndex"
+          background-color="#586884"
           text-color="#fff"
-          router
-          @open="handleOpen"
-          @close="handleClose"
           @select="handleselect"
         >
-          <el-submenu index="3" class="faSub">
-            <template slot="title">
-              <span>{{ $t('synthesis.synthesis') }}</span>
-            </template>
-            <el-menu-item index="Synthesis">{{
-              $t('synthesis.synthesis')
-            }}</el-menu-item>
-            <el-menu-item index="Thematic">{{
-              $t('synthesis.themaic')
-            }}</el-menu-item>
-            <el-menu-item index="Archive">{{
-              $t('synthesis.archive')
-            }}</el-menu-item>
-          </el-submenu>
-          <el-submenu index="1" class="faSub">
-            <template slot="title">
-              <span>{{ $t('dataManage.dataManage') }}</span>
-            </template>
-            <el-menu-item index="catalogueManage">{{
-              $t('dataManage.catalogueManage')
-            }}</el-menu-item>
-            <el-menu-item index="dataUpdata">{{
-              $t('dataManage.dataUpdata')
-            }}</el-menu-item>
-            <el-menu-item index="metadataManage">{{
-              $t('dataManage.metadataManage')
-            }}</el-menu-item>
-            <el-menu-item index="dataLoading">{{
-              $t('dataManage.dataLoading')
-            }}</el-menu-item>
-            <el-menu-item index="SpatialData">{{
-              $t('dataManage.SpatialData')
-            }}</el-menu-item>
-            <el-menu-item index="versionManage">{{
-              $t('dataManage.versionManage')
-            }}</el-menu-item>
-            <el-menu-item index="dictionaryManage">{{
-              $t('dataManage.dictionaryManage')
-            }}</el-menu-item>
-            <el-menu-item index="styleManage">{{
-              $t('dataManage.styleManage')
-            }}</el-menu-item>
-          </el-submenu>
-          <el-submenu index="2" class="faSub">
-            <template slot="title">
-              <span>{{ $t('operatManage.operatManage') }}</span>
-            </template>
-            <el-submenu index="2-2">
-              <template slot="title">{{
-                $t('operatManage.systemLayout')
-              }}</template>
-              <el-menu-item index="menuSettings">{{
-                $t('operatManage.menuSettings')
-              }}</el-menu-item>
-              <el-menu-item index="parameterConfiguration">{{
-                $t('operatManage.parameterConfiguration')
-              }}</el-menu-item>
-              <el-menu-item index="rests">{{
-                $t('operatManage.rests')
-              }}</el-menu-item>
-            </el-submenu>
-            <el-menu-item index="authorityManagement">{{
-              $t('operatManage.authorityManagement')
-            }}</el-menu-item>
-            <el-menu-item index="safetyManagement">{{
-              $t('operatManage.safetyManagement')
-            }}</el-menu-item>
-            <el-submenu index="2-5">
-              <template slot="title">{{
-                $t('operatManage.operationMonitoring')
-              }}</template>
-              <el-menu-item index="eventlogManage">{{
-                $t('operatManage.ResourceLog')
-              }}</el-menu-item>
-              <el-menu-item index="logLog">{{
-                $t('operatManage.logLog')
-              }}</el-menu-item>
-              <el-menu-item index="operationLog">{{
-                $t('operatManage.operationLog')
-              }}</el-menu-item>
-              <el-menu-item index="databaseMonitoring">{{
-                $t('operatManage.databaseMonitoring')
-              }}</el-menu-item>
-              <el-menu-item index="systemMonitoring">{{
-                $t('operatManage.systemMonitoring')
-              }}</el-menu-item>
-              <el-menu-item index="blackwhiteList"
-                >{{ $t('operatManage.blackwhiteList') }}
-              </el-menu-item>
-              <el-menu-item index="tokentool">{{
-                $t('operatManage.tokentool')
-              }}</el-menu-item>
-            </el-submenu>
-          </el-submenu>
-
-          <el-submenu index="4" class="faSub">
-            <template slot="title">
-              <span>{{ $t('userManage.userManage') }}</span>
-            </template>
-            <el-menu-item index="userInfoManage">{{
-              $t('userManage.userInfoManage')
-            }}</el-menu-item>
-            <el-menu-item index="orgManage">{{
-              $t('userManage.orgManage')
-            }}</el-menu-item>
-            <el-menu-item index="userAuditing">{{
-              $t('userManage.userAuditing')
-            }}</el-menu-item>
-            <el-menu-item index="roleManage">{{
-              $t('userManage.roleManage')
-            }}</el-menu-item>
-            <el-menu-item index="groupManage">{{
-              $t('userManage.groupManage')
-            }}</el-menu-item>
-            <el-menu-item index="authorityManage">{{
-              $t('userManage.authorityManage')
-            }}</el-menu-item>
-            <el-menu-item index="resourceManage">{{
-              $t('userManage.resManage')
-            }}</el-menu-item>
-          </el-submenu>
-          <!-- <el-submenu index="5" class="faSub">
-            <template slot="title">鏁版嵁浜ゆ崲</template>
-            <el-menu-item index="5-1">鏁版嵁鍒嗗彂</el-menu-item>
-          </el-submenu> -->
-          <!-- <el-submenu index="6" class="faSub">
-            <template slot="title">鏈嶅姟绠$悊</template>
-            <el-menu-item index="6-1">鏁版嵁鏈嶅姟娉ㄥ唽寮�鍚�</el-menu-item>
-          </el-submenu> -->
+          <customElMenu :menuData="menuList"></customElMenu>
         </el-menu>
       </div>
     </div>
@@ -165,75 +34,130 @@
 </template>
 
 <script>
-import { logout } from '@/api/api';
-import { removeToken, getToken } from '@/utils/auth';
+import { logout } from "@/api/api";
+import { removeToken, getToken } from "@/utils/auth";
+import customElMenu from "../components/customElMenu.vue";
+import { queryMenuTree, updateMenuTree, queryMaxId } from "../api/api";
+
 export default {
-  name: 'navMenu',
+  name: "navMenu",
   //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
+  components: {
+    customElMenu,
+  },
   data() {
     return {
-      lang: 'en',
+      oriData: [], //鍘熷鏍戞暟鎹�
+      dirData: [], //el鏍戞暟鎹�
+      newData: [], //鎷栧姩鍚庢暟鎹�
+      lang: "zh",
+      activeIndex: "/",
+      menuList: [],
+      editTitle: "",
+      showPopover: false,
+      showEditInfoWrapper: false,
+      showEdit: false,
+      editMenu: false,
+      editCatalogue: false,
+      editUnit: false,
+      itemdetail: {},
+      formLabelWidth: "70px",
     };
   },
+  mounted() {
+    this.getMenuTree();
+  },
+  computed: {},
   methods: {
+    getMenuTree() {
+      //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
+      // 鑾峰彇鐩綍鏍戞暟鎹�
+      queryMenuTree().then((res) => {
+        if (res.code == 200) {
+          if (res.result.length != 0) {
+            this.menuList = this.treeData(res.result);
+          } else {
+            alert("鏆傛棤鑿滃崟鏍忔暟鎹�");
+          }
+        } else {
+          console.log("鎺ュ彛鎶ラ敊");
+        }
+      });
+    },
+    treeData(source) {
+      let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
+      // console.log(cloneData);
+      if (cloneData.length != 0) {
+        return cloneData.filter((father) => {
+          // 寰幆鎵�鏈夐」
+          let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
+          branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
+          // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛�
+          // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋�
+          return father.pid == 1; // 杩斿洖涓�绾ц彍鍗�
+        });
+      } else {
+        alert("鏆傛棤鑿滃崟鏍忔暟鎹�");
+      }
+    },
     logOut() {
-      this.$confirm('纭鏄惁閫�鍑虹櫥褰�?', '鎻愮ず', {
-        confirmButtonText: '纭畾',
-        cancelButtonText: '鍙栨秷',
-        type: 'warning',
+      this.$confirm("纭鏄惁閫�鍑虹櫥褰�?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
       })
         .then(async () => {
           const data = await logout({ token: getToken() });
           console.log(data);
           if (data.code != 200) {
-            return this.$message.error('閫�鍑虹櫥褰曞け璐�');
+            return this.$message.error("閫�鍑虹櫥褰曞け璐�");
           }
           removeToken();
-          this.$router.push('/login');
+          this.$router.push("/login");
           this.$message({
-            message: '閫�鍑虹櫥褰曟垚鍔�',
-            type: 'success',
+            message: "閫�鍑虹櫥褰曟垚鍔�",
+            type: "success",
           });
         })
         .catch(() => {
           this.$message({
-            type: 'info',
-            message: '宸插彇娑�',
+            type: "info",
+            message: "宸插彇娑�",
           });
         });
     },
-    handleOpen(key, keyPath) {
-      if (
-        keyPath[1] != 'dataLoading' &&
-        keyPath[1] != '2-2' &&
-        keyPath[1] != '2-5'
-      )
-        this.$router.push(keyPath[1]);
-    },
-    handleClose(key, keyPath) {
-      if (
-        keyPath[1] != 'dataLoading' &&
-        keyPath[1] != '2-5' &&
-        keyPath[1] != '2-2'
-      )
-        this.$router.push(keyPath[1]);
-    },
-    handleselect(index) {
-      if (index != null) {
-        this.$emit('shwoMapView', false);
-      }
-    },
-    showChange() {
-      this.$emit('shwoMapView', true);
-    },
     switchLang() {
-      if (this.lang == 'en') {
+      //褰撳墠en
+      if (this.lang == "en") {
+        //璇█鎹㈡垚zh
+        this.lang = "zh";
+        //鑿滃崟鎹负zh
+        this.$store.commit("changeLang", "zh");
+        //i18鎹㈡垚zh
         this.$i18n.locale = this.lang;
-        this.lang = 'zh';
-      } else {
-        this.$i18n.locale = this.lang;
-        this.lang = 'en';
       }
+      //褰撳墠zh
+      else {
+        this.lang = "en";
+        this.$i18n.locale = this.lang;
+        this.$store.commit("changeLang", "en"); //浼犻�掔偣鍑荤殑鑺傜偣
+      }
+    },
+    handleselect(index, indexPath) {
+      if (index.indexOf("http") != -1) {
+        this.$router.push("/databaseMonitoring");
+        this.$store.commit("getIframe", index);
+      } else if (isNaN(Number(index))) {
+        this.$router.push(index);
+      }
+    },
+  },
+  watch: {
+    $route() {
+      this.activeIndex = this.$route.path;
     },
   },
 };
diff --git a/src/router/index.js b/src/router/index.js
index f9898e9..8a06dac 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -337,6 +337,7 @@
           requireAuth: true, // 鏍囪瘑璇ヨ矾鐢辨槸鍚﹂渶瑕佺櫥褰�
         },
       },
+
     ],
   },
 ];
diff --git a/src/store/index.js b/src/store/index.js
index 088eb10..83c210d 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -11,10 +11,13 @@
   state: {
     catalogueName: '',
     cataNode: {},
+    lang: 'zh',
+    menuNode: {},
     verCateNode: {},
     verCateNodes: {},
     styleDirCateNodes: {},
     styleDepCateNodes: {},
+    iframeMsg: '',
     token: getToken(),
     //璇锋眰璁℃暟
     apiCount: 0,
@@ -31,6 +34,17 @@
     changeNode(state, msg) {
       state.cataNode = msg;
     },
+    changeLang(state, msg) {
+      state.lang = msg;
+    },
+    getIframe(state, msg) {
+      state.iframeMsg = msg;
+    },
+    changeName(state, msg) {
+      state.menuNode = msg;
+      // console.log(msg);
+
+    },
     verChangeNode(state, msg) {
       state.verCateNode = msg;
     },
diff --git a/src/views/datamanage/catalogueManage.vue b/src/views/datamanage/catalogueManage.vue
index d8d6c07..cd522bb 100644
--- a/src/views/datamanage/catalogueManage.vue
+++ b/src/views/datamanage/catalogueManage.vue
@@ -1,142 +1,481 @@
 <template>
-  <div class="pageWrapper">
-    <div class="leftTree">
+  <div class="cataSettings_box">
+    <div class="cataSettings_tree">
       <My-bread :list="['鏁版嵁绠$悊', '鐩綍绠$悊']"></My-bread>
+      <el-button class="saveBtn" type="primary" size="mini" @click="sendChange"
+        >淇濆瓨</el-button
+      >
       <el-divider />
-      <div class="tree">
-        <catalogueTree :showBtn="showBtn"></catalogueTree>
+      <div class="cataTreeBox">
+        <el-tree
+          ref="tree"
+          :props="defaultProps"
+          node-key="id"
+          :data="dirList"
+          :expand-on-click-node="false"
+          :default-expand-all="true"
+          draggable
+          @node-click="handleNodeClick"
+          @node-drag-start="handleDragStart"
+          @node-drag-end="handleDrop"
+        >
+          <span class="custom-tree-node" slot-scope="{ node, data }">
+            <span>{{ node.label }}</span>
+            <span class="btnBox">
+              <el-button
+                type="text"
+                size="mini"
+                @click="() => append(node, data)"
+              >
+                <i class="el-icon-circle-plus"></i>
+              </el-button>
+              <el-button
+                type="text"
+                size="mini"
+                @click="() => remove(node, data)"
+              >
+                <i class="el-icon-delete-solid"></i>
+              </el-button>
+            </span>
+          </span>
+        </el-tree>
       </div>
     </div>
-    <div class="rightWrapper">
-      <div class="leftTabs">
-        <el-tabs type="border-card">
-          <el-tab-pane label="鏌ョ湅">
-            <el-form :model="form" :inline="true">
-              <el-form-item label="鐩綍缂栫爜">
-                <el-input v-model="this.$store.state.cataNode.id" disabled />
-              </el-form-item>
-              <el-form-item label="鐩綍鍚嶇О" label-width="100px">
-                <el-input v-model="this.$store.state.cataNode.name" disabled />
-              </el-form-item>
-              <el-form-item label="鐩綍璇存槑">
-                <el-input
-                  v-model="form.desc"
-                  type="textarea"
-                  resize="none"
-                  style="height: 100%; overflow: auto"
-                />
-              </el-form-item>
-              <el-form-item label="鐩綍澶囨敞">
-                <el-input v-model="form.notes" type="textarea" resize="none" />
-              </el-form-item>
-              <el-form-item style="margin-left: 450px">
-                <el-button type="primary" size="mini" @click="onSubmit"
-                  >纭畾</el-button
-                >
-                <el-button
-                  style="margin-left: 50px"
-                  size="mini"
-                  @click="cancel"
-                  >鍙栨秷</el-button
-                >
-              </el-form-item>
-            </el-form>
-          </el-tab-pane>
-        </el-tabs>
+    <div class="itemSettings">
+      <div class="title_box">
+        <h4>璇︾粏淇℃伅</h4>
+      </div>
+      <div class="form_box">
+        <el-form :model="itemdetail">
+          <!-- <el-form-item label="鐩綍缂栫爜" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.id" disabled />
+          </el-form-item> -->
+          <el-form-item label="鐩綍鍚嶇О" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.name" />
+          </el-form-item>
+          <el-form-item label="鐩綍璇存槑" :label-width="formLabelWidth">
+            <el-input
+              v-model="itemdetail.descr"
+              type="textarea"
+              resize="none"
+              style="height: 100%; overflow: auto"
+            />
+          </el-form-item>
+          <el-form-item label="鐩綍澶囨敞" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.bak" type="textarea" resize="none" />
+          </el-form-item>
+          <div class="btnBox">
+            <el-button type="primary" @click="updMenu">淇濆瓨</el-button>
+            <el-button type="primary" @click="reset">鍙栨秷</el-button>
+          </div>
+        </el-form>
       </div>
     </div>
+    '
+
+    <el-dialog title="鏂板瀛愮洰褰�" :visible.sync="dialogFormVisible">
+      <el-form :model="ruleForm" ref="ruleForm" :rules="rules">
+        <el-form-item
+          label="鐩綍鍚嶇О"
+          prop="name"
+          :label-width="formLabelWidth"
+        >
+          <el-input v-model="ruleForm.name" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item
+          prop="descr"
+          label="鐩綍璇存槑"
+          :label-width="formLabelWidth"
+        >
+          <el-input v-model="ruleForm.descr" autocomplete="off"></el-input>
+        </el-form-item>
+        <el-form-item prop="bak" label="鐩綍澶囨敞" :label-width="formLabelWidth">
+          <el-input v-model="ruleForm.bak" autocomplete="off"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="resetForm('ruleForm')">鍙栨秷</el-button>
+        <el-button
+          type="primary"
+          @click="submitForm('ruleForm')"
+          v-loading.fullscreen.lock="fullscreenLoading"
+          >鎻愪氦</el-button
+        >
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import {
+  queryDirTree,
+  queryMaxId,
+  updateDirTrees,
+  insertDir,
+  deleteDir,
+} from "../../api/api";
 import MyBread from "../../components/MyBread.vue";
-import catalogueTree from "../../components/catalogueTree.vue";
 export default {
   name: "catalogueManage",
   components: {
-    catalogueTree,
     MyBread,
   },
   data() {
+    let validName = (rule, value, callback) => {
+      if (value === "") {
+        return callback(new Error("鐩綍鍚嶇О涓嶈兘涓虹┖"));
+      } else {
+        callback();
+      }
+    };
     return {
-      showBtn: true,
-      form: {
+      defaultProps: {
+        children: "children",
+        label: "name",
+      },
+      fullscreenLoading: false,
+      oriData: [], //鍘熷鏍戞暟鎹�
+      dirList: [], //el鏍戞暟鎹�
+      old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�)
+      newData: [], //鎷栧姩鍚庡師濮嬫暟鎹�
+      itemdetail: {},
+      backUpData: {},
+      formLabelWidth: "170px",
+      delChildIDs: "",
+      dialogFormVisible: false,
+      ruleForm: {
+        level: null,
+        orderNum: null,
+        pid: null,
         name: "",
-        region: "",
-        date1: "",
-        date2: "",
-        delivery: false,
-        type: [],
-        resource: "",
-        desc: "",
+        descr: "",
+        bak: "",
+      },
+      rules: {
+        name: [{ validator: validName, trigger: "blur" }],
       },
     };
   },
   methods: {
-    onSubmit() {
+    // 璇锋眰鐩綍鏍�
+    getDirTree() {
+      //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
+      // 鑾峰彇鐩綍鏍戞暟鎹�
+      queryDirTree().then((res) => {
+        // console.log(res);
+        if (res.code == 200) {
+          this.oriData = res.result;
+          this.newData = res.result;
+          this.dirList = this.treeData(res.result);
+        } else {
+          console.log("鎺ュ彛鎶ラ敊");
+        }
+      });
+    },
+    treeData(source) {
+      let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
+      return cloneData.filter((father) => {
+        // 寰幆鎵�鏈夐」
+        let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
+        branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
+        // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛�
+        // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋�
+        return father.pid == 0; // 杩斿洖涓�绾ц彍鍗�
+      });
+    },
+    append(node, data) {
+      this.dialogFormVisible = true;
+      this.ruleForm.pid = data.id;
+      this.ruleForm.orderNum = node.childNodes.length + 1;
+      this.ruleForm.level = data.level + 1;
+      // console.log(data);
+      // console.log(node);
+    },
+    resetForm(formName) {
+      this.dialogFormVisible = false;
+      this.$nextTick(() => {
+        this.$refs[formName].resetFields();
+      });
+    },
+    submitForm(formName) {
+      this.$nextTick(() => {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            this.fullscreenLoading = true;
+            insertDir(this.ruleForm)
+              .then((res) => {
+                setTimeout(() => {
+                  this.fullscreenLoading = false;
+                  if (res.code == 200) {
+                    this.$message({
+                      message: "娣诲姞鎴愬姛",
+                      type: "success",
+                    });
+                    this.dialogFormVisible = false;
+                    this.$refs[formName].resetFields();
+                  }
+                }, 2000);
+              })
+              .catch((res) => {
+                console.log(res);
+                this.fullscreenLoading = false;
+              });
+          } else {
+            // alert("鐩綍鍚嶇О涓嶈兘涓虹┖");
+            return false;
+          }
+        });
+      });
+    },
+    remove(node, data) {
+      this.$confirm("姝ゆ搷浣滃皢鍒犻櫎璇ヨ妭鐐�, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          // console.log(node);
+          // console.log(data);
+
+          //鍏勫紵閲嶆柊鎺掑簭
+          const parent = node.parent;
+          const children = parent.data.children || parent.data;
+          children.splice(data.orderNum - 1, 1);
+          children.forEach((item, index) => {
+            item.orderNum = index + 1;
+          });
+
+          this.traverseArr(data); //鑾峰彇鍒犻櫎鐨勫瓙ID
+          let delIDs = this.delChildIDs + "id=" + data.id; //瑕佸垹闄ょ殑鍏ㄩ儴ID
+          console.log(delIDs);
+          Promise.all([deleteDir(delIDs), updateDirTrees(children)])
+            .then((res) => {
+              console.log(res);
+              if (res[0].code == 200 && res[1].code == 200) {
+                this.$message({
+                  type: "success",
+                  message: "鍒犻櫎鎴愬姛!",
+                });
+              }
+            })
+            .catch(() => {
+              this.$message({
+                type: "error",
+                message: "鍒犻櫎澶辫触",
+              });
+            });
+
+          //閲嶇疆瑕佸垹闄ょ殑瀛怚D
+          this.delChildIDs = "";
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堝垹闄�",
+          });
+        });
+      // this.dialogMessage="鏄惁鍒犻櫎"
+      // this.dialogFlag = 1;
+      // this.dialogFrom ={
+      //   node:node,
+      //   val:data
+      // }
+      //   this.dialogVisible=true;//鐩綍鏍戞洿鏀瑰脊绐�
+      // const parent = node.parent;
+      // const children = parent.data.children || parent.data;
+      // const index = children.findIndex((d) => d.id === data.id);
+      // let res = children.splice(index, 1);
+      // // console.log(res);
+      // // console.log(data);
+      // console.log(this.flaten(res));
+    },
+    traverseArr(obj) {
+      if (obj.children) {
+        return obj.children.forEach((item) => {
+          // console.log(item.id + "---" + item.name);
+          this.delChildIDs += "id=" + item.id + "&";
+          this.traverseArr(item);
+        });
+      }
+      return;
+    },
+    flaten(arr) {
+      return arr.reduce((p, v, i) => {
+        for (let i = 0; i < p.length; i++) {
+          if (p[i].children) {
+            delete p[i].children;
+          }
+        }
+        return p.concat(v.children ? this.flaten(v.children).concat(v) : v);
+      }, []);
+    },
+    handleDragStart(node, ev) {
+      this.old_dirDat = JSON.parse(JSON.stringify(this.dirList)); //灏嗗浠界殑dir閲嶆柊璧嬪��
+    },
+    handleDrop(draggingNode, dropNode, dropType, ev) {
+      this.$confirm("姝ゆ搷浣滃皢淇濆瓨鐩綍鏇存敼, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          //鐖惰妭鐐�
+          let data = dropType != "inner" ? dropNode.parent.data : dropNode.data;
+          // 鐖惰妭鐐逛腑鍏ㄩ儴瀛愯妭鐐�
+          let nodeData =
+            dropNode.level == 1 && dropType != "inner" ? data : data.children;
+          //鍙樻洿鑺傜偣
+          nodeData.forEach((item, i) => {
+            if (dropType != "inner") {
+              if (draggingNode.data.pid === dropNode.data.pid) {
+                item.pid = item.pid;
+              } else {
+                item.pid = dropNode.data.pid;
+              }
+            } else {
+              item.pid = data.id;
+            }
+            item.orderNum = i + 1;
+          });
+          // console.log(nodeData);
+          //鏇存柊鍘熷鏁翠綋鏁版嵁
+          let arr = [];
+          this.oriData.forEach((e) => {
+            nodeData.forEach((item) => {
+              if (item.id === e.id) {
+                e = item;
+              }
+            });
+            arr.push(e);
+          });
+          this.newData = arr;
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堟洿鏀�",
+          });
+          this.dirList = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪��
+        });
+    },
+    sendChange() {
+      updateDirTrees(this.newData).then((res) => {
+        // console.log(res);
+        if (res.code == 200) {
+          this.$message({
+            type: "success",
+            message: "鏇存柊鎴愬姛!",
+          });
+        }
+      });
+    },
+    handleNodeClick(data) {
+      // console.log(data);
+      this.backUpData = JSON.stringify(data);
+      this.itemdetail = JSON.parse(JSON.stringify(data));
+    },
+    updMenu() {
       this.$message({
         message: "淇敼鎴愬姛",
         type: "success",
       });
     },
-    cancel() {
+    reset() {
       this.$message("宸插彇娑�");
     },
-    //  this.updateForm.name = this.$store.state.catalogueName;
+  },
+  mounted() {
+    this.getDirTree();
   },
 };
 </script>
 
 <style lang="less" scoped>
-.pageWrapper {
+.cataSettings_box {
+  border-radius: 10px;
+  height: 100%;
+  padding: 10px;
+  box-sizing: border-box;
   display: flex;
-  height: 98.5%;
-  margin-top: 6px;
-  margin-left: 16px;
-  .leftTree {
+  .cataSettings_tree {
+    position: relative;
     width: 344px;
     height: 100%;
-    background: #f4f8ff;
+    background: rgb(240, 242, 245);
+    padding: 20px;
     border-radius: 10px;
-    overflow: hidden;
-    .breadcrumb {
-      margin: 8px 0 0 24px;
+    box-sizing: border-box;
+    overflow: auto;
+    .saveBtn {
+      position: absolute;
+      left: 250px;
+      top: 23px;
     }
-    hr {
-      width: 304px;
-      margin-top: 9px;
-      background: #d3d3d3;
-    }
-    .tree {
-      height: 90%;
+    .cataTreeBox {
+      height: 88%;
+      width: 100%;
       overflow: auto;
-      padding-left: 5px;
+      .el-tree {
+        background: transparent;
+        font-size: 15px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #000000;
+        /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;
+          }
+        }
+      }
     }
   }
-  .rightWrapper {
-    width: calc(100% - 350px);
-    height: 100%;
-    margin-left: 6px;
-    background: #f4f8ff;
+  .itemSettings {
+    width: calc(100% - 344px);
     border-radius: 10px;
-    overflow: auto;
-    .leftTabs {
-      width: 99%;
-      margin: 17px auto 0;
-      /deep/.el-tabs--border-card {
-        border-radius: 3px;
+    background: rgb(240, 242, 245);
+    margin-left: 10px;
+    height: 100%;
+    padding: 10px;
+    box-sizing: border-box;
+    .title_box {
+      background: #fff;
+      padding: 10px;
+      margin-bottom: 24px;
+      display: flex;
+      border-radius: 10px;
+      border: 1px solid rgb(202, 201, 204);
+      box-sizing: border-box;
+    }
+    .form_box {
+      border: 1px solid rgb(202, 201, 204);
+      border-radius: 10px;
+      background: #fff;
+      padding-top: 30px;
+      box-sizing: border-box;
+      width: 100%;
+      .el-input,
+      /deep/ .el-textarea {
+        width: 400px;
       }
-      /deep/.el-tabs--border-card > .el-tabs__content {
-        padding: 30px 0 0 38px;
-        height: 87vh;
-      }
-      .el-input {
-        width: 467px;
-      }
-      /deep/ .el-textarea__inner {
-        width: 1066px;
-        height: 131px;
-        overflow: auto;
+      .btnBox {
+        margin: 0 270px 20px;
+        width: 200px;
+        display: flex;
+        justify-content: space-between;
       }
     }
   }
diff --git a/src/views/maintenance/databaseMonitoring.vue b/src/views/maintenance/databaseMonitoring.vue
index 5ff18eb..83ceaea 100644
--- a/src/views/maintenance/databaseMonitoring.vue
+++ b/src/views/maintenance/databaseMonitoring.vue
@@ -1,12 +1,5 @@
 <template>
   <div class="databaseMonitoring_box">
-    <My-bread
-      :list="[
-        `${$t('operatManage.operatManage')}`,
-        `${$t('operatManage.databaseMonitoring')}`,
-      ]"
-    ></My-bread>
-    <el-divider />
     <div class="table_box">
       <iframe
         id="iframe"
@@ -21,6 +14,7 @@
 
 <script>
 import MyBread from "../../components/MyBread.vue";
+import { getToken } from "../../utils/auth.js";
 export default {
   //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
   components: {
@@ -29,15 +23,24 @@
   data() {
     //杩欓噷瀛樻斁鏁版嵁
     return {
-      sql_Url: sql_Url
+      sql_Url: "",
     };
   },
   //鏂规硶闆嗗悎
   methods: {
-    handleSelectionChange() { },
+    handleSelectionChange() {},
+    getUrl() {
+      if (this.$store.state.iframeMsg.indexOf("Token=") != -1) {
+        this.sql_Url = this.$store.state.iframeMsg + getToken();
+      } else {
+        this.sql_Url = this.$store.state.iframeMsg;
+      }
+    },
   },
-  created() { },
-  mounted() { },
+  created() {
+    this.getUrl();
+  },
+  mounted() {},
 };
 </script>
 <style lang="less" scoped>
diff --git a/src/views/maintenance/menuSettings.vue b/src/views/maintenance/menuSettings.vue
index f8f0f41..7f9b71b 100644
--- a/src/views/maintenance/menuSettings.vue
+++ b/src/views/maintenance/menuSettings.vue
@@ -2,46 +2,64 @@
   <div class="menuSettings_box">
     <div class="menuSettings_tree">
       <My-bread :list="['杩愮淮绠$悊', '鑿滃崟璁剧疆']"></My-bread>
+      <el-button class="saveBtn" type="primary" size="mini" @click="sendChange"
+        >淇濆瓨</el-button
+      >
       <el-divider />
-      <el-tree
-        :data="data"
-        :props="defaultProps"
-        show-checkbox
-        @check-change="handleCheckChange"
-      />
+      <div class="menuTreeBox">
+        <el-tree
+          ref="tree"
+          :props="defaultProps"
+          node-key="id"
+          :data="menuList"
+          :expand-on-click-node="false"
+          :default-expand-all="true"
+          draggable
+          @node-click="handleNodeClick"
+          @node-drag-start="handleDragStart"
+          @node-drag-end="handleDrop"
+        >
+          <span class="custom-tree-node" slot-scope="{ node, data }">
+            <span>{{ node.label }}</span>
+          </span>
+        </el-tree>
+      </div>
     </div>
     <div class="menuSettings">
-      <div class="btn_box">
-        <el-button type="primary">鏂板缓</el-button>
-        <el-button type="primary">淇敼</el-button>
-        <!-- <el-button class="delBtn">娓呴櫎</el-button> -->
+      <div class="title_box">
+        <h4>璇︾粏淇℃伅</h4>
       </div>
-      <div class="table_box">
-        <el-table :data="tableData" stripe>
-          <el-table-column prop="menuname" label="鑿滃崟鍚嶇О" />
-          <el-table-column prop="parentmenuname" label="鐖惰彍鍗曞悕绉�" />
-          <el-table-column prop="dataBulk" label="鏁版嵁鏁伴噺" />
-          <el-table-column prop="creationtime" label="鍒涘缓鏃堕棿" />
-          <el-table-column prop="creationname" label="鍒涘缓浜�" />
-          <el-table-column fixed="right" label="鎿嶄綔" width="280">
-            <template #default>
-              <!-- <el-button type="primary" size="small">淇敼</el-button> -->
-              <el-button type="primary" size="small">鍒犻櫎</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-        <div style="margin-top: 40px" class="pagination_box">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage4"
-            :page-sizes="[10, 20, 30, 40]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="10"
-          >
-          </el-pagination>
-        </div>
+      <div class="form_box">
+        <el-form :model="itemdetail">
+          <el-form-item label="鑻辨枃鍚嶇О" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.enName" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="涓枃鍚嶇О" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.cnName" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鍥炬爣" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.icon" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鏄惁鏄剧ず" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.isShow" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鑿滃崟Url" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.url" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鎺堟潈" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.perms" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="绫诲瀷" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.type" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="澶囨敞" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.bak" autocomplete="off"></el-input>
+          </el-form-item>
+          <div class="btnBox">
+            <el-button type="primary" @click="updMenu">淇濆瓨</el-button>
+            <el-button type="primary" @click="reset">鍙栨秷</el-button>
+          </div>
+        </el-form>
       </div>
     </div>
   </div>
@@ -49,7 +67,12 @@
 
 <script>
 import MyBread from "../../components/MyBread.vue";
-
+import {
+  queryMenuTree,
+  updateMenuTree,
+  updateMenuTrees,
+  queryMaxId,
+} from "../../api/api";
 export default {
   //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
   components: {
@@ -58,169 +81,217 @@
 
   data() {
     return {
-      currentPage4: 1,
-      tableData: [
-        {
-          menuname: "鏁版嵁璐ㄦ",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "鏁版嵁浜ゆ崲",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "鏁版嵁绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "鏈嶅姟绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "缁煎悎灞曠ず",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "杩愮淮绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "鑿滃崟绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "鐢ㄦ埛绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "绯荤粺绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-        {
-          menuname: "绯荤粺閰嶇疆",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "admin",
-        },
-      ],
       defaultProps: {
         children: "children",
-        label: "label",
+        label: "cnName",
       },
-      data: [
-        {
-          label: "鏁版嵁璐ㄦ",
-        },
-        {
-          label: "鏁版嵁浜ゆ崲",
-        },
-        {
-          label: "鏁版嵁绠$悊",
-          children: [
-            {
-              label: "Level two 3-1",
-              children: [
-                {
-                  label: "Level three 3-1-1",
-                },
-              ],
-            },
-            {
-              label: "Level two 3-2",
-              children: [
-                {
-                  label: "Level three 3-2-1",
-                },
-              ],
-            },
-          ],
-        },
-        {
-          label: "鏈嶅姟绠$悊",
-        },
-        {
-          label: "缁煎悎灞曠ず",
-          children: [
-            {
-              label: "Level two 3-1",
-              children: [
-                {
-                  label: "Level three 3-1-1",
-                },
-              ],
-            },
-            {
-              label: "Level two 3-2",
-              children: [
-                {
-                  label: "Level three 3-2-1",
-                },
-              ],
-            },
-          ],
-        },
-        {
-          label: "杩愮淮绠$悊",
-          children: [
-            {
-              label: "Level two 3-1",
-              children: [
-                {
-                  label: "Level three 3-1-1",
-                },
-              ],
-            },
-            {
-              label: "Level two 3-2",
-              children: [
-                {
-                  label: "Level three 3-2-1",
-                },
-              ],
-            },
-          ],
-        },
-      ],
+      oriData: [], //鍘熷鏍戞暟鎹�
+      menuList: [], //el鏍戞暟鎹�
+      old_dirDat: [], //el鏍戞暟鎹�(鎷栧姩鍓�)
+      newData: [], //鎷栧姩鍚庡師濮嬫暟鎹�
+      itemdetail: {
+        cnName: "",
+        enName: "",
+        icon: null,
+        isShow: null,
+        perms: null,
+        url: "",
+        type: null,
+        bak: "",
+      },
+      backUpData: {},
+      formLabelWidth: "170px",
     };
   },
   methods: {
-    handleSizeChange(val) {
-      console.log(`姣忛〉 ${val} 鏉);
+    getMenuTree() {
+      //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
+      queryMenuTree().then((res) => {
+        if (res.code == 200) {
+          this.menuList = this.treeData(res.result);
+          this.oriData = res.result;
+          this.newData = res.result;
+        } else {
+          console.log("鎺ュ彛鎶ラ敊");
+        }
+      });
     },
-    handleCurrentChange(val) {
-      console.log(`褰撳墠椤�: ${val}`);
+    treeData(source) {
+      let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
+      return cloneData.filter((father) => {
+        // 寰幆鎵�鏈夐」
+        let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
+        branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
+        return father.pid == 1; // 杩斿洖涓�绾ц彍鍗�
+      });
     },
-    handleCheckChange() {},
+    append(data) {
+      this.$prompt("璇疯緭鍏ュ悕绉�", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+      })
+        .then(({ value }) => {
+          const newChild = {
+            id: this.id + 1,
+            name: value,
+            pid: data.id,
+            // children: [],
+            orderNum: data.children ? data.children.length + 1 : 1,
+          };
+          this.id = newChild.id; //淇敼鏂扮殑鏈�澶
+          console.log(newChild);
+
+          if (!data.children) {
+            this.$set(data, "children", []);
+          }
+          data.children.push(newChild);
+          this.newData.push(newChild);
+          // this.sendChange();
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "鍙栨秷杈撳叆",
+          });
+        });
+    },
+    remove(node, data) {
+      this.$confirm("姝ゆ搷浣滃皢鍒犻櫎璇ヨ妭鐐�, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          const parent = node.parent;
+          const children = parent.data.children || parent.data;
+          const index = children.findIndex((d) => d.id === data.id);
+          let res = children.splice(index, 1);
+          var std = [];
+          for (var i in res) {
+            std.push(res[i].id);
+          }
+          // deleteDirTree(std);
+          this.getDirTree();
+          this.$message({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堝垹闄�",
+          });
+        });
+      // this.dialogMessage="鏄惁鍒犻櫎"
+      // this.dialogFlag = 1;
+      // this.dialogFrom ={
+      //   node:node,
+      //   val:data
+      // }
+      //   this.dialogVisible=true;//鐩綍鏍戞洿鏀瑰脊绐�
+      // const parent = node.parent;
+      // const children = parent.data.children || parent.data;
+      // const index = children.findIndex((d) => d.id === data.id);
+      // let res = children.splice(index, 1);
+      // // console.log(res);
+      // // console.log(data);
+      // console.log(this.flaten(res));
+    },
+    flaten(arr) {
+      return arr.reduce((p, v, i) => {
+        for (let i = 0; i < p.length; i++) {
+          if (p[i].children) {
+            delete p[i].children;
+          }
+        }
+        return p.concat(v.children ? this.flaten(v.children).concat(v) : v);
+      }, []);
+    },
+    handleDragStart(node, ev) {
+      this.old_dirDat = JSON.parse(JSON.stringify(this.menuList)); //灏嗗浠界殑dir閲嶆柊璧嬪��
+    },
+    handleDrop(draggingNode, dropNode, dropType, ev) {
+      this.$confirm("鏄惁璋冩暣鑷宠浣嶇疆?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          //鐖惰妭鐐�
+          let data = dropType != "inner" ? dropNode.parent.data : dropNode.data;
+          // 鐖惰妭鐐逛腑鍏ㄩ儴瀛愯妭鐐�
+          let nodeData =
+            dropNode.level == 1 && dropType != "inner" ? data : data.children;
+          //鍙樻洿鑺傜偣
+          // console.log(nodeData);
+          nodeData.forEach((item, i) => {
+            if (dropType != "inner") {
+              if (draggingNode.data.pid === dropNode.data.pid) {
+                item.pid = item.pid;
+              } else {
+                item.pid = dropNode.data.pid;
+              }
+            } else {
+              item.pid = data.id;
+            }
+            item.orderNum = i + 1;
+          });
+          console.log(nodeData);
+          //鏇存柊鍘熷鏁翠綋鏁版嵁
+          let arr = [];
+          this.oriData.forEach((e) => {
+            nodeData.forEach((item) => {
+              if (item.id === e.id) e = item;
+            });
+            arr.push(e);
+          });
+          this.newData = arr;
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堟洿鏀�",
+          });
+          this.menuList = this.old_dirDat; //灏嗗浠界殑dir閲嶆柊璧嬪��
+        });
+    },
+    sendChange() {
+      updateMenuTrees(this.newData).then((res) => {
+        if (res.code == 200) {
+          alert("鏇存敼瀹屾垚銆傝鍙婃椂鍒锋柊椤甸潰锛�");
+          return;
+        } else {
+          alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+        }
+      });
+    },
+    handleNodeClick(data) {
+      // console.log(data);
+      this.backUpData = JSON.stringify(data);
+      this.itemdetail = JSON.parse(JSON.stringify(data));
+    },
+    updMenu() {
+      updateMenuTree(this.itemdetail).then((res) => {
+        // console.log(res);
+        if (res.code == 200) {
+          alert("淇敼瀹屾垚锛岃鍙婃椂鍒锋柊椤甸潰锛�");
+          return;
+        } else {
+          alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+        }
+      });
+    },
+    reset() {
+      this.itemdetail = JSON.parse(this.backUpData);
+    },
   },
-  created() {},
+  mounted() {
+    this.getMenuTree();
+  },
 };
 </script>
 <style lang="less" scoped>
@@ -233,6 +304,7 @@
   box-sizing: border-box;
   display: flex;
   .menuSettings_tree {
+    position: relative;
     width: 344px;
     height: 100%;
     background: rgb(240, 242, 245);
@@ -240,14 +312,39 @@
     border-radius: 10px;
     box-sizing: border-box;
     overflow: auto;
-    .el-tree {
-      background: transparent;
-      /deep/ .el-tree-node__label {
-        font-size: 18px;
-      }
-      /deep/ .el-tree-node {
-        padding-top: 10px;
-        padding-bottom: 10px;
+    .saveBtn {
+      position: absolute;
+      left: 250px;
+      top: 23px;
+    }
+    .menuTreeBox {
+      height: 90%;
+      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;
+          }
+        }
       }
     }
   }
@@ -259,7 +356,7 @@
     height: 100%;
     padding: 10px;
     box-sizing: border-box;
-    .btn_box {
+    .title_box {
       background: #fff;
       padding: 10px;
       margin-bottom: 24px;
@@ -267,19 +364,22 @@
       border-radius: 10px;
       border: 1px solid rgb(202, 201, 204);
       box-sizing: border-box;
-      .delBtn {
-        margin-left: auto;
-      }
     }
-    .table_box {
+    .form_box {
       border: 1px solid rgb(202, 201, 204);
       border-radius: 10px;
       background: #fff;
-      padding: 10px;
+      padding-top: 30px;
       box-sizing: border-box;
       width: 100%;
-      .el-table__body {
-        width: 100% !important;
+      .el-input {
+        width: 400px;
+      }
+      .btnBox {
+        margin: 0 270px 20px;
+        width: 200px;
+        display: flex;
+        justify-content: space-between;
       }
     }
   }
diff --git a/src/views/userManage/orgManage.vue b/src/views/userManage/orgManage.vue
index 7ceb85b..912620e 100644
--- a/src/views/userManage/orgManage.vue
+++ b/src/views/userManage/orgManage.vue
@@ -1,388 +1,122 @@
 <template>
   <div class="menuSettings_box">
     <div class="menuSettings_tree">
-      <My-bread
-        :list="[
-          `${$t('userManage.userManage')}`,
-          `${$t('userManage.orgManage')}`,
-        ]"
-      ></My-bread>
+      <My-bread :list="['杩愮淮绠$悊', '鍗曚綅绠$悊']"></My-bread>
+      <el-button class="saveBtn" type="primary" size="mini" @click="sendChange"
+        >淇濆瓨</el-button
+      >
       <el-divider />
-      <el-tree
-        :data="data"
-        node-key="id"
-        default-expand-all
-        @node-drag-start="handleDragStart"
-        @node-drag-enter="handleDragEnter"
-        @node-drag-leave="handleDragLeave"
-        @node-drag-over="handleDragOver"
-        @node-drag-end="handleDragEnd"
-        @node-drop="handleDrop"
-        draggable
-        :allow-drop="allowDrop"
-        :allow-drag="allowDrag"
-      >
-      </el-tree>
-    </div>
-    <div class="menuSettings">
-      <div class="btn_box">
-        <div class="herder_box">
-          {{ $t("operatManage.operationLogObj.queryRegion") }}
-        </div>
-        <el-form :inline="true" :model="formInline" size="small">
-          <el-form-item :label="$t('userManage.orgManageObj.companyName')">
-            <el-input
-              v-model="formInline.user"
-              :placeholder="$t('userManage.orgManageObj.companyName')"
-            ></el-input>
-          </el-form-item>
-          <el-form-item :label="$t('userManage.orgManageObj.flatType')">
-            <el-select
-              v-model="formInline.region"
-              :placeholder="$t('userManage.orgManageObj.flatType')"
-            >
-              <el-option label="鍏ㄩ儴" value="鍏ㄩ儴"></el-option>
-              <el-option label="娴峰煙琛屾斂閮ㄩ棬" value="娴峰煙琛屾斂閮ㄩ棬"></el-option>
-              <el-option label="娴峰煙鐩戞祴閮ㄩ棬" value="娴峰煙鐩戞祴閮ㄩ棬"></el-option>
-              <el-option label="娴风洃鎵ф硶閮ㄩ棬" value="娴风洃鎵ф硶閮ㄩ棬"></el-option>
-              <el-option label="鎶�鏈腑蹇�" value="鎶�鏈腑蹇�"></el-option>
-              <el-option label="淇℃伅涓績" value="淇℃伅涓績"></el-option>
-              <el-option label="鐢ㄦ捣鍗曚綅" value="鐢ㄦ捣鍗曚綅"></el-option>
-            </el-select>
-          </el-form-item>
-          <el-form-item>
-            <el-button
-              type="primary"
-              @click="onSubmit"
-              icon="el-icon-search"
-              plain
-              >{{ $t("userManage.orgManageObj.inquire") }}</el-button
-            >
-            <el-button type="primary" icon="el-icon-delete" plain>{{
-              $t("userManage.orgManageObj.delete")
-            }}</el-button>
-          </el-form-item>
-        </el-form>
-        <div>
-          <el-button
-            type="success"
-            @click="outerVisible = true"
-            icon="el-icon-circle-plus"
-            size="small"
-            >{{ $t("userManage.orgManageObj.add") }}</el-button
-          >
-        </div>
-      </div>
-      <div class="table_box">
-        <el-table :data="tableData" stripe>
-          <el-table-column
-            type="index"
-            width="80"
-            :label="$t('userManage.orgManageObj.num')"
-          >
-          </el-table-column>
-          <el-table-column
-            prop="menuname"
-            :label="$t('userManage.orgManageObj.companyName')"
-          />
-          <el-table-column
-            prop="parentmenuname"
-            :label="$t('userManage.orgManageObj.flatType')"
-          />
-          <el-table-column
-            prop="dataBulk"
-            :label="$t('userManage.orgManageObj.phone')"
-          />
-          <el-table-column
-            fixed="right"
-            :label="$t('userManage.orgManageObj.operate')"
-            width="280"
-          >
-            <template #default>
-              <el-button type="warning" size="small">{{
-                $t("userManage.orgManageObj.edit")
-              }}</el-button>
-              <el-button type="success" size="small">{{
-                $t("userManage.orgManageObj.add")
-              }}</el-button>
-              <el-button type="danger" size="small">{{
-                $t("userManage.orgManageObj.delete")
-              }}</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-        <div style="margin-top: 40px" class="pagination_box">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage4"
-            :page-sizes="[10, 20, 30, 40]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="10"
-          >
-          </el-pagination>
-        </div>
+      <div class="menuTreeBox">
+        <el-tree
+          ref="tree"
+          :props="defaultProps"
+          node-key="id"
+          :data="depList"
+          :expand-on-click-node="false"
+          :default-expand-all="true"
+          draggable
+          @node-click="handleNodeClick"
+          @node-drag-start="handleDragStart"
+          @node-drag-end="handleDrop"
+        >
+          <span class="custom-tree-node" slot-scope="{ node, data }">
+            <span>{{ node.label }}</span>
+            <span class="btnBox">
+              <el-button
+                type="text"
+                size="mini"
+                @click="() => append(node, data)"
+              >
+                <i class="el-icon-circle-plus"></i>
+              </el-button>
+              <el-button
+                type="text"
+                size="mini"
+                @click="() => remove(node, data)"
+              >
+                <i class="el-icon-delete-solid"></i>
+              </el-button>
+            </span>
+          </span>
+        </el-tree>
       </div>
     </div>
-    <el-dialog title="鏂板" :visible.sync="outerVisible" :modal-append-to-body="true" :append-to-body="true">
-      <el-dialog
-        width="30%"
-        :title="dialogTitle"
-        :visible.sync="innerVisible"
-        append-to-body
-      >
-       <el-form :inline="true" :model="formInline" size="small">
-          <el-form-item :label="$t('userManage.orgManageObj.username')">
+    <div class="itemSettings">
+      <div class="title_box">
+        <h4>璇︾粏淇℃伅</h4>
+      </div>
+      <div class="form_box">
+        <el-form :model="itemdetail">
+          <el-form-item label="鍚嶇О" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.name" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="绠�绉�" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.sname" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="缂栫爜" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.code" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鏈烘瀯浠g爜" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.uncode" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鍦板潃" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.addr" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="鑱旂郴鏂瑰紡" :label-width="formLabelWidth">
             <el-input
-              v-model="formInline.user"
-              :placeholder="$t('userManage.orgManageObj.username')"
+              v-model="itemdetail.contact"
+              autocomplete="off"
             ></el-input>
           </el-form-item>
-       
-          <el-form-item>
-            <el-button
-              type="primary"
-              @click="onSubmit"
-              icon="el-icon-search"
-              plain
-              >{{ $t("userManage.orgManageObj.inquire") }}</el-button
-            >
-            <el-button type="primary" icon="el-icon-delete" plain>{{
-              $t("userManage.orgManageObj.delete")
-            }}</el-button>
+          <el-form-item label="浼犵湡" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.fax" autocomplete="off"></el-input>
           </el-form-item>
-        </el-form>
-        <el-table
-          ref="multipleTable"
-          :data="tableData1"
-          tooltip-effect="dark"
-          style="width: 100%"
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column type="selection" width="55"> </el-table-column>
-          <el-table-column prop="name" :label="$t('userManage.orgManageObj.ChineseNameUsername')">
-          </el-table-column>
-          <el-table-column prop="name" :label="$t('userManage.orgManageObj.phoneNumberToTeceiveShortMessages')">
-          </el-table-column>
-          <el-table-column prop="address" :label="$t('userManage.orgManageObj.status')"> </el-table-column>
-        </el-table>
-        <div style="margin-top: 40px" class="pagination_box">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage4"
-            :page-sizes="[10, 20, 30, 40]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="10"
-          >
-          </el-pagination>
-        </div>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary">{{$t('userManage.orgManageObj.confirm')}}</el-button>
-          <el-button @click="innerVisible = false">{{$t('userManage.orgManageObj.close')}}</el-button>
-        </div>
-      </el-dialog>
-      <el-dialog
-        width="30%"
-        title="琛屾斂鍖哄垝-鍒楄〃"
-        :visible.sync="innerVisible1"
-        append-to-body
-      >
-       <el-form :inline="true" :model="formInline" size="small">
-          <el-form-item :label="$t('userManage.orgManageObj.name')">
+          <el-form-item label="鐢靛瓙閭欢" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.email" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="閭斂缂栫爜" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.post" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="缃戠珯鍦板潃" :label-width="formLabelWidth">
             <el-input
-              v-model="formInline.user"
-              :placeholder="$t('userManage.orgManageObj.name')"
+              v-model="itemdetail.website"
+              autocomplete="off"
             ></el-input>
           </el-form-item>
-       
-          <el-form-item>
-            <el-button
-              type="primary"
-              @click="onSubmit"
-              icon="el-icon-search"
-              plain
-              >{{ $t("userManage.orgManageObj.inquire") }}</el-button
-            >
-            <el-button type="primary" icon="el-icon-delete" plain>{{
-              $t("userManage.orgManageObj.delete")
-            }}</el-button>
+          <el-form-item label="澶囨敞" :label-width="formLabelWidth">
+            <el-input v-model="itemdetail.bak" autocomplete="off"></el-input>
           </el-form-item>
+          <div class="btnBox">
+            <el-button type="primary" @click="updDep">淇濆瓨</el-button>
+            <el-button type="primary" @click="reset">鍙栨秷</el-button>
+          </div>
         </el-form>
-        <el-table
-          ref="multipleTable"
-          :data="tableData1"
-          tooltip-effect="dark"
-          style="width: 100%"
-          @selection-change="handleSelectionChange"
+      </div>
+    </div>
+    <el-dialog title="鏂板瀛愮洰褰�" :visible.sync="dialogFormVisible">
+      <el-form :model="ruleForm" ref="ruleForm" :rules="rules">
+        <el-form-item
+          label="鐩綍鍚嶇О"
+          prop="name"
+          :label-width="formLabelWidth"
         >
-          <el-table-column type="selection" width="55"> </el-table-column>
-          <el-table-column prop="name" :label="$t('userManage.orgManageObj.name')"> </el-table-column>
-          <el-table-column prop="address" :label="$t('userManage.orgManageObj.coding')" show-overflow-tooltip>
-          </el-table-column>
-          <el-table-column
-            prop="address"
-            :label="$t('userManage.orgManageObj.codeOfAdministrativeDivision')"
-            show-overflow-tooltip
-          >
-          </el-table-column>
-          <el-table-column
-            prop="address"
-            :label="$t('userManage.orgManageObj.LevelForExaminationAndApproval')"
-            show-overflow-tooltip
-          >
-          </el-table-column>
-          <el-table-column
-            prop="address"
-            :label="$t('userManage.orgManageObj.seaAreaUseClass')"
-            show-overflow-tooltip
-          >
-          </el-table-column>
-        </el-table>
-        <div style="margin-top: 40px" class="pagination_box">
-          <el-pagination
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage4"
-            :page-sizes="[10, 20, 30, 40]"
-            :page-size="10"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="10"
-          >
-          </el-pagination>
-        </div>
-        <div slot="footer" class="dialog-footer">
-           <el-button type="primary">{{$t('userManage.orgManageObj.confirm')}}</el-button>
-          <el-button @click="innerVisible1 = false">{{$t('userManage.orgManageObj.close')}}</el-button>
-
-        </div>
-      </el-dialog>
-      <el-form
-        :model="ruleForm"
-        :rules="rules"
-        ref="ruleForm"
-        label-width="150px"
-      >
-        <div class="flexForm">
-          <div style="width: 50%">
-            <el-form-item :label="$t('userManage.orgManageObj.companyName')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.pinyinInitials')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.abbreviation')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.unitCode')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.organizationCode')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.companyAdministrator')" prop="name">
-              <el-input
-                v-model="ruleForm.name"
-                :disabled="true"
-                style="width: calc(100% - 138px)"
-              ></el-input>
-              <el-button
-                type="primary"
-                icon="el-icon-more"
-                @click="innerVisible = true"
-              ></el-button>
-              <el-button type="danger">娓呴櫎</el-button>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.phone')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-          </div>
-          <div style="width: 50%">
-            <el-form-item :label="$t('userManage.orgManageObj.picture')">
-              <el-upload
-                :auto-upload="false"
-                class="avatar-uploader"
-                action="#"
-                :show-file-list="false"
-                :http-request="request"
-                :limit="1"
-              >
-                <img v-if="imageUrl" :src="imageUrl" class="avatar" />
-                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-              </el-upload>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.flatType')" prop="region">
-              <el-select
-                v-model="ruleForm.region"
-                placeholder=""
-                style="width: 100%"
-              >
-                <el-option
-                  label="娴峰煙琛屾斂閮ㄩ棬"
-                  value="娴峰煙琛屾斂閮ㄩ棬"
-                ></el-option>
-                <el-option
-                  label="娴峰煙鐩戞祴閮ㄩ棬"
-                  value="娴峰煙鐩戞祴閮ㄩ棬"
-                ></el-option>
-                <el-option
-                  label="娴风洃鎵ф硶閮ㄩ棬"
-                  value="娴风洃鎵ф硶閮ㄩ棬"
-                ></el-option>
-                <el-option label="鎶�鏈腑蹇�" value="鎶�鏈腑蹇�"></el-option>
-                <el-option label="淇℃伅涓績" value="淇℃伅涓績"></el-option>
-                <el-option label="鐢ㄦ捣鍗曚綅" value="鐢ㄦ捣鍗曚綅"></el-option>
-              </el-select>
-            </el-form-item>
-
-            <el-form-item :label="$t('userManage.orgManageObj.division')" prop="name">
-              <el-input
-                v-model="ruleForm.name"
-                :disabled="true"
-                style="width: calc(100% - 138px)"
-              ></el-input>
-              <el-button
-                type="primary"
-                icon="el-icon-more"
-                @click="innerVisible1 = true"
-              ></el-button>
-              <el-button type="danger">娓呴櫎</el-button>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.EMail')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.fax')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item :label="$t('userManage.orgManageObj.postalCode')" prop="name">
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-          </div>
-        </div>
-
-        <el-form-item :label="$t('userManage.orgManageObj.website')" prop="name">
-          <el-input v-model="ruleForm.name"></el-input>
+          <el-input v-model="ruleForm.name" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('userManage.orgManageObj.cmpanyAddress')" prop="name">
-          <el-input v-model="ruleForm.name"></el-input>
+        <el-form-item label="鐩綍璇存槑" :label-width="formLabelWidth">
+          <el-input v-model="ruleForm.descr" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('userManage.orgManageObj.companyIntroduction')" prop="name">
-          <el-input
-            type="textarea"
-            :rows="2"
-            placeholder=""
-            v-model="ruleForm.textarea"
-          >
-          </el-input>
+        <el-form-item label="鐩綍澶囨敞" :label-width="formLabelWidth">
+          <el-input v-model="ruleForm.bak" autocomplete="off"></el-input>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm('ruleForm')"
-          >{{$t('userManage.orgManageObj.immediatelyCreate')}}</el-button
+        <el-button @click="resetForm('ruleForm')">鍙栨秷</el-button>
+        <el-button
+          type="primary"
+          @click="submitForm('ruleForm')"
+          v-loading.fullscreen.lock="fullscreenLoading"
+          >鎻愪氦</el-button
         >
-        <el-button @click="resetForm('ruleForm')">{{$t('userManage.orgManageObj.reset')}}</el-button>
       </div>
     </el-dialog>
   </div>
@@ -390,317 +124,288 @@
 
 <script>
 import MyBread from "../../components/MyBread.vue";
-
+import {
+  queryDepTree,
+  updateDepTree,
+  updateDepTrees,
+  queryMaxId,
+} from "../../api/api";
 export default {
   //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
   components: {
     MyBread,
   },
-
   data() {
+    let validName = (rule, value, callback) => {
+      if (value === "") {
+        return callback(new Error("鐩綍鍚嶇О涓嶈兘涓虹┖"));
+      } else {
+        callback();
+      }
+    };
     return {
-      dialogTitle:"鐢ㄦ埛-鍒楄〃",
-      tableData1: [
-        {
-          date: "2016-05-03",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-02",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-04",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-01",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-08",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-06",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-        {
-          date: "2016-05-07",
-          name: "鐜嬪皬铏�",
-          address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�",
-        },
-      ],
-      imageUrl: "",
-      ruleForm: {
-        name: "",
-        region: "",
-        date1: "",
-        date2: "",
-        delivery: false,
-        type: [],
-        resource: "",
-        desc: "",
-      },
-      rules: {
-        name: [
-          { required: true, message: "璇疯緭鍏ユ椿鍔ㄥ悕绉�", trigger: "blur" },
-          { min: 3, max: 5, message: "闀垮害鍦� 3 鍒� 5 涓瓧绗�", trigger: "blur" },
-        ],
-        region: [
-          { required: true, message: "璇烽�夋嫨娲诲姩鍖哄煙", trigger: "change" },
-        ],
-        date1: [
-          {
-            type: "date",
-            required: true,
-            message: "璇烽�夋嫨鏃ユ湡",
-            trigger: "change",
-          },
-        ],
-        date2: [
-          {
-            type: "date",
-            required: true,
-            message: "璇烽�夋嫨鏃堕棿",
-            trigger: "change",
-          },
-        ],
-        type: [
-          {
-            type: "array",
-            required: true,
-            message: "璇疯嚦灏戦�夋嫨涓�涓椿鍔ㄦ�ц川",
-            trigger: "change",
-          },
-        ],
-        resource: [
-          { required: true, message: "璇烽�夋嫨娲诲姩璧勬簮", trigger: "change" },
-        ],
-        desc: [{ required: true, message: "璇峰~鍐欐椿鍔ㄥ舰寮�", trigger: "blur" }],
-      },
-      outerVisible: false,
-      innerVisible: false,
-      innerVisible1: false,
-      formInline: {
-        user: "",
-        region: "",
-      },
-      currentPage4: 4,
-      tableData: [
-        {
-          menuname: "鏁版嵁璐ㄦ",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "鏁版嵁浜ゆ崲",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "鏁版嵁绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "鏈嶅姟绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "缁煎悎灞曠ず",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "杩愮淮绠$悊",
-          parentmenuname: "",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "鑿滃崟绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "鐢ㄦ埛绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "绯荤粺绠$悊",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-        {
-          menuname: "绯荤粺閰嶇疆",
-          parentmenuname: "杩愮淮绠$悊",
-          dataBulk: "1",
-          creationtime: "2022-7-20",
-          creationname: "寮犱笁",
-        },
-      ],
-      data: [
-        {
-          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",
-              children: [
-                {
-                  id: 11,
-                  label: "涓夌骇 3-2-1",
-                },
-                {
-                  id: 12,
-                  label: "涓夌骇 3-2-2",
-                },
-                {
-                  id: 13,
-                  label: "涓夌骇 3-2-3",
-                },
-              ],
-            },
-          ],
-        },
-      ],
       defaultProps: {
         children: "children",
-        label: "label",
+        label: "name",
       },
-      multipleSelection: [],
+      fullscreenLoading: false,
+      oriData: [], //鍘熷鏍戞暟鎹�
+      depList: [], //el鏍戞暟鎹�
+      old_depData: [], //el鏍戞暟鎹�(鎷栧姩鍓�)
+      newData: [], //鎷栧姩鍚庡師濮嬫暟鎹�
+      itemdetail: {
+        addr: "",
+        bak: "",
+        code: "",
+        contact: "",
+        email: "",
+        fax: "",
+        name: "",
+        post: "",
+        sname: "",
+        uncode: "",
+        website: "",
+      },
+      backUpData: {},
+      formLabelWidth: "170px",
+      deleteIDs: "",
+      dialogFormVisible: false,
+      ruleForm: {
+        level: null,
+        orderNum: null,
+        pid: null,
+        name: "",
+        descr: "",
+        bak: "",
+      },
+      rules: {
+        name: [{ validator: validName, trigger: "blur" }],
+      },
     };
   },
   methods: {
-    handleSelectionChange(val) {
-      this.multipleSelection = val;
+    getMenuTree() {
+      //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
+      queryDepTree().then((res) => {
+        if (res.code == 200) {
+          this.oriData = res.result;
+          this.newData = res.result;
+          this.depList = this.treeData(res.result);
+        } else {
+          console.log("鎺ュ彛鎶ラ敊");
+        }
+      });
     },
-    request(param) {},
-    onSubmit() {
-      console.log("submit!");
+    treeData(source) {
+      let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕
+      return cloneData.filter((father) => {
+        // 寰幆鎵�鏈夐」
+        let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁
+        branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊�
+        return father.pid == 1; // 杩斿洖涓�绾ц彍鍗�
+      });
+    },
+    append(node, data) {
+      this.dialogFormVisible = true;
+      this.ruleForm.pid = data.id;
+      this.ruleForm.orderNum = node.childNodes.length + 1;
+      this.ruleForm.level = data.level + 1;
+      // console.log(data);
+      // console.log(node);
+    },
+    resetForm(formName) {
+      this.dialogFormVisible = false;
+      this.$refs[formName].resetFields();
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.fullscreenLoading = true;
+          // console.log(this.ruleForm);
+          // insertDir(this.ruleForm)
+          //   .then((res) => {
+          //     setTimeout(() => {
+          //       this.fullscreenLoading = false;
+          //       if (res.code == 200) {
+          //         this.$message({
+          //           message: "娣诲姞鎴愬姛",
+          //           type: "success",
+          //         });
+          //       }
+          //     }, 2000);
+          //   })
+          //   .catch((res) => {
+          //     console.log(res);
+          //     this.fullscreenLoading = false;
+          //   });
+
+          // this.validCode = ""; //娓呯┖楠岃瘉鐮佽緭鍏ユ鐨勫唴瀹�
+        } else {
+          // alert("鐩綍鍚嶇О涓嶈兘涓虹┖");
+          return false;
+        }
+      });
+    },
+    remove(node, data) {
+      this.$confirm("姝ゆ搷浣滃皢鍒犻櫎璇ヨ妭鐐�, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          // console.log(node);
+          // console.log(data);
+
+          const parent = node.parent;
+          const children = parent.data.children || parent.data;
+          children.splice(data.orderNum - 1, 1);
+          children.forEach((item, index) => {
+            item.orderNum = index + 1;
+          });
+
+          this.traverseArr(data);
+          console.log(this.deleteIDs);
+          this.$message({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堝垹闄�",
+          });
+        });
+      // this.dialogMessage="鏄惁鍒犻櫎"
+      // this.dialogFlag = 1;
+      // this.dialogFrom ={
+      //   node:node,
+      //   val:data
+      // }
+      //   this.dialogVisible=true;//鐩綍鏍戞洿鏀瑰脊绐�
+      // const parent = node.parent;
+      // const children = parent.data.children || parent.data;
+      // const index = children.findIndex((d) => d.id === data.id);
+      // let res = children.splice(index, 1);
+      // // console.log(res);
+      // // console.log(data);
+      // console.log(this.flaten(res));
+    },
+    traverseArr(obj) {
+      if (obj.children) {
+        return obj.children.forEach((item) => {
+          // console.log(item.id + "---" + item.name);
+          this.deleteIDs += "id=" + item.id + "&";
+          this.traverseArr(item);
+        });
+      }
+      return;
+    },
+    flaten(arr) {
+      return arr.reduce((p, v, i) => {
+        for (let i = 0; i < p.length; i++) {
+          if (p[i].children) {
+            delete p[i].children;
+          }
+        }
+        return p.concat(v.children ? this.flaten(v.children).concat(v) : v);
+      }, []);
     },
     handleDragStart(node, ev) {
-      console.log("drag start", node);
-    },
-    handleDragEnter(draggingNode, dropNode, ev) {
-      console.log("tree drag enter: ", dropNode.label);
-    },
-    handleDragLeave(draggingNode, dropNode, ev) {
-      console.log("tree drag leave: ", dropNode.label);
-    },
-    handleDragOver(draggingNode, dropNode, ev) {
-      console.log("tree drag over: ", dropNode.label);
-    },
-    handleDragEnd(draggingNode, dropNode, dropType, ev) {
-      console.log("tree drag end: ", dropNode && dropNode.label, dropType);
+      this.old_depData = JSON.parse(JSON.stringify(this.depList)); //灏嗗浠界殑dir閲嶆柊璧嬪��
     },
     handleDrop(draggingNode, dropNode, dropType, ev) {
-      console.log("tree drop: ", dropNode.label, dropType);
+      this.$confirm("姝ゆ搷浣滃皢淇濆瓨鐩綍鏇存敼, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(() => {
+          //鐖惰妭鐐�
+          let data = dropType != "inner" ? dropNode.parent.data : dropNode.data;
+          // 鐖惰妭鐐逛腑鍏ㄩ儴瀛愯妭鐐�
+          let nodeData =
+            dropNode.level == 1 && dropType != "inner" ? data : data.children;
+          //鍙樻洿鑺傜偣
+          // console.log(nodeData);
+          nodeData.forEach((item, i) => {
+            if (dropType != "inner") {
+              if (draggingNode.data.pid === dropNode.data.pid) {
+                item.pid = item.pid;
+              } else {
+                item.pid = dropNode.data.pid;
+              }
+            } else {
+              item.pid = data.id;
+            }
+            item.orderNum = i + 1;
+          });
+          // console.log(nodeData);
+          //鏇存柊鍘熷鏁翠綋鏁版嵁
+          let arr = [];
+          this.oriData.forEach((e) => {
+            nodeData.forEach((item) => {
+              if (item.id === e.id) e = item;
+            });
+            arr.push(e);
+          });
+          this.newData = arr;
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "宸插彇娑堟洿鏀�",
+          });
+          this.depList = this.old_depData; //灏嗗浠界殑dir閲嶆柊璧嬪��
+        });
     },
-    allowDrop(draggingNode, dropNode, type) {
-      if (dropNode.data.label === "浜岀骇 3-1") {
-        return type !== "inner";
-      } else {
-        return true;
-      }
+    sendChange() {
+      updateDepTrees(this.newData)
+        .then((res) => {
+          // console.log(res);
+          if (res.code == 200) {
+            this.$message({
+              type: "success",
+              message: "鏇存柊鎴愬姛!",
+            });
+          }
+        })
+        .catch(() => {
+          alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+        });
     },
-    allowDrag(draggingNode) {
-      return draggingNode.data.label.indexOf("涓夌骇 3-2-2") === -1;
+    handleNodeClick(data) {
+      // console.log(data);
+      this.backUpData = JSON.stringify(data);
+      this.itemdetail = JSON.parse(JSON.stringify(data));
     },
-    handleSizeChange(val) {
-      console.log(`姣忛〉 ${val} 鏉);
+    updDep() {
+      updateDepTree(this.itemdetail).then((res) => {
+        console.log(res);
+      });
     },
-    handleCurrentChange(val) {
-      console.log(`褰撳墠椤�: ${val}`);
+    reset() {
+      this.itemdetail = JSON.parse(this.backUpData);
     },
-    handleCheckChange() {},
   },
-  created() {
-   
+  mounted() {
+    this.getMenuTree();
   },
-  mounted(){
-    
-    //  this.$nextTick(() => {
-    // console.log($t('operatManage.operationLogObj.add'))
-    // });
-  }
 };
 </script>
 <style lang="less" scoped>
 //@import url(); 寮曞叆鍏叡css绫�
 .menuSettings_box {
-  //   background: rgb(240, 242, 245);
   border-radius: 10px;
   height: 100%;
   padding: 10px;
   box-sizing: border-box;
   display: flex;
   .menuSettings_tree {
+    position: relative;
     width: 344px;
     height: 100%;
     background: rgb(240, 242, 245);
@@ -708,18 +413,41 @@
     border-radius: 10px;
     box-sizing: border-box;
     overflow: auto;
-    .el-tree {
-      background: transparent;
-      /deep/ .el-tree-node__label {
-        font-size: 18px;
-      }
-      /deep/ .el-tree-node {
-        padding-top: 10px;
-        padding-bottom: 10px;
+    .saveBtn {
+      position: absolute;
+      left: 250px;
+      top: 23px;
+    }
+    .menuTreeBox {
+      height: 88%;
+      width: 100%;
+      overflow: auto;
+      .el-tree {
+        background: transparent;
+        font-size: 15px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #000000;
+        /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;
+          }
+        }
       }
     }
   }
-  .menuSettings {
+  .itemSettings {
     width: calc(100% - 344px);
     border-radius: 10px;
     background: rgb(240, 242, 245);
@@ -727,66 +455,33 @@
     height: 100%;
     padding: 10px;
     box-sizing: border-box;
-    overflow: auto;
-    .btn_box {
+    .title_box {
       background: #fff;
       padding: 10px;
       margin-bottom: 24px;
-
+      display: flex;
       border-radius: 10px;
       border: 1px solid rgb(202, 201, 204);
       box-sizing: border-box;
-      .delBtn {
-        margin-left: auto;
-      }
-      .herder_box {
-        padding: 10px;
-        border-bottom: 1px solid #ccc;
-        margin-bottom: 20px;
-        font-size: 14px;
-      }
     }
-    .table_box {
+    .form_box {
       border: 1px solid rgb(202, 201, 204);
       border-radius: 10px;
       background: #fff;
-      padding: 10px;
+      padding-top: 30px;
       box-sizing: border-box;
       width: 100%;
-      .el-table__body {
-        width: 100% !important;
+      .el-input,
+      /deep/ .el-textarea {
+        width: 400px;
+      }
+      .btnBox {
+        margin: 0 270px 20px;
+        width: 200px;
+        display: flex;
+        justify-content: space-between;
       }
     }
   }
-}
-.avatar-uploader {
-  width: 120px;
-  height: 120px;
-  border: 1px dashed #c0ccda;
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-}
-.avatar-uploader:hover {
-  border-color: #409eff;
-}
-.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 120px;
-  height: 120px;
-  line-height: 120px;
-  text-align: center;
-}
-.avatar {
-  width: 120px;
-  height: 120px;
-  display: block;
-}
-.flexForm {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
 }
 </style>
diff --git a/src/views/userManage/userInfoManage.vue b/src/views/userManage/userInfoManage.vue
index f758634..3d3de5d 100644
--- a/src/views/userManage/userInfoManage.vue
+++ b/src/views/userManage/userInfoManage.vue
@@ -9,18 +9,18 @@
     <el-divider />
     <div class="inquire">
       <el-form ref="ruleForm" :model="form" :inline="true">
-        <el-form-item :label="$t('operatManage.ELM.username')" prop="username">
+        <el-form-item :label="$t('operatManage.ELM.username')" prop="name">
           <el-input
-            v-model="form.username"
+            v-model="form.name"
             :placeholder="$t('operatManage.ELM.usernameInfo')"
           />
         </el-form-item>
-        <el-form-item
+        <!-- <el-form-item
           :label="$t('userManage.userInfoObj.userStatus')"
-          prop="ownedSystem"
+          prop="userStatus"
         >
           <el-select
-            v-model="form.ownedSystem"
+            v-model="form.userStatus"
             :placeholder="$t('userManage.userInfoObj.userStatus')"
           >
             <el-option :label="$t('userManage.userInfoObj.all')" value="all" />
@@ -45,13 +45,13 @@
               value="rejection"
             />
           </el-select>
-        </el-form-item>
+        </el-form-item> -->
         <el-form-item
-          :label="$t('userManage.userInfoObj.companyName')"
-          prop="requestIp"
+          :label="$t('userManage.userInfoObj.depName')"
+          prop="depName"
         >
           <el-input
-            v-model="form.requestIp"
+            v-model="form.depName"
             :placeholder="$t('common.pleaseInput')"
           />
         </el-form-item>
@@ -59,95 +59,130 @@
         <el-form-item>
           <el-button type="success" size="small" @click="showAddDialog"
             ><i class="el-icon-plus"></i>&nbsp;{{
-              $t('common.append')
+              $t("common.append")
             }}</el-button
-          >
-          <el-button type="primary" size="small">
-            {{ $t('userManage.userInfoObj.userinput') }}</el-button
-          >
-          <el-button type="primary" size="small">
-            {{ $t('userManage.userInfoObj.userexport') }}</el-button
           >
         </el-form-item>
         <el-form-item style="margin-left: 60%">
-          <el-button @click="onSubmit"
+          <el-button @click="onSubmit" size="mini"
             ><i class="el-icon-search"></i> &nbsp;{{
-              $t('operatManage.ELM.search')
+              $t("operatManage.ELM.search")
             }}</el-button
           >
         </el-form-item>
         <el-form-item>
-          <el-button @click="resetForm('ruleForm')"
+          <el-button @click="resetForm('ruleForm')" size="mini"
             ><i class="el-icon-delete"></i>&nbsp;{{
-              $t('operatManage.ELM.reset')
+              $t("operatManage.ELM.reset")
             }}</el-button
           >
         </el-form-item>
       </el-form>
     </div>
     <div class="table_box">
-      <el-table :data="tableData" stripe style="width: 100%" height="99%">
+      <el-table
+        :data="tableData"
+        stripe
+        border
+        style="width: 100%"
+        max-height="99%"
+      >
         <el-table-column
           align="center"
           type="index"
-          :label="$t('operatManage.ELM.index')"
-          width="70px"
+          :label="$t('common.index')"
+          fixed
         />
         <el-table-column
           align="center"
-          prop="username"
-          width="220px"
-          :label="$t('userManage.userInfoObj.chineseName')"
+          prop="uname"
+          :label="$t('userManage.userInfoObj.uname')"
+          fixed
         />
         <el-table-column
           align="center"
-          prop="ip"
-          width="220px"
-          :label="$t('userManage.userInfoObj.affiliatedUnit')"
+          prop="pwd"
+          :label="$t('userManage.userInfoObj.pwd')"
         />
+
         <el-table-column
           align="center"
-          prop="ownedSystem"
-          width="230px"
-          :label="$t('userManage.userInfoObj.mobileNumber')"
-        />
-        <el-table-column
-          align="center"
-          prop="largeModuleName"
-          :label="$t('userManage.userInfoObj.state')"
+          prop="sex"
+          :label="$t('userManage.userInfoObj.sex')"
         >
           <template slot-scope="scope">
-            <el-tag v-if="scope.row.largeModuleName == '姝e父'" type="success">{{
-              scope.row.largeModuleName
-            }}</el-tag>
-            <el-tag v-if="scope.row.largeModuleName == '寮傚父'" type="danger">{{
-              scope.row.largeModuleName
-            }}</el-tag>
+            <span v-if="scope.row.sex == 1"> 鐢� </span>
+            <span v-else-if="scope.row.sex == 0">濂�</span>
+            <span v-else>鏈煡</span>
           </template>
         </el-table-column>
         <el-table-column
           align="center"
-          prop="smallModuleName"
-          :label="$t('userManage.userInfoObj.post')"
+          prop="natives"
+          :label="$t('userManage.userInfoObj.natives')"
         />
         <el-table-column
           align="center"
-          prop="resourceName"
-          :label="$t('userManage.userInfoObj.addtime')"
+          prop="depName"
+          :label="$t('userManage.userInfoObj.depName')"
         />
         <el-table-column
-          fixed="right"
-          :label="$t('common.operate')"
-          width="200"
+          align="center"
+          prop="idcard"
+          :label="$t('userManage.userInfoObj.idcard')"
+        /><el-table-column
+          align="center"
+          prop="job"
+          :label="$t('userManage.userInfoObj.job')"
+        />
+        <el-table-column
+          align="center"
+          prop="edu"
+          :label="$t('userManage.userInfoObj.edu')"
+        />
+        <el-table-column
+          align="center"
+          prop="addr"
+          :label="$t('userManage.userInfoObj.addr')"
+        />
+        <el-table-column
+          align="center"
+          prop="email"
+          :label="$t('userManage.userInfoObj.email')"
+        />
+        <el-table-column
+          align="center"
+          prop="contact"
+          :label="$t('userManage.userInfoObj.contact')"
+        />
+
+        <el-table-column
+          align="center"
+          prop="largeModuleName"
+          :label="$t('userManage.userInfoObj.status')"
         >
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status == 0" type="success">姝e父</el-tag>
+            <el-tag v-if="scope.row.status == 1" type="info">绂佺敤</el-tag>
+            <el-tag v-if="scope.row.status == 2" type="warning">鍒犻櫎</el-tag>
+            <el-tag v-if="scope.row.status == 3">鐢宠</el-tag>
+            <el-tag v-if="scope.row.status == 4" type="danger">鎷掓壒</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="bak"
+          :label="$t('userManage.userInfoObj.bak')"
+        />
+        <el-table-column :label="$t('common.operate')" fixed="right">
           <template #default>
             <!-- <el-button type="primary" size="small">淇敼</el-button> -->
 
-            <el-button type="warning" size="small">{{
-              $t('common.edit')
+            <el-button type="warning" size="mini">{{
+              $t("common.edit")
             }}</el-button>
-            <el-button type="danger" size="small">{{
-              $t('common.delete')
+            <el-button type="danger" size="mini">{{
+              $t("common.delete")
             }}</el-button>
           </template>
         </el-table-column>
@@ -160,424 +195,87 @@
           :page-sizes="[10, 20, 30, 40]"
           :page-size="10"
           layout="total, sizes, prev, pager, next, jumper"
-          :total="9"
+          :total="1"
         >
         </el-pagination>
       </div>
     </div>
-    <el-dialog :visible.sync="dialogTableVisible" width="57%" >
-      <el-tabs v-model="activeName" @tab-click="handleClick">
-        <el-tab-pane
-          :label="$t('userManage.userInfoObj.userAccount')"
-          name="first"
-        >
-          <el-form
-            :model="ruleForm"
-            :rules="rules"
-            ref="ruleForm"
-            label-width="100px"
-            class="demo-ruleForm"
-          >
-            <el-form-item
-              :label="$t('userManage.userInfoObj.username')"
-              prop="name"
-            >
-              <el-input v-model="ruleForm.name"></el-input>
-            </el-form-item>
-            <el-form-item
-              :label="$t('userManage.userInfoObj.userpssword')"
-              prop="password"
-            >
-              <el-input type="password" v-model="ruleForm.password"></el-input>
-            </el-form-item>
-            <el-form-item
-              :label="$t('userManage.userInfoObj.userstate')"
-              prop="password"
-            >
-              <label>{{ $t('userManage.userInfoObj.toapplied') }}</label>
-            </el-form-item>
-          </el-form>
-        </el-tab-pane>
-        <el-tab-pane
-          :label="$t('userManage.userInfoObj.userInformation')"
-          name="second"
-        >
-          <el-form
-            :model="ruleForm"
-            :rules="rules"
-            ref="ruleForm"
-            label-width="180px"
-            class="demo-ruleForm"
-          >
-            <el-row>
-              <el-col :span="12">
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.userchinesename')"
-                  prop="name"
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.username')"
-                  prop="name"
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.sex')"
-                >
-                  <el-radio v-model="radio" label="1">{{$t('userManage.userInfoObj.userMan')}}</el-radio>
-                  <el-radio v-model="radio" label="2">{{$t('userManage.userInfoObj.userWoMan')}}</el-radio>
-                </el-form-item>
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.nativePlace')"
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <div style="margin-left: 35px">
-                  <div
-                    style="
-                      width: 205px;
-                      height: 185px;
-                      border: 1px solid gray;
-                      margin: 5px;
-                    "
-                  >
-                    <img />
-                  </div>
-                  <el-upload
-                    class="upload-demo"
-                    action="https://jsonplaceholder.typicode.com/posts/"
-                    list-type="picture"
-                  >
-                    <el-button size="small" type="primary">{{$t('common.clickupload')}}</el-button>
-                    <span style="color: red"
-                      >  {{$t('userManage.userInfoObj.spantitle1')}}</span
-                    >
-                  </el-upload>
-                </div>
-              </el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12">
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.identityCard')"
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12"
-                ><el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.education')"
-
-                >
-                  <el-select
-                    v-model="form.region1"
-                    class="select"
-                    :placeholder="$t('userManage.userInfoObj.pleaseSelect')"
-                  >
-                    <el-option :label="$t('userManage.userInfoObj.doctor')" value="a1" />
-                     <el-option :label="$t('userManage.userInfoObj.master')" value="a2" />
-                        <el-option :label="$t('userManage.userInfoObj.undergraduate')" value="a3" />
-                           <el-option :label="$t('userManage.userInfoObj.juniorCollege')" value="a4" />
-                              <el-option :label="$t('userManage.userInfoObj.other')" value="a5" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12">
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.occupation')"
-                >
-                  <el-select
-                    v-model="form.region2"
-                    class="select"
-                      :placeholder="$t('userManage.userInfoObj.pleaseSelect')"
-                  >
-                    <el-option :label="$t('userManage.userInfoObj.assistant')"  value="b1" />
-                    <el-option :label="$t('userManage.userInfoObj.intermediate')"  value="b2" />
-                     <el-option :label="$t('userManage.userInfoObj.senior')"  value="b3" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12"
-                ><el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.post')"
-
-                >
-                  <el-select
-                    class="select"
-                    v-model="form.region3"
-                       :placeholder="$t('userManage.userInfoObj.pleaseSelect')"
-                  >
-            <el-option  :label="$t('userManage.userInfoObj.v1')"   value="c1" />
-            <el-option  :label="$t('userManage.userInfoObj.fv1')"   value="c2" />
-              <el-option  :label="$t('userManage.userInfoObj.v2')"   value="c3" />  <el-option  :label="$t('userManage.userInfoObj.fv2')"   value="c4" />
-                <el-option  :label="$t('userManage.userInfoObj.v3')"   value="c5" />
-                  <el-option  :label="$t('userManage.userInfoObj.fv3')"   value="c6" />
-                    <el-option  :label="$t('userManage.userInfoObj.v4')"   value="c7" />
-                      <el-option  :label="$t('userManage.userInfoObj.fv4')"   value="c8" />
-                        <el-option  :label="$t('userManage.userInfoObj.v5')"   value="c9" />
-                            <el-option  :label="$t('userManage.userInfoObj.fv5')"   value="c10" />
-            <el-option  :label="$t('userManage.userInfoObj.v6')"   value="c11" />
-              <el-option  :label="$t('userManage.userInfoObj.v7')"   value="c12" />  <el-option  :label="$t('userManage.userInfoObj.fv7')"   value="c13" />
-                <el-option  :label="$t('userManage.userInfoObj.v8')"   value="c14" />
-                  <el-option  :label="$t('userManage.userInfoObj.v9')"   value="c15" />
-                    <el-option  :label="$t('userManage.userInfoObj.fv9')"   value="c16" />
-
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </el-row>
-                        <el-row>
-              <el-col :span="12">
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.email')"
-
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item
-                  <el-form-item
-                  :label="$t('userManage.userInfoObj.major')"
-
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="12">
-                <el-form-item
-                  :label="$t('userManage.userInfoObj.phoneNumber')"
-
-                >
-                  <el-input
-                    v-model="ruleForm.name"
-                    style="width: 225px"
-                  ></el-input>
-                  <el-checkbox style="margin-left: 10px" v-model="checked"
-                    >{{$t('userManage.userInfoObj.receiveSMS')}}</el-checkbox
-                  >
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item
-                  :label="$t('userManage.userInfoObj.officeTelephone')"
-
-                >
-                  <el-input v-model="ruleForm.name"></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row>
-                <el-col :span="24">
-                   <el-form-item
-                  :label="$t('userManage.userInfoObj.addressbook')"
-
-                >
-                  <el-input style="width:755px" v-model="ruleForm.name"></el-input>
-                </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-row>
-             <el-row>
-                <el-col :span="24">
-                   <el-form-item
-                  :label="$t('userManage.userInfoObj.remarks')"
-                >
-                  <el-input type="textarea" style="width:755px" v-model="ruleForm.name"></el-input>
-                </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-row>
-            <el-row>
-                <el-col :span="24">
-                   <el-form-item
-                  :label="$t('userManage.userInfoObj.scanningcopy')"
-
-                >
-              <el-upload
-                    class="upload-demo"
-                    action="https://jsonplaceholder.typicode.com/posts/"
-                    list-type="picture"
-                  >
-                    <el-button size="small" type="primary">{{$t('common.upload')}}</el-button>
-                    <span style="color: red"
-                      >  {{$t('userManage.userInfoObj.spantitle2')}}</span>
-                  </el-upload>
-                </el-form-item>
-                </el-col>
-              </el-form-item>
-            </el-row>
-          </el-form>
-        </el-tab-pane>
-      </el-tabs>
-      <el-button type="primary" @click="onSubmit">{{$t('common.preservation')}}</el-button>
-      <el-button>{{$t('common.close')}}</el-button>
-    </el-dialog>
   </div>
 </template>
 
 <script>
-import MyBread from '../../components/MyBread.vue';
-
+import MyBread from "../../components/MyBread.vue";
+import { queryPageUser } from "../../api/api";
 export default {
   //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
   components: {
     MyBread,
   },
-
   data() {
+    let validName = (rule, value, callback) => {
+      if (value === "") {
+        return callback(new Error("鐩綍鍚嶇О涓嶈兘涓虹┖"));
+      } else {
+        callback();
+      }
+    };
     return {
       currentPage: 1,
-      dialogTableVisible: false,
-      activeName: 'first',
-      ruleForm: { name: '', password: '' },
-      ruleForm1: {
-        name: '',
-        value: '',
+      form: {
+        username: "",
+        userStatus: "all",
+        requestIp: "",
+      },
+      tableData: [],
+      fullscreenLoading: false,
+      itemdetail: {},
+      formLabelWidth: "170px",
+      dialogFormVisible: false,
+      ruleForm: {
+        level: null,
+        orderNum: null,
+        pid: null,
+        name: "",
+        descr: "",
+        bak: "",
       },
       rules: {
-        name: [
-          { required: true, message: '璇疯緭鍏ョ敤鎴峰悕', trigger: 'blur' },
-          { min: 3, max: 5, message: '闀垮害鍦� 3 鍒� 5 涓瓧绗�', trigger: 'blur' },
-        ],
-        password: [
-          { required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' },
-          {
-            trigger: 'blur',
-            validator: (rule, value, callback) => {
-              var passwordreg =
-                /(?=.*\d)(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,20}/;
-              if (!passwordreg.test(value)) {
-                callback(
-                  new Error('瀵嗙爜蹇呴』鐢辨暟瀛椼�佸瓧姣嶃�佺壒娈婂瓧绗︾粍鍚�,璇疯緭鍏�8-20浣�')
-                );
-              } else {
-                callback();
-              }
-            },
-          },
-        ],
+        name: [{ validator: validName, trigger: "blur" }],
       },
-      form: {
-        username: '',
-        ownedSystem: 'all',
-        requestIp: '',
-        operationType: '',
-        date: '',
-      },
-      tableData: [
-        {
-          username: '绠$悊鍛�',
-          ip: '221.182.31.12',
-          date: '2022-08-05',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '寮傚父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '寮傚父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '寮傚父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-        {
-          date: '2022-08-05',
-          username: '绠$悊鍛�',
-          ownedSystem: '',
-          largeModuleName: '姝e父',
-          smallModuleName: '璧勬簮鎿嶄綔鏃ュ織',
-          resourceName: '',
-          operationType: '鏌ヨ',
-          ip: '221.182.31.12',
-        },
-      ],
     };
   },
   methods: {
+    getUserInfo(params) {
+      // queryMaxId().then((res) => {
+      //   this.id = res.data;
+      // });
+      queryPageUser({
+        pageIndex: 1,
+        pageSize: 10,
+      }).then((res) => {
+        if (res.code == 200) {
+          this.tableData = res.result;
+        } else {
+          console.log("鎺ュ彛鎶ラ敊");
+        }
+      });
+    },
+    // getUserInfo() {
+    //   //鑾峰彇鐩綍鏍戞渶澶D锛屾柊寤鸿妭鐐逛娇鐢�
+    //   // queryMaxId().then((res) => {
+    //   //   this.id = res.data;
+    //   // });
+    //   queryDepTree().then((res) => {
+    //     if (res.status == 200) {
+    //       this.depList = this.treeData(res.data.result);
+    //       this.oriData = res.data.result;
+    //       this.newData = res.data.result;
+    //     } else {
+    //       console.log("鎺ュ彛鎶ラ敊");
+    //     }
+    //   });
+    // },
+
     handleSizeChange(val) {
       console.log(`姣忛〉 ${val} 鏉);
     },
@@ -585,7 +283,7 @@
       console.log(`褰撳墠椤�: ${val}`);
     },
     onSubmit() {
-      console.log('submit!');
+      console.log("submit!");
     },
     resetForm(formName) {
       this.$refs[formName].resetFields();
@@ -594,7 +292,9 @@
       this.dialogTableVisible = true;
     },
   },
-  created() { },
+  mounted() {
+    this.getUserInfo(1, 10);
+  },
 };
 </script>
 <style>

--
Gitblit v1.9.3