"use strict";(self["webpackChunkaida"]=self["webpackChunkaida"]||[]).push([[923],{6923:function(t,i,e){e.r(i),e.d(i,{default:function(){return d}});var o=e(6252),s=e(3577);const n={class:"move_page"},r={class:"move_click"},l=["onMousedown"],c={ref:"img",src:"https://t7.baidu.com/it/u=1956604245,3662848045&fm=193&f=GIF"},g=["onMousedown"];function u(t,i,e,u,h,a){return(0,o.wg)(),(0,o.iD)("div",n,[(0,o._)("div",r,[((0,o.wg)(!0),(0,o.iD)(o.HY,null,(0,o.Ko)(t.moveDian,(i=>((0,o.wg)(),(0,o.iD)("div",{class:"move_click_dian",key:i,style:(0,s.j5)({background:i}),onMousedown:e=>t.AddDian(i)},null,44,l)))),128))]),(0,o._)("div",{class:"img_block",ref:"imgbox",onMousemove:i[1]||(i[1]=i=>t.startMove(i))},[(0,o._)("img",c,null,512),((0,o.wg)(!0),(0,o.iD)(o.HY,null,(0,o.Ko)(t.imgDian,(e=>((0,o.wg)(),(0,o.iD)("div",{class:"img_click_dian",key:e,style:(0,s.j5)({background:e.color,left:e.left+"px",top:e.top+"px"}),onMousedown:i=>t.getMouseDown(i,e),onMousemove:i[0]||(i[0]=i=>t.startMove(i))},null,44,g)))),128))],544)])}var h=(0,o.aZ)({data(){return{moveDian:["red","yellow"],imgDian:[],intObj:null,startDian:!1,currentSign:{},imgBox:{},moveOriginal:{posX:0,posY:0}}},mounted(){this.imgBox={left:this.$refs.imgbox.offsetLeft,top:this.$refs.imgbox.offsetTop,scrollTop:this.$refs.scrollTop||0},console.log(this.imgBox)},methods:{AddDian(t){this.startDian=!0,this.intObj={color:t},console.log(this.intObj)},startMove(t){let i=this.$refs.imgbox.scrollTop;this.intObj?(this.currentSign.color=this.intObj.color,this.currentSign.left=t.clientX-this.imgBox.left,this.currentSign.top=t.clientY+i-this.imgBox.top,this.imgDian.push(this.currentSign),console.log(this.currentSign),this.intObj=null):this.startDian&&(this.currentSign.left=t.clientX-this.imgBox.left-this.moveOriginal.posX,this.currentSign.top=t.clientY+i-this.imgBox.top-this.moveOriginal.posY,document.addEventListener("mouseup",this.getMouseOver),this.$forceUpdate(),this.setBoundarySign())},setBoundarySign(){let t=this.$refs.imgbox.offsetHeight+this.$refs.imgbox.scrollTop,i=t-30,e=this.$refs.imgbox.clientWidth-30;this.currentSign.top<=0?this.currentSign.top=0:this.currentSign.top>=i&&(this.currentSign.top=i),this.currentSign.left<=0?this.currentSign.left=0:this.currentSign.left>=e&&(this.currentSign.left=e)},getMouseDown(t,i){this.currentSign=i,this.moveOriginal.posX=t.offsetX,this.moveOriginal.posY=t.offsetY,this.startDian=!0},getMouseOver(){this.startDian=!1,this.currentSign={},document.removeEventListener("mouseup",this.getMouseOver),document.removeEventListener("touchend",this.getMouseOver)}}}),a=e(3744);const m=(0,a.Z)(h,[["render",u],["__scopeId","data-v-322803da"]]);var d=m}}]);