zhsw_wechat/pages/mine/mine.wxml

<view class="page-container">
  <!-- 背景和用户信息部分 -->
  <view class="container">
    <!-- 顶部导航以及背景 -->
    <view class="header">
      <image class="background" src="{{images.background}}" mode="widthFix" />
    </view>

    <view style="height: 200rpx; background-color: #4285f4;"></view>

    <!-- 用户信息 -->
    <view class="user-info-container">
      <view class="user-info">
        <view class="user-name">{{userInfo.name}}</view>
        <view class="user-id">
          <image src="/static_file/hh.png" class="id-icon"></image>
          <text>{{userInfo.id}}</text>
        </view>
        <view class="user-address">
          <image src="/static_file/location.png" class="address-icon"></image>
          <text>{{userInfo.address}}</text>
        </view>
      </view>
    </view>
  </view>

  <!-- 功能选择框 -->
  <view class="function-list">
    <!-- 第一组：缴费记录和账单查询 -->
    <view class="function-group">
      <view class="function-item" bindtap="navigateTo" data-url="/pages/payment/payment">
        <text class="function-text">缴费记录</text>
        <image class="arrow-icon" src="/static_file/arrow.png"></image>
      </view>
      
      <view class="divider"></view>
      
      <view class="function-item" bindtap="navigateTo" data-url="/pages/bill/bill">
        <text class="function-text">账单查询</text>
        <image class="arrow-icon" src="/static_file/arrow.png"></image>
      </view>
    </view>
    
    <!-- 第二组：我的报修和我的建议 -->
    <view class="function-group">
      <view class="function-item" bindtap="navigateTo" data-url="/pages/repair/repair">
        <text class="function-text">我的报修</text>
        <image class="arrow-icon" src="/static_file/arrow.png"></image>
      </view>
      
      <view class="divider"></view>
      
      <view class="function-item" bindtap="navigateTo" data-url="/pages/suggestion/suggestion">
        <text class="function-text">我的建议</text>
        <image class="arrow-icon" src="/static_file/arrow.png"></image>
      </view>
    </view>
  </view>
</view>