添加卡片3

src/modules/editor/actions/edit.ts

@@ -24,6 +24,8 @@ export const editActions = EditorModule.action({
   },
   // 删除组件
   removeComp(compId: string) {
+    console.log("remove comp id=>", compId);
+      
     if (compId === this.store.currCompId) {
       this.store.currCompId = "";
     }

src/modules/editor/components/CompUI/customUI/Cards/Card3/component.tsx

@@ -0,0 +1,66 @@
+import { string } from "vue-types";
+import { useCompData } from ".";
+import { Image, Text } from "../../..";
+import { useEditor } from "../../../../..";
+import { createUIComp } from "../../../defines/createUIComp";
+import { css } from "@linaria/core";
+
+export const Component = createUIComp({
+  props: {
+    compId: string().isRequired,
+  },
+  setup(props) {
+    const { designToNaturalSize } = useEditor().helper;
+    const { value, children } = useCompData(props.compId);
+
+    return () => (
+      <div class="flex justify-between">
+        <div class="flex flex-col justify-center">
+          <Text.Component compId={children.text1.id} />
+          <Text.Component class="mt-0.07rem" compId={children.text2.id} />
+
+          <div class="flex justify-between mt-0.07rem">
+            <Image.Component
+                  class="rounded-1/2 overflow-hidden"
+                  style={{
+                  
+                  width: designToNaturalSize(51),
+                  height: designToNaturalSize(51),
+                  }}
+                  compId={children.item1.id}
+              />
+
+            <Image.Component
+                class="rounded-1/2 overflow-hidden"
+                style={{
+                width: designToNaturalSize(51),
+                height: designToNaturalSize(51),
+                }}
+                compId={children.item2.id}
+            />
+            
+            <Image.Component
+                class="rounded-1/2 overflow-hidden"
+                style={{
+                width: designToNaturalSize(51),
+                height: designToNaturalSize(51),
+                }}
+                compId={children.item3.id}
+            />
+          </div>
+        </div>
+        <Image.Component class="overflow-hidden"
+                    style={{
+                    width: designToNaturalSize(317),
+                    height: designToNaturalSize(240),
+                    }}
+                    compId={children.bgImg.id}
+                />
+        </div>
+    );
+  },
+});
+const upStyle = css`
+  position:relative;
+  
+`

src/modules/editor/components/CompUI/customUI/Cards/Card3/index.ts

@@ -0,0 +1,54 @@
+import { Dict_Imgs } from "@/dict";
+import { createAttrsForm } from "../../../defines/createAttrsForm";
+import { createOptions } from "../../../defines/createOptions";
+import { GroupNumber } from "../../../formItems/GroupNumber";
+
+export { Component } from "./component";
+
+const thumbnail = "https://sku3d-test.obs.cn-east-3.myhuaweicloud.com/queenshow/1685588983505_77BJpB_thumbnail.png"
+export const { options, useCompData } = createOptions({
+  name: "卡片3",
+  thumbnail:thumbnail,
+  value: {
+  },
+  layout: {
+    padding: "0.2rem",
+  },
+  children: {
+    bgImg: {
+      compKey: "Image",
+      value: { url: thumbnail, x: -25.00, y: -0.50, s: 2.1 },
+    },
+    item1: {
+        compKey: "Image",
+        value: { url: thumbnail, x: 37.00, y: -6, s: 11.00 },
+    },
+    item2: {
+        compKey: "Image",
+        value: { url: thumbnail, x: 24.00, y: -6, s: 11.15  },
+    },
+    item3: {
+        compKey: "Image",
+        value: { url: thumbnail, x: 11.00, y: -6, s: 11.70  },
+    },
+    text1: {
+        compKey: "Text",
+        value:  `<p><span style="color:hsl(0, 0%, 0%);font-size:14px;"><strong>P190注塑</strong></span></p>`,
+    },
+    text2: {
+        compKey: "Text",
+        value: `复古羊巴 / 2023年新品`,
+    },
+  },
+});
+
+export const Form = createAttrsForm([
+  {
+    label: "图片尺寸",
+    dataIndex: "value.imgSize",
+    component: GroupNumber,
+    props: {
+      labels: ["宽", "高"],
+    },
+  },
+]);

src/modules/editor/components/CompUI/index.ts

@@ -8,3 +8,4 @@ export * as Cover2 from "./customUI/Covers/Cover2";
 export * as Title1 from "./customUI/Titles/Title1";
 export * as Title2 from "./customUI/Titles/Title2";
 export * as Card2 from "./customUI/Cards/Card2";
+export * as Card3 from "./customUI/Cards/Card3";

src/modules/editor/stores/index.ts

@@ -74,15 +74,19 @@ export const store = EditorModule.store({
     deleteComp(compId: string) {
       const parentComp = this.helper.findParentComp(compId);
       if (parentComp) {
-        delete parentComp.children[compId];
-      } else {
+        console.log("find parent comp=>", parentComp)
+        compId = parentComp?.id;
+        // delete parentComp.children[compId];
+      }
+      
+      //  else {
         const index = this.store.designData.content.findIndex(
           (d) => d.id === compId
         );
         if (index !== -1) {
           this.store.designData.content.splice(index, 1);
         }
-      }
+      // }
     },
     moveComp(selIndex: number, targetIndex: number) {
       const { content } = this.store.designData;