diff --git a/App.vue b/App.vue
index c730b223..c80c806b 100644
--- a/App.vue
+++ b/App.vue
@@ -2859,11 +2859,10 @@
 
             // 设置导航背景色和颜色
             set_navigation_bar_color(is_white = null) {
-                var color = '#000';
-                var bg_color = '#fff';
+                var color = '#000000';
+                var bg_color = '#ffffff';
                 var arr = [
                     'pages/index/index',
-                    'pages/diy/diy',
                 ];
                 var page = this.current_page(false);
                 if(is_white === true || (is_white === null && arr.indexOf(page) != -1)) {
diff --git a/components/diy/diy.vue b/components/diy/diy.vue
index 4cd7f9fe..07ed9760 100644
--- a/components/diy/diy.vue
+++ b/components/diy/diy.vue
@@ -285,7 +285,7 @@
                 });
 
                 // 设置顶部导航的默认颜色
-                app.globalData.set_navigation_bar_color(parseInt(this.propValue.header.com_data.style.function_buttons_type || 0) == 1);
+                app.globalData.set_navigation_bar_color(parseInt(this.propValue.header.com_data.style.function_buttons_type) == 1);
 
                 // 缓存数据
                 uni.setStorageSync(this.cache_key + this.tabs_home_id, this.propValue.diy_data);
diff --git a/components/diy/float-window.vue b/components/diy/float-window.vue
index 271b8c65..2bf18773 100644
--- a/components/diy/float-window.vue
+++ b/components/diy/float-window.vue
@@ -1,12 +1,17 @@
 <template>
-    <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>
+    <movable-area class="float-window-movable-container">
+        <movable-view :x="x" :y="y" direction="all" class="float-window-spread flex-row align-c jc-c" @tap="url_open">
+            <block v-if="style.float_style == 'diffuse'">
+                <view class="ring" :style="content_style"></view>
+                <view class="ring" :style="content_style"></view>
             </block>
-            <view class="img">
-                <imageEmpty :propImageSrc="form.button_img[0]" :propStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+            <view class="img oh" :style="content_style">
+                <block v-if="(form || null) != null && form.button_jump == 'customer_service'">
+                    <component-online-service :propChatImage="img_url" :propIsSpread="false" :propIsMovable="false"></component-online-service>
+                </block>
+                <block v-else>
+                    <imageEmpty :propImageSrc="img_url" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
+                </block>
             </view>
         </movable-view>
     </movable-area>
@@ -16,9 +21,11 @@
     const app = getApp();
     import { isEmpty } from '@/common/js/common/common.js';
     import imageEmpty from '@/components/diy/modules/image-empty.vue';
+    import componentOnlineService from '@/components/online-service/online-service';
     export default {
         components: {
             imageEmpty,
+            componentOnlineService
         },
         props: {
             propValue: {
@@ -35,11 +42,11 @@
         data() {
             return {
                 form: {},
-                new_style: {},
+                style: {},
+                img_url: '',
                 x: 0,
                 y: 0,
-                style: '',
-                color: '',
+                content_style: '',
             };
         },
         watch: {
@@ -53,31 +60,33 @@
         },
         methods: {
             init() {
+                let form = this.propValue.content || {};
+                let img_url = (form.button_img || null) != null ? (form.button_img[0] || null) : null;
+                if (img_url != null) {
+                    img_url = img_url.url || null;
+                }
                 this.setData({
-                    form: this.propValue.content,
-                    new_style: this.propValue.style,
+                    form: form,
+                    style: this.propValue.style,
+                    img_url: img_url,
                 });
                 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') {
-                    x = 10;
-                }
+                let x = display_location == 'left' ? 10 : windowWidth - 60;
                 // 计算出距离顶部的距离
-                const num = Math.ceil(windowHeight * (1 - Number(offset_number_percentage)));
+                const y = 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%;`,
+                    content_style: float_style == 'shadow' ? `box-shadow: 0 0 40rpx ${float_style_color};border-radius: 50%;` : `background-color: ${float_style_color};border-radius: 50%;`,
                     x: x,
-                    y: num
+                    y: y
                 });
+                
+                console.log(windowWidth, x, this.x)
             },
             url_open() {
                 const { button_jump, button_link } = this.form;
                 if (button_jump == 'link' && !isEmpty(button_link)) {
                     app.globalData.url_open(button_link.page);
-                } else {
-                    console.log('客服');
                 }
             },
         },
@@ -89,11 +98,9 @@
         width: 90rpx;
         height: 90rpx;
         border-radius: 50%;
+        z-index: 2;
     }
-    .float-window {
-        z-index: 103;
-    }
-    .online-service-movable-container {
+    .float-window-movable-container {
         position: fixed;
         width: 100%;
         height: 100%;
@@ -110,8 +117,8 @@
         position: relative;
         pointer-events: auto;
         z-index: 1;
-        width: 120rpx;
-        height: 120rpx;
+        width: 100rpx;
+        height: 100rpx;
         border-radius: 50%;
     }
     .float-window-spread .ring {
diff --git a/components/diy/modules/image-empty.vue b/components/diy/modules/image-empty.vue
index eef10d2d..3a06c2dd 100644
--- a/components/diy/modules/image-empty.vue
+++ b/components/diy/modules/image-empty.vue
@@ -1,6 +1,6 @@
 <template>
     <view :class="['oh img_wh', propClass]" :style="empty_outer_style + propStyle">
-        <image :src="imageUrl" @error="handleImageError" :mode="propImgFit" :style="empty_style" />
+        <image :src="img_url" @error="handleImageError" :mode="propImgFit" :style="empty_style" />
     </view>
 </template>
 
@@ -33,8 +33,8 @@
             return {
                 empty_outer_style: '',
                 empty_style: 'width: 100%; height: 100%;', // 有图片的时候显示为100%
-                imageUrl: '',
-                defaultImage: '/static/images/common/image-empty.png',
+                img_url: '',
+                default_image: '/static/images/common/image-empty.png',
             };
         },
         watch: {
@@ -57,10 +57,10 @@
                         empty_outer_style: 'background: #f4fcff;display:flex;align-items: center;justify-content: center;',
                         empty_style: `${this.propErrorStyle}`,
                     });
-                    img_url = this.defaultImage;
+                    img_url = this.default_image;
                 }
                 this.setData({
-                    imageUrl: img_url,
+                    img_url: img_url,
                 });
             },
         },
diff --git a/components/online-service/online-service.vue b/components/online-service/online-service.vue
index 505f2350..c67b93f2 100644
--- a/components/online-service/online-service.vue
+++ b/components/online-service/online-service.vue
@@ -5,26 +5,26 @@
             <view v-if="propIsGoods == true" class="goods-chat-container fl cp">
                 <block v-if="is_chat == 1">
                     <view @tap="chat_event">
-                        <image class="icon" :src="common_static_url+'chat-icon.png'" mode="scaleToFill"></image>
+                        <image class="icon" :src="chat_icon" mode="scaleToFill"></image>
                         <text class="text dis-block text-size-xs cr-grey">{{$t('online-service.online-service.4l6k22')}}</text>
                     </view>
                 </block>
                 <block v-else>
                     <!-- #ifdef MP-WEIXIN || MP-TOUTIAO || MP-BAIDU || MP-KUAISHOU -->
                     <button class="chat-btn" open-type="contact" :show-message-card="propCard" :send-message-title="propTitle" :send-message-path="propPath" :send-message-img="propImg">
-                        <image class="icon" :src="common_static_url+'chat-icon.png'" mode="scaleToFill"></image>
+                        <image class="icon" :src="chat_icon" mode="scaleToFill"></image>
                         <text class="text dis-block text-size-xs cr-grey">{{$t('online-service.online-service.4l6k22')}}</text>
                     </button>
                     <!-- #endif -->
                     <!-- #ifdef MP-ALIPAY -->
                     <button class="chat-btn" open-type="contact" class="alipay-contact">
-                        <contact-button class="alipay-chat-btn" :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'chat-icon.png'" size="40rpx*40rpx" />
+                        <contact-button class="alipay-chat-btn" :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="chat_icon" size="40rpx*40rpx" />
                         <text class="text dis-block text-size-xs cr-grey">{{$t('online-service.online-service.4l6k22')}}</text>
                     </button>
                     <!-- #endif -->
                     <!-- #ifdef H5 || APP -->
                     <button class="chat-btn" type="default" @tap="call_event">
-                        <image class="icon" :src="common_static_url+'chat-icon.png'" mode="scaleToFill"></image>
+                        <image class="icon" :src="chat_icon" mode="scaleToFill"></image>
                         <text class="text dis-block text-size-xs cr-grey">{{$t('online-service.online-service.4l6k22')}}</text>
                     </button>
                     <!-- #endif -->
@@ -33,34 +33,70 @@
             <!-- 默认浮动展示-可拖拽位置 -->
             <view v-else>
                 <block v-if="is_online_service_fixed == 1">
-                    <movable-area class="online-service-movable-container" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
-                        <movable-view direction="all" :x="x" :y="y" :animation="false" class="online-service-event-submit spread">
-                            <view class="ring"></view>
-    	                    <view class="ring"></view>
-                            <block v-if="is_chat == 1">
-                                <button class="chat-btn" type="default" :class="common_ent" @tap="chat_event">
-                                    <image class="icon dis-block" :src="common_static_url+'online-service-icon.png'"></image>
-                                </button>
-                            </block>
-                            <block v-else>
-                                <!-- #ifdef MP-WEIXIN || MP-TOUTIAO || MP-BAIDU -->
-                                <button class="chat-btn" open-type="contact" :class="common_ent" :show-message-card="propCard" :send-message-title="propTitle" :send-message-path="propPath" :send-message-img="propImg">
-                                    <image class="icon dis-block" :src="common_static_url+'online-service-icon.png'"></image>
-                                </button>
-                                <!-- #endif -->
-                                <!-- #ifdef MP-ALIPAY -->
-                                <button class="chat-btn" open-type="contact" :class="'alipay-contact '+common_ent">
-                                    <contact-button class="alipay-chat-btn" :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'online-service-icon.png'" size="40rpx*40rpx" />
-                                </button>
-                                <!-- #endif -->
-                                <!-- #ifdef H5 || APP -->
-                                <button class="chat-btn" type="default" :class="common_ent" @tap="call_event">
-                                    <image class="icon dis-block" :src="common_static_url+'online-service-icon.png'"></image>
-                                </button>
-                                <!-- #endif -->
-                            </block>
-                        </movable-view>
-                    </movable-area>
+                    <block v-if="propIsMovable">
+                        <movable-area class="online-service-movable-container" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
+                            <movable-view direction="all" :x="x" :y="y" :animation="false" :class="'online-service-event-submit '+(propIsSpread ? ' spread' : '')">
+                                <block v-if="propIsSpread">
+                                    <view class="ring"></view>
+                                    <view class="ring"></view>
+                                </block>
+                                <block v-if="is_chat == 1">
+                                    <button class="chat-btn" type="default" :class="common_ent" @tap="chat_event">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                </block>
+                                <block v-else>
+                                    <!-- #ifdef MP-WEIXIN || MP-TOUTIAO || MP-BAIDU -->
+                                    <button class="chat-btn" open-type="contact" :class="common_ent" :show-message-card="propCard" :send-message-title="propTitle" :send-message-path="propPath" :send-message-img="propImg">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                    <!-- #endif -->
+                                    <!-- #ifdef MP-ALIPAY -->
+                                    <button class="chat-btn" open-type="contact" :class="'alipay-contact '+common_ent">
+                                        <contact-button class="alipay-chat-btn" :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="chat_image" size="40rpx*40rpx" />
+                                    </button>
+                                    <!-- #endif -->
+                                    <!-- #ifdef H5 || APP -->
+                                    <button class="chat-btn" type="default" :class="common_ent" @tap="call_event">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                    <!-- #endif -->
+                                </block>
+                            </movable-view>
+                        </movable-area>
+                    </block>
+                    <block v-else>
+                        <view class="online-service-movable-container" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
+                            <view :class="'online-service-event-submit '+(propIsSpread ? ' spread' : '')">
+                                <block v-if="propIsSpread">
+                                    <view class="ring"></view>
+                                    <view class="ring"></view>
+                                </block>
+                                <block v-if="is_chat == 1">
+                                    <button class="chat-btn" type="default" :class="common_ent" @tap="chat_event">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                </block>
+                                <block v-else>
+                                    <!-- #ifdef MP-WEIXIN || MP-TOUTIAO || MP-BAIDU -->
+                                    <button class="chat-btn" open-type="contact" :class="common_ent" :show-message-card="propCard" :send-message-title="propTitle" :send-message-path="propPath" :send-message-img="propImg">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                    <!-- #endif -->
+                                    <!-- #ifdef MP-ALIPAY -->
+                                    <button class="chat-btn" open-type="contact" :class="'alipay-contact '+common_ent">
+                                        <contact-button class="alipay-chat-btn" :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="chat_image" size="40rpx*40rpx" />
+                                    </button>
+                                    <!-- #endif -->
+                                    <!-- #ifdef H5 || APP -->
+                                    <button class="chat-btn" type="default" :class="common_ent" @tap="call_event">
+                                        <image class="icon dis-block" :src="chat_image"></image>
+                                    </button>
+                                    <!-- #endif -->
+                                </block>
+                            </view>
+                        </view>
+                    </block>
                 </block>
             </view>
         </block>
@@ -76,6 +112,8 @@
                 client_value: app.globalData.application_client_type(),
                 is_chat: 0,
                 chat_url: null,
+                chat_icon: '',
+                chat_image: '',
                 common_app_customer_service_tel: null,
                 common_app_customer_service_custom: null,
                 common_app_customer_service_company_weixin_corpid: null,
@@ -136,6 +174,22 @@
             	type: String,
             	default: ''
             },
+            propChatIcon: {
+            	type: String,
+            	default: ''
+            },
+            propChatImage: {
+            	type: String,
+            	default: ''
+            },
+            propIsSpread: {
+            	type: Boolean,
+            	default: true
+            },
+            propIsMovable: {
+            	type: Boolean,
+            	default: true
+            },
         },
         // 属性值改变监听
         watch: {
@@ -163,6 +217,8 @@
             this.setData({
                 is_first: 0,
                 system: system,
+                chat_icon: this.propChatIcon || this.common_static_url+'chat-icon.png',
+                chat_image: this.propChatImage || this.common_static_url+'online-service-icon.png',
                 // 位置坐标
                 x: width - 65,
                 y: height - 380,
@@ -293,7 +349,7 @@
         }
     };
 </script>
-<style>
+<style scoped>
     .online-service-movable-container {
         position: fixed;
         width: 100%;