完成账单用电初始版本（未联调）

app.json

@@ -1,8 +1,8 @@
 {
   "pages": [
-    "pages/electricQuery/index",
-    "pages/billList/index",
     "pages/home/index",
+    "pages/billList/index",
+    "pages/electricQuery/index",
     "pages/rechargeRecord/index",
     "pages/invoiceList/index",
     "pages/invoiceDetail/index",

components/timePicker/index.js

@@ -0,0 +1,77 @@
+// components/timePicker/index.js
+
+const dayjs = require("../../utils/dayjs");
+
+function generateYearArray(startYear) {
+  const currentYear = new Date().getFullYear();
+  const years = [];
+  for (let i = startYear; i <= currentYear; i++) {
+    years.push(i);
+  }
+  return years;
+}
+
+Component({
+
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    type: String,
+    value: Number,
+    show: Boolean,
+    year: String,
+    month: Number,
+    day: Number,
+  },
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    minDate: new Date(2024,0,1).getTime(),
+    maxDate: new Date().getTime(),
+    formatter(type, value) {
+      if (type === 'year') {
+        return `${value}年`;
+      }
+      if (type === 'month') {
+        return `${value}月`;
+      }
+      if (type === 'day') {
+        return `${value}日`;
+      }
+      return value;
+    },
+    years: generateYearArray(2024)
+  },
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    onInput(e) {
+      
+    },
+    onClose() {
+      this.triggerEvent("close")
+    },
+    onCancel() {
+      this.triggerEvent("cancel")
+    },
+    onConfirm(e) {
+      const { type } = this.data;
+      let time;
+      switch(type) {
+        case "day":
+          time =  dayjs(new Date(e.detail)).format('YYYY-MM-DD');
+          break;
+        case 'month':
+          time =  dayjs(new Date(e.detail)).format('YYYY-MM');
+          break;
+        case 'year':
+          time =  dayjs(new Date(e.detail.value, 0, 1)).format('YYYY');
+          break;  
+      }
+      this.triggerEvent("confirm", { type, time })
+    }
+  }
+})

components/timePicker/index.json

@@ -0,0 +1,8 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-datetime-picker": "@vant/weapp/datetime-picker/index",
+    "van-popup": "@vant/weapp/popup/index",
+    "van-picker": "@vant/weapp/picker/index"
+  }
+}

components/timePicker/index.wxml

@@ -0,0 +1,44 @@
+<!--components/timePicker/index.wxml-->
+<van-popup 
+  show="{{ show }}" 
+  position="bottom"
+  bind:close="onClose"
+>
+
+  <van-datetime-picker
+    bind:confirm="onConfirm"
+    bind:cancel="onCancel"
+    wx:if="{{ type === 'day' }}"
+    type="date"
+    value="{{ day }}"
+    min-date="{{ minDate }}"
+    max-date="{{ maxDate }}"
+    bind:input="onInput"
+    formatter="{{formatter}}"
+    title="日期"
+  />
+  <van-datetime-picker
+    bind:confirm="onConfirm"
+    bind:cancel="onCancel"
+    wx:if="{{ type === 'month' }}"
+    value="{{ month }}"
+    type="year-month"
+    value="{{ currentDate }}"
+    min-date="{{ minDate }}"
+    max-date="{{ maxDate }}"
+    bind:input="onInput"
+    formatter="{{formatter}}"
+    title="月份"
+  />
+  <van-picker  
+    bind:confirm="onConfirm"
+    bind:cancel="onCancel"
+    wx:if="{{ type === 'year' }}" 
+    columns="{{ years }}" 
+    bind:change="onChange" 
+    title="年份"
+    show-toolbar="{{true}}"
+    cancel-button-text="取消"
+    confirm-button-text="确定"
+  />
+</van-popup>

components/timePicker/index.wxss

@@ -0,0 +1 @@
+/* components/timePicker/index.wxss */

pages/billDetail/index.js

@@ -12,7 +12,12 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-
+    const { id: report } = options;
+    const { id: tenement } = wx.getStorageSync('tenement')
+    this.setData({
+      // url: `https://zgd.hbhcbn.com/h5/?report=${report}&tenement=${tenement}`
+      url: `http://localhost:3000/?report=${report}&tenement=${tenement}`
+    })
   },
 
   /**

pages/billDetail/index.wxml

@@ -1,2 +1,2 @@
 <!--pages/billDetail/index.wxml-->
-<web-view src="http://localhost:3000/userReport/1/1"/>
+<web-view src="{{url}}"/>

pages/billList/index.js

@@ -31,9 +31,10 @@ Page({
       page: page + 1,
     })
   },
-  jumpToDetail() {
+  jumpToDetail(e) {
+    const { id } = e.currentTarget.dataset
     wx.navigateTo({
-      url: '/pages/billDetail/index',
+      url: '/pages/billDetail/index?id=' + id,
     })
   },
   /**

pages/billList/index.wxml

@@ -4,5 +4,5 @@
 <view class="itemWrapper" wx:for="{{list}}" wx:key="index">
   <van-icon name="balance-list-o" />
   <view class="time"> {{ item.time }} </view>
-  <view class="operate" bind:tap="jumpToDetail"> 查看详细 </view>
+  <view class="operate" bind:tap="jumpToDetail" data-id="{{item.id}}"> 查看详细 </view>
 </view>

pages/electricQuery/components/accountingCard/index.js

@@ -0,0 +1,24 @@
+// pages/electricQuery/components/accountingCard/index.js
+Component({
+
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    data: Object
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+
+  }
+})

pages/electricQuery/components/accountingCard/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-row": "@vant/weapp/row/index",
+    "van-col": "@vant/weapp/col/index"
+  }
+}

pages/electricQuery/components/accountingCard/index.wxml

@@ -0,0 +1,33 @@
+<!--pages/electricQuery/components/accountingCard/index.wxml-->
+<view class="wrapper">
+  <view class="title">
+    {{data.meter.address}}
+  </view>
+  <van-row>
+    <van-col span="6">
+      <view class="tableTitle"> 初始余额 </view>
+    </van-col>
+    <van-col span="7">
+      <view class="tableTitle"> 储值累计金额 </view>
+    </van-col>
+    <van-col span="5">
+      <view class="tableTitle"> 电费 </view>
+    </van-col>
+    <van-col span="6">
+      <view class="tableTitle"> 账务余额 </view>
+    </van-col>
+    <van-col span="6">
+      <view class="tableContent"> {{data.startMoney}}  </view>
+    </van-col>
+    <van-col span="7">
+      <view class="tableContent">  {{data.rechargeMoney}} </view>
+    </van-col>
+    <van-col span="5">
+      <view class="tableContent">  {{data.electricMoney}} </view>
+    </van-col>
+    <van-col span="6">
+      <view class="tableContent">  {{data.currentMoney}} </view>
+    </van-col>
+  </van-row>
+
+</view>

pages/electricQuery/components/accountingCard/index.wxss

@@ -0,0 +1,24 @@
+/* pages/electricQuery/components/accountingCard/index.wxss */
+.wrapper {
+  background-color: #fff;
+  margin-top: 30rpx;
+}
+
+.title {
+  padding: 20rpx;
+  border-bottom: 1rpx solid #ccc;
+  font-size: 34rpx;
+}
+
+.tableTitle {
+  font-size: 32rpx;
+  margin: 20rpx 0 14rpx;
+  text-align: center;
+}
+
+.tableContent {
+  margin-top: 10rpx;
+  margin-bottom: 20rpx;
+  text-align: center;
+  font-size: 32rpx;
+}

pages/electricQuery/index.js

@@ -1,11 +1,10 @@
 // pages/electricQuery/index.js
-import { getElectricityList } from "../../service/accounting";
+import { getAccountingList, getElectricityList, getMeterReadingList } from "../../service/accounting";
 import { getTenementMeterList } from "../../service/meter";
 import dayjs from "../../utils/dayjs";
 import request from '../../utils/request';
-import * as echarts from '../..//components/echarts/echarts';
+import * as echarts from '../../components/echarts/echarts';
 const { OK } = request;
-const piedata = [1,2,3,4,5]
 Page({
 
   /**
@@ -22,17 +21,46 @@ Page({
     year: dayjs().format('YYYY'),
     yearMonth: dayjs().format("YYYY-MM"),
     yearMonthDay: dayjs().format("YYYY-MM-DD"),
+    yearStamp: new Date().getTime(),
+    yearMonthStamp: new Date().getTime(),
+    yearMonthDayStamp: new Date().getTime(),
     header: [
       { key: 'address', title: '电表地址', renderBody: (item) => item.meter?.address },
       { title: '时间',renderBody: (item) => { return item.time } },
       { key: 'number', title: '耗量' },
     ],
-    list: []
+    meterReadingHeader: [
+      { key: 'address', title: '电表地址', renderBody: (item) => item.meter?.address },
+      { title: '倍率', key: 'ratio' },
+      { key: 'number', title: '抄表记录' },
+    ],
+    list: [],
+    visible: false,
+    meterReadingList: [],
+    accountingList: []
   },
   changeQueryType(e) {
     const { type } = e.currentTarget.dataset
     this.setData({ queryType: type },() => {
-      this.init()
+      switch(type) {
+        case 0:
+          this.init()
+          break;
+        case 1:
+          this.getReadingList();
+          break;
+        case 2:
+          this.getAccountingBalanceList();
+          break;
+      }
+
+    })
+  },
+  clickTime() {
+    const { timeType } = this.data;
+    this.setData({
+      timePickerType: timeType === 0 ? "day" : (timeType === 1 ? 'month' : 'year'),
+      visible: true
     })
   },
   changeTimeType(e) {
@@ -51,9 +79,18 @@ Page({
   async init() {
     const { queryType, timeType, meterId } = this.data;
     const { code, message, data } = await getElectricityList({ type: queryType, meter: meterId, time: timeType })
-    console.log('data', data)
     this.setData({ list: data })
   },
+  async getReadingList() {
+    const { meterId } = this.data;
+    const { code, message, data } = await getMeterReadingList(meterId)
+    this.setData({ meterReadingList: data })
+  },
+  async getAccountingBalanceList() {
+    const { meterId } = this.data;
+    const { code, message, data } = await getAccountingList(meterId)
+    this.setData({ accountingList: data })
+  },
   async getMeters() {
     const { id } = wx.getStorageSync('tenement')
     const { code, message, data } = await getTenementMeterList(id);
@@ -99,6 +136,33 @@ Page({
       this.init();
     })
   },
+  onTimeClose() {
+    this.setData({ visible: false })
+  },
+  onTimeCancel() {
+    this.setData({ visible: false })
+  },
+  onTimeConfirm(e) {
+    const { type, time } = e.detail;
+    switch(type) {
+      case "year":
+        this.setData({ year: time,  visible: false, }, () => {
+          this.init();
+        });
+        break;
+      case "month":
+        const [year, month] = time.split("-")
+        this.setData({ yearMonth: time, yearMonthStamp: new Date(Number(year), Number(month) - 1, 1).getTime(), visible: false }, () => {
+          this.init();
+        });
+        break;
+      case "day":
+        this.setData({ yearMonthDay: time, yearMonthDayStamp: new Date(time).getTime(), visible: false }, () => {
+          this.init();
+        })
+        break;
+    }
+  },
   /**
    * 生命周期函数--监听页面初次渲染完成
    */

pages/electricQuery/index.json

@@ -7,7 +7,9 @@
     "van-col": "@vant/weapp/col/index",
     "van-button": "@vant/weapp/button/index",
     "table": "/components/table/table",
-    "empty": "/components/empty/index"
+    "empty": "/components/empty/index",
+    "timePicker": "/components/timePicker/index",
+    "accountingCard": "./components/accountingCard/index"
   },
   "navigationStyle": "custom"
 }

pages/electricQuery/index.wxml

@@ -41,26 +41,56 @@
       </van-row>
     </view>
   </view>
-  <view class="tooltip">
+  <view wx:if="{{queryType === 0}}">
-    不包括线损电量，显示为电表实际消耗电量。仅供参考，实际能耗电量以电费账单为主。如有疑问，请联系客服。
+    <view class="tooltip">
-  </view>
+      不包括线损电量，显示为电表实际消耗电量。仅供参考，实际能耗电量以电费账单为主。如有疑问，请联系客服。
-  <view class="timeChooseWrapper">
+    </view>
-    <view> 选择时间 </view>
+    <view class="timeChooseWrapper">
-    <view class="time">
+      <view> 选择时间 </view>
-      <view class="timeText"> {{yearMonthDay}} </view>
+      <view class="time" bind:tap="clickTime">
-      <van-icon name="arrow-down" />
+        <view class="timeText" wx:if="{{timeType === 0}}"> {{yearMonthDay}} </view>
+        <view class="timeText" wx:elif="{{timeType === 1}}"> {{yearMonth}} </view>
+        <view class="timeText" wx:else> {{year}} </view>
+        <van-icon name="arrow-down" />
+      </view>
+      <van-button type="info" size="small"> 导出 </van-button>
+    </view>
+  </view>
+  <view wx:elif="{{queryType === 1}}">
+    <view class="tooltip">
+      显示为最新的一条抄表记录。电表更新数据有延迟，仅供参考，实际以电表上显示为准。
+    </view>
+  </view>
+  <view wx:elif="{{queryType === 2}}">
+    <view class="tooltip">
+      账务余额更新时间为：每次预存电费后，每次账单发布后，剩余的实际金额。电表余额与账务余额相差较大的用户，每半年统一处理一次。
     </view>
-    <van-button type="info" size="small"> 导出 </van-button>
   </view>
- 
   
 </view>
-<view style="margin: 30rpx;">
+  <view wx:if="{{queryType === 0}}">
-    <table header="{{header}}" list="{{list}}" wx:if="{{list.length}}" />
+    <view style="margin: 30rpx;">
-    <empty bind:refresh="init" wx:else />
+      <table header="{{header}}" list="{{list}}" wx:if="{{list.length}}" />
+      <empty bind:refresh="init" wx:else />
+    </view>
+    <view class="sum">
+      合计：表计数量：10，耗电量100
+    </view>
   </view>
-  <view class="sum">
+  <view wx:if="{{queryType === 1}}">
-    合计：表计数量：10，耗电量100
+    <view style="margin: 30rpx;">
+      <table header="{{meterReadingHeader}}" list="{{meterReadingList}}" wx:if="{{meterReadingList.length}}" />
+      <empty bind:refresh="init" wx:else />
+    </view>
+   
+  </view>
+  <view wx:if="{{queryType === 2}}">
+    <view style="margin: 30rpx;">
+      <accountingCard wx:for="{{accountingList}}" data="{{item}}" />
+      <!-- <table header="{{meterReadingHeader}}" list="{{accountingList}}" wx:if="{{accountingList.length}}" /> -->
+      <!-- <empty bind:refresh="init" wx:else /> -->
+    </view>
+   
   </view>
   <!-- <echarts 
     style="width:200rpx;height:200rpx;position:relative" 
@@ -78,4 +108,14 @@
   bind:ok="onOk" 
   bind:cancel="onCancel" 
   type="{{type}}" 
+/>
+<timePicker 
+  type="{{timePickerType}}" 
+  year="{{year}}" 
+  month="{{yearMonthStamp}}" 
+  day="{{yearMonthDayStamp}}" 
+  show="{{visible}}" 
+  bind:cancel="onTimeCancel" 
+  bind:close="onTimeClose" 
+  bind:confirm="onTimeConfirm" 
 />

pages/electricQuery/index.wxss

@@ -61,6 +61,7 @@ page {
 .tooltip {
   margin: 20rpx 0;
   font-size: 32rpx;
+  color: rgb(119, 114, 114);
 }
 .timeChooseWrapper {
   display: flex;

pages/invoiceList/components/already/index.js

@@ -21,6 +21,7 @@ Component({
   },
   onRefresh() {
     console.log('--------------')
+    this.getList();
   },
   lifetimes: {
     attached() {

pages/rechargeRecord/index.js

@@ -77,7 +77,6 @@ Page({
   },
   onChangeMeter(e) {
     const { id, code } = e;
-    console.log('e', e)
     const { year } = this.data;
     // const currentYear = years[Number(e)]
     this.setData({

service/accounting.js

@@ -11,4 +11,15 @@ export const getBillList = async function(page) {
 export const getElectricityList = async function({ meter, type, time }) {
   const tenement = wx.getStorageSync('tenement')?.id || ""
   return await GET(`/wx/getElectricityList?tenement=${tenement}&meter=${meter}&type=${type}&time=${time}`);
+}
+
+// 抄表记录列表
+export const getMeterReadingList = async function(meter) {
+  const tenement = wx.getStorageSync('tenement')?.id || ""
+  return await GET(`/wx/getMeterReadingList?tenement=${tenement}&meter=${meter}`);
+}
+// 账务余额列表
+export const getAccountingList = async function(meter) {
+  const tenement = wx.getStorageSync('tenement')?.id || ""
+  return await GET(`/wx/getAccountingList?tenement=${tenement}&meter=${meter}`);
 }

utils/index.js

@@ -45,8 +45,8 @@ export function getConfigByEnv() {
   switch (envVersion) {
     // 开发版
     case 'develop':
-      // api = "http://localhost:8000"
+      api = "http://localhost:8000"
-      api = "http://127.0.0.1:4523/m1/4143821-0-default"
+      // api = "http://127.0.0.1:4523/m1/4143821-0-default"
       break;
     // 体验版
     case 'trial':