ui คำชี้แจง
This commit is contained in:
parent
38c6d72f80
commit
bffe7f5568
1 changed files with 53 additions and 35 deletions
|
|
@ -1,44 +1,41 @@
|
|||
<template>
|
||||
<div class="q-pa-md">
|
||||
<div class="text-h4 text-center text-primary q-pb-lg">รายละเอียดการสอบ</div>
|
||||
<div>
|
||||
<q-card v-for="exam in examPost" :key="exam.contentItemId" class="q-pa-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6 q-py-sm">{{ exam.displayText }} ({{ exam.description }})</div>
|
||||
<div class="text-subtitle2 q-py-sm">ประกาศวันที่ {{ date2Thai(exam.createdUtc) }}</div>
|
||||
<div class="text-subtitle2 q-py-sm">ประจำปีงบประมาณ {{ exam.budgetYear }}</div>
|
||||
<div class="text-subtitle2 q-py-sm">
|
||||
เปิดรับสมัครวันที่ {{ date2Thai(exam.startDate) }} - {{ date2Thai(exam.endDate) }}
|
||||
</div>
|
||||
<div class="text-subtitle2 q-py-sm">ค่าธรรมเนียมการสมัคร {{ exam.fee }} บาท</div>
|
||||
<div v-html="exam.htmlBody.html"></div>
|
||||
</q-card-section>
|
||||
|
||||
<div class="text-subtitle1 text-center text-primary">ประกาศเกี่ยวกับการสอบนี้</div>
|
||||
<div class="row justify-start q-pa-md q-col-gutter-md">
|
||||
<div
|
||||
v-for="file in exam.bag.contentItems"
|
||||
:key="file.contentItemId"
|
||||
class="col-12"
|
||||
:href="`https://localhost:5001${file.file.urls[0]}`"
|
||||
>
|
||||
<p>
|
||||
<a :href="`https://localhost:5001${file.file.urls[0]}`" target="_blank">{{
|
||||
file.displayText
|
||||
}}</a
|
||||
><br />
|
||||
</p>
|
||||
</div>
|
||||
<div class="q-px-md">
|
||||
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6 q-py-sm">{{ exam.displayText }} ({{ exam.description }})</div>
|
||||
<div class="text-subtitle2 q-py-sm">ประกาศวันที่ {{ date2Thai(exam.createdUtc) }}</div>
|
||||
<div class="text-subtitle2 q-py-sm">ประจำปีงบประมาณ {{ exam.budgetYear }}</div>
|
||||
<div class="text-subtitle2 q-py-sm">
|
||||
เปิดรับสมัครวันที่ {{ date2Thai(exam.startDate) }} - {{ date2Thai(exam.endDate) }}
|
||||
</div>
|
||||
<template v-slot:body-cell-name="props">
|
||||
<div class="text-subtitle2 q-py-sm">ค่าธรรมเนียมการสมัคร {{ exam.fee }} บาท</div>
|
||||
<!-- <div v-html="exam.htmlBody.html"></div> -->
|
||||
</q-card-section>
|
||||
|
||||
<div class="text-subtitle1 text-center text-primary">เอกสารเกี่ยวกับการสอบนี้</div>
|
||||
<div class="row justify-start q-pa-md q-col-gutter-md">
|
||||
<div
|
||||
v-for="file in exam.document"
|
||||
:key="file.contentItemId"
|
||||
class="col-12"
|
||||
:href="`https://localhost:5001${file.file}`"
|
||||
>
|
||||
<p>
|
||||
<a :href="`https://localhost:5001${file.file}`" target="_blank">{{
|
||||
file.displayText
|
||||
}}</a
|
||||
><br />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <template v-slot:body-cell-name="props">
|
||||
<q-td :props="props">
|
||||
<div>
|
||||
<a href="https://quasar.dev/vue-components/table#QTable-API" />
|
||||
</div>
|
||||
</q-td>
|
||||
</template>
|
||||
</q-card>
|
||||
</div>
|
||||
</template> -->
|
||||
</q-card>
|
||||
<div class="col-12">
|
||||
<div class="text-h6 q-py-sm">ข้อควรระวัง</div>
|
||||
<div class="text-warning q-pb-md">1. ผู้สมัครสามารถสมัครได้เพียงครั้งเดียว</div>
|
||||
|
|
@ -59,7 +56,28 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { ref } from 'vue'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
|
||||
const mixin = useCounterMixin()
|
||||
const { date2Thai } = mixin
|
||||
const exam = ref<any>({
|
||||
contentItemId: null,
|
||||
displayText: 'การสอบภาค ข.พิเศษ สำหรับผู้สอบผ่านของ่วนราชการแล้ว',
|
||||
description: 'ครั้งที่2',
|
||||
createdUtc: new Date(),
|
||||
budgetYear: 2566,
|
||||
startDate: new Date(),
|
||||
endDate: new Date(),
|
||||
fee: 200,
|
||||
document: [
|
||||
{
|
||||
contentItemId: 111,
|
||||
file: '111',
|
||||
displayText: 'เอกสารเพิ่มเติมเกี่ยวกับการสอบ'
|
||||
}
|
||||
]
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue