boursecu_admin/src/pages/menuPages/accounting/components/PargarMobileDetailSheet.vue

<template>
  <MobileDetailSheet v-model:visible="visibleProxy" :item="item" :title="sheetTitle">
    <template #default="{ item: row }">
      <MobileSheetHeader :title="sheetTitle" :show-title="isMobile">
        <template #actions>
          <MobileIconButton
            v-if="!row.pargar_ref && !row.customer?.pargar_account_id"
            plain
            icon="vuesax-linear:profile-add"
            color="#7C3AED"
            :size="22"
            @click="$emit('register-customer', row)"
          />
          <MobileIconButton
            v-if="canRetry(row)"
            plain
            icon="vuesax-linear:refresh-circle"
            color="#CA8A04"
            :size="22"
            @click="$emit('retry', row)"
          />
        </template>
      </MobileSheetHeader>

      <MobileInfoGrid>
        <MobileDetailRow label="شناسه" :value="row.id" />
        <MobileDetailRow label="مشتری" :value="row.customer?.name || '-'" />
        <MobileDetailRow label="موبایل" :value="row.customer?.mobile || '-'" />
        <MobileDetailRow label="نوع" :value="row.type || '-'" />
        <MobileDetailRow label="مقدار" :value="row.amount ?? '-'" />
        <MobileDetailRow label="شرح" full-width :value="row.desc || '-'" />
        <MobileDetailRow label="وضعیت" :value="pargarStatusLabel(row.sync_status, row.pargar_ref, row.desc)" />
        <MobileDetailRow label="کد پرگار" :value="row.pargar_ref || '-'" />
        <MobileDetailRow label="زمان" :value="row.created_at ? toJalali(row.created_at) : '-'" />
        <MobileDetailRow v-if="row.res" label="پاسخ API" full-width :value="row.res" />
      </MobileInfoGrid>

      <div
        v-if="row.sync_log"
        class="mt-3 rounded-lg bg-red-50 p-3 text-sm text-red-700 whitespace-pre-wrap"
      >
        {{ row.sync_log }}
      </div>
    </template>
  </MobileDetailSheet>
</template>

<script setup lang="ts">
import type { PargarRecord } from '@/api/pargar'
import MobileDetailRow from '@/components/mobile/MobileDetailRow.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 { canRetryPargar, pargarStatusLabel } from '@/pages/menuPages/accounting/utils/pargarStatus'
import { isMobile } from '@core/utils/is'
import { toJalali } from '@core/utils/useDataTime'

const props = defineProps<{
  visible: boolean
  item: PargarRecord | null
}>()

const emit = defineEmits<{
  (e: 'update:visible', value: boolean): void
  (e: 'retry', item: PargarRecord): void
  (e: 'register-customer', item: PargarRecord): void
}>()

const visibleProxy = computed({
  get: () => props.visible,
  set: (value: boolean) => emit('update:visible', value)
})

const sheetTitle = computed(() => props.item?.customer?.name || 'سند پرگار')

function canRetry(row: PargarRecord) {
  return canRetryPargar(row)
}
</script>