feat: 混图支持2~5张图及U/V操作 #47

Author: Licoy

app/components/chat.tsx

@@ -907,7 +907,7 @@ export function Chat() {
                                     {!isUser &&
                                         message.model == "midjourney" &&
                                         message.attr?.finished &&
-                                        ["VARIATION", "IMAGINE"].includes(message.attr?.action) && (
+                                        ["VARIATION", "IMAGINE", "BLEND"].includes(message.attr?.action) && (
                                             <div
                                                 className={[
                                                     styles["chat-message-actions"],
@@ -1027,8 +1027,8 @@ export function Chat() {
                         onSearch("");
                     }}
                     imageSelected={(img: any) => {
-                        if (useImages.length >= 2) {
-                            alert(Locale.Midjourney.SelectImgMax(2));
+                        if (useImages.length >= 5) {
+                            alert(Locale.Midjourney.SelectImgMax(5));
                             return;
                         }
                         setUseImages([...useImages, img]);

app/locales/cn.ts

@@ -17,13 +17,13 @@ const cn = {
     SelectImgMax: (max: number) => `最多可选择 ${max} 张图片`,
     InputDisabled: "该模式下不支持输入内容",
     HasImgTip:
-      "提示：垫图模式/识图(describe)模式只会使用第一张图片，混图(blend)模式会按顺序使用选中的两张图片（点击图片可以移除）",
+      "提示：垫图模式/识图(describe)模式只会使用第一张图片，混图(blend)模式会按顺序使用选中的5张图片（点击图片可以移除）",
     ModeImagineUseImg: "垫图（图生图）模式",
     ModeBlend: "混图模式",
     ModeDescribe: "识图（图生文）模式",
     NeedInputUseImgPrompt:
       "垫图模式下需要输入内容才能使用图片，请以“/mj”开头输入内容",
-    BlendMinImg: (min: number) => `混图模式下至少需要 ${min} 张图片`,
+    BlendMinImg: (min: number,max:number) => `混图模式下至少需要 ${min} 张图片，至多 ${max} 张图片`,
     TaskErrUnknownType: "任务提交失败：未知的任务类型",
     TaskErrNotSupportType: (type: string) =>
       `任务提交失败：不支持的任务类型 -> ${type}`,

app/locales/en.ts

@@ -18,14 +18,13 @@ const en: RequiredLocaleType = {
     SelectImgMax: (max: number) => `Select up to ${max} images`,
     InputDisabled: "Input is disabled in this mode",
     HasImgTip:
-      "Tip: In the mask mode, only the first image will be used. In the blend mode, the two selected images will be used in order (click the image to remove it)",
+      "Tip: In the mask mode, only the first image will be used. In the blend mode, the five selected images will be used in order (click the image to remove it)",
     ModeImagineUseImg: "Mask Mode",
     ModeBlend: "Blend Mode",
     ModeDescribe: "Describe Mode",
     NeedInputUseImgPrompt:
       'You need to enter content to use the image in the mask mode, please enter the content starting with "/mj"',
-    BlendMinImg: (min: number) =>
-      `At least ${min} images are required in the blend mode`,
+    BlendMinImg: (min: number,max:number) => `At least ${min} images are required in the mixed image mode, and up to ${max} images are required`,
     TaskErrUnknownType: "Task submission failed: unknown task type",
     TaskErrNotSupportType: (type: string) =>
       `Task submission failed: unsupported task type -> ${type}`,

app/store/chat.ts

@@ -349,8 +349,8 @@ export const useChatStore = create<ChatStore>()(
                     (extAttr?.useImages?.length ?? 0) > 0 &&
                     extAttr.mjImageMode !== "IMAGINE"
                 ) {
-                    if (extAttr.mjImageMode === "BLEND" && extAttr.useImages.length < 2) {
-                        alert(Locale.Midjourney.BlendMinImg(2));
+                    if (extAttr.mjImageMode === "BLEND" && (extAttr.useImages.length < 2 || extAttr.useImages.length > 5)) {
+                        alert(Locale.Midjourney.BlendMinImg(2, 5));
                         return new Promise((resolve: any, reject) => {
                             resolve(false);
                         });