129 lines
4.3 KiB
Vue
129 lines
4.3 KiB
Vue
<template>
|
|
<Transition>
|
|
<div
|
|
v-if="show"
|
|
class="top-0 bottom-0 bg-black wrap-fix z-5000 opacity-60"
|
|
@click="$emit('close')"
|
|
/>
|
|
</Transition>
|
|
<Transition name="slide-fade">
|
|
<div v-if="show" class="wrap-fix bottom-11vh z-5000 flex justify-center items-end">
|
|
<div class="relative flex flex-col items-center">
|
|
<div
|
|
class="flex items-center justify-center bg-white rounded-full w-[30px] h-[30px] mb-2"
|
|
@click="$emit('close')"
|
|
>
|
|
<BasicIcon icon="vuesax-linear:close-circle" />
|
|
</div>
|
|
<div class="flex flex-col items-center gap-2">
|
|
<BasicButton
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('user')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:user" size="16" class="absolute right-2" />
|
|
<div>حساب کاربری</div>
|
|
</div>
|
|
</BasicButton>
|
|
<BasicButton
|
|
v-if="authenticated"
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('physicalReceive')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:direct-inbox" size="16" class="absolute right-2" />
|
|
<div>دریافت طلای فیزیکی</div>
|
|
</div>
|
|
</BasicButton>
|
|
<BasicButton
|
|
v-if="authenticated"
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('notifyTrigger')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:bill" size="16" class="absolute right-2" />
|
|
<div>هشدار قیمت</div>
|
|
</div>
|
|
</BasicButton>
|
|
<BasicButton
|
|
v-if="authenticated"
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('buyProduct')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:coin" size="16" class="absolute right-2" />
|
|
<div>خرید محصول</div>
|
|
</div>
|
|
</BasicButton>
|
|
<!-- <BasicButton-->
|
|
<!-- v-if="authenticated"-->
|
|
<!-- icon-size="16"-->
|
|
<!-- class="!font-bold w-15rem"-->
|
|
<!-- @click="go('list')"-->
|
|
<!-- >-->
|
|
<!-- <div class="flex gap-2 items-center">-->
|
|
<!-- <BasicIcon icon="vuesax-linear:receipt-item" size="16" class="absolute right-2" />-->
|
|
<!-- <div>لیست دریافتی ها</div>-->
|
|
<!-- </div>-->
|
|
<!-- </BasicButton>-->
|
|
<BasicButton
|
|
v-if="authenticated"
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('giftCard')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:gift" size="16" class="absolute right-2" />
|
|
<div>ثبت کارت هدیه</div>
|
|
</div>
|
|
</BasicButton>
|
|
<BasicButton icon-size="16" class="!font-bold w-15rem" @click="go('about')">
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:info-circle" size="16" class="absolute right-2" />
|
|
<div>درباره ما</div>
|
|
</div>
|
|
</BasicButton>
|
|
<BasicButton
|
|
v-if="authenticated"
|
|
icon-size="16"
|
|
class="!font-bold w-15rem"
|
|
@click="go('rules')"
|
|
>
|
|
<div class="flex gap-2 items-center">
|
|
<BasicIcon icon="vuesax-linear:task" size="16" class="absolute right-2" />
|
|
<div>قوانین و مقررات</div>
|
|
</div>
|
|
</BasicButton>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Transition>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed } from 'vue'
|
|
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
|
|
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
|
|
import { isToken } from '@/utils'
|
|
|
|
defineProps<{
|
|
show: boolean
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
close: []
|
|
navigate: [routeName: string]
|
|
}>()
|
|
|
|
const authenticated = computed(() => isToken())
|
|
|
|
function go(routeName: string) {
|
|
emit('navigate', routeName)
|
|
emit('close')
|
|
}
|
|
</script>
|