后台用户

This commit is contained in:
wangyilin 2024-09-05 10:41:57 +08:00
parent dd48806fcd
commit b0fe85e4d8
6 changed files with 260 additions and 263 deletions

View File

@ -5,7 +5,7 @@ VITE_DROP_CONSOLE=false
# axios
VITE_APP_BASE_API=/api
VITE_APP_PROXY_URL=http://172.10.10.151:8765
VITE_APP_PROXY_URL=http://172.10.10.93:8765
# rsa 公钥
VITE_APP_RSA_PUBLIC_KEY=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDJps/EXxxSpEM1Ix4R0NWIOBciHCr7P7coDT8tNKfelgR7txcJOqHCO/MIWe7T04aHQTcpQxqx9hMca7dbqz8TZpz9jvLzE/6ZonVKxHsoFnNlHMp1/CPAJ9f6D9wYicum2KltJkmQ0g//D9W2zPCYoGOmSRFcZx/KEBa4EM53jQIDAQAB

View File

@ -3,7 +3,10 @@ import {SystemMenu} from "@/types/config";
export const ROUTER_WHITE_LIST: string[] = ['/login', '/test','/enterprise'];
export const CLIENT_TYPE:string = "MANAGEMENT_SECURITY";
export const UNIT_TYPE = {
security: 'SECURITY_UNIT',
police: 'POLICE_UNIT'
}
export const SYSTEM_MENUS: SystemMenu[] = [
{
title: '首页',

View File

@ -10,3 +10,4 @@ export interface SystemMenu {
component?: RouteComponent;
children?: SystemMenu[];
}

View File

@ -8,7 +8,7 @@ export interface BgManagementPagerQueryParams extends BaseTableRowRecord{
/** 行政区划编码 **/
administrativeDivisionCodes?: string[];
/** 是否启用 **/
isEnable?: number;
isEnable?: BaseEnum<number>;
/** 审核状态 **/
checkStatus?: number;
/** 账号 **/
@ -18,5 +18,15 @@ export interface BgManagementPagerQueryParams extends BaseTableRowRecord{
createTime?:string,
snowFlakeId?:string,
remark?:string,
isAdmin?:BaseEnum<number | string>
}
export interface FromItem {
snowFlakeId?: string,
name: string,
sex: number,
telephone: string,
isEnable: BaseEnum<number>,
remark?: string,
}

View File

@ -1,261 +1,8 @@
<template>
<div>
<TableProMax
ref="tableRef"
:request-api="reqApi"
:columns="columns"
:searchFormOptions="searchFormOptions"
:scroll="{x}"
>
<template #tableHeader>
<a-space>
<a-button type="primary" @click="addUserManagement">新增用户</a-button>
</a-space>
</template>
</TableProMax>
<a-modal
v-model:open="visible"
:title="title"
@ok="submit"
@cancel="closeModal"
>
<FormProMax ref="formRef" v-model:value="formParams" :form-item-options="formItemOptions"/>
</a-modal>
</div>
<div>test</div>
</template>
<script setup lang="ts">
<script setup lang="tsx">
import TableProMax from "@/components/table/TableProMax.vue";
import {TableProMaxProps} from "@/types/components/table";
import api from "@/axios";
import {ref} from "vue";
import {ComponentExposed} from "vue-component-type-helpers";
import {dictSelectNodes} from "@/config/dict.ts";
import {BgManagementPagerQueryParams} from "@/types/views/bgManagement.ts";
import FormProMax from "@/components/form/FormProMax.vue";
import {FormProMaxItemOptions} from "@/types/components/form";
import {FormExpose} from "ant-design-vue/es/form/Form";
import {message} from "ant-design-vue";
import {} from '@/hooks/useTableProMax.ts'
type TableProps = TableProMaxProps<BgManagementPagerQueryParams>
const tableRef = ref<ComponentExposed<typeof TableProMax>>(null!)
// table
const reqApi: TableProps['requestApi'] = (params) => api.post('/managementSecurityUnitUser/pager', params) //
const columns: TableProps['columns'] = [
{
dataIndex: 'account',
title: '账号',
width: 100,
ellipsis: true
},
{
dataIndex: 'name',
title: '名称',
width: 200,
ellipsis: true
}, {
dataIndex: 'sex',
title: '性别',
customRender: ({text}) => <a-tag>{text?.label}</a-tag>,
width: 150
}, {
dataIndex: 'telephone',
title: '手机号码',
width: 150,
ellipsis: true
},
{
dataIndex: 'createTime',
title: '创建时间',
width: 200,
ellipsis: true,
},
{
dataIndex: 'snowFlakeId',
title: '社区唯一编码',
width: 200,
ellipsis: true
}, {
dataIndex: 'remark',
title: '备注',
width: 200,
ellipsis: true
}, {
dataIndex: 'isEnable',
title: '是否启用',
customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
width: 150
}, {
dataIndex: 'opt',
title: '操作',
fixed: "right",
customRender({record}) {
return <a-space>
<a-button class={record.isEnable.value === 0 ? 'btn-danger' : 'btn-success'} onClick={async () => {
const resp = await api.post('/management/disableOrEnable', {
unitId: record.snowFlakeId,
unitOptType: UNIT_TYPE.security
})
message.success(resp.message)
await tableRef.value?.requestGetTableData()
}}>
{record.isEnable.value === 0 ? '禁用' : '启用'}
</a-button>
<a-button>
删除
</a-button>
<a-button onClick={async () => {
visible.value = true
title.value = "编辑用户"
formParams.value.snowFlakeId = record.snowFlakeId
formParams.value.name = record.name,
formParams.value.sex = record.sex.value,
formParams.value. telephone = record.telephone,
formParams.value.isEnable = record.isEnable?.value,
formParams.value.remark = record.remark
}}>
编辑
</a-button>
</a-space>
}
},
]
const x: number = columns.reduce((a, b) => a + (b.width as number), 0)
const searchFormOptions: TableProps["searchFormOptions"] = {
name: {
type: 'input',
label: '名称'
}, sex: {
type: 'select',
label: '性别',
options: [
{
value: null,
label: '全部'
}, ...dictSelectNodes('Sex')
]
},
telephone: {
type: 'input',
label: '手机号'
},
isEnable: {
type: 'select',
label: '是否启用',
options: [
{
value: null,
label: '全部'
}, ...dictSelectNodes('IsEnable')
]
}
}
const visible = ref(false)
const title = ref('新增用户')
const formRef = ref<FormExpose>(null)
const formParams = ref<{
snowFlakeId?: string,
name: string,
sex: number,
telephone: string,
isEnable: boolean,
remark?: string,
}>({
name: '',
sex: null,
telephone: '',
isEnable: null,
})
interface FromItem {
snowFlakeId?: string,
name: string,
sex: number,
telephone: string,
isEnable: boolean,
remark?: string,
}
const formItemOptions = ref<FormProMaxItemOptions<FromItem>>({
name:{
type:'input',
label:'姓名',
required:true,
},
sex:{
type:'radioGroup',
label:'性别',
options: dictSelectNodes('Sex'),
required:true,
},
telephone:{
type:'input',
label:'手机号',
required:true,
},
isEnable:{
type:'radioGroup',
label:'启用状态',
options: dictSelectNodes('IsEnable'),
required:true,
},
remark:{
type:'inputTextArea',
label:'备注',
}
})
const submit = async () => {
await formRef.value.validate()
const snowFlakeId = ref('')
if(title.value === '新增用户'){
snowFlakeId.value = ''
}else{
snowFlakeId.value = formParams.value.snowFlakeId
}
const managementSecurityUnitUserSaveOrUpdateParams = {
snowFlakeId:snowFlakeId.value,
name:formParams.value.name,
sex:formParams.value.sex,
telephone:formParams.value.telephone,
isEnable:formParams.value.isEnable,
remark:formParams.value.remark
}
const resp = await api.post('/managementSecurityUnitUser/saveOrUpdate',managementSecurityUnitUserSaveOrUpdateParams)
message.success(resp.message)
close()
}
const close = ()=>{
tableRef.value?.requestGetTableData()
visible.value = false
closeModal()
}
const closeModal = () => {
formParams.value = {
name:'',
sex:null,
telephone:'',
isEnable:null,
remark:''
}
visible.value = false
// formRef.value.
console.log('取消')
}
//Form
const addUserManagement = () => {
visible.value = true
title.value = ''
}
</script>

View File

@ -1,12 +1,248 @@
<template>
<div>用户管理</div>
<div>
<TableProMax
ref="tableRef"
:request-api="reqApi"
:columns="columns"
:searchFormOptions="searchFormOptions"
:scroll="{x}"
>
<template #tableHeader>
<a-space>
<a-button type="primary" @click="addUserManagement">新增用户</a-button>
</a-space>
</template>
</TableProMax>
<a-modal
v-model:open="visible"
:title="title"
@ok="submit"
@cancel="closeModal"
>
<FormProMax ref="formRef" v-model:value="formParams" :form-item-options="formItemOptions"/>
</a-modal>
</div>
</template>
<script setup lang="ts">
<script setup lang="tsx">
import TableProMax from "@/components/table/TableProMax.vue";
import {TableProMaxProps} from "@/types/components/table";
import api from "@/axios";
import {ref} from "vue";
import {ComponentExposed} from "vue-component-type-helpers";
import {dictSelectNodes} from "@/config/dict.ts";
import {BgManagementPagerQueryParams, FromItem} from "@/types/views/bgManagement.ts";
import FormProMax from "@/components/form/FormProMax.vue";
import {FormProMaxItemOptions} from "@/types/components/form";
import {FormExpose} from "ant-design-vue/es/form/Form";
import {message} from "ant-design-vue";
type TableProps = TableProMaxProps<BgManagementPagerQueryParams>
const tableRef = ref<ComponentExposed<typeof TableProMax>>(null!)
// table
const reqApi: TableProps['requestApi'] = (params) => api.post('/managementSecurityUnitUser/pager', params) //
const columns: TableProps['columns'] = [
{
dataIndex: 'account',
title: '账号',
width: 100,
ellipsis: true
},
{
dataIndex: 'name',
title: '名称',
width: 200,
ellipsis: true
}, {
dataIndex: 'sex',
title: '性别',
customRender: ({text}) => <a-tag>{text?.label}</a-tag>,
width: 150
}, {
dataIndex: 'telephone',
title: '手机号码',
width: 150,
ellipsis: true
},
{
dataIndex: 'createTime',
title: '创建时间',
width: 200,
ellipsis: true,
},
{
dataIndex: 'remark',
title: '备注',
width: 200,
ellipsis: true
}, {
dataIndex: 'isEnable',
title: '是否启用',
customRender: ({text}) => <a-tag color={text?.extData?.color}>{text?.label}</a-tag>,
width: 150
}, {
dataIndex: 'opt',
title: '操作',
fixed: "right",
customRender({record}) {
return (
record.isAdmin.value === 1?
<a-space>
<a-button type="primary" danger>
<a-popconfirm
title="确认删除账号吗?"
onConfirm={async () => {
const resp = await api.delete('/managementSecurityUnitUser/deleteById', {
managementSecurityUnitUserId: record.snowFlakeId,
})
message.success(resp.message)
await tableRef.value?.requestGetTableData()
}}>
删除
</a-popconfirm>
</a-button>
<a-button type="primary" onClick={async () => {
visible.value = true
title.value = "编辑用户"
formParams.value.snowFlakeId = record.snowFlakeId
formParams.value.name = record.name,
formParams.value.sex = record.sex.value,
formParams.value.telephone = record.telephone,
formParams.value.isEnable = record.isEnable?.value,
formParams.value.remark = record.remark
}}>
编辑
</a-button>
</a-space>
:
<i></i>
)
}
},
]
const x: number = columns.reduce((a, b) => a + (b.width as number), 0)
const searchFormOptions: TableProps["searchFormOptions"] = {
name: {
type: 'input',
label: '名称'
}, sex: {
type: 'select',
label: '性别',
options: [
{
value: null,
label: '全部'
}, ...dictSelectNodes('Sex')
]
},
telephone: {
type: 'input',
label: '手机号'
},
isEnable: {
type: 'select',
label: '是否启用',
options: [
{
value: null,
label: '全部'
}, ...dictSelectNodes('IsEnable')
]
}
}
const visible = ref(false)
const title = ref('新增用户')
const formRef = ref<FormExpose>(null)
const formParams = ref<{
snowFlakeId?: string,
name: string,
sex: number,
telephone: string,
isEnable: any,
remark?: string,
}>({
name: '',
sex: 0,
telephone: '',
isEnable: 0,
})
const formItemOptions = ref<FormProMaxItemOptions<FromItem>>({
name: {
type: 'input',
label: '姓名',
required: true,
},
sex: {
type: 'radioGroup',
label: '性别',
options: dictSelectNodes('Sex'),
required: true,
},
telephone: {
type: 'input',
label: '手机号',
required: true,
},
isEnable: {
type: 'radioGroup',
label: '启用状态',
options: dictSelectNodes('IsEnable'),
required: true,
},
remark: {
type: 'inputTextArea',
label: '备注',
}
})
const submit = async () => {
await formRef.value.validate()
const snowFlakeId = ref('')
if (title.value === '新增用户') {
snowFlakeId.value = ''
} else {
snowFlakeId.value = formParams.value.snowFlakeId
}
const managementSecurityUnitUserSaveOrUpdateParams = {
snowFlakeId: snowFlakeId.value,
name: formParams.value.name,
sex: formParams.value.sex,
telephone: formParams.value.telephone,
isEnable: formParams.value.isEnable,
remark: formParams.value.remark
}
const resp = await api.post('/managementSecurityUnitUser/saveOrUpdate', managementSecurityUnitUserSaveOrUpdateParams)
message.success(resp.message)
close()
}
const close = () => {
tableRef.value?.requestGetTableData()
visible.value = false
closeModal()
}
const closeModal = () => {
formParams.value = {
name: '',
sex: 0,
telephone: '',
isEnable: 0,
remark: ''
}
visible.value = false
}
//Form
const addUserManagement = () => {
visible.value = true
title.value = ''
}
</script>
<style scoped lang="scss">
</style>