优化ui界面
This commit is contained in:
parent
93c3a89a6d
commit
7141313c8c
|
|
@ -4,43 +4,43 @@
|
|||
<div class="col-8 q-pt-md">
|
||||
<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="30" :x="point_postion[0].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==0?'action':'']" :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="30" :x="point_postion[0].x"
|
||||
:y="point_postion[0].y" @mousedown="activeMouseDown(0)" :isResizable="false"
|
||||
@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="30" :x="point_postion[1].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==1?'action':'']" :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="30" :x="point_postion[1].x"
|
||||
:y="point_postion[1].y" @mousedown="activeMouseDown(1)" :isResizable="false"
|
||||
@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="30" :x="point_postion[2].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==2?'action':'']" :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="30" :x="point_postion[2].x"
|
||||
:y="point_postion[2].y" @mousedown="activeMouseDown(2)" :isResizable="false"
|
||||
@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="30" :x="point_postion[3].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==3?'action':'']" :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="30" :x="point_postion[3].x"
|
||||
:y="point_postion[3].y" @mousedown="activeMouseDown(3)" :isResizable="false"
|
||||
@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="30" :x="point_postion[4].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==4?'action':'']" :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="30" :x="point_postion[4].x"
|
||||
:y="point_postion[4].y" @mousedown="activeMouseDown(4)" :isResizable="false"
|
||||
@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="40" :h="20" :x="point_postion[5].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==5?'action':'']" :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="40" :h="20" :x="point_postion[5].x"
|
||||
:y="point_postion[5].y" @mousedown="activeMouseDown(5)" :isResizable="false"
|
||||
@moveHandler="moveHandler($event, 5)"><span class="hcolro">←H1→</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="40" :h="20" :x="point_postion[6].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==6?'action':'']" :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="40" :h="20" :x="point_postion[6].x"
|
||||
:y="point_postion[6].y" @mousedown="activeMouseDown(6)" :isResizable="false"
|
||||
@moveHandler="moveHandler($event, 6)"><span class="hcolro">←H2→</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="40" :h="20" :x="point_postion[7].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==7?'action':'']" :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="40" :h="20" :x="point_postion[7].x"
|
||||
:y="point_postion[7].y" @mousedown="activeMouseDown(7)" :isResizable="false"
|
||||
@moveHandler="moveHandler($event, 7)"><span class="hcolro">←H3→</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="40" :h="20" :x="point_postion[8].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==8?'action':'']" :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="40" :h="20" :x="point_postion[8].x"
|
||||
:y="point_postion[8].y" @mousedown="activeMouseDown(8)" :isResizable="false"
|
||||
@moveHandler="moveHandler($event, 8)"><span class="hcolro">←H4→</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[9]" v-if="isshowarray[9]" :w="40" :h="20" :x="point_postion[9].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==9?'action':'']" :isActive="isactivearray[9]" v-if="isshowarray[9]" :w="40" :h="20" :x="point_postion[9].x"
|
||||
:y="point_postion[9].y" @mousedown="activeMouseDown(9)" :isResizable="false"
|
||||
@moveHandler="moveHandler($event, 9)"><span class="hcolro">←H5→</span>
|
||||
</vue3ResizeDrag>
|
||||
|
|
@ -168,6 +168,9 @@
|
|||
padding: 0;
|
||||
line-height: 8px;
|
||||
}
|
||||
.action{
|
||||
background-color: aqua;
|
||||
}
|
||||
</style>
|
||||
<script lang="ts">
|
||||
import {
|
||||
|
|
@ -193,6 +196,7 @@ export default defineComponent({
|
|||
setup() {
|
||||
let $store = useStore();
|
||||
let $t = useI18n();
|
||||
const now_index = ref(0);
|
||||
const value = reactive([
|
||||
{ x: 0, y: 0, number: 0 },
|
||||
{ x: 0, y: 0, number: 0 },
|
||||
|
|
@ -303,6 +307,9 @@ export default defineComponent({
|
|||
onBeforeUnmount(() => {
|
||||
sessionStorage.DensityCorrection = JSON.stringify(set_cache.value);
|
||||
});
|
||||
watch(()=>now_index,(newval,oldval)=>{
|
||||
now_index.value>5?set?.SetBlendingOption("blending_grids_select_point",`density_h:${now_index.value-4}`):set?.SetBlendingOption("blending_grids_select_point",`density_v:${now_index.value+1}`)
|
||||
},{ deep: true })
|
||||
watch(
|
||||
() => configselsect,
|
||||
(newVal, oldVal) => {
|
||||
|
|
@ -527,6 +534,7 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
isshowarray.value[index] = true;
|
||||
}, 100);
|
||||
now_index.value=index
|
||||
};
|
||||
watch(
|
||||
() => value[0],
|
||||
|
|
@ -537,6 +545,7 @@ export default defineComponent({
|
|||
let y = Math.ceil((config.height - newVal.y) / Proportion.value.y);
|
||||
setdianposin(0, x, y);
|
||||
}
|
||||
now_index.value=0
|
||||
save_set_cache();
|
||||
},
|
||||
{ deep: true }
|
||||
|
|
@ -695,14 +704,16 @@ export default defineComponent({
|
|||
};
|
||||
const activeMouseDown = (index: number) => {
|
||||
isactivearray.value[index] = true;
|
||||
if(index>=5){
|
||||
set?.SetBlendingOption("blending_grids_select_point",`density_h:${index-4}`)
|
||||
}else{
|
||||
set?.SetBlendingOption("blending_grids_select_point",`density_v:${index+1}`)
|
||||
}
|
||||
// if(index>=5){
|
||||
// set?.SetBlendingOption("blending_grids_select_point",`density_h:${index-4}`)
|
||||
// }else{
|
||||
// set?.SetBlendingOption("blending_grids_select_point",`density_v:${index+1}`)
|
||||
// }
|
||||
now_index.value=index
|
||||
};
|
||||
initialization();
|
||||
return {
|
||||
now_index,
|
||||
activeMouseDown,
|
||||
model,
|
||||
options,
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@
|
|||
<div class="col-8">
|
||||
<div ref="div" style="background-color: #646464; height: 40vh">
|
||||
<div style="position: absolute">
|
||||
<vue3ResizeDrag
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==0?'action':'']"
|
||||
v-if="isshowarray[0]"
|
||||
:isActive="isactivearray[0]"
|
||||
@mousedown="activeMouseDown(0)"
|
||||
|
|
@ -78,7 +78,7 @@
|
|||
@moveHandler="moveHandler_1"
|
||||
><div class="point">1</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==1?'action':'']"
|
||||
v-if="isshowarray[1]"
|
||||
:isActive="isactivearray[1]"
|
||||
@mousedown="activeMouseDown(1)"
|
||||
|
|
@ -91,7 +91,7 @@
|
|||
@moveHandler="moveHandler_2"
|
||||
><div class="point">2</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==2?'action':'']"
|
||||
v-if="isshowarray[2]"
|
||||
:isActive="isactivearray[2]"
|
||||
@mousedown="activeMouseDown(2)"
|
||||
|
|
@ -104,7 +104,7 @@
|
|||
@moveHandler="moveHandler_3"
|
||||
><div class="point">3</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==3?'action':'']"
|
||||
v-if="isshowarray[3]"
|
||||
:isActive="isactivearray[3]"
|
||||
@mousedown="activeMouseDown(3)"
|
||||
|
|
@ -196,6 +196,9 @@
|
|||
.point{
|
||||
width: 100%;height: 100%;border-radius: 50%;background: #0000ff;color: aliceblue;
|
||||
}
|
||||
.action{
|
||||
background-color: aqua;
|
||||
}
|
||||
</style>
|
||||
<script lang="ts">
|
||||
import vue3ResizeDrag from "src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
|
||||
|
|
@ -271,6 +274,7 @@ export default defineComponent({
|
|||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 0 },
|
||||
]); //点的位置
|
||||
const now_index=ref(0)
|
||||
const isshowarray = ref([true, true, true, true]);
|
||||
const isactivearray = ref([true, true, true, true]);
|
||||
const ste_status = ref(0);
|
||||
|
|
@ -307,7 +311,7 @@ export default defineComponent({
|
|||
});
|
||||
const activeMouseDown = (index: number) => {
|
||||
isactivearray.value[index] = true;
|
||||
set?.SetBlendingOption("blending_grids_select_point",`4:${index+1}`)
|
||||
now_index.value=index
|
||||
};
|
||||
const mouseUpHandler = (index: number) => {
|
||||
isactivearray.value[index] = false;
|
||||
|
|
@ -404,6 +408,7 @@ export default defineComponent({
|
|||
isshowarray.value[0] = true;
|
||||
}, 100);
|
||||
}
|
||||
now_index.value=0
|
||||
save_set_cache();
|
||||
},
|
||||
{ deep: true }
|
||||
|
|
@ -431,6 +436,7 @@ export default defineComponent({
|
|||
isshowarray.value[1] = true;
|
||||
}, 100);
|
||||
}
|
||||
now_index.value=1
|
||||
save_set_cache();
|
||||
},
|
||||
{ deep: true }
|
||||
|
|
@ -460,6 +466,7 @@ export default defineComponent({
|
|||
isshowarray.value[2] = true;
|
||||
}, 100);
|
||||
}
|
||||
now_index.value=2
|
||||
save_set_cache();
|
||||
},
|
||||
{ deep: true }
|
||||
|
|
@ -489,6 +496,7 @@ export default defineComponent({
|
|||
isshowarray.value[3] = true;
|
||||
}, 100);
|
||||
}
|
||||
now_index.value=3
|
||||
save_set_cache();
|
||||
},
|
||||
{ deep: true }
|
||||
|
|
@ -519,7 +527,9 @@ export default defineComponent({
|
|||
},
|
||||
{ deep: true }
|
||||
);
|
||||
|
||||
watch(()=>now_index,(newval,oldval)=>{
|
||||
set?.SetBlendingOption("blending_grids_select_point",`4:${now_index.value+1}`)
|
||||
},{ deep: true })
|
||||
//为了加载 缓存的配置时 同步点的位置
|
||||
const syncpoint = () => {
|
||||
for (let index = 0; index < fourpostion.value.length; index++) {
|
||||
|
|
@ -647,6 +657,7 @@ export default defineComponent({
|
|||
};
|
||||
});
|
||||
return {
|
||||
now_index,
|
||||
div,
|
||||
fourpostion,
|
||||
reset,
|
||||
|
|
|
|||
|
|
@ -91,30 +91,53 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4 offset-4" v-if="group != 4">
|
||||
<div class="col-12" v-if="group != 4">
|
||||
<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 class="btn_bottom"><q-btn size="sm" color="white" @click="add('alpha')" text-color="black" label="↑" /></div>
|
||||
<q-slider track-size="'10vh'" v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
|
||||
<!-- <div class="btn_bottom"><q-btn size="sm" 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"
|
||||
vertical reverse label-always />
|
||||
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div>
|
||||
<!-- <div class="btn_top"><q-btn size="sm" color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div> -->
|
||||
<div> <q-input dense filled type="number" step="0.1" v-model="array[group].alpha" label="alpha"
|
||||
lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') ||
|
||||
$t('Please enter a number'),
|
||||
(val) =>
|
||||
(val >= 0 && val <= 1) || $t('Please enter a value within the range'),
|
||||
]" /></div>
|
||||
<p class="text-center">alpha</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="btn_bottom"><q-btn size="sm" color="white" @click="add('p')" text-color="black" label="↑" /></div>
|
||||
<q-slider track-size="'10vh'" v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
|
||||
<!-- <div class="btn_bottom"><q-btn size="sm" 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"
|
||||
vertical reverse label-always />
|
||||
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('p')" text-color="black" label="↓" /></div>
|
||||
<!-- <div class="btn_top"><q-btn size="sm" color="white" @click="reduce('p')" text-color="black" label="↓" /></div> -->
|
||||
<div> <q-input dense filled type="number" step="0.1" v-model="array[group].p" label="p"
|
||||
lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') ||
|
||||
$t('Please enter a number'),
|
||||
(val) =>
|
||||
(val >= 0 && val <= 16) || $t('Please enter a value within the range'),
|
||||
]" /></div>
|
||||
<p class="text-center">p</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="btn_bottom"><q-btn size="sm" color="white" @click="add('gamma')" text-color="black" label="↑" /></div>
|
||||
<q-slider track-size="'10vh'" v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green"
|
||||
vertical reverse label-always />
|
||||
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div>
|
||||
<!-- <div class="btn_bottom"><q-btn size="sm" 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" vertical reverse label-always />
|
||||
<!-- <div class="btn_top"><q-btn size="sm" color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div> -->
|
||||
<div> <q-input dense filled type="number" step="0.1" v-model="array[group].gamma" label="gamma"
|
||||
lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') ||
|
||||
$t('Please enter a number'),
|
||||
(val) =>
|
||||
(val >= 0 && val <= 16) || $t('Please enter 0-100'),
|
||||
]" /></div>
|
||||
<p class="text-center">gamma</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -59,39 +59,39 @@
|
|||
<div class="col-8">
|
||||
<div ref="div" style="background-color: #646464; height: 40vh">
|
||||
<div style="position: absolute">
|
||||
<vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="20" :h="20" :x="ninepostion[0].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==0?'action':'']" :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">
|
||||
<div class="point">1</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="20" :h="20" :x="ninepostion[1].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==1?'action':'']" :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">
|
||||
<div class="point">2</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="20" :h="20" :x="ninepostion[2].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==2?'action':'']" :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">
|
||||
<div class="point">3</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="20" :h="20" :x="ninepostion[3].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==3?'action':'']" :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">
|
||||
<div class="point">4</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="20" :h="20" :x="ninepostion[4].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==4?'action':'']" :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">
|
||||
<div class="point">5</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="20" :h="20" :x="ninepostion[5].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==5?'action':'']" :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">
|
||||
<div class="point">6</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="20" :h="20" :x="ninepostion[6].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==6?'action':'']" :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">
|
||||
<div class="point">7</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="20" :h="20" :x="ninepostion[7].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==7?'action':'']" :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">
|
||||
<div class="point">8</div>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="20" :h="20" :x="ninepostion[8].x"
|
||||
<vue3ResizeDrag style="border: 0;" :class="[now_index==8?'action':'']" :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">
|
||||
<div class="point">9</div>
|
||||
</vue3ResizeDrag>
|
||||
|
|
@ -154,6 +154,9 @@
|
|||
.point{
|
||||
width: 100%;height: 100%;border-radius: 50%;background: #00ff00;color: aliceblue;
|
||||
}
|
||||
.action{
|
||||
background-color: aqua;
|
||||
}
|
||||
</style>
|
||||
<script lang="ts">
|
||||
import vue3ResizeDrag from "/src/third_lib/vue3-resize-drag/components/vue3-resize-drag/index.vue";
|
||||
|
|
@ -187,6 +190,7 @@ export default defineComponent({
|
|||
let Proportion = ref({ x: 0, y: 0 });
|
||||
let centor = ref({ x: 0, y: 0 });
|
||||
const div = ref();
|
||||
const now_index = ref(0);
|
||||
let nine = reactive([
|
||||
{ x: 0, y: 1080 },
|
||||
{ x: 960, y: 1920 },
|
||||
|
|
@ -211,7 +215,7 @@ export default defineComponent({
|
|||
]);
|
||||
const activeMouseDown = (index: number) => {
|
||||
isactivearray.value[index] = true;
|
||||
set?.SetBlendingOption("blending_grids_select_point",`9:${index+1}`)
|
||||
now_index.value=index
|
||||
};
|
||||
//用于计算当前投影仪的索引
|
||||
let serverconfig = JSON.parse($store.state.fusion_configuration);
|
||||
|
|
@ -766,6 +770,7 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
isshowarray.value[index] = true;
|
||||
}, 100);
|
||||
now_index.value=index
|
||||
};
|
||||
const save = () => {
|
||||
set?.SaveBlendingConfig("");
|
||||
|
|
@ -775,7 +780,11 @@ export default defineComponent({
|
|||
});
|
||||
}, 1000);
|
||||
};
|
||||
watch(()=>now_index,(newval,oldval)=>{
|
||||
set?.SetBlendingOption("blending_grids_select_point",`9:${now_index.value+1}`)
|
||||
},{ deep: true })
|
||||
return {
|
||||
now_index,
|
||||
model,
|
||||
save,
|
||||
nine,
|
||||
|
|
|
|||
|
|
@ -446,5 +446,6 @@ export default {
|
|||
"disable_clip":"disable clip",
|
||||
"show_mask":"hide desktop",
|
||||
"save_bmp":"save bmp",
|
||||
"disable_blending_params":"disable blending params"
|
||||
"disable_blending_params":"disable blending params",
|
||||
"Please enter a value within the range":"Please enter a value within the range"
|
||||
};
|
||||
|
|
|
|||
|
|
@ -715,5 +715,6 @@ export default {
|
|||
"disable_clip":"禁用裁剪",
|
||||
"show_mask":"隐藏桌面",
|
||||
"save_bmp":"保存BMP",
|
||||
"disable_blending_params":"禁用融合参数"
|
||||
"disable_blending_params":"禁用融合参数",
|
||||
"Please enter a value within the range":"请输入范围内的值"
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue