update

src/dict/apis.ts

@@ -1,5 +1,5 @@
 const baseURL = "https://www.infish.cn";
-const localURL = "http://192.168.110.180:8890";
+// const localURL = "http://192.168.110.180:8890";
 
 const baseVersion = "/cloud/v1";
 const treeVersion = "/tree/v1";
@@ -18,8 +18,8 @@ const Dict_Apis = {
   queentreeLocal: base,
   auth: `${baseURL}${baseVersion}/usercenter`,
   queentree: `${baseURL}${treeVersion}/assetcenter`,
-  // promotion: `${baseURL}${baseVersion}/promotionv1`,
-  promotion: `${localURL}/promotion`,
+  promotion: `${baseURL}${baseVersion}/promotionv1`,
+  // promotion: `${localURL}/promotion`,
 };
 
 export { Dict_Apis };

src/modules/editor/components/Viewport/Content/index.tsx

@@ -72,9 +72,15 @@ export default defineUI({
                             if (sourceContainerOptions.groupName != "canvas") {
                               return false;
                             }
+
+                            console.log("payload===>", "xxx", payload);
+                            
                             if (typeof payload == "string") {
                               controls.dragAddCtrl.updateCompKey(payload);
                             } else {
+
+                             
+
                               controls.dragAddCtrl.updateCompKey(payload.type);
                               controls.dragAddCtrl.updateCompData(payload.data);
                             }

src/modules/editor/components/Viewport/Slider/SliderLeft/CompsUser.tsx

@@ -21,11 +21,15 @@ export default defineUI({
     const resource = useResource();
     const listCtrl = resource.controls.CustCompListCtrl;
     listCtrl.hasLimit = true;
-    onMounted(() =>  listCtrl.loadPage(1));
+
+     //@ts-ignore
+    let isSys = (auth.store.userInfo.roles || []).indexOf("system") > -1;
+    onMounted(() =>  {
+        listCtrl.loadPage(1)
+    });
 
     return () => {
-      //@ts-ignore
-      const isSys = (auth.store.userInfo.roles || []).indexOf("system") > -1;
+
       if (listCtrl.state.list.length == 0) return <Empty />;
 
       return (
@@ -35,7 +39,7 @@ export default defineUI({
           group-name="canvas"
           animation-duration={0}
           get-child-payload={(index: number) => {
-            return listCtrl.state.list[index]._id;
+            return {type:"CompCard", data:  {id: listCtrl.state.list[index]._id, isSys: isSys}};
           }}
         >
           {listCtrl.state.list.map((item:any) => {
@@ -56,7 +60,7 @@ export default defineUI({
                     class="w-full rounded"
                     src={item.thumbnail}
                     onClick={() => {
-                        editor.actions.clickCompUserToDesign(item._id)
+                        editor.actions.clickCompUserToDesign(item._id, isSys)
                     }
                     }
                     size={240}

src/modules/editor/components/Viewport/Slider/SliderLeft/SourceItem.tsx

@@ -101,7 +101,7 @@ export default defineUI({
       return (
         <div class={cx(itemStyles, "relative")}>
          {
-            props.isVideo ? <VideoItem  record={props.record} /> : <ImageItem  record={props.record} />
+            props.isVideo ? <VideoItem onClick={()=>emit("click")}  record={props.record} /> : <ImageItem onClick={()=>emit("click")}  record={props.record} />
          }
 
           {isSys && props.tagable && (

src/modules/editor/controllers/CompUICtrl/index.ts

@@ -85,9 +85,11 @@ export class CompUICtrl extends ModuleControl<EditorModule> {
     let compId = "";
     const compItem = this.state.components.get(compKey);
     if (!compItem) throw Exception.error("无效的组件");
+
+
     compId = createCompId(compKey);
     addCacheToMap(this.store.designData.compMap);
-
+    
     return compId;
   }
 }

src/modules/editor/controllers/DragAddCtrl/index.ts

@@ -32,7 +32,7 @@ export class DragAddCtrl extends ModuleControl<EditorModule> {
 
   async dragComp(e: MouseEvent) {
     const scope = this;
-    await scope.actions.dragCompToDesign(e, scope.dragingCompKey as any);
+    await scope.actions.dragCompToDesign(e, scope.dragingCompKey as any, scope.dragingCompData);
     if (
       scope.dragingCompData?._id &&
       (scope.dragingCompKey == "Image" || scope.dragingCompKey == "Video")

src/modules/editor/controllers/ScreenshotCtrl/index.ts

@@ -4,12 +4,12 @@ export class ScreenshotCtrl {
   async snap(options: { element: HTMLElement; ratio?: number }): Promise<Blob> {
     const dom = options.element;
 
-    const transferEl = document.querySelector(".transfer") as
-      | HTMLElement
-      | undefined;
-    if (transferEl) {
-      transferEl.style.display = "none";
-    }
+    // const transferEl = document.querySelector(".transfer") as
+    //   | HTMLElement
+    //   | undefined;
+    // if (transferEl) {
+    //   transferEl.style.display = "none";
+    // }
 
     if (options.ratio) {
       const result = await domtoimage.toJpeg(dom);
@@ -17,9 +17,9 @@ export class ScreenshotCtrl {
         const image = new Image();
         image.src = result;
         image.onload = function () {
-          if (transferEl) {
-            transferEl.style.display = "block";
-          }
+          // if (transferEl) {
+          //   transferEl.style.display = "block";
+          // }
           resolve(image);
         };
       });
@@ -43,15 +43,17 @@ export class ScreenshotCtrl {
       );
       return new Promise((resolve) => {
         canvas.toBlob((blob) => {
-          if (transferEl) {
-            transferEl.style.display = "block";
-          }
+          // if (transferEl) {
+          //   transferEl.style.display = "block";
+          // }
           if (blob) {
             resolve(blob);
           }
         });
       });
     } else {
+
+      console.log( "xxxxxxxxxxxxxxxxxx" ,  dom );
       return domtoimage.toBlob(dom);
     }
   }

src/modules/editor/module/actions/edit.tsx

@@ -6,6 +6,8 @@ import { CompObject } from "../../controllers/SelectCtrl/compObj";
 import { DesignComp } from "../../objects/DesignTemp/DesignComp";
 import { ICompKeys, Layout } from "../../typings";
 import CompSave from "../../components/CompSave";
+import { ObjsContainer } from "../../controllers/SelectCtrl/ObjsContainer";
+import { getKeyThenIncreaseKey } from "ant-design-vue/lib/message";
 
 export const editActions = EditorModule.action({
   pickComp(compId: string, selected = true) {
@@ -53,6 +55,7 @@ export const editActions = EditorModule.action({
       compKey != "Triangle" &&
       compKey != "Ellipse" &&
       compKey != "Polygon" &&
+      compKey != "PolygonNormal" &&
       compKey != "Curve";
 
     let yOffset = 0;
@@ -110,25 +113,12 @@ export const editActions = EditorModule.action({
   },
 
  // 通过点击添加组件到画布
- async clickCompUserToDesign(id: string) {
+ async clickCompUserToDesign(id: string, isSys) {
   if (!this.store.currStreamCardId) {
       queenApi.messageError("请先选中一个卡片");
       return;
   }
-
-  const { result } = await this.https.getCompDetail(id);
-
-
-  let yOffset = 0;
-  if (
-    this.store.currCompId != this.store.currStreamCardId &&
-    this.store.currCompId != "root"
-  ) {
-    const bound = this.helper.getCardCompBound(this.store.currCompId);
-    yOffset = bound.y + bound.h;
-  }
-
-  let currCard = this.store.currStreamCard;
+  const { result } = await this.https.getCompDetail(id, isSys);
 
   //先创建卡片
   const currCardIndex =  this.store.streamCardIds.indexOf(this.store.currStreamCardId) + 1;
@@ -136,7 +126,7 @@ export const editActions = EditorModule.action({
     "Container",
     currCardIndex
   );
-    currCard = this.helper.findComp(cardId) as DesignComp;
+   const currCard = this.helper.findComp(cardId) as DesignComp;
   
     const comp =  this.store.addUserCard(result);
 
@@ -148,36 +138,72 @@ export const editActions = EditorModule.action({
     const addedComp = this.store.compMap[compId];
     addedComp.layout.position = "absolute";
 
-    const currComp = this.helper.findComp(compId) as DesignComp;
+    this.actions.initAddedCompPos(this.store.currCompId, compId, cardId);
+  },
+
+
+  initAddedCompPos(currId: string, addedId:string, cardId:string) {
+    let yOffset = 0;
+    if (
+      currId != this.store.currStreamCardId &&
+      currId != "root"
+    ) {
+      const bound = this.helper.getCardCompBound(currId);
+      yOffset = bound.y + bound.h;
+    }
+
+    const currComp = this.helper.findComp(addedId) as DesignComp;
  
     //添加组件到当前选中的组件下面
     let xOffset = this.helper.designSizeToPx(
       375 - (currComp.layout.size?.[0] || 750) / 2
     );
     const obj = new CompObject(currComp);
+
+    const currCard = this.helper.findComp(cardId) as DesignComp;
+
     //没有选中组件添加到当前卡片最后
     const children = currCard.children.default || [];
     if (yOffset == 0 && children.length >= 2) {
-      const prevCompIndex = children.indexOf(compId) - 1;
+      const prevCompIndex = children.indexOf(addedId) - 1;
       const bound = this.helper.getCardCompBound(children[prevCompIndex]);
       yOffset = bound.y + bound.h;
     }
     obj.worldTransform.translate(xOffset, yOffset);
     currComp.layout.transformMatrix = obj.worldTransform.getMatrixStr();
-
-    this.actions.pickComp(compId);
+    this.actions.pickComp(addedId);
     this.helper.extendStreamCard(currCard.id);
     this.controls.cropCtrl.close();
-},
+  },
 
 
   // 通过拖拽添加组件到画布
-  async dragCompToDesign(event: MouseEvent, compKey: ICompKeys) {
-    await this.actions.addCompToDesign(compKey);
+  async dragCompToDesign(event: MouseEvent, compKey: string, data:any) {
+
+    const currCardDom = this.store.currStreamCard.$el;
+
+    if (compKey == "CompCard") {
+        const { result } = await this.https.getCompDetail(data.id, data.isSys);
+        const comp =  this.store.addUserCard(result);
+
+        const currCard = this.store.currStreamCard;
+        const compId = comp.id;
+        const childIds = [...(currCard.children.default || [])];
+        childIds.push(compId);
+        currCard.children.default = childIds;
+    
+        const addedComp = this.store.compMap[compId];
+        addedComp.layout.position = "absolute";
+
+        this.actions.pickComp(compId);
+
+    } else {
+        await this.actions.addCompToDesign(compKey as any);
+    }
 
     const cardPoints = this.helper.getPointOffsetWith(
       event,
-      this.store.currStreamCard.$el
+      currCardDom
     );
     const { currComp } = this.store;
     let selCtrl = this.controls.selectCtrl;
@@ -518,6 +544,42 @@ export const editActions = EditorModule.action({
     this.store.setCurrComp(groupComp.children.default?.[0] as string);
   },
 
+  createGroupComps() {
+    const selectCtrl = this.controls.selectCtrl;
+    const Objc = this.controls.selectCtrl.objContainer as ObjsContainer;
+    const id = this.controls.compUICtrl.createCompId("Group");
+    const comp = this.helper.findComp(id) as DesignComp;
+    comp.layout.position = "absolute";
+
+    //先删除现有的节点
+    const sels = this.store.selected.slice(0);
+    const chils = this.store.currStreamCard.children.default || [];
+    const newChilds  :any = [];
+    chils.forEach(c=>{
+      if (sels.indexOf(c) == -1) newChilds.push(c);
+    })
+
+    newChilds.push(id);
+    this.store.currStreamCard.children.default = newChilds;
+    
+    //更新节点的新位置
+    Objc.parent.children.forEach(obj=>{
+      const cobj = obj as CompObject;
+      const comp = cobj.comp;
+      comp.layout.transformMatrix = cobj.localTransform.getMatrixStr();
+    })
+     
+    //再添加新的节点
+    comp.layout.size = [this.helper.pxToDesignSize(Objc.width), this.helper.pxToDesignSize(Objc.height)];
+    comp.layout.transformMatrix = selectCtrl.transferStyle.matrix;
+    comp.children.default = sels;
+
+    this.actions.selectObjs([])
+    setTimeout(() => {
+      this.actions.pickComp(comp.id);
+    }, 0);
+  },
+
   handleSelectMoving(key: string) {
     if (this.store.selected.length < 1) return;
     let x = 0,

src/modules/editor/module/helpers/index.ts

@@ -119,7 +119,10 @@ export const helpers = EditorModule.helper({
   isShowSaveComp(comp: DesignComp): boolean {
     // if (!comp.children?.default || comp.children?.default?.length == 0)
     //   return false;
-    if (!this.helper.isCustomChildComp(comp)) return false;
+    if ( !this.helper.isStreamCardChild(comp.id) ) return false;
+
+    // if (!this.helper.isCustomChildComp(comp)) return false;
+    
     return true;
   },
 

src/modules/editor/module/https/index.ts

@@ -11,9 +11,12 @@ export const https = EditorModule.http({
       },
     });
   },
-  getCompDetail(id: string) {
+  getCompDetail(id: string, isSys = false) {
+    const params:any = {};
+    if (isSys) params.isSys = true;
     return this.request("/frame/detail/" + id, {
       method: "GET",
+      params
     });
   },
   saveDesign(data: Partial<DesignTemp>) {

src/modules/editor/objects/Toolbars/CompToolbars.ts

@@ -18,5 +18,6 @@ export const CompToolbars: ICompToolbars = {
   ],
   MultiSelector: [
     multiSelToolbar.delete,
+    toolbars.createGroup,
   ],
 };

src/modules/editor/objects/Toolbars/default.ts

@@ -197,6 +197,18 @@ export const toolbars = createToolbars({
       this.actions.cancelGroupComps(comp);
     },
   },
+   // 打组
+   createGroup: {
+    component: TipIcons.CancelGroup,
+    getVisible() {
+      return this.store.selected.length > 1;
+    },
+    onClick() {
+      console.log("打组");
+      this.actions.createGroupComps();
+    },
+  },
+
   //图片裁剪
   imageCropper: {
     component: TipIcons.Cropper,