diff --git a/src/components/ControlPanelDialog.vue b/src/components/ControlPanelDialog.vue index 31702a2..aafbf2c 100644 --- a/src/components/ControlPanelDialog.vue +++ b/src/components/ControlPanelDialog.vue @@ -3,6 +3,7 @@ persistent v-model="show_dialog" @before-hide="resetData" + @keydown=" (evt) => { if (!loading && evt.keyCode == 27) { @@ -12,13 +13,24 @@ sub_x(); } if(evt.keyCode==38){//上 - add_y(); + sub_y(); } if(evt.keyCode==39){//右 add_x(); } if(evt.keyCode==40){//下 - sub_y(); + add_y(); + + } + if(evt.keyCode==17){//ctrl + multiple=true; + } + } + " + @keyup=" + (evt) => { + if(evt.keyCode==17){//ctrl + multiple=false; } } @@ -304,6 +316,9 @@ {{ item.uuid }} + + x:{{ item.centerx }} + y:{{ item.centery }} @@ -541,7 +556,7 @@ export default defineComponent({ height: 0, angle: 0, }); - + let multiple=ref(false); const aw = 128; const ah = 72; const bw = 160; @@ -637,6 +652,7 @@ export default defineComponent({ } }; let test_monitor_wall: Ref = ref([]); + let multiple_select:Ref=ref([]); const set_x = () => { const wall_dom = wall.value; const item = test_monitor_wall.value[current_index.value]; @@ -890,6 +906,8 @@ export default defineComponent({ } }); return { + multiple_select, + multiple, exceedrange, max_angle, four_point, @@ -929,6 +947,7 @@ export default defineComponent({ let sizeh = wall_dom.offsetHeight / element.background_h; let sizew = wall_dom.offsetWidth / element.background_w; item.currentx = element.lt.x * wall_dom.offsetWidth; + item.currenty = element.lt.y * wall_dom.offsetHeight; percenter.value = parseFloat(element.percenter.toString()); item.InitialH = element.initial_h * sizeh; item.InitialW = element.initial_w * sizew; @@ -957,6 +976,8 @@ export default defineComponent({ test_monitor_wall.value = []; current_index.value = -1; percenter.value = 1; + multiple_select.value=[] + multiple.value=false; test_monitor_list.value.forEach((element) => { element.isHide = false; }); @@ -1017,12 +1038,25 @@ export default defineComponent({ activeMouseDown(item: test_monitor, index: number) { item.active = true; Unchecked.value = false; - if (item.active) { - test_monitor_wall.value.forEach((element) => { - element.active = false; - }); + if(multiple.value){ + if( multiple_select.value.indexOf(item.id)!=-1){ + test_monitor_wall.value[item.id].active=false; + multiple_select.value[multiple_select.value.indexOf(item.id)]=-1; + }else{ + multiple_select.value.push(item.id); + test_monitor_wall.value[item.id].active=true; + current_index.value = index; + } + }else{ + multiple_select.value=[] + if (item.active) { + test_monitor_wall.value.forEach((element) => { + element.active = false; + }); + multiple_select.value.push(item.id); + } + item.active = true; } - item.active = true; current_index.value = index; }, onDragStart(e: DragEvent, item: test_monitor) { @@ -1190,6 +1224,8 @@ export default defineComponent({ element.active = false; }); } + multiple_select.value=[] + multiple.value=false; }, changeAngle() { const wall_dom = wall.value; @@ -1197,26 +1233,64 @@ export default defineComponent({ exceedrange(item); }, sub_x(){ - console.log(111) let item = test_monitor_wall.value[current_index.value] - item.currentx--; - item.centerx--; + if(multiple_select.value.length>1){ + multiple_select.value.forEach((element)=>{ + if(element!=-1){ + test_monitor_wall.value[element].currentx--; + test_monitor_wall.value[element].centerx--; + } + }) + }else{ + item.currentx--; + item.centerx--; + } + }, sub_y(){ let item = test_monitor_wall.value[current_index.value] + if(multiple_select.value.length>1){ + multiple_select.value.forEach((element)=>{ + if(element!=-1){ + test_monitor_wall.value[element].currenty--; + test_monitor_wall.value[element].centery--; + } + }) + }else{ item.currenty--; item.centery--; + } }, add_x(){ let item = test_monitor_wall.value[current_index.value] + if(multiple_select.value.length>1){ + multiple_select.value.forEach((element)=>{ + if(element!=-1){ + test_monitor_wall.value[element].currentx++; + test_monitor_wall.value[element].centerx++; + } + }) + }else{ item.currentx++; item.centerx++; + } + }, add_y(){ let item = test_monitor_wall.value[current_index.value] - item.currenty++; - item.centery++; - } + if(multiple_select.value.length>1){ + multiple_select.value.forEach((element)=>{ + if(element!=-1){ + test_monitor_wall.value[element].currenty++; + test_monitor_wall.value[element].centery++; + } + }) + }else{ + + item.currenty++; + item.centery++; + } + }, }; }, });