<template>
  <view class="me_page">
    <view class="me_header">
      <view class="me_avatar">
        <up-avatar
          v-if="useModel.userData?.value?.avatar"
          :src="useModel.userData?.value?.avatar[0]?.url"
          :size="'120rpx'"
        />
        <up-avatar v-else :size="'120rpx'" />
      </view>
      <view class="me_user">
        <view
          class="me_name"
          v-if="useModel.userData?.value"
          @click="method?.handleJinGang({ url: '/ME/update/index' })"
        >
          <template v-if="useModel.userData?.value?.name">
            您好，{{ useModel.userData?.value?.name }}
            <uni-icons type="right" size="15" color="#666"> </uni-icons>
          </template>
          <template v-else>
            暂未设置名称
            <uni-icons type="right" size="15" color="#666"> </uni-icons>
          </template>
        </view>
        <view class="me_name" v-else @click="method?.handleJinGang({ url: '/pages/login' })">
          请您登录
          <uni-icons type="right" size="15" color="#666"> </uni-icons>
        </view>
        <view class="user_roles">
          <view class="item">
            <image src="/static/svg/roles.svg" mode="heightFix" />
            {{ useModel?.gridHouseData?.value?.position?.name || '-' }}
          </view>
          <view class="item">
            <image src="/static/svg/home.svg" mode="heightFix" />
            {{ useModel?.gridHouseData?.value?.house_num || '-' }}户房屋
          </view>
        </view>
      </view>
    </view>
    <view class="me_content">
      <view
        v-for="(i, index) in useModel.list"
        :key="`item_${index}`"
        class="items"
        @click="method?.handleJinGang(i)"
      >
        <image :src="`/static/svg/${i?.icon}.svg`" mode="heightFix" lazy-load="false" />
        <view> {{ i.label }} </view>
      </view>
    </view>
  </view>
</template>
<script setup lang="ts">
const accountInfo = uni.getAccountInfoSync()
const miniProgramVersion = ref('')
import { onLoad, onShow } from '@dcloudio/uni-app'
import method from './method'
import useModel from './model'
import getLoginStatus from '@/common/libraries/userUserLogin'
import { getCurrentInstance, ref } from 'vue'

onShow(async () => {
  await getCurrentInstance()?.appContext.config.globalProperties.$onLaunched
  method?.init()
  if (getLoginStatus?.getLoginStatus()) {
    method?.getCountGridHouse()
  }
})
</script>
<style lang="scss">
@import './style.scss';
</style>
