ปรับ KPI ส่วนของระบบบริการเจ้าของข้อมูล
This commit is contained in:
STW_TTTY\stwtt
parent
6147e3eee0
commit
87952fd5b9
6 changed files with 478 additions and 19 deletions
273
src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue
Normal file
273
src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue
Normal file
|
|
@ -0,0 +1,273 @@
|
|||
<script setup lang="ts">
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { ref,watch } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
dialogConfirm,
|
||||
success,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
findPosMasterNoOld,
|
||||
findOrgNameOld,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const filterKeyword = ref<string>("");
|
||||
const rows = ref<any[]>([]);
|
||||
|
||||
//หัวตาราง
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
sortable: false,
|
||||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "name",
|
||||
align: "left",
|
||||
label: "ชื่อ-นามสกุล",
|
||||
sortable: true,
|
||||
field: "name",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return `${row.prefix}${row.firstName} ${row.lastName}`;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "posMasterNoOld",
|
||||
align: "left",
|
||||
label: "เลขที่ตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "posMasterNoOld",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return findPosMasterNoOld(row);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "positionOld",
|
||||
align: "left",
|
||||
label: "ตำแหน่งในสายงาน",
|
||||
sortable: true,
|
||||
field: "positionOld",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionLevel",
|
||||
align: "left",
|
||||
label: "ประเภทตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
let name = "";
|
||||
if (row.posTypeNameOld && row.posLevelNameOld) {
|
||||
name = `${row.posTypeNameOld} (${row.posLevelNameOld})`;
|
||||
} else if (row.posTypeNameOld) {
|
||||
name = `${row.posTypeNameOld}`;
|
||||
} else if (row.posLevelNameOld) {
|
||||
name = `(${row.posLevelNameOld})`;
|
||||
} else name = "-";
|
||||
return name;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "organizationPositionOld",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val, row) => findOrgNameOld(row),
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
align: "left",
|
||||
label: "หน่วยงานที่ให้ช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "dateStart",
|
||||
align: "left",
|
||||
label: "วันเริ่มช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateStart",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => date2Thai(val),
|
||||
},
|
||||
{
|
||||
name: "dateEnd",
|
||||
align: "left",
|
||||
label: "วันสิ้นสุดการช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateEnd",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => date2Thai(val),
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "createdAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => date2Thai(val),
|
||||
},
|
||||
{
|
||||
name: "status",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "status",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => statusText(val),
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"name",
|
||||
"posMasterNoOld",
|
||||
"positionOld",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
"organization",
|
||||
"dateStart",
|
||||
"dateEnd",
|
||||
"createdAt",
|
||||
"status",
|
||||
]);
|
||||
|
||||
const statusText = (val: string) => {
|
||||
switch (val) {
|
||||
case "WAITTING":
|
||||
return "รอดำเนินการ";
|
||||
case "PENDING":
|
||||
return "เลือกตำแหน่งแล้ว";
|
||||
case "APPROVE":
|
||||
return "อนุมัติ";
|
||||
case "REJECT":
|
||||
return "ไม่อนุมัติ";
|
||||
case "REPORT":
|
||||
return "ส่งรายชื่อไปออกคำสั่ง";
|
||||
case "DONE":
|
||||
return "ออกคำสั่งเสร็จแล้ว";
|
||||
|
||||
default:
|
||||
return "-";
|
||||
}
|
||||
};
|
||||
|
||||
function close() {
|
||||
modal.value = false;
|
||||
}
|
||||
|
||||
function getData(){
|
||||
showLoader()
|
||||
http
|
||||
.get(config.API.placementKeycloak)
|
||||
.then((res)=>{
|
||||
const data = res.data.result
|
||||
rows.value = data
|
||||
}).catch((e)=>{
|
||||
messageError($q,e)
|
||||
}).finally(()=>{
|
||||
hideLoader()
|
||||
})
|
||||
}
|
||||
watch(()=>modal.value,(n)=>{
|
||||
if(n == true){
|
||||
getData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog persistent v-model="modal">
|
||||
<q-card bordered style="min-width: 80vw">
|
||||
<DialogHeader tittle="ข้อมูลการช่วยราชการ" :close="close" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<d-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:filter="filterKeyword"
|
||||
row-key="id"
|
||||
flat
|
||||
bordered
|
||||
:paging="true"
|
||||
dense
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
:visible-columns="visibleColumns"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div v-if="col.name === 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
<!-- <template v-slot:pagination="scope">
|
||||
ทั้งหมด {{ total }} รายการ
|
||||
<q-pagination
|
||||
v-model="formQuery.page"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="Number(totalList)"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
:max-pages="5"
|
||||
@update:model-value="fetchList"
|
||||
></q-pagination>
|
||||
</template> -->
|
||||
</d-table>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
69
src/modules/08_KPI/components/Tab/Dialog/DialogStatus.vue
Normal file
69
src/modules/08_KPI/components/Tab/Dialog/DialogStatus.vue
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
<script setup lang="ts">
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { ref, watch } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const work = ref<boolean>(false);
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
dialogConfirm,
|
||||
success,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
findPosMasterNoOld,
|
||||
findOrgNameOld,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
|
||||
function close() {
|
||||
modal.value = false;
|
||||
}
|
||||
|
||||
function getData() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.orgPosition)
|
||||
.then((res) => {
|
||||
const data = res.data.result.isProbation;
|
||||
work.value = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
watch(
|
||||
() => modal.value,
|
||||
(n) => {
|
||||
if (n == true) {
|
||||
getData();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog persistent v-model="modal">
|
||||
<q-card bordered style="min-width: 20vw">
|
||||
<DialogHeader tittle="สถานะการทดลองงาน" :close="close" />
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-sm">
|
||||
<div class="row">
|
||||
<div class="col-12 text-center bg-grey-1 q-pa-md rounded-borders">
|
||||
<span class="text-weight-bold text-teal">{{work ? `อยู่ระหว่างทดลองงาน`:'พ้นจากการทดลองงาน'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
@ -230,17 +230,19 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
|
|||
// ROLE & TAB
|
||||
const rolePerson = ref<string>("USER"); //"USER" | "EVALUATOR" | "COMMANDER", "COMMANDERHIGH"
|
||||
const tabOpen = ref<number>(1);
|
||||
function checkStep() {
|
||||
const role =
|
||||
dataEvaluation.value.profileId == dataProfile.value.profileId
|
||||
async function checkStep() {
|
||||
const role =
|
||||
|
||||
dataEvaluation.value.profileId == await dataProfile.value.profileId
|
||||
? "USER"
|
||||
: dataEvaluation.value.evaluatorId == dataProfile.value.profileId
|
||||
: dataEvaluation.value.evaluatorId == await dataProfile.value.profileId
|
||||
? "EVALUATOR"
|
||||
: dataEvaluation.value.commanderId == dataProfile.value.profileId
|
||||
: dataEvaluation.value.commanderId == await dataProfile.value.profileId
|
||||
? "COMMANDER"
|
||||
: dataEvaluation.value.commanderHighId == dataProfile.value.profileId
|
||||
: dataEvaluation.value.commanderHighId == await dataProfile.value.profileId
|
||||
? "COMMANDERHIGH"
|
||||
: "";
|
||||
console.log("🚀 ~ checkStep ~ role:", role)
|
||||
rolePerson.value = role;
|
||||
|
||||
switch (dataEvaluation.value.evaluationStatus) {
|
||||
|
|
|
|||
|
|
@ -12,7 +12,11 @@ import { useKpiDataStore } from "@/modules/08_KPI/store";
|
|||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import type { FormProfile } from "@/modules/08_KPI/interface/request/index";
|
||||
import type { DataOptions } from "@/modules/08_KPI/interface/index/Main";
|
||||
import DialogGovernment from "@/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue";
|
||||
import DialogStatus from "@/modules/08_KPI/components/Tab/Dialog/DialogStatus.vue";
|
||||
|
||||
const modalGovernment = ref<boolean>(false);
|
||||
const modalStatus = ref<boolean>(false);
|
||||
// const modalScore = ref<boolean>(false);
|
||||
const modalEdit = ref<boolean>(false);
|
||||
const route = useRoute();
|
||||
|
|
@ -58,7 +62,8 @@ async function fetchEvaluation() {
|
|||
await http
|
||||
.get(config.API.kpiEvaluation + `/${id.value}`)
|
||||
.then(async (res) => {
|
||||
const data = await res.data.result;
|
||||
const data = res.data.result;
|
||||
console.log("🚀 ~ .then ~ data:", data)
|
||||
|
||||
store.dataEvaluation = await data;
|
||||
formProfile.status = store.convertStatus(data.evaluationStatus);
|
||||
|
|
@ -82,11 +87,11 @@ async function fetchEvaluation() {
|
|||
// });
|
||||
}
|
||||
|
||||
function getProfile() {
|
||||
http
|
||||
async function getProfile() {
|
||||
await http
|
||||
.get(config.API.profilePosition())
|
||||
.then(async (res) => {
|
||||
const data = await res.data.result;
|
||||
const data = res.data.result;
|
||||
store.dataProfile = await data;
|
||||
})
|
||||
.catch((e) => {
|
||||
|
|
@ -144,7 +149,7 @@ function onSubmit() {
|
|||
});
|
||||
}
|
||||
|
||||
function getOrgOp() {
|
||||
async function getOrgOp() {
|
||||
http
|
||||
.get(config.API.Kpiorg)
|
||||
.then((res) => {
|
||||
|
|
@ -249,10 +254,8 @@ function filterOption(val: any, update: Function, refData: string) {
|
|||
async function getAll() {
|
||||
await getProfile();
|
||||
await fetchEvaluation();
|
||||
|
||||
await store.checkStep();
|
||||
|
||||
await getOrgOp();
|
||||
await store.checkStep();
|
||||
}
|
||||
|
||||
function sendToEvaluatore(status: string) {
|
||||
|
|
@ -309,10 +312,37 @@ function requireEdit() {
|
|||
);
|
||||
}
|
||||
|
||||
function openGovernment() {
|
||||
modalGovernment.value = true;
|
||||
}
|
||||
function openStatus() {
|
||||
modalStatus.value = true;
|
||||
}
|
||||
|
||||
function sendToCommander() {
|
||||
dialogConfirm($q, () => {
|
||||
showLoader();
|
||||
http
|
||||
.post(config.API.sendToCommander, {
|
||||
status: "EVALUATING",
|
||||
id: [store.dataEvaluation.id],
|
||||
})
|
||||
.then(async (res) => {
|
||||
await getAll();
|
||||
store.tabMain = "3";
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader()
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
showLoader();
|
||||
await getAll();
|
||||
console.log(store.dataEvaluation.avartar);
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -388,7 +418,7 @@ onMounted(async () => {
|
|||
store.indicatorWeightTotal != 100) ||
|
||||
(store.dataEvaluation.posExecutiveName != null &&
|
||||
(store.indicatorWeight1Total != 100 ||
|
||||
store.indicatorWeight2Total != 20))
|
||||
store.indicatorWeight2Total != 20)) && store.dataEvaluation.evaluationStatus == 'NEW'
|
||||
"
|
||||
class="text-red"
|
||||
>*น้ำหนัก(ร้อยละ) ผลสัมฤทธิ์ของงานไม่ถูกต้อง</span
|
||||
|
|
@ -417,11 +447,25 @@ onMounted(async () => {
|
|||
>
|
||||
<q-tooltip>ส่งให้ผู้ประเมินอนุมัติ</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<q-btn
|
||||
v-if="
|
||||
store.tabMain == '2' &&
|
||||
store.dataEvaluation.evaluationStatus == 'APPROVE'
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToCommander"
|
||||
>
|
||||
<q-tooltip>ทำการประเมิน</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'EVALUATING'
|
||||
store.dataEvaluation.evaluationStatus == 'EVALUATING' && store.tabMain == '3'
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
|
|
@ -477,6 +521,7 @@ onMounted(async () => {
|
|||
color="grey-2"
|
||||
text-color="primary"
|
||||
size="md"
|
||||
@click="openGovernment"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการช่วยราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -487,6 +532,7 @@ onMounted(async () => {
|
|||
text-color="blue-5"
|
||||
icon="mdi-file-eye-outline"
|
||||
size="md"
|
||||
@click="openStatus"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการทดลองงาน</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -783,6 +829,9 @@ onMounted(async () => {
|
|||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog> -->
|
||||
|
||||
<DialogGovernment v-model:modal="modalGovernment" />
|
||||
<DialogStatus v-model:modal="modalStatus" />
|
||||
</template>
|
||||
<style>
|
||||
.bg-toolbar {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue