added charge for all products 2

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

@@ -132,10 +132,12 @@
       :showButton="false"
       @close="userInfoVisible = false"
     >
-      <div v-if="isMobile" class="mb-3 text-base font-700">اطلاعات کاربر</div>
       <a-tabs v-if="userInfo" v-model:activeKey="activeKey">
         <a-tab-pane key="اطلاعات جامع" tab="اطلاعات جامع">
-          <div class="space-y-2">
+          <div
+            class="grid min-w-0 grid-cols-1 items-start gap-3 lg:grid-cols-[minmax(17rem,21rem)_minmax(0,1fr)] xl:grid-cols-[minmax(18rem,23rem)_minmax(0,1fr)]"
+          >
+            <div class="min-w-0 space-y-2 lg:order-2">
             <div class="admin-stat-muted rounded-lg w-full flex flex-col gap-3 p-3 md:flex-row md:justify-between">
               <div>
                 <div class="font-bold">{{ userInfo.name }}</div>
@@ -172,7 +174,7 @@
               </div>
             </div>
 
-            <div class="grid grid-cols-2 gap-2 md:grid-cols-4">
+            <div class="grid min-w-0 grid-cols-2 gap-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
               <BasicInfoItem title="کد کاربری" :value="userInfo?.id" />
               <BasicInfoItem title="نوع کاربر" :value="userInfo?.type_str" />
               <BasicInfoItem
@@ -215,7 +217,26 @@
               </BasicInfoItem>
             </div>
 
-            <CustomerWalletBalancePanel v-if="userInfo?.id" :customer-id="userInfo.id" class="mt-2" />
+            <CustomerWalletBalancePanel
+              v-if="userInfo?.id && isMobile"
+              :customer-id="userInfo.id"
+              compact
+              :charge-targets="infoChargeTargets"
+              :interactive="false"
+              class="mt-2"
+            />
+            </div>
+
+            <aside
+              v-if="userInfo?.id && !isMobile"
+              class="surface-muted min-w-0 rounded-xl border border-base p-2.5 lg:order-1 lg:sticky lg:top-0"
+            >
+              <CustomerWalletBalancePanel
+                :customer-id="userInfo.id"
+                layout="sidebar"
+                :interactive="false"
+              />
+            </aside>
           </div>
         </a-tab-pane>
         <a-tab-pane key="لیست سفارشات" tab="لیست سفارشات">
@@ -283,6 +304,8 @@ import Icon from '@core/components/BaseIcon/src/Icon.vue'
 import { isMobile } from '@core/utils/is'
 import WalletChargeModal from './components/WalletChargeModal.vue'
 import CustomerWalletBalancePanel from '@/components/customer/CustomerWalletBalancePanel.vue'
+import { getChargeTargets } from '@/api/wallet'
+import type { ChargeTarget } from '@/model/wallet'
 import { metalLabel } from '@/utils/adminMetalLabels'
 import type { DashboardHelp } from '@/pages/dashboard/dashboardSectionCopy'
 import DashboardLabelWithHelp from '@/pages/dashboard/components/DashboardLabelWithHelp.vue'
@@ -482,6 +505,7 @@ async function info(val: Customer) {
   activeKey.value = 'اطلاعات جامع'
   userInfo.value = cloneDeep(val)
   userInfoVisible.value = true
+  void loadInfoChargeTargets()
   await nextTick(() => {
     loading.value = true
     refreshFundTable()
@@ -551,6 +575,17 @@ onMounted(async () => {
 //add project modal
 const addUserVisible = ref<boolean>(false)
 const userInfoVisible = ref<boolean>(false)
+const infoChargeTargets = ref<ChargeTarget[]>([])
+
+async function loadInfoChargeTargets() {
+  if (!isMobile.value) return
+  try {
+    const res = await getChargeTargets()
+    infoChargeTargets.value = res?.targets ?? []
+  } catch {
+    infoChargeTargets.value = []
+  }
+}
 const userInfo = ref<Customer>()
 
 //submit user