diff --git a/backend/dvadmin/system/views/dept.py b/backend/dvadmin/system/views/dept.py index 050d478..63d83a3 100644 --- a/backend/dvadmin/system/views/dept.py +++ b/backend/dvadmin/system/views/dept.py @@ -6,6 +6,7 @@ @Created on: 2021/6/3 003 0:30 @Remark: 角色管理 """ +from rest_framework import serializers from dvadmin.system.models import Dept from dvadmin.utils.json_response import SuccessResponse @@ -17,7 +18,7 @@ class DeptSerializer(CustomModelSerializer): """ 部门-序列化器 """ - + parent_name = serializers.CharField(read_only=True,source='parent.name') class Meta: model = Dept fields = "__all__" @@ -55,11 +56,11 @@ class DeptViewSet(CustomModelViewSet): update_serializer_class = DeptCreateUpdateSerializer # extra_filter_backends = [] - def list(self, request, *args, **kwargs): - queryset = self.filter_queryset(self.get_queryset()) - page = self.paginate_queryset(queryset) - if page is not None: - serializer = self.get_serializer(page, many=True, request=request) - return self.get_paginated_response(serializer.data) - serializer = self.get_serializer(queryset, many=True, request=request) - return SuccessResponse(data=serializer.data, msg="获取成功") + # def list(self, request, *args, **kwargs): + # queryset = self.filter_queryset(self.get_queryset()) + # page = self.paginate_queryset(queryset) + # if page is not None: + # serializer = self.get_serializer(page, many=True, request=request) + # return self.get_paginated_response(serializer.data) + # serializer = self.get_serializer(queryset, many=True, request=request) + # return SuccessResponse(data=serializer.data, msg="获取成功") diff --git a/web/src/install.js b/web/src/install.js index 47642e3..b3e7c80 100644 --- a/web/src/install.js +++ b/web/src/install.js @@ -254,7 +254,7 @@ Vue.prototype.commonEndColumns = function (param = {}) { search: { disabled: true }, - type: 'cascader', + type: 'table-selector', dict: { cache: true, url: '/api/system/dept/?limit=999&status=1', @@ -262,9 +262,14 @@ Vue.prototype.commonEndColumns = function (param = {}) { value: 'id', // 数据字典中value字段的属性名 label: 'name', // 数据字典中label字段的属性名 children: 'children', // 数据字典中children字段的属性名 - getData: (url, dict) => { // 配置此参数会覆盖全局的getRemoteDictFunc - return request({ url: url }).then(ret => { - return [{ id: null, name: '根节点', children: XEUtils.toArrayTree(ret.data.data, { parentKey: 'parent', strict: true }) }] + getData: (url, dict, { + _, + component + }) => { + return request({ + url: url, + }).then(ret => { + return ret.data.data }) } }, @@ -273,13 +278,27 @@ Vue.prototype.commonEndColumns = function (param = {}) { component: { props: { elProps: { - clearable: true, - showAllLevels: false, // 仅显示最后一级 - props: { - checkStrictly: true, // 可以不需要选到最后一级 - emitPath: false, - clearable: true - } + treeConfig: { + transform: true, + rowField: 'id', + parentField: 'parent', + expandAll: true + }, + columns: [ + { + field: 'name', + title: '部门名称', + treeNode: true + }, + { + field: 'status', + title: '状态' + }, + { + field: 'parent_name', + title: '父级部门' + } + ] } } }, @@ -289,21 +308,6 @@ Vue.prototype.commonEndColumns = function (param = {}) { ) } } - }, - component: { - dict: { - cache: true, - url: deptPrefix + '?limit=999&status=1', - isTree: true, - value: 'id', // 数据字典中value字段的属性名 - label: 'name', // 数据字典中label字段的属性名 - children: 'children', // 数据字典中children字段的属性名 - getData: (url, dict) => { // 配置此参数会覆盖全局的getRemoteDictFunc - return request({ url: url }).then(ret => { - return [{ id: null, name: '根节点', children: XEUtils.toArrayTree(ret.data.data, { parentKey: 'parent', strict: true }) }] - }) - } - } } }, { diff --git a/web/src/views/system/user/crud.js b/web/src/views/system/user/crud.js index 84a9a16..f28d3ed 100644 --- a/web/src/views/system/user/crud.js +++ b/web/src/views/system/user/crud.js @@ -2,6 +2,8 @@ import { request } from '@/api/service' import { BUTTON_STATUS_BOOL } from '@/config/button' import { urlPrefix as deptPrefix } from '../dept/api' import util from '@/libs/util' +import XEUtils from 'xe-utils' + const uploadUrl = util.baseURL() + 'api/system/img/' export const crudOptions = (vm) => { return { @@ -85,7 +87,10 @@ export const crudOptions = (vm) => { type: 'input', form: { rules: [ // 表单校验规则 - { required: true, message: '账号必填项' } + { + required: true, + message: '账号必填项' + } ], component: { placeholder: '请输入账号' @@ -95,7 +100,7 @@ export const crudOptions = (vm) => { }, helper: { render (h) { - return (< el-alert title="密码默认为:admin123456" type="warning" /> + return (< el-alert title="密码默认为:admin123456" type="warning"/> ) } } @@ -111,7 +116,10 @@ export const crudOptions = (vm) => { type: 'input', form: { rules: [ // 表单校验规则 - { required: true, message: '姓名必填项' } + { + required: true, + message: '姓名必填项' + } ], component: { span: 12, @@ -135,18 +143,29 @@ export const crudOptions = (vm) => { url: deptPrefix, value: 'id', // 数据字典中value字段的属性名 label: 'name', // 数据字典中label字段的属性名 - getData: (url, dict, { _, component }) => { - return request({ url: url, params: { page: 1, limit: 10, status: 1 } }).then(ret => { - component._elProps.page = ret.data.page - component._elProps.limit = ret.data.limit - component._elProps.total = ret.data.total + isTree: true, + getData: (url, dict, { + _, + component + }) => { + return request({ + url: url, + params: { + page: 1, + limit: 999, + status: 1 + } + }).then(ret => { return ret.data.data }) } }, form: { rules: [ // 表单校验规则 - { required: true, message: '必填项' } + { + required: true, + message: '必填项' + } ], itemProps: { class: { yxtInput: true } @@ -155,14 +174,20 @@ export const crudOptions = (vm) => { span: 12, props: { multiple: false }, elProps: { - pagination: true, + treeConfig: { + transform: true, + rowField: 'id', + parentField: 'parent', + expandAll: true + }, columns: [ { field: 'name', - title: '部门名称' + title: '部门名称', + treeNode: true }, { - field: 'status_label', + field: 'status', title: '状态' }, { @@ -173,7 +198,72 @@ export const crudOptions = (vm) => { } } } - }, { + }, + { + title: '角色', + key: 'role', + width: 160, + search: { + disabled: true + }, + type: 'table-selector', + dict: { + cache: false, + url: '/api/system/role/', + value: 'id', // 数据字典中value字段的属性名 + label: 'name', // 数据字典中label字段的属性名 + getData: (url, dict, { + form, + component + }) => { + return request({ + url: url, + params: { + page: 1, + limit: 10 + } + }).then(ret => { + component._elProps.page = ret.data.page + component._elProps.limit = ret.data.limit + component._elProps.total = ret.data.total + return ret.data.data + }) + } + }, + form: { + rules: [ // 表单校验规则 + { + required: true, + message: '必填项' + } + ], + itemProps: { + class: { yxtInput: true } + }, + component: { + span: 12, + props: { multiple: true }, + elProps: { + pagination: true, + columns: [ + { + field: 'name', + title: '角色名称' + }, + { + field: 'key', + title: '权限标识' + }, + { + field: 'status', + title: '状态' + } + ] + } + } + } + }, + { title: '手机号码', key: 'mobile', width: 120, @@ -183,12 +273,16 @@ export const crudOptions = (vm) => { type: 'input', form: { rules: [ - { max: 20, message: '请输入正确的手机号码', trigger: 'blur' }, - { pattern: /^1[3|4|5|7|8]\d{9}$/, message: '请输入正确的手机号码' } + { + max: 20, + message: '请输入正确的手机号码', + trigger: 'blur' + }, + { + pattern: /^1[3|4|5|7|8]\d{9}$/, + message: '请输入正确的手机号码' + } ], - itemProps: { - class: { yxtInput: true } - }, component: { placeholder: '请输入手机号码' } @@ -199,7 +293,11 @@ export const crudOptions = (vm) => { width: 120, form: { rules: [ - { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] } + { + type: 'email', + message: '请输入正确的邮箱地址', + trigger: ['blur', 'change'] + } ], component: { placeholder: '请输入邮箱' @@ -211,12 +309,21 @@ export const crudOptions = (vm) => { key: 'gender', type: 'select', dict: { - data: [{ label: '男', value: 1 }, { label: '女', value: 0 }] + data: [{ + label: '男', + value: 1 + }, { + label: '女', + value: 0 + }] }, form: { value: 1, rules: [ - { required: true, message: '性别必填项' } + { + required: true, + message: '性别必填项' + } ], component: { span: 12 @@ -238,7 +345,13 @@ export const crudOptions = (vm) => { disabled: false }, dict: { - data: [{ label: '前台用户', value: 1 }, { label: '后台用户', value: 0 }] + data: [{ + label: '前台用户', + value: 1 + }, { + label: '后台用户', + value: 0 + }] }, form: { disabled: true @@ -283,7 +396,10 @@ export const crudOptions = (vm) => { if (ret.data == null || ret.data === '') { throw new Error('上传失败') } - return { url: ret.data.data.url, key: option.data.key } + return { + url: ret.data.data.url, + key: option.data.key + } } }, elProps: { // 与el-uploader 配置一致 @@ -309,7 +425,6 @@ export const crudOptions = (vm) => { component: { props: { buildUrl (value, item) { - console.log(11, value) if (value && value.indexOf('http') !== 0) { return '/api/upload/form/download?key=' + value } @@ -317,58 +432,6 @@ export const crudOptions = (vm) => { } } } - }, - { - title: '角色', - key: 'role', - width: 160, - search: { - disabled: true - }, - type: 'table-selector', - dict: { - cache: false, - url: '/api/system/role/', - value: 'id', // 数据字典中value字段的属性名 - label: 'name', // 数据字典中label字段的属性名 - getData: (url, dict, { form, component }) => { - return request({ url: url, params: { page: 1, limit: 10 } }).then(ret => { - component._elProps.page = ret.data.page - component._elProps.limit = ret.data.limit - component._elProps.total = ret.data.total - return ret.data.data - }) - } - }, - form: { - rules: [ // 表单校验规则 - { required: true, message: '必填项' } - ], - itemProps: { - class: { yxtInput: true } - }, - component: { - span: 12, - props: { multiple: true }, - elProps: { - pagination: true, - columns: [ - { - field: 'name', - title: '角色名称' - }, - { - field: 'key', - title: '权限标识' - }, - { - field: 'status_label', - title: '状态' - } - ] - } - } - } } ].concat(vm.commonEndColumns({ update_datetime: { showTable: false } })) }