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

2024-04-02 17:32:28 +08:00
parent 3284bea475
commit db6d253898
44 changed files with 676 additions and 141 deletions
--- a/pages/handleLogin/index.js
+++ b/pages/handleLogin/index.js
@@ -93,6 +93,20 @@ Page({
      })
    })
  },
+  scan() {
+    wx.scanCode({
+      scanType: "qrCode",
+      success: ({ path }) => {
+        wx.navigateTo({
+          url: '/' + path,
+        })
+      },
+      fail: err => {
+        console.log('scan code err', err)
+        alertInfo("扫码失败，请稍后重试")
+      }
+    })
+  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
--- a/pages/handleLogin/index.json
+++ b/pages/handleLogin/index.json
@@ -4,7 +4,9 @@
    "select": "/components/select/index",
    "van-button": "@vant/weapp/button/index",
    "van-field": "@vant/weapp/field/index",
-    "van-icon": "@vant/weapp/icon/index"
+    "van-icon": "@vant/weapp/icon/index",
+    "van-tab": "@vant/weapp/tab/index",
+    "van-tabs": "@vant/weapp/tabs/index"
  },
-  "navigationBarTitleText": "手动绑定"
+  "navigationBarTitleText": "绑定商户"
 }
--- a/pages/handleLogin/index.wxml
+++ b/pages/handleLogin/index.wxml
@@ -1,33 +1,53 @@
 <!--pages/handleLogin/index.wxml-->
-<topbar />
-<view>
-  <select label="园区" type="0" bind:choose="onChoosePark" park="{{park}}" parkName="{{parkName}}" required="{{true}}" />
-  <select label="公司名称" type="1" bind:choose="onChooseTenement" park="{{park}}" tenement="{{tenement}}" tenementName="{{tenementName}}" required="{{true}}" />
-  <van-field
-    required
-    value="{{ phone }}"
-    label="联系人手机号"
-    placeholder="请输入联系人手机号"
-    border="{{ true }}"
-    bind:change="onChangePhone"
-  />
-  <van-field
-    required
-    value="{{ name }}"
-    label="你的昵称"
-    placeholder="请输入你的昵称"
-    border="{{ true }}"
-    bind:change="onChangeName"
-  />
-  <view class="submit">
-    <van-button type="info" block bind:click="handleSubmit"> 提交 </van-button>
-  </view>
-  <view class="way">
+<!-- <topbar /> -->
+<van-tabs>
+  <van-tab title="扫码绑定">
+    <view class="codeContent">
+      <view class="text">
+        您可以联系贵司在系统中预留的手机号联系人
+      </view>
+      <view class="text">
+        登录本系统-我的-二维码
+      </view>
+      <view class="text">
+        使用微信扫一扫，直接绑定
+      </view>
+      <view class="scan">
+        <van-button type="info" block bind:click="scan"> 去扫码 </van-button>
+      </view>
+    </view>
+  </van-tab>
+  <van-tab title="手动绑定">
    <view>
-      不知道预留的手机号？可联系后台管理员查询！
+      <select label="园区" type="0" bind:choose="onChoosePark" park="{{park}}" parkName="{{parkName}}" required="{{true}}" />
+      <select label="公司名称" type="1" bind:choose="onChooseTenement" park="{{park}}" tenement="{{tenement}}" tenementName="{{tenementName}}" required="{{true}}" />
+      <van-field
+        required
+        value="{{ phone }}"
+        label="联系人手机号"
+        placeholder="请输入联系人手机号"
+        border="{{ true }}"
+        bind:change="onChangePhone"
+      />
+      <van-field
+        required
+        value="{{ name }}"
+        label="你的昵称"
+        placeholder="请输入你的昵称"
+        border="{{ true }}"
+        bind:change="onChangeName"
+      />
+      <view class="submit">
+        <van-button type="info" block bind:click="handleSubmit"> 提交 </van-button>
+      </view>
+      <view class="way">
+        <view>
+          不知道预留的手机号？可联系后台管理员查询！
+        </view>
+        <view class="phone" bind:tap="callPhone" data-phone="13266911877">
+          <van-icon name="phone-o" class="phoneIcon" /> 13266911877
+        </view>
+      </view>
    </view>
-    <view class="phone" bind:tap="callPhone" data-phone="13266911877">
-      <van-icon name="phone-o" class="phoneIcon" /> 13266911877
-    </view>
-  </view>
-</view>
+  </van-tab>
+</van-tabs>
--- a/pages/handleLogin/index.wxss
+++ b/pages/handleLogin/index.wxss
@@ -18,4 +18,18 @@
  margin-top: 30rpx;
  color: var(--middle-green);
  display: inline-block;
+}
+
+.codeContent {
+  margin-top: 10vh;
+  margin-left: 36rpx;
+  margin-right: 36rpx;
+}
+
+.codeContent .text {
+  margin: 30rpx;
+}
+
+.scan {
+  margin-top: 8vh;
 }
--- a/pages/home/index.js
+++ b/pages/home/index.js
@@ -1,6 +1,7 @@
+import { getMeterDetail, getMeterList, getTenementMeterList } from "../../service/meter";
 import { getOwnTenementList } from "../../service/tenement";
 import { getUserInfo } from "../../service/user";
-import { alertInfo } from "../../utils/index";
+import { alertError, alertInfo } from "../../utils/index";
 import request from '../../utils/request';
 const { OK } = request;
 // pages/home/index.js
@@ -16,7 +17,9 @@ Page({
    tenement: {},
    show: false,
    columns: [],
-    pickerType: ""
+    pickerType: "",
+    meterList: [],
+    meterIndex: 0,
  },
  
  /**
@@ -46,9 +49,35 @@ Page({
   */
  onReady() {

+  },
+  async changeMeter() {
+    const { meterList = [], meterIndex, tenement = {} } = this.data;
+    let newIndex = meterIndex + 1;
+    if (newIndex === meterList.length) {
+      newIndex = 0;
+    }
+    const { code, message, data } = getMeterDetail({ code: meterList[newIndex]?.code, tenement: tenement.id })
+    if (code !== OK) {
+      alertInfo(message)
+      return
+    }
+    meterList[newIndex] = { ...data.meter, money: data.money };
+    this.setData({
+      meterIndex: newIndex,
+      meterList
+    })
+  },
+  async refreshMeter() {
+    const { meterIndex } = this.data;
+    const { code, message, data } = getMeterDetail({ code: meterList[newIndex].id, tenement: tenement.id })
+    if (code !== OK) {
+      alertInfo(message)
+      return
+    }
+    meterList[meterIndex] = { ...data.meter, money: data.money };
+    this.setData({ meterList })
  },
  onOk(e) {
-    // console.log('e', e)
    const { type, index, value } = e.detail;
    const  currentPark = this.data.park;
    if (type === "park") {
@@ -109,6 +138,7 @@ Page({
    this.watchTenement();
  },
  watchTenement() {
+    const that = this;
    let value = this.data.tenement; // 获取被监听属性的当前值
 
    // 使用 Object.defineProperty 方法在数据对象上定义属性的 getter 和 setter
@@ -121,17 +151,30 @@ Page({
      set: function (newVal) {
        const oldValue = value;
        value = newVal;
+        // that.getMeters(newVal);
      }
    });
  },
-  async setUser() {
-    const result = await getUserInfo();
-    if (result.code !== OK) {
-      alertInfo(result.message)
+  async getMeters({ id }) {
+    const { code, message, data } = await getTenementMeterList(id);
+    if (code !== OK) {
+      alertError(message)
      return;
    }
-    this.setData({ user: result.data })
-    wx.setStorageSync('user', result.data)
+    this.setData({
+      meterList: data || []
+    })
+  },
+  async setUser() {
+    // const result = await getUserInfo();
+    // if (result.code !== OK) {
+    //   alertInfo(result.message)
+    //   return;
+    // }
+    // this.setData({ user: result.data })
+    // wx.setStorageSync('user', result.data)
+    const user = wx.getStorageSync('user')
+    this.setData({ user: user })
  },
  async getAllList() {
    const { code, message, data } = await getOwnTenementList()
@@ -157,7 +200,14 @@ Page({
      ...updateDatas
    })
  },
-  
+  jumpToRecord() {
+    wx.navigateTo({
+      url: '/pages/rechargeRecord/index',
+    })
+  },
+  jumpToOrder() {
+    alertInfo("尚未完成")
+  },
  /**
   * 生命周期函数--监听页面隐藏
   */
--- a/pages/home/index.json
+++ b/pages/home/index.json
@@ -6,7 +6,9 @@
    "van-image": "@vant/weapp/image/index",
    "avatar": "/components/avatar/index",
    "van-field": "@vant/weapp/field/index",
-    "picker": "/components/picker/index"
+    "picker": "/components/picker/index",
+    "van-grid": "@vant/weapp/grid/index",
+    "van-grid-item": "@vant/weapp/grid-item/index"
  },
  "navigationStyle": "custom"
 }
--- a/pages/home/index.wxml
+++ b/pages/home/index.wxml
@@ -2,10 +2,10 @@
 <page-meta page-style="{{ show ? 'overflow: hidden;' : '' }}" />
 <view>
  <view class="top">
-  <custom-status-bar />
+  <custom-status-bar transparent="{{true}}" />
  <view class="chooseParkWrapper">
-    用电管理服务 ·
-    <view class="parkContent" bind:tap="choosePark">
+    用电管理服务 · 
+    <view class="parkContent" bind:tap="choosePark" wx:if="{{park.id}}">
      <view class="park">
        {{park.name}}
      </view>
@@ -19,7 +19,7 @@
  </view>
 <view class="login" wx:if="{{!user || !user.id}}" class="notLoginWrapper">
  <van-image width="100rpx" height="100rpx" src="/assets/images/defaultAvatar.png" class="defaultAvatar"/>
-  <van-button type="info" size="small" plain="{{true}}" class="loginBtn" bind:tap="jumpToLogin">请登录</van-button>
+  <van-button type="primary" size="small" plain="{{true}}" class="loginBtn" bind:tap="jumpToLogin">请登录</van-button>
 </view>
 <view class="logined" wx:else>
  <avatar text="{{ user.nickName }}" />
@@ -34,7 +34,7 @@
      <view class="cardTopLeft">
        <view> 华昌宝能 - 软c307 </view>
      </view>
-      <van-button type="info" size="small" plain="{{true}}" class="loginBtn">
+      <van-button type="info" size="small" plain="{{true}}" class="loginBtn" bind:click="changeMeter">
        <van-icon name="exchange" />
        切换电表
      </van-button>
@@ -52,7 +52,7 @@
        <view class="cardItemLabel"> 电表余额： </view>
        <view class="cardItemValue">
          <view class="text"> 200 </view>
-          <van-button type="info" size="small" plain="{{true}}">
+          <van-button type="info" size="small" plain="{{true}}" bind:click="refreshMeter">
            <van-icon name="replay" />
            刷新
          </van-button>
@@ -82,6 +82,17 @@
  <view class="operate">
    <van-button color="rgb(88, 165, 141)" block>去缴费</van-button>
  </view>
+  <view class="others">
+    <van-grid direction="horizontal" column-num="2">
+      <van-grid-item icon="balance-list-o" text="电费账单" bind:click="jumpToOrder">
+        <!-- <view slot="icon"> 111 </view> -->
+        <!-- <van-icon slot="icom" name="balance-list-o" /> -->
+      </van-grid-item>
+      <van-grid-item icon="after-sale" text="缴费记录" bind:click="jumpToRecord" />
+      <van-grid-item icon="bar-chart-o" text="用电查询" />
+      <van-grid-item icon="bill-o" text="去开票" />
+    </van-grid>
+  </view>

 </view>
 </view>
--- a/pages/home/index.wxss
+++ b/pages/home/index.wxss
@@ -128,4 +128,11 @@
 .moneyInput {
  margin-top: 30rpx;
  margin-bottom: 30rpx;
+}
+
+.others {
+  margin-left: 46rpx;
+  margin-right: 46rpx;
+  margin-top: 40rpx;
+  margin-bottom: 40rpx;
 }
--- a/pages/login/index.js
+++ b/pages/login/index.js
@@ -20,19 +20,19 @@ Page({
   * 生命周期函数--监听页面加载
   */
  onLoad() {
-    const user = wx.getStorageSync('user')
-    if (!user || !user.id) {
-      return;
-    }
-    if (user.status === 0 || user.status === 2) {
-      wx.redirectTo({
-        url: '/pages/waitApprove/index',
-      })
-      return
-    }
-    wx.switchTab({
-      url: '/pages/home/index',
-    })
+    // const user = wx.getStorageSync('user')
+    // if (!user || !user.id) {
+    //   return;
+    // }
+    // if (user.status === 0 || user.status === 2) {
+    //   wx.redirectTo({
+    //     url: '/pages/waitApprove/index',
+    //   })
+    //   return
+    // }
+    // wx.switchTab({
+    //   url: '/pages/home/index',
+    // })
  },

  /**
--- a/pages/member/components/memberManage/index.js
+++ b/pages/member/components/memberManage/index.js
@@ -33,8 +33,13 @@ Component({
  methods: {
    async init() {
      const result = await getApproveList(1)
+      const { code, message, data } = result;
+      // if (code !== OK) {
+      //   alertInfo(message)
+      //   return;
+      // }
      this.setData({
-        list: result.data
+        list: data
      })
    },
    async setAdmin(e) {
--- a/pages/member/components/memberManage/index.json
+++ b/pages/member/components/memberManage/index.json
@@ -2,6 +2,8 @@
  "component": true,
  "usingComponents": {
    "van-tab": "@vant/weapp/tab/index",
-    "van-tabs": "@vant/weapp/tabs/index"
+    "van-tabs": "@vant/weapp/tabs/index",
+    "avatar": "/components/avatar/index",
+    "van-button": "@vant/weapp/button/index"
  }
 }
--- a/pages/member/components/memberManage/index.wxml
+++ b/pages/member/components/memberManage/index.wxml
@@ -10,10 +10,15 @@
 <van-tabs active="{{ active }}" bind:change="onChange">
  <van-tab wx:for="{{list}}" wx:key="index" title="{{item.name}}">
    <view wx:for="{{item.users}}" wx:key="index" wx:for-item="ele"  class="item">
-      <view class="nickName"> {{ ele.name }} </view>
-      <view class="operate" wx:if="{{!ele.isAdmin}}">
-        <view class="primaryTextBtn" data-user="{{ele}}" bind:tap="setAdmin" data-tenement="{{item.id}}"> 设为管理员 </view>
-        <view class="disAgree dangerTextBtn" data-user="{{ele}}" bind:tap="remove" data-tenement="{{item.id}}"> 移除 </view>
+      <avatar text="{{ele.name}}" />
+      <view class="info">
+        <view class="nickName"> {{ ele.name }} </view>
+        <view class="phone"> {{ ele.phone }} </view>
+      </view>
+      <!-- <view class="operate" wx:if="{{!ele.isAdmin}}"> -->
+      <view class="operate">
+        <van-button type="info" size="small" data-user="{{ele}}" bind:click="setAdmin" data-tenement="{{item.id}}" style="margin-bottom: 16rpx;" class="admin">设为管理员</van-button>
+        <van-button type="danger" size="small" data-user="{{ele}}" bind:click="remove" data-tenement="{{item.id}}" class="remove">移除</van-button>
      </view>
    </view>
  </van-tab>
--- a/pages/member/components/memberManage/index.wxss
+++ b/pages/member/components/memberManage/index.wxss
@@ -3,10 +3,15 @@
 .item {
  display: flex;
  align-items: center;
-  padding-top: 24rpx;
-  padding-bottom: 24rpx;
+  /* padding-top: 24rpx; */
+  /* padding-bottom: 24rpx; */
+  padding: 24rpx;
  margin-left: 32rpx;
  margin-right: 32rpx;
+  margin-top: 30rpx;
+  margin-bottom: 15rpx;
+  background-color: #fff;
+  border-radius: 30rpx;
 }

 .nickName {
@@ -14,9 +19,38 @@
 }

 .operate {
+  /* display: flex; */
+  height: 100%;
  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  justify-content: space-between;
+}
+.admin button, .remove button {
+  width: 180rpx;
 }

 .disAgree {
  margin-left: 24rpx;
+}
+
+.info {
+  margin-left: 32rpx;
+  flex: 1;
+}
+
+.nickName {
+  max-width: 300rpx;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-bottom: 30rpx;
+}
+
+page, .van-tabs__scroll  {
+  background-color: rgb(228,240,236) !important;
+}
+
+.van-tabs__scroll  {
+  background-color: rgb(228,240,236) !important;
 }
--- a/pages/member/index.json
+++ b/pages/member/index.json
@@ -3,6 +3,8 @@
    "van-tab": "@vant/weapp/tab/index",
    "van-tabs": "@vant/weapp/tabs/index",
    "approve-member": "./components/approveMember/index",
-    "member-manage": "./components/memberManage/index"
-  }
+    "member-manage": "./components/memberManage/index",
+    "navigator": "/components/navigator/index"
+  },
+  "navigationStyle": "custom"
 }
--- a/pages/member/index.wxml
+++ b/pages/member/index.wxml
@@ -4,6 +4,7 @@
    <approve-member />
  </van-tab>
  <van-tab title="人员管理"> -->
+    <navigator canBack="{{true}}" title="成员管理" />
    <member-manage />
  <!-- </van-tab> -->
 <!-- </van-tabs> -->
--- a/pages/rechargeDetail/index.js
+++ b/pages/rechargeDetail/index.js
@@ -0,0 +1,80 @@
+import { getRechargeDetail } from "../../service/recharge";
+import request from "../../utils/request"
+const { OK } = request
+// pages/rechargeDetail/index.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    detail: {}
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    const { id } = options;
+    this.init(id)
+  },
+  async init(id) {
+    const { code, message, data } = await getRechargeDetail(id)
+    this.setData({
+      detail: data
+    })
+  },
+  back() {
+    // wx.navigateBack({ delta: 1 });
+    wx.navigateBack();
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    const pages = getCurrentPages()
+    console.log('pages', pages)
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})
--- a/pages/rechargeDetail/index.json
+++ b/pages/rechargeDetail/index.json
@@ -0,0 +1,8 @@
+{
+  "usingComponents": {
+    "navigator": "/components/navigator/index",
+    "van-field": "@vant/weapp/field/index",
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationStyle": "custom"
+}
--- a/pages/rechargeDetail/index.wxml
+++ b/pages/rechargeDetail/index.wxml
@@ -0,0 +1,69 @@
+<!--pages/rechargeDetail/index.wxml-->
+<navigator title="充值详情" canBack="{{true}}" bind:back="back" />
+
+<van-cell-group>
+  <van-field
+    value="{{detail.tenement.name}}"
+    label="商户名称"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.meter.code}}"
+    label="电表编号"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.meter.address}}"
+    label="电表地址"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.time}}"
+    label="操作时间"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.account}}"
+    label="充值账号"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.money}}"
+    label="充值金额"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.tenement.name}}"
+    label="操作类型"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.tenement.name}}"
+    label="付款方式"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.voucherNo}}"
+    label="订单号"
+    readonly
+    border="{{ false }}"
+  />
+  <van-field
+    value="{{detail.serialNumber}}"
+    label="流水号"
+    readonly
+    border="{{ false }}"
+  />
+</van-cell-group>
+
+<view class="operate">
+  <van-button type="default" block bind:tap="back">返回</van-button>
+</view>
--- a/pages/rechargeDetail/index.wxss
+++ b/pages/rechargeDetail/index.wxss
@@ -0,0 +1,8 @@
+/* pages/rechargeDetail/index.wxss */
+.operate {
+  margin-top: 60rpx;
+  margin-left: 36rpx;
+  margin-right: 36rpx;
+  padding-bottom: 50rpx;
+}
+
--- a/pages/rechargeRecord/index.js
+++ b/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  })
  },
  /**
   * 生命周期函数--监听页面隐藏
--- a/pages/rechargeRecord/index.json
+++ b/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"
 }
--- a/pages/rechargeRecord/index.wxml
+++ b/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}}" />
--- a/pages/rechargeRecord/index.wxss
+++ b/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;
 }