Merge branch 'develop' into devTee
# Conflicts: # src/api/15_development/api.development.ts
This commit is contained in:
STW_TTTY\stwtt
commit
db363a7392
14 changed files with 1199 additions and 524 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue";
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
|
|
@ -9,11 +9,22 @@ import DialogSelectAgency from "@/modules/15_development/components/DialogSelect
|
|||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const $q = useQuasar();
|
||||
const store = useDevelopmentDataStore();
|
||||
const { showLoader, hideLoader, dialogConfirm } = useCounterMixin();
|
||||
const mixin = useCounterMixin();
|
||||
|
||||
const {
|
||||
dialogRemove,
|
||||
dialogConfirm,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
success,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
const route = useRoute();
|
||||
const projectId = ref<string>(route.params.id.toLocaleString());
|
||||
|
||||
|
|
@ -25,6 +36,8 @@ const formData = reactive<FormBasicinfo>({
|
|||
objective: "",
|
||||
});
|
||||
|
||||
const rows = ref<FormBasicinfo[]>([]);
|
||||
|
||||
const modalDialogSelect = ref<boolean>(false);
|
||||
function selectAgency() {
|
||||
modalDialogSelect.value = true;
|
||||
|
|
@ -33,14 +46,56 @@ function updateAgency(name: string) {
|
|||
formData.org = name;
|
||||
}
|
||||
|
||||
async function fetchData(id: string) {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.developmentBasicInfoById(id))
|
||||
.then(async (res) => {
|
||||
const data = res.data.result;
|
||||
formData.year = data.year;
|
||||
formData.reason = data.reason;
|
||||
formData.projectName = data.projectName;
|
||||
formData.objective = data.objective;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
async function editData(id: string) {
|
||||
await http
|
||||
.put(config.API.developmentBasicInfoById(id), {
|
||||
year: formData.year,
|
||||
reason: formData.reason,
|
||||
projectName: formData.projectName,
|
||||
objective: formData.objective,
|
||||
})
|
||||
.then(() => {
|
||||
fetchData(id);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
// post
|
||||
console.log("projectId===>", projectId.value);
|
||||
editData(projectId.value);
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
fetchData(projectId.value);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -49,7 +104,7 @@ function onSubmit() {
|
|||
<div class="col-xs-6 col-sm-2 col-md-2">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="store.formAddProject.year"
|
||||
v-model="formData.year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
|
|
@ -65,7 +120,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
outlined
|
||||
class="inputgreen"
|
||||
:model-value="Number(store.formAddProject.year) + 543"
|
||||
:model-value="Number(formData.year) + 543"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
|
|
@ -93,16 +148,16 @@ function onSubmit() {
|
|||
@click="selectAgency"
|
||||
/>
|
||||
<!-- :rules="[
|
||||
(val:string) =>
|
||||
!!val || `${'กรุณาเลือกหน่วยงานที่รับผิดชอบ'}`,
|
||||
]" -->
|
||||
(val:string) =>
|
||||
!!val || `${'กรุณาเลือกหน่วยงานที่รับผิดชอบ'}`,
|
||||
]" -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
outlined
|
||||
class="inputgreen"
|
||||
dense
|
||||
v-model="store.formAddProject.projectName"
|
||||
v-model="formData.projectName"
|
||||
label="ชื่อโครงการ/กิจกรรม/หลักสูตร"
|
||||
rows="6"
|
||||
type="textarea"
|
||||
|
|
@ -110,7 +165,6 @@ function onSubmit() {
|
|||
:rules="[
|
||||
(val:string) =>
|
||||
!!val || `${'กรุณากรอกชื่อโครงการ/กิจกรรม/หลักสูตร'}`,
|
||||
|
||||
]"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -119,7 +173,7 @@ function onSubmit() {
|
|||
outlined
|
||||
class="inputgreen"
|
||||
dense
|
||||
v-model="store.formAddProject.reason"
|
||||
v-model="formData.reason"
|
||||
label="หลักการและเหตุผล"
|
||||
rows="6"
|
||||
hide-bottom-space
|
||||
|
|
@ -131,7 +185,7 @@ function onSubmit() {
|
|||
outlined
|
||||
class="inputgreen"
|
||||
dense
|
||||
v-model="store.formAddProject.objective"
|
||||
v-model="formData.objective"
|
||||
label="วัตถุประสงค์"
|
||||
rows="6"
|
||||
hide-bottom-space
|
||||
|
|
|
|||
|
|
@ -69,10 +69,8 @@ function updateTicked(val: any) {
|
|||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
emit("update:updateAgency", ticked.value[0]);
|
||||
closeDialog();
|
||||
});
|
||||
emit("update:updateAgency", ticked.value[0]);
|
||||
closeDialog();
|
||||
}
|
||||
|
||||
function splitWords(sentence: string) {
|
||||
|
|
|
|||
|
|
@ -40,185 +40,201 @@ const projectId = ref<string>(route.params.id.toLocaleString());
|
|||
const tab = ref<string>("BasicInfo");
|
||||
|
||||
const status = ref<string>("ONGOING");
|
||||
function fetchDataProject(id: string) {
|
||||
// function fetchDataProject(id: string) {
|
||||
// showLoader();
|
||||
// http
|
||||
// .get(config.API.developmentMainById(id))
|
||||
// .then((res) => {
|
||||
// const data: ResDataProject = res.data.result;
|
||||
// /** ข้อมูลเบื้องต้น*/
|
||||
// status.value = data.status ? data.status : "ONGOING";
|
||||
// store.formAddProject.year = data.year;
|
||||
// store.formAddProject.projectName = data.projectName;
|
||||
// store.formAddProject.reason = data.reason;
|
||||
// store.formAddProject.objective = data.objective;
|
||||
// /**เป้าหมาย*/
|
||||
// const plannedGoals = data.plannedGoals.map((e: any) => ({
|
||||
// groupTarget: e.groupTarget,
|
||||
// groupTargetSub: e.groupTargetSub,
|
||||
// positions: e.plannedGoalPositions.map((v: any) => ({
|
||||
// position: v.position,
|
||||
// posTypePlannedId: v.posTypePlannedId,
|
||||
// posLevelPlannedId: v.posLevelPlannedId,
|
||||
// })),
|
||||
// type: e.type ? e.type : null,
|
||||
// amount: e.amount,
|
||||
// }));
|
||||
// const plannedPeoples = data.plannedPeoples.map((e: ResPeople) => ({
|
||||
// groupTarget: e.groupTarget,
|
||||
// amount: e.amount,
|
||||
// }));
|
||||
// store.formAddProject.plannedGoals = plannedGoals;
|
||||
// store.formAddProject.plannedPeoples = plannedPeoples;
|
||||
|
||||
// const actualGoals = data.actualGoals.map((e: ResActualGoals) => ({
|
||||
// groupTarget: e.groupTarget,
|
||||
// groupTargetSub: e.groupTargetSub,
|
||||
// position: e.position,
|
||||
// posTypeActualId: e.posTypeActualId,
|
||||
// posLevelActualId: e.posLevelActualId,
|
||||
// type: e.type,
|
||||
// amount: e.amount,
|
||||
// }));
|
||||
// const actualPeoples = data.actualPeoples.map((e: ResPeople) => ({
|
||||
// groupTarget: e.groupTarget,
|
||||
// amount: e.amount,
|
||||
// }));
|
||||
// store.formAddProject.actualGoals = actualGoals;
|
||||
// store.formAddProject.actualPeoples = actualPeoples;
|
||||
|
||||
// // ลักษณะโครงการ
|
||||
// store.formAddProject.projectType = data.projectType;
|
||||
// store.formAddProject.projectCharacteristics = data.projectCharacteristics;
|
||||
// store.formAddProject.projectDay = data.projectDay;
|
||||
// store.formAddProject.projectNigth = data.projectNigth;
|
||||
// store.formAddProject.projectTechniques = data.projectTechniques;
|
||||
// store.formAddProject.projectModal = data.projectModal;
|
||||
|
||||
// /** การติดตามผลดารประเมิน*/
|
||||
// store.formAddProject.metricType = data.metricType;
|
||||
// store.formAddProject.indicators = data.indicators;
|
||||
// store.formAddProject.target = data.target;
|
||||
// store.formAddProject.calculation = data.calculation;
|
||||
// store.formAddProject.measuRement = data.measuRement;
|
||||
// store.formAddProject.results = data.results;
|
||||
// store.formAddProject.obstacles = data.obstacles;
|
||||
// store.formAddProject.suggestions = data.suggestions;
|
||||
// store.formAddProject.project = data.project;
|
||||
// store.formAddProject.isPassAllocate = data.isPassAllocate;
|
||||
// store.formAddProject.isPassNoAllocate = data.isPassNoAllocate;
|
||||
// store.formAddProject.isNoPass = data.isNoPass;
|
||||
// store.formAddProject.isBudget = data.isBudget;
|
||||
// store.formAddProject.isOutBudget = data.isOutBudget;
|
||||
|
||||
// /** อื่นๆ*/
|
||||
// store.formAddProject.dateStart = data.dateStart;
|
||||
// store.formAddProject.dateEnd = data.dateEnd;
|
||||
// store.formAddProject.totalDate = data.totalDate;
|
||||
// store.formAddProject.address = data.address;
|
||||
|
||||
// const provinces = data.provinces.map((e: any) => e.id);
|
||||
// const provincesId = [...provinces];
|
||||
// store.formAddProject.provinceIds = provincesId;
|
||||
|
||||
// store.formAddProject.budget = data.budget;
|
||||
// store.formAddProject.accept = data.accept;
|
||||
// store.formAddProject.receive = data.receive;
|
||||
// store.formAddProject.approved = data.approved;
|
||||
// store.formAddProject.budgetPay = data.budgetPay;
|
||||
// store.formAddProject.issues = data.issues;
|
||||
// store.formAddProject.chance = Number(data.chance);
|
||||
// store.formAddProject.effects = Number(data.effects);
|
||||
// store.formAddProject.riskLevel = data.riskLevel;
|
||||
// store.formAddProject.riskManagement = data.riskManagement;
|
||||
// store.formAddProject.expect = data.expect;
|
||||
// store.formAddProject.topicAcademic = data.topicAcademic;
|
||||
// store.formAddProject.addressAcademic = data.addressAcademic;
|
||||
// store.formAddProject.provinceActualId = data.provinceActualId;
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// messageError($q, err);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// setTimeout(() => {
|
||||
// hideLoader();
|
||||
// }, 1000);
|
||||
// });
|
||||
// }
|
||||
|
||||
// function onSubmit() {
|
||||
// if (store.formAddProject.projectName === "" && tab.value !== "BasicInfo") {
|
||||
// dialogMessageNotify($q, "ชื่อโครงการ/กิจกรรม/หลักสูตร");
|
||||
// tab.value = "BasicInfo";
|
||||
// } else {
|
||||
// dialogConfirm($q, async () => {
|
||||
// showLoader();
|
||||
// /** การติดตามผลดารประเมิน*/
|
||||
// if (store.formAddProject.project === "OFFER") {
|
||||
// store.formAddProject.isBudget = false;
|
||||
// store.formAddProject.isOutBudget = false;
|
||||
// } else {
|
||||
// store.formAddProject.isPassAllocate = false;
|
||||
// store.formAddProject.isPassNoAllocate = false;
|
||||
// store.formAddProject.isNoPass = false;
|
||||
// }
|
||||
|
||||
// // ลักษณะโครงการ;
|
||||
// store.formAddProject.projectDay = store.formAddProject.projectDay
|
||||
// ? Number(store.formAddProject.projectDay)
|
||||
// : null;
|
||||
// store.formAddProject.projectNigth = store.formAddProject.projectNigth
|
||||
// ? Number(store.formAddProject.projectNigth)
|
||||
// : null;
|
||||
// store.formAddProject.projectModal = store.formAddProject.projectModal
|
||||
// ? Number(store.formAddProject.projectModal)
|
||||
// : null;
|
||||
|
||||
// /** อื่นๆ*/
|
||||
// store.formAddProject.totalDate = Number(store.formAddProject.totalDate);
|
||||
// store.formAddProject.accept =
|
||||
// typeof store.formAddProject.accept === "string"
|
||||
// ? Number(store.formAddProject.accept.replace(/,/g, ""))
|
||||
// : store.formAddProject.accept;
|
||||
// store.formAddProject.receive =
|
||||
// typeof store.formAddProject.receive === "string"
|
||||
// ? Number(store.formAddProject.receive.replace(/,/g, ""))
|
||||
// : store.formAddProject.receive;
|
||||
// store.formAddProject.approved =
|
||||
// typeof store.formAddProject.approved === "string"
|
||||
// ? Number(store.formAddProject.approved.replace(/,/g, ""))
|
||||
// : store.formAddProject.approved;
|
||||
// store.formAddProject.budgetPay =
|
||||
// typeof store.formAddProject.budgetPay === "string"
|
||||
// ? Number(store.formAddProject.budgetPay.replace(/,/g, ""))
|
||||
// : store.formAddProject.budgetPay;
|
||||
|
||||
// const url = projectId.value
|
||||
// ? config.API.developmentMainById(projectId.value)
|
||||
// : config.API.developmentMain;
|
||||
// const method = projectId.value ? "put" : "post";
|
||||
// try {
|
||||
// const res = await http[method](url, store.formAddProject);
|
||||
// success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
// !projectId.value && router.push(`/development/${res.data.result}`);
|
||||
// projectId.value && fetchDataProject(projectId.value);
|
||||
// } catch (e) {
|
||||
// messageError($q, e);
|
||||
// } finally {
|
||||
// hideLoader();
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
|
||||
function getStatus(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.developmentMainById(id))
|
||||
.get(config.API.developmentMainStatus(id)) // change path
|
||||
.then((res) => {
|
||||
const data: ResDataProject = res.data.result;
|
||||
/** ข้อมูลเบื้องต้น*/
|
||||
status.value = data.status ? data.status : "ONGOING";
|
||||
store.formAddProject.year = data.year;
|
||||
store.formAddProject.projectName = data.projectName;
|
||||
store.formAddProject.reason = data.reason;
|
||||
store.formAddProject.objective = data.objective;
|
||||
/**เป้าหมาย*/
|
||||
const plannedGoals = data.plannedGoals.map((e: any) => ({
|
||||
groupTarget: e.groupTarget,
|
||||
groupTargetSub: e.groupTargetSub,
|
||||
positions: e.plannedGoalPositions.map((v: any) => ({
|
||||
position: v.position,
|
||||
posTypePlannedId: v.posTypePlannedId,
|
||||
posLevelPlannedId: v.posLevelPlannedId,
|
||||
})),
|
||||
type: e.type ? e.type : null,
|
||||
amount: e.amount,
|
||||
}));
|
||||
const plannedPeoples = data.plannedPeoples.map((e: ResPeople) => ({
|
||||
groupTarget: e.groupTarget,
|
||||
amount: e.amount,
|
||||
}));
|
||||
store.formAddProject.plannedGoals = plannedGoals;
|
||||
store.formAddProject.plannedPeoples = plannedPeoples;
|
||||
|
||||
const actualGoals = data.actualGoals.map((e: ResActualGoals) => ({
|
||||
groupTarget: e.groupTarget,
|
||||
groupTargetSub: e.groupTargetSub,
|
||||
position: e.position,
|
||||
posTypeActualId: e.posTypeActualId,
|
||||
posLevelActualId: e.posLevelActualId,
|
||||
type: e.type,
|
||||
amount: e.amount,
|
||||
}));
|
||||
const actualPeoples = data.actualPeoples.map((e: ResPeople) => ({
|
||||
groupTarget: e.groupTarget,
|
||||
amount: e.amount,
|
||||
}));
|
||||
store.formAddProject.actualGoals = actualGoals;
|
||||
store.formAddProject.actualPeoples = actualPeoples;
|
||||
|
||||
// ลักษณะโครงการ
|
||||
store.formAddProject.projectType = data.projectType;
|
||||
store.formAddProject.projectCharacteristics = data.projectCharacteristics;
|
||||
store.formAddProject.projectDay = data.projectDay;
|
||||
store.formAddProject.projectNigth = data.projectNigth;
|
||||
store.formAddProject.projectTechniques = data.projectTechniques;
|
||||
store.formAddProject.projectModal = data.projectModal;
|
||||
|
||||
/** การติดตามผลดารประเมิน*/
|
||||
store.formAddProject.metricType = data.metricType;
|
||||
store.formAddProject.indicators = data.indicators;
|
||||
store.formAddProject.target = data.target;
|
||||
store.formAddProject.calculation = data.calculation;
|
||||
store.formAddProject.measuRement = data.measuRement;
|
||||
store.formAddProject.results = data.results;
|
||||
store.formAddProject.obstacles = data.obstacles;
|
||||
store.formAddProject.suggestions = data.suggestions;
|
||||
store.formAddProject.project = data.project;
|
||||
store.formAddProject.isPassAllocate = data.isPassAllocate;
|
||||
store.formAddProject.isPassNoAllocate = data.isPassNoAllocate;
|
||||
store.formAddProject.isNoPass = data.isNoPass;
|
||||
store.formAddProject.isBudget = data.isBudget;
|
||||
store.formAddProject.isOutBudget = data.isOutBudget;
|
||||
|
||||
/** อื่นๆ*/
|
||||
store.formAddProject.dateStart = data.dateStart;
|
||||
store.formAddProject.dateEnd = data.dateEnd;
|
||||
store.formAddProject.totalDate = data.totalDate;
|
||||
store.formAddProject.address = data.address;
|
||||
|
||||
const provinces = data.provinces.map((e: any) => e.id);
|
||||
const provincesId = [...provinces];
|
||||
store.formAddProject.provinceIds = provincesId;
|
||||
|
||||
store.formAddProject.budget = data.budget;
|
||||
store.formAddProject.accept = data.accept;
|
||||
store.formAddProject.receive = data.receive;
|
||||
store.formAddProject.approved = data.approved;
|
||||
store.formAddProject.budgetPay = data.budgetPay;
|
||||
store.formAddProject.issues = data.issues;
|
||||
store.formAddProject.chance = Number(data.chance);
|
||||
store.formAddProject.effects = Number(data.effects);
|
||||
store.formAddProject.riskLevel = data.riskLevel;
|
||||
store.formAddProject.riskManagement = data.riskManagement;
|
||||
store.formAddProject.expect = data.expect;
|
||||
store.formAddProject.topicAcademic = data.topicAcademic;
|
||||
store.formAddProject.addressAcademic = data.addressAcademic;
|
||||
store.formAddProject.provinceActualId = data.provinceActualId;
|
||||
status.value = res.data.result.status;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
hideLoader();
|
||||
}, 1000);
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
if (store.formAddProject.projectName === "" && tab.value !== "BasicInfo") {
|
||||
dialogMessageNotify($q, "ชื่อโครงการ/กิจกรรม/หลักสูตร");
|
||||
tab.value = "BasicInfo";
|
||||
} else {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
/** การติดตามผลดารประเมิน*/
|
||||
if (store.formAddProject.project === "OFFER") {
|
||||
store.formAddProject.isBudget = false;
|
||||
store.formAddProject.isOutBudget = false;
|
||||
} else {
|
||||
store.formAddProject.isPassAllocate = false;
|
||||
store.formAddProject.isPassNoAllocate = false;
|
||||
store.formAddProject.isNoPass = false;
|
||||
}
|
||||
|
||||
// ลักษณะโครงการ;
|
||||
store.formAddProject.projectDay = store.formAddProject.projectDay
|
||||
? Number(store.formAddProject.projectDay)
|
||||
: null;
|
||||
store.formAddProject.projectNigth = store.formAddProject.projectNigth
|
||||
? Number(store.formAddProject.projectNigth)
|
||||
: null;
|
||||
store.formAddProject.projectModal = store.formAddProject.projectModal
|
||||
? Number(store.formAddProject.projectModal)
|
||||
: null;
|
||||
|
||||
/** อื่นๆ*/
|
||||
store.formAddProject.totalDate = Number(store.formAddProject.totalDate);
|
||||
store.formAddProject.accept =
|
||||
typeof store.formAddProject.accept === "string"
|
||||
? Number(store.formAddProject.accept.replace(/,/g, ""))
|
||||
: store.formAddProject.accept;
|
||||
store.formAddProject.receive =
|
||||
typeof store.formAddProject.receive === "string"
|
||||
? Number(store.formAddProject.receive.replace(/,/g, ""))
|
||||
: store.formAddProject.receive;
|
||||
store.formAddProject.approved =
|
||||
typeof store.formAddProject.approved === "string"
|
||||
? Number(store.formAddProject.approved.replace(/,/g, ""))
|
||||
: store.formAddProject.approved;
|
||||
store.formAddProject.budgetPay =
|
||||
typeof store.formAddProject.budgetPay === "string"
|
||||
? Number(store.formAddProject.budgetPay.replace(/,/g, ""))
|
||||
: store.formAddProject.budgetPay;
|
||||
|
||||
const url = projectId.value
|
||||
? config.API.developmentMainById(projectId.value)
|
||||
: config.API.developmentMain;
|
||||
const method = projectId.value ? "put" : "post";
|
||||
try {
|
||||
const res = await http[method](url, store.formAddProject);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
!projectId.value && router.push(`/development/${res.data.result}`);
|
||||
projectId.value && fetchDataProject(projectId.value);
|
||||
} catch (e) {
|
||||
messageError($q, e);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function onFinish(id: string) {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.developmentMainById(id)) // change path
|
||||
.get(config.API.developmentMainFinish(id)) // change path
|
||||
.then((res) => {
|
||||
getStatus(id);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
|
|
@ -234,7 +250,7 @@ function onFinish(id: string) {
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
projectId.value && fetchDataProject(projectId.value);
|
||||
projectId.value && getStatus(projectId.value);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
|
|
@ -267,7 +283,7 @@ onUnmounted(() => {
|
|||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
v-if="status === 'FINISH'"
|
||||
v-if="status === 'ONGOING'"
|
||||
unelevated
|
||||
label="เสร็จสิ้นโครงการ"
|
||||
color="green"
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import http from "@/plugins/http";
|
|||
import config from "@/app.config";
|
||||
|
||||
import type { DataOption } from "@/modules/15_development/interface/index/Main";
|
||||
import type { FormData } from "@/modules/15_development/interface/request/Other";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
|
||||
|
|
@ -21,7 +22,6 @@ const {
|
|||
messageError,
|
||||
dialogConfirm,
|
||||
} = useCounterMixin();
|
||||
|
||||
const route = useRoute();
|
||||
const projectId = ref<string>(route.params.id.toLocaleString());
|
||||
|
||||
|
|
@ -55,7 +55,6 @@ const budgetSubOp = ref<DataOption[]>([
|
|||
name: "เงินอุดหนุน",
|
||||
},
|
||||
]);
|
||||
|
||||
const getProvince = async () => {
|
||||
showLoader();
|
||||
http
|
||||
|
|
@ -77,30 +76,81 @@ const getProvince = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
const formData = reactive<FormData>({
|
||||
dateStart: null, //วันที่เริ่มต้น
|
||||
dateEnd: null, //วันที่สิ้นสุด
|
||||
totalDate: null, //รวมระยะเวลา (วัน)
|
||||
developmentAddresss: [{ address: "", provinceId: "" }], //ที่อยู่ ,จังหวัด
|
||||
budget: "", //ประเภทงบประมาณ(งบตามข้อบัญญัติ->REGULATIONBUDGET, งบประมาณกรุงเทพมหานคร->BANGKOKBUDGET, เงินนอกงบประมาณ->OUTSIDEBUDGET)
|
||||
budgetSub: "",
|
||||
accept: null, //จํานวนงบประมาณที่ขอรับการจัดสรรฯ
|
||||
receive: null, //จํานวนงบประมาณที่ได้รับการจัดสรรฯ
|
||||
approved: null, //จํานวนงบประมาณที่ได้รับอนุมัติ
|
||||
budgetPay: null, //จํานวนงบประมาณที่จ่ายจริง
|
||||
issues: "", //ประเด็นความเสี่ยง
|
||||
chance: null, //โอกาสที่จะเกิด
|
||||
effects: null, //ผลกระทบจากการเกิด
|
||||
riskLevel: "", //ระดับความเสี่ยง
|
||||
riskManagement: "", //เเนวทางการบริหารความเสี่ยง
|
||||
expect: "", //ประโยชน์ที่คาดว่าจะได้รับ
|
||||
topicAcademic: "", //หัวข้อ/ประเด็นการฝึกอบรม ศึกษาดูงาน
|
||||
addressAcademic: "", //สถานที่ฝึกอบรม ศึกษาดูงาน
|
||||
provinceActualId: "", //จังหวัด(ข้อมูลวิชาการ)
|
||||
});
|
||||
|
||||
function fetchData() {
|
||||
http
|
||||
.get(config.API.developmentMainTab("tab5", projectId.value))
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
const data = res.data.result;
|
||||
|
||||
formData.dateStart = data.dateStart;
|
||||
formData.dateEnd = data.dateEnd;
|
||||
formData.totalDate = data.totalDate;
|
||||
formData.developmentAddresss = data.developmentAddresss.map((e: any) => ({
|
||||
address: e.address,
|
||||
provinceId: e.provinceId,
|
||||
}));
|
||||
|
||||
formData.budget = data.budget;
|
||||
formData.accept = data.accept;
|
||||
formData.receive = data.receive;
|
||||
formData.approved = data.approved;
|
||||
formData.budgetPay = data.budgetPay;
|
||||
formData.issues = data.issues;
|
||||
formData.chance = Number(data.chance);
|
||||
formData.effects = Number(data.effects);
|
||||
formData.riskLevel = data.riskLevel;
|
||||
formData.riskManagement = data.riskManagement;
|
||||
formData.expect = data.expect;
|
||||
formData.topicAcademic = data.topicAcademic;
|
||||
formData.addressAcademic = data.addressAcademic;
|
||||
formData.provinceActualId = data.provinceActualId;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function changeDateStart() {
|
||||
if (
|
||||
store.formAddProject.dateStart !== null &&
|
||||
store.formAddProject.dateEnd !== null
|
||||
) {
|
||||
const startDate = new Date(store.formAddProject.dateStart);
|
||||
const endDate = new Date(store.formAddProject.dateEnd);
|
||||
if (formData.dateStart !== null && formData.dateEnd !== null) {
|
||||
const startDate = new Date(formData.dateStart);
|
||||
const endDate = new Date(formData.dateEnd);
|
||||
if (startDate > endDate) {
|
||||
store.formAddProject.dateEnd = null;
|
||||
store.formAddProject.totalDate = null;
|
||||
formData.dateEnd = null;
|
||||
formData.totalDate = null;
|
||||
} else {
|
||||
store.formAddProject.totalDate = diffDay(
|
||||
store.formAddProject.dateStart,
|
||||
store.formAddProject.dateEnd
|
||||
);
|
||||
formData.totalDate = diffDay(formData.dateStart, formData.dateEnd);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function changeDateEnd() {
|
||||
store.formAddProject.totalDate = diffDay(
|
||||
store.formAddProject.dateStart,
|
||||
store.formAddProject.dateEnd
|
||||
);
|
||||
formData.totalDate = diffDay(formData.dateStart, formData.dateEnd);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -117,11 +167,10 @@ const filterSelector = (val: string, update: Function) => {
|
|||
};
|
||||
|
||||
async function calRiskLevel() {
|
||||
if (store.formAddProject.chance && store.formAddProject.effects) {
|
||||
if (formData.chance && formData.effects) {
|
||||
const riskLevel =
|
||||
(await store.formAddProject.chance) * store.formAddProject.effects;
|
||||
|
||||
store.formAddProject.riskLevel =
|
||||
(await Number(formData.chance)) * Number(formData.effects);
|
||||
formData.riskLevel =
|
||||
riskLevel == 1
|
||||
? "น้อยมาก"
|
||||
: riskLevel == 2
|
||||
|
|
@ -140,16 +189,55 @@ async function calRiskLevel() {
|
|||
}
|
||||
}
|
||||
|
||||
function onClickAddLocation() {
|
||||
const data = {
|
||||
address: "",
|
||||
provinceId: "",
|
||||
};
|
||||
formData.developmentAddresss.push(data);
|
||||
}
|
||||
|
||||
function onClickDeleteLocation(index: number) {
|
||||
formData.developmentAddresss.splice(index, 1);
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
// post
|
||||
console.log("projectId===>", projectId.value);
|
||||
hideLoader();
|
||||
formData.totalDate = Number(formData.totalDate);
|
||||
formData.accept =
|
||||
typeof formData.accept === "string"
|
||||
? Number(formData.accept.replace(/,/g, ""))
|
||||
: formData.accept;
|
||||
formData.receive =
|
||||
typeof formData.receive === "string"
|
||||
? Number(formData.receive.replace(/,/g, ""))
|
||||
: formData.receive;
|
||||
formData.approved =
|
||||
typeof formData.approved === "string"
|
||||
? Number(formData.approved.replace(/,/g, ""))
|
||||
: formData.approved;
|
||||
formData.budgetPay =
|
||||
typeof formData.budgetPay === "string"
|
||||
? Number(formData.budgetPay.replace(/,/g, ""))
|
||||
: formData.budgetPay;
|
||||
|
||||
http
|
||||
.put(config.API.developmentMainTab("tab5", projectId.value), formData)
|
||||
.then(() => {
|
||||
fetchData();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchData();
|
||||
getProvince();
|
||||
});
|
||||
</script>
|
||||
|
|
@ -162,7 +250,7 @@ onMounted(() => {
|
|||
<div class="col-12 col-sm-6 col-md-3">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="store.formAddProject.dateStart"
|
||||
v-model="formData.dateStart"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
|
|
@ -179,9 +267,7 @@ onMounted(() => {
|
|||
dense
|
||||
outlined
|
||||
:model-value="
|
||||
store.formAddProject.dateStart
|
||||
? date2Thai(store.formAddProject.dateStart)
|
||||
: null
|
||||
formData.dateStart ? date2Thai(formData.dateStart) : null
|
||||
"
|
||||
:label="`${'วันที่เริ่มต้น'}`"
|
||||
>
|
||||
|
|
@ -200,12 +286,12 @@ onMounted(() => {
|
|||
<div class="col-12 col-sm-6 col-md-3">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="store.formAddProject.dateEnd"
|
||||
v-model="formData.dateEnd"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
:min-date="store.formAddProject.dateStart"
|
||||
:min-date="formData.dateStart"
|
||||
@update:model-value="changeDateEnd()"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
|
|
@ -218,9 +304,7 @@ onMounted(() => {
|
|||
outlined
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
store.formAddProject.dateEnd
|
||||
? date2Thai(store.formAddProject.dateEnd)
|
||||
: null
|
||||
formData.dateEnd ? date2Thai(formData.dateEnd) : null
|
||||
"
|
||||
:label="`${'วันที่สิ้นสุด'}`"
|
||||
>
|
||||
|
|
@ -242,7 +326,7 @@ onMounted(() => {
|
|||
outlined
|
||||
class="inputgreen"
|
||||
label="รวมระยะเวลา (วัน)"
|
||||
v-model="store.formAddProject.totalDate"
|
||||
v-model="formData.totalDate"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
|
|
@ -250,42 +334,71 @@ onMounted(() => {
|
|||
|
||||
<div class="col-12 q-mt-md">
|
||||
<span class="text-weight-medium text-body1">สถานที่ดำเนินการ</span>
|
||||
</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
outlined
|
||||
<q-btn
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.address"
|
||||
label="ที่อยู่"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formAddProject.provinceIds"
|
||||
label="จังหวัด"
|
||||
:options="provinceOp"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
class="inputgreen"
|
||||
use-input
|
||||
multiple
|
||||
@filter="
|
||||
(inputValue:string, doneFn:Function) =>
|
||||
filterSelector(inputValue, doneFn, )
|
||||
"
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="add"
|
||||
@click="onClickAddLocation"
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey"> ไม่พบข้อมูล </q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
<q-tooltip>เพิ่มสถานที่ดำเนินการ</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div class="col-12" v-for="(item, index) in formData.developmentAddresss">
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="formData.developmentAddresss[index].address"
|
||||
label="ที่อยู่"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="formData.developmentAddresss[index].provinceId"
|
||||
label="จังหวัด"
|
||||
:options="provinceOp"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
class="inputgreen"
|
||||
use-input
|
||||
@filter="
|
||||
(inputValue:string, doneFn:Function) =>
|
||||
filterSelector(inputValue, doneFn, )
|
||||
"
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่พบข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
<div class="col-1 text-center">
|
||||
<q-btn
|
||||
v-if="index !== 0"
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
icon="delete"
|
||||
@click="onClickDeleteLocation(index)"
|
||||
>
|
||||
<q-tooltip>ลบ</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 q-mt-md">
|
||||
<span class="text-weight-medium text-body1">งบประมาณ</span>
|
||||
</div>
|
||||
|
|
@ -293,7 +406,7 @@ onMounted(() => {
|
|||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formAddProject.budget"
|
||||
v-model="formData.budget"
|
||||
label="ประเภทงบประมาณ"
|
||||
:options="budgetOp"
|
||||
option-label="name"
|
||||
|
|
@ -305,10 +418,10 @@ onMounted(() => {
|
|||
</div>
|
||||
<div class="col-2">
|
||||
<q-select
|
||||
v-if="store.formAddProject.budget === 'OUTSIDEBUDGET'"
|
||||
v-if="formData.budget === 'OUTSIDEBUDGET'"
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formAddProject.budgetSub"
|
||||
v-model="formData.budgetSub"
|
||||
label="ประเภทย่อย"
|
||||
:options="budgetSubOp"
|
||||
option-label="name"
|
||||
|
|
@ -325,7 +438,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.accept"
|
||||
v-model="formData.accept"
|
||||
label="จํานวนงบประมาณที่ขอรับการจัดสรรฯ"
|
||||
mask="###,###,###,###,###"
|
||||
reverse-fill-mask
|
||||
|
|
@ -336,7 +449,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.receive"
|
||||
v-model="formData.receive"
|
||||
mask="###,###,###,###,###"
|
||||
reverse-fill-mask
|
||||
label="จํานวนงบประมาณที่ได้รับการจัดสรรฯ"
|
||||
|
|
@ -347,7 +460,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.approved"
|
||||
v-model="formData.approved"
|
||||
hide-bottom-space
|
||||
mask="###,###,###,###,###"
|
||||
label="จํานวนงบประมาณที่ได้รับอนุมัติ"
|
||||
|
|
@ -359,7 +472,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.budgetPay"
|
||||
v-model="formData.budgetPay"
|
||||
mask="###,###,###,###,###"
|
||||
reverse-fill-mask
|
||||
label="จํานวนงบประมาณที่จ่ายจริง"
|
||||
|
|
@ -367,7 +480,6 @@ onMounted(() => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 q-mt-md">
|
||||
<span class="text-weight-medium text-body1">ความเสี่ยงของโครงการ</span>
|
||||
</div>
|
||||
|
|
@ -377,7 +489,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.issues"
|
||||
v-model="formData.issues"
|
||||
label="ประเด็นความเสี่ยง"
|
||||
type="textarea"
|
||||
/>
|
||||
|
|
@ -387,7 +499,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.chance"
|
||||
v-model="formData.chance"
|
||||
label="โอกาสที่จะเกิด"
|
||||
:options="[1, 2, 3, 4]"
|
||||
@update:model-value="calRiskLevel"
|
||||
|
|
@ -398,7 +510,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.effects"
|
||||
v-model="formData.effects"
|
||||
label="ผลกระทบจากการเกิด"
|
||||
:options="[1, 2, 3, 4]"
|
||||
@update:model-value="calRiskLevel"
|
||||
|
|
@ -411,7 +523,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.riskLevel"
|
||||
v-model="formData.riskLevel"
|
||||
label="ระดับความเสี่ยง"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -420,7 +532,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.riskManagement"
|
||||
v-model="formData.riskManagement"
|
||||
label="เเนวทางการบริหารความเสี่ยง"
|
||||
type="textarea"
|
||||
/>
|
||||
|
|
@ -435,7 +547,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.expect"
|
||||
v-model="formData.expect"
|
||||
label="ประโยชน์ที่คาดว่าจะได้รับ"
|
||||
type="textarea"
|
||||
/>
|
||||
|
|
@ -448,7 +560,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.topicAcademic"
|
||||
v-model="formData.topicAcademic"
|
||||
label="หัวข้อ/ประเด็นการฝึกอบรม ศึกษาดูงาน"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -457,7 +569,7 @@ onMounted(() => {
|
|||
outlined
|
||||
dense
|
||||
class="inputgreen"
|
||||
v-model="store.formAddProject.addressAcademic"
|
||||
v-model="formData.addressAcademic"
|
||||
label="สถานที่ฝึกอบรม ศึกษาดูงาน"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -465,7 +577,7 @@ onMounted(() => {
|
|||
<q-select
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formAddProject.provinceActualId"
|
||||
v-model="formData.provinceActualId"
|
||||
label="จังหวัด"
|
||||
:options="provinceOp"
|
||||
option-label="name"
|
||||
|
|
|
|||
|
|
@ -26,15 +26,26 @@ const projectCharacteristicsOp = ref<DataOption[]>([
|
|||
{ id: "HOLD", name: "พักค้าง" },
|
||||
{ id: "GO_BACK_HOLD", name: "ไป-กลับและพักค้าง" },
|
||||
]);
|
||||
const projectTechniquesOp = ref<DataOption[]>([
|
||||
{ id: "TRAINING", name: "การอบรม" },
|
||||
{ id: "MEETING", name: "การประชุม" },
|
||||
{ id: "SEMINAR", name: "การสัมมนา" },
|
||||
{ id: "STUDY_TOUR", name: "การศึกษาดูงาน" },
|
||||
{ id: "ACADEMIC_SEMINAR", name: "การสัมมนาทางวิชาการ" },
|
||||
{ id: "WORKSHOP", name: "การสัมมนาเชิงปฏิบัติการ" },
|
||||
{ id: "SPECIAL_LECTURE", name: "การบรรยายพิเศษ" },
|
||||
{ id: "STUDY_TRAINING", name: "การฝึกศึกษา" },
|
||||
// const projectTechniquesOp = ref<DataOption[]>([
|
||||
// { id: "TRAINING", name: "การอบรม" },
|
||||
// { id: "MEETING", name: "การประชุม" },
|
||||
// { id: "SEMINAR", name: "การสัมมนา" },
|
||||
// { id: "STUDY_TOUR", name: "การศึกษาดูงาน" },
|
||||
// { id: "ACADEMIC_SEMINAR", name: "การสัมมนาทางวิชาการ" },
|
||||
// { id: "WORKSHOP", name: "การสัมมนาเชิงปฏิบัติการ" },
|
||||
// { id: "SPECIAL_LECTURE", name: "การบรรยายพิเศษ" },
|
||||
// { id: "STUDY_TRAINING", name: "การฝึกศึกษา" },
|
||||
// ]);
|
||||
|
||||
const projectTechniquesOp = ref<any[]>([
|
||||
{ value: "TRAINING", label: "การอบรม" },
|
||||
{ value: "MEETING", label: "การประชุม" },
|
||||
{ value: "SEMINAR", label: "การสัมมนา" },
|
||||
{ value: "STUDY_TOUR", label: "การศึกษาดูงาน" },
|
||||
{ value: "ACADEMIC_SEMINAR", label: "การสัมมนาทางวิชาการ" },
|
||||
{ value: "WORKSHOP", label: "การสัมมนาเชิงปฏิบัติการ" },
|
||||
{ value: "SPECIAL_LECTURE", label: "การบรรยายพิเศษ" },
|
||||
{ value: "STUDY_TRAINING", label: "การฝึกศึกษา" },
|
||||
]);
|
||||
|
||||
function onSubmit() {
|
||||
|
|
@ -50,7 +61,7 @@ function onSubmit() {
|
|||
<template>
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<div class="row q-pa-md q-col-gutter-sm">
|
||||
<div class="col-12 col-sm-12 col-md-4">
|
||||
<div class="col-12">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
|
|
@ -64,53 +75,6 @@ function onSubmit() {
|
|||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-4">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectCharacteristics"
|
||||
:options="projectCharacteristicsOp"
|
||||
label="ลักษณะ"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-2">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectDay"
|
||||
label="จำนวน (วัน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-2">
|
||||
<q-input
|
||||
v-if="store.formAddProject.projectCharacteristics !== 'GO_BACK'"
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectNigth"
|
||||
label="จำนวน (คืน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-4">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectTechniques"
|
||||
:options="projectTechniquesOp"
|
||||
label="เทคนิควิธีการที่ใช้ในการพัฒนา"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-2">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
|
|
@ -120,6 +84,149 @@ function onSubmit() {
|
|||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12"><q-separator class="q-my-md" /></div>
|
||||
|
||||
<div class="col-12 text-bold">รูปแบบโครงการตามแผน</div>
|
||||
|
||||
<div class="col-12 q-py-md">
|
||||
<q-label>เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
|
||||
<q-option-group
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="store.formAddProject.projectTechniques"
|
||||
:options="projectTechniquesOp"
|
||||
type="checkbox"
|
||||
inline
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-12 col-sm-2">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
value="GO_BLACK"
|
||||
label="ไป-กลับ"
|
||||
v-model="store.formAddProject.projectCharacteristics"
|
||||
></q-checkbox>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectDay"
|
||||
label="จำนวน (วัน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-12 col-sm-2">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
value="HOLD"
|
||||
label="พักค้าง"
|
||||
v-model="store.formAddProject.projectCharacteristics"
|
||||
></q-checkbox>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectDay"
|
||||
label="จำนวน (วัน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectNigth"
|
||||
label="จำนวน (คืน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12"><q-separator class="q-my-md" /></div>
|
||||
|
||||
<div class="col-12 text-bold">รูปแบบโครงการตามจริง</div>
|
||||
<div class="col-12 q-py-md">
|
||||
<q-label>เทคนิควิธีการที่ใช้ในการพัฒนา</q-label>
|
||||
<q-option-group
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="store.formAddProject.projectTechniques"
|
||||
:options="projectTechniquesOp"
|
||||
type="checkbox"
|
||||
inline
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-12 col-sm-2">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
value="GO_BLACK"
|
||||
label="ไป-กลับ"
|
||||
v-model="store.formAddProject.projectCharacteristics"
|
||||
></q-checkbox>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectDay"
|
||||
label="จำนวน (วัน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-12 col-sm-2">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
value="HOLD"
|
||||
label="พักค้าง"
|
||||
v-model="store.formAddProject.projectCharacteristics"
|
||||
></q-checkbox>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectDay"
|
||||
label="จำนวน (วัน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="store.formAddProject.projectNigth"
|
||||
label="จำนวน (คืน)"
|
||||
mask="#"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="text-right q-pa-sm">
|
||||
|
|
|
|||
|
|
@ -37,9 +37,13 @@ const isStatus = ref<string>("");
|
|||
const modalDialogGov = ref<boolean>(false);
|
||||
|
||||
const budgetSourceOp = ref<DataOption[]>([
|
||||
{ id: "BKK", name: "แหล่งงบประมาณกทม" },
|
||||
{ id: "OTHER", name: "แหล่งงบประมาณอื่นๆ" },
|
||||
{ id: "BKK", name: "งบประมาณ กทม." },
|
||||
{ id: "HOSPITAL", name: "เงินบำรุงโรงพยาบาล" },
|
||||
{ id: "FUND", name: "เงินกองทุน" },
|
||||
{ id: "SUBSIDY", name: "เงินอุดหนุน" },
|
||||
{ id: "OTHER", name: "เงินอื่น ๆ" },
|
||||
]);
|
||||
|
||||
const scholarshipTypeOp = ref<DataOption[]>([
|
||||
{ id: "DOMESTICE", name: "การศึกษาในประเทศ" },
|
||||
{
|
||||
|
|
@ -56,8 +60,11 @@ const scholarshipTypeOp = ref<DataOption[]>([
|
|||
},
|
||||
]);
|
||||
const fundTypeOp = ref<DataOption[]>([
|
||||
{ id: "FUND1", name: "ทุน 1 (ก)(ข)(ค)" },
|
||||
{ id: "FUND2", name: "ทุน 2 (ก)(ข)" },
|
||||
{ id: "FUND1", name: "ทุน 1 (ก)" },
|
||||
{ id: "FUND2", name: "ทุน 1 (ข)" },
|
||||
{ id: "FUND3", name: "ทุน 1 (ค)" },
|
||||
{ id: "FUND4", name: "ทุน 2" },
|
||||
{ id: "FUND5", name: "ทุนส่วนตัว" },
|
||||
]);
|
||||
|
||||
const isGov = ref<boolean>(false);
|
||||
|
|
@ -135,6 +142,8 @@ const formBody = reactive<FormsSholarship>({
|
|||
studyAbroadStartDate: null, //วันเริ่มต้นการศึกษาดูงานต่างประเทศ
|
||||
studyAbroadEndDate: null, //วันสิ้นสุดการศึกษาดูงานต่างประเทศ
|
||||
totalPeriod: "", //รวมระยะเวลาในการศึกษา/รวมระยะเวลาในการฝึกอบรม
|
||||
planType: "",
|
||||
isNoUseBudget: false,
|
||||
});
|
||||
|
||||
function fetchDataDetail(id: string) {
|
||||
|
|
@ -195,6 +204,8 @@ function fetchDataDetail(id: string) {
|
|||
formBody.studyAbroadStartDate = data.studyAbroadStartDate;
|
||||
formBody.studyAbroadEndDate = data.studyAbroadEndDate;
|
||||
formBody.totalPeriod = data.totalPeriod;
|
||||
formBody.planType = data.planType ? data.planType : "";
|
||||
formBody.isNoUseBudget = data.isNoUseBudget ? data.isNoUseBudget : false;
|
||||
|
||||
dataPerson.citizenId = data.citizenId ? data.citizenId : "-";
|
||||
dataPerson.name = `${data.prefix}${data.firstName} ${data.lastName}`;
|
||||
|
|
@ -501,6 +512,25 @@ onMounted(() => {
|
|||
</q-card>
|
||||
</div>
|
||||
<div class="row q-col-gutter-md q-pa-md" v-if="isGov">
|
||||
<div class="col-12">
|
||||
<q-radio
|
||||
v-model="formBody.planType"
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
val="INPLAN"
|
||||
label="ในแผนฯ"
|
||||
dense
|
||||
/>
|
||||
<q-radio
|
||||
v-model="formBody.planType"
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
val="OUTPLAN"
|
||||
label="นอกแผนฯ"
|
||||
dense
|
||||
class="q-pl-sm"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
|
|
@ -561,7 +591,7 @@ onMounted(() => {
|
|||
]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="col-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
|
|
@ -577,6 +607,14 @@ onMounted(() => {
|
|||
]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formBody.isNoUseBudget"
|
||||
label="ไม่ใช้งบประมาณ"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<q-input
|
||||
dense
|
||||
|
|
|
|||
23
src/modules/15_development/interface/request/Other.ts
Normal file
23
src/modules/15_development/interface/request/Other.ts
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
interface FormData {
|
||||
dateStart: Date | null; //วันที่เริ่มต้น
|
||||
dateEnd: Date | null; //วันที่สิ้นสุด
|
||||
totalDate: number | null; //รวมระยะเวลา (วัน)
|
||||
developmentAddresss: [{ address: string; provinceId: string }]; //ที่อยู่ ,จังหวัด
|
||||
budget: string; //ประเภทงบประมาณ(งบตามข้อบัญญัติ->REGULATIONBUDGET, งบประมาณกรุงเทพมหานคร->BANGKOKBUDGET, เงินนอกงบประมาณ->OUTSIDEBUDGET)
|
||||
budgetSub: string;
|
||||
accept: number | string | null; //จํานวนงบประมาณที่ขอรับการจัดสรรฯ
|
||||
receive: number | string | null; //จํานวนงบประมาณที่ได้รับการจัดสรรฯ
|
||||
approved: number | string | null; //จํานวนงบประมาณที่ได้รับอนุมัติ
|
||||
budgetPay: number | string | null; //จํานวนงบประมาณที่จ่ายจริง
|
||||
issues: string; //ประเด็นความเสี่ยง
|
||||
chance: number | null; //โอกาสที่จะเกิด
|
||||
effects: number | null; //ผลกระทบจากการเกิด
|
||||
riskLevel: string; //ระดับความเสี่ยง
|
||||
riskManagement: string; //เเนวทางการบริหารความเสี่ยง
|
||||
expect: string; //ประโยชน์ที่คาดว่าจะได้รับ
|
||||
topicAcademic: string; //หัวข้อ/ประเด็นการฝึกอบรม ศึกษาดูงาน
|
||||
addressAcademic: string; //สถานที่ฝึกอบรม ศึกษาดูงาน
|
||||
provinceActualId: string;
|
||||
}
|
||||
|
||||
export type { FormData };
|
||||
|
|
@ -49,6 +49,8 @@ interface FormsSholarship {
|
|||
studyAbroadStartDate: Date | null; //วันเริ่มต้นการศึกษาดูงานต่างประเทศ
|
||||
studyAbroadEndDate: Date | null; //วันสิ้นสุดการศึกษาดูงานต่างประเทศ
|
||||
totalPeriod: string; //รวมระยะเวลาในการศึกษา/รวมระยะเวลาในการฝึกอบรม
|
||||
planType: string; // INPLAN ในแผนฯ, OUTPLAN นอกแผนฯ
|
||||
isNoUseBudget: boolean; //
|
||||
}
|
||||
|
||||
export type { FormsSholarship };
|
||||
|
|
|
|||
|
|
@ -63,6 +63,8 @@ interface DataSholarship {
|
|||
studyAbroadEndDate: Date | null; //วันสิ้นสุดการศึกษาดูงานต่างประเทศ
|
||||
totalPeriod: string; //รวมระยะเวลาในการศึกษา/รวมระยะเวลาในการฝึกอบรม
|
||||
status: string;
|
||||
planType: string; // INPLAN ในแผนฯ, OUTPLAN นอกแผนฯ
|
||||
isNoUseBudget: boolean; // ไม่ใช้งบประมาณ
|
||||
}
|
||||
|
||||
export type { DataSholarship, ListSholarship };
|
||||
|
|
|
|||
|
|
@ -40,8 +40,8 @@ export const useDevelopmentDataStore = defineStore(
|
|||
approved: null, //จํานวนงบประมาณที่ได้รับอนุมัติ
|
||||
budgetPay: null, //จํานวนงบประมาณที่จ่ายจริง
|
||||
issues: "", //ประเด็นความเสี่ยง
|
||||
chance: "", //โอกาสที่จะเกิด
|
||||
effects: "", //ผลกระทบจากการเกิด
|
||||
chance: 0, //โอกาสที่จะเกิด
|
||||
effects: 0, //ผลกระทบจากการเกิด
|
||||
riskLevel: "", //ระดับความเสี่ยง
|
||||
riskManagement: "", //เเนวทางการบริหารความเสี่ยง
|
||||
expect: "", //ประโยชน์ที่คาดว่าจะได้รับ
|
||||
|
|
@ -110,8 +110,8 @@ export const useDevelopmentDataStore = defineStore(
|
|||
formAddProject.approved = null;
|
||||
formAddProject.budgetPay = null;
|
||||
formAddProject.issues = "";
|
||||
formAddProject.chance = "";
|
||||
formAddProject.effects = "";
|
||||
formAddProject.chance = 0;
|
||||
formAddProject.effects = 0;
|
||||
formAddProject.riskLevel = "";
|
||||
formAddProject.riskManagement = "";
|
||||
formAddProject.expect = "";
|
||||
|
|
|
|||
|
|
@ -1,57 +1,57 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { ref } from "vue";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const $q = useQuasar();
|
||||
const { showLoader, hideLoader, dialogConfirm, dialogRemove } =
|
||||
useCounterMixin();
|
||||
|
||||
const ListMenu = ref<any>([
|
||||
{
|
||||
label: "เพิ่ม",
|
||||
icon: "add",
|
||||
type: "ADD",
|
||||
color: "primary",
|
||||
},
|
||||
{
|
||||
label: "แก้ไข",
|
||||
icon: "edit",
|
||||
type: "EDIT",
|
||||
color: "edit",
|
||||
},
|
||||
{
|
||||
label: "ลบ",
|
||||
icon: "delete",
|
||||
type: "DEL",
|
||||
color: "red",
|
||||
},
|
||||
]);
|
||||
|
||||
const nodes = ref<any>([
|
||||
{
|
||||
orgTreeName: " แผนพัฒนากรุงเทพมหานคร ระยะ 20 ปี ระยะที่ 3",
|
||||
level: "0",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 1",
|
||||
level: "1",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 2",
|
||||
level: "2",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 3",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 4",
|
||||
children: [{ orgTreeName: "ยุทธศาสตร์ที่ 2" }],
|
||||
},
|
||||
],
|
||||
level: "3",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 1",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 2",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 3",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 4",
|
||||
children: [{ orgTreeName: "ยุทธศาสตร์ที่ 2" }],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
orgTreeName: " แผนพัฒนากรุงเทพมหานคร ระยะ 20 ปี ระยะที่ 2",
|
||||
children: [
|
||||
{
|
||||
orgTreeName: "ยุทธศาสตร์ที่ 1",
|
||||
children: [{ orgTreeName: "ยุทธศาสตร์ที่ 2" }],
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
|
@ -62,16 +62,103 @@ const expanded = ref<Array<any>>([]);
|
|||
const nodeId = ref<string>("");
|
||||
|
||||
function updateSelected(data: any) {
|
||||
console.log(data);
|
||||
nodeId.value = data.orgTreeName;
|
||||
}
|
||||
|
||||
function onClickAction(type: string, data: any = null) {
|
||||
switch (type) {
|
||||
case "ADD":
|
||||
onClickOpenDialog(false, data);
|
||||
break;
|
||||
case "EDIT":
|
||||
onClickOpenDialog(true, data);
|
||||
break;
|
||||
case "DEL":
|
||||
onDelete();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
const modalDialog = ref<boolean>(false);
|
||||
const statusEdit = ref<boolean>(false);
|
||||
const strategicName = ref<string>("");
|
||||
const titleDialog = ref<string>("");
|
||||
function onClickOpenDialog(status: boolean = false, data: any = null) {
|
||||
statusEdit.value = status;
|
||||
// if (data) {
|
||||
// titleDialog.value =
|
||||
// data.level === "0"
|
||||
// ? "ยุทธศาสตร์ที่ 1"
|
||||
// : data.level === "1"
|
||||
// ? "ยุทธศาสตร์ย่อย"
|
||||
// : data.level === "2"
|
||||
// ? ""
|
||||
// : data.level === "3"
|
||||
// ? ""
|
||||
// : "";
|
||||
// } else {
|
||||
// titleDialog.value = "ยุทธศาสตร์/แผน";
|
||||
// }
|
||||
|
||||
if (status) {
|
||||
strategicName.value = data.orgTreeName;
|
||||
titleDialog.value =
|
||||
data.level === "0"
|
||||
? "ยุทธศาสตร์"
|
||||
: data.level === "1"
|
||||
? "ยุทธศาสตร์ที่ 1"
|
||||
: data.level === "2"
|
||||
? "ยุทธศาสตร์ย่อย"
|
||||
: data.level === "3"
|
||||
? "กลยุทธ์ที่/เป้าประสงค์ที่"
|
||||
: "";
|
||||
} else {
|
||||
if (data) {
|
||||
titleDialog.value =
|
||||
data.level === "0"
|
||||
? "ยุทธศาสตร์ 1"
|
||||
: data.level === "1"
|
||||
? "ยุทธศาสตร์ย่อย"
|
||||
: data.level === "2"
|
||||
? "กลยุทธ์ที่/เป้าประสงค์ที่"
|
||||
: "";
|
||||
} else {
|
||||
titleDialog.value = "ยุทธศาสตร์";
|
||||
}
|
||||
}
|
||||
modalDialog.value = true;
|
||||
}
|
||||
|
||||
function closeDialog() {
|
||||
modalDialog.value = false;
|
||||
strategicName.value = "";
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
closeDialog();
|
||||
});
|
||||
}
|
||||
|
||||
function onDelete() {
|
||||
dialogRemove($q, () => {});
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">ยุทธศาสตร์</div>
|
||||
<q-card flat bordered class="q-pa-md">
|
||||
<div class="row q-col-gutter-sm q-pl-sm">
|
||||
<q-toolbar class="text-primary">
|
||||
<q-btn dense flat round color="primary" icon="add">
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="add"
|
||||
@click.stop="onClickAction('ADD')"
|
||||
>
|
||||
<q-tooltip>เพิ่มยุทธศาสตร์</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
|
|
@ -102,8 +189,8 @@ function updateSelected(data: any) {
|
|||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
@click.stop
|
||||
:active="nodeId == prop.node.orgTreeName"
|
||||
@click.stop="updateSelected(prop.node)"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
|
|
@ -112,10 +199,120 @@ function updateSelected(data: any) {
|
|||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
</div>
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
icon="mdi-dots-vertical"
|
||||
class="q-ml-xs"
|
||||
color="grey-13"
|
||||
size="12px"
|
||||
round
|
||||
>
|
||||
<q-menu>
|
||||
<q-list
|
||||
dense
|
||||
v-for="(item, index) in prop.node.level !== '3'
|
||||
? ListMenu
|
||||
: ListMenu.slice(1, 4)"
|
||||
:key="index"
|
||||
style="min-width: 100px"
|
||||
>
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click.stop="onClickAction(item.type, prop.node)"
|
||||
>
|
||||
<q-item-section avatar style="min-width: 20px">
|
||||
<q-icon size="17px" :color="item.color" :name="item.icon" />
|
||||
</q-item-section>
|
||||
|
||||
<div v-if="item.type === 'ADD'">
|
||||
<q-item-section v-if="prop.node.level === '0'">
|
||||
{{ `${item.label}ยุทธศาสตร์ที่ 1` }}
|
||||
</q-item-section>
|
||||
<q-item-section v-if="prop.node.level === '1'">
|
||||
{{ `${item.label}ยุทธศาสตร์ย่อย` }}
|
||||
</q-item-section>
|
||||
<q-item-section v-if="prop.node.level === '2'">
|
||||
{{ `${item.label}กลยุทธ์ที่/เป้าประสงค์` }}
|
||||
</q-item-section>
|
||||
</div>
|
||||
|
||||
<div v-else-if="item.type === 'EDIT'">
|
||||
<q-item-section v-if="prop.node.level === '0'">
|
||||
{{ `${item.label}ยุทธศาสตร์` }}
|
||||
</q-item-section>
|
||||
<q-item-section v-if="prop.node.level === '1'">
|
||||
{{ `${item.label}ยุทธศาสตร์ที่ 1` }}
|
||||
</q-item-section>
|
||||
<q-item-section v-if="prop.node.level === '2'">
|
||||
{{ `${item.label}ยุทธศาสตร์ย่อย` }}
|
||||
</q-item-section>
|
||||
<q-item-section v-if="prop.node.level === '3'">
|
||||
{{ `${item.label}กลยุทธ์ที่/เป้าประสงค์` }}
|
||||
</q-item-section>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<q-item-section>{{ item.label }}</q-item-section>
|
||||
</div>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card>
|
||||
|
||||
<q-dialog v-model="modalDialog" persistent>
|
||||
<q-card style="width: 700px; max-width: 80vw">
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader
|
||||
:tittle="`${
|
||||
statusEdit ? `แก้ไข${titleDialog}` : `เพิ่ม${titleDialog}`
|
||||
}`"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pt-none">
|
||||
<div class="row q-pa-md">
|
||||
<div class="col">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="strategicName"
|
||||
label="ชื่อยุทธศาสตร์"
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val:string) =>
|
||||
!!val || `${'กรุณากรอกชื่อยุทธศาสตร์'}`,
|
||||
|
||||
]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue