修改魔墙背景为16:9
This commit is contained in:
parent
938cb8ed83
commit
5f4ab631d0
|
@ -127,12 +127,12 @@
|
|||
<q-card-section @dragenter="onDragEnter" @dragleave="onDragLeave" @dragover="onDragOver" @drop="onDrop"
|
||||
style="max-height: 80vh; width: 55vw ; position: relative;">
|
||||
<div class="text-h6 row">
|
||||
<div for="" class="col-1"> 缩放</div>
|
||||
<div for="" class="col-2"> {{ $t("resize") }}</div>
|
||||
<q-slider class="col" style="font-size:0.7rem" v-model="percenter"
|
||||
@update:model-value="changePercenter()" label :label-value="percenter" markers
|
||||
switch-marker-labels-side label-always :min="0.1" :max="2" :step="0.1" />
|
||||
</div>
|
||||
<div style="position: absolute; height: 85%; width: 95%; text-align: center;"
|
||||
<div style="position: absolute; height: 20.7vw; width: 36.8vw; text-align: center;"
|
||||
:class="$store.state.power_state ? 'wall' : ''">
|
||||
<div class="row" v-for="i in (64 / 8)" :key="i" style="height:12.5%;align-items: center;"
|
||||
:class="(i % 2) == 0 ? 'wall_row' : ''">
|
||||
|
@ -142,7 +142,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div ref="wall" v-if="$store.state.power_state"
|
||||
style="position: absolute; height: 85%; width: 95%; overflow: hidden;" @click="canel_active()">
|
||||
style="position: absolute; height: 20.7vw; width: 36.8vw;overflow: hidden;" @click="canel_active()">
|
||||
<div v-for=" (item, index) of test_monitor_wall" @click.stop="Unchecked == false">
|
||||
<vue3-resize-drag v-if="item.isShow" :w="item.w" :h="item.h" :x="item.currentx"
|
||||
:y="item.currenty" :isActive="true" :isGuide="(true && item.angle == 0)"
|
||||
|
@ -496,18 +496,18 @@ export default defineComponent({
|
|||
const wall_dom = wall.value
|
||||
if (wall_dom) {
|
||||
test_monitor_wall.value.forEach((element) => {
|
||||
console.log(element.currentx+"111")
|
||||
let teph=element.InitialH;
|
||||
let tepw=element.InitialW;
|
||||
element.InitialH = wall_dom.offsetHeight * element.resize;
|
||||
element.InitialW = wall_dom.offsetWidth * element.resize;
|
||||
element.h = element.InitialH * percenter.value;
|
||||
element.w = element.InitialW * percenter.value;
|
||||
element.currentx=element.currentx*percenter.value;
|
||||
element.currenty=element.currenty*percenter.value;
|
||||
let sizeh=element.InitialH/teph;
|
||||
let sizew=element.InitialW/tepw;
|
||||
element.currentx=element.currentx*sizew;
|
||||
element.currenty=element.currenty*sizeh;
|
||||
element.centerx = Math.floor(element.currentx + element.w / 2);
|
||||
element.centery = Math.floor(element.currenty + element.h/ 2);
|
||||
console.log(percenter.value+"222")
|
||||
console.log(element.currentx*percenter.value+"222")
|
||||
|
||||
})
|
||||
}
|
||||
});
|
||||
|
@ -779,9 +779,7 @@ export default defineComponent({
|
|||
element.h = element.InitialH * percenter.value;
|
||||
const rx: number = element.currentx + element.w;
|
||||
const ry:number=element.currenty + element.h;
|
||||
|
||||
const wall_dom = wall.value;
|
||||
|
||||
if(wall_dom){
|
||||
if (rx > wall_dom.offsetWidth) {
|
||||
element.currentx = wall_dom.offsetWidth - element.w
|
||||
|
@ -795,6 +793,9 @@ export default defineComponent({
|
|||
if (element.isShow) {
|
||||
tep = true;
|
||||
}
|
||||
if(element.angle!=0){
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
canel_active() {
|
||||
|
|
|
@ -408,4 +408,5 @@ export default {
|
|||
"topology diagram":"Topology Diagram",
|
||||
"physical central location":"Central Location",
|
||||
"monitors list":"Monitors List",
|
||||
"resize":"Resize"
|
||||
};
|
||||
|
|
|
@ -677,4 +677,5 @@ export default {
|
|||
"Please input vaild host. example: 192.168.1.1 or 192.168.1.1:8080":
|
||||
"请输入合法地址. 例: 192.168.1.1 或 192.168.1.1:8080",
|
||||
"equipment data": "联动设备",
|
||||
"resize":"缩放",
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue