修改魔墙因旋转,中心点发生变化而引起的拖拽超出

This commit is contained in:
miao 2022-12-27 15:46:24 +08:00
parent f65ee05422
commit bddc61c63b
1 changed files with 60 additions and 85 deletions

View File

@ -564,8 +564,6 @@ export default defineComponent({
const x2: number = item.currentx + item.w; const x2: number = item.currentx + item.w;
const y2: number = item.currenty + item.h; const y2: number = item.currenty + item.h;
if(item.angle!=0){ if(item.angle!=0){
// console.log("")
// console.log(item)
const point_left_top=calculateCoordinates(item.currentx,item.currenty,item.centerx,item.centery); const point_left_top=calculateCoordinates(item.currentx,item.currenty,item.centerx,item.centery);
const point_left_bootom=calculateCoordinates(item.currentx,y2,item.centerx,item.centery); const point_left_bootom=calculateCoordinates(item.currentx,y2,item.centerx,item.centery);
const point_right_top=calculateCoordinates(x2,item.currenty,item.centerx,item.centery); const point_right_top=calculateCoordinates(x2,item.currenty,item.centerx,item.centery);
@ -580,23 +578,12 @@ export default defineComponent({
const item = test_monitor_wall.value[current_index.value] const item = test_monitor_wall.value[current_index.value]
const rx: number = item.currentx + item.w; const rx: number = item.currentx + item.w;
if (wall_dom) { if (wall_dom) {
// if(item.angle!=0){
// const point_list=four_point();
// point_list?.forEach((element)=>{
// if(element.x<0){
// return item.currentx+=Math.abs(element.x);
// }else if(element.x>wall_dom.offsetWidth){
// return item.currentx-=(element.x-wall_dom.offsetWidth);
// }
// })
// }else{
if (rx > wall_dom.offsetWidth) { if (rx > wall_dom.offsetWidth) {
item.currentx = wall_dom.offsetWidth - item.w item.currentx = wall_dom.offsetWidth - item.w
return item.currentx; return item.currentx;
} else { } else {
return item.currentx; return item.currentx;
} }
// }
} }
}; };
const min_x = () => { const min_x = () => {
@ -604,11 +591,11 @@ export default defineComponent({
const item = test_monitor_wall.value[current_index.value] const item = test_monitor_wall.value[current_index.value]
const point_list=four_point(); const point_list=four_point();
if (wall_dom) { if (wall_dom) {
if(item.angle!=0&&point_list){ // if(item.angle!=0&&point_list){
return Math.floor(item.centerx) // return Math.floor(item.centerx)
}else{ // }else{
return Math.floor(item.w / 2) return Math.floor(item.w / 2)
} // }
} }
}; };
@ -625,22 +612,12 @@ export default defineComponent({
const item = test_monitor_wall.value[current_index.value] const item = test_monitor_wall.value[current_index.value]
const ry: number = item.currenty + item.h; const ry: number = item.currenty + item.h;
if (wall_dom) { if (wall_dom) {
// if(item.angle!=0){
// const point_list=four_point();
// point_list?.forEach((element)=>{
// if(element.y<0){
// return item.currenty+=Math.abs(element.y);
// }else if(element.x>wall_dom.offsetHeight){
// return item.currenty-=(element.y-wall_dom.offsetHeight);
// }
// })
// }else{
if (ry > wall_dom.offsetHeight) { if (ry > wall_dom.offsetHeight) {
item.currenty = wall_dom.offsetHeight - item.h item.currenty = wall_dom.offsetHeight - item.h
return item.currenty; return item.currenty;
} else { } else {
return item.currenty; return item.currenty;
// }
} }
} }
@ -688,23 +665,27 @@ export default defineComponent({
const moveMonitor = (item: test_monitor, rect: show__Rect) => { const moveMonitor = (item: test_monitor, rect: show__Rect) => {
// //
const wall_dom = wall.value const wall_dom = wall.value
if(item.angle!=0){
if (rect.left < 0) { exceedrange(item);
item.currentx = 0 }else{
} else if (wall_dom && rect.left > wall_dom.offsetWidth - item.w) { if (rect.left < 0) {
item.currentx = Number(set_x()) ?? 0; item.currentx = 0
} else { } else if (wall_dom && rect.left > wall_dom.offsetWidth - item.w) {
item.currentx = rect.left item.currentx = Number(set_x()) ?? 0;
} else {
item.currentx = rect.left
}
if (rect.top < 0) {
item.currenty = 0
} else if (wall_dom && rect.top > wall_dom.offsetHeight - item.h) {
item.currenty = set_y() ?? 0;
} else {
item.currenty = rect.top
}
item.centerx = Math.floor(item.currentx + item.w / 2)
item.centery = Math.floor(item.currenty + item.h / 2)
} }
if (rect.top < 0) {
item.currenty = 0
} else if (wall_dom && rect.top > wall_dom.offsetHeight - item.h) {
item.currenty = set_y() ?? 0;
} else {
item.currenty = rect.top
}
item.centerx = Math.floor(item.currentx + item.w / 2)
item.centery = Math.floor(item.currenty + item.h / 2)
}; };
const isexceed=(element:test_monitor)=>{ const isexceed=(element:test_monitor)=>{
// element.currentx / wall_dom.offsetWidth // element.currentx / wall_dom.offsetWidth
@ -731,50 +712,44 @@ export default defineComponent({
const exceedrange=(item:test_monitor)=>{ const exceedrange=(item:test_monitor)=>{
const wall_dom = wall.value const wall_dom = wall.value
// const item = test_monitor_wall.value[current_index.value]
let a=0; let a=0;
const point_list=four_point(); const point_list=four_point();
if(wall_dom&&point_list){ if(wall_dom&&point_list){
let maxx=0;
let maxy=0;
let minx=0;
let miny=0;
point_list.forEach((element)=>{ point_list.forEach((element)=>{
a++; if(minx>element.x){
// console.log(a) minx=element.x;
// console.log(element) }
// console.log(wall_dom.offsetWidth) if(maxx<element.x){
let maxx=0; maxx=element.x;
let maxy=0; }
let minx=0; if(miny>element.y){
let miny=0; miny=element.y;
if(element.x<0){ }
if(minx>element.x){ if(maxy<element.y){
minx=element.x; maxy=element.y;
item.currentx+=Math.abs(element.x); }
item.centerx=item.w/2+item.currentx; })
} if(minx<0){
}else if(element.x>wall_dom.offsetWidth){ item.currentx+=Math.abs(minx);
if(maxx<element.x){ item.centerx=item.w/2+item.currentx;
maxx=element.x;
item.currentx-=(element.x-wall_dom.offsetWidth);
item.centerx=item.currentx+item.w/2;
}
}
if(element.y<0){
if(miny>element.y){
miny=element.y;
item.currenty+=Math.abs(element.y);
item.centery=item.h/2+item.currenty;
}
}else if(element.y>wall_dom.offsetHeight){
if(maxy<element.y){
maxy=element.y
item.currenty-=(element.y-wall_dom.offsetHeight);
item.centery=item.currenty+item.h/2;
}
}
})
// item.centerx=item.centerx+item.currentx;
// item.centery=item.centery+item.currenty;
} }
// return item; if(maxx>wall_dom.offsetWidth){
item.currentx-=(maxx-wall_dom.offsetWidth);
item.centerx=item.currentx+item.w/2;
}
if(miny<0){
item.currenty+=Math.abs(miny);
item.centery=item.h/2+item.currenty;
}
if(maxy>wall_dom.offsetHeight){
item.currenty-=(maxy-wall_dom.offsetHeight);
item.centery=item.currenty+item.h/2;
}
}
}; };
let test_delete_flag = false; let test_delete_flag = false;
EventBus.getInstance().on(EventNamesDefine.WindowResize, () => { EventBus.getInstance().on(EventNamesDefine.WindowResize, () => {
@ -879,8 +854,8 @@ export default defineComponent({
const response = await client.getMagicWallConfig(); const response = await client.getMagicWallConfig();
const cloud_monitor_list = new MagicWallConfig(); const cloud_monitor_list = new MagicWallConfig();
cloud_monitor_list.magic_wall_enable = true;//response?.config.magic_wall_enable ?? true; cloud_monitor_list.magic_wall_enable = true;//response?.config.magic_wall_enable ?? true;
cloud_monitor_list.col = parseInt((settings.wall_col).toString()) // response?.config.col ?? 2; cloud_monitor_list.col = parseInt((settings.wall_col).toString())
cloud_monitor_list.row =parseInt((settings.wall_row).toString()) // response?.config.row ?? 2; cloud_monitor_list.row =parseInt((settings.wall_row).toString())
let tep_width = 0; let tep_width = 0;
test_monitor_wall.value.forEach((element, index) => { test_monitor_wall.value.forEach((element, index) => {
if (element.isShow) { if (element.isShow) {