fixed ui and some bugs

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

@@ -1,18 +1,16 @@
 <template>
-  <MobileCard clickable @click="$emit('open', item)">
+  <MobileCard @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">{{ metalLabel.goldUnit() }}: <span class="font-600 text-gray-900">{{ goldLabel }}</span></span>
+      <div class="flex justify-between items-center gap-x-3 text-xs">
+        <div class="truncate text-sm font-700 text-gray-900">{{ customerName }}</div>
+        <div class="text-xs text-gray-400">{{ createdAtLabel }}</div>
+      </div>
+      <div v-if="item.note" class="text-xs text-gray-600">{{ item.note }}</div>
+      <div class="flex gap-3 text-xs">
+        <span class="text-gray-600">نقد: <span class="font-600 text-gray-900">{{ cashLabel }}</span></span>
+        <span class="text-gray-600">{{ metalLabel.goldUnit() }}: <span class="font-600 text-gray-900">{{ goldLabel }}</span></span>
       </div>
-
     </div>
-
-
   </MobileCard>
 </template>
 
@@ -23,15 +21,11 @@ import { toJalali } from '@core/utils/useDataTime'
 import { usePrice } from '@core/utils/usePrice'
 import { metalLabel } from '@/utils/adminMetalLabels'
 
-const props = defineProps<{
-  item: TotalAccounting
-}>()
+const props = defineProps<{ item: TotalAccounting }>()
 
-defineEmits<{
-  (e: 'open', item: TotalAccounting): void
-}>()
+defineEmits<{ (e: 'open', item: TotalAccounting): void }>()
 
-const customerToName = computed(() => props.item.customer_to?.name || '-')
+const customerName = 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} گرم`)