From afeb4fe119dcaad2846e3737b971f07506e28d8b Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Fri, 3 Nov 2023 16:46:53 +0800
Subject: [PATCH] =?UTF-8?q?1.=E6=B5=8B=E8=AF=95=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 common/css/page.css                          |   5 -
 components/online-service/online-service.vue |  46 +-
 components/quick-nav/quick-nav.vue           | 458 ++++++++++---------
 3 files changed, 282 insertions(+), 227 deletions(-)

diff --git a/common/css/page.css b/common/css/page.css
index c1b8d2cb..0317fd27 100644
--- a/common/css/page.css
+++ b/common/css/page.css
@@ -1161,11 +1161,6 @@ button[disabled].bg-grey {
     margin-left: 12rpx;
 }
 
-.goods-data-grid-list .item .error-msg,
-.goods-data-grid-list .item .goods-img {
-    /* height: 341rpx !important; */
-}
-
 .goods-data-grid-list .item .error-msg {
     line-height: 341rpx;
 }
diff --git a/components/online-service/online-service.vue b/components/online-service/online-service.vue
index cda4d3ab..3a5a9396 100644
--- a/components/online-service/online-service.vue
+++ b/components/online-service/online-service.vue
@@ -29,7 +29,7 @@
         <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">
+                    <movable-view direction="all" :x="x" :y="y" :animation="false" class="online-service-event-submit breathe">
                         <block v-if="is_chat == 1">
                             <button type="default" :class="common_ent" @tap="chat_event">
                                 <image class="icon dis-block" :src="common_static_url+'online-service-icon.png'"></image>
@@ -153,12 +153,12 @@
                 system: system,
                 // 位置坐标
                 x: width - 43,
-                y: height - 380,
+                y: height - 240,
                 // 展示位置处理
                 top: top_h,
                 height_dec: top_h,
                 // #ifdef H5 || APP
-                top: 90,
+                top: 10,
                 height_dec: this.propIsBar ? 190 : 90,
                 // #endif
                 // 是否使用客服系统
@@ -248,19 +248,19 @@
     }
     .online-service-event-submit,
     .online-service-event-submit button {
-        width: 31px;
-        height: 31px;
+        width: 50px;
+        height: 50px;
         border-radius: 50%;
     }
     .online-service-event-submit button {
         border: 0;
-        padding: 5px;
+        padding: 0;
         box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
         background: rgba(0, 0, 0, 0.6);
     }
     .online-service-event-submit .icon {
-        width: 21px !important;
-        height: 21px !important;
+        width: 50px !important;
+        height: 50px !important;
     }
     .goods-chat-container button {
         padding: 0;
@@ -289,4 +289,34 @@
         display: block;
     }
     /* #endif */
+    
+    /**
+     * 呼吸灯
+     */
+     .breathe {
+        background-color: rgb(238 73 70);
+        border-radius: 100%;
+        width: 50px;
+        height: 50px;
+        position: relative;
+    }
+
+    .breathe::before,
+    .breathe::after {
+        background-color: rgba(238, 73, 70, 0.3);
+    }
+
+    .breathe::before {
+        width: 50px;
+        height: 50px;
+        top: 0;
+        left: 0;
+    }
+
+    .breathe::after {
+        width: 55px;
+        height: 55px;
+        top: -2.5px;
+        left: -2.5px;
+    }
 </style>
\ No newline at end of file
diff --git a/components/quick-nav/quick-nav.vue b/components/quick-nav/quick-nav.vue
index 970002a9..4e8e2c01 100644
--- a/components/quick-nav/quick-nav.vue
+++ b/components/quick-nav/quick-nav.vue
@@ -1,15 +1,15 @@
 <template>
-	<view>
-		<!-- 开启事件 -->
-		<movable-area v-if="quick_status == 1" :class="'quick-movable-container '+ common_ent" :style="'height: calc(100% - '+height_dec+'rpx);top:'+top+'rpx;'">
-			<movable-view direction="all" :x="x" :y="y" :animation="false" class="quick-event-submit bg-main" @tap="quick_open_event">
-				<image :src="common_static_url+'quick-icon.png'" mode="widthFix"></image>
-			</movable-view>
-		</movable-area>
+    <view>
+        <!-- 开启事件 -->
+        <movable-area v-if="quick_status == 1" :class="'quick-movable-container ' + common_ent" :style="'height: calc(100% - ' + height_dec + 'rpx);top:' + top + 'rpx;'">
+            <movable-view direction="all" :x="x" :y="y" :animation="false" class="quick-event-submit breathe" @tap="quick_open_event">
+                <image :src="common_static_url + 'quick-icon.png'" mode="widthFix"></image>
+            </movable-view>
+        </movable-area>
 
         <!-- 弹窗 -->
         <component-popup :propShow="popup_status" :propIsBar="propIsBar" propPosition="bottom" @onclose="quick_close_event">
-            <view :class="'nav-popup-container '+common_ent">
+            <view :class="'nav-popup-container ' + common_ent">
                 <view class="close oh">
                     <view class="icon-right" @tap.stop="quick_close_event">
                         <uni-icons type="clear" size="46rpx" color="#999"></uni-icons>
@@ -18,238 +18,268 @@
                 <view class="nav-popup-content">
                     <view v-if="data_list.length > 0" class="nav-data-list">
                         <view v-for="(item, index) in data_list" :key="index" class="item cp">
-							<view :class="'item-content '+((item.bg_color || null) == null ? 'item-exposed' : '')" :data-value="item.event_value" :data-type="item.event_type" @tap="navigation_event" :style="((item.bg_color || null) == null ? '' : 'background-color:'+item.bg_color+';')">
-							    <image :src="item.images_url" mode="aspectFit"></image>
-							</view>
-							<view class="title">{{item.name}}</view>
-						</view>
-					</view>
-					<view v-else>
-						<!-- 提示信息 -->
-						<component-no-data :propStatus="0"></component-no-data>
-					</view>
-				</view>
-			</view>
-		</component-popup>
-	</view>
+                            <view :class="'item-content ' + ((item.bg_color || null) == null ? 'item-exposed' : '')" :data-value="item.event_value" :data-type="item.event_type" @tap="navigation_event" :style="(item.bg_color || null) == null ? '' : 'background-color:' + item.bg_color + ';'">
+                                <image :src="item.images_url" mode="aspectFit"></image>
+                            </view>
+                            <view class="title">{{ item.name }}</view>
+                        </view>
+                    </view>
+                    <view v-else>
+                        <!-- 提示信息 -->
+                        <component-no-data :propStatus="0"></component-no-data>
+                    </view>
+                </view>
+            </view>
+        </component-popup>
+    </view>
 </template>
 <script>
-	const app = getApp();
-	import componentPopup from "../popup/popup";
-	import componentNoData from "../no-data/no-data";
-	var common_static_url = app.globalData.get_static_url('common');
-	export default {
-		data() {
-			return {
-				common_static_url: common_static_url,
-				popup_status: false,
-				quick_status: 0,
-				data_list: [],
-				system: null,
-				x: 0,
-				y: 0,
-				top: 0,
-				height_dec: 0,
-				is_first: 1,
-				common_ent: ''
-			};
-		},
-		components: {
-			componentPopup,
-			componentNoData
-		},
-		props: {
-			propIsBar: {
-				type: Boolean,
-				default: false
-			},
-			propIsNav: {
-				type: Boolean,
-				default: false
-			},
-			propIsGrayscale: {
-				type: Boolean,
-				default: false
-			}
-		},
-		// 属性值改变监听
-		watch: {
-			// 是否灰度
-			propIsGrayscale(value, old_value) {
-				this.common_ent = value ? 'grayscale' : '';
-			}
-		},
-		// 页面被展示
-		created: function() {
-			this.init_config();
+    const app = getApp();
+    import componentPopup from '../popup/popup';
+    import componentNoData from '../no-data/no-data';
+    var common_static_url = app.globalData.get_static_url('common');
+    export default {
+        data() {
+            return {
+                common_static_url: common_static_url,
+                popup_status: false,
+                quick_status: 0,
+                data_list: [],
+                system: null,
+                x: 0,
+                y: 0,
+                top: 0,
+                height_dec: 0,
+                is_first: 1,
+                common_ent: '',
+            };
+        },
+        components: {
+            componentPopup,
+            componentNoData,
+        },
+        props: {
+            propIsBar: {
+                type: Boolean,
+                default: false,
+            },
+            propIsNav: {
+                type: Boolean,
+                default: false,
+            },
+            propIsGrayscale: {
+                type: Boolean,
+                default: false,
+            },
+        },
+        // 属性值改变监听
+        watch: {
+            // 是否灰度
+            propIsGrayscale(value, old_value) {
+                this.common_ent = value ? 'grayscale' : '';
+            },
+        },
+        // 页面被展示
+        created: function () {
+            this.init_config();
 
-			// 页面是否定义导航
-			var value = this.propIsNav ? 170 : 0;
-			this.top = value
-			this.height_dec = value;
-			// #ifdef H5 || APP
-			this.top = 90;
-			this.height_dec = this.propIsBar ? 190 : 90;
-			// #endif
+            // 页面是否定义导航
+            var value = this.propIsNav ? 170 : 0;
+            this.top = value;
+            this.height_dec = value;
+            // #ifdef H5 || APP
+            this.top = 20;
+            this.height_dec = this.propIsBar ? 190 : 90;
+            // #endif
 
-			// 非首次进入则重新初始化配置接口
-			if (this.is_first == 0) {
-				app.globalData.init_config();
-			}
+            // 非首次进入则重新初始化配置接口
+            if (this.is_first == 0) {
+                app.globalData.init_config();
+            }
 
-			// 数据设置
-			var system = app.globalData.get_system_info(null, null, true);
-			var height = app.globalData.window_height_handle(system);
-			this.setData({
-				is_first: 0,
-				system: system,
-				x: 12,
-				y: height - 280,
-				// 是否灰度
-				common_ent: this.propIsGrayscale ? 'grayscale' : ''
-			});
-		},
-		methods: {
-			// 初始化配置
-			init_config(status) {
-				if ((status || false) == true) {
-					this.setData({
-						data_list: app.globalData.get_config('quick_nav') || [],
-						quick_status: app.globalData.get_config('config.home_navigation_main_quick_status') || 0
-					});
-				} else {
-					app.globalData.is_config(this, 'init_config');
-				}
-			},
+            // 数据设置
+            var system = app.globalData.get_system_info(null, null, true);
+            var height = app.globalData.window_height_handle(system);
+            var width = app.globalData.window_width_handle(system.windowWidth);
+            this.setData({
+                is_first: 0,
+                system: system,
+                x: width - 43,
+                y: height - 120,
+                // 是否灰度
+                common_ent: this.propIsGrayscale ? 'grayscale' : '',
+            });
+        },
+        methods: {
+            // 初始化配置
+            init_config(status) {
+                if ((status || false) == true) {
+                    this.setData({
+                        data_list: app.globalData.get_config('quick_nav') || [],
+                        quick_status: app.globalData.get_config('config.home_navigation_main_quick_status') || 0,
+                    });
+                } else {
+                    app.globalData.is_config(this, 'init_config');
+                }
+            },
 
-			// 弹层开启
-			quick_open_event(e) {
-				this.setData({
-					popup_status: true,
-					data_list: app.globalData.get_config('quick_nav') || []
-				});
-			},
+            // 弹层开启
+            quick_open_event(e) {
+                this.setData({
+                    popup_status: true,
+                    data_list: app.globalData.get_config('quick_nav') || [],
+                });
+            },
 
-			// 弹层关闭
-			quick_close_event(e) {
-				this.setData({
-					popup_status: false
-				});
-			},
+            // 弹层关闭
+            quick_close_event(e) {
+                this.setData({
+                    popup_status: false,
+                });
+            },
 
-			// 操作事件
-			navigation_event(e) {
-				app.globalData.operation_event(e);
-			}
-		}
-	};
+            // 操作事件
+            navigation_event(e) {
+                app.globalData.operation_event(e);
+            },
+        },
+    };
 </script>
 <style>
-	/**
+    /**
      * 按钮
      */
-	.quick-movable-container {
-		position: fixed;
-		width: 100%;
-		height: 100%;
-		top: 0;
-		left: 0;
-		background: transparent;
-		pointer-events: none;
-		z-index: 2;
-	}
+    .quick-movable-container {
+        position: fixed;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+        background: transparent;
+        pointer-events: none;
+        z-index: 2;
+    }
 
-	.quick-event-submit {
-		pointer-events: auto;
-		width: 31px;
-		height: 31px;
-		border-radius: 50%;
-		box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
-		opacity: 0.8;
-	}
+    .quick-event-submit {
+        pointer-events: auto;
+        width: 50px;
+        height: 50px;
+        border-radius: 50%;
+    }
 
-	.quick-event-submit image {
-		width: 17px !important;
-		height: 17px !important;
-		margin: 7px auto 7px auto;
-		display: block;
-	}
+    .quick-event-submit image {
+        width: 50px !important;
+        height: 50px !important;
+        display: block;
+        position: relative;
+        z-index: 10;
+    }
 
-	/**
+    /**
      * 弹窗
      */
-	.nav-popup-container {
-		padding: 20rpx 10rpx 0 10rpx;
-		background: #fff;
-	}
+    .nav-popup-container {
+        padding: 20rpx 10rpx 0 10rpx;
+        background: #fff;
+    }
 
-	.nav-popup-container .close {
-		overflow: hidden;
-	}
+    .nav-popup-container .close {
+        overflow: hidden;
+    }
 
-	.nav-popup-container .close .icon-right {
-		float: right;
-	}
+    .nav-popup-container .close .icon-right {
+        float: right;
+    }
 
-	.nav-popup-content {
-		max-height: 80vh;
-		overflow-y: scroll;
-		overflow-x: hidden;
-		padding-bottom: 20rpx;
-	}
+    .nav-popup-content {
+        max-height: 80vh;
+        overflow-y: scroll;
+        overflow-x: hidden;
+        padding-bottom: 20rpx;
+    }
 
-	/**
+    /**
      * 内容
      */
-	.nav-data-list {
-		overflow: hidden;
-		background: #fff;
-	}
+    .nav-data-list {
+        overflow: hidden;
+        background: #fff;
+    }
 
-	.nav-data-list .item {
-		width: calc(25% - 60rpx);
-		float: left;
-		padding: 30rpx;
-		/* #ifdef H5 */
-		cursor: pointer;
-		/* #endif */
-	}
+    .nav-data-list .item {
+        width: calc(25% - 60rpx);
+        float: left;
+        padding: 30rpx;
+        /* #ifdef H5 */
+        cursor: pointer;
+        /* #endif */
+    }
 
-	.nav-data-list .item-content {
-		border-radius: 50%;
-		padding: 20rpx;
-		text-align: center;
-		margin: 0 auto;
-		-webkit-box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
-		box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
-	}
+    .nav-data-list .item-content {
+        border-radius: 50%;
+        padding: 20rpx;
+        text-align: center;
+        margin: 0 auto;
+        -webkit-box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
+        box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
+    }
 
-	.nav-data-list .item-content,
-	.nav-data-list .item image {
-		width: 70rpx !important;
-		height: 70rpx !important;
-	}
+    .nav-data-list .item-content,
+    .nav-data-list .item image {
+        width: 70rpx !important;
+        height: 70rpx !important;
+    }
 
-	.nav-data-list .item .item-exposed {
-		padding: 0;
-		-webkit-box-shadow: none;
-		box-shadow: none;
-	}
+    .nav-data-list .item .item-exposed {
+        padding: 0;
+        -webkit-box-shadow: none;
+        box-shadow: none;
+    }
 
-	.nav-data-list .item .item-exposed,
-	.nav-data-list .item .item-exposed image {
-		width: 110rpx !important;
-		height: 110rpx !important;
-	}
+    .nav-data-list .item .item-exposed,
+    .nav-data-list .item .item-exposed image {
+        width: 110rpx !important;
+        height: 110rpx !important;
+    }
 
-	.nav-data-list .item .title {
-		margin-top: 10rpx;
-		font-size: 28rpx !important;
-		text-align: center;
-		-o-text-overflow: ellipsis;
-		text-overflow: ellipsis;
-		overflow: hidden;
-		white-space: nowrap;
-		max-width: 100%;
-	}
-</style>
\ No newline at end of file
+    .nav-data-list .item .title {
+        margin-top: 10rpx;
+        font-size: 28rpx !important;
+        text-align: center;
+        -o-text-overflow: ellipsis;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: nowrap;
+        max-width: 100%;
+    }
+
+    /**
+     * 呼吸灯
+     */
+    .breathe {
+        background-color: rgb(89 181 255);
+        border-radius: 100%;
+        width: 50px;
+        height: 50px;
+        position: relative;
+    }
+
+    .breathe::before,
+    .breathe::after {
+        background-color: rgba(89, 181, 255, 0.3);
+    }
+
+    .breathe::before {
+        width: 50px;
+        height: 50px;
+        top: 0;
+        left: 0;
+    }
+
+    .breathe::after {
+        width: 55px;
+        height: 55px;
+        top: -2.5px;
+        left: -2.5px;
+    }
+</style>