Переглянути джерело

feat: add recharge record relative pages

wangyuan 2 роки тому
батько
коміт
ea7a7edd96

+ 2 - 1
app.json

@@ -15,7 +15,8 @@
     "pages/addressCheck/addressCheck",
     "pages/addressAdd/addressAdd",
     "pages/set/set",
-    "pages/openArea/openArea"
+    "pages/openArea/openArea",
+    "pages/rechargeRecord/rechargeRecord"
   ],
   "usingComponents": {
     "van-icon": "@vant/weapp/icon/index",

+ 5 - 3
pages/my/my.js

@@ -37,10 +37,12 @@ Page({
   },
 
   /**
-   * 生命周期函数--监听页面卸载
+   * 点击充值记录
    */
-  onUnload() {
-
+  handleRechargerecord() {
+    wx.navigateTo({
+      url: '/pages/rechargeRecord/rechargeRecord',
+    })
   },
 
   /**

+ 1 - 1
pages/my/my.wxml

@@ -38,7 +38,7 @@
       </view>
     </view>
     <view class="act-item-col ittflex-jca">
-      <view class="act-item chongzhi" data-index="3">
+      <view class="act-item chongzhi" data-index="3" bindtap="handleRechargerecord">
         <view class="icon">
           <image class="image-icon" src="./../../imaes/jilu@2x.png"></image>
         </view>

+ 66 - 0
pages/rechargeRecord/rechargeRecord.js

@@ -0,0 +1,66 @@
+// pages/rechargeRecord/rechargeRecord.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    recordList: [1,1,1,1,1,1,1,1,1,1]
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

+ 3 - 0
pages/rechargeRecord/rechargeRecord.json

@@ -0,0 +1,3 @@
+{
+  "navigationBarTitleText": "充值记录"
+}

+ 23 - 0
pages/rechargeRecord/rechargeRecord.wxml

@@ -0,0 +1,23 @@
+<!--pages/rechargeRecord/rechargeRecord.wxml-->
+<view class="record-content">
+  <view class="main-content">
+    <view class="record-item ittflex-jcs" wx:for="{{recordList}}" wx:key="index">
+      <view class="left icon">
+       <!--  <image class="image" src="../../imaes/shiti@2x.png"></image> -->
+        <image class="image" src="../../imaes/dianzi@2x.png"></image>
+      </view>
+      <view class="center info">
+        <view class="title info-item">一次体验卡</view>
+        <view class="carno info-item">
+          <text>卡编号:</text>
+          <text>2000202020202020</text>
+        </view>
+        <view class="time info-item">
+          <text>激活时间:</text>
+          <text>2022-10-10 22:22</text>
+        </view>
+      </view>
+      <view class="right count">+199</view>
+    </view>
+  </view>
+</view>

+ 55 - 0
pages/rechargeRecord/rechargeRecord.wxss

@@ -0,0 +1,55 @@
+/* pages/rechargeRecord/rechargeRecord.wxss */
+.record-content {
+  width: 100%;
+  height: 100%;
+  background-color: #f7f7f7;
+  padding-top: 1rpx;
+}
+.main-content {
+  width: 690rpx;
+  min-height: 100%;
+  margin: 20rpx auto 0;
+}
+.record-item {
+  width: 100%;
+  height: 188rpx;
+  background: #FFFFFF;
+  border-radius: 20rpx;
+  margin-bottom: 20rpx;
+}
+.icon {
+  width: 80rpx;
+  height: 80rpx;
+  margin: 0 22rpx;
+}
+.image {
+  width: 100%;
+  height: 100%;
+}
+.center {
+  width: 500rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+}
+.info-item {
+  font-size: 26rpx;
+  height: 36rpx;
+}
+.carno {
+  margin: 10rpx 0;
+  color: #999;
+}
+.time {
+  color: #999;
+}
+.title {
+  color: #333333;
+}
+.count {
+  font-size: 26rpx;
+  font-weight: 400;
+  color: var(--maincolor);
+  margin-right: 20rpx;
+}