INSTANT_DEPOSIT_PAYMENT_URL

.cursor/skills/abshode-domain-lookup/learned-notes.md

@@ -3,6 +3,7 @@
 فرمت هر خط:
 - YYYY-MM-DD | موضوع | مسیر فایل(ها) | نکتهٔ ۱ خطی
 
+- 2026-10-25 | انتخاب روش واریز | `WalletDepositMethodModal.vue` بعد از دکمهٔ واحد واریز | آنی = `INSTANT_DEPOSIT_PAYMENT_URL`؛ حساب = مودال کارت/شبا
 - 2026-10-22 | addon اینپوت | `assets/css/main.less` | پس‌زمینه addon = secondary تم، نه primary (سبز tenant)
 - 2026-10-21 | نمودار خانه = لندینگ | `LandingLiveChartMain.vue` + `useLandingLiveChart` + `zaarboxPriceHistory`؛ جایگزین `PriceChart` در PriceChartSection/DesktopChart* | همان `dlanding-live__main` SVG؛ داده از zaarbox + `/api/price/last`
 - 2026-10-20 | ظاهر خرید اقساطی | `views/base/installment/InstallmentPanel.vue` | دسکتاپ کلاس‌های `dgift` مثل کارت هدیه؛ موبایل کارت `rounded-xl` و توضیح بالای فرم

src/utils/config.ts

@@ -35,6 +35,13 @@ export function isBazretalaProject() {
 
 const WALLET_DEPOSIT_QUICK_AMOUNTS_RIAL = [10_000_000, 50_000_000, 100_000_000] as const
 
+/** آدرس صفحهٔ پرداخت آنی واریز. خالی بماند تا لینک درگاه آماده شود. */
+export const INSTANT_DEPOSIT_PAYMENT_URL = ''
+
+export function getInstantDepositPaymentUrl(): string {
+  return INSTANT_DEPOSIT_PAYMENT_URL.trim()
+}
+
 export function getWalletDepositQuickAmountsRial(): readonly number[] {
   return WALLET_DEPOSIT_QUICK_AMOUNTS_RIAL
 }

src/views/base/wallet/components/WalletDepositMethodModal.vue

@@ -0,0 +1,117 @@
+<template>
+  <BasicModal
+    v-model:visible="localVisible"
+    custom-footer
+    :closable="false"
+    wrap-class-name="app-premium-modal--no-header"
+    width="min(92vw, 380px)"
+  >
+    <div class="deposit-guide">
+      <div class="deposit-guide__icon-wrap" aria-hidden="true">
+        <BasicIcon icon="vuesax-linear:empty-wallet-add" size="34" color="#16a34a" />
+      </div>
+
+      <h2 class="deposit-guide__title">روش واریز را انتخاب کنید</h2>
+
+      <div class="deposit-guide__accounts">
+        <button type="button" class="deposit-guide__account-value" @click="emit('instant')">
+          <span>پرداخت آنی</span>
+        </button>
+        <button type="button" class="deposit-guide__account-value" @click="emit('account')">
+          <span>شماره حساب و کارت</span>
+        </button>
+      </div>
+    </div>
+
+    <template #footer>
+      <BasicButton
+        type="primary"
+        class="app-premium-modal__btn-primary deposit-guide__confirm w-full"
+        @click="localVisible = false"
+      >
+        بستن
+      </BasicButton>
+    </template>
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import BasicModal from '@/components/BasicPacks/BasicModal.vue'
+
+const props = defineProps<{ visible: boolean }>()
+const emit = defineEmits<{
+  (e: 'update:visible', value: boolean): void
+  (e: 'instant'): void
+  (e: 'account'): void
+}>()
+
+const localVisible = computed({
+  get: () => props.visible,
+  set: (value: boolean) => emit('update:visible', value),
+})
+</script>
+
+<style scoped lang="less">
+.deposit-guide {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  padding: 0.25rem 0.5rem 0.5rem;
+}
+
+.deposit-guide__icon-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 4.5rem;
+  height: 4.5rem;
+  border-radius: 9999px;
+  background: #ecfdf3;
+  margin-bottom: 1rem;
+}
+
+.deposit-guide__title {
+  margin: 0;
+  font-size: 1.05rem;
+  font-weight: 700;
+  color: #111827;
+}
+
+.deposit-guide__accounts {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  width: 100%;
+  margin-top: 0.85rem;
+}
+
+.deposit-guide__account-value {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  min-height: 2.75rem;
+  padding: 0.65rem 0.85rem;
+  border: 1px solid #bbf7d0;
+  border-radius: 0.75rem;
+  background: #f0fdf4;
+  color: #111827;
+  font-size: 0.92rem;
+  font-weight: 700;
+  cursor: pointer;
+
+  &:hover {
+    background: #dcfce7;
+    border-color: #86efac;
+  }
+}
+
+.deposit-guide__confirm {
+  min-height: 2.75rem;
+  font-weight: 700;
+}
+</style>

src/views/base/wallet/composables/useWalletPage.ts

@@ -14,6 +14,7 @@ import { useUserStore } from '@/store/userStore'
 import { isCustomerIdentityVerified } from '@/utils/customerIdentity'
 import { useConfigStore } from '@/store/configStore'
 import {
+  getInstantDepositPaymentUrl,
   getWalletDepositQuickAmountsRial,
 } from '@/utils/config'
 import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
@@ -35,6 +36,7 @@ export interface WalletPageContext {
   config: ReturnType<typeof useConfigStore>
   showAddCard: Ref<boolean>
   chargeAccountModal: Ref<boolean>
+  depositMethodVisible: Ref<boolean>
   showConfirmCode: Ref<boolean>
   withdrawInfModal: Ref<boolean>
   infoVisible: Ref<boolean>
@@ -63,6 +65,9 @@ export interface WalletPageContext {
   formatter: (value: number) => string
   percentChange: (val: number) => void
   ok: () => Promise<void>
+  openInstantDepositPayment: () => void
+  chooseInstantDeposit: () => void
+  chooseAccountDeposit: () => void
   addCard: () => Promise<void>
   getCards: () => Promise<void>
   handleOnComplete: (value: string) => Promise<void>
@@ -84,6 +89,7 @@ export function useWalletPage() {
   } = useSupportMessenger()
   const showAddCard = ref(false)
   const chargeAccountModal = ref(false)
+  const depositMethodVisible = ref(false)
   const showConfirmCode = ref(false)
   const withdrawInfModal = ref(false)
   const identityRequiredVisible = ref(false)
@@ -198,6 +204,25 @@ export function useWalletPage() {
     else form.value.value = undefined
   }
 
+  function openInstantDepositPayment() {
+    const url = getInstantDepositPaymentUrl()
+    if (!url) {
+      message.info('لینک پرداخت آنی هنوز تنظیم نشده است')
+      return
+    }
+    window.location.assign(url)
+  }
+
+  function chooseInstantDeposit() {
+    depositMethodVisible.value = false
+    openInstantDepositPayment()
+  }
+
+  function chooseAccountDeposit() {
+    depositMethodVisible.value = false
+    chargeAccountModal.value = true
+  }
+
   async function ok() {
     if (!ensureIdentity()) return
     try {
@@ -208,7 +233,7 @@ export function useWalletPage() {
           showConfirmCode.value = true
         }
         if (isDeposit.value) {
-          chargeAccountModal.value = true
+          depositMethodVisible.value = true
         }
       } else {
         message.error('ابتدا مبلغ را وارد کنید')
@@ -279,6 +304,7 @@ export function useWalletPage() {
     config,
     showAddCard,
     chargeAccountModal,
+    depositMethodVisible,
     showConfirmCode,
     withdrawInfModal,
     infoVisible,
@@ -307,6 +333,9 @@ export function useWalletPage() {
     formatter,
     percentChange,
     ok,
+    openInstantDepositPayment,
+    chooseInstantDeposit,
+    chooseAccountDeposit,
     addCard,
     getCards,
     handleOnComplete,

src/views/base/wallet/index.vue

@@ -80,6 +80,12 @@
 
     <IdentityRequiredDialog v-model:show="identityRequiredVisible" action="واریز یا برداشت" />
 
+    <WalletDepositMethodModal
+      v-model:visible="depositMethodVisible"
+      @instant="chooseInstantDeposit"
+      @account="chooseAccountDeposit"
+    />
+
     <WalletDepositGuideModal
       v-model:visible="chargeAccountModal"
       :support-link="depositGuideSupportLink"
@@ -119,6 +125,7 @@ import MobileWalletView from './mobile/MobileWalletView.vue'
 import SkeletonLoading from './components/SkeletonLoading.vue'
 import WalletAddCardForm from './components/WalletAddCardForm.vue'
 import WalletDepositGuideModal from './components/WalletDepositGuideModal.vue'
+import WalletDepositMethodModal from './components/WalletDepositMethodModal.vue'
 import IdentityRequiredDialog from '@/components/IdentityRequiredDialog.vue'
 
 const isDesktop = useDesktopBreakpoint()
@@ -126,6 +133,9 @@ const isDesktop = useDesktopBreakpoint()
 const {
   showAddCard,
   chargeAccountModal,
+  depositMethodVisible,
+  chooseInstantDeposit,
+  chooseAccountDeposit,
   showConfirmCode,
   withdrawInfModal,
   infoVisible,