From b376bd9b6d45ef8493bf6d1acdea71287847973e Mon Sep 17 00:00:00 2001
From: Germey <cqc@cuiqingcai.com>
Date: Sun, 5 Nov 2023 15:50:48 +0800
Subject: [PATCH] update prompt

---
 src/components/common/InfoIcon.vue            | 41 +++++++++++
 src/components/midjourney/IgnoreSelector.vue  |  4 +-
 src/components/midjourney/PresetPanel.vue     | 12 ++--
 src/components/midjourney/PromptInput.vue     |  4 +-
 .../midjourney/preset/AdvancedSelector.vue    | 11 ++-
 .../midjourney/preset/ChaosSelector.vue       |  8 ++-
 .../midjourney/preset/ImageWeightSelector.vue |  8 ++-
 .../midjourney/preset/NijiSelector.vue        | 68 +++++++++++++++++++
 .../midjourney/preset/StylizeSelector.vue     |  8 ++-
 .../midjourney/preset/TranslationSelector.vue | 15 ++--
 .../{WiredSelector.vue => WeirdSelector.vue}  | 14 ++--
 src/i18n/zh/index.ts                          |  4 +-
 src/i18n/zh/midjourney/description.ts         | 23 +++++++
 src/i18n/zh/midjourney/index.ts               |  6 ++
 src/i18n/zh/midjourney/message.ts             |  3 +
 src/i18n/zh/midjourney/name.ts                | 23 +++++++
 src/i18n/zh/midjourney/placeholder.ts         |  4 ++
 src/operators/midjourney/models.ts            |  2 +-
 src/pages/midjourney/Index.vue                |  4 +-
 src/plugins/font-awesome.ts                   |  2 +
 20 files changed, 231 insertions(+), 33 deletions(-)
 create mode 100644 src/components/common/InfoIcon.vue
 create mode 100644 src/components/midjourney/preset/NijiSelector.vue
 rename src/components/midjourney/preset/{WiredSelector.vue => WeirdSelector.vue} (75%)
 create mode 100644 src/i18n/zh/midjourney/description.ts
 create mode 100644 src/i18n/zh/midjourney/index.ts
 create mode 100644 src/i18n/zh/midjourney/message.ts
 create mode 100644 src/i18n/zh/midjourney/name.ts
 create mode 100644 src/i18n/zh/midjourney/placeholder.ts

diff --git a/src/components/common/InfoIcon.vue b/src/components/common/InfoIcon.vue
new file mode 100644
index 0000000..5c9805b
--- /dev/null
+++ b/src/components/common/InfoIcon.vue
@@ -0,0 +1,41 @@
+<template>
+  <el-tooltip effect="dark" :content="content" placement="top">
+    <font-awesome-icon icon="fa-solid fa-info" class="icon icon-rotate" />
+  </el-tooltip>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+import { ElTooltip } from 'element-plus';
+
+export default defineComponent({
+  name: 'InfoIcon',
+  components: {
+    FontAwesomeIcon,
+    ElTooltip
+  },
+  props: {
+    content: {
+      type: String,
+      required: true
+    }
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.icon {
+  display: block;
+  width: 20px;
+  border: 3px solid #aaa;
+  border-radius: 50%;
+  height: 20px;
+  font-size: 10px;
+  padding: 5px;
+  transform: scale(0.4);
+  cursor: pointer;
+  color: #aaa;
+  margin-right: -5px;
+}
+</style>
diff --git a/src/components/midjourney/IgnoreSelector.vue b/src/components/midjourney/IgnoreSelector.vue
index 090b7c2..c755db3 100644
--- a/src/components/midjourney/IgnoreSelector.vue
+++ b/src/components/midjourney/IgnoreSelector.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <h2 class="title">忽略元素</h2>
-    <el-input v-model="value" :rows="1" type="textarea" placeholder="Please input" />
+    <h2 class="title">{{ $t('midjourney.name.ignore') }}</h2>
+    <el-input v-model="value" :rows="1" type="textarea" :placeholder="$t('midjourney.placeholder.ignore')" />
   </div>
 </template>
 
diff --git a/src/components/midjourney/PresetPanel.vue b/src/components/midjourney/PresetPanel.vue
index 5d2ae7b..aee93c0 100644
--- a/src/components/midjourney/PresetPanel.vue
+++ b/src/components/midjourney/PresetPanel.vue
@@ -7,9 +7,10 @@
     <translation-selector v-model="preset.translation" class="mb-4" />
     <advanced-selector v-model="preset.advanced" class="mb-4" />
     <stylize-selector v-if="preset.advanced" v-model="preset.stylize" class="mb-4" />
-    <wired-selector v-if="preset.advanced" v-model="preset.wired" class="mb-4" />
+    <weird-selector v-if="preset.advanced" v-model="preset.wired" class="mb-4" />
     <chaos-selector v-if="preset.advanced" v-model="preset.chaos" class="mb-4" />
     <image-weight-selector v-if="preset.advanced" v-model="preset.iw" class="mb-4" />
+    <niji-selector v-if="preset.advanced" v-model="preset.niji" class="mb-4" />
     <raw-selector v-if="preset.advanced" v-model="preset.raw" class="mb-4" />
   </div>
 </template>
@@ -23,11 +24,11 @@ import ChaosSelector from './preset/ChaosSelector.vue';
 import ModelSelector from './preset/ModelSelector.vue';
 import QualitySelector from './preset/QualitySelector.vue';
 import ImageWeightSelector from './preset/ImageWeightSelector.vue';
-import WiredSelector from './preset/WiredSelector.vue';
+import WeirdSelector from './preset/WeirdSelector.vue';
 import RawSelector from './preset/RawSelector.vue';
 import AdvancedSelector from './preset/AdvancedSelector.vue';
 import TranslationSelector from './preset/TranslationSelector.vue';
-
+import NijiSelector from './preset/NijiSelector.vue';
 export default defineComponent({
   name: 'PresetPanel',
   components: {
@@ -37,11 +38,12 @@ export default defineComponent({
     VersionSelector,
     StylizeSelector,
     ChaosSelector,
-    WiredSelector,
+    WeirdSelector,
     RawSelector,
     AdvancedSelector,
     ImageWeightSelector,
-    TranslationSelector
+    TranslationSelector,
+    NijiSelector
   },
   props: {
     modelValue: {
diff --git a/src/components/midjourney/PromptInput.vue b/src/components/midjourney/PromptInput.vue
index dbd02ed..7eed2a7 100644
--- a/src/components/midjourney/PromptInput.vue
+++ b/src/components/midjourney/PromptInput.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <h2 class="title">绘图描述</h2>
-    <el-input v-model="value" :rows="3" type="textarea" placeholder="Please input" />
+    <h2 class="title">{{ $t('midjourney.name.prompt') }}</h2>
+    <el-input v-model="value" :rows="5" type="textarea" :placeholder="$t('midjourney.placeholder.prompt')" />
   </div>
 </template>
 
diff --git a/src/components/midjourney/preset/AdvancedSelector.vue b/src/components/midjourney/preset/AdvancedSelector.vue
index 0feb94a..d5889fb 100644
--- a/src/components/midjourney/preset/AdvancedSelector.vue
+++ b/src/components/midjourney/preset/AdvancedSelector.vue
@@ -1,20 +1,22 @@
 <template>
   <div class="field">
-    <h2 class="title">高级模式</h2>
-    <el-switch v-model="value" class="ml-2" />
+    <h2 class="title">{{ $t('midjourney.name.advanced') }}</h2>
+    <el-switch v-model="value" class="value" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSwitch } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
 
 const DEFAULT_ADVANCED = false;
 
 export default defineComponent({
   name: 'AdvancedSelector',
   components: {
-    ElSwitch
+    ElSwitch,
+    InfoIcon
   },
   props: {
     modelValue: {
@@ -61,5 +63,8 @@ export default defineComponent({
   .value {
     flex: 1;
   }
+  .info {
+    width: 20px;
+  }
 }
 </style>
diff --git a/src/components/midjourney/preset/ChaosSelector.vue b/src/components/midjourney/preset/ChaosSelector.vue
index ddf8ea8..6740889 100644
--- a/src/components/midjourney/preset/ChaosSelector.vue
+++ b/src/components/midjourney/preset/ChaosSelector.vue
@@ -1,19 +1,23 @@
 <template>
   <div class="field">
-    <h2 class="title">变异度</h2>
+    <h2 class="title">{{ $t('midjourney.name.chaos') }}</h2>
     <el-slider v-model="value" :min="0" :max="100" :step="1" class="value" />
+    <info-icon :content="$t('midjourney.description.chaos')" class="info" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSlider } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
+
 const DEFAULT_CHAOS = 0;
 
 export default defineComponent({
   name: 'ChaosSelector',
   components: {
-    ElSlider
+    ElSlider,
+    InfoIcon
   },
   props: {
     modelValue: {
diff --git a/src/components/midjourney/preset/ImageWeightSelector.vue b/src/components/midjourney/preset/ImageWeightSelector.vue
index 3a2e593..a9a4846 100644
--- a/src/components/midjourney/preset/ImageWeightSelector.vue
+++ b/src/components/midjourney/preset/ImageWeightSelector.vue
@@ -1,19 +1,23 @@
 <template>
   <div class="field">
-    <h2 class="title">图片权重</h2>
+    <h2 class="title">{{ $t('midjourney.name.imageWeight') }}</h2>
     <el-slider v-model="value" :min="0" :max="2" :step="0.1" class="value" />
+    <info-icon :content="$t('midjourney.description.imageWeight')" class="info" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSlider } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
+
 const DEFAULT_IW = 1;
 
 export default defineComponent({
   name: 'ImageWeightSelector',
   components: {
-    ElSlider
+    ElSlider,
+    InfoIcon
   },
   props: {
     modelValue: {
diff --git a/src/components/midjourney/preset/NijiSelector.vue b/src/components/midjourney/preset/NijiSelector.vue
new file mode 100644
index 0000000..420e1c3
--- /dev/null
+++ b/src/components/midjourney/preset/NijiSelector.vue
@@ -0,0 +1,68 @@
+<template>
+  <div class="field">
+    <h2 class="title">{{ $t('midjourney.name.niji') }}</h2>
+    <el-switch v-model="value" class="value" />
+    <info-icon :content="$t('midjourney.description.niji')" class="info" />
+  </div>
+</template>
+
+<script>
+import { defineComponent } from 'vue';
+import { ElSwitch } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
+
+const DEFAULT_NIJI = false;
+
+export default defineComponent({
+  name: 'RawSelector',
+  components: {
+    ElSwitch,
+    InfoIcon
+  },
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['update:modelValue'],
+  data() {
+    return {
+      value: this.modelValue
+    };
+  },
+  watch: {
+    modelValue(val) {
+      if (val !== this.value) {
+        this.value = val;
+      }
+    },
+    value(val) {
+      this.$emit('update:modelValue', val);
+    }
+  },
+  mounted() {
+    if (this.value === undefined) {
+      this.value = DEFAULT_NIJI;
+    }
+    this.$emit('update:modelValue', this.value);
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.field {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+
+  .title {
+    font-size: 14px;
+    margin-bottom: 0;
+    width: 30%;
+  }
+  .value {
+    flex: 1;
+  }
+}
+</style>
diff --git a/src/components/midjourney/preset/StylizeSelector.vue b/src/components/midjourney/preset/StylizeSelector.vue
index d271159..8ef6d64 100644
--- a/src/components/midjourney/preset/StylizeSelector.vue
+++ b/src/components/midjourney/preset/StylizeSelector.vue
@@ -1,19 +1,23 @@
 <template>
   <div class="field">
-    <h2 class="title">艺术化</h2>
+    <h2 class="title">{{ $t('midjourney.name.stylize') }}</h2>
     <el-slider v-model="value" :min="0" :max="1000" :step="1" class="value" />
+    <info-icon :content="$t('midjourney.description.stylize')" class="info" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSlider } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
+
 const DEFAULT_STYLIZE = 100;
 
 export default defineComponent({
   name: 'StylizeSelector',
   components: {
-    ElSlider
+    ElSlider,
+    InfoIcon
   },
   props: {
     modelValue: {
diff --git a/src/components/midjourney/preset/TranslationSelector.vue b/src/components/midjourney/preset/TranslationSelector.vue
index aa68c49..6f64e06 100644
--- a/src/components/midjourney/preset/TranslationSelector.vue
+++ b/src/components/midjourney/preset/TranslationSelector.vue
@@ -1,25 +1,28 @@
 <template>
   <div class="field">
-    <h2 class="title">自动翻译</h2>
-    <el-switch v-model="value" class="ml-2" />
+    <h2 class="title">{{ $t('midjourney.name.translation') }}</h2>
+    <el-switch v-model="value" class="value" />
+    <info-icon :content="$t('midjourney.description.translation')" class="info" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSwitch } from 'element-plus';
+import InfoIcon from '@/components/common/InfoIcon.vue';
 
-const DEFAULT_ADVANCED = false;
+const DEFAULT_TRANSLATION = true;
 
 export default defineComponent({
   name: 'TranslationSelector',
   components: {
-    ElSwitch
+    ElSwitch,
+    InfoIcon
   },
   props: {
     modelValue: {
       type: Boolean,
-      default: false
+      default: DEFAULT_TRANSLATION
     }
   },
   emits: ['update:modelValue'],
@@ -40,7 +43,7 @@ export default defineComponent({
   },
   mounted() {
     if (this.value === undefined) {
-      this.value = DEFAULT_ADVANCED;
+      this.value = DEFAULT_TRANSLATION;
     }
     this.$emit('update:modelValue', this.value);
   }
diff --git a/src/components/midjourney/preset/WiredSelector.vue b/src/components/midjourney/preset/WeirdSelector.vue
similarity index 75%
rename from src/components/midjourney/preset/WiredSelector.vue
rename to src/components/midjourney/preset/WeirdSelector.vue
index 5d41ac7..3be7215 100644
--- a/src/components/midjourney/preset/WiredSelector.vue
+++ b/src/components/midjourney/preset/WeirdSelector.vue
@@ -1,19 +1,23 @@
 <template>
   <div class="field">
-    <h2 class="title">怪异度</h2>
+    <h2 class="title">{{ $t('midjourney.name.weird') }}</h2>
     <el-slider v-model="value" :min="0" :max="1000" :step="1" class="value" />
+    <info-icon :content="$t('midjourney.description.weird')" class="info" />
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
 import { ElSlider } from 'element-plus';
-const DEFAULT_WIRED = 0;
+import InfoIcon from '@/components/common/InfoIcon.vue';
+
+const DEFAULT_WEIRD = 0;
 
 export default defineComponent({
-  name: 'WiredSelector',
+  name: 'WeirdSelector',
   components: {
-    ElSlider
+    ElSlider,
+    InfoIcon
   },
   props: {
     modelValue: {
@@ -39,7 +43,7 @@ export default defineComponent({
   },
   mounted() {
     if (!this.value) {
-      this.value = DEFAULT_WIRED;
+      this.value = DEFAULT_WEIRD;
     }
     this.$emit('update:modelValue', this.value);
   }
diff --git a/src/i18n/zh/index.ts b/src/i18n/zh/index.ts
index 6bf79c7..bf79d99 100644
--- a/src/i18n/zh/index.ts
+++ b/src/i18n/zh/index.ts
@@ -4,6 +4,7 @@ import conversation from './conversation';
 import application from './application';
 import api from './api';
 import setting from './setting';
+import midjourney from './midjourney';
 
 export default {
   common,
@@ -11,5 +12,6 @@ export default {
   auth,
   application,
   api,
-  setting
+  setting,
+  midjourney
 };
diff --git a/src/i18n/zh/midjourney/description.ts b/src/i18n/zh/midjourney/description.ts
new file mode 100644
index 0000000..8b7b6d0
--- /dev/null
+++ b/src/i18n/zh/midjourney/description.ts
@@ -0,0 +1,23 @@
+export default {
+  aspect: '改变生成图像的宽高比例，默认值取决于模型和模式',
+  chaos: '用于调整生成图像的变异程度，数字越大，生成的图像越独特和意想不到，范围为 0-100，默认为 1',
+  fast: '忽略当前的设置，以快速模式运行单个生成任务，没有默认值',
+  iw: '设置图像提示在生成过程中相对于文本提示的重要性，范围为 0-2，默认为 1',
+  no: '指示生成系统尝试排除某些元素，例如 "--no plants" 将尝试生成不包含植物的图像，没有默认值',
+  quality: '设定渲染图像的质量和所需时间，范围为 .25, .5, 或 1，默认为 1',
+  random:
+    '给提示添加一个随机的基础风格代码，可以使用 "--style random-16", "--style random-64" 或 "--style random-128" 来获取不同长度的随机风格效果，没有默认值',
+  relax: '覆盖当前设置，让系统在放松模式下运行单个任务，没有默认值',
+  repeat: '从一个提示创建多个任务，范围为 1-40，默认为 1',
+  seed: '生成图像的起始视觉噪点，范围为 0-4294967295，默认为随机生成',
+  stop: '在生成过程的任意阶段停止任务，范围为 10-100，默认为 100（即完全生成）',
+  style:
+    '切换 Midjourney 或 Niji 模型的不同版本或风格，例如 "raw", "4a", "4b", "4c", "cute", "expressive", "original", "scenic"，默认值取决于模型和模式',
+  stylize: '调整 Midjourney 默认美学风格在生成任务中的应用强度，范围为 0-1000，默认为 100',
+  tile: '生成可以作为重复平铺使用的图像，以创建无缝的图案，没有默认值',
+  turbo: '覆盖当前设置，以涡轮模式快速运行单个任务，没有默认值',
+  weird: '探索带有实验性质的不常见美学风格，范围为 0-3000，默认为 0',
+  translation: '在生成过程中启用自动翻译，输入为非中文内容时会自动翻译为英文输入给 Midjourney',
+  imageWeight: '调整图像提示相对于文本提示的权重，范围为 0-2，默认为 1',
+  niji: '启用此开关后，生成的图像将使用 Niji 模型，生成动漫风格的图片'
+};
diff --git a/src/i18n/zh/midjourney/index.ts b/src/i18n/zh/midjourney/index.ts
new file mode 100644
index 0000000..87605e9
--- /dev/null
+++ b/src/i18n/zh/midjourney/index.ts
@@ -0,0 +1,6 @@
+import description from './description';
+import name from './name';
+import message from './message';
+import placeholder from './placeholder';
+
+export default { description, name, message, placeholder };
diff --git a/src/i18n/zh/midjourney/message.ts b/src/i18n/zh/midjourney/message.ts
new file mode 100644
index 0000000..504f5b8
--- /dev/null
+++ b/src/i18n/zh/midjourney/message.ts
@@ -0,0 +1,3 @@
+export default {
+  promptPlaceholder: '请输入一句话来描述你想要生成的图片，例如：一只好看的猫'
+};
diff --git a/src/i18n/zh/midjourney/name.ts b/src/i18n/zh/midjourney/name.ts
new file mode 100644
index 0000000..cce8afc
--- /dev/null
+++ b/src/i18n/zh/midjourney/name.ts
@@ -0,0 +1,23 @@
+export default {
+  aspect: '分辨率',
+  chaos: '混乱度',
+  fast: '快速模式',
+  imageWeight: '图像权重',
+  no: '否定提示',
+  quality: '渲染质量',
+  random: '随机风格',
+  relax: '放松模式',
+  repeat: '重复生成',
+  seed: '种子数',
+  stop: '提前停止',
+  style: '风格切换',
+  stylize: '风格化度',
+  tile: '平铺模式',
+  turbo: '涡轮模式',
+  weird: '怪异度',
+  translation: '自动翻译',
+  advanced: '专业模式',
+  niji: '动漫风格',
+  ignore: '忽略内容',
+  prompt: '绘图描述'
+};
diff --git a/src/i18n/zh/midjourney/placeholder.ts b/src/i18n/zh/midjourney/placeholder.ts
new file mode 100644
index 0000000..9613b81
--- /dev/null
+++ b/src/i18n/zh/midjourney/placeholder.ts
@@ -0,0 +1,4 @@
+export default {
+  prompt: '请输入一句话来描述你想要生成的图片，例如：一只好看的猫',
+  ignore: '不想让图像中出现的内容，例如生成一幅街景，但不要有汽车，你可以填写：汽车'
+};
diff --git a/src/operators/midjourney/models.ts b/src/operators/midjourney/models.ts
index cb5b1c3..29d9f26 100644
--- a/src/operators/midjourney/models.ts
+++ b/src/operators/midjourney/models.ts
@@ -13,7 +13,7 @@ export interface IMidjourneyPreset {
   chaos?: number;
   advanced?: boolean;
   quality?: string;
-  wired?: number;
+  weird?: number;
   raw?: boolean;
   iw?: number;
   translation?: boolean;
diff --git a/src/pages/midjourney/Index.vue b/src/pages/midjourney/Index.vue
index 28d6f8f..af728d3 100644
--- a/src/pages/midjourney/Index.vue
+++ b/src/pages/midjourney/Index.vue
@@ -113,8 +113,8 @@ export default defineComponent({
       if (this.preset.stylize) {
         content += ` --stylize ${this.preset.stylize}`;
       }
-      if (this.preset.wired) {
-        content += ` --wired ${this.preset.wired}`;
+      if (this.preset.weird) {
+        content += ` --weird ${this.preset.weird}`;
       }
       if (this.ignore) {
         content += ` --no ${this.ignore}`;
diff --git a/src/plugins/font-awesome.ts b/src/plugins/font-awesome.ts
index fa18017..1ad4b7e 100644
--- a/src/plugins/font-awesome.ts
+++ b/src/plugins/font-awesome.ts
@@ -8,6 +8,7 @@ import {
 } from '@fortawesome/free-regular-svg-icons';
 import {
   faMicrophone as faSolidMicrophone,
+  faInfo as faSolidInfo,
   faStop as faSolidStop,
   faWandMagicSparkles as faSolidWandMagicSparkles,
   faPalette as faSolidPalette,
@@ -55,3 +56,4 @@ library.add(faSolidChevronDown);
 library.add(faSolidPalette);
 library.add(faSolidWandMagicSparkles);
 library.add(faSolidMugSaucer);
+library.add(faSolidInfo);