From 364cba07b9c8eefa894c70c9d224682454cf5eb5 Mon Sep 17 00:00:00 2001 From: dzq Date: Sat, 20 Dec 2025 15:17:15 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E7=94=A8=E6=88=B7=E7=95=8C=E9=9D=A2):=20?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=AE=A2=E6=9C=8D=E5=8A=9F=E8=83=BD=E5=B9=B6?= =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=A0=BC=E5=8F=A3=E9=80=89=E6=8B=A9=E7=95=8C?= =?UTF-8?q?=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增微信客服功能入口及处理逻辑 - 添加不同尺寸格口的SVG图标资源 - 重构格口类型选择为卡片式布局，增加视觉反馈 - 简化取件流程，取消自动清空格口步骤 - 调整页面按钮布局，优化用户体验 --- .../storage-cells-summary/index.vue | 170 ++++++++++++++++-- src/pages/me/index.vue | 50 ++++-- src/static/svg/extra-large-cell.svg | 4 + src/static/svg/large-cell.svg | 4 + src/static/svg/medium-cell.svg | 4 + src/static/svg/small-cell.svg | 4 + 6 files changed, 210 insertions(+), 26 deletions(-) create mode 100644 src/static/svg/extra-large-cell.svg create mode 100644 src/static/svg/large-cell.svg create mode 100644 src/static/svg/medium-cell.svg create mode 100644 src/static/svg/small-cell.svg diff --git a/src/components/storage-cells-summary/index.vue b/src/components/storage-cells-summary/index.vue index 787b5a9..b142eec 100644 --- a/src/components/storage-cells-summary/index.vue +++ b/src/components/storage-cells-summary/index.vue @@ -216,32 +216,41 @@ async function handleRetrieveFlow() { password: String(password) }) - // 4. 成功提示并询问是否清空 + // 4. 成功提示 + uni.showToast({ + title: '格口已打开', + icon: 'success' + }) + + // 注释掉清空格口部分，打开格口即显示打开成功结束流程 + /* + // 成功提示并询问是否清空 await message.alert({ title: '格口已打开', - msg: '柜子已开，请取物品！如不再使用柜子请点击 “清空” 。', + msg: '柜子已开，请取物品！如不再使用柜子请点击 "清空" 。', confirmButtonText: '清空', closeOnClickModal: false }) - // 5. 确认清空弹窗 + // 确认清空弹窗 await message.confirm({ title: '确认清空', msg: '清空后密码将不能再次使用，确认清空？', closeOnClickModal: false }) - // 6. 重置格口状态 + // 重置格口状态 await resetByPassword({ shopId: props.shopId, password: String(password) }) - // 7. 重置成功提示 + // 重置成功提示 uni.showToast({ title: '格口已清空', icon: 'success' }) + */ } catch (error) { // 错误处理 // 用户取消操作（message.prompt/confirm/alert 返回 'cancel' 字符串或包含 cancel 的错误） @@ -265,6 +274,42 @@ async function handleRetrieveFlow() { } } +// 格口类型图标映射（需验证图标名称可用性） +const CELL_TYPE_ICON_MAP = { + 1: 'box', // 小格 + 2: 'archive', // 中格 + 3: 'package', // 大格 + 4: 'cube' // 超大格 +} as const + +function getCellImg(type: number): string { + switch (type) { + case 1: + return '/static/svg/small-cell.svg' + case 2: + return '/static/svg/medium-cell.svg' + case 3: + return '/static/svg/large-cell.svg' + case 4: + return '/static/svg/extra-large-cell.svg' + default: + return '/static/svg/small-cell.svg' + } +} + +// 处理格口类型选择 +function handleCellTypeSelect(stat: { type: number; count: number }) { + if (stat.count === 0) { + uni.showToast({ + title: '该类型格口暂不可用', + icon: 'none', + duration: 1500 + }) + return + } + selectedCellType.value = stat.type +} + // 生命周期钩子 onMounted(() => { if (props.autoLoad !== false) { @@ -310,16 +355,28 @@ onMounted(() => { - - + - {{ stat.name }} ({{ stat.count }}) - - + + + + + {{ stat.name }} + 剩余{{ stat.count }}个可用 + + + @@ -384,8 +441,83 @@ onMounted(() => { .cell-type-selection { margin-bottom: 48rpx; - .wd-radio { - margin-bottom: 16rpx; + .cell-type-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 16rpx; + + .cell-type-card { + position: relative; + padding: 32rpx 24rpx; + background: #fff; + border: 1px solid #e0e0e0; + border-radius: 16rpx; + text-align: center; + transition: all 0.3s ease; + + &:active:not(.cell-type-card--disabled) { + transform: translateY(2px); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); + } + + &--selected { + border-color: #2979ff; + background: rgba(41, 121, 255, 0.04); + box-shadow: 0 4rpx 16rpx rgba(41, 121, 255, 0.15); + + .cell-type-name { + color: #2979ff; + font-weight: 500; + } + + .cell-type-count { + color: #2979ff; + } + } + + &--disabled { + background: #f9f9f9; + border-color: #f0f0f0; + opacity: 0.6; + + .cell-type-name, + .cell-type-count { + color: #ccc; + } + } + + .cell-type-icon { + margin-bottom: 16rpx; + } + + .cell-type-name { + display: block; + font-size: 28rpx; + font-weight: 400; + color: #333; + margin-bottom: 8rpx; + } + + .cell-type-count { + display: block; + font-size: 24rpx; + color: #666; + } + + .cell-type-selected-indicator { + position: absolute; + top: -8rpx; + right: -8rpx; + width: 32rpx; + height: 32rpx; + background: #2979ff; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 2rpx 8rpx rgba(41, 121, 255, 0.3); + } + } } } @@ -424,5 +556,11 @@ onMounted(() => { /* 保留空白，自动换行 */ white-space: pre-wrap; } + + .product-image { + width: 80rpx; + height: 80rpx; + border-radius: 4px; + } } \ No newline at end of file diff --git a/src/pages/me/index.vue b/src/pages/me/index.vue index 1bea7fc..d212906 100644 --- a/src/pages/me/index.vue +++ b/src/pages/me/index.vue @@ -9,7 +9,7 @@ import { generateDynamicCode, getWxUserByOpenid } from '@/api/users' import { DynamicCodeResponse } from '@/api/users/types' import { bindWxMpUserByOpenid } from '@/api/ab98' import { BindWxMpUserByOpenidCommand } from '@/api/ab98/types' -import { useToast } from 'wot-design-uni' +import { useToast, useMessage } from 'wot-design-uni' definePage({ style: { @@ -43,6 +43,7 @@ const showProfileSetupButton = computed(() => { const dynamicCodeActionSheet = ref(false) const dynamicCodeData = ref(null) const toast = useToast() +const message = useMessage() // 汇邦云登录相关 const hbLoginPopupVisible = ref(false) @@ -111,6 +112,32 @@ const navigateToPage = (pagePath: string, options: { type?: 'navigateTo' | 'swit } } +const openWxService = async () => { + try { + // 确认是否转到客服 + await message.confirm({ + title: '客服咨询', + msg: '确认离开小程序，前往客服中心？', + closeOnClickModal: false + }) + + wx.openCustomerServiceChat({ + extInfo: { + url: 'https://work.weixin.qq.com/kfid/kfce354fbeb3c58be22', + }, + corpId: 'ww25c80308cbccc46a', + }); + } catch (error) { + // 用户取消操作 + if (error === 'cancel' || (error as any)?.message?.includes?.('cancel')) { + return + } + + console.error('打开客服失败:', error) + toast.show('打开客服失败') + } +} + onMounted(() => { wxStore.refreshBalance(); }); @@ -246,32 +273,35 @@ const handleHbLoginSubmit = async () => { 我的柜子 + + + 系统客服 + 动态码 - - - 绑定汇邦云 - - - - --> + diff --git a/src/static/svg/extra-large-cell.svg b/src/static/svg/extra-large-cell.svg new file mode 100644 index 0000000..0ef9993 --- /dev/null +++ b/src/static/svg/extra-large-cell.svg @@ -0,0 +1,4 @@ + + + diff --git a/src/static/svg/large-cell.svg b/src/static/svg/large-cell.svg new file mode 100644 index 0000000..2c24493 --- /dev/null +++ b/src/static/svg/large-cell.svg @@ -0,0 +1,4 @@ + + + diff --git a/src/static/svg/medium-cell.svg b/src/static/svg/medium-cell.svg new file mode 100644 index 0000000..0bede55 --- /dev/null +++ b/src/static/svg/medium-cell.svg @@ -0,0 +1,4 @@ + + + diff --git a/src/static/svg/small-cell.svg b/src/static/svg/small-cell.svg new file mode 100644 index 0000000..94b5f51 --- /dev/null +++ b/src/static/svg/small-cell.svg @@ -0,0 +1,4 @@ + + +