change responsive]

2026-05-31 11:51:52 +03:30
parent 06568c5858
commit 023b8ee5be
124 changed files with 6296 additions and 4233 deletions
@@ -0,0 +1,119 @@
+<template>
+  <MobileDetailSheet v-model:visible="visibleProxy" :item="item" :title="item?.name || ''">
+    <template #default="{ item: row }">
+      <MobileSheetHeader :title="row.name || '-'" :show-title="isMobile">
+        <template #actions>
+          <MobileIconButton plain icon="vuesax-linear:archive-tick" color="#e3bf00" :size="22" @click="$emit('archive', row)" />
+          <MobileIconButton
+            plain
+            :icon="row.active ? 'vuesax-linear:user-tick' : 'vuesax-linear:user-remove'"
+            :color="row.active ? '#54AD06' : '#ad0627'"
+            :size="22"
+            @click="$emit('toggleActive', row)"
+          />
+          <MobileIconButton plain icon="vuesax-linear:wallet-add" color="#9333ea" :size="22" @click="$emit('chargeMoney', row)" />
+          <MobileIconButton plain icon="vuesax-linear:wallet-money" color="#ea580c" :size="22" @click="$emit('chargeGold', row)" />
+          <MobileIconButton
+            plain
+            :icon="row.trade_active ? 'vuesax-linear:box-tick' : 'vuesax-linear:box-remove'"
+            :color="row.trade_active ? '#54AD06' : '#ad0627'"
+            :size="22"
+            @click="$emit('toggleTrade', row)"
+          />
+          <MobileIconButton
+            v-if="!(row as any).is_legal"
+            plain
+            icon="vuesax-linear:user-search"
+            color="#0d9488"
+            :size="22"
+            @click="$emit('confirmUser', row)"
+          />
+        </template>
+      </MobileSheetHeader>
+
+      <div class="space-y-2">
+        <MobileStatCard bordered variant="success" label="موجودی طلایی" :value="`${goldBalance(row)} گرم`">
+          <template #prefix>
+            <BaseIcon icon="vuesax-linear:coin" size="18" color="#15803d" />
+          </template>
+        </MobileStatCard>
+        <MobileStatCard
+          bordered
+          variant="success"
+          label="موجودی ریالی"
+          :value="usePrice(cashBalance(row), true, '')"
+        >
+          <template #prefix>
+            <BaseIcon icon="vuesax-linear:empty-wallet" size="18" color="#15803d" />
+          </template>
+        </MobileStatCard>
+      </div>
+
+      <MobileInfoGrid>
+        <MobileDetailRow label="وضعیت کاربر" full-width :value-class="row.active ? 'text-green-700' : 'text-red-600'">
+          {{ row.active ? 'فعال' : 'غیرفعال' }}
+        </MobileDetailRow>
+        <MobileDetailRow
+          label="وضعیت سفارش دهی"
+          full-width
+          :value-class="row.trade_active ? 'text-green-700' : 'text-red-600'"
+        >
+          {{ row.trade_active ? 'مجاز' : 'غیر مجاز' }}
+        </MobileDetailRow>
+        <MobileDetailRow label="کد کاربری" :value="row.id ?? '-'" />
+        <MobileDetailRow label="نوع کاربر" :value="row.type_str || '-'" />
+        <MobileDetailRow label="کد معرف" :value="row.referral_id ?? '-'" />
+        <MobileDetailRow label="نام معرف کاربر" :value="row.referral?.name ?? '-'" />
+        <MobileDetailRow label="گنج (گرم)" :value="row.gold ?? '-'" />
+        <MobileDetailRow label="آخرین بازدید" :value="lastSeen(row)" value-class="text-xs" />
+      </MobileInfoGrid>
+    </template>
+  </MobileDetailSheet>
+</template>
+
+<script setup lang="ts">
+import type { Customer } from '@/model/customer'
+import MobileDetailRow from '@/components/mobile/MobileDetailRow.vue'
+import MobileStatCard from '@/components/mobile/MobileStatCard.vue'
+import MobileDetailSheet from '@/components/mobile/MobileDetailSheet.vue'
+import MobileIconButton from '@/components/mobile/MobileIconButton.vue'
+import MobileInfoGrid from '@/components/mobile/MobileInfoGrid.vue'
+import MobileSheetHeader from '@/components/mobile/MobileSheetHeader.vue'
+import { getCashBalance, getGoldBalance } from '@/components/mobile/utils/wallet'
+import { isMobile } from '@core/utils/is'
+import { toJalali } from '@core/utils/useDataTime'
+import { usePrice } from '@core/utils/usePrice'
+
+const props = defineProps<{
+  visible: boolean
+  item: Customer | null
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:visible', value: boolean): void
+  (e: 'info', item: Customer): void
+  (e: 'archive', item: Customer): void
+  (e: 'toggleActive', item: Customer): void
+  (e: 'chargeMoney', item: Customer): void
+  (e: 'chargeGold', item: Customer): void
+  (e: 'toggleTrade', item: Customer): void
+  (e: 'confirmUser', item: Customer): void
+}>()
+
+const visibleProxy = computed({
+  get: () => props.visible,
+  set: (value: boolean) => emit('update:visible', value)
+})
+
+function cashBalance(row: Customer) {
+  return getCashBalance(row.wallet)
+}
+
+function goldBalance(row: Customer) {
+  return getGoldBalance(row.wallet)
+}
+
+function lastSeen(row: Customer) {
+  return row.last_seen_at ? toJalali(row.last_seen_at) : '-'
+}
+</script>