fix: design

src/features/admin/terms/components/TermItem.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="term-item">
     <div class="term-item__main">
-      <div v-if="term.image" class="term-item__image">
-        <img :src="term.image" :alt="term.title" />
+      <div v-if="term.coverUrl" class="term-item__image">
+        <img :src="term.coverUrl" :alt="term.title" />
       </div>
       <div v-else class="term-item__image term-item__image--placeholder">
         <SvgIcon name="book" :size="24" color="#bcbcbc" />

src/features/admin/terms/pages/TermFormPage.vue

@@ -42,20 +42,20 @@
             </div>
             <div class="term-form__cell term-form__cell--third">
               <DatePickerField
-                v-model="form.startDate"
-                name="startDate"
+                v-model="form.startsAt"
+                name="startsAt"
                 label="تاریخ شروع"
                 :min="todayIso"
-                :error="errors.startDate"
+                :error="errors.startsAt"
               />
             </div>
             <div class="term-form__cell term-form__cell--third">
               <DatePickerField
-                v-model="form.endDate"
-                name="endDate"
+                v-model="form.endsAt"
+                name="endsAt"
                 label="تاریخ پایان"
                 :min="todayIso"
-                :error="errors.endDate"
+                :error="errors.endsAt"
               />
             </div>
             <div class="term-form__cell term-form__cell--full">
@@ -112,8 +112,8 @@ import { termSchema } from '@/features/admin/terms/schema'
 import LineTitleBlock from '@/components/LineTitleBlock.vue'
 import ImageCropper from '@/components/form/ImageCropper.vue'
 import { objectToFormData } from '@/utils/object-to-formdata'
+import { useUploadMediaMutation } from '@/services/query/auth'
 import TextareaField from '@/components/form/TextareaField.vue'
-import { useUploadTemporaryMutation } from '@/services/query/auth'
 import DatePickerField from '@/components/form/DatePickerField.vue'
 import BoxedIconTitleBlock from '@/components/blocks/BoxedIconTitleBlock.vue'
 import {
@@ -134,17 +134,16 @@ const todayIso = new Date().toISOString()
 
 const form = ref({
   title: '',
-  startDate: '',
-  endDate: '',
   description: '',
-  imageId: null,
+  isActive: true,
+  startsAt: '',
+  endsAt: '',
+  coverMediaId: null,
 })
 
 const image = ref(null)
 
-const schema = termSchema
-
-const { validate, validateAt, errors } = useYup(schema)
+const { validate, validateAt, errors } = useYup(termSchema)
 
 const { data: existingTerm } = useAdminTermQuery(termId, {
   enabled: () => !!termId.value,
@@ -154,23 +153,24 @@ watch(existingTerm, (term) => {
   if (!term) return
   form.value = {
     title: term.title || '',
-    startDate: term.startDate || '',
-    endDate: term.endDate || '',
     description: term.description || '',
-    imageId: term.imageId || null,
+    isActive: term.isActive ?? true,
+    startsAt: term.startsAt || '',
+    endsAt: term.endsAt || '',
+    coverMediaId: term.coverMediaId || null,
   }
-  if (term.image) image.value = { url: term.image }
+  if (term.coverUrl) image.value = { url: term.coverUrl }
 })
 
-const uploadMutation = useUploadTemporaryMutation()
+const uploadMutation = useUploadMediaMutation()
 
 const onImageCropped = async (file) => {
   try {
-    const formData = objectToFormData({ file, subType: 'avatar', context: 'term' })
+    const formData = objectToFormData({ file, purpose: 'cover', context: 'term' })
     const response = await uploadMutation.mutateAsync(formData)
     const payload = response?.data ?? response
-    image.value = { url: payload?.url, uploadId: payload?.uploadId, ...payload }
-    form.value.imageId = payload?.uploadId || payload?.id
+    image.value = { url: payload?.url, ...payload }
+    form.value.coverMediaId = payload?.id
   } catch {
     /* handled globally */
   }
@@ -191,7 +191,7 @@ const onSubmit = async () => {
   } else {
     await addMutation.mutateAsync(payload)
   }
-  await queryClient.invalidateQueries({ queryKey: adminTermsKeys.all })
+  await queryClient.resetQueries({ queryKey: adminTermsKeys.all })
   router.push({ name: 'admin-terms' })
 }
 

src/features/admin/terms/schema/index.js

@@ -1,10 +1,12 @@
-import { array, mixed, object, string } from 'yup'
+import { array, boolean, mixed, number, object, string } from 'yup'
 
 export const termSchema = object().shape({
   title: string().required().min(3),
-  startDate: string().required(),
-  endDate: string().required(),
   description: string().nullable().notRequired(),
+  isActive: boolean().default(true),
+  startsAt: string().required(),
+  endsAt: string().required(),
+  coverMediaId: number().nullable().notRequired(),
 })
 
 export const addTermStudentSchema = object().shape({