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
+12
-181
@@ -1,193 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="wrap-fix z-1 bg-white py-3 px-3 text-primary 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-20">
|
||||
<div>
|
||||
<img :src="img" 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="logoFull" class="mb-20 h-15vh mt-5" />
|
||||
</div>-->
|
||||
<div class="overflow-y-auto h-60vh pb-20 border-primary">
|
||||
<div class="rules-panel mt-5 border-solid border-2 border-primary text-primary rounded-[12px] p-4">
|
||||
<div class="font-bold text-sm text-primary">
|
||||
{{ rulesTitle }}
|
||||
</div>
|
||||
<div class="w-full h-1px my-3 bg-secondary"></div>
|
||||
<div
|
||||
v-for="(block, blockIndex) in rulesBlocks"
|
||||
:key="`block-${blockIndex}`"
|
||||
class="rules-block"
|
||||
>
|
||||
<div
|
||||
v-if="block.title"
|
||||
class="font-bold text-sm text-primary mt-4 mb-2"
|
||||
>
|
||||
{{ block.title }}
|
||||
</div>
|
||||
<p
|
||||
v-for="(rule, index) in block.items"
|
||||
:key="`rule-${blockIndex}-${index}`"
|
||||
class="rules-paragraph"
|
||||
>
|
||||
{{ rule }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="config.config.name === 'garoosi'" class="wrap-fix bottom-0 px-10 pb-3rem 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 pb-3rem flex gap-2 bg-white">
|
||||
<a class="w-full" :href="getProjectSupportPhoneLink()">
|
||||
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
|
||||
</a>
|
||||
<a :href="getProjectBaleLink()" target="_blank" rel="noopener noreferrer">
|
||||
<img src="@/assets/img/bale.png" alt="بله" class="h-10 w-10"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <ActionSheet v-model:show="editPassVisible">salam</ActionSheet>-->
|
||||
<div class="rules-page-root">
|
||||
<DesktopRulesView v-show="isDesktop" />
|
||||
<MobileRulesView v-show="!isDesktop" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, reactive, ref, computed } from 'vue'
|
||||
import img from '@/assets/img/user_ly1.svg'
|
||||
// import gr_bottom from './assets/img/gr_bottom_white.svg'
|
||||
import { loading } from '@/utils'
|
||||
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
|
||||
import BasicActionSheet from '@/components/BasicPacks/BasicActionSheet.vue'
|
||||
import { lengthValidation, required } from '@/utils/inputRules'
|
||||
import BasicInput from '@/components/BasicPacks/BasicInput.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 BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
|
||||
import {useConfigStore} from "../../../store/configStore";
|
||||
import {getProjectBaleLink, getProjectSupportPhoneLink, getReferralShareText, getReferralShareTitle, isBoursecuProject} from "@/utils/config";
|
||||
import {
|
||||
getRulesBlocks,
|
||||
getRulesTitle,
|
||||
} from './rulesContent'
|
||||
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()
|
||||
const nameProject = computed(() => config.config?.name_fa || config.config?.name || 'بورس مس')
|
||||
const isBoursecu = computed(() => isBoursecuProject())
|
||||
const rulesTitle = computed(() => getRulesTitle(nameProject.value, isBoursecu.value))
|
||||
const rulesBlocks = computed(() => getRulesBlocks(nameProject.value, isBoursecu.value))
|
||||
// const editPassVisible = ref<boolean>(false)
|
||||
const editPassVisible = ref<boolean>(false)
|
||||
import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
|
||||
import { useRulesPage } from './composables/useRulesPage'
|
||||
import DesktopRulesView from './desktop/DesktopRulesView.vue'
|
||||
import MobileRulesView from './mobile/MobileRulesView.vue'
|
||||
|
||||
function setForm() {
|
||||
userFormState.value = userStore.userInfo
|
||||
}
|
||||
const isDesktop = useDesktopBreakpoint()
|
||||
|
||||
function copyCode() {
|
||||
// nextTick(() => {
|
||||
const val = userStore.userInfo?.referral_id
|
||||
navigator.clipboard.writeText(val)
|
||||
message.info('کد رونوشت شد')
|
||||
// })
|
||||
}
|
||||
|
||||
function shareCode() {
|
||||
const val = getReferralShareText({
|
||||
userName: userStore.userInfo?.name,
|
||||
projectName: nameProject.value,
|
||||
referralId: userStore.userInfo?.referral_id,
|
||||
})
|
||||
navigator.share({
|
||||
title: getReferralShareTitle(nameProject.value),
|
||||
text: val
|
||||
})
|
||||
}
|
||||
|
||||
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
|
||||
}
|
||||
})
|
||||
}
|
||||
useRulesPage()
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.rules-panel {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.rules-block + .rules-block {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.rules-paragraph {
|
||||
margin: 0 0 1rem;
|
||||
text-align: justify;
|
||||
line-height: 1.9;
|
||||
word-break: normal;
|
||||
overflow-wrap: break-word;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.rules-paragraph:last-child {
|
||||
margin-bottom: 0;
|
||||
.rules-page-root {
|
||||
min-height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user