From 8093497c518d31e0c9ba78721086cabb44454470 Mon Sep 17 00:00:00 2001 From: XingQue Date: Mon, 29 Jun 2026 19:14:03 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20=E6=8A=A2=E5=8D=95=E6=B1=A0=E6=9C=BA?= =?UTF-8?q?=E7=94=B2UI=E6=94=B9=E9=80=A0=E5=89=8D=E5=A4=87=E4=BB=BD?= =?UTF-8?q?=E5=BD=93=E5=89=8D=E5=B7=A5=E4=BD=9C=E5=8C=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Cursor --- components/kefu-float/kefu-float.js | 37 +++++++-- components/kefu-float/kefu-float.wxml | 12 +-- components/kefu-float/kefu-float.wxss | 115 +++++++++++--------------- pages/accept-order/accept-order.json | 4 +- pages/accept-order/accept-order.wxss | 2 +- utils/kefu-nav.js | 15 ++++ 6 files changed, 101 insertions(+), 84 deletions(-) diff --git a/components/kefu-float/kefu-float.js b/components/kefu-float/kefu-float.js index e9dc0ee..2395f96 100644 --- a/components/kefu-float/kefu-float.js +++ b/components/kefu-float/kefu-float.js @@ -1,4 +1,4 @@ -import { openCustomerServiceChat } from '../../utils/kefu-nav.js'; +import { openCustomerServiceChat, resolveKefuIconUrl } from '../../utils/kefu-nav.js'; Component({ properties: { @@ -10,35 +10,54 @@ Component({ sessionHidden: false, csUnread: 0, floatY: 520, + iconUrl: '', }, lifetimes: { attached() { + const app = getApp(); + this._syncIcon(); this._syncFromGlobal(); this._initFloatY(); this._convHandler = () => this.syncCsUnread(); - const app = getApp(); - if (app.on) app.on('conversationsUpdated', this._convHandler); - if (app.on) app.on('unreadCountChanged', this._convHandler); + this._configHandler = () => this._syncIcon(); + if (app.on) { + app.on('conversationsUpdated', this._convHandler); + app.on('unreadCountChanged', this._convHandler); + app.on('configApplied', this._configHandler); + } this.syncCsUnread(); }, detached() { const app = getApp(); - if (this._convHandler && app.off) { - app.off('conversationsUpdated', this._convHandler); - app.off('unreadCountChanged', this._convHandler); + if (app.off) { + if (this._convHandler) { + app.off('conversationsUpdated', this._convHandler); + app.off('unreadCountChanged', this._convHandler); + } + if (this._configHandler) { + app.off('configApplied', this._configHandler); + } } }, }, pageLifetimes: { show() { + this._syncIcon(); this._syncFromGlobal(); this.syncCsUnread(); }, }, methods: { + _syncIcon() { + const url = resolveKefuIconUrl(getApp()); + if (url && url !== this.data.iconUrl) { + this.setData({ iconUrl: url }); + } + }, + _initFloatY() { const app = getApp(); if (app.globalData.kefuFloatY != null) { @@ -88,6 +107,10 @@ Component({ }); }, + onIconError() { + this._syncIcon(); + }, + onContact() { openCustomerServiceChat(); }, diff --git a/components/kefu-float/kefu-float.wxml b/components/kefu-float/kefu-float.wxml index 48ce5ee..b917873 100644 --- a/components/kefu-float/kefu-float.wxml +++ b/components/kefu-float/kefu-float.wxml @@ -12,11 +12,10 @@ {{csUnread > 99 ? '99+' : csUnread}} - 💬 + 联系客服 - 客服有新消息 - 咨询订单 / 账号问题 + 有新消息 @@ -25,7 +24,6 @@ 本次不再显示 - × @@ -34,12 +32,10 @@ {{csUnread > 99 ? '99+' : csUnread}} - 💬 - 联系客服 + - × - 本次隐藏 + 隐藏 diff --git a/components/kefu-float/kefu-float.wxss b/components/kefu-float/kefu-float.wxss index 852b86e..af0783e 100644 --- a/components/kefu-float/kefu-float.wxss +++ b/components/kefu-float/kefu-float.wxss @@ -13,7 +13,7 @@ height: auto; pointer-events: auto; position: absolute; - right: 24rpx; + right: 20rpx; top: 0; } @@ -31,38 +31,39 @@ .kefu-float--full { display: flex; align-items: stretch; - background: linear-gradient(135deg, #07c160 0%, #06ad56 100%); - border-radius: 20rpx; - box-shadow: 0 8rpx 28rpx rgba(7, 193, 96, 0.35); + background: #fff; + border-radius: 16rpx; + box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1); + border: 1rpx solid rgba(124, 58, 237, 0.18); overflow: visible; } .kefu-unread-badge { position: absolute; - top: -12rpx; - right: -8rpx; - min-width: 36rpx; - height: 36rpx; - line-height: 36rpx; - padding: 0 8rpx; + top: -10rpx; + right: -6rpx; + min-width: 32rpx; + height: 32rpx; + line-height: 32rpx; + padding: 0 6rpx; background: #fa5151; color: #fff; - font-size: 20rpx; + font-size: 18rpx; text-align: center; - border-radius: 18rpx; + border-radius: 16rpx; border: 2rpx solid #fff; z-index: 2; } .kefu-unread-badge--mini { - top: -8rpx; + top: -6rpx; right: -4rpx; } .kefu-float-main { display: flex; align-items: center; - padding: 20rpx 24rpx; + padding: 14rpx 16rpx; flex: 1; } @@ -70,10 +71,12 @@ opacity: 0.88; } -.kefu-float-icon { - font-size: 36rpx; - margin-right: 14rpx; +.kefu-float-icon-img { + width: 36rpx; + height: 36rpx; + margin-right: 10rpx; flex-shrink: 0; + border-radius: 8rpx; } .kefu-text-col { @@ -83,67 +86,54 @@ } .kefu-float-text { - font-size: 28rpx; - color: #fff; + font-size: 24rpx; + color: #333; font-weight: 600; white-space: nowrap; } .kefu-float-sub { - font-size: 20rpx; - color: rgba(255, 255, 255, 0.95); - margin-top: 4rpx; -} - -.kefu-float-sub--muted { - color: rgba(255, 255, 255, 0.75); + font-size: 18rpx; + color: #fa5151; + margin-top: 2rpx; } .kefu-float-close { - width: 64rpx; + width: 48rpx; display: flex; align-items: center; justify-content: center; - background: rgba(0, 0, 0, 0.12); - color: rgba(255, 255, 255, 0.95); - font-size: 38rpx; + background: #f5f3ff; + color: #999; + font-size: 32rpx; line-height: 1; + border-left: 1rpx solid rgba(124, 58, 237, 0.1); } .kefu-float-close:active { - background: rgba(0, 0, 0, 0.2); + background: #ede9fe; } .kefu-permanent-row { display: flex; align-items: center; justify-content: flex-end; - margin-top: 10rpx; - padding: 8rpx 12rpx; - background: rgba(255, 255, 255, 0.92); - border-radius: 24rpx; - box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08); + margin-top: 6rpx; + padding: 4rpx 10rpx; } .kefu-permanent-row:active { - opacity: 0.85; + opacity: 0.75; } .kefu-permanent-row--mini { - margin-top: 8rpx; - padding: 6rpx 14rpx; + margin-top: 4rpx; + padding: 2rpx 8rpx; } .kefu-permanent-label { - font-size: 22rpx; - color: #888; - margin-right: 8rpx; -} - -.kefu-permanent-x { - font-size: 28rpx; - color: #bbb; - line-height: 1; + font-size: 20rpx; + color: #aaa; } .kefu-wrap--mini { @@ -151,29 +141,24 @@ } .kefu-float--mini { - width: auto; - min-width: 160rpx; - padding: 16rpx 24rpx; - border-radius: 48rpx; - background: linear-gradient(135deg, #07c160 0%, #06ad56 100%); - box-shadow: 0 6rpx 20rpx rgba(7, 193, 96, 0.3); + width: 72rpx; + height: 72rpx; + padding: 0; + border-radius: 50%; + background: #fff; + box-shadow: 0 4rpx 14rpx rgba(0, 0, 0, 0.1); + border: 1rpx solid rgba(124, 58, 237, 0.2); display: flex; - flex-direction: column; align-items: center; + justify-content: center; } .kefu-float--mini:active { transform: scale(0.96); } -.kefu-float-mini-icon { - font-size: 36rpx; -} - -.kefu-mini-label { - font-size: 22rpx; - color: #fff; - font-weight: 500; - margin-top: 4rpx; - white-space: nowrap; +.kefu-float-mini-icon-img { + width: 40rpx; + height: 40rpx; + border-radius: 8rpx; } diff --git a/pages/accept-order/accept-order.json b/pages/accept-order/accept-order.json index fc97bc8..2256cc0 100644 --- a/pages/accept-order/accept-order.json +++ b/pages/accept-order/accept-order.json @@ -1,8 +1,6 @@ { "navigationBarTitleText": "抢单大厅", "navigationBarBackgroundColor": "#c4b5fd", - "backgroundColor": "#c4b5fd", - "backgroundColorTop": "#c4b5fd", "navigationBarTextStyle": "black", "enablePullDownRefresh": false, "backgroundTextStyle": "dark", @@ -12,4 +10,4 @@ "global-notification": "/components/global-notification/global-notification", "kefu-float": "/components/kefu-float/kefu-float" } - } \ No newline at end of file + } diff --git a/pages/accept-order/accept-order.wxss b/pages/accept-order/accept-order.wxss index 73b1ba6..bf81637 100644 --- a/pages/accept-order/accept-order.wxss +++ b/pages/accept-order/accept-order.wxss @@ -771,7 +771,7 @@ page { max-width: 50%; } - /* 被指定订单 */ + /* 被指定订单（功能样式，不影响订单卡片原 UI） */ .my-zhiding-banner { margin: 16rpx 24rpx 0; padding: 22rpx; diff --git a/utils/kefu-nav.js b/utils/kefu-nav.js index e5a1e38..55caa57 100644 --- a/utils/kefu-nav.js +++ b/utils/kefu-nav.js @@ -10,3 +10,18 @@ export function openCustomerServiceChat() { url: '/pages/cs-chat/cs-chat?data=' + encodeURIComponent(JSON.stringify(param)), }); } + +/** 与打手「我的」页在线客服同一图标：beijing/tubiao/grzx_kefu.jpg */ +export function resolveKefuIconUrl(app) { + app = app || getApp(); + const rel = 'beijing/tubiao/grzx_kefu.jpg'; + let base = (app.globalData && app.globalData.ossImageUrl) || ''; + if (!base && typeof app.readConfigFromStorage === 'function') { + try { + const cached = app.readConfigFromStorage(); + base = (cached && cached.cos && cached.cos.ossImageUrl) || ''; + } catch (e) {} + } + if (!base) return ''; + return base.endsWith('/') ? base + rel : base + rel; +}