|
@@ -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>
|
|
|
+
|