Merge branch '图稿制作' into 测试

src/views/sell/draft-design/drawing/index.vue

@@ -401,95 +401,70 @@ const checkElement = () => {
 };
 const elementMarking = (item) => {
   elAngle.value = item.angle;
+  let x = Number(Math.round(item.x));
+  let y = Number(Math.round(item.y));
+  let w = 0;
+  let h = 0;
+  let x1 = 0;
+  let y1 = 0;
+  let x3 = 0;
+  let y3 = 0;
+  let cx = 0;
+  let cy = 0;
   if (item.imgStatus) {
-    let x = Number(Math.round(item.x));
-    let y = Number(Math.round(item.y));
-    let w = Number(Math.round(item.w));
-    let h = Number(Math.round(item.h));
+    w = Number(Math.round(item.w));
+    h = Number(Math.round(item.h));
     elLength.value = Number(Math.round(item.w / 5));
     elWidth.value = Number(Math.round(item.h / 5));
-    let x1 = x;
-    let y1 = y;
-    let x3 = x;
-    let y3 = y + h;
-    let cx = x + w / 2;
-    let cy = y + h / 2;
-    let x1_rotated = (x1 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y1 - cy) * Math.sin((item.angle * Math.PI) / 180);
-    let y1_rotated = (x1 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y1 - cy) * Math.cos((item.angle * Math.PI) / 180);
-    let x3_rotated = (x3 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y3 - cy) * Math.sin((item.angle * Math.PI) / 180);
-    let y3_rotated = (x3 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y3 - cy) * Math.cos((item.angle * Math.PI) / 180);
-    x1_rotated += cx;
-    y1_rotated += cy;
-    x3_rotated += cx;
-    y3_rotated += cy;
-    if (x1_rotated == x3_rotated) {
-      if (y1_rotated < y3_rotated) {
-        elCoordinates.value.push({ textStatus: false, x1: 0, y1: y1_rotated, x2: x1_rotated, y2: y1_rotated });
-        elCoordinates.value.push({ textStatus: false, x1: x1_rotated, y1: 0, x2: x1_rotated, y2: y1_rotated });
-        elCoordinates.value.push({ textStatus: true, x: x1_rotated / 2, y: y1_rotated + 30, color: "red", text: Number(Math.round(x1_rotated / 5)) + "mm" });
-        elCoordinates.value.push({ textStatus: true, x: x1_rotated + 10, y: y1_rotated / 2, color: "red", text: Number(Math.round(y1_rotated / 5)) + "mm" });
-      } else {
-        elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
-        elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
-        elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
-        elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
-      }
-    } else if (x1_rotated > x3_rotated) {
-      elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
-      elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
-      elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
-      elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
-    } else {
-      elCoordinates.value.push({ textStatus: false, x1: 0, y1: y1_rotated, x2: x1_rotated, y2: y1_rotated });
-      elCoordinates.value.push({ textStatus: false, x1: x1_rotated, y1: 0, x2: x1_rotated, y2: y1_rotated });
-      elCoordinates.value.push({ textStatus: true, x: x1_rotated / 2, y: y1_rotated + 30, color: "red", text: Number(Math.round(x1_rotated / 5)) + "mm" });
-      elCoordinates.value.push({ textStatus: true, x: x1_rotated + 10, y: y1_rotated / 2, color: "red", text: Number(Math.round(y1_rotated / 5)) + "mm" });
-    }
+    x1 = x;
+    y1 = y;
+    x3 = x;
+    y3 = y + h;
+    cx = x + w / 2;
+    cy = y + h / 2;
   } else {
     let textPixel = getStringPixel(item.text, item.size + "px 宋体");
-    let x = Number(Math.round(item.x));
-    let y = Number(Math.round(item.y));
-    let w = Number(Math.round(textPixel.width));
-    let h = Number(Math.round(textPixel.fontBoundingBoxAscent + textPixel.fontBoundingBoxDescent));
+    w = Number(Math.round(textPixel.width));
+    h = Number(Math.round(textPixel.fontBoundingBoxAscent + textPixel.fontBoundingBoxDescent));
     elLength.value = Number(Math.round(textPixel.width / 5));
     elWidth.value = Number(Math.round((textPixel.fontBoundingBoxAscent + textPixel.fontBoundingBoxDescent) / 5));
-    let x1 = x;
-    let y1 = y - h;
-    let x3 = x;
-    let y3 = y;
-    let cx = x + w / 2;
-    let cy = y - h / 2;
-    let x1_rotated = (x1 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y1 - cy) * Math.sin((item.angle * Math.PI) / 180);
-    let y1_rotated = (x1 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y1 - cy) * Math.cos((item.angle * Math.PI) / 180);
-    let x3_rotated = (x3 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y3 - cy) * Math.sin((item.angle * Math.PI) / 180);
-    let y3_rotated = (x3 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y3 - cy) * Math.cos((item.angle * Math.PI) / 180);
-    x1_rotated += cx;
-    y1_rotated += cy;
-    x3_rotated += cx;
-    y3_rotated += cy;
-    if (x1_rotated == x3_rotated) {
-      if (y1_rotated < y3_rotated) {
-        elCoordinates.value.push({ textStatus: false, x1: 0, y1: y1_rotated, x2: x1_rotated, y2: y1_rotated });
-        elCoordinates.value.push({ textStatus: false, x1: x1_rotated, y1: 0, x2: x1_rotated, y2: y1_rotated });
-        elCoordinates.value.push({ textStatus: true, x: x1_rotated / 2, y: y1_rotated + 30, color: "red", text: Number(Math.round(x1_rotated / 5)) + "mm" });
-        elCoordinates.value.push({ textStatus: true, x: x1_rotated + 10, y: y1_rotated / 2, color: "red", text: Number(Math.round(y1_rotated / 5)) + "mm" });
-      } else {
-        elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
-        elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
-        elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
-        elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
-      }
-    } else if (x1_rotated > x3_rotated) {
-      elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
-      elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
-      elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
-      elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
-    } else {
+    x1 = x;
+    y1 = y - h;
+    x3 = x;
+    y3 = y;
+    cx = x + w / 2;
+    cy = y - h / 2;
+  }
+  let x1_rotated = (x1 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y1 - cy) * Math.sin((item.angle * Math.PI) / 180);
+  let y1_rotated = (x1 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y1 - cy) * Math.cos((item.angle * Math.PI) / 180);
+  let x3_rotated = (x3 - cx) * Math.cos((item.angle * Math.PI) / 180) - (y3 - cy) * Math.sin((item.angle * Math.PI) / 180);
+  let y3_rotated = (x3 - cx) * Math.sin((item.angle * Math.PI) / 180) + (y3 - cy) * Math.cos((item.angle * Math.PI) / 180);
+  x1_rotated += cx;
+  y1_rotated += cy;
+  x3_rotated += cx;
+  y3_rotated += cy;
+  if (x1_rotated == x3_rotated) {
+    if (y1_rotated < y3_rotated) {
       elCoordinates.value.push({ textStatus: false, x1: 0, y1: y1_rotated, x2: x1_rotated, y2: y1_rotated });
       elCoordinates.value.push({ textStatus: false, x1: x1_rotated, y1: 0, x2: x1_rotated, y2: y1_rotated });
       elCoordinates.value.push({ textStatus: true, x: x1_rotated / 2, y: y1_rotated + 30, color: "red", text: Number(Math.round(x1_rotated / 5)) + "mm" });
       elCoordinates.value.push({ textStatus: true, x: x1_rotated + 10, y: y1_rotated / 2, color: "red", text: Number(Math.round(y1_rotated / 5)) + "mm" });
+    } else {
+      elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
+      elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
+      elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
+      elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
     }
+  } else if (x1_rotated > x3_rotated) {
+    elCoordinates.value.push({ textStatus: false, x1: 0, y1: y3_rotated, x2: x3_rotated, y2: y3_rotated });
+    elCoordinates.value.push({ textStatus: false, x1: x3_rotated, y1: 0, x2: x3_rotated, y2: y3_rotated });
+    elCoordinates.value.push({ textStatus: true, x: x3_rotated / 2, y: y3_rotated + 30, color: "red", text: Number(Math.round(x3_rotated / 5)) + "mm" });
+    elCoordinates.value.push({ textStatus: true, x: x3_rotated + 10, y: y3_rotated / 2, color: "red", text: Number(Math.round(y3_rotated / 5)) + "mm" });
+  } else {
+    elCoordinates.value.push({ textStatus: false, x1: 0, y1: y1_rotated, x2: x1_rotated, y2: y1_rotated });
+    elCoordinates.value.push({ textStatus: false, x1: x1_rotated, y1: 0, x2: x1_rotated, y2: y1_rotated });
+    elCoordinates.value.push({ textStatus: true, x: x1_rotated / 2, y: y1_rotated + 30, color: "red", text: Number(Math.round(x1_rotated / 5)) + "mm" });
+    elCoordinates.value.push({ textStatus: true, x: x1_rotated + 10, y: y1_rotated / 2, color: "red", text: Number(Math.round(y1_rotated / 5)) + "mm" });
   }
 };
 const clickToView = () => {