feat：【ele】【ai】image 的代码评审

apps/web-antd/src/views/ai/image/index/modules/card.vue

@@ -77,6 +77,7 @@ onMounted(async () => {
         </Button>
       </div>
       <div class="flex">
+        <!-- TODO @AI：居右对齐 -->
         <Button
           class="m-0 p-2"
           type="text"

apps/web-antd/src/views/ai/image/index/modules/common/index.vue

@@ -101,7 +101,7 @@ watch(
   },
   { immediate: true, deep: true },
 );
-/** 暴露组件方法 */
+
 defineExpose({ settingValues });
 </script>
 <template>

apps/web-antd/src/views/ai/image/index/modules/dall3/index.vue

@@ -138,7 +138,6 @@ async function settingValues(detail: AiImageApi.Image) {
   await handleSizeClick(imageSize);
 }
 
-/** 暴露组件方法 */
 defineExpose({ settingValues });
 </script>
 <template>

apps/web-antd/src/views/ai/image/index/modules/detail.vue

@@ -10,7 +10,7 @@ import {
   StableDiffusionSamplers,
   StableDiffusionStylePresets,
 } from '@vben/constants';
-import { formatDate } from '@vben/utils';
+import { formatDateTime } from '@vben/utils';
 
 import { Image } from 'ant-design-vue';
 
@@ -53,12 +53,8 @@ watch(
   <div class="mb-5 w-full overflow-hidden break-words">
     <div class="text-lg font-bold">时间</div>
     <div class="mt-2">
-      <div>
+      <div>提交时间：{{ formatDateTime(detail.createTime) }}</div>
-        提交时间：{{ formatDate(detail.createTime, 'yyyy-MM-dd HH:mm:ss') }}
+      <div>生成时间：{{ formatDateTime(detail.finishTime) }}</div>
-      </div>
-      <div>
-        生成时间：{{ formatDate(detail.finishTime, 'yyyy-MM-dd HH:mm:ss') }}
-      </div>
     </div>
   </div>
 

apps/web-antd/src/views/ai/image/index/modules/midjourney/index.vue

@@ -135,7 +135,6 @@ async function settingValues(detail: AiImageApi.Image) {
   referImageUrl.value = detail.options.referImageUrl;
 }
 
-/** 暴露组件方法 */
 defineExpose({ settingValues });
 </script>
 <template>

apps/web-antd/src/views/ai/image/index/modules/stable-diffusion/index.vue

@@ -126,7 +126,6 @@ async function settingValues(detail: AiImageApi.Image) {
   stylePreset.value = detail.options?.stylePreset;
 }
 
-/** 暴露组件方法 */
 defineExpose({ settingValues });
 </script>
 <template>
@@ -225,6 +224,7 @@ defineExpose({ settingValues });
   </div>
 
   <!-- 图片尺寸 -->
+  <!-- TODO @AI：同 /Users/yunai/Java/yudao-ui-admin-vben-v5/apps/web-antd/src/views/ai/image/index/modules/common/index.vue 的问题 -->
   <div class="mt-8">
     <div><b>图片尺寸</b></div>
     <Space wrap class="mt-4 w-full">

apps/web-antd/src/views/ai/image/square/index.vue

@@ -31,7 +31,9 @@ async function getList() {
     loading.value = false;
   }
 }
+
 const debounceGetList = useDebounceFn(getList, 80);
+
 /** 搜索按钮操作 */
 function handleQuery() {
   queryParams.pageNo = 1;

apps/web-ele/src/views/ai/image/index/index.vue

@@ -91,10 +91,7 @@ onMounted(async () => {
     <div class="absolute inset-0 m-4 flex h-full w-full flex-row">
       <div class="bg-card left-0 mr-4 flex w-96 flex-col rounded-lg p-4">
         <div class="flex justify-center">
-          <ElSegmented
+          <ElSegmented v-model="selectPlatform" :options="platformOptions" />
-            v-model="selectPlatform"
-            :options="platformOptions"
-          />
         </div>
         <div class="mt-8 h-full overflow-y-auto">
           <Common
@@ -129,4 +126,3 @@ onMounted(async () => {
     </div>
   </Page>
 </template>
-

apps/web-ele/src/views/ai/image/index/modules/card.vue

@@ -48,7 +48,6 @@ async function handleLoading(status: number) {
     loading.value = ElMessage({
       message: `生成中...`,
       type: 'info',
-      duration: 0,
     });
   } else {
     // 情况二：如果已经生成结束，则移除 loading
@@ -74,7 +73,10 @@ onMounted(async () => {
         <ElButton v-else-if="detail?.status === AiImageStatusEnum.SUCCESS">
           已完成
         </ElButton>
-        <ElButton type="danger" v-else-if="detail?.status === AiImageStatusEnum.FAIL">
+        <ElButton
+          type="danger"
+          v-else-if="detail?.status === AiImageStatusEnum.FAIL"
+        >
           异常
         </ElButton>
       </div>
@@ -132,4 +134,3 @@ onMounted(async () => {
     </div>
   </ElCard>
 </template>
-

apps/web-ele/src/views/ai/image/index/modules/common/index.vue

@@ -107,7 +107,7 @@ watch(
   },
   { immediate: true, deep: true },
 );
-/** 暴露组件方法 */
+
 defineExpose({ settingValues });
 </script>
 <template>
@@ -195,6 +195,8 @@ defineExpose({ settingValues });
       <b>图片尺寸</b>
     </div>
     <ElSpace wrap class="mt-4 flex flex-wrap gap-x-5">
+      <!-- TODO @AI：是不是可以 ElInputNumber 里面；另外，宽、高在一行里； <template #prepend>Http://</template>；<template #append>.com</template>
+ -->
       <div class="flex items-center gap-2">
         <span>宽</span>
         <ElInputNumber

apps/web-ele/src/views/ai/image/index/modules/dall3/index.vue

@@ -183,6 +183,7 @@ defineExpose({ settingValues });
         v-for="model in Dall3Models"
         :key="model.key"
       >
+        <!-- TODO @AI：图片无法展示； -->
         <ElImage
           :preview-src-list="[]"
           :src="model.image"

apps/web-ele/src/views/ai/image/index/modules/detail.vue

@@ -10,7 +10,7 @@ import {
   StableDiffusionSamplers,
   StableDiffusionStylePresets,
 } from '@vben/constants';
-import { formatDate } from '@vben/utils';
+import { formatDateTime } from '@vben/utils';
 
 import { ElImage } from 'element-plus';
 
@@ -53,12 +53,8 @@ watch(
   <div class="mb-5 w-full overflow-hidden break-words">
     <div class="text-lg font-bold">时间</div>
     <div class="mt-2">
-      <div>
+      <div>提交时间：{{ formatDateTime(detail.createTime) }}</div>
-        提交时间：{{ formatDate(detail.createTime, 'yyyy-MM-dd HH:mm:ss') }}
+      <div>生成时间：{{ formatDateTime(detail.finishTime) }}</div>
-      </div>
-      <div>
-        生成时间：{{ formatDate(detail.finishTime, 'yyyy-MM-dd HH:mm:ss') }}
-      </div>
     </div>
   </div>
 

apps/web-ele/src/views/ai/image/square/index.vue

@@ -4,7 +4,6 @@ import type { AiImageApi } from '#/api/ai/image';
 import { onMounted, reactive, ref } from 'vue';
 
 import { Page } from '@vben/common-ui';
-
 import { IconifyIcon } from '@vben/icons';
 
 import { useDebounceFn } from '@vueuse/core';