增加前端请求超时配置

用户部门优化(用户所属部门改为列表,增加是否同步配置项)
switch组件支持自定义值
基本表格可编辑字段组件增加onUpdate支持响应式
This commit is contained in:
yaoyn
2024-11-28 15:47:59 +08:00
parent 4231f1dd6d
commit 020a0a20ee
12 changed files with 172 additions and 18 deletions

View File

@ -42,6 +42,9 @@ export interface UserModel {
roles: any; //角色信息
posts: any; //岗位信息
chargeDepartments: any; //负责部门
departments:any;//所属部门
isSync: string;//是否同步
}
/**

View File

@ -17,7 +17,7 @@
</script>
<script lang="ts" setup>
import { ref, watch } from 'vue';
import { isBoolean } from '/@/utils/is';
import {isBoolean, isNumber} from '/@/utils/is';
import { useAppStore } from '/@/store/modules/app';
const props = defineProps({
@ -37,7 +37,7 @@
watch(
() => props.checked,
(val) => {
value.value = isBoolean(val) ? val : Number(val)!;
value.value = isBoolean(val) ? val : isNumber(val)? Number(val)! : val;
},
{
immediate: true,

View File

@ -89,7 +89,10 @@
placeholder: createPlaceholderMessage(unref(getComponent)),
...apiSelectProps,
...omit(compProps, 'onChange'),
[valueField]: value,
[valueField]: currentValueRef,
["onUpdate:"+valueField]:(newVal)=>{
handleChange(newVal);
}
} as any;
});

View File

@ -7,6 +7,7 @@ export const useGlobSetting = (): Readonly<GlobConfig> => {
const {
VITE_GLOB_APP_TITLE,
VITE_GLOB_API_URL,
VITE_GLOB_REQUEST_TIMEOUT,
VITE_GLOB_APP_SHORT_NAME,
VITE_GLOB_API_URL_PREFIX,
VITE_GLOB_UPLOAD_URL,
@ -24,6 +25,7 @@ export const useGlobSetting = (): Readonly<GlobConfig> => {
const glob: Readonly<GlobConfig> = {
title: VITE_GLOB_APP_TITLE,
apiUrl: VITE_GLOB_API_URL,
requestTimeout:VITE_GLOB_REQUEST_TIMEOUT,
shortName: VITE_GLOB_APP_SHORT_NAME,
urlPrefix: VITE_GLOB_API_URL_PREFIX,
uploadUrl: VITE_GLOB_UPLOAD_URL,

View File

@ -22,7 +22,7 @@ export function getAppEnvConfig() {
(import.meta.env as unknown as GlobEnvConfig)
: window[ENV_NAME as any]) as unknown as GlobEnvConfig;
const { VITE_GLOB_APP_TITLE, VITE_GLOB_API_URL, VITE_GLOB_APP_SHORT_NAME, VITE_GLOB_API_URL_PREFIX, VITE_GLOB_UPLOAD_URL, VITE_GLOB_UPLOAD_PREVIEW, VITE_GLOB_OUT_LINK_URL, VITE_GLOB_REPORT_URL, VITE_GLOB_PRINT_BASE_URL } = ENV;
const { VITE_GLOB_APP_TITLE, VITE_GLOB_API_URL, VITE_GLOB_APP_SHORT_NAME, VITE_GLOB_API_URL_PREFIX, VITE_GLOB_REQUEST_TIMEOUT, VITE_GLOB_UPLOAD_URL, VITE_GLOB_UPLOAD_PREVIEW, VITE_GLOB_OUT_LINK_URL, VITE_GLOB_REPORT_URL, VITE_GLOB_PRINT_BASE_URL } = ENV;
if (!/^[a-zA-Z\_]*$/.test(VITE_GLOB_APP_SHORT_NAME)) {
warn(`VITE_GLOB_APP_SHORT_NAME Variables can only be characters/underscores, please modify in the environment variables and re-running.`);
@ -33,6 +33,7 @@ export function getAppEnvConfig() {
VITE_GLOB_API_URL,
VITE_GLOB_APP_SHORT_NAME,
VITE_GLOB_API_URL_PREFIX,
VITE_GLOB_REQUEST_TIMEOUT,
VITE_GLOB_UPLOAD_URL,
VITE_GLOB_UPLOAD_PREVIEW,
VITE_GLOB_OUT_LINK_URL,

View File

@ -243,7 +243,7 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
// authentication schemese.g: Bearer
// authenticationScheme: 'Bearer',
authenticationScheme: 'Bearer',
timeout: 10 * 1000,
timeout: globSetting.requestTimeout||10 * 1000,
// 基础接口地址
// baseURL: globSetting.apiUrl,

View File

@ -88,7 +88,7 @@
label: '组织简称',
component: 'Input',
componentProps: {
placeholder: '请输入公司简称',
placeholder: '请输入组织简称',
},
colProps: { lg: 12, md: 12 },
},
@ -129,6 +129,18 @@
placeholder: '请选择行政区域'
},
},
{
field: 'isSync',
label: '同步',
component: 'Switch',
colProps: { span: 12 },
helpMessage: '开启同步则会自动修正与域里人员组织数据一致,域里不存在的组织和下级人员组织将被删除',
helpComponentProps: { maxWidth: '400px' },
componentProps: {
checkedValue: 'Y',
unCheckedValue: 'N',
}
},
];
const companySchema: FormSchema[] = [

View File

@ -68,7 +68,7 @@
import { useMessage } from '/@/hooks/web/useMessage';
// import { useI18n } from 'vue-i18n';
import { SelectMember } from '/@/components/SelectOrganizational/index';
import { deleteDepartment, getDepartmentEnabledTree, getDepartmentTrees, getDepartmentUserList, updateDepartmentUser } from '/@/api/system/department';
import { deleteDepartment, getDepartmentTrees, getDepartmentUserList, updateDepartmentUser } from '/@/api/system/department';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();

View File

@ -7,7 +7,7 @@
:fixedHeight="true"
@ok="handleSubmit"
>
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange">
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange" :class="{ 'h-full': ['1', '2'].includes(activeKey) }">
<a-tab-pane key="1" tab="全部">
<BasicTable @register="registerTableAll" />
</a-tab-pane>
@ -63,7 +63,7 @@
const emits = defineEmits(['success']);
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
setModalProps({ confirmLoading: false, fixedHeight: true });
setSelectedRowKeys1(data.orgs?.map((x) => x.id) || []);
reload();
});
@ -138,8 +138,12 @@
};
</script>
<style lang="less" scoped>
:deep(.ant-tabs-content),
:deep(.vben-basic-table .ant-table-wrapper) {
height: auto;
height: 100%;
}
:deep(.vben-basic-table .ant-table) {
height: calc(100% - 40px);
}
:deep(.ant-tabs-nav-wrap) {

View File

@ -2,7 +2,7 @@
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<a-tabs
v-model:activeKey="activeKey"
:class="{ 'h-full': ['3', '4', '5'].includes(activeKey) }"
:class="{ 'h-full': ['3', '4', '5', '6'].includes(activeKey) }"
>
<a-tab-pane key="1" tab="基础信息">
<BasicForm @register="registerForm1" :style="{ 'margin-right': '10px' }">
@ -79,10 +79,24 @@
</template>
</BasicTable>
</a-tab-pane>
<a-tab-pane key="6" tab="所属部门" force-render>
<BasicTable @register="registerTable4">
<template #headerCell="{ column }">
<template v-if="column.flag === 'INDEX'">
<plus-outlined :style="{ color: '#5E95FF' }" @click="handleDeptCreate" />
</template>
<template v-else>{{ column.customTitle }}</template>
</template>
<template #action="{ index }">
<a-button type="link" danger @click="handleDelete(index, 4)">删除</a-button>
</template>
</BasicTable>
</a-tab-pane>
</a-tabs>
<RoleModal @register="registerRoleModal" @success="handleRoleSuccess" />
<PostModal @register="registerPostModal" @success="handlePostSuccess" />
<OrganizationModal @register="registerOrgModal" @success="handleOrgSuccess" />
<OrganizationModal @register="registerDeptModal" @success="handleDeptSuccess" />
</BasicModal>
</template>
<script lang="ts" setup>
@ -138,7 +152,7 @@
label: t('所属机构'),
component: 'Dept',
componentProps: {
placeholder: '请选择所属机构',
placeholder: '请从所属部门进行修改',
fieldNames: {
label: 'name',
key: 'id',
@ -147,8 +161,9 @@
isArray: true,
multiple: true,
getPopupContainer: () => document.body,
disabled:true
},
required: true,
//required: true,
colProps: { span: 12 },
},
{
@ -258,6 +273,18 @@
placeholder: '请输入排序',
},
},
{
field: 'isSync',
label: '同步',
component: 'Switch',
colProps: { span: 12 },
helpMessage: '开启同步则会自动修正与域里人员组织数据一致,域里不存在的用户将被删除',
helpComponentProps: { maxWidth: '400px' },
componentProps: {
checkedValue: 'Y',
unCheckedValue: 'N',
}
},
{
label: t('备注'),
field: 'remark',
@ -426,6 +453,62 @@
align: 'left',
},
];
const deptColumns: BasicColumn[] = [
{
title: t('组织编码'),
dataIndex: 'code',
align: 'left',
width:120
},
{
title: t('组织名称'),
dataIndex: 'name',
align: 'left',
width:120
},
{
title: t('组织路径'),
dataIndex: 'hierarchy',
align: 'left',
},
{
dataIndex: 'isSync',
title: '是否同步',
width:100,
edit:true,
editComponent: 'Switch',
//editRule:false,
helpMessage: '开启同步则会自动修正与域里人员组织数据一致,域里不存在的组织和下级人员组织将被删除',
editComponentProps: {
checkedValue: 'Y',
unCheckedValue: 'N',
},
editValueMap: (value) => {
return value=='Y' ? '是' : '否';
},
},
{
dataIndex: 'isMain',
title: '是否主部门',
width:100,
edit:true,
editComponent: 'Switch',
editComponentProps: {
checkedValue: 'Y',
unCheckedValue: 'N',
},
editValueMap: (value) => {
return value=='Y' ? '是' : '否';
},
},
{
dataIndex: 'sortCode',
title: '排序',
width:120,
edit:true,
editComponent: 'InputNumber'
},
];
const emit = defineEmits(['success', 'register']);
const { notification } = useMessage();
const isUpdate = ref(true);
@ -438,6 +521,7 @@
const roleDatasource = ref<any[]>([]);
const postDatasource = ref<any[]>([]);
const orgDatasource = ref<any[]>([]);
const deptDatasource = ref<any[]>([]);
const [
registerForm1,
@ -507,17 +591,30 @@
},
});
const [registerTable4, { setTableData: setTableData4 }] = useTable({
rowKey: 'id',
dataSource: deptDatasource.value,
columns: deptColumns,
striped: false,
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
},
});
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields1();
resetFields2();
setModalProps({ confirmLoading: false, width: 800, fixedHeight: true, destroyOnClose: true });
setModalProps({ confirmLoading: false, width: 1000, fixedHeight: true, destroyOnClose: true });
activeKey.value = '1';
isUpdate.value = !!data?.isUpdate;
roleDatasource.value = [];
if (unref(isUpdate)) {
rowId.value = data.id;
const record = await getUser(data.id);
const departmentIds = record.departmentIds.split(',');
const departmentIds = record.departmentIds?.split(',')||[];
setFieldsValue1({
...record,
departmentIds,
@ -528,10 +625,12 @@
roleDatasource.value = record.roles || [];
postDatasource.value = record.posts || [];
orgDatasource.value = record.chargeDepartments || [];
deptDatasource.value = record.departments || [];
setTableData1(roleDatasource.value);
setTableData2(postDatasource.value);
setTableData3(orgDatasource.value);
setTableData4(deptDatasource.value);
}
const treeData = await getDepartmentTree();
@ -549,6 +648,7 @@
const [registerRoleModal, { openModal: openRoleModal }] = useModal();
const [registerPostModal, { openModal: openPostModal }] = useModal();
const [registerOrgModal, { openModal: openOrgModal }] = useModal();
const [registerDeptModal, { openModal: openDeptModal }] = useModal();
const getTitle = computed(() => (!unref(isUpdate) ? t('新增用户') : t('编辑用户')));
@ -588,6 +688,11 @@
orgs: orgDatasource.value,
});
};
const handleDeptCreate = () => {
openDeptModal(true, {
orgs: deptDatasource.value,
});
};
const handleDelete = (index, type) => {
switch (type) {
case 1:
@ -599,6 +704,9 @@
case 3:
orgDatasource.value.splice(index, 1);
break;
case 4:
deptDatasource.value.splice(index, 1);
break;
}
};
@ -614,6 +722,20 @@
orgDatasource.value = data;
setTableData3(orgDatasource.value);
};
const handleDeptSuccess = (data) => {
//重复的保留列表中的值
data.forEach(item=>{
const exitsItem=deptDatasource.value.find(x=>x.id==item.id);
if(exitsItem){
item.hierarchy=exitsItem.hierarchy;
item.isMain=exitsItem.isMain;
item.isSync=exitsItem.isSync;
item.sortCode=exitsItem.sortCode;
}
});
deptDatasource.value = data;
setTableData4(deptDatasource.value);
};
async function handleSubmit() {
try {
const values = await validate1();
@ -621,13 +743,15 @@
const roleIds = roleDatasource.value?.map((x) => x.id);
const postIds = postDatasource.value?.map((x) => x.id);
const chargeDepartmentIds = orgDatasource.value?.map((x) => x.id);
const departments=deptDatasource.value;
const data = {
...values,
...values2,
departmentIds: values.departmentIds.toString(),
departmentIds: values.departmentIds?.toString(),
roleIds,
postIds,
chargeDepartmentIds,
departments
};
setModalProps({ confirmLoading: true });