<template>
  <div>
    <van-cell-group class="">
      <van-cell center is-link :to="$store.state.user.user.userName ? '/mobile/m-me/m-profile' : '/login'">
        <template #title>
          <div class="flex padding-tb-lg align-center">
            <van-image width="60" height="60" :src="getters.avatar" class="radius" style="overflow:hidden" />
            <div class="padding-left text-cut flex flex-direction justify-between padding-tb-xs"
              style="line-height: 1rem;">
              <div class="text-bold text-xl">{{ $store.state.user.user.nickName || `匿名游客` }}</div>
              <div class="margin-top-xs">{{ $store.state.user.user.userName || `点击登录` }}</div>
            </div>
          </div>
        </template>
      </van-cell>
    </van-cell-group>


    <van-cell-group class="margin-top">
      <van-cell icon="user-o" title="个人资料" is-link to="/mobile/m-me/m-profile" />
      <van-cell icon="shield-o" title="密码修改" is-link to="/mobile/m-me/m-password" />
      <van-cell icon="setting-o" title="设置" is-link to="/mobile/m-settings" />
      <van-cell icon="revoke" title="退出" is-link @click="logout" v-if="$store.state.user.user.userName" />
    </van-cell-group>

  </div>
</template>

<script setup>
const router = useRouter();
const store = useStore();
const getters = computed(() => store.getters);
const { proxy } = getCurrentInstance();


function logout() {
  proxy.$modal.confirm('确定注销并退出系统吗？').then(() => {
    store.dispatch('LogOut').then(() => {
      proxy.$modal.msg("已登出")
    })
  }).catch(() => { });
}

onActivated(() => {
 // console.log('onActivated')
})

onDeactivated(() => {
 // console.log('onDeactivated')
})
</script>


