UI ประเมิณ
This commit is contained in:
parent
93bdc791dc
commit
870625aecb
3 changed files with 172 additions and 18 deletions
|
|
@ -176,7 +176,7 @@ function onClickApprove(type: string = "") {
|
|||
/>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-list>
|
||||
<q-list @click="redirectViewDetail(props.row.id)">
|
||||
<q-item
|
||||
v-for="col in props.cols.filter((col:any) => col.name !== 'desc')"
|
||||
:key="col.name"
|
||||
|
|
|
|||
|
|
@ -227,7 +227,7 @@ onMounted(() => {
|
|||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-sm">
|
||||
<q-table
|
||||
<d-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
|
|
@ -361,7 +361,135 @@ onMounted(() => {
|
|||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
<template #item="props">
|
||||
<div class="q-pa-xs col-xs-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<q-card bordered flat>
|
||||
<q-list>
|
||||
<q-item
|
||||
v-for="col in props.cols.filter((col:any) => col.name !== 'desc')"
|
||||
:key="col.name"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ col.label }}</q-item-label>
|
||||
<q-item-label v-if="col.name == 'createDate'">
|
||||
{{ col.value ? date2Thai(col.value) : "-" }}
|
||||
</q-item-label>
|
||||
<q-item-label v-else-if="col.name == 'develop'">
|
||||
<div class="column">
|
||||
<q-checkbox
|
||||
size="xs"
|
||||
:model-value="props.row.isDevelopment70"
|
||||
label="70 การลงมือปฏิบัติ (โดยผู้บังคับบัญชามอบหมาย)"
|
||||
/>
|
||||
<q-checkbox
|
||||
size="xs"
|
||||
:model-value="props.row.isDevelopment20"
|
||||
label="20 การเรียนรู้จากผู้อื่น (Coach/Mentor/Consulting)"
|
||||
/>
|
||||
<q-checkbox
|
||||
size="xs"
|
||||
:model-value="props.row.isDevelopment10"
|
||||
label="10 การฝึกอบรมอื่นๆ"
|
||||
/>
|
||||
</div>
|
||||
</q-item-label>
|
||||
<q-item-label v-else-if="col.name == 'achievement'">
|
||||
<q-btn-group outline>
|
||||
<q-btn
|
||||
outline
|
||||
color="grey-6"
|
||||
label="0"
|
||||
:class="props.row.summary == 0 && 'active'"
|
||||
><q-tooltip>{{
|
||||
props.row.achievement0
|
||||
}}</q-tooltip></q-btn
|
||||
>
|
||||
<q-btn
|
||||
outline
|
||||
color="grey-6"
|
||||
label="5"
|
||||
:class="props.row.summary == 5 && 'active'"
|
||||
><q-tooltip>{{
|
||||
props.row.achievement5
|
||||
}}</q-tooltip></q-btn
|
||||
>
|
||||
<q-btn
|
||||
outline
|
||||
color="grey-6"
|
||||
label="10"
|
||||
:class="props.row.summary == 10 && 'active'"
|
||||
><q-tooltip>{{
|
||||
props.row.achievement10
|
||||
}}</q-tooltip></q-btn
|
||||
>
|
||||
</q-btn-group>
|
||||
</q-item-label>
|
||||
<q-item-label v-else-if="col.name == 'summary'">
|
||||
{{ props.row.summary ? props.row.summary : 0 }}
|
||||
</q-item-label>
|
||||
<q-item-label v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<q-separator />
|
||||
<q-card-actions
|
||||
align="around"
|
||||
v-if="
|
||||
store.dataEvaluation.evaluationStatus == 'APPROVE' &&
|
||||
store.tabMain === '2'
|
||||
"
|
||||
>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
icon="mdi-developer-board"
|
||||
color="blue-6"
|
||||
size="12px"
|
||||
dense
|
||||
@click="openPopupProgress(props.row.id)"
|
||||
>
|
||||
<q-tooltip>รายงานความก้าวหน้า</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
icon="warning"
|
||||
color="red-5"
|
||||
size="12px"
|
||||
dense
|
||||
main="problem"
|
||||
@click="openPopupProblem(props.row.id)"
|
||||
>
|
||||
<q-tooltip>รายงานปัญหา</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions align="around" v-if="isEditStep1">
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
icon="edit"
|
||||
color="edit"
|
||||
@click.stop.pervent="onEdit(props.row.id)"
|
||||
>
|
||||
<q-tooltip>แก้ไข </q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
icon="delete"
|
||||
color="red"
|
||||
@click.stop.pervent="onDelete(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล </q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
</d-table>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
|
||||
|
|
|
|||
|
|
@ -130,7 +130,7 @@ function onSubmit() {
|
|||
? commanderHighId.value.id
|
||||
: null,
|
||||
})
|
||||
.then(() => {
|
||||
.then((res) => {
|
||||
success($q, "บันทึกสำเร็จ");
|
||||
close();
|
||||
})
|
||||
|
|
@ -246,11 +246,13 @@ function filterOption(val: any, update: Function, refData: string) {
|
|||
// getAll();
|
||||
// }
|
||||
|
||||
function getAll() {
|
||||
getProfile();
|
||||
fetchEvaluation();
|
||||
store.checkStep();
|
||||
getOrgOp();
|
||||
async function getAll() {
|
||||
await getProfile();
|
||||
await fetchEvaluation();
|
||||
|
||||
await store.checkStep();
|
||||
|
||||
await getOrgOp();
|
||||
}
|
||||
|
||||
function sendToEvaluatore(status: string) {
|
||||
|
|
@ -263,7 +265,7 @@ function sendToEvaluatore(status: string) {
|
|||
.put(config.API.kpiSendToStatus(id.value), {
|
||||
status: status,
|
||||
})
|
||||
.then(() => {
|
||||
.then((res) => {
|
||||
success($q, "ส่งข้อตกลงให้ผู้ประเมินอนุมัติสำเร็จ");
|
||||
close();
|
||||
})
|
||||
|
|
@ -290,7 +292,7 @@ function requireEdit() {
|
|||
.put(config.API.kpiReqEdit(id.value), {
|
||||
status: "EVALUATOR",
|
||||
})
|
||||
.then(() => {
|
||||
.then((res) => {
|
||||
success($q, "ขอแก้ไขสำเร็จ");
|
||||
close();
|
||||
})
|
||||
|
|
@ -307,9 +309,10 @@ function requireEdit() {
|
|||
);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(async () => {
|
||||
showLoader();
|
||||
getAll();
|
||||
await getAll();
|
||||
console.log(store.dataEvaluation.avartar);
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -340,11 +343,25 @@ onMounted(() => {
|
|||
</div>
|
||||
<div class="col-12">
|
||||
<q-card bordered flat class="relative-position">
|
||||
<div class="row justify-center q-pa-md" v-if="!$q.screen.gt.xs">
|
||||
<q-avatar size="80px">
|
||||
<q-img
|
||||
:src="store.dataEvaluation.avartar"
|
||||
v-if="store.dataEvaluation.avartar !== undefined"
|
||||
/>
|
||||
<q-img src="@/assets/avatar_user.jpg" v-else />
|
||||
</q-avatar>
|
||||
</div>
|
||||
<!-- <div class="row text-center">
|
||||
|
||||
</div> -->
|
||||
|
||||
<div
|
||||
v-if="$q.screen.gt.xs"
|
||||
class="absolute-center-left"
|
||||
style="left: 2%; top: 50%; transform: translateY(-50%)"
|
||||
>
|
||||
<q-avatar size="95px">
|
||||
<q-avatar size="80px">
|
||||
<q-img
|
||||
:src="store.dataEvaluation.avartar"
|
||||
v-if="store.dataEvaluation.avartar !== undefined"
|
||||
|
|
@ -354,12 +371,16 @@ onMounted(() => {
|
|||
</div>
|
||||
<div class="row col-12">
|
||||
<div class="row items-center col-12 q-pa-sm">
|
||||
<div class="col-12" style="padding-left: 12%">
|
||||
<div class="row col-12 items-center">
|
||||
<div
|
||||
class="col-12"
|
||||
:style="$q.screen.gt.xs ? 'padding-left: 12%' : ''"
|
||||
>
|
||||
<div class="row col-12 items-center justify-center">
|
||||
<span class="text-h6 text-weight-medium text-primary">{{
|
||||
`${store.dataEvaluation.prefix}${store.dataEvaluation.firstName} ${store.dataEvaluation.lastName}`
|
||||
}}</span>
|
||||
<q-space />
|
||||
<q-space v-if="$q.screen.gt.xs" />
|
||||
|
||||
<div class="q-gutter-x-sm">
|
||||
<span
|
||||
v-if="
|
||||
|
|
@ -473,7 +494,12 @@ onMounted(() => {
|
|||
</div>
|
||||
|
||||
<div class="row items-center bg-toolbar col-12 q-pa-sm">
|
||||
<div class="col-12 q-py-xs" style="padding-left: 12%">
|
||||
<div
|
||||
class="col-12 q-py-xs"
|
||||
:style="
|
||||
$q.screen.gt.xs ? 'padding-left: 12%' : 'padding-left:5%'
|
||||
"
|
||||
>
|
||||
<div class="row no-wrap">
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue