Gitea
2 weeks ago
parent
8c5449012d
commit
949568534a
18 changed files with 2046 additions and 224 deletions
@ -0,0 +1,42 @@ |
||||
<template> |
||||
<BasicModal v-bind="$attrs" @register="registerModal" title="修改密码" @ok="handleSubmit"> |
||||
<BasicForm @register="registerForm" /> |
||||
</BasicModal> |
||||
</template> |
||||
<script lang="ts" name="PassWordModal" setup> |
||||
import { ref, computed, unref } from 'vue'; |
||||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
||||
import { BasicForm, useForm } from '/@/components/Form/index'; |
||||
import { formPasswordSchema } from './user.data'; |
||||
import { changePassword } from './user.api'; |
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
//表单配置 |
||||
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({ |
||||
schemas: formPasswordSchema, |
||||
showActionButtonGroup: false, |
||||
}); |
||||
//表单赋值 |
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { |
||||
//重置表单 |
||||
await resetFields(); |
||||
setModalProps({ confirmLoading: false }); |
||||
//表单赋值 |
||||
await setFieldsValue({ ...data }); |
||||
}); |
||||
//表单提交事件 |
||||
async function handleSubmit() { |
||||
try { |
||||
const values = await validate(); |
||||
setModalProps({ confirmLoading: true }); |
||||
//提交表单 |
||||
await changePassword(values); |
||||
//关闭弹窗 |
||||
closeModal(); |
||||
//刷新列表 |
||||
emit('success'); |
||||
} finally { |
||||
setModalProps({ confirmLoading: false }); |
||||
} |
||||
} |
||||
</script> |
||||
@ -0,0 +1,45 @@ |
||||
<template> |
||||
<BasicModal v-bind="$attrs" @register="registerModal" :width="800" title="用户代理" @ok="handleSubmit" destroyOnClose> |
||||
<BasicForm @register="registerForm" /> |
||||
</BasicModal> |
||||
</template> |
||||
<script lang="ts" setup> |
||||
import { ref, computed, unref } from 'vue'; |
||||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
||||
import { BasicForm, useForm } from '/@/components/Form/index'; |
||||
import { formAgentSchema } from './user.data'; |
||||
import { getUserAgent, saveOrUpdateAgent } from './user.api'; |
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
//表单配置 |
||||
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({ |
||||
schemas: formAgentSchema, |
||||
showActionButtonGroup: false, |
||||
}); |
||||
//表单赋值 |
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { |
||||
//重置表单 |
||||
await resetFields(); |
||||
setModalProps({ confirmLoading: false }); |
||||
//查询获取表单数据 |
||||
const res = await getUserAgent({ userName: data.userName }); |
||||
data = res.result ? res.result : data; |
||||
//表单赋值 |
||||
await setFieldsValue({ ...data }); |
||||
}); |
||||
//表单提交事件 |
||||
async function handleSubmit() { |
||||
try { |
||||
const values = await validate(); |
||||
setModalProps({ confirmLoading: true }); |
||||
//提交表单 |
||||
await saveOrUpdateAgent(values); |
||||
//关闭弹窗 |
||||
closeModal(); |
||||
//刷新列表 |
||||
emit('success'); |
||||
} finally { |
||||
setModalProps({ confirmLoading: false }); |
||||
} |
||||
} |
||||
</script> |
||||
@ -0,0 +1,178 @@ |
||||
<template> |
||||
<BasicDrawer |
||||
v-bind="$attrs" |
||||
@register="registerDrawer" |
||||
:title="getTitle" |
||||
:width="adaptiveWidth" |
||||
@ok="handleSubmit" |
||||
:showFooter="showFooter" |
||||
destroyOnClose |
||||
> |
||||
<BasicForm @register="registerForm" /> |
||||
</BasicDrawer> |
||||
</template> |
||||
<script lang="ts" setup> |
||||
import { defineComponent, ref, computed, unref, useAttrs } from 'vue'; |
||||
import { BasicForm, useForm } from '/@/components/Form/index'; |
||||
import { formSchema } from './user.data'; |
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; |
||||
import { saveOrUpdateUser, getUserRoles, getUserDepartList, getAllRolesListNoByTenant, getAllRolesList } from './user.api'; |
||||
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth'; |
||||
import { getTenantId } from "/@/utils/auth"; |
||||
|
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
const attrs = useAttrs(); |
||||
const isUpdate = ref(true); |
||||
const rowId = ref(''); |
||||
const departOptions = ref([]); |
||||
let isFormDepartUser = false; |
||||
//表单配置 |
||||
const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema }] = useForm({ |
||||
labelWidth: 90, |
||||
schemas: formSchema, |
||||
showActionButtonGroup: false, |
||||
}); |
||||
// TODO [VUEN-527] https://www.teambition.com/task/6239beb894b358003fe93626 |
||||
const showFooter = ref(true); |
||||
//表单赋值 |
||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { |
||||
await resetFields(); |
||||
showFooter.value = data?.showFooter ?? true; |
||||
setDrawerProps({ confirmLoading: false, showFooter: showFooter.value }); |
||||
isUpdate.value = !!data?.isUpdate; |
||||
if (unref(isUpdate)) { |
||||
rowId.value = data.record.id; |
||||
//租户信息定义成数组 |
||||
if (data.record.relTenantIds && !Array.isArray(data.record.relTenantIds)) { |
||||
data.record.relTenantIds = data.record.relTenantIds.split(','); |
||||
} else { |
||||
//【issues/I56C5I】用户管理中连续点两次编辑租户配置就丢失了 |
||||
//data.record.relTenantIds = []; |
||||
} |
||||
|
||||
//查角色/赋值/try catch 处理，不然编辑有问题 |
||||
try { |
||||
const userRoles = await getUserRoles({ userid: data.record.id }); |
||||
if (userRoles && userRoles.length > 0) { |
||||
data.record.selectedroles = userRoles; |
||||
} |
||||
} catch (error) {} |
||||
|
||||
//查所属部门/赋值 |
||||
const userDepart = await getUserDepartList({ userId: data.record.id }); |
||||
if (userDepart && userDepart.length > 0) { |
||||
data.record.selecteddeparts = userDepart; |
||||
let selectDepartKeys = Array.from(userDepart, ({ key }) => key); |
||||
data.record.selecteddeparts = selectDepartKeys.join(','); |
||||
departOptions.value = userDepart.map((item) => { |
||||
return { label: item.title, value: item.key }; |
||||
}); |
||||
} |
||||
//负责部门/赋值 |
||||
data.record.departIds && !Array.isArray(data.record.departIds) && (data.record.departIds = data.record.departIds.split(',')); |
||||
//update-begin---author:zyf Date:20211210 for：避免空值显示异常------------ |
||||
//update-begin---author:liusq Date:20231008 for：[issues/772]避免空值显示异常------------ |
||||
data.record.departIds = (!data.record.departIds || data.record.departIds == '') ? [] : data.record.departIds; |
||||
//update-end-----author:liusq Date:20231008 for：[issues/772]避免空值显示异常------------ |
||||
//update-begin---author:zyf Date:20211210 for：避免空值显示异常------------ |
||||
} |
||||
//处理角色用户列表情况(和角色列表有关系) |
||||
data.selectedroles && (await setFieldsValue({ selectedroles: data.selectedroles })); |
||||
// -update-begin--author:liaozhiyang---date:20240702---for：【TV360X-1737】部门用户编辑接口，增加参数updateFromPage:"deptUsers" |
||||
isFormDepartUser = data?.departDisabled === true ? true : false; |
||||
// -update-end--author:liaozhiyang---date:20240702---for：【TV360X-1737】部门用户编辑接口，增加参数updateFromPage:"deptUsers" |
||||
//编辑时隐藏密码/角色列表隐藏角色信息/我的部门时隐藏所属部门 |
||||
updateSchema([ |
||||
{ |
||||
field: 'password', |
||||
// 【QQYUN-8324】 |
||||
ifShow: !unref(isUpdate), |
||||
}, |
||||
{ |
||||
field: 'confirmPassword', |
||||
ifShow: !unref(isUpdate), |
||||
}, |
||||
{ |
||||
field: 'selectedroles', |
||||
show: !data.isRole, |
||||
}, |
||||
{ |
||||
field: 'departIds', |
||||
componentProps: { options: departOptions }, |
||||
}, |
||||
{ |
||||
field: 'selecteddeparts', |
||||
show: !data?.departDisabled, |
||||
}, |
||||
{ |
||||
field: 'selectedroles', |
||||
show: !data?.departDisabled, |
||||
//update-begin---author:wangshuai ---date:20230424 for：【issues/4844】多租户模式下，新增或编辑用户，选择角色一栏，角色选项没有做租户隔离------------ |
||||
//判断是否为多租户模式 |
||||
componentProps:{ |
||||
api: data.tenantSaas?getAllRolesList:getAllRolesListNoByTenant |
||||
} |
||||
//update-end---author:wangshuai ---date:20230424 for：【issues/4844】多租户模式下，新增或编辑用户，选择角色一栏，角色选项没有做租户隔离------------ |
||||
}, |
||||
//update-begin---author:wangshuai ---date:20230522 for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------ |
||||
{ |
||||
field: 'relTenantIds', |
||||
componentProps:{ |
||||
disabled: !!data.tenantSaas, |
||||
}, |
||||
}, |
||||
//update-end---author:wangshuai ---date:20230522 for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------ |
||||
]); |
||||
//update-begin---author:wangshuai ---date:20230522 for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------ |
||||
if(!unref(isUpdate) && data.tenantSaas){ |
||||
await setFieldsValue({ relTenantIds: getTenantId().toString() }) |
||||
} |
||||
//update-end---author:wangshuai ---date:20230522 for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------ |
||||
// 无论新增还是编辑，都可以设置表单值 |
||||
if (typeof data.record === 'object') { |
||||
setFieldsValue({ |
||||
...data.record, |
||||
}); |
||||
} |
||||
// 隐藏底部时禁用整个表单 |
||||
//update-begin-author:taoyan date:2022-5-24 for: VUEN-1117【issue】0523周开源问题 |
||||
setProps({ disabled: !showFooter.value }); |
||||
//update-end-author:taoyan date:2022-5-24 for: VUEN-1117【issue】0523周开源问题 |
||||
}); |
||||
//获取标题 |
||||
const getTitle = computed(() => { |
||||
// update-begin--author:liaozhiyang---date:20240306---for：【QQYUN-8389】系统用户详情抽屉title更改 |
||||
if (!unref(isUpdate)) { |
||||
return '新增用户'; |
||||
} else { |
||||
return unref(showFooter) ? '编辑用户' : '用户详情'; |
||||
} |
||||
// update-end--author:liaozhiyang---date:20240306---for：【QQYUN-8389】系统用户详情抽屉title更改 |
||||
}); |
||||
const { adaptiveWidth } = useDrawerAdaptiveWidth(); |
||||
|
||||
//提交事件 |
||||
async function handleSubmit() { |
||||
try { |
||||
let values = await validate(); |
||||
setDrawerProps({ confirmLoading: true }); |
||||
values.userIdentity === 1 && (values.departIds = ''); |
||||
let isUpdateVal = unref(isUpdate); |
||||
// -update-begin--author:liaozhiyang---date:20240702---for：【TV360X-1737】部门用户编辑接口，增加参数updateFromPage:"deptUsers" |
||||
let params = values; |
||||
if (isFormDepartUser) { |
||||
params = { ...params, updateFromPage: 'deptUsers' }; |
||||
} |
||||
// -update-end--author:liaozhiyang---date:20240702---for：【TV360X-1737】部门用户编辑接口，增加参数updateFromPage:"deptUsers" |
||||
//提交表单 |
||||
await saveOrUpdateUser(params, isUpdateVal); |
||||
//关闭弹窗 |
||||
closeDrawer(); |
||||
//刷新列表 |
||||
emit('success',{isUpdateVal ,values}); |
||||
} finally { |
||||
setDrawerProps({ confirmLoading: false }); |
||||
} |
||||
} |
||||
</script> |
||||
@ -0,0 +1,81 @@ |
||||
<template> |
||||
<BasicModal v-bind="$attrs" @register="registerModal" :width="800" title="离职交接" @ok="handleSubmit"> |
||||
<BasicForm @register="registerForm" /> |
||||
</BasicModal> |
||||
</template> |
||||
<script lang="ts" setup name="user-quit-agent-modal"> |
||||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
||||
import { BasicForm, useForm } from '/@/components/Form/index'; |
||||
import { formQuitAgentSchema } from './user.data'; |
||||
import { getUserAgent, userQuitAgent } from './user.api'; |
||||
import dayjs from 'dayjs'; |
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
//表单配置 |
||||
const [registerForm, { resetFields, setFieldsValue, validate, clearValidate, updateSchema }] = useForm({ |
||||
schemas: formQuitAgentSchema, |
||||
showActionButtonGroup: false, |
||||
}); |
||||
//表单赋值 |
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { |
||||
//重置表单 |
||||
await resetFields(); |
||||
setModalProps({ confirmLoading: true }); |
||||
|
||||
let userId = data.userId; |
||||
//查询获取表单数据 |
||||
const res = await getUserAgent({ userName: data.userName }); |
||||
data = res.result ? res.result : data; |
||||
let date = new Date(); |
||||
if (!data.startTime) { |
||||
data.startTime = dayjs(date).format('YYYY-MM-DD HH:mm:ss'); |
||||
} |
||||
if (!data.endTime) { |
||||
data.endTime = getYear(date); |
||||
} |
||||
|
||||
//update-begin---author:wangshuai ---date:20230703 for：【QQYUN-5685】5、离职人员可以选自己------------ |
||||
await updateSchema( |
||||
[{ |
||||
field:'agentUserName', |
||||
componentProps:{ |
||||
excludeUserIdList:[userId] |
||||
} |
||||
}] |
||||
) |
||||
//update-end---author:wangshuai ---date:20230703 for：【QQYUN-5685】5、离职人员可以选自己------------ |
||||
//表单赋值 |
||||
await setFieldsValue({ ...data }); |
||||
setModalProps({ confirmLoading: false }); |
||||
}); |
||||
//表单提交事件 |
||||
async function handleSubmit() { |
||||
try { |
||||
const values = await validate(); |
||||
setModalProps({ confirmLoading: true }); |
||||
//提交表单 |
||||
await userQuitAgent(values); |
||||
//关闭弹窗 |
||||
closeModal(); |
||||
//刷新列表 |
||||
emit('success',values.userName); |
||||
} finally { |
||||
setModalProps({ confirmLoading: false }); |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* 获取后30年 |
||||
*/ |
||||
function getYear(date) { |
||||
//update-begin---author:wangshuai ---date:20221207 for：[QQYUN-3285]交接人设置 结束时间有问题------------ |
||||
//这是一个数值 |
||||
let y = date.getFullYear() + 30; |
||||
let m = dayjs(date).format('MM'); |
||||
let d = dayjs(date).format('DD'); |
||||
let hour = dayjs(date).format('HH:mm:ss'); |
||||
console.log('年月日', y + '-' + m + '-' + d); |
||||
return dayjs(y + '-' + m + '-' + d + ' ' + hour).format('YYYY-MM-DD HH:mm:ss'); |
||||
//update-end---author:wangshuai ---date:20221207 for：[QQYUN-3285]交接人设置 结束时间有问题-------------- |
||||
} |
||||
</script> |
||||
@ -0,0 +1,110 @@ |
||||
<template> |
||||
<BasicModal v-bind="$attrs" @register="registerModal" title="离职人员信息" :showOkBtn="false" width="1000px" destroyOnClose> |
||||
<BasicTable @register="registerTable" :rowSelection="rowSelection"> |
||||
<!--插槽:table标题--> |
||||
<template #tableTitle> |
||||
<a-dropdown v-if="selectedRowKeys.length > 0"> |
||||
<template #overlay> |
||||
<a-menu> |
||||
<a-menu-item key="1" @click="batchHandleRevert"> |
||||
<Icon icon="ant-design:redo-outlined"></Icon> |
||||
批量取消 |
||||
</a-menu-item> |
||||
</a-menu> |
||||
</template> |
||||
<a-button |
||||
>批量操作 |
||||
<Icon icon="ant-design:down-outlined"></Icon> |
||||
</a-button> |
||||
</a-dropdown> |
||||
</template> |
||||
<!--操作栏--> |
||||
<template #action="{ record }"> |
||||
<TableAction :actions="getTableAction(record)" /> |
||||
</template> |
||||
</BasicTable> |
||||
</BasicModal> |
||||
</template> |
||||
|
||||
<script lang="ts" setup name="user-quit-modal"> |
||||
import { ref, toRaw, unref } from 'vue'; |
||||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
||||
import { BasicTable, useTable, TableAction } from '/@/components/Table'; |
||||
import { recycleColumns } from './user.data'; |
||||
import { getQuitList, putCancelQuit, deleteRecycleBin } from './user.api'; |
||||
import { useMessage } from '/@/hooks/web/useMessage'; |
||||
import { useListPage } from '/@/hooks/system/useListPage'; |
||||
import { Modal } from 'ant-design-vue'; |
||||
import { defHttp } from '/@/utils/http/axios'; |
||||
|
||||
const { createConfirm } = useMessage(); |
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
const checkedKeys = ref<Array<string | number>>([]); |
||||
const [registerModal] = useModalInner(() => { |
||||
checkedKeys.value = []; |
||||
}); |
||||
//注册table数据 |
||||
const { prefixCls, tableContext } = useListPage({ |
||||
tableProps: { |
||||
api: getQuitList, |
||||
columns: recycleColumns, |
||||
rowKey: 'id', |
||||
canResize: false, |
||||
useSearchForm: false, |
||||
actionColumn: { |
||||
width: 120, |
||||
}, |
||||
}, |
||||
}); |
||||
//注册table数据 |
||||
const [registerTable, { reload }, { rowSelection, selectedRowKeys, selectedRows }] = tableContext; |
||||
|
||||
/** |
||||
* 取消离职事件 |
||||
* @param record |
||||
*/ |
||||
async function handleCancelQuit(record) { |
||||
await putCancelQuit({ userIds: record.id, usernames: record.username }, reload); |
||||
emit('success'); |
||||
} |
||||
/** |
||||
* 批量取消离职事件 |
||||
*/ |
||||
function batchHandleRevert() { |
||||
Modal.confirm({ |
||||
title: '取消离职', |
||||
content: '取消离职交接人也会清空', |
||||
okText: '确认', |
||||
cancelText: '取消', |
||||
onOk: () => { |
||||
let rowValue = selectedRows.value; |
||||
let rowData: any = []; |
||||
for (const value of rowValue) { |
||||
rowData.push(value.username); |
||||
} |
||||
handleCancelQuit({ id: toRaw(unref(selectedRowKeys)).join(','), username: rowData.join(',') }); |
||||
}, |
||||
}); |
||||
} |
||||
|
||||
//获取操作栏事件 |
||||
function getTableAction(record) { |
||||
return [ |
||||
{ |
||||
label: '取消离职', |
||||
icon: 'ant-design:redo-outlined', |
||||
popConfirm: { |
||||
title: '是否取消离职,取消离职交接人也会清空', |
||||
confirm: handleCancelQuit.bind(null, record), |
||||
}, |
||||
}, |
||||
]; |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="less"> |
||||
:deep(.ant-popover-inner-content){ |
||||
width: 185px !important; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,166 @@ |
||||
<template> |
||||
<BasicModal v-bind="$attrs" @register="registerModal" title="用户回收站" :showOkBtn="false" width="1000px" destroyOnClose @fullScreen="handleFullScreen"> |
||||
<BasicTable @register="registerTable" :rowSelection="rowSelection" :scroll="scroll"> |
||||
<!--插槽:table标题--> |
||||
<template #tableTitle> |
||||
<a-dropdown v-if="checkedKeys.length > 0"> |
||||
<template #overlay> |
||||
<a-menu> |
||||
<a-menu-item key="1" @click="batchHandleDelete"> |
||||
<Icon icon="ant-design:delete-outlined"></Icon> |
||||
批量删除 |
||||
</a-menu-item> |
||||
<a-menu-item key="1" @click="batchHandleRevert"> |
||||
<Icon icon="ant-design:redo-outlined"></Icon> |
||||
批量还原 |
||||
</a-menu-item> |
||||
</a-menu> |
||||
</template> |
||||
<a-button |
||||
>批量操作 |
||||
<Icon icon="ant-design:down-outlined"></Icon> |
||||
</a-button> |
||||
</a-dropdown> |
||||
</template> |
||||
<!--操作栏--> |
||||
<template #bodyCell="{ column, record }"> |
||||
<template v-if="column.key === 'action'"> |
||||
<TableAction :actions="getTableAction(record)" /> |
||||
</template> |
||||
</template> |
||||
</BasicTable> |
||||
</BasicModal> |
||||
</template> |
||||
<script lang="ts" setup> |
||||
import { ref, toRaw, unref, watch } from 'vue'; |
||||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
||||
import { BasicTable, useTable, TableAction } from '/@/components/Table'; |
||||
import { recycleColumns } from './user.data'; |
||||
import { getRecycleBinList, putRecycleBin, deleteRecycleBin } from './user.api'; |
||||
import { useMessage } from '/@/hooks/web/useMessage'; |
||||
|
||||
const { createConfirm } = useMessage(); |
||||
// 声明Emits |
||||
const emit = defineEmits(['success', 'register']); |
||||
const checkedKeys = ref<Array<string | number>>([]); |
||||
const [registerModal] = useModalInner(() => { |
||||
checkedKeys.value = []; |
||||
}); |
||||
const scroll = ref({ y: 0 }); |
||||
//注册table数据 |
||||
const [registerTable, { reload }] = useTable({ |
||||
api: getRecycleBinList, |
||||
columns: recycleColumns, |
||||
rowKey: 'id', |
||||
striped: true, |
||||
useSearchForm: false, |
||||
showTableSetting: false, |
||||
clickToRowSelect: false, |
||||
bordered: true, |
||||
showIndexColumn: false, |
||||
pagination: true, |
||||
tableSetting: { fullScreen: true }, |
||||
canResize: false, |
||||
actionColumn: { |
||||
width: 150, |
||||
title: '操作', |
||||
dataIndex: 'action', |
||||
// slots: { customRender: 'action' }, |
||||
fixed: undefined, |
||||
}, |
||||
}); |
||||
// update-begin--author:liaozhiyang---date:20240704---for：【TV360X-1657】系统用户回收站弹窗分页展示在可视区内 |
||||
const handleFullScreen = (maximize) => { |
||||
setTableHeight(maximize); |
||||
}; |
||||
const setTableHeight = (maximize) => { |
||||
const clientHeight = document.documentElement.clientHeight; |
||||
scroll.value = { |
||||
y: clientHeight - (maximize ? 300 : 500), |
||||
}; |
||||
}; |
||||
setTableHeight(false); |
||||
watch( |
||||
checkedKeys, |
||||
(newValue, oldValue) => { |
||||
if (checkedKeys.value.length && oldValue.length == 0) { |
||||
scroll.value = { |
||||
y: scroll.value.y - 50, |
||||
}; |
||||
} else if (checkedKeys.value.length == 0 && oldValue.length) { |
||||
scroll.value = { |
||||
y: scroll.value.y + 50, |
||||
}; |
||||
} |
||||
}, |
||||
{ deep: true } |
||||
); |
||||
// update-end--author:liaozhiyang---date:20240704---for：【TV360X-1657】系统用户回收站弹窗分页展示在可视区内 |
||||
/** |
||||
* 选择列配置 |
||||
*/ |
||||
const rowSelection = { |
||||
type: 'checkbox', |
||||
columnWidth: 50, |
||||
selectedRowKeys: checkedKeys, |
||||
onChange: onSelectChange, |
||||
}; |
||||
/** |
||||
* 选择事件 |
||||
*/ |
||||
function onSelectChange(selectedRowKeys: (string | number)[]) { |
||||
checkedKeys.value = selectedRowKeys; |
||||
} |
||||
/** |
||||
* 还原事件 |
||||
*/ |
||||
async function handleRevert(record) { |
||||
await putRecycleBin({ userIds: record.id }, reload); |
||||
emit('success'); |
||||
} |
||||
/** |
||||
* 批量还原事件 |
||||
*/ |
||||
function batchHandleRevert() { |
||||
handleRevert({ id: toRaw(unref(checkedKeys)).join(',') }); |
||||
} |
||||
/** |
||||
* 删除事件 |
||||
*/ |
||||
async function handleDelete(record) { |
||||
await deleteRecycleBin({ userIds: record.id }, reload); |
||||
} |
||||
/** |
||||
* 批量删除事件 |
||||
*/ |
||||
function batchHandleDelete() { |
||||
createConfirm({ |
||||
iconType: 'warning', |
||||
title: '删除', |
||||
content: '确定要永久删除吗？删除后将不可恢复！', |
||||
onOk: () => handleDelete({ id: toRaw(unref(checkedKeys)).join(',') }), |
||||
onCancel() {}, |
||||
}); |
||||
} |
||||
//获取操作栏事件 |
||||
function getTableAction(record) { |
||||
return [ |
||||
{ |
||||
label: '取回', |
||||
icon: 'ant-design:redo-outlined', |
||||
popConfirm: { |
||||
title: '是否确认还原', |
||||
confirm: handleRevert.bind(null, record), |
||||
}, |
||||
}, |
||||
{ |
||||
label: '彻底删除', |
||||
icon: 'ant-design:scissor-outlined', |
||||
popConfirm: { |
||||
title: '是否确认删除', |
||||
confirm: handleDelete.bind(null, record), |
||||
}, |
||||
}, |
||||
]; |
||||
} |
||||
</script> |
||||
@ -0,0 +1,301 @@ |
||||
<template> |
||||
<div> |
||||
<!--引用表格--> |
||||
<BasicTable @register="registerTable" :rowSelection="rowSelection"> |
||||
<!--插槽:table标题--> |
||||
<template #tableTitle> |
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 新增</a-button> |
||||
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls" :disabled="isDisabledAuth('system:user:export')"> 导出</a-button> |
||||
<!-- |
||||
<j-upload-button type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button> |
||||
--> |
||||
<a-button type="primary" @click="openModal(true, {})" preIcon="ant-design:hdd-outlined"> 回收站</a-button> |
||||
<a-dropdown v-if="selectedRowKeys.length > 0"> |
||||
<template #overlay> |
||||
<a-menu> |
||||
<a-menu-item key="1" @click="batchHandleDelete"> |
||||
<Icon icon="ant-design:delete-outlined"></Icon> |
||||
删除 |
||||
</a-menu-item> |
||||
<a-menu-item key="2" @click="batchFrozen(2)"> |
||||
<Icon icon="ant-design:lock-outlined"></Icon> |
||||
冻结 |
||||
</a-menu-item> |
||||
<a-menu-item key="3" @click="batchFrozen(1)"> |
||||
<Icon icon="ant-design:unlock-outlined"></Icon> |
||||
解冻 |
||||
</a-menu-item> |
||||
</a-menu> |
||||
</template> |
||||
<a-button |
||||
>批量操作 |
||||
<Icon icon="mdi:chevron-down"></Icon> |
||||
</a-button> |
||||
</a-dropdown> |
||||
</template> |
||||
<!--操作栏--> |
||||
<template #action="{ record }"> |
||||
<TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> |
||||
</template> |
||||
</BasicTable> |
||||
<!--用户抽屉--> |
||||
<UserDrawer @register="registerDrawer" @success="handleSuccess" /> |
||||
<!--修改密码--> |
||||
<PasswordModal @register="registerPasswordModal" @success="reload" /> |
||||
<!--用户代理--> |
||||
<UserAgentModal @register="registerAgentModal" @success="reload" /> |
||||
<!--回收站--> |
||||
<UserRecycleBinModal @register="registerModal" @success="reload" /> |
||||
<!-- 离职受理人弹窗 --> |
||||
<UserQuitAgentModal @register="registerQuitAgentModal" @success="reload" /> |
||||
<!-- 离职人员列弹窗 --> |
||||
<UserQuitModal @register="registerQuitModal" @success="reload" /> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" name="system-user" setup> |
||||
//ts语法 |
||||
import { ref, computed, unref } from 'vue'; |
||||
import { BasicTable, TableAction, ActionItem } from '/@/components/Table'; |
||||
import UserDrawer from './UserDrawer.vue'; |
||||
import UserRecycleBinModal from './UserRecycleBinModal.vue'; |
||||
import PasswordModal from './PasswordModal.vue'; |
||||
import UserAgentModal from './UserAgentModal.vue'; |
||||
import JThirdAppButton from '/@/components/jeecg/thirdApp/JThirdAppButton.vue'; |
||||
import UserQuitAgentModal from './UserQuitAgentModal.vue'; |
||||
import UserQuitModal from './UserQuitModal.vue'; |
||||
import { useDrawer } from '/@/components/Drawer'; |
||||
import { useListPage } from '/@/hooks/system/useListPage'; |
||||
import { useModal } from '/@/components/Modal'; |
||||
import { useMessage } from '/@/hooks/web/useMessage'; |
||||
import { columns, searchFormSchema } from './user.data'; |
||||
import { listNoCareTenant, deleteUser, batchDeleteUser, getImportUrl, getExportUrl, frozenBatch } from './user.api'; |
||||
import {usePermission} from "/@/hooks/web/usePermission"; |
||||
|
||||
const { createMessage, createConfirm } = useMessage(); |
||||
const { isDisabledAuth } = usePermission(); |
||||
//注册drawer |
||||
const [registerDrawer, { openDrawer }] = useDrawer(); |
||||
//回收站model |
||||
const [registerModal, { openModal }] = useModal(); |
||||
//密码model |
||||
const [registerPasswordModal, { openModal: openPasswordModal }] = useModal(); |
||||
//代理人model |
||||
const [registerAgentModal, { openModal: openAgentModal }] = useModal(); |
||||
//离职代理人model |
||||
const [registerQuitAgentModal, { openModal: openQuitAgentModal }] = useModal(); |
||||
//离职用户列表model |
||||
const [registerQuitModal, { openModal: openQuitModal }] = useModal(); |
||||
|
||||
// 列表页面公共参数、方法 |
||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({ |
||||
designScope: 'user-list', |
||||
tableProps: { |
||||
title: '用户列表', |
||||
api: listNoCareTenant, |
||||
columns: columns, |
||||
size: 'small', |
||||
formConfig: { |
||||
// labelWidth: 200, |
||||
schemas: searchFormSchema, |
||||
}, |
||||
actionColumn: { |
||||
width: 120, |
||||
}, |
||||
beforeFetch: (params) => { |
||||
return Object.assign({ column: 'createTime', order: 'desc' }, params); |
||||
}, |
||||
}, |
||||
exportConfig: { |
||||
name: '用户列表', |
||||
url: getExportUrl, |
||||
}, |
||||
importConfig: { |
||||
url: getImportUrl, |
||||
}, |
||||
}); |
||||
|
||||
//注册table数据 |
||||
const [registerTable, { reload, updateTableDataRecord }, { rowSelection, selectedRows, selectedRowKeys }] = tableContext; |
||||
|
||||
/** |
||||
* 新增事件 |
||||
*/ |
||||
function handleCreate() { |
||||
openDrawer(true, { |
||||
isUpdate: false, |
||||
showFooter: true, |
||||
tenantSaas: false, |
||||
}); |
||||
} |
||||
/** |
||||
* 编辑事件 |
||||
*/ |
||||
async function handleEdit(record: Recordable) { |
||||
openDrawer(true, { |
||||
record, |
||||
isUpdate: true, |
||||
showFooter: true, |
||||
tenantSaas: false, |
||||
}); |
||||
} |
||||
/** |
||||
* 详情 |
||||
*/ |
||||
async function handleDetail(record: Recordable) { |
||||
openDrawer(true, { |
||||
record, |
||||
isUpdate: true, |
||||
showFooter: false, |
||||
tenantSaas: false, |
||||
}); |
||||
} |
||||
/** |
||||
* 删除事件 |
||||
*/ |
||||
async function handleDelete(record) { |
||||
if ('admin' == record.username) { |
||||
createMessage.warning('管理员账号不允许此操作！'); |
||||
return; |
||||
} |
||||
await deleteUser({ id: record.id }, reload); |
||||
} |
||||
/** |
||||
* 批量删除事件 |
||||
*/ |
||||
async function batchHandleDelete() { |
||||
let hasAdmin = unref(selectedRows).filter((item) => item.username == 'admin'); |
||||
if (unref(hasAdmin).length > 0) { |
||||
createMessage.warning('管理员账号不允许此操作！'); |
||||
return; |
||||
} |
||||
await batchDeleteUser({ ids: selectedRowKeys.value }, () => { |
||||
selectedRowKeys.value = []; |
||||
reload(); |
||||
}); |
||||
} |
||||
/** |
||||
* 成功回调 |
||||
*/ |
||||
function handleSuccess() { |
||||
reload(); |
||||
} |
||||
|
||||
/** |
||||
* 打开修改密码弹窗 |
||||
*/ |
||||
function handleChangePassword(username) { |
||||
openPasswordModal(true, { username }); |
||||
} |
||||
/** |
||||
* 打开代理人弹窗 |
||||
*/ |
||||
function handleAgentSettings(userName) { |
||||
openAgentModal(true, { userName }); |
||||
} |
||||
/** |
||||
* 冻结解冻 |
||||
*/ |
||||
async function handleFrozen(record, status) { |
||||
if ('admin' == record.username) { |
||||
createMessage.warning('管理员账号不允许此操作！'); |
||||
return; |
||||
} |
||||
await frozenBatch({ ids: record.id, status: status }, reload); |
||||
} |
||||
/** |
||||
* 批量冻结解冻 |
||||
*/ |
||||
function batchFrozen(status) { |
||||
let hasAdmin = selectedRows.value.filter((item) => item.username == 'admin'); |
||||
if (unref(hasAdmin).length > 0) { |
||||
createMessage.warning('管理员账号不允许此操作！'); |
||||
return; |
||||
} |
||||
createConfirm({ |
||||
iconType: 'warning', |
||||
title: '确认操作', |
||||
content: '是否' + (status == 1 ? '解冻' : '冻结') + '选中账号?', |
||||
onOk: async () => { |
||||
await frozenBatch({ ids: unref(selectedRowKeys).join(','), status: status }, reload); |
||||
}, |
||||
}); |
||||
} |
||||
|
||||
/** |
||||
*同步钉钉和微信回调 |
||||
*/ |
||||
function onSyncFinally({ isToLocal }) { |
||||
// 同步到本地时刷新下数据 |
||||
if (isToLocal) { |
||||
reload(); |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* 操作栏 |
||||
*/ |
||||
function getTableAction(record): ActionItem[] { |
||||
return [ |
||||
{ |
||||
label: '编辑', |
||||
onClick: handleEdit.bind(null, record), |
||||
// ifShow: () => hasPermission('system:user:edit'), |
||||
}, |
||||
]; |
||||
} |
||||
/** |
||||
* 下拉操作栏 |
||||
*/ |
||||
function getDropDownAction(record): ActionItem[] { |
||||
return [ |
||||
{ |
||||
label: '详情', |
||||
onClick: handleDetail.bind(null, record), |
||||
}, |
||||
{ |
||||
label: '密码', |
||||
//auth: 'user:changepwd', |
||||
onClick: handleChangePassword.bind(null, record.username), |
||||
}, |
||||
{ |
||||
label: '删除', |
||||
popConfirm: { |
||||
title: '是否确认删除', |
||||
confirm: handleDelete.bind(null, record), |
||||
}, |
||||
}, |
||||
{ |
||||
label: '冻结', |
||||
ifShow: record.status == 1, |
||||
popConfirm: { |
||||
title: '确定冻结吗?', |
||||
confirm: handleFrozen.bind(null, record, 2), |
||||
}, |
||||
}, |
||||
{ |
||||
label: '解冻', |
||||
ifShow: record.status == 2, |
||||
popConfirm: { |
||||
title: '确定解冻吗?', |
||||
confirm: handleFrozen.bind(null, record, 1), |
||||
}, |
||||
}, |
||||
{ |
||||
label: '代理人', |
||||
onClick: handleAgentSettings.bind(null, record.username), |
||||
}, |
||||
]; |
||||
} |
||||
|
||||
/** |
||||
* 离职 |
||||
* @param userName |
||||
*/ |
||||
function handleQuit(userName) { |
||||
//打开离职代理人弹窗 |
||||
openQuitAgentModal(true, { userName }); |
||||
} |
||||
</script> |
||||
|
||||
<style scoped></style> |
||||
@ -0,0 +1,254 @@ |
||||
import { defHttp } from '/@/utils/http/axios'; |
||||
import { Modal } from 'ant-design-vue'; |
||||
import { isObject } from '/@/utils/is'; |
||||
enum Api { |
||||
listNoCareTenant = '/sys/user/listAll', |
||||
|
||||
// 根据用户角色查询所属用户 add by zhc 11.08 |
||||
listByRollCode = '/sys/user/listByRollCode', |
||||
list = '/sys/user/list', |
||||
save = '/sys/user/add', |
||||
edit = '/sys/user/edit', |
||||
agentSave = '/sys/sysUserAgent/add', |
||||
agentEdit = '/sys/sysUserAgent/edit', |
||||
getUserRole = '/sys/user/queryUserRole', |
||||
duplicateCheck = '/sys/duplicate/check', |
||||
deleteUser = '/sys/user/delete', |
||||
deleteBatch = '/sys/user/deleteBatch', |
||||
importExcel = '/sys/user/importExcel', |
||||
exportXls = '/sys/user/exportXls', |
||||
recycleBinList = '/sys/user/recycleBin', |
||||
putRecycleBin = '/sys/user/putRecycleBin', |
||||
deleteRecycleBin = '/sys/user/deleteRecycleBin', |
||||
allRolesList = '/sys/role/queryall', |
||||
allRolesListNoByTenant = '/sys/role/queryallNoByTenant', |
||||
allTenantList = '/sys/tenant/queryList', |
||||
allPostList = '/sys/position/list', |
||||
userDepartList = '/sys/user/userDepartList', |
||||
changePassword = '/sys/user/changePassword', |
||||
frozenBatch = '/sys/user/frozenBatch', |
||||
getUserAgent = '/sys/sysUserAgent/queryByUserName', |
||||
userQuitAgent = '/sys/user/userQuitAgent', |
||||
getQuitList = '/sys/user/getQuitList', |
||||
putCancelQuit = '/sys/user/putCancelQuit', |
||||
updateUserTenantStatus='/sys/tenant/updateUserTenantStatus', |
||||
getUserTenantPageList='/sys/tenant/getUserTenantPageList', |
||||
} |
||||
/** |
||||
* 导出api |
||||
* @param params |
||||
*/ |
||||
export const getExportUrl = Api.exportXls; |
||||
/** |
||||
* 导入api |
||||
*/ |
||||
export const getImportUrl = Api.importExcel; |
||||
/** |
||||
* 列表接口(查询用户，通过租户隔离) |
||||
* @param params |
||||
*/ |
||||
export const list = (params) => defHttp.get({ url: Api.list, params }); |
||||
|
||||
/** |
||||
* 列表接口(查询全部用户，不通过租户隔离) |
||||
* @param params |
||||
*/ |
||||
export const listNoCareTenant = (params) => defHttp.get({ url: Api.listByRollCode, params }); |
||||
|
||||
/** |
||||
* 用户角色接口 |
||||
* @param params |
||||
*/ |
||||
export const getUserRoles = (params) => defHttp.get({ url: Api.getUserRole, params }, { errorMessageMode: 'none' }); |
||||
|
||||
/** |
||||
* 删除用户 |
||||
*/ |
||||
export const deleteUser = (params, handleSuccess) => { |
||||
return defHttp.delete({ url: Api.deleteUser, params }, { joinParamsToUrl: true }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}; |
||||
/** |
||||
* 批量删除用户 |
||||
* @param params |
||||
*/ |
||||
export const batchDeleteUser = (params, handleSuccess) => { |
||||
Modal.confirm({ |
||||
title: '确认删除', |
||||
content: '是否删除选中数据', |
||||
okText: '确认', |
||||
cancelText: '取消', |
||||
onOk: () => { |
||||
return defHttp.delete({ url: Api.deleteBatch, data: params }, { joinParamsToUrl: true }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}, |
||||
}); |
||||
}; |
||||
/** |
||||
* 保存或者更新用户 |
||||
* @param params |
||||
*/ |
||||
export const saveOrUpdateUser = (params, isUpdate) => { |
||||
let url = isUpdate ? Api.edit : Api.save; |
||||
return defHttp.post({ url: url, params }); |
||||
}; |
||||
/** |
||||
* 唯一校验 |
||||
* @param params |
||||
*/ |
||||
export const duplicateCheck = (params) => defHttp.get({ url: Api.duplicateCheck, params }, { isTransformResponse: false }); |
||||
|
||||
/** |
||||
* 20231215 |
||||
* liaozhiyang |
||||
* 唯一校验（ 延迟【防抖】） |
||||
* @param params |
||||
*/ |
||||
const timer = {}; |
||||
export const duplicateCheckDelay = (params) => { |
||||
return new Promise((resove, rejected) => { |
||||
// -update-begin--author:liaozhiyang---date:20240619---for：【TV360X-1380】表单中使用多个duplicateCheckDelay，validate方法调用时会导致promise被挂起保存不了 |
||||
let key; |
||||
if (isObject(params)) { |
||||
key = `${params.tableName}_${params.fieldName}`; |
||||
} else { |
||||
key = params; |
||||
} |
||||
clearTimeout(timer[key]); |
||||
// -update-end--author:liaozhiyang---date:20240619---for：【TV360X-1380】表单中使用多个duplicateCheckDelay，validate方法调用时会导致promise被挂起保存不了 |
||||
timer[key] = setTimeout(() => { |
||||
defHttp |
||||
.get({ url: Api.duplicateCheck, params }, { isTransformResponse: false }) |
||||
.then((res: any) => { |
||||
resove(res as any); |
||||
}) |
||||
.catch((error) => { |
||||
rejected(error); |
||||
}); |
||||
delete timer[key]; |
||||
}, 500); |
||||
}); |
||||
}; |
||||
/** |
||||
* 获取全部角色（租户隔离） |
||||
* @param params |
||||
*/ |
||||
export const getAllRolesList = (params) => defHttp.get({ url: Api.allRolesList, params }); |
||||
/** |
||||
* 获取全部角色（不租户隔离） |
||||
* @param params |
||||
*/ |
||||
export const getAllRolesListNoByTenant = (params) => defHttp.get({ url: Api.allRolesListNoByTenant, params }); |
||||
/** |
||||
* 获取全部租户 |
||||
*/ |
||||
export const getAllTenantList = (params) => defHttp.get({ url: Api.allTenantList, params }); |
||||
/** |
||||
* 获取指定用户负责部门 |
||||
*/ |
||||
export const getUserDepartList = (params) => defHttp.get({ url: Api.userDepartList, params }, { successMessageMode: 'none' }); |
||||
/** |
||||
* 获取全部职务 |
||||
*/ |
||||
export const getAllPostList = (params) => { |
||||
return new Promise((resolve) => { |
||||
defHttp.get({ url: Api.allPostList, params }).then((res) => { |
||||
resolve(res.records); |
||||
}); |
||||
}); |
||||
}; |
||||
/** |
||||
* 回收站列表 |
||||
* @param params |
||||
*/ |
||||
export const getRecycleBinList = (params) => defHttp.get({ url: Api.recycleBinList, params }); |
||||
/** |
||||
* 回收站还原 |
||||
* @param params |
||||
*/ |
||||
export const putRecycleBin = (params, handleSuccess) => { |
||||
return defHttp.put({ url: Api.putRecycleBin, params }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}; |
||||
/** |
||||
* 回收站删除 |
||||
* @param params |
||||
*/ |
||||
export const deleteRecycleBin = (params, handleSuccess) => { |
||||
return defHttp.delete({ url: Api.deleteRecycleBin, params }, { joinParamsToUrl: true }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}; |
||||
/** |
||||
* 修改密码 |
||||
* @param params |
||||
*/ |
||||
export const changePassword = (params) => { |
||||
return defHttp.put({ url: Api.changePassword, params }); |
||||
}; |
||||
/** |
||||
* 冻结解冻 |
||||
* @param params |
||||
*/ |
||||
export const frozenBatch = (params, handleSuccess) => { |
||||
return defHttp.put({ url: Api.frozenBatch, params }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}; |
||||
/** |
||||
* 获取用户代理 |
||||
* @param params |
||||
*/ |
||||
export const getUserAgent = (params) => defHttp.get({ url: Api.getUserAgent, params }, { isTransformResponse: false }); |
||||
/** |
||||
* 保存或者更新用户代理 |
||||
* @param params |
||||
*/ |
||||
export const saveOrUpdateAgent = (params) => { |
||||
let url = params.id ? Api.agentEdit : Api.agentSave; |
||||
return defHttp.post({ url: url, params }); |
||||
}; |
||||
|
||||
/** |
||||
* 用户离职(新增代理人和用户状态变更操作) |
||||
* @param params |
||||
*/ |
||||
export const userQuitAgent = (params) => { |
||||
return defHttp.put({ url: Api.userQuitAgent, params }); |
||||
}; |
||||
|
||||
/** |
||||
* 用户离职列表 |
||||
* @param params |
||||
*/ |
||||
export const getQuitList = (params) => { |
||||
return defHttp.get({ url: Api.getQuitList, params }); |
||||
}; |
||||
|
||||
/** |
||||
* 取消离职 |
||||
* @param params |
||||
*/ |
||||
export const putCancelQuit = (params, handleSuccess) => { |
||||
return defHttp.put({ url: Api.putCancelQuit, params }, { joinParamsToUrl: true }).then(() => { |
||||
handleSuccess(); |
||||
}); |
||||
}; |
||||
|
||||
/** |
||||
* 待审批获取列表数据 |
||||
*/ |
||||
export const getUserTenantPageList = (params) => { |
||||
return defHttp.get({ url: Api.getUserTenantPageList, params }); |
||||
}; |
||||
|
||||
/** |
||||
* 更新租户状态 |
||||
* @param params |
||||
*/ |
||||
export const updateUserTenantStatus = (params) => { |
||||
return defHttp.put({ url: Api.updateUserTenantStatus, params }, { joinParamsToUrl: true, isTransformResponse: false }); |
||||
}; |
||||
@ -0,0 +1,569 @@ |
||||
import { BasicColumn } from '/@/components/Table'; |
||||
import { FormSchema } from '/@/components/Table'; |
||||
import { getAllRolesListNoByTenant, getAllTenantList } from './user.api'; |
||||
import { rules } from '/@/utils/helper/validator'; |
||||
import { render } from '/@/utils/common/renderUtils'; |
||||
export const columns: BasicColumn[] = [ |
||||
{ |
||||
title: '用户账号', |
||||
dataIndex: 'username', |
||||
width: 120, |
||||
}, |
||||
{ |
||||
title: '用户姓名', |
||||
dataIndex: 'realname', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '头像', |
||||
dataIndex: 'avatar', |
||||
width: 120, |
||||
customRender: render.renderAvatar, |
||||
}, |
||||
{ |
||||
title: '性别', |
||||
dataIndex: 'sex', |
||||
width: 80, |
||||
sorter: true, |
||||
customRender: ({ text }) => { |
||||
return render.renderDict(text, 'sex'); |
||||
}, |
||||
}, |
||||
/*{ |
||||
title: '生日', |
||||
dataIndex: 'birthday', |
||||
width: 100, |
||||
},*/ |
||||
{ |
||||
title: '手机号', |
||||
dataIndex: 'phone', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '部门', |
||||
width: 150, |
||||
dataIndex: 'orgCodeTxt', |
||||
}, |
||||
/*{ |
||||
title: '负责部门', |
||||
width: 150, |
||||
dataIndex: 'departIds_dictText', |
||||
},*/ |
||||
{ |
||||
title: '状态', |
||||
dataIndex: 'status_dictText', |
||||
width: 80, |
||||
}, |
||||
]; |
||||
|
||||
export const recycleColumns: BasicColumn[] = [ |
||||
{ |
||||
title: '用户账号', |
||||
dataIndex: 'username', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '用户姓名', |
||||
dataIndex: 'realname', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '头像', |
||||
dataIndex: 'avatar', |
||||
width: 80, |
||||
customRender: render.renderAvatar, |
||||
}, |
||||
{ |
||||
title: '性别', |
||||
dataIndex: 'sex', |
||||
width: 80, |
||||
sorter: true, |
||||
customRender: ({ text }) => { |
||||
return render.renderDict(text, 'sex'); |
||||
}, |
||||
}, |
||||
]; |
||||
|
||||
export const searchFormSchema: FormSchema[] = [ |
||||
{ |
||||
label: '账号', |
||||
field: 'username', |
||||
component: 'JInput', |
||||
//colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '名字', |
||||
field: 'realname', |
||||
component: 'JInput', |
||||
//colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '性别', |
||||
field: 'sex', |
||||
component: 'JDictSelectTag', |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
placeholder: '请选择性别', |
||||
stringToNumber: true, |
||||
}, |
||||
//colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '手机号码', |
||||
field: 'phone', |
||||
component: 'Input', |
||||
//colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '用户状态', |
||||
field: 'status', |
||||
component: 'JDictSelectTag', |
||||
componentProps: { |
||||
dictCode: 'user_status', |
||||
placeholder: '请选择状态', |
||||
stringToNumber: true, |
||||
}, |
||||
//colProps: { span: 6 }, |
||||
}, |
||||
]; |
||||
|
||||
export const formSchema: FormSchema[] = [ |
||||
{ |
||||
label: '', |
||||
field: 'id', |
||||
component: 'Input', |
||||
show: false, |
||||
}, |
||||
{ |
||||
label: '用户账号', |
||||
field: 'username', |
||||
component: 'Input', |
||||
required: true, |
||||
dynamicDisabled: ({ values }) => { |
||||
return !!values.id; |
||||
}, |
||||
dynamicRules: ({ model, schema }) => rules.duplicateCheckRule('sys_user', 'username', model, schema, true), |
||||
}, |
||||
{ |
||||
label: '登录密码', |
||||
field: 'password', |
||||
component: 'StrengthMeter', |
||||
componentProps:{ |
||||
autocomplete: 'new-password', |
||||
}, |
||||
rules: [ |
||||
{ |
||||
required: true, |
||||
message: '请输入登录密码', |
||||
}, |
||||
{ |
||||
pattern: /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/, |
||||
message: '密码由8位数字、大小写字母和特殊符号组成!', |
||||
}, |
||||
], |
||||
}, |
||||
{ |
||||
label: '确认密码', |
||||
field: 'confirmPassword', |
||||
component: 'InputPassword', |
||||
dynamicRules: ({ values }) => rules.confirmPassword(values, true), |
||||
}, |
||||
{ |
||||
label: '用户姓名', |
||||
field: 'realname', |
||||
required: true, |
||||
component: 'Input', |
||||
}, |
||||
/*{ |
||||
label: '工号', |
||||
field: 'workNo', |
||||
required: true, |
||||
component: 'Input', |
||||
dynamicRules: ({ model, schema }) => rules.duplicateCheckRule('sys_user', 'work_no', model, schema, true), |
||||
}, |
||||
{ |
||||
label: '职务', |
||||
field: 'post', |
||||
required: false, |
||||
component: 'JSelectPosition', |
||||
componentProps: { |
||||
labelKey: 'name', |
||||
}, |
||||
},*/ |
||||
{ |
||||
label: '角色', |
||||
field: 'selectedroles', |
||||
component: 'ApiSelect', |
||||
componentProps: { |
||||
mode: 'multiple', |
||||
api: getAllRolesListNoByTenant, |
||||
labelField: 'roleName', |
||||
valueField: 'id', |
||||
immediate: false, |
||||
}, |
||||
}, |
||||
{ |
||||
label: '所属部门', |
||||
field: 'selecteddeparts', |
||||
component: 'JSelectDept', |
||||
componentProps: ({ formActionType, formModel }) => { |
||||
return { |
||||
sync: false, |
||||
checkStrictly: true, |
||||
defaultExpandLevel: 2, |
||||
|
||||
onSelect: (options, values) => { |
||||
const { updateSchema } = formActionType; |
||||
//所属部门修改后更新负责部门下拉框数据 |
||||
updateSchema([ |
||||
{ |
||||
field: 'departIds', |
||||
componentProps: { options }, |
||||
}, |
||||
]); |
||||
//update-begin---author:wangshuai---date:2024-05-11---for:【issues/1222】用户编辑界面“所属部门”与“负责部门”联动出错整--- |
||||
if(!values){ |
||||
formModel.departIds = []; |
||||
return; |
||||
} |
||||
//update-end---author:wangshuai---date:2024-05-11---for:【issues/1222】用户编辑界面“所属部门”与“负责部门”联动出错整--- |
||||
//所属部门修改后更新负责部门数据 |
||||
formModel.departIds && (formModel.departIds = formModel.departIds.filter((item) => values.value.indexOf(item) > -1)); |
||||
}, |
||||
}; |
||||
}, |
||||
}, |
||||
/*{ |
||||
label: '租户', |
||||
field: 'relTenantIds', |
||||
component: 'ApiSelect', |
||||
componentProps: { |
||||
mode: 'multiple', |
||||
api: getAllTenantList, |
||||
numberToString: true, |
||||
labelField: 'name', |
||||
valueField: 'id', |
||||
immediate: false, |
||||
}, |
||||
}, |
||||
{ |
||||
label: '身份', |
||||
field: 'userIdentity', |
||||
component: 'RadioGroup', |
||||
defaultValue: 1, |
||||
componentProps: ({ formModel }) => { |
||||
return { |
||||
options: [ |
||||
{ label: '普通用户', value: 1, key: '1' }, |
||||
{ label: '上级', value: 2, key: '2' }, |
||||
], |
||||
onChange: () => { |
||||
formModel.userIdentity == 1 && (formModel.departIds = []); |
||||
}, |
||||
}; |
||||
}, |
||||
},*/ |
||||
{ |
||||
label: '负责部门', |
||||
field: 'departIds', |
||||
component: 'Select', |
||||
componentProps: { |
||||
mode: 'multiple', |
||||
}, |
||||
ifShow: ({ values }) => values.userIdentity == 2, |
||||
}, |
||||
{ |
||||
label: '头像', |
||||
field: 'avatar', |
||||
component: 'JImageUpload', |
||||
componentProps: { |
||||
fileMax: 1, |
||||
}, |
||||
}, |
||||
{ |
||||
label: '生日', |
||||
field: 'birthday', |
||||
component: 'DatePicker', |
||||
}, |
||||
{ |
||||
label: '性别', |
||||
field: 'sex', |
||||
component: 'JDictSelectTag', |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
placeholder: '请选择性别', |
||||
stringToNumber: true, |
||||
}, |
||||
}, |
||||
{ |
||||
label: '邮箱', |
||||
field: 'email', |
||||
component: 'Input', |
||||
required: true, |
||||
dynamicRules: ({ model, schema }) => { |
||||
return [ |
||||
{ ...rules.duplicateCheckRule('sys_user', 'email', model, schema, true)[0], trigger: 'blur' }, |
||||
{ ...rules.rule('email', false)[0], trigger: 'blur' }, |
||||
]; |
||||
}, |
||||
}, |
||||
{ |
||||
label: '手机号码', |
||||
field: 'phone', |
||||
component: 'Input', |
||||
required: true, |
||||
dynamicRules: ({ model, schema }) => { |
||||
return [ |
||||
{ ...rules.duplicateCheckRule('sys_user', 'phone', model, schema, true)[0], trigger: 'blur' }, |
||||
{ pattern: /^1[3456789]\d{9}$/, message: '手机号码格式有误', trigger: 'blur' }, |
||||
]; |
||||
}, |
||||
}, |
||||
/* { |
||||
label: '座机', |
||||
field: 'telephone', |
||||
component: 'Input', |
||||
rules: [{ pattern: /^0\d{2,3}-[1-9]\d{6,7}$/, message: '请输入正确的座机号码' }], |
||||
}, |
||||
{ |
||||
label: '工作流引擎', |
||||
field: 'activitiSync', |
||||
defaultValue: 1, |
||||
component: 'JDictSelectTag', |
||||
componentProps: { |
||||
dictCode: 'activiti_sync', |
||||
type: 'radio', |
||||
stringToNumber: true, |
||||
}, |
||||
},*/ |
||||
]; |
||||
|
||||
export const formPasswordSchema: FormSchema[] = [ |
||||
{ |
||||
label: '用户账号', |
||||
field: 'username', |
||||
component: 'Input', |
||||
componentProps: { readOnly: true }, |
||||
}, |
||||
{ |
||||
label: '登录密码', |
||||
field: 'password', |
||||
component: 'StrengthMeter', |
||||
componentProps: { |
||||
placeholder: '请输入登录密码', |
||||
}, |
||||
rules: [ |
||||
{ |
||||
required: true, |
||||
message: '请输入登录密码', |
||||
}, |
||||
{ |
||||
pattern: /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/, |
||||
message: '密码由8位数字、大小写字母和特殊符号组成!', |
||||
}, |
||||
], |
||||
}, |
||||
{ |
||||
label: '确认密码', |
||||
field: 'confirmPassword', |
||||
component: 'InputPassword', |
||||
dynamicRules: ({ values }) => rules.confirmPassword(values, true), |
||||
}, |
||||
]; |
||||
|
||||
export const formAgentSchema: FormSchema[] = [ |
||||
{ |
||||
label: '', |
||||
field: 'id', |
||||
component: 'Input', |
||||
show: false, |
||||
}, |
||||
{ |
||||
field: 'userName', |
||||
label: '用户名', |
||||
component: 'Input', |
||||
componentProps: { |
||||
readOnly: true, |
||||
allowClear: false, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'agentUserName', |
||||
label: '代理人用户名', |
||||
required: true, |
||||
component: 'JSelectUser', |
||||
componentProps: { |
||||
rowKey: 'username', |
||||
labelKey: 'realname', |
||||
maxSelectCount: 10, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'startTime', |
||||
label: '代理开始时间', |
||||
component: 'DatePicker', |
||||
required: true, |
||||
componentProps: { |
||||
showTime: true, |
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
||||
placeholder: '请选择代理开始时间', |
||||
getPopupContainer: () => document.body, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'endTime', |
||||
label: '代理结束时间', |
||||
component: 'DatePicker', |
||||
required: true, |
||||
componentProps: { |
||||
showTime: true, |
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
||||
placeholder: '请选择代理结束时间', |
||||
getPopupContainer: () => document.body, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'status', |
||||
label: '状态', |
||||
component: 'JDictSelectTag', |
||||
defaultValue: '1', |
||||
componentProps: { |
||||
dictCode: 'valid_status', |
||||
type: 'radioButton', |
||||
}, |
||||
}, |
||||
]; |
||||
|
||||
export const formQuitAgentSchema: FormSchema[] = [ |
||||
{ |
||||
label: '', |
||||
field: 'id', |
||||
component: 'Input', |
||||
show: false, |
||||
}, |
||||
{ |
||||
field: 'userName', |
||||
label: '用户名', |
||||
component: 'Input', |
||||
componentProps: { |
||||
readOnly: true, |
||||
allowClear: false, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'agentUserName', |
||||
label: '交接人员', |
||||
//required: true, |
||||
component: 'JSelectUser', |
||||
componentProps: { |
||||
rowKey: 'username', |
||||
labelKey: 'realname', |
||||
maxSelectCount: 1, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'startTime', |
||||
label: '交接开始时间', |
||||
component: 'DatePicker', |
||||
//required: true, |
||||
componentProps: { |
||||
showTime: true, |
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
||||
placeholder: '请选择交接开始时间', |
||||
getPopupContainer: () => document.body, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'endTime', |
||||
label: '交接结束时间', |
||||
component: 'DatePicker', |
||||
//required: true, |
||||
componentProps: { |
||||
showTime: true, |
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
||||
placeholder: '请选择交接结束时间', |
||||
getPopupContainer: () => document.body, |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'status', |
||||
label: '状态', |
||||
component: 'JDictSelectTag', |
||||
defaultValue: '1', |
||||
componentProps: { |
||||
dictCode: 'valid_status', |
||||
type: 'radioButton', |
||||
}, |
||||
}, |
||||
]; |
||||
|
||||
//租户用户列表 |
||||
export const userTenantColumns: BasicColumn[] = [ |
||||
{ |
||||
title: '用户账号', |
||||
dataIndex: 'username', |
||||
width: 120, |
||||
}, |
||||
{ |
||||
title: '用户姓名', |
||||
dataIndex: 'realname', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '头像', |
||||
dataIndex: 'avatar', |
||||
width: 120, |
||||
customRender: render.renderAvatar, |
||||
}, |
||||
{ |
||||
title: '手机号', |
||||
dataIndex: 'phone', |
||||
width: 100, |
||||
}, |
||||
{ |
||||
title: '部门', |
||||
width: 150, |
||||
dataIndex: 'orgCodeTxt', |
||||
}, |
||||
{ |
||||
title: '状态', |
||||
dataIndex: 'status', |
||||
width: 80, |
||||
customRender: ({ text }) => { |
||||
if (text === '1') { |
||||
return '正常'; |
||||
} else if (text === '3') { |
||||
return '审批中'; |
||||
} else { |
||||
return '已拒绝'; |
||||
} |
||||
}, |
||||
}, |
||||
]; |
||||
|
||||
//用户租户搜索表单 |
||||
export const userTenantFormSchema: FormSchema[] = [ |
||||
{ |
||||
label: '账号', |
||||
field: 'username', |
||||
component: 'Input', |
||||
colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '名字', |
||||
field: 'realname', |
||||
component: 'Input', |
||||
colProps: { span: 6 }, |
||||
}, |
||||
{ |
||||
label: '性别', |
||||
field: 'sex', |
||||
component: 'JDictSelectTag', |
||||
componentProps: { |
||||
dictCode: 'sex', |
||||
placeholder: '请选择性别', |
||||
stringToNumber: true, |
||||
}, |
||||
colProps: { span: 6 }, |
||||
}, |
||||
]; |
||||
@ -0,0 +1,54 @@ |
||||
<template> |
||||
<Description @register="register" class="mt-4" /> |
||||
</template> |
||||
<script lang="ts"> |
||||
import { defineComponent } from 'vue'; |
||||
import { Description, DescItem, useDescription } from '/@/components/Description/index'; |
||||
const mockData = { |
||||
username: 'test', |
||||
nickName: 'VB', |
||||
age: '123', |
||||
phone: '15695909xxx', |
||||
email: '190848757@qq.com', |
||||
addr: '厦门市思明区', |
||||
sex: '男', |
||||
certy: '3504256199xxxxxxxxx', |
||||
tag: 'orange', |
||||
}; |
||||
const schema: DescItem[] = [ |
||||
{ |
||||
field: 'username', |
||||
label: '用户名', |
||||
}, |
||||
{ |
||||
field: 'nickName', |
||||
label: '昵称', |
||||
render: (curVal, data) => { |
||||
return `${data.username}-${curVal}`; |
||||
}, |
||||
}, |
||||
{ |
||||
field: 'phone', |
||||
label: '联系电话', |
||||
}, |
||||
{ |
||||
field: 'email', |
||||
label: '邮箱', |
||||
}, |
||||
{ |
||||
field: 'addr', |
||||
label: '地址', |
||||
}, |
||||
]; |
||||
export default defineComponent({ |
||||
components: { Description }, |
||||
setup() { |
||||
const [register] = useDescription({ |
||||
title: 'useDescription', |
||||
data: mockData, |
||||
schema: schema, |
||||
}); |
||||
return { mockData, schema, register }; |
||||
}, |
||||
}); |
||||
</script> |
||||
Loading…
Reference in new issue