feat：【ele】mp/tag 的代码迁移

apps/web-antd/src/views/mp/account/index.vue

@@ -45,7 +45,7 @@ async function handleDelete(row: MpAccountApi.Account) {
     duration: 0,
   });
   try {
-    await deleteAccount(row.id as number);
+    await deleteAccount(row.id!);
     message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
     handleRefresh();
   } finally {
@@ -60,7 +60,7 @@ async function handleGenerateQrCode(row: MpAccountApi.Account) {
     duration: 0,
   });
   try {
-    await generateAccountQrCode(row.id as number);
+    await generateAccountQrCode(row.id!);
     message.success($t('ui.actionMessage.operationSuccess'));
     handleRefresh();
   } finally {
@@ -75,7 +75,7 @@ async function handleCleanQuota(row: MpAccountApi.Account) {
     duration: 0,
   });
   try {
-    await clearAccountQuota(row.id as number);
+    await clearAccountQuota(row.id!);
     message.success($t('ui.actionMessage.operationSuccess'));
   } finally {
     hideLoading();

apps/web-antd/src/views/mp/statistics/data.ts

@@ -22,7 +22,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
           value: item.id,
         })),
         placeholder: '请选择公众号',
-        allowClear: true,
       },
       defaultValue: accountList[0]?.id,
     },

apps/web-antd/src/views/mp/tag/data.ts

@@ -4,6 +4,7 @@ import type { MpAccountApi } from '#/api/mp/account';
 
 import { getSimpleAccountList } from '#/api/mp/account';
 
+/** 关联数据 */
 let accountList: MpAccountApi.AccountSimple[] = [];
 getSimpleAccountList().then((data) => (accountList = data));
 
@@ -45,14 +46,13 @@ export function useGridFormSchema(): VbenFormSchema[] {
     {
       fieldName: 'accountId',
       label: '公众号',
-      component: 'Select',
+      component: 'ApiSelect',
       componentProps: {
         options: accountList.map((item) => ({
           label: item.name,
           value: item.id,
         })),
         placeholder: '请选择公众号',
-        allowClear: true,
       },
       defaultValue: accountList[0]?.id,
     },
@@ -65,19 +65,23 @@ export function useGridColumns(): VxeGridPropTypes.Columns {
     {
       title: '编号',
       field: 'id',
+      minWidth: 80,
     },
     {
       title: '标签名称',
       field: 'name',
+      minWidth: 150,
     },
     {
       title: '粉丝数',
       field: 'count',
+      minWidth: 100,
     },
     {
       title: '创建时间',
       field: 'createTime',
       formatter: 'formatDateTime',
+      minWidth: 180,
     },
     {
       title: '操作',

apps/web-antd/src/views/mp/tag/index.vue

@@ -27,6 +27,10 @@ function handleRefresh() {
 async function handleCreate() {
   const formValues = await gridApi.formApi.getValues();
   const accountId = formValues.accountId;
+  if (!accountId) {
+    message.warning('请先选择公众号');
+    return;
+  }
   formModalApi.setData({ accountId }).open();
 }
 
@@ -34,6 +38,10 @@ async function handleCreate() {
 async function handleEdit(row: MpTagApi.Tag) {
   const formValues = await gridApi.formApi.getValues();
   const accountId = formValues.accountId;
+  if (!accountId) {
+    message.warning('请先选择公众号');
+    return;
+  }
   formModalApi.setData({ row, accountId }).open();
 }
 
@@ -44,15 +52,14 @@ async function handleDelete(row: MpTagApi.Tag) {
     duration: 0,
   });
   try {
-    await deleteTag(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
+    await deleteTag(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
     handleRefresh();
   } finally {
     hideLoading();
   }
 }
+
 /** 同步标签 */
 async function handleSync() {
   const formValues = await gridApi.formApi.getValues();
@@ -69,9 +76,7 @@ async function handleSync() {
   });
   try {
     await syncTag(accountId);
-    message.success({
-      content: '同步标签成功',
-    });
+    message.success('同步标签成功');
     handleRefresh();
   } finally {
     hideLoading();
@@ -99,6 +104,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     },
     rowConfig: {
       keyField: 'id',
+      isHover: true,
     },
     toolbarConfig: {
       refresh: true,

apps/web-antd/src/views/mp/tag/modules/form.vue

@@ -66,7 +66,7 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     try {
-      formData.value = await getTag(data.row.id as number);
+      formData.value = await getTag(data.row.id!);
       // 设置到 values
       await formApi.setValues(formData.value);
     } finally {
@@ -77,7 +77,7 @@ const [Modal, modalApi] = useVbenModal({
 </script>
 
 <template>
-  <Modal class="w-2/5" :title="getTitle">
+  <Modal :title="getTitle" class="w-2/5">
     <Form class="mx-4" />
   </Modal>
 </template>