Add content and layout for subpage
This commit is contained in:
parent
320d11723f
commit
c3ff670473
5 changed files with 52 additions and 61 deletions
|
|
@ -4,14 +4,14 @@
|
|||
"date":"24 เม.ย. 2566","institute":"สำนักงาน ก.ก.","institute_id":1,
|
||||
"start":"2023-04-24",
|
||||
"title":"ด่วน !! ประกาศวัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม.",
|
||||
"detail":"ด่วน !! ประกาศวัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม.",
|
||||
"detail":"<p>สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร ประกาศกำหนดวัน เวลา สถานที่คัดเลือก และระเบียบ เกี่ยวกับการคัดเลือกบุคลากรกรุงเทพมหานครหรือผู้ปฏิบัติงานอื่นในกรุงเทพมหานครเพื่อบรรจุและแต่งตั้ง เป็นข้าราชการกรุงเทพมหานครสามัญ ครั้งที่ 1 / 2565</p><p><img width='50%' src='https://webportal.bangkok.go.th/public/user_files_editor/305/bkkgovjob202303_12.jpg'></p>",
|
||||
"img":"/images/sel1.png",
|
||||
"docurl":"https://webportal.bangkok.go.th/public/user_files_editor/305/%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%81%E0%B8%B2%E0%B8%A8%E0%B8%84%E0%B8%B1%E0%B8%94%E0%B9%80%E0%B8%A5%E0%B8%B7%E0%B8%AD%E0%B8%81%E0%B8%A5%E0%B8%B9%E0%B8%81%E0%B8%88%E0%B9%89%E0%B8%B2%E0%B8%87.pdf"
|
||||
|
||||
},
|
||||
{
|
||||
"id":"20",
|
||||
"date":"3 เม.ย. 2566","institute":"สำนักอนามัย","institute_id":2,
|
||||
"date":"3 เม.ย. 2566","institute":"สำนักงาน ก.ก.","institute_id":1,
|
||||
"start":"2023-04-03",
|
||||
"title":"วัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม.",
|
||||
"detail":"ด่วน !! ประกาศวัน เวลา สถานที่ และระเบียบการคัดเลือกลูกจ้างกทม.",
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/qualifying/{qualify_exams[0].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
@ -151,7 +151,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/qualifying/{qualify_exams[1].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
@ -186,7 +186,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/qualifying/{qualify_exams[2].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
@ -244,7 +244,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/competitive/{competitive_exams[0].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
@ -281,7 +281,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/competitive/{competitive_exams[1].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
@ -316,7 +316,7 @@
|
|||
</div>
|
||||
|
||||
<a
|
||||
href="/"
|
||||
href="/competitive/{competitive_exams[2].id}"
|
||||
class=" text-blue-500 hover:text-blue-300 ease-linear transition-all duration-150"
|
||||
>
|
||||
อ่านต่อ
|
||||
|
|
|
|||
|
|
@ -6,11 +6,9 @@ export const load: PageServerLoad = async () => {
|
|||
const exams = await getCompetitiveExams()
|
||||
const events:CalendarEvent[]=[]
|
||||
exams.forEach(({id,title,start})=>{
|
||||
const backgroundColor ="#1111EE"
|
||||
const backgroundColor ="#9999FF"
|
||||
const url = "/competitive/"+id
|
||||
events.push({id,title,start,url,backgroundColor})
|
||||
})
|
||||
return {content,exams,events}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,7 +1,9 @@
|
|||
<script lang="ts">
|
||||
import ActivityCalendar from '$lib/components/ActivityCalendar.svelte'
|
||||
import type { PageData } from './$types'
|
||||
export let data: PageData;
|
||||
const exams = data.exams
|
||||
const events = data.events
|
||||
</script>
|
||||
<section>
|
||||
<div class="p-one parallax-inner">
|
||||
|
|
@ -9,13 +11,7 @@
|
|||
</div>
|
||||
</section>
|
||||
<section class="pb-40 relative bg-blueGray-100">
|
||||
<div class="container mx-auto items-start flex flex-wrap px-4 pt-11">
|
||||
<div class="card bg-white shadow-xl w-full p-8">
|
||||
<div>
|
||||
{@html data.content}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-3">{@html data.content}</div>
|
||||
<div class="container mx-auto justify-center flex flex-wrap">
|
||||
<div class=" bg-blueGray-100 -mt-6 px-5 top-0 bottom-auto absolute z-40 rounded-md" >
|
||||
<div class="text-sm breadcrumbs">
|
||||
|
|
@ -32,39 +28,44 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container mx-auto items-start flex flex-wrap px-4 pt-11">
|
||||
<div
|
||||
class=" relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded bg-white"
|
||||
>
|
||||
<div class="rounded-t mb-0 px-4 py-3 border-0">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="relative w-full px-4 max-w-full flex-grow flex-1">
|
||||
<h3
|
||||
class="text-lg text-blueGray-700'"
|
||||
>
|
||||
รายการสอบ
|
||||
</h3>
|
||||
</div>
|
||||
<div class="container mx-auto items-start flex flex-wrap px-4 pt-11">
|
||||
<div class="w-full lg:w-7/12 cardxl">
|
||||
<div class="card bg-white shadow-xl w-full">
|
||||
<ActivityCalendar {events} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="block w-full overflow-x-auto">
|
||||
<table class="items-center w-full bg-transparent border-collapse">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="px-6 align-middle border border-solid py-3 text-xs uppercase border-l-0 border-r-0 whitespace-nowrap font-semibold text-left bg-blueGray-50 text-blueGray-500 border-blueGray-100">วันที่</th>
|
||||
<th class="px-6 align-middle border border-solid py-3 text-xs uppercase border-l-0 border-r-0 whitespace-nowrap font-semibold text-left bg-blueGray-50 text-blueGray-500 border-blueGray-100">การสอบ</th>
|
||||
<th class="px-6 align-middle border border-solid py-3 text-xs uppercase border-l-0 border-r-0 whitespace-nowrap font-semibold text-left bg-blueGray-50 text-blueGray-500 border-blueGray-100">หน่วยงาน</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each exams as exam}
|
||||
<tr>
|
||||
<th class="border-t-0 px-6 align-middle border-l-0 border-r-0 text-xs whitespace-nowrap p-4 text-left"><a href={"/competitive/"+exam.id}>{exam.date}</a></th>
|
||||
<td class="border-t-0 px-6 align-middle border-l-0 border-r-0 text-xs whitespace-nowrap p-4 text-left">{exam.title}</td>
|
||||
<td class="border-t-0 px-6 align-middle border-l-0 border-r-0 text-xs whitespace-nowrap p-4 text-left"></td>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="w-full lg:w-5/12">
|
||||
<div
|
||||
class=" card bg-white shadow-xl flex flex-col min-w-0 break-words w-full auto-rows-max"
|
||||
>
|
||||
<div class="rounded-t mb-0 px-4 py-3 border-0">
|
||||
<div class="flex flex-wrap items-center">
|
||||
<div class="relative w-full px-4 max-w-full flex-grow flex-1">
|
||||
<h3
|
||||
class="text-lg text-blueGray-700'"
|
||||
>
|
||||
รายการสอบ
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block w-full overflow-x-auto">
|
||||
<table class="items-center w-full bg-transparent border-collapse">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="px-6 align-middle border border-solid py-3 text-xs uppercase border-l-0 border-r-0 whitespace-nowrap font-semibold text-left bg-blueGray-50 text-blueGray-500 border-blueGray-100">วันที่</th>
|
||||
<th class="px-6 align-middle border border-solid py-3 text-xs uppercase border-l-0 border-r-0 whitespace-nowrap font-semibold text-left bg-blueGray-50 text-blueGray-500 border-blueGray-100">การสอบ</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each exams as exam}
|
||||
<tr>
|
||||
<th class="border-t-0 px-6 align-middle border-l-0 border-r-0 text-xs whitespace-nowrap p-4 text-left"><a href="/competitive/{exam.id}">{exam.date}</a></th>
|
||||
<td class="border-t-0 px-6 align-middle border-l-0 border-r-0 text-xs whitespace-nowrap p-4 text-left"><a href="/competitive/{exam.id}">{exam.title}</a></td>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
<script lang="ts">
|
||||
|
||||
import ver from "$lib/ver.json"
|
||||
import type { PageData } from './$types'
|
||||
export let data: PageData;
|
||||
|
||||
</script>
|
||||
<section>
|
||||
<div class="p-one parallax-inner">
|
||||
|
|
@ -32,13 +29,8 @@
|
|||
<div>
|
||||
{@html data.detail}
|
||||
</div>
|
||||
<div></div>
|
||||
{#if data.docUrl}
|
||||
<div><a href={data.docUrl} >เอกสาร</a></div>
|
||||
{/if}
|
||||
<div class="pt-12"></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
Loading…
Add table
Add a link
Reference in a new issue