qinyan 1 year ago
parent
commit
9a75165257

+ 11 - 8
src/controllers/wxController.ts

@@ -8,13 +8,13 @@ function isWeixinBrowser() {
   return /micromessenger/.test(ua) ? true : false;
 }
 
-// function isIos() {
-//   if (/(iphone|ipad|ipod|ios)/i.test(ua)) {
-//     return true;
-//   } else {
-//     return false;
-//   }
-// }
+function isIos() {
+  if (/(iphone|ipad|ipod|ios)/i.test(ua)) {
+    return true;
+  } else {
+    return false;
+  }
+}
 
 // function isAndroid() {
 //   if (/(android)/i.test(ua)) {
@@ -48,7 +48,10 @@ export class wxController {
   init(url: string) {
     if (isWeixinBrowser()) {
       this.requestUrl = url;
-      const signUrl = window.location.href;
+      let signUrl = window.location.href;
+      if (isIos()) {
+        signUrl = signUrl.split("#")[0];
+      }
       this.signSuccess = false;
       this.sign(signUrl);
     } else {

+ 5 - 2
src/modules/editor/components/CompUI/basicUI/Transfer/index.tsx

@@ -3,6 +3,7 @@ import { css } from "@linaria/core";
 import { defineComponent, onMounted, onUnmounted } from "vue";
 import { useEditor } from "../../../..";
 import { IconMove, IconRotate } from "@/assets/icons";
+import { parseTransform } from "@/modules/editor/objects/DesignTemp/creates/createCompStyle";
 
 export const Transfer = defineComponent({
   setup() {
@@ -33,6 +34,8 @@ export const Transfer = defineComponent({
       // const showTransfer =
       //   store.isEditComp || store.pageCompIds.includes(comp.id);
       const showTransfer = true;
+      const styleTransform = parseTransform(transferStyle.transform);
+
       return (
         transferStyle.width && (
           <div
@@ -41,9 +44,9 @@ export const Transfer = defineComponent({
               top: transferStyle.top,
               left: transferStyle.left,
               width: transferStyle.width,
+              transform: styleTransform,
+              transformOrigin: "left",
             }}
-            
-            
           >
             <div
               class={borderStyle}

+ 15 - 11
src/modules/editor/components/CompUI/basicUI/Transfer/streamCard.tsx

@@ -3,6 +3,7 @@ import { defineComponent, onMounted, onUnmounted } from "vue";
 import { useEditor } from "../../../..";
 import { IconMove, IconClear, IconAdd, IconResizeY } from "@/assets/icons";
 import { TransferCtrl } from "@/modules/editor/controllers/TransferCtrl";
+import { parseTransform } from "@/modules/editor/objects/DesignTemp/creates/createCompStyle";
 
 export const StreamCardTransfer = defineComponent({
   setup() {
@@ -11,13 +12,13 @@ export const StreamCardTransfer = defineComponent({
 
     const streamCardTransferCtrl = new TransferCtrl(editor);
     onMounted(() => {
-        const pageEl = helper.findRootComp()?.$el;
-        if (pageEl) {
-          streamCardTransferCtrl.currComp = store.currStreamCard;
-          streamCardTransferCtrl.pageEl = pageEl.firstChild as any;
-          streamCardTransferCtrl.compEl = streamCardTransferCtrl.currComp.$el;
-          streamCardTransferCtrl.observe();
-        }
+      const pageEl = helper.findRootComp()?.$el;
+      if (pageEl) {
+        streamCardTransferCtrl.currComp = store.currStreamCard;
+        streamCardTransferCtrl.pageEl = pageEl.firstChild as any;
+        streamCardTransferCtrl.compEl = streamCardTransferCtrl.currComp.$el;
+        streamCardTransferCtrl.observe();
+      }
     });
 
     onUnmounted(() => {
@@ -25,7 +26,9 @@ export const StreamCardTransfer = defineComponent({
     });
 
     return () => {
-        const transferStyle = streamCardTransferCtrl.transferStyle;
+      const transferStyle = streamCardTransferCtrl.transferStyle;
+
+      const styleTransform = parseTransform(transferStyle.transform);
 
       return (
         transferStyle.width && (
@@ -35,6 +38,7 @@ export const StreamCardTransfer = defineComponent({
               top: transferStyle.top,
               left: transferStyle.left,
               width: transferStyle.width,
+              transform: styleTransform,
             }}
           >
             <div
@@ -48,9 +52,9 @@ export const StreamCardTransfer = defineComponent({
             <div
               class={resizeHeightBtnCls}
               style={{ top: transferStyle.height }}
-                onMousedown={(e) => {
-                    e.stopPropagation();
-                    
+              onMousedown={(e) => {
+                e.stopPropagation();
+
                     streamCardTransferCtrl.mousedown(e, "resizeY", store.currStreamCard)
                 }
               }

+ 6 - 6
src/modules/editor/components/CompUI/customUI/Texts/Text1/index.ts

@@ -7,23 +7,23 @@ export { Component } from "./component";
 
 const defaultData = [
   {
-    label: "产品名称",
+    label: `<p style="text-align:center;"><span style="color:hsl(0,0%,100%);">产品名称</span></p>`,
     content: "P190(注塑)",
   },
   {
-    label: "产品规格",
+    label: `<p style="text-align:center;"><span style="color:hsl(0,0%,100%);">产品规格</span></p>`,
     content: "52英寸",
   },
   {
-    label: "产品厚度",
+    label: `<p style="text-align:center;"><span style="color:hsl(0,0%,100%);">产品厚度</span></p>`,
     content: "1.0mm+0.05mm",
   },
   {
-    label: "产品底材",
-    content: "产品底材",
+    label: `<p style="text-align:center;"><span style="color:hsl(0,0%,100%);">产品底材</span></p>`,
+    content: "鹿皮绒",
   },
   {
-    label: "产品用途",
+    label: `<p style="text-align:center;"><span style="color:hsl(0,0%,100%);">产品用途</span></p>`,
     content: "凉鞋、跟鞋、高更鞋、时尚休闲鞋等",
   },
 ];

+ 55 - 6
src/modules/editor/controllers/TransferCtrl/index.ts

@@ -33,7 +33,11 @@ export class TransferCtrl extends ModuleControl<EditorModule> {
     left: "",
     width: "",
     height: "",
-    transform: "",
+    transform: {
+      rotate: "0deg",
+      translateX: "-50%",
+      translateY: "-50%",
+    },
   });
 
   init(pageEl: HTMLElement) {
@@ -45,7 +49,7 @@ export class TransferCtrl extends ModuleControl<EditorModule> {
 
   mousedown(e: MouseEvent, type: keyof typeof transforms, currComp?: any) {
     if (!currComp) {
-      currComp =  this.store.currComp;
+      currComp = this.store.currComp;
     }
     this.currComp = currComp;
     this.compEl = currComp.$el;
@@ -101,10 +105,23 @@ export class TransferCtrl extends ModuleControl<EditorModule> {
   initStyle() {
     const rect = this.compEl.getBoundingClientRect();
     const pageRect = this.pageEl.getBoundingClientRect();
-    this.transferStyle.width = rect.width + "px";
-    this.transferStyle.height = rect.height + "px";
-    this.transferStyle.top = rect.top - pageRect.top + "px";
-    this.transferStyle.left = rect.left - pageRect.left + "px";
+
+    const transform = getTransform(this.compEl);
+
+    this.transferStyle.width = this.compEl.clientWidth + "px";
+    this.transferStyle.height = this.compEl.clientHeight + "px";
+    this.transferStyle.top = rect.top + rect.height / 2 - pageRect.top + "px";
+    this.transferStyle.left = rect.left + rect.width / 2 - pageRect.left + "px";
+    if (!this.transferStyle.transform) {
+      this.transferStyle.transform = {
+        rotate: "0deg",
+        translateX: "-50%",
+        translateY: "-50%",
+      };
+    }
+    this.transferStyle.transform.rotate = transform.rotate;
+    this.transferStyle.transform.translateY =
+      "-" + this.compEl.clientHeight / 2 + "px";
   }
 
   resetStyle() {
@@ -118,3 +135,35 @@ export class TransferCtrl extends ModuleControl<EditorModule> {
     this.resetStyle();
   }
 }
+
+export function getTransform(el: HTMLElement) {
+  const st = getComputedStyle(el, null);
+  const tr =
+    st.getPropertyValue("-webkit-transform") ||
+    st.getPropertyValue("-moz-transform") ||
+    st.getPropertyValue("-ms-transform") ||
+    st.getPropertyValue("-o-transform") ||
+    st.getPropertyValue("transform") ||
+    "FAIL";
+
+  // console.error("Matrix: " + tr);
+
+  if (tr == "none")
+    return {
+      rotate: "0deg",
+    };
+
+  // rotation matrix - http://en.wikipedia.org/wiki/Rotation_matrix
+
+  const values = tr.split("(")[1].split(")")[0].split(",");
+  // console.error("values: ", values);
+  const a: any = values[0];
+  const b: any = values[1];
+  const c: any = values[2];
+  const d: any = values[3];
+
+  const angle = Math.round(Math.atan2(b, a) * (180 / Math.PI));
+  return {
+    rotate: `${angle}deg`,
+  };
+}

+ 1 - 1
src/modules/editor/objects/DesignTemp/creates/createCompStyle.ts

@@ -70,7 +70,7 @@ export function createCompStyle(module: EditorModule, layout: Layout) {
   return style;
 }
 
-function parseTransform(trans: any) {
+export function parseTransform(trans: any) {
   const transforms: string[] = [];
   Object.entries(trans).forEach(([key, value]) => {
     transforms.push(`${key}(${value})`);