แสดงวันเกี่ยวกับการสอบ,แสดง image placeholder

cms/src/routes/qualifying/+page.server.ts

@@ -17,6 +17,7 @@ export const load: PageServerLoad = async ({fetch}) => {
         const backgroundColor = category? getBgColorDict(category,catColor):"n/a"
         const url = "/qualifying/"+id
         ex.date = dayjs(announcement_startDate).format("DD MMM BBBB")
+        ex.image = ex.image?ex.image:"/images/exam_place_holder.png"
         if(!ex.announcementExam)
             return //ignore other date for normal post
 

cms/src/routes/qualifying/[id]/+page.svelte

@@ -3,6 +3,12 @@
     export let data: PageData;
 	import { env } from '$env/dynamic/public'
 	const positions_base_url = env.PUBLIC_URL_REGISTER_QUALIFY_EXAM+"/exam/"
+	import dayjs from 'dayjs'
+	function formatDate(start:string,end:string|undefined=undefined){
+		if(!end)
+			return dayjs(start).format("DD MMM BBBB")
+		return dayjs(start).format("DD MMM BBBB")+" - "+dayjs(end).format("DD MMM BBBB")
+	}
 </script>
 <section>
     <div class="p-one parallax-inner">
@@ -30,8 +36,21 @@
         <div class="card  bg-white shadow-xl w-full p-8 max-w-4xl ">
 			<div class="text-2xl mb-3 font-medium">{data.title}</div>
 			<div class="text-sm">
-				<i class="fa-regular fa-calendar mr-4 text-blue-500"></i><span class="text-blue-500">{data.date}</span>
+				<i class="fa-regular fa-calendar mr-4 text-blue-500"></i><span class="text-blue-500">วันประกาศ {data.date}</span>
 			</div>
+			{#if data.announcementExam}
+			<div  class="text-sm">
+				{#if data.register_startDate}
+				<div>สมัคร: {formatDate(data.register_startDate,data.register_endDate)}</div>
+				{/if}
+				{#if data.payment_startDate}
+				<div>ชำระเงิน: {formatDate(data.payment_startDate,data.payment_endDate)} </div>
+				{/if}
+				{#if data.examDate }
+				<div>สอบ: {formatDate(data.examDate)}</div>
+				{/if}
+			</div>
+			{/if}
 			<hr class="border-blueGray-200 my-7" />
             <div class="">
                 {@html data.detail}
@@ -41,7 +60,7 @@
 			<div><img src={i.url} alt={i.title}></div>
 				{/each}
 			{/if}
-			{#if data.positions}
+			{#if data.announcementExam  && data.positions}
 				<div class="w-12/12 text-lg font-medium">สมัครสอบ</div>
 				{#each data.positions as p}
 				<hr class="border-blueGray-200 my-2" />