Merge remote-tracking branch 'origin/master'

chuanyi-admin/package.json

@@ -18,6 +18,7 @@
   },
   "main": "background.js",
   "dependencies": {
+    "@riophae/vue-treeselect": "^0.4.0",
     "axios": "0.18.1",
     "clipboard": "2.0.4",
     "codemirror": "5.45.0",

chuanyi-admin/src/api/system/auth.js

@@ -37,10 +37,10 @@ export function emitAuthList(data) {
 }
 
 // 删除权限
-export function deleteAuthList(data) {
+export function deleteAuthList(query) {
   return request({
     url: '/permission/deletePermissionById',
-    method: 'post',
-    data
+    method: 'get',
+    params: query
   })
 }

chuanyi-admin/src/api/system/dept.js

@@ -45,12 +45,24 @@ export function delDept(data) {
   })
 }
 
-export function getSonMenuList() {
+// 根据父级id查所有子菜单
+export function getAllSonMenuList() {
   return request({
     url: '/department/queryAllChildren',
     method: 'get',
     params: {
-      parenId: 1
+      parenId: 0
+    }
+  })
+}
+
+// 根据父级id查子节点（一级查询）
+export function getSonMenuList() {
+  return request({
+    url: '/department/queryChildren',
+    method: 'get',
+    params: {
+      parenId: 0
     }
   })
 }

chuanyi-admin/src/components/SelectTree/index.vue

@@ -0,0 +1,38 @@
+<template>
+  <div id="app">
+    <treeselect :options="options" :normalizer="normalizer" :placeholder="placeholder" @input="handelInput" />
+  </div>
+</template>
+
+<script>
+import Treeselect from '@riophae/vue-treeselect'
+import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+
+export default {
+  components: { Treeselect },
+  props: {
+    // 树状数据
+    options: {
+      type: Array
+    },
+    // 自定义键名
+    normalizer: {
+      type: Function
+    },
+    // 占位符
+    placeholder: {
+      type: String
+    }
+  },
+  data() {
+    return {
+
+    }
+  },
+  methods: {
+    handelInput(val) {
+      this.$emit('handelGetValue', val)
+    }
+  }
+}
+</script>

chuanyi-admin/src/views/system/dept/index.vue

@@ -4,8 +4,8 @@
       <el-col :span="24">
         <!-- 表单查询 -->
         <el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
-          <el-form-item label="部门名称" prop="menuName">
-            <el-input v-model="queryParams.menuName" placeholder="请输入部门名称" clear />
+          <el-form-item label="部门名称" prop="departmentName">
+            <el-input v-model="queryParams.departmentName" placeholder="请输入部门名称" clear />
           </el-form-item>
           <el-form-item>
             <el-button type="primary" icon="el-icon-search" size="mini" @click="handelSearch">搜索</el-button>
@@ -14,13 +14,23 @@
         </el-form>
 
         <el-button size="mini" icon="el-icon-plus" type="primary" plain @click="handelAdd">新增</el-button>
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-circle-close"
+          size="mini"
+          :disabled="multiple"
+          @click="handelDelAll"
+        >批量删除</el-button>
 
         <!-- 表格数据信息 -->
-        <el-table v-loading="loading" :data="deptList">
-          <el-table-column type="index" width="50" align="center" />
-          <el-table-column key="menuName" label="部门名称" align="center" prop="menuName" />
-          <el-table-column key="menuIcon" label="部门描述" align="center" prop="menuIcon" />
-          <el-table-column key="sortNum" label="排序号" align="center" prop="sortNum" />
+        <el-table v-loading="loading" :data="deptList" row-key="id" @selection-change="handleSelectionChange">
+          <el-table-column type="selection" width="50" align="center" />
+          <el-table-column key="departmentName" label="部门名称" align="center" prop="departmentName" />
+          <el-table-column key="departmentDescribe" label="部门描述" align="center" prop="departmentDescribe" />
+          <el-table-column key="departmentNum" label="排序号" align="center" prop="departmentNum" />
+          <el-table-column key="updateTime" label="更新时间" align="center" prop="updateTime" />
+          <el-table-column key="createTime" label="创建时间" align="center" prop="createTime" />
           <el-table-column label="操作" align="center" width="250" class-name="small-padding fixed-width">
             <template slot-scope="scope">
               <el-button size="mini" type="text" icon="el-icon-edit" @click="handelEdit(scope.row.id)">修改
@@ -44,28 +54,31 @@
     </el-row>
 
     <!-- 弹出框 -->
-    <el-dialog :title="title" :visible.sync="dialogVisible" width="35%">
+    <el-dialog :title="title" :visible.sync="dialogVisible" width="35%" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-row>
           <el-col :span="24">
             <el-form-item label="上级部门" prop="parentId">
-              <el-select v-model="form.parentId" clearable placeholder="请选择" style="width:100%">
-                <el-option v-for="item in options" :key="item.id" :label="item.departmentName" :value="item.id" />
-              </el-select>
+              <selectTree
+                :options="options"
+                :normalizer="normalizer"
+                placeholder="请选择上级部门"
+                @handelGetValue="handelGetValue"
+              />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="24">
             <el-form-item label="部门名称" prop="departmentName">
-              <el-input v-model="form.departmentName" placeholder="请输入部门名称" />
+              <el-input v-model="form.departmentName" clearable placeholder="请输入部门名称" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="12">
             <el-form-item label="部门描述" prop="departmentDescribe">
-              <el-input v-model="form.departmentDescribe" placeholder="请输入部门描述" />
+              <el-input v-model="form.departmentDescribe" clearable placeholder="请输入部门描述" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -90,8 +103,11 @@
 </template>
 
 <script>
-import { getDeptList, addDept, getDeptById, editDept, delDept } from '@/api/system/dept.js'
+import { getDeptList, addDept, getDeptById, editDept, delDept, getAllSonMenuList } from '@/api/system/dept.js'
+import selectTree from '@/components/SelectTree'
+import XEUtils from 'xe-utils'
 export default {
+  components: { selectTree },
   data() {
     return {
       // 遮罩层
@@ -126,17 +142,39 @@ export default {
         ]
       },
       // 修改菜单id
-      id: null
+      id: null,
+      // 控制批量删除按钮
+      multiple: true,
+      // 删除部门id集合
+      ids: [],
+      // 自定义树状键名
+      normalizer: null
     }
   },
   created() {
-    this.getDeptList()
+    this.handelSearch()
   },
   methods: {
     /** 获取表格数据 */
     getDeptList() {
       getDeptList(this.queryParams).then(res => {
-        console.log(res)
+        if (res.code === 200) {
+          const data = res.data
+          this.deptList = XEUtils.toArrayTree(data.departmentList)
+          this.total = data.count
+        }
+      })
+    },
+    /** 获取上级部门 */
+    getOptionsList() {
+      getAllSonMenuList().then(res => {
+        this.options = res.data
+        /** 自定义上级部门键名 */
+        this.normalizer = function(node) {
+          return {
+            label: node.departmentName
+          }
+        }
       })
     },
     /** 搜索 */
@@ -151,9 +189,10 @@ export default {
     },
     /** 新增按钮 */
     handelAdd() {
-      this.reset()
+      this.getOptionsList()
       this.dialogVisible = true
       this.title = '添加部门'
+      this.reset()
     },
     /** 修改按钮 */
     handelEdit(id) {
@@ -164,18 +203,23 @@ export default {
       this.dialogVisible = true
       this.title = '修改部门'
     },
+    /** 表格多选 */
+    handleSelectionChange(val) {
+      this.ids = val.map(item => item.id)
+      this.multiple = !val.length
+    },
     /** 删除按钮 */
     handelDel(id) {
-      this.$confirm('是否删除该菜单?', '提示', {
+      this.$confirm('是否删除该部门?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        delDept({ id }).then(res => {
+        delDept([id]).then(res => {
           if (res.code === 200) {
             this.$message({
               type: 'success',
-              message: res.data
+              message: '删除成功'
             })
             this.getDeptList()
           }
@@ -187,20 +231,45 @@ export default {
         })
       })
     },
+    /** 批量删除 */
+    handelDelAll() {
+      this.$confirm('是否批量删除部门?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        delDept(this.ids).then(res => {
+          if (res.code === 200) {
+            this.$message({
+              type: 'success',
+              message: '删除成功'
+            })
+            this.getDeptList()
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        })
+      })
+    },
+    /** 选择上级部门给表单赋值 */
+    handelGetValue(val) {
+      this.form.parentId = val || 0
+    },
     /** 表单提交 */
     handelSubmit(formName) {
       this.$refs[formName].validate((valid) => {
         if (valid) {
           if (this.title === '添加部门') {
-            this.form.parentId = this.form.parentId || 0
-            console.log(this.form)
             addDept(this.form).then(res => {
-              console.log(res)
               if (res.code === 200) {
                 this.$message({
                   message: res.data,
                   type: 'success'
                 })
+                this.getDeptList()
                 this.dialogVisible = false
               }
             })

chuanyi-admin/src/views/system/menu/index.vue

@@ -57,12 +57,7 @@
           <el-col :span="24">
             <el-form-item label="上级菜单" prop="parentId">
               <el-select v-model="form.parentId" clearable placeholder="请选择" style="width:100%">
-                <el-option
-                  v-for="item in options"
-                  :key="item.id"
-                  :label="item.menuName"
-                  :value="item.id"
-                />
+                <el-option v-for="item in options" :key="item.id" :label="item.menuName" :value="item.id" />
               </el-select>
             </el-form-item>
           </el-col>
@@ -82,13 +77,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="显示排序" prop="sortNum">
-              <el-input-number
-                v-model="form.sortNum"
-                placeholder="0"
-                controls-position="right"
-                :min="1"
-                :max="10"
-              />
+              <el-input-number v-model="form.sortNum" placeholder="0" controls-position="right" :min="1" :max="10" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -158,16 +147,27 @@ export default {
       getMenuList(this.queryParams).then(response => {
         const data = response.data
         this.menuList = XEUtils.toArrayTree(data.menuList)
-        this.options = data.menuList.map(item => {
-          return {
-            menuName: item.menuName,
-            id: item.id
-          }
-        })
         this.total = data.count
         this.loading = false
       })
     },
+    /** 获取上级菜单 */
+    getOptionsList() {
+      getMenuList({
+        page: 1,
+        limit: 999
+      }).then(res => {
+        if (res.code === 200) {
+          const data = res.data
+          this.options = data.menuList.map(item => {
+            return {
+              menuName: item.menuName,
+              id: item.id
+            }
+          })
+        }
+      })
+    },
     /** 搜索 */
     handelSearch() {
       this.queryParams.page = 1
@@ -180,6 +180,7 @@ export default {
     },
     /** 新增按钮 */
     handelAdd() {
+      this.getOptionsList()
       this.reset()
       this.dialogVisible = true
       this.title = '添加菜单'