加入 选择投影机 选择调节页面 选择控制点

This commit is contained in:
shefengchun 2023-02-03 20:05:10 +08:00
parent a9f61b1651
commit 93c3a89a6d
6 changed files with 114 additions and 69 deletions

View File

@ -5,43 +5,43 @@
<div ref="div" style="width: 100%; background-color: #646464; height: 100%">
<div style="position: absolute">
<vue3ResizeDrag :isActive="isactivearray[0]" v-if="isshowarray[0]" :w="30" :h="30" :x="point_postion[0].x"
:y="point_postion[0].y" @mousedown="isactivearray[0] = true" :isResizable="false"
:y="point_postion[0].y" @mousedown="activeMouseDown(0)" :isResizable="false"
@moveHandler="moveHandler($event, 0)"><p class="p0 vcolro"></p><p class="vcolro p0">V1</p><p class=" vcolro p0"></p>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[1]" v-if="isshowarray[1]" :w="30" :h="30" :x="point_postion[1].x"
:y="point_postion[1].y" @mousedown="isactivearray[1] = true" :isResizable="false"
:y="point_postion[1].y" @mousedown="activeMouseDown(1)" :isResizable="false"
@moveHandler="moveHandler($event, 1)"><p class="p0 vcolro"></p><p class="vcolro p0">V2</p><p class="p0 vcolro"></p>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[2]" v-if="isshowarray[2]" :w="30" :h="30" :x="point_postion[2].x"
:y="point_postion[2].y" @mousedown="isactivearray[2] = true" :isResizable="false"
:y="point_postion[2].y" @mousedown="activeMouseDown(2)" :isResizable="false"
@moveHandler="moveHandler($event, 2)"><p class="p0 vcolro"></p><p class="vcolro p0">V3</p><p class="p0 vcolro"></p>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[3]" v-if="isshowarray[3]" :w="30" :h="30" :x="point_postion[3].x"
:y="point_postion[3].y" @mousedown="isactivearray[3] = true" :isResizable="false"
:y="point_postion[3].y" @mousedown="activeMouseDown(3)" :isResizable="false"
@moveHandler="moveHandler($event, 3)"><p class="p0 vcolro"></p><p class="vcolro p0">V4</p><p class="p0 vcolro"></p>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[4]" v-if="isshowarray[4]" :w="30" :h="30" :x="point_postion[4].x"
:y="point_postion[4].y" @mousedown="isactivearray[4] = true" :isResizable="false"
:y="point_postion[4].y" @mousedown="activeMouseDown(4)" :isResizable="false"
@moveHandler="moveHandler($event, 4)"><p class="p0 vcolro"></p><p class="vcolro p0">V5</p><p class="p0 vcolro"></p>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[5]" v-if="isshowarray[5]" :w="40" :h="20" :x="point_postion[5].x"
:y="point_postion[5].y" @mousedown="isactivearray[5] = true" :isResizable="false"
:y="point_postion[5].y" @mousedown="activeMouseDown(5)" :isResizable="false"
@moveHandler="moveHandler($event, 5)"><span class="hcolro">H1</span>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[6]" v-if="isshowarray[6]" :w="40" :h="20" :x="point_postion[6].x"
:y="point_postion[6].y" @mousedown="isactivearray[6] = true" :isResizable="false"
:y="point_postion[6].y" @mousedown="activeMouseDown(6)" :isResizable="false"
@moveHandler="moveHandler($event, 6)"><span class="hcolro">H2</span>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[7]" v-if="isshowarray[7]" :w="40" :h="20" :x="point_postion[7].x"
:y="point_postion[7].y" @mousedown="isactivearray[7] = true" :isResizable="false"
:y="point_postion[7].y" @mousedown="activeMouseDown(7)" :isResizable="false"
@moveHandler="moveHandler($event, 7)"><span class="hcolro">H3</span>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[8]" v-if="isshowarray[8]" :w="40" :h="20" :x="point_postion[8].x"
:y="point_postion[8].y" @mousedown="isactivearray[8] = true" :isResizable="false"
:y="point_postion[8].y" @mousedown="activeMouseDown(8)" :isResizable="false"
@moveHandler="moveHandler($event, 8)"><span class="hcolro">H4</span>
</vue3ResizeDrag>
<vue3ResizeDrag :isActive="isactivearray[9]" v-if="isshowarray[9]" :w="40" :h="20" :x="point_postion[9].x"
:y="point_postion[9].y" @mousedown="isactivearray[9] = true" :isResizable="false"
:y="point_postion[9].y" @mousedown="activeMouseDown(9)" :isResizable="false"
@moveHandler="moveHandler($event, 9)"><span class="hcolro">H5</span>
</vue3ResizeDrag>
</div>
@ -693,8 +693,17 @@ export default defineComponent({
}
save_set_cache();
};
const activeMouseDown = (index: number) => {
isactivearray.value[index] = true;
if(index>=5){
set?.SetBlendingOption("blending_grids_select_point",`density_h:${index-4}`)
}else{
set?.SetBlendingOption("blending_grids_select_point",`density_v:${index+1}`)
}
};
initialization();
return {
activeMouseDown,
model,
options,
value,

View File

@ -307,6 +307,7 @@ export default defineComponent({
});
const activeMouseDown = (index: number) => {
isactivearray.value[index] = true;
set?.SetBlendingOption("blending_grids_select_point",`4:${index+1}`)
};
const mouseUpHandler = (index: number) => {
isactivearray.value[index] = false;

View File

@ -18,7 +18,7 @@
(val !== null && val !== '') ||
$t('Please enter a number'),
(val) =>
(val > -1 && val < config.height) || $t('Please enter 0-100'),
(val >= 0 && val < config.height) || $t('Please enter 0-100'),
]" />
</div>
</div>
@ -40,7 +40,7 @@
(val !== null && val !== '') ||
$t('Please enter a number'),
(val) =>
(val > -1 && val < config.width) || $t('Please enter 0-100'),
(val >= 0 && val < config.width) || $t('Please enter 0-100'),
]" />
</div>
</div>
@ -58,7 +58,7 @@
(val !== null && val !== '') ||
$t('Please enter a number'),
(val) =>
(val > -1 && val < config.width) || $t('Please enter 0-100'),
(val >= 0 && val < config.width) || $t('Please enter 0-100'),
]" />
</div>
<div class="col-3"><span>{{ $t('Whether to operate synchronously') }}</span><q-checkbox
@ -82,7 +82,7 @@
(val !== null && val !== '') ||
$t('Please enter a number'),
(val) =>
(val > -1 && val < config.height) || $t('Please enter 0-100'),
(val >= 0 && val < config.height) || $t('Please enter 0-100'),
]" />
</div>
</div>
@ -95,26 +95,26 @@
<p class="text-center" style="margin: 0 0 8;">{{ $t("Set Fusion Band Parameters") }}</p>
<div style="display: flex; justify-content: space-evenly">
<div>
<div><q-btn size="sm" color="white" @click="add('alpha')" text-color="black" label="↑" /></div>
<q-slider style="height: 10rem;" v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
<div class="btn_bottom"><q-btn size="sm" color="white" @click="add('alpha')" text-color="black" label="↑" /></div>
<q-slider track-size="'10vh'" v-model="array[group].alpha" :min="0.0" @change="chang('alpha')" :max="1" :step="0.01" color="green"
vertical reverse label-always />
<div><q-btn size="sm" color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div>
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('alpha')" text-color="black" label="↓" /></div>
<p class="text-center">alpha</p>
</div>
<div>
<div><q-btn size="sm" color="white" @click="add('p')" text-color="black" label="↑" /></div>
<q-slider style="height: 10rem;" v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
<div class="btn_bottom"><q-btn size="sm" color="white" @click="add('p')" text-color="black" label="↑" /></div>
<q-slider track-size="'10vh'" v-model="array[group].p" :min="0" @change="chang('p')" :max="16" :step="0.01" color="green"
vertical reverse label-always />
<div><q-btn size="sm" color="white" @click="reduce('p')" text-color="black" label="↓" /></div>
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('p')" text-color="black" label="↓" /></div>
<p class="text-center">p</p>
</div>
<div>
<div><q-btn size="sm" color="white" @click="add('gamma')" text-color="black" label="↑" /></div>
<q-slider style="height: 10rem;" v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green"
<div class="btn_bottom"><q-btn size="sm" color="white" @click="add('gamma')" text-color="black" label="↑" /></div>
<q-slider track-size="'10vh'" v-model="array[group].gamma" :min="0" @change="chang('gamma')" :max="16" :step="0.01" color="green"
vertical reverse label-always />
<div><q-btn size="sm" color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div>
<div class="btn_top"><q-btn size="sm" color="white" @click="reduce('gamma')" text-color="black" label="↓" /></div>
<p class="text-center">gamma</p>
</div>
</div>
@ -129,6 +129,13 @@
.boder {
border: 2px solid #0000;
}
.btn_bottom{
margin-bottom: 0.5rem;
}
.btn_top{
margin-top: 0.3rem;
}
</style>
<script lang="ts">

View File

@ -169,7 +169,7 @@ export default defineComponent({
model[0] = server_conf.blending_grids_row!=null ? Number(server_conf.blending_grids_row) : 20;
model[1] = server_conf.blending_grids_column!=null ? Number(server_conf.blending_grids_column) : 40;
color[0] = server_conf.blending_grids_line_color
color[1] = server_conf.blending_grids_background_color
RowsColumns[0] = server_conf.blending_grids_show_row === "false" ? false : true
RowsColumns[1] = server_conf.blending_grids_show_column === "false" ? false : true

View File

@ -211,6 +211,7 @@ export default defineComponent({
]);
const activeMouseDown = (index: number) => {
isactivearray.value[index] = true;
set?.SetBlendingOption("blending_grids_select_point",`9:${index+1}`)
};
//
let serverconfig = JSON.parse($store.state.fusion_configuration);

View File

@ -36,7 +36,8 @@
<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>
" :lvalue="index_row + '/' + index_col"
@click="currently_selected_projector(index_row + '-' + index_col)"></projector-item>
</div>
<div class="col-12" style="text-align: center">
@ -64,10 +65,9 @@
},
{ label: $t('GridSettings'), value: 'GridSettings' },
]" />
<q-btn-toggle v-show="isdebug" no-caps v-model="options" toggle-color="primary"
:options="[
{ label: $t('debugging'), value: 'Debugging' }
]" />
<q-btn-toggle v-show="isdebug" no-caps v-model="options" toggle-color="primary" :options="[
{ label: $t('debugging'), value: 'Debugging' }
]" />
</div>
<div style="min-height: 72vh">
<component :is="options" />
@ -86,11 +86,11 @@
<q-checkbox style="justify-content: flex-start" v-model="show_blending_grids"
@click="send_show_blending_grids" />
<div class="q-space" data-v-39efcd1f=""></div>
<div class="q-space" data-v-39efcd1f=""></div>
<div class="q-space" data-v-39efcd1f=""></div>
<q-btn color="white" @click="resetall" text-color="black" :label="$t('resetall config')" />
<div class="q-space" data-v-39efcd1f=""></div>
<q-btn flat :label="$t('Select saved configuration')" no-caps color="primary"
@click="select_configuration = true;get_scenes()" />
@click="select_configuration = true; get_scenes()" />
<q-btn flat :label="$t('Cancel')" no-caps color="primary" v-close-popup
@click="$store.commit('setSelectedProjector', '0/0');" />
<q-btn flat :label="$t('save config')" no-caps color="primary" @click="save" />
@ -107,15 +107,15 @@
<q-select filled :model-value="save_cover_name" use-input hide-selected fill-input input-debounce="0"
:options="plan_list_op" @filter="filterFn" @input-value="setModel">
<template v-slot:option="{ itemProps, opt, selected, toggleOption }">
<q-item v-bind="itemProps">
<q-item-section>
<q-item-label v-html="opt" />
</q-item-section>
<q-item-section side>
<q-icon name="clear" @click="del_scenes(opt)"></q-icon>
</q-item-section>
</q-item>
</template>
<q-item v-bind="itemProps">
<q-item-section>
<q-item-label v-html="opt" />
</q-item-section>
<q-item-section side>
<q-icon name="clear" @click="del_scenes(opt)"></q-icon>
</q-item-section>
</q-item>
</template>
</q-select>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
@ -132,17 +132,17 @@
<div class="text-h6">{{ $t('read saved configuration') }}</div>
</q-card-section>
<q-card-section class="q-pt-none">
<q-select filled v-model="select_configuration_name" :options="plan_list" :label="$t('please choose')" >
<q-select filled v-model="select_configuration_name" :options="plan_list" :label="$t('please choose')">
<template v-slot:option="{ itemProps, opt, selected, toggleOption }">
<q-item v-bind="itemProps">
<q-item-section>
<q-item-label v-html="opt" />
</q-item-section>
<q-item-section side>
<q-icon name="clear" @click="del_scenes(opt)"></q-icon>
</q-item-section>
</q-item>
</template>
<q-item v-bind="itemProps">
<q-item-section>
<q-item-label v-html="opt" />
</q-item-section>
<q-item-section side>
<q-icon name="clear" @click="del_scenes(opt)"></q-icon>
</q-item-section>
</q-item>
</template>
</q-select>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
@ -253,13 +253,13 @@ export default defineComponent({
options.value = tmp
}, 300);
}
const clear_sessionStorage=()=>{
sessionStorage.removeItem("FusionLocale");
sessionStorage.removeItem("SurfaceCorrection");
sessionStorage.removeItem("DensityCorrection");
sessionStorage.removeItem("FourPointCalibration");
sessionStorage.removeItem("GridSettings");
sessionStorage.removeItem("Debugging");
const clear_sessionStorage = () => {
sessionStorage.removeItem("FusionLocale");
sessionStorage.removeItem("SurfaceCorrection");
sessionStorage.removeItem("DensityCorrection");
sessionStorage.removeItem("FourPointCalibration");
sessionStorage.removeItem("GridSettings");
sessionStorage.removeItem("Debugging");
}
const config = ref({ col: 0, row: 0 });
@ -288,6 +288,28 @@ export default defineComponent({
{ deep: true }
);
watch(() => optionsstr,
(newVal) => {
let tmp = ""
switch (newVal.value) {
case 'FusionLocale':
tmp = '0'
break;
case 'FourPointCalibration':
tmp = '4'
break;
case 'SurfaceCorrection':
tmp = '9'
break;
case 'DensityCorrection':
tmp = 'density'
break;
default:
break;
}
set?.SetBlendingOption("blending_grids_select_ui", tmp)
},
{ deep: true })
const save = () => {
medium.value = true
//
@ -311,7 +333,7 @@ export default defineComponent({
clear_sessionStorage()
}, 500);
getconfig()
options.value="FusionLocale"
options.value = "FusionLocale"
};
@ -320,7 +342,7 @@ export default defineComponent({
if (res == null || res.scenes.length == 0) return
plan_list.splice(0, plan_list.length);
for (let index = 0; index < res.scenes.length; index++) {
plan_list[index]=(res.scenes[index]);
plan_list[index] = (res.scenes[index]);
}
})
}
@ -341,14 +363,15 @@ export default defineComponent({
local_opt[1].value = ("0" == opt || "false" == opt.toLowerCase() ? false : true);
}
}
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);
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);
});
get_scenes()
set?.SetBlendingOption("blending_grids_select_ui", '0')
}, 1000);
});
const save_cover_name = ref("")
@ -399,16 +422,20 @@ export default defineComponent({
}
})
const name_to_be_deleted=ref("");
const del_scenes=(name:string)=>{
del_dialog.value=true;
name_to_be_deleted.value=name;
const name_to_be_deleted = ref("");
const del_scenes = (name: string) => {
del_dialog.value = true;
name_to_be_deleted.value = name;
}
const dialog_del_scenes=()=>{
const dialog_del_scenes = () => {
set?.DeleteBlendingScene(name_to_be_deleted.value);
plan_list.splice(plan_list.findIndex(item => item === name_to_be_deleted.value), 1)
}
const currently_selected_projector = (value: string) => {
set?.SetBlendingOption('blending_grids_select_projector', value);
}
return {
currently_selected_projector,
name_to_be_deleted,
dialog_del_scenes,
get_scenes,