From 987b8d0c5974c161e75f96216d652e61a69a1a71 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Thu, 26 Sep 2024 16:00:26 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/diy/carousel.vue                   |  6 +--
 components/diy/float-window.vue               | 29 ++++++++------
 components/diy/goods-list.vue                 |  8 ++--
 components/diy/modules/custom/model-image.vue |  2 +-
 .../diy/modules/data-magic/magic-carousel.vue |  8 ++--
 .../modules/data-magic/product-list-show.vue  | 40 +++++++++++++------
 components/diy/modules/image-empty.vue        |  6 +--
 components/diy/nav-group.vue                  |  6 ++-
 components/diy/seckill.vue                    |  8 ++--
 9 files changed, 67 insertions(+), 46 deletions(-)

diff --git a/components/diy/carousel.vue b/components/diy/carousel.vue
index 3aac6f15..25e37c4e 100644
--- a/components/diy/carousel.vue
+++ b/components/diy/carousel.vue
@@ -4,7 +4,7 @@
             <block v-if="form.carousel_type == 'card'">
                 <swiper-item v-for="(item, index) in new_list" :key="index" class="flex-row align-c" :data-value="item.carousel_link.page" @tap="url_open">
                     <view class="swiper-item" :style="img_style" :class="['scale-defalt', { 'scale-1': animationData === index }]">
-                        <imageEmpty :propImageSrc="item.carousel_img[0]" :propTypeStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                        <imageEmpty :propImageSrc="item.carousel_img[0]" :propStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                     </view>
                     <view v-if="new_style.video_is_show == '1' && item.carousel_video.length > 0" :class="{ 'x-middle': new_style.video_location == 'center', 'right-0': new_style.video_location == 'flex-end' }" class="video-class flex-row pa gap-10 align-c oh" :style="video_style" @tap.stop="video_play(item.carousel_video)">
                         <block v-if="new_style.video_type == 'img'">
@@ -21,8 +21,8 @@
             </block>
             <block v-else>
                 <swiper-item v-for="(item, index) in new_list" :key="index" :style="{ 'padding-right': new_style.image_spacing * 2 + 'rpx' }">
-                    <view class="item-image flex-row jc-c align-c wh-auto ht-auto pr" :style="img_style">
-                        <imageEmpty :propImageSrc="item.carousel_img[0]" :propTypeStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                    <view class="wh-auto ht-auto pr" :style="img_style">
+                        <imageEmpty :propImageSrc="item.carousel_img[0]" :propStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                     </view>
                     <view v-if="new_style.video_is_show == '1' && item.carousel_video.length > 0" :class="{ 'x-middle': new_style.video_location == 'center', 'right-0': new_style.video_location == 'flex-end' }" class="video-class flex-row pa gap-10 align-c oh" :style="video_style" @tap.stop="video_play(item.carousel_video)">
                         <block v-if="new_style.video_type == 'img'">
diff --git a/components/diy/float-window.vue b/components/diy/float-window.vue
index 7ee332ad..2d07e0e4 100644
--- a/components/diy/float-window.vue
+++ b/components/diy/float-window.vue
@@ -1,13 +1,13 @@
 <template>
-    <view v-if="form.button_img.length > 0" class="pa" :style="style">
+    <view v-if="form.button_img.length > 0" class="pf float-window" :style="style">
         <view class="flex-row align-c jc-c" @click="url_open">
-            <view class="spread flex-row align-c jc-c">
+            <view class="float-window-spread flex-row align-c jc-c">
                 <block v-if="new_style.float_style == 'diffuse'">
                     <view class="ring" :style="color"></view>
                     <view class="ring" :style="color"></view>
                 </block>
                 <view class="img">
-                    <imageEmpty :propImageSrc="form.button_img[0]" :propTypeStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+                    <imageEmpty :propImageSrc="form.button_img[0]" :propStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
                 </view>
             </view>
         </view>
@@ -72,21 +72,24 @@
 
 <style scoped lang="scss">
     .img {
-        width: 100rpx;
-        height: 100rpx;
+        width: 90rpx;
+        height: 90rpx;
         border-radius: 50%;
     }
+    .float-window {
+        z-index: 103;
+    }
     /**
-* 呼吸灯
-*/
-    .spread {
+    * 呼吸灯
+    */
+    .float-window-spread {
         position: relative;
         z-index: 1;
-        width: 100rpx;
-        height: 100rpx;
+        width: 120rpx;
+        height: 120rpx;
         border-radius: 50%;
     }
-    .spread .ring {
+    .float-window-spread .ring {
         /* 速度为1.5 * 层数 = 实际运行速度，速度修改则 animation-delay 属性也修改相同速度 */
         animation: pulsing 1.5s ease-out infinite;
         border-radius: 100%;
@@ -95,13 +98,13 @@
         position: absolute;
     }
     /* 速度为1*层数 */
-    .spread .ring:nth-of-type(1) {
+    .float-window-spread .ring:nth-of-type(1) {
         -webkit-animation-delay: -1.5s;
         animation-delay: -1.5s;
     }
 
     /* 速度为1*层数 */
-    .spread .ring:nth-of-type(2) {
+    .float-window-spread .ring:nth-of-type(2) {
         -webkit-animation-delay: -2s;
         animation-delay: -2s;
     }
diff --git a/components/diy/goods-list.vue b/components/diy/goods-list.vue
index e6efbe05..230c051d 100644
--- a/components/diy/goods-list.vue
+++ b/components/diy/goods-list.vue
@@ -16,10 +16,10 @@
                     <block v-else>
                         <block v-if="!isEmpty(item)">
                             <view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + theme">
-                                <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                                <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                             </view>
                             <view v-else :class="'flex-img' + theme">
-                                <imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                                <imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                             </view>
                         </block>
                         <view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
@@ -106,10 +106,10 @@
                         <view v-for="(item, index) in item1.split_list" :key="index" class="pr" :class="layout_type" :style="layout_style" :data-value="item.goods_url" @tap="url_event">
                             <block v-if="!isEmpty(item)">
                                 <view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + theme">
-                                    <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                                    <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                                 </view>
                                 <view v-else :class="'flex-img' + theme">
-                                    <imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
+                                    <imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
                                 </view>
                             </block>
                             <view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
diff --git a/components/diy/modules/custom/model-image.vue b/components/diy/modules/custom/model-image.vue
index f13fb789..03e24f4e 100644
--- a/components/diy/modules/custom/model-image.vue
+++ b/components/diy/modules/custom/model-image.vue
@@ -1,6 +1,6 @@
 <template>
     <view class="img-outer pr wh-auto ht-auto" :style="border_style" @tap="url_open(form.link)">
-        <imageEmpty :propImageSrc="img" :propTypeStyle="image_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+        <imageEmpty :propImageSrc="img" :propStyle="image_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
     </view>
 </template>
 <script>
diff --git a/components/diy/modules/data-magic/magic-carousel.vue b/components/diy/modules/data-magic/magic-carousel.vue
index d9471a35..d6ad3b03 100644
--- a/components/diy/modules/data-magic/magic-carousel.vue
+++ b/components/diy/modules/data-magic/magic-carousel.vue
@@ -1,13 +1,13 @@
 <template>
-    <swiper circular="true" :autoplay="value.data_style.is_roll == '1'" :interval="value.data_style.interval_time * 1000" :duration="500" :vertical="value.data_style.rotation_direction == 'vertical'" class="swiper" style="height: 100%" @change="carousel_change">
-        <swiper-item v-for="(item1, index1) in value.data_content.list" :key="index1">
+    <swiper circular="true" :autoplay="propValue.data_style.is_roll == '1'" :interval="propValue.data_style.interval_time * 1000" :duration="500" :vertical="propValue.data_style.rotation_direction == 'vertical'" class="swiper" style="height: 100%" @change="carousel_change">
+        <swiper-item v-for="(item1, index1) in propValue.data_content.list" :key="index1">
             <template v-if="propType === 'img'">
                 <view :data-value="item1.carousel_link.page" @tap="url_event">
-                    <imageEmpty :propImageSrc="item1.carousel_img[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                    <imageEmpty :propImageSrc="item1.carousel_img[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
                 </view>
             </template>
             <template v-else>
-                <product-list-show :propOuterflex="value.outerflex" :propFlex="value.flex" :propNum="value.num" :propActived="propActived" :propIsShow="value.data_content.is_show" :propChunkPadding="value.data_style.chunk_padding" :propValue="item1.split_list" :propContentImgRadius="propContentImgRadius" @url_event="url_event"></product-list-show>
+                <product-list-show :propOuterflex="propValue.outerflex" :propFlex="propValue.flex" :propNum="propValue.num" :propActived="propActived" :propIsShow="propValue.data_content.is_show" :propChunkPadding="propValue.data_style.chunk_padding" :propValue="item1.split_list" :propContentImgRadius="propContentImgRadius" @url_event="url_event"></product-list-show>
             </template>
         </swiper-item>
     </swiper>
diff --git a/components/diy/modules/data-magic/product-list-show.vue b/components/diy/modules/data-magic/product-list-show.vue
index b67092f0..26807387 100644
--- a/components/diy/modules/data-magic/product-list-show.vue
+++ b/components/diy/modules/data-magic/product-list-show.vue
@@ -2,12 +2,16 @@
     <view v-if="propOuterflex == 'row'" class="wh-auto ht-auto">
         <view class="flex-row gap-10 align-c wh-auto ht-auto">
             <template v-if="propFlex === 'row'">
-                <view v-for="(item, index) in value" :key="index" class="flex-row gap-10 half-width ht-auto" :data-value="item.goods_url" @tap="url_event">
+                <view v-for="(item, index) in propValue" :key="index" class="flex-row gap-10 half-width ht-auto" :data-value="item.goods_url" @tap="url_event">
                     <template v-if="!isEmpty(item.new_cover)">
-                        <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <template v-else>
-                        <imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto ht-auto tl gap-10">
                         <view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>
@@ -22,13 +26,17 @@
                 </view>
             </template>
             <template v-else-if="propActived != 7 || propNum !== 1">
-                <view v-for="(item, index) in value" :key="index" :class="['flex-col gap-10 ht-auto', { 'half-width': propNum !== 1, 'wh-auto': propNum == 1 }]" :data-value="item.goods_url" @tap="url_event">
+                <view v-for="(item, index) in propValue" :key="index" :class="['flex-col gap-10 ht-auto', { 'half-width': propNum !== 1, 'wh-auto': propNum == 1 }]" :data-value="item.goods_url" @tap="url_event">
                     <view class="wh-auto ht-auto pr">
                         <template v-if="!isEmpty(item.new_cover)">
-                            <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                            <view class="wh-auto ht-auto">
+                                <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                            </view>
                         </template>
                         <template v-else>
-                            <imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                            <view class="wh-auto ht-auto">
+                                <imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                            </view>
                         </template>
                         <view v-if="propIsShow.includes('price')" class="price-suspension text-line-1">
                             {{ item.show_price_symbol }}{{ item.min_price }}
@@ -41,12 +49,16 @@
                 </view>
             </template>
             <template v-else>
-                <view v-for="(item, index) in value" :key="index" class="flex-col wh-auto ht-auto" :data-value="item.goods_url" @tap="url_event">
+                <view v-for="(item, index) in propValue" :key="index" class="flex-col wh-auto ht-auto" :data-value="item.goods_url" @tap="url_event">
                     <template v-if="!isEmpty(item.new_cover)">
-                        <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <template v-else>
-                        <imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto tl gap-10" :style="img_padding_computer">
                         <view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>
@@ -65,12 +77,16 @@
     <view v-else class="wh-auto ht-auto">
         <view class="flex-col gap-20 align-c wh-auto ht-auto">
             <template v-if="propFlex === 'row'">
-                <view v-for="(item, index) in value" :key="index" class="flex-row gap-10 align-c wh-auto ht-auto shop-max-height" :data-value="item.goods_url" @tap="url_event">
+                <view v-for="(item, index) in propValue" :key="index" class="flex-row gap-10 align-c wh-auto ht-auto shop-max-height" :data-value="item.goods_url" @tap="url_event">
                     <template v-if="!isEmpty(item.new_cover)">
-                        <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <template v-else>
-                        <imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        <view class="wh-auto ht-auto">
+                            <imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                        </view>
                     </template>
                     <view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto ht-auto tl gap-20">
                         <view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>
diff --git a/components/diy/modules/image-empty.vue b/components/diy/modules/image-empty.vue
index 34db77f5..b76b6cd8 100644
--- a/components/diy/modules/image-empty.vue
+++ b/components/diy/modules/image-empty.vue
@@ -1,5 +1,5 @@
 <template>
-    <view :class="['oh img_wh', propTypeClass]" :style="empty_outer_style + propTypeStyle">
+    <view :class="['oh img_wh', propClass]" :style="empty_outer_style + propStyle">
         <image :src="imageUrl" @error="handleImageError" :mode="propImgFit" :style="empty_style" />
     </view>
 </template>
@@ -20,11 +20,11 @@
                 type: String,
                 default: () => 'aspectFill',
             },
-            propTypeStyle: {
+            propStyle: {
                 type: String,
                 default: () => '',
             },
-            propTypeClass: {
+            propClass: {
                 type: String,
                 default: () => '',
             },
diff --git a/components/diy/nav-group.vue b/components/diy/nav-group.vue
index 77c9488d..bcd395d3 100644
--- a/components/diy/nav-group.vue
+++ b/components/diy/nav-group.vue
@@ -4,8 +4,10 @@
             <swiper-item v-for="(item, index) in nav_content_list" :key="index" class="flex-row align-c">
                 <view class="bannerImg flex-row flex-wrap wh-auto gap-x-10">
                     <view v-for="(item1, index1) in item.split_list" :key="index1" class="flex-col gap-10 align-c" :style="{ width: group_width }" :data-value="item1.link.page" @tap="url_open_event">
-                        <view v-if="['image_with_text', 'image'].includes(nav_style)" class="top-img flex-row align-c jc-c">
-                            <imageEmpty :propImageSrc="item1.img[0]" :propTypeStyle="img_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+                        <view v-if="['image_with_text', 'image'].includes(nav_style)" class="flex-row align-c jc-c">
+                            <view class="top-img">
+                                <imageEmpty :propImageSrc="item1.img[0]" :propStyle="img_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+                            </view>
                         </view>
                         <view v-if="['image_with_text', 'text'].includes(nav_style)" class="size-12 ma-0" :style="text_style">{{ item1.title }}</view>
                     </view>
diff --git a/components/diy/seckill.vue b/components/diy/seckill.vue
index 294ad868..ec0113a5 100644
--- a/components/diy/seckill.vue
+++ b/components/diy/seckill.vue
@@ -40,10 +40,10 @@
                             <template v-if="!isEmpty(item)">
                                 <view class="oh pr" :class="'flex-img' + form.shop_style_type">
                                     <view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + form.shop_style_type">
-                                        <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
+                                        <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
                                     </view>
                                     <view v-else :class="'flex-img' + form.shop_style_type">
-                                        <imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
+                                        <imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
                                     </view>
                                     <view v-if="form.seckill_subscript_show == '1'" class="text-size-xs nowrap corner-marker" :style="corner_marker">
                                         <text class="text-line-1">{{ form.subscript_text }}</text>
@@ -103,10 +103,10 @@
                             <template v-if="!isEmpty(item)">
                                 <view class="oh pr wh-auto ht-auto">
                                     <view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + form.shop_style_type">
-                                        <imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
+                                        <imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
                                     </view>
                                     <view v-else :class="'flex-img' + form.shop_style_type">
-                                        <imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
+                                        <imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
                                     </view>
                                     <view v-if="form.seckill_subscript_show == '1'" class="text-size-xs nowrap corner-marker" :style="corner_marker">
                                         <text class="text-line-1">{{ form.subscript_text }}</text>

From 21a7dabf73c9981964594f6437e6e6771cda4420 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Thu, 26 Sep 2024 18:09:56 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/diy/float-window.vue | 49 +++++++++++++++++++++------------
 1 file changed, 32 insertions(+), 17 deletions(-)

diff --git a/components/diy/float-window.vue b/components/diy/float-window.vue
index 2d07e0e4..58a071a9 100644
--- a/components/diy/float-window.vue
+++ b/components/diy/float-window.vue
@@ -1,17 +1,15 @@
 <template>
-    <view v-if="form.button_img.length > 0" class="pf float-window" :style="style">
-        <view class="flex-row align-c jc-c" @click="url_open">
-            <view class="float-window-spread flex-row align-c jc-c">
-                <block v-if="new_style.float_style == 'diffuse'">
-                    <view class="ring" :style="color"></view>
-                    <view class="ring" :style="color"></view>
-                </block>
-                <view class="img">
-                    <imageEmpty :propImageSrc="form.button_img[0]" :propStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
-                </view>
+    <movable-area class="online-service-movable-container">
+        <movable-view :x="x" :y="y" direction="all" class="float-window-spread flex-row align-c jc-c">
+            <block v-if="new_style.float_style == 'diffuse'">
+                <view class="ring" :style="color"></view>
+                <view class="ring" :style="color"></view>
+            </block>
+            <view class="img">
+                <imageEmpty :propImageSrc="form.button_img[0]" :propStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
             </view>
-        </view>
-    </view>
+        </movable-view>
+    </movable-area>
 </template>
 
 <script>
@@ -34,6 +32,8 @@
             return {
                 form: {},
                 new_style: {},
+                x: 0,
+                y: 0,
                 style: '',
                 color: '',
             };
@@ -47,15 +47,19 @@
         },
         methods: {
             init() {
-                const { float_style, float_style_color, display_location, offset_number } = this.propValue.style;
-                let location = `right: 20rpx;`;
+                const { float_style, float_style_color, display_location, offset_number_percentage } = this.propValue.style;
+
+                const { windowWidth, windowHeight } = uni.getSystemInfoSync();
+                let x = windowWidth - 10;
                 if (display_location == 'left') {
-                    location = `left: 20rpx;`;
+                    x = 10;
                 }
-                const { windowHeight } = uni.getSystemInfoSync();
+                // 计算出距离顶部的距离
+                const num = Math.ceil(windowHeight * (1 - Number(offset_number_percentage)));
                 this.setData({
                     color: float_style == 'shadow' ? `box-shadow: 0 10rpx 40rpx ${float_style_color};border-radius: 50%;` : `background-color: ${float_style_color};border-radius: 50%;`,
-                    style: `bottom: ${((offset_number / windowHeight) * 100).toFixed(4) + '%'};` + location,
+                    x: x,
+                    y: num
                 });
             },
             url_open() {
@@ -79,11 +83,22 @@
     .float-window {
         z-index: 103;
     }
+    .online-service-movable-container {
+        position: fixed;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+        background: transparent;
+        pointer-events: none;
+        z-index: 103;
+    }
     /**
     * 呼吸灯
     */
     .float-window-spread {
         position: relative;
+        pointer-events: auto;
         z-index: 1;
         width: 120rpx;
         height: 120rpx;