lingling
/
media_player_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

加入对4点校正的键盘支持

This commit is contained in:
shefengchun 2023-02-08 15:20:20 +08:00
parent f6dd438627
commit c7eb71ee72
7 changed files with 257 additions and 315 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/FusionSettings/DensityCorrection.vue
View File

@ -4,28 +4,28 @@
<div class="col-8 q-pt-md"> <div class="col-8 q-pt-md">
<div ref="div" style="width: 100%; background-color: #646464; height: 100%"> <div ref="div" style="width: 100%; background-color: #646464; height: 100%">
<div style="position: absolute"> <div style="position: absolute">
<Vue3DraggableResizable v-for="(item, index) in config.ver_density.length" :initW="20" :initH="20" <Vue3DraggableResizable :class="[options_model_v==index?'action':'']" v-for="(item, index) in config.ver_density.length" :initW="20" :initH="20"
:resizable="false" :x="0" v-model:y="point_postion[index].y" :disabledX="true" :resizable="false" :x="0" v-model:y="point_postion[index].y" :disabledX="true"
@activated="now_index = index" @dragging="dragStartHandle($event, index, 'v')"> @activated="now_index = index" @dragging="dragStartHandle($event, index, 'v')">
<span>v{{ <span>v{{
index+ 1 index+ 1
}}</span> }}</span>
</Vue3DraggableResizable> </Vue3DraggableResizable>
<Vue3DraggableResizable v-for="(item, index) in config.ver_density.length" :initW="20" :initH="20" <Vue3DraggableResizable :class="[options_model_v==index?'action':'']" v-for="(item, index) in config.ver_density.length" :initW="20" :initH="20"
:resizable="false" :x="max_x_y[0]" v-model:y="point_postion[index].y" @activated="now_index = index" :resizable="false" :x="max_x_y[0]" v-model:y="point_postion[index].y" @activated="now_index = index"
@dragging="dragStartHandle($event, index, 'v')"> @dragging="dragStartHandle($event, index, 'v')">
<span>v{{ <span>v{{
index+ 1 index+ 1
}}</span> }}</span>
</Vue3DraggableResizable> </Vue3DraggableResizable>
<Vue3DraggableResizable v-for="(item, index) in config.hor_density.length" :initW="20" :initH="20" <Vue3DraggableResizable :class="[options_model_h==index+5?'action':'']" v-for="(item, index) in config.hor_density.length" :initW="20" :initH="20"
:resizable="false" v-model:x="point_postion[index + 5].x" :y="-20" @activated="now_index = index + 5" :resizable="false" v-model:x="point_postion[index + 5].x" :y="-20" @activated="now_index = index + 5"
:disabledY="true" @dragging="dragStartHandle($event, index + 5, 'h')"> :disabledY="true" @dragging="dragStartHandle($event, index + 5, 'h')">
<span>h{{ <span>h{{
index+ 1 index+ 1
}}</span> }}</span>
</Vue3DraggableResizable> </Vue3DraggableResizable>
<Vue3DraggableResizable v-for="(item, index) in config.hor_density.length" :initW="20" :initH="20" <Vue3DraggableResizable :class="[options_model_h==index+5?'action':'']" v-for="(item, index) in config.hor_density.length" :initW="20" :initH="20"
:resizable="false" v-model:x="point_postion[index + 5].x" @activated="now_index = index + 5" :resizable="false" v-model:x="point_postion[index + 5].x" @activated="now_index = index + 5"
:y="max_x_y[1] + 20" @dragging="dragStartHandle($event, index + 5, 'h')"> :y="max_x_y[1] + 20" @dragging="dragStartHandle($event, index + 5, 'h')">
<span>h{{ <span>h{{
@ -68,18 +68,24 @@
<div> <div>
<div class="row"> <div class="row">
<div class="col-1"></div> <div class="col-1"></div>
<div class="col-2"> <q-select class="q-pt-md" :dense="true" filled v-model="options_model_v" :options="options_v" emit-value <div class="col-2"> <q-select class="q-pt-md" label="水平" :dense="true" filled v-model="options_model_v" :options="options_v" emit-value
map-options /></div> map-options /></div>
<div class="col-2"> <q-input filled type="number" class="q-pt-md" :dense="true" <div class="col-2"> <q-input filled type="number" class="q-pt-md" :dense="true"
v-model="value[options_model_v].y" @update:model-value="chang(options_model_v, $event)" lazy-rules /> v-model="value[options_model_v].y" @update:model-value="chang(options_model_v, $event)" lazy-rules />
</div> </div>
<div class="q-pt-md">
<q-btn color="white" @click="reset(options_model_v)" text-color="black" :label="$t('reset')" />
</div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-1"></div> <div class="col-1"></div>
<div class="col-2"> <q-select class="q-pt-md" :dense="true" filled v-model="options_model_h" :options="options_h" emit-value <div class="col-2"> <q-select class="q-pt-md" label="垂直" :dense="true" filled v-model="options_model_h" :options="options_h" emit-value
map-options /></div> map-options /></div>
<div class="col-2"> <q-input filled type="number" class="q-pt-md" :dense="true" <div class="col-2"> <q-input filled type="number" class="q-pt-md" :dense="true"
v-model="value[options_model_h].x" @update:model-value="chang(options_model_h+5, $event)" lazy-rules /> v-model="value[options_model_h].x" @update:model-value="chang(options_model_h, $event)" lazy-rules />
</div>
<div class="q-pt-md">
<q-btn color="white" @click="reset(options_model_v)" text-color="black" :label="$t('reset')" />
</div> </div>
</div> </div>
@ -201,11 +207,11 @@ export default defineComponent({
if (index < 5) { if (index < 5) {
x = default_location[9].y; x = default_location[9].y;
y = Math.ceil((config.height - $event) / Proportion.value.y); y = Math.ceil((config.height - $event) / Proportion.value.y);
send_configuration(index, $event) send_configuration(index, $event,'v')
} else { } else {
x = Math.ceil($event / Proportion.value.x); x = Math.ceil($event / Proportion.value.x);
y = default_location[0].x; y = default_location[0].x;
send_configuration(index, $event) send_configuration(index-5, $event,'h')
} }
point_postion[index].x = Number(x) point_postion[index].x = Number(x)
point_postion[index].y = Number(y) point_postion[index].y = Number(y)
@ -437,20 +443,22 @@ export default defineComponent({
const send_configuration = ( const send_configuration = (
index: number, index: number,
value: number, value: number,
type:string,
) => { ) => {
if (ste_status.value == 0) { if (ste_status.value == 0) {
if (index <= 5) { if (type=='v') {
set?.SetBlendingVerDensity( set?.SetBlendingVerDensity(
$store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[0],
$store.getters.GetTheCurrentlySelectedCamera[1], $store.getters.GetTheCurrentlySelectedCamera[1],
index + 1, index + 1,
Number(value) Number(value)
); );
} else { }
if (type=='h') {
set?.SetBlendingHorDensity( set?.SetBlendingHorDensity(
$store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[0],
$store.getters.GetTheCurrentlySelectedCamera[1], $store.getters.GetTheCurrentlySelectedCamera[1],
index - 4, index -4,
Number(value) Number(value)
); );
} }
@ -474,7 +482,7 @@ export default defineComponent({
(obj_y - default_location[index].y) * Proportion.value.y (obj_y - default_location[index].y) * Proportion.value.y
); );
value[index].x = x > config.width ? config.width : x && x < 0 ? 0 : x; value[index].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
send_configuration(index, x) send_configuration(index, x,'h')
} }
if (type == 'v') { if (type == 'v') {
let x = Math.ceil(obj_x * Proportion.value.x); let x = Math.ceil(obj_x * Proportion.value.x);
@ -485,7 +493,7 @@ export default defineComponent({
(obj_y - default_location[index].y) * Proportion.value.y (obj_y - default_location[index].y) * Proportion.value.y
); );
value[index].y = y > config.height ? config.height : y && y < 0 ? 0 : y; value[index].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
send_configuration(index, y) send_configuration(index, y,'v')
} }
} }
const options_v: any = reactive([]); const options_v: any = reactive([]);

367
src/components/FusionSettings/FourPointCalibration.vue
View File

@ -1,121 +1,46 @@
<template> <template>
<div class="row"> <div class="row">
<div class="col-2"> <div class="col-2">
<q-input <q-input filled type="number" class="q-pt-xs" style="text-align: center" :dense="true"
filled @focus="isactivearray[0] = false" v-model="four[0].x" label="x" lazy-rules />
type="number" <q-input filled type="number" class="q-pt-xs" :dense="true" @focus="isactivearray[0] = false" v-model="four[0].y"
class="q-pt-xs" label="y" lazy-rules />
style="text-align: center" <q-btn size="sm" dense color="white" @click="reset(0)" text-color="black"
:dense="true" :label="$t('reset') + $t('point') + '1'" />
@focus="isactivearray[0] = false"
v-model="four[0].x"
label="x"
lazy-rules
/>
<q-input
filled
type="number"
class="q-pt-xs"
:dense="true"
@focus="isactivearray[0] = false"
v-model="four[0].y"
label="y"
lazy-rules
/>
<q-btn
size="sm" dense
color="white"
@click="reset(0)"
text-color="black"
:label="$t('reset') + $t('point') + '1'"
/>
</div> </div>
<div class="col-8"></div> <div class="col-8"></div>
<div class="col-2"> <div class="col-2">
<q-input <q-input filled type="number" class="q-pt-xs" :dense="true" @focus="isactivearray[1] = false" v-model="four[1].x"
filled label="x" lazy-rules />
type="number" <q-input filled type="number" class="q-pt-xs" :dense="true" @focus="isactivearray[1] = false" v-model="four[1].y"
class="q-pt-xs" label="y" lazy-rules />
:dense="true" <q-btn size="sm" dense color="white" @click="reset(1)" text-color="black"
@focus="isactivearray[1] = false" :label="$t('reset') + $t('point') + '2'" />
v-model="four[1].x"
label="x"
lazy-rules
/>
<q-input
filled
type="number"
class="q-pt-xs"
:dense="true"
@focus="isactivearray[1] = false"
v-model="four[1].y"
label="y"
lazy-rules
/>
<q-btn
size="sm" dense
color="white"
@click="reset(1)"
text-color="black"
:label="$t('reset') + $t('point') + '2'"
/>
</div> </div>
<div class="col-2"></div> <div class="col-2"></div>
<div class="col-8"> <div class="col-8">
<div ref="div" style="background-color: #646464; height: 40vh"> <div ref="div" style="background-color: #646464; height: 40vh">
<div style="position: absolute"> <div style="position: absolute">
<vue3ResizeDrag style="border: 0;" :class="[now_index==0?'action':'']" <vue3ResizeDrag style="border: 0;" :class="[now_index == 0 ? 'action' : '']" v-if="isshowarray[0]"
v-if="isshowarray[0]" :isActive="isactivearray[0]" @mousedown="activeMouseDown(0)" @mouseUpHandler="mouseUpHandler(0)" :w="20"
:isActive="isactivearray[0]" :h="20" :x="points[0].x" :y="points[0].y" :isResizable="false" @moveHandler="moveHandler_1">
@mousedown="activeMouseDown(0)" <div class="point">1</div>
@mouseUpHandler="mouseUpHandler(0)"
:w="20"
:h="20"
:x="points[0].x"
:y="points[0].y"
:isResizable="false"
@moveHandler="moveHandler_1"
><div class="point">1</div>
</vue3ResizeDrag> </vue3ResizeDrag>
<vue3ResizeDrag style="border: 0;" :class="[now_index==1?'action':'']" <vue3ResizeDrag style="border: 0;" :class="[now_index == 1 ? 'action' : '']" v-if="isshowarray[1]"
v-if="isshowarray[1]" :isActive="isactivearray[1]" @mousedown="activeMouseDown(1)" @mouseUpHandler="mouseUpHandler(1)" :w="20"
:isActive="isactivearray[1]" :h="20" :x="points[1].x" :y="points[1].y" :isResizable="false" @moveHandler="moveHandler_2">
@mousedown="activeMouseDown(1)" <div class="point">2</div>
@mouseUpHandler="mouseUpHandler(1)"
:w="20"
:h="20"
:x="points[1].x"
:y="points[1].y"
:isResizable="false"
@moveHandler="moveHandler_2"
><div class="point">2</div>
</vue3ResizeDrag> </vue3ResizeDrag>
<vue3ResizeDrag style="border: 0;" :class="[now_index==2?'action':'']" <vue3ResizeDrag style="border: 0;" :class="[now_index == 2 ? 'action' : '']" v-if="isshowarray[2]"
v-if="isshowarray[2]" :isActive="isactivearray[2]" @mousedown="activeMouseDown(2)" @mouseUpHandler="mouseUpHandler(2)" :w="20"
:isActive="isactivearray[2]" :h="20" :x="points[2].x" :y="points[2].y" :isResizable="false" @moveHandler="moveHandler_3">
@mousedown="activeMouseDown(2)" <div class="point">3</div>
@mouseUpHandler="mouseUpHandler(2)"
:w="20"
:h="20"
:x="points[2].x"
:y="points[2].y"
:isResizable="false"
@moveHandler="moveHandler_3"
><div class="point">3</div>
</vue3ResizeDrag> </vue3ResizeDrag>
<vue3ResizeDrag style="border: 0;" :class="[now_index==3?'action':'']" <vue3ResizeDrag style="border: 0;" :class="[now_index == 3 ? 'action' : '']" v-if="isshowarray[3]"
v-if="isshowarray[3]" :isActive="isactivearray[3]" @mousedown="activeMouseDown(3)" @mouseUpHandler="mouseUpHandler(3)" :w="20"
:isActive="isactivearray[3]" :h="20" :x="points[3].x" :y="points[3].y" :isResizable="false" @moveHandler="moveHandler_4">
@mousedown="activeMouseDown(3)" <div class="point">4</div>
@mouseUpHandler="mouseUpHandler(3)"
:w="20"
:h="20"
:x="points[3].x"
:y="points[3].y"
:isResizable="false"
@moveHandler="moveHandler_4"
><div class="point">4</div>
</vue3ResizeDrag> </vue3ResizeDrag>
</div> </div>
</div> </div>
@ -123,80 +48,37 @@
<div class="col-2"></div> <div class="col-2"></div>
<div class="col-2"> <div class="col-2">
<q-input <q-input filled type="number" class="q-pt-xs" :dense="true" @focus="isactivearray[2] = false" v-model="four[2].x"
filled label="x" lazy-rules />
type="number" <q-input filled type="number" class="q-pt-xs" :dense="true" @focus="isactivearray[2] = false" v-model="four[2].y"
class="q-pt-xs" label="y" lazy-rules />
:dense="true" <q-btn size="sm" dense color="white" @click="reset(2)" text-color="black"
@focus="isactivearray[2] = false" :label="$t('reset') + $t('point') + '3'" />
v-model="four[2].x"
label="x"
lazy-rules
/>
<q-input
filled
type="number"
class="q-pt-xs"
:dense="true"
@focus="isactivearray[2] = false"
v-model="four[2].y"
label="y"
lazy-rules
/>
<q-btn
size="sm" dense
color="white"
@click="reset(2)"
text-color="black"
:label="$t('reset') + $t('point') + '3'"
/>
</div> </div>
<div class="col-8"> <div class="col-8">
<q-btn <q-btn size="sm" dense color="white" @click="resetall" text-color="black" :label="$t('resetall')" />
size="sm" dense
color="white"
@click="resetall"
text-color="black"
:label="$t('resetall')"
/>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-input <q-input filled type="number" class="" :dense="true" @focus="isactivearray[3] = false" v-model="four[3].x"
filled label="x" lazy-rules />
type="number" <q-input filled type="number" class="q-pt-md" :dense="true" @focus="isactivearray[3] = false" v-model="four[3].y"
class="" label="y" lazy-rules />
:dense="true" <q-btn size="sm" dense color="white" @click="reset(3)" text-color="black"
@focus="isactivearray[3] = false" :label="$t('reset') + $t('point') + '4'" />
v-model="four[3].x"
label="x"
lazy-rules
/>
<q-input
filled
type="number"
class="q-pt-md"
:dense="true"
@focus="isactivearray[3] = false"
v-model="four[3].y"
label="y"
lazy-rules
/>
<q-btn
size="sm" dense
color="white"
@click="reset(3)"
text-color="black"
:label="$t('reset') + $t('point') + '4'"
/>
</div> </div>
</div> </div>
</template> </template>
<style scoped> <style scoped>
.point{ .point {
width: 100%;height: 100%;border-radius: 50%;background: #0000ff;color: aliceblue; width: 100%;
height: 100%;
border-radius: 50%;
background: #0000ff;
color: aliceblue;
} }
.action{
.action {
background-color: aqua; background-color: aqua;
} }
</style> </style>
@ -219,6 +101,7 @@ import { useStore } from "src/store";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import ClientConnection from "src/common/ClientConnection"; import ClientConnection from "src/common/ClientConnection";
import GlobalData from "src/common/GlobalData"; import GlobalData from "src/common/GlobalData";
import { Console } from "console";
export default defineComponent({ export default defineComponent({
name: "ComponentFourPointCalibration", name: "ComponentFourPointCalibration",
@ -274,7 +157,7 @@ export default defineComponent({
{ x: 0, y: 0 }, { x: 0, y: 0 },
{ x: 0, y: 0 }, { x: 0, y: 0 },
]); //点的位置 ]); //点的位置
const now_index=ref(0) const now_index = ref(0)
const isshowarray = ref([true, true, true, true]); const isshowarray = ref([true, true, true, true]);
const isactivearray = ref([true, true, true, true]); const isactivearray = ref([true, true, true, true]);
const ste_status = ref(0); const ste_status = ref(0);
@ -311,13 +194,53 @@ export default defineComponent({
}); });
const activeMouseDown = (index: number) => { const activeMouseDown = (index: number) => {
isactivearray.value[index] = true; isactivearray.value[index] = true;
now_index.value=index now_index.value = index
}; };
const mouseUpHandler = (index: number) => { const mouseUpHandler = (index: number) => {
isactivearray.value[index] = false; isactivearray.value[index] = false;
}; };
const keyDown = () => {
document.onkeydown = (e) => {
// let x = Math.ceil(four[now_index.value].x / Proportion.value.x);
// let y = Math.ceil((config.height - four[now_index.value].y) / Proportion.value.y);
// points[now_index.value].x!=x?points[now_index.value].x = x:''
// points[now_index.value].y!= y?points[now_index.value].y = y:''
let e1 = e || window.event || arguments.callee.caller.arguments[0]
switch (e.code) {
case "KeyW":
points[now_index.value].x
points[now_index.value].y--
break;
case "KeyA":
points[now_index.value].x--;
points[now_index.value].y
break;
case "KeyS":
points[now_index.value].x;
points[now_index.value].y++
break;
case "KeyD":
points[now_index.value].x++;
points[now_index.value].y
break;
default:
break;
}
let tmp = { left: points[now_index.value].x, top: points[now_index.value].y }
eval(`moveHandler_${now_index.value+1}(tmp)`);
isactivearray.value[now_index.value] = false;
isshowarray.value[now_index.value] = false;
setTimeout(() => {
isshowarray.value[now_index.value] = true;
}, 100);
}
}
onMounted(() => { onMounted(() => {
ste_status.value = 1; ste_status.value = 1;
keyDown()
setpoa(); setpoa();
setTimeout(() => { setTimeout(() => {
@ -327,8 +250,6 @@ export default defineComponent({
const use_server_config = () => { const use_server_config = () => {
for (let index = 0; index < fourpostion.value.length; index++) { 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 = config.point4[index].def_x; defaultfour.value[index].x = config.point4[index].def_x;
defaultfour.value[index].y = config.point4[index].def_y; defaultfour.value[index].y = config.point4[index].def_y;
four[index].x = config.point4[index].x; four[index].x = config.point4[index].x;
@ -338,50 +259,50 @@ export default defineComponent({
const setpoa = () => { const setpoa = () => {
try { try {
points[0].x = 0; points[0].x = 0;
points[0].y = 0; points[0].y = 0;
points[1].x = div.value.offsetWidth - 25; points[1].x = div.value.offsetWidth - 25;
points[1].y = 0; points[1].y = 0;
points[2].x = 0; points[2].x = 0;
points[2].y = div.value.offsetHeight - 25; points[2].y = div.value.offsetHeight - 25;
points[3].x = div.value.offsetWidth - 25; points[3].x = div.value.offsetWidth - 25;
points[3].y = div.value.offsetHeight - 25; points[3].y = div.value.offsetHeight - 25;
fourpostion.value[0].x = 0; fourpostion.value[0].x = 0;
fourpostion.value[0].y = 0; fourpostion.value[0].y = 0;
fourpostion.value[1].x = div.value.offsetWidth - 25; fourpostion.value[1].x = div.value.offsetWidth - 25;
fourpostion.value[1].y = 0; fourpostion.value[1].y = 0;
fourpostion.value[2].x = 0; fourpostion.value[2].x = 0;
fourpostion.value[2].y = div.value.offsetHeight - 25; fourpostion.value[2].y = div.value.offsetHeight - 25;
fourpostion.value[3].x = div.value.offsetWidth - 25; fourpostion.value[3].x = div.value.offsetWidth - 25;
fourpostion.value[3].y = div.value.offsetHeight - 25; fourpostion.value[3].y = div.value.offsetHeight - 25;
Proportion.value.x = config.width / (div.value.offsetWidth - 25); Proportion.value.x = config.width / (div.value.offsetWidth - 25);
Proportion.value.y = config.height / (div.value.offsetHeight - 25); Proportion.value.y = config.height / (div.value.offsetHeight - 25);
for (let index = 0; index < fourpostion.value.length; index++) { 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; defaultfourpostion.value[index].y = fourpostion.value[index].y;
defaultfour.value[index].x = config.point4[index].def_x; defaultfour.value[index].x = config.point4[index].def_x;
defaultfour.value[index].y = config.point4[index].def_y; defaultfour.value[index].y = config.point4[index].def_y;
four[index].x = config.point4[index].x; four[index].x = config.point4[index].x;
four[index].y = config.point4[index].y; four[index].y = config.point4[index].y;
} }
if ( if (
sessionStorage.FourPointCalibration && sessionStorage.FourPointCalibration &&
sessionStorage.FourPointCalibration.length > 0 sessionStorage.FourPointCalibration.length > 0
) { ) {
set_cache.value = JSON.parse(sessionStorage.FourPointCalibration); set_cache.value = JSON.parse(sessionStorage.FourPointCalibration);
use_set_cache(); use_set_cache();
} else { } else {
} }
set_point_x(); set_point_x();
} catch (error) { } catch (error) {
} }
}; };
@ -408,7 +329,7 @@ export default defineComponent({
isshowarray.value[0] = true; isshowarray.value[0] = true;
}, 100); }, 100);
} }
now_index.value=0 now_index.value = 0
save_set_cache(); save_set_cache();
}, },
{ deep: true } { deep: true }
@ -436,7 +357,7 @@ export default defineComponent({
isshowarray.value[1] = true; isshowarray.value[1] = true;
}, 100); }, 100);
} }
now_index.value=1 now_index.value = 1
save_set_cache(); save_set_cache();
}, },
{ deep: true } { deep: true }
@ -466,7 +387,7 @@ export default defineComponent({
isshowarray.value[2] = true; isshowarray.value[2] = true;
}, 100); }, 100);
} }
now_index.value=2 now_index.value = 2
save_set_cache(); save_set_cache();
}, },
{ deep: true } { deep: true }
@ -496,7 +417,7 @@ export default defineComponent({
isshowarray.value[3] = true; isshowarray.value[3] = true;
}, 100); }, 100);
} }
now_index.value=3 now_index.value = 3
save_set_cache(); save_set_cache();
}, },
{ deep: true } { deep: true }
@ -527,9 +448,9 @@ export default defineComponent({
}, },
{ deep: true } { deep: true }
); );
watch(()=>now_index,(newval,oldval)=>{ watch(() => now_index, (newval, oldval) => {
set?.SetBlendingOption("blending_grids_select_point",`4:${now_index.value+1}`) set?.SetBlendingOption("blending_grids_select_point", `4:${now_index.value + 1}`)
},{ deep: true }) }, { deep: true })
//为了加载 缓存的配置时 同步点的位置 //为了加载 缓存的配置时 同步点的位置
const syncpoint = () => { const syncpoint = () => {
for (let index = 0; index < fourpostion.value.length; index++) { for (let index = 0; index < fourpostion.value.length; index++) {
@ -597,10 +518,10 @@ export default defineComponent({
}; };
const moveHandler_1 = (data: any) => { const moveHandler_1 = (data: any) => {
let x = Math.ceil( let x = Math.round(
(data.left - fourpostion.value[0].x) * Proportion.value.x + 0 (data.left - fourpostion.value[0].x) * Proportion.value.x + 0
); );
let y = Math.ceil( let y = Math.round(
config.height - data.top * Proportion.value.y - fourpostion.value[0].y config.height - data.top * Proportion.value.y - fourpostion.value[0].y
); );
@ -610,10 +531,10 @@ export default defineComponent({
save_set_cache(); save_set_cache();
}; };
const moveHandler_2 = (data: any) => { const moveHandler_2 = (data: any) => {
let x = Math.ceil( let x = Math.round(
(data.left - fourpostion.value[1].x) * Proportion.value.x + config.width (data.left - fourpostion.value[1].x) * Proportion.value.x + config.width
); );
let y = Math.ceil( let y = Math.round(
config.height - data.top * Proportion.value.y - fourpostion.value[1].y config.height - data.top * Proportion.value.y - fourpostion.value[1].y
); );
four[1].x = x > config.width ? config.width : x && x < 0 ? 0 : x; four[1].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
@ -621,22 +542,22 @@ export default defineComponent({
save_set_cache(); save_set_cache();
}; };
const moveHandler_3 = (data: any) => { const moveHandler_3 = (data: any) => {
let x = Math.ceil( let x = Math.round(
(data.left - fourpostion.value[2].x) * Proportion.value.x (data.left - fourpostion.value[2].x) * Proportion.value.x
); );
let y = Math.abs( let y = Math.abs(
Math.ceil((data.top - fourpostion.value[2].y) * Proportion.value.y) Math.round((data.top - fourpostion.value[2].y) * Proportion.value.y)
); );
four[2].x = x > config.width ? config.width : x && x < 0 ? 0 : x; four[2].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
four[2].y = y > config.height ? config.height : y && y < 0 ? 0 : y; four[2].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
save_set_cache(); save_set_cache();
}; };
const moveHandler_4 = (data: any) => { const moveHandler_4 = (data: any) => {
let x = Math.ceil( let x = Math.round(
(data.left - fourpostion.value[3].x) * Proportion.value.x + config.width (data.left - fourpostion.value[3].x) * Proportion.value.x + config.width
); );
let y = Math.abs( let y = Math.abs(
Math.ceil((data.top - fourpostion.value[3].y) * Proportion.value.y) Math.round((data.top - fourpostion.value[3].y) * Proportion.value.y)
); );
four[3].x = x > config.width ? config.width : x && x < 0 ? 0 : x; four[3].x = x > config.width ? config.width : x && x < 0 ? 0 : x;
four[3].y = y > config.height ? config.height : y && y < 0 ? 0 : y; four[3].y = y > config.height ? config.height : y && y < 0 ? 0 : y;
@ -648,7 +569,7 @@ export default defineComponent({
window.onresize = () => { window.onresize = () => {
return (() => { return (() => {
ste_status.value = 1; ste_status.value = 1;
if(div!=null)setpoa(); if (div != null) setpoa();
setTimeout(() => { setTimeout(() => {
ste_status.value = 0; ste_status.value = 0;

8
src/components/FusionSettings/FusionLocale.vue
View File

@ -97,7 +97,7 @@
<div> <div>
<q-slider v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green" <q-slider v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
vertical reverse label-always /> vertical reverse label-always />
<div> <q-input dense filled type="number" max="1" min="0" step="0.1" v-model="array[group].alpha" label="alpha" <div> <q-input dense filled type="number" max="1" min="0" step="0.1" @update:model-value="chang('alpha')" v-model="array[group].alpha" label="alpha"
lazy-rules :rules="[ lazy-rules :rules="[
(val) => (val) =>
(val !== null && val !== '') || (val !== null && val !== '') ||
@ -111,7 +111,7 @@
<div> <div>
<q-slider v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green" <q-slider v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
vertical reverse label-always /> vertical reverse label-always />
<div> <q-input dense filled type="number" max="16" min="0" step="0.1" v-model="array[group].p" label="p" <div> <q-input dense filled type="number" max="16" min="0" step="0.1" @update:model-value="chang('p')" v-model="array[group].p" label="p"
lazy-rules :rules="[ lazy-rules :rules="[
(val) => (val) =>
(val !== null && val !== '') || (val !== null && val !== '') ||
@ -124,13 +124,13 @@
<div> <div>
<q-slider v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green" vertical reverse label-always /> <q-slider v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green" vertical reverse label-always />
<div> <q-input dense filled type="number" max="16" min="0" step="0.1" v-model="array[group].gamma" label="gamma" <div> <q-input dense filled type="number" max="16" min="0" step="0.1" @update:model-value="chang('gamma')" v-model="array[group].gamma" label="gamma"
lazy-rules :rules="[ lazy-rules :rules="[
(val) => (val) =>
(val !== null && val !== '') || (val !== null && val !== '') ||
$t('Please enter a number'), $t('Please enter a number'),
(val) => (val) =>
(val >= 0 && val <= 16) || $t('Please enter 0-100'), (val >= 0 && val <= 16) || $t('Please enter a value within the range'),
]" /></div> ]" /></div>
<p class="text-center">gamma</p> <p class="text-center">gamma</p>
</div> </div>

121
src/components/FusionSettings/GridSettings.vue
View File

@ -20,33 +20,34 @@
v-model="RowsColumns[1]" /> v-model="RowsColumns[1]" />
</div> </div>
</div> </div>
<div class="col-12">
<div class="row">
<div class="col-4"></div>
<div class="col-4 q-pt-sm"><q-select outlined v-model="model[2]"
@update:model-value="update_row_col(2, model[2])" :options="line_width_options" :dense="true" :options-dense="true"
:label="$t('line width')" /> </div>
</div>
</div>
<div class="col-12"> <div class="col-12">
<div class="row" style="min-height: 40px;"> <div class="row" style="min-height: 40px;">
<div class="col-4"></div> <div class="col-4"></div>
<div class="col-4 q-pt-sm"> <div class="col-4 q-pt-sm">
<q-item> <q-item>
<q-item-section avatar class="head_1"> <q-item-section avatar class="head_1">
{{ $t("line color") }} {{ $t("line color") }}
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-input <q-input v-model="color[0]" :rules="['anyColor']">
v-model="color[0]" <template v-slot:append>
:rules="['anyColor']" <q-icon name="colorize" class="cursor-pointer" @click="index = 0">
> <q-popup-proxy cover transition-show="scale" transition-hide="scale">
<template v-slot:append> <q-color v-model="color[0]" @change="submit" />
<q-icon name="colorize" class="cursor-pointer" @click="index = 0"> </q-popup-proxy>
<q-popup-proxy </q-icon>
cover </template>
transition-show="scale" </q-input>
transition-hide="scale" </q-item-section>
> </q-item>
<q-color v-model="color[0]" @change="submit" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
</div> </div>
</div> </div>
</div> </div>
@ -55,31 +56,48 @@
<div class="col-4"></div> <div class="col-4"></div>
<div class="col-4 q-pt-sm"> <div class="col-4 q-pt-sm">
<q-item> <q-item>
<q-item-section avatar class="head_1"> <q-item-section avatar class="head_1">
{{ $t("background color") }} {{ $t("background color") }}
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-input <q-input v-model="color[1]" :rules="['anyColor']">
v-model="color[1]" <template v-slot:append>
:rules="['anyColor']" <q-icon name="colorize" class="cursor-pointer" @click="index = 1">
> <q-popup-proxy cover transition-show="scale" transition-hide="scale">
<template v-slot:append> <q-color v-model="color[1]" @change="submit" />
<q-icon name="colorize" class="cursor-pointer" @click="index = 1"> </q-popup-proxy>
<q-popup-proxy </q-icon>
cover </template>
transition-show="scale" </q-input>
transition-hide="scale" </q-item-section>
> </q-item>
<q-color v-model="color[1]" @change="submit" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
</div> </div>
</div> </div>
</div> </div>
<div class="col-12">
<div class="row" style="min-height: 40px;">
<div class="col-4"></div>
<div class="col-4 q-pt-sm">
<q-item>
<q-item-section avatar class="head_1">
{{ $t("center line color") }}
</q-item-section>
<q-item-section>
<q-input v-model="color[2]" :rules="['anyColor']">
<template v-slot:append>
<q-icon name="colorize" class="cursor-pointer" @click="index = 2">
<q-popup-proxy cover transition-show="scale" transition-hide="scale">
<q-color v-model="color[2]" @change="submit" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
</div>
<div class="col-2"><q-checkbox class="q-pt-md" @update:model-value="send_off(2)" v-model="RowsColumns[2]" /></div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -111,8 +129,9 @@ export default defineComponent({
const RowsColumns = reactive([false, false, false, false]); const RowsColumns = reactive([false, false, false, false]);
const index = ref(0); const index = ref(0);
const color = reactive(["#ffffff", "#CCCCCC", "#000", "#000"]); const color = reactive(["#ffffff", "#CCCCCC", "#000", "#000"]);
let model = reactive([20, 40]); let model = reactive([20, 40, 20]);
let options = ref([10, 20, 30, 40, 50]); let options = ref([10, 20, 30, 40, 50]);
let line_width_options = ref([2,4,6,8,10, 20, 30, 40, 50]);
const submit = () => { const submit = () => {
switch (index.value) { switch (index.value) {
case 0: case 0:
@ -122,7 +141,7 @@ export default defineComponent({
set?.SetBlendingOption("blending_grids_background_color", color[index.value]); set?.SetBlendingOption("blending_grids_background_color", color[index.value]);
break; break;
case 2: case 2:
//set?.SetBlendingOption("blending_grids_line_color",color[index.value]); set?.SetBlendingOption("blending_grids_center_line_color",color[index.value]);
break; break;
case 3: case 3:
//set?.SetBlendingOption("blending_grids_line_color",color[index.value]); //set?.SetBlendingOption("blending_grids_line_color",color[index.value]);
@ -139,6 +158,9 @@ export default defineComponent({
case 1: case 1:
set?.SetBlendingOption("blending_grids_column", value + ""); set?.SetBlendingOption("blending_grids_column", value + "");
break; break;
case 2:
set?.SetBlendingOption("blending_grids_line_width", value + "");
break;
default: default:
break; break;
} }
@ -154,7 +176,7 @@ export default defineComponent({
set?.SetBlendingOption("blending_grids_show_column", RowsColumns[type] + ""); set?.SetBlendingOption("blending_grids_show_column", RowsColumns[type] + "");
break; break;
case 2: case 2:
set?.SetBlendingOption("blending_grids_show_center_line", RowsColumns[type] + "");
break; break;
case 3: case 3:
@ -168,11 +190,13 @@ export default defineComponent({
let server_conf = JSON.parse($store.state.fusion_configuration).options let server_conf = JSON.parse($store.state.fusion_configuration).options
model[0] = server_conf.blending_grids_row ?? 20; model[0] = server_conf.blending_grids_row ?? 20;
model[1] = server_conf.blending_grids_column ?? 40; model[1] = server_conf.blending_grids_column ?? 40;
model[2] = server_conf.blending_grids_line_width ?? 6;
color[0] = server_conf.blending_grids_line_color ?? "#ffffff" color[0] = server_conf.blending_grids_line_color ?? "#ffffff"
color[1] = server_conf.blending_grids_background_color ?? "#00ff5e" color[1] = server_conf.blending_grids_background_color ?? "#00ff5e"
color[2] = server_conf.blending_grids_center_line_color ?? "#3358de"
RowsColumns[0] = server_conf.blending_grids_show_row === "false" ? false : true RowsColumns[0] = server_conf.blending_grids_show_row === "false" ? false : true
RowsColumns[1] = server_conf.blending_grids_show_column === "false" ? false : true RowsColumns[1] = server_conf.blending_grids_show_column === "false" ? false : true
RowsColumns[2] = server_conf.blending_grids_show_center_line === "false" ? false : true
} }
use_server_config() use_server_config()
@ -197,6 +221,7 @@ export default defineComponent({
} }
if (sessionStorage.GridSettings) get_sessionStorage() if (sessionStorage.GridSettings) get_sessionStorage()
return { return {
line_width_options,
model, model,
options, options,
submit, submit,

34
src/components/FusionSettings/SurfaceCorrection.vue
View File

@ -188,7 +188,6 @@ export default defineComponent({
return $store.state.selected_projector; return $store.state.selected_projector;
}); });
let Proportion = ref({ x: 0, y: 0 }); let Proportion = ref({ x: 0, y: 0 });
let centor = ref({ x: 0, y: 0 });
const div = ref(); const div = ref();
const now_index = ref(0); const now_index = ref(0);
let nine = reactive([ let nine = reactive([
@ -434,12 +433,6 @@ export default defineComponent({
onMounted(() => { onMounted(() => {
ste_status.value = 1; ste_status.value = 1;
startpostion(); 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(); setninepostion();
use_set_cache(); use_set_cache();
setTimeout(() => { setTimeout(() => {
@ -464,7 +457,7 @@ export default defineComponent({
defaultnine.value[index].x = config.point9[index].def_x; defaultnine.value[index].x = config.point9[index].def_x;
defaultnine.value[index].y = config.point9[index].def_y; defaultnine.value[index].y = config.point9[index].def_y;
} }
setninepostion(); //setninepostion();
use_set_cache(); use_set_cache();
setTimeout(() => { setTimeout(() => {
ste_status.value = 0; ste_status.value = 0;
@ -487,35 +480,33 @@ export default defineComponent({
ninepostion.value[0].x = 0; ninepostion.value[0].x = 0;
ninepostion.value[0].y = 0; ninepostion.value[0].y = 0;
ninepostion.value[1].x = div.value.offsetWidth / 2 - 20; ninepostion.value[1].x = div.value.offsetWidth / 2 - 20; //
ninepostion.value[1].y = 0; ninepostion.value[1].y = 0;
ninepostion.value[2].x = div.value.offsetWidth - 20; ninepostion.value[2].x = div.value.offsetWidth - 10;
ninepostion.value[2].y = 0; ninepostion.value[2].y = 0;
ninepostion.value[3].x = 0; ninepostion.value[3].x = 0;
ninepostion.value[3].y = div.value.offsetHeight / 2 - 8; ninepostion.value[3].y = div.value.offsetHeight / 2 - 20;
ninepostion.value[4].x = div.value.offsetWidth / 2 - 20; ninepostion.value[4].x = div.value.offsetWidth / 2 - 20; //
ninepostion.value[4].y = div.value.offsetHeight / 2 - 8; ninepostion.value[4].y = div.value.offsetHeight / 2 - 20;
ninepostion.value[5].x = div.value.offsetWidth - 20; ninepostion.value[5].x = div.value.offsetWidth - 10;
ninepostion.value[5].y = div.value.offsetHeight / 2; ninepostion.value[5].y = div.value.offsetHeight / 2 -20;
ninepostion.value[6].x = 0; ninepostion.value[6].x = 0;
ninepostion.value[6].y = div.value.offsetHeight - 20; ninepostion.value[6].y = div.value.offsetHeight - 20;
ninepostion.value[7].x = div.value.offsetWidth / 2 - 8; ninepostion.value[7].x = div.value.offsetWidth / 2 - 20; //
ninepostion.value[7].y = div.value.offsetHeight - 20; ninepostion.value[7].y = div.value.offsetHeight - 20;
ninepostion.value[8].x = div.value.offsetWidth - 20; ninepostion.value[8].x = div.value.offsetWidth - 10;
ninepostion.value[8].y = div.value.offsetHeight - 20; ninepostion.value[8].y = div.value.offsetHeight - 20;
Proportion.value.x = config.width / (div.value.offsetWidth - 20); Proportion.value.x = config.width / (div.value.offsetWidth - 20);
Proportion.value.y = config.height / (div.value.offsetHeight - 20); Proportion.value.y = config.height / (div.value.offsetHeight - 20);
centor.value.x = (config.width * 2) / (div.value.offsetWidth + 20);
centor.value.y = (config.height * 2) / (div.value.offsetHeight + 20);
for (let index = 0; index < defaultninepostion.value.length; index++) { for (let index = 0; index < defaultninepostion.value.length; index++) {
defaultninepostion.value[index].x = ninepostion.value[index].x; defaultninepostion.value[index].x = ninepostion.value[index].x;
@ -526,7 +517,6 @@ export default defineComponent({
if (sessionStorage.SurfaceCorrection) { if (sessionStorage.SurfaceCorrection) {
set_cache.value = JSON.parse(sessionStorage.SurfaceCorrection); set_cache.value = JSON.parse(sessionStorage.SurfaceCorrection);
use_set_cache(); use_set_cache();
} else {
} }
syncpoint(); syncpoint();
} catch (error) { } catch (error) {
@ -535,8 +525,6 @@ export default defineComponent({
}; };
const use_server_config = () => { const use_server_config = () => {
for (let index = 0; index < defaultninepostion.value.length; index++) { 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].x = config.point9[index].def_x;
defaultnine.value[index].y = config.point9[index].def_y; defaultnine.value[index].y = config.point9[index].def_y;
nine[index].x = config.point9[index].x; nine[index].x = config.point9[index].x;
@ -544,8 +532,6 @@ export default defineComponent({
} }
}; };
const reset = (index: number) => { const reset = (index: number) => {
ninepostion.value[index].x = defaultninepostion.value[index].x;
ninepostion.value[index].y = defaultninepostion.value[index].y;
nine[index].x = config.point9[index].def_x; nine[index].x = config.point9[index].def_x;
nine[index].y = config.point9[index].def_y; nine[index].y = config.point9[index].def_y;

3
src/i18n/en-US/index.ts
View File

@ -449,5 +449,6 @@ export default {
"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", "Please enter a value within the range":"Please enter a value within the range",
"vertical correction":"vertical correction", "vertical correction":"vertical correction",
"horizontal correction":"horizontal correction" "horizontal correction":"horizontal correction",
"line width":"line width"
}; };

3
src/i18n/zh-CN/index.ts
View File

@ -718,5 +718,6 @@ export default {
"disable_blending_params":"禁用融合参数", "disable_blending_params":"禁用融合参数",
"Please enter a value within the range":"请输入范围内的值", "Please enter a value within the range":"请输入范围内的值",
"vertical correction":"垂直校正", "vertical correction":"垂直校正",
"horizontal correction":"水平校正" "horizontal correction":"水平校正",
"line width":"线宽"
}; };