Split desktop and mobile layouts with shared page data so APIs fetch once per context.
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>
This commit is contained in:
Cursor
@@ -1,208 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="wrap-fix z-1 bg-white py-3 px-3 text-black font-bold drop-shadow flex">
|
||||
<div @click="router.back()" class="cursor-pointer">
|
||||
<BasicIcon icon="vuesax-linear:arrow-right-1" />
|
||||
</div>
|
||||
<div class="mr-2">آموزش نرم افزار</div>
|
||||
</div>
|
||||
<div class="pt-10">
|
||||
<div>
|
||||
<!-- <img :src="img" alt="" class="mt-2 w-full absolute bottom-0" />-->
|
||||
<!-- <img :src="config.config.avatar" alt="" class="mt-2 w-full absolute bottom-0">-->
|
||||
</div>
|
||||
<div class="text-justify text-base z-200000 relative">
|
||||
<div class="px-10">
|
||||
<div class="h-20vh flex justify-center">
|
||||
<img :src="config.config.avatar" alt="" class="mb-20 h-15vh mt-5">
|
||||
</div>
|
||||
<div class="overflow-y-auto h-60vh pb-10 border-[#093D51]">
|
||||
<div
|
||||
class="mt-5 text-5 border-solid border-2 border-[#093D51] text-[#093D51] rounded-[12px] p-4"
|
||||
>
|
||||
<div class="font-bold text-sm text-[#093D51]">
|
||||
شیوهٔ ورود و ثبت نام در گروسی گالری
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• برای ثبت‌نام در گروسی گالری، اگر قبلاً حساب کاربری دارید می‌توانید از طریق پیامک وارد شوید.<br />
|
||||
• اگر حساب کاربری ندارید، "از این قسمت" وارد صفحه ثبت نام شده و با وارد کردن نام و شماره تلفنی که با کد ملی شما مطابقت دارد، حساب کاربری بسازید.<br />
|
||||
• الزامی به وارد کردن کد معرف نیست.
|
||||
</div>
|
||||
<img :src="img1" />
|
||||
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div class="font-bold mt-4 text-sm text-[#093D51]">
|
||||
شارژ کیف پول
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• ابتدا کیف پول را در منو انتخاب کرده، مبلغ مورد نظر را وارد نموده و دکمه واریز را انتخاب کنید تا کیف پول شما شارژ شود.<br />
|
||||
</div>
|
||||
<img :src="img2" />
|
||||
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div class="font-bold mt-4 text-sm text-[#093D51]">
|
||||
شیوهٔ خرید از گروسی گالری
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• سپس از بخش «خرید و فروش» انتخاب کنید که طلای آب‌شده می‌خواهید یا محصولات دیگر (شامل گوی، شمش یا مکعب).<br />
|
||||
• توجه داشته باشید کارمزد طلای آب‌شده حدود ۲٪ است و کارمزد ریالی محصولات دیگر در پایین صفحه قیمت درج شده است.
|
||||
</div>
|
||||
<img :src="img4" />
|
||||
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div class="font-bold mt-4 text-sm text-[#093D51]">
|
||||
شیوهٔ فروش در گروسی گالری
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• برای فروش محصولاتی که خریداری کرده‌اید، به بخش «خرید و فروش» مراجعه کرده، محصول موردنظر را انتخاب و گزینه فروش را بزنید تا مبلغ قابل دریافت نمایش داده شود.<br />
|
||||
• مبلغ به کیف پول شما واریز می‌شود و از طریق پیام پشتیبانی می‌توانید درخواست برداشت دهید.<br />
|
||||
• اگر موجودی کیف پول بیش از ۱۰ میلیون تومان باشد، مبلغ تا پایان روز کاری بعد به حساب اعلام‌شده شما واریز خواهد شد.
|
||||
</div>
|
||||
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div class="font-bold mt-4 text-sm text-[#093D51]">
|
||||
شیوهٔ دریافت فیزیکی طلا (ارسال)
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• ابتدا موجودی محصول موردنظر را با پشتیبانی در واتساپ هماهنگ کنید.<br />
|
||||
• سپس روی لوگو کلیک کرده، گزینه «برداشت فیزیکی» و بعد «درخواست جدید» را انتخاب کنید.<br />
|
||||
• محصولات خریداری‌شده و تعداد آن‌ها را مشخص کرده و آدرس خود را ثبت نمایید.<br />
|
||||
• پشتیبانی عکس و وزن محصول را برای شما ارسال می‌کند.<br />
|
||||
• ارسال به‌صورت پس‌کرایه و بیمه‌شده انجام می‌شود.<br />
|
||||
</div>
|
||||
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div class="font-bold mt-4 text-sm text-[#093D51]">
|
||||
پاداش معرفی
|
||||
</div>
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• در صفحه اصلی روی "تنظیمات" کلیک کرده و وارد حساب کاربری خود شوید.
|
||||
</div>
|
||||
<!-- <img :src="img2" />-->
|
||||
<div class="mt-5 text-xs leading-5">
|
||||
• سپس گزینه «اشتراک‌گذاری» یا «کپی لینک» را انتخاب کرده و لینک دعوت را برای دوستانتان ارسال کنید.<br />
|
||||
• در صورتی که دوستان شما از طریق لینک شما ثبت‌نام کنند، به‌صورت خودکار ۱ سوت طلا به‌عنوان پاداش دریافت خواهید کرد.
|
||||
</div>
|
||||
<!-- <img :src="img3" />-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="config.config.name === 'garoosi'" class="wrap-fix bottom-0 px-10 py-6 flex gap-2 bg-white">
|
||||
<a class="w-full" href="tel:09031265925">
|
||||
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
|
||||
</a>
|
||||
<a href="https://ble.ir/garoosigallery">
|
||||
<img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div v-else class="wrap-fix bottom-0 px-10 py-5 flex gap-2 bg-white">
|
||||
<a class="w-full" href="tel:09306612518">
|
||||
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
|
||||
</a>
|
||||
<a href="">
|
||||
<BasicButton icon="vuesax-linear:whatsapp" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <ActionSheet v-model:show="editPassVisible">salam</ActionSheet>-->
|
||||
<div class="educate-page-root">
|
||||
<DesktopEducateView v-show="isDesktop" />
|
||||
<MobileEducateView v-show="!isDesktop" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, reactive, ref } from 'vue'
|
||||
import img from '@/assets/img/user_ly1.svg'
|
||||
import img1 from '@/assets/img/1.png'
|
||||
import img2 from '@/assets/img/2.png'
|
||||
import img4 from '@/assets/img/4.png'
|
||||
import { loading } from '@/utils'
|
||||
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
|
||||
import type { User } from '@/models/login'
|
||||
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
|
||||
import router from '@/router'
|
||||
import type { FormInstance } from 'ant-design-vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { updateMe } from '@/api/me'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import {useConfigStore} from "@/store/configStore";
|
||||
const config=useConfigStore()
|
||||
const userFormState = ref<User>({
|
||||
fname: '',
|
||||
lname: '',
|
||||
mobile: undefined,
|
||||
birth_date: '',
|
||||
phone_number: '',
|
||||
province: '',
|
||||
city: '',
|
||||
n_code: undefined
|
||||
})
|
||||
const formRef = ref<FormInstance>()
|
||||
const userStore = useUserStore()
|
||||
import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
|
||||
import { useEducatePage } from './composables/useEducatePage'
|
||||
import DesktopEducateView from './desktop/DesktopEducateView.vue'
|
||||
import MobileEducateView from './mobile/MobileEducateView.vue'
|
||||
|
||||
// const editPassVisible = ref<boolean>(false)
|
||||
const editPassVisible = ref<boolean>(false)
|
||||
const isDesktop = useDesktopBreakpoint()
|
||||
|
||||
function setForm() {
|
||||
userFormState.value = userStore.userInfo
|
||||
}
|
||||
|
||||
function copyCode() {
|
||||
// nextTick(() => {
|
||||
const val = userStore.userInfo?.referral_id
|
||||
navigator.clipboard.writeText(val)
|
||||
message.info('کد رونوشت شد')
|
||||
// })
|
||||
}
|
||||
|
||||
const resetData = () => {
|
||||
formRef.value?.resetFields()
|
||||
userFormState.value = {
|
||||
fname: '',
|
||||
lname: '',
|
||||
mobile: undefined,
|
||||
birth_date: '',
|
||||
phone_number: '',
|
||||
province: '',
|
||||
city: '',
|
||||
n_code: undefined
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
setForm()
|
||||
})
|
||||
|
||||
function ok() {
|
||||
formRef.value?.validateFields().then(async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
await updateMe(userFormState.value)
|
||||
await userStore.getMyInfo()
|
||||
editPassVisible.value = false
|
||||
message.success('اطلاعات شما با موفقیت به روز رسانی شد')
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
useEducatePage()
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/*.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.2s ease;
|
||||
.educate-page-root {
|
||||
min-height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}*/
|
||||
/*.trans{
|
||||
transition: height 1s;
|
||||
}*/
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user