luo-image-annotator 0.0.13 → 0.0.15

package/dist/luo-image-annotator.umd.js

@@ -1,33 +1 @@
-(function(B,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(B=typeof globalThis<"u"?globalThis:B||self,t(B.VueImageAnnotator={},B.Vue))})(this,(function(B,t){"use strict";var Qe=Object.defineProperty;var tn=(B,t,z)=>t in B?Qe(B,t,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[t]=z;var A=(B,t,z)=>tn(B,typeof t!="symbol"?t+"":t,z);const z=(y,e)=>Math.sqrt(Math.pow(y.x-e.x,2)+Math.pow(y.y-e.y,2)),it=(y,e)=>{let i=!1;for(let n=0,a=e.length-1;n<e.length;a=n++){const h=e[n].x,c=e[n].y,l=e[a].x,g=e[a].y;c>y.y!=g>y.y&&y.x<(l-h)*(y.y-c)/(g-c)+h&&(i=!i)}return i},q=(y,e,i)=>{const n=i*(Math.PI/180),a=Math.cos(n),h=Math.sin(n),c=y.x-e.x,l=y.y-e.y;return{x:e.x+(c*a-l*h),y:e.y+(c*h+l*a)}};class at{constructor(e){A(this,"canvas");A(this,"ctx");A(this,"img");A(this,"annotations",[]);A(this,"currentTool",null);A(this,"interactionMode","none");A(this,"activeAnnotation",null);A(this,"hoverAnnotation",null);A(this,"isDrawing",!1);A(this,"isDragging",!1);A(this,"isPanning",!1);A(this,"panStartPoint",null);A(this,"dragStartPoint",null);A(this,"dragStartAnnotation",null);A(this,"lastMouseMovePoint",null);A(this,"isHoveringStartPoint",!1);A(this,"currentLabelColor","#FF4081");A(this,"visibleLabels",new Set);A(this,"selectedHandleIndex",-1);A(this,"hoverHandleIndex",-1);A(this,"scale",1);A(this,"offset",{x:0,y:0});A(this,"listeners",{});A(this,"imageUrl","");this.canvas=e;const i=e.getContext("2d");if(!i)throw new Error("Could not get 2d context");this.ctx=i,this.img=new Image,this.img.crossOrigin="Anonymous",this.img.onload=()=>{this.fitImageToCanvas(),this.render()},this.bindEvents()}on(e,i){this.listeners[e]||(this.listeners[e]=[]),this.listeners[e].push(i)}emit(e,i){this.listeners[e]&&this.listeners[e].forEach(n=>n(i))}loadImage(e){this.imageUrl=e,this.img.src=e,this.activeAnnotation=null,this.isDrawing=!1}setAnnotations(e){this.annotations=JSON.parse(JSON.stringify(e)),this.render()}getAnnotations(){return this.annotations}setTool(e){e==="pan"?(this.interactionMode="pan",this.currentTool=null,this.isPanning=!1,this.canvas.style.cursor="grab"):e==="select"?(this.interactionMode="select",this.currentTool=null,this.canvas.style.cursor="default"):e?(this.interactionMode="draw",this.currentTool=e,this.canvas.style.cursor="crosshair"):(this.interactionMode="none",this.currentTool=null,this.canvas.style.cursor="default"),this.activeAnnotation=null,this.isDrawing=!1,this.render()}setLabelStyle(e){this.currentLabelColor=e}setVisibleLabels(e){this.visibleLabels=new Set(e),this.render()}zoom(e){const n=e>0?this.scale*1.1:this.scale/1.1;if(n<.1||n>10)return;const a=this.canvas.width/2,h=this.canvas.height/2,c=this.toImageCoords(a,h);this.scale=n,this.offset.x=a-c.x*this.scale,this.offset.y=h-c.y*this.scale,this.clampViewportOffset(),this.render()}resize(){this.fitImageToCanvas(),this.render()}toImageCoords(e,i){return{x:(e-this.offset.x)/this.scale,y:(i-this.offset.y)/this.scale}}toScreenCoords(e,i){return{x:e*this.scale+this.offset.x,y:i*this.scale+this.offset.y}}fitImageToCanvas(){const e=this.canvas.parentElement;if(e){if(this.canvas.width=e.clientWidth,this.canvas.height=e.clientHeight,this.img.width===0)return;const i=this.canvas.width/this.img.width,n=this.canvas.height/this.img.height;this.scale=Math.min(i,n),this.offset.x=(this.canvas.width-this.img.width*this.scale)/2,this.offset.y=(this.canvas.height-this.img.height*this.scale)/2,this.clampViewportOffset()}}clampViewportOffset(){if(this.img.width===0||this.img.height===0)return;const e=this.img.width*this.scale,i=this.img.height*this.scale;if(e<=this.canvas.width)this.offset.x=(this.canvas.width-e)/2;else{const n=this.canvas.width-e,a=0;this.offset.x=Math.min(a,Math.max(n,this.offset.x))}if(i<=this.canvas.height)this.offset.y=(this.canvas.height-i)/2;else{const n=this.canvas.height-i,a=0;this.offset.y=Math.min(a,Math.max(n,this.offset.y))}}bindEvents(){this.canvas.addEventListener("mousedown",this.handleMouseDown.bind(this)),this.canvas.addEventListener("mousemove",this.handleMouseMove.bind(this)),this.canvas.addEventListener("mouseup",this.handleMouseUp.bind(this)),this.canvas.addEventListener("mouseleave",this.handleMouseUp.bind(this)),window.addEventListener("keydown",this.handleKeyDown.bind(this))}handleKeyDown(e){this.interactionMode==="select"&&(e.key==="Delete"||e.key==="Backspace")&&this.activeAnnotation&&this.deleteAnnotation(this.activeAnnotation.id)}deleteAnnotation(e){const i=this.annotations.findIndex(n=>n.id===e);if(i>-1){const n=this.annotations[i];this.annotations.splice(i,1),this.activeAnnotation=null,this.emit("annotationChange",{action:"delete",changedItem:n,imageUrl:this.imageUrl}),this.render()}}handleMouseDown(e){const i=this.canvas.getBoundingClientRect(),n=e.clientX-i.left,a=e.clientY-i.top,h=this.toImageCoords(n,a);if(this.canvas.style.cursor==="grab"||this.canvas.style.cursor==="grabbing"){this.isPanning=!0,this.panStartPoint={x:n,y:a},this.canvas.style.cursor="grabbing";return}if(this.interactionMode==="select"&&this.activeAnnotation){const g=this.getHitHandle(n,a,this.activeAnnotation);if(g!==-100){this.isDragging=!0,this.dragStartPoint=h,this.selectedHandleIndex=g,this.dragStartAnnotation=JSON.parse(JSON.stringify(this.activeAnnotation));return}}const c=this.interactionMode==="select"?this.getHitCategory(n,a):null;if(c){this.activeAnnotation=c,this.isDragging=!1,this.selectedHandleIndex=-1,this.emit("annotationChange",{action:"select",changedItem:c,imageUrl:this.imageUrl}),this.render();return}const l=this.getHitAnnotation(h);if(this.interactionMode==="select"){if(l){if(!(this.visibleLabels.size>0&&!this.visibleLabels.has(l.label))){this.activeAnnotation=l,this.isDragging=!0,this.dragStartPoint=h,this.selectedHandleIndex=-1,this.dragStartAnnotation=JSON.parse(JSON.stringify(l)),this.emit("annotationChange",{action:"select",changedItem:l,imageUrl:this.imageUrl}),this.render();return}}else this.activeAnnotation=null,this.emit("annotationChange",{action:"select",changedItem:void 0,imageUrl:this.imageUrl}),this.render();return}if(this.interactionMode==="draw"){if(this.isDrawing&&this.currentTool==="polygon"&&this.activeAnnotation){const g=this.activeAnnotation.coordinates;if(g.points.length>2&&z(h,g.points[0])<20/this.scale){this.finishDrawing();return}this.startDrawing(h);return}if(this.currentTool){if(this.currentTool==="polygon"&&!this.isDrawing){this.startDrawing(h);return}this.startDrawing(h)}return}this.activeAnnotation=null,this.render()}handleMouseMove(e){const i=this.canvas.getBoundingClientRect(),n=e.clientX-i.left,a=e.clientY-i.top,h=this.toImageCoords(n,a);if(this.isPanning&&this.panStartPoint){const c=n-this.panStartPoint.x,l=a-this.panStartPoint.y;this.offset.x+=c,this.offset.y+=l,this.clampViewportOffset(),this.panStartPoint={x:n,y:a},this.render();return}if(this.lastMouseMovePoint=h,this.isDrawing){if(this.currentTool==="polygon"&&this.activeAnnotation){const c=this.activeAnnotation.coordinates;if(c.points.length>2){const l=c.points[0],g=z(h,l);this.isHoveringStartPoint=g<20/this.scale}else this.isHoveringStartPoint=!1}this.updateDrawing(h)}else this.isDragging&&this.activeAnnotation&&this.dragStartPoint?this.updateDragging(h):this.checkHover(n,a,h);this.render()}handleMouseUp(e){if(this.isPanning){this.isPanning=!1,this.panStartPoint=null,this.canvas.style.cursor="grab";return}if(this.isDrawing){if(this.currentTool==="polygon"){this.render();return}this.finishDrawing()}else this.isDragging&&this.activeAnnotation&&this.emit("annotationChange",{action:"update",changedItem:this.activeAnnotation,imageUrl:this.imageUrl});this.currentTool!=="polygon"&&(this.isDrawing=!1),this.isDragging=!1,this.dragStartPoint=null,this.selectedHandleIndex=-1,this.render()}hexToRgba(e,i){if(!e.startsWith("#"))return e;const n=parseInt(e.slice(1,3),16),a=parseInt(e.slice(3,5),16),h=parseInt(e.slice(5,7),16);return`rgba(${n}, ${a}, ${h}, ${i})`}startDrawing(e){if(!this.currentTool)return;const i=Date.now().toString();if(this.hexToRgba(this.currentLabelColor,.2),this.currentLabelColor,this.currentTool==="rectangle")this.isDrawing=!0,this.dragStartPoint=e,this.activeAnnotation={id:i,type:"rectangle",label:"",coordinates:{x1:e.x,y1:e.y,x2:e.x,y2:e.y},style:{strokeColor:this.currentLabelColor}};else if(this.currentTool==="point"){const n={id:i,type:"point",label:"",coordinates:{points:[e]},style:{strokeColor:this.currentLabelColor}};this.annotations.push(n),this.emit("annotationChange",{action:"add",changedItem:n,imageUrl:this.imageUrl}),this.activeAnnotation=n}else if(this.currentTool==="polygon")this.activeAnnotation&&this.activeAnnotation.type==="polygon"&&this.isDrawing?this.activeAnnotation.coordinates.points.push(e):(this.isDrawing=!0,this.activeAnnotation={id:i,type:"polygon",label:"",coordinates:{points:[e]},style:{strokeColor:this.currentLabelColor}});else if(this.currentTool==="category"){const n={id:i,type:"category",label:"",coordinates:null,style:{strokeColor:this.currentLabelColor}};this.annotations.push(n),this.emit("annotationChange",{action:"add",changedItem:n,imageUrl:this.imageUrl}),this.activeAnnotation=n}else this.currentTool==="rotatedRect"&&(this.isDrawing=!0,this.dragStartPoint=e,this.activeAnnotation={id:i,type:"rotatedRect",label:"",coordinates:{x:e.x,y:e.y,width:0,height:0,angle:0},style:{strokeColor:this.currentLabelColor}})}updateDrawing(e){if(this.activeAnnotation)if(this.activeAnnotation.type==="rectangle"&&this.dragStartPoint){const i=this.activeAnnotation.coordinates;i.x2=e.x,i.y2=e.y}else if(this.activeAnnotation.type==="rotatedRect"&&this.dragStartPoint){const i=this.activeAnnotation.coordinates,n=Math.abs(e.x-this.dragStartPoint.x),a=Math.abs(e.y-this.dragStartPoint.y);i.width=n*2,i.height=a*2}else this.activeAnnotation.type}finishDrawing(){if(this.activeAnnotation){if(this.activeAnnotation.type==="rectangle"){const e=this.activeAnnotation.coordinates;if(Math.abs(e.x1-e.x2)<2||Math.abs(e.y1-e.y2)<2){this.activeAnnotation=null,this.isDrawing=!1;return}const i=Math.min(e.x1,e.x2),n=Math.max(e.x1,e.x2),a=Math.min(e.y1,e.y2),h=Math.max(e.y1,e.y2);e.x1=i,e.x2=n,e.y1=a,e.y2=h,this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}else if(this.activeAnnotation.type==="polygon"){if(this.activeAnnotation.coordinates.points.length<3){this.activeAnnotation=null,this.isDrawing=!1;return}this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}else if(this.activeAnnotation.type==="rotatedRect"){const e=this.activeAnnotation.coordinates;if(e.width<2||e.height<2){this.activeAnnotation=null,this.isDrawing=!1;return}this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}this.activeAnnotation.type}this.isDrawing=!1}updateDragging(e){if(!this.activeAnnotation||!this.dragStartPoint||!this.dragStartAnnotation)return;const i=e.x-this.dragStartPoint.x,n=e.y-this.dragStartPoint.y;this.selectedHandleIndex===-1?this.moveAnnotation(this.activeAnnotation,this.dragStartAnnotation,i,n):this.resizeAnnotation(this.activeAnnotation,this.dragStartAnnotation,this.selectedHandleIndex,e)}moveAnnotation(e,i,n,a){if(e.type==="rectangle"){const h=i.coordinates,c=e.coordinates;c.x1=h.x1+n,c.x2=h.x2+n,c.y1=h.y1+a,c.y2=h.y2+a}else if(e.type==="point"){const h=i.coordinates,c=e.coordinates;c.points=h.points.map(l=>({x:l.x+n,y:l.y+a}))}else if(e.type==="rotatedRect"){const h=i.coordinates,c=e.coordinates;c.x=h.x+n,c.y=h.y+a}else if(e.type==="polygon"){const h=i.coordinates,c=e.coordinates;c.points=h.points.map(l=>({x:l.x+n,y:l.y+a}))}}resizeAnnotation(e,i,n,a){if(e.type==="rectangle"){const h=e.coordinates;n===0&&(h.x1=a.x,h.y1=a.y),n===1&&(h.x2=a.x,h.y1=a.y),n===2&&(h.x2=a.x,h.y2=a.y),n===3&&(h.x1=a.x,h.y2=a.y)}else if(e.type==="polygon"){const h=e.coordinates;n>=0&&n<h.points.length&&(h.points[n]=a)}else if(e.type==="point"){const h=e.coordinates;n>=0&&n<h.points.length&&(h.points[n]=a)}else if(e.type==="rotatedRect"){const h=e.coordinates;if(n===-2){const c=h.x,l=h.y,g=a.x-c,m=a.y-l;let x=Math.atan2(m,g)*180/Math.PI;x+=90,h.angle=x}else{const c=h.angle*Math.PI/180,l=Math.cos(-c),g=Math.sin(-c),m=a.x-h.x,x=a.y-h.y,u=m*l-x*g,k=m*g+x*l;(n===0||n===3)&&(h.width/2,h.width=Math.abs(u)*2),(n===1||n===2)&&(h.width=Math.abs(u)*2),(n===0||n===1)&&(h.height=Math.abs(k)*2),(n===2||n===3)&&(h.height=Math.abs(k)*2)}}}getHitAnnotation(e){for(let i=this.annotations.length-1;i>=0;i--){const n=this.annotations[i];if(this.isPointInAnnotation(e,n))return n}return null}isPointInAnnotation(e,i){if(i.type==="rectangle"){const n=i.coordinates;return e.x>=n.x1&&e.x<=n.x2&&e.y>=n.y1&&e.y<=n.y2}else if(i.type==="polygon"){const n=i.coordinates;return it(e,n.points)}else if(i.type==="rotatedRect"){const n=i.coordinates,a=q(e,{x:n.x,y:n.y},-n.angle),h=n.width/2,c=n.height/2;return a.x>=n.x-h&&a.x<=n.x+h&&a.y>=n.y-c&&a.y<=n.y+c}else if(i.type==="point")return i.coordinates.points.some(a=>z(e,a)<10/this.scale);return!1}getHitHandle(e,i,n){const a=this.getAnnotationHandles(n),h=6;for(let c=0;c<a.length;c++){const l=a[c],g=this.toScreenCoords(l.x,l.y);if(Math.abs(e-g.x)<h&&Math.abs(i-g.y)<h)return n.type==="rotatedRect"&&c===4?-2:c}return-100}getAnnotationHandles(e){if(e.type==="rectangle"){const i=e.coordinates;return[{x:i.x1,y:i.y1},{x:i.x2,y:i.y1},{x:i.x2,y:i.y2},{x:i.x1,y:i.y2}]}else{if(e.type==="polygon")return e.coordinates.points;if(e.type==="point")return e.coordinates.points;if(e.type==="rotatedRect"){const i=e.coordinates,n={x:i.x,y:i.y},a=i.width/2,h=i.height/2,c={x:i.x-a,y:i.y-h},l={x:i.x+a,y:i.y-h},g={x:i.x+a,y:i.y+h},m={x:i.x-a,y:i.y+h},x={x:i.x,y:i.y-h-20/this.scale};return[c,l,g,m,x].map(u=>q(u,n,i.angle))}}return[]}checkHover(e,i,n){const a=this.getHitCategory(e,i);if(a){this.canvas.style.cursor="pointer",this.hoverAnnotation=a;return}if(this.activeAnnotation&&this.getHitHandle(e,i,this.activeAnnotation)!==-100){this.canvas.style.cursor="pointer";return}const h=this.getHitAnnotation(n);h?(this.canvas.style.cursor="move",this.hoverAnnotation=h):(this.canvas.style.cursor="default",this.hoverAnnotation=null)}render(){this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height),this.img.complete&&this.img.width>0&&this.ctx.drawImage(this.img,this.offset.x,this.offset.y,this.img.width*this.scale,this.img.height*this.scale),this.annotations.forEach(e=>{e!==this.activeAnnotation&&this.drawItem(e,!1)}),this.activeAnnotation&&this.drawItem(this.activeAnnotation,!0),this.renderCategories()}renderCategories(){const e=this.annotations.filter(g=>g.type==="category");if(e.length===0)return;this.ctx.save(),this.ctx.font="14px sans-serif",this.ctx.textBaseline="top";let i=10;const n=10,a=8,h=4,c=24,l=8;e.forEach(g=>{const m=g.label||"Unlabeled",x=this.ctx.measureText(m).width+a*2,u=this.activeAnnotation===g,k=this.hoverAnnotation===g;this.ctx.fillStyle=u?"#E3F2FD":k?"#F5F5F5":"rgba(255, 255, 255, 0.9)",this.ctx.strokeStyle=u?"#2196F3":"#666",this.ctx.lineWidth=u?2:1,this.ctx.beginPath(),this.ctx.rect(i,n,x,c),this.ctx.fill(),this.ctx.stroke(),this.ctx.fillStyle=u?"#1976D2":"#333",this.ctx.fillText(m,i+a,n+h),i+=x+l}),this.ctx.restore()}getHitCategory(e,i){const n=this.annotations.filter(x=>x.type==="category");if(n.length===0)return null;this.ctx.save(),this.ctx.font="14px sans-serif";let a=10;const h=10,c=8,l=24,g=8;let m=null;for(const x of n){const u=x.label||"Unlabeled",k=this.ctx.measureText(u).width+c*2;if(e>=a&&e<=a+k&&i>=h&&i<=h+l){m=x;break}a+=k+g}return this.ctx.restore(),m}drawItem(e,i){var h;if(this.visibleLabels.size>0&&!this.visibleLabels.has(e.label)&&!i)return;this.ctx.save();const n=((h=e.style)==null?void 0:h.strokeColor)||"#FF4081",a=i?"#00E5FF":n;if(this.ctx.strokeStyle=a,this.ctx.lineWidth=2,i?this.ctx.fillStyle="rgba(0, 229, 255, 0.2)":this.ctx.fillStyle=this.hexToRgba(n,.2),e.type==="rectangle"){const c=e.coordinates,l=this.toScreenCoords(c.x1,c.y1),g=this.toScreenCoords(c.x2,c.y2),m=Math.min(l.x,g.x),x=Math.min(l.y,g.y),u=Math.abs(l.x-g.x),k=Math.abs(l.y-g.y);this.ctx.strokeRect(m,x,u,k),this.ctx.fillStyle=i?"rgba(0, 229, 255, 0.2)":"rgba(255, 64, 129, 0.2)",this.ctx.fillRect(m,x,u,k),i&&this.drawHandles(this.getAnnotationHandles(e))}else if(e.type==="polygon"){const c=e.coordinates;if(c.points.length===0){this.ctx.restore();return}this.ctx.beginPath();const l=this.toScreenCoords(c.points[0].x,c.points[0].y);this.ctx.moveTo(l.x,l.y);for(let g=1;g<c.points.length;g++){const m=this.toScreenCoords(c.points[g].x,c.points[g].y);this.ctx.lineTo(m.x,m.y)}if(!this.isDrawing||e!==this.activeAnnotation)this.ctx.closePath();else if(this.lastMouseMovePoint){let g=this.lastMouseMovePoint;if(this.isHoveringStartPoint&&c.points.length>0){g=c.points[0];const x=this.toScreenCoords(c.points[0].x,c.points[0].y);this.ctx.save(),this.ctx.beginPath(),this.ctx.arc(x.x,x.y,10,0,Math.PI*2),this.ctx.fillStyle="rgba(255, 215, 0, 0.6)",this.ctx.strokeStyle="#FFFFFF",this.ctx.lineWidth=2,this.ctx.fill(),this.ctx.stroke(),this.ctx.restore()}const m=this.toScreenCoords(g.x,g.y);this.ctx.lineTo(m.x,m.y)}this.ctx.stroke(),this.ctx.fillStyle=i?"rgba(0, 229, 255, 0.2)":"rgba(255, 64, 129, 0.2)",this.ctx.fill(),i&&this.drawHandles(this.getAnnotationHandles(e))}else if(e.type==="rotatedRect"){const c=e.coordinates;this.ctx.translate(this.toScreenCoords(c.x,c.y).x,this.toScreenCoords(c.x,c.y).y),this.ctx.rotate(c.angle*Math.PI/180);const l=c.width*this.scale,g=c.height*this.scale;this.ctx.strokeRect(-l/2,-g/2,l,g),this.ctx.fillStyle=i?"rgba(0, 229, 255, 0.2)":"rgba(255, 64, 129, 0.2)",this.ctx.fillRect(-l/2,-g/2,l,g),this.ctx.rotate(-c.angle*Math.PI/180),this.ctx.translate(-this.toScreenCoords(c.x,c.y).x,-this.toScreenCoords(c.x,c.y).y),i&&this.drawHandles(this.getAnnotationHandles(e))}else e.type==="point"&&e.coordinates.points.forEach(l=>{const g=this.toScreenCoords(l.x,l.y);this.ctx.beginPath(),this.ctx.arc(g.x,g.y,5,0,Math.PI*2),this.ctx.fillStyle=i?"#00E5FF":n,this.ctx.fill(),this.ctx.stroke()});this.ctx.restore()}drawHandles(e){this.ctx.fillStyle="#FFFFFF",this.ctx.strokeStyle="#000000",this.ctx.lineWidth=1,e.forEach(i=>{const n=this.toScreenCoords(i.x,i.y);this.ctx.fillRect(n.x-4,n.y-4,8,8),this.ctx.strokeRect(n.x-4,n.y-4,8,8)})}}const lt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896z m0-320a64 64 0 1 0 0-128 64 64 0 0 0 0 128z m0 64a128 128 0 1 1 0-256 128 128 0 0 1 0 256z" fill="currentColor"/>\r
-</svg>`,rt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M609.408 149.376l-277.76 277.76a96 96 0 0 0 0 135.68l277.76 277.76a32 32 0 1 0 45.248-45.248L376.96 512l277.76-277.76a32 32 0 0 0-45.248-45.248z" fill="currentColor"/>\r
-</svg>`,ct=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M704 192h160v160h-160z m-64-64v288h288V128H640zM160 672h160v160H160z m-64-64v288h288V608H96z m256-320h320v64H352z" fill="currentColor"/>\r
-</svg>`,ht=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M256 256h512v512H256z m-64-64v640h640V192H192z" fill="currentColor"/>\r
-</svg>`,dt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M160 256h704a32 32 0 1 1 0 64h-64v608a32 32 0 0 1-32 32H256a32 32 0 0 1-32-32V320h-64a32 32 0 1 1 0-64zm128 64v576h448V320H288z m128 0v512a32 32 0 1 1-64 0V320a32 32 0 1 1 64 0zm256 0v512a32 32 0 1 1-64 0V320a32 32 0 1 1 64 0zM352 128h320a32 32 0 0 1 32 32v64H320v-64a32 32 0 0 1 32-32z" fill="currentColor"/>\r
-</svg>`,gt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M512 666.56l-186.88-186.88a32 32 0 0 0-45.248 45.248l209.536 209.536a96 96 0 0 0 135.68 0l209.536-209.536a32 32 0 1 0-45.248-45.248L544 666.56V128a32 32 0 0 0-64 0v538.56zM192 832h640a32 32 0 1 1 0 64H192a32 32 0 1 1 0-64z" fill="currentColor"/>\r
-</svg>`,mt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M832 512a32 32 0 1 1 64 0v352a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h352a32 32 0 0 1 0 64H192v640h640V512z m-144-320l-480 480v160h160l480-480-160-160z m-114.56 480H256v-117.76L653.44 236.8l117.76 117.76L573.44 672z m208-208l-117.76-117.76 66.56-66.56a32 32 0 0 1 45.248 0l72.512 72.512a32 32 0 0 1 0 45.248l-66.56 66.56z" fill="currentColor"/>\r
-</svg>`,ft=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M940.48 876.16L148.16 83.84a32 32 0 1 0-45.12 45.12L236.8 262.4C163.52 337.28 107.52 429.12 82.56 528.96a32 32 0 0 0 0 20.48C144.384 727.68 314.88 840.96 512 840.96c103.04 0 199.36-30.72 283.52-83.84l99.84 99.84a32 32 0 1 0 45.12-45.12zM512 776.96c-176.64 0-333.44-98.56-402.56-248.96 25.6-56.32 63.36-107.52 110.08-151.04L364.8 522.24a128 128 0 0 0 147.2 147.2l123.52 123.52A445.44 445.44 0 0 1 512 776.96z m373.12-32.64l-64-64C857.6 627.84 879.616 572.16 879.616 512c0-176.64-156.8-328.96-367.616-328.96-58.24 0-113.6 11.52-164.48 32.64l-55.68-55.68C346.88 136.96 427.52 119.04 512 119.04c229.76 0 425.216 142.08 493.44 346.24a32 32 0 0 1 0 20.48 450.56 450.56 0 0 1-120.32 258.56z m-309.12-309.12l-128-128A128 128 0 0 1 576 435.2z" fill="currentColor"/>\r
-</svg>`,ut=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 832a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm-48-384H320a32 32 0 0 1 0-64h144V304a32 32 0 1 1 64 0v144h144a32 32 0 1 1 0 64H528v144a32 32 0 1 1-64 0V512z" fill="currentColor"/>\r
-</svg>`,pt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M224 448a32 32 0 0 0 9.536 22.592l416 416a32 32 0 0 0 45.248 0l226.24-226.24a32 32 0 0 0 0-45.248l-416-416A32 32 0 0 0 482.432 192H256a64 64 0 0 0-64 64v192z m64-192h160l384 384-160 160-384-384V256z m64 128a64 64 0 1 0 0-128 64 64 0 0 0 0 128z" fill="currentColor"/>\r
-</svg>`,yt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M160 832h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64zm0-704h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64zm0 352h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64z" fill="currentColor"/>\r
-</svg>`,vt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M784.512 230.272v-50.56a32 32 0 1 1 64 0v149.056a32 32 0 0 1-32 32H667.52a32 32 0 1 1 0-64h92.992A320 320 0 1 0 524.8 833.152a320 320 0 0 0 320-320h64a384 384 0 0 1-384 384 384 384 0 0 1-384-384 384 384 0 0 1 643.712-282.88z" fill="currentColor"/>\r
-</svg>`,xt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M340.864 149.376a32 32 0 0 0-45.248 45.248L573.44 512l-277.76 317.376a32 32 0 0 0 45.248 45.248l277.76-277.76a96 96 0 0 0 0-135.68L340.864 149.376z" fill="currentColor"/>\r
-</svg>`,bt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M512 192c229.76 0 425.216 142.08 493.44 346.24a32 32 0 0 1 0 20.48C937.216 762.88 741.76 904.96 512 904.96S86.784 762.88 18.56 558.72a32 32 0 0 1 0-20.48C86.784 334.08 282.24 192 512 192zm0 64c-197.12 0-367.616 120.32-428.16 296.32C144.384 727.68 314.88 840.96 512 840.96s367.616-113.28 428.16-288.64C879.616 376.32 709.12 256 512 256zm0 160a128 128 0 1 1 0 256 128 128 0 0 1 0-256zm0 64a64 64 0 1 0 0 128 64 64 0 0 0 0-128z" fill="currentColor"/>\r
-</svg>`,wt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M637.12 693.376l182.208 182.208a32 32 0 1 1-45.248 45.248L591.872 738.624a352 352 0 1 1 45.248-45.248z m-45.248-45.248A288 288 0 1 0 183.872 240.128a288 288 0 0 0 408 408zM416 448h96a32 32 0 0 1 0 64h-96v96a32 32 0 0 1-64 0v-96h-96a32 32 0 0 1 0-64h96v-96a32 32 0 0 1 64 0v96z" fill="currentColor"/>\r
-</svg>`,kt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1em" height="1em">\r
-  <path d="M637.12 693.376l182.208 182.208a32 32 0 1 1-45.248 45.248L591.872 738.624a352 352 0 1 1 45.248-45.248z m-45.248-45.248A288 288 0 1 0 183.872 240.128a288 288 0 0 0 408 408zM256 448h320a32 32 0 1 1 0 64H256a32 32 0 1 1 0-64z" fill="currentColor"/>\r
-</svg>`,Ct=["innerHTML"],_t=t.defineComponent({__name:"SvgIcon",props:{name:{},size:{}},setup(y){const e=y,i=t.ref(""),n=Object.assign({"../assets/svg/aim.svg":lt,"../assets/svg/back.svg":rt,"../assets/svg/connection.svg":ct,"../assets/svg/crop.svg":ht,"../assets/svg/delete.svg":dt,"../assets/svg/download.svg":gt,"../assets/svg/edit.svg":mt,"../assets/svg/hide.svg":ft,"../assets/svg/pointer.svg":ut,"../assets/svg/price-tag.svg":pt,"../assets/svg/rank.svg":yt,"../assets/svg/refresh-right.svg":vt,"../assets/svg/right.svg":xt,"../assets/svg/view.svg":bt,"../assets/svg/zoom-in.svg":wt,"../assets/svg/zoom-out.svg":kt});return t.watchEffect(()=>{const a=`../assets/svg/${e.name}.svg`,h=n[a];h?i.value=h:(console.warn(`Icon ${e.name} not found at path ${a}`),i.value="")}),(a,h)=>(t.openBlock(),t.createElementBlock("i",{class:t.normalizeClass(["svg-icon",[y.size?`size-${y.size}`:""]]),innerHTML:i.value},null,10,Ct))}}),F=(y,e)=>{const i=y.__vccOpts||y;for(const[n,a]of e)i[n]=a;return i},E=F(_t,[["__scopeId","data-v-3928607b"]]),At={key:0,class:"image-list-sidebar"},It={class:"image-list-title"},St={class:"image-list-scroll"},Bt=["onClick"],Et={class:"image-list-stage"},Vt=["src","alt"],Nt={key:0,class:"thumb-overlay-layer"},zt={key:1,class:"thumb-overlay-svg",viewBox:"0 0 100 100",preserveAspectRatio:"none"},Mt=["points"],Tt={class:"image-list-text"},$t={key:1,class:"left-sidebar"},Dt=["onClick","title"],Pt={class:"center-area"},Lt={key:0,class:"top-bar"},Ht={class:"label-selector"},Rt={class:"tags-row"},Ft=["onClick"],Ut={key:0,class:"no-labels"},Ot={key:1,class:"batch-nav"},Wt=["disabled"],Jt=["disabled"],jt={key:2,class:"right-sidebar"},Yt={class:"label-list"},Xt={class:"label-row"},qt=["onUpdate:modelValue","onChange"],Gt=["title"],Kt=["onClick"],Zt={class:"action-icon more-actions"},Qt=["onClick"],te={key:3,class:"modal-overlay"},ee={class:"modal-content"},ne={class:"form-group"},oe={class:"form-group"},se={class:"color-input-wrapper"},G=F(t.defineComponent({__name:"ImageAnnotator",props:{annotationTypes:{default:()=>["rectangle","polygon","point","rotatedRect"]},batchImages:{default:()=>[]},labels:{default:()=>[]},defaultActiveType:{},theme:{default:"light"},readOnly:{type:Boolean,default:!1},image:{},predictionCandidates:{},session:{},requestId:{},minZoom:{},maxZoom:{}},emits:["annotationChange","batchChange","labelChange","ready","error","tool:change","viewport:change","annotation:add","annotation:update","annotation:delete","annotation:select","prediction:loaded","prediction:apply","prediction:reject"],setup(y,{expose:e,emit:i}){const n=y,a=i,h=t.ref(null),c=t.ref(null),l=t.ref(null),g=t.ref(null),m=t.ref(0),x=t.ref(""),u=t.ref([]),k=t.ref(""),N=t.ref(!1),_=t.ref({name:"",color:"#FF0000"}),C=t.ref("none"),b=t.ref([]),V=t.ref({}),$=t.computed(()=>g.value==="select"&&!!x.value),P=o=>{if(!o||V.value[o])return;const s=new Image;s.onload=()=>{const r=s.naturalWidth||1,d=s.naturalHeight||1;V.value={...V.value,[o]:{width:r,height:d}}},s.src=o},L=()=>{n.batchImages.forEach(o=>{P(o.imageUrl)})},M=()=>{var r,d,f,w;const o=n.batchImages[m.value],s=(o==null?void 0:o.imageUrl)||((r=n.image)==null?void 0:r.url);return{eventId:`${Date.now()}-${Math.random().toString(36).slice(2,10)}`,timestamp:Date.now(),requestId:n.requestId,taskId:(d=n.session)==null?void 0:d.taskId,imageId:((f=n.image)==null?void 0:f.id)||s,operator:(w=n.session)==null?void 0:w.userId}},Z=o=>{var d;const s=o==null?void 0:o.action;if(!s)return;const r={meta:M(),action:s,current:o==null?void 0:o.changedItem,source:(d=o==null?void 0:o.changedItem)!=null&&d.predictionId?"prediction":"manual"};s==="add"&&a("annotation:add",r),s==="update"&&a("annotation:update",r),s==="delete"&&a("annotation:delete",r),s==="select"&&a("annotation:select",r)},W=t.computed(()=>n.annotationTypes.filter(o=>o!=="category")),J=o=>({rectangle:"crop",polygon:"connection",point:"aim",rotatedRect:"refresh-right",category:"price-tag"})[o]||o,j=o=>({rectangle:"矩形框",polygon:"多边形",point:"关键点",rotatedRect:"旋转矩形",category:"分类标签"})[o]||o;t.onMounted(()=>{if(L(),h.value){l.value=new at(h.value),l.value.on("annotationChange",s=>{var r,d;if(s.action==="add"&&s.changedItem){const f=u.value.find(w=>w.id===k.value);f&&(s.changedItem.label=f.name,s.changedItem.labelId=f.id)}s.action==="select"?x.value=((r=s.changedItem)==null?void 0:r.id)||"":s.action==="delete"&&((d=s.changedItem)==null?void 0:d.id)===x.value&&(x.value=""),a("annotationChange",s),Z(s)}),D(),T();const o=new ResizeObserver(()=>{var s;(s=l.value)==null||s.resize()});c.value&&o.observe(c.value),n.defaultActiveType&&p(n.defaultActiveType),a("ready",{meta:M()})}});const T=()=>{if(!l.value)return;const o=u.value.find(r=>r.id===k.value);o&&l.value.setLabelStyle(o.color);const s=u.value.filter(r=>r.visible).map(r=>r.name);l.value.setVisibleLabels(s)},D=()=>{var o;if(l.value)if(x.value="",requestAnimationFrame(()=>{var s;(s=l.value)==null||s.resize()}),n.batchImages.length>0){const s=n.batchImages[m.value];l.value.loadImage(s.imageUrl),s.annotations?l.value.setAnnotations(s.annotations):l.value.setAnnotations([])}else(o=n.image)!=null&&o.url&&l.value.loadImage(n.image.url)},p=o=>{var s,r;if(g.value=o,x.value="",o!=="pan"&&o!=="select"&&u.value.length===0){alert("请先创建标签！");return}o==="pan"||o==="select"?(s=l.value)==null||s.setTool(o):(r=l.value)==null||r.setTool(o),a("tool:change",{meta:M(),tool:o})},v=()=>{var o;(o=l.value)!=null&&o.activeAnnotation&&l.value.deleteAnnotation(l.value.activeAnnotation.id)},I=()=>{l.value&&a("viewport:change",{meta:M(),scale:l.value.scale,offset:{...l.value.offset}})},H=()=>{var o;(o=l.value)==null||o.zoom(1),I()},Q=()=>{var o;(o=l.value)==null||o.zoom(-1),I()},Se=()=>{_.value={name:"",color:"#2196F3"},N.value=!0},tt=()=>{N.value=!1},Be=()=>{if(!_.value.name.trim()){alert("请输入标签名称");return}const s={id:Date.now().toString(),name:_.value.name,color:_.value.color,visible:!0};u.value.push(s),a("labelChange",u.value),T(),u.value.length===1&&R(s),tt()},R=o=>{var s;k.value=o.id,(s=l.value)==null||s.setLabelStyle(o.color)},Ee=(o,s)=>{if(!o.startsWith("#"))return o;let r=0,d=0,f=0;return o.length===4?(r=parseInt(o[1]+o[1],16),d=parseInt(o[2]+o[2],16),f=parseInt(o[3]+o[3],16)):o.length===7&&(r=parseInt(o.slice(1,3),16),d=parseInt(o.slice(3,5),16),f=parseInt(o.slice(5,7),16)),`rgba(${r}, ${d}, ${f}, ${s})`},Ve=o=>{var s;if(o.id===k.value&&((s=l.value)==null||s.setLabelStyle(o.color)),l.value){const r=l.value.getAnnotations();let d=!1;r.forEach(f=>{f.label===o.name&&(f.style||(f.style={}),f.style.strokeColor=o.color,f.style.fillColor=Ee(o.color,.2),d=!0)}),d&&l.value.render()}a("labelChange",u.value),T()},Ne=o=>{o.visible=!o.visible,T()},ze=o=>{const s=u.value.findIndex(r=>r.id===o);s>-1&&(u.value.splice(s,1),a("labelChange",u.value),k.value===o&&(k.value=u.value.length>0?u.value[0].id:"",k.value&&R(u.value[0])),T())};t.watch(()=>n.labels,o=>{const s=JSON.parse(JSON.stringify(o||[]));if(u.value=s,u.value.length>0)if(!k.value||!u.value.find(r=>r.id===k.value))R(u.value[0]);else{const r=u.value.find(d=>d.id===k.value);r&&R(r)}else k.value="";T()},{immediate:!0,deep:!0});const Me=()=>{m.value>0&&(Y(),m.value--,D(),X())},Te=()=>{m.value<n.batchImages.length-1&&(Y(),m.value++,D(),X())},Y=()=>{if(l.value){const o=l.value.getAnnotations();n.batchImages[m.value].annotations=o}},X=()=>{const o=n.batchImages[m.value];a("batchChange",{currentIndex:m.value,total:n.batchImages.length,currentImageUrl:o.imageUrl,currentAnnotations:o.annotations||[]})},et=(o=[])=>{var f;if(!l.value)return;if(b.value=JSON.parse(JSON.stringify(o)),b.value.length===0){C.value="none";return}C.value="loaded";const r=(l.value.getAnnotations()||[]).filter(w=>!w.predictionId),d=b.value.map(w=>{const S=JSON.parse(JSON.stringify(w.annotation));return S.id=S.id||`pred-${w.id}`,S.predictionId=w.id,S.modelRunId=w.modelRunId||S.modelRunId,S.confidence=w.confidence??S.confidence,S.reviewStatus=S.reviewStatus||"draft",S});l.value.setAnnotations([...r,...d]),a("prediction:loaded",{meta:M(),modelRunId:(f=b.value[0])==null?void 0:f.modelRunId,candidates:b.value})},$e=(o,s)=>{var f;if(!l.value)return[];C.value="applying";const d=(l.value.getAnnotations()||[]).filter(w=>w.predictionId&&o.includes(w.predictionId));return d.forEach(w=>{w.reviewStatus="accepted"}),C.value="applied",a("prediction:apply",{meta:M(),modelRunId:(f=d[0])==null?void 0:f.modelRunId,candidateIds:o,threshold:s,acceptedAnnotations:d}),l.value.render(),d},De=(o,s)=>{var f;if(!l.value)return;const r=l.value.getAnnotations()||[],d=r.filter(w=>!(w.predictionId&&o.includes(w.predictionId)));l.value.setAnnotations(d),a("prediction:reject",{meta:M(),modelRunId:(f=r.find(w=>w.predictionId&&o.includes(w.predictionId)))==null?void 0:f.modelRunId,candidateIds:o,reason:s})},Pe=(o,s=[])=>{l.value&&(l.value.loadImage(o.url),l.value.setAnnotations(s))},Le=o=>{var s;(s=l.value)==null||s.setAnnotations(o)},nt=()=>{var o;return((o=l.value)==null?void 0:o.getAnnotations())||[]},He=(o="json")=>{var r,d;const s=nt();return{format:o,image:((r=n.batchImages[m.value])==null?void 0:r.imageUrl)||((d=n.image)==null?void 0:d.url)||"",annotations:s}},ot=o=>{o>=0&&o<n.batchImages.length&&(Y(),m.value=o,D(),X())},Re=o=>{var s;return o===m.value&&l.value?l.value.getAnnotations()||[]:((s=n.batchImages[o])==null?void 0:s.annotations)||[]},Fe=o=>o.type==="rectangle",Ue=o=>o.type==="polygon",Oe=o=>o.type==="point",We=o=>o.type==="rotatedRect",U=o=>{var r,d;const s=(r=u.value.find(f=>f.name===o.label))==null?void 0:r.color;return((d=o.style)==null?void 0:d.strokeColor)||s||"#409eff"},st=o=>{const s=o.coordinates;return(s==null?void 0:s.points)||[]},O=o=>{const s=n.batchImages[o];if(s!=null&&s.width&&(s!=null&&s.height))return{width:s.width,height:s.height};const r=s!=null&&s.imageUrl?V.value[s.imageUrl]:void 0;return r||(s!=null&&s.imageUrl&&P(s.imageUrl),{width:1,height:1})},Je=o=>{const s=n.batchImages[o];return s!=null&&s.width&&(s!=null&&s.height)?!0:s!=null&&s.imageUrl?!!V.value[s.imageUrl]:!1},je=(o,s)=>{const r=s.coordinates,d=O(o),f=U(s),w=Math.min(r.x1,r.x2),S=Math.min(r.y1,r.y2),Ke=Math.max(r.x1,r.x2),Ze=Math.max(r.y1,r.y2);return{left:`${w/d.width*100}%`,top:`${S/d.height*100}%`,width:`${(Ke-w)/d.width*100}%`,height:`${(Ze-S)/d.height*100}%`,borderColor:f,backgroundColor:`${f}22`}},Ye=(o,s)=>{const r=O(o);return st(s).map(d=>`${d.x/r.width*100},${d.y/r.height*100}`).join(" ")},Xe=o=>{const s=U(o);return{fill:`${s}33`,stroke:s,strokeWidth:"1.4"}},qe=(o,s,r)=>{const d=O(o),f=U(r);return{left:`${s.x/d.width*100}%`,top:`${s.y/d.height*100}%`,backgroundColor:f}},Ge=(o,s)=>{const r=s.coordinates,d=O(o),f=U(s),w=Math.abs(r.width),S=Math.abs(r.height);return{left:`${(r.x-w/2)/d.width*100}%`,top:`${(r.y-S/2)/d.height*100}%`,width:`${w/d.width*100}%`,height:`${S/d.height*100}%`,transform:`rotate(${r.angle||0}deg)`,borderColor:f,backgroundColor:`${f}22`}};return e({jumpTo:ot,setImage:Pe,setAnnotations:Le,getAnnotations:nt,selectTool:p,loadPredictionCandidates:et,applyPredictions:$e,rejectPredictions:De,exportAnnotations:He,getAllAnnotations:()=>{var o,s;return n.batchImages.length>0?n.batchImages:[{imageUrl:((o=n.image)==null?void 0:o.url)||"",annotations:((s=l.value)==null?void 0:s.getAnnotations())||[]}]},getCurrentAnnotation:()=>{var o,s,r;return{imageUrl:((o=n.batchImages[m.value])==null?void 0:o.imageUrl)||((s=n.image)==null?void 0:s.url)||"",annotations:((r=l.value)==null?void 0:r.getAnnotations())||[]}}}),t.watch(()=>{var o;return(o=n.image)==null?void 0:o.url},()=>{var o;n.batchImages.length===0&&((o=n.image)!=null&&o.url)&&D()}),t.watch(()=>n.predictionCandidates,o=>{o&&et(o)},{immediate:!0,deep:!0}),t.watch(()=>n.batchImages.map(o=>`${o.imageUrl}:${o.width||""}x${o.height||""}`),()=>{L()},{immediate:!0}),(o,s)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["annotation-container",y.theme])},[y.batchImages&&y.batchImages.length>0?(t.openBlock(),t.createElementBlock("div",At,[t.createElementVNode("div",It,"批量图片（"+t.toDisplayString(y.batchImages.length)+"）",1),t.createElementVNode("div",St,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(y.batchImages,(r,d)=>(t.openBlock(),t.createElementBlock("button",{key:`${r.imageUrl}-${d}`,class:t.normalizeClass(["image-list-item",{active:d===m.value}]),onClick:f=>ot(d)},[t.createElementVNode("div",Et,[t.createElementVNode("img",{src:r.imageUrl,alt:`第${d+1}张`,class:"image-list-thumb"},null,8,Vt),Je(d)?(t.openBlock(),t.createElementBlock("div",Nt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(Re(d),f=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:f.id},[Fe(f)?(t.openBlock(),t.createElementBlock("div",{key:0,class:"thumb-overlay-rect",style:t.normalizeStyle(je(d,f))},null,4)):Ue(f)?(t.openBlock(),t.createElementBlock("svg",zt,[t.createElementVNode("polygon",{points:Ye(d,f),style:t.normalizeStyle(Xe(f))},null,12,Mt)])):Oe(f)?(t.openBlock(!0),t.createElementBlock(t.Fragment,{key:2},t.renderList(st(f),(w,S)=>(t.openBlock(),t.createElementBlock("div",{key:`${f.id}-${S}`,class:"thumb-overlay-point",style:t.normalizeStyle(qe(d,w,f))},null,4))),128)):We(f)?(t.openBlock(),t.createElementBlock("div",{key:3,class:"thumb-overlay-rotated",style:t.normalizeStyle(Ge(d,f))},null,4)):t.createCommentVNode("",!0)],64))),128))])):t.createCommentVNode("",!0)]),t.createElementVNode("span",Tt,"第 "+t.toDisplayString(d+1)+" 张",1)],10,Bt))),128))])])):t.createCommentVNode("",!0),y.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",$t,[t.createElementVNode("div",{class:t.normalizeClass(["tool-btn",{active:g.value==="pan"}]),onClick:s[0]||(s[0]=r=>p("pan")),title:"拖动"},[t.createVNode(E,{name:"rank"})],2),t.createElementVNode("div",{class:t.normalizeClass(["tool-btn",{active:g.value==="select"}]),onClick:s[1]||(s[1]=r=>p("select")),title:"选择"},[t.createVNode(E,{name:"pointer"})],2),s[5]||(s[5]=t.createElementVNode("div",{class:"divider"},null,-1)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(W.value,r=>(t.openBlock(),t.createElementBlock("div",{key:r,class:t.normalizeClass(["tool-btn",{active:g.value===r}]),onClick:d=>p(r),title:j(r)},[t.createVNode(E,{name:J(r)},null,8,["name"])],10,Dt))),128)),s[6]||(s[6]=t.createElementVNode("div",{class:"divider"},null,-1)),t.createElementVNode("div",{class:"tool-btn",onClick:H,title:"放大"},[t.createVNode(E,{name:"zoom-in"})]),t.createElementVNode("div",{class:"tool-btn",onClick:Q,title:"缩小"},[t.createVNode(E,{name:"zoom-out"})]),s[7]||(s[7]=t.createElementVNode("div",{class:"divider"},null,-1)),$.value?(t.openBlock(),t.createElementBlock("div",{key:0,class:"tool-btn",onClick:v,title:"删除选中"},[t.createVNode(E,{name:"delete"})])):t.createCommentVNode("",!0)])),t.createElementVNode("div",Pt,[y.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",Lt,[t.createElementVNode("div",Ht,[s[8]||(s[8]=t.createElementVNode("span",{class:"label-text"},"当前标签:",-1)),t.createElementVNode("div",Rt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.value,r=>(t.openBlock(),t.createElementBlock("div",{key:r.id,class:t.normalizeClass(["tag-chip",{active:k.value===r.id}]),style:t.normalizeStyle({backgroundColor:r.color,borderColor:r.color}),onClick:d=>R(r)},t.toDisplayString(r.name),15,Ft))),128)),u.value.length===0?(t.openBlock(),t.createElementBlock("div",Ut,"请在右侧创建标签")):t.createCommentVNode("",!0)])])])),t.createElementVNode("div",{class:"canvas-wrapper",ref_key:"canvasWrapper",ref:c,onWheel:s[2]||(s[2]=t.withModifiers(()=>{},["prevent"]))},[t.createElementVNode("canvas",{ref_key:"canvasRef",ref:h},null,512)],544),y.batchImages&&y.batchImages.length>0?(t.openBlock(),t.createElementBlock("div",Ot,[t.createElementVNode("button",{onClick:Me,disabled:m.value<=0},[t.createVNode(E,{name:"back"}),s[9]||(s[9]=t.createTextVNode(" 上一张 ",-1))],8,Wt),t.createElementVNode("span",null,t.toDisplayString(m.value+1)+" / "+t.toDisplayString(y.batchImages.length),1),t.createElementVNode("button",{onClick:Te,disabled:m.value>=y.batchImages.length-1},[s[10]||(s[10]=t.createTextVNode(" 下一张 ",-1)),t.createVNode(E,{name:"right"})],8,Jt)])):t.createCommentVNode("",!0)]),y.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",jt,[t.createElementVNode("div",{class:"sidebar-header"},[s[11]||(s[11]=t.createElementVNode("h3",null,"标签管理",-1)),t.createElementVNode("button",{class:"add-btn",onClick:Se},"添加标签")]),t.createElementVNode("div",Yt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(u.value,r=>(t.openBlock(),t.createElementBlock("div",{key:r.id,class:"label-item"},[t.createElementVNode("div",Xt,[t.createElementVNode("label",{class:"color-wrapper",style:t.normalizeStyle({backgroundColor:r.color})},[t.withDirectives(t.createElementVNode("input",{type:"color","onUpdate:modelValue":d=>r.color=d,onChange:d=>Ve(r),style:{visibility:"hidden",width:"0",height:"0"}},null,40,qt),[[t.vModelText,r.color]])],4),t.createElementVNode("span",{class:"label-name",title:r.name},t.toDisplayString(r.name),9,Gt),t.createElementVNode("span",{class:"action-icon eye",onClick:d=>Ne(r)},[r.visible?(t.openBlock(),t.createBlock(E,{key:0,name:"view"})):(t.openBlock(),t.createBlock(E,{key:1,name:"hide"}))],8,Kt),t.createElementVNode("div",Zt,[s[12]||(s[12]=t.createElementVNode("span",{class:"dots"},"•••",-1)),t.createElementVNode("span",{class:"delete-btn",onClick:d=>ze(r.id),title:"删除"},[t.createVNode(E,{name:"delete"})],8,Qt)])])]))),128))])])),N.value?(t.openBlock(),t.createElementBlock("div",te,[t.createElementVNode("div",ee,[s[15]||(s[15]=t.createElementVNode("h3",null,"新增标签",-1)),t.createElementVNode("div",ne,[s[13]||(s[13]=t.createElementVNode("label",null,"名称",-1)),t.withDirectives(t.createElementVNode("input",{"onUpdate:modelValue":s[3]||(s[3]=r=>_.value.name=r),placeholder:"请输入标签名称",class:"modal-input"},null,512),[[t.vModelText,_.value.name]])]),t.createElementVNode("div",oe,[s[14]||(s[14]=t.createElementVNode("label",null,"颜色",-1)),t.createElementVNode("div",se,[t.withDirectives(t.createElementVNode("input",{type:"color","onUpdate:modelValue":s[4]||(s[4]=r=>_.value.color=r),class:"modal-color-picker"},null,512),[[t.vModelText,_.value.color]]),t.createElementVNode("span",null,t.toDisplayString(_.value.color),1)])]),t.createElementVNode("div",{class:"modal-actions"},[t.createElementVNode("button",{onClick:tt,class:"cancel-btn"},"取消"),t.createElementVNode("button",{onClick:Be,class:"confirm-btn"},"确认")])])])):t.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-ccc538f3"]]),ie={class:"thumbnail-wrapper",ref:"wrapper"},ae=["src","alt"],le=["viewBox","preserveAspectRatio"],re=["x","y","width","height","stroke","stroke-width"],ce=["points","stroke","stroke-width"],he=["x","y","fill","font-size"],de={key:1,class:"loading-placeholder"},ge=F(t.defineComponent({__name:"AnnotationThumbnail",props:{src:{},annotations:{},alt:{},labels:{},fit:{},strokeWidth:{},fontSize:{}},setup(y){const e=y,i=t.ref(null),n=t.ref(!1),a=t.ref(0),h=t.ref(0),c=()=>{i.value&&(a.value=i.value.naturalWidth,h.value=i.value.naturalHeight,n.value=!0)},l=t.computed(()=>e.fit==="contain"?"xMidYMid meet":"xMidYMid slice"),g=t.computed(()=>e.strokeWidth??10),m=t.computed(()=>e.fontSize??30),x=_=>{var C;if((C=_.style)!=null&&C.strokeColor)return _.style.strokeColor;if(e.labels){const b=e.labels.find(V=>V.name===_.label);if(b)return b.color}return"#FF0000"},u=_=>{const C=_.coordinates,b=Math.min(C.x1,C.x2),V=Math.min(C.y1,C.y2),$=Math.abs(C.x1-C.x2),P=Math.abs(C.y1-C.y2);return{x:b,y:V,width:$,height:P}},k=_=>_.coordinates.points.map(b=>`${b.x},${b.y}`).join(" "),N=_=>{if(_.type==="rectangle"){const C=u(_);return{x:C.x,y:C.y-5}}else if(_.type==="polygon"){const C=_.coordinates.points;if(C.length>0)return{x:C[0].x,y:C[0].y-5}}return{x:0,y:0}};return(_,C)=>(t.openBlock(),t.createElementBlock("div",ie,[t.createElementVNode("img",{ref_key:"img",ref:i,src:y.src,class:"thumbnail-image",style:t.normalizeStyle({objectFit:y.fit}),onLoad:c,alt:y.alt},null,44,ae),n.value?(t.openBlock(),t.createElementBlock("svg",{key:0,class:"annotation-overlay",viewBox:`0 0 ${a.value} ${h.value}`,preserveAspectRatio:l.value},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(y.annotations,b=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:b.id},[b.type==="rectangle"?(t.openBlock(),t.createElementBlock("rect",{key:0,x:u(b).x,y:u(b).y,width:u(b).width,height:u(b).height,stroke:x(b),"stroke-width":g.value,fill:"transparent"},null,8,re)):t.createCommentVNode("",!0),b.type==="polygon"?(t.openBlock(),t.createElementBlock("polygon",{key:1,points:k(b),stroke:x(b),"stroke-width":g.value,fill:"transparent"},null,8,ce)):t.createCommentVNode("",!0),b.label?(t.openBlock(),t.createElementBlock("text",{key:2,x:N(b).x,y:N(b).y,fill:x(b),"font-size":m.value,"font-weight":"bold",class:"anno-label"},t.toDisplayString(b.label),9,he)):t.createCommentVNode("",!0)],64))),128))],8,le)):(t.openBlock(),t.createElementBlock("div",de,"Loading..."))],512))}}),[["__scopeId","data-v-d2fd08ec"]]),me={key:0,class:"gallery-view"},fe={class:"gallery-header"},ue={class:"label-summary"},pe=["onClick"],ye={class:"thumbnail-wrapper"},ve={class:"img-meta"},xe={class:"img-index"},be={class:"anno-count"},we={key:0,class:"bottom-bar"},ke={key:1,class:"editor-view"},Ce={class:"editor-header"},_e={class:"header-left"},Ae={class:"editor-title"},Ie={class:"editor-content"},K=F(t.defineComponent({__name:"BatchAnnotator",props:{images:{},labels:{},actionBar:{},clickToEnterEditor:{type:Boolean},thumbStrokeWidth:{},thumbFontSize:{}},emits:["export","update:images","imageClick","update:labels"],setup(y,{expose:e,emit:i}){const n=y,a=i,h=t.ref("gallery"),c=t.ref([]),l=t.ref([]),g=t.ref(0),m=t.ref(null),x=t.ref(null),u=t.ref(null),k=t.computed(()=>{var p,v;return((v=(p=n.actionBar)==null?void 0:p.annotateButton)==null?void 0:v.show)===!0}),N=t.computed(()=>{var p,v;return((v=(p=n.actionBar)==null?void 0:p.exportButton)==null?void 0:v.show)===!0}),_=t.computed(()=>k.value||N.value),C=t.computed(()=>{var p,v;return((v=(p=n.actionBar)==null?void 0:p.annotateButton)==null?void 0:v.text)||"手动标注"}),b=t.computed(()=>{var p,v;return((v=(p=n.actionBar)==null?void 0:p.exportButton)==null?void 0:v.text)||"导出"}),V=t.computed(()=>n.clickToEnterEditor!==!1);t.watch(()=>n.images,p=>{c.value=JSON.parse(JSON.stringify(p))},{immediate:!0,deep:!0}),t.watch(()=>n.labels,p=>{l.value=JSON.parse(JSON.stringify(p||[]))},{immediate:!0,deep:!0});const $=p=>{g.value=p,h.value="editor",u.value&&(u.value.scrollTop=0),t.nextTick(()=>{x.value&&(x.value.scrollTop=0),window.scrollTo(0,0),requestAnimationFrame(()=>{var v,I;(I=(v=m.value)==null?void 0:v.jumpTo)==null||I.call(v,p)})})},P=(p,v)=>{if(V.value){$(p);return}a("imageClick",{index:p,imageId:v.id,image:v})},L=p=>c.value.findIndex(v=>v.id===p);e({openImageById:p=>{const v=L(p);return v<0?!1:($(v),!0)},triggerImageClickById:p=>{const v=L(p);if(v<0)return!1;const I=c.value[v];return I?(a("imageClick",{index:v,imageId:I.id,image:I}),!0):!1},getFinalData:()=>({images:JSON.parse(JSON.stringify(c.value)),labels:JSON.parse(JSON.stringify(l.value))})});const W=()=>{if(m.value&&m.value.getCurrentAnnotation){const p=m.value.getCurrentAnnotation();c.value[g.value]&&(c.value[g.value].annotations=p.annotations)}h.value="gallery"},J=()=>{a("export",c.value)},j=p=>{g.value=p.currentIndex,c.value[p.currentIndex]&&(c.value[p.currentIndex].annotations=p.currentAnnotations)},T=p=>{if(m.value&&m.value.getCurrentAnnotation){const v=m.value.getCurrentAnnotation();c.value[g.value]&&(c.value[g.value].annotations=v.annotations,a("update:images",c.value))}},D=p=>{l.value=JSON.parse(JSON.stringify(p||[])),a("update:labels",l.value)};return(p,v)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"batchRootRef",ref:x,class:"batch-annotator"},[h.value==="gallery"?(t.openBlock(),t.createElementBlock("div",me,[t.createElementVNode("div",fe,[t.createElementVNode("h3",null,"批量查看与标注 ("+t.toDisplayString(c.value.length)+" 张)",1),t.createElementVNode("div",ue,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(l.value,I=>(t.openBlock(),t.createElementBlock("span",{key:I.id,class:"label-badge",style:t.normalizeStyle({backgroundColor:I.color})},t.toDisplayString(I.name),5))),128))])]),t.createElementVNode("div",{ref_key:"galleryGridRef",ref:u,class:"gallery-grid"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(c.value,(I,H)=>(t.openBlock(),t.createElementBlock("div",{key:H,class:"gallery-item",onClick:Q=>P(H,I)},[t.createElementVNode("div",ye,[t.createVNode(ge,{src:I.imageUrl,annotations:I.annotations||[],labels:l.value,fit:"cover",strokeWidth:n.thumbStrokeWidth,fontSize:n.thumbFontSize},null,8,["src","annotations","labels","strokeWidth","fontSize"])]),t.createElementVNode("div",ve,[t.createElementVNode("span",xe,"#"+t.toDisplayString(H+1),1),t.createElementVNode("span",be,t.toDisplayString((I.annotations||[]).length)+" 标注",1)])],8,pe))),128))],512),_.value?(t.openBlock(),t.createElementBlock("div",we,[k.value?(t.openBlock(),t.createElementBlock("button",{key:0,class:"action-btn primary",onClick:v[0]||(v[0]=I=>$(0))},[t.createVNode(E,{name:"edit"}),t.createTextVNode(" "+t.toDisplayString(C.value),1)])):t.createCommentVNode("",!0),N.value?(t.openBlock(),t.createElementBlock("button",{key:1,class:"action-btn success",onClick:J},[t.createVNode(E,{name:"download"}),t.createTextVNode(" "+t.toDisplayString(b.value),1)])):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",ke,[t.createElementVNode("div",Ce,[t.createElementVNode("div",_e,[t.createElementVNode("button",{class:"back-btn",onClick:W},[t.createVNode(E,{name:"back"}),v[1]||(v[1]=t.createTextVNode(" 返回列表 ",-1))]),t.createElementVNode("span",Ae,"正在标注: "+t.toDisplayString(g.value+1)+" / "+t.toDisplayString(c.value.length),1)])]),t.createElementVNode("div",Ie,[t.createVNode(G,{ref_key:"annotatorRef",ref:m,batchImages:c.value,labels:l.value,annotationTypes:["rectangle","polygon","point","rotatedRect"],onBatchChange:j,onAnnotationChange:T,onLabelChange:D},null,8,["batchImages","labels"])])]))],512))}}),[["__scopeId","data-v-0ae1040a"]]);B.BatchAnnotator=K,B.ImageAnnotator=G,B.default=K,Object.defineProperties(B,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(D,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(D=typeof globalThis<"u"?globalThis:D||self,t(D.VueImageAnnotator={},D.Vue))})(this,(function(D,t){"use strict";var Dn=Object.defineProperty;var Tn=(D,t,H)=>t in D?Dn(D,t,{enumerable:!0,configurable:!0,writable:!0,value:H}):D[t]=H;var B=(D,t,H)=>Tn(D,typeof t!="symbol"?t+"":t,H);const H=(w,e)=>Math.sqrt(Math.pow(w.x-e.x,2)+Math.pow(w.y-e.y,2)),ht=(w,e)=>{let i=!1;for(let n=0,c=e.length-1;n<e.length;c=n++){const a=e[n].x,r=e[n].y,g=e[c].x,m=e[c].y;r>w.y!=m>w.y&&w.x<(g-a)*(w.y-r)/(m-r)+a&&(i=!i)}return i},et=(w,e,i)=>{const n=i*(Math.PI/180),c=Math.cos(n),a=Math.sin(n),r=w.x-e.x,g=w.y-e.y;return{x:e.x+(r*c-g*a),y:e.y+(r*a+g*c)}};class dt{constructor(e){B(this,"canvas");B(this,"ctx");B(this,"img");B(this,"annotations",[]);B(this,"currentTool",null);B(this,"interactionMode","none");B(this,"activeAnnotation",null);B(this,"hoverAnnotation",null);B(this,"isDrawing",!1);B(this,"isDragging",!1);B(this,"isPanning",!1);B(this,"panStartPoint",null);B(this,"dragStartPoint",null);B(this,"dragStartAnnotation",null);B(this,"lastMouseMovePoint",null);B(this,"isHoveringStartPoint",!1);B(this,"currentLabelColor","#FF4081");B(this,"visibleLabels",new Set);B(this,"selectedHandleIndex",-1);B(this,"hoverHandleIndex",-1);B(this,"scale",1);B(this,"offset",{x:0,y:0});B(this,"listeners",{});B(this,"imageUrl","");this.canvas=e;const i=e.getContext("2d");if(!i)throw new Error("Could not get 2d context");this.ctx=i,this.img=new Image,this.img.crossOrigin="Anonymous",this.img.onload=()=>{this.fitImageToCanvas(),this.render()},this.bindEvents()}on(e,i){this.listeners[e]||(this.listeners[e]=[]),this.listeners[e].push(i)}emit(e,i){this.listeners[e]&&this.listeners[e].forEach(n=>n(i))}loadImage(e){this.imageUrl=e,this.img.src=e,this.activeAnnotation=null,this.isDrawing=!1}setAnnotations(e){this.annotations=JSON.parse(JSON.stringify(e)),this.render()}getAnnotations(){return this.annotations}setTool(e){e==="pan"?(this.interactionMode="pan",this.currentTool=null,this.isPanning=!1,this.canvas.style.cursor="grab"):e==="select"?(this.interactionMode="select",this.currentTool=null,this.canvas.style.cursor="default"):e?(this.interactionMode="draw",this.currentTool=e,this.canvas.style.cursor="crosshair"):(this.interactionMode="none",this.currentTool=null,this.canvas.style.cursor="default"),this.activeAnnotation=null,this.isDrawing=!1,this.render()}setLabelStyle(e){this.currentLabelColor=e}setVisibleLabels(e){this.visibleLabels=new Set(e),this.render()}zoom(e){const n=e>0?this.scale*1.1:this.scale/1.1;if(n<.1||n>10)return;const c=this.canvas.width/2,a=this.canvas.height/2,r=this.toImageCoords(c,a);this.scale=n,this.offset.x=c-r.x*this.scale,this.offset.y=a-r.y*this.scale,this.clampViewportOffset(),this.render()}resize(){this.fitImageToCanvas(),this.render()}toImageCoords(e,i){return{x:(e-this.offset.x)/this.scale,y:(i-this.offset.y)/this.scale}}toScreenCoords(e,i){return{x:e*this.scale+this.offset.x,y:i*this.scale+this.offset.y}}fitImageToCanvas(){const e=this.canvas.parentElement;if(e){if(this.canvas.width=e.clientWidth,this.canvas.height=e.clientHeight,this.img.width===0)return;const i=this.canvas.width/this.img.width,n=this.canvas.height/this.img.height;this.scale=Math.min(i,n),this.offset.x=(this.canvas.width-this.img.width*this.scale)/2,this.offset.y=(this.canvas.height-this.img.height*this.scale)/2,this.clampViewportOffset()}}clampViewportOffset(){if(this.img.width===0||this.img.height===0)return;const e=this.img.width*this.scale,i=this.img.height*this.scale,n=100;if(e<=this.canvas.width){const c=-e+n,a=this.canvas.width-n;this.offset.x=Math.min(a,Math.max(c,this.offset.x))}else{const c=this.canvas.width-e-n,a=n;this.offset.x=Math.min(a,Math.max(c,this.offset.x))}if(i<=this.canvas.height){const c=-i+n,a=this.canvas.height-n;this.offset.y=Math.min(a,Math.max(c,this.offset.y))}else{const c=this.canvas.height-i-n,a=n;this.offset.y=Math.min(a,Math.max(c,this.offset.y))}}bindEvents(){this.canvas.addEventListener("mousedown",this.handleMouseDown.bind(this)),this.canvas.addEventListener("mousemove",this.handleMouseMove.bind(this)),this.canvas.addEventListener("mouseup",this.handleMouseUp.bind(this)),this.canvas.addEventListener("mouseleave",this.handleMouseUp.bind(this)),window.addEventListener("keydown",this.handleKeyDown.bind(this))}handleKeyDown(e){this.interactionMode==="select"&&(e.key==="Delete"||e.key==="Backspace")&&this.activeAnnotation&&this.deleteAnnotation(this.activeAnnotation.id)}deleteAnnotation(e){const i=this.annotations.findIndex(n=>n.id===e);if(i>-1){const n=this.annotations[i];this.annotations.splice(i,1),this.activeAnnotation=null,this.emit("annotationChange",{action:"delete",changedItem:n,imageUrl:this.imageUrl}),this.render()}}handleMouseDown(e){const i=this.canvas.getBoundingClientRect(),n=e.clientX-i.left,c=e.clientY-i.top,a=this.toImageCoords(n,c);if(this.interactionMode==="pan"){this.isPanning=!0,this.panStartPoint={x:n,y:c},this.canvas.style.cursor="grabbing";return}if(this.interactionMode==="select"&&this.activeAnnotation){const m=this.getHitHandle(n,c,this.activeAnnotation);if(m!==-100){this.isDragging=!0,this.dragStartPoint=a,this.selectedHandleIndex=m,this.dragStartAnnotation=JSON.parse(JSON.stringify(this.activeAnnotation));return}}const r=this.interactionMode==="select"?this.getHitCategory(n,c):null;if(r){this.activeAnnotation=r,this.isDragging=!1,this.selectedHandleIndex=-1,this.emit("annotationChange",{action:"select",changedItem:r,imageUrl:this.imageUrl}),this.render();return}const g=this.getHitAnnotation(a);if(this.interactionMode==="select"){if(g){if(!(this.visibleLabels.size>0&&!this.visibleLabels.has(g.label))){this.activeAnnotation=g,this.isDragging=!0,this.dragStartPoint=a,this.selectedHandleIndex=-1,this.dragStartAnnotation=JSON.parse(JSON.stringify(g)),this.emit("annotationChange",{action:"select",changedItem:g,imageUrl:this.imageUrl}),this.render();return}}else this.activeAnnotation=null,this.emit("annotationChange",{action:"select",changedItem:void 0,imageUrl:this.imageUrl}),this.render();return}if(this.interactionMode==="draw"){if(this.isDrawing&&this.currentTool==="polygon"&&this.activeAnnotation){const m=this.activeAnnotation.coordinates;if(m.points.length>2&&H(a,m.points[0])<20/this.scale){this.finishDrawing();return}this.startDrawing(a);return}if(this.currentTool){if(this.currentTool==="polygon"&&!this.isDrawing){this.startDrawing(a);return}this.startDrawing(a)}return}this.activeAnnotation=null,this.render()}handleMouseMove(e){const i=this.canvas.getBoundingClientRect(),n=e.clientX-i.left,c=e.clientY-i.top,a=this.toImageCoords(n,c);if(this.isPanning&&this.panStartPoint){const r=n-this.panStartPoint.x,g=c-this.panStartPoint.y;this.offset.x+=r,this.offset.y+=g,this.clampViewportOffset(),this.panStartPoint={x:n,y:c},this.render();return}if(this.lastMouseMovePoint=a,this.isDrawing){if(this.currentTool==="polygon"&&this.activeAnnotation){const r=this.activeAnnotation.coordinates;if(r.points.length>2){const g=r.points[0],m=H(a,g);this.isHoveringStartPoint=m<20/this.scale}else this.isHoveringStartPoint=!1}this.updateDrawing(a)}else this.isDragging&&this.activeAnnotation&&this.dragStartPoint?this.updateDragging(a):this.checkHover(n,c,a);this.render()}handleMouseUp(e){if(this.isPanning){this.isPanning=!1,this.panStartPoint=null,this.canvas.style.cursor="grab";return}if(this.isDrawing){if(this.currentTool==="polygon"){this.render();return}this.finishDrawing()}else this.isDragging&&this.activeAnnotation&&this.emit("annotationChange",{action:"update",changedItem:this.activeAnnotation,imageUrl:this.imageUrl});this.currentTool!=="polygon"&&(this.isDrawing=!1),this.isDragging=!1,this.dragStartPoint=null,this.selectedHandleIndex=-1,this.render()}hexToRgba(e,i){if(!e.startsWith("#"))return e;const n=parseInt(e.slice(1,3),16),c=parseInt(e.slice(3,5),16),a=parseInt(e.slice(5,7),16);return`rgba(${n}, ${c}, ${a}, ${i})`}startDrawing(e){if(!this.currentTool)return;const i=Date.now().toString();if(this.hexToRgba(this.currentLabelColor,.2),this.currentLabelColor,this.currentTool==="rectangle")this.isDrawing=!0,this.dragStartPoint=e,this.activeAnnotation={id:i,type:"rectangle",label:"",coordinates:{x1:e.x,y1:e.y,x2:e.x,y2:e.y},style:{strokeColor:this.currentLabelColor}};else if(this.currentTool==="point"){const n={id:i,type:"point",label:"",coordinates:{points:[e]},style:{strokeColor:this.currentLabelColor}};this.annotations.push(n),this.emit("annotationChange",{action:"add",changedItem:n,imageUrl:this.imageUrl}),this.activeAnnotation=n}else if(this.currentTool==="polygon")this.activeAnnotation&&this.activeAnnotation.type==="polygon"&&this.isDrawing?this.activeAnnotation.coordinates.points.push(e):(this.isDrawing=!0,this.activeAnnotation={id:i,type:"polygon",label:"",coordinates:{points:[e]},style:{strokeColor:this.currentLabelColor}});else if(this.currentTool==="category"){const n={id:i,type:"category",label:"",coordinates:{x:e.x,y:e.y},style:{strokeColor:this.currentLabelColor}};this.annotations.push(n),this.emit("annotationChange",{action:"add",changedItem:n,imageUrl:this.imageUrl}),this.activeAnnotation=n}else this.currentTool==="rotatedRect"&&(this.isDrawing=!0,this.dragStartPoint=e,this.activeAnnotation={id:i,type:"rotatedRect",label:"",coordinates:{x:e.x,y:e.y,width:0,height:0,angle:0},style:{strokeColor:this.currentLabelColor}})}updateDrawing(e){if(this.activeAnnotation)if(this.activeAnnotation.type==="rectangle"&&this.dragStartPoint){const i=this.activeAnnotation.coordinates;i.x2=e.x,i.y2=e.y}else if(this.activeAnnotation.type==="rotatedRect"&&this.dragStartPoint){const i=this.activeAnnotation.coordinates,n=Math.abs(e.x-this.dragStartPoint.x),c=Math.abs(e.y-this.dragStartPoint.y);i.width=n*2,i.height=c*2}else this.activeAnnotation.type}finishDrawing(){if(this.activeAnnotation){if(this.activeAnnotation.type==="rectangle"){const e=this.activeAnnotation.coordinates;if(Math.abs(e.x1-e.x2)<2||Math.abs(e.y1-e.y2)<2){this.activeAnnotation=null,this.isDrawing=!1;return}const i=Math.min(e.x1,e.x2),n=Math.max(e.x1,e.x2),c=Math.min(e.y1,e.y2),a=Math.max(e.y1,e.y2);e.x1=i,e.x2=n,e.y1=c,e.y2=a,this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}else if(this.activeAnnotation.type==="polygon"){if(this.activeAnnotation.coordinates.points.length<3){this.activeAnnotation=null,this.isDrawing=!1;return}this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}else if(this.activeAnnotation.type==="rotatedRect"){const e=this.activeAnnotation.coordinates;if(e.width<2||e.height<2){this.activeAnnotation=null,this.isDrawing=!1;return}this.annotations.push(this.activeAnnotation),this.emit("annotationChange",{action:"add",changedItem:this.activeAnnotation,imageUrl:this.imageUrl})}this.activeAnnotation.type}this.isDrawing=!1}updateDragging(e){if(!this.activeAnnotation||!this.dragStartPoint||!this.dragStartAnnotation)return;const i=e.x-this.dragStartPoint.x,n=e.y-this.dragStartPoint.y;this.selectedHandleIndex===-1?this.moveAnnotation(this.activeAnnotation,this.dragStartAnnotation,i,n):this.resizeAnnotation(this.activeAnnotation,this.dragStartAnnotation,this.selectedHandleIndex,e)}moveAnnotation(e,i,n,c){if(e.type==="rectangle"){const a=i.coordinates,r=e.coordinates;r.x1=a.x1+n,r.x2=a.x2+n,r.y1=a.y1+c,r.y2=a.y2+c}else if(e.type==="point"){const a=i.coordinates,r=e.coordinates;r.points=a.points.map(g=>({x:g.x+n,y:g.y+c}))}else if(e.type==="rotatedRect"){const a=i.coordinates,r=e.coordinates;r.x=a.x+n,r.y=a.y+c}else if(e.type==="polygon"){const a=i.coordinates,r=e.coordinates;r.points=a.points.map(g=>({x:g.x+n,y:g.y+c}))}else if(e.type==="category"){const a=i.coordinates,r=e.coordinates;a&&r&&(r.x=a.x+n,r.y=a.y+c)}}resizeAnnotation(e,i,n,c){if(e.type==="rectangle"){const a=e.coordinates;n===0&&(a.x1=c.x,a.y1=c.y),n===1&&(a.x2=c.x,a.y1=c.y),n===2&&(a.x2=c.x,a.y2=c.y),n===3&&(a.x1=c.x,a.y2=c.y)}else if(e.type==="polygon"){const a=e.coordinates;n>=0&&n<a.points.length&&(a.points[n]=c)}else if(e.type==="point"){const a=e.coordinates;n>=0&&n<a.points.length&&(a.points[n]=c)}else if(e.type==="rotatedRect"){const a=e.coordinates;if(n===-2){const r=a.x,g=a.y,m=c.x-r,h=c.y-g;let k=Math.atan2(h,m)*180/Math.PI;k+=90,a.angle=k}else{const r=a.angle*Math.PI/180,g=Math.cos(-r),m=Math.sin(-r),h=c.x-a.x,k=c.y-a.y,u=h*g-k*m,S=h*m+k*g;(n===0||n===3)&&(a.width/2,a.width=Math.abs(u)*2),(n===1||n===2)&&(a.width=Math.abs(u)*2),(n===0||n===1)&&(a.height=Math.abs(S)*2),(n===2||n===3)&&(a.height=Math.abs(S)*2)}}}getHitAnnotation(e){for(let i=this.annotations.length-1;i>=0;i--){const n=this.annotations[i];if(this.isPointInAnnotation(e,n))return n}return null}isPointInAnnotation(e,i){if(i.type==="rectangle"){const n=i.coordinates;return e.x>=n.x1&&e.x<=n.x2&&e.y>=n.y1&&e.y<=n.y2}else if(i.type==="polygon"){const n=i.coordinates;return ht(e,n.points)}else if(i.type==="rotatedRect"){const n=i.coordinates,c=et(e,{x:n.x,y:n.y},-n.angle),a=n.width/2,r=n.height/2;return c.x>=n.x-a&&c.x<=n.x+a&&c.y>=n.y-r&&c.y<=n.y+r}else if(i.type==="point")return i.coordinates.points.some(c=>H(e,c)<10/this.scale);return!1}getHitHandle(e,i,n){const c=this.getAnnotationHandles(n),a=6;for(let r=0;r<c.length;r++){const g=c[r],m=this.toScreenCoords(g.x,g.y);if(Math.abs(e-m.x)<a&&Math.abs(i-m.y)<a)return n.type==="rotatedRect"&&r===4?-2:r}return-100}getAnnotationHandles(e){if(e.type==="rectangle"){const i=e.coordinates;return[{x:i.x1,y:i.y1},{x:i.x2,y:i.y1},{x:i.x2,y:i.y2},{x:i.x1,y:i.y2}]}else{if(e.type==="polygon")return e.coordinates.points;if(e.type==="point")return e.coordinates.points;if(e.type==="rotatedRect"){const i=e.coordinates,n={x:i.x,y:i.y},c=i.width/2,a=i.height/2,r={x:i.x-c,y:i.y-a},g={x:i.x+c,y:i.y-a},m={x:i.x+c,y:i.y+a},h={x:i.x-c,y:i.y+a},k={x:i.x,y:i.y-a-20/this.scale};return[r,g,m,h,k].map(u=>et(u,n,i.angle))}}return[]}checkHover(e,i,n){const c=this.getHitCategory(e,i);if(c){this.canvas.style.cursor="pointer",this.hoverAnnotation=c;return}if(this.activeAnnotation&&this.getHitHandle(e,i,this.activeAnnotation)!==-100){this.canvas.style.cursor="pointer";return}const a=this.getHitAnnotation(n);a?(this.canvas.style.cursor="move",this.hoverAnnotation=a):(this.canvas.style.cursor="default",this.hoverAnnotation=null)}render(){this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height),this.img.complete&&this.img.width>0&&this.ctx.drawImage(this.img,this.offset.x,this.offset.y,this.img.width*this.scale,this.img.height*this.scale),this.annotations.forEach(e=>{e!==this.activeAnnotation&&this.drawItem(e,!1)}),this.activeAnnotation&&this.drawItem(this.activeAnnotation,!0),this.renderCategories()}renderCategories(){const e=this.annotations.filter(n=>n.type==="category");if(e.length===0)return;this.ctx.save(),this.ctx.font="14px sans-serif",this.ctx.textBaseline="middle",this.ctx.textAlign="center";const i=12;e.forEach(n=>{var b;const c=n.label||"未命名分类",a=this.ctx.measureText(c).width+i*2,r=28,g=this.activeAnnotation===n,m=this.hoverAnnotation===n;let h={x:20,y:20};n.coordinates&&typeof n.coordinates.x=="number"&&typeof n.coordinates.y=="number"&&(h=this.toScreenCoords(n.coordinates.x,n.coordinates.y));const k=h.x-a/2,u=h.y-r/2,S=((b=n.style)==null?void 0:b.strokeColor)||"#2196F3";this.ctx.fillStyle=g?S:this.hexToRgba(S,.85),m&&!g&&(this.ctx.fillStyle=S),g?(this.ctx.strokeStyle="#ffffff",this.ctx.lineWidth=2):(this.ctx.strokeStyle="transparent",this.ctx.lineWidth=0),this.ctx.beginPath(),this.ctx.roundRect(k,u,a,r,6),this.ctx.fill(),g&&(this.ctx.stroke(),this.ctx.save(),this.ctx.strokeStyle=S,this.ctx.lineWidth=2,this.ctx.strokeRect(k-3,u-3,a+6,r+6),this.ctx.restore()),this.ctx.fillStyle="#ffffff",this.ctx.fillText(c,h.x,h.y)}),this.ctx.restore()}getHitCategory(e,i){const n=this.annotations.filter(g=>g.type==="category");if(n.length===0)return null;this.ctx.save(),this.ctx.font="14px sans-serif";const c=12,a=28;let r=null;for(let g=n.length-1;g>=0;g--){const m=n[g],h=m.label||"未命名分类",k=this.ctx.measureText(h).width+c*2;let u={x:20,y:20};m.coordinates&&typeof m.coordinates.x=="number"&&typeof m.coordinates.y=="number"&&(u=this.toScreenCoords(m.coordinates.x,m.coordinates.y));const S=u.x-k/2,b=u.y-a/2;if(e>=S&&e<=S+k&&i>=b&&i<=b+a){r=m;break}}return this.ctx.restore(),r}drawItem(e,i){var a;if(this.visibleLabels.size>0&&!this.visibleLabels.has(e.label)&&!i)return;this.ctx.save();const n=((a=e.style)==null?void 0:a.strokeColor)||"#FF4081",c=i?"#00E5FF":n;if(this.ctx.strokeStyle=c,this.ctx.lineWidth=2,e.type==="rectangle"){const r=e.coordinates,g=this.toScreenCoords(r.x1,r.y1),m=this.toScreenCoords(r.x2,r.y2),h=Math.min(g.x,m.x),k=Math.min(g.y,m.y),u=Math.abs(g.x-m.x),S=Math.abs(g.y-m.y);this.ctx.strokeRect(h,k,u,S),i&&this.drawHandles(this.getAnnotationHandles(e))}else if(e.type==="polygon"){const r=e.coordinates;if(r.points.length===0){this.ctx.restore();return}this.ctx.beginPath();const g=this.toScreenCoords(r.points[0].x,r.points[0].y);this.ctx.moveTo(g.x,g.y);for(let m=1;m<r.points.length;m++){const h=this.toScreenCoords(r.points[m].x,r.points[m].y);this.ctx.lineTo(h.x,h.y)}if(!this.isDrawing||e!==this.activeAnnotation)this.ctx.closePath();else if(this.lastMouseMovePoint){let m=this.lastMouseMovePoint;if(this.isHoveringStartPoint&&r.points.length>0){m=r.points[0];const k=this.toScreenCoords(r.points[0].x,r.points[0].y);this.ctx.save(),this.ctx.beginPath(),this.ctx.arc(k.x,k.y,10,0,Math.PI*2),this.ctx.fillStyle="rgba(255, 215, 0, 0.6)",this.ctx.strokeStyle="#FFFFFF",this.ctx.lineWidth=2,this.ctx.fill(),this.ctx.stroke(),this.ctx.restore()}const h=this.toScreenCoords(m.x,m.y);this.ctx.lineTo(h.x,h.y)}this.ctx.stroke(),i&&this.drawHandles(this.getAnnotationHandles(e))}else if(e.type==="rotatedRect"){const r=e.coordinates;this.ctx.translate(this.toScreenCoords(r.x,r.y).x,this.toScreenCoords(r.x,r.y).y),this.ctx.rotate(r.angle*Math.PI/180);const g=r.width*this.scale,m=r.height*this.scale;this.ctx.strokeRect(-g/2,-m/2,g,m),this.ctx.rotate(-r.angle*Math.PI/180),this.ctx.translate(-this.toScreenCoords(r.x,r.y).x,-this.toScreenCoords(r.x,r.y).y),i&&this.drawHandles(this.getAnnotationHandles(e))}else e.type==="point"&&e.coordinates.points.forEach(g=>{const m=this.toScreenCoords(g.x,g.y);this.ctx.beginPath(),this.ctx.arc(m.x,m.y,5,0,Math.PI*2),this.ctx.fillStyle=i?"#00E5FF":n,this.ctx.fill(),this.ctx.stroke()});this.ctx.restore()}drawHandles(e){this.ctx.fillStyle="#FFFFFF",this.ctx.strokeStyle="#000000",this.ctx.lineWidth=1,e.forEach(i=>{const n=this.toScreenCoords(i.x,i.y);this.ctx.fillRect(n.x-4,n.y-4,8,8),this.ctx.strokeRect(n.x-4,n.y-4,8,8)})}}const gt='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032114659" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="21132" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 391.68c-66.56 0-120.32 54.187-120.32 120.32 0 66.56 53.76 120.32 120.32 120.32 66.133 0 120.32-53.76 120.32-120.32A120.747 120.747 0 0 0 512 391.68z" p-id="21133" fill="#515151"></path><path d="M512 113.493c-219.733 0-398.507 178.774-398.507 398.507S292.267 910.507 512 910.507 910.507 731.733 910.507 512 731.733 113.493 512 113.493z m0 720.214c-177.493 0-321.707-144.214-321.707-321.707S334.507 190.293 512 190.293 833.707 334.507 833.707 512 689.493 833.707 512 833.707z" p-id="21134" fill="#515151"></path></svg>',mt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M15.7 4.3c.4.4.4 1 0 1.4L9.4 12l6.3 6.3c.4.4.4 1 0 1.4-.4.4-1 .4-1.4 0l-7-7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0z"/></svg>',ft='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032015085" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16560" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M911.872 972.629333l-2.645333-1.621333-209.92-208.554667-91.306667 193.194667-147.029333-494.933333 486.4 179.968-177.834667 68.266666 201.472 200.362667a9.898667 9.898667 0 0 1 2.133333 4.608 10.069333 10.069333 0 0 1-1.024 4.778667l-2.389333 3.157333-47.786667 47.530667a9.813333 9.813333 0 0 1-4.522666 2.901333 12.544 12.544 0 0 1-2.56 0z m-657.066667-12.970666L0.256 501.248l97.109333-175.445333 64.256-115.456L254.805333 42.581333h510.208l259.328 466.858667h-100.608L714.325333 132.778667H305.322667l-204.8 368.384 204.8 368.725333H418.133333v90.026667z" fill="#515151" p-id="16561"></path></svg>',pt='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032973956" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6763" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M613.6 960H97.2c-17.7 0-32-14.3-32-32V98.5c0-17.7 14.3-32 32-32h829.5c17.7 0 32 14.3 32 32v518.2c0 17.7-14.3 32-32 32s-32-14.3-32-32V130.5H129.2V896h484.4c17.7 0 32 14.3 32 32s-14.3 32-32 32z" fill="#515151" p-id="6764"></path><path d="M711.3 694.9l120.3 46.9-100.7 80.7z" fill="#515151" p-id="6765"></path><path d="M707.6 882.1L671.3 645l223.6 87.1-187.3 150z m43.7-137.3l2.8 18 14.2-11.4-17-6.6z" fill="#515151" p-id="6766"></path><path d="M927 957.9c-8.2 0-16.4-3.1-22.6-9.4L723.2 767.2c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l181.2 181.2c12.5 12.5 12.5 32.8 0 45.3-6.3 6.3-14.5 9.5-22.7 9.5z" fill="#515151" p-id="6767"></path></svg>',yt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M19 6h-4V5c0-1.1-.9-2-2-2h-2c-1.1 0-2 .9-2 2v1H5c-.6 0-1 .4-1 1s.4 1 1 1h14c.6 0 1-.4 1-1s-.4-1-1-1zM10 5h4v1h-4V5z"/><path fill="currentColor" d="M6 9v10c0 1.7 1.3 3 3 3h6c1.7 0 3-1.3 3-3V9H6zm4 9c0 .6-.4 1-1 1s-1-.4-1-1v-5c0-.6.4-1 1-1s1 .4 1 1v5zm4 0c0 .6-.4 1-1 1s-1-.4-1-1v-5c0-.6.4-1 1-1s1 .4 1 1v5z"/></svg>',ut='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M19 15v4c0 1.1-.9 2-2 2H7c-1.1 0-2-.9-2-2v-4c0-.6.4-1 1-1s1 .4 1 1v4h10v-4c0-.6.4-1 1-1s1 .4 1 1zm-7.7 1.3c.2.2.4.3.7.3s.5-.1.7-.3l4.6-4.6c.4-.4.4-1 0-1.4-.4-.4-1-.4-1.4 0l-2.9 2.9V3c0-.6-.4-1-1-1s-1 .4-1 1v8.3l-2.9-2.9c-.4-.4-1-.4-1.4 0-.4.4-.4 1 0 1.4l4.6 4.6z"/></svg>',vt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M3 17.2v4.3c0 .3.2.5.5.5h4.3c.1 0 .3-.1.4-.2l11.1-11.1-5.1-5.1L3.1 16.8c-.1.1-.1.3-.1.4zm18.8-10.9c.4-.4.4-1 0-1.4l-3.7-3.7c-.4-.4-1-.4-1.4 0l-2.3 2.3 5.1 5.1 2.3-2.3z"/></svg>',wt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M18.7 4.3c.4.4.4 1 0 1.4L12.4 12l6.3 6.3c.4.4.4 1 0 1.4-.4.4-1 .4-1.4 0l-7-7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0z"/><path fill="currentColor" d="M10.7 4.3c.4.4.4 1 0 1.4L4.4 12l6.3 6.3c.4.4.4 1 0 1.4-.4.4-1 .4-1.4 0l-7-7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0z"/></svg>',xt='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032412624" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3527" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M870.2976 144.0256l51.2 51.2-122.88 122.88a514.304 514.304 0 0 1 170.7264 193.8688C885.0432 679.04 711.8848 793.6 512 793.6c-56.832 0-111.488-9.2672-162.56-26.3424L197.4016 919.296l-51.2-51.2L870.2976 144.0256z m-127.1552 229.5296l-76.6208 76.6208a166.4 166.4 0 0 1-216.32 216.3712l-38.6048 38.5792c29.5168 6.9632 60.032 10.9312 91.1872 11.5712L512 716.8c150.6816 0 287.488-77.2096 366.464-200.3456l2.816-4.48-2.816-4.48a435.8144 435.8144 0 0 0-135.3216-133.9392zM512 230.4c49.664 0 97.664 7.0656 143.0528 20.2496l-63.8208 63.7696a436.4032 436.4032 0 0 0-70.016-7.1168L512 307.2a434.8928 434.8928 0 0 0-366.464 200.3456l-2.816 4.48 2.816 4.48a435.84 435.84 0 0 0 119.8848 123.776l-55.0912 55.04a514.2528 514.2528 0 0 1-155.648-183.296C138.9312 344.96 312.0896 230.4 512 230.4z m89.5488 284.8l-86.3744 86.2976 1.7408-0.0256a89.6 89.6 0 0 0 84.6336-86.272zM512 345.6a166.656 166.656 0 0 1 42.5728 5.504l-79.0272 79.0272a89.9328 89.9328 0 0 0-45.4144 45.4144l-79.0272 79.0272A166.4 166.4 0 0 1 512 345.6z" p-id="3528" fill="#515151"></path></svg>',bt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M5.3 19.7c-.4-.4-.4-1 0-1.4l6.3-6.3-6.3-6.3c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l7 7c.4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0z"/><path fill="currentColor" d="M13.3 19.7c-.4-.4-.4-1 0-1.4l6.3-6.3-6.3-6.3c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l7 7c.4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0z"/></svg>',kt='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775031871732" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12257" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M174.63 78.98c0.03-12.61 16.41-19.91 25.81-11.5l328.72 293.98 318.27 284.63c10.51 9.4 0.4 26.75-14.25 24.46L435.7 608.43c-6.23-0.97-12.72 1.92-16.16 7.2L199.96 952.72c-8.09 12.42-27.76 8.34-27.72-5.76l1.17-426.97 1.22-441.01z" fill="#515151" p-id="12258"></path></svg>',Ct='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032210611" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="23146" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M543.487882 0.00128a161.919393 161.919393 0 0 0-114.55957 47.359822L47.553742 428.991671a162.111392 162.111392 0 0 0 0 229.119141l318.270806 318.398806a161.983393 161.983393 0 0 0 229.119141 0l381.630569-381.694569A162.111392 162.111392 0 0 0 1023.99808 480.255479V161.920673A161.919393 161.919393 0 0 0 861.886688 0.00128H543.487882z m0 90.55966l318.462806 0.064a71.295733 71.295733 0 0 1 71.487732 71.295733v318.270806c0 18.943929-7.615971 37.119861-21.055921 50.559811l-381.56657 381.758568a71.423732 71.423732 0 0 1-101.055621 0L111.489502 594.111052a71.487732 71.487732 0 0 1 0-101.119621l381.566569-381.566569c13.37595-13.37595 31.551882-20.863922 50.431811-20.863922z m112.447578 124.159535a153.023426 153.023426 0 1 0 0 306.046852 153.023426 153.023426 0 0 0 0-306.046852z m57.727784 129.151515a62.463766 62.463766 0 1 1-115.455567 47.807821 62.463766 62.463766 0 0 1 115.455567-47.807821z" p-id="23147" fill="#515151"></path></svg>',_t='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775096284335" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4580" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M308.377435 102.251961C318.982967 47.176334 372.449479 0 448.66303 0c39.496466 0 68.314257 20.040799 85.063685 46.07921 11.995223 18.577967 17.919693 39.935315 20.040799 60.341823 13.384913-4.388496 27.35496-6.582744 41.398147-6.655886 38.911333 0 68.021691 19.455666 85.72196 44.616378 16.822569 23.990446 23.551596 53.100804 23.551596 79.724347v29.988058c0.146283 98.960589 0.292566 197.921178 0.658274 296.954909-0.073142 13.165489 1.097124 26.47726 3.510797 39.569608 8.484426-7.533585 16.237436-15.213453 24.795004-23.69788l13.165488-13.019205c13.970046-13.604338 30.353765-28.598367 49.809432-41.178723 42.056422-27.208676 93.694394-39.642749 162.813209-22.600755 27.574384 6.802169 44.982086 25.380136 54.344211 44.543236 8.776992 18.285401 11.117524 38.545625 10.386108 56.392176-1.38969 33.864562-14.920887 75.26271-43.738679 101.447404l-1.755398 1.755398c-37.375359 36.424518-75.335851 72.263904-113.881477 107.518157-31.450889 28.964075-63.486912 57.050451-96.327491 84.478552-29.037217 24.063587-58.293858 46.51806-80.967755 58.952132A491.511574 491.511574 0 0 1 421.527495 1023.982446a45.567219 45.567219 0 0 1-46.810626-44.25067c0-24.795004 20.699074-44.835803 46.225493-44.762661a395.403507 395.403507 0 0 0 215.036314-64.072045 49.955715 49.955715 0 0 1 4.022788-2.340531c13.458055-7.167877 37.009651-24.502437 67.363417-49.590007 31.597173-26.47726 62.609212-53.612795 92.889836-81.552888a5027.973235 5027.973235 0 0 0 111.687228-105.470192l1.755399-1.755398 0.585133-0.511991 1.682257-1.535974a42.056422 42.056422 0 0 0 9.362125-15.140312c3.291372-8.118718 5.119912-16.749427 5.631903-25.453278a46.07921 46.07921 0 0 0-1.023982-12.580356c-39.715891-8.557568-62.536071-0.658274-81.479746 11.556374a234.126272 234.126272 0 0 0-35.473678 29.841774l-10.386108 10.239824c-9.800975 9.654692-20.845357 20.699074-31.96288 30.500049l-0.146283 0.146283c-19.016817 16.603144-42.787838 31.597173-70.435364 32.182306a74.897002 74.897002 0 0 1-65.096027-35.54682 141.602144 141.602144 0 0 1-18.870534-51.930538 302.074822 302.074822 0 0 1-4.169071-50.613989c-0.365708-99.033731-0.511991-198.213745-0.511992-297.247476v-29.988058c0-13.311772-3.65708-24.136729-7.826151-30.13434a13.896905 13.896905 0 0 0-4.388496-4.388496 7.679868 7.679868 0 0 0-4.022789-0.804558 46.956909 46.956909 0 0 0-28.232658 10.532391 30.719473 30.719473 0 0 0-12.214648 24.721862v232.736582a45.567219 45.567219 0 0 1-46.591201 44.543236 45.567219 45.567219 0 0 1-46.51806-44.616378V124.340726c0-14.628321-3.364514-25.745844-7.094736-31.45089a10.093541 10.093541 0 0 0-2.925664-3.364514 1.901682 1.901682 0 0 0-0.511991-0.292566 9.435267 9.435267 0 0 0-2.340531-0.146283c-38.618767 0-49.443724 23.697879-49.078016 33.791421v1.682256l-0.292567 77.822666v3.876505l-1.023982 253.508797a45.567219 45.567219 0 0 1-46.810626 44.323812 45.567219 45.567219 0 0 1-46.298635-44.68952l1.023983-250.656274a32.036022 32.036022 0 0 0-7.75301-15.140312c-1.82854-1.682257-5.851328-4.827346-17.188277-4.827346a41.178723 41.178723 0 0 0-26.477261 9.069559c-5.558762 4.754204-10.678674 12.580356-10.678674 26.257835v296.589202a45.567219 45.567219 0 0 1-46.518059 44.543236 45.567219 45.567219 0 0 1-46.51806-44.616378v-169.688519a31.158323 31.158323 0 0 0-4.607921-5.705045 11.84894 11.84894 0 0 0-5.193054-3.218231c-1.023982-0.292566-4.681063-1.023982-12.653497 1.462832-17.700268 5.705045-26.111552 14.994029-30.792615 27.208676-5.48562 14.189471-6.582744 35.10797-1.097124 61.438947 42.202705 201.139409 64.949744 301.123981 83.162003 350.34828 16.091153 43.372971 47.615184 81.918596 90.915013 109.566122a43.372971 43.372971 0 0 1 12.872922 61.804654 47.834609 47.834609 0 0 1-64.510894 12.28779c-59.171557-37.741067-103.934218-91.500146-127.046965-153.963075C71.179216 755.406479 46.896203 647.449472 5.571197 449.601435-1.889246 414.127758-3.059512 375.216425 10.471685 340.108455 24.734297 302.806238 54.210364 273.330171 99.265591 258.921276c16.603144-5.558762 34.376554-7.460444 51.784255-5.631904v-29.256641c0-81.18718 67.655983-124.340726 130.265196-124.340726 9.435267 0 18.431684 0.877699 27.062393 2.486815z" p-id="4581" fill="#515151"></path></svg>',Et='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775033156525" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3463" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M694.4 960H195.2C131.7 960 80 908.4 80 845.1V462c0-63.4 51.7-114.9 115.2-114.9h499.2c63.5 0 115.2 51.6 115.2 114.9v383.1c0 63.3-51.7 114.9-115.2 114.9zM195.2 423.7c-21.2 0-38.4 17.2-38.4 38.3v383.1c0 21.1 17.2 38.3 38.4 38.3h499.2c21.2 0 38.4-17.2 38.4-38.3V462c0-21.1-17.2-38.3-38.4-38.3H195.2z" fill="#515151" p-id="3464"></path><path d="M905.6 450.3c-14.8 0-28.9-8.6-35.2-23C788.6 240.8 592.7 213 483.2 213c-21.2 0-38.4-17.2-38.4-38.3s17.2-38.3 38.4-38.3c218.2 0 385 94.9 457.6 260.3 8.5 19.4-0.4 42-19.8 50.5-5 2.1-10.3 3.1-15.4 3.1z" fill="#515151" p-id="3465"></path><path d="M473.6 285.4c-9.8 0-19.7-3.7-27.2-11.2l-72.5-72.4c-15-15-15-39.2 0-54.2l72.5-72.4c15-15 39.3-15 54.3 0s15 39.2 0 54.2l-45.4 45.3 45.4 45.3c15 15 15 39.2 0 54.2-7.4 7.4-17.3 11.2-27.1 11.2z" fill="#515151" p-id="3466"></path></svg>',Bt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="currentColor" d="M8.3 19.7c-.4-.4-.4-1 0-1.4l6.3-6.3-6.3-6.3c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l7 7c.4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0z"/></svg>',St='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032400373" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3314" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 230.4c199.8848 0 373.0176 114.5344 457.344 281.5744C885.0432 679.04 711.8848 793.6 512 793.6c-199.8848 0-373.0176-114.5344-457.344-281.5744C138.9568 344.96 312.1152 230.4 512 230.4z m0 76.8a434.8928 434.8928 0 0 0-366.464 200.3456l-2.816 4.48 2.816 4.48a434.944 434.944 0 0 0 357.248 200.192L512 716.8c150.6816 0 287.488-77.2096 366.464-200.3456l2.816-4.48-2.816-4.48a434.944 434.944 0 0 0-357.248-200.192L512 307.2z m0 38.4a166.4 166.4 0 1 1 0 332.8 166.4 166.4 0 0 1 0-332.8z m0 76.8a89.6 89.6 0 1 0 0 179.2 89.6 89.6 0 0 0 0-179.2z" p-id="3315" fill="#515151"></path></svg>',It='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032548251" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4695" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M849.7664 778.1376c1.9968 1.4848 3.84 3.072 5.632 4.864l72.3968 72.3968a51.2 51.2 0 1 1-72.3968 72.3968l-72.3968-72.3968a51.6096 51.6096 0 0 1-4.864-5.632 448 448 0 1 1 71.68-71.68zM460.8 460.8V358.4a51.2 51.2 0 1 1 102.4 0v102.4h102.4a51.2 51.2 0 0 1 0 102.4h-102.4v102.4a51.2 51.2 0 0 1-102.4 0v-102.4H358.4a51.2 51.2 0 0 1 0-102.4h102.4z m38.4 384a345.6 345.6 0 1 0 0-691.2 345.6 345.6 0 0 0 0 691.2z" fill="#515151" p-id="4696"></path></svg>',Vt='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1775032629657" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1933" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M849.7664 778.1376c1.9968 1.4848 3.84 3.072 5.632 4.864l72.3968 72.3968a51.2 51.2 0 1 1-72.3968 72.3968l-72.3968-72.3968a51.6096 51.6096 0 0 1-4.864-5.632 448 448 0 1 1 71.68-71.68zM499.2 844.8a345.6 345.6 0 1 0 0-691.2 345.6 345.6 0 0 0 0 691.2zM358.4 563.2a51.2 51.2 0 0 1 0-102.4h307.2a51.2 51.2 0 0 1 0 102.4H358.4z" fill="#666666" p-id="1934"></path></svg>',At=["innerHTML"],Nt=t.defineComponent({__name:"SvgIcon",props:{name:{},size:{}},setup(w){const e=w,i=t.ref(""),n=Object.assign({"../assets/svg/aim.svg":gt,"../assets/svg/back.svg":mt,"../assets/svg/connection.svg":ft,"../assets/svg/crop.svg":pt,"../assets/svg/delete.svg":yt,"../assets/svg/download.svg":ut,"../assets/svg/edit.svg":vt,"../assets/svg/first.svg":wt,"../assets/svg/hide.svg":xt,"../assets/svg/last.svg":bt,"../assets/svg/pointer.svg":kt,"../assets/svg/price-tag.svg":Ct,"../assets/svg/rank.svg":_t,"../assets/svg/refresh-right.svg":Et,"../assets/svg/right.svg":Bt,"../assets/svg/view.svg":St,"../assets/svg/zoom-in.svg":It,"../assets/svg/zoom-out.svg":Vt});return t.watchEffect(()=>{const c=`../assets/svg/${e.name}.svg`,a=n[c];a?i.value=a:(console.warn(`Icon ${e.name} not found at path ${c}`),i.value="")}),(c,a)=>(t.openBlock(),t.createElementBlock("i",{class:t.normalizeClass(["svg-icon",[w.size?`size-${w.size}`:""]]),innerHTML:i.value},null,10,At))}}),J=(w,e)=>{const i=w.__vccOpts||w;for(const[n,c]of e)i[n]=c;return i},V=J(Nt,[["__scopeId","data-v-3928607b"]]),Dt={key:0,class:"image-list-sidebar"},Tt={class:"image-list-header"},Mt=["onClick"],zt={class:"image-list-stage"},Pt=["src","alt"],Lt={key:0,class:"thumb-overlay-layer"},$t={key:1,class:"thumb-overlay-svg",viewBox:"0 0 100 100",preserveAspectRatio:"none"},Rt=["points"],Ht={class:"image-list-text"},Ut={class:"center-sidebar"},Ft={key:0,class:"left-sidebar"},Ot=["onClick","title"],Wt={key:0,class:"divider"},Gt={class:"center-area"},Yt={key:0,class:"floating-label-selector"},Jt={key:0,class:"current-label"},jt={class:"label-name"},Xt={key:1,class:"current-label empty"},qt={key:0,class:"selector-dropdown"},Kt={key:0,class:"dropdown-empty"},Zt=["onClick"],Qt={class:"label-name"},te={key:0,class:"batch-nav"},ee=["disabled"],ne=["disabled"],oe=["disabled"],se=["disabled"],ie={key:1,class:"right-sidebar"},ae={class:"label-list"},le={class:"label-row"},ce=["onUpdate:modelValue","onChange"],re=["title"],he=["onClick"],de={class:"action-icon more-actions"},ge=["onClick"],me={class:"modal-content"},fe={class:"modal-body"},pe={class:"form-group"},ye={class:"form-group"},ue={class:"color-input-wrapper"},ve={class:"color-value"},we={class:"modal-actions"},xe=["disabled"],nt=J(t.defineComponent({__name:"ImageAnnotator",props:{annotationTypes:{default:()=>["rectangle","polygon","point","rotatedRect","category"]},batchImages:{default:()=>[]},labels:{default:()=>[]},defaultActiveType:{},theme:{default:"light"},readOnly:{type:Boolean,default:!1},image:{},predictionCandidates:{},session:{},requestId:{},minZoom:{},maxZoom:{}},emits:["annotationChange","batchChange","labelChange","ready","error","tool:change","viewport:change","annotation:add","annotation:update","annotation:delete","annotation:select","prediction:loaded","prediction:apply","prediction:reject"],setup(w,{expose:e,emit:i}){const n=w,c=i,a=t.ref(null),r=t.ref(null),g=t.ref(null),m=t.ref([]),h=t.ref(null),k=t.ref(null),u=t.ref(0),S=t.ref(""),b=t.ref([]),A=t.ref(""),U=t.ref(!1),x=t.ref({name:"",color:"#FF0000"}),E=t.ref("none"),p=t.ref([]),N=t.ref({}),M=t.computed(()=>k.value==="select"&&!!S.value),L=t.ref(!1),F=t.computed(()=>b.value.find(o=>o.id===A.value)),st=o=>{o.stopPropagation(),L.value=!L.value},it=o=>{W(o),L.value=!1};t.onMounted(()=>{document.addEventListener("click",o=>{o.target.closest(".floating-label-selector")||(L.value=!1)})});const j=o=>{if(!o||N.value[o])return;const s=new Image;s.onload=()=>{const l=s.naturalWidth||1,d=s.naturalHeight||1;N.value={...N.value,[o]:{width:l,height:d}}},s.src=o},X=()=>{n.batchImages.forEach(o=>{j(o.imageUrl)})},K=(o,s)=>{m.value[s]=o},O=(o=u.value)=>{const s=g.value,l=m.value[o];if(!s||!l)return;const d=s.scrollTop,f=d+s.clientHeight,_=l.offsetTop,I=_+l.offsetHeight;if(_<d){s.scrollTo({top:Math.max(_-8,0),behavior:"smooth"});return}I>f&&s.scrollTo({top:I-s.clientHeight+8,behavior:"smooth"})},R=()=>{var l,d,f,_;const o=n.batchImages[u.value],s=(o==null?void 0:o.imageUrl)||((l=n.image)==null?void 0:l.url);return{eventId:`${Date.now()}-${Math.random().toString(36).slice(2,10)}`,timestamp:Date.now(),requestId:n.requestId,taskId:(d=n.session)==null?void 0:d.taskId,imageId:((f=n.image)==null?void 0:f.id)||s,operator:(_=n.session)==null?void 0:_.userId}},y=o=>{var d;const s=o==null?void 0:o.action;if(!s)return;const l={meta:R(),action:s,current:o==null?void 0:o.changedItem,source:(d=o==null?void 0:o.changedItem)!=null&&d.predictionId?"prediction":"manual"};s==="add"&&c("annotation:add",l),s==="update"&&c("annotation:update",l),s==="delete"&&c("annotation:delete",l),s==="select"&&c("annotation:select",l)},v=t.computed(()=>n.annotationTypes),C=o=>({rectangle:"crop",polygon:"connection",point:"aim",rotatedRect:"refresh-right",category:"price-tag"})[o]||o,z=o=>({rectangle:"矩形框",polygon:"多边形",point:"关键点",rotatedRect:"旋转矩形",category:"分类标签"})[o]||o;t.onMounted(()=>{if(X(),a.value){h.value=new dt(a.value),h.value.on("annotationChange",s=>{var l,d;if(s.action==="add"&&s.changedItem){const f=b.value.find(_=>_.id===A.value);f&&(s.changedItem.label=f.name,s.changedItem.labelId=f.id)}s.action==="select"?S.value=((l=s.changedItem)==null?void 0:l.id)||"":s.action==="delete"&&((d=s.changedItem)==null?void 0:d.id)===S.value&&(S.value=""),c("annotationChange",s),y(s)}),P(),T();const o=new ResizeObserver(()=>{var s;(s=h.value)==null||s.resize()});r.value&&o.observe(r.value),n.defaultActiveType&&$(n.defaultActiveType),t.nextTick(()=>O()),c("ready",{meta:R()})}});const T=()=>{if(!h.value)return;const o=b.value.find(l=>l.id===A.value);o&&h.value.setLabelStyle(o.color);const s=b.value.filter(l=>l.visible).map(l=>l.name);h.value.setVisibleLabels(s)},P=()=>{var o;if(h.value)if(S.value="",requestAnimationFrame(()=>{var s;(s=h.value)==null||s.resize()}),n.batchImages.length>0){const s=n.batchImages[u.value];h.value.loadImage(s.imageUrl),s.annotations?h.value.setAnnotations(s.annotations):h.value.setAnnotations([])}else(o=n.image)!=null&&o.url&&h.value.loadImage(n.image.url)},$=o=>{var s,l;if(k.value=o,S.value="",o!=="pan"&&o!=="select"&&b.value.length===0){alert("请先创建标签！");return}o==="pan"||o==="select"?(s=h.value)==null||s.setTool(o):(l=h.value)==null||l.setTool(o),c("tool:change",{meta:R(),tool:o})},Ze=()=>{var o;(o=h.value)!=null&&o.activeAnnotation&&h.value.deleteAnnotation(h.value.activeAnnotation.id)},at=()=>{h.value&&c("viewport:change",{meta:R(),scale:h.value.scale,offset:{...h.value.offset}})},Qe=()=>{var o;(o=h.value)==null||o.zoom(1),at()},tn=()=>{var o;(o=h.value)==null||o.zoom(-1),at()},en=()=>{x.value={name:"",color:"#2196F3"},U.value=!0},Z=()=>{U.value=!1},nn=()=>{if(!x.value.name.trim()){alert("请输入标签名称");return}const s={id:Date.now().toString(),name:x.value.name,color:x.value.color,visible:!0};b.value.push(s),c("labelChange",b.value),T(),b.value.length===1&&W(s),Z()},W=o=>{var s;A.value=o.id,(s=h.value)==null||s.setLabelStyle(o.color)},on=(o,s)=>{if(!o.startsWith("#"))return o;let l=0,d=0,f=0;return o.length===4?(l=parseInt(o[1]+o[1],16),d=parseInt(o[2]+o[2],16),f=parseInt(o[3]+o[3],16)):o.length===7&&(l=parseInt(o.slice(1,3),16),d=parseInt(o.slice(3,5),16),f=parseInt(o.slice(5,7),16)),`rgba(${l}, ${d}, ${f}, ${s})`},sn=o=>{var s;if(o.id===A.value&&((s=h.value)==null||s.setLabelStyle(o.color)),h.value){const l=h.value.getAnnotations();let d=!1;l.forEach(f=>{f.label===o.name&&(f.style||(f.style={}),f.style.strokeColor=o.color,f.style.fillColor=on(o.color,.2),d=!0)}),d&&h.value.render()}c("labelChange",b.value),T()},an=o=>{o.visible=!o.visible,T()},ln=o=>{const s=b.value.findIndex(l=>l.id===o);s>-1&&(b.value.splice(s,1),c("labelChange",b.value),A.value===o&&(A.value=b.value.length>0?b.value[0].id:"",A.value&&W(b.value[0])),T())};t.watch(()=>n.labels,o=>{const s=JSON.parse(JSON.stringify(o||[]));if(b.value=s,b.value.length>0)if(!A.value||!b.value.find(l=>l.id===A.value))W(b.value[0]);else{const l=b.value.find(d=>d.id===A.value);l&&W(l)}else A.value="";T()},{immediate:!0,deep:!0});const cn=()=>{u.value>0&&(Q(),u.value--,P(),tt())},rn=()=>{u.value<n.batchImages.length-1&&(Q(),u.value++,P(),tt())},hn=()=>{u.value>0&&q(0)},dn=()=>{u.value<n.batchImages.length-1&&q(n.batchImages.length-1)},Q=()=>{if(h.value){const o=h.value.getAnnotations();n.batchImages[u.value].annotations=o}},tt=()=>{const o=n.batchImages[u.value];c("batchChange",{currentIndex:u.value,total:n.batchImages.length,currentImageUrl:o.imageUrl,currentAnnotations:o.annotations||[]})},lt=(o=[])=>{var f;if(!h.value)return;if(p.value=JSON.parse(JSON.stringify(o)),p.value.length===0){E.value="none";return}E.value="loaded";const l=(h.value.getAnnotations()||[]).filter(_=>!_.predictionId),d=p.value.map(_=>{const I=JSON.parse(JSON.stringify(_.annotation));return I.id=I.id||`pred-${_.id}`,I.predictionId=_.id,I.modelRunId=_.modelRunId||I.modelRunId,I.confidence=_.confidence??I.confidence,I.reviewStatus=I.reviewStatus||"draft",I});h.value.setAnnotations([...l,...d]),c("prediction:loaded",{meta:R(),modelRunId:(f=p.value[0])==null?void 0:f.modelRunId,candidates:p.value})},gn=(o,s)=>{var f;if(!h.value)return[];E.value="applying";const d=(h.value.getAnnotations()||[]).filter(_=>_.predictionId&&o.includes(_.predictionId));return d.forEach(_=>{_.reviewStatus="accepted"}),E.value="applied",c("prediction:apply",{meta:R(),modelRunId:(f=d[0])==null?void 0:f.modelRunId,candidateIds:o,threshold:s,acceptedAnnotations:d}),h.value.render(),d},mn=(o,s)=>{var f;if(!h.value)return;const l=h.value.getAnnotations()||[],d=l.filter(_=>!(_.predictionId&&o.includes(_.predictionId)));h.value.setAnnotations(d),c("prediction:reject",{meta:R(),modelRunId:(f=l.find(_=>_.predictionId&&o.includes(_.predictionId)))==null?void 0:f.modelRunId,candidateIds:o,reason:s})},fn=(o,s=[])=>{h.value&&(h.value.loadImage(o.url),h.value.setAnnotations(s))},pn=o=>{var s;(s=h.value)==null||s.setAnnotations(o)},ct=()=>{var o;return((o=h.value)==null?void 0:o.getAnnotations())||[]},yn=(o="json")=>{var l,d;const s=ct();return{format:o,image:((l=n.batchImages[u.value])==null?void 0:l.imageUrl)||((d=n.image)==null?void 0:d.url)||"",annotations:s}},q=o=>{o>=0&&o<n.batchImages.length&&(Q(),u.value=o,P(),tt())},un=o=>{var s;return o===u.value&&h.value?h.value.getAnnotations()||[]:((s=n.batchImages[o])==null?void 0:s.annotations)||[]},vn=o=>o.type==="rectangle",wn=o=>o.type==="polygon",xn=o=>o.type==="point",bn=o=>o.type==="rotatedRect",kn=o=>o.type==="category",G=o=>{var l,d;const s=(l=b.value.find(f=>f.name===o.label))==null?void 0:l.color;return((d=o.style)==null?void 0:d.strokeColor)||s||"#409eff"},rt=o=>{const s=o.coordinates;return(s==null?void 0:s.points)||[]},Y=o=>{const s=n.batchImages[o];if(s!=null&&s.width&&(s!=null&&s.height))return{width:s.width,height:s.height};const l=s!=null&&s.imageUrl?N.value[s.imageUrl]:void 0;return l||(s!=null&&s.imageUrl&&j(s.imageUrl),{width:1,height:1})},Cn=o=>{const s=n.batchImages[o];return s!=null&&s.width&&(s!=null&&s.height)?!0:s!=null&&s.imageUrl?!!N.value[s.imageUrl]:!1},_n=(o,s)=>{const l=s.coordinates,d=Y(o),f=G(s),_=Math.min(l.x1,l.x2),I=Math.min(l.y1,l.y2),An=Math.max(l.x1,l.x2),Nn=Math.max(l.y1,l.y2);return{left:`${_/d.width*100}%`,top:`${I/d.height*100}%`,width:`${(An-_)/d.width*100}%`,height:`${(Nn-I)/d.height*100}%`,borderColor:f,backgroundColor:`${f}22`}},En=(o,s)=>{const l=Y(o);return rt(s).map(d=>`${d.x/l.width*100},${d.y/l.height*100}`).join(" ")},Bn=o=>{const s=G(o);return{fill:`${s}33`,stroke:s,strokeWidth:"1.4"}},Sn=(o,s,l)=>{const d=Y(o),f=G(l);return{left:`${s.x/d.width*100}%`,top:`${s.y/d.height*100}%`,backgroundColor:f}},In=(o,s)=>{const l=s.coordinates,d=Y(o),f=G(s),_=Math.abs(l.width),I=Math.abs(l.height);return{left:`${(l.x-_/2)/d.width*100}%`,top:`${(l.y-I/2)/d.height*100}%`,width:`${_/d.width*100}%`,height:`${I/d.height*100}%`,transform:`rotate(${l.angle||0}deg)`,borderColor:f,backgroundColor:`${f}22`}},Vn=(o,s)=>{const l=s.coordinates,d=Y(o),f=G(s);return{left:`${l.x/d.width*100}%`,top:`${l.y/d.height*100}%`,backgroundColor:`${f}d9`}};return e({jumpTo:q,setImage:fn,setAnnotations:pn,getAnnotations:ct,selectTool:$,loadPredictionCandidates:lt,applyPredictions:gn,rejectPredictions:mn,exportAnnotations:yn,getAllAnnotations:()=>{var o,s;return n.batchImages.length>0?n.batchImages:[{imageUrl:((o=n.image)==null?void 0:o.url)||"",annotations:((s=h.value)==null?void 0:s.getAnnotations())||[]}]},getCurrentAnnotation:()=>{var o,s,l;return{imageUrl:((o=n.batchImages[u.value])==null?void 0:o.imageUrl)||((s=n.image)==null?void 0:s.url)||"",annotations:((l=h.value)==null?void 0:l.getAnnotations())||[]}}}),t.watch(()=>{var o;return(o=n.image)==null?void 0:o.url},()=>{var o;n.batchImages.length===0&&((o=n.image)!=null&&o.url)&&P()}),t.watch(()=>n.predictionCandidates,o=>{o&&lt(o)},{immediate:!0,deep:!0}),t.watch(()=>n.batchImages.map(o=>`${o.imageUrl}:${o.width||""}x${o.height||""}`),()=>{X(),m.value=m.value.slice(0,n.batchImages.length),t.nextTick(()=>O())},{immediate:!0}),t.watch(()=>u.value,()=>{t.nextTick(()=>O())}),(o,s)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["annotation-container",w.theme])},[w.batchImages&&w.batchImages.length>0?(t.openBlock(),t.createElementBlock("div",Dt,[t.createElementVNode("div",Tt,"共 "+t.toDisplayString(w.batchImages.length)+" 张",1),t.createElementVNode("div",{ref_key:"imageListScrollRef",ref:g,class:"image-list-scroll"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(w.batchImages,(l,d)=>(t.openBlock(),t.createElementBlock("button",{key:`${l.imageUrl}-${d}`,ref_for:!0,ref:f=>K(f,d),class:t.normalizeClass(["image-list-item",{active:d===u.value}]),onClick:f=>q(d)},[t.createElementVNode("div",zt,[t.createElementVNode("img",{src:l.imageUrl,alt:`第${d+1}张`,class:"image-list-thumb"},null,8,Pt),Cn(d)?(t.openBlock(),t.createElementBlock("div",Lt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(un(d),f=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:f.id},[vn(f)?(t.openBlock(),t.createElementBlock("div",{key:0,class:"thumb-overlay-rect",style:t.normalizeStyle(_n(d,f))},null,4)):wn(f)?(t.openBlock(),t.createElementBlock("svg",$t,[t.createElementVNode("polygon",{points:En(d,f),style:t.normalizeStyle(Bn(f))},null,12,Rt)])):xn(f)?(t.openBlock(!0),t.createElementBlock(t.Fragment,{key:2},t.renderList(rt(f),(_,I)=>(t.openBlock(),t.createElementBlock("div",{key:`${f.id}-${I}`,class:"thumb-overlay-point",style:t.normalizeStyle(Sn(d,_,f))},null,4))),128)):bn(f)?(t.openBlock(),t.createElementBlock("div",{key:3,class:"thumb-overlay-rotated",style:t.normalizeStyle(In(d,f))},null,4)):kn(f)?(t.openBlock(),t.createElementBlock("div",{key:4,class:"thumb-overlay-category",style:t.normalizeStyle(Vn(d,f))},t.toDisplayString(f.label),5)):t.createCommentVNode("",!0)],64))),128))])):t.createCommentVNode("",!0)]),t.createElementVNode("span",Ht,"第 "+t.toDisplayString(d+1)+" 张",1)],10,Mt))),128))],512)])):t.createCommentVNode("",!0),t.createElementVNode("div",Ut,[w.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",Ft,[t.createElementVNode("div",{class:t.normalizeClass(["tool-btn",{active:k.value==="pan"}]),onClick:s[0]||(s[0]=l=>$("pan")),title:"拖动"},[t.createVNode(V,{name:"rank"})],2),t.createElementVNode("div",{class:t.normalizeClass(["tool-btn",{active:k.value==="select"}]),onClick:s[1]||(s[1]=l=>$("select")),title:"选择"},[t.createVNode(V,{name:"pointer"})],2),s[5]||(s[5]=t.createElementVNode("div",{class:"divider"},null,-1)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(v.value,l=>(t.openBlock(),t.createElementBlock("div",{key:l,class:t.normalizeClass(["tool-btn",{active:k.value===l}]),onClick:d=>$(l),title:z(l)},[t.createVNode(V,{name:C(l)},null,8,["name"])],10,Ot))),128)),s[6]||(s[6]=t.createElementVNode("div",{class:"divider"},null,-1)),t.createElementVNode("div",{class:"tool-btn",onClick:Qe,title:"放大"},[t.createVNode(V,{name:"zoom-in"})]),t.createElementVNode("div",{class:"tool-btn",onClick:tn,title:"缩小"},[t.createVNode(V,{name:"zoom-out"})]),M.value?(t.openBlock(),t.createElementBlock("div",Wt)):t.createCommentVNode("",!0),M.value?(t.openBlock(),t.createElementBlock("div",{key:1,class:"tool-btn",onClick:Ze,title:"删除选中"},[t.createVNode(V,{name:"delete"})])):t.createCommentVNode("",!0)]))]),t.createElementVNode("div",Gt,[t.createElementVNode("div",{class:"canvas-wrapper",ref_key:"canvasWrapper",ref:r,onWheel:s[2]||(s[2]=t.withModifiers(()=>{},["prevent"]))},[t.createElementVNode("canvas",{ref_key:"canvasRef",ref:a},null,512),w.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",Yt,[t.createElementVNode("div",{class:"selector-trigger",onClick:st},[F.value?(t.openBlock(),t.createElementBlock("div",Jt,[t.createElementVNode("span",{class:"color-dot",style:t.normalizeStyle({backgroundColor:F.value.color})},null,4),t.createElementVNode("span",jt,t.toDisplayString(F.value.name),1)])):(t.openBlock(),t.createElementBlock("div",Xt,[...s[7]||(s[7]=[t.createElementVNode("span",{class:"label-name"},"请选择标签",-1)])])),t.createVNode(V,{name:"right",class:t.normalizeClass(["arrow-icon",{"is-open":L.value}])},null,8,["class"])]),L.value?(t.openBlock(),t.createElementBlock("div",qt,[b.value.length===0?(t.openBlock(),t.createElementBlock("div",Kt,"请在右侧创建标签")):(t.openBlock(!0),t.createElementBlock(t.Fragment,{key:1},t.renderList(b.value,l=>(t.openBlock(),t.createElementBlock("div",{key:l.id,class:t.normalizeClass(["dropdown-item",{active:A.value===l.id}]),onClick:d=>it(l)},[t.createElementVNode("span",{class:"color-dot",style:t.normalizeStyle({backgroundColor:l.color})},null,4),t.createElementVNode("span",Qt,t.toDisplayString(l.name),1),A.value===l.id?(t.openBlock(),t.createBlock(V,{key:0,name:"aim",class:"check-icon"})):t.createCommentVNode("",!0)],10,Zt))),128))])):t.createCommentVNode("",!0)]))],544),w.batchImages&&w.batchImages.length>0?(t.openBlock(),t.createElementBlock("div",te,[t.createElementVNode("button",{class:"icon-btn",onClick:hn,disabled:u.value<=0,title:"第一张"},[t.createVNode(V,{name:"first"})],8,ee),t.createElementVNode("button",{class:"icon-btn",onClick:cn,disabled:u.value<=0,title:"上一张"},[t.createVNode(V,{name:"back"})],8,ne),t.createElementVNode("span",null,t.toDisplayString(u.value+1)+" / "+t.toDisplayString(w.batchImages.length),1),t.createElementVNode("button",{class:"icon-btn",onClick:rn,disabled:u.value>=w.batchImages.length-1,title:"下一张"},[t.createVNode(V,{name:"right"})],8,oe),t.createElementVNode("button",{class:"icon-btn",onClick:dn,disabled:u.value>=w.batchImages.length-1,title:"最后一张"},[t.createVNode(V,{name:"last"})],8,se)])):t.createCommentVNode("",!0)]),w.readOnly?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",ie,[t.createElementVNode("div",{class:"sidebar-header"},[s[8]||(s[8]=t.createElementVNode("h3",null,"标签",-1)),t.createElementVNode("button",{class:"add-btn",onClick:en},"添加标签")]),t.createElementVNode("div",ae,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(b.value,l=>(t.openBlock(),t.createElementBlock("div",{key:l.id,class:"label-item",style:t.normalizeStyle({backgroundColor:l.color+"1A",color:l.color})},[t.createElementVNode("div",le,[t.createElementVNode("label",{class:"color-wrapper",style:t.normalizeStyle({backgroundColor:l.color})},[t.withDirectives(t.createElementVNode("input",{type:"color","onUpdate:modelValue":d=>l.color=d,onChange:d=>sn(l),style:{visibility:"hidden",width:"0",height:"0"}},null,40,ce),[[t.vModelText,l.color]])],4),t.createElementVNode("span",{class:"label-name",title:l.name},t.toDisplayString(l.name),9,re),t.createElementVNode("span",{class:"action-icon eye",onClick:d=>an(l)},[l.visible?(t.openBlock(),t.createBlock(V,{key:0,name:"view"})):(t.openBlock(),t.createBlock(V,{key:1,name:"hide"}))],8,he),t.createElementVNode("div",de,[s[9]||(s[9]=t.createElementVNode("span",{class:"dots"},"•••",-1)),t.createElementVNode("span",{class:"delete-btn",onClick:d=>ln(l.id),title:"删除"},[t.createVNode(V,{name:"delete"})],8,ge)])])],4))),128))])])),U.value?(t.openBlock(),t.createElementBlock("div",{key:2,class:"modal-overlay",onClick:t.withModifiers(Z,["self"])},[t.createElementVNode("div",me,[s[12]||(s[12]=t.createElementVNode("div",{class:"modal-header"},[t.createElementVNode("h3",null,"新增标签")],-1)),t.createElementVNode("div",fe,[t.createElementVNode("div",pe,[s[10]||(s[10]=t.createElementVNode("label",null,[t.createTextVNode("标签名称 "),t.createElementVNode("span",{class:"required"},"*")],-1)),t.withDirectives(t.createElementVNode("input",{"onUpdate:modelValue":s[3]||(s[3]=l=>x.value.name=l),placeholder:"请输入标签名称",class:"modal-input",autofocus:""},null,512),[[t.vModelText,x.value.name]])]),t.createElementVNode("div",ye,[s[11]||(s[11]=t.createElementVNode("label",null,"标签颜色",-1)),t.createElementVNode("div",ue,[t.createElementVNode("label",{class:"color-picker-box",style:t.normalizeStyle({backgroundColor:x.value.color})},[t.withDirectives(t.createElementVNode("input",{type:"color","onUpdate:modelValue":s[4]||(s[4]=l=>x.value.color=l),class:"modal-color-picker"},null,512),[[t.vModelText,x.value.color]])],4),t.createElementVNode("span",ve,t.toDisplayString(x.value.color),1)])])]),t.createElementVNode("div",we,[t.createElementVNode("button",{onClick:Z,class:"cancel-btn"},"取消"),t.createElementVNode("button",{onClick:nn,class:"confirm-btn",disabled:!x.value.name.trim()},"确认",8,xe)])])])):t.createCommentVNode("",!0)],2))}}),[["__scopeId","data-v-914fe07d"]]),be={class:"thumbnail-wrapper",ref:"wrapper"},ke=["src","alt"],Ce=["viewBox","preserveAspectRatio"],_e=["x","y","width","height","stroke","stroke-width"],Ee=["points","stroke","stroke-width"],Be=["transform"],Se=["x","y","width","height","stroke","stroke-width"],Ie={key:3},Ve=["cx","cy","r","fill","stroke-width"],Ae=["x","y","width","height","fill"],Ne=["x","y","fill","font-size","font-weight","text-anchor","dominant-baseline"],De={key:1,class:"loading-placeholder"},Te=J(t.defineComponent({__name:"AnnotationThumbnail",props:{src:{},annotations:{},alt:{},labels:{},fit:{},strokeWidth:{},fontSize:{}},setup(w){const e=w,i=t.ref(null),n=t.ref(!1),c=t.ref(0),a=t.ref(0),r=()=>{i.value&&(c.value=i.value.naturalWidth,a.value=i.value.naturalHeight,n.value=!0)},g=t.computed(()=>e.fit==="contain"?"xMidYMid meet":"xMidYMid slice"),m=t.computed(()=>e.strokeWidth??10),h=t.computed(()=>e.fontSize??30),k=x=>{var E;if((E=x.style)!=null&&E.strokeColor)return x.style.strokeColor;if(e.labels){const p=e.labels.find(N=>N.name===x.label);if(p)return p.color}return"#FF0000"},u=x=>{const E=x.coordinates,p=Math.min(E.x1,E.x2),N=Math.min(E.y1,E.y2),M=Math.abs(E.x1-E.x2),L=Math.abs(E.y1-E.y2);return{x:p,y:N,width:M,height:L}},S=x=>x.coordinates.points.map(p=>`${p.x},${p.y}`).join(" "),b=x=>{if(x.type==="rectangle"){const E=u(x);return{x:E.x,y:E.y-5}}else if(x.type==="polygon"){const E=x.coordinates.points;if(E.length>0)return{x:E[0].x,y:E[0].y-5}}else{if(x.type==="rotatedRect")return{x:x.coordinates.x,y:x.coordinates.y-x.coordinates.height/2-5};if(x.type==="point"){const E=x.coordinates.points;if(E.length>0)return{x:E[0].x,y:E[0].y-15}}else if(x.type==="category")return{x:x.coordinates.x,y:x.coordinates.y}}return{x:0,y:0}},A=x=>{const{x:E,y:p,angle:N}=x.coordinates,M=N*180/Math.PI;return`translate(${E}, ${p}) rotate(${M})`},U=x=>({x:x.coordinates.x,y:x.coordinates.y});return(x,E)=>(t.openBlock(),t.createElementBlock("div",be,[t.createElementVNode("img",{ref_key:"img",ref:i,src:w.src,class:"thumbnail-image",style:t.normalizeStyle({objectFit:w.fit}),onLoad:r,alt:w.alt},null,44,ke),n.value?(t.openBlock(),t.createElementBlock("svg",{key:0,class:"annotation-overlay",viewBox:`0 0 ${c.value} ${a.value}`,preserveAspectRatio:g.value},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(w.annotations,p=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:p.id},[p.type==="rectangle"?(t.openBlock(),t.createElementBlock("rect",{key:0,x:u(p).x,y:u(p).y,width:u(p).width,height:u(p).height,stroke:k(p),"stroke-width":m.value,fill:"transparent"},null,8,_e)):p.type==="polygon"?(t.openBlock(),t.createElementBlock("polygon",{key:1,points:S(p),stroke:k(p),"stroke-width":m.value,fill:"transparent"},null,8,Ee)):p.type==="rotatedRect"?(t.openBlock(),t.createElementBlock("g",{key:2,transform:A(p)},[t.createElementVNode("rect",{x:-p.coordinates.width/2,y:-p.coordinates.height/2,width:p.coordinates.width,height:p.coordinates.height,stroke:k(p),"stroke-width":m.value,fill:"transparent"},null,8,Se)],8,Be)):p.type==="point"?(t.openBlock(),t.createElementBlock("g",Ie,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.coordinates.points,(N,M)=>(t.openBlock(),t.createElementBlock("circle",{key:M,cx:N.x,cy:N.y,r:m.value*1.5,fill:k(p),stroke:"white","stroke-width":m.value*.5},null,8,Ve))),128))])):p.type==="category"?(t.openBlock(),t.createElementBlock("rect",{key:4,x:U(p).x-(p.label||"").length*h.value*.6/2-8,y:U(p).y-h.value/2-4,width:(p.label||"").length*h.value*.6+16,height:h.value+8,rx:"6",ry:"6",fill:k(p),"fill-opacity":"0.85"},null,8,Ae)):t.createCommentVNode("",!0),p.label?(t.openBlock(),t.createElementBlock("text",{key:5,x:b(p).x,y:b(p).y,fill:p.type==="category"?"#ffffff":k(p),"font-size":h.value,"font-weight":p.type==="category"?"normal":"bold","text-anchor":p.type==="category"?"middle":"start","dominant-baseline":p.type==="category"?"middle":"auto",class:t.normalizeClass({"anno-label":p.type!=="category"})},t.toDisplayString(p.label),11,Ne)):t.createCommentVNode("",!0)],64))),128))],8,Ce)):(t.openBlock(),t.createElementBlock("div",De,"Loading..."))],512))}}),[["__scopeId","data-v-159a7956"]]),Me={key:0,class:"gallery-view"},ze={class:"gallery-layout"},Pe={class:"gallery-sidebar"},Le={class:"label-stats-table"},$e={class:"label-cover-wrapper"},Re=["src"],He={class:"gallery-content"},Ue=["onClick"],Fe={class:"thumbnail-wrapper"},Oe={class:"img-meta"},We={class:"img-index"},Ge={class:"anno-count"},Ye={key:0,class:"bottom-bar"},Je={key:1,class:"editor-view"},je={class:"editor-header"},Xe={class:"header-left"},qe={class:"editor-title"},Ke={class:"editor-content"},ot=J(t.defineComponent({__name:"BatchAnnotator",props:{images:{},labels:{},actionBar:{},clickToEnterEditor:{type:Boolean},thumbStrokeWidth:{},thumbFontSize:{}},emits:["export","update:images","imageClick","update:labels","pageChange"],setup(w,{expose:e,emit:i}){const n=w,c=i,a=t.ref("gallery"),r=t.ref([]),g=t.ref([]),m=t.ref(0),h=t.ref(null),k=t.ref(null),u=t.ref(null),S=t.computed(()=>{var y,v;return((v=(y=n.actionBar)==null?void 0:y.annotateButton)==null?void 0:v.show)===!0}),b=t.computed(()=>{var y,v;return((v=(y=n.actionBar)==null?void 0:y.exportButton)==null?void 0:v.show)===!0}),A=t.computed(()=>S.value||b.value),U=t.computed(()=>{var y,v;return((v=(y=n.actionBar)==null?void 0:y.annotateButton)==null?void 0:v.text)||"手动标注"}),x=t.computed(()=>{var y,v;return((v=(y=n.actionBar)==null?void 0:y.exportButton)==null?void 0:v.text)||"导出"}),E=t.computed(()=>n.clickToEnterEditor!==!1),p=t.computed(()=>{const y={};g.value.forEach(C=>{y[C.name]={count:0,cover:""}});let v=0;return r.value.forEach(C=>{C.annotations&&C.annotations.forEach(z=>{var P;const T=z.label||(z.labelId?(P=g.value.find($=>$.id===z.labelId))==null?void 0:P.name:null);T&&y[T]&&(y[T].count++,v++,y[T].cover||(y[T].cover=C.imageUrl))})}),g.value.map(C=>{var P,$;const z=((P=y[C.name])==null?void 0:P.count)||0,T=v===0?"0.00%":(z/v*100).toFixed(2)+"%";return{id:C.id,name:C.name,color:C.color,count:z,percentage:T,cover:(($=y[C.name])==null?void 0:$.cover)||""}})}),N=y=>({color:y.color,backgroundColor:y.color+"1A"});t.watch(()=>n.images,y=>{r.value=JSON.parse(JSON.stringify(y))},{immediate:!0,deep:!0}),t.watch(()=>n.labels,y=>{g.value=JSON.parse(JSON.stringify(y||[]))},{immediate:!0,deep:!0});const M=y=>{m.value=y,a.value="editor",c("pageChange",{nowPage:"editPage"}),u.value&&(u.value.scrollTop=0),t.nextTick(()=>{k.value&&(k.value.scrollTop=0),window.scrollTo(0,0),requestAnimationFrame(()=>{var v,C;(C=(v=h.value)==null?void 0:v.jumpTo)==null||C.call(v,y)})})},L=(y,v)=>{if(E.value){M(y);return}c("imageClick",{index:y,imageId:v.id,image:v})},F=y=>r.value.findIndex(v=>v.id===y);e({openImageById:y=>{const v=F(y);return v<0?!1:(M(v),!0)},triggerImageClickById:y=>{const v=F(y);if(v<0)return!1;const C=r.value[v];return C?(c("imageClick",{index:v,imageId:C.id,image:C}),!0):!1},getFinalData:()=>({images:JSON.parse(JSON.stringify(r.value)),labels:JSON.parse(JSON.stringify(g.value))})});const j=()=>{if(h.value&&h.value.getCurrentAnnotation){const y=h.value.getCurrentAnnotation();r.value[m.value]&&(r.value[m.value].annotations=y.annotations)}a.value="gallery",c("pageChange",{nowPage:"listPage"})},X=()=>{c("export",r.value)},K=y=>{m.value=y.currentIndex,r.value[y.currentIndex]&&(r.value[y.currentIndex].annotations=y.currentAnnotations)},O=y=>{if(h.value&&h.value.getCurrentAnnotation){const v=h.value.getCurrentAnnotation();r.value[m.value]&&(r.value[m.value].annotations=v.annotations,c("update:images",r.value))}},R=y=>{g.value=JSON.parse(JSON.stringify(y||[])),c("update:labels",g.value)};return(y,v)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"batchRootRef",ref:k,class:"batch-annotator"},[a.value==="gallery"?(t.openBlock(),t.createElementBlock("div",Me,[t.createElementVNode("div",ze,[t.createElementVNode("div",Pe,[t.createElementVNode("table",Le,[v[1]||(v[1]=t.createElementVNode("thead",null,[t.createElementVNode("tr",null,[t.createElementVNode("th",null,"标签封面"),t.createElementVNode("th",null,"标签名称"),t.createElementVNode("th",null,"标注数"),t.createElementVNode("th",null,"占比")])],-1)),t.createElementVNode("tbody",null,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.value,C=>(t.openBlock(),t.createElementBlock("tr",{key:C.id,style:t.normalizeStyle(N(C))},[t.createElementVNode("td",null,[t.createElementVNode("div",$e,[C.cover?(t.openBlock(),t.createElementBlock("img",{key:0,src:C.cover,class:"label-cover"},null,8,Re)):(t.openBlock(),t.createElementBlock("div",{key:1,class:"label-cover-empty",style:t.normalizeStyle({backgroundColor:C.color})},null,4))])]),t.createElementVNode("td",null,t.toDisplayString(C.name),1),t.createElementVNode("td",null,t.toDisplayString(C.count),1),t.createElementVNode("td",null,t.toDisplayString(C.percentage),1)],4))),128))])])]),t.createElementVNode("div",He,[t.createElementVNode("div",{ref_key:"galleryGridRef",ref:u,class:"gallery-grid"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(r.value,(C,z)=>(t.openBlock(),t.createElementBlock("div",{key:z,class:"gallery-item",onClick:T=>L(z,C)},[t.createElementVNode("div",Fe,[t.createVNode(Te,{src:C.imageUrl,annotations:C.annotations||[],labels:g.value,fit:"cover",strokeWidth:n.thumbStrokeWidth,fontSize:n.thumbFontSize},null,8,["src","annotations","labels","strokeWidth","fontSize"])]),t.createElementVNode("div",Oe,[t.createElementVNode("span",We,"#"+t.toDisplayString(z+1),1),t.createElementVNode("span",Ge,t.toDisplayString((C.annotations||[]).length)+" 标注",1)])],8,Ue))),128))],512)])]),A.value?(t.openBlock(),t.createElementBlock("div",Ye,[S.value?(t.openBlock(),t.createElementBlock("button",{key:0,class:"action-btn primary",onClick:v[0]||(v[0]=C=>M(0))},[t.createVNode(V,{name:"edit"}),t.createTextVNode(" "+t.toDisplayString(U.value),1)])):t.createCommentVNode("",!0),b.value?(t.openBlock(),t.createElementBlock("button",{key:1,class:"action-btn success",onClick:X},[t.createVNode(V,{name:"download"}),t.createTextVNode(" "+t.toDisplayString(x.value),1)])):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",Je,[t.createElementVNode("div",je,[t.createElementVNode("div",Xe,[t.createElementVNode("button",{class:"back-btn",onClick:j},[t.createVNode(V,{name:"back",class:"back-icon"}),v[2]||(v[2]=t.createTextVNode()),v[3]||(v[3]=t.createElementVNode("span",{class:"back-text"},"返回",-1))]),t.createElementVNode("span",qe,"正在标注: "+t.toDisplayString(m.value+1)+" / "+t.toDisplayString(r.value.length),1)])]),t.createElementVNode("div",Ke,[t.createVNode(nt,{ref_key:"annotatorRef",ref:h,batchImages:r.value,labels:g.value,annotationTypes:["rectangle","polygon","point","rotatedRect","category"],onBatchChange:K,onAnnotationChange:O,onLabelChange:R},null,8,["batchImages","labels"])])]))],512))}}),[["__scopeId","data-v-701c81a6"]]);D.BatchAnnotator=ot,D.ImageAnnotator=nt,D.default=ot,Object.defineProperties(D,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "luo-image-annotator",
-  "version": "0.0.13",
+  "version": "0.0.15",
   "description": "A simple image annotation component for Vue 3",
   "scripts": {
     "dev": "vite",