新增首页园区和商户的交互

pages/home/index.js

@@ -1,5 +1,8 @@
+import { getOwnTenementList } from "../../service/tenement";
+import { getUserInfo } from "../../service/user";
 import { alertInfo } from "../../utils/index";
-
+import request from '../../utils/request';
+const { OK } = request;
 // pages/home/index.js
 Page({
 
@@ -8,20 +11,73 @@ Page({
    */
   data: {
     user: {},
+    all: [],
+    park: {},
+    tenement: {},
+    show: false,
+    columns: [],
+    pickerType: ""
   },
-
+  
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
    
   },
-
+  choosePark() {
+    this.setData({
+      columns: this.data.all,
+      show: true,
+      pickerType: "park"
+    })
+  },
+  chooseTenement() {
+    const { park = {}} = this.data;
+    const { tenements } = park;
+    this.setData({
+      columns: tenements,
+      show: true,
+      pickerType: "tenement"
+    })
+  },
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
   onReady() {
 
+  },
+  onOk(e) {
+    // console.log('e', e)
+    const { type, index, value } = e.detail;
+    const  currentPark = this.data.park;
+    if (type === "park") {
+      if (value.id === currentPark?.id) {
+        this.setData({ show: false })
+        return
+      }
+      this.setData({
+        show: false,
+        park: value,
+        tenement: value.tenements?.[0]
+      })
+    }
+    if (type === "tenement") {
+      const  currentTenement = this.data.tenement;
+      if (value.id === currentTenement?.id) {
+        this.setData({ show: false })
+        return
+      }
+      this.setData({
+        show: false,
+        tenement: value
+      })
+    }
+  },
+  onCancel() {
+    this.setData({
+      show: false,
+    })
   },
   changeMoney(e) {
     const { money } = e.currentTarget.dataset;
@@ -30,7 +86,6 @@ Page({
     })
   },
   onChangeMoney(e) {
-    console.log('e', e)
     this.setData({ money: Number(e.detail) })
   },
   recharge() {
@@ -49,10 +104,60 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow() {
-    const user = wx.getStorageSync('user')
-    this.setData({ user })
+    this.setUser();
+    this.getAllList();
+    this.watchTenement();
   },
-
+  watchTenement() {
+    let value = this.data.tenement; // 获取被监听属性的当前值
+ 
+    // 使用 Object.defineProperty 方法在数据对象上定义属性的 getter 和 setter
+    Object.defineProperty(this.data, 'tenement', {
+      configurable: true, // 可配置
+      enumerable: true, // 可枚举
+      get: function () {
+        return value; // 返回属性的当前值
+      },
+      set: function (newVal) {
+        const oldValue = value;
+        value = newVal;
+      }
+    });
+  },
+  async setUser() {
+    const result = await getUserInfo();
+    if (result.code !== OK) {
+      alertInfo(result.message)
+      return;
+    }
+    this.setData({ user: result.data })
+    wx.setStorageSync('user', result.data)
+  },
+  async getAllList() {
+    const { code, message, data } = await getOwnTenementList()
+    if (code !== OK) {
+      alertInfo(message)
+      return
+    }
+    const [firstPark = {}] = data;
+    const { park, tenement } = this.data;
+    const updateDatas = {}
+    if (!park || !park.id) {
+      updateDatas.park = firstPark
+    }
+    if (!tenement || !tenement.id) {
+      if (!park || !park.id) {
+        updateDatas.tenement = firstPark.tenements?.[0]
+      } else {
+        updateDatas.tenement = park.tenements?.[0];
+      }
+    }
+    updateDatas.all = data;
+    this.setData({
+      ...updateDatas
+    })
+  },
+  
   /**
    * 生命周期函数--监听页面隐藏
    */

pages/home/index.json

@@ -5,7 +5,8 @@
     "van-button": "@vant/weapp/button/index",
     "van-image": "@vant/weapp/image/index",
     "avatar": "/components/avatar/index",
-    "van-field": "@vant/weapp/field/index"
+    "van-field": "@vant/weapp/field/index",
+    "picker": "/components/picker/index"
   },
   "navigationStyle": "custom"
 }

pages/home/index.wxml

@@ -1,11 +1,13 @@
 <!--pages/home/index.wxml-->
-<view class="top">
+<page-meta page-style="{{ show ? 'overflow: hidden;' : '' }}" />
+<view>
+  <view class="top">
   <custom-status-bar />
   <view class="chooseParkWrapper">
     用电管理服务 ·
-    <view class="parkContent">
+    <view class="parkContent" bind:tap="choosePark">
       <view class="park">
-        金石工业园
+        {{park.name}}
       </view>
       <van-icon name="arrow-down" style="margin-left: 16rpx;" />
     </view>
@@ -20,9 +22,9 @@
   <van-button type="info" size="small" plain="{{true}}" class="loginBtn" bind:tap="jumpToLogin">请登录</van-button>
 </view>
 <view class="logined" wx:else>
-  <avatar text="{{ user.tenement.name.slice(0,2) }}" />
+  <avatar text="{{ user.nickName }}" />
   <view>
-    <van-button type="info" size="small" plain="{{true}}" class="loginBtn" >{{user.tenement.name}}    <van-icon name="arrow-down" style="margin-left: 16rpx;" /></van-button>
+    <van-button type="info" size="small" plain="{{true}}" class="loginBtn" bind:click="chooseTenement">{{user.tenement.name}}    <van-icon name="arrow-down" style="margin-left: 16rpx;" /></van-button>
     <view class="welcome"> 欢迎使用华昌宝能用电管理系统！ </view>
   </view>
 </view>
@@ -80,4 +82,7 @@
   <view class="operate">
     <van-button color="rgb(88, 165, 141)" block>去缴费</van-button>
   </view>
-</view>
+
+</view>
+</view>
+<picker show="{{show}}" valueKey="name" columns="{{columns}}" bind:ok="onOk" bind:cancel="onCancel" type="{{pickerType}}" />