feat: 优化页面

apps/web-antd/src/views/ai/music/manager/data.ts

@@ -100,15 +100,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       minWidth: 180,
       slots: { default: 'content' },
     },
-    {
-      field: 'status',
-      title: '绘画状态',
-      minWidth: 100,
-      cellRender: {
-        name: 'CellDict',
-        props: { type: DICT_TYPE.AI_IMAGE_STATUS },
-      },
-    },
     {
       field: 'duration',
       title: '时长（秒）',
@@ -139,9 +130,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       },
     },
     {
+      field: 'tags',
       title: '风格标签',
       minWidth: 180,
-      slots: { default: 'tags' },
+      cellRender: {
+        name: 'CellTags',
+      },
     },
     {
       minWidth: 100,

apps/web-antd/src/views/ai/music/manager/index.vue

@@ -7,7 +7,7 @@ import { onMounted, ref } from 'vue';
 
 import { confirm, DocAlert, Page } from '@vben/common-ui';
 
-import { Button, message, Switch, Tag } from 'ant-design-vue';
+import { Button, message, Switch } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { deleteMusic, getMusicPage, updateMusic } from '#/api/ai/music';
@@ -101,9 +101,9 @@ onMounted(async () => {
       </template>
 
       <template #userId="{ row }">
-        <span>{{
-          userList.find((item) => item.id === row.userId)?.nickname
-        }}</span>
+        <span>
+          {{ userList.find((item) => item.id === row.userId)?.nickname }}
+        </span>
       </template>
       <template #content="{ row }">
         <Button
@@ -141,11 +141,6 @@ onMounted(async () => {
           :disabled="row.status !== AiMusicStatusEnum.SUCCESS"
         />
       </template>
-      <template #tags="{ row }">
-        <Tag v-for="tag in row.tags" :key="tag" class="ml-1">
-          {{ tag }}
-        </Tag>
-      </template>
       <template #actions="{ row }">
         <TableAction
           :actions="[