【增加】Image midjourney 增加 click 事件

Author: cherishsince

src/api/ai/image/index.ts

@@ -15,10 +15,18 @@ export interface ImageDetailVO {
   model: string // 模型
   style: string // 图像生成的风格
   size: string // 图片尺寸
+  buttons: ImageMjButtonsVO[] // mj 操作按钮
   createTime: string // 创建时间
   updateTime: string // 更新事件
 }
 
+export interface ImageMjButtonsVO {
+  customId: string // MJ::JOB::upsample::1::85a4b4c1-8835-46c5-a15c-aea34fad1862 动作标识
+  emoji: string // 图标 emoji
+  label: string // Make Variations 文本
+  style: number // 样式: 2（Primary）、3（Green）
+}
+
 export interface ImagePageReqVO {
   pageNo: number // 分页编号
   pageSize: number // 分页大小

src/views/ai/image/ImageTask.vue

@@ -5,7 +5,8 @@
       v-for="image in imageList"
       :key="image"
       :image-detail="image"
-      @on-btn-click="handlerImageBtnClick" />
+      @on-btn-click="handlerImageBtnClick"
+      @on-mj-btn-click="handlerImageMjBtnClick"/>
   </el-card>
   <!-- 图片 detail 抽屉 -->
   <ImageDetailDrawer
@@ -15,7 +16,7 @@
   />
 </template>
 <script setup lang="ts">
-import {ImageApi, ImageDetailVO} from '@/api/ai/image';
+import {ImageApi, ImageDetailVO, ImageMjButtonsVO} from '@/api/ai/image';
 import ImageDetailDrawer from './ImageDetailDrawer.vue'
 import ImageTaskCard from './ImageTaskCard.vue'
 
@@ -61,6 +62,11 @@ const handlerImageBtnClick = async (type, imageDetail: ImageDetailVO) => {
   }
 }
 
+/**  图片 - mj btn click  */
+const handlerImageMjBtnClick = async (button: ImageMjButtonsVO) => {
+  console.log('mj click', button)
+}
+
 /**  下载 - image  */
 // TODO @fan：貌似可以考虑抽到 download 里面，作为一个方法
 const downloadImage = async (imageUrl) => {