Ver Fonte

资源管理

zhangkunling há 2 anos atrás
pai
commit
556a46cc33

+ 1 - 2
src/assets/iconfont/iconfont.css

@@ -215,5 +215,4 @@
 
 .icon-nenghao:before {
   content: "\e609";
-}
-
+}

+ 1 - 0
src/router/index.js

@@ -99,6 +99,7 @@ const routes = [
         name: 'OperaTimeManage', 
         component: OperaTimeManage
       },
+      //系统设置
       {
         path: 'Organization', 
         name: 'Organization', 

+ 1 - 1
src/views/homecomponents/EquipmentAnalysis/ToConfirmedAlarm.vue

@@ -27,7 +27,7 @@
           <FormItem label="" >
             <Button type="primary" class="common-btn-search" @click="searchClick">
               <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
-            </Button> 
+            </Button>
             <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
               <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
             </Button>   

+ 26 - 23
src/views/homecomponents/SystemSettings/Organization.vue

@@ -67,7 +67,8 @@ export default {
 				if (res.httpCode == 1) {
           this.stationData = res.data
           if (text == 'update') {
-            this.stationData = this.getChangeTree(this.stationData,currentOrgId,editText)
+            this.stationData = this.getParentIdList(this.stationData,currentOrgId,editText)
+            // this.stationData = this.getChangeTree(this.stationData,currentOrgId,editText)
           } else {
             this.stationData = this.getTree(this.stationData)
           }
@@ -96,23 +97,23 @@ export default {
         return v;
       });
     },
-    getChangeTree(arr,currentOrgId,editText) {
-      return arr.map((v,index) => {
-        if (v.level== 1) {
-          v.disabled = true
-        }
-        if (v.nodeId == currentOrgId) {
-          this.levelNum = v.level
-          v.selected = true
-          v.disabled = true
-          this.currentStation = v.title
-          this.currentOrgId = v.nodeId
-          this.$refs.treeManage.getOrgData(v.nodeId,editText)
-        }
-        if (v.children) v.children = this.getChangeTree(v.children,currentOrgId,editText);
-        return v;
-      });
-    },
+    // getChangeTree(arr,currentOrgId,editText) {
+    //   return arr.map((v,index) => {
+    //     if (v.level== 1) {
+    //       v.disabled = true
+    //     }
+    //     if (v.nodeId == currentOrgId) {
+    //       this.levelNum = v.level
+    //       v.selected = true
+    //       v.disabled = true
+    //       this.currentStation = v.title
+    //       this.currentOrgId = v.nodeId
+    //       this.$refs.treeManage.getOrgData(v.nodeId,editText)
+    //     }
+    //     if (v.children) v.children = this.getChangeTree(v.children,currentOrgId,editText);
+    //     return v;
+    //   });
+    // },
     iconChange: _.throttle(function() {
       this.currentStaData = []
       this.treeName = []
@@ -242,11 +243,10 @@ export default {
       }
     },
     // 递归循环 根据当前id找到它的所有父节点
-    getParentIdList(list, id) {
+    getParentIdList(list, id,editText) {
         if (!list || !id) {
             return ''
         }
-        let arr = [];
         let findParent = (data, currentdId, nodeId) => {
             for (var i = 0, length = data.length; i < length; i++) {
                 let node = data[i];
@@ -259,15 +259,18 @@ export default {
                 if (node.nodeId === currentdId) {
                     node.expand = true
                     if (node.title == this.currentStation) {
-                      node.expand = true   
+                      node.expand = true
                       this.currentOrgId = node.nodeId
                       node.selected = true
                       node.disabled = true
                       this.showTree = true
-                      this.$refs.treeManage.getOrgData(node.nodeId)        
+                      this.$refs.treeManage.getOrgData(node.nodeId,editText)
+                      if( node.children) {
+                        findParent(node.children, currentdId, node.nodeId);
+                      }       
                     }
                     if (!node.nodeId) {
-                        break
+                      break
                     }
                     findParent(list, nodeId);
                     // break

+ 27 - 46
src/views/homecomponents/SystemSettings/OrganizationIndex.vue

@@ -119,14 +119,6 @@
 				<FormItem label="上级节点:" >
           <span>{{orgTitle}}</span>
 				</FormItem>
-        <!-- <FormItem label="组织名称:" prop="orgName">
-          <Poptip v-model="visiblePoptip" placement="bottom-start">
-              <i-input clearable v-model="formOption.orgName" placeholder="请选择组织机构"></i-input>
-              <div slot="content">
-                <Tree :data="stationData" @on-select-change="handleCheckChange"></Tree>
-              </div>
-          </Poptip>
-				</FormItem> -->
 				<FormItem label="序号:" prop="orgOrder">
           <InputNumber :max="99" :min="1" v-model="formOption.orgOrder" placeholder="请输入1~99,序号越小显示越靠前"></InputNumber>
         </FormItem>
@@ -150,7 +142,7 @@
     <Modal
       v-model="modalStatus"
       :title="commonTitle"
-      width="25"
+      width="35"
       ref="modalGrag"
       draggable
       reset-drag-position
@@ -202,9 +194,7 @@ export default {
       },
       formOption: {},
       isSaveNumber: false,
-      numberTitle: 'edit',
       isSaveName: false,
-      nameTitle: 'edit',
       isSaveLeader: false,
       showModal: false,
       enabledData: [
@@ -343,13 +333,12 @@ export default {
       orgTitle: '',
       isOrgAdd: '',// 判断是新增平级还是下级
       disabledLevel: 0,
-      // visiblePoptip: false,
       currentTreeId: null,
     };
   },
   watch: {
     levelNum: {
-     handler(newValue, oldValue) {
+     handler(newValue) {
         this.disabledLevel = newValue
         if (this.disabledLevel>=5) {
         this.childDisabled = true
@@ -363,23 +352,13 @@ export default {
   },
   methods: {
     pageJump (currentOrgObj) {
-      // let menuNameArr = []
-      // menuNameArr = ['系统设置','用户管理']
-      // sessionStorage.setItem('routname', '/MainPage/UserManagement')
-      // sessionStorage.setItem('menuNameArr',JSON.stringify(menuNameArr))
-      // this.$router.push({ name: 'UserManagement', params: { orgId:currentOrgObj.orgId }})
+      let menuNameArr = []
+      menuNameArr = ['系统设置','用户管理']
+      sessionStorage.setItem('routname', '/MainPage/UserManagement')
+      sessionStorage.setItem('menuNameArr',JSON.stringify(menuNameArr))
+      this.$router.push({ name: 'UserManagement', params: { orgId:currentOrgObj.orgId }})
     },
-    // getTestTree(arr) {
-    //   return arr.map((v,index) => {
-    //     v.value = v.id
-    //     v.label = v.title
-    //     v.children = v.children ? v.children: []
-    //     if (v.children) v.children = this.getTestTree(v.children);
-    //     return v;
-    //   });
-    // },
     editIconNumber (title) {
-      this.numberTitle = title
       if (title == 'edit') {
         this.isSaveNumber = true
       } else {
@@ -402,7 +381,6 @@ export default {
      }
     },
     editIconName (title) {
-      this.nameTitle = title
       if (title == 'edit') {
         this.isSaveName = true
       } else {
@@ -425,7 +403,6 @@ export default {
       }
     },
     editIconLeader (title) {
-      this.nameTitle = title
       if (title == 'edit') {
         this.isSaveLeader = true
       } else {
@@ -536,7 +513,11 @@ export default {
     addClick (text) {
       this.isOrgAdd = text
       this.title = '新增组织'
-      this.orgTitle = this.currentOrganList.parentOrgName ? this.currentOrganList.parentOrgName : this.stationData[0].title
+      if (this.currentOrganList.orgLevel == 2) {
+        this.orgTitle = text == '平级' ? this.stationData[0].title : this.currentOrganList.orgName
+      } else {
+        this.orgTitle = text == '平级' ? this.currentOrganList.parentOrgName : this.currentOrganList.orgName
+      }
       if(text == '平级') {
         this.formOption = JSON.parse(JSON.stringify(defaultFrom))
         this.formOption.orgLevel = this.currentOrganList.orgLevel
@@ -555,20 +536,20 @@ export default {
       this.title = '编辑组织'
       this.showModal = true
     },
-    // delClick (row) {
-    //   this.rowObj = row
-    //   let params = {
-    //     sysOrgId: row.orgId
-    //   }
-    //   this.$get('metroapi/org/delSysOrg',params).then(res=>{
-    //     if (res.httpCode == 1 ){
-    //       let orgId = row.parentOrgId 
-    //       this.$emit('changeTree',orgId)
-    //     } else {
-    //       this.$Message.info(res.msg)
-    //     }
-    //   })
-    // },
+    delClick (row) {
+      this.rowObj = row
+      let params = {
+        sysOrgId: row.orgId
+      }
+      this.$get('metroapi/org/delSysOrg',params).then(res=>{
+        if (res.httpCode == 1 ){
+          let orgId = row.parentOrgId 
+          this.$emit('changeTree',orgId)
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    },
     modalChange (modalStatus) {
       if (!modalStatus) {
         this.$refs.formOption.resetFields();
@@ -747,7 +728,7 @@ export default {
      height: 100%;
    }
    >>> .ivu-input {
-     width: 165px;
+     width: 180px;
      height: 32px;
    }
    >>> .ivu-date-picker-editor .ivu-input {

+ 237 - 5
src/views/homecomponents/SystemSettings/ResourceManagement.vue

@@ -1,24 +1,256 @@
 <template>
-  <div class="container">
-    角色
+  <div class="content-main">
+    <div class="content-body-wrap">
+     <div class="content-body">
+         <Row :gutter="8" style="width:100%;height: 100%">
+          <i-col span="4" style="height:100%">
+            <div class="station-tree">
+              <div class="station-tree-body">
+                <div class="station-tree-top">
+                  <Input suffix="ios-search" placeholder="输入关键字查询" clearable search v-model="currentStation" class="common-search"  @on-search="iconChange"/>
+                </div>
+                <div class="station-tree-center">
+                  <div class="station-tree-left common-scroll" v-show="showTree">
+                    <tree-list :defaultData="stationData" :currentStaData="currentStaData" :clickAllNode="false" v-if="stationData && stationData.length>0" @treeChange="treeChange" ref="tree"></tree-list>
+                  </div>
+                  <div class="station-tree-left-notree" v-show="!showTree">
+                    关键字输入错误!
+                  </div>
+                </div>
+              </div>
+            </div>
+          </i-col>
+          <i-col span="20" style="height:100%">
+            <div class="right-main">
+              <resource-management-index :stationData="stationData" :levelNum="levelNum" :currentMenuId="currentMenuId" @changeTree="changeTree" ref="treeManage"></resource-management-index>
+            </div>
+          </i-col>
+        </Row>
+     </div>
+    </div>
   </div>
 </template>
 <script>
+import ResourceManagementIndex from './ResourceManagementIndex.vue'
 export default {
   name: "ResourceManagement",
-  components:{
+   components:{
+    ResourceManagementIndex
   },
   data() {
     return {
+      currentStation: '',
+      currentStaData: [], // 当前搜索框搜索的站台数组对象,传给子组件,用来判断单选站台名当前选中状态
+      showTree: true,// 是否显示树形组件
+		  stationData: [],
+      levelNum: 0,
+      currentMenuId: '',
     };
+  }, 
+  created () {
+    this.getMetroLevel('init')
   },
   mounted() {
   },
   methods: {
-   
+     // 获取树形数据
+    getMetroLevel (text,currentMenuId,editText) {
+      this.$get('metroapi/menu/sysMenuTree').then(res => {
+				if (res.httpCode == 1) {
+          this.stationData = res.data
+          if (text == 'update') {
+            this.stationData = this.getParentIdList(this.stationData,currentMenuId,editText)
+          } else {
+            this.stationData = this.getTree(this.stationData)
+          }
+				}
+		  })
+    },
+    getTree(arr) {
+      return arr.map((v,index) => {
+        if (index==0) {
+          v.expand = true
+        } else {
+          v.expand = false
+        }
+        if (v.level== 1) {
+          v.disabled = true
+        }
+        if (index==0 && v.level== 2) {
+          this.levelNum = v.level
+          v.selected = true
+          v.disabled = true
+          this.currentStation = v.title
+          this.currentMenuId = v.nodeId
+          this.$refs.treeManage.getMenuData(v.nodeId)
+        }
+        if (v.children) v.children = this.getTree(v.children);
+        return v;
+      });
+    },
+    iconChange: _.throttle(function() {
+      this.currentStaData = []
+      this.treeName = []
+      if(this.currentStation != ''){
+        this.showTree = false
+        document.querySelector(".common-scroll").scrollTo(0, 0); // 滚动条回到顶部
+      } else {
+        document.querySelector(".common-scroll").scrollTo(0, 0); // 滚动条回到顶部
+        this.showTree = true
+        this.stationData = this.getTree(this.stationData)
+        return 
+      }
+      if (this.currentStation == this.stationData[0].title) {
+        this.showTree = true
+        return
+      }
+      let currentNodeId = this.filterNodeId(this.stationData,this.currentStation)
+      if (currentNodeId) {
+        console.log(currentNodeId)
+        this.stationData = this.getParentIdList(this.stationData,currentNodeId)
+        console.log(this.stationData)
+      }
+		}, 500),
+    // 根据搜索框的值查到当前nodeId
+    filterNodeId(list,val){
+      let _this=this
+      for (let i = 0; i < list.length; i++) {
+        let a=list[i]
+        if(a.title=== val){
+          return a.nodeId
+        }else{
+          if(a.children && a.children.length>0){
+            let res=_this.filterNodeId(a.children,val)
+            if(res){
+              return res
+            }
+          }
+        }
+      }
+    },
+    // 递归循环 根据当前id找到它的所有父节点
+    getParentIdList(list, id,editText) {
+        if (!list || !id) {
+            return ''
+        }
+        let findParent = (data, currentdId, nodeId) => {
+            for (var i = 0, length = data.length; i < length; i++) {
+                let node = data[i];
+                node.expand = false
+                node.selected = false
+                node.disabled = false
+                if (node.level== 1) {
+                  node.disabled = true
+                }
+                if (node.nodeId === currentdId) {
+                    node.expand = true
+                    if (node.title == this.currentStation) {
+                      node.expand = true
+                      this.currentMenuId = node.nodeId
+                      node.selected = true
+                      node.disabled = true
+                      this.showTree = true
+                      this.$refs.treeManage.getMenuData(node.nodeId,editText)
+                       if(node.children) {
+                        findParent(node.children, currentdId, node.nodeId); 
+                      }
+                    }
+                    if (!node.nodeId) {
+                        break
+                    }
+                    findParent(list, nodeId);
+                    // break
+                } else {
+                    if (node.children) {
+                      findParent(node.children, currentdId, node.nodeId);
+                    }
+                    continue
+                }
+            }
+            return list;
+        }
+        return findParent(list, id);
+    },
+    treeChange(val,arr,level,currentNodeId) {
+      this.levelNum = level
+      this.currentStation = val
+      this.$refs.treeManage.getMenuData(currentNodeId)
+		},
+    changeTree (currentMenuId,editText) {
+      this.getMetroLevel('update',currentMenuId,editText)
+    }
   }
 };
 </script>
 <style scoped lang="stylus">
-
+.content-main {
+  width: 100%;
+  height: calc(100% - 50px);
+  overflow: hidden;
+}
+.content-body-wrap {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+}
+.content-body {
+  width: 100%;
+  height: 100%;
+  background: #06214D;
+}
+.common-search {
+  width: 100%;
+}
+>>> .common-search .ivu-input {
+  background-color: #06214D;
+  border: 1px solid #2355A6;
+  border-radius: 15px;
+  color: #fff;
+  height: 32px;
+}
+>>> .common-search .ivu-input:focus {
+    border-color: #0185ea;
+}
+.station-tree {
+  height: 100%;
+  padding: 10px;
+}
+.station-tree-body {
+  border: 1px solid #204384;
+  height: 100%;
+  padding: 10px;
+}
+.station-tree-center {
+  height: calc(100% - 32px);
+  padding-top: 10px;
+}
+.station-tree-left {
+  height: 100%;
+  overflow: auto;
+}
+.station-tree-left-notree {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  fon-size: 14px;
+}
+.right-main {
+  height: 100%;
+  padding: 10px 0;
+}
+/* 对话框里的input里的placeholder样式修改 */
+/deep/ .ivu-input::-webkit-input-placeholder , /deep/ .ivu-input-number-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholde, /deep/ .ivu-input-number-input::-webkit-input-placeholderr{    /* Mozilla Firefox 4 to 18 */
+ color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
 </style>

+ 886 - 0
src/views/homecomponents/SystemSettings/ResourceManagementIndex.vue

@@ -0,0 +1,886 @@
+<template>
+  <div class="content-main-manage">
+    <div class="content-top">
+      <div class="content-top-title">当前资源信息</div>
+      <div class="btn-container">
+        <Button icon="ios-add" class="common-add-btn common-add-btn-left" @click="addClick('平级')">新增平级资源</Button>
+        <Button icon="ios-add" class="common-add-btn" @click="addClick('下级')" :disabled="childDisabled">新增下级资源</Button>
+      </div>
+    </div>
+    <Form class="common-form common-form-list" ref="currentMenuList" :model="currentMenuList" :rules="ruleValidate" :label-width="120" inline>
+      <FormItem label="序号" prop="displayOrder" style="width:48%">
+        <div v-show="!isSaveNumber" class="form-item-save">
+          <div class="form-item-init">{{currentMenuList.displayOrder}}</div>
+          <i class='iconfont icon-bianji1' @click="editIconNumber('edit')"></i>
+        </div>
+        <div v-show="isSaveNumber" class="form-item-save">
+          <InputNumber placeholder="请输入1~99,序号越小显示越靠前" :max="99" :min="1" v-model.trim="currentMenuList.displayOrder"></InputNumber>
+          <i class='iconfont icon-baocun2' @click="editIconNumber('save')"></i>
+        </div>
+      </FormItem>
+      <FormItem label="资源名称" prop="menuName" style="width:48%">
+        <div v-show="!isSaveName" class="form-item-save">
+          <div class="form-item-init">{{currentMenuList.menuName}}</div>
+          <i class='iconfont icon-bianji1' @click="editIconName('edit')"></i>
+        </div>
+        <div v-show="isSaveName" class="form-item-save">
+          <Input placeholder="" v-model.trim="currentMenuList.menuName" maxlength="20" show-word-limit />
+          <i class='iconfont icon-baocun2' @click="editIconName('save')"></i>
+        </div>
+      </FormItem>
+      <FormItem label="资源类型" prop="resourceType" style="width:48%">
+         <div v-show="!isSaveResoType" class="form-item-save">
+          <div class="form-item-init">{{currentMenuList.resourceTypeName}}</div>
+          <i class='iconfont icon-bianji1' @click="editIconResourceType('edit')"></i>
+        </div>
+        <div v-show="isSaveResoType" class="form-item-save">
+          <Select v-model="currentMenuList.resourceType" placeholder="资源类型">
+              <Option v-for="item in resourceTypeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+          </Select>
+          <i class='iconfont icon-baocun2' @click="editIconResourceType('save')"></i>
+        </div>
+      </FormItem>
+      <FormItem label="启用状态" prop="isEnable" style="width:48%;">
+        <div>
+           <i-switch true-color="#57C44F" :true-value="1" :false-value="0" v-model="currentMenuList.isEnable" @mousedown.native="changeSwitch(currentMenuList)">
+        </i-switch>
+        </div>
+      </FormItem>
+      <FormItem label="URL" prop="linkUrl" style="width:48%">
+         <div v-show="!isSaveUrl" class="form-item-save">
+          <div class="form-item-init">{{currentMenuList.linkUrl}}</div>
+          <i class='iconfont icon-bianji1' @click="editIconUrl('edit')"></i>
+        </div>
+        <div v-show="isSaveUrl" class="form-item-save">
+          <Input placeholder="输入资源地址" v-model="currentMenuList.linkUrl" />
+          <i class='iconfont icon-baocun2' @click="editIconUrl('save')"></i>
+        </div>
+        <!-- <span class="form-item-bot-left" @click="pageJump(currentMenuList)">{{currentMenuList.linkUrl}}</span> -->
+      </FormItem>
+      <FormItem label="更新时间" prop="equipmentStatus" style="width:48%">
+        <span class="form-item-bot-right">{{currentMenuList.updateTime}}</span>
+      </FormItem>
+    </Form>
+    <div class="content-top">
+      <div class="content-top-title">次级资源信息</div>
+    </div>
+    <div class="search-list">
+      <div class="search-left">
+        <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+          <FormItem label="" prop="resourceType">
+            <Select v-model="tableParams.resourceType" placeholder="资源类型">
+              <Option v-for="item in resourceTypeData" :value="item.value" :key="item.value">{{ item.label }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="isEnable">
+            <Select v-model="tableParams.isEnable" placeholder="启用状态">
+              <Option v-for="item in isEnableData" :value="item.value" :key="item.value">{{ item.label }}</Option>
+            </Select>
+          </FormItem>
+          <FormItem label="" prop="keywords">
+            <Input placeholder="输入关键词进行查询" clearable search v-model="tableParams.keywords" />
+          </FormItem>
+          <FormItem label="" >
+            <Button type="primary" class="common-btn-search" @click="searchClick">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+            </Button> 
+            <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+              <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+            </Button>   
+          </FormItem>
+        </Form>
+      </div>
+    </div>
+    <div class="manage-main-center">
+      <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading">
+        <template slot="loading">
+            <Loading-animation></Loading-animation>
+        </template>
+         <template slot-scope="{ row }" slot="action">
+           <Tooltip content="编辑" placement="top">
+              <i class="iconfont icon-bianji" style="cursor:pointer;color:#64ACFE;fontSize:20px;marginRight:6px" @click="editClick(row)"></i>
+           </Tooltip>
+            <Tooltip content="删除" placement="top">
+              <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
+           </Tooltip>
+        </template>
+      </Table>
+    </div>
+    <div class="common-page">
+      <div class="common-page-total">
+        共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+      </div>
+      <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+    </div>
+    <Modal
+      v-model="showModal"
+      :title="title"
+      width="36"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      @on-visible-change="modalChange"
+      class-name="common-modal">
+      <Form class="common-form common-form-modal" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="120">
+				<FormItem label="上级节点:" >
+          <span>{{menuTitle}}</span>
+				</FormItem>
+				<FormItem label="序号:" prop="displayOrder">
+          <InputNumber :max="99" :min="1" v-model="formOption.displayOrder" placeholder="请输入1~99,序号越小显示越靠前"></InputNumber>
+        </FormItem>
+        <FormItem label="资源名称:" prop="menuName">
+          <Input v-model.trim="formOption.menuName" maxlength="20" show-word-limit />
+        </FormItem>
+        <FormItem label="资源类型:" prop="resourceType">
+         <Select v-model="formOption.resourceType" placeholder="资源类型">
+              <Option v-for="item in resourceTypeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+          </Select>
+        </FormItem>
+         <FormItem label="图标:" prop="imageUrl">   
+          <Input v-model="formOption.imageUrl" maxlength="25" show-word-limit placeholder="请输入图标class名称"/>
+          <div class="common-form-item-text">新增系统中不存在的资源,图标默认名称为icon-caidan</div> 
+        </FormItem>
+        <FormItem label="URL:" prop="linkUrl">
+          <Input v-model="formOption.linkUrl" maxlength="25" show-word-limit placeholder="输入资源地址"/>
+        </FormItem>
+         <FormItem label="启用状态:" prop="isEnable" v-if="title == '新增资源'">
+          <i-switch true-color="#57C44F" v-model="formOption.isEnable" disabled></i-switch>
+          <span style="color: #718EBD;margin-left:6px">关</span>
+          <span style="color: #718EBD;margin-left:12px">(所有新增状态均为关闭,需在列表打开)</span>
+        </FormItem>
+			</Form>
+      <div slot="footer">
+          <Button @click="modalCancel">取消</Button>
+          <Button type="primary" @click="modalOk('formOption')">确定</Button>
+       </div>
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+      <i :class="'iconfont '+ activeClass" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle!='确认删除'"></i>
+      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle=='确认删除'"></Icon>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+        </div>
+    </Modal>
+  </div>
+</template>
+<script>
+const defaultFrom = {parentMenuId: '',menuLevel:'',displayOrder:null,menuName: '',resourceType: '',imageUrl: '',linkUrl: '',isEnable:0}
+export default {
+  name: "ResourceManagementIndex",
+  components:{
+  },
+  props: {
+    stationData: {
+      type: Array,
+      default: () => {
+        return [];
+      }
+    },
+    levelNum: {
+      type: Number,
+    },
+    currentmenuId: [String,Number]
+  },
+  data() {
+    return {
+      currentMenuList: {},
+      currentParams: {},
+      ruleValidate: {
+        displayOrder: [{
+            required: true,
+            type: 'number',
+            message: '请输入序号',
+            trigger: 'blur'
+        }],
+        menuName: [{
+            required: true,
+            message: '请输入资源名称',
+            trigger: 'blur'
+        }],
+        resourceType: [{
+            required: true,
+            type: 'number',
+            message: '请选择资源类型',
+            trigger: 'change'
+        }],
+      },
+      isSaveNumber: false,
+      isSaveName: false,
+      isSaveResoType: false,
+      isSaveUrl: false,
+      showModal: false,
+      isEnableData: [
+         {
+          value: '-1',
+          label: '启用状态'
+        },
+        {
+          value: '1',
+          label: '启用'
+        },
+        {
+          value: '0',
+          label: '关闭'
+        },
+      ],
+      resourceTypeData: [
+         {
+          value: '-1',
+          label: '资源类型'
+        },
+        {
+          value: 1,
+          label: '菜单'
+        },
+        {
+          value: 2,
+          label: '页面'
+        },
+      ],
+      resourceTypeList: [
+        {
+          value: 1,
+          label: '菜单'
+        },
+        {
+          value: 2,
+          label: '页面'
+        },
+      ],
+      tableParams: {
+        menuId: '',
+        isEnable: '',
+        resourceType: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 6
+      },
+      tableData: [],
+      tableTotal: 0,
+      tablePage: 0,
+      rowObj: {},
+      loading: true,
+      isClickOrg: true,
+      isClickmenuId: null,
+      columns: [
+          {
+            title: '序号',
+            key: 'displayOrder',
+            align: 'center'
+          },
+          {
+            title: '资源名称',
+            key: 'menuName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '资源类型',
+            key: 'resourceTypeName',
+            align: 'center',
+            width: 100,
+          },
+          {
+            title: '上级节点',
+            key: 'parentMenuName',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: 'URL',
+            key: 'linkUrl',
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '更新时间',
+            align: 'center',
+            key: 'updateTime',
+            ellipsis: true,
+            tooltip: true
+          },
+          {
+            title: '启用状态',
+            key: 'isEnable',
+            align: 'center',
+            width: 120,
+            render: (h, params) => {
+              return h('div', [                             
+                h('i-switch', {
+                  props: { value: params.row.isEnable,'true-color': '#57C44F', trueValue:1,falseValue: 0
+                  },
+                  nativeOn:{
+                      "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
+                        this.rowObj =  params.row
+                        this.isClickOrg = false
+                        if (params.row.isEnable == 1) {
+                          this.commonTitle = '确认关闭'
+                          this.activeColor = '#E92E2E'
+                          this.activeClass = 'icon-guanbi'
+                          this.modalTitle = '关闭后,页面将从系统菜单中消失,已分配的角色资源不可见。请谨慎操作。'
+                          this.modalStatus = true         
+                        } else {
+                          this.commonTitle = '确认启用'
+                          this.activeColor = '#57C44F'
+                          this.activeClass = 'icon-qiyong'
+                          this.modalTitle = '请确保开发人员已完成对应配置再启用,否则影响资源显示效果。'
+                          this.modalStatus = true
+                        }
+                      },
+                    }
+                }),
+              ])
+            }
+        },
+        {
+          title: '操作',
+          align: 'center',
+          slot: 'action',
+          width: 80,
+        }
+      ],
+      modalStatus: false,
+      childDisabled: false,
+      title: '新增资源',
+      commonTitle: "",
+      activeColor: '#E92E2E',
+      activeClass: '',
+      modalTitle: '',
+      formOption: {parentMenuId: '',menuLevel:'',displayOrder:null,menuName: '',resourceType: '',imageUrl: '',linkUrl: '',isEnable:0},
+      menuTitle: '',
+      isMenuAdd: '',// 判断是新增平级还是下级
+      disabledLevel: 0,
+      currentTreeId: null,
+    };
+  },
+  watch: {
+    levelNum: {
+     handler(newValue) {
+        this.disabledLevel = newValue
+        if (this.disabledLevel>=4) {
+        this.childDisabled = true
+        } else {
+          this.childDisabled = false
+        }
+      }
+   },
+  },
+  mounted() {
+  },
+  methods: {
+    editIconNumber (title) {
+      if (title == 'edit') {
+        this.isSaveNumber = true
+      } else {
+        let params = this.currentMenuList
+        this.$nextTick(()=> {
+          this.$refs.currentMenuList.validateField('displayOrder',(valid)=> {
+            if (!valid) {
+               this.$post('metroapi/menu/save', params).then(res=>{
+                if (res.httpCode == 1 ){
+                  this.isSaveNumber = false
+                  this.$emit('changeTree',this.currentMenuList.menuId,'isTopEditOrg')
+                  this.$Message.info(res.msg)
+                } else {
+                  this.$Message.info(res.msg)
+                }
+              })
+            }
+          })
+        })
+     }
+    },
+    editIconName (title) {
+      if (title == 'edit') {
+        this.isSaveName = true
+      } else {
+          let params = this.currentMenuList
+          this.$nextTick(()=> {
+            this.$refs.currentMenuList.validateField('menuName',(valid)=> {
+              if (!valid) {
+                this.$post('metroapi/menu/save', params).then(res=>{
+                  if (res.httpCode == 1 ){
+                    this.isSaveName = false
+                    this.$emit('changeTree',this.currentMenuList.menuId,'isTopEditOrg')
+                    this.$Message.info(res.msg)
+                  } else {
+                    this.$Message.info(res.msg)
+                  }
+                })
+              }
+            })
+          })
+      }
+    },
+    editIconResourceType (title) {
+      if (title == 'edit') {
+        this.isSaveResoType = true
+      } else {
+          let params = this.currentMenuList
+          this.$nextTick(()=> {
+            this.$refs.currentMenuList.validateField('resourceType',(valid)=> {
+              if (!valid) {
+                this.$post('metroapi/menu/save', params).then(res=>{
+                  if (res.httpCode == 1 ){
+                    this.isSaveResoType = false
+                    this.$emit('changeTree',this.currentMenuList.menuId,'isTopEditOrg')
+                    this.$Message.info(res.msg)
+                  } else {
+                    this.$Message.info(res.msg)
+                  }
+                })
+              }
+            })
+          })
+      }
+    },
+    editIconUrl (title) {
+      if (title == 'edit') {
+        this.isSaveUrl = true
+      } else {
+          let params = this.currentMenuList
+          this.$post('metroapi/menu/save', params).then(res=>{
+            if (res.httpCode == 1 ){
+              this.isSaveUrl = false
+              this.$emit('changeTree',this.currentMenuList.menuId,'isTopEditOrg')
+              this.$Message.info(res.msg)
+            } else {
+              this.$Message.info(res.msg)
+            }
+          })
+      }
+    },
+    changeSwitch (curObj) {
+      this.isClickmenuId = curObj.menuId
+      this.isClickOrg = true
+        if (curObj.isEnable == 1) {
+          this.commonTitle = '确认关闭'
+          this.activeColor = '#E92E2E'
+          this.activeClass = 'icon-guanbi'
+          this.modalTitle = '关闭后,页面将从系统菜单中消失,已分配的角色资源不可见。请谨慎操作。'
+          this.modalStatus = true         
+        } else {
+          this.commonTitle = '确认启用'
+          this.activeColor = '#57C44F'
+          this.activeClass = 'icon-qiyong'
+          this.modalTitle = '请确保开发人员已完成对应配置再启用,否则影响资源显示效果。'
+          this.modalStatus = true
+        }
+    },
+    rowClassName(row, index) {
+      if (index % 2 == 0) {
+        return "ivu-table-stripe-even";
+      } else {
+        return "ivu-table-stripe-odd";
+      }
+    },
+    // 分页
+    changePage (val) {
+      this.tableParams.pageNum = val
+      this.getTableData()
+    },
+    //跳转
+    sizeChange (val) {
+      this.tableParams.pageSize = val
+      this.getTableData()
+    },
+    // 获取当前资源信息
+    getMenuData (currentMenuId,text) {
+      this.currentTreeId = currentMenuId
+      this.$get('metroapi/menu/queryMenu', {menuId:currentMenuId}).then(res=>{
+        if ( res.httpCode == 1 ){
+          this.currentMenuList = res.data
+          // 编辑当前信息(不是表格里的当前信息) 不走表格接口 text = = 'isTopEditOrg'
+          if (text != 'isTopEditOrg') {
+            this.getTableData(currentMenuId)
+          }
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })   
+    },
+     // 获取表格数据
+    getTableData (nodeId) {
+      this.tableParams.menuId = nodeId ? nodeId : this.currentTreeId
+      let params = JSON.parse(JSON.stringify(this.tableParams))
+      params.resourceType = params.resourceType == '-1' ? '' : params.resourceType
+      params.isEnable = params.isEnable == '-1'?'': params.isEnable
+      this.loading = true
+      this.$get('metroapi/menu/queryMenu/secondary', params).then(res=>{
+        this.loading = false
+          if (res.httpCode == 1 ){
+            this.tableData = res.data.data
+            this.tableTotal = res.data.count
+            if (res.data.data.length==0) {
+              this.tablePage = 0
+            } else {
+              this.tablePage = res.data.count<= 10 ? 1: Math.ceil(res.data.count/this.tableParams.pageSize)
+            } 
+            if (res.data.data.length==0 && this.tableParams.pageNum>1) {
+              this.tableParams.pageNum--
+              return this.getTableData()
+            }
+          } else {
+            this.tableData = []
+            this.tableTotal = 0
+          }
+        })
+    },
+    searchClick () {
+      this.tableParams.pageNum = 1
+      this.getTableData()
+    },
+    resetClick (name) {
+     this.$refs[name].resetFields()
+     this.tableParams.pageNum = 1
+     this.getTableData()
+    },
+    addClick (text) {
+      this.isMenuAdd = text
+      this.title = '新增资源'
+      if (this.currentMenuList.menuLevel == 2) {
+        this.menuTitle = text == '平级' ? this.stationData[0].title : this.currentMenuList.menuName
+      } else {
+        this.menuTitle = text == '平级' ? this.currentMenuList.parentMenuName : this.currentMenuList.menuName
+      }
+      if(text == '平级') {
+        this.formOption = JSON.parse(JSON.stringify(defaultFrom))
+        this.formOption.menuLevel = this.currentMenuList.menuLevel
+        this.formOption.parentMenuId = this.currentMenuList.parentMenuId ? this.currentMenuList.parentMenuId : ''
+        this.showModal = true
+      } else {
+        this.formOption.menuLevel = this.currentMenuList.menuLevel + 1
+        this.formOption.parentMenuId = this.currentMenuList.menuId
+      }
+      this.showModal = true
+    },
+    editClick (row) {
+      this.rowObj = row
+      this.formOption = JSON.parse(JSON.stringify(row));
+      this.menuTitle = this.formOption.parentMenuName
+      this.title = '编辑资源'
+      this.showModal = true
+    },
+    delClick (row) {
+      this.rowObj = row
+      this.commonTitle = '确认删除'
+      this.activeColor = '#E92E2E'
+      this.activeClass = ''
+      this.modalTitle = '删除关键资源可能导致系统崩溃,非专业人员请谨慎操作。'
+      this.modalStatus = true
+    },
+    modalChange (modalStatus) {
+      if (!modalStatus) {
+        this.$refs.formOption.resetFields();
+      }
+    },
+    modalOk (formName) {
+      let params = JSON.parse(JSON.stringify(this.formOption))
+      if (this.title == '新增资源') {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            this.$post('metroapi/menu/save', params).then(res=>{
+              if (res.httpCode == 1 ){
+                this.showModal = false
+                let menuId = null 
+                if (this.isMenuAdd == '平级') {
+                  menuId = this.currentMenuList.menuId
+                } else {
+                  menuId = params.parentMenuId
+                }
+                this.$emit('changeTree',menuId)
+                this.$Message.info(res.msg)
+              } else {
+                this.$Message.info(res.msg)
+              }
+            })
+          } else {
+            this.showModal = true
+          }
+       })
+      } else {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            this.$post('metroapi/menu/save', params).then(res=>{
+              if (res.httpCode == 1 ){
+                this.showModal = false
+                this.$emit('changeTree',this.rowObj.parentMenuId)
+                this.$Message.info(res.msg)
+              } else {
+                this.$Message.info(res.msg)
+              }
+            })
+          } else {
+            this.showModal = true
+          }
+       })
+      }
+    },
+    modalCancel () {
+      this.showModal = false
+    }, 
+    commonOk () {
+      if (this.commonTitle == '确认启用') {
+        let params = {
+          isEnable: 1
+        }
+        if (this.isClickOrg) {
+          params.menuId = this.isClickmenuId
+        } else {
+          params.menuId = this.rowObj.menuId
+        }
+        this.getisEnableStatus(params)
+      } else if (this.commonTitle == '确认关闭') {
+        let params = {
+          isEnable:0
+        }
+        if (this.isClickOrg) {
+          params.menuId = this.isClickmenuId
+        } else {
+          params.menuId = this.rowObj.menuId
+        }
+        this.getisEnableStatus(params)
+      } else if (this.commonTitle == '确认删除') {
+        let params = {
+          menuId:this.rowObj.menuId
+        }
+        this.delData(params)
+      }
+    },
+    commonCancel () {
+      this.modalStatus = false
+    },
+    // 启用 关闭/接口
+    getisEnableStatus (params) {
+      this.$post('metroapi/menu/update/enabled',params).then(res=>{
+        if (res.httpCode == 1 ){
+          if (params.isEnable == 0) {
+            if (this.isClickOrg) {
+             this.currentMenuList.isEnable = 0
+            } else {
+              this.rowObj.isEnable = 0
+            }
+          } else {
+            if (this.isClickOrg) {
+             this.currentMenuList.isEnable = 1
+            } else {
+              this.rowObj.isEnable = 1
+            }
+          }
+          this.modalStatus = false
+        } else {
+          if (this.isClickOrg) {
+            this.currentMenuList.isEnable = 0
+          } else {
+            this.rowObj.isEnable = 0
+          }
+          this.$Message.info(res.msg)
+        }
+      })
+    },
+    delData (params) {
+      this.$get('metroapi/menu/delete', params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.modalStatus = false
+          this.$emit('changeTree',this.rowObj.parentMenuId)
+          this.$Message.info(res.msg)
+        } else {
+          this.$Message.info(res.msg)
+        }
+      })
+    }
+  }
+};
+</script>
+<style scoped lang="stylus">
+.content-main-manage {
+  position: relative;
+  height: 100%;
+}
+.content-top { 
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid #173B77;
+  padding-bottom: 10px;
+}
+.content-top-title {
+  font-size: 16px;
+  font-weight: bold;
+  color: #0185EA;
+  padding-left: 8px;
+  border-left: 3px solid #0185EA;
+  height: 18px;
+  line-height: 18px;
+}
+.common-add-btn-left {
+  margin-right: 26px;
+}
+>>> .common-form-list {
+  margin-top: 20px;
+}
+>>> .common-form-list .ivu-form-item{
+  margin-bottom: 24px;
+}
+>>> .common-form-list .ivu-form-item-content {
+  display: flex;
+}
+>>> .common-form-list .iconfont {
+  margin-left: 18px;
+  color: #259FF8;
+  cursor: pointer;
+}
+.form-item-bot-left {
+  color: #0180E1;
+  text-decoration: underline;
+  cursor: pointer;
+}
+.form-item-bot-right {
+  color: #0180E1;
+}
+.form-item-save {
+  width: 100%;
+  display: flex;
+  height: 32px;
+}
+.form-item-init {
+  border: 1px solid #133263;
+  border-radius: 4px;
+  width: 100%;
+  padding-left: 7PX;
+}
+.search-list {
+  display: flex;
+}
+.search-left {
+  display: flex;
+  align-items: center;
+   .ivu-select {
+     width: 150px;
+     height: 32px;
+   }
+   .ivu-select-single .ivu-select-selection {
+     height: 100%;
+   }
+   >>> .ivu-input {
+     width: 180px;
+     height: 32px;
+   }
+   >>> .ivu-date-picker-editor .ivu-input {
+     width: 330px;
+   }
+   >>> .ivu-input-prefix, >>> .ivu-input-suffix {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .ivu-input-icon {
+     height: 32px;
+     line-height: 32px;
+   }
+   >>> .date-picker-main .ivu-date-picker-header {
+    border-bottom: 0.0052083333rem solid #204384;
+ }
+}
+.btn-container {
+  display: flex;
+  justify-content: flex-end;
+  padding-bottom: 10px;
+}
+.common-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+.common-form-modal {
+  display: flex;
+  flex-direction: column;
+}
+.manage-main-center {
+  width: 100%;
+}
+.common-table {
+  max-height: 100%;
+}
+>>> .common-table .ivu-table th {
+  height: 51px;
+ }
+ >>> .common-table .ivu-table td {
+  height: 51px;
+ }
+  >>> .common-table .ivu-spin-fix {
+   top: 51px;
+ }
+  >>> .app-table .ivu-spin-fix {
+   height: calc(100vh - 550px);
+ }
+ >>> .ivu-table-tip {
+  background: url('../../../assets/images/noData.png') no-repeat center;
+}
+>>> .app-table .ivu-table-tip {
+  height: calc(100vh - 550px);
+ }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
+ >>> .modal-table {
+   overflow: auto !important;
+ }
+ >>> .modal-table .ivu-spin-fix {
+   height: 200px;
+ }
+  >>> .modal-table .ivu-table-tip {
+   height: 200px;
+ }
+.common-page {
+  margin-top: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+}
+.common-page-total {
+  color: #fff;
+  padding-right: 10px;
+  font-size: 14px;
+  span {
+    color #409EFF;
+  }
+}
+.ivu-btn.disabled, .ivu-btn.disabled.active, .ivu-btn.disabled:active, .ivu-btn.disabled:focus, .ivu-btn.disabled:hover, .ivu-btn[disabled], .ivu-btn[disabled].active, .ivu-btn[disabled]:active, .ivu-btn[disabled]:focus, .ivu-btn[disabled]:hover, fieldset[disabled] .ivu-btn, fieldset[disabled] .ivu-btn.active, fieldset[disabled] .ivu-btn:active, fieldset[disabled] .ivu-btn:focus, fieldset[disabled] .ivu-btn:hover {
+  color: #e7e7e7;
+  background-color: #a3a3a3;
+  border-color: #a3a3a3;
+}
+.common-form-item-text {
+  font-size: 11px;
+  color: #85A3D4;
+}
+/* 对话框里的input里的placeholder样式修改 */
+/deep/ .ivu-input::-webkit-input-placeholder , /deep/ .ivu-input-number-input::-webkit-input-placeholder{
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{   /* Mozilla Firefox 19+ */
+  color: #718EBD;
+}
+/deep/ .ivu-input::-moz-placeholde, /deep/ .ivu-input-number-input::-webkit-input-placeholderr{    /* Mozilla Firefox 4 to 18 */
+ color: #718EBD;
+}
+/deep/ .ivu-input::-ms-input-placeholder, /deep/ .ivu-input-number-input::-webkit-input-placeholder{  /* Internet Explorer 10-11 */
+  color: #718EBD;
+}
+</style>

+ 103 - 98
src/views/homecomponents/SystemSettings/RolePermissions.vue

@@ -1,61 +1,65 @@
 <template>
   <div class="content-main-manage">
      <!-- <i class="iconfont icon-quanxian" style="cursor:not-allowed;color:#fb9c2c;fontSize:18px;marginRight:6px" v-if="row.roleId == 1"></i> -->
-    <!-- <div class="content-main">
+    <div class="content-main">
      <div class="content-body-wrap">
-        <div class="search-list">
-        <div class="search-left">
-          <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
-            <FormItem label="" prop="isEnable">
-            <Select v-model="tableParams.isEnable" placeholder="启用状态">
-              <Option v-for="item in isEnableData" :value="item.value" :key="item.value">{{ item.label }}</Option>
-            </Select>
-          </FormItem>
-            <FormItem label="" prop="keywords">
-              <Input placeholder="输入关键字查询" clearable search v-model="tableParams.keywords" />
-            </FormItem>
-            <FormItem label="" >
-              <Button type="primary" class="common-btn-search" @click="searchClick">
-                <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
-              </Button> 
-              <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
-                <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
-              </Button>   
-            </FormItem>
-          </Form>
-        </div>
-        <div class="btn-container">
-          <Button icon="ios-add" class="common-add-btn" @click="addClick">新增角色</Button>
-        </div>
-        </div>
-        <div class="manage-main-center">
-          <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading">
-            <template slot="loading">
-                <Loading-animation></Loading-animation>
-            </template>
-            <template slot-scope="{ row }" slot="colorValue">
-              <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.colorValue"></i>
-            </template>
-            <template slot-scope="{ row }" slot="action">
-              <Tooltip content="配置权限" placement="top">
-                  <i class="iconfont icon-quanxian" style="cursor:pointer;color:#fb9c2c;fontSize:18px;marginRight:6px" @click="permissionConfig(row)"></i>
-              </Tooltip>
-              <Tooltip content="编辑" placement="top">
-                  <i class="iconfont icon-bianji" style="cursor:pointer;color:#64ACFE;fontSize:20px;marginRight:6px" @click="editClick(row)"></i>
-              </Tooltip>
-              <Tooltip content="删除" placement="top">
-                  <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
-              </Tooltip>
-            </template>
-          </Table>
-        </div>
-        <div class="common-page">
-          <div class="common-page-total">
-            共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
-          </div>
-          <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
-        </div>
-        <Modal
+       <div class="content-body">
+          <div class="search-list">
+            <div class="search-left">
+              <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
+                <FormItem label="" prop="isEnable">
+                <Select v-model="tableParams.isEnable" placeholder="启用状态">
+                  <Option v-for="item in isEnableData" :value="item.value" :key="item.value">{{ item.label }}</Option>
+                </Select>
+              </FormItem>
+                <FormItem label="" prop="keywords">
+                  <Input placeholder="输入关键字查询" clearable search v-model="tableParams.keywords" />
+                </FormItem>
+                <FormItem label="" >
+                  <Button type="primary" class="common-btn-search" @click="searchClick">
+                    <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 筛选
+                  </Button> 
+                  <Button type="primary" class="common-btn-search" style="margin-left:10px" @click="resetClick('tableParams')">
+                    <Icon type="ios-search" style="margin-right:4px;font-size: 16px"/> 重置
+                  </Button>   
+                </FormItem>
+              </Form>
+            </div>
+            <div class="btn-container">
+              <Button icon="ios-add" class="common-add-btn" @click="addClick">新增角色</Button>
+            </div>
+            </div>
+            <div class="manage-main-center">
+              <Table :columns="columns" :data="tableData" class="common-table app-table" no-data-text="" :row-class-name="rowClassName" :loading="loading">
+                <template slot="loading">
+                    <Loading-animation></Loading-animation>
+                </template>
+                <template slot-scope="{ row }" slot="colorValue">
+                  <i class="iconfont icon-gaojing1" style="vertical-align: middle" :style="'color:' + row.colorValue"></i>
+                </template>
+                <template slot-scope="{ row }" slot="action">
+                  <Tooltip content="配置权限" placement="top">
+                      <i class="iconfont icon-quanxian" style="cursor:pointer;color:#fb9c2c;fontSize:18px;marginRight:6px" @click="permissionConfig(row)"></i>
+                  </Tooltip>
+                  <Tooltip content="编辑" placement="top">
+                      <i class="iconfont icon-bianji" style="cursor:pointer;color:#64ACFE;fontSize:20px;marginRight:6px" @click="editClick(row)"></i>
+                  </Tooltip>
+                  <Tooltip content="删除" placement="top">
+                      <i class="iconfont icon-shanchu" style="cursor:pointer;color:#E92E2E;fontSize:20px;marginRight:6px" @click="delClick(row)"></i>
+                  </Tooltip>
+                </template>
+              </Table>
+            </div>
+            <div class="common-page">
+              <div class="common-page-total">
+                共<span>{{tablePage}}</span>页 / <span>{{tableTotal}}</span>条数据
+              </div>
+              <Page :total="tableTotal" :current="tableParams.pageNum" :page-size="tableParams.pageSize" @on-change="changePage" @on-page-size-change="sizeChange" show-elevator />
+            </div>
+       </div>      
+     </div>
+    </div>
+    <Modal
           v-model="showModal"
           :title="title"
           width="34"
@@ -85,50 +89,48 @@
               <Button @click="modalCancel">取消</Button>
               <Button type="primary" @click="modalOk('formOption')">确定</Button>
             </div>
-        </Modal>
-        <Modal
-          v-model="modalStatus"
-          :title="commonTitle"
-          width="30"
-          ref="modalGrag"
-          draggable
-          reset-drag-position
-          :mask-closable="false"
-          class-name="common-modal">
-          <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon"></Icon>
-          <span class="modal-text">{{modalTitle}}</span>
-          <div slot="footer">
-              <Button @click="commonCancel">取消</Button>
-              <Button type="primary" @click="commonOk">确定</Button>
-           </div>
-        </Modal>
-        <Modal
-          v-model="permissStatus"
-          title="权限配置"
-          width="20"
-          ref="modalGrag"
-          draggable
-          reset-drag-position
-          :mask-closable="false"
-          class-name="common-modal common-modal-detail">
-          <div class="tree-menu-list common-scroll" v-if="permissionMenu && permissionMenu.length>0">
-            <Checkbox label="首页" v-model="homeChecked" :disabled="homeDisabled" class="home-menu-checkbox">
-             <span>首页(必选)</span>
-            </Checkbox>
-            <Tree :data="permissionMenu" show-checkbox class="tree-menu" :check-directly="true" ref="treeMenu"></Tree>
-          </div>
-          <div slot="footer">
-              <Button @click="commonPermissCancel">取消</Button>
-              <Button type="primary" @click="commonPermissOk">确定</Button>
-           </div>
-        </Modal>
-     </div>
-    </div> -->
+    </Modal>
+    <Modal
+      v-model="modalStatus"
+      :title="commonTitle"
+      width="30"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal">
+        <i :class="'iconfont '+ activeClass" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle!='确认删除'"></i>
+      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle=='确认删除'"></Icon>
+      <span class="modal-text">{{modalTitle}}</span>
+      <div slot="footer">
+          <Button @click="commonCancel">取消</Button>
+          <Button type="primary" @click="commonOk">确定</Button>
+       </div>
+    </Modal>
+    <Modal
+      v-model="permissStatus"
+      title="权限配置"
+      width="20"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal common-modal-detail">
+      <div class="tree-menu-list common-scroll" v-if="permissionMenu && permissionMenu.length>0">
+        <Checkbox label="首页" v-model="homeChecked" :disabled="homeDisabled" class="home-menu-checkbox">
+          <span>首页(必选)</span>
+        </Checkbox>
+        <Tree :data="permissionMenu" show-checkbox class="tree-menu" :check-directly="true" ref="treeMenu"></Tree>
+      </div>
+      <div slot="footer">
+          <Button @click="commonPermissCancel">取消</Button>
+          <Button type="primary" @click="commonPermissOk">确定</Button>
+       </div>
+    </Modal>
   </div>
 </template>
 <script>
 const defaultFrom = {roleName: '',roleDescribe: '',isEnable: 0}
-import axios from 'axios'
 export default {
   name: "RolePermissions",
   components:{
@@ -447,9 +449,12 @@ export default {
   width: 100%;
   height: 100%;
   background: #06214d;
-  position: relative;
   padding: 10px;
 }
+.content-body {
+  height: 100%;
+  position: relative;
+}
 .search-list {
   display: flex;
   justify-content: space-between;
@@ -482,13 +487,13 @@ export default {
   max-height: 100%;
 }
 >>> .common-table .ivu-table th {
-  height: 53px;
+  height: 54px;
  }
  >>> .common-table .ivu-table td {
-  height: 53px;
+  height: 55px;
  }
   >>> .common-table .ivu-spin-fix {
-   top: 53px;
+   top: 54px;
  }
   >>> .app-table .ivu-spin-fix {
    height: calc(100vh - 355px);

+ 15 - 7
src/views/homecomponents/SystemSettings/UserManagement.vue

@@ -22,7 +22,7 @@
           </i-col>
           <i-col span="20" style="height:100%">
             <div class="right-main">
-              <user-management-index ref="user" :stationData="stationData" :currentOrgId="currentOrgId"></user-management-index>
+              <user-management-index ref="user" :userStationData="userStationData" :currentOrgId="currentOrgId"></user-management-index>
             </div>
           </i-col>
         </Row>
@@ -43,6 +43,7 @@ export default {
       currentStaData: [], // 当前搜索框搜索的站台数组对象,传给子组件,用来判断单选站台名当前选中状态
       showTree: true,// 是否显示树形组件
 		  stationData: [],
+      userStationData: [],
       currentOrgId: '',
     };
   },
@@ -55,6 +56,8 @@ export default {
       this.$get('metroapi/org/sysOrgTree').then(res => {
 				if (res.httpCode == 1) {
           this.stationData = res.data
+          this.userStationData = JSON.parse(JSON.stringify(res.data))
+          this.userStationData = this.getModalTree(this.userStationData) //新增和编辑组织结构数据disabled应始终为false,不能变化
           if (this.$route.params.orgId) {
             let pageJumpOrgId = this.$route.params.orgId
             this.stationData = this.getJumpTree(this.stationData,pageJumpOrgId) //从组织机构跳转过来携带参数orgId
@@ -64,11 +67,18 @@ export default {
 				}
 		  })
     },
-    getJumpTree (arr,pageJumpOrgId) {
+    getModalTree (arr) {
      return arr.map((v,index) => {
         v.value = v.nodeId
         v.label = v.title
-        v.children = v.children ? v.children : []
+        v.disabled = false
+        v.children = v.children ? v.children : [] 
+        if (v.children) v.children = this.getModalTree(v.children);
+        return v;
+      });
+    },
+    getJumpTree (arr,pageJumpOrgId) {
+     return arr.map((v,index) => {
         v.expand = false
         v.selected = false
         if (index==0) {
@@ -86,9 +96,7 @@ export default {
     },
     getTree(arr,textState) {
       return arr.map((v,index) => {
-        v.value = v.nodeId
-        v.label = v.title
-        v.children = v.children ? v.children : []
+        v.disabled = false
         v.expand = false
         v.selected = false
         if (index==0) {
@@ -186,7 +194,7 @@ export default {
     treeChange(val,arr,level,currentNodeId) {
       this.currentStation = val
       this.currentOrgId = currentNodeId
-      this.$refs.user.getTableData('',currentNodeId)
+      this.$refs.user.getTableData('',currentNodeId) 
 		},
   }
 };

+ 48 - 28
src/views/homecomponents/SystemSettings/UserManagementIndex.vue

@@ -80,14 +80,15 @@
       class-name="common-modal">
       <Form class="common-form common-form-modal" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="120">
 				<FormItem label="用户号:" prop="userName">
-          <Input v-model.trim="formOption.userName" placeholder="请输入用户号" /> 
+          <Input v-model.trim="formOption.userName" placeholder="请输入用户号" maxlength="30" show-word-limit/> 
           <div class="common-form-item-text">可使用工号、学号等唯一不重复身份识别号</div> 
 				</FormItem>
         <FormItem label="用户名:" prop="realName">
           <Input v-model.trim="formOption.realName" maxlength="10" show-word-limit /> 
 				</FormItem>
 				<FormItem label="组织机构:" prop="orgIdArr">
-          <Cascader :data="stationData[0].children" :render-format="format" :clearable="false" change-on-select v-model="formOption.orgIdArr" placeholder="选择组织机构" class="common-cascader" v-if="stationData && stationData.length>0"></Cascader>
+          <Cascader :data="userStationData[0].children" :render-format="format" :clearable="false" change-on-select v-model="formOption.orgIdArr" placeholder="选择组织机构" class="common-cascader" v-if="userStationData && userStationData.length>0" ref="cascader"></Cascader>
+          <!-- <Cascader :data="stationOrgData" :render-format="format" :clearable="false" change-on-select v-model="formOption.orgIdArr" placeholder="选择组织机构" class="common-cascader" v-if="userStationData && userStationData.length>0" ref="cascader"></Cascader> -->
         </FormItem>
         <FormItem label="角色名称:" prop="roleId">
            <Select v-model="formOption.roleId" placeholder="角色名称">
@@ -120,7 +121,8 @@
       reset-drag-position
       :mask-closable="false"
       class-name="common-modal">
-      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon"></Icon>
+      <i :class="'iconfont '+ activeClass" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle!='确认删除'"></i>
+      <Icon type="ios-information-circle" :style="{ color: activeColor}" class="modal-icon" v-show="commonTitle=='确认删除'"></Icon>
       <span class="modal-text">{{modalTitle}}</span>
       <div slot="footer">
           <Button @click="commonCancel">取消</Button>
@@ -137,7 +139,7 @@
       footer-hide
       :mask-closable="false"
       class-name="common-modal">
-      <!-- <Form class="common-form common-form-modal" :model="detailData" :label-width="120">
+      <Form class="common-form common-form-modal" :model="detailData" :label-width="120">
 				<FormItem label="用户号:"> 
           <div class="common-form-detail-text">{{detailData.userName}}</div> 
 				</FormItem>
@@ -165,7 +167,7 @@
         <FormItem label="最后登录时间:">
           <div class="common-form-detail-text">{{detailData.lastLoginTime}}</div> 
         </FormItem>
-			</Form> -->
+			</Form>
     </Modal>
   </div>
 </template>
@@ -174,7 +176,7 @@ const defaultFrom = {userName: '',realName: '',orgId: '',orgIdArr: [],roleId: ''
 export default {
   name: "UserManagementIndex",
   props: {
-    stationData: {
+    userStationData: {
       type: Array,
       default: () => {
         return [];
@@ -246,7 +248,9 @@ export default {
           {
             title: '用户号',
             key: 'userName',
-            align: 'center'
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
           },
           {
             title: '用户名',
@@ -289,19 +293,19 @@ export default {
                   nativeOn:{
                       "mousedown":(event)=>{ // 监听组件原生事件mousedown,此事件在click之前触发
                         this.rowObj =  params.row
-                        // if (params.row.isEnable == 1) {
-                        //   this.commonTitle = '确认关闭'
-                        //   this.activeColor = '#E92E2E'
-                        //   this.activeClass = 'icon-guanbi'
-                        //   this.modalTitle = '关闭后,用户无法登录。关闭不影响用户已经产生的操作记录。'
-                        //   this.modalStatus = true         
-                        // } else {
-                        //   this.commonTitle = '确认启用'
-                        //   this.activeColor = '#57C44F'
-                        //   this.activeClass = 'icon-qiyong'
-                        //   this.modalTitle = '启用后,用户即可正常登录使用。'
-                        //   this.modalStatus = true
-                        // }
+                        if (params.row.isEnable == 1) {
+                          this.commonTitle = '确认关闭'
+                          this.activeColor = '#E92E2E'
+                          this.activeClass = 'icon-guanbi'
+                          this.modalTitle = '关闭后,用户无法登录。关闭不影响用户已经产生的操作记录。'
+                          this.modalStatus = true         
+                        } else {
+                          this.commonTitle = '确认启用'
+                          this.activeColor = '#57C44F'
+                          this.activeClass = 'icon-qiyong'
+                          this.modalTitle = '启用后,用户即可正常登录使用。'
+                          this.modalStatus = true
+                        }
                       },
                     }
                 }),
@@ -343,7 +347,7 @@ export default {
         }],
         roleId: [{
           required: true,
-          type: 'number',
+          type: 'number', 
           message: '请选择角色名称',
           trigger: 'change'
         }], 
@@ -363,8 +367,8 @@ export default {
     currentOrgId: {
      handler(newValue, oldValue) {
       this.curOrgId = newValue
-    }
-   },
+     },
+   }
   },
   mounted() {
     this.getType()
@@ -424,7 +428,8 @@ export default {
       if (typeof(orgId) == 'number' && orgId>0) {
        this.tableParams.orgId = orgId
       } else {
-        if (!orgId) {
+        // this.tableParams.orgId = ''
+        if (orgId === 0) {
           this.tableParams.orgId = ''
         } else {
           this.tableParams.orgId = this.curOrgId
@@ -499,9 +504,25 @@ export default {
     editClick (row) {
       this.rowObj = row
       this.formOption = JSON.parse(JSON.stringify(row));
-      this.formOption.orgIdArr = [row.orgId]
+      this.formOption.orgIdArr = this.treeFindPath(this.userStationData[0].children, node => node.value === row.orgId)
       this.title = '编辑用户'
-      this.showModal = true
+      this.$nextTick(()=> {
+        this.showModal = true
+      })
+    },
+    // 根据子节点id递归获取所有父类的id
+		treeFindPath (tree, func, path = []) {
+      if (!tree) return []
+      for (const data of tree) {
+        path.push(data.value)
+        if (func(data)) return path
+        if (data.children) {
+          const findChildren = this.treeFindPath(data.children, func, path)
+          if (findChildren.length) return findChildren
+        }
+        path.pop()
+      }
+      return []
     },
     delClick (row) {
       this.rowObj = row
@@ -588,7 +609,6 @@ export default {
         let params = {
           userId: this.rowObj.userId
         }
-        console.log(typeof(this.rowObj.userId))
         this.resetPwdData(params)
       }
     },
@@ -625,7 +645,7 @@ export default {
     },
     // 重置密码
     resetPwdData (params) {
-      this.$put('metroapi/user/intial',params).then(res=>{
+      this.$post('metroapi/user/intial',params).then(res=>{
         if (res.httpCode == 1 ){
           this.modalStatus = false
           this.$Message.info(res.msg)

+ 1 - 1
vue.config.js

@@ -7,7 +7,7 @@ module.exports = {
       open: false,//配置自动启动浏览器 
       proxy: { // 设置代理
       '/metroapi': {
-        target: 'http://192.168.20.188:8088',// http://192.168.20.58:8086 http://192.168.20.188:8088
+        target: 'http://192.168.20.58:8088',// http://192.168.20.58:8086 http://192.168.20.188:8088
         changeOrigin: true, //允许跨域
         pathRewrite: {
             '^/metroapi': ''