From 76b111b85a391306e17d33187a594c94e0de1f41 Mon Sep 17 00:00:00 2001
From: zuoxiao <470321431@qq.com>
Date: 星期三, 28 二月 2024 08:30:36 +0800
Subject: [PATCH] 电子钱包界面
---
pages/wallet/wallet.js | 43 +++++++++++++
pages/wallet/wallet.wxml | 30 ++++++---
pages/wallet/wallet.wxss | 79 +++++++++++++++++++++++---
3 files changed, 129 insertions(+), 23 deletions(-)
diff --git a/pages/wallet/wallet.js b/pages/wallet/wallet.js
index 88253b0..ed2a812 100644
--- a/pages/wallet/wallet.js
+++ b/pages/wallet/wallet.js
@@ -5,8 +5,47 @@
* 椤甸潰鐨勫垵濮嬫暟鎹�
*/
data: {
- balance:12,
- listData:[{orderNumber:"25425154351"}]
+ balance: 12,
+ listData: [{
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ },
+ {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }, {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }, {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }, {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }, {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }, {
+ orderNumber: "25425154351",
+ time: "2024-01-14 15:34:25",
+ state: "浠樻鎴愬姛",
+ money: "200"
+ }
+
+
+ ]
},
/**
diff --git a/pages/wallet/wallet.wxml b/pages/wallet/wallet.wxml
index 8b67b35..4493fbf 100644
--- a/pages/wallet/wallet.wxml
+++ b/pages/wallet/wallet.wxml
@@ -20,19 +20,27 @@
</view>
</view>
<scroll-view class="scroll-view" scroll-y="true">
- <view class="scroll-bg">
- <view class="list-item" wx:for="{{listData}}" wx:for-item="item" wx:for-index="index">
- <text>璁㈠崟缂栧彿锛�</text>
- <text>{{item.orderNumber}}</text>
- <view class="list-item-piping">
- <image src="/images/piping.png"></image>
- <text>{{item.code}}</text>
- </view>
- <view>
- <t-switch bindchange="handleChange" value="{{defaultVal}}" label="{{['寮�', '鍏�']}}" slot="note" />
+ <view class="scroll-bg">
+ <view class="list-item" wx:for="{{listData}}" wx:for-item="item" wx:for-index="index">
+ <view>
+ <view class="order-code">
+ <text>璁㈠崟缂栧彿锛�</text>
+ <text>{{item.orderNumber}}</text>
+ </view>
+ <view>
+ <text class="order-time">{{item.time}}</text>
+ </view>
+
+ </view>
+ <view class="order-right">
+ <view class="money-wrapper">
+ <text>{{item.money}}</text>
+ <text>鍏�</text>
+ </view>
+ <text class="order-state">{{item.state}}</text>
+ </view>
</view>
</view>
- </view>
</scroll-view>
</view>
\ No newline at end of file
diff --git a/pages/wallet/wallet.wxss b/pages/wallet/wallet.wxss
index bcf4c6b..3abc3c1 100644
--- a/pages/wallet/wallet.wxss
+++ b/pages/wallet/wallet.wxss
@@ -3,6 +3,12 @@
.base-wrapper {
background-color: #f5f5f5;
+ width: 100%;
+ height: 100vh;
+ overflow: hidden;
+ /* 闃叉搴曢儴鍖哄煙婊氬姩 */
+ display: flex;
+ flex-direction: column;
}
.top-wrapper {
@@ -19,22 +25,24 @@
}
-.top-one{
+.top-one {
display: flex;
flex-direction: row;
justify-content: space-between;
height: 20vh;
}
-.top-wallet-bg{
- width: 40%;
- height: 100%;
+
+.top-wallet-bg {
+ width: 40%;
+ height: 100%;
}
-.top-wallet-bg image{
+
+.top-wallet-bg image {
width: 100%;
height: 100%;
}
-.top-money-button{
+.top-money-button {
display: flex;
flex-direction: column;
justify-content: space-around;
@@ -43,14 +51,14 @@
-.top-wrapper-button{
+.top-wrapper-button {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-right: 30rpx;
}
-.button-refund{
+.button-refund {
font-size: 35rpx;
border-radius: 90px;
width: 30%;
@@ -58,13 +66,15 @@
display: flex;
align-items: center;
padding-top: 10rpx;
- padding-bottom: 10rpx;
+ padding-bottom: 15rpx;
padding-left: 30rpx;
padding-right: 30rpx;
justify-content: center;
+ text-align: center;
color: #fff;
}
-.button-recharge{
+
+.button-recharge {
color: #000;
font-size: 35rpx;
border-radius: 90px;
@@ -78,4 +88,53 @@
padding-bottom: 10rpx;
padding-left: 30rpx;
padding-right: 30rpx;
+}
+
+.list-item {
+ background-color: #fff;
+ margin-top: 10rpx;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding-left: 30rpx;
+ padding-right: 30rpx;
+ padding-top: 40rpx;
+ padding-bottom: 40rpx;
+ margin-left: 20rpx;
+ margin-right: 20rpx;
+}
+
+.scroll-view {
+ margin-top: 30rpx;
+ flex: 1;
+ overflow-y: auto;
+ /* 鍏佽鍨傜洿婊氬姩 */
+ z-index: 0;
+}
+
+.order-right {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.money-wrapper text {
+ font-size: 50rpx;
+ color: #1890FF;
+}
+
+.order-state {
+ font-size: 30rpx;
+ color: #000000;
+ opacity: 0.7;
+
+}
+.order-code text{
+ font-size: 35rpx;
+ color: #000000;
+}
+.order-time{
+ font-size: 35rpx;
+ color: #000000;
+ opacity: 0.7;
}
\ No newline at end of file
--
Gitblit v1.8.0