From e7eb8d64aa8417b6661c4a817fbe39cb7ae431ad Mon Sep 17 00:00:00 2001 From: hly <2783385703@qq.com> Date: Fri, 15 Aug 2025 14:43:37 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E8=B4=A8=E6=A3=80):=20=E5=AE=8C=E5=96=84?= =?UTF-8?q?=E8=B4=A8=E6=A3=80=E5=8A=9F=E8=83=BD=E5=B9=B6=E4=BC=98=E5=8C=96?= =?UTF-8?q?UI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在订单详情页添加跳转质检功能 - 质检结果页支持多商品理由选择和图片上传 - 质检页增加价格范围显示和商品数量配置 - 调整UI样式使用rpx单位适配不同屏幕 - 修改图片上传限制为9张并优化布局 --- pages/component/recycle.vue | 9 +- pages/manager/inspect-result.vue | 58 ++++++------ pages/manager/inspect.vue | 191 ++++++++++++++++++++++++--------------- pages/manager/order-detail.vue | 3 +- 4 files changed, 159 insertions(+), 102 deletions(-) diff --git a/pages/component/recycle.vue b/pages/component/recycle.vue index d64aea3..2ca1992 100644 --- a/pages/component/recycle.vue +++ b/pages/component/recycle.vue @@ -547,6 +547,11 @@ export default { const item = config.find(i => i.keyName === 'min_money'); return item ? parseFloat(item.keyContent) : 0; }, + minMumber() { + const config = getApp().globalData.configData || []; + const item = config.find(i => i.keyName === 'min_number'); + return item ? parseFloat(item.keyContent) : 0; + }, // 计算比预计回收多的金额（商品回收价格 - (商品回收价格 * 0.066)） extraRecycleAmount() { const minPrice = parseFloat(this.priceRange.min) || 0; @@ -822,9 +827,9 @@ export default { return } - if (this.totalCount < 3 || Number(this.totalPrice) < this.minMoney) { + if (this.totalCount < this.minMumber || Number(this.totalPrice) < this.minMoney) { uni.showToast({ - title: `各品类混合需要满3${this.totalUnitText}并且各品类混合需要满${this.minMoney}元才能回收哦`, + title: `各品类混合需要满${this.minMumber}${this.totalUnitText}并且各品类混合需要满${this.minMoney}元才能回收哦`, icon: 'none' }) return diff --git a/pages/manager/inspect-result.vue b/pages/manager/inspect-result.vue index ab89549..8851ce9 100644 --- a/pages/manager/inspect-result.vue +++ b/pages/manager/inspect-result.vue @@ -14,7 +14,7 @@ 合格产品 - + {{ item.shopId ? getGoodsName(item.shopId) : (item.id === 'unrecyclable' ? '不可回收' @@ -24,13 +24,16 @@ x{{ item.count }} ¥{{ item.total }} - - {{ getGoodsName(item.shopId) }} - - - {{ hasSelectedReason(item) ? '已选择' : '请选择理由（选填）' }} - - + + + + {{ getGoodsName(item.shopId) }}{{ index + 1 }} + + + {{ hasSelectedReason(commonItem) ? '已选择' : '请选择理由（选填）' }} + + + @@ -226,7 +229,8 @@ export default { shopId: item.shopId, count: item.qualifiedNum, total: item.price, - classId: item.categoryId + classId: item.categoryId, + items: item.commonOrderList ? [...item.commonOrderList] : [] }) console.log('qualifiedList', this.qualifiedList) } @@ -248,7 +252,8 @@ export default { this.unrecyclableList.push({ id: item.id, count: item.unrecyclable, - total: item.price + total: item.price, + items: item.commonOrderList ? [...item.commonOrderList] : [] }) } }) @@ -335,7 +340,7 @@ export default { type = 1 // 质量问题 } else if (item.testingStatus === 2) { type = 2 // 不可回收 - } + } this.currentReasonItem = popupItem // 判断类型，动态设置标题 @@ -357,17 +362,17 @@ export default { this.lockScroll() this.$refs.reasonPopup.open() }, - selectReasonForQualified(item) { - this.currentReasonItem = item - this.currentReasonTitle = this.getGoodsName(item.shopId || item.id) + selectReasonForQualified(commonItem, parentItem) { + this.currentReasonItem = commonItem + this.currentReasonTitle = this.getGoodsName(parentItem.shopId || parentItem.id) // 只使用testingImages字段 - if (item.testingImages && item.testingImages.trim() !== '') { - this.reasonImages = item.testingImages.split(',').filter(img => img.trim() !== '') + if (commonItem.testingImages && commonItem.testingImages.trim() !== '') { + this.reasonImages = commonItem.testingImages.split(',').filter(img => img.trim() !== '') } else { this.reasonImages = [] } // 使用从上一个页面传过来的categoryId - this.selectReasonForUnqualified(item, 0, item.classId) + this.selectReasonForUnqualified(commonItem, 0, parentItem.classId) this.lockScroll() this.$refs.reasonPopup.open() }, @@ -427,9 +432,9 @@ export default { }, addReasonImg() { // 检查是否已达到最大数量限制 - if (this.reasonImages.length >= 3) { + if (this.reasonImages.length >= 9) { uni.showToast({ - title: '最多只能上传3张图片', + title: '最多只能上传9张图片', icon: 'none' }) return @@ -882,12 +887,13 @@ export default { .img-list { display: flex; - gap: 12px; + flex-wrap: wrap; + gap: 20rpx; margin-bottom: 32px; .img-item { - width: 80px; - height: 80px; + width: 150rpx; + height: 150rpx; border-radius: 12px; background: #f8f8f8; position: relative; @@ -895,7 +901,7 @@ export default { .img { width: 100%; height: 100%; - border-radius: 12px; + border-radius: 24rpx; object-fit: cover; } @@ -903,13 +909,13 @@ export default { position: absolute; top: -6px; right: -6px; - width: 24px; - height: 24px; + width: 48rpx; + height: 48rpx; background: rgba(0, 0, 0, 0.6); color: #fff; border-radius: 50%; text-align: center; - line-height: 24px; + line-height: 48rpx; font-size: 16px; font-weight: bold; } diff --git a/pages/manager/inspect.vue b/pages/manager/inspect.vue index 0af016d..085813d 100644 --- a/pages/manager/inspect.vue +++ b/pages/manager/inspect.vue @@ -27,7 +27,10 @@ {{ item.name }} - ¥ {{ item.price }} /{{item.unit}} + + {{ formatPrice(item) }} + /{{item.unit}} + {{ item.desc }} @@ -309,6 +312,7 @@ export default { image: item.image || '/static/回收/衣物.png', name: item.name, price: item.price || 0, + maxPrice: item.maxPrice || 0, desc: item.service || '允许脏破烂，160码以上', qualified: inspectItem ? inspectItem.qualifiedNum : 0, amount: inspectItem ? inspectItem.price : '', // 只用inspectResult里的金额 @@ -574,21 +578,25 @@ export default { shopId: orderItem ? (orderItem.shopId || orderItem.id) : itemId, pinId: '', categoryId: currentCategoryId || '', // 直接用当前分类id - commonOrderList: [ - { - testingInstructions: '', - testingImages: '', - testingStatus: 0 - } - ] + commonOrderList: [] // 初始为空数组，会在增加数量时动态添加 } this.inspectResult.list.push(inspectItem) } if (!inspectItem) return if (type === 'qualified' && delta > 0) { inspectItem.qualifiedNum++ + // 增加一个commonOrderList对象 + inspectItem.commonOrderList.push({ + testingInstructions: '', + testingImages: '', + testingStatus: 0 + }) } else if (type === 'qualified' && delta < 0) { inspectItem.qualifiedNum = Math.max(0, inspectItem.qualifiedNum - 1) + // 减少一个commonOrderList对象 + if (inspectItem.commonOrderList.length > 0) { + inspectItem.commonOrderList.pop() + } // 新增：如果减到0，移除该商品对象 if (inspectItem.qualifiedNum === 0) { const idx = this.inspectResult.list.findIndex(listItem => listItem === inspectItem) @@ -773,6 +781,36 @@ export default { this.brandSearch = '' this.currentProductId = null }, + + // 格式化价格显示 + formatPrice(item) { + const price = item.price + const maxPrice = item.maxPrice + + // 如果两个价格都没有或都为0，显示占位符 + if ((!price || price === 0) && (!maxPrice || maxPrice === 0)) { + return '¥ —' + } + + // 如果只有一个价格有值 + if (price && (!maxPrice || maxPrice === 0)) { + return `¥ ${price}` + } + + if (maxPrice && (!price || price === 0)) { + return `¥ ${maxPrice}` + } + + // 如果两个价格都有值且不相等，显示价格范围 + if (price && maxPrice && price !== maxPrice) { + const minPrice = Math.min(price, maxPrice) + const maxPriceValue = Math.max(price, maxPrice) + return `¥ ${minPrice} - ${maxPriceValue}` + } + + // 如果两个价格相等，只显示一个 + return `¥ ${price || maxPrice}` + }, }, created() { this.currentCategory = 0 @@ -896,16 +934,16 @@ export default { } .category-nav { - width: 80px; + width: 160rpx; background: #fff; - border-radius: 24px 0 0 24px; - // padding: 24px 0; + border-radius: 48rpx 0 0 48rpx; + // padding: 48rpx 0; display: flex; flex-direction: column; align-items: center; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03); - height: calc(100vh - 200rpx - var(--status-bar-height) - 80px); - max-height: calc(100vh - 200rpx - var(--status-bar-height) - 80px); + box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.03); + height: calc(100vh - 200rpx - var(--status-bar-height) - 160rpx); + max-height: calc(100vh - 200rpx - var(--status-bar-height) - 160rpx); overflow-y: scroll; overflow-x: hidden; position: relative; @@ -915,7 +953,7 @@ export default { scrollbar-color: #ddd transparent; &::-webkit-scrollbar { - width: 4px; + width: 8rpx; } &::-webkit-scrollbar-track { @@ -924,7 +962,7 @@ export default { &::-webkit-scrollbar-thumb { background: #ddd; - border-radius: 2px; + border-radius: 4rpx; } &::-webkit-scrollbar-thumb:hover { @@ -932,19 +970,19 @@ export default { } .category-item { - width: 64px; - height: 44px; - border-radius: 16px 0 0 16px; + width: 128rpx; + height: 88rpx; + border-radius: 32rpx 0 0 32rpx; display: flex; align-items: center; justify-content: flex-start; - font-size: 16px; + font-size: 32rpx; color: #222; - margin-bottom: 12px; + margin-bottom: 24rpx; background: #fff; position: relative; transition: background 0.2s, color 0.2s, font-weight 0.2s; - padding-left: 12px; + padding-left: 24rpx; &.active { background: linear-gradient(90deg, #fff7e6 80%, #fff 100%); @@ -957,8 +995,8 @@ export default { left: 0; top: 30%; height: 40%; - width: 2px; - border-radius: 4px; + width: 4rpx; + border-radius: 8rpx; background: #ffb400; bottom: auto; } @@ -966,14 +1004,14 @@ export default { .category-badge { position: absolute; - top: 6px; - right: 10px; + top: 12rpx; + right: 20rpx; background: #ff4d4f; color: #fff; - font-size: 12px; + font-size: 24rpx; border-radius: 50%; - width: 18px; - height: 18px; + width: 36rpx; + height: 36rpx; display: flex; align-items: center; justify-content: center; @@ -983,18 +1021,18 @@ export default { .goods-list { flex: 1; - height: calc(100vh - 200rpx - var(--status-bar-height) - 80px); - padding: 0 0 0 16px; + height: calc(100vh - 200rpx - var(--status-bar-height) - 160rpx); + padding: 0 0 0 32rpx; overflow-y: auto; background: none; } .goods-card { background: #fff; - border-radius: 24px; - box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06); - margin-bottom: 18px; - padding: 18px 18px 9px 18px; + border-radius: 48rpx; + box-shadow: 0 8rpx 48rpx rgba(0, 0, 0, 0.06); + margin-bottom: 36rpx; + padding: 36rpx 36rpx 18rpx 36rpx; } @@ -1002,13 +1040,13 @@ export default { .goods-header { display: flex; align-items: center; - margin-bottom: 12px; + margin-bottom: 24rpx; .goods-img { - width: 56px; - height: 56px; - border-radius: 16px; - margin-right: 12px; + width: 112rpx; + height: 112rpx; + border-radius: 32rpx; + margin-right: 24rpx; background: #f8f8f8; object-fit: contain; } @@ -1023,30 +1061,37 @@ export default { .goods-title-row { display: flex; align-items: baseline; + justify-content: space-between; .goods-name { - font-size: 16px; + font-size: 28rpx; font-weight: bold; color: #222; - margin-right: 8px; + margin-right: 16rpx; + flex: 1; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } .goods-price { - font-size: 15px; + font-size: 30rpx; color: #ffb400; font-weight: bold; + white-space: nowrap; + flex-shrink: 0; .goods-unit { - font-size: 13px; + font-size: 26rpx; color: #bbb; } } } .goods-desc { - font-size: 13px; + font-size: 26rpx; color: #999; - margin-top: 4px; + margin-top: 8rpx; } } } @@ -1054,12 +1099,12 @@ export default { .goods-row { display: flex; align-items: center; - margin-bottom: 12px; + margin-bottom: 24rpx; .row-label { - font-size: 14px; + font-size: 28rpx; color: #888; - width: 80px; + width: 160rpx; flex-shrink: 0; } @@ -1100,14 +1145,14 @@ export default { .amount-input { flex: 1; - height: 32px; - border-radius: 12px; + height: 64rpx; + border-radius: 24rpx; background: #f6f6f6; border: none; - font-size: 15px; + font-size: 30rpx; color: #222; - padding-left: 10px; - margin-left: 8px; + padding-left: 20rpx; + margin-left: 16rpx; } } @@ -1118,34 +1163,34 @@ export default { bottom: 0; background: #fff; display: flex; - gap: 16px; - padding: 12px 16px 24px 16px; + gap: 32rpx; + padding: 24rpx 32rpx 48rpx 32rpx; z-index: 101; .btn-outline { flex: 1; - height: 40px; - border-radius: 16px; - border: 1px solid #ffe09a; + height: 80rpx; + border-radius: 32rpx; + border: 2rpx solid #ffe09a; color: #ffb400; background: #fff0d2; - font-size: 15px; + font-size: 30rpx; font-weight: 500; box-shadow: none; - padding: 0 18px; + padding: 0 36rpx; } .btn-main { flex: 1; - height: 40px; - border-radius: 16px; + height: 80rpx; + border-radius: 32rpx; background: linear-gradient(90deg, #ffd01e 0%, #ffac04 100%); color: #fff; border: none; - font-size: 15px; + font-size: 30rpx; font-weight: 500; box-shadow: none; - padding: 0 18px; + padding: 0 36rpx; } } @@ -1177,11 +1222,11 @@ export default { .brand-popup { position: relative; width: 100%; - max-width: 750px; + max-width: 1500rpx; background: #fff; - border-radius: 32rpx 32rpx 0 0; - box-shadow: 0 -4rpx 24rpx rgba(0,0,0,0.08); - padding-bottom: 40rpx; + border-radius: 64rpx 64rpx 0 0; + box-shadow: 0 -8rpx 48rpx rgba(0,0,0,0.08); + padding-bottom: 80rpx; max-height: 90vh; display: flex; flex-direction: column; @@ -1282,14 +1327,14 @@ export default { .brand-confirm-popup { width: 70vw; - max-width: 270px; + max-width: 540rpx; background: #fff; - border-radius: 32rpx; - box-shadow: 0 8rpx 32rpx rgba(0,0,0,0.12); + border-radius: 64rpx; + box-shadow: 0 16rpx 64rpx rgba(0,0,0,0.12); display: flex; flex-direction: column; align-items: center; - padding: 48rpx 20rpx 36rpx 20rpx; + padding: 96rpx 40rpx 72rpx 40rpx; position: relative; } diff --git a/pages/manager/order-detail.vue b/pages/manager/order-detail.vue index 67f0bba..8234f25 100644 --- a/pages/manager/order-detail.vue +++ b/pages/manager/order-detail.vue @@ -11,7 +11,8 @@ - + + {{ order.cancelReason }}