From f51c16ea1821f1b260348c0fe8f726fc46018015 Mon Sep 17 00:00:00 2001
From: shefengchun <1077478963@qq.com>
Date: Wed, 4 Jan 2023 11:02:27 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84web=E7=AB=AF=E8=9E=8D?=
 =?UTF-8?q?=E5=90=88=20demo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FusionSettings/DensityCorrection.vue      |  79 +++---
 .../FusionSettings/FourPointCalibration.vue   | 100 ++++---
 .../FusionSettings/FusionLocale.vue           | 155 ++++++----
 .../FusionSettings/GridSettings.vue           |   1 -
 .../FusionSettings/ProjectorItem.vue          |   4 -
 .../FusionSettings/SurfaceCorrection.vue      | 164 ++++++-----
 src/components/FusionSettingsDialog.vue       | 267 ++++++++++--------
 src/i18n/en-US/index.ts                       |   6 +-
 src/i18n/zh-CN/index.ts                       |   6 +-
 src/third_lib/calculateposition/index.js      |  24 --
 10 files changed, 464 insertions(+), 342 deletions(-)
 delete mode 100644 src/third_lib/calculateposition/index.js

diff --git a/src/components/FusionSettings/DensityCorrection.vue b/src/components/FusionSettings/DensityCorrection.vue
index 97c8359..8651eed 100644
--- a/src/components/FusionSettings/DensityCorrection.vue
+++ b/src/components/FusionSettings/DensityCorrection.vue
@@ -1,56 +1,71 @@
 <template>
     <div class="row">
-        <div class="col-2 q-pa-xl"></div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg"></div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[0]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[1]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[2]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl"> </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[3]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
+
+        
+
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg"> </div>
+        <div class="col-2 q-pa-lg">
+            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[3]" label="" lazy-rules />
+        </div>
+
+
+
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[4]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[5]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[6]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[7]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
+        <div class="col-2 q-pa-lg">
             <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[8]" label="" lazy-rules />
         </div>
-        <div class="col-2 q-pa-xl">
-            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[9]" label="" lazy-rules />
+        <div class="col-2 q-pa-lg">
+            <!-- <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[9]" label="" lazy-rules /> -->
         </div>
-        <!-- ?? -->
+
+
 
     </div>
 </template>
diff --git a/src/components/FusionSettings/FourPointCalibration.vue b/src/components/FusionSettings/FourPointCalibration.vue
index 89be1b2..80f355e 100644
--- a/src/components/FusionSettings/FourPointCalibration.vue
+++ b/src/components/FusionSettings/FourPointCalibration.vue
@@ -8,7 +8,18 @@
             <q-btn color="white" @click="reset(0)" text-color="black" :label="$t('reset')" />
         </div>
         <div class="col-8">
-            <div ref="div" style="background-color: #7fffd4;height: 60vh;">
+
+        </div>
+        <div class="col-2">
+            <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[1] = false"
+                v-model="four[1].x" label="x" lazy-rules />
+            <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[1] = false"
+                v-model="four[1].y" label="y" lazy-rules />
+            <q-btn color="white" @click="reset(1)" text-color="black" :label="$t('reset')" />
+        </div>
+
+        <div class="col-2"></div>
+        <div class="col-8">            <div ref="div" style="background-color: #7fffd4;height: 40vh;">
                 <div style="position:absolute;">
                     <vue3ResizeDrag v-if="isshowarray[0]" :isActive="isactivearray[0]" @mousedown="activeMouseDown(0)"
                         @mouseUpHandler="mouseUpHandler(0)" :w="30" :h="20" :x="x1" :y="y1" :isResizable="false"
@@ -24,15 +35,9 @@
                         @mouseUpHandler="mouseUpHandler(3)" :w="30" :h="20" :x="point4.x" :y="point4.y"
                         :isResizable="false" @moveHandler="moveHandler_4"><span>{{$t('point')}}4</span> </vue3ResizeDrag>
                 </div>
-            </div>
-        </div>
-        <div class="col-2">
-            <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[1] = false"
-                v-model="four[1].x" label="x" lazy-rules />
-            <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[1] = false"
-                v-model="four[1].y" label="y" lazy-rules />
-            <q-btn color="white" @click="reset(1)" text-color="black" :label="$t('reset')" />
-        </div>
+            </div></div>
+        <div class="col-2"></div>
+
         <div class="col-2">
             <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[2] = false"
                 v-model="four[2].x" label="x" lazy-rules />
@@ -41,8 +46,7 @@
             <q-btn color="white" @click="reset(2)" text-color="black" :label="$t('reset')" />
         </div>
         <div class="col-8">
-            <!-- <div style="background-color: #7fffd4;height: 100%;">
-                </div> -->
+            <q-btn color="white"  @click="resetall" text-color="black" :label="$t('resetall')" /><q-btn color="white" @click="save" text-color="black" :label="$t('save config')" />
         </div>
         <div class="col-2">
             <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[3] = false"
@@ -51,12 +55,6 @@
                 v-model="four[3].y" label="y" lazy-rules />
             <q-btn color="white" @click="reset(3)" text-color="black" :label="$t('reset')" />
         </div>
-
-
-
-        <!-- <div class="col-6 q-pa-xl">
-            <q-btn color="white" text-color="black" label="重置" />
-        </div> -->
     </div>
 </template>
 
@@ -65,7 +63,6 @@
 </style>
 <script lang="ts">
 import vue3ResizeDrag from "src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
-import { getElementLeft, getElementTop } from "src/third_lib/calculateposition/index";
 import { dom } from 'quasar'
 
 import { defineComponent, ref, watch, computed, defineProps, withDefaults, onMounted, reactive } from "vue";
@@ -88,6 +85,8 @@ export default defineComponent({
         let set = GlobalData.getInstance().getCurrentClient();
         const for_1 = computed(() => { })
         let four = ref([{ x: 0, y: 1080 }, { x: 1920, y: 1080 }, { x: 0, y: 0 }, { x: 1920, y: 0 }]);
+        let defaultfour = ref([{ x: 0, y: 1080 }, { x: 1920, y: 1080 }, { x: 0, y: 0 }, { x: 1920, y: 0 }]);
+        let defaultfourpostion: any = ref([{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }]);
         let fourpostion: any = ref([{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }]);
         let div: any = ref(null);
         let div2: any = ref(null);
@@ -103,7 +102,9 @@ export default defineComponent({
         const y1 = ref(0);
         const { offset } = dom
 
+        const save=()=>{
 
+        }
 
         const activeMouseDown = (index: number) => {
             isactivearray.value[index] = true
@@ -147,9 +148,15 @@ export default defineComponent({
 
             Proportion.value.x = 1920 / (div.value.offsetWidth - 25)
             Proportion.value.y = 1080 / (div.value.offsetHeight - 25)
+            for (let index = 0; index < fourpostion.value.length; index++) {
+                defaultfourpostion.value[index].x = fourpostion.value[index].x ;
+                defaultfourpostion.value[index].y = fourpostion.value[index].y;
+                defaultfour.value[index].x=four.value[index].x
+                defaultfour.value[index].y=four.value[index].y
+            }
         }
         watch(() => four.value[0], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 1, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 1, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[0]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -165,7 +172,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => four.value[1], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 2, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 2, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[1]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -181,7 +188,7 @@ export default defineComponent({
             ///
         }, { deep: true })
         watch(() => four.value[2], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 3, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 3, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[2]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -190,7 +197,6 @@ export default defineComponent({
                 point3.value.x = x
                 point3.value.y = y
                 isshowarray.value[2] = false
-                //isactivearray.value[2]=false
                 setTimeout(() => {
                     isshowarray.value[2] = true
                 }, 100);
@@ -198,7 +204,7 @@ export default defineComponent({
             ///
         }, { deep: true })
         watch(() => four.value[3], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 4, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 4, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[3]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -207,7 +213,6 @@ export default defineComponent({
                 point4.value.x = x
                 point4.value.y = y
                 isshowarray.value[3] = false
-                //isactivearray.value[2]=false
                 setTimeout(() => {
                     isshowarray.value[3] = true
                 }, 100);
@@ -219,30 +224,30 @@ export default defineComponent({
         const reset = (index: number) => {
             if (index == 0) {
                 console.log(x1.value + "," + y1.value)
-                four.value[index].x = 0
-                four.value[index].y = 1080
+                four.value[0].x = 0
+                four.value[0].y = 1080
                 point1.x = 0
                 point1.y = 0
                 x1.value = 0
                 y1.value = 0
             }
             if (index == 1) {
-                four.value[index].x = 1920
-                four.value[index].y = 1080
-                fourpostion.value[index].x = div.value.offsetWidth - 25
-                fourpostion.value[index].y = 0
+                four.value[1].x = 1920
+                four.value[1].y = 1080
+                fourpostion.value[1].x = div.value.offsetWidth - 25
+                fourpostion.value[1].y = 0
             }
             if (index == 2) {
-                four.value[index].x = 0
-                four.value[index].y = 0
-                fourpostion.value[index].x = 0
-                fourpostion.value[index].y = div.value.offsetHeight - 25
+                four.value[2].x = 0
+                four.value[2].y = 0
+                fourpostion.value[2].x = 0
+                fourpostion.value[2].y = div.value.offsetHeight - 25
             }
             if (index == 3) {
-                four.value[index].x = 1920
-                four.value[index].y = 0
-                fourpostion.value[index].x = div.value.offsetWidth - 25
-                fourpostion.value[index].y = div.value.offsetHeight - 25
+                four.value[3].x = 1920
+                four.value[3].y = 0
+                fourpostion.value[3].x = div.value.offsetWidth - 25
+                fourpostion.value[3].y = div.value.offsetHeight - 25
             }
             isshowarray.value[index] = false
             setTimeout(() => {
@@ -250,6 +255,21 @@ export default defineComponent({
             }, 100);
         }
 
+        const resetall=()=>{
+            
+            for (let index = 0; index < fourpostion.value.length; index++) {
+                fourpostion.value[index].x=defaultfourpostion.value[index].x 
+                fourpostion.value[index].y=defaultfourpostion.value[index].y 
+                console.log("ok");
+                four.value[index].x=defaultfour.value[index].x
+                four.value[index].y=defaultfour.value[index].y
+
+                isshowarray.value[index] = false
+                setTimeout(() => {
+                isshowarray.value[index] = true
+                }, 100);
+            }
+        }
 
         const moveHandler_1 = (data: any) => {
             let x = Math.ceil((data.left - fourpostion.value[0].x) * Proportion.value.x + 0);
@@ -288,11 +308,13 @@ export default defineComponent({
             options,
             fourpostion,
             reset,
+            resetall,
             moveHandler_1,
             moveHandler_2,
             moveHandler_3,
             moveHandler_4,
             four,
+            save,
             point1,
             point2,
             point3,
diff --git a/src/components/FusionSettings/FusionLocale.vue b/src/components/FusionSettings/FusionLocale.vue
index 2b56e49..3ff5a22 100644
--- a/src/components/FusionSettings/FusionLocale.vue
+++ b/src/components/FusionSettings/FusionLocale.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="row">
-    <div class="col-8 boder">
+    <div class="col-12">
       <p class="text-center">{{$t('Set the fusion band width')}}</p>
       <div class="row">
         <div class="col-12">
@@ -10,7 +10,7 @@
                 <div class="col-6">
                   <q-toggle
                     class="float-right"
-                    v-model="array2[0].isshow"
+                    v-model="array2[selectedprojector][0].isshow"
                     label=""
                   />
                 </div>
@@ -19,14 +19,14 @@
                     filled
                     type="number"
                     @focus="group = 0"
-                    v-model="array2[0].value"
+                    v-model="array2[selectedprojector][0].value"
                     :label="$t('upper fusion zone parameters')"
                     lazy-rules
                     :rules="[
                       (val) =>
                         (val !== null && val !== '') || $t('Please enter a number'),
                       (val) =>
-                        (val > -1 && val < 100) || $t('Please enter 0-100'),
+                        (val > -1 && val < 1080) || $t('Please enter 0-100'),
                     ]"
                   />
                 </div>
@@ -41,7 +41,7 @@
                 <div class="col-6">
                   <q-toggle
                     class="float-right"
-                    v-model="array2[1].isshow"
+                    v-model="array2[selectedprojector][1].isshow"
                     label=""
                   />
                 </div>
@@ -50,14 +50,14 @@
                     filled
                     type="number"
                     @focus="group = 1"
-                    v-model="array2[1].value"
+                    v-model="array2[selectedprojector][1].value"
                     :label="$t('Left fusion Band Parameters')"
                     lazy-rules
                     :rules="[
                       (val) =>
                         (val !== null && val !== '') || $t('Please enter a number'),
                       (val) =>
-                        (val > -1 && val < 100) || $t('Please enter 0-100'),
+                        (val > -1 && val < 1920) || $t('Please enter 0-100'),
                     ]"
                   />
                 </div>
@@ -68,7 +68,7 @@
                 <div class="col-6">
                   <q-toggle
                     class="float-right"
-                    v-model="array2[2].isshow"
+                    v-model="array2[selectedprojector][2].isshow"
                     label=""
                   />
                 </div>
@@ -77,14 +77,14 @@
                     filled
                     type="number"
                     @focus="group = 2"
-                    v-model="array2[2].value"
+                    v-model="array2[selectedprojector][2].value"
                     :label="$t('Right fusion Band Parameters')"
                     lazy-rules
                     :rules="[
                       (val) =>
                         (val !== null && val !== '') || $t('Please enter a number'),
                       (val) =>
-                        (val > -1 && val < 100) || $t('Please enter 0-100'),
+                        (val > -1 && val < 1920) || $t('Please enter 0-100'),
                     ]"
                   />
                 </div>
@@ -99,7 +99,7 @@
                 <div class="col-6">
                   <q-toggle
                     class="float-right"
-                    v-model="array2[3].isshow"
+                    v-model="array2[selectedprojector][3].isshow"
                     label=""
                   />
                 </div>
@@ -108,14 +108,14 @@
                     filled
                     type="number"
                     @focus="group = 3"
-                    v-model="array2[3].value"
+                    v-model="array2[selectedprojector][3].value"
                     :label="$t('Lower fusion Zone Parameters')"
                     lazy-rules
                     :rules="[
                       (val) =>
                         (val !== null && val !== '') || $t('Please enter a number'),
                       (val) =>
-                        (val > -1 && val < 100) || $t('Please enter 0-100'),
+                        (val > -1 && val < 1080) || $t('Please enter 0-100'),
                     ]"
                   />
                 </div>
@@ -123,10 +123,10 @@
             </div>
           </div>
         </div>
-        <div class="col-12">是否启用混合<q-checkbox v-model="EnableBlending" @chang="changEnableBlending" /></div>
+        
       </div>
     </div>
-    <div v-if="!(group == 4) && array2[group].isshow" class="col-4">
+    <div v-if="!(group == 4) && array2[selectedprojector][group].isshow" class="col-4 offset-4">
       <p class="text-center">{{$t('Set Fusion Band Parameters')}}</p>
       <div style="display: flex; justify-content: space-evenly">
         <div>
@@ -174,9 +174,6 @@
           <p class="text-center">gamma</p>
         </div>
       </div>
-      <!-- <div class="q-pa-lg text-center">
-                <q-option-group v-model="group" :options="options" color="primary" />
-            </div> -->
     </div>
   </div>
 </template>
@@ -200,6 +197,7 @@ import {
 import { useStore } from "src/store";
 import { useI18n } from "vue-i18n";
 import GlobalData from "src/common/GlobalData";
+import { number } from "@intlify/core-base";
 
 export default defineComponent({
   name: "ComponentFusionLocale",
@@ -210,7 +208,7 @@ export default defineComponent({
     const age = ref(0);
     const standard = ref(0);
     const group = ref(4);
-    const EnableBlending=ref(true);
+    const EnableBlending=ref(false);
     let array: any = ref([
       { alpha: 0, p: 0, gamma: 0 },
       { alpha: 0, p: 0, gamma: 0 },
@@ -218,12 +216,20 @@ export default defineComponent({
       { alpha: 0, p: 0, gamma: 0 },
       { alpha: 0, p: 0, gamma: 0 },
     ]);
-    let array2 = reactive([
+    let array2: any = reactive([[
       { isshow: false, value: 0 },
       { isshow: false, value: 0 },
       { isshow: false, value: 0 },
       { isshow: false, value: 0 },
-    ]);
+    ],[
+      { isshow: false, value: 0 },
+      { isshow: false, value: 0 },
+      { isshow: false, value: 0 },
+      { isshow: false, value: 0 },
+    ]]);
+    const selectedprojector=computed(()=>{
+      return $store.state.selected_projector=="0/0"?0:1
+    })
     const options = ref([
       {
         label: "上融合带参数",
@@ -252,12 +258,9 @@ export default defineComponent({
         $store.commit("setSelectedProjector", newValue);
       },
     });
-    const setIndexProjector = () => {
-      console.log($store.state.selected_projector);
-    };
     const chang = (type: string) => {
       if (type == "alpha") {
-        set?.setBlendingAlphaParam(
+        if($store.state.EnableBlending)set?.setBlendingAlphaParam(
           $store.getters.GetTheCurrentlySelectedCamera[0],
           $store.getters.GetTheCurrentlySelectedCamera[1],
           group.value,
@@ -265,14 +268,14 @@ export default defineComponent({
         );
       }
       if (type == "p") {
-        set?.setBlendingPowerParam(
+        if($store.state.EnableBlending)set?.setBlendingPowerParam(
           $store.getters.GetTheCurrentlySelectedCamera[0],
           $store.getters.GetTheCurrentlySelectedCamera[1],
           group.value,
           array.value[group.value].p
         );
       }
-      if (type == "gamma") {
+      if($store.state.EnableBlending)if (type == "gamma") {
         set?.setBlendingGammaParam(
           $store.getters.GetTheCurrentlySelectedCamera[0],
           $store.getters.GetTheCurrentlySelectedCamera[1],
@@ -282,55 +285,101 @@ export default defineComponent({
       }
       //console.log("giao")
     };
+     //0：左融合带，1：上融合带，2：右融合带，3：下融合带
     watch(
-      () => array2[0].value,
+      () => array2[0][0],
       (newVal, oldVal) => {
-        //set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
-        ///
-        ///
+        if($store.state.EnableBlending)set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],1,array2[0][0].isshow,Number(array2[0][0].value));
+        if(!array2[0][0].isshow){
+          array2[0][0].value=0
+        }
       },
       { deep: true }
     );
     watch(
-      () => array2[1].value,
+      () => array2[0][1],
       (newVal, oldVal) => {
-        //set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
-        ///
-        ///
+        if($store.state.EnableBlending)set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],0,array2[0][1].isshow,Number(array2[0][1].value));
+        if(!array2[0][1].isshow){
+          array2[0][1].value=0
+        }
       },
       { deep: true }
     );
     watch(
-      () => array2[2].value,
+      () => array2[0][2],
       (newVal, oldVal) => {
-        //set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
-        ///
-        ///
+        if($store.state.EnableBlending)set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],2,array2[0][2].isshow,Number(array2[0][2].value));
+        if(!array2[0][2].isshow){
+          array2[0][2].value=0
+        }
       },
       { deep: true }
     );
     watch(
-      () => array2[3].value,
+      () => array2[0][3],
       (newVal, oldVal) => {
-        //set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
-        ///
-        ///
+        if($store.state.EnableBlending)set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],3,array2[0][3].isshow,Number(array2[0][3].value));
+        if(!array2[0][3].isshow){
+          array2[0][3].value=0
+        }
       },
       { deep: true }
     );
+
+///
+
+watch(
+      () => array2[1][0],
+      (newVal, oldVal) => {
+        if($store.state.EnableBlending) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],1,array2[1][0].isshow,Number(array2[1][0].value));
+        if(!array2[1][0].isshow){
+          array2[1][0].value=0
+        }
+      },
+      { deep: true }
+    );
+    watch(
+      () => array2[1][1],
+      (newVal, oldVal) => {
+        if($store.state.EnableBlending) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],0,array2[1][1].isshow,Number(array2[1][2].value));
+        if(!array2[1][1].isshow){
+          array2[1][1].value=0
+        }
+      },
+      { deep: true }
+    );
+    watch(
+      () => array2[1][2],
+      (newVal, oldVal) => {
+        if($store.state.EnableBlending) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],2,array2[1][2].isshow,Number(array2[1][2].value));
+        if(!array2[1][2].isshow){
+          array2[1][2].value=0
+        }
+      },
+      { deep: true }
+    );
+    watch(
+      () => array2[1][3],
+      (newVal, oldVal) => {
+        if($store.state.EnableBlending) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],3,array2[1][3].isshow,Number(array2[1][3].value));
+        if(!array2[1][3].isshow){
+          array2[1][3].value=0
+        }
+      },
+      { deep: true }
+    );
+///
+
     watch(
       () => EnableBlending,
       (newVal, oldVal) => {
-        //set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
-        ///
-        ///
-        $store.commit('setEnableBlending',newVal);
-        console.log(EnableBlending)
-      },
+        $store.commit('setEnableBlending',newVal.value);
+        set?.EnableBlending(newVal.value);
+      },{ deep: true }
     );
     const changEnableBlending=()=>{
-      $store.commit('setEnableBlending',EnableBlending);
-      console.log(EnableBlending)
+      $store.commit('setEnableBlending',EnableBlending.value);
     }
     return {
       model,
@@ -341,11 +390,11 @@ export default defineComponent({
       group,
       text,
       array,
-      $t,
       chang,
       EnableBlending,
       array2,
-      changEnableBlending
+      changEnableBlending,
+      selectedprojector
     };
   },
 });
diff --git a/src/components/FusionSettings/GridSettings.vue b/src/components/FusionSettings/GridSettings.vue
index d876e31..3554aa3 100644
--- a/src/components/FusionSettings/GridSettings.vue
+++ b/src/components/FusionSettings/GridSettings.vue
@@ -80,7 +80,6 @@ export default defineComponent({
             isshowhex,
             index,
             color,
-            $t,
         };
     },
 });
diff --git a/src/components/FusionSettings/ProjectorItem.vue b/src/components/FusionSettings/ProjectorItem.vue
index 09105d3..c68ea0a 100644
--- a/src/components/FusionSettings/ProjectorItem.vue
+++ b/src/components/FusionSettings/ProjectorItem.vue
@@ -33,10 +33,6 @@ export default defineComponent({
                 $store.commit('setSelectedProjector',newValue);
             }
         })
-
-        const setIndexProjector=()=>{
-            console.log($store.state.selected_projector);
-        }
         return {
             model,
             ...props
diff --git a/src/components/FusionSettings/SurfaceCorrection.vue b/src/components/FusionSettings/SurfaceCorrection.vue
index 79d52a4..a7b86a1 100644
--- a/src/components/FusionSettings/SurfaceCorrection.vue
+++ b/src/components/FusionSettings/SurfaceCorrection.vue
@@ -37,7 +37,7 @@
                         :dense="true" v-model="nine[2].x" label="x" lazy-rules />
                     <q-input filled type="number" class="q-pt-md" @focus="isactivearray[2] = false" :dense="true"
                         v-model="nine[2].y" label="y" lazy-rules />
-                    <q-btn color="white" @click="reset(2)" text-color="black" label="$t('reset')" />
+                    <q-btn color="white" @click="reset(2)" text-color="black" :label="$t('reset')" />
                 </div>
             </div>
 
@@ -49,48 +49,41 @@
                         :dense="true" v-model="nine[3].x" label="x" lazy-rules />
                     <q-input filled type="number" class="q-pt-md" @focus="isactivearray[3] = false" :dense="true"
                         v-model="nine[3].y" label="y" lazy-rules />
-                    <q-btn color="white" @click="reset(3)" text-color="black" :label="$t('reset')" />
+                    <q-btn color="white"  @click="reset(3)" text-color="black" :label="$t('reset')" />
                 </div>
             </div>
 
         </div>
         <div class="col-8">
-            <!-- <div class="row">
-                <div class="col-2"> <q-input filled type="number" class="q-pt-md" :dense="true" v-model="nine[4].x"
-                        label="x" lazy-rules />
-                    <q-input filled type="number" class="q-pt-md" :dense="true" v-model="nine[4].y" label="y"
-                        lazy-rules />
-                </div>
-            </div> -->
             <div ref="div" style="background-color: #7fffd4;height: 40vh;">
                 <div style="position:absolute;">
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[0]" :w="30" :h="20" :x="ninepostion[0].x"
                         :y="ninepostion[0].y" @mousedown="activeMouseDown(0)" :isResizable="false"
-                        @moveHandler="moveHandler_1"><span>{{$t('point')}}1</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_1"><span>{{ $t('point') }}1</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[1]" :w="30" :h="20" :x="ninepostion[1].x"
                         :y="ninepostion[1].y" @mousedown="activeMouseDown(1)" :isResizable="false"
-                        @moveHandler="moveHandler_2"><span>{{$t('point')}}2</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_2"><span>{{ $t('point') }}2</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[2]" :w="30" :h="20" :x="ninepostion[2].x"
                         :y="ninepostion[2].y" @mousedown="activeMouseDown(2)" :isResizable="false"
-                        @moveHandler="moveHandler_3"><span>{{$t('point')}}3</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_3"><span>{{ $t('point') }}3</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[3]" :w="30" :h="20" :x="ninepostion[3].x"
                         :y="ninepostion[3].y" @mousedown="activeMouseDown(3)" :isResizable="false"
-                        @moveHandler="moveHandler_4"><span>{{$t('point')}}4</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_4"><span>{{ $t('point') }}4</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[4]" :w="30" :h="20" :x="ninepostion[4].x"
                         :y="ninepostion[4].y" @mousedown="activeMouseDown(4)" :isResizable="false"
-                        @moveHandler="moveHandler_5"><span>{{$t('point')}}5</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_5"><span>{{ $t('point') }}5</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[5]" :w="30" :h="20" :x="ninepostion[5].x"
                         :y="ninepostion[5].y" @mousedown="activeMouseDown(5)" :isResizable="false"
-                        @moveHandler="moveHandler_6"><span>{{$t('point')}}6</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_6"><span>{{ $t('point') }}6</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[6]" :w="30" :h="20" :x="ninepostion[6].x"
                         :y="ninepostion[6].y" @mousedown="activeMouseDown(6)" :isResizable="false"
-                        @moveHandler="moveHandler_7"><span>{{$t('point')}}7</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_7"><span>{{ $t('point') }}7</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[7]" :w="30" :h="20" :x="ninepostion[7].x"
                         :y="ninepostion[7].y" @mousedown="activeMouseDown(7)" :isResizable="false"
-                        @moveHandler="moveHandler_8"><span>{{$t('point')}}8</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_8"><span>{{ $t('point') }}8</span> </vue3ResizeDrag>
                     <vue3ResizeDrag :isActive="true" v-if="isshowarray[8]" :w="30" :h="20" :x="ninepostion[8].x"
                         :y="ninepostion[8].y" @mousedown="activeMouseDown(8)" :isResizable="false"
-                        @moveHandler="moveHandler_9"><span>{{$t('point')}}9</span> </vue3ResizeDrag>
+                        @moveHandler="moveHandler_9"><span>{{ $t('point') }}9</span> </vue3ResizeDrag>
                 </div>
 
             </div>
@@ -108,7 +101,9 @@
         </div>
         <div class="col-4">
             <div class="row">
-                <div class="col-6"></div>
+                <div class="col-6"> <q-btn color="white"   @click="resetall" text-color="black"
+                        :label="$t('resetall')" /><q-btn color="white" @click="save" text-color="black"
+                        :label="$t('save config')" /></div>
                 <div class="col-3"> <q-input filled type="number" @focus="isactivearray[6] = false" class="q-pt-md"
                         :dense="true" v-model="nine[6].x" label="x" lazy-rules />
                     <q-input filled type="number" class="q-pt-md" @focus="isactivearray[6] = false" :dense="true"
@@ -142,10 +137,6 @@
             </div>
 
         </div>
-        <!-- <div class="col-4">
-            <q-btn color="white" text-color="black" label="重置" />
-        </div> -->
-
     </div>
 </template>
 
@@ -175,6 +166,7 @@ export default defineComponent({
         let centor = ref({ x: 0, y: 0 });
         const div = ref();
         let nine = ref([{ x: 0, y: 1080 }, { x: 960, y: 1920 }, { x: 1920, y: 1080 }, { x: 0, y: 540 }, { x: 960, y: 540 }, { x: 1920, y: 540 }, { x: 0, y: 0 }, { x: 960, y: 0 }, { x: 1920, y: 0 }]);
+        let defaultnine = ref([{ x: 0, y: 1080 }, { x: 960, y: 1920 }, { x: 1920, y: 1080 }, { x: 0, y: 540 }, { x: 960, y: 540 }, { x: 1920, y: 540 }, { x: 0, y: 0 }, { x: 960, y: 0 }, { x: 1920, y: 0 }]);
         ///
         const activeMouseDown = (index: number) => {
             isactivearray.value[index] = true
@@ -182,72 +174,71 @@ export default defineComponent({
         const isshowarray = ref([true, true, true, true, true, true, true, true, true,])
         const isactivearray = ref([true, true, true, true, true, true, true, true, true,])
         let ninepostion: any = ref([{ x: 0, y: 1920 }, { x: 960, y: 1920 }, { x: 1080, y: 1920 }, { x: 0, y: 540 }, { x: 960, y: 540 }, { x: 1080, y: 540 }, { x: 0, y: 0 }, { x: 540, y: 0 }, { x: 1080, y: 0 }]);
+        let defaultninepostion: any = ref([{ x: 0, y: 1920 }, { x: 960, y: 1920 }, { x: 1080, y: 1920 }, { x: 0, y: 540 }, { x: 960, y: 540 }, { x: 1080, y: 540 }, { x: 0, y: 0 }, { x: 540, y: 0 }, { x: 1080, y: 0 }]);
         const moveHandler_1 = (data: any) => {
             let x = Math.ceil((data.left - ninepostion.value[0].x) * Proportion.value.x);
             let y = 1080 - Math.ceil((data.top - ninepostion.value[0].y) * Proportion.value.y);
-            
+
             nine.value[0].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[0].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_2 = (data: any) => {
             let x = 960 + Math.ceil((data.left - ninepostion.value[1].x) * centor.value.x);
             let y = 1080 - Math.ceil((data.top - ninepostion.value[1].y) * Proportion.value.y);
-            
+
             nine.value[1].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[1].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_3 = (data: any) => {
             let x = 1920 + Math.ceil((data.left - ninepostion.value[2].x) * Proportion.value.x);
             let y = 1080 - Math.ceil((data.top - ninepostion.value[2].y) * Proportion.value.y);
-            
+
             nine.value[2].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[2].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_4 = (data: any) => {
             let x = Math.ceil((data.left - ninepostion.value[3].x) * Proportion.value.x);
             let y = 530 - Math.ceil((data.top - ninepostion.value[3].y) * Proportion.value.y);
-            
+
             nine.value[3].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[3].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_5 = (data: any) => {
             let x = 960 + Math.ceil((data.left - ninepostion.value[4].x) * centor.value.x);
             let y = 530 - Math.ceil((data.top - ninepostion.value[4].y) * Proportion.value.y);
-            
+
             nine.value[4].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[4].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_6 = (data: any) => {
             let x = 1920 + Math.ceil((data.left - ninepostion.value[5].x) * Proportion.value.x);
             let y = 530 - Math.ceil((data.top - ninepostion.value[5].y) * Proportion.value.y);
-            
+
             nine.value[5].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[5].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_7 = (data: any) => {
             let x = Math.ceil((data.left - ninepostion.value[6].x) * Proportion.value.x);
             let y = Math.abs(Math.ceil((data.top - ninepostion.value[6].y) * Proportion.value.y));
-            
+
             nine.value[6].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[6].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_8 = (data: any) => {
             let x = 960 + Math.ceil((data.left - ninepostion.value[7].x) * Proportion.value.x);
             let y = Math.abs(Math.ceil((data.top - ninepostion.value[7].y) * Proportion.value.y));;
-            
+
             nine.value[7].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[7].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         const moveHandler_9 = (data: any) => {
             let x = 1920 + Math.ceil((data.left - ninepostion.value[8].x) * Proportion.value.x);
             let y = Math.abs(Math.ceil((data.top - ninepostion.value[8].y) * Proportion.value.y));
-            
+
             nine.value[8].x = x > 1920 ? 1920 : x && x < 0 ? 0 : x;
             nine.value[8].y = y > 1080 ? 1080 : y && y < 0 ? 0 : y
         }
         onMounted(() => {
-            console.log(div.value.offsetHeight)
-            console.log(div.value.offsetWidth)
             startpostion();
 
         })
@@ -284,62 +275,71 @@ export default defineComponent({
 
             centor.value.x = 2160 / (div.value.offsetWidth + 25)
             centor.value.y = 3840 / (div.value.offsetHeight + 25)
+
+            for (let index = 0; index < defaultninepostion.value.length; index++) {
+                defaultninepostion.value[index].x = ninepostion.value[index].x;
+                defaultninepostion.value[index].y = ninepostion.value[index].y;
+                defaultnine.value[index].x = nine.value[index].x
+                defaultnine.value[index].y = nine.value[index].y
+            }
+
+
         }
         ///
         const reset = (index: number) => {
-            if (index == 0) {
-                nine.value[index].x = 0
-                nine.value[index].y = 1080
+            if (index == 0 || index == -1) {
+                nine.value[0].x = 0
+                nine.value[0].y = 1080
                 ninepostion.value[0].x = 0
                 ninepostion.value[0].y = 0
             }
-            if (index == 1) {
-                nine.value[index].x = 960
-                nine.value[index].y = 1080
+            if (index == 1 || index == -1) {
+                nine.value[1].x = 960
+                nine.value[1].y = 1080
                 ninepostion.value[1].x = div.value.offsetWidth / 2 - 25
                 ninepostion.value[1].y = 0
             }
-            if (index == 2) {
-                nine.value[index].x = 1920
-                nine.value[index].y = 1080
+            if (index == 2 || index == -1) {
+                nine.value[2].x = 1920
+                nine.value[2].y = 1080
                 ninepostion.value[2].x = div.value.offsetWidth - 25
                 ninepostion.value[2].y = 0
             }
-            if (index == 3) {
-                nine.value[index].x = 0
-                nine.value[index].y = 540
+            if (index == 3 || index == -1) {
+                nine.value[3].x = 0
+                nine.value[3].y = 540
                 ninepostion.value[3].x = 0
                 ninepostion.value[3].y = div.value.offsetHeight / 2 - 8
             }
-            if (index == 4) {
-                nine.value[index].x = 960
-                nine.value[index].y = 540
+            if (index == 4 || index == -1) {
+                nine.value[4].x = 960
+                nine.value[4].y = 540
                 ninepostion.value[4].x = div.value.offsetWidth / 2 - 25
                 ninepostion.value[4].y = div.value.offsetHeight / 2 - 8
             }
-            if (index == 5) {
-                nine.value[index].x = 1920
-                nine.value[index].y = 540
+            if (index == 5 || index == -1) {
+                nine.value[5].x = 1920
+                nine.value[5].y = 540
 
                 ninepostion.value[5].x = div.value.offsetWidth - 25
                 ninepostion.value[5].y = div.value.offsetHeight / 2
             }
-            if (index == 6) {
-                nine.value[index].x = 0
-                nine.value[index].y = 0
+            if (index == 6 || index == -1) {
+                nine.value[6].x = 0
+                nine.value[6].y = 0
 
                 ninepostion.value[6].x = 0
                 ninepostion.value[6].y = div.value.offsetHeight - 25
             }
-            if (index == 7) {
-                nine.value[index].x = 960
-                nine.value[index].y = 0
+            if (index == 7 || index == -1) {
+                nine.value[7].x = 960
+                nine.value[7].y = 0
                 ninepostion.value[7].x = div.value.offsetWidth / 2
                 ninepostion.value[7].y = div.value.offsetHeight - 25
             }
-            if (index == 8) {
-                nine.value[index].x = 1920
-                nine.value[index].y = 0
+            if (index == 8 || index == -1) {
+                nine.value[8].x = 1920
+                nine.value[8].y = 0
 
                 ninepostion.value[8].x = div.value.offsetWidth - 25
                 ninepostion.value[8].y = div.value.offsetHeight - 25
@@ -349,9 +349,24 @@ export default defineComponent({
                 isshowarray.value[index] = true
             }, 100);
         }
+        const resetall = () => {
+            for (let index = 0; index < nine.value.length; index++) {
+
+                ninepostion.value[index].x = defaultninepostion.value[index].x;
+                ninepostion.value[index].y = defaultninepostion.value[index].y;
+                nine.value[index].x = defaultnine.value[index].x
+                nine.value[index].y = defaultnine.value[index].y
+
+
+                isshowarray.value[index] = false
+                setTimeout(() => {
+                    isshowarray.value[index] = true
+                }, 100);
+            }
+        }
         ///
         watch(() => nine.value[0], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 1, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[0]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -361,7 +376,7 @@ export default defineComponent({
             ///
         }, { deep: true })
         watch(() => nine.value[1], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 2, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 2, Number(newVal.x), Number(newVal.y));
             ///
             if (!isactivearray.value[1]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
@@ -371,7 +386,7 @@ export default defineComponent({
             ///
         }, { deep: true })
         watch(() => nine.value[2], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 3, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 3, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[2]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -379,7 +394,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[3], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 4, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 4, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[3]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -387,7 +402,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[4], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 5, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 5, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[4]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -395,7 +410,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[5], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 6, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 6, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[5]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -403,7 +418,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[6], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 7, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 7, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[6]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -411,7 +426,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[7], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 8, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 8, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[7]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -419,7 +434,7 @@ export default defineComponent({
             }
         }, { deep: true })
         watch(() => nine.value[8], (newVal, oldVal) => {
-            set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 9, Number(newVal.x), Number(newVal.y));
+            if($store.state.EnableBlending) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 9, Number(newVal.x), Number(newVal.y));
             if (!isactivearray.value[8]) {
                 let x = Math.ceil(newVal.x / Proportion.value.x);
                 let y = Math.ceil(((1080 - newVal.y) / Proportion.value.y));
@@ -438,11 +453,17 @@ export default defineComponent({
             setTimeout(() => {
                 isshowarray.value[index] = true
             }, 100);
+
+
+
+        }
+        const save = () => {
+
         }
         return {
             model,
             options,
-
+            save,
             nine,
             moveHandler_1,
             moveHandler_2,
@@ -454,6 +475,7 @@ export default defineComponent({
             moveHandler_8,
             moveHandler_9,
             div,
+            resetall,
             ninepostion,
             reset,
             isshowarray,
diff --git a/src/components/FusionSettingsDialog.vue b/src/components/FusionSettingsDialog.vue
index 6d5a9c6..0b594ba 100644
--- a/src/components/FusionSettingsDialog.vue
+++ b/src/components/FusionSettingsDialog.vue
@@ -1,90 +1,122 @@
 <template>
-    <q-dialog persistent v-model="show_dialog" @keydown="
-        (evt) => {
-            if (evt.keyCode == 27) {
-                show_dialog = false;
-            }
+  <q-dialog
+    persistent
+    v-model="show_dialog"
+    @keydown="
+      (evt:any) => {
+        if (evt.keyCode == 27) {
+          show_dialog = false;
         }
-    ">
+      }
+    "
+  >
+    <q-card class="overflow-hidden" style="max-width: 90vw; height: 90vh">
+      <q-form>
+        <!-- @submit="onSubmit" -->
+        <q-card-section class="q-ma-none q-pa-sm">
+          <div class="row">
+            <div class="col-auto text-h6">
+              {{ $t("fusion settings") }}
+            </div>
 
-        <q-card class="overflow-hidden" style="max-width: 90vw;height: 90vh;">
-            <q-form>
-                <!-- @submit="onSubmit" -->
-                <q-card-section class="q-ma-none q-pa-sm">
-                    <div class="row">
-                        <div class="col-auto text-h6">
-                            {{ $t('fusion settings') }}
-                        </div>
-                        
-                        <q-space />
-                        <q-btn flat round icon="close" color="red" v-close-popup>
-                        <q-tooltip>
-                            {{ $t("close") }}
-                        </q-tooltip>
-                    </q-btn>
-                        <div>
+            <q-space />
+            <q-btn flat round icon="close" color="red" v-close-popup>
+              <q-tooltip>
+                {{ $t("close") }}
+              </q-tooltip>
+            </q-btn>
+            <div></div>
+          </div>
+        </q-card-section>
 
-                        </div>
+        <q-separator />
+        <!-- height: 80vh -->
+        <q-card-section class="scroll" style="width: 90vw">
+          <div class="row" style="border: 1px solid;text-align: center;">
+            <div class="col-3" style="border-right: 1px solid;">
+              <p class="text-center">{{ $t("Projector") }}</p>
+              <projector-item
+                class="w-100"
+                :llabel="$t('Projector') + '1'"
+                :lvalue="'0/0'"
+              ></projector-item>
+              <projector-item
+                class="w-100"
+                :llabel="$t('Projector') + '2'"
+                :lvalue="'0/1'"
+              ></projector-item>
+              <div class="col-12" style="text-align: center">
+                是否启用混合<q-checkbox v-model="EnableBlending" />
+              </div>
+            </div>
+            <div class="col-9">
+              <div class="q-ta-md">
+                <q-btn-toggle
+                  :disable="!$store.state.EnableBlending"
+                  no-caps
+                  v-model="options"
+                  toggle-color="primary"
+                  :options="[
+                    { label: $t('FusionLocale'), value: 'FusionLocale' },
+                    {
+                      label: $t('FourPointCalibration'),
+                      value: 'FourPointCalibration',
+                    },
+                    {
+                      label: $t('SurfaceCorrection'),
+                      value: 'SurfaceCorrection',
+                    },
+                    {
+                      label: $t('DensityCorrection'),
+                      value: 'DensityCorrection',
+                    },
+                    { label: $t('GridSettings'), value: 'GridSettings' },
+                  ]"
+                />
+              </div>
+              <div style="min-height: 72vh">
+                <component :is="options" />
+              </div>
+            </div>
+          </div>
+        </q-card-section>
 
-                    </div>
+        <q-separator />
 
-                </q-card-section>
-
-                <q-separator />
-                <!-- height: 80vh -->
-                <q-card-section class="scroll" style="width: 90vw;">
-                    <div class="row">
-                        <div class="col-3">
-                            <p class="text-center">{{$t('Projector')}}</p>
-                            <projector-item  class="w-100"  :llabel="$t('Projector')+'1'" :lvalue="'0/0'"></projector-item>
-                            <projector-item  class="w-100"  :llabel="$t('Projector')+'2'" :lvalue="'0/1'"></projector-item>
-                        </div>
-                        <div class="col-9">
-                            <div class="q-ta-md">
-                                <q-btn-toggle :disable="$store.state.EnableBlending" no-caps v-model="options" toggle-color="primary" :options="[
-                                    { label: $t('FusionLocale'), value: 'FusionLocale' },
-                                    { label: $t('FourPointCalibration'), value: 'FourPointCalibration' },
-                                    { label: $t('SurfaceCorrection'), value: 'SurfaceCorrection' },
-                                    { label: $t('DensityCorrection'), value: 'DensityCorrection' },
-                                    { label: $t('GridSettings'), value: 'GridSettings' },
-                                ]" />
-                            </div>
-                            <div style="min-height:72vh ;">
-                                <component :is="options" />
-                            </div>
-                        </div>
-                    </div>
-                </q-card-section>
-
-                <q-separator />
-
-                <q-card-actions align="right">
-                    <q-btn flat :label="$t('Cancel')" no-caps color="primary" v-close-popup />
-                </q-card-actions>
-            </q-form>
-        </q-card>
-    </q-dialog>
+        <q-card-actions align="right">
+          <q-btn
+            flat
+            :label="$t('Cancel')"
+            no-caps
+            color="primary"
+            v-close-popup
+          />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
 </template>
-  
+
 <style scoped>
 .header_label {
-    width: 20%;
+  width: 20%;
 }
-.w100{
-    width: 100%;
+
+.w100 {
+  width: 100%;
 }
 </style>
-  
+
 <script lang="ts">
 import {
-    defineComponent,
-    ref,
-    Ref,
-    watch,
-    computed,
-    onMounted,
-    onBeforeUnmount,
-    nextTick,
+  defineComponent,
+  ref,
+  Ref,
+  watch,
+  computed,
+  onMounted,
+  onBeforeUnmount,
+  nextTick,
 } from "vue";
 import { useStore } from "src/store";
 import { useQuasar, copyToClipboard } from "quasar";
@@ -102,46 +134,53 @@ import SurfaceCorrection from "src/components/FusionSettings/SurfaceCorrection.v
 import DensityCorrection from "src/components/FusionSettings/DensityCorrection.vue";
 
 export default defineComponent({
-    name: "ComponentFusionSettingsDialog",
-    components: {
-        ProjectorItem,
-        FusionLocale,
-        FourPointCalibration,
-        GridSettings,
-        SurfaceCorrection,
-        DensityCorrection
-    },
-    setup() {
-        let $store = useStore();
-        let $q = useQuasar();
-        let $t = useI18n();
-        let show_dialog = ref(false);
-        const target_language = ref("zh-CN");
-        const text = ref("Projector");
-        const showDialog = async () => {
-            show_dialog.value = true;
-        };
-        let optionsstr = ref();
-        optionsstr.value="FusionLocale"
-        const options = computed({
-            get() {
-                return optionsstr.value;
-            },
-            set(newValue) {
-                optionsstr.value = newValue;
-                console.log(newValue)
-            }
-        })
-
-        let data = ref({});
-        return {
-            show_dialog,
-            options,
-            copyToClipboard,
-            showDialog,
-            
-        };
-    },
+  name: "ComponentFusionSettingsDialog",
+  components: {
+    ProjectorItem,
+    FusionLocale,
+    FourPointCalibration,
+    GridSettings,
+    SurfaceCorrection,
+    DensityCorrection,
+  },
+  setup() {
+    let set = GlobalData.getInstance().getCurrentClient();
+    let $store = useStore();
+    let $q = useQuasar();
+    let $t = useI18n();
+    let show_dialog = ref(false);
+    const target_language = ref("zh-CN");
+    const text = ref("Projector");
+    const showDialog = async () => {
+      show_dialog.value = true;
+    };
+    const EnableBlending = ref(false);
+    let optionsstr = ref();
+    optionsstr.value = "FusionLocale";
+    const options = computed({
+      get() {
+        return optionsstr.value;
+      },
+      set(newValue) {
+        optionsstr.value = newValue;
+      },
+    });
+    watch(
+      () => EnableBlending,
+      (newVal, oldVal) => {
+        $store.commit("setEnableBlending", newVal.value);
+        set?.EnableBlending(newVal.value);
+      },
+      { deep: true }
+    );
+    let data = ref({});
+    return {
+      show_dialog,
+      options,
+      copyToClipboard,
+      showDialog,
+      EnableBlending,
+    };
+  },
 });
 </script>
-  
\ No newline at end of file
diff --git a/src/i18n/en-US/index.ts b/src/i18n/en-US/index.ts
index b14ca94..85512fc 100644
--- a/src/i18n/en-US/index.ts
+++ b/src/i18n/en-US/index.ts
@@ -419,7 +419,9 @@ export default {
   "Right fusion Band Parameters":"Right Fusion Band Parameters",
   "Set the fusion band width":"Set the fusion band width",
   "Please enter a number":"Please enter a number",
-  "Please enter 0-100":"Please enter 0-100",
+  "Please enter 0-100":"Please enter 0-your differentiation rate",
   "Set Fusion Band Parameters":"Set Fusion Band Parameters",
-  "Projector":"Projector"
+  "Projector":"Projector",
+  "resetall":"reset all",
+  "save config":"save config"
 };
diff --git a/src/i18n/zh-CN/index.ts b/src/i18n/zh-CN/index.ts
index 302c886..b545f1c 100644
--- a/src/i18n/zh-CN/index.ts
+++ b/src/i18n/zh-CN/index.ts
@@ -687,7 +687,9 @@ export default {
   "Right fusion Band Parameters":"右融合带参数",
   "Set the fusion band width":"设置融合带宽度",
   "Please enter a number":"请输入数字",
-  "Please enter 0-100":"请输入 0-100",
+  "Please enter 0-100":"请输入 0-你的分辨率",
   "Set Fusion Band Parameters":"设置融合带参数",
-  "Projector":"投影机"
+  "Projector":"投影机",
+  "resetall":"重置所有",
+  "save config":"保存配置"
 };
diff --git a/src/third_lib/calculateposition/index.js b/src/third_lib/calculateposition/index.js
deleted file mode 100644
index d8178de..0000000
--- a/src/third_lib/calculateposition/index.js
+++ /dev/null
@@ -1,24 +0,0 @@
-function getElementLeft(element) {
-  var actualLeft = element.offsetLeft;
-  var current = element.offsetParent;
-
-  while (current !== null) {
-    actualLeft += current.offsetLeft;
-    current = current.offsetParent;
-  }
-
-  return actualLeft;
-}
-
-function getElementTop(element) {
-  var actualTop = element.offsetTop;
-  var current = element.offsetParent;
-
-  while (current !== null) {
-    actualTop += current.offsetTop;
-    current = current.offsetParent;
-  }
-
-  return actualTop;
-}
-export {getElementLeft,getElementTop}