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>
This commit is contained in:
madresebanoo
@@ -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) بارگذاری کنید',
|
||||
})
|
||||
})
|
||||
@@ -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 }))
|
||||
@@ -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) })
|
||||
@@ -18,6 +18,10 @@ export const useStudentCertificatesQuery = (filtersRef, paginationRef, options =
|
||||
...cleanFilters(filtersRef.value),
|
||||
...paginationRef.value,
|
||||
}),
|
||||
select: (response) => ({
|
||||
data: response?.data?.items ?? response?.data ?? [],
|
||||
meta: response?.data?.meta ?? response?.meta,
|
||||
}),
|
||||
...options,
|
||||
})
|
||||
|
||||
|
||||
Reference in New Issue
Block a user