yixr
/
localhost_oa_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 项目模块和表单校验的bug修复

This commit is contained in:
louis 2024-03-07 11:11:01 +08:00
parent 8bcae5be3f
commit 7c6ead4c66
14 changed files with 484 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,8 @@
{
"typescript.tsdk": "node_modules\\typescript\\lib",
"i18n-ally.localesPaths": [
"src/locales",
"src/locales/lang",
"src/components/basic/tinymce/langs"
]
}

2
src/api/backend/api/index.ts
View File

@ -27,6 +27,7 @@ import * as netDiskOverview from './netDiskOverview';
import * as businessTodo from './businessTodo';
import * as contract from './contract';
import * as materialsInventory from './materialsInventory';
import * as project from './project';
import * as company from './company';
import * as product from './product';
import * as materialsInOut from './materialsInOut';
@ -59,4 +60,5 @@ export default {
company,
product,
materialsInOut,
project,
};

104
src/api/backend/api/project.ts Normal file
View File

@ -0,0 +1,104 @@
import { request, type RequestOptions } from '@/utils/request';
/** 获取项目列表 GET /api/project */
export async function projectList(params: API.ProjectParams, options?: RequestOptions) {
return request<{
items?: API.ProjectEntity[];
meta?: {
itemCount?: number;
totalItems?: number;
itemsPerPage?: number;
totalPages?: number;
currentPage?: number;
};
}>('/api/project', {
method: 'GET',
params: {
// page has a default value: 1
page: '1',
// pageSize has a default value: 10
pageSize: '10',
...params,
},
...(options || {}),
});
}
/** 新增项目 POST /api/project */
export async function projectCreate(body: API.ProjectDto, options?: RequestOptions) {
return request<any>('/api/project', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
data: body,
...(options || { successMsg: '创建成功' }),
});
}
/** 获取项目信息 GET /api/project/${param0} */
export async function projectInfo(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.ProjectInfoParams,
options?: RequestOptions,
) {
const { id: param0, ...queryParams } = params;
return request<API.ProjectEntity>(`/api/project/${param0}`, {
method: 'GET',
params: { ...queryParams },
...(options || {}),
});
}
/** 解除项目和附件关联 PUT /api/project/unlink-attachments/${param0} */
export async function unlinkAttachments(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.ProjectUpdateParams,
body: API.ProjectUpdateDto,
options?: RequestOptions,
) {
const { id: param0, ...queryParams } = params;
return request<any>(`/api/project/unlink-attachments/${param0}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
params: { ...queryParams },
data: body,
...options,
});
}
/** 更新项目 PUT /api/project/${param0} */
export async function projectUpdate(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.ProjectUpdateParams,
body: API.ProjectUpdateDto,
options?: RequestOptions,
) {
const { id: param0, ...queryParams } = params;
return request<any>(`/api/project/${param0}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
params: { ...queryParams },
data: body,
...(options || { successMsg: '更新成功' }),
});
}
/** 删除项目 DELETE /api/project/${param0} */
export async function projectDelete(
// 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
params: API.ProjectDeleteParams,
options?: RequestOptions,
) {
const { id: param0, ...queryParams } = params;
return request<any>(`/api/project/${param0}`, {
method: 'DELETE',
params: { ...queryParams },
...(options || { successMsg: '删除成功' }),
});
}

54
src/api/backend/api/typings.d.ts vendored
View File

@ -1413,7 +1413,7 @@ declare namespace API {
/** 领料单号 */
issuanceNumber?: number;
/** 项目 */
project: string;
project: ProjectEntity;
/** 备注 */
remark: string;
/** 附件 */
@ -1513,6 +1513,49 @@ declare namespace API {
type MaterialsInventoryDeleteParams = {
id: number;
};
// Project
type ProjectEntity = {
/** 项目名称 */
name: string;
/** 是否删除 */
isDelete: string;
/** 附件 */
files?: StorageInfo[];
id: number;
createdAt: string;
updatedAt: string;
};
type ProjectDto = {
/** 项目名称 */
name: string;
fileIds?: number[];
};
type ProjectUpdateParams = {
id: number;
};
type ProjectParams = {
page?: number;
pageSize?: number;
name?: string;
productId?: number;
field?: string;
order?: 'ASC' | 'DESC';
_t?: number;
};
type ProjectInfoParams = {
id: number;
};
type ProjectUpdateDto = {
/** 项目名称 */
name?: string;
/** 附件 */
fileIds?: number[];
};
type ProjectDeleteParams = {
id: number;
};
// Company
type CompanyEntity = {
/** 公司名称 */
@ -1624,6 +1667,7 @@ declare namespace API {
time?: string;
inventoryNumber?: string;
isCreateOut?: boolean;
project?:string;
field?: string;
order?: 'ASC' | 'DESC';
_t?: number;
@ -1655,7 +1699,9 @@ declare namespace API {
/** 领料单号 */
issuanceNumber?: number;
/** 项目 */
project: string;
project: ProjectEntity;
/** 项目ID */
projectId?:number;
/** 备注 */
remark: string;
/** 附件 */
@ -1685,7 +1731,7 @@ declare namespace API {
/** 领料单号 */
issuanceNumber?: number;
/** 项目 */
project?: string;
projectId?: number;
/** 备注 */
remark?: string;
/** 附件 */
@ -1709,7 +1755,7 @@ declare namespace API {
/** 领料单号 */
issuanceNumber?: number;
/** 项目 */
project?: string;
projectId?:number;
/** 备注 */
remark?: string;
/** 附件 */

4
src/components/core/schema-form/src/hooks/useFormEvents.ts
View File

@ -6,7 +6,7 @@ import type { UnwrapFormSchema } from '../types/form';
import type { NamePath } from 'ant-design-vue/lib/form/interface';
import type { FormState, FormMethods } from './index';
import type { SchemaFormEmitFn } from '../schema-form';
import { isArray, isFunction, isObject, isString } from '@/utils/is';
import { isArray, isEmpty, isFunction, isObject, isString } from '@/utils/is';
import { deepMerge } from '@/utils';
type UseFormActionContext = FormState & {
@ -250,10 +250,12 @@ export function useFormEvents(formActionContext: UseFormActionContext) {
}
async function validateFields(nameList?: NamePath[] | undefined) {
if (isEmpty(nameList)) return {};
return schemaFormRef.value?.validateFields(nameList);
}
async function validate(nameList?: NamePath[] | undefined) {
if (isEmpty(nameList)) return {};
return await schemaFormRef.value?.validate(nameList)!;
}

23
src/components/core/schema-form/src/schema-form-item.vue
View File

@ -238,28 +238,34 @@
/**
* @description 表单组件props
*/
const getComponentProps = computed(() => {
const getComponentProps = computed<ComponentProps>(() => {
const { schema } = props;
let { componentProps = {}, component } = schema;
let finalComponentProps: ComponentProps = {};
if (isFunction(componentProps)) {
componentProps = componentProps(unref(getValues)) ?? {};
finalComponentProps = { ...(componentProps(unref(getValues)) ?? {}) };
} else {
finalComponentProps = { ...componentProps };
}
if (component !== 'RangePicker' && isString(component)) {
componentProps.placeholder ??= createPlaceholderMessage(component, getLabel.value);
finalComponentProps = {
...finalComponentProps,
placeholder:
finalComponentProps.placeholder ?? createPlaceholderMessage(component, getLabel.value),
};
}
if (schema.component === 'Divider') {
componentProps = Object.assign({ type: 'horizontal' }, componentProps, {
finalComponentProps = Object.assign({ type: 'horizontal' }, finalComponentProps, {
orientation: 'left',
plain: true,
});
}
if (isVNode(getComponent.value)) {
Object.assign(componentProps, getComponent.value.props);
finalComponentProps = Object.assign({}, finalComponentProps, getComponent.value.props);
}
return componentProps;
return finalComponentProps;
});
/**
@ -408,8 +414,8 @@
options: [],
} as ComponentProps,
});
// const componentProps = newSchema.componentProps as ComponentProps;
updateSchema(newSchema);
//会报表单校验的错误;
// @ts-ignore
const result = await request({ ...unref(getValues), schema: newSchema });
if (['Select', 'RadioGroup', 'CheckBoxGroup'].some((n) => n === component)) {
@ -443,6 +449,7 @@
}, wait),
{
...options,
// immediate: false,
},
);
}

9
src/permission/permCode.ts
View File

@ -90,9 +90,16 @@ const permissions = [
'app:product:create',
'app:product:update',
'app:product:delete',
'materials_inventory:history_in_out:export'
'materials_inventory:history_in_out:export',
'app:materials_inventory:list',
'app:project:list',
'app:project:create',
'app:project:update',
'app:project:delete',
'app:project:read',
] as const;
export type PermissionType = string;
// export type PermissionType = (typeof permissions)[number]; 目前添加这个类型判断会影响vscode的性能，暂时注释掉
// console.log('permissions', permissions);

14
src/views/materials-inventory/in-out/columns.tsx
View File

@ -19,6 +19,14 @@ export const baseColumns: TableColumnItem[] = [
labelWidth: 120,
},
},
{
title: '项目',
width: 80,
dataIndex: 'project',
customRender: ({ record }) => {
return record?.project?.name || '';
},
},
{
title: '所属公司',
width: 100,
@ -113,11 +121,7 @@ export const baseColumns: TableColumnItem[] = [
width: 80,
dataIndex: 'issuanceNumber',
},
{
title: '项目',
width: 80,
dataIndex: 'project',
},
{
title: '备注',
width: 80,

65
src/views/materials-inventory/in-out/formSchemas.ts
View File

@ -134,6 +134,52 @@ export const formSchemas = (isEdit?: boolean): FormSchema<API.MaterialsInOutEnti
}, 500),
}),
},
{
field: 'projectId',
component: 'Select',
label: '项目',
colProps: {
span: 12,
},
helpMessage: '如未找到对应项目，请先去项目管理添加项目。',
componentProps: ({ formInstance, schema, formModel }) => ({
showSearch: true,
filterOption: false,
fieldNames: {
label: 'label',
value: 'value',
},
getPopupContainer: () => document.body,
defaultActiveFirstOption: true,
onClear: async () => {
const newSchema = {
field: schema.field,
componentProps: {
options: [] as LabelValueOptions,
},
};
const options = await getProjectOptions().finally(() => (schema.loading = false));
newSchema.componentProps.options = options;
formInstance?.updateSchema([newSchema]);
},
request: () => {
return getProjectOptions();
},
onSearch: debounce(async (keyword) => {
schema.loading = true;
const newSchema = {
field: schema.field,
componentProps: {
options: [] as LabelValueOptions,
},
};
formInstance?.updateSchema([newSchema]);
const options = await getProjectOptions(keyword).finally(() => (schema.loading = false));
newSchema.componentProps.options = options;
formInstance?.updateSchema([newSchema]);
}, 500),
}),
},
{
label: '时间',
field: 'time',
@ -183,14 +229,7 @@ export const formSchemas = (isEdit?: boolean): FormSchema<API.MaterialsInOutEnti
span: 12,
},
},
{
label: '项目',
field: 'project',
component: 'Input',
colProps: {
span: 12,
},
},
{
label: '备注',
field: 'remark',
@ -198,6 +237,16 @@ export const formSchemas = (isEdit?: boolean): FormSchema<API.MaterialsInOutEnti
},
];
const getProjectOptions = async (keyword?: string): Promise<LabelValueOptions> => {
const { items: result } = await Api.project.projectList({ pageSize: 100, name: keyword });
return (
result?.map((item) => ({
label: `${item.name}`,
value: item.id,
})) || []
);
};
const getProductOptions = async (keyword?: string): Promise<LabelValueOptions> => {
const { items: result } = await Api.product.productList({ pageSize: 100, name: keyword });
return (

1
src/views/materials-inventory/in-out/index.vue
View File

@ -153,7 +153,6 @@
const openEditModal = async (record: Partial<TableListItem>) => {
const [formRef] = await showModal({
modalProps: {
title: `${record.id ? '编辑' : '新增'}出入库记录`,
width: '50%',
onFinish: async (values) => {

3
src/views/materials-inventory/product/formSchemas.ts
View File

@ -18,6 +18,9 @@ export const formSchemas: FormSchema<API.ProductDto>[] = [
label: '单位',
component: 'Select',
field: 'unitId',
colProps: {
span: 12,
},
componentProps: ({ formInstance, schema, formModel }) => ({
showSearch: true,
filterOption: (input: string, option: any) => {

10
src/views/materials-inventory/project/columns.tsx Normal file
View File

@ -0,0 +1,10 @@
import type { TableColumn } from '@/components/core/dynamic-table';
export type TableListItem = API.ProjectEntity;
export type TableColumnItem = TableColumn<TableListItem>;
export const baseColumns: TableColumnItem[] = [
{
title: '项目名称',
dataIndex: 'name',
},
];

12
src/views/materials-inventory/project/formSchemas.ts Normal file
View File

@ -0,0 +1,12 @@
import type { FormSchema } from '@/components/core/schema-form/';
export const formSchemas: FormSchema<API.ProjectEntity>[] = [
{
field: 'name',
component: 'Input',
label: '项目名称',
rules: [{ required: true, type: 'string' }],
colProps: {
span: 12,
},
},
];

201
src/views/materials-inventory/project/index.vue Normal file
View File

@ -0,0 +1,201 @@
<template>
<div v-if="columns?.length">
<DynamicTable
row-key="id"
header-title="项目管理"
title-tooltip=""
:data-request="Api.project.projectList"
:columns="columns"
bordered
size="small"
>
<template #toolbar>
<a-button
type="primary"
:disabled="!$auth('system:role:create')"
@click="openEditModal({})"
>
新增
</a-button>
</template>
</DynamicTable>
</div>
</template>
<script setup lang="tsx">
import { useTable } from '@/components/core/dynamic-table';
import { baseColumns, type TableColumnItem, type TableListItem } from './columns';
import Api from '@/api/';
import { useFormModal, useModal } from '@/hooks/useModal';
import { formSchemas } from './formSchemas';
import { Button } from 'ant-design-vue';
import AttachmentManage from '@/components/business/attachment-manage/index.vue';
import AttachmentUpload from '@/components/business/attachment-upload/index.vue';
import { ref, onMounted, type FunctionalComponent } from 'vue';
import { useDictStore } from '@/store/modules/dict';
defineOptions({
name: 'Project',
});
const [DynamicTable, dynamicTableInstance] = useTable();
const [showModal] = useFormModal();
const [fnModal] = useModal();
const isUploadPopupVisiable = ref(false);
const dictStore = useDictStore();
// projectList;
let columns = ref<TableColumnItem[]>();
onMounted(() => {
columns.value = [
...baseColumns,
{
title: '附件',
width: 50,
maxWidth: 50,
hideInSearch: true,
dataIndex: 'files',
customRender: ({ record }) => <FilesRender {...record} />,
},
{
title: '操作',
maxWidth: 150,
width: 150,
minWidth: 150,
fixed:'right',
dataIndex: 'ACTION',
hideInSearch: true,
actions: ({ record }) => [
{
icon: 'ant-design:edit-outlined',
tooltip: '编辑',
auth: {
perm: 'app:project:update',
effect: 'disable',
},
onClick: () => openEditModal(record),
},
{
icon: 'ant-design:delete-outlined',
color: 'red',
tooltip: '删除此项目',
auth: 'app:project:delete',
popConfirm: {
title: '你确定要删除吗？',
placement: 'left',
onConfirm: () => delRowConfirm(record.id),
},
},
{
icon: 'ant-design:cloud-upload-outlined',
tooltip: '上传附件',
onClick: () => openAttachmentUploadModal(record),
},
],
},
];
});
const openAttachmentUploadModal = async (record: TableListItem) => {
isUploadPopupVisiable.value = true;
fnModal.show({
width: 800,
title: `项目: ${record.name}`,
content: () => {
return (
<AttachmentUpload
onClose={handleUploadClose}
afterUploadCallback={(files) => {
afterUploadCallback(files, record.id);
}}
></AttachmentUpload>
);
},
destroyOnClose: true,
open: isUploadPopupVisiable.value,
footer: null,
});
};
const handleUploadClose = (hasSuccess: boolean) => {
fnModal.hide();
isUploadPopupVisiable.value = false;
};
const afterUploadCallback = async (
files: { filename: { path: string; id: number } }[],
id: number,
) => {
await Api.project.projectUpdate({ id }, { fileIds: files.map((item) => item.filename.id) });
dynamicTableInstance?.reload();
};
/**
* @description 打开新增/编辑弹窗
*/
const openEditModal = async (record: Partial<TableListItem>) => {
const [formRef] = await showModal({
modalProps: {
title: `${record.id ? '编辑' : '新增'}项目`,
width: '50%',
onFinish: async (values) => {
if (record.id) {
await Api.project.projectUpdate({ id: record.id }, values);
} else {
await Api.project.projectCreate(values);
}
dynamicTableInstance?.reload();
},
},
formProps: {
labelWidth: 100,
schemas: formSchemas,
},
});
// 如果是编辑的话，需要获取角色详情
if (record.id) {
const info = await Api.project.projectInfo({ id: record.id });
formRef?.setFieldsValue({
...info,
});
}
};
const delRowConfirm = async (record) => {
await Api.project.projectDelete({ id: record });
dynamicTableInstance?.reload();
};
const FilesRender: FunctionalComponent<TableListItem> = (project: TableListItem) => {
const [fnModal] = useModal();
return (
<Button
type="link"
onClick={() => {
openFilesManageModal(fnModal, project);
}}
>
{project.files?.length || 0}
</Button>
);
};
const openFilesManageModal = (fnModal, project: TableListItem) => {
const fileIds = project.files?.map((item) => item.id) || [];
fnModal.show({
width: 1200,
title: `附件管理`,
content: () => {
return (
<AttachmentManage
fileIds={fileIds}
onDelete={(unlinkIds) => unlinkAttachments(project.id, unlinkIds)}
></AttachmentManage>
);
},
destroyOnClose: true,
footer: null,
});
};
const unlinkAttachments = async (id: number, unlinkIds: number[]) => {
await Api.project.unlinkAttachments({ id }, { fileIds: unlinkIds });
dynamicTableInstance?.reload();
};
</script>
<style lang="less" scoped></style>