From 8cb50b63fa1c4cda7e2ca5c82ba1e2e53c415313 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9C=A8=E5=AD=90=E6=9D=8E=C2=B7De?= <lide1202@hotmail.com>
Date: Sat, 17 Jul 2021 22:47:12 +0800
Subject: [PATCH] add user manage page

---
 report-ui/src/api/accessUser.js               |  59 ++++
 report-ui/src/router/index.js                 |  11 +
 .../accessRole/components/RoleAuthority.vue   |  86 ++++++
 report-ui/src/views/accessUser/index.vue      | 269 ++++++++++++++++++
 4 files changed, 425 insertions(+)
 create mode 100755 report-ui/src/api/accessUser.js
 create mode 100644 report-ui/src/views/accessRole/components/RoleAuthority.vue
 create mode 100755 report-ui/src/views/accessUser/index.vue

diff --git a/report-ui/src/api/accessUser.js b/report-ui/src/api/accessUser.js
new file mode 100755
index 00000000..84a1f11f
--- /dev/null
+++ b/report-ui/src/api/accessUser.js
@@ -0,0 +1,59 @@
+import request from '@/utils/request'
+
+export function accessUserList (params) {
+  return request({
+    url: 'accessUser/pageList',
+    method: 'GET',
+    params,
+  })
+}
+
+export function accessUserAdd (data) {
+  return request({
+    url: 'accessUser',
+    method: 'post',
+    data
+  })
+}
+
+export function accessUserDeleteBatch (data) {
+  return request({
+    url: 'accessUser/delete/batch',
+    method: 'post',
+    data
+  })
+}
+
+export function accessUserUpdate (data) {
+  return request({
+    url: 'accessUser',
+    method: 'put', data,
+  })
+}
+
+export function accessUserDetail (data) {
+  return request({
+    url: 'accessUser/' + data.id,
+    method: 'get',
+    params: { accessKey: data.accessKey }
+  })
+}
+
+
+export function getRoleTree (loginName) {
+  return request({
+    url: 'accessUser/roleTree/' + loginName,
+    method: 'get',
+  })
+}
+
+export function saveRoleTree (data) {
+  return request({
+    url: 'accessUser/saveRoleTree',
+    method: 'post',
+    data
+  })
+}
+
+
+export default { accessUserList, accessUserAdd, accessUserDeleteBatch, accessUserUpdate, accessUserDetail, getRoleTree, saveRoleTree }
diff --git a/report-ui/src/router/index.js b/report-ui/src/router/index.js
index 1e4977fc..7ab53903 100644
--- a/report-ui/src/router/index.js
+++ b/report-ui/src/router/index.js
@@ -45,6 +45,17 @@ export const constantRouterMap = [
       { path: '', name: 'accessUser', component: () => import('@/views/home/index'), meta: { title: '首页', icon: 'iconhome2', keepAlive: true, isBack: true } },
     ]
   },
+  {
+    path: '/access',
+    component: Layout,
+    name: 'access',
+    meta: { title: '用户权限', icon: 'icondfzq-' },
+    children: [
+      { path: 'authority', name: 'authority', component: () => import('@/views/accessAuthority/index'), meta: { title: '权限管理', icon: 'iconquanxian', keepAlive: true, isBack: true } },
+      { path: 'role', name: 'role', component: () => import('@/views/accessRole/index'), meta: { title: '角色管理', icon: 'iconjiaose1', keepAlive: true, isBack: true } },
+      { path: 'user', name: 'user', component: () => import('@/views/accessUser/index'), meta: { title: '用户管理', icon: 'iconyonghu', keepAlive: true, isBack: true } },
+    ]
+  },
   {
     path: '/datasource',
     component: Layout,
diff --git a/report-ui/src/views/accessRole/components/RoleAuthority.vue b/report-ui/src/views/accessRole/components/RoleAuthority.vue
new file mode 100644
index 00000000..e51d0345
--- /dev/null
+++ b/report-ui/src/views/accessRole/components/RoleAuthority.vue
@@ -0,0 +1,86 @@
+<template>
+  <el-dialog class="tree_dialog"
+             title="设置权限项"
+             width="60%"
+             :close-on-click-modal="false"
+             center
+             :visible.sync="visib"
+             :before-close="closeDialog">
+    <el-tree ref="roleTree"
+             :data="treeData"
+             show-checkbox
+             node-key="id"
+             default-expand-all
+             :default-checked-keys="checkedKeys" />
+    <div slot="footer"
+         style="text-align: center">
+      <el-button type="primary"
+                 plain
+                 @click="saveTreeData">保存</el-button>
+      <el-button type="danger"
+                 plain
+                 @click="closeDialog">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { accessRoleAuthorityTree, saveAuthorityTree } from '@/api/accessRole'
+export default {
+  props: {
+    visib: {
+      required: true,
+      type: Boolean,
+      default: false,
+    },
+    roleCode: {
+      required: true,
+      type: String,
+      default: () => {
+        return ''
+      },
+    },
+  },
+  data () {
+    return {
+      checkedKeys: [], // 当前选中的keys
+      treeData: [], // 所有的树结点
+    }
+  },
+  watch: {
+    visib (val) {
+      if (val) {
+        // 弹窗弹出时需要执行的逻辑
+        console.log(1)
+        this.getTreeData()
+      }
+    },
+  },
+  created () { },
+  methods: {
+    // 获取所有的树形结构数据
+    async getTreeData () {
+      const { code, data } = await accessRoleAuthorityTree(this.roleCode)
+      if (code != '200') return
+      this.treeData = data.treeData
+      this.checkedKeys = data.checkedKeys
+    },
+
+    async saveTreeData () {
+      var params = {
+        roleCode: this.roleCode,
+        authorityList: this.$refs.roleTree.getCheckedKeys(true),
+      }
+      const { code } = await saveAuthorityTree(params)
+      if (code != '200') return
+      this.closeDialog()
+    },
+
+    // 弹窗关闭之前需要执行的逻辑
+    closeDialog () {
+      this.treeData = []
+      this.checkedKeys = []
+      this.$emit('handleClose')
+    },
+  },
+}
+</script>
diff --git a/report-ui/src/views/accessUser/index.vue b/report-ui/src/views/accessUser/index.vue
new file mode 100755
index 00000000..d4ca8e99
--- /dev/null
+++ b/report-ui/src/views/accessUser/index.vue
@@ -0,0 +1,269 @@
+<template>
+  <anji-crud ref="listPage"
+             :option="crudOption">
+    <template v-slot:buttonLeftOnTable>
+    </template>
+
+    <template slot="rowButton"
+              slot-scope="props">
+      <el-button type="text"
+                 @click="handleOpenDialogSetRoleForUser(props)">授予角色</el-button>
+    </template>
+    <!--自定义的卡片插槽，将在编辑详情页面，出现在底部新卡片-->
+    <template v-slot:pageSection>
+      <UserRole :login-name="loginName"
+                :visib="dialogVisibleSetRoleForUser"
+                @handleClose="dialogVisibleSetRoleForUser = false" />
+    </template>
+  </anji-crud>
+</template>
+<script>
+import { accessUserList, accessUserAdd, accessUserDeleteBatch, accessUserUpdate, accessUserDetail } from '@/api/accessUser'
+import UserRole from '@/views/accessUser/components/UserRole'
+export default {
+  name: 'AccessUser',
+  components: {
+    UserRole: UserRole,
+  },
+  data () {
+    return {
+      // 选中一个用户时，点授予角色时，弹出对话框
+      dialogVisibleSetRoleForUser: false,
+      loginName: '',
+
+      // 页面渲染使用
+      crudOption: {
+        // 使用菜单做为页面标题
+        title: '用户管理',
+        // 详情页中输入框左边文字宽度
+        labelWidth: '120px',
+        // 查询表单条件
+        queryFormFields: [
+          {
+            inputType: 'anji-select', //form表单类型 input|input-number|anji-select(传递url或者dictCode)|anji-tree(左侧树)|date|datetime|datetimerange
+            anjiSelectOption: {
+              dictCode: 'ENABLE_FLAG',
+            },
+            label: '启用状态',
+            field: 'enableFlag'
+          },
+          {
+            inputType: 'input',
+            label: '登录名',
+            field: 'loginName'
+          },
+          {
+            inputType: 'input',
+            label: '真实姓名',
+            field: 'realName'
+          },
+          {
+            inputType: 'input',
+            label: '手机号',
+            field: 'phone'
+          },
+        ],
+        // 操作按钮
+        buttons: {
+          query: {
+            api: accessUserList,
+            permission: 'AccessUser:PAGE'
+          },
+          queryByPrimarykey: {
+            api: accessUserDetail,
+            permission: 'AccessUser:detail'
+          },
+          add: {
+            api: accessUserAdd,
+            permission: 'AccessUser:insert'
+          },
+          delete: {
+            api: accessUserDeleteBatch,
+            permission: 'AccessUser:delete'
+          },
+          edit: {
+            api: accessUserUpdate,
+            permission: 'AccessUser:update'
+          },
+        },
+        // 表格列
+        columns: [
+          {
+            label: '',
+            field: 'id',
+            primaryKey: true, // 根据主键查询详情或者根据主键删除时, 主键的
+            tableHide: true, // 表格中不显示
+            editHide: true, // 编辑弹框中不显示
+          },
+          {
+            label: '登录名',
+            placeholder: '',
+            field: 'loginName',
+            tableHide: true, // 表格中不显示
+            editField: 'loginName',
+            inputType: 'input',
+            rules: [
+              { required: true, message: '登录名必填', trigger: 'blur' },
+              { min: 1, max: 64, message: '不超过64个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '真实姓名',
+            placeholder: '',
+            field: 'realName',
+            fieldTableRowRenderer: (row) => {
+              return `${row['realName']}[${row['loginName']}]`
+            },
+
+            editField: 'realName',
+            inputType: 'input',
+            rules: [
+              { required: true, message: '真实姓名必填', trigger: 'blur' },
+              { min: 1, max: 64, message: '不超过64个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '密码',
+            placeholder: '',
+            field: 'password',
+            tableHide: true, // 表格中不显示
+            editField: 'password',
+            inputType: 'input',
+            rules: [
+              { required: true, message: '密码必填', trigger: 'blur' },
+              { min: 1, max: 128, message: '不超过128个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '手机号码',
+            placeholder: '',
+            field: 'phone',
+            editField: 'phone',
+            inputType: 'input',
+            rules: [
+              { min: 1, max: 16, message: '不超过16个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '用户邮箱',
+            placeholder: '',
+            field: 'email',
+            editField: 'email',
+            inputType: 'input',
+            rules: [
+              { min: 1, max: 64, message: '不超过64个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '备注',
+            placeholder: '',
+            field: 'remark',
+            editField: 'remark',
+            inputType: 'input',
+            rules: [
+              { min: 1, max: 512, message: '不超过512个字符', trigger: 'blur' }
+            ],
+            disabled: false,
+          },
+          {
+            label: '启用状态',//0--已禁用 1--已启用  DIC_NAME=ENABLE_FLAG
+            placeholder: '',
+            field: 'enableFlag',
+            fieldTableRowRenderer: (row) => {
+              return this.getDictLabelByCode('ENABLE_FLAG', row['enableFlag'])
+            },
+            editField: 'enableFlag',
+            inputType: 'anji-select',
+            anjiSelectOption: {
+              dictCode: 'ENABLE_FLAG', //指定数据字典
+            },
+            colorStyle: {
+              0: 'table-danger', //key为editField渲染的值（字典的提交值）'红色': 'danger','蓝色': 'primary','绿色': 'success','黄色': 'warning','灰色': 'info','白色'：''
+              1: 'table-success'
+            },
+            rules: [
+              { required: true, message: '启用状态必填', trigger: 'blur' },
+            ],
+            disabled: false,
+          },
+          {
+            label: '最后一次登陆时间',
+            placeholder: '',
+            field: 'lastLoginTime',
+            editField: 'lastLoginTime',
+            inputType: 'input',
+            rules: [
+            ],
+            disabled: true,
+          },
+          {
+            label: '最后一次登录IP',
+            placeholder: '',
+            field: 'lastLoginIp',
+            editField: 'lastLoginIp',
+            inputType: 'input',
+            rules: [
+              { min: 1, max: 16, message: '不超过16个字符', trigger: 'blur' }
+            ],
+            disabled: true,
+          },
+          {
+            label: '创建人',
+            placeholder: '',
+            field: 'createBy',
+            columnType: 'expand',
+            editField: 'createBy',
+            inputType: 'input',
+            editHide: 'hideOnAdd', // 编辑弹框中不显示 true/false/'hideOnAdd hideOnView hideOnEdit'
+            disabled: true,
+          },
+          {
+            label: '创建时间',
+            placeholder: '',
+            field: 'createTime',
+            columnType: 'expand',
+            editField: 'createTime',
+            inputType: 'input',
+            editHide: 'hideOnAdd', // 编辑弹框中不显示 true/false/'hideOnAdd hideOnView hideOnEdit'
+            disabled: true,
+          },
+          {
+            label: '修改人',
+            placeholder: '',
+            field: 'updateBy',
+            columnType: 'expand',
+            editField: 'updateBy',
+            inputType: 'input',
+            editHide: 'hideOnAdd', // 编辑弹框中不显示 true/false/'hideOnAdd hideOnView hideOnEdit'
+            disabled: true,
+          },
+          {
+            label: '修改时间',
+            placeholder: '',
+            field: 'updateTime',
+            columnType: 'expand',
+            editField: 'updateTime',
+            inputType: 'input',
+            editHide: 'hideOnAdd', // 编辑弹框中不显示 true/false/'hideOnAdd hideOnView hideOnEdit'
+            disabled: true,
+          },
+        ],
+      },
+    }
+  },
+
+  created () { },
+  methods: {
+    handleOpenDialogSetRoleForUser (props) {
+      this.loginName = props.msg.loginName
+      this.dialogVisibleSetRoleForUser = true
+    },
+  }
+}
+</script>
+