feat: 优化页面

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

@@ -26,7 +26,7 @@ defineExpose({
     >
       <Textarea
         v-model:value="formData.desc"
-        :autosize="{ minRows: 6, maxRows: 6 }"
+        :auto-size="{ minRows: 6, maxRows: 6 }"
         :maxlength="1200"
         :show-count="true"
         placeholder="一首关于糟糕分手的欢快歌曲"

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

@@ -28,7 +28,7 @@ defineExpose({
     <Title title="歌词" desc="自己编写歌词或使用Ai生成歌词，两节/8行效果最佳">
       <Textarea
         v-model:value="formData.lyric"
-        :autosize="{ minRows: 6, maxRows: 6 }"
+        :auto-size="{ minRows: 6, maxRows: 6 }"
         :maxlength="1200"
         :show-count="true"
         placeholder="请输入您自己的歌词"
@@ -60,7 +60,7 @@ defineExpose({
     >
       <Textarea
         v-model="formData.style"
-        :autosize="{ minRows: 4, maxRows: 4 }"
+        :auto-size="{ minRows: 4, maxRows: 4 }"
         :maxlength="256"
         show-count
         placeholder="输入音乐风格(英文)"

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="[

apps/web-antd/src/views/ai/write/index/components/Right.vue

@@ -98,7 +98,7 @@ watch(copied, (val) => {
         <Textarea
           id="inputId"
           v-model:value="compContent"
-          autosize
+          auto-size
           :bordered="false"
           placeholder="生成的内容……"
         />