Editing of the project's Kariz page

apps/web/src/views/PipelineBoardView.vue

@@ -20,7 +20,8 @@ import UiButton from '@/components/ui/UiButton.vue';
 import UiInput from '@/components/ui/UiInput.vue';
 import UiModal from '@/components/ui/UiModal.vue';
 import DealFormView from '@/views/DealFormView.vue';
-import type { PipelineBoardDto, PipelineDto } from '@mento/shared';
+import type { ImportContactsResult, PipelineBoardDto, PipelineDto } from '@mento/shared';
+import { brand } from '@mento/shared';
 import { useAuthStore } from '@/stores/auth';
 import { canManageSettings } from '@/lib/roles';
 
@@ -44,6 +45,9 @@ const newName = ref('');
 const dealModal = ref<{ dealId?: string; stageId?: string } | null>(null);
 const deleteStageId = ref<string | null>(null);
 const stageBusy = ref(false);
+const busy = ref(false);
+const importMsg = ref('');
+const fileInput = ref<HTMLInputElement | null>(null);
 
 const draggingId = ref<string | null>(null);
 const draggingColumnId = ref<string | null>(null);
@@ -367,6 +371,64 @@ function onOpenDeal(dealId: string) {
   void router.push({ name: 'deal-detail', params: { id: dealId } });
 }
 
+async function exportExcel() {
+  busy.value = true;
+  importMsg.value = '';
+  error.value = '';
+  try {
+    const { data } = await api.get<Blob>('/deals/export', { responseType: 'blob' });
+    const url = URL.createObjectURL(data);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = `${brand.filePrefix}-deals.xlsx`;
+    a.click();
+    URL.revokeObjectURL(url);
+  } catch {
+    error.value = 'خروجی اکسل ناموفق بود.';
+  } finally {
+    busy.value = false;
+  }
+}
+
+function pickImportFile() {
+  fileInput.value?.click();
+}
+
+async function onImportFile(ev: Event) {
+  const input = ev.target as HTMLInputElement;
+  const file = input.files?.[0];
+  input.value = '';
+  if (!file) return;
+  busy.value = true;
+  importMsg.value = '';
+  error.value = '';
+  try {
+    const form = new FormData();
+    form.append('file', file);
+    const { data } = await api.post<ImportContactsResult>('/deals/import', form, {
+      headers: { 'Content-Type': undefined },
+    });
+    importMsg.value = `وارد شد: ${data.created} · تکراری رد شد: ${data.skipped}${
+      data.errors.length ? ` · خطا: ${data.errors.length}` : ''
+    }${data.boards?.length ? ` · کاریز: ${data.boards.join('، ')}` : ''}`;
+    if (data.errors.length) {
+      error.value = data.errors
+        .slice(0, 3)
+        .map((e) => `ردیف ${e.row}: ${e.message}`)
+        .join(' | ');
+    }
+    if (data.boardId && data.boardId !== selectedPipelineId.value) {
+      await router.replace({ name: 'pipeline', query: { pipelineId: data.boardId } });
+    } else {
+      await load();
+    }
+  } catch (e) {
+    error.value = apiMessage(e, 'ایمپورت ناموفق بود');
+  } finally {
+    busy.value = false;
+  }
+}
+
 function onMenuDeal(dealId: string) {
   menuOpenId.value = menuOpenId.value === dealId ? null : dealId;
 }
@@ -405,9 +467,26 @@ defineExpose({ updateDealStage: applyUpdateDealStage });
       v-model:amount-max="amountMax"
       :can-create="canCreatePipeline"
       @create="showCreate = true"
-    />
+    >
+      <template #excel>
+        <button class="btn-ghost-sm" type="button" :disabled="loading || busy" @click="exportExcel">
+          خروجی اکسل
+        </button>
+        <button class="btn-ghost-sm" type="button" :disabled="loading || busy" @click="pickImportFile">
+          ورود از اکسل
+        </button>
+        <input
+          ref="fileInput"
+          type="file"
+          accept=".xlsx,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+          hidden
+          @change="onImportFile"
+        />
+      </template>
+    </PipelineToolbar>
 
     <p v-if="error" class="error">{{ error }}</p>
+    <p v-if="importMsg" class="ok">{{ importMsg }}</p>
     <p v-else-if="loading && !stages.length" class="muted">در حال بارگذاری کاریز…</p>
 
     <PipelineList
@@ -565,6 +644,11 @@ defineExpose({ updateDealStage: applyUpdateDealStage });
   font-weight: 600;
 }
 
+.ok {
+  color: #0f766e;
+  font-weight: 600;
+}
+
 .delete-copy {
   margin: 0;
   line-height: 1.7;