เพิ่ม สมัครตามตำแหน่ง
This commit is contained in:
parent
b803beca10
commit
3ff7e551aa
6 changed files with 148 additions and 15 deletions
|
|
@ -95,4 +95,8 @@
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background-color: #a8bbbf;
|
background-color: #a8bbbf;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.display-none{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
36
cms/src/lib/components/url.js
Normal file
36
cms/src/lib/components/url.js
Normal file
|
|
@ -0,0 +1,36 @@
|
||||||
|
import { derived, writable } from 'svelte/store'
|
||||||
|
|
||||||
|
export function createUrlStore(ssrUrl) {
|
||||||
|
// Ideally a bundler constant so that it's tree-shakable
|
||||||
|
if (typeof window === 'undefined') {
|
||||||
|
const { subscribe } = writable(ssrUrl)
|
||||||
|
return { subscribe }
|
||||||
|
}
|
||||||
|
|
||||||
|
const href = writable(window.location.href)
|
||||||
|
|
||||||
|
const originalPushState = history.pushState
|
||||||
|
const originalReplaceState = history.replaceState
|
||||||
|
|
||||||
|
const updateHref = () => href.set(window.location.href)
|
||||||
|
|
||||||
|
history.pushState = function () {
|
||||||
|
originalPushState.apply(this, arguments)
|
||||||
|
updateHref()
|
||||||
|
}
|
||||||
|
|
||||||
|
history.replaceState = function () {
|
||||||
|
originalReplaceState.apply(this, arguments)
|
||||||
|
updateHref()
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener('popstate', updateHref)
|
||||||
|
window.addEventListener('hashchange', updateHref)
|
||||||
|
|
||||||
|
return {
|
||||||
|
subscribe: derived(href, ($href) => new URL($href)).subscribe
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// If you're using in a pure SPA, you can return a store directly and share it everywhere
|
||||||
|
export default createUrlStore()
|
||||||
|
|
@ -11,6 +11,28 @@
|
||||||
"url":"/images/c1.jpg"
|
"url":"/images/c1.jpg"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
"regi":[
|
||||||
|
{
|
||||||
|
"title":"เจ้าพนักงานเภสัชกรรมปฏิบัติงาน",
|
||||||
|
"url":"/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title":"เจ้าพนักงานทันตสาธารณสุขปฏิบัติงาน",
|
||||||
|
"url":"/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title":"ผู้ช่วยทันตแพทย์ปฏิบัติงาน",
|
||||||
|
"url":"/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title":"ดุริยางคศิลปินปฏิบัติงาน",
|
||||||
|
"url":"/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title":"คีตศิลปินปฏิบัติงาน",
|
||||||
|
"url":"/"
|
||||||
|
}
|
||||||
|
],
|
||||||
"files":[
|
"files":[
|
||||||
{
|
{
|
||||||
"title":"รายละเอียดประกาศ",
|
"title":"รายละเอียดประกาศ",
|
||||||
|
|
|
||||||
|
|
@ -83,7 +83,7 @@
|
||||||
>
|
>
|
||||||
<div class="card bg-white shadow-xl w-full ">
|
<div class="card bg-white shadow-xl w-full ">
|
||||||
<figure style="height: 250px;" class="img-hover-zoom--brightness">
|
<figure style="height: 250px;" class="img-hover-zoom--brightness">
|
||||||
<img src={qualify_exams[0].image} alt="1" />
|
<img src={qualify_exams[0].image} alt="1" class="h-full fit" />
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="text-sm font-medium text-gray-500">
|
<div class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -121,7 +121,7 @@
|
||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<div class="card card-side bg-white shadow-xl w-full">
|
<div class="card card-side bg-white shadow-xl w-full">
|
||||||
<figure class="w-full lg:w-5/12 imgCard">
|
<figure class="w-full lg:w-5/12 imgCard">
|
||||||
<img src={qualify_exams[1].image} alt="1" class="h-full" />
|
<img src={qualify_exams[1].image} alt="1" class="h-full fit" />
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body w-full lg:w-7/12">
|
<div class="card-body w-full lg:w-7/12">
|
||||||
<h2 class="text-sm font-medium text-gray-500">
|
<h2 class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -156,7 +156,7 @@
|
||||||
<div class=" flex flex-col w-full">
|
<div class=" flex flex-col w-full">
|
||||||
<div class="card card-side bg-white shadow-xl w-full">
|
<div class="card card-side bg-white shadow-xl w-full">
|
||||||
<figure class="w-full lg:w-5/12 imgCard">
|
<figure class="w-full lg:w-5/12 imgCard">
|
||||||
<img src={qualify_exams[2].image} alt="1" class="h-full"/>
|
<img src={qualify_exams[2].image} alt="1" class="h-full fit"/>
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body w-full lg:w-7/12">
|
<div class="card-body w-full lg:w-7/12">
|
||||||
<div class="text-sm font-medium text-gray-500">
|
<div class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -213,7 +213,7 @@
|
||||||
<div class="w-full lg:w-6/12 cardxl">
|
<div class="w-full lg:w-6/12 cardxl">
|
||||||
<div class="card bg-white shadow-xl w-full ">
|
<div class="card bg-white shadow-xl w-full ">
|
||||||
<figure style="height: 250px;" class="img-hover-zoom--brightness">
|
<figure style="height: 250px;" class="img-hover-zoom--brightness">
|
||||||
<img src={competitive_exams[0].image} alt="1" />
|
<img src={competitive_exams[0].image} alt="1" class="h-full fit" />
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="text-sm font-medium text-gray-500">
|
<div class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -252,7 +252,7 @@
|
||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<div class="card card-side bg-white shadow-xl w-full">
|
<div class="card card-side bg-white shadow-xl w-full">
|
||||||
<figure class="w-full lg:w-5/12 imgCard">
|
<figure class="w-full lg:w-5/12 imgCard">
|
||||||
<img src={competitive_exams[1].image} alt="1" class="h-full" />
|
<img src={competitive_exams[1].image} alt="1" class="h-full fit" />
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body w-full lg:w-7/12">
|
<div class="card-body w-full lg:w-7/12">
|
||||||
<h2 class="text-sm font-medium text-gray-500">
|
<h2 class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -287,7 +287,7 @@
|
||||||
<div class=" flex flex-col w-full">
|
<div class=" flex flex-col w-full">
|
||||||
<div class="card card-side bg-white shadow-xl w-full">
|
<div class="card card-side bg-white shadow-xl w-full">
|
||||||
<figure class="w-full lg:w-5/12 imgCard">
|
<figure class="w-full lg:w-5/12 imgCard">
|
||||||
<img src={competitive_exams[2].image} alt="1" class="h-full"/>
|
<img src={competitive_exams[2].image} alt="1" class="h-full fit"/>
|
||||||
</figure>
|
</figure>
|
||||||
<div class="card-body w-full lg:w-7/12">
|
<div class="card-body w-full lg:w-7/12">
|
||||||
<div class="text-sm font-medium text-gray-500">
|
<div class="text-sm font-medium text-gray-500">
|
||||||
|
|
@ -360,4 +360,11 @@
|
||||||
.imgCard{
|
.imgCard{
|
||||||
height: 210px;
|
height: 210px;
|
||||||
}
|
}
|
||||||
|
.fit{
|
||||||
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
object-position: top;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -39,12 +39,45 @@
|
||||||
<div><img src={i.url} alt={i.title}></div>
|
<div><img src={i.url} alt={i.title}></div>
|
||||||
{/each}
|
{/each}
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
{#if data.regi}
|
||||||
|
<div class="{data.regi.length == 0 ? 'display-none': 'w-12/12 text-lg font-medium'}">สมัครสอบ</div>
|
||||||
|
{#each data.regi as regi}
|
||||||
|
<hr class="border-blueGray-200 my-2" />
|
||||||
|
|
||||||
|
<div class="text-lg py-1">
|
||||||
|
<div class="flex flex-wrap items-center">
|
||||||
|
<a class="btn btn-sm btn-outline btn-info cursor-pointe" href={regi.url} target="_blank">
|
||||||
|
<i class="fa-solid fa-pen-to-square text-sm pr-2"></i>
|
||||||
|
สมัครสอบ
|
||||||
|
</a>
|
||||||
|
<div class="pl-4">
|
||||||
|
<span>{regi.title}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
<div class="pb-7"></div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
{#if data.files}
|
{#if data.files}
|
||||||
|
<div class="{data.files.length == 0 ? 'display-none': 'w-12/12 text-lg font-medium'}">เอกสารประกอบ</div>
|
||||||
{#each data.files as file}
|
{#each data.files as file}
|
||||||
<hr class="border-blueGray-200 mb-4 mt-4" />
|
<hr class="border-blueGray-200 my-2" />
|
||||||
<div class="text-lg py-1">
|
|
||||||
<i class="fa-solid fa-bookmark mr-3 text-xs text-blue-400"></i><a href={file.url} class="text-blue-400 hover:text-blue-600" target="_blank">คลิกที่นี่เพื่ออ่าน </a> <span class="font-medium">{file.title}</span>
|
<div class="text-lg py-1">
|
||||||
</div>
|
<div class="flex flex-wrap items-center">
|
||||||
|
<a class="btn btn-sm btn-outline btn-primary cursor-pointe" href={file.url} target="_blank">
|
||||||
|
<i class="fa-solid fa-eye text-sm pr-2"></i>
|
||||||
|
อ่านเพิ่มเติม
|
||||||
|
</a>
|
||||||
|
<div class="pl-4">
|
||||||
|
<!-- <i class="fa-solid fa-bookmark mr-3 text-xs text-primary"></i> -->
|
||||||
|
<span>{file.title}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
{/if}
|
{/if}
|
||||||
<hr class="border-blueGray-200 my-7" />
|
<hr class="border-blueGray-200 my-7" />
|
||||||
|
|
|
||||||
|
|
@ -39,13 +39,44 @@
|
||||||
<div><img src={i.url} alt={i.title}></div>
|
<div><img src={i.url} alt={i.title}></div>
|
||||||
{/each}
|
{/each}
|
||||||
{/if}
|
{/if}
|
||||||
|
{#if data.regi}
|
||||||
|
<div class="{data.regi.length == 0 ? 'display-none': 'w-12/12 text-lg font-medium'}">สมัครสอบ</div>
|
||||||
|
{#each data.regi as regi}
|
||||||
|
<hr class="border-blueGray-200 my-2" />
|
||||||
|
|
||||||
|
<div class="text-lg py-1">
|
||||||
|
<div class="flex flex-wrap items-center">
|
||||||
|
<a class="btn btn-sm btn-outline btn-info cursor-pointe" href={regi.url} target="_blank">
|
||||||
|
<i class="fa-solid fa-pen-to-square text-sm pr-2"></i>
|
||||||
|
สมัครสอบ
|
||||||
|
</a>
|
||||||
|
<div class="pl-4">
|
||||||
|
<span>{regi.title}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
<div class="pb-7"></div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
{#if data.files}
|
{#if data.files}
|
||||||
|
<div class="{data.files.length == 0 ? 'display-none': 'w-12/12 text-lg font-medium'}">เอกสารประกอบ</div>
|
||||||
{#each data.files as file}
|
{#each data.files as file}
|
||||||
<hr class="border-blueGray-200 mb-4 mt-4" />
|
<hr class="border-blueGray-200 my-2" />
|
||||||
<div class="text-lg py-1">
|
|
||||||
<i class="fa-solid fa-bookmark mr-3 text-xs text-blue-400"></i><a href={file.url} class="text-blue-400 hover:text-blue-600" target="_blank">คลิกที่นี่เพื่ออ่าน </a> <span class="font-medium">{file.title}</span>
|
<div class="text-lg py-1">
|
||||||
</div>
|
<div class="flex flex-wrap items-center">
|
||||||
|
<a class="btn btn-sm btn-outline btn-primary cursor-pointe" href={file.url} target="_blank">
|
||||||
|
<i class="fa-solid fa-eye text-sm pr-2"></i>
|
||||||
|
อ่านเพิ่มเติม
|
||||||
|
</a>
|
||||||
|
<div class="pl-4">
|
||||||
|
<!-- <i class="fa-solid fa-bookmark mr-3 text-xs text-primary"></i> -->
|
||||||
|
<span>{file.title}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
{/if}
|
{/if}
|
||||||
<hr class="border-blueGray-200 my-7" />
|
<hr class="border-blueGray-200 my-7" />
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue