hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ui คำขอประเมิน

Browse source
This commit is contained in:
setthawutttty 2023-12-20 14:00:56 +07:00
parent f16295f335
commit 963448531f
5 changed files with 1018 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

188
src/modules/12_evaluatePersonal/components/Detail/step/step5.vue
View file

@ -1,23 +1,187 @@
<script setup lang="ts">
import { ref } from "vue";
const fileEvaluation5 = ref<any>();
const status = ref<string>("ANNOUNCE_WEB");
const website = ref<string>("https://bma-ehr.frappet.com/");
const files = [
{
id: "x1",
fileName: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
pathName: "12",
},
{
id: "x2",
fileName: "ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)",
pathName: "12",
},
{
id: "x3",
fileName: "เอกสารแสดงผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
pathName: "12",
},
];
const listFile = [
{
id: "x1",
fileName: "เอกสาร 1",
pathName: "12",
},
{
id: "x2",
fileName: "เอกสาร 2",
pathName: "12",
},
];
function downloadFile(name: string) {
console.log("download");
}
function deleteFile(name: string) {
console.log("delete");
}
function save() {
console.log("save");
}
</script>
<template>
<div class="row">
<div class="col-12 text-center q-">
<q-badge
v-if="status == 'ANNOUNCE_WEB'"
outline
color="primary"
label="ประกาศบนเว็บไซต์"
class="q-pa-sm"
style="font-size: 16px"
/>
<div>
<a :href="website" target="_blank">{{ website }}</a>
<div class="row q-gutter-sm">
<div class="col-12">
<q-banner inline-actions bordered class="bg-red-1 text-red border-red">
<q-icon name="mdi-information-outline" size="20px" />
ประกาศเมื่อวันที่ 20 พ.ค. 2566 ถึงวันที่ 20 ธ.ค. 2566
</q-banner>
</div>
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
เอกสารประกาศผลการคัดเลือกบุคคล
</div>
<div class="col-12"><q-separator /></div>
<q-list
v-for="file in files"
:key="file.id"
class="full-width"
bordered
separator
>
<q-item clickable v-ripple>
<q-item-section>{{ file.fileName }}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
@click="downloadFile(file.pathName)"
>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
บันทึกแจ้งผลการประกาศคัดเลือก
</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-md col-12 q-mb-xs">
<div class="col-xs-12 col-sm-11 row">
<q-file
v-model="fileEvaluation5"
class="col-12"
outlined
dense
hide-bottom-space
lazy-rules
accept=".pdf"
label="อัปโหลดไฟล์"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
</div>
<div class="col-1 self-center text-center q-pl-none">
<q-btn flat round dense color="primary" icon="mdi-upload"
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
>
</div>
</div>
<div v-if="listFile.length > 0">
<q-list
v-for="file in listFile"
:key="file.id"
class="full-width"
bordered
separator
>
<q-item clickable v-ripple>
<q-item-section>{{ file.fileName }}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
@click="downloadFile(file.pathName)"
>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-trash-can-outline"
@click="deleteFile(file.pathName)"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
<div class="col-12" v-else>
<q-card class="q-pa-md" bordered> ไม่มีรายการเอกสาร </q-card>
</div>
</div>
</div>
</q-card>
</div>
<div class="col-12">
<div class="q-mt-xs q-gutter-md" align="right">
<q-btn
unelevated
label="บันทึกแจ้งผลการประกาศคัดเลือก"
color="public"
@click="save"
/>
</div>
</div>
</div>