post โครงการ
This commit is contained in:
STW_TTTY\stwtt
parent
f24057413e
commit
dc367c963d
2 changed files with 155 additions and 64 deletions
|
|
@ -25,6 +25,10 @@ const $q = useQuasar();
|
|||
const router = useRouter();
|
||||
const { showLoader, hideLoader, messageError } = useCounterMixin();
|
||||
|
||||
const ticked = ref<any>([]);
|
||||
const node = ref<any>([]);
|
||||
const expanded = ref<any>([]);
|
||||
const splitterModel = ref<number>(60);
|
||||
const modal = ref<boolean>(false);
|
||||
const projectName = ref<string>("");
|
||||
const orgName = ref<string>("");
|
||||
|
|
@ -186,10 +190,60 @@ function closeDialog() {
|
|||
|
||||
/** dialog submit */
|
||||
function onSubmit() {
|
||||
router.push("/development/add");
|
||||
http
|
||||
.post(config.API.developmentMain,{
|
||||
year:year.value,
|
||||
projectName:projectName.value
|
||||
})
|
||||
.then((res) => {
|
||||
closeDialog();
|
||||
router.push(`/development/${res.data.result}`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {});
|
||||
}
|
||||
|
||||
function updateTicked(val: any) {
|
||||
console.log(expanded.value);
|
||||
|
||||
ticked.value = [];
|
||||
ticked.value.push(val[val.length - 1]);
|
||||
}
|
||||
|
||||
function fetchActive() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.activeOrganization)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
fetchTree(data.activeId);
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
async function fetchTree(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.orgByid(id.toString()))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
node.value = data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchActive();
|
||||
fetchListProject();
|
||||
});
|
||||
</script>
|
||||
|
|
@ -421,72 +475,106 @@ onMounted(() => {
|
|||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-4">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
|
||||
outlined
|
||||
:model-value="year === 0 ? null : Number(year) + 543"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
<q-card-sectio class="q-pa-none">
|
||||
<q-splitter v-model="splitterModel" disable>
|
||||
<template v-slot:before>
|
||||
<q-scroll-area visible style="height: 60vh">
|
||||
<q-tree
|
||||
class="q-pa-sm"
|
||||
dense
|
||||
:nodes="node"
|
||||
node-key="orgName"
|
||||
label-key="labelName"
|
||||
v-model:expanded="expanded"
|
||||
tick-strategy="strict"
|
||||
v-model:ticked="ticked"
|
||||
@update:ticked="updateTicked"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
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"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
<div class="text-weight-light text-grey-8">
|
||||
{{
|
||||
prop.node.orgCode == null ? null : prop.node.orgCode
|
||||
}}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-scroll-area>
|
||||
</template>
|
||||
|
||||
<template v-slot:after>
|
||||
<div class="row q-col-gutter-sm q-pa-sm">
|
||||
<div class="col-12">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
>
|
||||
<template v-if="year" v-slot:append>
|
||||
<q-icon
|
||||
name="cancel"
|
||||
@click.stop.prevent="year = 0"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
|
||||
outlined
|
||||
:model-value="year === 0 ? null : Number(year) + 543"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
</q-icon>
|
||||
<template v-if="year" v-slot:append>
|
||||
<q-icon
|
||||
name="cancel"
|
||||
@click.stop.prevent="year = 0"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
v-model="orgName"
|
||||
label="ชื่อหน่วยงานที่รับผิดชอบ"
|
||||
dense
|
||||
outlined
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อหน่วยงานที่รับผิดชอบ'}`,]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
v-model="projectName"
|
||||
label="ชื่อโครงการ/กิจกรรม/หลักสูตร"
|
||||
dense
|
||||
outlined
|
||||
hide-bottom-space
|
||||
type="textarea"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อโครงการ/กิจกรรม/หลักสูตร'}`,]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
v-model="projectName"
|
||||
label="ชื่อโครงการ/กิจกรรม/หลักสูตร"
|
||||
dense
|
||||
outlined
|
||||
hide-bottom-space
|
||||
type="textarea"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อโครงการ/กิจกรรม/หลักสูตร'}`,]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-splitter>
|
||||
</q-card-sectio>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" type="submit" color="public" dense></q-btn>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue