boursecu/boursecu_user
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix bugs of UI

Browse Source
This commit is contained in:
safavimohadeseh78
2026-05-23 16:34:15 +03:30
parent 246b1fc664
commit 33f9151446
11 changed files with 194 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+12 -2
View File
@@ -78,7 +78,7 @@
</div>
<div
v-if="!showSplash"
class="app-credit-footer flex bg-white justify-center text-[9px] fixed left-0 right-0"
class="app-credit-footer flex bg-white justify-center text-[9px]"
>
<a
href="https://montzar.ir"
@@ -168,11 +168,21 @@ function update() {
--app-credit-bar-inner: 28px;
--app-safe-bottom: env(safe-area-inset-bottom, 0px);
--app-credit-footer-offset: calc(var(--app-credit-bar-inner) + var(--app-safe-bottom));
--app-nav-height: 80px;
--app-bottom-chrome-height: calc(var(--app-nav-height) + var(--app-credit-footer-offset));
--app-add-card-height: 88px;
}
.app-credit-footer {
position: fixed;
bottom: 0;
z-index: 1000;
left: 0;
right: 0;
width: 100%;
max-width: 426px;
margin-left: auto;
margin-right: auto;
z-index: 1000000;
min-height: var(--app-credit-bar-inner);
padding-bottom: var(--app-safe-bottom);
box-sizing: content-box;
src/views/base/about/index.vue
+6 -6
View File
@@ -40,7 +40,7 @@
</div>
</div>
</div>
<div v-if="config.config.name === 'garoosi'" class="wrap-fix bottom-0 px-10 py-6 flex gap-2 bg-white">
<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:09306612518">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
</a>
@@ -48,13 +48,13 @@
<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-6 flex gap-2 bg-white">
<a class="w-full" href="tel:09306612518">
<div v-else class="wrap-fix bottom-0 px-10 pb-3rem flex gap-2 bg-white">
<a class="w-full" href="tel:">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
</a>
<!-- <a href="https://t.me/saminn_gold">-->
<img src="@/assets/img/telegram.png" alt="" class="h-10 w-10"/>
<!-- </a>-->
<a href="https://ble.ir/">
<img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
</a>
</div>
</div>
</div>
src/views/base/address/index.vue
+12 -10
View File
@@ -13,7 +13,7 @@
<div ref="el" :class="loading? 'h-screen': ''" class="px-3 pt-16 pb-2 overflow-y-scroll"
style="max-height: calc(100vh - 50px)">
<list-anim v-if="!loading" class="pb-12vh">
<list-anim v-if="!loading" class="pb-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height)+1rem)]">
<Item v-for="item in items" :key="item.id" :item="item" @edit="openEdit" @refresh="initItems" />
<!-- <TransactionSkeleton v-if="loadingMore" class="mt-1 mb-8" />-->
</list-anim>
@@ -67,12 +67,13 @@
>
<BasicTextArea placeholder="آدرس کامل را وارد نمایید" v-model:value="address.address" />
</a-form-item>
</div>
<div class="fixed bottom-18 w-full pb-5 !text-white bg-white flex justify-center items-center">
<BasicButton class=" w-full !text-white mx-5 mb-2rem" type="primary" @click="handleOk">ثبت آدرس
<!-- <div class=" w-full pb-5 !text-white flex justify-center items-center">-->
<BasicButton class=" !text-white px-3 pb-4rem" type="primary" @click="handleOk">ثبت آدرس
</BasicButton>
</div>
<!-- </div>-->
</div>
</a-form>
@@ -81,15 +82,16 @@
@click="openAdd()">
<BasicIcon icon="vuesax-linear:add" color="white" />
</div>-->
<Transition mode="out-in" name="fade">
<Teleport to="body">
<div
class="wrap-fix bottom-6 h-[16vh] bg-[#FBFBFC] shadow-lg rounded-3xl flex justify-center pt-3 z-200"
style="box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 26px 11px"
@click="openAdd()">
<BasicIcon icon="vuesax-linear:add" />
v-if="!addAddressVisible"
class="add-address app-dock-add-bar"
@click="openAdd()"
>
<div>افزودن آدرس جدید</div>
<BasicIcon icon="vuesax-linear:add" />
</div>
</Transition>
</Teleport>
</div>
</template>
src/views/base/physicalReceive/components/RequestList.vue
+5 -8
View File
@@ -1,17 +1,14 @@
<template>
<div>
<div class="flex flex-col gap-4 pt-13 pb-35 px-2">
<div class="flex flex-col gap-4 pt-13 px-2 pb-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height)+1rem)]">
<RequestItem v-for="item in requestItems" :item="item"></RequestItem>
</div>
<Transition mode="out-in" name="fade">
<div
class="wrap-fix bottom-0 h-[19vh] bg-[#FBFBFC] shadow-lg rounded-3xl flex justify-center pt-3 z-200"
style="box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 26px 11px"
@click="openAdd()">
<Teleport to="body">
<div class="add-request app-dock-add-bar" @click="openAdd()">
<div>افزودن درخواست جدید</div>
<BasicIcon icon="vuesax-linear:add" />
<div class="cursor-pointer">افزودن درخواست جدید</div>
</div>
</Transition>
</Teleport>
</div>
</template>
src/views/base/priceTrigger/index.vue
+8 -7
View File
@@ -10,7 +10,7 @@
<div ref="el" :class="loading? 'h-screen': ''" class="px-3 pt-16 pb-2 overflow-y-scroll"
style="max-height: calc(100vh - 50px)">
<list-anim v-if="!loading" class="pb-12vh">
<list-anim v-if="!loading" class="pb-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height)+1rem)]">
<Item v-for="item in items" :key="item.id" :item="item" @edit="openEdit" @refresh="initItems" />
<!-- <TransactionSkeleton v-if="loadingMore" class="mt-1 mb-8" />-->
</list-anim>
@@ -56,15 +56,16 @@
@click="openAdd()">
<BasicIcon icon="vuesax-linear:add" color="white" />
</div>-->
<Transition mode="out-in" name="fade">
<Teleport to="body">
<div
class="wrap-fix bottom-6 h-[16vh] bg-[#FBFBFC] shadow-lg rounded-3xl flex justify-center pt-3 z-200"
style="box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 26px 11px"
@click="openAdd()">
<BasicIcon icon="vuesax-linear:add" />
v-if="!addTriggerVisible"
class="add-trigger app-dock-add-bar"
@click="openAdd()"
>
<div>افزودن هشدار جدید</div>
<BasicIcon icon="vuesax-linear:add" />
</div>
</Transition>
</Teleport>
</div>
</template>
src/views/base/rules/index.vue
+10 -10
View File
@@ -154,15 +154,7 @@
</div>
</div>
<div class="wrap-fix bottom-0 px-10 py-6 flex gap-2 bg-white">
<!-- <BasicButton type="primary" @click="$router.push({name: 'permissions'})">
<div>مجوز ها</div>
</BasicButton>-->
<!-- <a href="https://t.me/saminn_gold">-->
<!-- <img src="@/assets/img/telegram.png" alt="" class="h-10 w-10"/>-->
<!-- </a>-->
<!-- garoosi-->
<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:09306612518">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
</a>
@@ -170,6 +162,14 @@
<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="tel:">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
</a>
<a href="https://ble.ir/">
<img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
</a>
</div>
</div>
</div>
<!-- <ActionSheet v-model:show="editPassVisible">salam</ActionSheet>-->
@@ -194,7 +194,7 @@ import { updateMe } from '@/api/me'
import { useUserStore } from '@/store/userStore'
import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
import {useConfigStore} from "../../../store/configStore";
const config=useConfigStore()
const userFormState = ref<User>({
fname: '',
lname: '',
src/views/base/rules/permissions/permissions.vue
+7 -7
View File
@@ -16,7 +16,7 @@
<div class=" font-bold text-sm text-primary text-center">جواز کسب و کار</div>
<!-- <img :src="permission1" alt="" class="w-full">-->
<div class="mt-5 text-xs"></div>
<div v-if="config.config.name === 'garoosi'" class="wrap-fix bottom-0 px-2 py-6 flex gap-2 bg-white">
<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:09306612518">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
</a>
@@ -24,13 +24,13 @@
<img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
</a>
</div>
<div v-else class="wrap-fix bottom-0 px-2 py-6 flex gap-2 bg-white">
<!-- <a href="https://t.me/saminn_gold">-->
<img src="@/assets/img/telegram.png" alt="" class="h-10 w-10"/>
<!-- </a>-->
<!-- <a class="w-full" href="tel:09306612518">-->
<div v-else class="wrap-fix bottom-0 px-10 pb-3rem flex gap-2 bg-white">
<a class="w-full" href="tel:">
<BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
<!-- </a>-->
</a>
<a href="https://ble.ir/">
<img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
</a>
</div>
</div>
</div>
src/views/base/transactions/components/Item.vue
+1 -1
View File
@@ -45,7 +45,7 @@
<a-divider class="!my-3" />
<BasicActionSheet v-model:show="infoVisible">
<div class="font-bold text-lg">{{ props.item.title }}</div>
<div class="pb-20 mt-5">
<div class="mb-8rem mt-5">
<div class="flex justify-between mb-3">
<div class="text-primary">مبلغ:</div>
<div :class="item.cash > 0? 'text-green-600' : 'text-red-600'" class="flex text-xs items-center number-ltr">
src/views/base/user/index.vue
+106 -108
View File
@@ -2,17 +2,17 @@
<div class="relative">
<div>
<!-- <img :src="gr_bottom" alt="" class="absolute bottom-20">-->
<img :src="img" alt="" class="mt-2 w-full absolute bottom-0"/>
<img :src="img" alt="" class="mt-2 w-full absolute bottom-0" />
</div>
<div class="bg-white w-full 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"/>
<BasicIcon icon="vuesax-linear:arrow-right-1" />
</div>
<div class="mr-2 mt-2">اطلاعات حساب کاربری</div>
</div>
<div class="pt-16 pb-8 z-30 relative">
<div
class="border-gray-200 border-1 rounded-xl p-5 trans flex flex-col items-center mx-5 z-1000 relative bg-white shadow-lg"
class="border-gray-200 border-1 rounded-xl p-5 trans flex flex-col items-center mx-5 z-1000 relative bg-white shadow-lg"
>
<div class="text-primary font-bold w-full text-center flex justify-between">
نام و نام خانوادگی:
@@ -23,8 +23,8 @@
<div class="mr-2">{{ userStore.userInfo?.mobile }}</div>
</div>
<div
v-if="userStore.userInfo?.referral_id"
class="text-primary font-bold w-full text-center flex justify-between gap-2 items-center"
v-if="userStore.userInfo?.referral_id"
class="text-primary font-bold w-full text-center flex justify-between gap-2 items-center"
>
کد معرف:
<div class="flex gap-2">
@@ -38,117 +38,117 @@
</div>
<div class="w-full flex gap-2 mt-1">
<BasicButton
icon="vuesax-linear:share"
size="small"
class="flex-1"
icon-size="18"
@click.stop="shareCode()"
icon="vuesax-linear:share"
size="small"
class="flex-1"
icon-size="18"
@click.stop="shareCode()"
>
{{ getConfigApp('name') == 'garoosi' ? 'دعوت از دوستان' : ' اشتراک گذاری' }}
</BasicButton>
<BasicButton
icon="vuesax-linear:copy"
size="small"
class="flex-1"
icon-size="18"
@click.stop="copyCode()"
icon="vuesax-linear:copy"
size="small"
class="flex-1"
icon-size="18"
@click.stop="copyCode()"
>
رونوشت
</BasicButton>
</div>
<BasicButton
class="mt-5 w-full"
icon=""
iconSize="18"
size="large"
type="primary"
@click="editPassVisible = true"
class="mt-5 w-full"
icon=""
iconSize="18"
size="large"
type="primary"
@click="editPassVisible = true"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:eye" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:eye" class="absolute right-8" />
<div>ویرایش اطلاعات کاربری</div>
</div>
</BasicButton>
<div class="h-45vh overflow-y-auto mt-4">
<BasicButton
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="editPasswordVisible = true"
:key="10"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="editPasswordVisible = true"
:key="10"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:lock" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:lock" class="absolute right-8" />
<div>تغییر رمز عبور</div>
</div>
</BasicButton>
<BasicButton
class="w-full mt-2"
size="large"
@click="$router.push({ name: 'address' })"
class="w-full mt-2"
size="large"
@click="$router.push({ name: 'address' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:map" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:map" class="absolute right-8" />
<div>آدرس ها</div>
</div>
</BasicButton>
<BasicButton
class="w-full mt-2"
size="large"
@click="$router.push({ name: 'notifyTrigger' })"
class="w-full mt-2"
size="large"
@click="$router.push({ name: 'notifyTrigger' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:bill" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:bill" class="absolute right-8" />
<div>هشدار قیمت</div>
</div>
</BasicButton>
<BasicButton
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'about' })"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'about' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:info-circle" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:info-circle" class="absolute right-8" />
<div>درباره ما</div>
</div>
</BasicButton>
<BasicButton
v-if="getConfigApp('name')=='garoosi'"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'giftCard' })"
v-if="getConfigApp('name')=='garoosi'"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'giftCard' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:gift" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:gift" class="absolute right-8" />
<div>ثبت کارت هدیه</div>
</div>
</BasicButton>
<BasicButton
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'physicalReceive' })"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'physicalReceive' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:direct-inbox" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:direct-inbox" class="absolute right-8" />
<div>دریافت طلای فیزیکی</div>
</div>
</BasicButton>
<BasicButton
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'rules' })"
class="mt-2 w-full"
icon=""
iconSize="18"
size="large"
@click="$router.push({ name: 'rules' })"
>
<div class="flex">
<BasicIcon icon="vuesax-linear:task" class="absolute right-8"/>
<BasicIcon icon="vuesax-linear:task" class="absolute right-8" />
<div>قوانین و مقررات</div>
</div>
</BasicButton>
@@ -184,38 +184,38 @@
<div class="flex justify-center justify-between">
<div class="font-bold text-lg">ویرایش اطلاعات</div>
<div class="flex flex-col justify-center items-center">
<BasicIcon :icon="isLegal.icon" size="30" :class="isLegal.color"/>
<BasicIcon :icon="isLegal.icon" size="30" :class="isLegal.color" />
<p class="text-[10px] mt-1" :class="isLegal.color">{{ isLegal.title }}</p>
</div>
</div>
<div class="h60vh overflow-y-auto pb20">
<a-form ref="formRef" :model="userFormState" class="!mt-5" name="basic" @finish="ok">
<a-form-item :rules="[isValidPersian()]" label="نام" name="fname">
<BasicInput v-model:value="userFormState.fname"/>
<BasicInput v-model:value="userFormState.fname" />
</a-form-item>
<a-form-item :rules="[isValidPersian()]" label="نام خانوادگی" name="lname">
<BasicInput v-model:value="userFormState.lname"/>
<BasicInput v-model:value="userFormState.lname" />
</a-form-item>
<a-form-item label="تاریخ تولد" name="birth_date">
<BaseDatePicker v-model:value="userFormState.birth_date" class="w-full" inputReadOnly/>
<BaseDatePicker v-model:value="userFormState.birth_date" class="w-full" inputReadOnly />
</a-form-item>
<a-form-item :rules="[requireNationalCode()]" label="شماره ملی" name="n_code">
<BasicInput v-model:value="userFormState.n_code" type="number"
:disabled="userFormState.is_legal == 1 || userFormState.is_legal == 2"/>
:disabled="userFormState.is_legal == 1 || userFormState.is_legal == 2" />
</a-form-item>
<a-form-item label="نام شهر" name="city">
<BasicInput v-model:value="userFormState.city"/>
<BasicInput v-model:value="userFormState.city" />
</a-form-item>
<a-form-item>
<div class="wrap-fix md:w-[395px] bottom-5 px-3">
<BasicButton
:disabled="loading"
class="w-full py-2 mb-20"
html-type="submit"
type="primary"
:disabled="loading"
class="w-full py-2 mb-20"
html-type="submit"
type="primary"
>
<div>
<a-spin v-if="loading" size="small"/>
<a-spin v-if="loading" size="small" />
<div v-else>ثبت</div>
</div>
</BasicButton>
@@ -226,41 +226,39 @@
</BasicActionSheet>
<BasicActionSheet v-model:show="editPasswordVisible">
<div class="font-bold text-lg">ویرایش رمزعبور</div>
<div class="h30vh overflow-y-auto pb20">
<div class="h35vh overflow-y-auto">
<a-form
ref="formPassRef"
:model="userPassForm"
class="!mt-5"
name="basic"
@finish="submitPassForm"
ref="formPassRef"
:model="userPassForm"
class="!mt-5"
name="basic"
@finish="submitPassForm"
>
<a-form-item label="کلمه عبور جدید" :rules="passwordRules()" name="password">
<BasicInput v-model:value="userPassForm.password" isPassword place-holder="کلمه عبور "/>
<BasicInput v-model:value="userPassForm.password" isPassword place-holder="کلمه عبور " />
<div
:class="[
:class="[
guideTypePassword.color,
userPassForm.password.length >= 6 ? 'block' : 'hidden'
]"
class="text-[12px] mt-1"
class="text-[12px] mt-1"
>
{{ guideTypePassword.text }}
</div>
</a-form-item>
<a-form-item>
<div class="wrap-fix md:w-[395px] bottom-5 px-3">
<BasicButton
:disabled="loading"
class="w-full py-2 mb-20"
html-type="submit"
type="primary"
>
<div>
<a-spin v-if="loading" size="small"/>
<div v-else>ثبت</div>
</div>
</BasicButton>
</div>
</a-form-item>
<div class=" md:w-[395px] pt-3rem px-3">
<BasicButton
:disabled="loading"
class="w-full py-2 mb-20"
html-type="submit"
type="primary"
>
<div>
<a-spin v-if="loading" size="small" />
<div v-else>ثبت</div>
</div>
</BasicButton>
</div>
</a-form>
</div>
</BasicActionSheet>
@@ -268,10 +266,10 @@
</template>
<script lang="ts" setup>
import {onMounted, reactive, ref, computed} from 'vue'
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 { loading } from '@/utils'
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
import BasicActionSheet from '@/components/BasicPacks/BasicActionSheet.vue'
import {
@@ -280,19 +278,19 @@ import {
requireNationalCode,
passwordRules,
guideTypePassword,
isValidPersian,
isValidPersian
} from '@/utils/inputRules'
import BasicInput from '@/components/BasicPacks/BasicInput.vue'
import type {User, Password} from '@/models/login'
import type { User, Password } 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, updatePass} from '@/api/me'
import {useUserStore} from '@/store/userStore'
import type { FormInstance } from 'ant-design-vue'
import { message } from 'ant-design-vue'
import { updateMe, updatePass } from '@/api/me'
import { useUserStore } from '@/store/userStore'
import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
import {useConfigStore} from "@/store/configStore";
import {getConfigApp} from "../../../utils/config";
import { useConfigStore } from '@/store/configStore'
import { getConfigApp } from '../../../utils/config'
const userFormState = ref<User>({
fname: '',
@@ -476,7 +474,7 @@ onMounted(() => {
.relative {
overflow-y: auto;
max-height: 100vh;
//scroll-behavior: smooth;
//scroll-behavior: smooth;
}
.fixed {
src/views/base/wallet/index.vue
+22 -28
View File
@@ -28,7 +28,7 @@
></div>
</div>
</div>
<div class="px-5 pt-26 pb-2">
<div class="px-5 pt-26" :class="isDeposit ? 'pb-2' : 'pb-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height)+1rem)]'">
<a-form :model="form" class="!mt-5" name="basic" @finish="ok()">
<div class="border-gray-200 border-1 rounded-xl p-5 trans h-40 relative">
<bg_main />
@@ -118,18 +118,8 @@
<!-- <Slider/>-->
<Transition mode="out-in" name="fade">
<template v-if="!isDeposit">
<!-- <MySlider v-if="cardItems.length > 0" :items="cardItems" class="mt-[5vh] pb-[25vh] mb-[16vh]"
style="touch-action: none"/>-->
<CardSlider
v-if="cardItems.length > 0"
:items="cardItems"
v-model:id="form.card_id"
class="card-slider-wrap mt-[2vh] px-3 fixed bottom-10 right-0 left-0"
style="touch-action: none"
@cardDeleted="getCards"
/>
<div
v-else-if="!loading && cardItems.length === 0"
v-if="!loading && cardItems.length === 0"
class="h-30 flex items-center justify-center"
>
هیچ کارتی یافت نشد
@@ -137,16 +127,29 @@
</template>
</Transition>
</div>
<Transition mode="out-in" name="fade">
<Teleport to="body">
<CardSlider
v-if="!isDeposit && cardItems.length > 0"
v-model:id="form.card_id"
:items="cardItems"
class="card-slider-wrap wallet-card-slider"
@cardDeleted="getCards"
/>
</Teleport>
<Teleport to="body">
<div
v-if="!isDeposit"
class="add-card fixed bottom-0 h-[18vh] bg-[#FBFBFC] w-full shadow-lg rounded-3xl flex justify-center pt-3 z-200"
style="box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 26px 11px"
v-if="!isDeposit && !showAddCard"
class="add-card app-dock-add-bar"
@click="showAddCard = true"
>
<div>افزودن کارت جدید</div>
<BasicIcon icon="vuesax-linear:add" />
<BasicActionSheet v-model:show="showAddCard" class="!max-h-[95vh]">
</div>
</Teleport>
<BasicActionSheet v-model:show="showAddCard" class="!max-h-[95vh]">
<div class="font-bold text-lg">افزودن کارت</div>
<div class="mt-4 text-red-600 font-bold">توجه : حتما شماره کارت صاحب حساب نرم افزار وارد شود.</div>
<div class="pb-20 mt-5">
@@ -200,12 +203,10 @@
<a-spin v-if="loading" size="small" />
<div v-else>ثبت</div>
</BasicButton>
<BasicButton class="w-full mt-2" @click="showAddCard = false">بازگشت</BasicButton>
<BasicButton class="w-full mt-2 mb-8" @click="showAddCard = false">بازگشت</BasicButton>
</a-form>
</div>
</BasicActionSheet>
</div>
</Transition>
</BasicActionSheet>
<DialogVant v-model:show="showConfirmCode" :closeOnClickOverlay="true" :timeOut="-1">
<template v-slot:title>
<div>
@@ -315,7 +316,6 @@
پیام به پشتیبانی
</a>
</BasicButton>
</div>
<div v-else class="text-center">
<div class=" font-bold text-red-600">مشتریان گرامی</div>
@@ -729,10 +729,4 @@ async function handleOnComplete(value: string) {
margin: 0 auto;
}
}
@media screen and (min-width: 426px) {
.add-card {
position: absolute;
}
}
</style>
uno.config.ts
+5 -1
View File
@@ -6,7 +6,11 @@ import {
export default defineConfig({
shortcuts: [
// ...
['wallet-dock-width', 'fixed inset-x-0 w-full max-w-[426px] mx-auto left-0 right-0'],
/* z-index زیر منو (5000)؛ fixed تا با اسکرول جابه‌جا نشود */
['app-dock-add-bar', 'wallet-dock-width !fixed bottom-[var(--app-bottom-chrome-height)] z-[4500] h-[var(--app-add-card-height)] flex items-center justify-center gap-1 rounded-t-3xl bg-[#FBFBFC] shadow-[0_1px_26px_11px_rgba(0,0,0,0.1)] cursor-pointer'],
['wallet-add-card-bar', 'app-dock-add-bar'],
['wallet-card-slider', 'wallet-dock-width !fixed bottom-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height))] z-[4500] px-3 touch-none'],
],
theme: {
colors: {