feat：【ele】【ai】image 全部实现

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

@@ -194,30 +194,21 @@ defineExpose({ settingValues });
     <div>
       <b>图片尺寸</b>
     </div>
-    <ElSpace wrap class="mt-4 flex flex-wrap gap-x-5">
+    <div class="mt-4 flex items-center gap-2">
-      <!-- TODO @AI：是不是可以 ElInputNumber 里面；另外，宽、高在一行里； <template #prepend>Http://</template>；<template #append>.com</template>
+      <ElInputNumber
- -->
+        v-model="width"
-      <div class="flex items-center gap-2">
+        placeholder="图片宽度"
-        <span>宽</span>
+        controls-position="right"
-        <ElInputNumber
+        class="!w-32"
-          v-model="width"
+      />
-          placeholder="图片宽度"
+      <span class="mx-2">×</span>
-          controls-position="right"
+      <ElInputNumber
-          class="!w-32"
+        v-model="height"
-        />
+        placeholder="图片高度"
-        <span>px</span>
+        controls-position="right"
-      </div>
+        class="!w-32"
-      <div class="flex items-center gap-2">
+      />
-        <span>高</span>
+    </div>
-        <ElInputNumber
-          v-model="height"
-          placeholder="图片高度"
-          controls-position="right"
-          class="!w-32"
-        />
-        <span>px</span>
-      </div>
-    </ElSpace>
   </div>
 
   <div class="mt-12 flex justify-center">

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

@@ -182,13 +182,13 @@ defineExpose({ settingValues });
         ]"
         v-for="model in Dall3Models"
         :key="model.key"
+        @click="handleModelClick(model)"
       >
-        <!-- TODO @AI：图片无法展示； -->
         <ElImage
           :preview-src-list="[]"
           :src="model.image"
           fit="contain"
-          @click="handleModelClick(model)"
+          class="w-full"
         />
         <div class="text-sm font-bold text-gray-600">
           {{ model.name }}

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

@@ -232,24 +232,21 @@ defineExpose({ settingValues });
     <div><b>图片尺寸</b></div>
     <ElSpace wrap class="mt-4 w-full">
       <div class="flex items-center gap-2">
-        <span>宽</span>
         <ElInputNumber
           v-model="width"
           placeholder="图片宽度"
           controls-position="right"
           class="!w-32"
         />
-        <span>px</span>
       </div>
+      <span class="mx-2">×</span>
       <div class="flex items-center gap-2">
-        <span>高</span>
         <ElInputNumber
           v-model="height"
           placeholder="图片高度"
           controls-position="right"
           class="!w-32"
         />
-        <span>px</span>
       </div>
     </ElSpace>
   </div>

packages/constants/src/system-enum.ts

@@ -29,11 +29,13 @@ export const AiModelTypeEnum = {
   EMBEDDING: 5, // 向量
   RERANK: 6, // 重排
 };
+
 export interface ImageModel {
   image?: string;
   key: string;
   name: string;
 }
+
 export const OtherPlatformEnum: ImageModel[] = [
   {
     key: AiPlatformEnum.TONG_YI,
@@ -52,6 +54,7 @@ export const OtherPlatformEnum: ImageModel[] = [
     name: '硅基流动',
   },
 ];
+
 /**
  * AI 图像生成状态的枚举
  */
@@ -60,6 +63,7 @@ export const AiImageStatusEnum = {
   SUCCESS: 20, // 已完成
   FAIL: 30, // 已失败
 };
+
 /**
  * AI 音乐生成状态的枚举
  */
@@ -397,6 +401,7 @@ export const MidjourneyModels: ImageModel[] = [
     image: 'https://bigpt8.com/pc/_nuxt/nj.ca79b143.png',
   },
 ];
+
 export const MidjourneyVersions = [
   {
     value: '6.0',
@@ -459,6 +464,7 @@ export const MidjourneySizeList: ImageSize[] = [
     style: 'width: 50px; height: 30px;background-color: #dcdcdc;',
   },
 ];
+
 // ========== PAY 模块 ==========
 /**
  * 支付渠道枚举