From 318f142fa77e3ad51499adb076a6bc62e661fd22 Mon Sep 17 00:00:00 2001
From: xingyu4j <xingyu4j@vip.qq.com>
Date: Wed, 5 Nov 2025 15:31:07 +0800
Subject: [PATCH] feat: diy editor style

---
 .../components/mobile/Carousel/index.vue        |  2 +-
 .../mobile/floating-action-button/index.vue     |  6 +++++-
 .../components/mobile/image-bar/index.vue       | 13 +++----------
 .../components/mobile/search-bar/property.vue   | 14 ++++++++++----
 .../components/mobile/user-wallet/index.vue     |  2 --
 .../components/mobile/user-wallet/property.vue  |  2 --
 .../components/mobile/video-player/index.vue    | 17 ++++++-----------
 7 files changed, 25 insertions(+), 31 deletions(-)

diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/Carousel/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/Carousel/index.vue
index 892c08641..9b4dd5c16 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/Carousel/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/Carousel/index.vue
@@ -24,7 +24,7 @@ const handleIndexChange = (index: number) => {
       class="bg-card flex h-64 items-center justify-center"
       v-if="property.items.length === 0"
     >
-      <IconifyIcon icon="tdesign:image" class="text-3xl text-gray-800" />
+      <IconifyIcon icon="tdesign:image" class="size-6 text-gray-800" />
     </div>
     <div v-else class="relative">
       <Carousel
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 beff6683c..2d3a4dd81 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
@@ -43,7 +43,11 @@ const handleActive = (index: number) => {
         <Image :src="item.imgUrl" fit="contain" class="h-7 w-7">
           <template #error>
             <div class="flex h-full w-full items-center justify-center">
-              <IconifyIcon icon="ep:picture" :color="item.textColor" />
+              <IconifyIcon
+                icon="ep:picture"
+                :color="item.textColor"
+                class="size-6"
+              />
             </div>
           </template>
         </Image>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/index.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/index.vue
index 5be469d97..0c3357416 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/image-bar/index.vue
@@ -3,6 +3,8 @@ import type { ImageBarProperty } from './config';
 
 import { IconifyIcon } from '@vben/icons';
 
+import { Image } from 'ant-design-vue';
+
 /** 图片展示 */
 defineOptions({ name: 'ImageBar' });
 
@@ -17,18 +19,9 @@ defineProps<{ property: ImageBarProperty }>();
     <IconifyIcon icon="ep:picture" class="text-3xl text-gray-600" />
   </div>
   <Image
-    class="min-h-8 w-full"
+    class="block h-full min-h-8 w-full"
     v-else
     :src="property.imgUrl"
     :preview="false"
   />
 </template>
-
-<style scoped lang="scss">
-/* 图片 */
-img {
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-</style>
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 18fdd9e2a..eca8a0d33 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
@@ -70,12 +70,12 @@ watch(
           <RadioGroup v-model:value="formData!.borderRadius">
             <Tooltip title="方形" placement="top">
               <RadioButton :value="0">
-                <IconifyIcon icon="tabler:input-search" />
+                <IconifyIcon icon="tabler:input-search" class="size-6" />
               </RadioButton>
             </Tooltip>
             <Tooltip title="圆形" placement="top">
               <RadioButton :value="10">
-                <IconifyIcon icon="iconoir:input-search" />
+                <IconifyIcon icon="iconoir:input-search" class="size-6" />
               </RadioButton>
             </Tooltip>
           </RadioGroup>
@@ -87,12 +87,18 @@ watch(
           <RadioGroup v-model:value="formData!.placeholderPosition">
             <Tooltip title="居左" placement="top">
               <RadioButton value="left">
-                <IconifyIcon icon="ant-design:align-left-outlined" />
+                <IconifyIcon
+                  icon="ant-design:align-left-outlined"
+                  class="size-6"
+                />
               </RadioButton>
             </Tooltip>
             <Tooltip title="居中" placement="top">
               <RadioButton value="center">
-                <IconifyIcon icon="ant-design:align-center-outlined" />
+                <IconifyIcon
+                  icon="ant-design:align-center-outlined"
+                  class="size-6"
+                />
               </RadioButton>
             </Tooltip>
           </RadioGroup>
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 ef98724ae..9e7aa4891 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
@@ -13,5 +13,3 @@ defineProps<{ property: UserWalletProperty }>();
     src="https://shopro.sheepjs.com/admin/static/images/shop/decorate/walletCardStyle.png"
   />
 </template>
-
-<style scoped lang="scss"></style>
diff --git a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/property.vue b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/property.vue
index 5c01b828e..f82113728 100644
--- a/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/property.vue
+++ b/apps/web-antd/src/views/mall/promotion/components/diy-editor/components/mobile/user-wallet/property.vue
@@ -16,5 +16,3 @@ const formData = useVModel(props, 'modelValue', emit);
 <template>
   <ComponentContainerProperty v-model="formData.style" />
 </template>
-
-<style scoped lang="scss"></style>
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 f7a105c4a..b89331eec 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
@@ -10,10 +10,14 @@ defineProps<{ property: VideoPlayerProperty }>();
 </script>
 <template>
   <div class="w-full" :style="{ height: `${property.style.height}px` }">
-    <Image class="w-full" :src="property.posterUrl" v-if="property.posterUrl" />
+    <Image
+      class="h-full w-full"
+      :src="property.posterUrl"
+      v-if="property.posterUrl"
+    />
     <video
       v-else
-      class="w-full"
+      class="h-full w-full"
       :src="property.videoUrl"
       :poster="property.posterUrl"
       :autoplay="property.autoplay"
@@ -21,12 +25,3 @@ defineProps<{ property: VideoPlayerProperty }>();
     ></video>
   </div>
 </template>
-
-<style scoped lang="scss">
-/* 图片 */
-img {
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-</style>