fix bugs of UI

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