diff --git a/src/modules/08_KPI/components/Evaluator/01_TabAll.vue b/src/modules/08_KPI/components/Evaluator/01_TabAll.vue index 5c0db8d..127ecc8 100644 --- a/src/modules/08_KPI/components/Evaluator/01_TabAll.vue +++ b/src/modules/08_KPI/components/Evaluator/01_TabAll.vue @@ -8,8 +8,11 @@ import { useKpiDataStore } from "@/modules/08_KPI/store"; import type { ResEvaluatorAssessor } from "@/modules/08_KPI/interface/response/index"; import type { FormQuery } from "@/modules/08_KPI/interface/request/index"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const store = useKpiDataStore(); const router = useRouter(); +const isLoad = defineModel('isLoad',{required:true}) const visibleColumns = defineModel("visibleColumns", { required: true, }); @@ -42,6 +45,7 @@ async function redirectViewDetail(id: string) { + diff --git a/src/modules/08_KPI/components/Evaluator/02_TabOther.vue b/src/modules/08_KPI/components/Evaluator/02_TabOther.vue index 20aed72..2f711ec 100644 --- a/src/modules/08_KPI/components/Evaluator/02_TabOther.vue +++ b/src/modules/08_KPI/components/Evaluator/02_TabOther.vue @@ -12,6 +12,8 @@ import { useKpiDataStore } from "@/modules/08_KPI/store"; import type { FormQuery } from "@/modules/08_KPI/interface/request/index"; import type { ResEvaluatorAssessor } from "@/modules/08_KPI/interface/response/index"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const $q = useQuasar(); const router = useRouter(); const store = useKpiDataStore(); @@ -34,6 +36,7 @@ const rows = defineModel("rows", { required: true }); const formQuery = defineModel("formQuery", { required: true }); const total = defineModel("total", { required: true }); const maxPage = defineModel("maxPage", { required: true }); +const isLoad = defineModel("isLoad", { required: true }); const props = defineProps({ updatePagination: { type: Function }, @@ -109,6 +112,7 @@ async function onClickApprove(type: string = "") { +
diff --git a/src/modules/08_KPI/components/Tab/01_Assessment.vue b/src/modules/08_KPI/components/Tab/01_Assessment.vue index fea2f61..9ee4872 100644 --- a/src/modules/08_KPI/components/Tab/01_Assessment.vue +++ b/src/modules/08_KPI/components/Tab/01_Assessment.vue @@ -37,6 +37,10 @@ const store = useKpiDataStore(); const evaluationId = ref(route.params.id.toString()); +const isLoad01 = ref(false); +const isLoad02 = ref(false); +const isLoad03 = ref(false); + const rows_01 = ref(); const rows_02 = ref(); const rows_03 = ref(); @@ -53,6 +57,7 @@ const resultRole = ref(0); const resultAssigned = ref(0); function fetchListPlanned() { + isLoad01.value = true; http .get(config.API.kpiAchievement("planned") + `?id=${evaluationId.value}`) .then((res) => { @@ -62,6 +67,7 @@ function fetchListPlanned() { evaluationResults: (e.point / 5) * e.weight, })); rows_01.value = newRow; + isLoad01.value = false; if (newRow.length > 0) { resultPlanned.value = newRow.reduce( @@ -89,6 +95,7 @@ function fetchListPlanned() { } function fetchListRole() { + isLoad02.value = true; http .get(config.API.kpiAchievement("role") + `?id=${evaluationId.value}`) .then((res) => { @@ -98,7 +105,7 @@ function fetchListRole() { evaluationResults: (e.point / 5) * e.weight, })); rows_02.value = newRow; - + isLoad02.value = false; if (newRow.length > 0) { resultRole.value = newRow.reduce( (sum: number, e: any) => sum + e.evaluationResults, @@ -119,6 +126,7 @@ function fetchListRole() { } function fetchAssigned() { + isLoad03.value = true; http .get(config.API.kpiAchievement("special") + `?id=${evaluationId.value}`) .then((res) => { @@ -129,7 +137,7 @@ function fetchAssigned() { })); rows_03.value = newRow; - + isLoad03.value = false; if (newRow.length > 0) { resultAssigned.value = newRow.reduce( (sum: number, e: any) => sum + e.evaluationResults, @@ -345,6 +353,7 @@ onMounted(() => {
{ { คะแนน)
- {{ - ( - store.excusiveIndicator1ScoreVal + - store.excusiveIndicator2ScoreVal - ).toFixed(2) - }} +
+ {{ + ( + store.excusiveIndicator1ScoreVal + + store.excusiveIndicator2ScoreVal + ).toFixed(2) + }} +
+ +
@@ -452,6 +466,7 @@ onMounted(() => {
{ /> { /> { คะแนน)
- {{ store.indicatorScoreVal.toFixed(2) }} +
+ {{ store.indicatorScoreVal.toFixed(2) }} +
+
diff --git a/src/modules/08_KPI/components/Tab/04_Result.vue b/src/modules/08_KPI/components/Tab/04_Result.vue index f31f989..8af30b0 100644 --- a/src/modules/08_KPI/components/Tab/04_Result.vue +++ b/src/modules/08_KPI/components/Tab/04_Result.vue @@ -192,7 +192,9 @@ function userOpen() { }); } +const isLoad = ref(false); function getData() { + isLoad.value = true; http .get(config.API.kpiSendToGet(id.value)) .then((res) => { @@ -220,9 +222,11 @@ function getData() { sumWeight.value = data.weightPoint1 + data.weightPoint2; sumResult.value = data.summaryPoint; result.value = data.evaluationResults; + isLoad.value = false; }) .catch((e) => { messageError($q, e); + isLoad.value = false; }) .finally(() => {}); } @@ -306,22 +310,47 @@ onMounted(() => { องค์ประกอบที่ 1 ผลสัมฤทธิ์ของงาน - {{ weight1 }} - {{ result1 }} + +
+ {{ weight1 }} +
+ + + +
{{ result1 }}
+ + + องค์ประกอบที่ 2 พฤติกรรมการปฎิบัติราชการ (สมรรถนะ) - {{ weight2 }} - {{ result2 }} + +
{{ weight2 }}
+ + + + +
{{ result2 }}
+ + + รวม - {{ sumWeight }} - {{ sumResult }} + +
{{ sumWeight }}
+ + + + +
{{ sumResult }}
+ + + @@ -332,7 +361,7 @@ onMounted(() => {
-
+
{ label="ต้องปรับปรุง (คะแนนต่ำกว่าร้อยละ 60.00)" />
+ + + + + +
@@ -378,6 +413,7 @@ onMounted(() => {
{ " :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อเรื่อง/เนื้อหา/หัวข้อการพัฒนา'}`,]" /> +
{ " :rules="[(val:string) => !!val || `${'กรุณากรอกวิธีการพัฒนา'}`,]" /> +
{ " :rules="[(val:string) => !!val || `${'กรุณากรอกช่วงเวลาการพัฒนา'}`,]" /> +
@@ -428,6 +469,7 @@ onMounted(() => {
{ " :rules="[(val:string) => !!val || `${'กรุณากรอกความเห็นของ'}`,]" /> +
@@ -519,6 +562,7 @@ onMounted(() => {
{ ref="superiorCommentRef" :rules="[(val:string) => superiorCommentCheck !== 'false'||!!val || `${'กรุณากรอกความเห็น'}`,]" /> +
@@ -621,6 +666,7 @@ onMounted(() => {
{ " :rules="[(val:string) => additionalSuperiorCheck !== 'false'||!!val || `${'กรุณากรอกความเห็น'}`,]" /> +
diff --git a/src/modules/08_KPI/components/Tab/05_File.vue b/src/modules/08_KPI/components/Tab/05_File.vue index 5235182..8b5f6bb 100644 --- a/src/modules/08_KPI/components/Tab/05_File.vue +++ b/src/modules/08_KPI/components/Tab/05_File.vue @@ -32,18 +32,20 @@ const isReadonly = ref( const documentFile = ref(null); const fileList = ref([]); +const isLoad = ref(false); async function getData() { - showLoader(); + isLoad.value = true; await http .get(config.API.file("ไฟล์เอกสาร", "KPI", id.value)) .then((res) => { fileList.value = res.data; + isLoad.value = false; }) .catch((e) => { messageError($q, e); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } @@ -190,7 +192,11 @@ onMounted(() => { -
+
+ + +
+
(""); const listCheckID = ref(null); const listTarget = ref([]); +const isLoad = ref(false); +const isLoadList = ref(false); const formFilter = reactive({ isAll: false, keyword: "", @@ -91,20 +93,20 @@ function fetchListPlan() { : store.dataProfile.nodeDnaId; formFilter.node = formFilter.isAll ? 0 : store.dataProfile.node; formFilter.year = formFilter?.year ? formFilter.year.toString() : ""; - - showLoader(); + isLoadList.value = true; http .post(config.API.kpiPlan + `/search`, formFilter) .then((res) => { listTarget.value = res.data.result.data; maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize); totalList.value = res.data.result.total; + isLoadList.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoadList.value = false; }); } @@ -113,7 +115,7 @@ function fetchListPlan() { * @param id id */ function fetchListPlanByid(id: string) { - showLoader(); + isLoad.value = true; http .get(config.API.kpiAchievement("planned") + `/${id}`) .then((res) => { @@ -138,12 +140,13 @@ function fetchListPlanByid(id: string) { formDetail.endDate = data.endDate; listCheckID.value = data.kpiPlanId; + isLoad.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } @@ -154,24 +157,25 @@ function fetchListRole() { formFilter.node = formFilter.isAll ? 0 : store.dataProfile.node; formFilter.year = formFilter?.year ? formFilter.year.toString() : ""; formFilter.position = store.dataProfile.position; - + isLoadList.value = true; http .post(config.API.kpiRole + `/search`, formFilter) .then((res) => { listTarget.value = res.data.result.data; maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize); totalList.value = res.data.result.total; + isLoadList.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoadList.value = false; }); } function fetchRoleByid(id: string) { - showLoader(); + isLoad.value = true; http .get(config.API.kpiAchievement("role") + `/${id}`) .then((res) => { @@ -193,12 +197,13 @@ function fetchRoleByid(id: string) { formDetail.includingName = data.includingName; formDetail.including = data.including; listCheckID.value = data.kpiRoleId; + isLoad.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } @@ -212,25 +217,25 @@ function fetchListSpecial() { pageSize: formFilter.pageSize, page: formFilter.page, }; - - showLoader(); + isLoadList.value = true; http .post(config.API.kpiSpecial + `/search`, body) .then((res) => { listTarget.value = res.data.result.data; maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize); totalList.value = res.data.result.total; + isLoadList.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoadList.value = false; }); } function fetchspecialByid(id: string) { - showLoader(); + isLoad.value = true; http .get(config.API.kpiAchievement("special") + `/${id}`) .then((res) => { @@ -252,18 +257,19 @@ function fetchspecialByid(id: string) { formDetail.endDate = data.endDate; listCheckID.value = data.kpiSpecialId; + isLoad.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } function clickList(id: string, isData: boolean = false) { if (!checkDetail.value) { - showLoader(); + isLoad.value=true const url = numpage.value === 1 ? config.API.kpiPlan @@ -301,12 +307,13 @@ function clickList(id: string, isData: boolean = false) { formDetail.strategyId = data.strategyId; formDetail.strategyName = data.strategyName; formDetail.documentInfoEvidence = data.documentInfoEvidence; + isLoad.value=false }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoad.value=false }); } } @@ -595,7 +602,7 @@ const title = computed(() => { - + { + + + + +
+
+ +
+
+ +
+
+ + + +
{
หน่วยงาน/ส่วนราชการ
-
{{ formDetail.nodeName }}
+
+ {{ formDetail.nodeName }} +
+
+ +
ยุทธศาสตร์ / แผน
-
{{ formDetail.strategyName }}
+
+ {{ formDetail.strategyName }} +
+
+ +
ลำดับ/รหัสตัวชี้วัด
+ {
ชื่อตัวชี้วัด
+ {
ค่าเป้าหมาย
{ hide-bottom-space lazy-rules /> +
หน่วยนับ
{ hide-bottom-space reverse-fill-mask /> +
น้ำหนัก (ร้อยละ)
{ lazy-rules mask="###" /> +
@@ -784,6 +836,7 @@ const title = computed(() => {
5
{ class="inputgreen" lazy-rules /> +
@@ -800,6 +854,7 @@ const title = computed(() => {
4
{ class="inputgreen" lazy-rules /> +
@@ -816,6 +872,7 @@ const title = computed(() => {
3
{ class="inputgreen" lazy-rules /> +
@@ -832,6 +890,7 @@ const title = computed(() => {
2
{ class="inputgreen" lazy-rules /> +
@@ -848,6 +908,7 @@ const title = computed(() => {
1
{ class="inputgreen" lazy-rules /> +
{ class="inputgreen" lazy-rules /> +
{ class="inputgreen" lazy-rules /> +
{ class="inputgreen" lazy-rules /> +
{ +
{ +
diff --git a/src/modules/08_KPI/components/Tab/Dialog/04_FormCompetency.vue b/src/modules/08_KPI/components/Tab/Dialog/04_FormCompetency.vue index 4a5d936..e09f04b 100644 --- a/src/modules/08_KPI/components/Tab/Dialog/04_FormCompetency.vue +++ b/src/modules/08_KPI/components/Tab/Dialog/04_FormCompetency.vue @@ -13,6 +13,8 @@ import type { ListCapacity } from "@/modules/08_KPI/interface/request/index"; import DialogHeader from "@/components/DialogHeader.vue"; +import SkeletonTable from '@/components/SkeletonTable.vue' + const dataListCapacityDetails = ref([]); const route = useRoute(); const idParam = ref(route.params.id as string); @@ -195,9 +197,10 @@ function onSubmit() { } } +const isLoadCapacity = ref(false); /** ดึงข้อมูล สมรรถนะ */ function getData() { - showLoader(); + isLoadCapacity.value = true; http .get(config.API.KpiCapacity + `?type=${type.value}&pageSize=100`) .then((res) => { @@ -213,7 +216,7 @@ function getData() { } }) .finally(() => { - hideLoader(); + isLoadCapacity.value = false; }); } @@ -228,7 +231,9 @@ function filterTxt(val: any) { } /** ดึงข้อมูลตามไอดี */ +const isLoadById = ref(false); function getDataById() { + isLoadById.value = true; http .get(config.API.kpiUserCapacity + `/${idProps.value}`) .then((res) => { @@ -252,6 +257,7 @@ function getDataById() { formDetail.definition = target.description; dataListCapacityDetails.value = dataListCriteria; + isLoadById.value = false; }) .catch((e) => {}) .finally(() => {}); @@ -262,8 +268,10 @@ watch( () => { if (modal.value) { type.value = competencyType.value; + getData(); if (idProps.value) { + isLoadById.value = true; setTimeout(() => { getDataById(); }, 500); @@ -407,18 +415,32 @@ watch( }}
- {{ - formDetail[field] - ? store.convertCompetencyType(formDetail[field]) - : "-" - }} - - {{ - formDetail[field] ? formDetail[field] : "-" - }} + +
+ {{ + formDetail[field] + ? store.convertCompetencyType( + formDetail[field] + ) + : "-" + }} +
+ + + + +
+ + + +
+ {{ formDetail[field] ? formDetail[field] : "-" }} +
+
@@ -426,6 +448,7 @@ watch(
น้ำหนัก (ร้อยละ)
+
ระดับที่คาดหวัง
+
+
diff --git a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue index c311882..e72c5d8 100644 --- a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue +++ b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue @@ -60,7 +60,9 @@ let count = ref(0); * @param index id หัวข้อ * @param data ข้อมูล */ +const isLoadDetail = ref(false); function clickList(index: string, data: any) { + isLoadDetail.value = true; listCheck.value = index as string; formDataView.id = data.id; @@ -76,13 +78,13 @@ function clickList(index: string, data: any) { reasonCommanderHigh.value = data.reasonCommanderHigh ?? ""; if (count.value >= 1) { - reasonEvaluatorRef.value.reset(); - reasonCommanderRef.value.reset(); - reasonCommanderHighRef.value.reset(); + reasonEvaluatorRef.value && reasonEvaluatorRef.value.reset(); + reasonCommanderRef.value && reasonCommanderRef.value.reset(); + reasonCommanderHighRef.value && reasonCommanderHighRef.value.reset(); } - showLoader(); + count.value++; setTimeout(() => { - hideLoader(); + isLoadDetail.value = false; }, 100); } @@ -157,8 +159,9 @@ function closeAdd() { getList(); } +const isLoad = ref(false); function getList() { - showLoader(); + isLoad.value = true; http .get( config.API.kpiCommentP( @@ -171,13 +174,13 @@ function getList() { .then((res) => { const data = res.data.result; listTarget.value = data; + isLoad.value = false; }) .catch((e) => { messageError($q, e); + isLoad.value = false; }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); } /** @@ -288,7 +291,19 @@ watch( -
+ + + +
+
+ +
+
+ + + + +
หัวข้อปัญหา
-
{{ formDataView.topic }}
+
+
+ {{ formDataView.topic }} +
+ +
รายละเอียดปัญหา
-
{{ formDataView.reason }}
+
+
+ {{ formDataView.reason }} +
+ +
@@ -375,6 +400,7 @@ watch(
!!val || `${'กรุณากรอกความคิดเห็นของผู้ประเมิน'}`,]" > +
+
+
({ }); let count = ref(0); +const isLoadDetail = ref(false); function clickList(index: string, data: any) { + isLoadDetail.value = true; + listCheck.value = index as string; formDataView.id = data.id; @@ -80,14 +83,13 @@ function clickList(index: string, data: any) { reasonCommanderHigh.value = data.reasonCommanderHigh ?? ""; if (count.value >= 1) { - reasonEvaluatorRef.value.reset(); - reasonCommanderRef.value.reset(); - reasonCommanderHighRef.value.reset(); + reasonEvaluatorRef.value && reasonEvaluatorRef.value.reset(); + reasonCommanderRef.value && reasonCommanderRef.value.reset(); + reasonCommanderHighRef.value && reasonCommanderHighRef.value.reset(); } count.value++; - showLoader(); setTimeout(() => { - hideLoader(); + isLoadDetail.value = false; }, 100); } @@ -147,8 +149,9 @@ function closeAdd() { numLevel.value = ""; } +const isLoad = ref(false); function getList() { - showLoader(); + isLoad.value = true; http .get( config.API.kpiCommentP( @@ -161,13 +164,13 @@ function getList() { .then((res) => { const data = res.data.result; listTarget.value = data; + isLoad.value = false; }) .catch((e) => { messageError($q, e); + isLoad.value = false; }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); } function onSubmitComment(role: string) { @@ -313,7 +316,21 @@ watch( -
+ + + +
+
+ +
+
+ + + +
-
{{ formDataView.topic }}
+
+
+ {{ formDataView.topic }} +
+ +
@@ -383,18 +405,29 @@ watch( : "รายละเอียดความก้าวหน้า" }}
-
{{ formDataView.reason }}
+
+
{{ formDataView.reason }}
+ +
คะแนน
-
{{ formDataView.score }}
+
+
{{ formDataView.score }}
+ +
ผู้สร้าง
-
{{ formDataView.createdFullName }}
+
+
+ {{ formDataView.createdFullName }} +
+ +
!!val || `${'กรุณากรอกความคิดเห็นของผู้ประเมิน'}`,]" > +
+
+
(route.params.id.toLocaleString()); +const isLoadMain = defineModel('isLoadMain',{required:true}) +const isLoad = ref(false); const development = ref([]); //ตัวแปรเก็บ ตัวเลือกการพัฒนา const reasonDevelopment70 = ref(""); //อื่นๆ การลงมือปฏิบัติ (โดยผู้บังคับบัญชามอบหมาย) const reasonDevelopment20 = ref(""); //อื่นๆ การเรียนรู้จากผู้อื่น (Coach/Mentor/Consulting) @@ -220,11 +222,11 @@ function onSubmit() { selectTypeYear: formData.year ? formData.year.toString() : null, selectTypeId: projectName.value ? projectName.value.id : null, }; - showLoader(); + isLoadMain.value = true http[id.value ? "put" : "post"](url, body) .then((res) => { - success($q, "บันทึกข้อมูลสำเร็จ"); close(); + success($q, "บันทึกข้อมูลสำเร็จ"); }) .catch((e) => { messageError($q, e); @@ -305,7 +307,7 @@ watch( () => id.value, (i) => { if (i) { - showLoader(); + isLoad.value = true; http .get(config.API.kpiAchievementDevelop + `/${id.value}`) .then(async (res) => { @@ -342,13 +344,14 @@ watch( ) ? data.reasonDevelopment10 : ""; + isLoad.value = false; }, 500); }) .catch((e) => { messageError($q, e); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } } @@ -367,6 +370,7 @@ watch(
+
+
+
+
วิธีการพัฒนา @@ -469,6 +480,7 @@ watch( >70 การลงมือปฏิบัติ (โดยผู้บังคับบัญชามอบหมาย) + + + + + + +
+
@@ -496,6 +522,7 @@ watch( >20 การเรียนรู้จากผู้อื่น (Coach/Mentor/Consulting) + + + + +
+
@@ -521,6 +560,7 @@ watch(
10 การฝึกอบรมอื่นๆ + + + + +
+
@@ -546,6 +598,7 @@ watch(
+
@@ -573,6 +627,7 @@ watch(
+
@@ -591,6 +647,7 @@ watch(
+
@@ -609,6 +667,7 @@ watch(
+
diff --git a/src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue b/src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue index 1ba8e29..93e38fd 100644 --- a/src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue +++ b/src/modules/08_KPI/components/Tab/Dialog/DialogGovernment.vue @@ -10,6 +10,8 @@ import { useCounterMixin } from "@/stores/mixin"; import DialogHeader from "@/components/DialogHeader.vue"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const $q = useQuasar(); const store = useKpiDataStore(); const mixin = useCounterMixin(); @@ -27,6 +29,8 @@ const modal = defineModel("modal", { required: true }); const filterKeyword = ref(""); const rows = ref([]); +const isLoad = ref(false); + const visibleColumns = ref([ "commandName", "agency", @@ -164,18 +168,19 @@ function close() { /** ดึงข้อมูล */ function getData() { - showLoader(); + isLoad.value = true; http .get(config.API.orgAssistance(store.dataEvaluation.profileId)) .then((res) => { const data = res.data.result; rows.value = data; + isLoad.value = false; }) .catch((e) => { messageError($q, e); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } @@ -197,6 +202,7 @@ watch(
+
diff --git a/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue b/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue index 74742e4..f78de2c 100644 --- a/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue +++ b/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue @@ -15,6 +15,8 @@ import DialogViewInfo from "@/modules/08_KPI/components/Tab/Dialog/DialogViewInf import DialogProgress from "@/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue"; import DialogProblem from "@/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const $q = useQuasar(); const store = useKpiDataStore(); const { dialogRemove, showLoader, hideLoader, messageError, success } = @@ -25,6 +27,7 @@ const title = defineModel("title", { required: true }); const rows = defineModel("data", { required: true }); const numpage = defineModel("page", { required: true }); +const isLoad = defineModel('isLoad',{required:true}) const props = defineProps({ fetchList: { type: Function, required: true }, }); @@ -136,7 +139,7 @@ async function onEvaluate() { function onDelete(id: string) { dialogRemove($q, async () => { try { - showLoader(); + isLoad.value = true const url = numpage.value === 1 ? config.API.kpiAchievement("planned") + `/${id}` @@ -151,7 +154,6 @@ function onDelete(id: string) { } catch (err) { messageError($q, err); } finally { - hideLoader(); } }); } @@ -241,7 +243,9 @@ const isEditStep3 = computed(() => { + {
+ diff --git a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue index 15cbbe1..f16af00 100644 --- a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue +++ b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue @@ -22,6 +22,8 @@ import DialogEvaluate from "@/modules/08_KPI/components/Tab/DialogEvaluate/02_Co import DialogListCriteria from "@/modules/08_KPI/components/Tab/Dialog/DialogListCriteria.vue"; import DialogCompetncyByRow from "@/modules/08_KPI/components/Tab/Dialog/DialogCompetncyByRow.vue"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const modalLevel = ref(false); const modalCompetncyByRow = ref(false); const dataCompetncyByRow = ref([]); @@ -123,6 +125,7 @@ const visibleColumns = ref( const typeCompetency = ref(""); const rows = ref([]); +const isLoad = ref([]); const lists = ref([]); const modalProgress = ref(false); const modalProblem = ref(false); @@ -161,9 +164,11 @@ function getData(type: string) { .get(config.API.kpiUserCapacity + `?id=${id.value}&type=${type}`) .then(async (res) => { const data = res.data.result.data; + isLoad.value[type] = data ? true : false; rows.value[type] = data; lists.value = await lists.value.filter((x: any) => x.type != type); lists.value.push({ type: type, data }); + isLoad.value[type] = false; }) .catch((e) => { messageError($q, e); @@ -232,7 +237,7 @@ function onEdit(data: FormCapacityList, type: string) { */ function onDelete(id: string, type: string) { dialogRemove($q, () => { - showLoader(); + isLoad.value[type] = true; http .delete(config.API.kpiUserCapacity + `/${id}`) .then((res) => { @@ -293,7 +298,12 @@ function onLevel(num: number, list: any) { } watch( - () => [store.dataEvaluation.posTypeName, store.dataEvaluation.posExecutiveName, store.dataEvaluation.position, store.dataEvaluation.posLevelName], // ตรวจจับค่า posTypeName และ posExecutiveName + () => [ + store.dataEvaluation.posTypeName, + store.dataEvaluation.posExecutiveName, + store.dataEvaluation.position, + store.dataEvaluation.posLevelName, + ], // ตรวจจับค่า posTypeName และ posExecutiveName (newValue) => { if (!newValue) return; // ถ้ายังไม่มีค่า ไม่ต้องทำอะไร const posTypeName = newValue[0]; @@ -326,26 +336,25 @@ watch( competencyType.value = position === "ผู้ตรวจราชการกรุงเทพมหานคร" || position === "ผู้ตรวจราชการ" - ? competencyTypeList.filter( - (x: DataOptions) => x.id === "HEAD" || x.id === "INSPECTOR" - ) - : posExecutiveName === "ผู้อำนวยการเขต" - ? competencyTypeList.filter( - (x: DataOptions) => x.id === "HEAD" || x.id === "DIRECTOR" - ) - : posTypeName === "อำนวยการ" || - posTypeName === "บริหาร" || - (posTypeName === "ทั่วไป" && - posLevelName === "อาวุโส" && - posExecutiveName != null) || - (posTypeName === "วิชาการ" && - posExecutiveName != null) - ? competencyTypeList.filter( - (x: DataOptions) => x.id === "HEAD" || x.id === "EXECUTIVE" - ) - : competencyTypeList.filter( - (x: DataOptions) => x.id === "HEAD" || x.id === "GROUP" - ); + ? competencyTypeList.filter( + (x: DataOptions) => x.id === "HEAD" || x.id === "INSPECTOR" + ) + : posExecutiveName === "ผู้อำนวยการเขต" + ? competencyTypeList.filter( + (x: DataOptions) => x.id === "HEAD" || x.id === "DIRECTOR" + ) + : posTypeName === "อำนวยการ" || + posTypeName === "บริหาร" || + (posTypeName === "ทั่วไป" && + posLevelName === "อาวุโส" && + posExecutiveName != null) || + (posTypeName === "วิชาการ" && posExecutiveName != null) + ? competencyTypeList.filter( + (x: DataOptions) => x.id === "HEAD" || x.id === "EXECUTIVE" + ) + : competencyTypeList.filter( + (x: DataOptions) => x.id === "HEAD" || x.id === "GROUP" + ); for (let index = 0; index < competencyType.value.length; index++) { const element = competencyType.value[index]; @@ -393,6 +402,7 @@ watch( +
diff --git a/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue b/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue index b8b9e6b..42332cd 100644 --- a/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue +++ b/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue @@ -13,6 +13,8 @@ import DialogEvalutionDevelop from "@/modules/08_KPI/components/Tab/DialogEvalua import DialogProgress from "@/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue"; import DialogProblem from "@/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const store = useKpiDataStore(); const route = useRoute(); const evaluationId = ref(route.params.id.toString()); @@ -38,15 +40,16 @@ const isUpdate = defineModel("isUpdate", { default: false, }); +const isLoad = ref(false); const modalProgress = ref(false); const modalProblem = ref(false); const type = ref(""); const idList = ref(""); const isEditStep1 = computed(() => { return ( - (store.dataEvaluation.evaluationStatus === "NEW" && - store.rolePerson === "USER" && - store.tabMain === "1") + store.dataEvaluation.evaluationStatus === "NEW" && + store.rolePerson === "USER" && + store.tabMain === "1" ); }); @@ -148,6 +151,7 @@ function onEdit(id: string) { /** ดึงข้อมูลพัฒนา */ function getDevelop() { + isLoad.value = true; http .get(config.API.kpiAchievementDevelop + `?id=${evaluationId.value}`) .then((res) => { @@ -159,6 +163,7 @@ function getDevelop() { 0 ); + isLoad.value = false; store.devScoreVal = data.length !== 0 ? totalSummary / rows.value.length : 0; }); @@ -173,7 +178,7 @@ function onEvaluate() { */ function onDelete(id: string) { dialogRemove($q, () => { - showLoader(); + isLoad.value = true; http .delete(config.API.kpiAchievementDevelop + `/${id}`) .then((res) => { @@ -182,10 +187,9 @@ function onDelete(id: string) { }) .catch((e) => { messageError($q, e); + isLoad.value = false; }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); }); } @@ -244,6 +248,7 @@ onMounted(() => { { dense @click="openPopupProgress(props.row.id)" > - {{store.tabMain == '3' ? `บันทึกเหตุการณ์/พฤติกรรม/เหตุผล` :'บันทึกเหตุการณ์/พฤติกรรม'}} + {{ + store.tabMain == "3" + ? `บันทึกเหตุการณ์/พฤติกรรม/เหตุผล` + : "บันทึกเหตุการณ์/พฤติกรรม" + }}
@@ -498,6 +507,8 @@ onMounted(() => {
+ + @@ -505,6 +516,7 @@ onMounted(() => { v-model:modal="modalDevelop" v-model:id="idEditDevelop" :get-all="getDevelop" + v-model:isLoadMain="isLoad" /> (null); // ตัวแปรเก็บ id ผ const imgProfile = ref(""); // ตัวแปรเก็บรูปโปรไฟล์ +/** ตัวแปรโหลด */ +const isLoad = ref(false); +const isLoadCommander = ref(false); +const isLoadAvatar = ref(false); // เช็คโหลดรูปโปร์ไฟล์ + const formProfile = reactive({ fullName: "", position: "", @@ -95,7 +100,10 @@ async function fetchEvaluation() { } async function getAvatar(id: string) { + isLoadAvatar.value = true; + await http + .get(config.API.orgCheckAvatar(id)) .then(async (res) => { const data = await res.data.result; @@ -105,6 +113,7 @@ async function getAvatar(id: string) { }) .catch((e) => { messageError($q, e); + isLoadAvatar.value = false; }); } @@ -115,6 +124,7 @@ async function fetchProfile(id: string, avatarName: string) { .then(async (res) => { store.dataEvaluation.avartar = res.data.downloadUrl; imgProfile.value = res.data.downloadUrl; + isLoadAvatar.value = false; }); } @@ -162,6 +172,7 @@ function onSubmit() { /** ดึงข้อมูล ผู้ประเมิน */ async function getOrgOp() { + isLoadCommander.value = true; http .get(config.API.Kpiorg) .then((res) => { @@ -199,9 +210,11 @@ async function getOrgOp() { .find( (i: EvaOptionType) => i.id == store.dataEvaluation.commanderHighId ); + isLoadCommander.value = false; }) .catch((e) => { messageError($q, e); + isLoadCommander.value = false; }) .finally(() => {}); } @@ -453,8 +466,9 @@ const evaluator = ref({ * ข้อมูลของผู้ประเมิน * @param id ข้อมูลของผู้ประเมิน */ +const isLoadModal = ref(false); async function fetchProfileEvaluator(id: string) { - showLoader(); + isLoadModal.value = true; http .get(config.API.orgPosition + `/${id}`) .then(async (res) => { @@ -467,12 +481,13 @@ async function fetchProfileEvaluator(id: string) { evaluator.value.isPosmasterAct = data.isPosmasterAct; evaluator.value.posmasterAct = data.posmasterAct; evaluator.value.org = await findOrgNameHtml(data); + isLoadModal.value = false; }) .catch((e) => { messageError($q, e); }) .finally(() => { - hideLoader(); + isLoadModal.value = false; }); } @@ -654,7 +669,6 @@ function onResize(size: { width: any; height: any }) { } onMounted(async () => { - showLoader(); store.isUpdate = false; await getAll(); }); @@ -689,7 +703,8 @@ onMounted(async () => {
- + +
@@ -699,7 +714,8 @@ onMounted(async () => { style="left: 2%; top: 50%; transform: translateY(-50%)" > - + +
@@ -1028,7 +1044,7 @@ onMounted(async () => { /> -
+
{
+
+
+ +
+
+ +
+
{
ตำแหน่งทางการบริหาร
สังกัด
-
+
- {{ evaluator.position ? evaluator.position : "-" }} +
+ {{ evaluator.position ? evaluator.position : "-" }} +
+ +
- {{ evaluator.posTypeName ? evaluator.posTypeName : "-" }} - {{ - evaluator.posLevelName ? ` (${evaluator.posLevelName})` : "-" - }} +
+ {{ evaluator.posTypeName ? evaluator.posTypeName : "-" }} + {{ + evaluator.posLevelName + ? ` (${evaluator.posLevelName})` + : "-" + }} +
+ +
- {{ - evaluator.posExecutiveName ? evaluator.posExecutiveName : "-" - }} +
+ {{ + evaluator.posExecutiveName + ? evaluator.posExecutiveName + : "-" + }} +
+ +
- {{ evaluator.org ? evaluator.org : "-" }} +
+ {{ evaluator.org ? evaluator.org : "-" }} +
+
@@ -1243,9 +1290,12 @@ onMounted(async () => {
รักษาการในตำแหน่ง/การรักษาราชการแทน
+
+ +
diff --git a/src/modules/08_KPI/views/main.vue b/src/modules/08_KPI/views/main.vue index 6a62d27..7bc5087 100644 --- a/src/modules/08_KPI/views/main.vue +++ b/src/modules/08_KPI/views/main.vue @@ -21,6 +21,7 @@ import type { } from "@/modules/08_KPI/interface/response/index"; import DialogHeader from "@/components/DialogHeader.vue"; +import SkeletonTable from "@/components/SkeletonTable.vue"; const $q = useQuasar(); const mixin = useCounterMixin(); @@ -30,6 +31,8 @@ const { showLoader, hideLoader, messageError, date2Thai, dialogConfirm } = mixin; /** Table*/ +const isLoadOp = ref(false); +const isLoad = ref(false); const rows = ref([]); const visibleColumns = ref([ "createdAt", @@ -161,7 +164,7 @@ const pagination = ref({ */ async function fetchRoundOption(type: string) { const y = type === "main" ? year.value : yearDialog.value; - showLoader(); + isLoadOp.value = true; await http .get( config.API.kpiPeriod + `?page=${1}&pageSize=${10}&keyword=${""}&year=${y}` @@ -196,7 +199,7 @@ async function fetchRoundOption(type: string) { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoadOp.value = false; }); } @@ -204,7 +207,7 @@ async function fetchRoundOption(type: string) { * fetch รายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล */ async function fetchList() { - showLoader(); + isLoad.value = true let queryParams = { page: formQuery.page, pageSize: formQuery.pageSize, @@ -222,13 +225,13 @@ async function fetchList() { total.value = data.total; totalList.value = Math.ceil(data.total / formQuery.pageSize); rows.value = data.data; + isLoad.value = false }) .catch((err) => { + isLoad.value = false messageError($q, err); }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); } /** เลือกรอบการประเมิน */ @@ -520,6 +523,7 @@ onMounted(async () => {
{ map-options @update:model-value="changRound" /> +
@@ -607,6 +612,7 @@ onMounted(async () => {
{ > +
diff --git a/src/modules/08_KPI/views/mainEvaluator.vue b/src/modules/08_KPI/views/mainEvaluator.vue index f74d535..81f91c0 100644 --- a/src/modules/08_KPI/views/mainEvaluator.vue +++ b/src/modules/08_KPI/views/mainEvaluator.vue @@ -93,8 +93,9 @@ const maxPage = ref(1); * ดึงข้อมูลรายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล * @param type */ +const isLoadOp = ref(false); async function fetchRoundOption() { - showLoader(); + isLoadOp.value = true; await http .get( config.API.kpiPeriod + @@ -120,18 +121,19 @@ async function fetchRoundOption() { store.formQuery.round = roundOp.value[0].id; await fetchList(); } + isLoadOp.value = false; }) .catch((err) => { messageError($q, err); + isLoadOp.value = false; }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); } /** ดึงข้อมูล list */ +const isLoad = ref(false) async function fetchList() { - showLoader(); + isLoad.value = true const body = { page: store.formQuery.page, pageSize: store.formQuery.pageSize, @@ -158,13 +160,13 @@ async function fetchList() { maxPage.value = Math.ceil(data.total / store.formQuery.pageSize); totalList.value = data.total; dataListMain.value = data.data; + isLoad.value = false }) .catch((err) => { messageError($q, err); + isLoad.value = false }) - .finally(() => { - hideLoader(); - }); + .finally(() => {}); } /** เลือกรอบการประเมิน */ @@ -221,7 +223,7 @@ onMounted(async () => {
-
+
{ { map-options @update:model-value="changRound" /> - + { :maxPage="maxPage" :updatePagination="updatePagination" :fetchList="fetchList" + :is-load="isLoad" /> @@ -355,6 +364,7 @@ onMounted(async () => { :maxPage="maxPage" :updatePagination="updatePagination" :fetchList="fetchList" + :is-load="isLoad" /> @@ -368,6 +378,7 @@ onMounted(async () => { :maxPage="maxPage" :updatePagination="updatePagination" :fetchList="fetchList" + :is-load="isLoad" /> @@ -381,6 +392,7 @@ onMounted(async () => { :maxPage="maxPage" :updatePagination="updatePagination" :fetchList="fetchList" + :is-load="isLoad" /> @@ -394,6 +406,7 @@ onMounted(async () => { :maxPage="maxPage" :updatePagination="updatePagination" :fetchList="fetchList" + :is-load="isLoad" /> diff --git a/src/modules/09_scholarship/views/detail.vue b/src/modules/09_scholarship/views/detail.vue index 4e84434..5456ee0 100644 --- a/src/modules/09_scholarship/views/detail.vue +++ b/src/modules/09_scholarship/views/detail.vue @@ -31,6 +31,7 @@ const { success, } = mixin; +const isLoad = ref(false); const isGuarantor = ref(false); const isGov = ref(false); const isStatus = ref(""); @@ -287,96 +288,6 @@ function changeStartDate(type: string) { } } -function onOpenReturn() { - dialogReturn.value = true; -} - -async function onDownload(type: string) { - showLoader(); - await http - .get(config.API.developmentScholarshipReport + `/${id.value}`) - .then(async (res) => { - const dataList = res.data.result; - await genReport( - dataList, - "ฟอร์มรายงานตัวกลับเข้ารับราชการ(ต้นแบบ)", - type - ); - }) - .catch((e) => { - messageError($q, e); - }) - .finally(() => { - hideLoader(); - }); -} - -async function clickUpload(file: any) { - const fileName = { fileName: file.name }; - - dialogConfirm( - $q, - async () => { - const selectedFile = file; - const formdata = new FormData(); - formdata.append("file", selectedFile); - await http - .post( - config.API.developmentSalaryFile( - "ระบบพัฒนาบุคคล", - "ฟอร์มรายงานตัวกลับเข้ารับราชการ", - id.value - ), - { - replace: false, - fileList: fileName, - } - ) - .then(async (res) => { - const foundKey: string | undefined = Object.keys(res.data).find( - (key) => - res.data[key]?.fileName !== undefined && - res.data[key]?.fileName !== "" - ); - foundKey && - uploadFileDoc(res.data[foundKey]?.uploadUrl, documentFile.value); - }) - .catch((err) => { - messageError($q, err); - }); - }, - "ยืนยันการอัปโหลดไฟล์", - "ต้องการยืนยันการอัปโหลดไฟล์นี้หรือไม่ ?" - ); -} - -/** - * ฟังก์ชั่นสำหรับอัปโหลดไฟล์เอกสารหลักฐาน - */ -async function uploadFileDoc(uploadUrl: string, file: any) { - const Data = new FormData(); - Data.append("file", documentFile.value); - showLoader(); - await axios - .put(uploadUrl, file, { - headers: { - "Content-Type": file.type, - }, - }) - .then((res) => { - success($q, "อัปโหลดไฟล์สำเร็จ"); - fetchDataDetail(id.value); - getFile(); - }) - .catch((e) => { - messageError($q, e); - }) - .finally(() => { - hideLoader(); - documentFile.value = null; - }); -} - function getFile() { http .get( @@ -418,11 +329,13 @@ function downloadFile(file: any) { } function fetchDataDetail(id: string) { - showLoader(); + isLoad.value = true; http .get(config.API.developmentScholarship + `/${id}`) .then((res) => { const data: DataSholarship = res.data.result; + isGov.value = data.citizenId ? true : false; + formBody.rank = data.rank; formBody.prefix = data.prefix; formBody.firstName = data.firstName; @@ -508,14 +421,14 @@ function fetchDataDetail(id: string) { : "-"; dataGuarantor.org = data.guarantorOrg ? data.guarantorOrg : "-"; isStatus.value = data.status; - isGov.value = data.citizenId ? true : false; isGuarantor.value = data.guarantorCitizenId ? true : false; + isLoad.value = false; }) .catch((err) => { messageError($q, err); }) .finally(() => { - hideLoader(); + isLoad.value = false; }); } @@ -543,11 +456,11 @@ onMounted(async () => {
- +
-
+
{ ข้อมูลราชการ
-
+
เลขประจำตัวประชาชน
-
+
{{ dataPerson.citizenId ? dataPerson.citizenId : "-" }}
+
+ +
ชื่อ-นามสกุล
-
+
{{ dataPerson.firstName ? dataPerson.name : "-" }}
+
+ +
ตำแหน่งในสายงาน
-
+
{{ dataPerson.position ? dataPerson.position : "-" }}
+
+ +
ตำแหน่งประเภท
-
+
{{ dataPerson.type ? dataPerson.type : "-" }}
+
+ +
ระดับ
-
+
{{ dataPerson.level ? dataPerson.level : "-" }}
+
+ +
ตำแหน่งทางการบริหาร
-
+
{{ dataPerson.positionSide ? dataPerson.positionSide : "-" }}
+
+ +
หน่วยงานที่สังกัด
-
+
{{ dataPerson.org ? dataPerson.org : "-" }}
+
+ +
-
- - เลือกข้าราชการ - -
{ !!val || `${'กรุณาเลือกประเภททุน'}`, ]" /> +
{ " > { !!val || `${'กรุณาเลือกประเภททุน'}`, ]" /> +
-
+
{ class="q-pl-sm" />
+
+
+ + +
+
{ +
{ }, ]" /> +
{ !!val || `${'กรุณากรอกเงินอื่นๆ โปรดระบุ'}`, ]" /> +
{ }, ]" /> +
@@ -806,6 +753,7 @@ onMounted(async () => {
{ !!val || `${'กรุณากรอกเลขที่หนังสืออนุมัติ'}`, ]" /> +
{ +
{ +
{ map-options > +
+
@@ -941,6 +898,7 @@ onMounted(async () => {
{ !!val || `${'กรุณากรอกเลขที่สัญญา'}`, ]" /> +
{ +
{ v-model="formBody.reportBackNo" label="เลขที่หนังสือรายงานตัวกลับ" /> +
{ +
{ +
@@ -1113,6 +1080,7 @@ onMounted(async () => { ]" /> --> { !!val || `${'กรุณากรอกระดับปริญญา'}`, ]" /> +
{ !!val || `${'กรุณากรอกหลักสูตรการศึกษา'}`, ]" /> +
{ !!val || `${'กรุณากรอกสาขาวิชา'}`, ]" /> +
{ !!val || `${'กรุณากรอกคณะ'}`, ]" /> +
{ !!val || `${'กรุณากรอกสถาบันการศึกษา'}`, ]" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.totalPeriod" /> +
{ class="inputgreen" v-model="formBody.studyPlace" /> +
{ class="inputgreen" v-model="formBody.studyTopic" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.studyCountry" /> +
{ class="inputgreen" v-model="formBody.studyAbroadTopic" /> +
{ +
{ +
@@ -1528,6 +1527,7 @@ onMounted(async () => {
{ !!val || `กรุณากรอกหลักสูตรการฝึกอบรม`, ]" /> +
{ !!val || `${'กรุณากรอกสาขา'}`, ]" /> +
{ !!val || `${'กรุณากรอกสถาบันการศึกษา/หน่วยงานผู้จัดการฝึกอบรม'}`, ]" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.totalPeriod" /> +
{ class="inputgreen" v-model="formBody.studyPlace" /> +
{ class="inputgreen" v-model="formBody.studyTopic" /> +
{ +
{ +
@@ -1792,6 +1811,7 @@ onMounted(async () => {
{ !!val || `${'กรุณากรอกหลักสูตรการฝึกอบรม'}`, ]" /> +
{ !!val || `${'กรุณากรอกสาขา'}`, ]" /> +
{ !!val || `${'กรุณากรอกสถาบันการศึกษา/หน่วยงานผู้จัดการฝึกอบรม'}`, ]" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.totalPeriod" /> +
{ class="inputgreen" v-model="formBody.studyPlace" /> +
{ class="inputgreen" v-model="formBody.studyTopic" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.studyCountry" /> +
{ class="inputgreen" v-model="formBody.studyAbroadTopic" /> +
{ +
{ +
@@ -2214,6 +2261,7 @@ onMounted(async () => { ]" /> --> { !!val || `${'กรุณากรอกระดับปริญญา'}`, ]" /> +
{ : 'หลักสูตรการฝึกอบรม'}`, ]" /> +
{ v-if="formBody.scholarshipType !== 'TRAINING'" > { !!val || `${'กรุณากรอกสาขาวิชา'}`, ]" /> +
{ v-if="formBody.scholarshipType !== 'TRAINING'" > { !!val || `${'กรุณากรอกคณะ'}`, ]" /> +
{ !!val || `กรุณากรอก${formBody.scholarshipType === 'STUDY' ? 'สถาบันการศึกษา':'หน่วยงานผู้จัด'}`, ]" /> +
{ +
{ +
{ !!val || `กรุณากรอก${formBody.scholarshipType === 'STUDY' ? 'สถานที่ไปศึกษา (เมือง/ประเทศ)':'สถานที่เข้ารับการฝึกอบรม (เมือง/ประเทศ)'}`, ]" /> +
{ class="col-12 col-md-3" > { !!val || `${'กรุณากรอประเทศที่ไปดูงาน'}`, ]" /> +
{ +
{ +
{ !!val || `${'กรุณากรอกรวมระยะเวลาทั้งสิ้น'}`, ]" /> +
@@ -2581,6 +2652,7 @@ onMounted(async () => {
{ !!val || `${'กรุณากรอกหลักสูตรการฝึกอบรม'}`, ]" /> +
{ !!val || `${'กรุณากรอกสถาบันการศึกษา/หน่วยงานผู้จัดการฝึกอบรม'}`, ]" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.studyPlace" /> +
{ class="inputgreen" v-model="formBody.studyTopic" /> +
{ +
{ +
{ class="inputgreen" v-model="formBody.totalPeriod" /> +
{ class="inputgreen" v-model="formBody.studyCountry" /> +
{ class="inputgreen" v-model="formBody.studyAbroadTopic" /> +
{ +
{ +
{ hide-bottom-space type="textarea" /> +
-
+
ข้อมูลผู้ค้ำประกัน @@ -2962,37 +3064,61 @@ onMounted(async () => {
เลขประจำตัวประชาชน
-
+
{{ dataGuarantor.citizenId }}
+
+ +
ชื่อ-นามสกุล
-
+
{{ dataGuarantor.name }}
+
+ +
ตำแหน่ง
-
+
{{ dataGuarantor.position }}
+
+ +
ตำแหน่งประเภท
-
+
{{ dataGuarantor.type }}
+
+ +
ระดับตำแหน่ง
-
+
{{ dataGuarantor.level }}
+
+ +
ตำแหน่งทางการบริหาร
-
+
{{ dataGuarantor.positionSide }}
+
+ +
หน่วยงานที่สังกัด
-
+
{{ dataGuarantor.org }}
+
+ +
diff --git a/src/modules/09_scholarship/views/main.vue b/src/modules/09_scholarship/views/main.vue index ad8856d..b25beef 100644 --- a/src/modules/09_scholarship/views/main.vue +++ b/src/modules/09_scholarship/views/main.vue @@ -13,6 +13,8 @@ import type { Scholarship, } from "@/modules/09_scholarship/interface/index/Main"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const mixin = useCounterMixin(); const { showLoader, hideLoader, messageError } = mixin; const router = useRouter(); @@ -24,6 +26,7 @@ const currentPage = ref(1); const page = ref(1); const rowsPerPage = ref(10); +const isLoad = ref(false); const rows = ref([]); const year = ref(0); const type = ref("DOMESTICE"); @@ -127,15 +130,16 @@ async function getProfileId() { if (dataStore.profileId) { profilId.value = dataStore.profileId; } else { - showLoader(); + isLoad.value = true; try { const res = await http.get(config.API.profilePosition()); dataStore.profileId = res.data.result.profileId; profilId.value = dataStore.profileId; + isLoad.value = false; } catch (e) { messageError($q, e); } finally { - hideLoader(); + isLoad.value = false; } } @@ -255,6 +259,7 @@ onMounted(async () => {
{
+
diff --git a/src/modules/11_probation/views/mainDetail.vue b/src/modules/11_probation/views/mainDetail.vue index 4efbad1..a663b31 100644 --- a/src/modules/11_probation/views/mainDetail.vue +++ b/src/modules/11_probation/views/mainDetail.vue @@ -14,6 +14,8 @@ import type { ProbationFormType, } from "@/modules/11_probation/interface/index/main"; +import SkeletonTable from "@/components/SkeletonTable.vue"; + const $q = useQuasar(); const mixin = useCounterMixin(); const { @@ -29,6 +31,7 @@ const profileId = ref(""); const rows = ref([]); const rowsData = ref([]); +const isLoad = ref(false); const mode = ref($q.screen.gt.xs); const profileImg = ref(""); const router = useRouter(); @@ -112,7 +115,7 @@ function onResize(size: any) { } function getMain() { - showLoader(); + isLoad.value = true; http .get(config.API.kpiEvaluation + `/${route.params.id.toString()}`) // .get(config.API.profilePosition()) @@ -134,11 +137,11 @@ function getMain() { promises.push(getAvatar(data.profileId)); await Promise.all(promises); - hideLoader(); + isLoad.value = false; }) .catch((e) => { messageError($q, e); - hideLoader(); + isLoad.value = false; }) .finally(() => {}); } @@ -221,22 +224,31 @@ onMounted(async () => {
- {{ - formData.firstName - ? `${formData.prefix}${formData.firstName} ${formData.lastName}` - : "-" - }} + +
+ {{ + formData.firstName + ? `${formData.prefix}${formData.firstName} ${formData.lastName}` + : "-" + }} +
+ +
-
- +
+ +
@@ -247,7 +259,10 @@ onMounted(async () => {
- {{ formData.position ? formData.position : "-" }} +
+ {{ formData.position ? formData.position : "-" }} +
+ {{ @@ -258,16 +273,22 @@ onMounted(async () => {
- {{ - formData.posTypeName - ? formData.posLevelName - ? `${formData.posTypeName}(${formData.posLevelName})` - : formData.posTypeName - : "-" - }} +
+ {{ + formData.posTypeName + ? formData.posLevelName + ? `${formData.posTypeName}(${formData.posLevelName})` + : formData.posTypeName + : "-" + }} +
+
- {{ formData.org ? formData.org : "-" }} +
+ {{ formData.org ? formData.org : "-" }} +
+
@@ -278,21 +299,27 @@ onMounted(async () => {
- {{ - formData.firstName - ? `${formData.prefix}${formData.firstName} ${formData.lastName}` - : "-" - }} + +
+ {{ + formData.firstName + ? `${formData.prefix}${formData.firstName} ${formData.lastName}` + : "-" + }} +
+ +
-
- +
+ +
@@ -302,25 +329,34 @@ onMounted(async () => { ตำแหน่งในสายงาน - {{ - formData.position ? formData.position : "-" - }} + +
+ {{ formData.position ? formData.position : "-" }} +
+ + ระดับ - {{ - formData.posLevelName ? formData.posLevelName : "-" - }} + +
+ {{ formData.posLevelName ? formData.posLevelName : "-" }} +
+ + สังกัด - {{ - formData.org ? formData.org : "-" - }} + +
+ {{ formData.org ? formData.org : "-" }} +
+ + @@ -361,6 +397,7 @@ onMounted(async () => {
{
+