优化窗口大小更改时逻辑
This commit is contained in:
parent
4d967cb4ae
commit
ff63d3dc67
|
|
@ -332,6 +332,29 @@ export default defineComponent({
|
|||
|
||||
})
|
||||
|
||||
//窗口变动重新渲染
|
||||
onMounted(() => {
|
||||
//监听窗口变化
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
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
|
||||
for (let index = 0; index < config.hor_density.length + config.ver_density.length; index++) {
|
||||
if (index < 5) {
|
||||
point_postion[index].y = default_location[index].y = Height * index
|
||||
point_postion[index].x = default_location[index].x = Width * 2
|
||||
} else {
|
||||
point_postion[index].y = default_location[index].y = Height * 2
|
||||
point_postion[index].x = default_location[index].x = Width * (index - 5)
|
||||
}
|
||||
}
|
||||
})();
|
||||
};
|
||||
});
|
||||
|
||||
const setdianposin = (index: number, x: number, y: number) => {
|
||||
point_postion[index].x = x
|
||||
point_postion[index].y = y
|
||||
|
|
@ -437,7 +460,6 @@ export default defineComponent({
|
|||
}, { deep: true })
|
||||
|
||||
watch(() => value[9], (newVal, oldVal) => {
|
||||
//console.log(newVal)
|
||||
send_configuration(9, newVal.x, newVal.number)
|
||||
if (!isactivearray.value[9]) {
|
||||
let x = Math.ceil(newVal.x / Proportion.value.x);
|
||||
|
|
@ -451,7 +473,6 @@ export default defineComponent({
|
|||
const send_configuration = (index: number, value: number, number: number) => {
|
||||
|
||||
if (ste_status.value == 0) {
|
||||
//console.log("Send")
|
||||
if (index < 5) {
|
||||
set?.SetBlendingVerDensity($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], index + 1, Number(value))
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -209,6 +209,7 @@ export default defineComponent({
|
|||
} else {
|
||||
|
||||
}
|
||||
set_point_x()
|
||||
//syncpoint()
|
||||
|
||||
}
|
||||
|
|
@ -295,6 +296,7 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
ste_status.value = 0;
|
||||
}, 100);
|
||||
set_point_x()
|
||||
}, { deep: true })
|
||||
|
||||
//为了加载 缓存的配置时 同步点的位置
|
||||
|
|
@ -303,7 +305,36 @@ export default defineComponent({
|
|||
isactivearray.value[index] = false
|
||||
}
|
||||
}
|
||||
//手动同步 我裂开
|
||||
const set_point_x = () => {
|
||||
//console.log("kaishi jisuan ")
|
||||
let x = Math.ceil(four[0].x/ Proportion.value.x);
|
||||
let y = Math.ceil(((config.height - four[0].y) / Proportion.value.y));
|
||||
set_point(0,x,y);
|
||||
|
||||
x = Math.ceil(four[1].x / Proportion.value.x);
|
||||
y = Math.ceil(((config.height - four[1].y) / Proportion.value.y));
|
||||
set_point(1,x,y);
|
||||
|
||||
x = Math.ceil(four[2].x / Proportion.value.x);
|
||||
y = Math.ceil((config.height / Proportion.value.y) - (four[2].y / Proportion.value.y));
|
||||
set_point(2,x,y);
|
||||
|
||||
x = Math.ceil(four[3].x / Proportion.value.x);
|
||||
y = Math.ceil((config.height / Proportion.value.y) - (four[3].y / Proportion.value.y));
|
||||
set_point(3,x,y);
|
||||
}
|
||||
|
||||
const set_point = (index:number,x:number,y:number) => {
|
||||
|
||||
points[index].x = x
|
||||
points[index].y = y
|
||||
isshowarray.value[index] = false
|
||||
isactivearray.value[index] = false
|
||||
setTimeout(() => {
|
||||
isshowarray.value[index] = true
|
||||
}, 100);
|
||||
}
|
||||
const reset = (index: number) => {
|
||||
fourpostion.value[index].x = defaultfourpostion.value[index].x;
|
||||
fourpostion.value[index].y = defaultfourpostion.value[index].y;
|
||||
|
|
@ -357,6 +388,20 @@ export default defineComponent({
|
|||
four[3].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
|
||||
save_set_cache()
|
||||
}
|
||||
//窗口变动重新渲染
|
||||
onMounted(() => {
|
||||
//监听窗口变化
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
ste_status.value = 1;
|
||||
setpoa();
|
||||
|
||||
setTimeout(() => {
|
||||
ste_status.value = 0;
|
||||
}, 100);
|
||||
})();
|
||||
};
|
||||
});
|
||||
return {
|
||||
div,
|
||||
fourpostion,
|
||||
|
|
|
|||
|
|
@ -12,8 +12,8 @@
|
|||
<q-toggle class="float-right" v-model="array[0].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled type="number" :bg-color="group==0?'cyan-1':''" @focus="group = 0" v-model="array[0].value"
|
||||
:label="$t('upper fusion zone parameters')" lazy-rules :rules="[
|
||||
<q-input filled type="number" :bg-color="group == 0 ? 'cyan-1' : ''" @focus="group = 0"
|
||||
v-model="array[0].value" :label="$t('upper fusion zone parameters')" lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') || $t('Please enter a number'),
|
||||
(val) =>
|
||||
|
|
@ -32,8 +32,8 @@
|
|||
<q-toggle class="float-right" v-model="array[1].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled type="number" :bg-color="group==1?'cyan-1':''" @focus="group = 1" v-model="array[1].value"
|
||||
:label="$t('Left fusion Band Parameters')" lazy-rules :rules="[
|
||||
<q-input filled type="number" :bg-color="group == 1 ? 'cyan-1' : ''" @focus="group = 1"
|
||||
v-model="array[1].value" :label="$t('Left fusion Band Parameters')" lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') || $t('Please enter a number'),
|
||||
(val) =>
|
||||
|
|
@ -48,8 +48,8 @@
|
|||
<q-toggle class="float-right" v-model="array[2].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled type="number" :bg-color="group==2?'cyan-1':''" @focus="group = 2" v-model="array[2].value"
|
||||
:label="$t('Right fusion Band Parameters')" lazy-rules :rules="[
|
||||
<q-input filled type="number" :bg-color="group == 2 ? 'cyan-1' : ''" @focus="group = 2"
|
||||
v-model="array[2].value" :label="$t('Right fusion Band Parameters')" lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') || $t('Please enter a number'),
|
||||
(val) =>
|
||||
|
|
@ -68,8 +68,8 @@
|
|||
<q-toggle class="float-right" v-model="array[3].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled type="number" :bg-color="group==3?'cyan-1':''" @focus="group = 3" v-model="array[3].value"
|
||||
:label="$t('Lower fusion Zone Parameters')" lazy-rules :rules="[
|
||||
<q-input filled type="number" :bg-color="group == 3 ? 'cyan-1' : ''" @focus="group = 3"
|
||||
v-model="array[3].value" :label="$t('Lower fusion Zone Parameters')" lazy-rules :rules="[
|
||||
(val) =>
|
||||
(val !== null && val !== '') || $t('Please enter a number'),
|
||||
(val) =>
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4 offset-4">
|
||||
<div class="col-4 offset-4" v-if="group != 4">
|
||||
<p class="text-center">{{ $t('Set Fusion Band Parameters') }}</p>
|
||||
<div style="display: flex; justify-content: space-evenly">
|
||||
<div>
|
||||
|
|
@ -137,7 +137,7 @@ export default defineComponent({
|
|||
let set = GlobalData.getInstance().getCurrentClient();
|
||||
let $store = useStore();
|
||||
let $t = useI18n();
|
||||
const group = ref(0);
|
||||
const group = ref(4);
|
||||
const set_cache: any = ref([]);
|
||||
const enablefusion = ref(false);
|
||||
let array: any = reactive([
|
||||
|
|
@ -145,6 +145,7 @@ export default defineComponent({
|
|||
{ alpha: 0, p: 0, gamma: 0, isshow: false, value: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0, isshow: false, value: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0, isshow: false, value: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0, isshow: false, value: 0 },
|
||||
]);
|
||||
let serverconfig = JSON.parse($store.state.fusion_configuration);
|
||||
const selectedprojector = computed(() => {
|
||||
|
|
@ -189,6 +190,7 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
ste_status.value = 0;
|
||||
}, 100);
|
||||
setnowindex()
|
||||
}, { deep: true })
|
||||
const chang = (type: string) => {
|
||||
if (type == "alpha") {
|
||||
|
|
@ -217,8 +219,34 @@ export default defineComponent({
|
|||
}
|
||||
save_set_cache();
|
||||
};
|
||||
|
||||
const setnowindex = () => {
|
||||
let sum = 0;
|
||||
let indexx = 4;
|
||||
for (let index = 0; index < array.length - 1; index++) {
|
||||
if (array[index].isshow && Number(array[index].value) > 0) {
|
||||
sum++;
|
||||
indexx = index;
|
||||
}
|
||||
}
|
||||
if (sum == 1) {
|
||||
group.value = indexx
|
||||
} else {
|
||||
group.value = 4
|
||||
}
|
||||
}
|
||||
|
||||
const getconfig = () => {
|
||||
try {
|
||||
set?.GetBlendingConfig("").then((res) => { })
|
||||
set?.GetBlendingConfig("").then((res) => { let tmp = JSON.parse(res ? res.config : ""); $store.commit("setEnablefusion", tmp.enable); $store.commit("setfusion_configuration", res?.config); })
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
const startconfig = () => {
|
||||
for (let index = 0; index < array.length; index++) {
|
||||
for (let index = 0; index < array.length - 1; index++) {
|
||||
array[index].gamma = config.params[index].gamma.toFixed(2)
|
||||
array[index].alpha = config.params[index].alpha.toFixed(2)
|
||||
array[index].p = config.params[index].power.toFixed(2)
|
||||
|
|
@ -229,7 +257,8 @@ export default defineComponent({
|
|||
|
||||
}
|
||||
const use_server_config = () => {
|
||||
for (let index = 0; index < array.length; index++) {
|
||||
|
||||
for (let index = 0; index < array.length - 1; index++) {
|
||||
array[index].gamma = config.params[index].gamma.toFixed(2)
|
||||
array[index].alpha = config.params[index].alpha.toFixed(2)
|
||||
array[index].p = config.params[index].power.toFixed(2)
|
||||
|
|
|
|||
|
|
@ -57,32 +57,32 @@
|
|||
<div class="col-8">
|
||||
<div ref="div" style="background-color: #7fffd4;height: 40vh;">
|
||||
<div style="position:absolute;">
|
||||
<vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="20" :x="ninepostion[0].x"
|
||||
:y="ninepostion[0].y" @mousedown="activeMouseDown(0)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[0]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="20" :x="ninepostion[1].x"
|
||||
:y="ninepostion[1].y" @mousedown="activeMouseDown(1)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[1]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="20" :x="ninepostion[2].x"
|
||||
:y="ninepostion[2].y" @mousedown="activeMouseDown(2)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[2]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="20" :x="ninepostion[3].x"
|
||||
:y="ninepostion[3].y" @mousedown="activeMouseDown(3)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[3]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="20" :x="ninepostion[4].x"
|
||||
:y="ninepostion[4].y" @mousedown="activeMouseDown(4)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[4]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="30" :h="20" :x="ninepostion[5].x"
|
||||
:y="ninepostion[5].y" @mousedown="activeMouseDown(5)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[5]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="30" :h="20" :x="ninepostion[6].x"
|
||||
:y="ninepostion[6].y" @mousedown="activeMouseDown(6)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[6]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="30" :h="20" :x="ninepostion[7].x"
|
||||
:y="ninepostion[7].y" @mousedown="activeMouseDown(7)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[7]" 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>
|
||||
<vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="30" :h="20" :x="ninepostion[8].x"
|
||||
:y="ninepostion[8].y" @mousedown="activeMouseDown(8)" :isResizable="false"
|
||||
<vue3ResizeDrag :isActive="isactivearray[8]" 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>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -100,8 +100,8 @@
|
|||
</div>
|
||||
<div class="col-4">
|
||||
<div class="row">
|
||||
<div class="col-6"> <q-btn color="white" @click="resetall" text-color="black"
|
||||
:label="$t('resetall')" /></div>
|
||||
<div class="col-6"> <q-btn color="white" @click="resetall" text-color="black" :label="$t('resetall')" />
|
||||
</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"
|
||||
|
|
@ -257,7 +257,6 @@ export default defineComponent({
|
|||
deepcopy(nine, tmp)
|
||||
|
||||
}
|
||||
//console.log(nine)
|
||||
syncpoint()
|
||||
};
|
||||
const deepcopy = (o1: any, o2: any) => {
|
||||
|
|
@ -312,6 +311,29 @@ export default defineComponent({
|
|||
ste_status.value = 0;
|
||||
}, 100);
|
||||
})
|
||||
|
||||
//窗口变动重新渲染
|
||||
onMounted(() => {
|
||||
//监听窗口变化
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
ste_status.value = 1;
|
||||
startpostion();
|
||||
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 = config.point9[index].def_x
|
||||
defaultnine.value[index].y = config.point9[index].def_y
|
||||
}
|
||||
setninepostion();
|
||||
syncpoint()
|
||||
setTimeout(() => {
|
||||
ste_status.value = 0;
|
||||
}, 100);
|
||||
})();
|
||||
};
|
||||
});
|
||||
|
||||
const setninepostion = () => {
|
||||
for (let index = 0; index < defaultninepostion.value.length; index++) {
|
||||
nine[index].x = config.point9[index].x
|
||||
|
|
|
|||
|
|
@ -134,18 +134,17 @@ export default defineComponent({
|
|||
show_dialog.value = true;
|
||||
};
|
||||
const resize = ref(true)
|
||||
//窗口变动重新渲染
|
||||
onMounted(() => {
|
||||
//监听窗口变化
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
console.log("resize")
|
||||
resize.value = false; setTimeout(() => {
|
||||
resize.value = true
|
||||
}, 100);
|
||||
})();
|
||||
};
|
||||
});
|
||||
// //窗口变动重新渲染
|
||||
// onMounted(() => {
|
||||
// //监听窗口变化
|
||||
// window.onresize = () => {
|
||||
// return (() => {
|
||||
// resize.value = false; setTimeout(() => {
|
||||
// resize.value = true
|
||||
// }, 100);
|
||||
// })();
|
||||
// };
|
||||
// });
|
||||
|
||||
|
||||
//投影机数量
|
||||
|
|
@ -185,6 +184,15 @@ export default defineComponent({
|
|||
clear()
|
||||
set?.GetBlendingConfig("").then((res) => { let tmp = JSON.parse(res ? res.config : ""); EnableBlending.value = tmp.enable; $store.commit("setEnablefusion", tmp.enable); config.value.col = tmp.col; config.value.row = tmp.row; $store.commit("setfusion_configuration", res?.config); })
|
||||
}
|
||||
const getconfig=()=>{
|
||||
try {
|
||||
set?.GetBlendingConfig("").then((res)=>{})
|
||||
set?.GetBlendingConfig("").then((res) => { let tmp = JSON.parse(res ? res.config : ""); $store.commit("setEnablefusion", tmp.enable); $store.commit("setfusion_configuration", res?.config); })
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
const clear = () => {
|
||||
|
||||
sessionStorage.removeItem('DensityCorrection')
|
||||
|
|
@ -195,6 +203,7 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
sessionStorage.removeItem('FusionLocale')
|
||||
}, 500)
|
||||
getconfig()
|
||||
}
|
||||
|
||||
onBeforeMount(() => {
|
||||
|
|
@ -210,7 +219,7 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
|
||||
}, 500);
|
||||
}, 1000);
|
||||
})
|
||||
return {
|
||||
resize,
|
||||
|
|
|
|||
|
|
@ -599,6 +599,7 @@ export default defineComponent({
|
|||
const getconfig=()=>{
|
||||
try {
|
||||
set?.GetBlendingConfig("").then((res)=>{})
|
||||
set?.GetBlendingConfig("").then((res) => { let tmp = JSON.parse(res ? res.config : ""); $store.commit("setEnablefusion", tmp.enable); $store.commit("setfusion_configuration", res?.config); })
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue