From 2aa99119e289423d1d137f8a7087c4269324fdc3 Mon Sep 17 00:00:00 2001
From: Kavehhn174 <Kavehhn174@gmail.com>
Date: Sun, 16 Aug 2026 08:11:42 +0330
Subject: [PATCH] feat: improve filters and class pricing controls in dashboard

Add session class filter, distinct partial payment tag, richer notifications list, class discount/frontend toggles, and remove unused course discount column.
---
 src/components/common/StatusTag.vue           |  2 +-
 src/views/classes/ClassFormView.vue           | 59 +++++++++++++++-
 src/views/courses/CourseListView.vue          |  7 --
 .../notifications/NotificationListView.vue    | 67 +++++++++++++++----
 src/views/sessions/SessionListView.vue        | 40 +++++++++--
 5 files changed, 147 insertions(+), 28 deletions(-)

diff --git a/src/components/common/StatusTag.vue b/src/components/common/StatusTag.vue
index 72ef625..2a6ebb4 100644
--- a/src/components/common/StatusTag.vue
+++ b/src/components/common/StatusTag.vue
@@ -54,7 +54,7 @@ const severity = computed(() => {
 
   if (props.type === 'payment') {
     if (val === 'paid' || val === 'تسویه شده' || val === 'تسویه‌شده') return 'success';
-    if (val === 'partial' || val === 'پرداخت جزئی') return 'warning';
+    if (val === 'partial' || val === 'پرداخت جزئی') return 'contrast';
     if (val === 'pending' || val === 'در انتظار پرداخت') return 'info';
     if (val === 'overdue' || val === 'معوق شده' || val === 'معوق') return 'danger';
   }
diff --git a/src/views/classes/ClassFormView.vue b/src/views/classes/ClassFormView.vue
index 06a8c43..5c38788 100644
--- a/src/views/classes/ClassFormView.vue
+++ b/src/views/classes/ClassFormView.vue
@@ -40,6 +40,31 @@
           <InputNumber v-model="form.tuitionFee" :min="0" class="w-full text-sm" suffix=" تومان" />
         </div>
 
+        <div class="col-12 md:col-3 flex flex-column gap-2">
+          <label class="font-semibold text-sm">ظرفیت آزاد (نمایش در وب)</label>
+          <InputNumber v-model="form.freeSpots" :min="0" class="w-full text-sm" placeholder="دستی" />
+        </div>
+
+        <div class="col-12">
+          <div class="flex flex-column gap-2 p-3 border-1 border-color border-round">
+            <div class="flex align-items-center gap-2">
+              <Checkbox v-model="form.hasDiscount" binary inputId="class-has-discount" />
+              <label for="class-has-discount" class="font-semibold text-sm cursor-pointer">تخفیف روی شهریه</label>
+            </div>
+            <div v-if="form.hasDiscount" class="grid mt-1">
+              <div class="col-12 md:col-4 flex flex-column gap-2">
+                <label class="font-semibold text-sm">مبلغ تخفیف (تومان)</label>
+                <InputNumber v-model="form.discount" :min="0" :max="form.tuitionFee || 0" class="w-full text-sm" suffix=" تومان" />
+              </div>
+              <div class="col-12 md:col-8 flex align-items-end">
+                <span class="font-semibold text-color text-sm">
+                  شهریه نهایی: {{ toPersianDigits(finalTuitionFee.toLocaleString()) }} تومان
+                </span>
+              </div>
+            </div>
+          </div>
+        </div>
+
         <div class="col-12 md:col-4 flex flex-column gap-2">
           <label class="font-semibold text-sm">تاریخ شروع</label>
           <DatePicker v-model="form.startDate" class="w-full text-sm" placeholder="1403/01/01" />
@@ -50,9 +75,19 @@
           <DatePicker v-model="form.endDate" class="w-full text-sm" placeholder="1403/03/01" />
         </div>
 
-        <div class="col-12 md:col-4 flex align-items-center gap-2 mt-4">
-          <InputSwitch v-model="form.isActive" />
-          <label class="font-semibold text-sm">کلاس فعال است</label>
+        <div class="col-12 md:col-4 flex flex-column gap-2">
+          <div class="flex align-items-center gap-2 mt-4">
+            <InputSwitch v-model="form.isActive" />
+            <label class="font-semibold text-sm">کلاس فعال است</label>
+          </div>
+        </div>
+
+        <div class="col-12 md:col-8 flex flex-column gap-1 mt-4">
+          <div class="flex align-items-center gap-2">
+            <InputSwitch v-model="form.showOnFrontend" />
+            <label class="font-semibold text-sm">نمایش در وب‌سایت</label>
+          </div>
+          <small class="text-muted text-xs">مستقل از «فعال بودن» — کلاس غیرفعال می‌تواند در سایت پنهان یا نمایش داده شود.</small>
         </div>
 
         <div class="col-12">
@@ -259,6 +294,10 @@ const form = reactive({
   professor: null,
   capacity: 20,
   tuitionFee: 0,
+  hasDiscount: false,
+  discount: 0,
+  freeSpots: null,
+  showOnFrontend: true,
   startDate: '',
   endDate: '',
   days: [],
@@ -269,6 +308,12 @@ const form = reactive({
 });
 const weekdays = WEEKDAYS;
 
+const finalTuitionFee = computed(() => {
+  const tuition = Number(form.tuitionFee) || 0;
+  if (!form.hasDiscount) return tuition;
+  return Math.max(0, tuition - (Number(form.discount) || 0));
+});
+
 const removeDialogMessage = computed(() => {
   const name = studentToRemove.value?.name;
   return name
@@ -346,6 +391,10 @@ const fetchData = async () => {
         professor: data.professor?._id || data.professor || null,
         capacity: data.capacity || 20,
         tuitionFee: data.tuitionFee || 0,
+        hasDiscount: Boolean(data.hasDiscount),
+        discount: data.discount || 0,
+        freeSpots: data.freeSpots ?? null,
+        showOnFrontend: data.showOnFrontend !== false,
         startDate: toJalaliDisplay(data.startDate),
         endDate: toJalaliDisplay(data.endDate),
         days: Array.isArray(data.days) ? data.days.map(Number).filter((day) => day >= 0 && day <= 6) : [],
@@ -385,6 +434,10 @@ const handleSubmit = async () => {
       professor: form.professor || undefined,
       capacity: form.capacity,
       tuitionFee: form.tuitionFee,
+      hasDiscount: form.hasDiscount,
+      discount: form.hasDiscount ? form.discount : 0,
+      freeSpots: form.freeSpots,
+      showOnFrontend: form.showOnFrontend,
       startDate: toGregorianIso(form.startDate),
       endDate: toGregorianIso(form.endDate),
       days: form.days || [],
diff --git a/src/views/courses/CourseListView.vue b/src/views/courses/CourseListView.vue
index a2717e2..8c8e7ea 100644
--- a/src/views/courses/CourseListView.vue
+++ b/src/views/courses/CourseListView.vue
@@ -45,13 +45,6 @@
         </template>
       </Column>
 
-      <Column header="تخفیف فعال">
-        <template #body="{ data }">
-          <Tag v-if="data.activeDiscount" value="دارای تخفیف" severity="danger" />
-          <span v-else class="text-muted text-xs">-</span>
-        </template>
-      </Column>
-
       <Column header="عملیات" style="width: 130px">
         <template #body="{ data }">
           <div class="flex align-items-center gap-1">
diff --git a/src/views/notifications/NotificationListView.vue b/src/views/notifications/NotificationListView.vue
index f8bf3e1..7046158 100644
--- a/src/views/notifications/NotificationListView.vue
+++ b/src/views/notifications/NotificationListView.vue
@@ -22,29 +22,62 @@
         </template>
       </Column>
 
-      <Column field="channel" header="کانال ارسال">
+      <Column field="channel" header="کانال">
         <template #body="{ data }">
           <Tag :value="getChannelLabel(data.channel)" :severity="getChannelSeverity(data.channel)" />
         </template>
       </Column>
 
-      <Column field="subject" header="موضوع / متن">
+      <Column field="subject" header="موضوع">
         <template #body="{ data }">
-          <span class="text-sm truncate max-w-20rem block" :title="data.subject || data.content">
-            {{ data.subject || data.content || '-' }}
+          <span class="text-sm font-semibold">{{ data.subject || '—' }}</span>
+        </template>
+      </Column>
+
+      <Column field="body" header="متن پیام">
+        <template #body="{ data }">
+          <span class="text-sm white-space-pre-wrap line-height-3" :title="getBodyText(data)">
+            {{ truncateText(getBodyText(data), 120) }}
           </span>
         </template>
       </Column>
 
-      <Column field="status" header="وضعیت تحویل">
+      <Column field="relatedEvent" header="رویداد مرتبط">
         <template #body="{ data }">
-          <StatusTag :status="data.status || 'delivered'" type="notification" />
+          <span class="text-xs text-muted">{{ data.relatedEvent || '—' }}</span>
         </template>
       </Column>
 
-      <Column field="retryCount" header="تعداد تلاش">
+      <Column field="status" header="وضعیت">
         <template #body="{ data }">
-          {{ toPersianDigits(data.retryCount || 0) }}
+          <StatusTag :status="data.status || 'pending'" type="notification" />
+        </template>
+      </Column>
+
+      <Column field="retryCount" header="تلاش">
+        <template #body="{ data }">
+          {{ toPersianDigits(data.retryCount || 0) }} / {{ toPersianDigits(data.maxRetries ?? 3) }}
+        </template>
+      </Column>
+
+      <Column field="sentAt" header="زمان ارسال">
+        <template #body="{ data }">
+          {{ data.sentAt ? formatJalali(data.sentAt, 'jYYYY/jMM/jDD HH:mm') : '—' }}
+        </template>
+      </Column>
+
+      <Column field="createdAt" header="ایجاد">
+        <template #body="{ data }">
+          {{ data.createdAt ? formatJalali(data.createdAt, 'jYYYY/jMM/jDD HH:mm') : '—' }}
+        </template>
+      </Column>
+
+      <Column field="lastError" header="خطا">
+        <template #body="{ data }">
+          <span v-if="data.lastError" class="text-xs text-red-500 white-space-pre-wrap" :title="data.lastError">
+            {{ truncateText(data.lastError, 80) }}
+          </span>
+          <span v-else class="text-muted text-xs">—</span>
         </template>
       </Column>
 
@@ -52,7 +85,7 @@
         <template #body="{ data }">
           <PermissionGate permission="notifications:retry">
             <Button
-              v-if="data.status === 'failed' || data.status === 'ناموفق'"
+              v-if="data.status === 'failed'"
               icon="pi pi-refresh"
               label="تلاش مجدد"
               size="small"
@@ -81,7 +114,7 @@ import Button from 'primevue/button';
 import Column from 'primevue/column';
 import Tag from 'primevue/tag';
 
-const { toPersianDigits } = usePersianDate();
+const { toPersianDigits, formatJalali } = usePersianDate();
 const { showSuccess, showError } = useToast();
 
 const {
@@ -97,15 +130,23 @@ const {
 
 const retryingId = ref(null);
 
+const getBodyText = (data) => data.body || data.content || '';
+
+const truncateText = (value, max = 100) => {
+  const text = String(value || '').trim();
+  if (!text) return '—';
+  return text.length > max ? `${text.slice(0, max)}…` : text;
+};
+
 const getChannelLabel = (ch) => {
-  if (ch === 'bale') return 'پیام‌رسان بله';
+  if (ch === 'baleBot' || ch === 'bale') return 'پیام‌رسان بله';
   if (ch === 'sms') return 'پیامک SMS';
   if (ch === 'email') return 'ایمیل';
-  return ch || 'بله';
+  return ch || '—';
 };
 
 const getChannelSeverity = (ch) => {
-  if (ch === 'bale') return 'success';
+  if (ch === 'baleBot' || ch === 'bale') return 'success';
   if (ch === 'sms') return 'info';
   if (ch === 'email') return 'warning';
   return 'secondary';
diff --git a/src/views/sessions/SessionListView.vue b/src/views/sessions/SessionListView.vue
index a04a3d6..bd17852 100644
--- a/src/views/sessions/SessionListView.vue
+++ b/src/views/sessions/SessionListView.vue
@@ -2,9 +2,22 @@
 <template>
   <div class="session-list-view">
     <PageHeader :title="$t('sessions.title')" :subtitle="$t('sessions.subtitle')">
-      <PermissionGate permission="sessions:create">
-        <Button :label="$t('sessions.addSession')" icon="pi pi-plus" @click="$router.push('/sessions/create')" />
-      </PermissionGate>
+      <div class="flex flex-wrap gap-2 align-items-center">
+        <Dropdown
+          v-model="selectedClassId"
+          :options="classesList"
+          optionLabel="name"
+          optionValue="_id"
+          placeholder="فیلتر کلاس"
+          showClear
+          filter
+          class="w-16rem text-sm"
+          @change="onClassFilter"
+        />
+        <PermissionGate permission="sessions:create">
+          <Button :label="$t('sessions.addSession')" icon="pi pi-plus" @click="$router.push('/sessions/create')" />
+        </PermissionGate>
+      </div>
     </PageHeader>
 
     <DataTableWrapper
@@ -146,6 +159,7 @@ import { useDataTable } from '@/composables/useDataTable';
 import { usePersianDate } from '@/composables/usePersianDate';
 import { useToast } from '@/composables/useToast';
 import { sessionApi } from '@/api/sessionApi';
+import { classApi } from '@/api/classApi';
 import PageHeader from '@/components/common/PageHeader.vue';
 import DataTableWrapper from '@/components/common/DataTableWrapper.vue';
 import ConfirmDeleteDialog from '@/components/common/ConfirmDeleteDialog.vue';
@@ -155,10 +169,14 @@ import Button from 'primevue/button';
 import Column from 'primevue/column';
 import Tag from 'primevue/tag';
 import Select from 'primevue/select';
+import Dropdown from 'primevue/select';
 
 const { formatJalali, toPersianDigits } = usePersianDate();
 const { showSuccess, showError } = useToast();
 
+const classesList = ref([]);
+const selectedClassId = ref(null);
+
 const {
   items,
   totalCount,
@@ -167,7 +185,8 @@ const {
   loadData,
   onPageChange,
   onSort,
-  onSearch
+  onSearch,
+  setFilter
 } = useDataTable(sessionApi.getAll, {
   sortBy: 'day',
   sortOrder: 'asc'
@@ -249,7 +268,20 @@ const applyBulkStatus = async () => {
   }
 };
 
+const onClassFilter = () => setFilter('classId', selectedClassId.value || '');
+
+const fetchClasses = async () => {
+  try {
+    const res = await classApi.getAll({ limit: 200, sortBy: 'name', sortOrder: 'asc' });
+    const data = res.data || res;
+    classesList.value = Array.isArray(data) ? data : (data.data || []);
+  } catch (err) {
+    console.warn('Failed to load classes for filter:', err);
+  }
+};
+
 onMounted(() => {
+  fetchClasses();
   loadData();
 });
 </script>