From 361c2c06c50c3edb70d12e4fcc3d312051cb3547 Mon Sep 17 00:00:00 2001
From: shefengchun <1077478963@qq.com>
Date: Wed, 1 Feb 2023 15:01:00 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0125=E7=BC=A9=E6=94=BE?=
 =?UTF-8?q?=E4=B8=8B=E4=B8=8D=E6=98=BE=E7=A4=BA=E6=BB=91=E5=8A=A8=E6=9D=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FusionSettings/DensityCorrection.vue      | 97 ++++++++++--------
 .../FusionSettings/FourPointCalibration.vue   | 43 ++++----
 .../FusionSettings/FusionLocale.vue           | 28 +++---
 .../FusionSettings/GridSettings.vue           | 26 +----
 .../FusionSettings/SurfaceCorrection.vue      | 66 +++++++------
 src/components/FusionSettingsDialog.vue       | 98 ++++++++++++++-----
 src/i18n/zh-CN/index.ts                       |  2 +-
 7 files changed, 210 insertions(+), 150 deletions(-)

diff --git a/src/components/FusionSettings/DensityCorrection.vue b/src/components/FusionSettings/DensityCorrection.vue
index 186c22a..9ea2ef0 100644
--- a/src/components/FusionSettings/DensityCorrection.vue
+++ b/src/components/FusionSettings/DensityCorrection.vue
@@ -2,47 +2,47 @@
   <div class="row">
     <div class="col-1"></div>
     <div class="col-8 q-pt-md">
-      <div ref="div" style="width: 100%; background-color: aquamarine; height: 100%">
+      <div ref="div" style="width: 100%; background-color: #646464; height: 100%">
         <div style="position: absolute">
-          <vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="20" :x="point_postion[0].x"
+          <vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="30" :x="point_postion[0].x"
             :y="point_postion[0].y" @mousedown="isactivearray[0] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 0)"><span>v1</span>
+            @moveHandler="moveHandler($event, 0)"><p  class="p0 vcolro">↑</p><p class="vcolro p0">V1</p><p class=" vcolro p0">↓</p>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="20" :x="point_postion[1].x"
+          <vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="30" :x="point_postion[1].x"
             :y="point_postion[1].y" @mousedown="isactivearray[1] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 1)"><span>v2</span>
+            @moveHandler="moveHandler($event, 1)"><p  class="p0 vcolro">↑</p><p class="vcolro p0">V2</p><p class="p0 vcolro">↓</p>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="20" :x="point_postion[2].x"
+          <vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="30" :x="point_postion[2].x"
             :y="point_postion[2].y" @mousedown="isactivearray[2] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 2)"><span>v3</span>
+            @moveHandler="moveHandler($event, 2)"><p  class="p0 vcolro">↑</p><p class="vcolro p0">V3</p><p class="p0 vcolro">↓</p>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="20" :x="point_postion[3].x"
+          <vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="30" :x="point_postion[3].x"
             :y="point_postion[3].y" @mousedown="isactivearray[3] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 3)"><span>v4</span>
+            @moveHandler="moveHandler($event, 3)"><p  class="p0 vcolro">↑</p><p class="vcolro p0">V4</p><p class="p0 vcolro">↓</p>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="20" :x="point_postion[4].x"
+          <vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="30" :x="point_postion[4].x"
             :y="point_postion[4].y" @mousedown="isactivearray[4] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 4)"><span>v5</span>
+            @moveHandler="moveHandler($event, 4)"><p  class="p0 vcolro">↑</p><p class="vcolro p0">V5</p><p class="p0 vcolro">↓</p>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="30" :h="20" :x="point_postion[5].x"
+          <vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="40" :h="20" :x="point_postion[5].x"
             :y="point_postion[5].y" @mousedown="isactivearray[5] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 5)"><span>h1</span>
+            @moveHandler="moveHandler($event, 5)"><span class="hcolro">←H1→</span>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="30" :h="20" :x="point_postion[6].x"
+          <vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="40" :h="20" :x="point_postion[6].x"
             :y="point_postion[6].y" @mousedown="isactivearray[6] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 6)"><span>h2</span>
+            @moveHandler="moveHandler($event, 6)"><span class="hcolro">←H2→</span>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="30" :h="20" :x="point_postion[7].x"
+          <vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="40" :h="20" :x="point_postion[7].x"
             :y="point_postion[7].y" @mousedown="isactivearray[7] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 7)"><span>h3</span>
+            @moveHandler="moveHandler($event, 7)"><span class="hcolro">←H3→</span>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="30" :h="20" :x="point_postion[8].x"
+          <vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="40" :h="20" :x="point_postion[8].x"
             :y="point_postion[8].y" @mousedown="isactivearray[8] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 8)"><span>h4</span>
+            @moveHandler="moveHandler($event, 8)"><span class="hcolro">←H4→</span>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[9]" v-if="isshowarray[9]" :w="35" :h="20" :x="point_postion[9].x"
+          <vue3ResizeDrag :isActive="isactivearray[9]" v-if="isshowarray[9]" :w="40" :h="20" :x="point_postion[9].x"
             :y="point_postion[9].y" @mousedown="isactivearray[9] = true" :isResizable="false"
-            @moveHandler="moveHandler($event, 9)"><span>h5</span>
+            @moveHandler="moveHandler($event, 9)"><span class="hcolro">←H5→</span>
           </vue3ResizeDrag>
         </div>
       </div>
@@ -55,7 +55,7 @@
             <div class="col-8">
               <q-input @focus="isactivearray[0] = false" filled type="number" class="q-pt-md" :dense="true"
                 v-model="value[0].y" label="y" lazy-rules />
-              <q-btn dense color="white" @click="reset(0)" text-color="black" :label="$t('reset') + ' v1'" />
+              <q-btn  size="sm" color="white" @click="reset(0)" text-color="black" :label="$t('reset') + ' v1'" />
             </div>
           </div>
         </div>
@@ -65,7 +65,7 @@
             <div class="col-8">
               <q-input @focus="isactivearray[1] = false" filled type="number" class="q-pt-md" :dense="true"
                 v-model="value[1].y" label="y" lazy-rules />
-              <q-btn dense color="white" @click="reset(1)" text-color="black" :label="$t('reset') + ' v2'" />
+              <q-btn  size="sm" color="white" @click="reset(1)" text-color="black" :label="$t('reset') + ' v2'" />
             </div>
           </div>
         </div>
@@ -75,7 +75,7 @@
             <div class="col-8">
               <q-input @focus="isactivearray[2] = false" filled type="number" class="q-pt-md" :dense="true"
                 v-model="value[2].y" label="y" lazy-rules />
-              <q-btn dense color="white" @click="reset(2)" text-color="black" :label="$t('reset') + ' v3'" />
+              <q-btn  size="sm" color="white" @click="reset(2)" text-color="black" :label="$t('reset') + ' v3'" />
             </div>
           </div>
         </div>
@@ -85,7 +85,7 @@
             <div class="col-8">
               <q-input @focus="isactivearray[3] = false" filled type="number" class="q-pt-md" :dense="true"
                 v-model="value[3].y" label="y" lazy-rules />
-              <q-btn dense color="white" @click="reset(3)" text-color="black" :label="$t('reset') + ' v4'" />
+              <q-btn  size="sm" color="white" @click="reset(3)" text-color="black" :label="$t('reset') + ' v4'" />
             </div>
           </div>
         </div>
@@ -95,7 +95,7 @@
             <div class="col-8">
               <q-input @focus="isactivearray[4] = false" filled type="number" class="q-pt-md" :dense="true"
                 v-model="value[4].y" label="y" lazy-rules />
-              <q-btn dense color="white" @click="reset(4)" text-color="black" :label="$t('reset') + ' v5'" />
+              <q-btn  size="sm" color="white" @click="reset(4)" text-color="black" :label="$t('reset') + ' v5'" />
             </div>
           </div>
         </div>
@@ -107,31 +107,31 @@
         <div class="box_son">
           <q-input filled @focus="isactivearray[5] = false" type="number" class="q-pt-md" :dense="true"
             v-model="value[5].x" label="x" lazy-rules />
-          <q-btn dense color="white" @click="reset(5)" text-color="black" :label="$t('reset') + ' h1'" />
+          <q-btn  size="sm" color="white" @click="reset(5)" text-color="black" :label="$t('reset') + ' h1'" />
         </div>
 
         <div class="box_son">
           <q-input filled @focus="isactivearray[6] = false" type="number" class="q-pt-md" :dense="true"
             v-model="value[6].x" label="x" lazy-rules />
-          <q-btn dense color="white" @click="reset(6)" text-color="black" :label="$t('reset') + ' h2'" />
+          <q-btn  size="sm" color="white" @click="reset(6)" text-color="black" :label="$t('reset') + ' h2'" />
         </div>
 
         <div class="box_son">
           <q-input filled @focus="isactivearray[7] = false" type="number" class="q-pt-md" :dense="true"
             v-model="value[7].x" label="x" lazy-rules />
-          <q-btn dense color="white" @click="reset(7)" text-color="black" :label="$t('reset') + ' h3'" />
+          <q-btn  size="sm" color="white" @click="reset(7)" text-color="black" :label="$t('reset') + ' h3'" />
         </div>
 
         <div class="box_son">
           <q-input filled @focus="isactivearray[8] = false" type="number" class="q-pt-md" :dense="true"
             v-model="value[8].x" label="x" lazy-rules />
-          <q-btn dense color="white" @click="reset(8)" text-color="black" :label="$t('reset') + ' h4'" />
+          <q-btn  size="sm" color="white" @click="reset(8)" text-color="black" :label="$t('reset') + ' h4'" />
         </div>
 
         <div class="box_son">
           <q-input filled @focus="isactivearray[9] = false" type="number" class="q-pt-md" :dense="true"
             v-model="value[9].x" label="x" lazy-rules />
-          <q-btn dense color="white" @click="reset(9)" text-color="black" :label="$t('reset') + ' h5'" />
+          <q-btn  size="sm" color="white" @click="reset(9)" text-color="black" :label="$t('reset') + ' h5'" />
         </div>
 
         <div class="box_son q-pt-xl">
@@ -156,6 +156,18 @@
   width: 10rem;
   padding-right: 1rem;
 }
+.vcolro{
+  color: #d50000;
+}
+.hcolro{
+  color: #00c853;
+  font-size: 5px;
+}
+.p0{
+  margin: 0;
+  padding: 0;
+  line-height: 8px;
+}
 </style>
 <script lang="ts">
 import {
@@ -440,10 +452,10 @@ export default defineComponent({
 
     onMounted(() => {
       initialization();
-      Proportion.value.x = config.width / (div.value.offsetWidth - 25);
-      Proportion.value.y = config.height / (div.value.offsetHeight - 25);
-      let Width = (div.value.offsetWidth - 25) / 4;
-      let Height = (div.value.offsetHeight - 25) / 4;
+      Proportion.value.x = config.width / (div.value.offsetWidth - 40);
+      Proportion.value.y = config.height / (div.value.offsetHeight - 30);
+      let Width = (div.value.offsetWidth - 40) / 4;
+      let Height = (div.value.offsetHeight - 30) / 4;
       for (
         let index = 0;
         index < config.hor_density.length + config.ver_density.length;
@@ -466,10 +478,10 @@ export default defineComponent({
         return (() => {
           if (div != null) {
             initialization();
-            Proportion.value.x = config.width / (div.value.offsetWidth - 25);
-            Proportion.value.y = config.height / (div.value.offsetHeight - 25);
-            let Width = (div.value.offsetWidth - 25) / 4;
-            let Height = (div.value.offsetHeight - 25) / 4;
+            Proportion.value.x = config.width / (div.value.offsetWidth - 40);
+            Proportion.value.y = config.height / (div.value.offsetHeight - 30);
+            let Width = (div.value.offsetWidth - 40) / 4;
+            let Height = (div.value.offsetHeight - 30) / 4;
             for (
               let index = 0;
               index < config.hor_density.length + config.ver_density.length;
@@ -664,7 +676,11 @@ export default defineComponent({
       }
       save_set_cache();
     };
-
+    const creat_svg=(index:Number,type:string):string=>{
+      //btoa(unescape(encodeURIComponent(str)))
+      //'data:image/svg+xml;base64,'+btoa(`<svg width="50" height="50"xmlns="http://www.w3.org/2000/svg"><text font-size="14" fill="#d50000"><tspan x="3" y="10">↑</tspan><tspan x="0" y="20">v${index}</tspan><tspan x="3" y="30">↓</tspan></text></svg>`)
+      return type=='h'?`data:image/svg+xml,%3Csvg width='50' height='14' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='50%25' y='50%25' font-size='14' fill='%2300c853' font-family='system-ui, sans-serif' text-anchor='middle' dominant-baseline='middle'%3E←h${index}→%3C/text%3E%3C/svg%3E`:'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iNTAiCiAgICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPHRleHQgZm9udC1zaXplPSIxNCIgZmlsbD0iI2Q1MDAwMCI+CiAgICAgICAgPHRzcGFuIHg9IjMiIHk9IjEwIj7ihpE8L3RzcGFuPgogICAgICAgIDx0c3BhbiB4PSIwIiB5PSIyMCI+djE8L3RzcGFuPgogICAgICAgIDx0c3BhbiB4PSIzIiB5PSIzMCI+4oaTPC90c3Bhbj4KICAgIDwvdGV4dD4KPC9zdmc+'
+    }
     initialization();
     return {
       model,
@@ -678,6 +694,7 @@ export default defineComponent({
       isshowarray,
       isactivearray,
       save,
+      creat_svg
     };
   },
 });
diff --git a/src/components/FusionSettings/FourPointCalibration.vue b/src/components/FusionSettings/FourPointCalibration.vue
index 75cf35a..8e79fb7 100644
--- a/src/components/FusionSettings/FourPointCalibration.vue
+++ b/src/components/FusionSettings/FourPointCalibration.vue
@@ -4,7 +4,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         style="text-align: center"
         :dense="true"
         @focus="isactivearray[0] = false"
@@ -15,7 +15,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         :dense="true"
         @focus="isactivearray[0] = false"
         v-model="four[0].y"
@@ -23,6 +23,7 @@
         lazy-rules
       />
       <q-btn
+      size="sm" dense
         color="white"
         @click="reset(0)"
         text-color="black"
@@ -34,7 +35,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         :dense="true"
         @focus="isactivearray[1] = false"
         v-model="four[1].x"
@@ -44,7 +45,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         :dense="true"
         @focus="isactivearray[1] = false"
         v-model="four[1].y"
@@ -52,6 +53,7 @@
         lazy-rules
       />
       <q-btn
+      size="sm" dense
         color="white"
         @click="reset(1)"
         text-color="black"
@@ -61,59 +63,59 @@
 
     <div class="col-2"></div>
     <div class="col-8">
-      <div ref="div" style="background-color: #7fffd4; height: 40vh">
+      <div ref="div" style="background-color: #646464; height: 40vh">
         <div style="position: absolute">
           <vue3ResizeDrag
             v-if="isshowarray[0]"
             :isActive="isactivearray[0]"
             @mousedown="activeMouseDown(0)"
             @mouseUpHandler="mouseUpHandler(0)"
-            :w="30"
+            :w="20"
             :h="20"
             :x="points[0].x"
             :y="points[0].y"
             :isResizable="false"
             @moveHandler="moveHandler_1"
-            ><span>{{ $t("point") }}1</span>
+            ><div class="point">1</div>
           </vue3ResizeDrag>
           <vue3ResizeDrag
             v-if="isshowarray[1]"
             :isActive="isactivearray[1]"
             @mousedown="activeMouseDown(1)"
             @mouseUpHandler="mouseUpHandler(1)"
-            :w="30"
+            :w="20"
             :h="20"
             :x="points[1].x"
             :y="points[1].y"
             :isResizable="false"
             @moveHandler="moveHandler_2"
-            ><span>{{ $t("point") }}2</span>
+            ><div class="point">2</div>
           </vue3ResizeDrag>
           <vue3ResizeDrag
             v-if="isshowarray[2]"
             :isActive="isactivearray[2]"
             @mousedown="activeMouseDown(2)"
             @mouseUpHandler="mouseUpHandler(2)"
-            :w="30"
+            :w="20"
             :h="20"
             :x="points[2].x"
             :y="points[2].y"
             :isResizable="false"
             @moveHandler="moveHandler_3"
-            ><span>{{ $t("point") }}3</span>
+            ><div class="point">3</div>
           </vue3ResizeDrag>
           <vue3ResizeDrag
             v-if="isshowarray[3]"
             :isActive="isactivearray[3]"
             @mousedown="activeMouseDown(3)"
             @mouseUpHandler="mouseUpHandler(3)"
-            :w="30"
+            :w="20"
             :h="20"
             :x="points[3].x"
             :y="points[3].y"
             :isResizable="false"
             @moveHandler="moveHandler_4"
-            ><span>{{ $t("point") }}4</span>
+            ><div class="point">4</div>
           </vue3ResizeDrag>
         </div>
       </div>
@@ -124,7 +126,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         :dense="true"
         @focus="isactivearray[2] = false"
         v-model="four[2].x"
@@ -134,7 +136,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class="q-pt-xs"
         :dense="true"
         @focus="isactivearray[2] = false"
         v-model="four[2].y"
@@ -142,6 +144,7 @@
         lazy-rules
       />
       <q-btn
+      size="sm" dense
         color="white"
         @click="reset(2)"
         text-color="black"
@@ -150,6 +153,7 @@
     </div>
     <div class="col-8">
       <q-btn
+      size="sm" dense
         color="white"
         @click="resetall"
         text-color="black"
@@ -160,7 +164,7 @@
       <q-input
         filled
         type="number"
-        class="q-pt-md"
+        class=""
         :dense="true"
         @focus="isactivearray[3] = false"
         v-model="four[3].x"
@@ -178,6 +182,7 @@
         lazy-rules
       />
       <q-btn
+      size="sm" dense
         color="white"
         @click="reset(3)"
         text-color="black"
@@ -187,7 +192,11 @@
   </div>
 </template>
 
-<style scoped></style>
+<style scoped>
+.point{
+  width: 100%;height: 100%;border-radius: 50%;background: #0000ff;color: aliceblue;
+}
+</style>
 <script lang="ts">
 import vue3ResizeDrag from "src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
 import { dom } from "quasar";
diff --git a/src/components/FusionSettings/FusionLocale.vue b/src/components/FusionSettings/FusionLocale.vue
index 2fe8eef..1fd4470 100644
--- a/src/components/FusionSettings/FusionLocale.vue
+++ b/src/components/FusionSettings/FusionLocale.vue
@@ -11,7 +11,7 @@
                   <q-toggle class="float-right" v-model="array[0].isshow" label="" />
                 </div>
                 <div class="col-6">
-                  <q-input filled type="number" :autofocus="group == 0" :bg-color="group == 0 ? 'cyan-1' : ''"
+                  <q-input dense filled type="number" :autofocus="group == 0" :bg-color="group == 0 ? 'cyan-1' : ''"
                     @focus="group = 0" v-model="array[0].value" :label="$t('upper fusion zone parameters')" lazy-rules
                     :rules="[
                       (val) =>
@@ -33,7 +33,7 @@
                   <q-toggle class="float-right" v-model="array[1].isshow" label="" />
                 </div>
                 <div class="col-6">
-                  <q-input filled type="number" :autofocus="group == 1" :bg-color="group == 1 ? 'cyan-1' : ''"
+                  <q-input dense filled type="number" :autofocus="group == 1" :bg-color="group == 1 ? 'cyan-1' : ''"
                     @focus="group = 1" v-model="array[1].value" :label="$t('Left fusion Band Parameters')" lazy-rules
                     :rules="[
                       (val) =>
@@ -51,7 +51,7 @@
                   <q-toggle class="float-right" v-model="array[2].isshow" label="" />
                 </div>
                 <div class="col-6">
-                  <q-input filled type="number" :autofocus="group == 2" :bg-color="group == 2 ? 'cyan-1' : ''"
+                  <q-input dense filled type="number" :autofocus="group == 2" :bg-color="group == 2 ? 'cyan-1' : ''"
                     @focus="group = 2" v-model="array[2].value" :label="$t('Right fusion Band Parameters')" lazy-rules
                     :rules="[
                       (val) =>
@@ -75,7 +75,7 @@
                   <q-toggle class="float-right" v-model="array[3].isshow" label="" />
                 </div>
                 <div class="col-6">
-                  <q-input filled type="number" :autofocus="group == 3" :bg-color="group == 3 ? 'cyan-1' : ''"
+                  <q-input dense filled type="number" :autofocus="group == 3" :bg-color="group == 3 ? 'cyan-1' : ''"
                     @focus="group = 3" v-model="array[3].value" :label="$t('Lower fusion Zone Parameters')" lazy-rules
                     :rules="[
                       (val) =>
@@ -92,29 +92,29 @@
       </div>
     </div>
     <div class="col-4 offset-4" v-if="group != 4">
-      <p class="text-center">{{ $t("Set Fusion Band Parameters") }}</p>
+      <p class="text-center" style="margin: 0 0 8;">{{ $t("Set Fusion Band Parameters") }}</p>
       <div style="display: flex; justify-content: space-evenly">
         <div>
-          <div><q-btn color="white" @click="add('alpha')" text-color="black" label="↑" /></div>
-          <q-slider v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
+          <div><q-btn size="sm"  color="white" @click="add('alpha')" text-color="black" label="↑" /></div>
+          <q-slider style="height: 10rem;"  v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
             vertical reverse label-always />
-          <div><q-btn color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div>
+          <div><q-btn size="sm"  color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div>
           <p class="text-center">alpha</p>
         </div>
 
         <div>
-          <div><q-btn color="white" @click="add('p')" text-color="black" label="↑" /></div>
-          <q-slider v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
+          <div><q-btn size="sm"  color="white" @click="add('p')" text-color="black" label="↑" /></div>
+          <q-slider style="height: 10rem;" v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
             vertical reverse label-always />
-          <div><q-btn color="white" @click="reduce('p')" text-color="black" label="↓" /></div>
+          <div><q-btn size="sm"  color="white" @click="reduce('p')" text-color="black" label="↓" /></div>
           <p class="text-center">p</p>
         </div>
 
         <div>
-          <div><q-btn color="white" @click="add('gamma')" text-color="black" label="↑" /></div>
-          <q-slider v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green"
+          <div><q-btn size="sm"  color="white" @click="add('gamma')" text-color="black" label="↑" /></div>
+          <q-slider style="height: 10rem;" v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green"
             vertical reverse label-always />
-          <div><q-btn color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div>
+          <div><q-btn size="sm"  color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div>
           <p class="text-center">gamma</p>
         </div>
       </div>
diff --git a/src/components/FusionSettings/GridSettings.vue b/src/components/FusionSettings/GridSettings.vue
index 685762e..a6fed78 100644
--- a/src/components/FusionSettings/GridSettings.vue
+++ b/src/components/FusionSettings/GridSettings.vue
@@ -44,30 +44,6 @@
             </div>
           </div>
         </div>
-        <!-- <div class="col-12">
-          <div class="row" style="min-height: 40px;">
-            <div class="col-4"></div>
-            <div class="col-4 q-pt-sm">
-              <div class="row">
-                <div class="col-4"><span>{{ $t('center line color') }}</span></div>
-                <div class="col-8 border" @click="isshowhex = true; index = 2" :style="{ 'background-color': color[2] }"></div>
-              </div>
-            </div>
-            <div><q-checkbox v-model="RowsColumns[2]" @update:model-value="send_off(2)" /></div>
-          </div>
-        </div> -->
-        <!-- <div class="col-12">
-          <div class="row" style="min-height: 40px;">
-            <div class="col-4"></div>
-            <div class="col-4 q-pt-sm">
-              <div class="row">
-                <div class="col-4"><span>{{ $t('center circle color') }}</span></div>
-                <div class="col-8 border" @click="isshowhex = true; index = 3" :style="{ 'background-color': color[3] }"></div>
-              </div>
-            </div>
-            <div><q-checkbox v-model="RowsColumns[3]" @update:model-value="send_off(3)" /></div>
-          </div>
-        </div> -->
       </div>
     </div>
     <div v-if="isshowhex" style="margin: 0 auto;text-align: center;"><q-color no-header-tabs no-footer
@@ -163,8 +139,10 @@ export default defineComponent({
       model[0] = Number(server_conf.blending_grids_row)
       model[1] = Number(server_conf.blending_grids_column)
       color[0] = server_conf.blending_grids_line_color
+
       RowsColumns[0] = server_conf.blending_grids_show_row === "false" ? false : true
       RowsColumns[1] = server_conf.blending_grids_show_column === "false" ? false : true
+
     }
     use_server_config()
 
diff --git a/src/components/FusionSettings/SurfaceCorrection.vue b/src/components/FusionSettings/SurfaceCorrection.vue
index 48fa5ba..7c4a83a 100644
--- a/src/components/FusionSettings/SurfaceCorrection.vue
+++ b/src/components/FusionSettings/SurfaceCorrection.vue
@@ -57,43 +57,43 @@
       </div>
     </div>
     <div class="col-8">
-      <div ref="div" style="background-color: #7fffd4; height: 40vh">
+      <div ref="div" style="background-color: #646464; height: 40vh">
         <div style="position: absolute">
-          <vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="20" :x="ninepostion[0].x"
+          <vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="20" :h="20" :x="ninepostion[0].x"
             :y="ninepostion[0].y" @mousedown="activeMouseDown(0)" :isResizable="false" @moveHandler="moveHandler_1">
-            <span>{{ $t("point") }}1</span>
+            <div class="point">1</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="20" :x="ninepostion[1].x"
+          <vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="20" :h="20" :x="ninepostion[1].x"
             :y="ninepostion[1].y" @mousedown="activeMouseDown(1)" :isResizable="false" @moveHandler="moveHandler_2">
-            <span>{{ $t("point") }}2</span>
+            <div class="point">2</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="20" :x="ninepostion[2].x"
+          <vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="20" :h="20" :x="ninepostion[2].x"
             :y="ninepostion[2].y" @mousedown="activeMouseDown(2)" :isResizable="false" @moveHandler="moveHandler_3">
-            <span>{{ $t("point") }}3</span>
+            <div class="point">3</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="20" :x="ninepostion[3].x"
+          <vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="20" :h="20" :x="ninepostion[3].x"
             :y="ninepostion[3].y" @mousedown="activeMouseDown(3)" :isResizable="false" @moveHandler="moveHandler_4">
-            <span>{{ $t("point") }}4</span>
+            <div class="point">4</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="20" :x="ninepostion[4].x"
+          <vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="20" :h="20" :x="ninepostion[4].x"
             :y="ninepostion[4].y" @mousedown="activeMouseDown(4)" :isResizable="false" @moveHandler="moveHandler_5">
-            <span>{{ $t("point") }}5</span>
+            <div class="point">5</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="30" :h="20" :x="ninepostion[5].x"
+          <vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="20" :h="20" :x="ninepostion[5].x"
             :y="ninepostion[5].y" @mousedown="activeMouseDown(5)" :isResizable="false" @moveHandler="moveHandler_6">
-            <span>{{ $t("point") }}6</span>
+            <div class="point">6</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="30" :h="20" :x="ninepostion[6].x"
+          <vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="20" :h="20" :x="ninepostion[6].x"
             :y="ninepostion[6].y" @mousedown="activeMouseDown(6)" :isResizable="false" @moveHandler="moveHandler_7">
-            <span>{{ $t("point") }}7</span>
+            <div class="point">7</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="30" :h="20" :x="ninepostion[7].x"
+          <vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="20" :h="20" :x="ninepostion[7].x"
             :y="ninepostion[7].y" @mousedown="activeMouseDown(7)" :isResizable="false" @moveHandler="moveHandler_8">
-            <span>{{ $t("point") }}8</span>
+            <div class="point">8</div>
           </vue3ResizeDrag>
-          <vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="30" :h="20" :x="ninepostion[8].x"
+          <vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="20" :h="20" :x="ninepostion[8].x"
             :y="ninepostion[8].y" @mousedown="activeMouseDown(8)" :isResizable="false" @moveHandler="moveHandler_9">
-            <span>{{ $t("point") }}9</span>
+            <div class="point">9</div>
           </vue3ResizeDrag>
         </div>
       </div>
@@ -151,7 +151,9 @@
 </template>
 
 <style scoped>
-
+.point{
+  width: 100%;height: 100%;border-radius: 50%;background: #00ff00;color: aliceblue;
+}
 </style>
 <script lang="ts">
 import vue3ResizeDrag from "/src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
@@ -477,35 +479,35 @@ export default defineComponent({
       ninepostion.value[0].x = 0;
       ninepostion.value[0].y = 0;
 
-      ninepostion.value[1].x = div.value.offsetWidth / 2 - 25;
+      ninepostion.value[1].x = div.value.offsetWidth / 2 - 20;
       ninepostion.value[1].y = 0;
 
-      ninepostion.value[2].x = div.value.offsetWidth - 25;
+      ninepostion.value[2].x = div.value.offsetWidth - 20;
       ninepostion.value[2].y = 0;
 
       ninepostion.value[3].x = 0;
       ninepostion.value[3].y = div.value.offsetHeight / 2 - 8;
 
-      ninepostion.value[4].x = div.value.offsetWidth / 2 - 25;
+      ninepostion.value[4].x = div.value.offsetWidth / 2 - 20;
       ninepostion.value[4].y = div.value.offsetHeight / 2 - 8;
 
-      ninepostion.value[5].x = div.value.offsetWidth - 25;
+      ninepostion.value[5].x = div.value.offsetWidth - 20;
       ninepostion.value[5].y = div.value.offsetHeight / 2;
 
       ninepostion.value[6].x = 0;
-      ninepostion.value[6].y = div.value.offsetHeight - 25;
+      ninepostion.value[6].y = div.value.offsetHeight - 20;
 
       ninepostion.value[7].x = div.value.offsetWidth / 2 - 8;
-      ninepostion.value[7].y = div.value.offsetHeight - 25;
+      ninepostion.value[7].y = div.value.offsetHeight - 20;
 
-      ninepostion.value[8].x = div.value.offsetWidth - 25;
-      ninepostion.value[8].y = div.value.offsetHeight - 25;
+      ninepostion.value[8].x = div.value.offsetWidth - 20;
+      ninepostion.value[8].y = div.value.offsetHeight - 20;
 
-      Proportion.value.x = config.width / (div.value.offsetWidth - 25);
-      Proportion.value.y = config.height / (div.value.offsetHeight - 25);
+      Proportion.value.x = config.width / (div.value.offsetWidth - 20);
+      Proportion.value.y = config.height / (div.value.offsetHeight - 20);
 
-      centor.value.x = (config.width * 2) / (div.value.offsetWidth + 25);
-      centor.value.y = (config.height * 2) / (div.value.offsetHeight + 25);
+      centor.value.x = (config.width * 2) / (div.value.offsetWidth + 20);
+      centor.value.y = (config.height * 2) / (div.value.offsetHeight + 20);
 
       for (let index = 0; index < defaultninepostion.value.length; index++) {
         defaultninepostion.value[index].x = ninepostion.value[index].x;
diff --git a/src/components/FusionSettingsDialog.vue b/src/components/FusionSettingsDialog.vue
index f2f3263..7aefb92 100644
--- a/src/components/FusionSettingsDialog.vue
+++ b/src/components/FusionSettingsDialog.vue
@@ -4,9 +4,12 @@
       if (evt.keyCode == 27) {
         show_dialog = false;
       }
+      if (evt.keyCode == 17) {
+        record_times++
+      }
     }
   ">
-    <q-card class="" style="max-width: 90vw">
+    <q-card class="" style="max-width: 90vw;padding: 0;">
       <q-form>
         <q-card-section class="q-ma-none q-pa-sm">
           <div class="row">
@@ -15,20 +18,19 @@
             </div>
 
             <q-space />
-            <q-btn flat round icon="close" color="red" @click="clear()" v-close-popup>
+            <q-btn size="sm" dense flat round icon="close" color="red" @click="clear()" v-close-popup>
               <q-tooltip>
                 {{ $t("close") }}
               </q-tooltip>
             </q-btn>
-            <div></div>
           </div>
         </q-card-section>
 
         <q-separator />
         <!-- height: 80vh -->
-        <q-card-section class="scroll" style="width: 80vw">
+        <q-card-section class="scroll" style="width: 60vw;padding: 0;">
           <div class="row" style="border: 1px solid #b0bec5; text-align: center">
-            <div class="col-3" style="border-right: 1px solid #b0bec5">
+            <div class="col-2" style="border-right: 1px solid #b0bec5">
               <p class="text-center">{{ $t("Projector") }}</p>
               <!-- row 在前col在后 -->
               <div v-for="(item, index_row) in config.row">
@@ -43,7 +45,7 @@
                 }}<q-checkbox v-model="EnableBlending" />
               </div>
             </div>
-            <div class="col-9">
+            <div class="col-10">
               <div class="q-ta-md">
                 <q-btn-toggle :disable="!$store.state.enablefusion" no-caps v-model="options" toggle-color="primary"
                   :options="[
@@ -73,15 +75,17 @@
         <q-separator />
 
         <q-card-actions align="right">
-          <span>{{ $t("Whether to hide the desktop") }}</span><q-checkbox style="justify-content: flex-start"
-            v-model="hide_desktop_value" @click="send_hide_desktop" />
-          <span>{{ $t("disable blending params") }}</span>
-          <q-checkbox style="justify-content: flex-start" v-model="disable_blending_params"
-            @click="send_disable_blending_params" />
-          <span>{{ $t("show blending grids") }}</span>
-          <q-checkbox style="justify-content: flex-start" v-model="show_blending_grids"
-            @click="send_show_blending_grids" />
+            <span  v-show="isdebug">{{ $t("Whether to hide the desktop") }}</span><q-checkbox  v-show="isdebug" style="justify-content: flex-start"
+              v-model="hide_desktop_value" @click="send_hide_desktop" />
+            <span>{{ $t("disable blending params") }}</span>
+            <q-checkbox style="justify-content: flex-start" v-model="disable_blending_params"
+              @click="send_disable_blending_params" />
+            <span>{{ $t("show blending grids") }}</span>
+            <q-checkbox style="justify-content: flex-start" v-model="show_blending_grids"
+              @click="send_show_blending_grids" />
           <div class="q-space" data-v-39efcd1f=""></div>
+          <div v-show="!isdebug" class="q-space" data-v-39efcd1f=""></div>
+          <div v-show="!isdebug" class="q-space" data-v-39efcd1f=""></div>
           <q-btn color="white" @click="resetall" text-color="black" :label="$t('resetall config')" />
           <div class="q-space" data-v-39efcd1f=""></div>
           <q-btn flat :label="$t('Select saved configuration')" no-caps color="primary"
@@ -99,13 +103,13 @@
           <div class="text-h6">{{ $t('Whether to save the configuration') }}</div>
         </q-card-section>
         <q-card-section class="q-pt-none">
-          <q-input filled v-model="save_name" :label="$t('New Please enter a name')" />
-          <q-select v-show="save_name.length == 0" filled v-model="save_cover_name" :options="plan_list"
-          :label="$t('Please select an override')" />
+          <q-select filled :model-value="save_cover_name" use-input hide-selected fill-input input-debounce="0"
+            :options="plan_list_op" @filter="filterFn" @input-value="setModel">
+          </q-select>
         </q-card-section>
         <q-card-actions align="right" class="bg-white text-teal">
           <q-btn flat :label="$t('Cancel')" color="primary" v-close-popup />
-          <q-btn flat :label="$t('save')" color="primary" v-close-popup />
+          <q-btn flat :label="$t('save')" @click="saveconfig" color="primary" v-close-popup />
         </q-card-actions>
       </q-card>
     </q-dialog>
@@ -241,6 +245,7 @@ export default defineComponent({
       set?.SaveBlendingConfig("");
       //show_dialog.value = false;
       clear();
+      save_cover_name.value = save_name.value = ''
       set?.GetBlendingConfig("").then((res) => {
         let tmp = JSON.parse(res ? res.config : "");
         EnableBlending.value = tmp.enable;
@@ -262,6 +267,7 @@ export default defineComponent({
       } catch (error) { }
     };
     const clear = () => {
+      record_times.value = 0
       show_blending_grids.value = false;
       send_show_blending_grids();
       $store.commit("setSelectedProjector", "0/0");
@@ -310,14 +316,59 @@ export default defineComponent({
         });
       }, 1000);
     });
-    const save_cover_name = ref(" ")
+    const save_cover_name = ref("")
     const plan_list = [
-      'Google', 'Facebook', 'Twitter', 'Apple', 'Oracle'
+      '1'
     ]
     const apply_the_selected_configuration = () => {
       //这里根据选择的配置 应用
+
+      //console.log(select_configuration_name.value)
+      set?.ApplyBlendingScene(select_configuration_name.value);
+
+      let tmp = options.value
+      options.value = ""
+      getconfig()
+      setTimeout(() => {
+        options.value = tmp
+      }, 100);
     }
+    const plan_list_op = ref(plan_list)
+    const filterFn = (val: any, update: any, abort: any) => {
+      update(() => {
+        const needle = val.toLocaleLowerCase()
+        plan_list_op.value = plan_list.filter(v => v.toLocaleLowerCase().indexOf(needle) > -1)
+      })
+    }
+    const record_times = ref(0)
+    const setModel = (val: string) => {
+      save_cover_name.value = val
+    }
+
+    const get_scenes = () => {
+      set?.EnumBlendingScene().then((res) => {
+        if (res == null || res.scenes.length == 0) return
+        plan_list.splice(0, plan_list.length);
+        for (let index = 0; index < res.scenes.length; index++) {
+          plan_list.push(res.scenes[index]);
+        }
+      })
+    }
+    get_scenes()
+    const saveconfig = () => {
+      //save_cover_name
+
+    }
+    const isdebug = computed(() => {
+      let tmp = JSON.parse($store.state.fusion_configuration)
+      let str ='debug@show_mask'
+      return tmp.options[str]=='1'|| record_times.value>2
+    })
+
+
     return {
+      filterFn,
+      setModel,
       send_hide_desktop,
       hide_desktop_value,
       send_disable_blending_params,
@@ -339,8 +390,11 @@ export default defineComponent({
       plan_list,
       select_configuration,
       select_configuration_name,
-      apply_the_selected_configuration
-
+      apply_the_selected_configuration,
+      plan_list_op,
+      record_times,
+      saveconfig,
+      isdebug
     };
   },
 });
diff --git a/src/i18n/zh-CN/index.ts b/src/i18n/zh-CN/index.ts
index 8b11266..9b8ae26 100644
--- a/src/i18n/zh-CN/index.ts
+++ b/src/i18n/zh-CN/index.ts
@@ -707,5 +707,5 @@ export default {
   "save":"保存",
   "Whether to save the configuration":"是否保存配置",
   "New Please enter a name":"新建 请输入名称",
-  "Please select an override":"请选择覆盖"
+  "Please select an override":"请选择覆盖",
 };