<script setup lang="ts">
import { useConnectionStore } from '../stores/connection';

const connectionStore = useConnectionStore();
</script>

<template>
  <div class="profile-view safe-area-top safe-area-bottom">
    <van-nav-bar title="我的" left-arrow @click-left="$router.back()" />
    <div class="content">
      <van-cell-group inset>
        <van-cell title="用户名" :value="connectionStore.userName || '未登录'" />
        <van-cell title="已投票数" :value="`${connectionStore.votedCategories.length}/7`" />
        <van-cell title="连接状态" :value="connectionStore.connectionStatus" />
      </van-cell-group>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.profile-view {
  min-height: 100vh;
  background: #f5f5f5;
}

.content {
  padding: 16px;
}
</style>
