添加组件5

src/modules/editor/components/CompUI/basicUI/Text/component.tsx

@@ -34,7 +34,7 @@ export const Component = createUIComp({
         Alignment,
       ],
       fontSize: {
-        options: [12, 14, 16, 18, 20, 24, 28, 32, 38,42, 46],
+        options: [12, 14, 16, 18, 20, 24, 28, 32, 38,42, 46, 52, 60],
       },
       toolbar: {
         items: [

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

@@ -17,7 +17,7 @@ export const Component = createUIComp({
     return () => (
     <div>
       <Title3.Component   compId={children.title.id} />
-      <div class="flex justify-between">
+      <div class="flex">
         <div class="">
             <Image.Component class="overflow-hidden"
                         style={{
@@ -25,13 +25,10 @@ export const Component = createUIComp({
                             height: designToNaturalSize(278),
                         }}
                         compId={children.bgImg.id}
-                    />
+            />
         </div>
-        <div class="flex flex-col items-center justify-start">
+        <div class="flex flex-col justify-center" style={{marginLeft: designToNaturalSize(49)}}>
            <Text.Component compId={children.text1.id} />
-           <Text.Component class="mt-0.07rem" compId={children.text2.id} />
-           <Text.Component compId={children.text1.id} />
-           <Text.Component class="mt-0.07rem" compId={children.text2.id} />
         </div>
         </div>
         </div>

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

@@ -34,12 +34,8 @@ export const { options, useCompData } = createOptions({
     },
     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年新品`,
-    },
+        value:  `<p><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>名称: &nbsp; P190（注塑）</strong></span></p><p><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>规格: &nbsp; 52英寸</strong></span><br><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>厚度: &nbsp; 1.0mm+0.05mm</strong></span></p><p><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>底材: &nbsp; 鹿皮绒</strong></span></p><p><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>用途: &nbsp; 凉鞋、跟鞋、高更鞋、</strong></span><br><span style="color:hsl(0, 0%, 60%);font-size:14px;"><strong>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;时尚休闲鞋等</strong></span></p>`,
+    }
   },
 });
 

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

@@ -0,0 +1,35 @@
+import { string } from "vue-types";
+import { useCompData } from ".";
+import { Image, Text } from "../../../basicUI";
+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="relative w-full">
+            <div class="!absolute w-full h-full flex justify-center items-center">
+                <Text.Component class="!absolute w-full" compId={children.text1.id} />
+            </div>
+            <div class="flex justify-center">
+                <Image.Component 
+                            style={{
+                                width: designToNaturalSize(368),
+                                height: designToNaturalSize(275),
+                            }}
+                            compId={children.bgImg.id}  />
+            </div>
+        </div>
+    );
+  },
+});
+const upStyle = css`
+  position:relative;
+`

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

@@ -0,0 +1,40 @@
+
+
+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/1685607488598_3mmBXh_thumbnail.png"
+
+export const { options, useCompData } = createOptions({
+  name: "卡片5",
+  thumbnail:thumbnail,
+  value: {
+  },
+  layout: {
+
+  },
+  children: {
+    bgImg: {
+      compKey: "Image",
+      value: { url: "https://sku3d-test.obs.cn-east-3.myhuaweicloud.com/queenshow/1685609522134_nGPo9k_2.png" },
+    },
+    text1: {
+        compKey: "Text",
+        value:  `<p style="text-align:center;"><span style="color:hsl(0,0%,90%);font-size:52px;">F A SH I O N</span></p>`,
+    }
+  },
+});
+
+export const Form = createAttrsForm([
+  {
+    label: "图片尺寸",
+    dataIndex: "value.imgSize",
+    component: GroupNumber,
+    props: {
+      labels: ["宽", "高"],
+    },
+  },
+]);

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

@@ -3,6 +3,7 @@ export * as CardList from "./Cards/CardList";
 export * as Card2 from "./Cards/Card2";
 export * as Card3 from "./Cards/Card3";
 export * as Card4 from "./Cards/Card4";
+export * as Card5 from "./Cards/Card5";
 
 export * as Cover from "./Covers/Cover";
 export * as Cover2 from "./Covers/Cover2";