feat(web): 完成用户管理模块
This commit is contained in:
@@ -47,3 +47,120 @@ function paginationTemplate(perPage = 20, maxButtons = 5) {
|
||||
],
|
||||
}
|
||||
}
|
||||
|
||||
function mappingField(field, mapping) {
|
||||
let mapData = {
|
||||
'*': `<span class='label bg-gray-300'>\${${field}}</span>`,
|
||||
}
|
||||
mapping.forEach(item => {
|
||||
mapData[item['value']] = `<span class='label ${item['color']}'>${item['label']}</span>`
|
||||
})
|
||||
return {
|
||||
type: 'mapping',
|
||||
value: `\${${field}}`,
|
||||
map: mapData,
|
||||
}
|
||||
}
|
||||
|
||||
function mappingItem(label, value, color = 'bg-info') {
|
||||
return {
|
||||
label: label,
|
||||
value: value,
|
||||
color: color,
|
||||
}
|
||||
}
|
||||
|
||||
const userRoleMapping = [
|
||||
mappingItem('数据提供方', 'PROVIDER', 'bg-blue-500'),
|
||||
mappingItem('数据使用方', 'CUSTOMER', 'bg-purple-500'),
|
||||
mappingItem('审核监管方', 'CHECKER', 'bg-cyan-500'),
|
||||
mappingItem('系统管理员', 'ADMINISTRATOR', 'bg-green-500'),
|
||||
]
|
||||
|
||||
const userStateMapping = [
|
||||
mappingItem('审查中', 'CHECKING', 'bg-warning'),
|
||||
mappingItem('正常', 'NORMAL', 'bg-success'),
|
||||
mappingItem('禁用', 'DISABLED', 'bg-danger'),
|
||||
]
|
||||
|
||||
function userAddDialog() {
|
||||
return {
|
||||
actionType: 'dialog',
|
||||
dialog: {
|
||||
title: '新用户注册',
|
||||
actions: [
|
||||
{
|
||||
type: 'reset',
|
||||
label: '清空',
|
||||
},
|
||||
{
|
||||
type: 'submit',
|
||||
label: '注册',
|
||||
level: 'primary',
|
||||
}
|
||||
],
|
||||
body: {
|
||||
type: 'form',
|
||||
api: '${base}/user/register',
|
||||
mode: 'horizontal',
|
||||
canAccessSuperData: false,
|
||||
horizontal: {
|
||||
left: 2,
|
||||
},
|
||||
body: [
|
||||
{
|
||||
type: 'input-email',
|
||||
name: 'username',
|
||||
label: '邮箱',
|
||||
placeholder: '请输入邮箱',
|
||||
required: true,
|
||||
clearable: true,
|
||||
clearValueOnEmpty: true,
|
||||
validateApi: '${base}/user/exists_username/${username}'
|
||||
},
|
||||
{
|
||||
type: 'input-password',
|
||||
name: 'password',
|
||||
label: '密码',
|
||||
placeholder: '请输入密码',
|
||||
required: true,
|
||||
clearable: true,
|
||||
clearValueOnEmpty: true,
|
||||
validations: {
|
||||
matchRegexp: /^(?=.*\d)(?!.*(\d)\1{2})(?!.*(012|123|234|345|456|567|678|789|987|876|765|654|543|432|321|210))(?=.*[a-zA-Z])(?=.*[^\da-zA-Z\s]).{8,16}$/
|
||||
},
|
||||
validationErrors: {
|
||||
matchRegexp: '密码至少包含字母、数字、特殊字符，8-16位，并且不能连续出现3个大小连续或相同的数字',
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'input-password',
|
||||
name: 'confirm-password',
|
||||
label: '确认密码',
|
||||
placeholder: '请再次输入密码',
|
||||
required: true,
|
||||
clearable: true,
|
||||
validations: {
|
||||
equalsField: 'password'
|
||||
},
|
||||
validationErrors: {
|
||||
equalsField: '两次输入密码不一致',
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'radios',
|
||||
name: 'role',
|
||||
label: '角色',
|
||||
required: true,
|
||||
selectFirst: true,
|
||||
options: [
|
||||
{label: '数据提供方', value: 'PROVIDER'},
|
||||
{label: '数据使用方', value: 'CUSTOMER'},
|
||||
{label: '审查监管方', value: 'CHECKER'},
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
function overviewTab() {
|
||||
return {
|
||||
title: '概览',
|
||||
icon: 'fa fa-house',
|
||||
body: [
|
||||
'hello world'
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,92 @@
|
||||
function userTab() {
|
||||
return {
|
||||
title: '用户管理',
|
||||
icon: 'fa fa-user',
|
||||
body: [
|
||||
{
|
||||
type: 'crud',
|
||||
api: {
|
||||
method: 'get',
|
||||
url: '${base}/user_management/list'
|
||||
},
|
||||
...crudCommonOptions(),
|
||||
headerToolbar: [
|
||||
'reload',
|
||||
{
|
||||
type: 'action',
|
||||
icon: 'fa fa-plus',
|
||||
tooltip: '新增账号',
|
||||
...userAddDialog(),
|
||||
}
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
name: 'username',
|
||||
label: '邮箱',
|
||||
},
|
||||
{
|
||||
label: '角色',
|
||||
width: 120,
|
||||
...mappingField('role', userRoleMapping)
|
||||
},
|
||||
{
|
||||
label: '账号状态',
|
||||
width: 80,
|
||||
...mappingField('state', userStateMapping)
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
width: 150,
|
||||
type: 'tpl',
|
||||
tpl: '${DATETOSTR(createTime)}'
|
||||
},
|
||||
{
|
||||
label: '更新时间',
|
||||
width: 150,
|
||||
type: 'tpl',
|
||||
tpl: '${DATETOSTR(updateTime)}'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
width: 100,
|
||||
type: 'operation',
|
||||
fixed: 'right',
|
||||
className: 'nowrap',
|
||||
buttons: [
|
||||
{
|
||||
visibleOn: "${state === 'CHECKING'}",
|
||||
label: '审核',
|
||||
icon: 'fa fa-fingerprint',
|
||||
level: 'primary',
|
||||
size: 'xs',
|
||||
},
|
||||
{
|
||||
visibleOn: "${state === 'NORMAL'}",
|
||||
label: '禁用',
|
||||
icon: 'fa fa-ban',
|
||||
level: 'danger',
|
||||
size: 'xs',
|
||||
confirmText: '确认禁用账号${username}？',
|
||||
confirmTitle: '禁用账号',
|
||||
actionType: 'ajax',
|
||||
api: 'get:${base}/user_management/disable/${username}',
|
||||
},
|
||||
|
||||
{
|
||||
visibleOn: "${state === 'DISABLED'}",
|
||||
label: '启用',
|
||||
icon: 'fa fa-check',
|
||||
level: 'success',
|
||||
size: 'xs',
|
||||
confirmText: '确认启用账号${username}？',
|
||||
confirmTitle: '启用账号',
|
||||
actionType: 'ajax',
|
||||
api: 'get:${base}/user_management/enable/${username}',
|
||||
}
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -25,43 +25,67 @@
|
||||
<script src="assets/sdk/sdk.js"></script>
|
||||
<script src="assets/component/constants.js"></script>
|
||||
<script src="assets/component/common.js"></script>
|
||||
<script src="assets/component/pages/overview-tab.js"></script>
|
||||
<script src="assets/component/pages/user-tab.js"></script>
|
||||
<script>
|
||||
(function () {
|
||||
let amis = amisRequire('amis/embed')
|
||||
let amisJSON = {
|
||||
type: 'page',
|
||||
title: information.title,
|
||||
subTitle: '提供合法合规的数据要素可信供给工具',
|
||||
body: {
|
||||
debug: true,
|
||||
type: 'service',
|
||||
api: {
|
||||
method: 'get',
|
||||
url: '${base}/user/state',
|
||||
headers: {
|
||||
token: '${token}'
|
||||
},
|
||||
className: 'h-full',
|
||||
type: 'service',
|
||||
api: {
|
||||
method: 'get',
|
||||
url: '${base}/user/state',
|
||||
headers: {
|
||||
token: '${token}'
|
||||
},
|
||||
onEvent: {
|
||||
fetchInited: {
|
||||
actions: [
|
||||
{
|
||||
expression: '${!event.data.responseData.token}',
|
||||
actionType: 'url',
|
||||
args: {
|
||||
url: '/login.html',
|
||||
}
|
||||
},
|
||||
onEvent: {
|
||||
fetchInited: {
|
||||
actions: [
|
||||
{
|
||||
expression: '${!event.data.responseData.token}',
|
||||
actionType: 'url',
|
||||
args: {
|
||||
url: '/login.html',
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
body: [
|
||||
{
|
||||
type: 'page',
|
||||
title: information.title,
|
||||
subTitle: '提供合法合规的数据要素可信供给工具',
|
||||
toolbar: [
|
||||
{
|
||||
type: 'dropdown-button',
|
||||
label: '${username}',
|
||||
align: 'right',
|
||||
trigger: 'hover',
|
||||
buttons: [
|
||||
{
|
||||
label: '个人资料',
|
||||
},
|
||||
{
|
||||
label: '退出登陆',
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
bodyClassName: 'p-0',
|
||||
body: {
|
||||
className: 'h-full border-0',
|
||||
type: 'tabs',
|
||||
tabsMode: 'vertical',
|
||||
tabs: [
|
||||
userTab(),
|
||||
overviewTab(),
|
||||
]
|
||||
}
|
||||
},
|
||||
body: [
|
||||
{
|
||||
type: 'tpl',
|
||||
tpl: '${username}'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
}
|
||||
]
|
||||
}
|
||||
let debug = false
|
||||
amis.embed(
|
||||
|
||||
@@ -56,84 +56,8 @@
|
||||
actions: [
|
||||
{
|
||||
type: 'action',
|
||||
actionType: 'dialog',
|
||||
label: '注册',
|
||||
dialog: {
|
||||
title: '新用户注册',
|
||||
actions: [
|
||||
{
|
||||
type: 'reset',
|
||||
label: '清空',
|
||||
},
|
||||
{
|
||||
type: 'submit',
|
||||
label: '注册',
|
||||
level: 'primary',
|
||||
}
|
||||
],
|
||||
body: {
|
||||
type: 'form',
|
||||
api: '${base}/user/register',
|
||||
mode: 'horizontal',
|
||||
canAccessSuperData: false,
|
||||
horizontal: {
|
||||
left: 2,
|
||||
},
|
||||
body: [
|
||||
{
|
||||
type: 'input-email',
|
||||
name: 'username',
|
||||
label: '邮箱',
|
||||
placeholder: '请输入邮箱',
|
||||
required: true,
|
||||
clearable: true,
|
||||
clearValueOnEmpty: true,
|
||||
validateApi: '${base}/user/exists_username/${username}'
|
||||
},
|
||||
{
|
||||
type: 'input-password',
|
||||
name: 'password',
|
||||
label: '密码',
|
||||
placeholder: '请输入密码',
|
||||
required: true,
|
||||
clearable: true,
|
||||
clearValueOnEmpty: true,
|
||||
validations: {
|
||||
matchRegexp: /^(?=.*\d)(?!.*(\d)\1{2})(?!.*(012|123|234|345|456|567|678|789|987|876|765|654|543|432|321|210))(?=.*[a-zA-Z])(?=.*[^\da-zA-Z\s]).{8,16}$/
|
||||
},
|
||||
validationErrors: {
|
||||
matchRegexp: '密码至少包含字母、数字、特殊字符，8-16位，并且不能连续出现3个大小连续或相同的数字',
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'input-password',
|
||||
name: 'confirm-password',
|
||||
label: '确认密码',
|
||||
placeholder: '请再次输入密码',
|
||||
required: true,
|
||||
clearable: true,
|
||||
validations: {
|
||||
equalsField: 'password'
|
||||
},
|
||||
validationErrors: {
|
||||
equalsField: '两次输入密码不一致',
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'radios',
|
||||
name: 'role',
|
||||
label: '角色',
|
||||
required: true,
|
||||
selectFirst: true,
|
||||
options: [
|
||||
{label: '数据提供方', value: 'PROVIDER'},
|
||||
{label: '数据使用方', value: 'CUSTOMER'},
|
||||
{label: '审查监管方', value: 'CHECKER'},
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
...userAddDialog(),
|
||||
},
|
||||
{
|
||||
type: 'action',
|
||||
|
||||
Reference in New Issue
Block a user