From d15ff4bc80ac918fd28cf53b056e352acca8892a Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Wed, 12 Nov 2025 22:55:02 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E3=80=90antd=E3=80=91=E3=80=90mall?=
 =?UTF-8?q?=E3=80=91diy-editor=20=E9=87=8C=E7=9A=84=20mobile=20=E5=90=84?=
 =?UTF-8?q?=E7=A7=8D=E4=BF=AE=E5=A4=8D=EF=BC=8C=E4=B8=8D=E9=99=90=E4=BA=8E?=
 =?UTF-8?q?=20Image=20=E7=9A=84=20preview=E3=80=81Form=20=E7=9A=84=20label?=
 =?UTF-8?q?-col=20=E7=9A=84=E5=AE=BD=E5=BA=A6=E3=80=81FormItem=20=E7=9A=84?=
 =?UTF-8?q?=20prop=20=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/mobile/carousel/property.vue   | 36 +++++++------
 .../components/mobile/coupon-card/index.vue   |  4 +-
 .../mobile/coupon-card/property.vue           |  2 +-
 .../mobile/floating-action-button/index.vue   |  6 +--
 .../components/mobile/hot-zone/property.vue   | 16 ++++--
 .../components/mobile/image-bar/property.vue  |  9 ++--
 .../components/mobile/magic-cube/index.vue    |  4 +-
 .../components/mobile/magic-cube/property.vue | 51 ++++++++++---------
 .../components/mobile/menu-grid/property.vue  | 25 +++++----
 .../components/mobile/menu-list/index.vue     |  9 +++-
 .../components/mobile/menu-list/property.vue  | 13 +++--
 .../components/mobile/menu-swiper/index.vue   |  2 +-
 .../mobile/menu-swiper/property.vue           |  1 +
 .../components/cell-property.vue              | 28 +++++-----
 .../components/mobile/notice-bar/property.vue |  1 +
 .../mobile/page-config/property.vue           |  1 +
 .../components/mobile/popover/index.vue       |  6 ++-
 .../components/mobile/popover/property.vue    |  2 +-
 .../components/mobile/product-card/index.vue  | 16 ++++--
 .../mobile/product-card/property.vue          |  2 +
 .../components/mobile/product-list/index.vue  | 12 ++---
 .../mobile/product-list/property.vue          | 17 ++++---
 .../mobile/promotion-article/index.vue        |  2 +-
 .../mobile/promotion-article/property.vue     |  4 +-
 .../mobile/promotion-combination/index.vue    | 22 +++++---
 .../mobile/promotion-combination/property.vue | 36 ++++++-------
 .../mobile/promotion-point/index.vue          | 22 +++++---
 .../mobile/promotion-point/property.vue       |  8 ++-
 .../mobile/promotion-seckill/index.vue        | 24 ++++++---
 .../mobile/promotion-seckill/property.vue     |  8 ++-
 .../components/mobile/search-bar/property.vue |  2 +-
 .../components/mobile/tab-bar/index.vue       |  1 +
 .../components/mobile/tab-bar/property.vue    |  1 +
 .../components/mobile/title-bar/index.vue     |  4 +-
 .../components/mobile/title-bar/property.vue  |  1 +
 .../components/mobile/user-card/index.vue     |  8 +--
 .../components/mobile/user-coupon/index.vue   |  1 +
 .../components/mobile/user-order/index.vue    |  1 +
 .../components/mobile/user-wallet/index.vue   |  1 +
 .../components/mobile/video-player/index.vue  |  1 +
 .../mobile/video-player/property.vue          |  1 +
 41 files changed, 252 insertions(+), 159 deletions(-)

diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/carousel/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/carousel/property.vue
index e13128ec0..bebf71f72 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/carousel/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/carousel/property.vue
@@ -34,41 +34,44 @@ const formData = useVModel(props, 'modelValue', emit);
 
 <template>
   <ComponentContainerProperty v-model="formData.style">
-    <Form label-width="80px" :model="formData">
+    <Form
+      :model="formData"
+      :label-col="{ style: { width: '80px' } }"
+      label-align="right"
+    >
       <p class="text-base font-bold">样式设置：</p>
       <div class="flex flex-col gap-2 rounded-md p-4 shadow-lg">
-        <FormItem label="样式" prop="type">
+        <FormItem label="样式">
           <RadioGroup v-model:value="formData.type">
-            <Tooltip class="item" content="默认" placement="bottom">
+            <Tooltip class="item" title="默认" placement="bottom">
               <RadioButton value="default">
                 <IconifyIcon icon="system-uicons:carousel" class="size-6" />
               </RadioButton>
             </Tooltip>
-            <Tooltip class="item" content="卡片" placement="bottom">
+            <Tooltip class="item" title="卡片" placement="bottom">
               <RadioButton value="card">
                 <IconifyIcon icon="ic:round-view-carousel" class="size-6" />
               </RadioButton>
             </Tooltip>
           </RadioGroup>
         </FormItem>
-        <FormItem label="高度" prop="height">
+        <FormItem label="高度">
           <InputNumber
             v-model:value="formData.height"
             class="mr-[10px] !w-1/2"
-            controls-position="right"
           />
           px
         </FormItem>
-        <FormItem label="指示器" prop="indicator">
+        <FormItem label="指示器">
           <RadioGroup v-model:value="formData.indicator">
             <Radio value="dot">小圆点</Radio>
             <Radio value="number">数字</Radio>
           </RadioGroup>
         </FormItem>
-        <FormItem label="是否轮播" prop="autoplay">
+        <FormItem label="是否轮播">
           <Switch v-model:checked="formData.autoplay" />
         </FormItem>
-        <FormItem label="播放间隔" prop="interval" v-if="formData.autoplay">
+        <FormItem label="播放间隔" v-if="formData.autoplay">
           <Slider
             v-model:value="formData.interval"
             :max="10"
@@ -82,18 +85,13 @@ const formData = useVModel(props, 'modelValue', emit);
       <div class="flex flex-col gap-2 rounded-md p-4 shadow-lg">
         <Draggable v-model="formData.items" :empty-item="{ type: 'img' }">
           <template #default="{ element }">
-            <FormItem label="类型" prop="type" class="mb-2" label-width="40px">
+            <FormItem label="类型" name="type">
               <RadioGroup v-model:value="element.type">
                 <Radio value="img">图片</Radio>
                 <Radio value="video">视频</Radio>
               </RadioGroup>
             </FormItem>
-            <FormItem
-              label="图片"
-              class="mb-2"
-              label-width="40px"
-              v-if="element.type === 'img'"
-            >
+            <FormItem label="图片" v-if="element.type === 'img'">
               <UploadImg
                 v-model="element.imgUrl"
                 draggable="false"
@@ -104,7 +102,7 @@ const formData = useVModel(props, 'modelValue', emit);
               />
             </FormItem>
             <template v-else>
-              <FormItem label="封面" class="mb-2" label-width="40px">
+              <FormItem label="封面">
                 <UploadImg
                   v-model="element.imgUrl"
                   draggable="false"
@@ -114,7 +112,7 @@ const formData = useVModel(props, 'modelValue', emit);
                   class="min-w-20"
                 />
               </FormItem>
-              <FormItem label="视频" class="mb-2" label-width="40px">
+              <FormItem label="视频">
                 <UploadFile
                   v-model="element.videoUrl"
                   :file-type="['mp4']"
@@ -124,7 +122,7 @@ const formData = useVModel(props, 'modelValue', emit);
                 />
               </FormItem>
             </template>
-            <FormItem label="链接" class="mb-2" label-width="40px">
+            <FormItem label="链接">
               <AppLinkInput v-model="element.url" />
             </FormItem>
           </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/index.vue
index 0a57272d7..2cb2f1348 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/index.vue
@@ -58,11 +58,11 @@ watch(
 
 /** 初始化 */
 onMounted(() => {
-  phoneWidth.value = containerRef.value?.wrapRef?.offsetWidth || 375;
+  phoneWidth.value = containerRef.value?.offsetWidth || 375;
 });
 </script>
 <template>
-  <div class="z-10 min-h-8" wrap-class="w-full" ref="containerRef">
+  <div class="z-10 min-h-8 overflow-x-auto" ref="containerRef">
     <div
       class="flex flex-row text-xs"
       :style="{
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/property.vue
index 40b2513d3..fc830eed8 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/coupon-card/property.vue
@@ -103,7 +103,7 @@ watch(
               >
                 减{{ floatToFixed2(coupon.discountPrice) }}元
               </span>
-              <span v-else> 打{{ (coupon.discountPercent ?? 0) / 10 }}折 </span>
+              <span v-else> 打{{ coupon.discountPercent }}折 </span>
             </Typography.Text>
           </Typography>
         </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
index ecf917b31..7451e8d87 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
@@ -36,7 +36,7 @@ function handleToggleFab() {
         :key="index"
         class="flex flex-col items-center"
       >
-        <Image :src="item.imgUrl" fit="contain" class="!h-7 !w-7">
+        <Image :src="item.imgUrl" :width="28" :height="28" :preview="false">
           <template #error>
             <div class="flex h-full w-full items-center justify-center">
               <IconifyIcon
@@ -57,7 +57,7 @@ function handleToggleFab() {
       </div>
     </template>
     <!-- todo: @owen 使用APP主题色 -->
-    <Button type="primary" size="large" circle @click="handleToggleFab">
+    <Button type="primary" size="large" shape="circle" @click="handleToggleFab">
       <IconifyIcon
         icon="lucide:plus"
         class="transition-transform duration-300"
@@ -68,7 +68,7 @@ function handleToggleFab() {
   <!-- 模态背景：展开时显示，点击后折叠 -->
   <div
     v-if="expanded"
-    class="absolute left-[calc(50%-384px/2)] top-0 z-[11] h-full w-[384px] bg-black/40"
+    class="absolute left-[calc(50%-375px/2)] top-0 z-[11] h-full w-[375px] bg-black/40"
     @click="handleToggleFab"
   ></div>
 </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/property.vue
index 9c1b5e2d0..cb669fe17 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/property.vue
@@ -31,20 +31,26 @@ function handleOpenEditDialog() {
 <template>
   <ComponentContainerProperty v-model="formData.style">
     <!-- 表单 -->
-    <Form label-width="80px" :model="formData" class="mt-2">
-      <FormItem label="上传图片" prop="imgUrl">
+    <Form
+      :label-col="{ style: { width: '80px' } }"
+      :model="formData"
+      class="mt-2"
+    >
+      <FormItem label="上传图片" name="imgUrl">
         <UploadImg
           v-model="formData.imgUrl"
           height="50px"
           width="auto"
           class="min-w-[80px]"
           :show-description="false"
-        />
-        <p class="text-xs text-gray-500">推荐宽度 750</p>
+        >
+          <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
+          <template #tip> 推荐宽度 750 </template>
+        </UploadImg>
       </FormItem>
     </Form>
 
-    <Button type="primary" plain class="w-full" @click="handleOpenEditDialog">
+    <Button type="primary" ghost class="w-full" @click="handleOpenEditDialog">
       设置热区
     </Button>
   </ComponentContainerProperty>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/property.vue
index b67f591ae..179b0134c 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/property.vue
@@ -26,7 +26,7 @@ const formData = useVModel(props, 'modelValue', emit);
       :wrapper-col="{ span: 18 }"
       :model="formData"
     >
-      <FormItem label="上传图片" prop="imgUrl">
+      <FormItem label="上传图片" name="imgUrl">
         <UploadImg
           v-model="formData.imgUrl"
           draggable="false"
@@ -34,9 +34,12 @@ const formData = useVModel(props, 'modelValue', emit);
           width="100%"
           class="min-w-20"
           :show-description="false"
-        />
+        >
+          <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
+          <template #tip> 建议宽度750 </template>
+        </UploadImg>
       </FormItem>
-      <FormItem label="链接" prop="url">
+      <FormItem label="链接" name="url">
         <AppLinkInput v-model="formData.url" />
       </FormItem>
     </Form>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/index.vue
index 1d7ecf89a..bd91a7f31 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/index.vue
@@ -55,9 +55,9 @@ const rowCount = computed(() => {
       }"
     >
       <Image
-        class="h-full w-full"
-        fit="cover"
+        class="h-full w-full object-cover"
         :src="item.imgUrl"
+        :preview="false"
         :style="{
           borderTopLeftRadius: `${property.borderRadiusTop}px`,
           borderTopRightRadius: `${property.borderRadiusTop}px`,
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/property.vue
index 62573bcc0..a6df2228d 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/magic-cube/property.vue
@@ -33,31 +33,36 @@ const handleHotAreaSelected = (_: any, index: number) => {
 
 <template>
   <ComponentContainerProperty v-model="formData.style">
-    <Form :model="formData" class="mt-2">
+    <Form
+      :model="formData"
+      :label-col="{ style: { width: '80px' } }"
+      label-align="right"
+    >
       <p class="text-base font-bold">魔方设置：</p>
-      <MagicCubeEditor
-        class="my-4"
-        v-model="formData.list"
-        :rows="4"
-        :cols="4"
-        @hot-area-selected="handleHotAreaSelected"
-      />
-      <template v-for="(hotArea, index) in formData.list" :key="index">
-        <template v-if="selectedHotAreaIndex === index">
-          <FormItem label="上传图片" :name="`list[${index}].imgUrl`">
-            <UploadImg
-              v-model="hotArea.imgUrl"
-              height="80px"
-              width="80px"
-              :show-description="false"
-            />
-          </FormItem>
-          <FormItem label="链接" :name="`list[${index}].url`">
-            <AppLinkInput v-model="hotArea.url" />
-          </FormItem>
+      <div class="flex flex-col gap-2 rounded-md p-4 shadow-lg">
+        <p class="text-xs text-gray-500">每格尺寸 187 * 187</p>
+        <MagicCubeEditor
+          v-model="formData.list"
+          :rows="4"
+          :cols="4"
+          @hot-area-selected="handleHotAreaSelected"
+        />
+        <template v-for="(hotArea, index) in formData.list" :key="index">
+          <template v-if="selectedHotAreaIndex === index">
+            <FormItem label="上传图片" :name="`list[${index}].imgUrl`">
+              <UploadImg
+                v-model="hotArea.imgUrl"
+                height="80px"
+                width="80px"
+                :show-description="false"
+              />
+            </FormItem>
+            <FormItem label="链接" :name="`list[${index}].url`">
+              <AppLinkInput v-model="hotArea.url" />
+            </FormItem>
+          </template>
         </template>
-      </template>
-      <!-- TODO @芋艿：距离不一致，需要看看怎么统一； -->
+      </div>
       <FormItem label="上圆角" name="borderRadiusTop">
         <Slider v-model:value="formData.borderRadiusTop" :max="100" :min="0" />
       </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-grid/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-grid/property.vue
index 25bb580bb..eac0f2ce9 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-grid/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-grid/property.vue
@@ -28,8 +28,12 @@ const formData = useVModel(props, 'modelValue', emit);
 <template>
   <ComponentContainerProperty v-model="formData.style">
     <!-- 表单 -->
-    <Form label-width="80px" :model="formData" class="mt-2">
-      <FormItem label="每行数量" prop="column">
+    <Form
+      :label-col="{ style: { width: '80px' } }"
+      :model="formData"
+      class="mt-2"
+    >
+      <FormItem label="每行数量" name="column">
         <RadioGroup v-model:value="formData.column">
           <Radio :value="3">3个</Radio>
           <Radio :value="4">4个</Radio>
@@ -42,42 +46,43 @@ const formData = useVModel(props, 'modelValue', emit);
           :empty-item="EMPTY_MENU_GRID_ITEM_PROPERTY"
         >
           <template #default="{ element }">
-            <FormItem label="图标" prop="iconUrl">
+            <FormItem label="图标" name="iconUrl">
               <UploadImg
                 v-model="element.iconUrl"
                 height="80px"
                 width="80px"
                 :show-description="false"
               >
+                <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
                 <template #tip> 建议尺寸：44 * 44</template>
               </UploadImg>
             </FormItem>
-            <FormItem label="标题" prop="title">
+            <FormItem label="标题" name="title">
               <InputWithColor
                 v-model="element.title"
                 v-model:color="element.titleColor"
               />
             </FormItem>
-            <FormItem label="副标题" prop="subtitle">
+            <FormItem label="副标题" name="subtitle">
               <InputWithColor
                 v-model="element.subtitle"
                 v-model:color="element.subtitleColor"
               />
             </FormItem>
-            <FormItem label="链接" prop="url">
+            <FormItem label="链接" name="url">
               <AppLinkInput v-model="element.url" />
             </FormItem>
-            <FormItem label="显示角标" prop="badge.show">
-              <Switch v-model="element.badge.show" />
+            <FormItem label="显示角标" name="badge.show">
+              <Switch v-model:checked="element.badge.show" />
             </FormItem>
             <template v-if="element.badge.show">
-              <FormItem label="角标内容" prop="badge.text">
+              <FormItem label="角标内容" name="badge.text">
                 <InputWithColor
                   v-model="element.badge.text"
                   v-model:color="element.badge.textColor"
                 />
               </FormItem>
-              <FormItem label="背景颜色" prop="badge.bgColor">
+              <FormItem label="背景颜色" name="badge.bgColor">
                 <ColorInput v-model="element.badge.bgColor" />
               </FormItem>
             </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue
index 88606b4eb..e0e3c8496 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue
@@ -19,7 +19,12 @@ defineProps<{ property: MenuListProperty }>();
       class="flex h-10 flex-row items-center justify-between gap-1 border-t border-gray-200 px-3 first:border-t-0"
     >
       <div class="flex flex-1 flex-row items-center gap-2">
-        <Image v-if="item.iconUrl" class="h-4 w-4" :src="item.iconUrl" />
+        <Image
+          v-if="item.iconUrl"
+          class="h-4 w-4"
+          :src="item.iconUrl"
+          :preview="false"
+        />
         <span class="text-base" :style="{ color: item.titleColor }">
           {{ item.title }}
         </span>
@@ -28,7 +33,7 @@ defineProps<{ property: MenuListProperty }>();
         <span class="text-xs" :style="{ color: item.subtitleColor }">
           {{ item.subtitle }}
         </span>
-        <IconifyIcon icon="lucide:arrow-right" class="size-4" />
+        <IconifyIcon icon="ep:arrow-right" color="#000" :size="16" />
       </div>
     </div>
   </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue
index 33bc46ac7..cc771fb2b 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue
@@ -27,7 +27,12 @@ const formData = useVModel(props, 'modelValue', emit);
 <template>
   <ComponentContainerProperty v-model="formData.style">
     <p class="text-base font-bold">菜单设置</p>
-    <Form :model="formData" class="mt-2">
+    <p class="text-xs text-gray-500">拖动左侧的小圆点可以调整顺序</p>
+    <Form
+      :label-col="{ style: { width: '60px' } }"
+      :model="formData"
+      class="mt-2"
+    >
       <Draggable
         v-model="formData.list"
         :empty-item="EMPTY_MENU_LIST_ITEM_PROPERTY"
@@ -39,8 +44,10 @@ const formData = useVModel(props, 'modelValue', emit);
               height="80px"
               width="80px"
               :show-description="false"
-            />
-            <p class="text-sm text-gray-500">建议尺寸：44 * 44</p>
+            >
+              <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
+              <template #tip> 建议尺寸：44 * 44 </template>
+            </UploadImg>
           </FormItem>
           <FormItem label="标题" name="title">
             <InputWithColor
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/index.vue
index 8bee2e656..4f382957d 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/index.vue
@@ -3,7 +3,7 @@ import type { MenuSwiperItemProperty, MenuSwiperProperty } from './config';
 
 import { ref, watch } from 'vue';
 
-import { Image } from 'ant-design-vue';
+import { Carousel, Image } from 'ant-design-vue';
 
 /** 菜单导航 */
 defineOptions({ name: 'MenuSwiper' });
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/property.vue
index caaa091e9..5f1e581de 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/menu-swiper/property.vue
@@ -69,6 +69,7 @@ const formData = useVModel(props, 'modelValue', emit);
                 width="80px"
                 :show-description="false"
               >
+                <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
                 <template #tip> 建议尺寸：98 * 98 </template>
               </UploadImg>
             </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/navigation-bar/components/cell-property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/navigation-bar/components/cell-property.vue
index 3488e679a..966bb0156 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/navigation-bar/components/cell-property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/navigation-bar/components/cell-property.vue
@@ -91,7 +91,7 @@ function handleHotAreaSelected(
   </div>
   <template v-for="(cell, cellIndex) in cellList" :key="cellIndex">
     <template v-if="selectedHotAreaIndex === Number(cellIndex)">
-      <FormItem :prop="`cell[${cellIndex}].type`" label="类型">
+      <FormItem :name="`cell[${cellIndex}].type`" label="类型">
         <RadioGroup
           v-model:value="cell.type"
           @change="handleHotAreaSelected(cell, cellIndex)"
@@ -103,19 +103,19 @@ function handleHotAreaSelected(
       </FormItem>
       <!-- 1. 文字 -->
       <template v-if="cell.type === 'text'">
-        <FormItem :prop="`cell[${cellIndex}].text`" label="内容">
+        <FormItem :name="`cell[${cellIndex}].text`" label="内容">
           <Input v-model:value="cell!.text" :maxlength="10" show-count />
         </FormItem>
-        <FormItem :prop="`cell[${cellIndex}].text`" label="颜色">
+        <FormItem :name="`cell[${cellIndex}].text`" label="颜色">
           <ColorInput v-model="cell!.textColor" />
         </FormItem>
-        <FormItem :prop="`cell[${cellIndex}].url`" label="链接">
+        <FormItem :name="`cell[${cellIndex}].url`" label="链接">
           <AppLinkInput v-model="cell.url" />
         </FormItem>
       </template>
       <!-- 2. 图片 -->
       <template v-else-if="cell.type === 'image'">
-        <FormItem :prop="`cell[${cellIndex}].imgUrl`" label="图片">
+        <FormItem :name="`cell[${cellIndex}].imgUrl`" label="图片">
           <UploadImg
             v-model="cell.imgUrl"
             :limit="1"
@@ -125,39 +125,39 @@ function handleHotAreaSelected(
           />
           <span class="text-xs text-gray-500">建议尺寸 56*56</span>
         </FormItem>
-        <FormItem :prop="`cell[${cellIndex}].url`" label="链接">
+        <FormItem :name="`cell[${cellIndex}].url`" label="链接">
           <AppLinkInput v-model="cell.url" />
         </FormItem>
       </template>
       <!-- 3. 搜索框 -->
       <template v-else>
-        <FormItem label="框体颜色" prop="backgroundColor">
+        <FormItem label="框体颜色" name="backgroundColor">
           <ColorInput v-model="cell.backgroundColor" />
         </FormItem>
-        <FormItem class="lef" label="文本颜色" prop="textColor">
+        <FormItem class="lef" label="文本颜色" name="textColor">
           <ColorInput v-model="cell.textColor" />
         </FormItem>
-        <FormItem :prop="`cell[${cellIndex}].placeholder`" label="提示文字">
+        <FormItem :name="`cell[${cellIndex}].placeholder`" label="提示文字">
           <Input v-model:value="cell.placeholder" :maxlength="10" show-count />
         </FormItem>
-        <FormItem label="文本位置" prop="placeholderPosition">
+        <FormItem label="文本位置" name="placeholderPosition">
           <RadioGroup v-model:value="cell!.placeholderPosition">
-            <Tooltip content="居左" placement="top">
+            <Tooltip title="居左" placement="top">
               <RadioButton value="left">
                 <IconifyIcon icon="ant-design:align-left-outlined" />
               </RadioButton>
             </Tooltip>
-            <Tooltip content="居中" placement="top">
+            <Tooltip title="居中" placement="top">
               <RadioButton value="center">
                 <IconifyIcon icon="ant-design:align-center-outlined" />
               </RadioButton>
             </Tooltip>
           </RadioGroup>
         </FormItem>
-        <FormItem label="扫一扫" prop="showScan">
+        <FormItem label="扫一扫" name="showScan">
           <Switch v-model:checked="cell!.showScan" />
         </FormItem>
-        <FormItem :prop="`cell[${cellIndex}].borderRadius`" label="圆角">
+        <FormItem :name="`cell[${cellIndex}].borderRadius`" label="圆角">
           <Slider v-model:value="cell.borderRadius" :max="100" :min="0" />
         </FormItem>
       </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/notice-bar/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/notice-bar/property.vue
index fef33c016..f32b63410 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/notice-bar/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/notice-bar/property.vue
@@ -35,6 +35,7 @@ const rules = {
           height="48px"
           :show-description="false"
         >
+          <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
           <template #tip>建议尺寸：24 * 24</template>
         </UploadImg>
       </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/page-config/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/page-config/property.vue
index 566574d03..5c06402ef 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/page-config/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/page-config/property.vue
@@ -35,6 +35,7 @@ const formData = useVModel(props, 'modelValue', emit);
         :limit="1"
         :show-description="false"
       >
+        <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
         <template #tip>建议宽度 750px</template>
       </UploadImg>
     </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/index.vue
index 64f76a98d..4d8cd9e40 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/index.vue
@@ -31,7 +31,11 @@ function handleActive(index: number) {
     }"
     @click="handleActive(index)"
   >
-    <Image :src="item.imgUrl" fit="contain" class="h-full w-full">
+    <Image
+      :src="item.imgUrl"
+      :preview="false"
+      class="h-full w-full object-contain"
+    >
       <template #error>
         <div class="flex h-full w-full items-center justify-center">
           <IconifyIcon icon="lucide:image" />
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/property.vue
index bd40e4330..1f29e08df 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/popover/property.vue
@@ -18,7 +18,7 @@ const formData = useVModel(props, 'modelValue', emit);
 </script>
 
 <template>
-  <Form :model="formData">
+  <Form :label-col="{ style: { width: '80px' } }" :model="formData">
     <Draggable v-model="formData.list" :empty-item="{ showType: 'once' }">
       <template #default="{ element, index }">
         <FormItem label="图片" :name="`list[${index}].imgUrl`">
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/index.vue
index 1db1c3879..0eb3b26bb 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/index.vue
@@ -72,7 +72,11 @@ function calculateWidth() {
         v-if="property.badge.show && property.badge.imgUrl"
         class="absolute left-0 top-0 z-[1] items-center justify-center"
       >
-        <Image fit="cover" :src="property.badge.imgUrl" class="h-6 w-8" />
+        <Image
+          :src="property.badge.imgUrl"
+          :preview="false"
+          class="h-6 w-8 object-cover"
+        />
       </div>
       <!-- 商品封面图 -->
       <div
@@ -84,7 +88,11 @@ function calculateWidth() {
           },
         ]"
       >
-        <Image fit="cover" class="h-full w-full" :src="spu.picUrl" />
+        <Image
+          class="h-full w-full object-cover"
+          :src="spu.picUrl"
+          :preview="false"
+        />
       </div>
       <div
         class="box-border flex flex-col gap-2 p-2"
@@ -168,9 +176,9 @@ function calculateWidth() {
         <!-- 图片按钮 -->
         <Image
           v-else
-          class="size-7 rounded-full"
-          fit="cover"
+          class="size-7 rounded-full object-cover"
           :src="property.btnBuy.imgUrl"
+          :preview="false"
         />
       </div>
     </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/property.vue
index 701b9f694..e15f975fe 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-card/property.vue
@@ -116,6 +116,7 @@ const formData = useVModel(props, 'modelValue', emit);
             width="72px"
             :show-description="false"
           >
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip> 建议尺寸：36 * 22 </template>
           </UploadImg>
         </FormItem>
@@ -146,6 +147,7 @@ const formData = useVModel(props, 'modelValue', emit);
               width="56px"
               :show-description="false"
             >
+              <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
               <template #tip> 建议尺寸：56 * 56 </template>
             </UploadImg>
           </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/index.vue
index 063f795c9..39a3887f0 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/index.vue
@@ -69,11 +69,11 @@ watch(
 
 /** 初始化 */
 onMounted(() => {
-  phoneWidth.value = containerRef.value?.wrapRef?.offsetWidth || 375;
+  phoneWidth.value = containerRef.value?.offsetWidth || 375;
 });
 </script>
 <template>
-  <div class="z-10 min-h-[30px]" wrap-class="w-full" ref="containerRef">
+  <div class="z-10 min-h-[30px] w-full" ref="containerRef">
     <!-- 商品网格 -->
     <div
       class="grid overflow-x-auto"
@@ -101,16 +101,16 @@ onMounted(() => {
           class="absolute left-0 top-0 z-10 items-center justify-center"
         >
           <Image
-            fit="cover"
             :src="property.badge.imgUrl"
-            class="h-[26px] w-[38px]"
+            :preview="false"
+            class="h-[26px] w-[38px] object-cover"
           />
         </div>
         <!-- 商品封面图 -->
         <Image
-          fit="cover"
           :src="spu.picUrl"
-          :style="{ width: imageSize, height: imageSize }"
+          :style="{ width: imageSize, height: imageSize, objectFit: 'cover' }"
+          :preview="false"
         />
         <div
           class="box-border flex flex-col gap-2 p-2"
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/property.vue
index 7984bfff0..ed3985b97 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/product-list/property.vue
@@ -43,7 +43,7 @@ const formData = useVModel(props, 'modelValue', emit);
         <SpuShowcase v-model="formData.spuIds" />
       </Card>
       <Card title="商品样式" class="property-group" :bordered="false">
-        <FormItem label="布局" prop="type">
+        <FormItem label="布局" name="type">
           <RadioGroup v-model:value="formData.layoutType">
             <Tooltip title="双列" placement="bottom">
               <RadioButton value="twoCol">
@@ -68,13 +68,13 @@ const formData = useVModel(props, 'modelValue', emit);
             </Tooltip>
           </RadioGroup>
         </FormItem>
-        <FormItem label="商品名称" prop="fields.name.show">
+        <FormItem label="商品名称" name="fields.name.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.name.color" />
             <Checkbox v-model:checked="formData.fields.name.show" />
           </div>
         </FormItem>
-        <FormItem label="商品价格" prop="fields.price.show">
+        <FormItem label="商品价格" name="fields.price.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.price.color" />
             <Checkbox v-model:checked="formData.fields.price.show" />
@@ -82,36 +82,37 @@ const formData = useVModel(props, 'modelValue', emit);
         </FormItem>
       </Card>
       <Card title="角标" class="property-group" :bordered="false">
-        <FormItem label="角标" prop="badge.show">
+        <FormItem label="角标" name="badge.show">
           <Switch v-model:checked="formData.badge.show" />
         </FormItem>
-        <FormItem label="角标" prop="badge.imgUrl" v-if="formData.badge.show">
+        <FormItem label="角标" name="badge.imgUrl" v-if="formData.badge.show">
           <UploadImg
             v-model="formData.badge.imgUrl"
             height="44px"
             width="72px"
             :show-description="false"
           >
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip> 建议尺寸：36 * 22 </template>
           </UploadImg>
         </FormItem>
       </Card>
       <Card title="商品样式" class="property-group" :bordered="false">
-        <FormItem label="上圆角" prop="borderRadiusTop">
+        <FormItem label="上圆角" name="borderRadiusTop">
           <Slider
             v-model:value="formData.borderRadiusTop"
             :max="100"
             :min="0"
           />
         </FormItem>
-        <FormItem label="下圆角" prop="borderRadiusBottom">
+        <FormItem label="下圆角" name="borderRadiusBottom">
           <Slider
             v-model:value="formData.borderRadiusBottom"
             :max="100"
             :min="0"
           />
         </FormItem>
-        <FormItem label="间隔" prop="space">
+        <FormItem label="间隔" name="space">
           <Slider v-model:value="formData.space" :max="100" :min="0" />
         </FormItem>
       </Card>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/index.vue
index 625be419a..cb90e63f2 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/index.vue
@@ -27,5 +27,5 @@ watch(
 );
 </script>
 <template>
-  <div class="min-h-8" v-dompurify-html="article?.content"></div>
+  <div class="min-h-[30px]" v-dompurify-html="article?.content"></div>
 </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/property.vue
index cab29484b..2024181b9 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-article/property.vue
@@ -48,12 +48,12 @@ onMounted(() => {
       :wrapper-col="{ span: 18 }"
       :model="formData"
     >
-      <FormItem label="文章" prop="id">
+      <FormItem label="文章" name="id">
         <Select
           v-model:value="formData.id"
           placeholder="请选择文章"
           class="w-full"
-          filterable
+          :show-search="true"
           :loading="loading"
           :options="
             articles.map((item: any) => ({ label: item.title, value: item.id }))
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/index.vue
index 4dee43418..713d226f9 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/index.vue
@@ -111,26 +111,34 @@ function calculateWidth() {
         v-if="property.badge.show"
         class="absolute left-0 top-0 z-[1] items-center justify-center"
       >
-        <Image fit="cover" :src="property.badge.imgUrl" class="h-6 w-8" />
+        <Image
+          :src="property.badge.imgUrl"
+          class="h-6 w-8 object-cover"
+          :preview="false"
+        />
       </div>
       <!-- 商品封面图 -->
       <div
-        class="h-36"
+        class="h-[140px]"
         :class="[
           {
             'w-full': property.layoutType !== 'oneColSmallImg',
-            'w-36': property.layoutType === 'oneColSmallImg',
+            'w-[140px]': property.layoutType === 'oneColSmallImg',
           },
         ]"
       >
-        <Image fit="cover" class="h-full w-full" :src="spu.picUrl" />
+        <Image
+          class="h-full w-full object-cover"
+          :src="spu.picUrl"
+          :preview="false"
+        />
       </div>
       <div
         class="box-border flex flex-col gap-2 p-2"
         :class="[
           {
             'w-full': property.layoutType !== 'oneColSmallImg',
-            'w-[calc(100vw-36px-16px)]':
+            'w-[calc(100%-140px-16px)]':
               property.layoutType === 'oneColSmallImg',
           },
         ]"
@@ -208,9 +216,9 @@ function calculateWidth() {
         <!-- 图片按钮 -->
         <Image
           v-else
-          class="size-7 rounded-full"
-          fit="cover"
+          class="size-7 rounded-full object-cover"
           :src="property.btnBuy.imgUrl"
+          :preview="false"
         />
       </div>
     </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/property.vue
index b1ee9c74a..709d6063d 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-combination/property.vue
@@ -44,7 +44,7 @@ const formData = useVModel(props, 'modelValue', emit);
         <CombinationShowcase v-model="formData.activityIds" />
       </Card>
       <Card title="商品样式" class="property-group" :bordered="false">
-        <FormItem label="布局" prop="type">
+        <FormItem label="布局" name="type">
           <RadioGroup v-model:value="formData.layoutType">
             <Tooltip title="单列大图" placement="bottom">
               <RadioButton value="oneColBigImg">
@@ -72,37 +72,37 @@ const formData = useVModel(props, 'modelValue', emit);
             </Tooltip>
           </RadioGroup>
         </FormItem>
-        <FormItem label="商品名称" prop="fields.name.show">
+        <FormItem label="商品名称" name="fields.name.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.name.color" />
             <Checkbox v-model:checked="formData.fields.name.show" />
           </div>
         </FormItem>
-        <FormItem label="商品简介" prop="fields.introduction.show">
+        <FormItem label="商品简介" name="fields.introduction.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.introduction.color" />
             <Checkbox v-model:checked="formData.fields.introduction.show" />
           </div>
         </FormItem>
-        <FormItem label="商品价格" prop="fields.price.show">
+        <FormItem label="商品价格" name="fields.price.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.price.color" />
             <Checkbox v-model:checked="formData.fields.price.show" />
           </div>
         </FormItem>
-        <FormItem label="市场价" prop="fields.marketPrice.show">
+        <FormItem label="市场价" name="fields.marketPrice.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.marketPrice.color" />
             <Checkbox v-model:checked="formData.fields.marketPrice.show" />
           </div>
         </FormItem>
-        <FormItem label="商品销量" prop="fields.salesCount.show">
+        <FormItem label="商品销量" name="fields.salesCount.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.salesCount.color" />
             <Checkbox v-model:checked="formData.fields.salesCount.show" />
           </div>
         </FormItem>
-        <FormItem label="商品库存" prop="fields.stock.show">
+        <FormItem label="商品库存" name="fields.stock.show">
           <div class="flex gap-2">
             <ColorInput v-model="formData.fields.stock.color" />
             <Checkbox v-model:checked="formData.fields.stock.show" />
@@ -110,62 +110,64 @@ const formData = useVModel(props, 'modelValue', emit);
         </FormItem>
       </Card>
       <Card title="角标" class="property-group" :bordered="false">
-        <FormItem label="角标" prop="badge.show">
+        <FormItem label="角标" name="badge.show">
           <Switch v-model:checked="formData.badge.show" />
         </FormItem>
-        <FormItem label="角标" prop="badge.imgUrl" v-if="formData.badge.show">
+        <FormItem label="角标" name="badge.imgUrl" v-if="formData.badge.show">
           <UploadImg v-model="formData.badge.imgUrl" height="44px" width="72px">
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip> 建议尺寸：36 * 22</template>
           </UploadImg>
         </FormItem>
       </Card>
       <Card title="按钮" class="property-group" :bordered="false">
-        <FormItem label="按钮类型" prop="btnBuy.type">
+        <FormItem label="按钮类型" name="btnBuy.type">
           <RadioGroup v-model:value="formData.btnBuy.type">
             <RadioButton value="text">文字</RadioButton>
             <RadioButton value="img">图片</RadioButton>
           </RadioGroup>
         </FormItem>
         <template v-if="formData.btnBuy.type === 'text'">
-          <FormItem label="按钮文字" prop="btnBuy.text">
+          <FormItem label="按钮文字" name="btnBuy.text">
             <Input v-model:value="formData.btnBuy.text" />
           </FormItem>
-          <FormItem label="左侧背景" prop="btnBuy.bgBeginColor">
+          <FormItem label="左侧背景" name="btnBuy.bgBeginColor">
             <ColorInput v-model="formData.btnBuy.bgBeginColor" />
           </FormItem>
-          <FormItem label="右侧背景" prop="btnBuy.bgEndColor">
+          <FormItem label="右侧背景" name="btnBuy.bgEndColor">
             <ColorInput v-model="formData.btnBuy.bgEndColor" />
           </FormItem>
         </template>
         <template v-else>
-          <FormItem label="图片" prop="btnBuy.imgUrl">
+          <FormItem label="图片" name="btnBuy.imgUrl">
             <UploadImg
               v-model="formData.btnBuy.imgUrl"
               height="56px"
               width="56px"
               :show-description="false"
             >
+              <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
               <template #tip> 建议尺寸：56 * 56</template>
             </UploadImg>
           </FormItem>
         </template>
       </Card>
       <Card title="商品样式" class="property-group" :bordered="false">
-        <FormItem label="上圆角" prop="borderRadiusTop">
+        <FormItem label="上圆角" name="borderRadiusTop">
           <Slider
             v-model:value="formData.borderRadiusTop"
             :max="100"
             :min="0"
           />
         </FormItem>
-        <FormItem label="下圆角" prop="borderRadiusBottom">
+        <FormItem label="下圆角" name="borderRadiusBottom">
           <Slider
             v-model:value="formData.borderRadiusBottom"
             :max="100"
             :min="0"
           />
         </FormItem>
-        <FormItem label="间隔" prop="space">
+        <FormItem label="间隔" name="space">
           <Slider v-model:value="formData.space" :max="100" :min="0" />
         </FormItem>
       </Card>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/index.vue
index 1011e27a3..75ca01b2c 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/index.vue
@@ -88,7 +88,7 @@ function calculateWidth() {
 <template>
   <div
     ref="containerRef"
-    class="box-content flex min-h-9 w-full flex-row flex-wrap"
+    class="box-content flex min-h-[30px] w-full flex-row flex-wrap"
   >
     <div
       v-for="(spu, index) in spuList"
@@ -108,19 +108,27 @@ function calculateWidth() {
         v-if="property.badge.show"
         class="absolute left-0 top-0 z-[1] items-center justify-center"
       >
-        <Image :src="property.badge.imgUrl" class="h-6 w-10" fit="cover" />
+        <Image
+          :src="property.badge.imgUrl"
+          class="h-6 w-10 object-cover"
+          :preview="false"
+        />
       </div>
       <!-- 商品封面图 -->
       <div
-        class="h-36"
+        class="h-[140px]"
         :class="[
           {
             'w-full': property.layoutType !== 'oneColSmallImg',
-            'w-36': property.layoutType === 'oneColSmallImg',
+            'w-[140px]': property.layoutType === 'oneColSmallImg',
           },
         ]"
       >
-        <Image :src="spu.picUrl" class="h-full w-full" fit="cover" />
+        <Image
+          :src="spu.picUrl"
+          class="h-full w-full object-cover"
+          :preview="false"
+        />
       </div>
       <div
         class="box-border flex flex-col gap-2 p-2"
@@ -211,8 +219,8 @@ function calculateWidth() {
         <Image
           v-else
           :src="property.btnBuy.imgUrl"
-          class="size-7 rounded-full"
-          fit="cover"
+          class="size-7 rounded-full object-cover"
+          :preview="false"
         />
       </div>
     </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/property.vue
index dd01a66b0..4a729e956 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-point/property.vue
@@ -33,7 +33,11 @@ const formData = useVModel(props, 'modelValue', emit);
 
 <template>
   <ComponentContainerProperty v-model="formData.style">
-    <Form :model="formData">
+    <Form
+      :model="formData"
+      :label-col="{ span: 6 }"
+      :wrapper-col="{ span: 18 }"
+    >
       <Card title="积分商城活动" class="property-group">
         <PointShowcase v-model="formData.activityIds" />
       </Card>
@@ -114,6 +118,7 @@ const formData = useVModel(props, 'modelValue', emit);
             width="72px"
             :show-description="false"
           >
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip> 建议尺寸：36 * 22 </template>
           </UploadImg>
         </FormItem>
@@ -144,6 +149,7 @@ const formData = useVModel(props, 'modelValue', emit);
               width="56px"
               :show-description="false"
             >
+              <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
               <template #tip> 建议尺寸：56 * 56 </template>
             </UploadImg>
           </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/index.vue
index 74af60c87..bc0b2fc5f 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/index.vue
@@ -87,7 +87,7 @@ function calculateWidth() {
 </script>
 <template>
   <div
-    class="box-content flex min-h-9 w-full flex-row flex-wrap"
+    class="box-content flex min-h-[30px] w-full flex-row flex-wrap"
     ref="containerRef"
   >
     <div
@@ -108,26 +108,34 @@ function calculateWidth() {
         v-if="property.badge.show"
         class="absolute left-0 top-0 z-[1] items-center justify-center"
       >
-        <Image fit="cover" :src="property.badge.imgUrl" class="h-6 w-8" />
+        <Image
+          :src="property.badge.imgUrl"
+          class="h-6 w-8 object-cover"
+          :preview="false"
+        />
       </div>
       <!-- 商品封面图 -->
       <div
-        class="h-36"
+        class="h-[140px]"
         :class="[
           {
             'w-full': property.layoutType !== 'oneColSmallImg',
-            'w-36': property.layoutType === 'oneColSmallImg',
+            'w-[140px]': property.layoutType === 'oneColSmallImg',
           },
         ]"
       >
-        <Image fit="cover" class="h-full w-full" :src="spu.picUrl" />
+        <Image
+          class="h-full w-full object-cover"
+          :src="spu.picUrl"
+          :preview="false"
+        />
       </div>
       <div
         class="box-border flex flex-col gap-2 p-2"
         :class="[
           {
             'w-full': property.layoutType !== 'oneColSmallImg',
-            'w-[calc(100vw-140px-16px)]':
+            'w-[calc(100%-140px-16px)]':
               property.layoutType === 'oneColSmallImg',
           },
         ]"
@@ -205,9 +213,9 @@ function calculateWidth() {
         <!-- 图片按钮 -->
         <Image
           v-else
-          class="size-7 rounded-full"
-          fit="cover"
+          class="size-7 rounded-full object-cover"
           :src="property.btnBuy.imgUrl"
+          :preview="false"
         />
       </div>
     </div>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/property.vue
index cad3dac6f..0ab48b76d 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/promotion-seckill/property.vue
@@ -35,7 +35,11 @@ const formData = useVModel(props, 'modelValue', emit);
 
 <template>
   <ComponentContainerProperty v-model="formData.style">
-    <Form :model="formData">
+    <Form
+      :model="formData"
+      :label-col="{ span: 6 }"
+      :wrapper-col="{ span: 18 }"
+    >
       <Card title="秒杀活动" class="property-group">
         <SeckillShowcase v-model="formData.activityIds" />
       </Card>
@@ -116,6 +120,7 @@ const formData = useVModel(props, 'modelValue', emit);
             width="72px"
             :show-description="false"
           >
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip> 建议尺寸：36 * 22 </template>
           </UploadImg>
         </FormItem>
@@ -146,6 +151,7 @@ const formData = useVModel(props, 'modelValue', emit);
               width="56px"
               :show-description="false"
             >
+              <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
               <template #tip> 建议尺寸：56 * 56</template>
             </UploadImg>
           </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/search-bar/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/search-bar/property.vue
index eca8a0d33..82dc8e6a8 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/search-bar/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/search-bar/property.vue
@@ -48,7 +48,7 @@ watch(
 
 <template>
   <ComponentContainerProperty v-model="formData.style">
-    <Form :model="formData">
+    <Form :model="formData" :label-col="{ style: { width: '80px' } }">
       <Card title="搜索热词" class="property-group">
         <Draggable
           v-model="formData.hotKeywords"
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/index.vue
index 1f0eeab08..0d2466917 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/index.vue
@@ -31,6 +31,7 @@ defineProps<{ property: TabBarProperty }>();
         <Image
           :src="index === 0 ? item.activeIconUrl : item.iconUrl"
           class="!h-[26px] w-[26px] rounded"
+          :preview="false"
         >
           <template #error>
             <div class="flex h-full w-full items-center justify-center">
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/property.vue
index 324414cec..6248ddc51 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/tab-bar/property.vue
@@ -88,6 +88,7 @@ const handleThemeChange = () => {
           class="min-w-[200px]"
           :show-description="false"
         >
+          <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
           <template #tip> 建议尺寸 375 * 50 </template>
         </UploadImg>
       </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/index.vue
index c7c9e5ba1..cf0fee121 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/index.vue
@@ -18,8 +18,8 @@ defineProps<{ property: TitleBarProperty }>();
     <Image
       v-if="property.bgImgUrl"
       :src="property.bgImgUrl"
-      fit="cover"
-      class="w-full"
+      :preview="false"
+      class="w-full object-cover"
     />
     <div
       class="absolute left-0 top-0 flex h-full w-full flex-col justify-center"
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/property.vue
index 63a28ae6f..4dc06495c 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/property.vue
@@ -47,6 +47,7 @@ const rules = {}; // 表单校验
             height="40px"
             :show-description="false"
           >
+            <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
             <template #tip>建议尺寸 750*80</template>
           </UploadImg>
         </FormItem>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-card/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-card/index.vue
index baa5ca21e..8c4b68a18 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-card/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-card/index.vue
@@ -14,12 +14,12 @@ defineProps<{ property: UserCardProperty }>();
   <div class="flex flex-col">
     <div class="flex items-center justify-between px-4 py-6">
       <div class="flex flex-1 items-center gap-4">
-        <Avatar class="size-14">
-          <IconifyIcon icon="lucide:user" class="size-14" />
+        <Avatar :size="60">
+          <IconifyIcon icon="ep:avatar" :size="60" />
         </Avatar>
-        <span class="text-lg font-bold">芋道源码</span>
+        <span class="text-[18px] font-bold">芋道源码</span>
       </div>
-      <IconifyIcon icon="lucide:qr-code" class="size-5" />
+      <IconifyIcon icon="tdesign:qrcode" :size="20" />
     </div>
     <div class="bg-card flex items-center justify-between px-5 py-2 text-xs">
       <span class="text-orange-500">点击绑定手机号</span>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-coupon/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-coupon/index.vue
index 6fbe90bd9..a990140e9 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-coupon/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-coupon/index.vue
@@ -11,5 +11,6 @@ defineProps<{ property: UserCouponProperty }>();
 <template>
   <Image
     src="https://shopro.sheepjs.com/admin/static/images/shop/decorate/couponCardStyle.png"
+    :preview="false"
   />
 </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-order/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-order/index.vue
index 073883447..af6f888c7 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-order/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-order/index.vue
@@ -12,5 +12,6 @@ defineProps<{ property: UserOrderProperty }>();
 <template>
   <Image
     src="https://shopro.sheepjs.com/admin/static/images/shop/decorate/orderCardStyle.png"
+    :preview="false"
   />
 </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/index.vue
index 8c8cd52e3..8104d8fe6 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/index.vue
@@ -12,5 +12,6 @@ defineProps<{ property: UserWalletProperty }>();
 <template>
   <Image
     src="https://shopro.sheepjs.com/admin/static/images/shop/decorate/walletCardStyle.png"
+    :preview="false"
   />
 </template>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/index.vue
index b89331eec..08118a30b 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/index.vue
@@ -14,6 +14,7 @@ defineProps<{ property: VideoPlayerProperty }>();
       class="h-full w-full"
       :src="property.posterUrl"
       v-if="property.posterUrl"
+      :preview="false"
     />
     <video
       v-else
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/property.vue
index 2f8f615db..ba4896181 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/video-player/property.vue
@@ -49,6 +49,7 @@ const formData = useVModel(props, 'modelValue', emit);
           class="min-w-[80px]"
           :show-description="false"
         >
+          <!-- TODO @芋艿：这里不提示；是不是组件得封装下；-->
           <template #tip> 建议宽度750 </template>
         </UploadImg>
       </FormItem>