fix some bugs

src/pages/menuPages/wallet/components/WalletMobileCardList.vue

@@ -15,6 +15,7 @@
       v-for="item in items"
       :key="item.id"
       :item="item"
+      :metals="catalogMetals"
       @open="openSheet"
     />
   </MobileCardList>
@@ -22,36 +23,39 @@
   <WalletMobileDetailSheet
     v-model:visible="sheetVisible"
     :item="selectedItem"
+    :metals="catalogMetals"
   />
 </template>
 
 <script setup lang="ts">
 import { getWalletTable } from '@/api/wallet'
-import type { Wallet } from '@/model/wallet'
+import type { Wallet, WalletTableSums } from '@/model/wallet'
 import MobileCardList from '@/components/mobile/MobileCardList.vue'
 import { useMobileDetailSheet } from '@/components/mobile/composables/useMobileDetailSheet'
 import { useMobileTableList } from '@/components/mobile/composables/useMobileTableList'
 import type { TableInput, TableOutput } from '@core/type/baseTable'
+import type { WalletMetalColumn } from '../hooks/walletColumns'
 import WalletMobileDetailSheet from './WalletMobileDetailSheet.vue'
 import WalletMobileListItem from './WalletMobileListItem.vue'
 
 type WalletTableResponse = TableOutput<Wallet> & {
-  sums?: {
-    cash?: number
-    gold?: number
-    cashToGold?: number
-    goldToCash?: number
-  }
+  sums?: WalletTableSums
 }
 
 const emit = defineEmits<{
   (e: 'sums', sums: WalletTableResponse['sums']): void
 }>()
 
+const catalogMetals = ref<WalletMetalColumn[]>([])
 const { sheetVisible, selectedItem, openSheet, syncSelectedItem } = useMobileDetailSheet<Wallet>()
 
 async function fetchWallet(params: TableInput) {
   const data = (await getWalletTable(params)) as WalletTableResponse
+  catalogMetals.value =
+    data?.sums?.metalBalances?.map((metal) => ({
+      metal_id: metal.metal_id,
+      label: metal.label
+    })) ?? []
   emit('sums', data?.sums)
   return data
 }

src/pages/menuPages/wallet/components/WalletMobileDetailSheet.vue

@@ -9,7 +9,15 @@
             <BaseIcon icon="vuesax-linear:empty-wallet" size="18" color="#15803d" />
           </template>
         </MobileStatCard>
-        <MobileStatCard bordered variant="warning" label="موجودی طلایی" :value="goldLabel(row)">
+
+        <MobileStatCard
+          v-for="entry in metalEntries(row)"
+          :key="entry.metal_id"
+          bordered
+          variant="warning"
+          :label="walletMetalBalanceTitle(entry.metal_id, entry.label)"
+          :value="entry.display"
+        >
           <template #prefix>
             <BaseIcon icon="vuesax-linear:coin" size="18" color="#b45309" />
           </template>
@@ -34,10 +42,14 @@ import MobileSheetHeader from '@/components/mobile/MobileSheetHeader.vue'
 import MobileStatCard from '@/components/mobile/MobileStatCard.vue'
 import { isMobile } from '@core/utils/is'
 import { usePrice } from '@core/utils/usePrice'
+import { walletMetalBalanceTitle } from '@/utils/adminMetalLabels'
+import { formatMetalDisplayValue, metalCellValue } from '@/utils/metalWeight'
+import type { WalletMetalColumn } from '../hooks/walletColumns'
 
 const props = defineProps<{
   visible: boolean
   item: Wallet | null
+  metals?: WalletMetalColumn[]
 }>()
 
 const emit = defineEmits<{
@@ -51,9 +63,20 @@ const visibleProxy = computed({
 
 const sheetTitle = computed(() => props.item?.customer?.name || `کیف پول #${props.item?.id ?? '-'}`)
 
-function goldLabel(row: Wallet) {
-  const gold = row.gold
-  if (gold == null) return '-'
-  return `${Number(Number(gold).toFixed(3))} گرم`
+function metalEntries(row: Wallet) {
+  const metals = props.metals?.length
+    ? props.metals
+    : [{ metal_id: 1, label: 'طلا' }]
+
+  return metals
+    .map((metal) => {
+      const value = metalCellValue(row as Record<string, unknown>, metal.metal_id)
+      return {
+        metal_id: metal.metal_id,
+        label: metal.label,
+        display: formatMetalDisplayValue(value, metal.metal_id)
+      }
+    })
+    .filter((entry) => metalCellValue(row as Record<string, unknown>, entry.metal_id) !== 0)
 }
 </script>

src/pages/menuPages/wallet/components/WalletMobileListItem.vue

@@ -11,9 +11,19 @@
           <span class="text-gray-500">ریال:</span>
           <span class="font-600 text-gray-900">{{ cashLabel }}</span>
         </span>
-        <span>
-          <span class="text-gray-500">طلا:</span>
-          <span class="font-700 text-gray-900">{{ goldLabel }}</span>
+        <span v-if="metalEntries.length === 1">
+          <span class="text-gray-500">{{ metalEntries[0].label }}:</span>
+          <span class="font-700 text-gray-900">{{ metalEntries[0].display }}</span>
+        </span>
+      </div>
+
+      <div
+        v-if="metalEntries.length > 1"
+        class="flex flex-wrap gap-x-3 gap-y-1 text-xs text-gray-600"
+      >
+        <span v-for="entry in metalEntries" :key="entry.metal_id">
+          <span class="text-gray-500">{{ entry.label }}:</span>
+          <span class="font-700 text-gray-900">{{ entry.display }}</span>
         </span>
       </div>
     </div>
@@ -24,9 +34,12 @@
 import type { Wallet } from '@/model/wallet'
 import MobileCard from '@/components/mobile/MobileCard.vue'
 import { usePrice } from '@core/utils/usePrice'
+import { formatMetalDisplayValue, metalCellValue } from '@/utils/metalWeight'
+import type { WalletMetalColumn } from '../hooks/walletColumns'
 
 const props = defineProps<{
   item: Wallet
+  metals?: WalletMetalColumn[]
 }>()
 
 defineEmits<{
@@ -35,9 +48,25 @@ defineEmits<{
 
 const customerName = computed(() => props.item.customer?.name || '-')
 const cashLabel = computed(() => usePrice(props.item.cash ?? 0, true, ''))
-const goldLabel = computed(() => {
-  const gold = props.item.gold
-  if (gold == null) return '-'
-  return `${Number(Number(gold).toFixed(3))} گرم`
+
+function metalValue(metalId: number): number {
+  return metalCellValue(props.item as Record<string, unknown>, metalId)
+}
+
+const metalEntries = computed(() => {
+  const metals = props.metals?.length
+    ? props.metals
+    : [{ metal_id: 1, label: 'طلا' }]
+
+  return metals
+    .map((metal) => {
+      const value = metalValue(metal.metal_id)
+      return {
+        metal_id: metal.metal_id,
+        label: metal.label,
+        display: formatMetalDisplayValue(value, metal.metal_id)
+      }
+    })
+    .filter((entry) => metalValue(entry.metal_id) !== 0)
 })
 </script>

src/pages/menuPages/wallet/components/table.vue

@@ -2,7 +2,7 @@
   <div class="h-full min-h-0">
     <BasicShowContext title="لیست کیف پول">
       <div class="flex h-full min-h-0 flex-col gap-3">
-        <div class="hidden shrink-0 md:grid md:grid-cols-1 md:gap-3 lg:grid-cols-2">
+        <div class="hidden shrink-0 md:grid md:grid-cols-1 md:gap-3 lg:grid-cols-2 xl:grid-cols-3">
           <div
             class="rounded-lg p-2.5 text-sm"
             :class="walletSumTone(sums?.cash)"
@@ -23,20 +23,22 @@
           </div>
 
           <div
+            v-for="metal in metalBalanceCards"
+            :key="metal.metal_id"
             class="rounded-lg p-2.5 text-sm"
-            :class="walletSumTone(sums?.gold)"
+            :class="walletSumTone(metal.gold)"
           >
-            <div class="mb-2 font-medium">مجموع موجودی کیف طلا</div>
+            <div class="mb-2 font-medium">{{ totalMetalWalletTitle(metal.metal_id, metal.label) }}</div>
             <div class="grid grid-cols-2 gap-2">
               <div class="stat-inner rounded-lg px-2 py-1.5 text-center">
-                <div class="text-xs text-gray-500">گرم</div>
+                <div class="text-xs text-gray-500">{{ metal.display_unit ?? metalDisplayUnit(metal.metal_id) }}</div>
                 <div class="mt-1 font-bold">
-                  {{ usePrice(sums?.gold ?? 0, true, 'گرم') }}
+                  {{ formatMetalDisplayValue(metal.gold ?? 0, metal.metal_id) }}
                 </div>
               </div>
               <div class="stat-inner rounded-lg px-2 py-1.5 text-center">
                 <div class="text-xs text-gray-500">ریال</div>
-                <div class="mt-1 font-bold break-all">{{ usePrice(sums?.goldToCash ?? 0) }}</div>
+                <div class="mt-1 font-bold break-all">{{ usePrice(metal.goldToCash ?? 0) }}</div>
               </div>
             </div>
           </div>
@@ -77,13 +79,16 @@ import type { TableInput } from '@core/type/baseTable'
 import useBaseTable from '@core/components/BaseTableOld/hooks/useBaseTable'
 import Icon from '@core/components/BaseIcon/src/Icon.vue'
 import { changeCustomerActivation } from '@/api/customer'
-import { cols } from '../hooks/walletColumns'
+import { buildWalletColumns } from '../hooks/walletColumns'
 import { usePrefix } from '@core/composable/usePrefix'
 import { message } from 'ant-design-vue'
 import { getWalletTable } from '@/api/wallet'
 import { usePrice } from '../../../../core/utils/usePrice'
 import WalletMobileCardList from './WalletMobileCardList.vue'
 import { isMobile } from '@core/utils/is'
+import { totalMetalWalletTitle } from '@/utils/adminMetalLabels'
+import type { WalletTableSums } from '@/model/wallet'
+import { formatMetalDisplayValue, metalDisplayUnit } from '@/utils/metalWeight'
 
 const [submit, reload] = useBaseTable()
 const mobileListRef = ref<null | { fetch: () => Promise<void> }>(null)
@@ -92,13 +97,38 @@ const emits = defineEmits(['delete', 'edit', 'add', 'info', 'sums'])
 const { prefixCls } = usePrefix('pophoverstatus')
 
 const table = ref(null)
-const sums = ref<any>()
+const sums = ref<WalletTableSums>()
+
+const metalBalanceCards = computed(() => {
+  if (sums.value?.metalBalances?.length) {
+    return sums.value.metalBalances
+  }
+
+  if (sums.value?.gold != null || sums.value?.goldToCash != null) {
+    return [
+      {
+        metal_id: 1,
+        label: 'طلا',
+        gold: sums.value.gold ?? 0,
+        goldToCash: sums.value.goldToCash ?? 0
+      }
+    ]
+  }
+
+  return []
+})
 
 const tblProps = ref<any>({
-  columns: cols,
+  columns: buildWalletColumns(),
   api: async (params: TableInput) => {
     const data = await getWalletTable(params)
     sums.value = data?.sums
+    const metals =
+      data?.sums?.metalBalances?.map((metal) => ({
+        metal_id: metal.metal_id,
+        label: metal.label
+      })) ?? []
+    tblProps.value.columns = buildWalletColumns(metals)
     emits('sums', data?.sums)
     return data
   }

src/pages/menuPages/wallet/hooks/walletColumns.tsx

@@ -1,157 +1,75 @@
 import type { BaseTableColumn } from '@core/type/baseTable'
-import { toJalaliNoTime, toTime } from '@core/utils/useDataTime'
-import CustomTag from '@/components/CustomTag.vue'
 import { usePrice } from '@core/utils/usePrice'
-/*import BudgetSelect from '@/components/BudgetSelect.vue'
-import { useStaticApiListsStore } from '@/store/staticApisStore'
-import type { FilterSelect } from '@/model/filterSelect'
-import type { DocItem } from '@/model/docType'*/
+import { metalLabel, walletMetalBalanceTitle } from '@/utils/adminMetalLabels'
+import { formatMetalDisplayValue, metalCellValue } from '@/utils/metalWeight'
 
-//define store
-//const store = useStaticApiListsStore()
-//document types
-/*let docTypes: DocItem[]*/
-/*onMounted(async () => {
-  docTypes = await store.readyDocTypeList()
-})
-const filteredDocTypes: FilterSelect = docTypes?.map((x: DocItem) => {
-  return {
-    label: x.title,
-    value: x.id
-  }
-})*/
+export type WalletMetalColumn = { metal_id: number; label: string; display_unit?: string }
 
-export const cols: BaseTableColumn[] = [
-  {
-    title: 'ردیف',
-    dataIndex: 'id',
-    key: 'id',
-    filterable: false,
-    sortable: false,
-    customRender: (record: any) => {
-      return record.index + 1
-    }
-  },
-  {
-    title: 'کد کیف پول',
-    dataIndex: 'id',
-    key: 'id',
-    type: 'Number'
-    // className: 'column-money'
-  },
-  {
-    title: 'نام مشتری',
-    dataIndex: 'customer.name',
-    key: 'customer.name',
-    type: 'Text'
-  },
-  {
-    title: 'موجودی کیف پول (ریال)',
-    dataIndex: 'cash',
-    key: 'cash',
-    type: 'Text',
-    customRender(data) {
-      return usePrice(data.record.cash, true, '')
-    }
-  },
-  {
-    title: 'موجودی کیف طلا (گرم)',
-    dataIndex: 'gold',
-    key: 'gold',
-    type: 'Text'
-  }
-  /*  {
-    title: 'شماره موبایل',
-    dataIndex: 'mobile',
-    key: 'mobile',
-    type: 'Number'
-  },*/
-  /*  {
-    title: 'نام فروشگاه',
-    dataIndex: 'shop_name',
-    key: 'shop_name',
-    type: 'Text'
-  },*/
-  /*  {
-    title: 'وضعیت',
-    dataIndex: 'active',
-    key: 'active',
-    customRender: ({ record }) => {
-      return record.active ? (
-        <div class="flex justify-center">
-          <CustomTag textColor="#25855A" bgColor="#E3F4E9">
-            فعال
-          </CustomTag>
-        </div>
-      ) : (
-        <div class="flex justify-center">
-          <CustomTag textColor="#C53030" bgColor="#FECACA">
-            غیر فعال
-          </CustomTag>
-        </div>
-      )
-    }
-  },*/
-  /*{
-      title: 'نقش',
-      dataIndex: 'user_type_record',
-      key: 'user_type_record',
-      type: 'Select',
+export function buildWalletColumns(metals: WalletMetalColumn[] = []): BaseTableColumn[] {
+  const baseColumns: BaseTableColumn[] = [
+    {
+      title: 'ردیف',
+      dataIndex: 'id',
+      key: 'id',
       filterable: false,
       sortable: false,
-      filterComponentProps: {
-        multiple: true
-      },
-      filterField: 'user_type_obj.id',
-      filterComponent: ReadyUserTypeSelect,
-      /!*      customRender: (record: any) => {
-        return record.record.user_type_record?.value
-      }*!/
-      customRender: ({ record }) => {
-        const items = record.is_admin ? (
-          <CustomTag textColor="#25855A" bgColor="#E3F4E9">
-            ادمین
-          </CustomTag>
-        ) : (
-          record.user_type_obj.map((item: { title: any }, index: any) => {
-            if (item) {
-              return (
-                <CustomTag textColor="#25855A" bgColor="#E3F4E9">
-                  {item?.title}
-                </CustomTag>
-              )
-            }
-          })
-        )
-        return <div class="flex justify-center items-center gap-2">{items}</div>
-      }
-    },
-    {
-      title: 'حوزه',
-      dataIndex: 'section',
-      key: 'section'
-    },
-    {
-      title: 'شماره موبایل',
-      dataIndex: 'mobile',
-      type: 'Number',
-      key: 'mobile'
-    },
-    {
-      title: 'تاریخ ثبت',
-      dataIndex: 'created_at',
-      key: 'created_at',
-      type: 'DateTime',
       customRender: (record: any) => {
-        return toJalaliNoTime(record.record.created_at)
+        return record.index + 1
       }
-    },*/
-  /*  {
-    title: 'عملیات',
-    dataIndex: 'action',
-    key: 'action',
-    slot: 'action',
-    fixed: 'right',
-    filterable: false
-  }*/
-]
+    },
+    {
+      title: 'کد کیف پول',
+      dataIndex: 'id',
+      key: 'id',
+      type: 'Number'
+    },
+    {
+      title: 'نام مشتری',
+      dataIndex: 'customer.name',
+      key: 'customer.name',
+      type: 'Text'
+    },
+    {
+      title: 'موجودی کیف پول (ریال)',
+      dataIndex: 'cash',
+      key: 'cash',
+      type: 'Text',
+      customRender(data) {
+        return usePrice(data.record.cash, true, '')
+      }
+    }
+  ]
+
+  if (metals.length === 0) {
+    return [
+      ...baseColumns,
+      {
+        title: metalLabel.goldWalletBalanceGram(),
+        dataIndex: 'gold',
+        key: 'gold',
+        type: 'Text',
+        customRender(data) {
+          const value = Number(data.record?.gold ?? 0)
+          return formatMetalDisplayValue(value, 1)
+        }
+      }
+    ]
+  }
+
+  const metalColumns: BaseTableColumn[] = metals.map((metal) => ({
+    title: walletMetalBalanceTitle(metal.metal_id, metal.label),
+    dataIndex: `metal_gold_${metal.metal_id}`,
+    key: `metal_${metal.metal_id}`,
+    type: 'Text',
+    customRender(data) {
+      const value = metalCellValue(data.record, metal.metal_id)
+      return formatMetalDisplayValue(value, metal.metal_id)
+    }
+  }))
+
+  return [...baseColumns, ...metalColumns]
+}
+
+export function getWalletColumns(): BaseTableColumn[] {
+  return buildWalletColumns()
+}

src/pages/menuPages/wallet/index.vue

@@ -15,57 +15,45 @@
             </div>
           </div>
           <div class="gap-5 text-xs">
-            <div>مجموع موجودی کیف طلا:</div>
+            <div>{{ metalLabel.totalGoldWallet() }}:</div>
             <div class="font-bold">{{ usePrice(sums?.gold ?? 0, true, 'گرم') }}</div>
           </div>
           <div class="gap-5 text-xs">
-            <div>مجموع موجودی کیف طلا:</div>
+            <div>{{ metalLabel.totalGoldWallet() }}:</div>
             <div class="font-bold">{{ usePrice(sums?.goldToCash ?? 0) }}</div>
           </div>
         </div>-->
         <div class="grid grid-cols-3 gap-1 text-xs">
           <div class="bg-blue-600 text-white rounded p-1">مجموع</div>
           <div class="bg-blue-600 text-white rounded p-1">ریال</div>
-          <div class="bg-blue-600 text-white rounded p-1">گرم</div>
-          <div class="bg-blue-600 text-white rounded p-1">کیف طلا</div>
-          <div
-            class="text-white rounded p-1"
-            :class="
-              sums?.goldToCash >= 0
-                ? sums?.goldToCash === 0
-                  ? 'bg-amber-600'
-                  : 'bg-green-600'
-                : 'bg-red-600'
-            "
-          >
-            {{ usePrice(sums?.goldToCash ?? 0, true, '') }}
-          </div>
-          <div
-            class="text-white rounded p-1"
-            :class="
-              sums?.gold >= 0 ? (sums?.gold === 0 ? 'bg-amber-600' : 'bg-green-600') : 'bg-red-600'
-            "
-          >
-            {{ usePrice(sums?.gold ?? 0, true, '') }}
-          </div>
+          <div class="bg-blue-600 text-white rounded p-1">وزن</div>
+
+          <template v-for="metal in mobileMetalRows" :key="`metal-${metal.metal_id}`">
+            <div class="bg-blue-600 text-white rounded p-1">{{ metal.label }}</div>
+            <div
+              class="text-white rounded p-1"
+              :class="sumToneClass(metal.goldToCash)"
+            >
+              {{ usePrice(metal.goldToCash ?? 0, true, '') }}
+            </div>
+            <div
+              class="text-white rounded p-1"
+              :class="sumToneClass(metal.gold)"
+            >
+              {{ formatMetalDisplayValue(metal.gold ?? 0, metal.metal_id) }}
+            </div>
+          </template>
+
           <div class="bg-blue-600 text-white rounded p-1">کیف پول</div>
           <div
             class="text-white rounded p-1"
-            :class="
-              sums?.cash >= 0 ? (sums?.cash === 0 ? 'bg-amber-600' : 'bg-green-600') : 'bg-red-600'
-            "
+            :class="sumToneClass(sums?.cash)"
           >
             {{ usePrice(sums?.cash ?? 0, true, '') }}
           </div>
           <div
             class="text-white rounded p-1"
-            :class="
-              sums?.cashToGold >= 0
-                ? sums?.cashToGold === 0
-                  ? 'bg-amber-600'
-                  : 'bg-green-600'
-                : 'bg-red-600'
-            "
+            :class="sumToneClass(sums?.cashToGold)"
           >
             {{ usePrice(sums?.cashToGold ?? 0, true, '') }}
           </div>
@@ -165,6 +153,8 @@ import type { Item } from '@/model/Item'
 import type { Customer } from '@/model/customer'
 import { createCustomer, deleteCustomer, updateCustomer } from '@/api/customer'
 import { usePrice } from '@core/utils/usePrice'
+import type { WalletTableSums } from '@/model/wallet'
+import { formatMetalDisplayValue } from '@/utils/metalWeight'
 
 //loading
 const loading = ref<boolean>(false)
@@ -172,7 +162,38 @@ const loading = ref<boolean>(false)
 //define store
 const store = useStaticApiListsStore()
 
-const sums = ref()
+const sums = ref<WalletTableSums>()
+
+const mobileMetalRows = computed(() => {
+  if (sums.value?.metalBalances?.length) {
+    return sums.value.metalBalances.map((metal) => ({
+      metal_id: metal.metal_id,
+      label: metal.label,
+      gold: metal.gold ?? 0,
+      goldToCash: metal.goldToCash ?? 0
+    }))
+  }
+
+  if (sums.value?.gold != null || sums.value?.goldToCash != null) {
+    return [
+      {
+        metal_id: 1,
+        label: 'طلا',
+        gold: sums.value.gold ?? 0,
+        goldToCash: sums.value.goldToCash ?? 0
+      }
+    ]
+  }
+
+  return []
+})
+
+function sumToneClass(value?: number) {
+  if (value == null || value >= 0) {
+    return value === 0 ? 'bg-amber-600' : 'bg-green-600'
+  }
+  return 'bg-red-600'
+}
 
 //define tbl
 const table = ref(null)