safavimohadeseh78andCursor
a5e458ed25
Add layout shells, desktop views, module-level page caches, and UI fixes for auth, home, wallet, transactions, address, and related pages. Co-authored-by: Cursor <cursoragent@cursor.com>
102 lines
3.6 KiB
Vue
102 lines
3.6 KiB
Vue
<template>
|
|
<div>
|
|
<div class="bg-white w-full py-3 px-3 text-primary font-bold drop-shadow flex">
|
|
<div @click="router.back()">
|
|
<BasicIcon icon="vuesax-linear:arrow-right-1" />
|
|
</div>
|
|
<div class="mr-2">کسب درآمد</div>
|
|
</div>
|
|
</div>
|
|
<div class="p-4">
|
|
<div class="text-center p-3 border-solid border-1 rounded-[8px] border-primary">
|
|
<div class="flex items-center">
|
|
<div class="bg-[#DBEAFE] h-10 w-10 rounded-100% flex justify-center items-center">
|
|
<img :src="coin" alt="" />
|
|
</div>
|
|
<div class="mr-4">
|
|
<div class="flex">
|
|
<div class="font-bold">دعوت دوستان</div>
|
|
</div>
|
|
<div class="text-center mt-2 text-xs">هر دعوت موفق 10 سوت طلا هدیه</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-center mt-4">
|
|
<div class="text-[10px] content-center">کد بازاریابی</div>
|
|
<div class="mr-2 font-bold">{{ userStore.userInfo.referral_id }}</div>
|
|
</div>
|
|
<div class="flex mt-4 gap-2">
|
|
<BasicButton
|
|
icon="vuesax-linear:share"
|
|
size="small"
|
|
class="flex-1"
|
|
icon-size="18"
|
|
@click.stop="shareCode()"
|
|
>
|
|
اشتراک گذاری
|
|
</BasicButton>
|
|
<BasicButton
|
|
icon="vuesax-linear:copy"
|
|
size="small"
|
|
class="flex-1"
|
|
icon-size="18"
|
|
@click.stop="copyCode()"
|
|
>
|
|
رونوشت
|
|
</BasicButton>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 gap-4 mt-4">
|
|
<div class="text-center bg-[#DBEAFE] p-2 rounded-[8px]">
|
|
<div class="font-bold text-[#2563EB] text-md">
|
|
{{ data?.usersSum }} عدد
|
|
</div>
|
|
<div class="text-xs text-[#2563EB] mt-2">تعداد زیر مجموعه</div>
|
|
</div>
|
|
<div class="text-center bg-[#FEF9C3] p-2 rounded-[8px]">
|
|
<div class="font-bold text-[#CA8A04] text-md">
|
|
{{ data?.giftsSum }} سوت
|
|
</div>
|
|
<div class="text-xs text-[#CA8A04] mt-2">میزان کل پاداش ها</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="flex justify-evenly w-full px-2 h-11 items-center bg-gray-50 relative rounded-lg mt-6"
|
|
>
|
|
<div
|
|
:class="isTransaction ? 'text-primary bg-white h-8 w-1/2 rounded-lg' : 'text-gray-400'"
|
|
class="w-full text-center z-2 flex items-center justify-center"
|
|
@click.stop="setIsTransaction(true)"
|
|
>
|
|
پاداش ها
|
|
</div>
|
|
<div
|
|
:class="!isTransaction ? 'text-primary bg-white h-8 w-1/2 rounded-lg' : 'text-gray-400'"
|
|
class="w-full text-center z-2 flex items-center justify-center"
|
|
@click.stop="setIsTransaction(false)"
|
|
>
|
|
فهرست زیر مجموعه
|
|
</div>
|
|
</div>
|
|
<div class="border-solid border-1 border-[#E5E7EB] mt-6"></div>
|
|
<div v-if="isTransaction">
|
|
<GiftCard v-for="(val, i) in data?.gifts" :key="i" :item="val" />
|
|
</div>
|
|
<div v-else>
|
|
<EarnCard v-for="(val, i) in data?.users" :key="i" :item="val" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import coin from '@/assets/img/coin.png'
|
|
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
|
|
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
|
|
import router from '@/router'
|
|
import EarnCard from '../components/EarnCard.vue'
|
|
import GiftCard from '../components/GiftCard.vue'
|
|
import { useEarnMoneyPageContext } from '../composables/useEarnMoneyPage'
|
|
|
|
const { data, userStore, isTransaction, setIsTransaction, copyCode, shareCode } =
|
|
useEarnMoneyPageContext()
|
|
</script>
|