联系客服优化

hdApp/src/pagesPurchase/ghsProduct.vue

@@ -38,7 +38,7 @@
 
 		<view class="input-wrap" >
 			<view class="header-action-wrap header-action-wrap--left">
-				<button class="admin-button-com blue header-action-btn" @click="selectFlowerNumFn()">图片分类</button>
+				<button class="admin-button-com blue header-action-btn" @click="selectFlowerNumFn()">图片筛选</button>
 			</view>
 			<view class="search-bar">
 				<app-search-module v-model="py" placeholder="最少输二到三字搜索" placeholder-color="red" @input="goSearchFn" />
@@ -177,22 +177,33 @@
 		</uni-popup>
 
 		<uni-popup ref="showWx" type="center" :animation="false" class="class-popup-style-wx">
-			<view style="width:80vw;background-color: white;border-radius:15upx;padding:35upx 0 35upx 0;">
-				<view style="margin:40upx 0 20upx 0;font-size:34upx;font-weight:bold;width:80vw;text-align:center;">请长按识别二维码</view>
-				<image :src="superWx" style="width:50vw;margin:0 auto;" mode="widthFix" show-menu-by-longpress="true"></image>
-				<view style="margin:30upx 0 30upx 0;font-size:30upx;font-weight:bold;width:80vw;text-align:center;display: flex;align-items: center; justify-content: center;" @click="callUp()">
-					<text style="font-size:34upx;">联系电话：{{ telephone }}</text>
-					<button class="admin-button-com mini-btn blue" style="margin-left:20upx;">拨打</button>
+			<!-- 微信客服弹层：二维码 + 电话 + 关闭，统一卡片排版 -->
+			<view class="wx-popup-card">
+				<text class="wx-popup-title">请长按识别二维码</text>
+				<view class="wx-popup-qr-wrap">
+					<image
+						class="wx-popup-qr"
+						:src="superWx"
+						mode="widthFix"
+						show-menu-by-longpress="true"
+					></image>
 				</view>
-				<view style="width:80vw;margin:60upx 0 60upx 0;display:flex;align-items: center; justify-content: center;">
-					<button class="admin-button-com big blue" style="width:260upx;" @click="closeWxShow()">关闭</button>
+				<view class="wx-popup-phone" @click="callUp()">
+					<text class="wx-popup-phone-label">联系电话</text>
+					<text class="wx-popup-phone-num">{{ telephone }}</text>
+					<button class="admin-button-com mini-btn blue wx-popup-call-btn" @click.stop="callUp()">拨打</button>
 				</view>
+				<button class="admin-button-com big blue wx-popup-close-btn" @click="closeWxShow()">关闭</button>
 			</view>
 		</uni-popup>
 
-		<view v-if="superWx!=''" @click="toViewWx" style="width:200upx;height:84upx;position:fixed;bottom:210upx;right:-34upx;border-radius:40upx;background: rgba(0,0,0,.60);display: flex;align-items: center;">
-			<image :src="`${constant.imgUrl}/mall/wx_code2.png`" style="width:74upx;height:74upx;margin-left:8upx;" mode="widthFix"></image>
-			<view style="width:90upx;color:white;margin-left:8upx;">扫码添加微信</view>
+		<!-- 客服入口：图标按钮，点击打开微信二维码弹层 -->
+		<view
+			v-if="superWx!=''"
+			class="wx-service-float"
+			@click="toViewWx"
+		>
+			<zui-svg-icon icon="general-customerService" :width="28" :height="28"></zui-svg-icon>
 		</view>
 
 		<view v-if="ghsInfo.black && ghsInfo.black == 2" style="position:fixed;bottom:180upx;z-index:99999;
@@ -918,6 +929,85 @@ export default {
 	z-index:999999;
 	border-radius:20upx;
 }
+
+/* 微信客服弹层卡片：标题、二维码、电话、关闭分层排布 */
+.wx-popup-card {
+	width: 620upx;
+	max-width: 86vw;
+	background: #ffffff;
+	border-radius: 24upx;
+	padding: 48upx 40upx 40upx;
+	box-sizing: border-box;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	box-shadow: 0 12upx 40upx rgba(0, 0, 0, 0.12);
+}
+
+.wx-popup-title {
+	font-size: 32upx;
+	font-weight: 700;
+	color: #222;
+	line-height: 1.4;
+	text-align: center;
+}
+
+.wx-popup-qr-wrap {
+	width: 420upx;
+	margin-top: 36upx;
+	padding: 20upx;
+	box-sizing: border-box;
+	background: #f7f8fa;
+	border-radius: 16upx;
+	border: 2upx solid #eef0f3;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.wx-popup-qr {
+	width: 100%;
+	display: block;
+}
+
+.wx-popup-phone {
+	width: 100%;
+	margin-top: 36upx;
+	padding: 20upx 24upx;
+	box-sizing: border-box;
+	background: #f7f8fa;
+	border-radius: 12upx;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+}
+
+.wx-popup-phone-label {
+	font-size: 26upx;
+	color: #888;
+	flex-shrink: 0;
+}
+
+.wx-popup-phone-num {
+	font-size: 30upx;
+	font-weight: 700;
+	color: #222;
+	margin-left: 12upx;
+	flex: 1;
+	min-width: 0;
+}
+
+.wx-popup-call-btn {
+	flex-shrink: 0;
+	margin: 0 0 0 16upx;
+}
+
+.wx-popup-close-btn {
+	width: 100%;
+	margin-top: 40upx;
+	box-sizing: border-box;
+}
 .billing_box_bg {
 	height: 100%;
 	display: flex;
@@ -1311,4 +1401,22 @@ export default {
 		line-height: 1;
 	}
 }
+
+/* 底部右侧客服浮钮：白底默认色图标，淡绿描边 */
+.wx-service-float {
+	position: fixed;
+	bottom: 170upx;
+	right: 40upx;
+	width: 84upx;
+	height: 84upx;
+	border-radius: 50%;
+	background: #ffffff;
+	border: 2upx solid #b7ebc9;
+	box-sizing: border-box;
+	box-shadow: 0 4upx 16upx rgba(0, 0, 0, 0.12);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	z-index: 99;
+}
 </style>