added charge for all product

src/api/wallet.ts

@@ -1,15 +1,22 @@
 import type { TableInput } from '@core/type/baseTable'
 import useAxios from '@core/utils/useAxios'
-import type { Charge, SendWeight, Wallet, Withdraw } from '@/model/wallet'
+import type { Charge, ChargeTargetsResponse, SendWeight, Wallet, Withdraw } from '@/model/wallet'
 
 export const getWalletTable = async (params?: TableInput) =>
   await useAxios.post<Array<Wallet>>('/admin/wallet/table', params)
 
+export const getChargeTargets = async () =>
+  await useAxios.get<ChargeTargetsResponse>('/admin/wallet/charge-targets')
+
+/** @deprecated از chargeWalletUnified استفاده کنید */
 export const chargeWallet = async (params: Charge, type: 'gold' | 'money') =>
   type === 'money'
     ? await useAxios.post<boolean>('/admin/wallet/charge', params)
     : await useAxios.post<boolean>('/admin/wallet/charge_gold', params)
 
+export const chargeWalletUnified = async (params: Charge) =>
+  await useAxios.post<boolean>('/admin/wallet/charge_wallet', params)
+
 export const getWithdrawTable = async (params: TableInput & { flow_type?: string }) =>
   await useAxios.post<Array<Withdraw>>('/admin/wallet/withdraw/table', params)
 

src/model/wallet.ts

@@ -102,6 +102,25 @@ export interface Charge {
   talabBedehi?: boolean
   direction?: WalletChargeDirection
   amountAbs?: number | string
+  product_id?: number
+}
+
+/** گزینهٔ شارژ — نقدی یا محصول فعال */
+export interface ChargeTarget {
+  key: string
+  kind: 'money' | 'metal'
+  label: string
+  unit: string
+  product_id?: number
+  metal_id?: number
+  uses_main_wallet?: boolean
+  trade_by_quantity?: boolean
+  group_type?: string
+}
+
+export interface ChargeTargetsResponse {
+  targets: ChargeTarget[]
+  catalogMetals?: Array<{ metal_id: number; label: string; display_unit?: string }>
 }
 
 export interface WithdrawStatus {

src/pages/dashboard/components/DashboardQuickWalletModal.vue

@@ -1,282 +1,20 @@
 <template>
-  <BasicActionSheet
+  <WalletChargeModal
     v-model:visible="visibleProxy"
-    :title="modalTitle"
-    modal-width="22rem"
-    drawer-height="auto"
-    compact
-    :loading="loading"
-    :show-button="false"
-    @close="handleClose"
-  >
-    <div class="dashboard-wallet-modal">
-      <div class="dashboard-wallet-modal__section">
-        <label class="dashboard-wallet-modal__label">مشتری</label>
-        <a-select
-          v-model:value="customerId"
-          show-search
-          allow-clear
-          placeholder="انتخاب کنید"
-          class="dashboard-wallet-modal__select w-full"
-          size="large"
-          :options="customerOptions"
-          :filter-option="filterCustomer"
-        />
-      </div>
-
-      <div
-        v-if="selectedCustomer"
-        class="dashboard-wallet-modal__balances"
-      >
-        <div>
-          <span class="text-slate-500">{{ metalLabel.goldWalletShort() }}</span>
-          <p class="font-semibold text-slate-800 dark:text-slate-100">{{ formatGold(selectedCustomer) }}</p>
-        </div>
-        <div>
-          <span class="text-slate-500">ریالی</span>
-          <p class="font-semibold text-slate-800 dark:text-slate-100">{{ formatCash(selectedCustomer) }}</p>
-        </div>
-      </div>
-
-      <div class="dashboard-wallet-modal__section">
-        <label class="dashboard-wallet-modal__label">نوع کیف پول</label>
-        <a-radio-group v-model:value="walletVariant" button-style="solid" class="flex w-full">
-          <a-radio-button value="money" class="w-1/2 text-center">ریالی</a-radio-button>
-          <a-radio-button value="gold" class="w-1/2 text-center">{{ metalLabel.goldWalletShort() }}</a-radio-button>
-        </a-radio-group>
-      </div>
-
-      <WalletChargeForm
-        ref="chargeFormRef"
-        class="dashboard-wallet-modal__form"
-        :model-value="formCharge"
-        :variant="walletVariant"
-      />
-
-      <div class="dashboard-wallet-modal__footer">
-        <a-button danger size="large" block @click="closeModal">
-          بستن
-        </a-button>
-        <a-button
-          type="primary"
-          :danger="formCharge.direction === 'discharge'"
-          size="large"
-          block
-          :loading="submitting"
-          @click="submit"
-        >
-          {{ okText }}
-        </a-button>
-      </div>
-    </div>
-  </BasicActionSheet>
+    show-customer-select
+    @success="emit('success')"
+  />
 </template>
 
 <script setup lang="ts">
-import { computed, ref, watch } from 'vue'
-import { message } from 'ant-design-vue'
-import BasicActionSheet from '@/components/BasicActionSheet.vue'
-import WalletChargeForm from '@/pages/menuPages/customers/base/components/WalletChargeForm.vue'
-import {
-  buildChargePayload,
-  createEmptyChargeForm,
-  walletChargeOkText,
-  walletChargeSuccessMessage,
-  walletChargeTitle,
-} from '@/pages/menuPages/customers/base/utils/walletChargeForm'
-import { getCustomersList } from '@/api/customer'
-import { chargeWallet } from '@/api/wallet'
-import type { Customer } from '@/model/customer'
-import type { Charge, Wallet } from '@/model/wallet'
-import { usePrice } from '@core/utils/usePrice'
-import { metalLabel } from '@/utils/adminMetalLabels'
+import { computed } from 'vue'
+import WalletChargeModal from '@/pages/menuPages/customers/base/components/WalletChargeModal.vue'
 
 const props = defineProps<{ visible: boolean }>()
-const emit = defineEmits<{ (e: 'update:visible', value: boolean): void }>()
+const emit = defineEmits<{ (e: 'update:visible', value: boolean): void; (e: 'success'): void }>()
 
 const visibleProxy = computed({
   get: () => props.visible,
   set: (value: boolean) => emit('update:visible', value),
 })
-
-const loading = ref(false)
-const submitting = ref(false)
-const customers = ref<Customer[]>([])
-const walletVariant = ref<'money' | 'gold'>('money')
-const formCharge = ref<Charge>(createEmptyChargeForm())
-const chargeFormRef = ref<InstanceType<typeof WalletChargeForm>>()
-
-const customerId = computed({
-  get: () => formCharge.value.customer_id ?? undefined,
-  set: (value: number | undefined) => {
-    formCharge.value.customer_id = value
-  },
-})
-
-const customerOptions = computed(() =>
-  customers.value.map((customer) => ({
-    value: customer.id,
-    label: `${customer.name ?? ''} — ${customer.mobile ?? ''}`.trim(),
-  })),
-)
-
-const selectedCustomer = computed(() =>
-  customers.value.find((customer) => customer.id === formCharge.value.customer_id),
-)
-
-const modalTitle = computed(() =>
-  walletChargeTitle(walletVariant.value, formCharge.value.direction),
-)
-
-const okText = computed(() => walletChargeOkText(formCharge.value.direction))
-
-function filterCustomer(input: string, option?: { label?: string }) {
-  return String(option?.label ?? '').toLowerCase().includes(input.toLowerCase())
-}
-
-function customerWallet(customer: Customer): Wallet | undefined {
-  const wallet = customer.wallet as Wallet | Wallet[] | undefined
-  return Array.isArray(wallet) ? wallet[0] : wallet
-}
-
-function formatGold(customer: Customer) {
-  const gold = customerWallet(customer)?.gold ?? customer.wallet_gold ?? customer.gold
-  return `${Number(gold ?? 0).toLocaleString('fa-IR', { maximumFractionDigits: 3 })} گرم`
-}
-
-function formatCash(customer: Customer) {
-  const cash = customerWallet(customer)?.cash ?? customer.wallet_cash
-  return usePrice(Number(cash ?? 0), true, '')
-}
-
-async function loadCustomers() {
-  loading.value = true
-  try {
-    customers.value = (await getCustomersList()) ?? []
-  } catch (e) {
-    console.error(e)
-    message.error('خطا در بارگذاری لیست مشتریان')
-  } finally {
-    loading.value = false
-  }
-}
-
-function resetForm() {
-  walletVariant.value = 'money'
-  formCharge.value = createEmptyChargeForm()
-}
-
-function handleClose() {
-  resetForm()
-}
-
-function closeModal() {
-  visibleProxy.value = false
-  resetForm()
-}
-
-async function submit() {
-  if (!formCharge.value.customer_id) {
-    message.warning('مشتری را انتخاب کنید')
-    return
-  }
-
-  try {
-    await chargeFormRef.value?.validateFields?.()
-  } catch {
-    return
-  }
-
-  submitting.value = true
-  try {
-    await chargeWallet(buildChargePayload(formCharge.value), walletVariant.value)
-    message.success(walletChargeSuccessMessage(formCharge.value.direction))
-    closeModal()
-  } catch (e) {
-    console.error(e)
-    message.error('خطا در ثبت عملیات')
-  } finally {
-    submitting.value = false
-  }
-}
-
-watch(
-  () => props.visible,
-  (open) => {
-    if (open) {
-      void loadCustomers()
-    }
-  },
-)
 </script>
-
-<style scoped>
-.dashboard-wallet-modal {
-  @apply flex flex-col gap-4 px-4 pb-2 pt-1;
-}
-
-.dashboard-wallet-modal__select :deep(.ant-select-selector) {
-  @apply !px-3;
-}
-
-.dashboard-wallet-modal__select :deep(.ant-select-selection-placeholder) {
-  @apply text-slate-400;
-}
-
-.dashboard-wallet-modal__section {
-  @apply flex flex-col gap-1.5;
-}
-
-.dashboard-wallet-modal__label {
-  @apply text-xs font-semibold text-slate-600 dark:text-slate-300;
-}
-
-.dashboard-wallet-modal__balances {
-  @apply grid grid-cols-2 gap-3 rounded-lg border border-slate-200 bg-slate-50 px-3 py-2.5 text-xs dark:border-slate-600 dark:bg-slate-800/60;
-}
-
-.dashboard-wallet-modal__footer {
-  @apply sticky bottom-0 grid grid-cols-2 gap-2 border-t border-slate-200 bg-white pt-3 dark:border-slate-600 dark:bg-slate-900;
-}
-
-.dashboard-wallet-modal__form :deep(.ant-form-item) {
-  margin-bottom: 0.85rem;
-}
-
-.dashboard-wallet-modal__form :deep(.ant-form-item-label > label) {
-  @apply text-xs font-semibold text-slate-600 dark:text-slate-300;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__direction .ant-radio-button-wrapper) {
-  height: 2.5rem;
-  line-height: 2.4rem;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__preview) {
-  margin-bottom: 0.75rem;
-  padding: 0.65rem 0.85rem;
-  font-size: 0.8125rem;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__preview--charge) {
-  color: #166534;
-  background: #f0fdf4;
-  border-color: #bbf7d0;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__preview--charge .wallet-charge-form__preview-sign) {
-  color: #15803d;
-  background: #dcfce7;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__preview--discharge) {
-  color: #991b1b;
-  background: #fef2f2;
-  border-color: #fecaca;
-}
-
-.dashboard-wallet-modal__form :deep(.wallet-charge-form__preview--discharge .wallet-charge-form__preview-sign) {
-  color: #b91c1c;
-  background: #fee2e2;
-}
-</style>

src/pages/menuPages/customers/archive/index.vue

@@ -131,20 +131,11 @@
       </div>
     </BasicActionSheet>
 
-    <BasicModal
+    <WalletChargeModal
       v-model:visible="showWalletCharge"
-      width="30rem"
-      title="شارژ کیف پول"
-      @ok="charge"
-      :loading="loading"
-      @close="showWalletCharge = false"
-    >
-      <a-form :model="formCharge" ref="formChargeRef" autocomplete="off">
-        <a-form-item label="مقدار شارژ (ریال)" name="value" :rules="inputRules()">
-          <BasicInput v-model:value="formCharge.value" type="number" />
-        </a-form-item>
-      </a-form>
-    </BasicModal>
+      :customer-id="chargeCustomerId"
+      @success="refreshTable"
+    />
   </div>
 </template>
 
@@ -167,9 +158,7 @@ import { cloneDeep } from 'lodash'
 import type { Item } from '@/model/Item'
 import type { Customer } from '@/model/customer'
 import { createCustomer, deleteCustomer, updateCustomer } from '@/api/customer'
-import type { Charge } from '@/model/wallet'
-import customers from '@/router/routes/customers'
-import { chargeWallet } from '@/api/wallet'
+import WalletChargeModal from '@/pages/menuPages/customers/base/components/WalletChargeModal.vue'
 
 //loading
 const loading = ref<boolean>(false)
@@ -197,12 +186,11 @@ const confirmItems: Array<Item> = [
 
 //wallet
 const showWalletCharge = ref<boolean>(false)
+const chargeCustomerId = ref<number | null>(null)
 
 //form
 const form = ref<Customer>({})
-const formCharge = ref<Charge>({})
 const formRef = ref<FormInstance>()
-const formChargeRef = ref<FormInstance>()
 const userInfo = ref<Customer>()
 
 //info
@@ -234,23 +222,8 @@ async function add() {
 }
 
 async function walletCharge(val: Customer) {
+  chargeCustomerId.value = val.id
   showWalletCharge.value = true
-  formCharge.value.customer_id = val.id
-}
-
-async function charge() {
-  formChargeRef.value?.validateFields().then(async () => {
-    try {
-      loading.value = true
-      await chargeMoneyWallet(formCharge.value)
-      message.success('افزایش اعتبار با موفقیت انجام شد')
-      showWalletCharge.value = false
-    } catch (e) {
-      console.log(e)
-    } finally {
-      loading.value = false
-    }
-  })
 }
 
 //reset data

src/pages/menuPages/customers/base/components/CustomerMobileCardList.vue

@@ -25,8 +25,7 @@
     @edit="forwardAndClose('edit', $event)"
     @archive="forwardAndClose('archive', $event)"
     @toggleActive="forward('toggleActive', $event)"
-    @chargeMoney="forwardAndClose('chargeMoney', $event)"
-    @chargeGold="forwardAndClose('chargeGold', $event)"
+    @chargeWallet="forwardAndClose('chargeWallet', $event)"
     @toggleTrade="forward('toggleTrade', $event)"
     @confirmUser="forwardAndClose('confirmUser', $event)"
   />
@@ -55,8 +54,7 @@ const emit = defineEmits<{
   (e: 'edit', item: Customer): void
   (e: 'archive', item: Customer): void
   (e: 'toggleActive', item: Customer): void
-  (e: 'chargeMoney', item: Customer): void
-  (e: 'chargeGold', item: Customer): void
+  (e: 'chargeWallet', item: Customer): void
   (e: 'toggleTrade', item: Customer): void
   (e: 'confirmUser', item: Customer): void
 }>()
@@ -68,8 +66,7 @@ type SheetAction =
   | 'edit'
   | 'archive'
   | 'toggleActive'
-  | 'chargeMoney'
-  | 'chargeGold'
+  | 'chargeWallet'
   | 'toggleTrade'
   | 'confirmUser'
 

src/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue

@@ -5,11 +5,8 @@
       <p v-if="row.mobile" class="text-sm text-gray-500" dir="ltr">{{ row.mobile }}</p>
 
       <div class="grid grid-cols-2 gap-2">
-        <BaseButton class="w-full" size="middle" type="primary" icon="vuesax-linear:wallet-add" @click="closeAndEmit('chargeMoney', row)">
-          شارژ ریالی
-        </BaseButton>
-        <BaseButton class="w-full" size="middle" type="primary" icon="vuesax-linear:wallet-money" @click="closeAndEmit('chargeGold', row)">
-          {{ metalLabel.goldChargeShort() }}
+        <BaseButton class="w-full col-span-2" size="middle" type="primary" icon="vuesax-linear:wallet-add" @click="closeAndEmit('chargeWallet', row)">
+          شارژ کیف پول
         </BaseButton>
         <BaseButton
           v-if="!row.is_legal"
@@ -82,7 +79,6 @@ import MobileDetailSheet from '@/components/mobile/MobileDetailSheet.vue'
 import MobileInfoGrid from '@/components/mobile/MobileInfoGrid.vue'
 import CustomerWalletBalancePanel from '@/components/customer/CustomerWalletBalancePanel.vue'
 import { toJalali } from '@core/utils/useDataTime'
-import { metalLabel } from '@/utils/adminMetalLabels'
 
 const props = defineProps<{
   visible: boolean
@@ -95,8 +91,7 @@ const emit = defineEmits<{
   (e: 'edit', item: Customer): void
   (e: 'archive', item: Customer): void
   (e: 'toggleActive', item: Customer): void
-  (e: 'chargeMoney', item: Customer): void
-  (e: 'chargeGold', item: Customer): void
+  (e: 'chargeWallet', item: Customer): void
   (e: 'toggleTrade', item: Customer): void
   (e: 'confirmUser', item: Customer): void
 }>()
@@ -106,7 +101,7 @@ const visibleProxy = computed({
   set: (value: boolean) => emit('update:visible', value)
 })
 
-type SheetEmit = 'archive' | 'chargeMoney' | 'chargeGold' | 'info' | 'confirmUser' | 'edit'
+type SheetEmit = 'archive' | 'chargeWallet' | 'info' | 'confirmUser' | 'edit'
 
 function closeAndEmit(event: SheetEmit, row: Customer) {
   visibleProxy.value = false

src/pages/menuPages/customers/base/components/WalletChargeForm.vue

@@ -35,11 +35,11 @@
     <a-form-item :label="amountLabel" name="amountAbs" :rules="amountRules">
       <BasicInput
         v-model:value="modelValue.amountAbs"
-        :addon-before="unit"
-        :type="variant === 'money' ? 'price' : 'number'"
+        :addon-before="resolvedUnit"
+        :type="resolvedInputType"
         :place-holder="amountPlaceholder"
       />
-      <div v-if="variant === 'money' && Number(modelValue.amountAbs) > 10" class="wallet-charge-form__hint">
+      <div v-if="isMoney && Number(modelValue.amountAbs) > 10" class="wallet-charge-form__hint">
         معادل {{ usePrice(Number(modelValue.amountAbs) / 10, true, 'تومان') }}
       </div>
     </a-form-item>
@@ -56,48 +56,63 @@ import type { FormInstance } from 'ant-design-vue'
 import type { Charge } from '@/model/wallet'
 import { inputRules } from '@/utils/inputRules'
 import { usePrice } from '@core/utils/usePrice'
-import { m } from '@/utils/metalLabels'
 
-const props = defineProps<{
-  variant: 'money' | 'gold'
-  modelValue: Charge
-}>()
+const props = withDefaults(
+  defineProps<{
+    /** @deprecated از unitLabel و isMoney استفاده کنید */
+    variant?: 'money' | 'gold'
+    modelValue: Charge
+    /** واحد نمایش: ریال، گرم، عدد، ... */
+    unitLabel?: string
+    /** true = ورودی قیمتی (ریال)، false = عددی */
+    isMoney?: boolean
+    /** نام کیف پول برای پیش‌نمایش */
+    walletLabel?: string
+  }>(),
+  {
+    variant: 'money',
+  },
+)
 
 const formRef = ref<FormInstance>()
 
-const unit = computed(() => (props.variant === 'money' ? 'ریال' : 'گرم'))
+const resolvedUnit = computed(
+  () => props.unitLabel ?? (props.variant === 'money' ? 'ریال' : 'گرم'),
+)
+const isMoney = computed(() => props.isMoney ?? props.variant === 'money')
+const resolvedInputType = computed(() => (isMoney.value ? 'price' : 'number'))
 const isDischarge = computed(() => props.modelValue.direction === 'discharge')
 
 const formClass = computed(() =>
-  isDischarge.value ? 'wallet-charge-form--discharge' : 'wallet-charge-form--charge'
+  isDischarge.value ? 'wallet-charge-form--discharge' : 'wallet-charge-form--charge',
 )
 
 const previewClass = computed(() =>
   isDischarge.value
     ? 'wallet-charge-form__preview--discharge'
-    : 'wallet-charge-form__preview--charge'
+    : 'wallet-charge-form__preview--charge',
 )
 
 const previewSign = computed(() => (isDischarge.value ? '−' : '+'))
 
 const previewText = computed(() => {
   const action = isDischarge.value ? 'کسر از' : 'افزایش'
-  const wallet = props.variant === 'money' ? 'موجودی ریالی' : m('موجودی طلایی')
+  const wallet = props.walletLabel ?? (isMoney.value ? 'موجودی ریالی' : 'موجودی محصول')
   return `${action} ${wallet} کاربر`
 })
 
 const amountLabel = computed(() =>
-  isDischarge.value ? `مقدار دشارژ (${unit.value})` : `مقدار شارژ (${unit.value})`
+  isDischarge.value ? `مقدار دشارژ (${resolvedUnit.value})` : `مقدار شارژ (${resolvedUnit.value})`,
 )
 
 const noteLabel = computed(() => (isDischarge.value ? 'علت دشارژ' : 'علت شارژ'))
 
 const amountPlaceholder = computed(() =>
-  props.variant === 'money' ? 'مثلاً ۱۰۰٬۰۰۰' : 'مثلاً ۰.۵'
+  isMoney.value ? 'مثلاً ۱۰۰٬۰۰۰' : 'مثلاً ۰.۵',
 )
 
 const notePlaceholder = computed(() =>
-  isDischarge.value ? 'دلیل کسر موجودی' : 'دلیل افزایش موجودی'
+  isDischarge.value ? 'دلیل کسر موجودی' : 'دلیل افزایش موجودی',
 )
 
 const amountRules = [
@@ -109,12 +124,12 @@ const amountRules = [
         return Promise.reject('مقدار باید بیشتر از صفر باشد')
       }
       return Promise.resolve()
-    }
-  }
+    },
+  },
 ]
 
 defineExpose({
-  validateFields: () => formRef.value?.validateFields()
+  validateFields: () => formRef.value?.validateFields(),
 })
 </script>
 

src/pages/menuPages/customers/base/components/WalletChargeModal.vue

@@ -0,0 +1,186 @@
+<template>
+  <BasicActionSheet
+    v-if="isMobile"
+    v-model:visible="visibleProxy"
+    :title="modalTitle"
+    modal-width="26rem"
+    drawer-height="auto"
+    compact
+    :loading="submitting || targetsLoading"
+    :show-button="true"
+    :show-cancel="true"
+    :show-ok="true"
+    :ok-text="okText"
+    cancel-text="انصراف"
+    @ok="submit"
+    @close="handleClose"
+  >
+    <WalletChargeModalBody
+      ref="bodyRef"
+      v-model:form-charge="formCharge"
+      v-model:selected-target-key="selectedTargetKey"
+      :customer-id="customerId"
+      :show-customer-select="showCustomerSelect"
+      :targets="targets"
+      :targets-loading="targetsLoading"
+      :selected-target="selectedTarget"
+    />
+  </BasicActionSheet>
+
+  <BasicModal
+    v-else
+    v-model:visible="visibleProxy"
+    width="30rem"
+    :title="modalTitle"
+    :ok-text="okText"
+    :loading="submitting"
+    @ok="submit"
+    @close="handleClose"
+  >
+    <WalletChargeModalBody
+      ref="bodyRef"
+      v-model:form-charge="formCharge"
+      v-model:selected-target-key="selectedTargetKey"
+      :customer-id="customerId"
+      :show-customer-select="showCustomerSelect"
+      :targets="targets"
+      :targets-loading="targetsLoading"
+      :selected-target="selectedTarget"
+    />
+  </BasicModal>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import { message } from 'ant-design-vue'
+import BasicActionSheet from '@/components/BasicActionSheet.vue'
+import BasicModal from '@/components/BasicModal.vue'
+import WalletChargeModalBody from '@/pages/menuPages/customers/base/components/WalletChargeModalBody.vue'
+import {
+  buildChargePayload,
+  createEmptyChargeForm,
+  walletChargeOkText,
+  walletChargeSuccessMessage,
+  walletChargeTitle,
+} from '@/pages/menuPages/customers/base/utils/walletChargeForm'
+import { chargeWalletUnified, getChargeTargets } from '@/api/wallet'
+import type { ChargeTarget } from '@/model/wallet'
+import { isMobile } from '@core/utils/is'
+
+const props = withDefaults(
+  defineProps<{
+    visible: boolean
+    /** اگر از جدول مشتری باز شود */
+    customerId?: number | null
+    /** برای داشبورد — انتخاب مشتری داخل مدال */
+    showCustomerSelect?: boolean
+  }>(),
+  {
+    customerId: null,
+    showCustomerSelect: false,
+  },
+)
+
+const emit = defineEmits<{
+  (e: 'update:visible', value: boolean): void
+  (e: 'success'): void
+}>()
+
+const visibleProxy = computed({
+  get: () => props.visible,
+  set: (value: boolean) => emit('update:visible', value),
+})
+
+const submitting = ref(false)
+const targetsLoading = ref(false)
+const targets = ref<ChargeTarget[]>([])
+const selectedTargetKey = ref<string>('money')
+const formCharge = ref(createEmptyChargeForm())
+const bodyRef = ref<InstanceType<typeof WalletChargeModalBody>>()
+
+const selectedTarget = computed(
+  () => targets.value.find((t) => t.key === selectedTargetKey.value) ?? targets.value[0],
+)
+
+const modalTitle = computed(() =>
+  walletChargeTitle(selectedTarget.value?.label ?? 'کیف پول', formCharge.value.direction),
+)
+
+const okText = computed(() => walletChargeOkText(formCharge.value.direction))
+
+async function loadTargets() {
+  targetsLoading.value = true
+  try {
+    const res = await getChargeTargets()
+    targets.value = res?.targets ?? []
+    if (!targets.value.some((t) => t.key === selectedTargetKey.value)) {
+      selectedTargetKey.value = targets.value[0]?.key ?? 'money'
+    }
+  } catch (e) {
+    console.error(e)
+    message.error('خطا در بارگذاری گزینه‌های شارژ')
+    targets.value = [{ key: 'money', kind: 'money', label: 'نقدی (ریال)', unit: 'ریال' }]
+  } finally {
+    targetsLoading.value = false
+  }
+}
+
+function resetForm() {
+  selectedTargetKey.value = 'money'
+  formCharge.value = createEmptyChargeForm(props.customerId ?? undefined)
+}
+
+function handleClose() {
+  resetForm()
+}
+
+function closeModal() {
+  visibleProxy.value = false
+  resetForm()
+}
+
+async function submit() {
+  const customerId = formCharge.value.customer_id ?? props.customerId
+  if (!customerId) {
+    message.warning('مشتری را انتخاب کنید')
+    return
+  }
+
+  try {
+    await bodyRef.value?.validateFields?.()
+  } catch {
+    return
+  }
+
+  const target = selectedTarget.value
+  const productId = target?.kind === 'metal' ? target.product_id : undefined
+
+  submitting.value = true
+  try {
+    await chargeWalletUnified({
+      ...buildChargePayload({ ...formCharge.value, customer_id: customerId }, productId),
+    })
+    message.success(walletChargeSuccessMessage(formCharge.value.direction))
+    emit('success')
+    closeModal()
+  } catch (e) {
+    console.error(e)
+    message.error('خطا در ثبت عملیات')
+  } finally {
+    submitting.value = false
+  }
+}
+
+watch(
+  () => props.visible,
+  (open) => {
+    if (open) {
+      resetForm()
+      if (props.customerId) {
+        formCharge.value.customer_id = props.customerId
+      }
+      void loadTargets()
+    }
+  },
+)
+</script>

src/pages/menuPages/customers/base/components/WalletChargeModalBody.vue

@@ -0,0 +1,157 @@
+<template>
+  <div class="wallet-charge-modal-body">
+    <div v-if="showCustomerSelect" class="wallet-charge-modal-body__section">
+      <label class="wallet-charge-modal-body__label">مشتری</label>
+      <a-select
+        v-model:value="customerIdProxy"
+        show-search
+        allow-clear
+        placeholder="انتخاب کنید"
+        class="w-full"
+        size="large"
+        :options="customerOptions"
+        :loading="customersLoading"
+        :filter-option="filterCustomer"
+      />
+    </div>
+
+    <CustomerWalletBalancePanel
+      v-if="resolvedCustomerId"
+      :customer-id="resolvedCustomerId"
+      class="mb-3"
+    />
+
+    <div class="wallet-charge-modal-body__section">
+      <label class="wallet-charge-modal-body__label">محصول / کیف پول</label>
+      <a-spin :spinning="targetsLoading">
+        <a-select
+          v-model:value="selectedTargetKeyProxy"
+          class="w-full"
+          size="large"
+          :options="targetOptions"
+          placeholder="انتخاب کنید"
+        />
+      </a-spin>
+    </div>
+
+    <WalletChargeForm
+      ref="formRef"
+      :model-value="formCharge"
+      :unit-label="selectedTarget?.unit ?? 'ریال'"
+      :is-money="selectedTarget?.kind === 'money'"
+      :wallet-label="selectedTarget?.label"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import WalletChargeForm from '@/pages/menuPages/customers/base/components/WalletChargeForm.vue'
+import CustomerWalletBalancePanel from '@/components/customer/CustomerWalletBalancePanel.vue'
+import { getCustomersList } from '@/api/customer'
+import type { Charge, ChargeTarget } from '@/model/wallet'
+import type { Customer } from '@/model/customer'
+
+const props = defineProps<{
+  formCharge: Charge
+  selectedTargetKey: string
+  customerId?: number | null
+  showCustomerSelect?: boolean
+  targets: ChargeTarget[]
+  targetsLoading?: boolean
+  selectedTarget?: ChargeTarget
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:formCharge', value: Charge): void
+  (e: 'update:selectedTargetKey', value: string): void
+}>()
+
+const formRef = ref<InstanceType<typeof WalletChargeForm>>()
+const customers = ref<Customer[]>([])
+const customersLoading = ref(false)
+
+const formCharge = computed({
+  get: () => props.formCharge,
+  set: (value: Charge) => emit('update:formCharge', value),
+})
+
+const selectedTargetKeyProxy = computed({
+  get: () => props.selectedTargetKey,
+  set: (value: string) => emit('update:selectedTargetKey', value),
+})
+
+const resolvedCustomerId = computed(
+  () => props.formCharge.customer_id ?? props.customerId ?? undefined,
+)
+
+const customerIdProxy = computed({
+  get: () => formCharge.value.customer_id ?? undefined,
+  set: (value: number | undefined) => {
+    emit('update:formCharge', { ...formCharge.value, customer_id: value })
+  },
+})
+
+const customerOptions = computed(() =>
+  customers.value.map((customer) => ({
+    value: customer.id,
+    label: `${customer.name ?? ''} — ${customer.mobile ?? ''}`.trim(),
+  })),
+)
+
+const targetOptions = computed(() =>
+  props.targets.map((target) => ({
+    value: target.key,
+    label: target.label,
+  })),
+)
+
+function filterCustomer(input: string, option?: { label?: string }) {
+  return String(option?.label ?? '').toLowerCase().includes(input.toLowerCase())
+}
+
+async function loadCustomers() {
+  if (!props.showCustomerSelect) return
+  customersLoading.value = true
+  try {
+    customers.value = (await getCustomersList()) ?? []
+  } catch (e) {
+    console.error(e)
+  } finally {
+    customersLoading.value = false
+  }
+}
+
+watch(
+  () => props.showCustomerSelect,
+  (show) => {
+    if (show) void loadCustomers()
+  },
+  { immediate: true },
+)
+
+defineExpose({
+  validateFields: () => formRef.value?.validateFields?.(),
+})
+</script>
+
+<style scoped>
+.wallet-charge-modal-body {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  padding: 0.25rem 1rem 0.5rem;
+}
+
+.wallet-charge-modal-body__section {
+  display: flex;
+  flex-direction: column;
+  gap: 0.35rem;
+}
+
+.wallet-charge-modal-body__label {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--admin-text-secondary, #64748b);
+}
+</style>

src/pages/menuPages/customers/base/components/table.vue

@@ -49,14 +49,10 @@
                 :color="record.active ? '#54AD06' : '#ad0627'"
               />
             </a-tooltip>
-            <a-tooltip placement="bottom" class="cursor-pointer" @click="emits('chargeMoney', record)">
-              <template #title><span>شارژ کیف پول ریالی</span></template>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="emits('chargeWallet', record)">
+              <template #title><span>شارژ کیف پول</span></template>
               <Icon icon="vuesax-linear:wallet-add" color="#9333ea" />
             </a-tooltip>
-            <a-tooltip placement="bottom" class="cursor-pointer" @click="emits('chargeGold', record)">
-              <template #title><span>{{ metalLabel.goldWalletCharge() }}</span></template>
-              <Icon icon="vuesax-linear:wallet-money" color="#ea580c" />
-            </a-tooltip>
             <a-tooltip
               v-if="tahesabEnabled && !record.moshtari_code"
               placement="bottom"
@@ -118,8 +114,7 @@
         @edit="emits('edit', $event)"
         @archive="handleArchive"
         @toggleActive="(item) => changeCustomerActivationFunction(item.id)"
-        @chargeMoney="emits('chargeMoney', $event)"
-        @chargeGold="emits('chargeGold', $event)"
+        @chargeWallet="emits('chargeWallet', $event)"
         @toggleTrade="(item) => changeCustomerOrderActivationFunction(item.id)"
         @confirmUser="openConfirmUser"
       />
@@ -188,13 +183,12 @@ import { toJalaliNoTime } from '@core/utils/useDataTime'
 import type { Customer } from '@/model/customer'
 import { MODAL_ABOVE_ACTION_SHEET_Z_INDEX } from '@/constants/overlayZIndex'
 import { isMobile } from '@core/utils/is'
-import { metalLabel } from '@/utils/adminMetalLabels'
 import TahesabRetryModal from '@/components/TahesabRetryModal.vue'
 import PargarRetryModal from '@/components/PargarRetryModal.vue'
 import { tahesabEnabledSetting, pargarEnabledSetting, initAccountingSettingsFromApi } from '@/utils/config'
 
 const [submit, reload] = useBaseTable()
-const emits = defineEmits(['delete', 'edit', 'add', 'info', 'chargeMoney', 'chargeGold'])
+const emits = defineEmits(['delete', 'edit', 'add', 'info', 'chargeWallet'])
 
 const loading = ref(false)
 const confirmVisible = ref(false)

src/pages/menuPages/customers/base/index.vue

@@ -6,8 +6,7 @@
         @info="info"
         @edit="edit"
         @add="add"
-        @chargeMoney="walletMoneyCharge"
-        @chargeGold="walletGoldCharge"
+        @chargeWallet="openWalletCharge"
       />
 
       <!--        <BasicMenu :menu="menu" width="13rem" @onChange="tabSelected" />
@@ -236,67 +235,11 @@
         </a-tab-pane>
       </a-tabs>
     </BasicActionSheet>
-    <BasicActionSheet
-      v-if="isMobile"
-      v-model:visible="showMoneyWalletCharge"
-      :title="moneyChargeTitle"
-      modal-width="24rem"
-      :loading="loading"
-      :show-button="true"
-      :show-cancel="true"
-      :show-ok="true"
-      :ok-text="moneyChargeOkText"
-      cancel-text="انصراف"
-      @ok="chargeMoneyWallet"
-      @close="showMoneyWalletCharge = false"
-    >
-      <CustomerWalletBalancePanel v-if="formCharge.customer_id" :customer-id="formCharge.customer_id" class="mb-3" />
-      <WalletChargeForm ref="moneyChargeFormRef" :model-value="formCharge" variant="money" />
-    </BasicActionSheet>
-    <BasicModal
-      v-else
-      v-model:visible="showMoneyWalletCharge"
-      width="28rem"
-      :title="moneyChargeTitle"
-      :ok-text="moneyChargeOkText"
-      @ok="chargeMoneyWallet"
-      :loading="loading"
-      @close="showMoneyWalletCharge = false"
-    >
-      <CustomerWalletBalancePanel v-if="formCharge.customer_id" :customer-id="formCharge.customer_id" class="mb-3" />
-      <WalletChargeForm ref="moneyChargeFormRef" :model-value="formCharge" variant="money" />
-    </BasicModal>
-
-    <BasicActionSheet
-      v-if="isMobile"
-      v-model:visible="showGoldWalletCharge"
-      :title="goldChargeTitle"
-      modal-width="24rem"
-      :loading="loading"
-      :show-button="true"
-      :show-cancel="true"
-      :show-ok="true"
-      :ok-text="goldChargeOkText"
-      cancel-text="انصراف"
-      @ok="chargeGoldWallet"
-      @close="showGoldWalletCharge = false"
-    >
-      <CustomerWalletBalancePanel v-if="formCharge.customer_id" :customer-id="formCharge.customer_id" class="mb-3" />
-      <WalletChargeForm ref="goldChargeFormRef" :model-value="formCharge" variant="gold" />
-    </BasicActionSheet>
-    <BasicModal
-      v-else
-      v-model:visible="showGoldWalletCharge"
-      width="28rem"
-      :title="goldChargeTitle"
-      :ok-text="goldChargeOkText"
-      @ok="chargeGoldWallet"
-      :loading="loading"
-      @close="showGoldWalletCharge = false"
-    >
-      <CustomerWalletBalancePanel v-if="formCharge.customer_id" :customer-id="formCharge.customer_id" class="mb-3" />
-      <WalletChargeForm ref="goldChargeFormRef" :model-value="formCharge" variant="gold" />
-    </BasicModal>
+    <WalletChargeModal
+      v-model:visible="showWalletCharge"
+      :customer-id="chargeCustomerId"
+      @success="onWalletChargeSuccess"
+    />
     <BasicInfoModal
       v-model:visible="userInfoOrderVisible"
       @close="userInfoOrderVisible = false"
@@ -327,9 +270,7 @@ import { cloneDeep } from 'lodash'
 import type { Item } from '@/model/Item'
 import type { Customer } from '@/model/customer'
 import { createCustomer, deleteCustomer, updateCustomer } from '@/api/customer'
-import type { Charge } from '@/model/wallet'
 import customers from '@/router/routes/customers'
-import { chargeWallet } from '@/api/wallet'
 import { usePrice } from '@core/utils/usePrice'
 import jalaliday from 'jalaliday'
 import ordersTbl from '@/pages/menuPages/orders/components/table.vue'
@@ -340,15 +281,8 @@ import ReferralsTable from '@/pages/menuPages/customers/base/components/referral
 import type { Order } from '@/model/order'
 import Icon from '@core/components/BaseIcon/src/Icon.vue'
 import { isMobile } from '@core/utils/is'
-import WalletChargeForm from './components/WalletChargeForm.vue'
+import WalletChargeModal from './components/WalletChargeModal.vue'
 import CustomerWalletBalancePanel from '@/components/customer/CustomerWalletBalancePanel.vue'
-import {
-  buildChargePayload,
-  createEmptyChargeForm,
-  walletChargeOkText,
-  walletChargeSuccessMessage,
-  walletChargeTitle
-} from './utils/walletChargeForm'
 import { metalLabel } from '@/utils/adminMetalLabels'
 import type { DashboardHelp } from '@/pages/dashboard/dashboardSectionCopy'
 import DashboardLabelWithHelp from '@/pages/dashboard/components/DashboardLabelWithHelp.vue'
@@ -448,21 +382,13 @@ const customerItems: Array<Item> = [
 ]
 
 //wallet
-const showMoneyWalletCharge = ref<boolean>(false)
-const showGoldWalletCharge = ref<boolean>(false)
+const showWalletCharge = ref<boolean>(false)
+const chargeCustomerId = ref<number | null>(null)
 const userInfoOrderVisible = ref<boolean>(false)
 
 //form
 const form = ref<Partial<Customer>>({})
 const formRef = ref<FormInstance>()
-const formCharge = ref<Charge>({})
-const moneyChargeFormRef = ref<InstanceType<typeof WalletChargeForm>>()
-const goldChargeFormRef = ref<InstanceType<typeof WalletChargeForm>>()
-
-const moneyChargeTitle = computed(() => walletChargeTitle('money', formCharge.value.direction))
-const goldChargeTitle = computed(() => walletChargeTitle('gold', formCharge.value.direction))
-const moneyChargeOkText = computed(() => walletChargeOkText(formCharge.value.direction))
-const goldChargeOkText = computed(() => walletChargeOkText(formCharge.value.direction))
 
 //info
 let infoParams = reactive<Info>({})
@@ -587,48 +513,13 @@ async function add() {
   loading.value = false
 }
 
-function resetFormCharge(customerId: number) {
-  formCharge.value = createEmptyChargeForm(customerId)
+function openWalletCharge(val: Customer) {
+  chargeCustomerId.value = val.id
+  showWalletCharge.value = true
 }
 
-async function walletMoneyCharge(val: Customer) {
-  resetFormCharge(val.id)
-  showMoneyWalletCharge.value = true
-}
-
-async function walletGoldCharge(val: Customer) {
-  resetFormCharge(val.id)
-  showGoldWalletCharge.value = true
-}
-
-async function chargeMoneyWallet() {
-  moneyChargeFormRef.value?.validateFields()?.then(async () => {
-    try {
-      loading.value = true
-      await chargeWallet(buildChargePayload(formCharge.value), 'money')
-      message.success(walletChargeSuccessMessage(formCharge.value.direction))
-      showMoneyWalletCharge.value = false
-    } catch (e) {
-      console.log(e)
-    } finally {
-      loading.value = false
-    }
-  })
-}
-
-async function chargeGoldWallet() {
-  goldChargeFormRef.value?.validateFields()?.then(async () => {
-    try {
-      loading.value = true
-      await chargeWallet(buildChargePayload(formCharge.value), 'gold')
-      message.success(walletChargeSuccessMessage(formCharge.value.direction))
-      showGoldWalletCharge.value = false
-    } catch (e) {
-      console.log(e)
-    } finally {
-      loading.value = false
-    }
-  })
+function onWalletChargeSuccess() {
+  table.value?.fetch?.()
 }
 
 //reset data

src/pages/menuPages/customers/base/utils/walletChargeForm.ts

@@ -1,5 +1,4 @@
 import type { Charge, WalletChargeDirection } from '@/model/wallet'
-import { m } from '@/utils/metalLabels'
 
 export function createEmptyChargeForm(customerId?: number): Charge {
   return {
@@ -8,26 +7,40 @@ export function createEmptyChargeForm(customerId?: number): Charge {
     note: undefined,
     talabBedehi: false,
     direction: 'charge',
-    amountAbs: undefined
+    amountAbs: undefined,
+    product_id: undefined,
   }
 }
 
-export function buildChargePayload(form: Charge): Charge {
+export function buildChargePayload(form: Charge, productId?: number | null): Charge {
   const amount = Math.abs(Number(form.amountAbs) || 0)
   const signed = form.direction === 'discharge' ? -amount : amount
-  return {
+  const payload: Charge = {
     value: signed,
     note: form.note,
     customer_id: form.customer_id,
-    talabBedehi: form.talabBedehi === true
+    talabBedehi: form.talabBedehi === true,
   }
+  if (productId != null && productId > 0) {
+    payload.product_id = productId
+  }
+  return payload
 }
 
 export function walletChargeTitle(
-  variant: 'money' | 'gold',
-  direction: WalletChargeDirection = 'charge'
+  targetLabel: string,
+  direction: WalletChargeDirection = 'charge',
 ) {
-  const wallet = variant === 'money' ? 'ریالی' : m('طلایی')
+  const action = direction === 'discharge' ? 'دشارژ' : 'شارژ'
+  return `${action} ${targetLabel}`
+}
+
+/** @deprecated */
+export function walletChargeTitleLegacy(
+  variant: 'money' | 'gold',
+  direction: WalletChargeDirection = 'charge',
+) {
+  const wallet = variant === 'money' ? 'ریالی' : 'طلایی'
   const action = direction === 'discharge' ? 'دشارژ' : 'شارژ'
   return `${action} کیف پول ${wallet}`
 }