yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

reactor：【infra 基础设施】fileConfig 进一步统一代码风格

pull/210/head
YunaiV 2025-09-09 09:06:42 +08:00
parent 6bb4005ae0
commit b52f7803ad
4 changed files with 99 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
apps/web-antd/src/views/infra/fileConfig/data.ts
View File

@ -40,6 +40,14 @@ export function useFormSchema(): VbenFormSchema[] {
show: (formValues) => !formValues.id,
},
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
},
},
// DB / Local / FTP / SFTP
{
fieldName: 'config.basePath',
@ -236,14 +244,6 @@ export function useFormSchema(): VbenFormSchema[] {
show: (formValues) => !!formValues.storage,
},
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
},
},
];
}
@ -288,14 +288,17 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'id',
title: '编号',
minWidth: 100,
},
{
field: 'name',
title: '配置名',
minWidth: 120,
},
{
field: 'storage',
title: '存储器',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_FILE_STORAGE },
@ -304,10 +307,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'remark',
title: '备注',
minWidth: 150,
},
{
field: 'master',
title: '主配置',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
@ -316,6 +321,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{

58
apps/web-ele/src/views/infra/fileConfig/data.ts
View File

@ -1,16 +1,11 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { InfraFileConfigApi } from '#/api/infra/file-config';
import { useAccess } from '@vben/access';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks';
import { getRangePickerDefaultProps } from '#/utils';
const { hasAccessByCodes } = useAccess();
/** 新增/修改的表单 */
export function useFormSchema(): VbenFormSchema[] {
return [
@ -261,7 +256,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
component: 'Input',
componentProps: {
placeholder: '请输入配置名',
clearable: true,
allowClear: true,
},
},
{
@ -271,7 +266,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
componentProps: {
options: getDictOptions(DICT_TYPE.INFRA_FILE_STORAGE, 'number'),
placeholder: '请选择存储器',
clearable: true,
allowClear: true,
},
},
{
@ -280,22 +275,20 @@ export function useGridFormSchema(): VbenFormSchema[] {
component: 'RangePicker',
componentProps: {
...getRangePickerDefaultProps(),
clearable: true,
allowClear: true,
},
},
];
}
/** 列表的字段 */
export function useGridColumns<T = InfraFileConfigApi.FileConfig>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
export function useGridColumns(): VxeTableGridOptions['columns'] {
return [
{ type: 'checkbox', width: 40 },
{
field: 'id',
title: '编号',
width: 100,
minWidth: 100,
},
{
field: 'name',
@ -305,7 +298,7 @@ export function useGridColumns<T = InfraFileConfigApi.FileConfig>(
{
field: 'storage',
title: '存储器',
width: 100,
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_FILE_STORAGE },
@ -319,7 +312,7 @@ export function useGridColumns<T = InfraFileConfigApi.FileConfig>(
{
field: 'master',
title: '主配置',
width: 100,
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
@ -328,43 +321,14 @@ export function useGridColumns<T = InfraFileConfigApi.FileConfig>(
{
field: 'createTime',
title: '创建时间',
width: 180,
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'operation',
title: '操作',
width: 280,
width: 240,
fixed: 'right',
align: 'center',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '文件配置',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
{
code: 'edit',
show: hasAccessByCodes(['infra:file-config:update']),
},
{
code: 'delete',
show: hasAccessByCodes(['infra:file-config:delete']),
},
{
code: 'master',
text: '主配置',
disabled: (row: any) => row.master,
show: (_row: any) => hasAccessByCodes(['infra:file-config:update']),
},
{
code: 'test',
text: '测试',
},
],
},
slots: { default: 'actions' },
},
];
}

119
apps/web-ele/src/views/infra/fileConfig/index.vue
View File

@ -1,8 +1,5 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { InfraFileConfigApi } from '#/api/infra/file-config';
import { ref } from 'vue';
@ -31,36 +28,36 @@ const [FormModal, formModalApi] = useVbenModal({
});
/** 刷新表格 */
function onRefresh() {
function handleRefresh() {
gridApi.query();
}
/** 创建文件配置 */
function onCreate() {
function handleCreate() {
formModalApi.setData(null).open();
}
/** 编辑文件配置 */
function onEdit(row: InfraFileConfigApi.FileConfig) {
function handleEdit(row: InfraFileConfigApi.FileConfig) {
formModalApi.setData(row).open();
}
/** 设为主配置 */
async function onMaster(row: InfraFileConfigApi.FileConfig) {
async function handleMaster(row: InfraFileConfigApi.FileConfig) {
const loadingInstance = ElLoading.service({
text: $t('ui.actionMessage.updating', [row.name]),
});
try {
await updateFileConfigMaster(row.id as number);
ElMessage.success($t('ui.actionMessage.operationSuccess'));
onRefresh();
handleRefresh();
} catch {
loadingInstance.close();
}
}
/** 测试文件配置 */
async function onTest(row: InfraFileConfigApi.FileConfig) {
async function handleTest(row: InfraFileConfigApi.FileConfig) {
const loadingInstance = ElLoading.service({
text: '测试上传中...',
});
@ -82,26 +79,33 @@ async function onTest(row: InfraFileConfigApi.FileConfig) {
}
/** 删除文件配置 */
async function onDelete(row: InfraFileConfigApi.FileConfig) {
async function handleDelete(row: InfraFileConfigApi.FileConfig) {
const loadingInstance = ElLoading.service({
text: $t('ui.actionMessage.deleting', [row.name]),
});
try {
await deleteFileConfig(row.id as number);
ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
onRefresh();
handleRefresh();
} finally {
loadingInstance.close();
}
}
/** 批量删除文件配置 */
async function onDeleteBatch() {
await confirm('确定要批量删除该文件配置吗？');
await deleteFileConfigList(checkedIds.value);
checkedIds.value = [];
ElMessage.success($t('ui.actionMessage.deleteSuccess'));
onRefresh();
async function handleDeleteBatch() {
await confirm($t('ui.actionMessage.deleteBatchConfirm'));
const loadingInstance = ElLoading.service({
text: $t('ui.actionMessage.deletingBatch'),
});
try {
await deleteFileConfigList(checkedIds.value);
checkedIds.value = [];
ElMessage.success($t('ui.actionMessage.deleteSuccess'));
handleRefresh();
} finally {
loadingInstance.close();
}
}
const checkedIds = ref<number[]>([]);
@ -113,37 +117,12 @@ function handleRowCheckboxChange({
checkedIds.value = records.map((item) => item.id!);
}
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<InfraFileConfigApi.FileConfig>) {
switch (code) {
case 'delete': {
onDelete(row);
break;
}
case 'edit': {
onEdit(row);
break;
}
case 'master': {
onMaster(row);
break;
}
case 'test': {
onTest(row);
break;
}
}
}
const [Grid, gridApi] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
},
gridOptions: {
columns: useGridColumns(onActionClick),
columns: useGridColumns(),
height: 'auto',
keepSource: true,
proxyConfig: {
@ -159,6 +138,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
},
rowConfig: {
keyField: 'id',
isHover: true,
},
toolbarConfig: {
refresh: true,
@ -174,7 +154,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
<template>
<Page auto-content-height>
<FormModal @success="onRefresh" />
<FormModal @success="handleRefresh" />
<Grid table-title="文件配置列表">
<template #toolbar-tools>
<TableAction
@ -184,7 +164,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
type: 'primary',
icon: ACTION_ICON.ADD,
auth: ['infra:file-config:create'],
onClick: onCreate,
onClick: handleCreate,
},
{
label: $t('ui.actionTitle.deleteBatch'),
@ -192,7 +172,52 @@ const [Grid, gridApi] = useVbenVxeGrid({
icon: ACTION_ICON.DELETE,
disabled: isEmpty(checkedIds),
auth: ['infra:file-config:delete'],
onClick: onDeleteBatch,
onClick: handleDeleteBatch,
},
]"
/>
</template>
<template #actions="{ row }">
<TableAction
:actions="[
{
label: $t('common.edit'),
type: 'primary',
link: true,
icon: ACTION_ICON.EDIT,
auth: ['infra:file-config:update'],
onClick: handleEdit.bind(null, row),
},
{
label: '测试',
type: 'primary',
link: true,
icon: 'lucide:test-tube-diagonal',
auth: ['infra:file-config:update'],
onClick: handleTest.bind(null, row),
},
{
label: '主配置',
type: 'primary',
link: true,
icon: ACTION_ICON.ADD,
auth: ['infra:file-config:update'],
disabled: row.master,
popConfirm: {
title: `是否要将${row.name}设为主配置？`,
confirm: handleMaster.bind(null, row),
},
},
{
label: $t('common.delete'),
type: 'danger',
link: true,
icon: ACTION_ICON.DELETE,
auth: ['infra:file-config:delete'],
popConfirm: {
title: $t('ui.actionMessage.deleteConfirm', [row.name]),
confirm: handleDelete.bind(null, row),
},
},
]"
/>

4
apps/web-ele/src/views/infra/fileConfig/modules/form.vue
View File

@ -31,7 +31,7 @@ const [Form, formApi] = useVbenForm({
class: 'w-full',
},
formItemClass: 'col-span-2',
labelWidth: 80,
labelWidth: 120,
},
layout: 'horizontal',
schema: useFormSchema(),
@ -82,7 +82,7 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal :title="getTitle">
<Modal :title="getTitle" class="w-2/5">
<Form class="mx-4" />
</Modal>
</template>