开始做充值和发票

pages/meterList/index.js

@@ -1,3 +1,5 @@
+import { getMeterList } from "../../service/meter";
+
 // pages/meterList/index.js
 Page({
 
@@ -5,11 +7,7 @@ Page({
    * 页面的初始数据
    */
   data: {
-    codes: [
-      { code: "2331242324", money: 510 },
-      { code: "4234234134", money: 10 },
-      { code: "2354245345", money: 50 },
-      { code: "5365457642", money: 150 },
+    list: [
 
     ]
   },
@@ -18,9 +16,20 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-
+    this.getList();
+  },
+  async getList() {
+    const { code, message, data = [] } = await getMeterList()
+    this.setData({
+      list: data
+    })
+  },
+  jumpToRecharge(e) {
+    const { code, tenement } = e.currentTarget.dataset;
+    wx.navigateTo({
+      url: `/pages/recharge/index?code=${code}&tenement=${tenement}`,
+    })
   },
-
   /**
    * 生命周期函数--监听页面初次渲染完成
    */

pages/meterList/index.json

@@ -2,5 +2,6 @@
   "usingComponents": {
     "navigator": "/components/navigator/index",
     "scrollPageWrapper": "/components/scrollPageWrapper/index"
-  }
+  },
+  "navigationBarTitleText": "表计列表"
 }

pages/meterList/index.wxml

@@ -1,12 +1,24 @@
 <!--pages/meterList/index.wxml-->
-<scrollPageWrapper>
-  <navigator title="表计列表" />  
-  <view class="content">
-    <scroll-view type="list" scroll-y style="display: flex; flex-direction: column; flex: 1; width: 100%; overflow: auto;">
-      <view wx:for="{{codes}}" list-item class="listItem">
-        <view class="code"> {{ item.code }} </view>
-        <view class="money"> {{ item.money }} </view>
+<view class="wrapper">
+  <view wx:for="{{list}}" wx:key="index"  class="listItem">
+    <view class="tenementName"> {{ item.tenement.name }} :</view>
+    <view class="meter"  wx:for="{{item.meter}}" wx:for-item="ele" wx:key="code">
+      <view class="content">
+        <view class="code"> 表{{ ele.code }}：余额为  </view>
+        <view class="money"> {{ ele.money }} </view>
+        <view 
+          class="primaryTextBtn" 
+          bind:tap="jumpToRecharge" 
+          data-tenement="{{item.tenement.id}}" 
+          data-code="{{ele.code}}"
+        > 充值 </view>
       </view>
-    </scroll-view>
+      <view class="address">
+        表计地址： {{ ele.address }}
+      </view>
+    </view>
   </view>
-</scrollPageWrapper>
+</view>
+
+
+

pages/meterList/index.wxss

@@ -1,20 +1,40 @@
 /* pages/meterList/index.wxss */
-.content {
+/* .content {
   flex: 1;
   padding: 16rpx 24rpx 20rpx;
   box-sizing: border-box;
   display: flex;
   overflow: hidden;
-}
+} */
 
 .listItem {
-  display: flex;
+  /* display: flex;
   align-items: center;
-  justify-content: space-between;
+  justify-content: space-between; */
   margin: 12rpx 0;
 }
 
 .money {
   font-size: 36rpx;
   font-weight: 600;
+  margin-left: 20rpx;
+  flex: 1;
+}
+
+.content {
+  display: flex;
+  align-items: center;
+  margin-left: 30rpx;
+  margin-right: 20rpx;
+}
+
+.address {
+  margin-left: 30rpx;
+  margin-right: 20rpx;
+}
+
+.tenementName {
+  font-size: 42rpx;
+  font-weight: 600;
+  margin-bottom: 20rpx;
 }