feat(tahesab): PDF invoice export for asnad cards

Add per-document PDF print from account details, plus org invoice settings for logo and texts separate from CRM invoices.

apps/web/src/components/person-assets/PersonAssetsPanel.vue

@@ -15,12 +15,17 @@ import type {
   PersonAccountingLinkDto,
   PersonAssetsDto,
   TahesabConnectionDto,
+  TahesabInvoiceSettingsDto,
   TahesabSanadType,
 } from '@mento/shared';
 import { TAHSAB_SANAD_LABELS } from '@/lib/tahesab';
+import { printTahesabInvoicePdf } from '@/lib/tahesab-invoice-pdf';
+import TahesabInvoiceSettingsModal from '@/components/person-assets/TahesabInvoiceSettingsModal.vue';
 
 const props = defineProps<{
   personId: string;
+  /** نام نمایشی مشتری برای فاکتور PDF */
+  personName?: string;
 }>();
 
 const emit = defineEmits<{
@@ -37,6 +42,8 @@ const assets = ref<PersonAssetsDto | null>(null);
 const activeTab = ref<'مانده حساب' | 'جزئیات حساب' | 'ثبت سند'>('مانده حساب');
 const asnadLoading = ref(false);
 const asnadItems = ref<Record<string, unknown>[]>([]);
+const invoiceSettingsOpen = ref(false);
+const invoiceSettings = ref<TahesabInvoiceSettingsDto | null>(null);
 /** مدل JalaliDateInput = تاریخ محلی میلادی YYYY-MM-DD */
 const fromDate = ref('');
 const toDate = ref('');
@@ -383,6 +390,38 @@ async function refreshAssets() {
   }
 }
 
+async function loadInvoiceSettings() {
+  try {
+    const { data } = await api.get<TahesabInvoiceSettingsDto>(
+      '/integrations/tahesab/invoice-settings',
+    );
+    invoiceSettings.value = data;
+  } catch {
+    invoiceSettings.value = null;
+  }
+}
+
+function onInvoiceSettingsSaved(dto: TahesabInvoiceSettingsDto) {
+  invoiceSettings.value = dto;
+}
+
+async function exportAsnadPdf(g: {
+  no: string;
+  date: string;
+  rows: Record<string, unknown>[];
+}) {
+  error.value = '';
+  if (!invoiceSettings.value) {
+    await loadInvoiceSettings();
+  }
+  printTahesabInvoicePdf({
+    group: g,
+    settings: invoiceSettings.value,
+    customerName: props.personName?.trim() || 'مشتری',
+    moshtariCode: currentLink.value?.moshtariCode ?? null,
+  });
+}
+
 async function loadAsnad() {
   if (!connectionId.value || !currentLink.value) return;
   const from = toShamsiYmd(fromDate.value);
@@ -394,22 +433,26 @@ async function loadAsnad() {
   asnadLoading.value = true;
   error.value = '';
   try {
-    const { data } = await api.get<{ items: Record<string, unknown>[] }>(
-      `/integrations/tahesab/people/${props.personId}/asnad`,
-      {
-        params: {
-          connectionId: connectionId.value,
-          from,
-          to,
+    const [{ data }] = await Promise.all([
+      api.get<{ items: Record<string, unknown>[] }>(
+        `/integrations/tahesab/people/${props.personId}/asnad`,
+        {
+          params: {
+            connectionId: connectionId.value,
+            from,
+            to,
+          },
+          timeout: 60_000,
         },
-        timeout: 60_000,
-      },
-    );
+      ),
+      loadInvoiceSettings(),
+    ]);
     asnadItems.value = data.items ?? [];
     ok.value = asnadItems.value.length
       ? `${asnadItems.value.length} سند نمایش داده شد.`
       : 'در این بازه سندی یافت نشد.';
   } catch (e) {
+    asnadItems.value = [];
     error.value = axios.isAxiosError(e)
       ? String(
           (e.response?.data as { message?: string })?.message ??
@@ -715,6 +758,9 @@ onMounted(async () => {
             <button type="button" class="btn" :disabled="asnadLoading" @click="loadAsnad">
               {{ asnadLoading ? '…' : 'نمایش اسناد' }}
             </button>
+            <button type="button" class="btn ghost" @click="invoiceSettingsOpen = true">
+              تنظیمات فاکتور
+            </button>
           </div>
           <div v-if="asnadItems.length" class="view-bar">
             <span class="muted">
@@ -748,6 +794,14 @@ onMounted(async () => {
                   <strong>سند شماره {{ showRaw(g.no) }}</strong>
                   <span v-if="g.rows[0]?.isSanadMovaghat === true" class="inv-badge">موقت</span>
                   <span class="sg-count">{{ g.rows.length.toLocaleString('fa-IR') }} ردیف</span>
+                  <button
+                    type="button"
+                    class="btn inv-pdf-btn"
+                    title="خروجی فاکتور PDF"
+                    @click="exportAsnadPdf(g)"
+                  >
+                    خروجی فاکتور PDF
+                  </button>
                 </div>
                 <dl class="inv-meta">
                   <div>
@@ -954,6 +1008,11 @@ onMounted(async () => {
         </form>
       </template>
     </template>
+
+    <TahesabInvoiceSettingsModal
+      v-model:open="invoiceSettingsOpen"
+      @saved="onInvoiceSettingsSaved"
+    />
   </div>
 </template>
 
@@ -1195,9 +1254,15 @@ onMounted(async () => {
 .inv-title {
   display: flex;
   align-items: center;
+  flex-wrap: wrap;
   gap: 0.5rem;
   font-size: 0.95rem;
 }
+.inv-pdf-btn {
+  margin-inline-start: auto;
+  font-size: 0.8rem;
+  padding: 0.3rem 0.65rem;
+}
 .inv-badge {
   font-size: 0.72rem;
   padding: 0.1rem 0.45rem;

apps/web/src/components/person-assets/TahesabInvoiceSettingsModal.vue

@@ -0,0 +1,305 @@
+<script setup lang="ts">
+import { onMounted, ref, watch } from 'vue';
+import axios from 'axios';
+import { api } from '@/lib/api';
+import type { TahesabInvoiceSettingsDto } from '@mento/shared';
+import { useEscClose } from '@/lib/modal-stack';
+
+const props = defineProps<{ open: boolean }>();
+const emit = defineEmits<{
+  'update:open': [value: boolean];
+  saved: [value: TahesabInvoiceSettingsDto];
+}>();
+
+const loading = ref(false);
+const saving = ref(false);
+const error = ref('');
+const ok = ref('');
+
+const logoDataUrl = ref<string | null>(null);
+const companyName = ref('');
+const companySubtitle = ref('');
+const address = ref('');
+const phone = ref('');
+const headerText = ref('');
+const footerText = ref('');
+
+useEscClose(
+  () => props.open,
+  () => close(),
+);
+
+function close() {
+  emit('update:open', false);
+}
+
+function fill(dto: TahesabInvoiceSettingsDto) {
+  logoDataUrl.value = dto.logoDataUrl;
+  companyName.value = dto.companyName ?? '';
+  companySubtitle.value = dto.companySubtitle ?? '';
+  address.value = dto.address ?? '';
+  phone.value = dto.phone ?? '';
+  headerText.value = dto.headerText ?? '';
+  footerText.value = dto.footerText ?? '';
+}
+
+async function load() {
+  loading.value = true;
+  error.value = '';
+  try {
+    const { data } = await api.get<TahesabInvoiceSettingsDto>(
+      '/integrations/tahesab/invoice-settings',
+    );
+    fill(data);
+  } catch (e) {
+    error.value = axios.isAxiosError(e)
+      ? String(
+          (e.response?.data as { message?: string })?.message ??
+            'بارگذاری تنظیمات ناموفق بود.',
+        )
+      : 'بارگذاری تنظیمات ناموفق بود.';
+  } finally {
+    loading.value = false;
+  }
+}
+
+function onLogoFile(ev: Event) {
+  const input = ev.target as HTMLInputElement;
+  const file = input.files?.[0];
+  input.value = '';
+  if (!file) return;
+  if (!file.type.startsWith('image/')) {
+    error.value = 'فقط فایل تصویر مجاز است.';
+    return;
+  }
+  if (file.size > 400_000) {
+    error.value = 'حجم تصویر حداکثر حدود ۴۰۰ کیلوبایت باشد.';
+    return;
+  }
+  const reader = new FileReader();
+  reader.onload = () => {
+    const result = typeof reader.result === 'string' ? reader.result : '';
+    if (!result.startsWith('data:image/')) {
+      error.value = 'خواندن تصویر ناموفق بود.';
+      return;
+    }
+    logoDataUrl.value = result;
+    error.value = '';
+  };
+  reader.readAsDataURL(file);
+}
+
+function clearLogo() {
+  logoDataUrl.value = null;
+}
+
+async function save() {
+  saving.value = true;
+  error.value = '';
+  ok.value = '';
+  try {
+    const { data } = await api.patch<TahesabInvoiceSettingsDto>(
+      '/integrations/tahesab/invoice-settings',
+      {
+        logoDataUrl: logoDataUrl.value,
+        companyName: companyName.value,
+        companySubtitle: companySubtitle.value,
+        address: address.value,
+        phone: phone.value,
+        headerText: headerText.value,
+        footerText: footerText.value,
+      },
+    );
+    fill(data);
+    ok.value = 'تنظیمات فاکتور ذخیره شد.';
+    emit('saved', data);
+  } catch (e) {
+    error.value = axios.isAxiosError(e)
+      ? String(
+          (e.response?.data as { message?: string })?.message ??
+            'ذخیره تنظیمات ناموفق بود.',
+        )
+      : 'ذخیره تنظیمات ناموفق بود.';
+  } finally {
+    saving.value = false;
+  }
+}
+
+watch(
+  () => props.open,
+  (open) => {
+    if (open) {
+      ok.value = '';
+      error.value = '';
+      void load();
+    }
+  },
+);
+
+onMounted(() => {
+  if (props.open) void load();
+});
+</script>
+
+<template>
+  <div v-if="open" class="backdrop" @click.self="close">
+    <div class="sheet" role="dialog" aria-modal="true" aria-label="تنظیمات فاکتور ته‌حساب">
+      <header class="sheet-head">
+        <div>
+          <h3>تنظیمات فاکتور ته‌حساب</h3>
+          <p class="muted">لوگو و متن‌های ثابت خروجی PDF اسناد — جدا از فاکتور CRM</p>
+        </div>
+        <button type="button" class="btn ghost" @click="close">بستن</button>
+      </header>
+
+      <p v-if="error" class="err">{{ error }}</p>
+      <p v-if="ok" class="ok">{{ ok }}</p>
+      <p v-if="loading" class="muted">در حال بارگذاری…</p>
+
+      <div v-else class="grid">
+        <label class="field logo-field">
+          <span>لوگو</span>
+          <div class="logo-row">
+            <img v-if="logoDataUrl" :src="logoDataUrl" alt="لوگو" class="logo-preview" />
+            <div class="logo-actions">
+              <input type="file" accept="image/*" @change="onLogoFile" />
+              <button v-if="logoDataUrl" type="button" class="btn ghost" @click="clearLogo">
+                حذف لوگو
+              </button>
+            </div>
+          </div>
+        </label>
+
+        <label class="field">
+          <span>نام شرکت / فروشگاه</span>
+          <input v-model="companyName" type="text" maxlength="200" />
+        </label>
+        <label class="field">
+          <span>زیرعنوان</span>
+          <input v-model="companySubtitle" type="text" maxlength="200" />
+        </label>
+        <label class="field">
+          <span>آدرس</span>
+          <input v-model="address" type="text" maxlength="500" />
+        </label>
+        <label class="field">
+          <span>تلفن</span>
+          <input v-model="phone" type="text" maxlength="80" dir="ltr" />
+        </label>
+        <label class="field full">
+          <span>متن بالای فاکتور</span>
+          <textarea v-model="headerText" rows="2" maxlength="1000" />
+        </label>
+        <label class="field full">
+          <span>متن پایین فاکتور</span>
+          <textarea v-model="footerText" rows="2" maxlength="1000" />
+        </label>
+      </div>
+
+      <footer class="sheet-foot">
+        <button type="button" class="btn" :disabled="saving || loading" @click="save">
+          {{ saving ? '…' : 'ذخیره تنظیمات' }}
+        </button>
+      </footer>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.backdrop {
+  position: fixed;
+  inset: 0;
+  z-index: 80;
+  background: rgba(15, 23, 42, 0.45);
+  display: grid;
+  place-items: center;
+  padding: 16px;
+}
+.sheet {
+  width: min(640px, 100%);
+  max-height: min(90vh, 820px);
+  overflow: auto;
+  background: var(--surface, #fff);
+  border-radius: 12px;
+  border: 1px solid var(--line, #e5e7eb);
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.sheet-head {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  align-items: flex-start;
+}
+.sheet-head h3 {
+  margin: 0;
+  font-size: 1.05rem;
+}
+.muted {
+  margin: 4px 0 0;
+  color: var(--ink-secondary, #6b7280);
+  font-size: 0.85rem;
+}
+.err {
+  color: #b91c1c;
+  margin: 0;
+}
+.ok {
+  color: #047857;
+  margin: 0;
+}
+.grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 12px;
+}
+.field {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  font-size: 0.85rem;
+}
+.field.full,
+.logo-field {
+  grid-column: 1 / -1;
+}
+.field input,
+.field textarea {
+  border: 1px solid var(--line, #e5e7eb);
+  border-radius: 8px;
+  padding: 8px 10px;
+  font: inherit;
+  background: var(--surface, #fff);
+}
+.logo-row {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.logo-preview {
+  max-height: 64px;
+  max-width: 140px;
+  object-fit: contain;
+  border: 1px solid var(--line, #e5e7eb);
+  border-radius: 8px;
+  padding: 4px;
+  background: #fff;
+}
+.logo-actions {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.sheet-foot {
+  display: flex;
+  justify-content: flex-end;
+}
+@media (max-width: 640px) {
+  .grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>