Creating import&export excel

apps/web/src/views/ActivitiesView.vue

@@ -18,8 +18,10 @@ import type {
   ActivityDto,
   ActivityFilter,
   ActivityType,
+  ImportContactsResult,
   PaginatedResponse,
 } from '@mento/shared';
+import { brand } from '@mento/shared';
 
 type TypeFilter = 'all' | ActivityType;
 type UiStatus = 'done' | 'progress' | 'planned' | 'overdue' | 'canceled';
@@ -70,6 +72,9 @@ const activityModal = ref<{
   title?: string;
 } | null>(null);
 const menuId = ref<string | null>(null);
+const busy = ref(false);
+const importMsg = ref('');
+const fileInput = ref<HTMLInputElement | null>(null);
 const counts = ref<Record<ActivityFilter, number>>({
   today: 0,
   overdue: 0,
@@ -260,6 +265,65 @@ function closePopovers() {
   menuId.value = null;
 }
 
+async function exportExcel() {
+  busy.value = true;
+  importMsg.value = '';
+  error.value = '';
+  try {
+    const { data } = await api.get<Blob>('/activities/export', { responseType: 'blob' });
+    const url = URL.createObjectURL(data);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = `${brand.filePrefix}-activities.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>('/activities/import', form, {
+      headers: { 'Content-Type': undefined },
+    });
+    importMsg.value = `وارد شد: ${data.created} · تکراری رد شد: ${data.skipped}${
+      data.errors.length ? ` · خطا: ${data.errors.length}` : ''
+    }`;
+    if (data.errors.length) {
+      error.value = data.errors
+        .slice(0, 3)
+        .map((e) => `ردیف ${e.row}: ${e.message}`)
+        .join(' | ');
+    }
+    await Promise.all([load(), loadCounts()]);
+  } catch (e) {
+    if (axios.isAxiosError(e)) {
+      const msg = (e.response?.data as { message?: string | string[] })?.message;
+      error.value = Array.isArray(msg) ? msg.join('، ') : (msg ?? 'ایمپورت ناموفق بود');
+    } else {
+      error.value = 'ایمپورت ناموفق بود';
+    }
+  } finally {
+    busy.value = false;
+  }
+}
+
 watch(
   () => [route.query.filter, route.query.q, route.query.page],
   () => {
@@ -289,6 +353,21 @@ onMounted(() => {
         <p class="lead">تماس، جلسه و وظیفه — امروز و عقب‌افتاده‌ها یکجا.</p>
       </div>
       <div class="head-actions">
+        <button class="btn ghost excel-btn" type="button" :disabled="busy" @click.stop="exportExcel">
+          <span class="btn-full">خروجی اکسل</span>
+          <span class="btn-short">خروجی</span>
+        </button>
+        <button class="btn ghost excel-btn" type="button" :disabled="busy" @click.stop="pickImportFile">
+          <span class="btn-full">ورود از اکسل</span>
+          <span class="btn-short">ورود</span>
+        </button>
+        <input
+          ref="fileInput"
+          type="file"
+          accept=".xlsx,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+          hidden
+          @change="onImportFile"
+        />
         <UiButton type="button" @click="activityModal = {}">
           <UiIcon name="plus" :size="16" />
           فعالیت جدید
@@ -345,7 +424,8 @@ onMounted(() => {
     </div>
 
     <p v-if="error" class="error">{{ error }}</p>
-    <p v-else-if="loading" class="muted">در حال بارگذاری…</p>
+    <p v-if="importMsg" class="ok">{{ importMsg }}</p>
+    <p v-if="loading" class="muted">در حال بارگذاری…</p>
 
     <div v-else-if="listEmpty" class="empty-card">
       <div class="art" aria-hidden="true">
@@ -632,11 +712,24 @@ h1 {
   color: #b91c1c;
 }
 
+.ok {
+  color: #0f766e;
+  font-weight: 600;
+}
+
+.head-actions .excel-btn .btn-full {
+  display: inline;
+}
+.head-actions .excel-btn .btn-short {
+  display: none;
+}
+
 .head-actions,
 .tools {
   display: flex;
   gap: 0.55rem;
   align-items: center;
+  flex-wrap: wrap;
 }
 
 .btn {
@@ -1172,6 +1265,13 @@ time.note {
     flex: 1;
   }
 
+  .head-actions .excel-btn .btn-full {
+    display: none;
+  }
+  .head-actions .excel-btn .btn-short {
+    display: inline;
+  }
+
   h1 {
     font-size: 1.55rem;
   }

apps/web/src/views/ProjectBoardView.vue

@@ -6,10 +6,12 @@ import { api } from '@/lib/api';
 import { useAuthStore } from '@/stores/auth';
 import UiIcon from '@/components/UiIcon.vue';
 import type {
+  ImportContactsResult,
   ProjectBoardBoardDto,
   ProjectBoardDto,
   ProjectCardDto,
 } from '@mento/shared';
+import { brand } from '@mento/shared';
 import { canManageSettings } from '@/lib/roles';
 
 const route = useRoute();
@@ -25,6 +27,9 @@ const draggingId = ref<string | null>(null);
 const dropStageId = ref<string | null>(null);
 const showCreate = ref(false);
 const newName = ref('');
+const busy = ref(false);
+const importMsg = ref('');
+const fileInput = ref<HTMLInputElement | null>(null);
 
 const selectedBoardId = computed(() => {
   const q = route.query.boardId;
@@ -132,6 +137,65 @@ function openCard(id: string) {
   void router.push({ name: 'project-card-detail', params: { id } });
 }
 
+async function exportExcel() {
+  busy.value = true;
+  importMsg.value = '';
+  error.value = '';
+  try {
+    const { data } = await api.get<Blob>('/project-cards/export', { responseType: 'blob' });
+    const url = URL.createObjectURL(data);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = `${brand.filePrefix}-project-cards.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>('/project-cards/import', form, {
+      headers: { 'Content-Type': undefined },
+    });
+    importMsg.value = `وارد شد: ${data.created} · تکراری رد شد: ${data.skipped}${
+      data.errors.length ? ` · خطا: ${data.errors.length}` : ''
+    }`;
+    if (data.errors.length) {
+      error.value = data.errors
+        .slice(0, 3)
+        .map((e) => `ردیف ${e.row}: ${e.message}`)
+        .join(' | ');
+    }
+    await load();
+  } catch (e) {
+    if (axios.isAxiosError(e)) {
+      const msg = (e.response?.data as { message?: string | string[] })?.message;
+      error.value = Array.isArray(msg) ? msg.join('، ') : (msg ?? 'ایمپورت ناموفق بود');
+    } else {
+      error.value = 'ایمپورت ناموفق بود';
+    }
+  } finally {
+    busy.value = false;
+  }
+}
+
 watch(
   () => route.query.boardId,
   (id, prev) => {
@@ -171,6 +235,19 @@ onMounted(load);
       </label>
 
       <div class="toolbar-actions">
+        <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"
+        />
         <button class="btn-ghost-sm" type="button" :disabled="loading" @click="load">
           بروزرسانی
         </button>
@@ -215,7 +292,8 @@ onMounted(load);
     </form>
 
     <p v-if="error" class="error">{{ error }}</p>
-    <p v-else-if="loading && !board" class="muted">در حال بارگذاری…</p>
+    <p v-if="importMsg" class="ok">{{ importMsg }}</p>
+    <p v-if="loading && !board" class="muted">در حال بارگذاری…</p>
 
     <div v-if="board" class="board">
       <div
@@ -411,6 +489,12 @@ h1 {
   color: #b91c1c;
 }
 
+.ok {
+  margin: 0;
+  color: #0f766e;
+  font-weight: 600;
+}
+
 .board {
   display: flex;
   gap: 0.75rem;