<template>
  <view class="user-avatar">
    <block v-if="isLogin">
      <!-- 使用微信开放能力展示用户头像 -->
      <open-data type="userAvatarUrl" class="avatar"></open-data>
    </block>
    <block v-else>
      <!-- 未登录时显示默认头像 -->
      <image src="/static/images/default-avatar.png" class="avatar"></image>
    </block>
  </view>
</template>

<script>
import { checkNeedLogin } from '../../utils/login.js'

export default {
  name: 'UserAvatar',
  data() {
    return {
      isLogin: false
    }
  },
  created() {
    // 检查登录状态
    this.isLogin = !checkNeedLogin()
  }
}
</script>

<style>
.user-avatar {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  overflow: hidden;
}
.avatar {
  width: 100%;
  height: 100%;
}
</style>
