| | |
| | | <template> |
| | | <div style="position: relative;" class="itm-map-vr" @contextmenu="showMenu($event)" |
| | | <div style="position: relative;" class="itm-map-vr" @contextmenu="showMenu($event)" ref="targetDiv" |
| | | :style="{ |
| | | background: plantBoardFlag ? 'linear-gradient(-90deg, rgba(0, 0, 0, 0.1) 1px, transparent 1px) 0% 0% / 20px 20px, linear-gradient(rgba(0, 0, 0, 0.1) 1px, transparent 1px) 0% 0% / 20px 20px' : '' |
| | | }" |
| | |
| | | |
| | | areaVisible:false, |
| | | areaPosition: { x: 0, y: 0 }, |
| | | mouseX:0, |
| | | mouseY:0, |
| | | |
| | | }; |
| | | }, |
| | |
| | | mounted() { |
| | | document.addEventListener("click", this.hideMenu); |
| | | this.getAreaItemList(); |
| | | // document.addEventListener("mousemove", (event) => { |
| | | // this.mouseX = event.offsetX; |
| | | // this.mouseY = event.offsetY; |
| | | // console.log(`Mouse Position: X=${this.mouseX}, Y=${this.mouseY}`); |
| | | // }); |
| | | }, |
| | | beforeUnmount() { |
| | | document.removeEventListener("click", this.hideMenu); |
| | |
| | | itemParam.x = this.x |
| | | itemParam.y = this.y |
| | | var dto = { |
| | | areacode : itemParam.areacode, |
| | | xVal: itemParam.x, |
| | | yVal: itemParam.y, |
| | | id: itemParam.id |
| | |
| | | itemParam.w = this.width |
| | | itemParam.h = this.height |
| | | var dto = { |
| | | areacode : itemParam.areacode, |
| | | wVal: itemParam.w, |
| | | hVal: itemParam.h, |
| | | id: itemParam.id |
| | |
| | | }, |
| | | showMenu(event) { |
| | | event.preventDefault(); |
| | | // this.menuPosition = { x: this.mouseX, y: this.mouseY}; |
| | | // this.menuPosition = { x: event.offsetX, y: event.offsetY}; |
| | | this.menuPosition = { x: event.clientX, y: event.clientY }; |
| | | this.menuVisible = true; |
| | | this.hideElementMenu() |