From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/ai/image/index/components/midjourney/index.vue | 236 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 236 insertions(+), 0 deletions(-)
diff --git a/src/views/ai/image/index/components/midjourney/index.vue b/src/views/ai/image/index/components/midjourney/index.vue
new file mode 100644
index 0000000..d59a83a
--- /dev/null
+++ b/src/views/ai/image/index/components/midjourney/index.vue
@@ -0,0 +1,236 @@
+<!-- dall3 -->
+<template>
+ <div class="prompt">
+ <el-text tag="b">鐢婚潰鎻忚堪</el-text>
+ <el-text tag="p">寤鸿浣跨敤鈥滃舰瀹硅瘝+鍔ㄨ瘝+椋庢牸鈥濈殑鏍煎紡锛屼娇鐢ㄢ�滐紝鈥濋殧寮�.</el-text>
+ <el-input
+ v-model="prompt"
+ maxlength="1024"
+ :rows="5"
+ class="w-100% mt-15px"
+ input-style="border-radius: 7px;"
+ placeholder="渚嬪锛氱璇濋噷鐨勫皬灞嬪簲璇ユ槸浠�涔堟牱瀛愶紵"
+ show-word-limit
+ type="textarea"
+ />
+ </div>
+ <div class="flex flex-col mt-30px">
+ <div>
+ <el-text tag="b">闅忔満鐑瘝</el-text>
+ </div>
+ <el-space wrap class="flex flex-row flex-wrap justify-start mt-15px">
+ <el-button
+ round
+ class="m-0"
+ :type="selectHotWord === hotWord ? 'primary' : 'default'"
+ v-for="hotWord in ImageHotWords"
+ :key="hotWord"
+ @click="handleHotWordClick(hotWord)"
+ >
+ {{ hotWord }}
+ </el-button>
+ </el-space>
+ </div>
+ <div class="w-full mt-30px">
+ <div>
+ <el-text tag="b">灏哄</el-text>
+ </div>
+ <el-space wrap class="flex flex-row justify-between w-full mt-20px">
+ <div
+ class="flex flex-col items-center cursor-pointer"
+ v-for="imageSize in MidjourneySizeList"
+ :key="imageSize.key"
+ @click="handleSizeClick(imageSize)"
+ >
+ <div
+ :class="selectSize === imageSize.key ? 'flex flex-col items-center justify-center rounded-7px p-4px w-50px h-50px bg-white border-1 border-solid border-#1293ff' : 'flex flex-col items-center justify-center rounded-7px p-4px w-50px h-50px bg-white border-1 border-solid border-white'"
+ >
+ <div :style="imageSize.style"></div>
+ </div>
+ <div class="text-14px color-#3e3e3e font-bold">{{ imageSize.key }}</div>
+ </div>
+ </el-space>
+ </div>
+ <div class="mt-30px">
+ <div>
+ <el-text tag="b">妯″瀷</el-text>
+ </div>
+ <el-space wrap class="mt-15px">
+ <div
+ :class="selectModel === model.key ? 'flex flex-col items-center w-150px overflow-hidden border-3 border-solid border-#1293ff rounded-5px cursor-pointer' : 'flex flex-col items-center w-150px overflow-hidden border-3 border-solid border-transparent cursor-pointer'"
+ v-for="model in MidjourneyModels"
+ :key="model.key"
+ >
+ <el-image :src="model.image" fit="contain" @click="handleModelClick(model)" />
+ <div class="text-14px color-#3e3e3e font-bold">{{ model.name }}</div>
+ </div>
+ </el-space>
+ </div>
+ <div class="mt-20px">
+ <div>
+ <el-text tag="b">鐗堟湰</el-text>
+ </div>
+ <el-space wrap class="mt-20px w-full">
+ <el-select
+ v-model="selectVersion"
+ class="!w-350px"
+ clearable
+ placeholder="璇烽�夋嫨鐗堟湰"
+ >
+ <el-option
+ v-for="item in versionList"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ </el-space>
+ </div>
+ <div class="mt-30px">
+ <div>
+ <el-text tag="b">鍙傝�冨浘</el-text>
+ </div>
+ <el-space wrap class="mt-15px">
+ <UploadImg v-model="referImageUrl" height="120px" width="120px" />
+ </el-space>
+ </div>
+ <div class="flex justify-center mt-50px">
+ <el-button
+ type="primary"
+ size="large"
+ round
+ :disabled="prompt.length === 0"
+ @click="handleGenerateImage"
+ >
+ {{ drawIn ? '鐢熸垚涓�' : '鐢熸垚鍐呭' }}
+ </el-button>
+ </div>
+</template>
+<script setup lang="ts">
+import { ImageApi, ImageMidjourneyImagineReqVO, ImageVO } from '@/api/ai/image'
+import {
+ AiPlatformEnum,
+ ImageHotWords,
+ ImageSizeVO,
+ ImageModelVO,
+ MidjourneyModels,
+ MidjourneySizeList,
+ MidjourneyVersions,
+ NijiVersionList
+} from '@/views/ai/utils/constants'
+import { ModelVO } from '@/api/ai/model/model'
+
+const message = useMessage() // 娑堟伅寮圭獥
+
+// 鎺ユ敹鐖剁粍浠朵紶鍏ョ殑妯″瀷鍒楄〃
+const props = defineProps({
+ models: {
+ type: Array<ModelVO>,
+ default: () => [] as ModelVO[]
+ }
+})
+const emits = defineEmits(['onDrawStart', 'onDrawComplete']) // 瀹氫箟 emits
+
+// 瀹氫箟灞炴��
+const drawIn = ref<boolean>(false) // 鐢熸垚涓�
+const selectHotWord = ref<string>('') // 閫変腑鐨勭儹璇�
+// 琛ㄥ崟
+const prompt = ref<string>('') // 鎻愮ず璇�
+const referImageUrl = ref<any>() // 鍙傝�冨浘
+const selectModel = ref<string>('midjourney') // 閫変腑鐨勬ā鍨�
+const selectSize = ref<string>('1:1') // 閫変腑 size
+const selectVersion = ref<any>('6.0') // 閫変腑鐨� version
+const versionList = ref<any>(MidjourneyVersions) // version 鍒楄〃
+
+/** 閫夋嫨鐑瘝 */
+const handleHotWordClick = async (hotWord: string) => {
+ // 鎯呭喌涓�锛氬彇娑堥�変腑
+ if (selectHotWord.value == hotWord) {
+ selectHotWord.value = ''
+ return
+ }
+
+ // 鎯呭喌浜岋細閫変腑
+ selectHotWord.value = hotWord // 閫変腑
+ prompt.value = hotWord // 璁剧疆鎻愮ず娆�
+}
+
+/** 鐐瑰嚮 size 灏哄 */
+const handleSizeClick = async (imageSize: ImageSizeVO) => {
+ selectSize.value = imageSize.key
+}
+
+/** 鐐瑰嚮 model 妯″瀷 */
+const handleModelClick = async (model: ImageModelVO) => {
+ selectModel.value = model.key
+ if (model.key === 'niji') {
+ versionList.value = NijiVersionList // 榛樿閫夋嫨 niji
+ } else {
+ versionList.value = MidjourneyVersions // 榛樿閫夋嫨 midjourney
+ }
+ selectVersion.value = versionList.value[0].value
+}
+
+/** 鍥剧墖鐢熸垚 */
+const handleGenerateImage = async () => {
+ // 浠� models 涓煡鎵惧尮閰嶇殑妯″瀷
+ const matchedModel = props.models.find(
+ (item) => item.model === selectModel.value && item.platform === AiPlatformEnum.MIDJOURNEY
+ )
+ if (!matchedModel) {
+ message.error('璇ユā鍨嬩笉鍙敤锛岃閫夋嫨鍏跺畠妯″瀷')
+ return
+ }
+
+ // 浜屾纭
+ await message.confirm(`纭鐢熸垚鍐呭?`)
+ try {
+ // 鍔犺浇涓�
+ drawIn.value = true
+ // 鍥炶皟
+ emits('onDrawStart', AiPlatformEnum.MIDJOURNEY)
+ // 鍙戦�佽姹�
+ const imageSize = MidjourneySizeList.find(
+ (item) => selectSize.value === item.key
+ ) as ImageSizeVO
+ const req = {
+ prompt: prompt.value,
+ modelId: matchedModel.id,
+ width: imageSize.width,
+ height: imageSize.height,
+ version: selectVersion.value,
+ referImageUrl: referImageUrl.value
+ } as ImageMidjourneyImagineReqVO
+ await ImageApi.midjourneyImagine(req)
+ } finally {
+ // 鍥炶皟
+ emits('onDrawComplete', AiPlatformEnum.MIDJOURNEY)
+ // 鍔犺浇缁撴潫
+ drawIn.value = false
+ }
+}
+
+/** 濉厖鍊� */
+const settingValues = async (detail: ImageVO) => {
+ // 鎻愮ず璇�
+ prompt.value = detail.prompt
+ // image size
+ const imageSize = MidjourneySizeList.find(
+ (item) => item.key === `${detail.width}:${detail.height}`
+ ) as ImageSizeVO
+ selectSize.value = imageSize.key
+ // 閫変腑妯″瀷
+ const model = MidjourneyModels.find((item) => item.key === detail.options?.model) as ImageModelVO
+ await handleModelClick(model)
+ // 鐗堟湰
+ selectVersion.value = versionList.value.find(
+ (item) => item.value === detail.options?.version
+ ).value
+ // image
+ referImageUrl.value = detail.options.referImageUrl
+}
+
+/** 鏆撮湶缁勪欢鏂规硶 */
+defineExpose({ settingValues })
+</script>
+
--
Gitblit v1.8.0