From 8caa1157044d2229e56a288cc5665fadf526dd45 Mon Sep 17 00:00:00 2001
From: rk <94314517@qq.com>
Date: 星期四, 11 六月 2026 16:30:02 +0800
Subject: [PATCH] 恢复支付金额与退款金额
---
small-program/pages/storage-order-detail/storage-order-detail.vue | 590 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 586 insertions(+), 4 deletions(-)
diff --git a/small-program/pages/storage-order-detail/storage-order-detail.vue b/small-program/pages/storage-order-detail/storage-order-detail.vue
index 129239e..907f9e8 100644
--- a/small-program/pages/storage-order-detail/storage-order-detail.vue
+++ b/small-program/pages/storage-order-detail/storage-order-detail.vue
@@ -1,6 +1,208 @@
<template>
- <view class="detail-page">
-
+ <view class="detail">
+ <view class="head" :style="{ height: statusbarHeight + navHeight + 'px' }">
+ <view :style="{width: '100%', height: statusbarHeight + 'px'}"></view>
+ <view class="head-nav" :style="{width: '100%', height: navHeight + 'px'}">
+ <image src="/static/icon/nav_ic_back.png" mode="widthFix"></image>
+ <text>瀵勫瓨璁㈠崟</text>
+ <image src="/static/icon/nav_ic_back.png" mode="widthFix" style="opacity: 0;"></image>
+ </view>
+ </view>
+ <view :style="{ width: '100%', height: statusbarHeight + navHeight + 'px' }"></view>
+ <view class="nr">
+ <view class="nr-status">
+ <text>閫�娆炬垚鍔�</text>
+ <view class="nr-status-type">瀵勫瓨</view>
+ </view>
+ <view class="nr-desc">閫�娆惧凡鎴愬姛鍘熻矾杩斿洖锛岃娉ㄦ剰鏌ユ敹锝�</view>
+ <view class="item">
+ <view class="item-shop">
+ <view class="item-shop-icon">
+ <image src="/static/icon/ic_store@2x.png" mode="widthFix"></image>
+ </view>
+ <view class="item-shop-info">
+ <view class="item-shop-info-a">
+ <text>涓搧蹇繍鍗楃珯鏃楄埌搴�</text>
+ <image src="/static/icon/ar_jicundian@2x.png" mode="widthFix"></image>
+ </view>
+ <view class="item-shop-info-b">
+ <image class="item-shop-info-b-icon1" src="/static/icon/home_ic_location3@2x.png" mode="widthFix"></image>
+ <text>鍚堣偉鍗楃珯璐熶竴灞�100鍙�</text>
+ <image class="item-shop-info-b-icon2" src="/static/icon/ar_map@2x.png" mode="widthFix"></image>
+ </view>
+ </view>
+ </view>
+ <view class="item-qrcode">
+ <image src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
+ <text>767889</text>
+ <text>鍙栦欢鐮�</text>
+ </view>
+ <view class="item-x"></view>
+ <view class="item-list">
+ <view class="item-list-row">
+ <view class="item-form-label">鏀朵欢浜�</view>
+ <view class="item-form-val">璋㈠鎱�</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label">鏀朵欢鐢佃瘽</view>
+ <view class="item-form-val">181551526356</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label">棰勮鍒板簵鏃堕棿</view>
+ <view class="item-form-val">2026-04-12 12:00</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label">棰勮鍙栦欢鏃堕棿</view>
+ <view class="item-form-val">2026-04-14 12:00</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label">鐗╁搧鍚嶇О</view>
+ <view class="item-form-val">琛ｆ湇</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label">鐗╁搧鐓х墖</view>
+ <view class="item-form-list">
+ <view class="item-form-list-row">
+ <image src="/static/image/tx@2x.png" mode="widthFix"></image>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view class="item">
+ <view class="tuikuan">
+ <view class="tuikuan-top">
+ <text>閫�娆鹃噾棰�</text>
+ <text>115.00</text>
+ </view>
+ <view class="tuikuan-bottom">
+ <text>宸查��鍥炴偍鐨勬敮浠樿处鎴�</text>
+ <text>2026-04-12 12:32:00</text>
+ </view>
+ </view>
+ </view>
+ <view class="item">
+ <view class="xl">
+ <view class="xl-item">
+ <view class="xl-item-top">
+ <text>澶т欢琛屾潕绠�</text>
+ <text>楼35</text>
+ </view>
+ <view class="xl-item-bottom">
+ <text>24-28瀵�</text>
+ <text>x1</text>
+ </view>
+ </view>
+ <view class="xl-item">
+ <view class="xl-item-top">
+ <text>涓欢琛屾潕绠�</text>
+ <text>楼35</text>
+ </view>
+ <view class="xl-item-bottom">
+ <text>24-28瀵�</text>
+ <text>x1</text>
+ </view>
+ </view>
+ <view class="xl-item">
+ <view class="xl-item-top">
+ <text>灏忎欢琛屾潕绠�</text>
+ <text>楼35</text>
+ </view>
+ <view class="xl-item-bottom">
+ <text>24-28瀵�</text>
+ <text>x1</text>
+ </view>
+ </view>
+ </view>
+ <view class="item-x"></view>
+ <view class="item-list">
+ <view class="item-list-row">
+ <view class="item-form-label" style="color: #333333; font-size: 28rpx;">瀵勫瓨璐�</view>
+ <view class="item-form-val" style="color: #333333; font-size: 24rpx;">楼105.00</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label" style="color: #333333; font-size: 28rpx;">琛屾潕淇濊垂</view>
+ <view class="item-form-val" style="color: #333333; font-size: 24rpx;">楼10.00</view>
+ </view>
+ <view class="item-list-row">
+ <view class="item-form-label" style="color: #222222; font-size: 30rpx; font-weight: 600;">瀹炰粯娆�</view>
+ <view class="item-form-val price" style="color: #FE2C2E; font-size: 36rpx;">115.00</view>
+ </view>
+ </view>
+ </view>
+ <view class="item">
+ <view class="item-title">璁㈠崟淇℃伅</view>
+ <view class="item-infos">
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">璁㈠崟缂栧彿锛�</view>
+ <view class="item-infos-item-right">
+ <text>202107131742520001</text>
+ <image src="/static/icon/ic_cppy@2x.png" mode="widthFix"></image>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">鍒涘缓鏃堕棿锛�</view>
+ <view class="item-infos-item-right">
+ <text>2026-04-12 12:00:00</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">鏀粯鏃堕棿锛�</view>
+ <view class="item-infos-item-right">
+ <text>2026-04-12 12:00:00</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">鏀粯鏂瑰紡锛�</view>
+ <view class="item-infos-item-right">
+ <text>寰俊鏀粯</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">浜ゆ槗鍙凤細</view>
+ <view class="item-infos-item-right">
+ <text>2025080698723178237189237123</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">璁㈠崟澶囨敞锛�</view>
+ <view class="item-infos-item-right">
+ <text>-</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">鐢宠閫�娆撅細</view>
+ <view class="item-infos-item-right">
+ <text>2026-04-12 12:30:00</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">閫�娆鹃噾棰濓細</view>
+ <view class="item-infos-item-right">
+ <text>楼115.00</text>
+ </view>
+ </view>
+ <view class="item-infos-item">
+ <view class="item-infos-item-left">閫�娆惧師鍥狅細</view>
+ <view class="item-infos-item-right">
+ <text>鍗忓晢涓�鑷撮��娆�</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view style="width: 100%; height: calc(210rpx + env(safe-area-inset-bottom));"></view>
+ </view>
+ <view class="tips">
+ <image src="/static/icon/ic_waring@2x.png" mode="widthFix"></image>
+ <text>宸茶秴杩囧彇浠舵椂闂达紝瓒呮椂璐圭敤锛毬�10.00</text>
+ </view>
+ <view class="footer">
+ <view class="footer-btns">
+ <view class="btn kong">鍒犻櫎璁㈠崟</view>
+ <view class="btn you">璇勪环璁㈠崟</view>
+ </view>
+ <view style="width: 100%; height: env(safe-area-inset-bottom);"></view>
+ </view>
</view>
</template>
@@ -21,7 +223,387 @@
}
}
</script>
-
+<style>
+ page {
+ background-color: #F8F9FB;
+ }
+</style>
<style lang="scss" scoped>
-
+ .detail {
+ width: 100%;
+ .tips {
+ width: 100%;
+ height: 80rpx;
+ padding: 0 30rpx;
+ box-sizing: border-box;
+ background: #FFE9E9;
+ position: fixed;
+ bottom: calc(100rpx + env(safe-area-inset-bottom));
+ left: 0;
+ display: flex;
+ align-items: center;
+ image {
+ width: 28rpx;
+ height: 28rpx;
+ margin-right: 16rpx;
+ }
+ text {
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #FF0000;
+ }
+ }
+ .footer {
+ width: 100%;
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ padding: 0 30rpx;
+ box-sizing: border-box;
+ display: flex;
+ flex-direction: column;
+ z-index: 9;
+ background-color: #ffffff;
+ .footer-btns {
+ width: 100%;
+ height: 100rpx;
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ .kong {
+ border: 1rpx solid #B2B2B2;
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #666666;
+ }
+ .you {
+ background: #10B2FA;
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #FFFFFF;
+ }
+ .btn {
+ width: 160rpx;
+ height: 64rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 32rpx;
+ margin-left: 20rpx;
+ }
+ }
+ }
+ .head {
+ width: 100%;
+ background: #10B2FA;
+ padding: 0 30rpx;
+ box-sizing: border-box;
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 9;
+ .head-nav {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ image {
+ width: 48rpx;
+ height: 48rpx;
+ }
+ text {
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #FFFFFF;
+ }
+ }
+ }
+ .nr {
+ width: 100%;
+ height: 264rpx;
+ padding: 22rpx 30rpx;
+ box-sizing: border-box;
+ background-color: #10B2FA;
+ .nr-status {
+ display: flex;
+ align-items: center;
+ text {
+ font-weight: 600;
+ font-size: 36rpx;
+ color: #FFFFFF;
+ margin-right: 16rpx;
+ }
+ .nr-status-type {
+ width: 64rpx;
+ height: 38rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: #FFFFFF;
+ border-radius: 8rpx;
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #10B2FA;
+
+ }
+ }
+ .nr-desc {
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #FFFFFF;
+ margin-top: 12rpx;
+ }
+ .item {
+ width: 100%;
+ padding: 30rpx;
+ box-sizing: border-box;
+ background: #FFFFFF;
+ border-radius: 16rpx;
+ margin-top: 30rpx;
+ .xl {
+ width: 100%;
+ .xl-item {
+ width: 100%;
+ margin-bottom: 26rpx;
+ &:last-child {
+ margin: 0 !important;
+ }
+ .xl-item-top {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ text {
+ font-weight: 600;
+ font-size: 28rpx;
+ color: #333333;
+ }
+ }
+ .xl-item-bottom {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-top: 12rpx;
+ text {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #8C939F;
+ }
+ }
+ }
+ }
+ .tuikuan {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ .tuikuan-top {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ text {
+ &:nth-child(1) {
+ font-weight: 600;
+ font-size: 30rpx;
+ color: #222222;
+ }
+ &:nth-child(2) {
+ font-weight: 500;
+ font-size: 36rpx;
+ color: #FE2C2E;
+ &:before {
+ content: "锟�";
+ font-weight: 500;
+ font-size: 24rpx;
+ color: #FE2C2E;
+ }
+ }
+ }
+ }
+ .tuikuan-bottom {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-top: 8rpx;
+ text {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #666666;
+ }
+ }
+ }
+ .item-shop {
+ width: 100%;
+ display: flex;
+ align-items: flex-start;
+ .item-shop-icon {
+ flex-shrink: 0;
+ width: 40rpx;
+ height: 40rpx;
+ margin-right: 16rpx;
+ image {
+ width: 100%;
+ }
+ }
+ .item-shop-info {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ .item-shop-info-a {
+ display: flex;
+ align-items: center;
+ text {
+ font-weight: 600;
+ font-size: 30rpx;
+ color: #222222;
+ }
+ image {
+ width: 13rpx;
+ height: 22rpx;
+ margin-left: 6rpx;
+ }
+ }
+ .item-shop-info-b {
+ display: flex;
+ align-items: center;
+ margin-top: 10rpx;
+ text {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #999999;
+ }
+ .item-shop-info-b-icon1 {
+ width: 25rpx;
+ margin-right: 4rpx;
+ }
+ .item-shop-info-b-icon2 {
+ width: 12rpx;
+ margin-left: 4rpx;
+ }
+ }
+ }
+ }
+ .item-qrcode {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+ margin-top: 40rpx;
+ image {
+ width: 360rpx;
+ height: 360rpx;
+ }
+ text {
+ &:nth-child(1) {
+ font-weight: 600;
+ font-size: 36rpx;
+ color: #222222;
+ margin-top: 12rpx;
+ }
+ &:nth-child(2) {
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #999999;
+ margin-top: 12rpx;
+ }
+ }
+ }
+ .item-x {
+ width: 100%;
+ height: 1rpx;
+ margin: 30rpx 0;
+ background-color: #E5E5E5;
+ }
+ .item-title {
+ font-weight: 600;
+ font-size: 30rpx;
+ color: #222222;
+ }
+ .item-infos {
+ width: 100%;
+ margin-top: 18rpx;
+ .item-infos-item {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20rpx;
+ &:last-child {
+ margin: 0 !important;
+ }
+ .item-infos-item-left {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #999999;
+ }
+ .item-infos-item-right {
+ display: flex;
+ align-items: center;
+ text {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #666666;
+ }
+ image {
+ width: 24rpx;
+ margin-left: 16rpx;
+ }
+ }
+ }
+ }
+ .item-list {
+ width: 100%;
+ .item-list-row {
+ width: 100%;
+ margin-bottom: 24rpx;
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ &:last-child {
+ margin-bottom: 0 !important;
+ }
+ .item-form-label {
+ width: 300rpx;
+ flex-shrink: 0;
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #666666;
+ }
+ .item-form-val {
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #333333;
+ }
+ .price {
+ &:before {
+ content: "锟�";
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #FE2C2E;
+ }
+ }
+ .item-form-list {
+ max-width: 360rpx;
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: space-between;
+ .item-form-list-row {
+ width: 88rpx;
+ height: 88rpx;
+ border-radius: 8rpx;
+ overflow: hidden;
+ image {
+ width: 100%;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
</style>
--
Gitblit v1.9.3