魔墙:增加导出坐标
This commit is contained in:
parent
6864213d67
commit
9c211e13bf
|
@ -553,7 +553,16 @@
|
||||||
<q-separator />
|
<q-separator />
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<q-card-actions align="right">
|
<q-card-actions>
|
||||||
|
<q-btn
|
||||||
|
:loading="loading"
|
||||||
|
flat
|
||||||
|
:label="$t('export')"
|
||||||
|
no-caps
|
||||||
|
color="primary"
|
||||||
|
@click="export_magic_wall"
|
||||||
|
/>
|
||||||
|
<q-space />
|
||||||
<q-btn
|
<q-btn
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
flat
|
flat
|
||||||
|
@ -625,6 +634,9 @@ import {
|
||||||
QSeparator,
|
QSeparator,
|
||||||
QSpace,
|
QSpace,
|
||||||
QTooltip,
|
QTooltip,
|
||||||
|
exportFile,
|
||||||
|
QForm,
|
||||||
|
QSlider,
|
||||||
} from "quasar";
|
} from "quasar";
|
||||||
import { useI18n } from "vue-i18n";
|
import { useI18n } from "vue-i18n";
|
||||||
import GlobalData from "src/common/GlobalData";
|
import GlobalData from "src/common/GlobalData";
|
||||||
|
@ -635,7 +647,6 @@ import MagicWallConfig from "src/entities/MagicWallConfig";
|
||||||
import { PointF } from "src/entities/RectF";
|
import { PointF } from "src/entities/RectF";
|
||||||
import EventBus, { EventNamesDefine } from "src/common/EventBus";
|
import EventBus, { EventNamesDefine } from "src/common/EventBus";
|
||||||
import { number } from "@intlify/core-base";
|
import { number } from "@intlify/core-base";
|
||||||
// import VeeValidate from 'vee-validate';
|
|
||||||
|
|
||||||
export class test_monitor {
|
export class test_monitor {
|
||||||
uuid = "";
|
uuid = "";
|
||||||
|
@ -699,7 +710,35 @@ export class test_monitor {
|
||||||
this.cmh = 0.0;
|
this.cmh = 0.0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
class exporttxt {
|
||||||
|
id = 0;
|
||||||
|
point_left_top = {};
|
||||||
|
point_left_bootom = {};
|
||||||
|
point_right_top = {};
|
||||||
|
point_right_bottom = {};
|
||||||
|
w = 0.0;
|
||||||
|
h = 0.0;
|
||||||
|
angle = 0;
|
||||||
|
constructor(
|
||||||
|
id: number,
|
||||||
|
w: number,
|
||||||
|
h: number,
|
||||||
|
angle: number,
|
||||||
|
point_left_top: {},
|
||||||
|
point_left_bootom: {},
|
||||||
|
point_right_top: {},
|
||||||
|
point_right_bottom: {}
|
||||||
|
) {
|
||||||
|
this.id = id;
|
||||||
|
this.point_left_top = point_left_top;
|
||||||
|
this.point_left_bootom = point_left_bootom;
|
||||||
|
this.point_right_top = point_right_top;
|
||||||
|
this.point_right_bottom = point_right_bottom;
|
||||||
|
this.w = w;
|
||||||
|
this.h = h;
|
||||||
|
this.angle = angle;
|
||||||
|
}
|
||||||
|
}
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: "ComponentControlPanelDialog",
|
name: "ComponentControlPanelDialog",
|
||||||
components: { vue3ResizeDrag },
|
components: { vue3ResizeDrag },
|
||||||
|
@ -851,39 +890,39 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
// if (client) {
|
if (client) {
|
||||||
// const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
|
const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
|
||||||
// if (setMagic?.success) {
|
if (setMagic?.success) {
|
||||||
// let monitorList:any=[]
|
let monitorList:any=[]
|
||||||
// test_monitor_wall.value.forEach((element, index) => {
|
test_monitor_wall.value.forEach((element, index) => {
|
||||||
// if (element.isShow&&wall_dom) {
|
if (element.isShow&&wall_dom) {
|
||||||
// monitorList.push({
|
monitorList.push({
|
||||||
// id: element.id,
|
id: element.id,
|
||||||
// currentx: element.currentx / wall_dom.offsetWidth,
|
currentx: element.currentx / wall_dom.offsetWidth,
|
||||||
// currenty: element.currenty / wall_dom.offsetHeight,
|
currenty: element.currenty / wall_dom.offsetHeight,
|
||||||
// h: element.h / wall_dom.offsetHeight,
|
h: element.h / wall_dom.offsetHeight,
|
||||||
// w: element.w / wall_dom.offsetWidth,
|
w: element.w / wall_dom.offsetWidth,
|
||||||
// angle: parseInt(element.angle.toString()),
|
angle: parseInt(element.angle.toString()),
|
||||||
// centerx: element.centerx/ wall_dom.offsetWidth,
|
centerx: element.centerx/ wall_dom.offsetWidth,
|
||||||
// centery: element.centery / wall_dom.offsetHeight,
|
centery: element.centery / wall_dom.offsetHeight,
|
||||||
// });
|
});
|
||||||
// }
|
}
|
||||||
// });
|
});
|
||||||
// $store.commit("setShowMonitorList", monitorList);
|
$store.commit("setShowMonitorList", monitorList);
|
||||||
// }
|
}
|
||||||
// if(!setMagic?.success){
|
if(!setMagic?.success){
|
||||||
// $q.notify({
|
$q.notify({
|
||||||
// color: "negative",
|
color: "negative",
|
||||||
// icon: "warning",
|
icon: "warning",
|
||||||
// message:
|
message:
|
||||||
// $t.t("update magic wall") +
|
$t.t("update magic wall") +
|
||||||
// $t.t("fail") +
|
$t.t("fail") +
|
||||||
// "!",
|
"!",
|
||||||
// position: "top",
|
position: "top",
|
||||||
// timeout: 2500,
|
timeout: 2500,
|
||||||
// });
|
});
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
};
|
};
|
||||||
const getpx = () => {
|
const getpx = () => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
|
@ -895,26 +934,29 @@ export default defineComponent({
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const radians = () => {
|
const radians = (item: test_monitor) => {
|
||||||
const item = test_monitor_wall.value[current_index.value];
|
|
||||||
return /*a*/ (item.angle * Math.PI) / 180;
|
return /*a*/ (item.angle * Math.PI) / 180;
|
||||||
};
|
};
|
||||||
const calculateCoordinates = (
|
const calculateCoordinates = (
|
||||||
px: number,
|
px: number,
|
||||||
py: number,
|
py: number,
|
||||||
cx: number,
|
cx: number,
|
||||||
cy: number
|
cy: number,
|
||||||
|
item: test_monitor
|
||||||
) => {
|
) => {
|
||||||
const x =
|
const x =
|
||||||
cx + (px - cx) * Math.cos(radians()) - (py - cy) * Math.sin(radians());
|
cx +
|
||||||
|
(px - cx) * Math.cos(radians(item)) -
|
||||||
|
(py - cy) * Math.sin(radians(item));
|
||||||
|
|
||||||
const y =
|
const y =
|
||||||
cy + (px - cx) * Math.sin(radians()) + (py - cy) * Math.cos(radians());
|
cy +
|
||||||
|
(px - cx) * Math.sin(radians(item)) +
|
||||||
|
(py - cy) * Math.cos(radians(item));
|
||||||
|
|
||||||
return { x, y };
|
return { x, y };
|
||||||
};
|
};
|
||||||
const four_point = () => {
|
const four_point = (item: test_monitor) => {
|
||||||
const item = test_monitor_wall.value[current_index.value];
|
|
||||||
item.centerx = parseInt(item.centerx.toString());
|
item.centerx = parseInt(item.centerx.toString());
|
||||||
item.centery = parseInt(item.centery.toString());
|
item.centery = parseInt(item.centery.toString());
|
||||||
const x2: number = item.currentx + item.w;
|
const x2: number = item.currentx + item.w;
|
||||||
|
@ -924,25 +966,29 @@ export default defineComponent({
|
||||||
item.currentx,
|
item.currentx,
|
||||||
item.currenty,
|
item.currenty,
|
||||||
item.centerx,
|
item.centerx,
|
||||||
item.centery
|
item.centery,
|
||||||
|
item
|
||||||
);
|
);
|
||||||
const point_left_bootom = calculateCoordinates(
|
const point_left_bootom = calculateCoordinates(
|
||||||
item.currentx,
|
item.currentx,
|
||||||
y2,
|
y2,
|
||||||
item.centerx,
|
item.centerx,
|
||||||
item.centery
|
item.centery,
|
||||||
|
item
|
||||||
);
|
);
|
||||||
const point_right_top = calculateCoordinates(
|
const point_right_top = calculateCoordinates(
|
||||||
x2,
|
x2,
|
||||||
item.currenty,
|
item.currenty,
|
||||||
item.centerx,
|
item.centerx,
|
||||||
item.centery
|
item.centery,
|
||||||
|
item
|
||||||
);
|
);
|
||||||
const point_right_bottom = calculateCoordinates(
|
const point_right_bottom = calculateCoordinates(
|
||||||
x2,
|
x2,
|
||||||
y2,
|
y2,
|
||||||
item.centerx,
|
item.centerx,
|
||||||
item.centery
|
item.centery,
|
||||||
|
item
|
||||||
);
|
);
|
||||||
const point_list = [
|
const point_list = [
|
||||||
point_left_top,
|
point_left_top,
|
||||||
|
@ -976,7 +1022,7 @@ export default defineComponent({
|
||||||
item: test_monitor = test_monitor_wall.value[current_index.value]
|
item: test_monitor = test_monitor_wall.value[current_index.value]
|
||||||
) => {
|
) => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
const point_list = four_point();
|
const point_list = four_point(item);
|
||||||
if (wall_dom) {
|
if (wall_dom) {
|
||||||
if (item.angle != 0 && point_list) {
|
if (item.angle != 0 && point_list) {
|
||||||
let minx = 0;
|
let minx = 0;
|
||||||
|
@ -999,7 +1045,7 @@ export default defineComponent({
|
||||||
item: test_monitor = test_monitor_wall.value[current_index.value]
|
item: test_monitor = test_monitor_wall.value[current_index.value]
|
||||||
) => {
|
) => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
const point_list = four_point();
|
const point_list = four_point(item);
|
||||||
if (wall_dom) {
|
if (wall_dom) {
|
||||||
if (item.angle != 0 && point_list) {
|
if (item.angle != 0 && point_list) {
|
||||||
let maxx = 0;
|
let maxx = 0;
|
||||||
|
@ -1040,7 +1086,7 @@ export default defineComponent({
|
||||||
item: test_monitor = test_monitor_wall.value[current_index.value]
|
item: test_monitor = test_monitor_wall.value[current_index.value]
|
||||||
) => {
|
) => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
const point_list = four_point();
|
const point_list = four_point(item);
|
||||||
if (wall_dom) {
|
if (wall_dom) {
|
||||||
if (item.angle != 0 && point_list) {
|
if (item.angle != 0 && point_list) {
|
||||||
let miny = 0;
|
let miny = 0;
|
||||||
|
@ -1063,7 +1109,7 @@ export default defineComponent({
|
||||||
item: test_monitor = test_monitor_wall.value[current_index.value]
|
item: test_monitor = test_monitor_wall.value[current_index.value]
|
||||||
) => {
|
) => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
const point_list = four_point();
|
const point_list = four_point(item);
|
||||||
if (wall_dom) {
|
if (wall_dom) {
|
||||||
if (item.angle != 0 && point_list) {
|
if (item.angle != 0 && point_list) {
|
||||||
let maxy = 0;
|
let maxy = 0;
|
||||||
|
@ -1141,7 +1187,7 @@ export default defineComponent({
|
||||||
const exceedrange = (item: test_monitor) => {
|
const exceedrange = (item: test_monitor) => {
|
||||||
const wall_dom = wall.value;
|
const wall_dom = wall.value;
|
||||||
let a = 0;
|
let a = 0;
|
||||||
const point_list = four_point();
|
const point_list = four_point(item);
|
||||||
if (wall_dom && point_list) {
|
if (wall_dom && point_list) {
|
||||||
let maxx = 0;
|
let maxx = 0;
|
||||||
let maxy = 0;
|
let maxy = 0;
|
||||||
|
@ -1212,16 +1258,16 @@ export default defineComponent({
|
||||||
test_monitor_wall.value.forEach(async (element) => {
|
test_monitor_wall.value.forEach(async (element) => {
|
||||||
let teph = element.InitialH;
|
let teph = element.InitialH;
|
||||||
let tepw = element.InitialW;
|
let tepw = element.InitialW;
|
||||||
element.InitialH = wall_dom.offsetHeight * element.resizeh;
|
element.InitialH = wall_dom.offsetHeight * element.resizeh;
|
||||||
element.InitialW = wall_dom.offsetWidth * element.resizew;
|
element.InitialW = wall_dom.offsetWidth * element.resizew;
|
||||||
element.h = element.InitialH * percenter.value;
|
element.h = element.InitialH * percenter.value;
|
||||||
element.w = element.InitialW * percenter.value;
|
element.w = element.InitialW * percenter.value;
|
||||||
let sizeh = element.InitialH / teph;
|
let sizeh = element.InitialH / teph;
|
||||||
let sizew = element.InitialW / tepw;
|
let sizew = element.InitialW / tepw;
|
||||||
element.currentx = element.currentx * sizew;
|
element.currentx = element.currentx * sizew;
|
||||||
element.currenty = element.currenty * sizeh;
|
element.currenty = element.currenty * sizeh;
|
||||||
element.centerx = Math.floor(element.currentx + element.w / 2);
|
element.centerx = Math.floor(element.currentx + element.w / 2);
|
||||||
element.centery = Math.floor(element.currenty + element.h / 2);
|
element.centery = Math.floor(element.currenty + element.h / 2);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -1315,8 +1361,7 @@ export default defineComponent({
|
||||||
extend(true, item, test_monitor_list.value[element.index]);
|
extend(true, item, test_monitor_list.value[element.index]);
|
||||||
let sizeh = wall_dom.offsetHeight / element.background_h;
|
let sizeh = wall_dom.offsetHeight / element.background_h;
|
||||||
let sizew = wall_dom.offsetWidth / element.background_w;
|
let sizew = wall_dom.offsetWidth / element.background_w;
|
||||||
item.resizew = element.w ;
|
|
||||||
item.resizeh = element.h ;
|
|
||||||
item.currentx = element.lt.x * wall_dom.offsetWidth;
|
item.currentx = element.lt.x * wall_dom.offsetWidth;
|
||||||
item.currenty = element.lt.y * wall_dom.offsetHeight;
|
item.currenty = element.lt.y * wall_dom.offsetHeight;
|
||||||
percenter.value = parseFloat(element.percenter.toString());
|
percenter.value = parseFloat(element.percenter.toString());
|
||||||
|
@ -1325,7 +1370,8 @@ export default defineComponent({
|
||||||
item.InitialW = element.initial_w * sizew;
|
item.InitialW = element.initial_w * sizew;
|
||||||
item.h = item.InitialH * percenter.value;
|
item.h = item.InitialH * percenter.value;
|
||||||
item.w = item.InitialW * percenter.value;
|
item.w = item.InitialW * percenter.value;
|
||||||
|
item.resizew = item.InitialW / wall_dom.offsetWidth;
|
||||||
|
item.resizeh = item.InitialH / wall_dom.offsetHeight;
|
||||||
item.centerx = Math.floor(item.currentx + item.w / 2);
|
item.centerx = Math.floor(item.currentx + item.w / 2);
|
||||||
item.centery = Math.floor(item.currenty + item.h / 2);
|
item.centery = Math.floor(item.currenty + item.h / 2);
|
||||||
item.angle = element.angle;
|
item.angle = element.angle;
|
||||||
|
@ -1827,6 +1873,44 @@ export default defineComponent({
|
||||||
});
|
});
|
||||||
realtime_upload();
|
realtime_upload();
|
||||||
},
|
},
|
||||||
|
export_magic_wall() {
|
||||||
|
let export_list: any = [];
|
||||||
|
let res:string="";
|
||||||
|
test_monitor_wall.value.forEach((ele, index) => {
|
||||||
|
const point_list = four_point(ele);
|
||||||
|
if (wall.value && point_list && ele.isShow) {
|
||||||
|
point_list?.forEach((element) => {
|
||||||
|
if(wall.value ){
|
||||||
|
element.x =Math.round((element.x / wall.value.offsetWidth) * 3840);
|
||||||
|
element.y = Math.round((element.y / wall.value.offsetHeight) * 2160);
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
let item: exporttxt = new exporttxt(0, 0, 0, 0, {}, {}, {}, {});
|
||||||
|
item.id = ele.id;
|
||||||
|
item.point_left_top = [point_list[0]];
|
||||||
|
item.point_left_bootom = [point_list[1]];
|
||||||
|
item.point_right_top = [point_list[2]];
|
||||||
|
item.point_right_bottom = [point_list[3]];
|
||||||
|
item.w = Math.round((ele.w / wall.value?.offsetWidth) * 3840);
|
||||||
|
item.h = Math.round((ele.h / wall.value.offsetHeight) * 2160);
|
||||||
|
item.angle = ele.angle;
|
||||||
|
export_list.push(JSON.parse(JSON.stringify(item)));
|
||||||
|
res=res+JSON.stringify(item)+"\r\n"
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const status = exportFile("important.txt", res);
|
||||||
|
if (status === true) {
|
||||||
|
} else {
|
||||||
|
$q.notify({
|
||||||
|
type: "warning",
|
||||||
|
message: $t.t("data export ") + $t.t("fail") + "!",
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue