change responsive]

src/pages/menuPages/accounting/components/AccountingMobileListItem.vue

@@ -0,0 +1,37 @@
+<template>
+  <MobileCard clickable @click="$emit('open', item)">
+    <div class="space-y-1">
+      <div>
+        <div class="flex justify-between items-center gap-x-3 gap-y-1 text-xs">
+          <div class="truncate text-sm font-700 text-gray-900">{{ customerToName }}</div>
+          <div class="text-xs text-gray-400">{{ createdAtLabel }}</div>
+        </div>
+        <span class="text-xs text-gray-600">نقد: <span class="font-600 text-gray-900">{{ cashLabel }}</span></span>
+        <span class="text-xs text-gray-600">طلا: <span class="font-600 text-gray-900">{{ goldLabel }}</span></span>
+      </div>
+
+    </div>
+
+
+  </MobileCard>
+</template>
+
+<script setup lang="ts">
+import type { TotalAccounting } from '@/model/accounting'
+import MobileCard from '@/components/mobile/MobileCard.vue'
+import { toJalali } from '@core/utils/useDataTime'
+import { usePrice } from '@core/utils/usePrice'
+
+const props = defineProps<{
+  item: TotalAccounting
+}>()
+
+defineEmits<{
+  (e: 'open', item: TotalAccounting): void
+}>()
+
+const customerToName = computed(() => props.item.customer_to?.name || '-')
+const createdAtLabel = computed(() => (props.item.created_at ? toJalali(props.item.created_at) : '-'))
+const cashLabel = computed(() => usePrice(props.item.cash ?? 0, true, ''))
+const goldLabel = computed(() => `${props.item.gold ?? 0} گرم`)
+</script>