投影机数量从后端动态显示个数
This commit is contained in:
parent
584f228c91
commit
41d1913f72
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="row">
|
||||
<div class="col-2">
|
||||
<q-input filled type="number" class="q-pt-md" style="text-align: center;" :dense="true" @focus="isactivearray[0] = false"
|
||||
v-model="four[0].x" label="x" lazy-rules />
|
||||
<q-input filled type="number" class="q-pt-md" style="text-align: center;" :dense="true"
|
||||
@focus="isactivearray[0] = false" v-model="four[0].x" label="x" lazy-rules />
|
||||
<q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[0] = false"
|
||||
v-model="four[0].y" label="y" lazy-rules />
|
||||
<q-btn color="white" @click="reset(0)" text-color="black" :label="$t('reset')" />
|
||||
|
|
@ -19,23 +19,28 @@
|
|||
</div>
|
||||
|
||||
<div class="col-2"></div>
|
||||
<div class="col-8"> <div ref="div" style="background-color: #7fffd4;height: 40vh;">
|
||||
<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"
|
||||
@moveHandler="moveHandler_1"><span>{{$t('point')}}1</span>
|
||||
@moveHandler="moveHandler_1"><span>{{ $t('point') }}1</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag v-if="isshowarray[1]" :isActive="isactivearray[1]" @mousedown="activeMouseDown(1)"
|
||||
@mouseUpHandler="mouseUpHandler(1)" :w="30" :h="20" :x="point2.x" :y="point2.y"
|
||||
:isResizable="false" @moveHandler="moveHandler_2"><span>{{$t('point')}}2</span> </vue3ResizeDrag>
|
||||
:isResizable="false" @moveHandler="moveHandler_2"><span>{{ $t('point') }}2</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag v-if="isshowarray[2]" :isActive="isactivearray[2]" @mousedown="activeMouseDown(2)"
|
||||
@mouseUpHandler="mouseUpHandler(2)" :w="30" :h="20" :x="point3.x" :y="point3.y"
|
||||
:isResizable="false" @moveHandler="moveHandler_3"><span>{{$t('point')}}3</span> </vue3ResizeDrag>
|
||||
:isResizable="false" @moveHandler="moveHandler_3"><span>{{ $t('point') }}3</span>
|
||||
</vue3ResizeDrag>
|
||||
<vue3ResizeDrag v-if="isshowarray[3]" :isActive="isactivearray[3]" @mousedown="activeMouseDown(3)"
|
||||
@mouseUpHandler="mouseUpHandler(3)" :w="30" :h="20" :x="point4.x" :y="point4.y"
|
||||
:isResizable="false" @moveHandler="moveHandler_4"><span>{{$t('point')}}4</span> </vue3ResizeDrag>
|
||||
:isResizable="false" @moveHandler="moveHandler_4"><span>{{ $t('point') }}4</span>
|
||||
</vue3ResizeDrag>
|
||||
</div>
|
||||
</div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2"></div>
|
||||
|
||||
<div class="col-2">
|
||||
|
|
@ -46,7 +51,8 @@
|
|||
<q-btn color="white" @click="reset(2)" text-color="black" :label="$t('reset')" />
|
||||
</div>
|
||||
<div class="col-8">
|
||||
<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')" />
|
||||
<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"
|
||||
|
|
@ -80,18 +86,14 @@ export default defineComponent({
|
|||
setup() {
|
||||
let $store = useStore();
|
||||
let $t = useI18n();
|
||||
const setIndexProjector = () => {
|
||||
console.log($store.state.selected_projector);
|
||||
};
|
||||
let config=JSON.parse($store.state.fusion_configuration).projectors[0];
|
||||
let config = JSON.parse($store.state.fusion_configuration).projectors[0];
|
||||
let set = GlobalData.getInstance().getCurrentClient();
|
||||
const configselsect = computed(() => {return $store.state.selected_projector})
|
||||
const configselsect = computed(() => { return $store.state.selected_projector })
|
||||
let four = ref([{ x: config.point4[0].x, y: config.point4[0].y }, { x: config.point4[1].x, y: config.point4[1].y }, { x: config.point4[2].x, y: config.point4[2].x }, { x: config.point4[3].x, y: config.point4[3].y }]);
|
||||
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);
|
||||
let options = ref(['10', '20', '30', '40', '50']);
|
||||
let Proportion = ref({ x: 0, y: 0 });
|
||||
let point1 = reactive({ x: 0, y: 0 });
|
||||
|
|
@ -102,10 +104,12 @@ export default defineComponent({
|
|||
const isactivearray = ref([true, true, true, true])
|
||||
const x1 = ref(0);
|
||||
const y1 = ref(0);
|
||||
const { offset } = dom
|
||||
|
||||
const save=()=>{
|
||||
const save = () => {
|
||||
set?.SaveBlendingConfig("")
|
||||
setTimeout(() => {
|
||||
set?.GetBlendingConfig("").then((res) => { $store.commit("setfusion_configuration", res?.config); })
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
const activeMouseDown = (index: number) => {
|
||||
|
|
@ -120,7 +124,6 @@ export default defineComponent({
|
|||
})
|
||||
|
||||
const setpoa = () => {
|
||||
console.log(config);
|
||||
point1.x = 0
|
||||
point1.y = 0
|
||||
|
||||
|
|
@ -148,19 +151,18 @@ export default defineComponent({
|
|||
|
||||
fourpostion.value[3].x = div.value.offsetWidth - 25
|
||||
fourpostion.value[3].y = div.value.offsetHeight - 25
|
||||
|
||||
|
||||
Proportion.value.x = config.width / (div.value.offsetWidth - 25)
|
||||
Proportion.value.y = config.height / (div.value.offsetHeight - 25)
|
||||
for (let index = 0; index < fourpostion.value.length; index++) {
|
||||
defaultfourpostion.value[index].x = fourpostion.value[index].x ;
|
||||
defaultfourpostion.value[index].x = fourpostion.value[index].x;
|
||||
defaultfourpostion.value[index].y = fourpostion.value[index].y;
|
||||
defaultfour.value[index].x=config.point4[index].def_x
|
||||
defaultfour.value[index].y=config.point4[index].def_y
|
||||
defaultfour.value[index].x = config.point4[index].def_x
|
||||
defaultfour.value[index].y = config.point4[index].def_y
|
||||
}
|
||||
}
|
||||
watch(() => four.value[0], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 1, Number(newVal.x), Number(newVal.y));
|
||||
///
|
||||
if ($store.state.enablefusion) 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);
|
||||
let y = Math.ceil(((config.height - newVal.y) / Proportion.value.y));
|
||||
|
|
@ -171,12 +173,10 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
isshowarray.value[0] = true
|
||||
}, 100);
|
||||
///
|
||||
}
|
||||
}, { deep: true })
|
||||
watch(() => four.value[1], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 2, Number(newVal.x), Number(newVal.y));
|
||||
///
|
||||
if ($store.state.enablefusion) 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);
|
||||
let y = Math.ceil(((config.height - newVal.y) / Proportion.value.y));
|
||||
|
|
@ -188,15 +188,13 @@ export default defineComponent({
|
|||
isshowarray.value[1] = true
|
||||
}, 100);
|
||||
}
|
||||
///
|
||||
}, { deep: true })
|
||||
watch(() => four.value[2], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 3, Number(newVal.x), Number(newVal.y));
|
||||
///
|
||||
if ($store.state.enablefusion) 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);
|
||||
let y = Math.ceil((config.height / Proportion.value.y) - (newVal.y / Proportion.value.y));
|
||||
|
||||
|
||||
point3.value.x = x
|
||||
point3.value.y = y
|
||||
isshowarray.value[2] = false
|
||||
|
|
@ -204,15 +202,13 @@ export default defineComponent({
|
|||
isshowarray.value[2] = true
|
||||
}, 100);
|
||||
}
|
||||
///
|
||||
}, { deep: true })
|
||||
watch(() => four.value[3], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion)set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 4, 4, Number(newVal.x), Number(newVal.y));
|
||||
///
|
||||
if ($store.state.enablefusion) 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);
|
||||
let y = Math.ceil((config.height / Proportion.value.y) - (newVal.y / Proportion.value.y));
|
||||
|
||||
|
||||
point4.value.x = x
|
||||
point4.value.y = y
|
||||
isshowarray.value[3] = false
|
||||
|
|
@ -220,23 +216,20 @@ export default defineComponent({
|
|||
isshowarray.value[3] = true
|
||||
}, 100);
|
||||
}
|
||||
///
|
||||
}, { deep: true })
|
||||
|
||||
///
|
||||
|
||||
watch(() => configselsect, (newVal, oldVal) => {
|
||||
//console.log(newVal);
|
||||
let tmp=JSON.parse($store.state.fusion_configuration);
|
||||
let fortmp=null
|
||||
let tmp = JSON.parse($store.state.fusion_configuration);
|
||||
let fortmp = null
|
||||
let i
|
||||
for(i of tmp.projectors){
|
||||
if(i.col===$store.getters.GetTheCurrentlySelectedCamera[0]&&i.row===$store.getters.GetTheCurrentlySelectedCamera[1]){
|
||||
fortmp=JSON.parse(JSON.stringify(i))
|
||||
for (i of tmp.projectors) {
|
||||
if (i.col === $store.getters.GetTheCurrentlySelectedCamera[1] && i.row === $store.getters.GetTheCurrentlySelectedCamera[0]) {
|
||||
fortmp = JSON.parse(JSON.stringify(i))
|
||||
}
|
||||
}
|
||||
config=JSON.parse(JSON.stringify(fortmp))
|
||||
console.log(config)
|
||||
config = JSON.parse(JSON.stringify(fortmp))
|
||||
setpoa();
|
||||
}, { deep: true })
|
||||
|
||||
const reset = (index: number) => {
|
||||
|
|
@ -266,7 +259,6 @@ export default defineComponent({
|
|||
fourpostion.value[3].x = div.value.offsetWidth - 25
|
||||
fourpostion.value[3].y = div.value.offsetHeight - 25
|
||||
}
|
||||
// auto set config
|
||||
four.value[index].x = config.point4[index].def_x
|
||||
four.value[index].y = config.point4[index].def_y
|
||||
|
||||
|
|
@ -276,17 +268,17 @@ export default defineComponent({
|
|||
}, 100);
|
||||
}
|
||||
|
||||
const resetall=()=>{
|
||||
|
||||
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
|
||||
four.value[index].x=defaultfour.value[index].x
|
||||
four.value[index].y=defaultfour.value[index].y
|
||||
fourpostion.value[index].x = defaultfourpostion.value[index].x
|
||||
fourpostion.value[index].y = defaultfourpostion.value[index].y
|
||||
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
|
||||
isshowarray.value[index] = true
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
|
|
@ -300,27 +292,22 @@ export default defineComponent({
|
|||
isactivearray.value[0] = true
|
||||
}
|
||||
const moveHandler_2 = (data: any) => {
|
||||
//y0 xconfig.width
|
||||
let x = Math.ceil((data.left - fourpostion.value[1].x) * Proportion.value.x + config.width);
|
||||
let y = Math.ceil((config.height - data.top * Proportion.value.y - fourpostion.value[1].y));
|
||||
four.value[1].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
four.value[1].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
|
||||
//console.log("x :"+x+" y:"+y)
|
||||
}
|
||||
const moveHandler_3 = (data: any) => {
|
||||
let x = Math.ceil((data.left - fourpostion.value[2].x) * Proportion.value.x);
|
||||
let y = Math.abs(Math.ceil((data.top - fourpostion.value[2].y) * Proportion.value.y));
|
||||
four.value[2].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
four.value[2].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
|
||||
console.log("x :" + x + " y:" + y)
|
||||
//console.log("x :" + data.left + " y:" + (1370-data.top));
|
||||
}
|
||||
const moveHandler_4 = (data: any) => {
|
||||
let x = Math.ceil((data.left - fourpostion.value[3].x) * Proportion.value.x + config.width);
|
||||
let y = Math.abs(Math.ceil((data.top - fourpostion.value[3].y) * Proportion.value.y));
|
||||
four.value[3].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
four.value[3].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
|
||||
//console.log("x :"+x+" y:"+y)
|
||||
}
|
||||
return {
|
||||
div,
|
||||
|
|
|
|||
|
|
@ -1,34 +1,23 @@
|
|||
<template>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<p class="text-center">{{$t('Set the fusion band width')}}</p>
|
||||
<p class="text-center">{{ $t('Set the fusion band width') }}</p>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row">
|
||||
<div class="col-4 offset-4">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-toggle
|
||||
class="float-right"
|
||||
v-model="array2[selectedprojector][0].isshow"
|
||||
label=""
|
||||
/>
|
||||
<q-toggle class="float-right" v-model="array[0].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
filled
|
||||
type="number"
|
||||
@focus="group = 0"
|
||||
v-model="array2[selectedprojector][0].value"
|
||||
:label="$t('upper fusion zone parameters')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
<q-input filled type="number" @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) =>
|
||||
(val > -1 && val < 1080) || $t('Please enter 0-100'),
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -39,54 +28,32 @@
|
|||
<div class="col-6">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-toggle
|
||||
class="float-right"
|
||||
v-model="array2[selectedprojector][1].isshow"
|
||||
label=""
|
||||
/>
|
||||
<q-toggle class="float-right" v-model="array[1].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
filled
|
||||
type="number"
|
||||
@focus="group = 1"
|
||||
v-model="array2[selectedprojector][1].value"
|
||||
:label="$t('Left fusion Band Parameters')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
<q-input filled type="number" @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) =>
|
||||
(val > -1 && val < 1920) || $t('Please enter 0-100'),
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-toggle
|
||||
class="float-right"
|
||||
v-model="array2[selectedprojector][2].isshow"
|
||||
label=""
|
||||
/>
|
||||
<q-toggle class="float-right" v-model="array[2].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
filled
|
||||
type="number"
|
||||
@focus="group = 2"
|
||||
v-model="array2[selectedprojector][2].value"
|
||||
:label="$t('Right fusion Band Parameters')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
<q-input filled type="number" @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) =>
|
||||
(val > -1 && val < 1920) || $t('Please enter 0-100'),
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -97,83 +64,46 @@
|
|||
<div class="col-4 offset-4">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-toggle
|
||||
class="float-right"
|
||||
v-model="array2[selectedprojector][3].isshow"
|
||||
label=""
|
||||
/>
|
||||
<q-toggle class="float-right" v-model="array[3].isshow" label="" />
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
filled
|
||||
type="number"
|
||||
@focus="group = 3"
|
||||
v-model="array2[selectedprojector][3].value"
|
||||
:label="$t('Lower fusion Zone Parameters')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
<q-input filled type="number" @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) =>
|
||||
(val > -1 && val < 1080) || $t('Please enter 0-100'),
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<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 v-if="!(group == 4) && array[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>
|
||||
<q-slider
|
||||
v-model="array[group].alpha"
|
||||
:min="0.0"
|
||||
@change="chang('alpha')"
|
||||
:max="1"
|
||||
:step="0.01"
|
||||
color="green"
|
||||
vertical
|
||||
reverse
|
||||
label-always
|
||||
/>
|
||||
<q-slider v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
|
||||
vertical reverse label-always />
|
||||
<p class="text-center">alpha</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<q-slider
|
||||
v-model="array[group].p"
|
||||
:min="0"
|
||||
@change="chang('p')"
|
||||
:max="2.5"
|
||||
:step="0.01"
|
||||
color="green"
|
||||
vertical
|
||||
reverse
|
||||
label-always
|
||||
/>
|
||||
<q-slider v-model="array[group].p" :min="0" @change="chang('p')" :max="2.5" :step="0.01" color="green"
|
||||
vertical reverse label-always />
|
||||
<p class="text-center">p</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<q-slider
|
||||
v-model="array[group].gamma"
|
||||
:min="0"
|
||||
@change="chang('gamma')"
|
||||
:max="2.5"
|
||||
:step="0.01"
|
||||
color="green"
|
||||
vertical
|
||||
reverse
|
||||
label-always
|
||||
/>
|
||||
<q-slider v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="2.5" :step="0.01" color="green"
|
||||
vertical reverse label-always />
|
||||
<p class="text-center">gamma</p>
|
||||
</div>
|
||||
</div>
|
||||
<q-btn color="white" @click="save" text-color="black" :label="$t('save config')" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -205,30 +135,18 @@ export default defineComponent({
|
|||
let set = GlobalData.getInstance().getCurrentClient();
|
||||
let $store = useStore();
|
||||
let $t = useI18n();
|
||||
const age = ref(0);
|
||||
const standard = ref(0);
|
||||
const group = ref(4);
|
||||
const enablefusion=ref(false);
|
||||
let array: any = ref([
|
||||
{ alpha: 0, p: 0, gamma: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0 },
|
||||
{ alpha: 0, p: 0, gamma: 0 },
|
||||
const set_cache: any = ref([]);
|
||||
const enablefusion = ref(false);
|
||||
let array: any = reactive([
|
||||
{ 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 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
|
||||
let serverconfig=JSON.parse($store.state.fusion_configuration);
|
||||
const selectedprojector = computed(() => {
|
||||
return $store.getters.GetTheCurrentlySelectedCamera[0]*serverconfig.col+$store.getters.GetTheCurrentlySelectedCamera[1]
|
||||
})
|
||||
const options = ref([
|
||||
{
|
||||
|
|
@ -248,153 +166,151 @@ export default defineComponent({
|
|||
value: 3,
|
||||
},
|
||||
]);
|
||||
const accept = ref(false);
|
||||
const text = ref("");
|
||||
const model = computed({
|
||||
get() {
|
||||
return $store.state.selected_projector;
|
||||
},
|
||||
set(newValue) {
|
||||
$store.commit("setSelectedProjector", newValue);
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
const use_set_cache = () => {
|
||||
if (set_cache.value[selectedprojector.value]) {
|
||||
let tmp = JSON.parse(set_cache.value[selectedprojector.value]);
|
||||
deepcopy(array, tmp)
|
||||
}
|
||||
};
|
||||
const deepcopy = (o1: any, o2: any) => {
|
||||
for (let k in o2) {
|
||||
if (typeof o2[k] === 'object') {
|
||||
o1[k] = {};
|
||||
deepcopy(o1[k], o2[k]);
|
||||
} else {
|
||||
o1[k] = o2[k];
|
||||
}
|
||||
}
|
||||
}
|
||||
const save_set_cache = () => {
|
||||
set_cache.value[selectedprojector.value] = JSON.stringify(array);
|
||||
}
|
||||
let config = JSON.parse($store.state.fusion_configuration).projectors[0];
|
||||
const configselsect = computed(() => { return $store.state.selected_projector })
|
||||
watch(() => configselsect, (newVal, oldVal) => {
|
||||
let tmp = JSON.parse($store.state.fusion_configuration);
|
||||
let fortmp = null
|
||||
let i
|
||||
for (i of tmp.projectors) {
|
||||
if (i.col === $store.getters.GetTheCurrentlySelectedCamera[1] && i.row === $store.getters.GetTheCurrentlySelectedCamera[0]) {
|
||||
fortmp = JSON.parse(JSON.stringify(i))
|
||||
}
|
||||
}
|
||||
config = JSON.parse(JSON.stringify(fortmp))
|
||||
startconfig()
|
||||
use_set_cache()
|
||||
}, { deep: true })
|
||||
const chang = (type: string) => {
|
||||
if (type == "alpha") {
|
||||
if($store.state.enablefusion)set?.setBlendingAlphaParam(
|
||||
if ($store.state.enablefusion) set?.setBlendingAlphaParam(
|
||||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||||
group.value,
|
||||
array.value[group.value].alpha
|
||||
array[group.value].alpha
|
||||
);
|
||||
}
|
||||
if (type == "p") {
|
||||
if($store.state.enablefusion)set?.setBlendingPowerParam(
|
||||
if ($store.state.enablefusion) set?.setBlendingPowerParam(
|
||||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||||
group.value,
|
||||
array.value[group.value].p
|
||||
array[group.value].p
|
||||
);
|
||||
}
|
||||
if (type == "gamma") {
|
||||
if($store.state.enablefusion)set?.setBlendingGammaParam(
|
||||
if ($store.state.enablefusion) set?.setBlendingGammaParam(
|
||||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||||
group.value,
|
||||
array.value[group.value].gamma
|
||||
array[group.value].gamma
|
||||
);
|
||||
}
|
||||
//console.log("giao")
|
||||
save_set_cache();
|
||||
};
|
||||
//0：左融合带，1：上融合带，2：右融合带，3：下融合带
|
||||
watch(
|
||||
() => array2[0][0],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion)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[0][1],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion)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[0][2],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion)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[0][3],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion)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 }
|
||||
);
|
||||
const startconfig = () => {
|
||||
for (let index = 0; index < array.length; index++) {
|
||||
array[index].gamma = config.params[index].gamma
|
||||
array[index].alpha = config.params[index].alpha
|
||||
array[index].p = config.params[index].power
|
||||
array[index].isshow = config.params[index].enable
|
||||
array[index].value = Number(config.params[index].size)
|
||||
}
|
||||
}
|
||||
startconfig()
|
||||
|
||||
///
|
||||
|
||||
watch(
|
||||
() => array2[1][0],
|
||||
watch(
|
||||
() => array[0],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion) 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
|
||||
if ($store.state.enablefusion) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 1, array[0].isshow, Number(array[0].value));
|
||||
if (!array[0].isshow) {
|
||||
array[0].value = 0
|
||||
}
|
||||
save_set_cache()
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
watch(
|
||||
() => array2[1][1],
|
||||
() => array[1],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],0,array2[1][1].isshow,Number(array2[1][1].value));
|
||||
if(!array2[1][1].isshow){
|
||||
array2[1][1].value=0
|
||||
if ($store.state.enablefusion) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 0, array[1].isshow, Number(array[1].value));
|
||||
if (!array[1].isshow) {
|
||||
array[1].value = 0
|
||||
}
|
||||
save_set_cache()
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
watch(
|
||||
() => array2[1][2],
|
||||
() => array[2],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion) 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
|
||||
if ($store.state.enablefusion) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 2, array[2].isshow, Number(array[2].value));
|
||||
if (!array[2].isshow) {
|
||||
array[2].value = 0
|
||||
}
|
||||
save_set_cache()
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
watch(
|
||||
() => array2[1][3],
|
||||
() => array[3],
|
||||
(newVal, oldVal) => {
|
||||
if($store.state.enablefusion) 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
|
||||
if ($store.state.enablefusion) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 3, array[3].isshow, Number(array[3].value));
|
||||
if (!array[3].isshow) {
|
||||
array[3].value = 0
|
||||
}
|
||||
save_set_cache()
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
///
|
||||
|
||||
watch(
|
||||
() => enablefusion,
|
||||
(newVal, oldVal) => {
|
||||
$store.commit('setenablefusion',newVal.value);
|
||||
$store.commit('setenablefusion', newVal.value);
|
||||
set?.EnableBlending(newVal.value);
|
||||
},{ deep: true }
|
||||
}, { deep: true }
|
||||
);
|
||||
const changenablefusion=()=>{
|
||||
$store.commit('setenablefusion',enablefusion.value);
|
||||
const changenablefusion = () => {
|
||||
$store.commit('setenablefusion', enablefusion.value);
|
||||
}
|
||||
const save = () => {
|
||||
set?.SaveBlendingConfig("")
|
||||
setTimeout(() => {
|
||||
set?.GetBlendingConfig("").then((res) => { $store.commit("setfusion_configuration", res?.config); })
|
||||
}, 1000);
|
||||
}
|
||||
return {
|
||||
model,
|
||||
age,
|
||||
accept,
|
||||
standard,
|
||||
options,
|
||||
group,
|
||||
text,
|
||||
array,
|
||||
chang,
|
||||
enablefusion,
|
||||
array2,
|
||||
changenablefusion,
|
||||
selectedprojector
|
||||
selectedprojector,
|
||||
save
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -159,9 +159,6 @@ export default defineComponent({
|
|||
setup() {
|
||||
let $store = useStore();
|
||||
let $t = useI18n();
|
||||
const setIndexProjector = () => {
|
||||
console.log($store.state.selected_projector);
|
||||
};
|
||||
let config=JSON.parse($store.state.fusion_configuration).projectors[0];
|
||||
const configselsect = computed(() => {return $store.state.selected_projector})
|
||||
let Proportion = ref({ x: 0, y: 0 });
|
||||
|
|
@ -169,7 +166,6 @@ export default defineComponent({
|
|||
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
|
||||
}
|
||||
|
|
@ -180,83 +176,87 @@ export default defineComponent({
|
|||
const moveHandler_1 = (data: any) => {
|
||||
let x = Math.ceil((data.left - ninepostion.value[0].x) * Proportion.value.x);
|
||||
let y = config.height - Math.ceil((data.top - ninepostion.value[0].y) * Proportion.value.y);
|
||||
|
||||
nine.value[0].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[0].y = y > config.height ? config.height : 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 x = config.width/2 + Math.ceil((data.left - ninepostion.value[1].x) * centor.value.x);
|
||||
let y = config.height - Math.ceil((data.top - ninepostion.value[1].y) * Proportion.value.y);
|
||||
|
||||
nine.value[1].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[1].y = y > config.height ? config.height : y && y < 0 ? 0 : y
|
||||
}
|
||||
const moveHandler_3 = (data: any) => {
|
||||
let x = config.width + Math.ceil((data.left - ninepostion.value[2].x) * Proportion.value.x);
|
||||
let y = config.height - Math.ceil((data.top - ninepostion.value[2].y) * Proportion.value.y);
|
||||
|
||||
nine.value[2].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[2].y = y > config.height ? config.height : 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);
|
||||
|
||||
let y = config.height/2 - Math.ceil((data.top - ninepostion.value[3].y) * Proportion.value.y);
|
||||
nine.value[3].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[3].y = y > config.height ? config.height : 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);
|
||||
|
||||
let x = config.width/2 + Math.ceil((data.left - ninepostion.value[4].x) * centor.value.x);
|
||||
let y = config.height/2 - Math.ceil((data.top - ninepostion.value[4].y) * Proportion.value.y);
|
||||
nine.value[4].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[4].y = y > config.height ? config.height : y && y < 0 ? 0 : y
|
||||
}
|
||||
const moveHandler_6 = (data: any) => {
|
||||
let x = config.width + 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);
|
||||
|
||||
let y = config.height/2 - Math.ceil((data.top - ninepostion.value[5].y) * Proportion.value.y);
|
||||
nine.value[5].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[5].y = y > config.height ? config.height : 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 > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[6].y = y > config.height ? config.height : 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 x = config.width/2 + 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 > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[7].y = y > config.height ? config.height : y && y < 0 ? 0 : y
|
||||
}
|
||||
const moveHandler_9 = (data: any) => {
|
||||
let x = config.width + 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 > config.width ? config.width : x && x < 0 ? 0 : x;
|
||||
nine.value[8].y = y > config.height ? config.height : y && y < 0 ? 0 : y
|
||||
}
|
||||
watch(() => configselsect, (newVal, oldVal) => {
|
||||
//console.log(newVal);
|
||||
let tmp=JSON.parse($store.state.fusion_configuration);
|
||||
let fortmp=null
|
||||
let i
|
||||
for(i of tmp.projectors){
|
||||
if(i.col===$store.getters.GetTheCurrentlySelectedCamera[1]&&i.row===$store.getters.GetTheCurrentlySelectedCamera[0]){
|
||||
if(i.col === $store.getters.GetTheCurrentlySelectedCamera[1] && i.row === $store.getters.GetTheCurrentlySelectedCamera[0]){
|
||||
fortmp=JSON.parse(JSON.stringify(i))
|
||||
}
|
||||
}
|
||||
config=JSON.parse(JSON.stringify(fortmp))
|
||||
console.log(config)
|
||||
startpostion();
|
||||
setninepostion();
|
||||
}, { deep: true })
|
||||
onMounted(() => {
|
||||
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();
|
||||
})
|
||||
const setninepostion=()=>{
|
||||
for (let index = 0; index < defaultninepostion.value.length; index++) {
|
||||
nine.value[index].x=config.point9[index].x
|
||||
nine.value[index].y=config.point9[index].y
|
||||
}
|
||||
}
|
||||
setninepostion();
|
||||
const startpostion = () => {
|
||||
ninepostion.value[0].x = 0
|
||||
ninepostion.value[0].y = 0
|
||||
|
|
@ -300,68 +300,45 @@ export default defineComponent({
|
|||
|
||||
|
||||
}
|
||||
///
|
||||
const reset = (index: number) => {
|
||||
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 == 0) {
|
||||
ninepostion.value[index].x = 0
|
||||
ninepostion.value[index].y = 0
|
||||
}
|
||||
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 == 1) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth / 2 - 25
|
||||
ninepostion.value[index].y = 0
|
||||
}
|
||||
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 == 2) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth - 25
|
||||
ninepostion.value[index].y = 0
|
||||
}
|
||||
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 == 3) {
|
||||
ninepostion.value[index].x = 0
|
||||
ninepostion.value[index].y = div.value.offsetHeight / 2 - 8
|
||||
}
|
||||
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 == 4) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth / 2 - 25
|
||||
ninepostion.value[index].y = div.value.offsetHeight / 2 - 8
|
||||
}
|
||||
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 == 5) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth - 25
|
||||
ninepostion.value[index].y = div.value.offsetHeight / 2
|
||||
}
|
||||
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 == 6) {
|
||||
ninepostion.value[index].x = 0
|
||||
ninepostion.value[index].y = div.value.offsetHeight - 25
|
||||
}
|
||||
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 == 7) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth / 2
|
||||
ninepostion.value[index].y = div.value.offsetHeight - 25
|
||||
}
|
||||
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
|
||||
if (index == 8) {
|
||||
ninepostion.value[index].x = div.value.offsetWidth - 25
|
||||
ninepostion.value[index].y = div.value.offsetHeight - 25
|
||||
}
|
||||
//data is flase
|
||||
// nine.value[index].x = config.point9[index].def_x
|
||||
// nine.value[index].y = config.point9[index].def_y
|
||||
nine.value[index].x = config.point9[index].def_x
|
||||
nine.value[index].y = config.point9[index].def_y
|
||||
isshowarray.value[index] = false
|
||||
setTimeout(() => {
|
||||
isshowarray.value[index] = true
|
||||
|
|
@ -369,39 +346,35 @@ export default defineComponent({
|
|||
}
|
||||
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
|
||||
|
||||
|
||||
nine.value[index].x = config.point9[index].def_x
|
||||
nine.value[index].y = config.point9[index].def_y
|
||||
isshowarray.value[index] = false
|
||||
setTimeout(() => {
|
||||
isshowarray.value[index] = true
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
///
|
||||
watch(() => nine.value[0], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion) 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);
|
||||
let y = Math.ceil(((config.height - newVal.y) / Proportion.value.y));
|
||||
setdianposin(0, x, y)
|
||||
}
|
||||
///
|
||||
|
||||
}, { deep: true })
|
||||
watch(() => nine.value[1], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion) 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);
|
||||
let y = Math.ceil(((config.height - newVal.y) / Proportion.value.y));
|
||||
setdianposin(1, x, y)
|
||||
}
|
||||
///
|
||||
|
||||
}, { deep: true })
|
||||
watch(() => nine.value[2], (newVal, oldVal) => {
|
||||
if($store.state.enablefusion) set?.setBlendingCorrection($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1], 9, 3, Number(newVal.x), Number(newVal.y));
|
||||
|
|
@ -459,9 +432,7 @@ export default defineComponent({
|
|||
setdianposin(8, x, y)
|
||||
}
|
||||
}, { deep: true })
|
||||
///
|
||||
let model = ref(null);
|
||||
let options = ref(['10', '20', '30', '40', '50']);
|
||||
let set = GlobalData.getInstance().getCurrentClient();
|
||||
const setdianposin = (index: number, x: number, y: number) => {
|
||||
ninepostion.value[index].x = x
|
||||
|
|
@ -471,16 +442,15 @@ export default defineComponent({
|
|||
setTimeout(() => {
|
||||
isshowarray.value[index] = true
|
||||
}, 100);
|
||||
|
||||
|
||||
|
||||
}
|
||||
const save=()=>{
|
||||
set?.SaveBlendingConfig("")
|
||||
setTimeout(() => {
|
||||
set?.GetBlendingConfig("").then((res) => { $store.commit("setfusion_configuration", res?.config); })
|
||||
}, 1000);
|
||||
}
|
||||
return {
|
||||
model,
|
||||
options,
|
||||
save,
|
||||
nine,
|
||||
moveHandler_1,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
">
|
||||
<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">
|
||||
|
|
@ -31,15 +30,18 @@
|
|||
<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="'1/0'"></projector-item>
|
||||
<!-- row 在前col在后 -->
|
||||
<div v-for="(item,index_row) in config.row">
|
||||
<projector-item v-for="(item,index_col) in config.col" class="w-100" :llabel="$t('Projector') + (index_row*config.col+index_col+1)" :lvalue="index_row+'/'+index_col"></projector-item>
|
||||
</div>
|
||||
|
||||
<div class="col-12" style="text-align: center">
|
||||
{{ $t('Whether to enable mixing') }}<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"
|
||||
<q-btn-toggle :disable="!$store.state.enablefusion" no-caps v-model="options" toggle-color="primary"
|
||||
:options="[
|
||||
{ label: $t('FusionLocale'), value: 'FusionLocale' },
|
||||
{
|
||||
|
|
@ -93,9 +95,6 @@ import {
|
|||
computed,
|
||||
onMounted,
|
||||
onBeforeMount,
|
||||
onUpdated,
|
||||
onBeforeUnmount,
|
||||
nextTick,
|
||||
} from "vue";
|
||||
import { useStore } from "src/store";
|
||||
import { useQuasar, copyToClipboard } from "quasar";
|
||||
|
|
@ -128,11 +127,11 @@ export default defineComponent({
|
|||
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 config=ref({col:0,row:0});
|
||||
const EnableBlending = ref(false);
|
||||
let optionsstr = ref();
|
||||
optionsstr.value = "FusionLocale";
|
||||
|
|
@ -147,16 +146,15 @@ export default defineComponent({
|
|||
watch(
|
||||
() => EnableBlending,
|
||||
(newVal, oldVal) => {
|
||||
$store.commit("setEnableBlending", newVal.value);
|
||||
$store.commit("setEnablefusion", newVal.value);
|
||||
set?.EnableBlending(newVal.value);
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
let data = ref({});
|
||||
|
||||
onBeforeMount(() => {
|
||||
setTimeout(() => {
|
||||
set?.GetBlendingConfig("").then((res)=>{let tmp=JSON.parse(res?res.config:"");EnableBlending.value=tmp.enable;$store.commit("setEnableBlending", tmp.enable);;$store.commit("setfusion_configuration", res?.config);})
|
||||
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);})
|
||||
}, 1000);
|
||||
})
|
||||
return {
|
||||
|
|
@ -165,6 +163,7 @@ export default defineComponent({
|
|||
copyToClipboard,
|
||||
showDialog,
|
||||
EnableBlending,
|
||||
config
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue