开始做充值，，调整了首页

pages/rechargeRecord/index.js

@@ -1,4 +1,5 @@
 import { getRechargeList } from "../../service/recharge";
+import { getOwnTenementList } from "../../service/tenement";
 import { getYears } from "../../utils/index";
 
 // pages/rechargeRecord/index.js
@@ -13,9 +14,30 @@ Page({
     years: getYears(),
     list: [
 
-    ]
+    ],
+    tenement: "",
+    tenementName: "",
+    show: false,
+    columns: [],
+    type: "",
+    title: ""
+  },
+  clickYear() {
+    this.setData({
+      type: "year",
+      columns: this.data.years,
+      show: true,
+      title: "年份"
+    })
+  },
+  onOk(e) {
+    console.log('e', e)
+    const { type, value = {} } = e.detail;
+    if (type === "year") {
+      this.onChangeYear(value.id)
+      return;
+    }
   },
-
   /**
    * 生命周期函数--监听页面加载
    */
@@ -30,25 +52,51 @@ Page({
 
   },
   onChangeYear(e) {
-    const { years } = this.data;
-    const currentYear = years[Number(e.detail.value)]
+    const { years, tenement } = this.data;
+    const currentYear = years[Number(e)]
     this.setData({
-      year: currentYear
+      year: currentYear,
+      type: "",
+      show: false,
+      title: ""
     })
-    this.init(currentYear)
+    this.init(currentYear, tenement)
   },
   /**
    * 生命周期函数--监听页面显示
    */
   onShow() {
-    const currentYear = this.data.year;
-    this.init(currentYear)
+    const { year, tenement } = this.data;
+    this.init(year, tenement)
   },
-  async init(year) {
-    const { code, message, data } = await getRechargeList(year);
-    this.setData({
-      list: data
+  async getTenementsList() {
+    const { code, message, data } = await getOwnTenementList()
+    if (code !== OK) {
+      alertInfo(message)
+      return
+    }
+    let tenements = [];
+    data.forEach(item => {
+      if (item.tenements) {
+        tenements = [...tenements, ...item.tenements]
+      }
     })
+    this.setData({ tenements })
+  },
+  async init(year, tenement) {
+    const { code, message, data } = await getRechargeList(year, tenement);
+    this.setData({
+      list: [...data, ...data]
+    })
+  },
+  jumpToDetail(e) {
+    const { id } = e.currentTarget.dataset;
+    wx.navigateTo({
+      url: '/pages/rechargeDetail/index?id=' + id,
+    })
+  },
+  back() {
+    wx.navigateBack({delta: 1  })
   },
   /**
    * 生命周期函数--监听页面隐藏

pages/rechargeRecord/index.json

@@ -1,7 +1,10 @@
 {
   "usingComponents": {
     "navigator": "/components/navigator/index",
-    "scrollPageWrapper": "/components/scrollPageWrapper/index"
+    "scrollPageWrapper": "/components/scrollPageWrapper/index",
+    "van-icon": "@vant/weapp/icon/index",
+    "custom-status-bar": "/components/customStatusBar/index",
+    "custom-picker": "/components/picker/index"
   },
-  "navigationBarTitleText": "充值记录"
+  "navigationStyle": "custom"
 }

pages/rechargeRecord/index.wxml

@@ -1,20 +1,35 @@
 <!--pages/rechargeRecord/index.wxml-->
-<view class="wrapper" list-item>
-  <view>
-    <picker bindchange="onChangeYear" value="{{index}}" range="{{years}}">
-      <view class="yearPicker">
-        {{ year }}年
-        <image src="/assets/images/down.png" mode="" class="down" />
-      </view>
-    </picker>
+<navigator title="缴费记录" canBack="{{true}}" bind:back="back" />
+<view class="chooseWrapper">
+  <!-- <picker bindchange="onChangeYear" value="{{index}}" range="{{years}}"> -->
+    <view class="yearPicker" bind:tap="clickYear">
+      {{ year }}年
+      <image src="/assets/images/down.png" mode="" class="down" />
+    </view>
+  <!-- </picker> -->
+  <picker bindchange="onChangeYear" value="{{index}}" range="{{years}}">
+    <view class="tenementPicker">
+      <view wx:if="{{tenementName}}" class="tenementName"> {{ tenementName }} </view>
+      <view wx:else> 全部 </view>
+      <image src="/assets/images/down.png" mode="" class="down" />
+    </view>
+  </picker>
+  <view class="allMoney">
+    合计： 3000元
   </view>
+</view>
+<view class="wrapper">
   <view class="recordsWrapper">
-    <view class="recordsItem border" wx:for="{{list}}" wx:key="index">
+    <view class="recordsItem border" wx:for="{{list}}" wx:key="index" bind:tap="jumpToDetail" data-id="{{item.id}}">
+      <view class="type"> 充值 </view>
       <view class="codeTime">
-        <view class="code"> 表号：{{ item.meter.code }} </view>
+        <view class="code"> {{ item.meter.address }} </view>
         <view class="time"> {{ item.time }} </view>
       </view>
-      <view class="money"> {{ item.money }} </view>
+      <view class="money"> {{ item.money }}元 </view>
+      <van-icon name="arrow" />
     </view>
   </view>
 </view>
+
+<custom-picker title="{{title}}" show="{{show}}" valueKey="name" columns="{{columns}}" bind:ok="onOk" bind:cancel="onCancel" type="{{type}}" />

pages/rechargeRecord/index.wxss

@@ -1,4 +1,5 @@
 /* pages/rechargeRecord/index.wxss */
+
 .yearPicker {
   display: flex;
   align-items: center;
@@ -20,11 +21,12 @@
 }
 .recordsItem {
   display: flex;
-  justify-content: space-between;
+  /* justify-content: space-between; */
   padding: 16rpx 20rpx;
   border-left: 0;
   border-right: 0;
   border-top: 0;
+  align-items: center;
 }
 .recordsItem:last-child {
   border-bottom: 0;
@@ -39,10 +41,49 @@
 .money {
   font-size: 42rpx;
   font-weight: 600;
+  margin-right: 30rpx;
 }
 
 .wrapper {
   display: flex;
   flex-direction: column;
   flex: 1;
+}
+
+.chooseWrapper {
+  display: flex;
+  align-items: center;
+  background-color: var(--middle-green);
+  padding: 30rpx 36rpx;
+}
+
+.tenementPicker {
+  margin-left: 30rpx;
+  display: flex;
+  align-items: center;
+}
+
+.allMoney {
+  flex: 1;
+  text-align: right;
+  color: #fff;
+  font-size: 32rpx;
+  /* display: flex; */
+  /* justify-content: end; */
+}
+
+.type {
+  margin-right: 46rpx;
+  font-weight: 600;
+}
+
+.codeTime {
+  flex: 1;
+}
+
+.tenementName {
+  max-width: 200rpx;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }