perf: 优化部分显示效果

This commit is contained in:
xingyu4j
2025-05-28 11:36:52 +08:00
parent 77ccb9a5d8
commit 6236f59473
13 changed files with 72 additions and 130 deletions

View File

@@ -50,14 +50,6 @@ export function useFormSchema(): VbenFormSchema[] {
},
rules: z.number().default(CommonStatusEnum.ENABLE),
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
},
},
{
fieldName: 'apiKey',
label: '短信 API 的账号',
@@ -83,6 +75,14 @@ export function useFormSchema(): VbenFormSchema[] {
placeholder: '请输入短信发送回调 URL',
},
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
},
},
];
}
@@ -135,17 +135,14 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'id',
title: '编号',
minWidth: 100,
},
{
field: 'signature',
title: '短信签名',
minWidth: 120,
},
{
field: 'code',
title: '渠道编码',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE },
@@ -154,38 +151,32 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'status',
title: '启用状态',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
},
},
{
field: 'remark',
title: '备注',
minWidth: 120,
},
{
field: 'apiKey',
title: '短信 API 的账号',
minWidth: 180,
},
{
field: 'apiSecret',
title: '短信 API 的密钥',
minWidth: 180,
},
{
field: 'callbackUrl',
title: '短信发送回调 URL',
minWidth: 180,
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'remark',
title: '备注',
},
{
title: '操作',
width: 130,

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 class="w-[40%]" :title="getTitle">
<Form class="mx-4" />
</Modal>
</template>

View File

@@ -84,18 +84,10 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'id',
title: '编号',
minWidth: 100,
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'mobile',
title: '手机号',
minWidth: 120,
},
{
field: 'templateContent',
@@ -105,7 +97,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'sendStatus',
title: '发送状态',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_SEND_STATUS },
@@ -114,13 +105,11 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'sendTime',
title: '发送时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'receiveStatus',
title: '接收状态',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS },
@@ -129,13 +118,11 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'receiveTime',
title: '接收时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'channelCode',
title: '短信渠道',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE },
@@ -144,17 +131,20 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'templateId',
title: '模板编号',
minWidth: 100,
},
{
field: 'templateType',
title: '短信类型',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE },
},
},
{
field: 'createTime',
title: '创建时间',
formatter: 'formatDateTime',
},
{
title: '操作',
width: 80,

View File

@@ -78,6 +78,7 @@ export function useFormSchema(): VbenFormSchema[] {
component: 'Textarea',
componentProps: {
placeholder: '请输入模板内容',
rows: 4,
},
rules: 'required',
},
@@ -204,12 +205,10 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'id',
title: '编号',
minWidth: 100,
},
{
field: 'type',
title: '短信类型',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE },
@@ -218,12 +217,10 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'name',
title: '模板名称',
minWidth: 120,
},
{
field: 'code',
title: '模板编码',
minWidth: 120,
},
{
field: 'content',
@@ -233,26 +230,18 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'status',
title: '开启状态',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
},
},
{
field: 'remark',
title: '备注',
minWidth: 120,
},
{
field: 'apiTemplateId',
title: '短信 API 的模板编号',
minWidth: 180,
},
{
field: 'channelCode',
title: '短信渠道',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE },
@@ -261,9 +250,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'remark',
title: '备注',
},
{
title: '操作',
width: 220,

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(),
@@ -83,7 +83,7 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal :title="getTitle">
<Modal class="w-[40%]" :title="getTitle">
<Form class="mx-4" />
</Modal>
</template>

View File

@@ -103,7 +103,7 @@ const buildFormSchema = () => {
</script>
<template>
<Modal title="发送短信">
<Modal class="w-[30%]" title="发送短信">
<Form class="mx-4" />
</Modal>
</template>