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

<script setup lang="ts">
import { computed, onMounted, ref } from 'vue';
import axios from 'axios';
import {
  Alert as AAlert,
  Button as AButton,
  Card as ACard,
  Col as ACol,
  Divider as ADivider,
  Empty as AEmpty,
  Flex as AFlex,
  Form as AForm,
  FormItem as AFormItem,
  Input as AInput,
  List as AList,
  Row as ARow,
  Select as ASelect,
  Typography,
  message,
} from 'ant-design-vue';
import { api } from '@/lib/api';
import type {
  FinancialAccountDto,
  FinancialCategoryDto,
  FinancialDocumentDto,
  FinancialPartyKind,
  TreasuryPartyBalanceDto,
} from '@mento/shared';
import MoneyInput from '@/components/MoneyInput.vue';
import TreasuryPartyBalanceTable from '@/components/treasury/TreasuryPartyBalanceTable.vue';
import TreasuryPartySelect from '@/components/treasury/TreasuryPartySelect.vue';
import { useSettleDefault } from '@/components/treasury/useSettleDefault';
import { toman } from './treasury-format';
import { parseMoneyNumber } from '@/lib/money';

const { Text: ATypographyText } = Typography;
const AListItem = AList.Item;
const AListItemMeta = AList.Item.Meta;
const ASelectOption = ASelect.Option;

const kind = 'expense' as const;
const rows = ref<FinancialDocumentDto[]>([]);
const balances = ref<TreasuryPartyBalanceDto[]>([]);
const categories = ref<FinancialCategoryDto[]>([]);
const accounts = ref<FinancialAccountDto[]>([]);
const error = ref('');
const ok = ref('');
const saving = ref(false);
const q = ref('');
const form = ref({
  title: '',
  amount: '',
  categoryId: '',
  partyKind: undefined as FinancialPartyKind | undefined,
  partyId: undefined as string | undefined,
  accountId: '',
  settleAmount: '',
  method: 'transfer',
  notes: '',
});
const settleMirror = useSettleDefault(form);

const settleLabel = 'مبلغ پرداخت‌شده';
const statusLabel: Record<string, string> = {
  open: 'پرداخت‌نشده',
  partial: 'جزئی',
  settled: 'پرداخت‌شده',
  void: 'باطل‌شده',
};

const methodOptions = [
  { value: 'cash', label: 'نقدی' },
  { value: 'card_to_card', label: 'کارت‌به‌کارت' },
  { value: 'pos', label: 'کارت‌خوان' },
  { value: 'transfer', label: 'حواله' },
  { value: 'other', label: 'سایر' },
];

function apiMessage(e: unknown) {
  if (!axios.isAxiosError(e)) return 'ذخیره ناموفق بود.';
  const msg = (e.response?.data as { message?: string | string[] })?.message;
  return Array.isArray(msg) ? msg.join('، ') : msg || 'ذخیره ناموفق بود.';
}

function docLine(item: FinancialDocumentDto) {
  const parts = [
    item.reference ? `پیگیری ${item.reference}` : '',
    item.partyName || 'بدون طرف حساب',
    statusLabel[item.status] ?? item.status,
    `مانده ${toman(item.remaining)}`,
  ].filter(Boolean);
  if (item.categoryName) parts.push(item.categoryName);
  return parts.join(' · ');
}

async function load() {
  const [docs, cats, acc, bals] = await Promise.all([
    api.get<FinancialDocumentDto[]>('/treasury/documents', { params: { kind, q: q.value || undefined } }),
    api.get<FinancialCategoryDto[]>('/treasury/categories', { params: { kind } }).catch((e: unknown) => {
      if (axios.isAxiosError(e) && (e.response?.status === 403 || e.response?.status === 404)) {
        return { data: [] as FinancialCategoryDto[] };
      }
      throw e;
    }),
    api.get<FinancialAccountDto[]>('/treasury/accounts').catch((e: unknown) => {
      if (axios.isAxiosError(e) && (e.response?.status === 403 || e.response?.status === 404)) {
        return { data: [] as FinancialAccountDto[] };
      }
      throw e;
    }),
    api.get<TreasuryPartyBalanceDto[]>('/treasury/party-balances', { params: { kind } }).catch((e: unknown) => {
      if (axios.isAxiosError(e) && e.response?.status === 404) return { data: [] as TreasuryPartyBalanceDto[] };
      throw e;
    }),
  ]);
  rows.value = docs.data;
  balances.value = bals.data;
  categories.value = cats.data.filter((row) => row.isActive);
  accounts.value = acc.data.filter((row) => row.isActive);
}

function onFinishFailed() {
  message.warning('لطفاً فیلدهای الزامی را کامل کنید.');
}

async function createDoc() {
  saving.value = true;
  error.value = '';
  ok.value = '';
  try {
    const amount = parseMoneyNumber(String(form.value.amount ?? ''), 0);
    if (amount == null || amount <= 0) {
      error.value = 'مبلغ کل معتبر نیست.';
      return;
    }
    if (!form.value.partyKind || (form.value.partyKind !== 'other' && !form.value.partyId)) {
      error.value = 'طرف حساب را انتخاب کنید.';
      return;
    }
    const settleAmount = parseMoneyNumber(String(form.value.settleAmount ?? ''), 0) ?? 0;
    if (form.value.partyKind === 'other' && settleAmount !== amount) {
      error.value = 'برای سایر، مبلغ پرداخت‌شده باید با مبلغ کل یکی باشد.';
      return;
    }
    const partyKey =
      form.value.partyKind && form.value.partyKind !== 'other' && form.value.partyId
        ? `${form.value.partyKind}:${form.value.partyId}`
        : '';
    const openBalance = partyKey
      ? Number(
          balances.value.find((row) => row.key === partyKey)?.documentRemaining ||
            balances.value.find((row) => row.key === partyKey)?.remaining ||
            0,
        )
      : 0;
    const collectsBalance =
      Boolean(partyKey) && settleAmount === amount && settleAmount > 0 && openBalance > 0;
    const { data } = await api.post<FinancialDocumentDto>('/treasury/documents', {
      kind,
      title: form.value.title,
      amount,
      categoryId: form.value.categoryId || null,
      partyKind: form.value.partyKind,
      personId: form.value.partyKind === 'person' ? form.value.partyId : null,
      companyId: form.value.partyKind === 'company' ? form.value.partyId : null,
      userId: form.value.partyKind === 'user' ? form.value.partyId : null,
      accountId: form.value.accountId || null,
      settleAmount,
      method: form.value.method,
      notes: form.value.notes || null,
    });
    settleMirror.reset();
    form.value = {
      title: '',
      amount: '',
      categoryId: '',
      partyKind: undefined,
      partyId: undefined,
      accountId: '',
      settleAmount: '',
      method: 'transfer',
      notes: '',
    };
    ok.value = collectsBalance
      ? `${toman(settleAmount)} از ماندهٔ طرف حساب کم شد.`
      : data.reference
        ? `سند ثبت شد. شماره پیگیری: ${data.reference}`
        : 'سند ثبت شد.';
    await load();
  } catch (e) {
    error.value = apiMessage(e);
  } finally {
    saving.value = false;
  }
}

const partyRules = [
  {
    validator: async () => {
      if (!form.value.partyKind) throw new Error('طرف حساب الزامی است');
      if (form.value.partyKind !== 'other' && !form.value.partyId) {
        throw new Error('طرف حساب را انتخاب کنید');
      }
    },
  },
];

const partyRemainingLabel = computed(() => {
  const kind = form.value.partyKind;
  const id = form.value.partyId;
  if (!kind || kind === 'other' || !id) return '';
  const row = balances.value.find((item) => item.key === `${kind}:${id}`);
  return `مانده ${toman(row?.remaining || 0)}`;
});

async function voidDoc(id: string) {
  if (!window.confirm('این سند و گردش متصل به آن باطل شود؟')) return;
  try {
    await api.post(`/treasury/documents/${id}/void`, { reason: 'ابطال توسط مدیر' });
    await load();
  } catch (e) {
    error.value = apiMessage(e);
  }
}

onMounted(() => {
  void load().catch(() => {
    error.value = 'بارگذاری ناموفق بود.';
  });
});
</script>

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

      <a-card :bordered="false">
        <a-divider orientation="right">سند جدید</a-divider>
        <a-form
          layout="vertical"
          :model="form"
          @finish="createDoc"
          @finishFailed="onFinishFailed"
        >
          <a-row :gutter="[16, 0]">
            <a-col :xs="24" :md="12">
              <a-form-item label="طرف حساب" name="partyKind" :rules="partyRules">
                <a-row :gutter="8" align="middle">
                  <a-col :span="partyRemainingLabel ? 16 : 24">
                    <TreasuryPartySelect v-model:kind="form.partyKind" v-model:party-id="form.partyId" />
                  </a-col>
                  <a-col v-if="partyRemainingLabel" :span="8">
                    <a-typography-text type="secondary">{{ partyRemainingLabel }}</a-typography-text>
                  </a-col>
                </a-row>
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="12">
              <a-form-item
                label="عنوان"
                name="title"
                :rules="[{ required: true, message: 'عنوان الزامی است' }]"
              >
                <a-input v-model:value="form.title" />
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="8">
              <a-form-item
                label="مبلغ کل"
                name="amount"
                :rules="[{ required: true, message: 'مبلغ الزامی است' }]"
              >
                <MoneyInput addon-after="تومان" v-model="form.amount" :decimals="0" />
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="8">
              <a-form-item :label="settleLabel" name="settleAmount">
                <MoneyInput addon-after="تومان" v-model="form.settleAmount" :decimals="0" :disabled="form.partyKind === 'other'" />
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="8">
              <a-form-item label="دسته‌بندی" name="categoryId">
                <a-select show-search option-filter-prop="label"
                  v-model:value="form.categoryId"
                  allow-clear
                  style="width: 100%"
                  placeholder="بدون دسته"
                >
                  <a-select-option v-for="cat in categories" :key="cat.id" :value="cat.id" :label="cat.name">
                    {{ cat.name }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="8">
              <a-form-item label="حساب" name="accountId">
                <a-select show-search option-filter-prop="label"
                  v-model:value="form.accountId"
                  allow-clear
                  style="width: 100%"
                  placeholder="انتخاب حساب"
                >
                  <a-select-option v-for="account in accounts" :key="account.id" :value="account.id" :label="account.name">
                    {{ account.name }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :xs="24" :md="8">
              <a-form-item label="روش" name="method">
                <a-select show-search option-filter-prop="label" v-model:value="form.method" style="width: 100%">
                  <a-select-option v-for="opt in methodOptions" :key="opt.value" :value="opt.value" :label="opt.label">
                    {{ opt.label }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-button type="primary" html-type="submit" :loading="saving">ثبت</a-button>
        </a-form>

        <a-divider orientation="right">مانده پرداختنی</a-divider>
        <TreasuryPartyBalanceTable :rows="balances" settled-label="پرداخت‌شده" />

        <a-divider orientation="right">فهرست اسناد</a-divider>
        <a-form layout="vertical">
          <a-row :gutter="[16, 0]">
            <a-col :xs="24" :md="12">
              <a-form-item label="جستجو">
                <a-input
                  v-model:value="q"
                  allow-clear
                  placeholder="عنوان یا شماره پیگیری"
                  @press-enter="load"
                  @change="load"
                />
              </a-form-item>
            </a-col>
          </a-row>
        </a-form>

        <a-empty v-if="!rows.length" description="سندی نیست." />
        <a-list v-else item-layout="horizontal" :data-source="rows">
          <template #renderItem="{ item }">
            <a-list-item>
              <template #actions>
                <a-typography-text strong>{{ toman(item.amount) }}</a-typography-text>
                <a-button
                  v-if="item.status !== 'void'"
                  type="link"
                  danger
                  @click="voidDoc(item.id)"
                >
                  ابطال
                </a-button>
              </template>
              <a-list-item-meta>
                <template #title>{{ item.title }}</template>
                <template #description>{{ docLine(item) }}</template>
              </a-list-item-meta>
            </a-list-item>
          </template>
        </a-list>
      </a-card>
  </a-flex>
</template>