10 Commits

Author SHA1 Message Date
madresebanoo 259bc55c86 feat(admin): add certificates page to admin sidebar and router
Deploy banu-front / deploy (push) Successful in 1m29s
- AdminLayout: add گواهینامه‌ها menu item
- admin router: register /certificates route → AdminCertificatesPage
- endpoints: add getAdminCertificates, addAdminCertificate, deleteAdminCertificate

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-09-02 15:54:57 +04:30
madresebanoo 43ed9740f2 feat(certificates): admin certificate management UI
Admin can view, issue, and delete certificates. Student certificate
query now normalises the response shape (works with both paginated
and non-paginated API responses).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-09-02 15:54:56 +04:30
madresebanoo d9d573256c feat(admin/users): support multiple roles in user table and form
UsersTable now shows all role labels joined (not just the first role),
and its CSS badge class is based on the primary role. UserFormPage
uses a multi-select for roles instead of a single-select, and the
form validation requires at least one role. TermItem layout fix for
inactive badge alignment.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-09-02 15:54:56 +04:30
madresebanoo 4402fb6a3d fix: branding, 401 logout, and blocked-user message on register page
- Copyright.vue / AuthCopyright.vue: change link from mugweb.ir to madresebanoo.ir
- SelectField.vue: add min-width:0 to prevent flex overflow in narrow layouts
- useRedirectAfterLogin: check roles array (multi-role support) instead of single role
- StudentRegisterPage: show block reason when user's status is blocked
- http.js: only clear session on 401 if a token already existed (login
  form 401 should not trigger logout); clear via authStore so WordPress
  cookie is also cleaned up

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-09-02 15:54:55 +04:30
madresebanoo 1cfd48f35a fix(courses): normalize "my courses" list response and cover image
The list query returned the raw paginated payload unmapped, so
current/ended filtering and pagination metadata didn't work; align it
with the same coverUrl fallback the detail query already used.
2026-09-02 15:54:55 +04:30
madresebanoo 052ec8a54f feat(users): add user evaluation panel with PDF export
Shows the admin a summary of a user's sessions viewed, exam/homework
performance, and current term status, with a PDF export action.
2026-09-02 15:54:55 +04:30
madresebanoo 887eb2589d feat(services): add Service Types management UI
Admin CRUD page for service types, plus wiring the student "request
service" form's category select to the real list instead of a
hardcoded pair of options.
2026-09-02 15:54:53 +04:30
madresebanoo 2eb7c68f9f fix(courses): course cover image not saved on create/edit
The admin course form sent a stray upload id (imageId/uploadId) that
didn't match any field the API accepts; the API expects cover_media_id
with the media id returned from the upload endpoint. Also switch course
displays to the coverUrl field the API actually returns.
2026-09-02 15:54:53 +04:30
madresebanoo d4dc4a76f8 fix: support onUploadProgress in useUploadMediaMutation
SessionFormPage now passes { formData, onUploadProgress } to mutateAsync
for progress tracking. Update uploadMediaMutationFn to destructure the
object and forward onUploadProgress to apiUploadMedia; update apiUploadMedia
to accept and pass the callback to axios.

[batch-1-hotfix]
2026-09-02 15:54:53 +04:30
madresebanoo e10cfba09d feat(batch-1): multi-role sidebar, video display, certificate layout, upload progress, counselor access
- roleMenuItems.js: merged menu builder that unions items from all user roles
  (student + missionary, student + counselor, etc.) additively
- auth store: expose `roles` array in addition to singular `role`; wire in
  WordPress auth-status cookie sync so the public site can show/hide the
  account button
- router guards: use roles.includes() instead of role === for multi-role access
- layouts (Student/Counselor/Missionary): delegate menuItems to
  buildMergedMenuItems so dual-role users see sections from both roles
- StudentSessionDetailsPage: contentKind now returns 'video' (not 'link')
  when session.videoUrl is set; adds embed iframe branch for online sessions
- CertificateItem.vue: fix CSS order/alignment for desktop + mobile layout
- StudentCertificatesPage.vue: map backend payload fields to component props
  with Jalaali date formatting
- SessionFormPage: upload progress bar (%) during video uploads; embed_code
  textarea for online sessions (frontend-only; dormant until batch-2 backend
  migration is deployed)
- wp-sync/auth-status-cookie.js: cookie helper for WordPress login-state sync

[batch-1-low-risk]
2026-09-02 15:54:52 +04:30
40 changed files with 1641 additions and 85 deletions
+1 -1
View File
@@ -1,7 +1,7 @@
<template> <template>
<div class="copyright"> <div class="copyright">
<div class="copyright__text"> <div class="copyright__text">
<a href="https://mugweb.ir/" target="_blank" rel="noopener"> <a href="https://madresebanoo.ir/" target="_blank" rel="noopener">
<p class="copyright__en">All Rights Reserved. 2026</p> <p class="copyright__en">All Rights Reserved. 2026</p>
<p class="copyright__fa">تمام حقوق مادی و معنوی این وبسایت محفوظ هست.</p> <p class="copyright__fa">تمام حقوق مادی و معنوی این وبسایت محفوظ هست.</p>
</a> </a>
+1
View File
@@ -283,6 +283,7 @@ onBeforeUnmount(() => unmountFloating())
&__value { &__value {
flex: 1; flex: 1;
min-width: 0;
text-align: start; text-align: start;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@@ -0,0 +1,137 @@
<template>
<div class="certificate-item">
<div class="certificate-item__main">
<p class="certificate-item__title">{{ certificate.title || '—' }}</p>
<p class="certificate-item__student">{{ certificate.user?.name || '—' }}</p>
</div>
<div class="certificate-item__meta">
<div class="certificate-item__pill">
<span class="certificate-item__pill-label">تاریخ صدور:</span>
<span class="certificate-item__pill-value">{{ issuedAt }}</span>
</div>
<div class="certificate-item__pill">
<span class="certificate-item__pill-label">فایل‌ها:</span>
<span class="certificate-item__pill-value">{{ filesLabel }}</span>
</div>
</div>
<div class="certificate-item__actions">
<CircleButton
tooltip="حذف"
bg-color="rgba(104, 104, 104, 0.05)"
size="2.5rem"
@click="emit('delete', certificate)"
>
<template #icon>
<SvgIcon name="trash" :size="18" color="var(--color-error)" />
</template>
</CircleButton>
</div>
</div>
</template>
<script setup>
import { computed } from 'vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import { formatJalaaliDate } from '@/utils/date-utils'
import CircleButton from '@/components/CircleButton.vue'
const props = defineProps({
certificate: { type: Object, required: true },
})
const emit = defineEmits(['delete'])
const issuedAt = computed(() => formatJalaaliDate(props.certificate.issuedAt) || '—')
const filesLabel = computed(() => {
const parts = []
if (props.certificate.hasImage) parts.push('تصویر')
if (props.certificate.hasPdf) parts.push('PDF')
return parts.length > 0 ? parts.join(' / ') : '—'
})
</script>
<style lang="scss" scoped>
.certificate-item {
display: flex;
flex-direction: column;
gap: 0.625rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 50%);
box-shadow: 0 4px 10px -6px rgba(241, 241, 241, 70%);
border-radius: 0.875rem;
margin-bottom: 0.625rem;
@media (min-width: 1024px) {
flex-flow: row wrap;
align-items: center;
}
&__main {
flex: 1 1 33%;
min-width: 0;
}
&__title {
font-family: var(--font-family-fa);
font-size: 1rem;
color: #4b4b4b;
margin: 0 0 0.25rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&__student {
font-family: var(--font-family-fa);
font-size: 0.75rem;
color: #848484;
margin: 0;
}
&__meta {
display: flex;
flex-wrap: wrap;
gap: 0.375rem;
flex: 1 1 33%;
}
&__pill {
background: rgba(107, 107, 107, 5%);
padding: 0.25rem 1rem;
border-radius: 0.875rem;
line-height: 1.5;
white-space: nowrap;
}
&__pill-label {
font-family: var(--font-family-fa);
font-weight: 300;
font-size: 0.7rem;
color: #535353;
margin-inline-end: 0.25rem;
}
&__pill-value {
font-family: var(--font-family-en);
font-size: 0.7rem;
font-weight: 500;
color: #535353;
}
&__actions {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
gap: 0.375rem;
flex: 1 1 100%;
@media (min-width: 1024px) {
flex: 1 1 auto;
}
}
}
</style>
@@ -0,0 +1,292 @@
<template>
<BasicModal
title="صدور گواهینامه"
title-en="Issue Certificate"
width="95%"
max-width="56rem"
min-width="auto"
:show-close-button="true"
>
<template #default="{ close }">
<form class="issue-certificate" @submit.prevent="onSubmit(close)">
<div class="issue-certificate__grid">
<SelectField
v-model="form.userId"
name="userId"
label="طلبه"
placeholder="نام طلبه را جستجو کنید"
:options="userOptions"
option-label="name"
option-value="id"
:searchable="true"
:on-search="searchUsers"
:error="errors.userId"
/>
<SelectField
v-model="form.termId"
name="termId"
label="ترم گذرانده‌شده"
placeholder="ترم را انتخاب کنید"
:options="termOptions"
option-label="title"
option-value="id"
:searchable="true"
:on-search="searchTerms"
:error="errors.termId"
/>
<SelectField
v-model="form.courseId"
name="courseId"
label="دوره گذرانده‌شده"
placeholder="دوره را انتخاب کنید"
:options="courseOptions"
option-label="title"
option-value="id"
:searchable="true"
:on-search="searchCourses"
/>
<DatePickerField v-model="form.issuedAt" name="issuedAt" label="تاریخ صدور" />
<DatePickerField v-model="form.startedAt" name="startedAt" label="تاریخ شروع" />
<DatePickerField v-model="form.endedAt" name="endedAt" label="تاریخ پایان" />
</div>
<p v-if="errors.termId" class="issue-certificate__hint">{{ errors.termId }}</p>
<div class="issue-certificate__files">
<div class="issue-certificate__file-col">
<label class="issue-certificate__file-label">تصویر گواهینامه (JPG/PNG)</label>
<FileUploader
v-model="imageFiles"
accept="image/*"
:multiple="false"
:max-files="1"
@select="onImageSelect"
@error="onFileError"
/>
</div>
<div class="issue-certificate__file-col">
<label class="issue-certificate__file-label">فایل PDF گواهینامه</label>
<FileUploader
v-model="pdfFiles"
accept="application/pdf"
:multiple="false"
:max-files="1"
@select="onPdfSelect"
@error="onFileError"
/>
</div>
</div>
<p v-if="errors.imageMediaId" class="issue-certificate__hint">{{ errors.imageMediaId }}</p>
<div class="issue-certificate__divider" />
<div class="issue-certificate__actions">
<BaseButton
variant="transparent"
text="منصرف شدم"
custom-class="issue-certificate__btn-cancel"
@click="close"
>
<template #prependIcon>
<SvgIcon name="caret-right" :size="14" color="var(--color-sec-gray)" />
</template>
</BaseButton>
<BaseButton
type="submit"
text="صدور گواهینامه"
:loading="submitting"
custom-class="issue-certificate__btn-submit"
>
<template #appendIcon>
<SvgIcon name="arrow-left" :size="18" color="#fff" />
</template>
</BaseButton>
</div>
</form>
</template>
</BasicModal>
</template>
<script setup>
import { computed, ref } from 'vue'
import { toast } from 'vue3-toastify'
import useYup from '@/composables/useYup'
import useDebounce from '@/composables/useDebounce'
import { useQueryClient } from '@tanstack/vue-query'
import BasicModal from '@/components/BasicModal.vue'
import BaseButton from '@/components/BaseButton.vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import SelectField from '@/components/form/SelectField.vue'
import FileUploader from '@/components/form/FileUploader.vue'
import { objectToFormData } from '@/utils/object-to-formdata'
import { useUploadMediaMutation } from '@/services/query/auth'
import DatePickerField from '@/components/form/DatePickerField.vue'
import { useAdminUsersListQuery } from '@/services/query/admin-users'
import { useAdminTermsListQuery } from '@/services/query/admin-terms'
import { certificateSchema } from '@/features/admin/certificates/schema'
import { useAdminCoursesListQuery } from '@/services/query/admin-courses'
import {
adminCertificatesKeys,
useAddAdminCertificateMutation,
} from '@/services/query/admin-certificates'
defineOptions({ name: 'IssueCertificateModal' })
const queryClient = useQueryClient()
const form = ref({
userId: '',
termId: '',
courseId: '',
issuedAt: '',
startedAt: '',
endedAt: '',
})
const { validate, errors, resetErrors } = useYup(certificateSchema)
const userSearch = ref('')
const userFilters = computed(() => ({ search: userSearch.value, roles: 'student' }))
const userPagination = ref({ page: 1, perPage: 10 })
const { data: usersResponse } = useAdminUsersListQuery(userFilters, userPagination)
const userOptions = computed(() => usersResponse.value?.data ?? [])
const searchUsers = useDebounce((q) => {
userSearch.value = q || ''
}, 400)
const termSearch = ref('')
const termFilters = computed(() => ({ title: termSearch.value }))
const termPagination = ref({ page: 1, perPage: 10 })
const { data: termsResponse } = useAdminTermsListQuery(termFilters, termPagination)
const termOptions = computed(() => termsResponse.value?.data ?? [])
const searchTerms = useDebounce((q) => {
termSearch.value = q || ''
}, 400)
const courseSearch = ref('')
const courseFilters = computed(() => ({ title: courseSearch.value }))
const coursePagination = ref({ page: 1, perPage: 10 })
const { data: coursesResponse } = useAdminCoursesListQuery(courseFilters, coursePagination)
const courseOptions = computed(() => coursesResponse.value?.data ?? [])
const searchCourses = useDebounce((q) => {
courseSearch.value = q || ''
}, 400)
const imageFiles = ref([])
const pdfFiles = ref([])
const uploadMediaMutation = useUploadMediaMutation()
const onImageSelect = async (files) => {
const file = files[0]
if (!file) return
try {
const fd = objectToFormData({ file, purpose: 'certificate_image' })
const response = await uploadMediaMutation.mutateAsync(fd)
const payload = response?.data ?? response
imageFiles.value = [{ id: payload?.id, name: file.name, size: file.size, url: payload?.url }]
} catch {
toast.error('بارگذاری تصویر گواهینامه با خطا مواجه شد.')
}
}
const onPdfSelect = async (files) => {
const file = files[0]
if (!file) return
try {
const fd = objectToFormData({ file, purpose: 'certificate_pdf' })
const response = await uploadMediaMutation.mutateAsync(fd)
const payload = response?.data ?? response
pdfFiles.value = [{ id: payload?.id, name: file.name, size: file.size, url: payload?.url }]
} catch {
toast.error('بارگذاری فایل PDF گواهینامه با خطا مواجه شد.')
}
}
const onFileError = (msg) => toast.error(msg)
const addMutation = useAddAdminCertificateMutation()
const submitting = computed(() => addMutation.isPending.value)
const onSubmit = async (close) => {
const payload = {
...form.value,
imageMediaId: imageFiles.value[0]?.id ?? null,
pdfMediaId: pdfFiles.value[0]?.id ?? null,
}
const { isValid } = await validate(payload)
if (!isValid) return
await addMutation.mutateAsync(payload)
await queryClient.invalidateQueries({ queryKey: adminCertificatesKeys.all })
resetErrors()
close()
}
</script>
<style lang="scss" scoped>
.issue-certificate {
width: 100%;
text-align: start;
padding: 0.5rem 0;
&__grid {
display: grid;
grid-template-columns: 1fr;
gap: 0.75rem;
margin-block: 0.75rem;
@media (min-width: 768px) {
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1280px) {
grid-template-columns: repeat(3, 1fr);
}
}
&__hint {
color: var(--color-error);
font-family: var(--font-family-fa);
font-size: 0.75rem;
margin: -0.25rem 0 0.5rem;
}
&__files {
display: grid;
grid-template-columns: 1fr;
gap: 1rem;
margin-top: 0.5rem;
@media (min-width: 768px) {
grid-template-columns: repeat(2, 1fr);
}
}
&__file-label {
display: block;
font-family: var(--font-family-fa);
font-size: 0.8125rem;
color: #4b5563;
margin-bottom: 0.375rem;
}
&__divider {
border-block-end: 1px solid var(--color-thd-gray);
margin-block: 1.5rem;
}
&__actions {
display: flex;
align-items: center;
justify-content: space-between;
}
&__btn-cancel {
min-width: 9rem;
}
&__btn-submit {
min-width: 12rem;
}
}
</style>
@@ -0,0 +1,129 @@
<template>
<div class="certificates-page">
<BoxedIconTitleBlock
class="certificates-page__heading"
title="مدیریت گواهینامه‌ها"
desc="در این قسمت می‌توانید برای طلبه‌ها گواهینامه صادر کنید"
>
<template #icon>
<SvgIcon name="certificate" :size="24" color="var(--color-primary)" />
</template>
</BoxedIconTitleBlock>
<div class="certificates-page__list-header">
<SimpleTitleIconBlock
title="لیست گواهینامه‌های صادرشده"
class="certificates-page__list-title"
>
<template #header-icon>
<SvgIcon name="list-bullets" :size="16" color="#bcbcbc" />
</template>
</SimpleTitleIconBlock>
<BaseButton
text="صدور گواهینامه جدید"
custom-class="certificates-page__add-btn"
@click="onAdd"
>
<template #appendIcon>
<SvgIcon name="arrow-left" :size="18" color="#fff" />
</template>
</BaseButton>
</div>
<SkeletonLoaderBlock v-if="isLoading" :rows="6" :cols-per-row="1" />
<div v-else-if="certificates.length > 0">
<CertificateItem
v-for="certificate in certificates"
:key="certificate.id"
:certificate="certificate"
@delete="onAskDelete"
/>
</div>
<NoItems v-else title="متاسفیم" desc="گواهینامه‌ای برای نمایش وجود ندارد." />
<PaginationBlock :pagination="paginationMeta" @update:page="setPage" />
<IssueCertificateModal v-if="isModal('IssueCertificateModal')" />
</div>
</template>
<script setup>
import { computed, ref } from 'vue'
import useModal from '@/composables/useModal'
import { useQueryClient } from '@tanstack/vue-query'
import BaseButton from '@/components/BaseButton.vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import NoItems from '@/components/blocks/NoItems.vue'
import { usePagination } from '@/composables/usePagination'
import PaginationBlock from '@/components/blocks/PaginationBlock.vue'
import BoxedIconTitleBlock from '@/components/blocks/BoxedIconTitleBlock.vue'
import SkeletonLoaderBlock from '@/components/blocks/SkeletonLoaderBlock.vue'
import SimpleTitleIconBlock from '@/components/blocks/SimpleTitleIconBlock.vue'
import CertificateItem from '@/features/admin/certificates/components/CertificateItem.vue'
import IssueCertificateModal from '@/features/admin/certificates/components/modals/IssueCertificateModal.vue'
import {
adminCertificatesKeys,
useAdminCertificatesListQuery,
useDeleteAdminCertificateMutation,
} from '@/services/query/admin-certificates'
const queryClient = useQueryClient()
const { openModal, isModal } = useModal()
const filters = ref({})
const { pagination, setPage } = usePagination({ page: 1, perPage: 10 })
const { data, isLoading } = useAdminCertificatesListQuery(filters, pagination, {
keepPreviousData: true,
})
const certificates = computed(() => data.value?.data ?? [])
const paginationMeta = computed(() => ({
page: pagination.value.page,
perPage: pagination.value.perPage,
...data.value?.meta,
}))
const onAdd = () => openModal('IssueCertificateModal')
const invalidate = () => queryClient.invalidateQueries({ queryKey: adminCertificatesKeys.all })
const deleteMutation = useDeleteAdminCertificateMutation()
const onAskDelete = (certificate) => {
openModal('ConfirmModal', {
title: `حذف گواهینامه ${certificate.user?.name || ''}`,
message:
'بعد از حذف امکان بازگشت وجود ندارد، آیا مطمئن هستید که می‌خواهید این گواهینامه را حذف کنید؟',
onConfirm: () => deleteMutation.mutate(certificate.id, { onSuccess: invalidate }),
})
}
</script>
<style lang="scss" scoped>
.certificates-page {
display: flex;
flex-direction: column;
gap: 0.5rem;
&__heading {
margin-bottom: 0.75rem;
}
&__list-header {
display: flex;
align-items: center;
gap: 0.625rem;
margin-bottom: 0.375rem;
}
&__list-title {
flex: 1;
margin-bottom: 0;
}
&__add-btn {
min-width: fit-content;
padding: 0 1.25rem;
}
}
</style>
@@ -0,0 +1,24 @@
import { mixed, number, object, string } from 'yup'
export const certificateSchema = object()
.shape({
userId: number().typeError('طلبه را انتخاب کنید').required('طلبه را انتخاب کنید'),
termId: mixed().nullable().notRequired(),
courseId: mixed().nullable().notRequired(),
issuedAt: string().nullable().notRequired(),
startedAt: string().nullable().notRequired(),
endedAt: string().nullable().notRequired(),
imageMediaId: number().nullable().notRequired(),
pdfMediaId: number().nullable().notRequired(),
})
.test('term-or-course', function (value) {
if (value?.termId || value?.courseId) return true
return this.createError({ path: 'termId', message: 'یکی از ترم یا دوره را انتخاب کنید' })
})
.test('image-or-pdf', function (value) {
if (value?.imageMediaId || value?.pdfMediaId) return true
return this.createError({
path: 'imageMediaId',
message: 'حداقل یک فایل (تصویر یا PDF) بارگذاری کنید',
})
})
@@ -1,8 +1,8 @@
<template> <template>
<div class="course-item"> <div class="course-item">
<div class="course-item__main"> <div class="course-item__main">
<div v-if="course.image" class="course-item__image"> <div v-if="course.coverUrl" class="course-item__image">
<img :src="course.image" :alt="course.title" /> <img :src="course.coverUrl" :alt="course.title" />
</div> </div>
<div v-else class="course-item__image course-item__image--placeholder"> <div v-else class="course-item__image course-item__image--placeholder">
<SvgIcon name="book" :size="22" color="#bcbcbc" /> <SvgIcon name="book" :size="22" color="#bcbcbc" />
@@ -30,14 +30,13 @@
/> />
</div> </div>
<div v-if="!isActive" class="course-item__status">
<span class="course-item__status-badge">
<span class="course-item__status-dot" />
غیرفعال
</span>
</div>
<div class="course-item__actions"> <div class="course-item__actions">
<div v-if="!isActive" class="course-item__status">
<span class="course-item__status-badge">
<span class="course-item__status-dot" />
غیرفعال
</span>
</div>
<ToggleSwitch <ToggleSwitch
:model-value="!!isActive" :model-value="!!isActive"
@update:model-value="emit('change-status', { id: course.id, isActive: !isActive })" @update:model-value="emit('change-status', { id: course.id, isActive: !isActive })"
@@ -192,10 +191,6 @@ const isActive = computed(() => props.course.isActive ?? false)
justify-content: flex-start; justify-content: flex-start;
} }
&__status {
flex: 0 0 auto;
}
&__status-badge { &__status-badge {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@@ -217,6 +212,7 @@ const isActive = computed(() => props.course.isActive ?? false)
&__actions { &__actions {
display: flex; display: flex;
flex-wrap: wrap;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
gap: 0.375rem; gap: 0.375rem;
@@ -154,7 +154,7 @@ const form = ref({
templateId: '', templateId: '',
title: '', title: '',
capacity: '', capacity: '',
imageId: null, coverMediaId: null,
isActive: false, isActive: false,
}) })
@@ -212,10 +212,10 @@ watch(existingCourse, (course) => {
templateId: '', templateId: '',
title: course.title || '', title: course.title || '',
capacity: course.capacity ?? '', capacity: course.capacity ?? '',
imageId: course.imageId || null, coverMediaId: course.coverMediaId || null,
isActive: course.isActive ?? false, isActive: course.isActive ?? false,
} }
if (course.image) image.value = { url: course.image } if (course.coverUrl) image.value = { url: course.coverUrl }
}) })
const uploadMutation = useUploadMediaMutation() const uploadMutation = useUploadMediaMutation()
@@ -225,8 +225,8 @@ const onImageCropped = async (file) => {
const formData = objectToFormData({ file, purpose: 'cover', context: 'course' }) const formData = objectToFormData({ file, purpose: 'cover', context: 'course' })
const response = await uploadMutation.mutateAsync(formData) const response = await uploadMutation.mutateAsync(formData)
const payload = response?.data ?? response const payload = response?.data ?? response
image.value = { url: payload?.url, uploadId: payload?.uploadId, ...payload } image.value = { url: payload?.url, ...payload }
form.value.imageId = payload?.uploadId || payload?.id form.value.coverMediaId = payload?.id
} catch { } catch {
/* handled globally */ /* handled globally */
} }
@@ -14,7 +14,7 @@
<template v-else-if="course"> <template v-else-if="course">
<div class="course-details__hero"> <div class="course-details__hero">
<div class="course-details__image"> <div class="course-details__image">
<img v-if="course.image" :src="course.image" :alt="course.title" /> <img v-if="course.coverUrl" :src="course.coverUrl" :alt="course.title" />
<SvgIcon v-else name="book" :size="32" color="#bcbcbc" /> <SvgIcon v-else name="book" :size="32" color="#bcbcbc" />
</div> </div>
<div class="course-details__grid"> <div class="course-details__grid">
+1 -1
View File
@@ -24,6 +24,6 @@ export const offeredCourseSchema = object().shape({
.required() .required()
.integer('ظرفیت باید عدد صحیح باشد') .integer('ظرفیت باید عدد صحیح باشد')
.min(1, 'ظرفیت باید حداقل ۱ نفر باشد'), .min(1, 'ظرفیت باید حداقل ۱ نفر باشد'),
imageId: string().nullable().notRequired(), coverMediaId: number().typeError('شناسه تصویر دوره باید عدد باشد').nullable().notRequired(),
isActive: boolean().nullable().notRequired(), isActive: boolean().nullable().notRequired(),
}) })
+22
View File
@@ -241,6 +241,17 @@ export default [
subtitle: 'لیست خدمات را مشاهده و مدیریت نمایید.', subtitle: 'لیست خدمات را مشاهده و مدیریت نمایید.',
}, },
}, },
{
path: '/service-types',
name: 'admin-service-types',
component: () => import('@/features/admin/services/pages/ServiceTypesPage.vue'),
meta: {
layout: 'admin',
role: 'admin',
title: 'مرکز خدمات',
subtitle: 'انواع خدمات قابل درخواست توسط کاربران را مدیریت کنید.',
},
},
{ {
path: '/consultations', path: '/consultations',
name: 'admin-consultations', name: 'admin-consultations',
@@ -263,4 +274,15 @@ export default [
subtitle: 'درخواست‌های اعزام مبلغین را مشاهده و مدیریت نمایید.', subtitle: 'درخواست‌های اعزام مبلغین را مشاهده و مدیریت نمایید.',
}, },
}, },
{
path: '/certificates',
name: 'admin-certificates',
component: () => import('@/features/admin/certificates/pages/AdminCertificatesPage.vue'),
meta: {
layout: 'admin',
role: 'admin',
title: 'گواهینامه‌ها',
subtitle: 'گواهینامه‌های دوره‌ها را صادر و مدیریت نمایید.',
},
},
] ]
@@ -0,0 +1,86 @@
<template>
<div class="service-type-item">
<div class="service-type-item__main">
<p class="service-type-item__title">{{ serviceType.title }}</p>
<p class="service-type-item__desc">{{ serviceType.description || '—' }}</p>
</div>
<div class="service-type-item__actions">
<CircleButton
tooltip="ویرایش"
bg-color="rgba(104, 104, 104, 0.05)"
size="2.5rem"
@click="emit('edit', serviceType)"
>
<template #icon>
<SvgIcon name="pencil" :size="18" color="var(--color-primary)" />
</template>
</CircleButton>
<CircleButton
tooltip="حذف"
bg-color="rgba(104, 104, 104, 0.05)"
size="2.5rem"
@click="emit('delete', serviceType)"
>
<template #icon>
<SvgIcon name="trash" :size="18" color="var(--color-error)" />
</template>
</CircleButton>
</div>
</div>
</template>
<script setup>
import SvgIcon from '@/components/icons/SvgIcon.vue'
import CircleButton from '@/components/CircleButton.vue'
defineProps({
serviceType: { type: Object, required: true },
})
const emit = defineEmits(['edit', 'delete'])
</script>
<style lang="scss" scoped>
.service-type-item {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 50%);
box-shadow: 0 4px 10px -6px rgba(241, 241, 241, 70%);
border-radius: 0.875rem;
margin-bottom: 0.625rem;
&__main {
flex: 1;
min-width: 0;
}
&__title {
font-family: var(--font-family-fa);
font-size: 1rem;
color: #4b4b4b;
margin: 0 0 0.25rem;
}
&__desc {
font-family: var(--font-family-fa);
font-size: 0.8125rem;
color: #848484;
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
&__actions {
display: flex;
align-items: center;
gap: 0.375rem;
flex-shrink: 0;
}
}
</style>
@@ -0,0 +1,138 @@
<template>
<BasicModal
:title="isEditMode ? 'ویرایش نوع خدمت' : 'افزودن نوع خدمت'"
title-en="Service Type"
width="95%"
max-width="40rem"
min-width="auto"
:show-close-button="true"
>
<template #default="{ close }">
<form class="service-type-form" @submit.prevent="onSubmit(close)">
<TextField
v-model="form.title"
name="title"
label="عنوان نوع خدمت"
placeholder="مثال: خدمات رفاهی"
:error="errors.title"
@blur="validateAt('title', form.title)"
/>
<TextareaField
v-model="form.description"
name="description"
label="توضیحات"
placeholder="توضیح کوتاهی درباره این نوع خدمت بنویسید"
:row="4"
:error="errors.description"
/>
<div class="service-type-form__divider" />
<div class="service-type-form__actions">
<BaseButton
variant="transparent"
text="منصرف شدم"
custom-class="service-type-form__btn-cancel"
@click="close"
>
<template #prependIcon>
<SvgIcon name="caret-right" :size="14" color="var(--color-sec-gray)" />
</template>
</BaseButton>
<BaseButton
type="submit"
:text="isEditMode ? 'ذخیره تغییرات' : 'افزودن'"
:loading="submitting"
custom-class="service-type-form__btn-submit"
>
<template #appendIcon>
<SvgIcon name="arrow-left" :size="18" color="#fff" />
</template>
</BaseButton>
</div>
</form>
</template>
</BasicModal>
</template>
<script setup>
import { computed, ref } from 'vue'
import useYup from '@/composables/useYup'
import useModal from '@/composables/useModal'
import { useQueryClient } from '@tanstack/vue-query'
import BaseButton from '@/components/BaseButton.vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import BasicModal from '@/components/BasicModal.vue'
import TextField from '@/components/form/TextField.vue'
import TextareaField from '@/components/form/TextareaField.vue'
import { serviceTypeSchema } from '@/features/admin/services/schema/service-type'
import {
serviceTypesKeys,
useAddServiceTypeMutation,
useUpdateServiceTypeMutation,
} from '@/services/query/service-types'
defineOptions({ name: 'ServiceTypeFormModal' })
const queryClient = useQueryClient()
const { getModal } = useModal()
const modalData = computed(() => getModal('ServiceTypeFormModal')?.data ?? {})
const editingServiceType = computed(() => modalData.value.serviceType ?? null)
const isEditMode = computed(() => !!editingServiceType.value)
const form = ref({
title: editingServiceType.value?.title ?? '',
description: editingServiceType.value?.description ?? '',
})
const { validate, validateAt, errors } = useYup(serviceTypeSchema)
const addMutation = useAddServiceTypeMutation()
const updateMutation = useUpdateServiceTypeMutation()
const submitting = computed(() => addMutation.isPending.value || updateMutation.isPending.value)
const onSubmit = async (close) => {
const { isValid, payload } = await validate(form.value)
if (!isValid) return
if (isEditMode.value) {
await updateMutation.mutateAsync({ id: editingServiceType.value.id, payload })
} else {
await addMutation.mutateAsync(payload)
}
await queryClient.invalidateQueries({ queryKey: serviceTypesKeys.all })
close()
}
</script>
<style lang="scss" scoped>
.service-type-form {
width: 100%;
text-align: start;
padding: 0.5rem 0;
display: flex;
flex-direction: column;
gap: 0.75rem;
&__divider {
border-block-end: 1px solid var(--color-thd-gray);
margin-block: 1rem;
}
&__actions {
display: flex;
align-items: center;
justify-content: space-between;
}
&__btn-cancel {
min-width: 9rem;
}
&__btn-submit {
min-width: 10rem;
}
}
</style>
+2
View File
@@ -1,4 +1,6 @@
export { default as SendMessageModal } from './components/modals/SendMessageModal.vue' export { default as SendMessageModal } from './components/modals/SendMessageModal.vue'
export { default as ServiceDetailsModal } from './components/modals/ServiceDetailsModal.vue' export { default as ServiceDetailsModal } from './components/modals/ServiceDetailsModal.vue'
export { default as ServiceTypeFormModal } from './components/modals/ServiceTypeFormModal.vue'
export { default as ServiceItem } from './components/ServiceItem.vue' export { default as ServiceItem } from './components/ServiceItem.vue'
export { default as ServiceTypeItem } from './components/ServiceTypeItem.vue'
export { default as ServicesFilters } from './components/ServicesFilters.vue' export { default as ServicesFilters } from './components/ServicesFilters.vue'
@@ -0,0 +1,109 @@
<template>
<div class="service-types-page">
<BoxedIconTitleBlock
class="service-types-page__heading"
title="انواع خدمات"
desc="در این قسمت می‌توانید نوع‌های خدمت قابل درخواست توسط کاربران را تعریف کنید."
>
<template #icon>
<SvgIcon name="users-three" :size="24" color="var(--color-primary)" />
</template>
</BoxedIconTitleBlock>
<div class="service-types-page__list-header">
<SimpleTitleIconBlock title="لیست انواع خدمات" class="service-types-page__list-title">
<template #header-icon>
<SvgIcon name="list-bullets" :size="16" color="#bcbcbc" />
</template>
</SimpleTitleIconBlock>
<BaseButton text="افزودن نوع خدمت" custom-class="service-types-page__add-btn" @click="onAdd">
<template #appendIcon>
<SvgIcon name="plus" :size="18" color="#fff" />
</template>
</BaseButton>
</div>
<SkeletonLoaderBlock v-if="isLoading" :rows="4" :cols-per-row="1" />
<div v-else-if="serviceTypes.length > 0">
<ServiceTypeItem
v-for="serviceType in serviceTypes"
:key="serviceType.id"
:service-type="serviceType"
@edit="onEdit"
@delete="onAskDelete"
/>
</div>
<NoItems v-else title="موردی نیست" desc="هنوز هیچ نوع خدمتی تعریف نشده است." />
<ServiceTypeFormModal v-if="isModal('ServiceTypeFormModal')" />
</div>
</template>
<script setup>
import { computed } from 'vue'
import useModal from '@/composables/useModal'
import { useQueryClient } from '@tanstack/vue-query'
import BaseButton from '@/components/BaseButton.vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import NoItems from '@/components/blocks/NoItems.vue'
import BoxedIconTitleBlock from '@/components/blocks/BoxedIconTitleBlock.vue'
import SkeletonLoaderBlock from '@/components/blocks/SkeletonLoaderBlock.vue'
import SimpleTitleIconBlock from '@/components/blocks/SimpleTitleIconBlock.vue'
import ServiceTypeItem from '@/features/admin/services/components/ServiceTypeItem.vue'
import ServiceTypeFormModal from '@/features/admin/services/components/modals/ServiceTypeFormModal.vue'
import {
serviceTypesKeys,
useServiceTypesListQuery,
useDeleteServiceTypeMutation,
} from '@/services/query/service-types'
const queryClient = useQueryClient()
const { openModal, isModal } = useModal()
const { data, isLoading } = useServiceTypesListQuery()
const serviceTypes = computed(() => data.value ?? [])
const onAdd = () => openModal('ServiceTypeFormModal')
const onEdit = (serviceType) => openModal('ServiceTypeFormModal', { serviceType })
const invalidate = () => queryClient.invalidateQueries({ queryKey: serviceTypesKeys.all })
const deleteMutation = useDeleteServiceTypeMutation()
const onAskDelete = (serviceType) => {
openModal('ConfirmModal', {
title: `حذف نوع خدمت «${serviceType.title}»`,
message:
'بعد از حذف امکان بازگشت وجود ندارد، آیا مطمئن هستید که می‌خواهید این نوع خدمت را حذف کنید؟',
onConfirm: () => deleteMutation.mutate(serviceType.id, { onSuccess: invalidate }),
})
}
</script>
<style lang="scss" scoped>
.service-types-page {
display: flex;
flex-direction: column;
gap: 0.5rem;
&__heading {
margin-bottom: 0.75rem;
}
&__list-header {
display: flex;
align-items: center;
gap: 0.625rem;
margin-bottom: 0.375rem;
}
&__list-title {
flex: 1;
margin-bottom: 0;
}
&__add-btn {
min-width: fit-content;
padding: 0 1.25rem;
}
}
</style>
@@ -0,0 +1,6 @@
import { object, string } from 'yup'
export const serviceTypeSchema = object().shape({
title: string().trim().required('عنوان نوع خدمت را وارد کنید').max(255, 'عنوان طولانی است'),
description: string().trim().nullable().notRequired().max(2000, 'توضیحات طولانی است'),
})
@@ -1,8 +1,8 @@
<template> <template>
<div class="course-item"> <div class="course-item">
<div class="course-item__main"> <div class="course-item__main">
<div v-if="course.image" class="course-item__image"> <div v-if="course.coverUrl" class="course-item__image">
<img :src="course.image" :alt="course.title" /> <img :src="course.coverUrl" :alt="course.title" />
</div> </div>
<div v-else class="course-item__image course-item__image--placeholder"> <div v-else class="course-item__image course-item__image--placeholder">
<SvgIcon name="book" :size="22" color="#bcbcbc" /> <SvgIcon name="book" :size="22" color="#bcbcbc" />
@@ -17,14 +17,13 @@
</div> </div>
</div> </div>
<div v-if="!term.isActive" class="term-item__status">
<span class="term-item__status-badge">
<span class="term-item__status-dot" />
غیرفعال
</span>
</div>
<div class="term-item__actions"> <div class="term-item__actions">
<div v-if="!term.isActive" class="term-item__status">
<span class="term-item__status-badge">
<span class="term-item__status-dot" />
غیرفعال
</span>
</div>
<ToggleSwitch <ToggleSwitch
:model-value="!!term.isActive" :model-value="!!term.isActive"
@update:model-value="emit('change-status', { id: term.id, isActive: !term.isActive })" @update:model-value="emit('change-status', { id: term.id, isActive: !term.isActive })"
@@ -166,10 +165,6 @@ const createdDate = computed(() => formatJalaaliDate(props.term.createdAt) || ''
font-size: 0.75rem; font-size: 0.75rem;
} }
&__status {
flex: 0 0 auto;
}
&__status-badge { &__status-badge {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@@ -191,6 +186,7 @@ const createdDate = computed(() => formatJalaaliDate(props.term.createdAt) || ''
&__actions { &__actions {
display: flex; display: flex;
flex-wrap: wrap;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
gap: 0.375rem; gap: 0.375rem;
@@ -0,0 +1,392 @@
<template>
<div class="user-evaluation">
<div class="user-evaluation__header">
<LineTitleBlock
class="user-evaluation__title"
title="سیستم ارزیابی کاربر"
title-en="User Evaluation System"
/>
<BaseButton
text="دانلود PDF"
:loading="pdfLoading"
:disabled="isLoading || !evaluation"
custom-class="user-evaluation__pdf-btn"
data-pdf-ignore
@click="onSaveAsPdf"
>
<template #appendIcon>
<SvgIcon name="arrow-left" :size="16" color="#fff" />
</template>
</BaseButton>
</div>
<SkeletonLoaderBlock v-if="isLoading" :rows="2" :cols-per-row="3" />
<div v-else-if="evaluation" ref="pdfContent" class="user-evaluation__content">
<header class="user-evaluation__pdf-header">
<h1>سیستم ارزیابی کاربر</h1>
<p>{{ fullName }}</p>
</header>
<section class="user-evaluation__section">
<p class="user-evaluation__section-title">مشخصات هویتی</p>
<div class="user-evaluation__identity-grid">
<LineInfoBlock title="نام و نام خانوادگی" :numeric-desc="fullName" />
<LineInfoBlock title="شماره تماس" :numeric-desc="user?.phone || '—'" />
<LineInfoBlock title="کد ملی" :numeric-desc="user?.nationalCode || '—'" />
<LineInfoBlock title="نقش" :desc="roleText" />
<LineInfoBlock title="تاریخ عضویت" :numeric-desc="joinDateLabel" />
</div>
</section>
<section class="user-evaluation__section">
<p class="user-evaluation__section-title">خلاصه عملکرد</p>
<div class="user-evaluation__stats">
<div v-for="(stat, i) in stats" :key="i" class="user-evaluation__stat-card">
<div class="user-evaluation__stat-icon">
<SvgIcon :name="stat.icon" :size="20" color="var(--color-primary)" />
</div>
<div class="user-evaluation__stat-text">
<p class="user-evaluation__stat-label">{{ stat.label }}</p>
<p class="user-evaluation__stat-value">
{{ stat.value }}
<span v-if="stat.unit" class="user-evaluation__stat-unit">{{ stat.unit }}</span>
</p>
<p v-if="stat.subtitle" class="user-evaluation__stat-subtitle">
{{ stat.subtitle }}
</p>
</div>
</div>
</div>
</section>
</div>
<NoItems v-else title="موردی نیست" desc="اطلاعات ارزیابی این کاربر در دسترس نیست." />
</div>
</template>
<script setup>
import { computed, ref } from 'vue'
import { toast } from 'vue3-toastify'
import { ROLE_LABELS } from '@/enums'
import BaseButton from '@/components/BaseButton.vue'
import SvgIcon from '@/components/icons/SvgIcon.vue'
import NoItems from '@/components/blocks/NoItems.vue'
import { formatJalaaliDate } from '@/utils/date-utils'
import LineTitleBlock from '@/components/LineTitleBlock.vue'
import LineInfoBlock from '@/components/blocks/LineInfoBlock.vue'
import { useAdminUserEvaluationQuery } from '@/services/query/admin-users'
import SkeletonLoaderBlock from '@/components/blocks/SkeletonLoaderBlock.vue'
const props = defineProps({
userId: { type: [Number, String], required: true },
user: { type: Object, default: null },
})
const userIdRef = computed(() => props.userId)
const { data: evaluation, isLoading } = useAdminUserEvaluationQuery(userIdRef, {
enabled: () => !!userIdRef.value,
})
const fullName = computed(() => props.user?.name || '—')
const roleText = computed(() => {
const names = (props.user?.roles || [])
.map((r) => (typeof r === 'string' ? r : r?.name))
.filter(Boolean)
if (names.length === 0) return 'بدون نقش'
return names.map((name) => ROLE_LABELS[name] || name).join('، ')
})
const joinDateLabel = computed(() => formatJalaaliDate(props.user?.createdAt) || '—')
const formatMembershipDuration = (days) => {
if (days == null) return '—'
if (days < 1) return 'کمتر از یک روز'
const years = Math.floor(days / 365)
const months = Math.floor((days % 365) / 30)
const remDays = Math.floor(days % 30)
const parts = []
if (years) parts.push(`${years} سال`)
if (months) parts.push(`${months} ماه`)
if (!years && !months) parts.push(`${remDays} روز`)
return parts.join(' و ')
}
const stats = computed(() => {
const e = evaluation.value || {}
const exams = e.exams || {}
const assignments = e.assignments || {}
return [
{
icon: 'video',
label: 'جلسات مشاهده‌شده',
value: e.sessions_viewed ?? 0,
unit: 'جلسه',
},
{
icon: 'check-square',
label: 'آزمون‌های شرکت‌کرده',
value: exams.taken ?? 0,
unit: 'آزمون',
subtitle: `قبول‌شده: ${exams.passed ?? 0}`,
},
{
icon: 'certificate',
label: 'میانگین امتیاز',
value: exams.average_score_percent ?? '—',
unit: exams.average_score_percent == null ? '' : '%',
},
{
icon: 'file',
label: 'تکالیف انجام‌شده',
value: assignments.completed ?? 0,
unit: 'تکلیف',
subtitle: `تاییدشده: ${assignments.accepted ?? 0}`,
},
{
icon: 'book',
label: 'ترم فعلی',
value: e.current_term?.title || 'بدون ترم',
unit: '',
},
{
icon: 'clock',
label: 'مدت عضویت',
value: formatMembershipDuration(e.member_since?.days),
unit: '',
},
]
})
const pdfContent = ref(null)
const pdfLoading = ref(false)
const onSaveAsPdf = async () => {
if (!pdfContent.value || isLoading.value || pdfLoading.value) return
pdfLoading.value = true
try {
await document.fonts?.ready
const pdfSource = pdfContent.value.cloneNode(true)
pdfSource.classList.add('user-evaluation__content--pdf')
pdfSource.querySelectorAll('[data-pdf-ignore]').forEach((element) => element.remove())
const html2pdfModule = await import('html2pdf.js')
const html2pdf = html2pdfModule.default || html2pdfModule
await html2pdf()
.set({
margin: [8, 8, 8, 8],
filename: `user-evaluation-${props.userId}.pdf`,
image: { type: 'jpeg', quality: 0.98 },
html2canvas: {
scale: 2,
useCORS: true,
backgroundColor: '#ffffff',
logging: false,
},
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' },
pagebreak: {
mode: ['css', 'legacy'],
avoid: ['.user-evaluation__section', '.user-evaluation__stat-card'],
},
})
.from(pdfSource)
.save()
} catch {
toast.error('ساخت فایل PDF با خطا مواجه شد.')
} finally {
pdfLoading.value = false
}
}
</script>
<style lang="scss" scoped>
.user-evaluation {
width: 100%;
display: flex;
flex-direction: column;
gap: 0.5rem;
text-align: start;
&__header {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.625rem;
}
&__title {
flex: 1;
min-width: 12rem;
padding: 0;
}
&__pdf-btn {
min-width: 9rem;
flex-shrink: 0;
}
&__pdf-header {
display: none;
}
&__section {
margin-bottom: 1.25rem;
&:last-child {
margin-bottom: 0;
}
}
&__section-title {
font-family: var(--font-family-fa);
font-weight: 500;
font-size: 0.8125rem;
color: #8a8a8a;
margin: 0 0 0.625rem;
}
&__identity-grid {
display: grid;
grid-template-columns: 1fr;
gap: 0.25rem;
@media (min-width: 640px) {
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1024px) {
grid-template-columns: repeat(3, 1fr);
}
}
&__stats {
display: grid;
grid-template-columns: 1fr;
gap: 0.75rem;
@media (min-width: 640px) {
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1024px) {
grid-template-columns: repeat(3, 1fr);
}
}
&__stat-card {
display: flex;
align-items: flex-start;
gap: 0.625rem;
padding: 0.875rem;
background: rgba(255, 255, 255, 55%);
box-shadow: 0 4px 10px -6px rgba(0, 0, 0, 8%);
border-radius: 0.875rem;
min-width: 0;
}
&__stat-icon {
flex-shrink: 0;
width: 2.5rem;
height: 2.5rem;
border-radius: 0.625rem;
background: rgba(243, 102, 117, 8%);
display: flex;
align-items: center;
justify-content: center;
}
&__stat-text {
min-width: 0;
flex: 1;
}
&__stat-label {
margin: 0 0 0.25rem;
font-family: var(--font-family-fa);
font-weight: 400;
font-size: 0.75rem;
line-height: 1.3;
color: #9a9a9a;
}
&__stat-value {
margin: 0;
font-family: var(--font-family-fa);
font-weight: 700;
font-size: 1.0625rem;
line-height: 1.4;
color: #4b4b4b;
word-break: break-word;
}
&__stat-unit {
font-family: var(--font-family-fa);
font-weight: 400;
font-size: 0.75rem;
color: #8a8a8a;
}
&__stat-subtitle {
margin: 0.25rem 0 0;
font-family: var(--font-family-fa);
font-size: 0.6875rem;
color: #9a9a9a;
}
&__content--pdf {
width: 100%;
padding: 0.25rem;
background: #fff;
box-sizing: border-box;
direction: rtl;
}
&__content--pdf &__pdf-header {
display: block;
margin-bottom: 1.5rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid #eee;
text-align: right;
break-after: avoid;
h1 {
margin: 0;
font-family: var(--font-family-fa);
font-size: 1.25rem;
font-weight: 500;
color: #4b4b4b;
}
p {
margin: 0.25rem 0 0;
font-family: var(--font-family-fa);
font-size: 0.875rem;
color: #808080;
}
}
&__content--pdf &__section {
margin-bottom: 1rem;
break-inside: avoid;
page-break-inside: avoid;
}
&__content--pdf &__identity-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
&__content--pdf &__stats {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
&__content--pdf &__stat-card {
break-inside: avoid;
page-break-inside: avoid;
}
}
</style>
@@ -25,12 +25,12 @@
<button <button
type="button" type="button"
class="users-table__role-badge" class="users-table__role-badge"
:class="`users-table__role-badge--${roleName(user) || 'unknown'}`" :class="`users-table__role-badge--${roleNames(user)[0] || 'unknown'}`"
:disabled="updateRoleMutation.isPending.value && activeUser?.id === user.id" :disabled="updateRoleMutation.isPending.value && activeUser?.id === user.id"
@click="onRoleClick($event, user)" @click="onRoleClick($event, user)"
> >
<span class="users-table__role-dot" /> <span class="users-table__role-dot" />
<span>{{ roleLabel(user) || 'بدون نقش' }}</span> <span>{{ roleLabelsText(user) || 'بدون نقش' }}</span>
<SvgIcon name="caret-down" :size="12" color="currentColor" /> <SvgIcon name="caret-down" :size="12" color="currentColor" />
</button> </button>
<Badge v-if="user.status === 'blocked'" variant="danger" size="sm" dot> <Badge v-if="user.status === 'blocked'" variant="danger" size="sm" dot>
@@ -96,15 +96,13 @@ const queryClient = useQueryClient()
const emit = defineEmits(['edit', 'delete', 'block', 'unblock', 'show-details']) const emit = defineEmits(['edit', 'delete', 'block', 'unblock', 'show-details'])
const roleName = (user) => { const roleNames = (user) =>
const first = user.roles?.[0] (user.roles || []).map((r) => (typeof r === 'string' ? r : r?.name)).filter(Boolean)
return typeof first === 'string' ? first : first?.name
}
const roleLabel = (user) => { const roleLabelsText = (user) => {
const name = roleName(user) const names = roleNames(user)
if (!name) return '' if (names.length === 0) return ''
return ROLES.find((r) => r.value === name)?.label || name return names.map((name) => ROLES.find((r) => r.value === name)?.label || name).join('، ')
} }
const menuOpen = ref(false) const menuOpen = ref(false)
@@ -140,23 +138,39 @@ const onRoleClick = (event, user) => {
roleMenuOpen.value = true roleMenuOpen.value = true
} }
const onChangeRole = (targetRoleName) => { // Toggles one role's membership without touching the user's other roles —
// access must stay additive, so this can never collapse into a single-role
// replace the way the old "switch to X" action used to.
const onToggleRole = (targetRoleName, isAssigned) => {
const user = activeUser.value const user = activeUser.value
if (!user || !targetRoleName) return if (!user || !targetRoleName) return
const current = roleNames(user)
const nextRoles = isAssigned
? current.filter((r) => r !== targetRoleName)
: [...current, targetRoleName]
if (nextRoles.length === 0) return
updateRoleMutation.mutate( updateRoleMutation.mutate(
{ id: user.id, payload: { roles: [targetRoleName] } }, { id: user.id, payload: { roles: nextRoles } },
{ onSuccess: invalidateUsers } { onSuccess: invalidateUsers }
) )
} }
const roleMenuItems = computed(() => { const roleMenuItems = computed(() => {
const current = activeUser.value ? roleName(activeUser.value) : null const user = activeUser.value
return ROLES.filter((r) => r.changeable && r.value !== current).map((r) => ({ if (!user) return []
key: `role-${r.value}`, const current = roleNames(user)
label: `تغییر به ${r.label}`, return ROLES.filter((r) => r.changeable).map((r) => {
icon: 'arrows-clockwise', const isAssigned = current.includes(r.value)
onClick: () => onChangeRole(r.value), const isLastRole = isAssigned && current.length <= 1
})) return {
key: `role-${r.value}`,
label: isAssigned ? `حذف نقش ${r.label}` : `افزودن نقش ${r.label}`,
icon: isAssigned ? 'close' : 'check',
danger: isAssigned,
disabled: isLastRole,
onClick: () => onToggleRole(r.value, isAssigned),
}
})
}) })
const menuItems = computed(() => { const menuItems = computed(() => {
@@ -76,6 +76,10 @@
</div> </div>
<LineInfoBlock title="گرایش/رشته تحصیلی" :desc="user.fieldOfStudy || '—'" /> <LineInfoBlock title="گرایش/رشته تحصیلی" :desc="user.fieldOfStudy || '—'" />
</div> </div>
<div class="user-details__section">
<UserEvaluationPanel :user-id="userId" :user="user" />
</div>
</template> </template>
<NoItems v-else title="یافت نشد" desc="اطلاعات این کاربر در دسترس نیست." /> <NoItems v-else title="یافت نشد" desc="اطلاعات این کاربر در دسترس نیست." />
@@ -106,6 +110,7 @@ import LineTitleBlock from '@/components/LineTitleBlock.vue'
import { useAdminUserQuery } from '@/services/query/admin-users' import { useAdminUserQuery } from '@/services/query/admin-users'
import LineInfoBlock from '@/components/blocks/LineInfoBlock.vue' import LineInfoBlock from '@/components/blocks/LineInfoBlock.vue'
import SkeletonLoaderBlock from '@/components/blocks/SkeletonLoaderBlock.vue' import SkeletonLoaderBlock from '@/components/blocks/SkeletonLoaderBlock.vue'
import UserEvaluationPanel from '@/features/admin/users/components/UserEvaluationPanel.vue'
import { import {
EDUCATION_STATUS, EDUCATION_STATUS,
GENDER, GENDER,
+12 -10
View File
@@ -19,14 +19,15 @@
<div class="user-form__row"> <div class="user-form__row">
<div class="user-form__cell user-form__cell--third"> <div class="user-form__cell user-form__cell--third">
<SelectField <SelectField
v-model="form.role" v-model="form.roles"
name="role" name="roles"
label="نقش" label="نقش‌ها"
:multiple="true"
:options="ROLES" :options="ROLES"
option-label="label" option-label="label"
option-value="value" option-value="value"
:error="errors.role" :error="errors.roles"
@change="validateAt('role', form.role)" @change="validateAt('roles', form.roles)"
/> />
</div> </div>
<div class="user-form__cell user-form__cell--third"> <div class="user-form__cell user-form__cell--third">
@@ -265,7 +266,7 @@ const { data: cities = ref([]) } = useGetCitiesOfProvinceQuery(provinceIdRef, {
const initialNationalCode = ref('') const initialNationalCode = ref('')
const form = ref({ const form = ref({
role: '', roles: [],
name: '', name: '',
birthday: '', birthday: '',
nationalCode: '', nationalCode: '',
@@ -307,11 +308,12 @@ watch(
existingUser, existingUser,
(user) => { (user) => {
if (!user) return if (!user) return
const firstRole = Array.isArray(user.roles) ? user.roles[0] : null const roleValues = Array.isArray(user.roles)
const roleValue = typeof firstRole === 'object' ? firstRole?.name : firstRole ? user.roles.map((r) => (typeof r === 'object' ? r?.name : r)).filter(Boolean)
: []
form.value = { form.value = {
...form.value, ...form.value,
role: roleValue || '', roles: roleValues,
name: user.name || `${user.firstName || ''} ${user.lastName || ''}`.trim(), name: user.name || `${user.firstName || ''} ${user.lastName || ''}`.trim(),
birthday: user.birthday || '', birthday: user.birthday || '',
nationalCode: user.nationalCode || '', nationalCode: user.nationalCode || '',
@@ -360,7 +362,7 @@ const submitting = computed(() => addMutation.isPending.value || updateMutation.
const buildUpdatePayload = () => { const buildUpdatePayload = () => {
return { return {
name: form.value.name, name: form.value.name,
roles: form.value.role ? [form.value.role] : [], roles: form.value.roles,
provinceId: form.value.provinceId || null, provinceId: form.value.provinceId || null,
cityId: form.value.cityId || null, cityId: form.value.cityId || null,
marriageStatus: form.value.maritalStatus || null, marriageStatus: form.value.maritalStatus || null,
+2 -2
View File
@@ -1,4 +1,4 @@
import { number, object, string } from 'yup' import { array, number, object, string } from 'yup'
import { passwordRule } from '@/constants/rules/passwordRule' import { passwordRule } from '@/constants/rules/passwordRule'
import { phoneNumberRule } from '@/constants/rules/phoneNumberRule' import { phoneNumberRule } from '@/constants/rules/phoneNumberRule'
import { nationalCodeRule } from '@/constants/rules/nationalCodeRule' import { nationalCodeRule } from '@/constants/rules/nationalCodeRule'
@@ -9,7 +9,7 @@ export const rejectionReasonSchema = object().shape({
}) })
const baseUserShape = { const baseUserShape = {
role: string().required(), roles: array().of(string().required()).min(1, 'حداقل یک نقش را انتخاب کنید').required(),
name: string().required().min(3), name: string().required().min(3),
phone: phoneNumberRule, phone: phoneNumberRule,
nationalCode: nationalCodeRule, nationalCode: nationalCodeRule,
@@ -1,6 +1,6 @@
<template> <template>
<div class="auth-copyright"> <div class="auth-copyright">
<a href="https://mugweb.ir/" target="_blank" rel="noopener"> <a href="https://madresebanoo.ir/" target="_blank" rel="noopener">
<p class="auth-copyright__fa">تمام حقوق مادی و معنوی این وبسایت محفوظ هست</p> <p class="auth-copyright__fa">تمام حقوق مادی و معنوی این وبسایت محفوظ هست</p>
<p class="auth-copyright__en">All Rights Reserved. 2026</p> <p class="auth-copyright__en">All Rights Reserved. 2026</p>
</a> </a>
@@ -2,7 +2,8 @@ import { useAuthStore } from '@/store/auth'
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { MAIN_SITE_URL, ROLE_HOME_ROUTES } from '@/enums' import { MAIN_SITE_URL, ROLE_HOME_ROUTES } from '@/enums'
const shouldLandOnMainSite = (auth) => auth.role !== 'admin' && auth.user?.status === 'approved' const shouldLandOnMainSite = (auth) =>
!auth.roles.includes('admin') && auth.user?.status === 'approved'
export const useRedirectAfterLogin = () => { export const useRedirectAfterLogin = () => {
const router = useRouter() const router = useRouter()
@@ -18,6 +18,17 @@
<p class="student-register__desc">{{ stepLabel.desc }}</p> <p class="student-register__desc">{{ stepLabel.desc }}</p>
</header> </header>
<div
v-if="auth.user?.status === 'blocked'"
class="student-register__rejection"
role="alert"
>
<p class="student-register__rejection-title">احراز هویت شما توسط ادمین رد شده است.</p>
<p class="student-register__rejection-reason">
{{ auth.user?.blockReason || 'دلیلی ثبت نشده است.' }}
</p>
</div>
<div v-if="isRegistrationDataPending" class="student-register__loading" aria-live="polite"> <div v-if="isRegistrationDataPending" class="student-register__loading" aria-live="polite">
در حال بازیابی اطلاعات ثبت‌نام… در حال بازیابی اطلاعات ثبت‌نام…
</div> </div>
@@ -30,6 +41,7 @@
</template> </template>
<script setup> <script setup>
import { useAuthStore } from '@/store/auth'
import useModal from '@/composables/useModal' import useModal from '@/composables/useModal'
import { computed, markRaw, watch } from 'vue' import { computed, markRaw, watch } from 'vue'
import { STUDENT_REGISTRATION } from '@/enums' import { STUDENT_REGISTRATION } from '@/enums'
@@ -49,6 +61,7 @@ import EducationalInformation from '@/features/auth/components/studentRegister/E
import ProfessionalInformation from '@/features/auth/components/studentRegister/ProfessionalInformation.vue' import ProfessionalInformation from '@/features/auth/components/studentRegister/ProfessionalInformation.vue'
const store = useStudentRegistrationStore() const store = useStudentRegistrationStore()
const auth = useAuthStore()
const { isModal, openModal } = useModal() const { isModal, openModal } = useModal()
const { data: registerData, isPending: isRegistrationDataPending } = useGetRegisterDataQuery() const { data: registerData, isPending: isRegistrationDataPending } = useGetRegisterDataQuery()
@@ -273,6 +286,32 @@ watch(
text-align: center; text-align: center;
} }
&__rejection {
background: #fdecec;
border: 1px solid #f5b8b8;
border-radius: 0.75rem;
padding: 1rem 1.25rem;
margin-bottom: 1.25rem;
}
&__rejection-title {
font-family: var(--font-family-fa);
font-weight: 600;
font-size: 0.9375rem;
color: #c62828;
margin: 0 0 0.375rem;
}
&__rejection-reason {
font-family: var(--font-family-fa);
font-weight: 400;
font-size: 0.875rem;
line-height: 1.8;
color: #7a2f2f;
margin: 0;
text-align: justify;
}
&__main :deep(.text-field__label), &__main :deep(.text-field__label),
&__main :deep(.textarea-field__label), &__main :deep(.textarea-field__label),
&__main :deep(.select-field__label), &__main :deep(.select-field__label),
@@ -67,8 +67,8 @@
</template> </template>
<script setup> <script setup>
import { ref } from 'vue'
import * as yup from 'yup' import * as yup from 'yup'
import { computed, ref } from 'vue'
import { toast } from 'vue3-toastify' import { toast } from 'vue3-toastify'
import useYup from '@/composables/useYup' import useYup from '@/composables/useYup'
import BaseButton from '@/components/BaseButton.vue' import BaseButton from '@/components/BaseButton.vue'
@@ -79,6 +79,7 @@ import FileUploader from '@/components/form/FileUploader.vue'
import { objectToFormData } from '@/utils/object-to-formdata' import { objectToFormData } from '@/utils/object-to-formdata'
import { useUploadMediaMutation } from '@/services/query/auth' import { useUploadMediaMutation } from '@/services/query/auth'
import TextareaField from '@/components/form/TextareaField.vue' import TextareaField from '@/components/form/TextareaField.vue'
import { useServiceTypesListQuery } from '@/services/query/service-types'
defineProps({ defineProps({
submitting: { type: Boolean, default: false }, submitting: { type: Boolean, default: false },
@@ -86,10 +87,10 @@ defineProps({
const emit = defineEmits(['submit', 'file-error']) const emit = defineEmits(['submit', 'file-error'])
const serviceTypeOptions = [ const { data: serviceTypes } = useServiceTypesListQuery()
{ value: 'خدمات رفاهی', label: 'خدمات رفاهی' }, const serviceTypeOptions = computed(() =>
{ value: 'خدمات آموزشی', label: 'خدمات آموزشی' }, (serviceTypes.value ?? []).map((st) => ({ value: st.title, label: st.title }))
] )
const form = ref({ const form = ref({
category: '', category: '',
+19 -2
View File
@@ -147,8 +147,19 @@ const menuItems = computed(() => [
{ {
title: 'مدیریت خدمات', title: 'مدیریت خدمات',
icon: 'users-three', icon: 'users-three',
to: { name: 'admin-services' }, active: ['admin-services', 'admin-service-types'].includes(route.name),
active: route.name === 'admin-services', children: [
{
title: 'درخواست‌های خدمت',
to: { name: 'admin-services' },
active: route.name === 'admin-services',
},
{
title: 'انواع خدمات',
to: { name: 'admin-service-types' },
active: route.name === 'admin-service-types',
},
],
}, },
{ {
title: 'مدیریت مشاوره', title: 'مدیریت مشاوره',
@@ -162,6 +173,12 @@ const menuItems = computed(() => [
to: { name: 'admin-missionary-requests' }, to: { name: 'admin-missionary-requests' },
active: route.name === 'admin-missionary-requests', active: route.name === 'admin-missionary-requests',
}, },
{
title: 'گواهینامه‌ها',
icon: 'certificate',
to: { name: 'admin-certificates' },
active: route.name === 'admin-certificates',
},
]) ])
</script> </script>
+10
View File
@@ -0,0 +1,10 @@
import { http } from '@/services/api/http'
import { buildUrl, endpoints } from '@/services/api/endpoints'
export const apiGetAdminCertificates = (params) =>
http.get(endpoints.getAdminCertificates, { params })
export const apiAddAdminCertificate = (payload) => http.post(endpoints.addAdminCertificate, payload)
export const apiDeleteAdminCertificate = (id) =>
http.delete(buildUrl(endpoints.deleteAdminCertificate, { id }))
+3
View File
@@ -8,6 +8,9 @@ export const apiShowAdminUser = (id) => http.get(buildUrl(endpoints.showUserDeta
export const apiGetAdminUserRegisterData = (id) => export const apiGetAdminUserRegisterData = (id) =>
http.get(buildUrl(endpoints.getUserRegisterData, { id })) http.get(buildUrl(endpoints.getUserRegisterData, { id }))
export const apiGetAdminUserEvaluation = (id) =>
http.get(buildUrl(endpoints.getUserEvaluation, { id }))
export const apiAddAdminUser = (payload) => http.post(endpoints.addNewUser, payload) export const apiAddAdminUser = (payload) => http.post(endpoints.addNewUser, payload)
export const apiUpdateAdminUser = (id, payload) => export const apiUpdateAdminUser = (id, payload) =>
+7 -2
View File
@@ -46,5 +46,10 @@ export const apiGetRegistrationQuestionVideo = () =>
// Media uploads (especially course videos) can legitimately take several // Media uploads (especially course videos) can legitimately take several
// minutes on slower connections. Keep the normal API timeout short, but give // minutes on slower connections. Keep the normal API timeout short, but give
// this endpoint enough time to complete the backend's 300 MB upload contract. // this endpoint enough time to complete the backend's 300 MB upload contract.
export const apiUploadMedia = (formData) => // `onUploadProgress` is optional and forwarded straight to axios so callers
http.post(endpoints.uploadMedia, formData, { timeout: 10 * 60 * 1000 }) // can render an upload progress bar (e.g. XHR progress events).
export const apiUploadMedia = (formData, onUploadProgress) =>
http.post(endpoints.uploadMedia, formData, {
timeout: 10 * 60 * 1000,
...(onUploadProgress ? { onUploadProgress } : {}),
})
+14
View File
@@ -55,6 +55,14 @@ export const endpoints = {
getStudentCertificates: '/student/certificates', getStudentCertificates: '/student/certificates',
downloadStudentCertificate: '/student/certificates/:id/download', downloadStudentCertificate: '/student/certificates/:id/download',
// ─── Backend-aligned: Service types (settings) ────────────────────────────
// Read is open to any authenticated role (populates the student "request
// service" category select); create/update/delete are admin-only.
getServiceTypesList: '/service-types',
addServiceType: '/service-types',
updateServiceType: '/service-types/:id',
deleteServiceType: '/service-types/:id',
// ─── Per-role aggregated dashboards ──────────────────────────────────────── // ─── Per-role aggregated dashboards ────────────────────────────────────────
// Each requires the matching role's token; backend scopes the payload. // Each requires the matching role's token; backend scopes the payload.
getAdminDashboard: '/admin/dashboard', getAdminDashboard: '/admin/dashboard',
@@ -74,6 +82,7 @@ export const endpoints = {
changeUserStatus: '/admin/users/:id/status', changeUserStatus: '/admin/users/:id/status',
deleteUser: '/admin/users/:id', deleteUser: '/admin/users/:id',
getUserRegisterData: '/admin/users/:id/register-data', getUserRegisterData: '/admin/users/:id/register-data',
getUserEvaluation: '/admin/users/:id/evaluation',
// ─── Backend-aligned: Terms ──────────────────────────────────────────────── // ─── Backend-aligned: Terms ────────────────────────────────────────────────
getTermsList: '/terms', getTermsList: '/terms',
@@ -187,6 +196,11 @@ export const endpoints = {
listAdminMissionaryRequests: '/admin/missionary-requests', listAdminMissionaryRequests: '/admin/missionary-requests',
showAdminMissionaryRequest: '/admin/missionary-requests/:id', showAdminMissionaryRequest: '/admin/missionary-requests/:id',
changeAdminMissionaryRequestStatus: '/admin/missionary-requests/:id/status', changeAdminMissionaryRequestStatus: '/admin/missionary-requests/:id/status',
// ─── Admin: certificates ───────────────────────────────────────────────────
getAdminCertificates: '/admin/certificates',
addAdminCertificate: '/admin/certificates',
deleteAdminCertificate: '/admin/certificates/:id',
} }
export const buildUrl = (template, params = {}) => export const buildUrl = (template, params = {}) =>
+17 -4
View File
@@ -61,12 +61,25 @@ const addCamelizeInterceptor = (instance) => {
) )
} }
const _addUnauthorizeInterceptor = (instance) => { const addUnauthorizeInterceptor = (instance) => {
instance.interceptors.response.use( instance.interceptors.response.use(
(res) => res, (res) => res,
async (e) => { async (e) => {
if (e?.response?.status === 401) { // Login/OTP-verify endpoints also answer 401 for a plain wrong
tokenService.clearAll() // password or code — that's a credential failure the login form
// should handle itself, not a session expiring. Only treat this as
// "the session died" when we actually had a token going in.
if (e?.response?.status === 401 && tokenService.hasToken()) {
// Route through the auth store, not tokenService directly, so the
// reactive user state and the WordPress-facing mb_auth_status cookie
// both get cleared along with the token — an expired/invalid session
// must not leave WordPress showing a stale "logged in" state.
try {
const { useAuthStore } = await import('@/store/auth')
useAuthStore().clearUser()
} catch {
tokenService.clearAll()
}
toast('نشست شما تایید نشد، لطفا مجدد وارد شوید') toast('نشست شما تایید نشد، لطفا مجدد وارد شوید')
try { try {
const { default: router } = await import('@/router') const { default: router } = await import('@/router')
@@ -89,7 +102,7 @@ const createInstance = (baseUrl, { headers = {}, ...configs } = {}) => {
addResponseUnwrapInterceptor(instance) addResponseUnwrapInterceptor(instance)
addCamelizeInterceptor(instance) addCamelizeInterceptor(instance)
addSnakizeInterceptor(instance) addSnakizeInterceptor(instance)
// _addUnauthorizeInterceptor(instance) addUnauthorizeInterceptor(instance)
return instance return instance
} }
+12
View File
@@ -0,0 +1,12 @@
import { http } from '@/services/api/http'
import { buildUrl, endpoints } from '@/services/api/endpoints'
export const apiGetServiceTypes = () => http.get(endpoints.getServiceTypesList)
export const apiAddServiceType = (payload) => http.post(endpoints.addServiceType, payload)
export const apiUpdateServiceType = (id, payload) =>
http.patch(buildUrl(endpoints.updateServiceType, { id }), payload)
export const apiDeleteServiceType = (id) =>
http.delete(buildUrl(endpoints.deleteServiceType, { id }))
+30
View File
@@ -0,0 +1,30 @@
import { cleanFilters } from '@/utils/clean-filters'
import { useMutation, useQuery } from '@tanstack/vue-query'
import {
apiAddAdminCertificate,
apiDeleteAdminCertificate,
apiGetAdminCertificates,
} from '@/services/api/admin-certificates'
export const adminCertificatesKeys = {
all: ['admin', 'certificates'],
list: (filters, pagination) => ['admin', 'certificates', 'list', filters, pagination],
}
export const useAdminCertificatesListQuery = (filtersRef, paginationRef, options = {}) =>
useQuery({
queryKey: ['admin', 'certificates', 'list', filtersRef, paginationRef],
queryFn: () =>
apiGetAdminCertificates({ ...cleanFilters(filtersRef.value), ...paginationRef.value }),
select: (response) => ({
data: response?.data?.items ?? response?.data ?? [],
meta: response?.data?.meta ?? response?.meta,
}),
...options,
})
export const useAddAdminCertificateMutation = () =>
useMutation({ mutationFn: (payload) => apiAddAdminCertificate(payload) })
export const useDeleteAdminCertificateMutation = () =>
useMutation({ mutationFn: (id) => apiDeleteAdminCertificate(id) })
+10
View File
@@ -4,6 +4,7 @@ import {
apiAddAdminUser, apiAddAdminUser,
apiChangeAdminUserStatus, apiChangeAdminUserStatus,
apiDeleteAdminUser, apiDeleteAdminUser,
apiGetAdminUserEvaluation,
apiGetAdminUserRegisterData, apiGetAdminUserRegisterData,
apiGetAdminUsers, apiGetAdminUsers,
apiShowAdminUser, apiShowAdminUser,
@@ -16,6 +17,7 @@ export const adminUsersKeys = {
list: (filters, pagination) => ['admin', 'users', 'list', filters, pagination], list: (filters, pagination) => ['admin', 'users', 'list', filters, pagination],
detail: (id) => ['admin', 'users', 'detail', id], detail: (id) => ['admin', 'users', 'detail', id],
registerData: (id) => ['admin', 'users', 'register-data', id], registerData: (id) => ['admin', 'users', 'register-data', id],
evaluation: (id) => ['admin', 'users', 'evaluation', id],
} }
export const useAdminUsersListQuery = (filtersRef, paginationRef, options = {}) => export const useAdminUsersListQuery = (filtersRef, paginationRef, options = {}) =>
@@ -59,6 +61,14 @@ export const useAdminUserRegisterDataQuery = (idRef, options = {}) =>
...options, ...options,
}) })
export const useAdminUserEvaluationQuery = (idRef, options = {}) =>
useQuery({
queryKey: ['admin', 'users', 'evaluation', idRef],
queryFn: () => apiGetAdminUserEvaluation(idRef.value),
select: (response) => response?.data ?? response,
...options,
})
export const useAddAdminUserMutation = () => export const useAddAdminUserMutation = () =>
useMutation({ mutationFn: (payload) => apiAddAdminUser(payload) }) useMutation({ mutationFn: (payload) => apiAddAdminUser(payload) })
+10 -1
View File
@@ -79,7 +79,16 @@ export const useGetRegistrationVideoQuery = (options = {}) =>
...options, ...options,
}) })
export const useUploadMediaMutation = () => useMutation({ mutationFn: apiUploadMedia }) // `mutateAsync` accepts either a raw FormData (existing call sites, no
// progress tracking) or `{ formData, onUploadProgress }` for callers that
// want to render upload progress (e.g. a video upload progress bar).
const uploadMediaMutationFn = (variables) => {
if (variables instanceof FormData) return apiUploadMedia(variables)
const { formData, onUploadProgress } = variables
return apiUploadMedia(formData, onUploadProgress)
}
export const useUploadMediaMutation = () => useMutation({ mutationFn: uploadMediaMutationFn })
// Register-data is a flat `{ field: value }` object; legacy responses were a // Register-data is a flat `{ field: value }` object; legacy responses were a
// `[{ key, value }]` list. Normalize both into the object shape. // `[{ key, value }]` list. Normalize both into the object shape.
+29
View File
@@ -0,0 +1,29 @@
import { useMutation, useQuery } from '@tanstack/vue-query'
import {
apiAddServiceType,
apiDeleteServiceType,
apiGetServiceTypes,
apiUpdateServiceType,
} from '@/services/api/service-types'
export const serviceTypesKeys = {
all: ['service-types'],
list: () => ['service-types', 'list'],
}
export const useServiceTypesListQuery = (options = {}) =>
useQuery({
queryKey: serviceTypesKeys.list(),
queryFn: () => apiGetServiceTypes(),
select: (response) => response?.data ?? response ?? [],
...options,
})
export const useAddServiceTypeMutation = () =>
useMutation({ mutationFn: (payload) => apiAddServiceType(payload) })
export const useUpdateServiceTypeMutation = () =>
useMutation({ mutationFn: ({ id, payload }) => apiUpdateServiceType(id, payload) })
export const useDeleteServiceTypeMutation = () =>
useMutation({ mutationFn: (id) => apiDeleteServiceType(id) })
@@ -18,6 +18,10 @@ export const useStudentCertificatesQuery = (filtersRef, paginationRef, options =
...cleanFilters(filtersRef.value), ...cleanFilters(filtersRef.value),
...paginationRef.value, ...paginationRef.value,
}), }),
select: (response) => ({
data: response?.data?.items ?? response?.data ?? [],
meta: response?.data?.meta ?? response?.meta,
}),
...options, ...options,
}) })
+12 -4
View File
@@ -8,15 +8,22 @@ export const studentCoursesKeys = {
detail: (id) => ['student', 'courses', 'detail', id], detail: (id) => ['student', 'courses', 'detail', id],
} }
const withCoverImage = (course) => ({
...course,
image: course.image ?? course.coverUrl ?? null,
})
const adaptCourseResponse = (response) => { const adaptCourseResponse = (response) => {
const course = response?.data ?? response const course = response?.data ?? response
if (!course) return course if (!course) return course
return { return withCoverImage(course)
...course,
image: course.image ?? course.coverUrl ?? null,
}
} }
const adaptCourseListResponse = (response) => ({
data: (response?.data?.items ?? response?.data ?? []).map((course) => withCoverImage(course)),
meta: response?.data?.meta ?? response?.meta,
})
export const useStudentCoursesListQuery = (filtersRef, paginationRef, options = {}) => export const useStudentCoursesListQuery = (filtersRef, paginationRef, options = {}) =>
useQuery({ useQuery({
queryKey: ['student', 'courses', 'list', filtersRef, paginationRef], queryKey: ['student', 'courses', 'list', filtersRef, paginationRef],
@@ -25,6 +32,7 @@ export const useStudentCoursesListQuery = (filtersRef, paginationRef, options =
...cleanFilters(filtersRef.value), ...cleanFilters(filtersRef.value),
...paginationRef.value, ...paginationRef.value,
}), }),
select: adaptCourseListResponse,
...options, ...options,
}) })