Files
tgCrewAdmin/src/components/pnAccountBlockName.vue
2026-01-28 22:37:27 +03:00

31 lines
995 B
Vue

<template>
<div class="flex items-center no-wrap overflow-hidden w100">
<q-icon v-if="customer?.email" size="md" class="q-mr-sm" name="mdi-account-circle-outline"/>
<q-avatar v-else size="32px" class="q-mr-sm">
<q-img v-if="tgUser?.photo_url" :src="tgUser.photo_url"/>
<q-icon v-else size="md" class="q-mr-sm" name="mdi-account-circle-outline"/>
</q-avatar>
<span v-if="customer?.email" class="ellipsis">
{{ customer.email }}
</span>
<span v-else class="ellipsis">
{{ nameTgUser(tgUser) }}
</span>
</div>
</template>
<script setup lang="ts">
import { inject } from 'vue'
import { useAuthStore } from 'stores/auth'
import { nameTgUser } from 'utils/helpers'
import type { WebApp, WebAppUser } from '@twa-dev/types'
const authStore = useAuthStore()
const customer = authStore.customer
const tg = inject('tg') as WebApp
const tgUser = tg.initDataUnsafe.user as WebAppUser | undefined
</script>
<style lang="scss">
</style>