queenshow/src/modules/editor/components/CompUI/customUI/Cards/Card/index.tsx

import { createAttrsForm } from "../../../defines/createAttrsForm";
import { createCompHooks } from "../../../defines/createCompHooks";
import { createCompId } from "../../../defines/createCompId";
import { GroupNumber } from "../../../formItems/GroupNumber";

export { Component } from "./component";

const thumb = require("@/assets/comps/card/thumbnail.png");

export const options = {
  name: "卡片",
  thumbnail: thumb,
};

export const { createComp, useCompData } = createCompHooks({
  value: {
    imgSize: [240, 240],
  },
  children: {
     img: ()=>createCompId("Image", {value: {url:thumb, x: 25.50, y: 7.00, s: 3.80}}),
     desc: ()=>createCompId("Text", {value: `<p><span style="font-size:16px;">名称 &nbsp; p190 (注塑)</span></p><p><span style="font-size:16px;">规格 &nbsp; 52英寸</span></p><p><span style="font-size:16px;">厚度 &nbsp;1.0mm+0.05mm</span></p><p><span style="font-size:16px;">底材 &nbsp;鹿皮绒</span></p><p><span style="font-size:16px;">用途 &nbsp;凉鞋、跟鞋、高更鞋、</span><br><span style="font-size:16px;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 时尚休闲鞋等</span></p>`})
  }
});

export const Form = createAttrsForm([
  {
    label: "图片尺寸",
    dataIndex: "value.imgSize",
    component: GroupNumber,
    props: {
      labels: ["宽", "高"],
    },
  },
]);