CRM_Montzar/apps/web/src/views/treasury/TreasuryAuditView.vue

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import {
  Alert as AAlert,
  Card as ACard,
  Empty as AEmpty,
  Flex as AFlex,
  List as AList,
  Typography,
} from 'ant-design-vue';
import { api } from '@/lib/api';
import { formatJalaliNumeric } from '@/lib/jalali';

const { Paragraph: ATypographyParagraph } = Typography;
const AListItem = AList.Item;
const AListItemMeta = AList.Item.Meta;

type Row = {
  id: string;
  action: string;
  entityType: string;
  createdAt: string;
  before: unknown;
  after: unknown;
};

const rows = ref<Row[]>([]);
const error = ref('');
const actionLabel: Record<string, string> = {
  settle: 'تسویه سند',
  cash_post: 'نشستن وجه در حساب',
};

onMounted(async () => {
  try {
    const { data } = await api.get<Row[]>('/treasury/audit');
    rows.value = data;
  } catch {
    error.value = 'سوابق بارگذاری نشد.';
  }
});
</script>

<template>
  <a-flex vertical :gap="16">
      <a-alert v-if="error" type="error" show-icon :message="error" />

      <a-card :bordered="false">
        <a-empty v-if="!error && !rows.length" description="سابقه‌ای نیست." />
        <a-list v-else item-layout="vertical" :data-source="rows">
          <template #renderItem="{ item }">
            <a-list-item>
              <a-list-item-meta>
                <template #title>
                  {{ actionLabel[item.action] ?? item.action }}
                </template>
                <template #description>
                  {{ formatJalaliNumeric(new Date(item.createdAt)) }}
                </template>
              </a-list-item-meta>
              <a-typography-paragraph
                :copyable="true"
                :style="{ marginBottom: 0, whiteSpace: 'pre-wrap', fontFamily: 'inherit' }"
              >
                {{ JSON.stringify(item.after ?? item.before, null, 2) }}
              </a-typography-paragraph>
            </a-list-item>
          </template>
        </a-list>
      </a-card>
  </a-flex>
</template>