402 lines
12 KiB
Vue
402 lines
12 KiB
Vue
<template>
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<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=""
|
||
/>
|
||
</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="[
|
||
(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 class="col-12">
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<q-toggle
|
||
class="float-right"
|
||
v-model="array2[selectedprojector][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="[
|
||
(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=""
|
||
/>
|
||
</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="[
|
||
(val) =>
|
||
(val !== null && val !== '') || $t('Please enter a number'),
|
||
(val) =>
|
||
(val > -1 && val < 1920) || $t('Please enter 0-100'),
|
||
]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<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][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="[
|
||
(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 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
|
||
/>
|
||
<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
|
||
/>
|
||
<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
|
||
/>
|
||
<p class="text-center">gamma</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<style>
|
||
.boder {
|
||
border: 2px solid #0000;
|
||
}
|
||
</style>
|
||
|
||
<script lang="ts">
|
||
import {
|
||
defineComponent,
|
||
ref,
|
||
watch,
|
||
computed,
|
||
defineProps,
|
||
withDefaults,
|
||
reactive,
|
||
} from "vue";
|
||
import { useStore } from "src/store";
|
||
import { useI18n } from "vue-i18n";
|
||
import GlobalData from "src/common/GlobalData";
|
||
import { number } from "@intlify/core-base";
|
||
|
||
export default defineComponent({
|
||
name: "ComponentFusionLocale",
|
||
setup() {
|
||
let set = GlobalData.getInstance().getCurrentClient();
|
||
let $store = useStore();
|
||
let $t = useI18n();
|
||
const age = ref(0);
|
||
const standard = ref(0);
|
||
const group = ref(4);
|
||
const EnableBlending=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 },
|
||
]);
|
||
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
|
||
})
|
||
const options = ref([
|
||
{
|
||
label: "上融合带参数",
|
||
value: 0,
|
||
},
|
||
{
|
||
label: "左融合带参数",
|
||
value: 1,
|
||
},
|
||
{
|
||
label: "右融合带参数",
|
||
value: 2,
|
||
},
|
||
{
|
||
label: "下融合带参数",
|
||
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 chang = (type: string) => {
|
||
if (type == "alpha") {
|
||
if($store.state.EnableBlending)set?.setBlendingAlphaParam(
|
||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||
group.value,
|
||
array.value[group.value].alpha
|
||
);
|
||
}
|
||
if (type == "p") {
|
||
if($store.state.EnableBlending)set?.setBlendingPowerParam(
|
||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||
group.value,
|
||
array.value[group.value].p
|
||
);
|
||
}
|
||
if($store.state.EnableBlending)if (type == "gamma") {
|
||
set?.setBlendingGammaParam(
|
||
$store.getters.GetTheCurrentlySelectedCamera[0],
|
||
$store.getters.GetTheCurrentlySelectedCamera[1],
|
||
group.value,
|
||
array.value[group.value].gamma
|
||
);
|
||
}
|
||
//console.log("giao")
|
||
};
|
||
//0：左融合带，1：上融合带，2：右融合带，3：下融合带
|
||
watch(
|
||
() => array2[0][0],
|
||
(newVal, oldVal) => {
|
||
if($store.state.EnableBlending)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.EnableBlending)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.EnableBlending)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.EnableBlending)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 }
|
||
);
|
||
|
||
///
|
||
|
||
watch(
|
||
() => array2[1][0],
|
||
(newVal, oldVal) => {
|
||
if($store.state.EnableBlending) 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
|
||
}
|
||
},
|
||
{ deep: true }
|
||
);
|
||
watch(
|
||
() => array2[1][1],
|
||
(newVal, oldVal) => {
|
||
if($store.state.EnableBlending) set?.SetBlendingOverlap($store.getters.GetTheCurrentlySelectedCamera[0], $store.getters.GetTheCurrentlySelectedCamera[1],0,array2[1][1].isshow,Number(array2[1][2].value));
|
||
if(!array2[1][1].isshow){
|
||
array2[1][1].value=0
|
||
}
|
||
},
|
||
{ deep: true }
|
||
);
|
||
watch(
|
||
() => array2[1][2],
|
||
(newVal, oldVal) => {
|
||
if($store.state.EnableBlending) 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
|
||
}
|
||
},
|
||
{ deep: true }
|
||
);
|
||
watch(
|
||
() => array2[1][3],
|
||
(newVal, oldVal) => {
|
||
if($store.state.EnableBlending) 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
|
||
}
|
||
},
|
||
{ deep: true }
|
||
);
|
||
///
|
||
|
||
watch(
|
||
() => EnableBlending,
|
||
(newVal, oldVal) => {
|
||
$store.commit('setEnableBlending',newVal.value);
|
||
set?.EnableBlending(newVal.value);
|
||
},{ deep: true }
|
||
);
|
||
const changEnableBlending=()=>{
|
||
$store.commit('setEnableBlending',EnableBlending.value);
|
||
}
|
||
return {
|
||
model,
|
||
age,
|
||
accept,
|
||
standard,
|
||
options,
|
||
group,
|
||
text,
|
||
array,
|
||
chang,
|
||
EnableBlending,
|
||
array2,
|
||
changEnableBlending,
|
||
selectedprojector
|
||
};
|
||
},
|
||
});
|
||
</script>
|