Add support API for header, footer, Home image and small adjust.
This commit is contained in:
schooltechx
parent
692e6f3e24
commit
5af1f48150
10 changed files with 50 additions and 93 deletions
|
|
@ -1,6 +1,11 @@
|
|||
<script>
|
||||
<script lang="ts">
|
||||
// make dynamic date to be added to footer
|
||||
let date = new Date().getFullYear();
|
||||
export let logo_url:string = "/images/logo.png"
|
||||
export let address:string ="173 ถนนดินสอ แขวงเสาชิงช้า เขตพระนคร กรุงเทพมหานคร 10200"
|
||||
export let organization:string = "กองสรรหาบุคคล yyy"
|
||||
export let divisions:{title:string,url:string}[] =[]
|
||||
export let institutes:{title:string,url:string}[] =[]
|
||||
</script>
|
||||
|
||||
<footer class="relative bg-blueGray-200 pt-8 pb-6">
|
||||
|
|
@ -28,12 +33,12 @@
|
|||
<div class="w-full lg:w-6/12 px-4">
|
||||
<div class=" mb-4">
|
||||
<div class="w-12 rounded-full">
|
||||
<img src="/images/logo.png" alt="logo">
|
||||
<img src="{logo_url}" alt="logo">
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="text-2xl font-semibold">กองสรรหาบุคคล</h5>
|
||||
<h5 class="text-2xl font-semibold">{organization}</h5>
|
||||
<h6 class="text-md mt-1 mb-2 text-blueGray-600">
|
||||
173 ถนนดินสอ แขวงเสาชิงช้า เขตพระนคร กรุงเทพมหานคร 10200
|
||||
{address}
|
||||
</h6>
|
||||
<div class="mt-6 lg:mb-0 mb-6">
|
||||
|
||||
|
|
@ -60,42 +65,17 @@
|
|||
ส่วนราชการ
|
||||
</span>
|
||||
<ul class="list-none">
|
||||
{#each divisions as d}
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://webportal.bangkok.go.th/KSB"
|
||||
href="{d.url}"
|
||||
target="_blank"
|
||||
>
|
||||
กองสรรหาบุคคล
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://webportal.bangkok.go.th/pdbma"
|
||||
target="_blank"
|
||||
>
|
||||
กองพัฒนาระบบราชการ
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://webportal.bangkok.go.th/csc_personal"
|
||||
target="_blank"
|
||||
>
|
||||
กองอัตรากำลัง
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="http://203.155.220.238/csc/index.php/en/discipline-morality"
|
||||
target="_blank"
|
||||
>
|
||||
กองทะเบียนประวัติข้าราชการ
|
||||
{d.title}
|
||||
</a>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="w-full lg:w-4/12 px-4">
|
||||
|
|
@ -105,42 +85,17 @@
|
|||
หน่วยงาน
|
||||
</span>
|
||||
<ul class="list-none">
|
||||
{#each institutes as i}
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://main.bangkok.go.th/"
|
||||
href="{i.url}"
|
||||
target="_blank"
|
||||
>
|
||||
กรุงเทพมหานคร
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://webportal.bangkok.go.th/pdd"
|
||||
target="_blank"
|
||||
>
|
||||
สนป.กทม./กองการเจ้าหน้าที่
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://webportal.bangkok.go.th/bangkokeducation"
|
||||
target="_blank"
|
||||
>
|
||||
สำนักการศึกษา กทม.
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
|
||||
href="https://www.ocsc.go.th/"
|
||||
target="_blank"
|
||||
>
|
||||
สำนักงาน ก.พ.
|
||||
{i.title}
|
||||
</a>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
<script lang="ts">
|
||||
export let logo_url:string = "/images/logo.png"
|
||||
export let organization:string = "กองสรรหาบุคคล yyy"
|
||||
export let supervised:string = "สำนักงาน ก.ก.xx"
|
||||
|
||||
</script>
|
||||
|
||||
<div class="navbar bg-white w-full top-0 z-50 fixed flex-wrap items-center justify-between px-4 ">
|
||||
<div
|
||||
class="container px-4 mx-auto flex flex-no-wrap items-center justify-between"
|
||||
|
|
@ -7,17 +14,13 @@
|
|||
<div class="content-center grid">
|
||||
<div class="avatar">
|
||||
<div class="w-10 rounded-full">
|
||||
<img src="/images/logo.png" alt="logo">
|
||||
<img src="{logo_url}" alt="logo">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-center grid pl-4">
|
||||
<a class="textline1"
|
||||
target="_blank"
|
||||
href="https://webportal.bangkok.go.th/KSB">
|
||||
กองสรรหาบุคคล
|
||||
</a>
|
||||
<div class="textline2">สำนักงาน ก.ก.</div>
|
||||
{organization}
|
||||
<div class="textline2">{supervised}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -50,11 +53,13 @@
|
|||
</div>
|
||||
</div>
|
||||
<style>
|
||||
/*
|
||||
.textline1{
|
||||
line-height:1.2rem !important;
|
||||
font-weight: 400;
|
||||
/* color: #02A998; */
|
||||
}
|
||||
color: #02A998;
|
||||
}
|
||||
*/
|
||||
.textline2{
|
||||
font-size: 0.80rem;
|
||||
line-height:1.3rem !important;
|
||||
|
|
|
|||
|
|
@ -10,10 +10,12 @@
|
|||
import type { LayoutData } from './$types';
|
||||
export let data: LayoutData;
|
||||
console.log(data)
|
||||
let {logo_url,supervised,divisions,institutes,address,organization} = data
|
||||
|
||||
</script>
|
||||
|
||||
<Header />
|
||||
<Header {logo_url} {organization} {supervised} />
|
||||
<div class="justify-center place-content-center" style="padding-top:50px">
|
||||
<slot />
|
||||
</div>
|
||||
<Footer />
|
||||
<Footer {logo_url} {organization} {address} {divisions} {institutes} />
|
||||
|
|
|
|||
|
|
@ -1,15 +1,18 @@
|
|||
//import content from "$lib/data/content/home.html?raw"
|
||||
//import { getQualifyExams,getCompetitiveExams } from '$lib/data/info';
|
||||
import type { PageServerLoad } from './$types';
|
||||
import type {Exam} from '$lib/components/Exam'
|
||||
import type {Exam} from '$lib/data/CMSDataType'
|
||||
import dayjs from 'dayjs'
|
||||
export const load: PageServerLoad = async ({fetch}) => {
|
||||
let qualify_exams: Exam[] = []
|
||||
let competitive_exams: Exam[] = []
|
||||
let content = ""
|
||||
let image = undefined
|
||||
let res = await fetch("/api/content?page=home")
|
||||
if(res.ok){
|
||||
content = (await res.json()).content
|
||||
const r = await res.json()
|
||||
content = r.content
|
||||
image = r.image
|
||||
}
|
||||
res = await fetch("/api/qualifying")
|
||||
if(res.ok){
|
||||
|
|
@ -25,5 +28,5 @@ export const load: PageServerLoad = async ({fetch}) => {
|
|||
e.start? dayjs(e.start).format("DD MMM BBBB"):""
|
||||
})
|
||||
}
|
||||
return { content , qualify_exams,competitive_exams };
|
||||
return { content,image, qualify_exams,competitive_exams };
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,16 +1,7 @@
|
|||
<script lang="ts">
|
||||
import type { PageData } from './$types';
|
||||
export let data: PageData;
|
||||
const qualify_exams = data.qualify_exams;
|
||||
const competitive_exams = data.competitive_exams;
|
||||
const patternVue = "/images/pattern.png";
|
||||
const sel1 = "/images/sel1.png";
|
||||
const sel2 = "/images/sel2.png";
|
||||
const sel3 = "/images/sel3.png";
|
||||
const c1 = "/images/c1.jpg";
|
||||
const c2 = "/images/c2.jpg";
|
||||
const c3 = "/images/c3.jpg";
|
||||
|
||||
const {qualify_exams,competitive_exams,image} = data
|
||||
</script>
|
||||
<section class="reative flex bg-gradient pt-10 pb-44 md:pb-38">
|
||||
<div class="container mx-auto items-start flex flex-wrap">
|
||||
|
|
@ -44,7 +35,7 @@
|
|||
</div>
|
||||
<img
|
||||
class="absolute top-0 b-auto right-0 sm:w-5/12 sm:mt-32 pr-10 hidden md:flex"
|
||||
src="{patternVue}"
|
||||
src="{image}"
|
||||
alt="..."
|
||||
/>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -6,10 +6,12 @@ import qualifying_content from "$lib/data/content/qualifying.html?raw"
|
|||
import competitive_content from "$lib/data/content/competitive.html?raw"
|
||||
export const GET: RequestHandler = async ({url}: RequestEvent) => {
|
||||
let content = ""
|
||||
let image = undefined
|
||||
const page= url.searchParams.get("page") ?? 'nopage'
|
||||
switch (page) {
|
||||
case "home":
|
||||
content = home_content
|
||||
image = "/images/pattern.png"
|
||||
break;
|
||||
case "qualifying":
|
||||
content = qualifying_content
|
||||
|
|
@ -26,6 +28,6 @@ export const GET: RequestHandler = async ({url}: RequestEvent) => {
|
|||
//slience error just send empty content if not found
|
||||
if(!content)
|
||||
console.log(`Request content ${page} not found`)
|
||||
return json({content})
|
||||
return json({content,image})
|
||||
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@ import { error } from '@sveltejs/kit'
|
|||
import type { PageServerLoad } from './$types'
|
||||
export const load: PageServerLoad = async ({params,fetch}) => {
|
||||
const id = params.id+""
|
||||
const res = await fetch("/api/compettive/"+id)
|
||||
const res = await fetch("/api/competitive/"+id)
|
||||
if(res.status==404){
|
||||
throw error(404,{message:`ค้นหาข้อมูลสอบคัดเลือก ${id}ไม่พบ`})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@
|
|||
{/if}
|
||||
<hr class="border-blueGray-200 my-7" />
|
||||
<div>
|
||||
<a href="javascript:history.back()" class="btn btn-outline text-gray-500">
|
||||
<a href="/competitive" class="btn btn-outline text-gray-500">
|
||||
<i class="fa-solid fa-arrow-left mr-4"></i>
|
||||
ย้อนกลับ
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
|
||||
import type {CalendarEvent} from '$lib/data/CMSDataType'
|
||||
import type {Exam} from '$lib/data/CMSDataType'
|
||||
import type {CalendarEvent,Exam} from '$lib/data/CMSDataType'
|
||||
import dayjs from 'dayjs'
|
||||
import type { PageServerLoad } from './$types'
|
||||
export const load: PageServerLoad = async ({fetch}) => {
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@
|
|||
{/if}
|
||||
<hr class="border-blueGray-200 my-7" />
|
||||
<div>
|
||||
<a href="javascript:history.back()" class="btn btn-outline text-gray-500">
|
||||
<a href="/qualifying" class="btn btn-outline text-gray-500">
|
||||
<i class="fa-solid fa-arrow-left mr-4"></i>
|
||||
ย้อนกลับ
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue