diff --git a/apps/web-antd/src/api/infra/demo/demo03/erp/index.ts b/apps/web-antd/src/api/infra/demo/demo03/erp/index.ts new file mode 100644 index 000000000..a77d78c3f --- /dev/null +++ b/apps/web-antd/src/api/infra/demo/demo03/erp/index.ts @@ -0,0 +1,116 @@ +import type { PageParam, PageResult } from '@vben/request'; + +import { requestClient } from '#/api/request'; + +export namespace Demo03StudentApi { + /** 学生课程信息 */ + export interface Demo03Course { + id: number; // 编号 + studentId?: number; // 学生编号 + name?: string; // 名字 + score?: number; // 分数 + } + + /** 学生班级信息 */ + export interface Demo03Grade { + id: number; // 编号 + studentId?: number; // 学生编号 + name?: string; // 名字 + teacher?: string; // 班主任 + } + + /** 学生信息 */ + export interface Demo03Student { + id: number; // 编号 + name?: string; // 名字 + sex?: number; // 性别 + birthday?: Date; // 出生日期 + description?: string; // 简介 + } +} + +/** 查询学生分页 */ +export function getDemo03StudentPage(params: PageParam) { + return requestClient.get>('/infra/demo03-student/page', { params }); +} + +/** 查询学生详情 */ +export function getDemo03Student(id: number) { + return requestClient.get(`/infra/demo03-student/get?id=${id}`); +} + +/** 新增学生 */ +export function createDemo03Student(data: Demo03StudentApi.Demo03Student) { + return requestClient.post('/infra/demo03-student/create', data); +} + +/** 修改学生 */ +export function updateDemo03Student(data: Demo03StudentApi.Demo03Student) { + return requestClient.put('/infra/demo03-student/update', data); +} + +/** 删除学生 */ +export function deleteDemo03Student(id: number) { + return requestClient.delete(`/infra/demo03-student/delete?id=${id}`); +} + +/** 导出学生 */ +export function exportDemo03Student(params: any) { + return requestClient.download('/infra/demo03-student/export-excel', params); +} + +// ==================== 子表(学生课程) ==================== + +/** 获得学生课程分页 */ +export function getDemo03CoursePage(params: PageParam) { + return requestClient.get>(`/infra/demo03-student/demo03-course/page`, { + params, + }); +} +/** 新增学生课程 */ +export function createDemo03Course(data: Demo03StudentApi.Demo03Course) { + return requestClient.post(`/infra/demo03-student/demo03-course/create`, data); +} + +/** 修改学生课程 */ +export function updateDemo03Course(data: Demo03StudentApi.Demo03Course) { + return requestClient.put(`/infra/demo03-student/demo03-course/update`, data); +} + +/** 删除学生课程 */ +export function deleteDemo03Course(id: number) { + return requestClient.delete(`/infra/demo03-student/demo03-course/delete?id=${id}`); +} + +/** 获得学生课程 */ +export function getDemo03Course(id: number) { + return requestClient.get(`/infra/demo03-student/demo03-course/get?id=${id}`); +} + +// ==================== 子表(学生班级) ==================== + +/** 获得学生班级分页 */ +export function getDemo03GradePage(params: PageParam) { + return requestClient.get>(`/infra/demo03-student/demo03-grade/page`, { + params, + }); +} +/** 新增学生班级 */ +export function createDemo03Grade(data: Demo03StudentApi.Demo03Grade) { + return requestClient.post(`/infra/demo03-student/demo03-grade/create`, data); +} + +/** 修改学生班级 */ +export function updateDemo03Grade(data: Demo03StudentApi.Demo03Grade) { + return requestClient.put(`/infra/demo03-student/demo03-grade/update`, data); +} + +/** 删除学生班级 */ +export function deleteDemo03Grade(id: number) { + return requestClient.delete(`/infra/demo03-student/demo03-grade/delete?id=${id}`); +} + +/** 获得学生班级 */ +export function getDemo03Grade(id: number) { + return requestClient.get(`/infra/demo03-student/demo03-grade/get?id=${id}`); +} diff --git a/apps/web-antd/src/api/infra/demo/demo03/normal/index.ts b/apps/web-antd/src/api/infra/demo/demo03/normal/index.ts index 85352c516..08dae5165 100644 --- a/apps/web-antd/src/api/infra/demo/demo03/normal/index.ts +++ b/apps/web-antd/src/api/infra/demo/demo03/normal/index.ts @@ -10,6 +10,7 @@ export namespace Demo03StudentApi { name?: string; // 名字 score?: number; // 分数 } + /** 学生班级信息 */ export interface Demo03Grade { id: number; // 编号 @@ -17,6 +18,7 @@ export namespace Demo03StudentApi { name?: string; // 名字 teacher?: string; // 班主任 } + /** 学生信息 */ export interface Demo03Student { id: number; // 编号 @@ -60,6 +62,7 @@ export function exportDemo03Student(params: any) { } // ==================== 子表(学生课程) ==================== + /** 获得学生课程列表 */ export function getDemo03CourseListByStudentId(studentId: number) { return requestClient.get( @@ -68,6 +71,7 @@ export function getDemo03CourseListByStudentId(studentId: number) { } // ==================== 子表(学生班级) ==================== + /** 获得学生班级 */ export function getDemo03GradeByStudentId(studentId: number) { return requestClient.get( diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/data.ts b/apps/web-antd/src/views/infra/demo/demo03/erp/data.ts new file mode 100644 index 000000000..deb4855ea --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/data.ts @@ -0,0 +1,450 @@ +import type { VbenFormSchema } from '#/adapter/form'; +import type { OnActionClickFn } from '#/adapter/vxe-table'; +import type { Demo03StudentApi } from '#/api/infra/demo/demo03/erp'; +import type { VxeTableGridOptions } from '@vben/plugins/vxe-table'; + +import { getRangePickerDefaultProps } from '#/utils/date'; +import { DICT_TYPE, getDictOptions } from '#/utils/dict'; + +import { useAccess } from '@vben/access'; + +const { hasAccessByCodes } = useAccess(); + +/** 新增/修改的表单 */ +export function useFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'id', + component: 'Input', + dependencies: { + triggerFields: [''], + show: () => false, + }, + }, + { + fieldName: 'name', + label: '名字', + rules: 'required', + component: 'Input', + componentProps: { + placeholder: '请输入名字', + }, + }, + { + fieldName: 'sex', + label: '性别', + rules: 'required', + component: 'RadioGroup', + componentProps: { + options: getDictOptions(DICT_TYPE.SYSTEM_USER_SEX, 'number'), + buttonStyle: 'solid', + optionType: 'button', + }, + }, + { + fieldName: 'birthday', + label: '出生日期', + rules: 'required', + component: 'DatePicker', + componentProps: { + showTime: true, + format: 'YYYY-MM-DD HH:mm:ss', + valueFormat: 'x', + }, + }, + { + fieldName: 'description', + label: '简介', + rules: 'required', + component: 'RichTextarea', + }, + ]; +} + +/** 列表的搜索表单 */ +export function useGridFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'name', + label: '名字', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入名字', + }, + }, + { + fieldName: 'sex', + label: '性别', + component: 'Select', + componentProps: { + allowClear: true, + options: getDictOptions(DICT_TYPE.SYSTEM_USER_SEX, 'number'), + placeholder: '请选择性别', + }, + }, + { + fieldName: 'description', + label: '简介', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入简介', + }, + }, + { + fieldName: 'createTime', + label: '创建时间', + component: 'RangePicker', + componentProps: { + ...getRangePickerDefaultProps(), + allowClear: true, + }, + }, + ]; +} + +/** 列表的字段 */ +export function useGridColumns( + onActionClick?: OnActionClickFn, +): VxeTableGridOptions['columns'] { + return [ + { + field: 'id', + title: '编号', + minWidth: 120, + }, + { + field: 'name', + title: '名字', + minWidth: 120, + }, + { + field: 'sex', + title: '性别', + minWidth: 120, + cellRender: { + name: 'CellDict', + props: { type: DICT_TYPE.SYSTEM_USER_SEX }, + }, + }, + { + field: 'birthday', + title: '出生日期', + minWidth: 120, + formatter: 'formatDateTime', + }, + { + field: 'description', + title: '简介', + minWidth: 120, + }, + { + field: 'createTime', + title: '创建时间', + minWidth: 120, + formatter: 'formatDateTime', + }, + { + field: 'operation', + title: '操作', + minWidth: 200, + align: 'center', + fixed: 'right', + headerAlign: 'center', + showOverflow: false, + cellRender: { + attrs: { + nameField: 'id', + nameTitle: '学生', + onClick: onActionClick, + }, + name: 'CellOperation', + options: [ + { + code: 'edit', + show: hasAccessByCodes(['infra:demo03-student:update']), + }, + { + code: 'delete', + show: hasAccessByCodes(['infra:demo03-student:delete']), + }, + ], + }, + }, + ]; +} + +// ==================== 子表(学生课程) ==================== + +/** 新增/修改的表单 */ +export function useDemo03CourseFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'id', + component: 'Input', + dependencies: { + triggerFields: [''], + show: () => false, + }, + }, + { + fieldName: 'name', + label: '名字', + rules: 'required', + component: 'Input', + componentProps: { + placeholder: '请输入名字', + }, + }, + { + fieldName: 'score', + label: '分数', + rules: 'required', + component: 'Input', + componentProps: { + placeholder: '请输入分数', + }, + }, + ]; +} + +/** 列表的搜索表单 */ +export function useDemo03CourseGridFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'studentId', + label: '学生编号', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入学生编号', + }, + }, + { + fieldName: 'name', + label: '名字', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入名字', + }, + }, + { + fieldName: 'score', + label: '分数', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入分数', + }, + }, + { + fieldName: 'createTime', + label: '创建时间', + component: 'RangePicker', + componentProps: { + ...getRangePickerDefaultProps(), + allowClear: true, + }, + }, + ]; +} + +/** 列表的字段 */ +export function useDemo03CourseGridColumns( + onActionClick?: OnActionClickFn, +): VxeTableGridOptions['columns'] { + return [ + { + field: 'id', + title: '编号', + minWidth: 120, + }, + { + field: 'studentId', + title: '学生编号', + minWidth: 120, + }, + { + field: 'name', + title: '名字', + minWidth: 120, + }, + { + field: 'score', + title: '分数', + minWidth: 120, + }, + { + field: 'createTime', + title: '创建时间', + minWidth: 120, + formatter: 'formatDateTime', + }, + { + field: 'operation', + title: '操作', + minWidth: 200, + align: 'center', + fixed: 'right', + headerAlign: 'center', + showOverflow: false, + cellRender: { + attrs: { + nameField: 'id', + nameTitle: '学生课程', + onClick: onActionClick, + }, + name: 'CellOperation', + options: [ + { + code: 'edit', + show: hasAccessByCodes(['infra:demo03-student:update']), + }, + { + code: 'delete', + show: hasAccessByCodes(['infra:demo03-student:delete']), + }, + ], + }, + }, + ]; +} + +// ==================== 子表(学生班级) ==================== + +/** 新增/修改的表单 */ +export function useDemo03GradeFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'id', + component: 'Input', + dependencies: { + triggerFields: [''], + show: () => false, + }, + }, + { + fieldName: 'name', + label: '名字', + rules: 'required', + component: 'Input', + componentProps: { + placeholder: '请输入名字', + }, + }, + { + fieldName: 'teacher', + label: '班主任', + rules: 'required', + component: 'Input', + componentProps: { + placeholder: '请输入班主任', + }, + }, + ]; +} + +/** 列表的搜索表单 */ +export function useDemo03GradeGridFormSchema(): VbenFormSchema[] { + return [ + { + fieldName: 'studentId', + label: '学生编号', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入学生编号', + }, + }, + { + fieldName: 'name', + label: '名字', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入名字', + }, + }, + { + fieldName: 'teacher', + label: '班主任', + component: 'Input', + componentProps: { + allowClear: true, + placeholder: '请输入班主任', + }, + }, + { + fieldName: 'createTime', + label: '创建时间', + component: 'RangePicker', + componentProps: { + ...getRangePickerDefaultProps(), + allowClear: true, + }, + }, + ]; +} + +/** 列表的字段 */ +export function useDemo03GradeGridColumns( + onActionClick?: OnActionClickFn, +): VxeTableGridOptions['columns'] { + return [ + { + field: 'id', + title: '编号', + minWidth: 120, + }, + { + field: 'studentId', + title: '学生编号', + minWidth: 120, + }, + { + field: 'name', + title: '名字', + minWidth: 120, + }, + { + field: 'teacher', + title: '班主任', + minWidth: 120, + }, + { + field: 'createTime', + title: '创建时间', + minWidth: 120, + formatter: 'formatDateTime', + }, + { + field: 'operation', + title: '操作', + minWidth: 200, + align: 'center', + fixed: 'right', + headerAlign: 'center', + showOverflow: false, + cellRender: { + attrs: { + nameField: 'id', + nameTitle: '学生班级', + onClick: onActionClick, + }, + name: 'CellOperation', + options: [ + { + code: 'edit', + show: hasAccessByCodes(['infra:demo03-student:update']), + }, + { + code: 'delete', + show: hasAccessByCodes(['infra:demo03-student:delete']), + }, + ], + }, + }, + ]; +} diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/index.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/index.vue new file mode 100644 index 000000000..497fcf59d --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/index.vue @@ -0,0 +1,155 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-form.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-form.vue new file mode 100644 index 000000000..ac475d75c --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-form.vue @@ -0,0 +1,80 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-list.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-list.vue new file mode 100644 index 000000000..86f11f31a --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-course-list.vue @@ -0,0 +1,137 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-form.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-form.vue new file mode 100644 index 000000000..89b4c4899 --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-form.vue @@ -0,0 +1,80 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-list.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-list.vue new file mode 100644 index 000000000..1d6468e78 --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/demo03-grade-list.vue @@ -0,0 +1,137 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/erp/modules/form.vue b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/form.vue new file mode 100644 index 000000000..a0bab233d --- /dev/null +++ b/apps/web-antd/src/views/infra/demo/demo03/erp/modules/form.vue @@ -0,0 +1,78 @@ + + + diff --git a/apps/web-antd/src/views/infra/demo/demo03/inner/data.ts b/apps/web-antd/src/views/infra/demo/demo03/inner/data.ts index 6d522d4d3..f46b47192 100644 --- a/apps/web-antd/src/views/infra/demo/demo03/inner/data.ts +++ b/apps/web-antd/src/views/infra/demo/demo03/inner/data.ts @@ -56,10 +56,7 @@ export function useFormSchema(): VbenFormSchema[] { fieldName: 'description', label: '简介', rules: 'required', - component: 'Textarea', - componentProps: { - placeholder: '请输入简介', - }, + component: 'RichTextarea', }, ]; } @@ -180,7 +177,8 @@ export function useGridColumns( } // ==================== 子表(学生课程) ==================== -/** 新增/修改列表的字段 */ // TODO @puhui999: ==== 下面空一行; + +/** 新增/修改列表的字段 */ export function useDemo03CourseGridEditColumns( onActionClick?: OnActionClickFn, ): VxeTableGridOptions['columns'] { @@ -222,7 +220,8 @@ export function useDemo03CourseGridEditColumns( }, ]; } -/** 列表的字段 */ // TODO @puhui999:这里空一行; + +/** 列表的字段 */ export function useDemo03CourseGridColumns(): VxeTableGridOptions['columns'] { return [ { @@ -253,7 +252,9 @@ export function useDemo03CourseGridColumns(): VxeTableGridOptions['columns'] { return [ diff --git a/apps/web-antd/src/views/infra/demo/demo03/inner/index.vue b/apps/web-antd/src/views/infra/demo/demo03/inner/index.vue index 80ecec9d5..d9a076929 100644 --- a/apps/web-antd/src/views/infra/demo/demo03/inner/index.vue +++ b/apps/web-antd/src/views/infra/demo/demo03/inner/index.vue @@ -2,8 +2,8 @@ import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table'; import type { Demo03StudentApi } from '#/api/infra/demo/demo03/inner'; -import Demo03CourseList from './modules/Demo03CourseList.vue'; -import Demo03GradeList from './modules/Demo03GradeList.vue'; +import Demo03CourseList from './modules/demo03-course-list.vue'; +import Demo03GradeList from './modules/demo03-grade-list.vue'; import Form from './modules/form.vue'; import { Page, useVbenModal } from '@vben/common-ui'; import { Download, Plus } from '@vben/icons'; @@ -30,12 +30,6 @@ function onRefresh() { gridApi.reload(); } -/** 导出表格 */ -async function onExport() { - const data = await exportDemo03Student(await gridApi.formApi.getValues()); - downloadByData(data, '学生.xls'); -} - /** 创建学生 */ function onCreate() { formModalApi.setData({}).open(); @@ -65,17 +59,23 @@ async function onDelete(row: Demo03StudentApi.Demo03Student) { } } +/** 导出表格 */ +async function onExport() { + const data = await exportDemo03Student(await gridApi.formApi.getValues()); + downloadByData(data, '学生.xls'); +} + /** 表格操作按钮的回调函数 */ function onActionClick({ code, row }: OnActionClickParams) { switch (code) { - case 'delete': { - onDelete(row); - break; - } case 'edit': { onEdit(row); break; } + case 'delete': { + onDelete(row); + break; + } } } @@ -119,8 +119,7 @@ const [Grid, gridApi] = useVbenVxeGrid({