Merge branch 'develop' into dev-tee
This commit is contained in:
setthawutttty
commit
fed801820f
6 changed files with 633 additions and 59 deletions
|
|
@ -16,6 +16,12 @@ export default {
|
|||
|
||||
// manage
|
||||
insigniaManage: (type: string) => `${insignia}/manage/${type}`,
|
||||
insigniaList: (insigniaPeriodId: any, ocId: string, role: string, status: any) => `${insignia}/request/${insigniaPeriodId}/${ocId}/${role}/${status}`
|
||||
insigniaCreate: () => `${insignia}/request`,
|
||||
insigniaList: (insigniaPeriodId: any, ocId: string, role: string, status: any) => `${insignia}/request/${insigniaPeriodId}/${ocId}/${role}/${status}`,
|
||||
insigniaReject: (profileId: string) => `${insignia}/status/reject/${profileId}`,
|
||||
insigniaDelete: (profileId: string) => `${insignia}/status/delete/${profileId}`,
|
||||
insigniaEdit: (profileId: string) => `${insignia}/request/${profileId}`,
|
||||
insigniaAgency: () => `${insignia}/request/agency`,
|
||||
insigniaDashboard: (insigniaPeriodId: string) => `${insignia}/request/dashboard/${insigniaPeriodId}`,
|
||||
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { onMounted, ref, watch, reactive } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
import type { QTableProps } from "quasar";
|
||||
|
|
@ -8,13 +8,21 @@ import http from "@/plugins/http";
|
|||
import config from "@/app.config";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { dialogRemove, dialogConfirm } = mixin;
|
||||
const {
|
||||
dialogRemove,
|
||||
dialogConfirm,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
success,
|
||||
} = mixin;
|
||||
const $q = useQuasar();
|
||||
const DataStore = useInsigniaDataStore();
|
||||
|
||||
const modalNote = ref<boolean>(false);
|
||||
const organization = ref<number>(1);
|
||||
const organizationOptions = ref<any>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
const modalAdd = ref<boolean>(false);
|
||||
const organization = ref<string>("");
|
||||
const organizationOptions = ref<any>([{ id: "1", name: "ทั้งหมด" }]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"citizenId",
|
||||
|
|
@ -186,6 +194,46 @@ const rows = ref<any[]>([
|
|||
},
|
||||
]);
|
||||
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "index",
|
||||
required: true,
|
||||
label: "ลำดับ",
|
||||
field: "index",
|
||||
align: "left",
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
required: true,
|
||||
label: "ชื่อ-สกุล",
|
||||
field: "fullname",
|
||||
align: "left",
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
required: true,
|
||||
label: "ตำแหน่งในสายงาน",
|
||||
field: "position",
|
||||
align: "left",
|
||||
},
|
||||
{
|
||||
name: "level",
|
||||
required: true,
|
||||
label: "ระดับ",
|
||||
field: "level",
|
||||
align: "left",
|
||||
},
|
||||
{
|
||||
name: "organizationOrganization",
|
||||
required: true,
|
||||
label: "สังกัด",
|
||||
field: "organizationOrganization",
|
||||
align: "left",
|
||||
},
|
||||
]);
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows2 = ref<any[]>([]);
|
||||
|
||||
const Note = ref<string>("");
|
||||
const titleModal = ref<string>("");
|
||||
const actionModal = ref<string>("");
|
||||
|
|
@ -198,52 +246,216 @@ const props = defineProps({
|
|||
roundId: {
|
||||
type: String,
|
||||
},
|
||||
fecthInsigniaAll: {
|
||||
type: Function,
|
||||
},
|
||||
fecthInsigniaByOc: {
|
||||
type: Function,
|
||||
},
|
||||
});
|
||||
const typeinsignia = ref<number | string>("all");
|
||||
const typeinsigniaOptions = reactive<any>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
onMounted(async () => {
|
||||
console.log(props);
|
||||
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
console.log(organizationOptions.value);
|
||||
await fecthInsignia();
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
if (organization.value !== "" || organization.value !== undefined) {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const fecthInsignia = async () => {
|
||||
for (const item of DataStore.optionsTypeOc) {
|
||||
console.log(item.index);
|
||||
|
||||
// await http
|
||||
// .get(
|
||||
// config.API.insigniaList(props.roundId, item["id"], "officer", props.tab)
|
||||
// )
|
||||
// .then((res) => {
|
||||
// console.log(res);
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// console.log(err);
|
||||
// });
|
||||
const changtypeOc = () => {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
};
|
||||
const clickmodalAdd = () => {
|
||||
showLoader();
|
||||
fecthlistRetire();
|
||||
};
|
||||
// fecth profile
|
||||
const fecthlistRetire = async () => {
|
||||
await http
|
||||
.get(config.API.profileOrganizRoot)
|
||||
.then((res) => {
|
||||
const id = res.data.result[0].id;
|
||||
if (id !== "") {
|
||||
fecthlistperson(id);
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
messageError($q, e);
|
||||
});
|
||||
};
|
||||
const fecthlistperson = async (id: string) => {
|
||||
let data = [{}];
|
||||
data = [
|
||||
{
|
||||
criteriaType: "is_retire",
|
||||
criteriaValue: "false",
|
||||
},
|
||||
{
|
||||
criteriaType: "is_probation",
|
||||
criteriaValue: "false",
|
||||
},
|
||||
];
|
||||
await http
|
||||
.post(config.API.profileSearchNewOcIdType(id, "officer"), {
|
||||
criterias: data,
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
|
||||
const clickAction = (props: any, action: string) => {
|
||||
Note.value = "";
|
||||
person.value = props;
|
||||
titleModal.value = props.name;
|
||||
actionModal.value = action;
|
||||
modalNote.value = true;
|
||||
rows2.value = res.data.result.map((e: any) => ({
|
||||
id: e.id,
|
||||
fullname: e.fullname == null ? "-" : e.fullname,
|
||||
position: e.position == null ? "-" : e.position,
|
||||
level: e.positionEmployeeLevel == null ? "-" : e.positionEmployeeLevel,
|
||||
organizationOrganization: e.oc == null ? "-" : e.oc,
|
||||
}));
|
||||
modalAdd.value = true;
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
const clickAdd = async (id: string) => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
addlistperson(id);
|
||||
},
|
||||
"ยืนยันการเพิ่มรายชื่อขอพระราชทานเครื่องราชฯ",
|
||||
"ต้องการยืนยันการเพิ่มรายชื่อขอพระราชทานเครื่องราชฯ นี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const addlistperson = async (id: string) => {
|
||||
showLoader();
|
||||
let data = {
|
||||
profileId: id,
|
||||
insigniaId: organization.value,
|
||||
insigniaPeriodId: props.roundId,
|
||||
};
|
||||
// console.log(data);
|
||||
await http
|
||||
.post(config.API.insigniaCreate(), data)
|
||||
.then(() => {
|
||||
success($q, "เพิ่มรายชื่อสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
modalAdd.value = false;
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
// const clickAction = (props: any, action: string) => {
|
||||
// Note.value = "";
|
||||
// person.value = props;
|
||||
// titleModal.value = props.name;
|
||||
// actionModal.value = action;
|
||||
// modalNote.value = true;
|
||||
// };
|
||||
const clickEdit = () => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
await listEdit();
|
||||
},
|
||||
"ยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอ",
|
||||
"ต้องการยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const listEdit = async () => {
|
||||
let data = { insigniaId: organization.value };
|
||||
console.log(data);
|
||||
await http
|
||||
.get(config.API.insigniaEdit(), data)
|
||||
.then(() => {
|
||||
success($q, "แก้ไขเครื่องราชฯ ที่ยื่นขอสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
});
|
||||
};
|
||||
const clickReject = () => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
await listreject();
|
||||
},
|
||||
"ยืนยันการย้ายข้อมูล",
|
||||
"ต้องการยืนยันการย้ายข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const listreject = async () => {
|
||||
await http
|
||||
.get(config.API.insigniaReject())
|
||||
.then(() => {
|
||||
success($q, "ย้ายข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
});
|
||||
};
|
||||
const clickDelete = () => {
|
||||
dialogRemove($q);
|
||||
console.log(person.value, Note.value);
|
||||
dialogRemove(
|
||||
$q,
|
||||
async () => {
|
||||
await listdelete();
|
||||
},
|
||||
"ยืนยันการลบออกข้ออมูล",
|
||||
"ต้องการยืนยันการลบข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const clickSavenote = () => {
|
||||
dialogConfirm($q);
|
||||
console.log(person.value);
|
||||
const listdelete = async () => {
|
||||
await http
|
||||
.get(config.API.insigniaDelete())
|
||||
.then(() => {
|
||||
success($q, "ลบข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
});
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterKeyword2 = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
const resetFilter = () => {
|
||||
filterKeyword.value = "";
|
||||
filterKeyword2.value = "";
|
||||
filterRef.value.focus();
|
||||
};
|
||||
const pagination = ref({
|
||||
|
|
@ -252,11 +464,22 @@ const pagination = ref({
|
|||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
const pagination2 = ref({
|
||||
sortBy: "desc",
|
||||
descending: false,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
const paging = ref<boolean>(true);
|
||||
const paging2 = ref<boolean>(true);
|
||||
const paginationLabel = (start: string, end: string, total: string) => {
|
||||
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
|
||||
else return start + "-" + end + " ใน " + total;
|
||||
};
|
||||
const paginationLabel2 = (start: string, end: string, total: string) => {
|
||||
if (paging2.value == true) return " " + start + "-" + end + " ใน " + total;
|
||||
else return start + "-" + end + " ใน " + total;
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="col-12 row q-pa-md">
|
||||
|
|
@ -278,12 +501,38 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<q-select
|
||||
v-model="typeinsignia"
|
||||
label="ปรเภทเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="typeinsigniaOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
:readonly="false"
|
||||
:borderless="false"
|
||||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<div>
|
||||
<q-btn size="md" icon="mdi-download" flat round color="primary">
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn size="12px" flat round color="add" icon="mdi-plus">
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
color="add"
|
||||
icon="mdi-plus"
|
||||
@click="clickmodalAdd"
|
||||
>
|
||||
<q-tooltip>เพิ่ม</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
|
@ -395,11 +644,28 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
dense
|
||||
>
|
||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||
<q-list dense style="min-width: 120px">
|
||||
<q-list dense style="min-width: 250px">
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="clickAction(props.row, 'note')"
|
||||
@click="clickEdit(props.row)"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-tooltip>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-tooltip>
|
||||
<q-icon color="primary" size="xs" name="mdi-pencil" />
|
||||
</q-item-section>
|
||||
<q-item-section
|
||||
>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-item-section
|
||||
>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="clickReject(props.row)"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -418,7 +684,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="clickAction(props.row, 'delete')"
|
||||
@click="clickDelete(props.row)"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -453,11 +719,109 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- add -->
|
||||
<q-dialog v-model="modalAdd">
|
||||
<q-card style="width: 850px; max-width: 80vw" class="q-pb-md">
|
||||
<q-toolbar class="q-py-md">
|
||||
<q-toolbar-title class="text-h6">เพิ่มรายชื่อ </q-toolbar-title>
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
@click="modalAdd = false"
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
/>
|
||||
</q-toolbar>
|
||||
<q-separator />
|
||||
<div class="q-pa-md">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-input
|
||||
borderless
|
||||
outlined
|
||||
dense
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="width: 850px; max-width: auto"
|
||||
v-model="filterKeyword2"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
</template>
|
||||
</q-input>
|
||||
</q-toolbar>
|
||||
<q-table
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:rows="rows2"
|
||||
:columns="columns2"
|
||||
:filter="filterKeyword2"
|
||||
row-key="name"
|
||||
class="custom-header-table"
|
||||
:pagination-label="paginationLabel2"
|
||||
v-model:pagination="pagination2"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th auto-width />
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td>{{ props.rowIndex + 1 }}</q-td>
|
||||
<!-- <q-td key="order" :props="props">
|
||||
{{ props.row.order }}
|
||||
</q-td> -->
|
||||
<q-td key="fullname" :props="props">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="position" :props="props">
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
<q-td key="level" :props="props">{{ props.row.level }}</q-td>
|
||||
<q-td key="organizationOrganization" :props="props">
|
||||
{{ props.row.organizationOrganization }}
|
||||
</q-td>
|
||||
<q-td>
|
||||
<q-btn
|
||||
outline
|
||||
:props="props"
|
||||
label="เพิ่ม"
|
||||
class="text-teal-5"
|
||||
@click="clickAdd(props.row.id)"
|
||||
/>
|
||||
<q-tooltip>เพิ่ม</q-tooltip>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="pagination2.page"
|
||||
color="primary"
|
||||
:max="scope.pagesNumber"
|
||||
:max-pages="5"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
></q-pagination>
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- note -->
|
||||
<q-dialog v-model="modalNote" persistent>
|
||||
<q-card style="min-width: 350px">
|
||||
<q-toolbar>
|
||||
<q-toolbar-title class="text-subtitle2 text-bold">
|
||||
<div v-if="actionModal == 'note'">หมายเหตุ {{ titleModal }}</div>
|
||||
<div v-if="actionModal == 'note'">
|
||||
เป็นเหตุผลที่ไม่ยื่นขอ {{ titleModal }}
|
||||
</div>
|
||||
<div v-if="actionModal == 'delete'">ลบออก {{ titleModal }}</div>
|
||||
</q-toolbar-title>
|
||||
<q-btn
|
||||
|
|
@ -475,10 +839,10 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
dense
|
||||
outlined
|
||||
type="textarea"
|
||||
label="กรอกหมายเหตุ"
|
||||
label="เหตุผลที่ไม่ยื่นขอ"
|
||||
v-model="Note"
|
||||
@keyup.enter="modalNote = false"
|
||||
:rules="[(val) => !!val || 'กรอกหมายเหตุ']"
|
||||
:rules="[(val) => !!val || 'เหตุผลที่ไม่ยื่นขอ']"
|
||||
/>
|
||||
</q-card-section>
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,29 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useInsigniaDataStore } from "@/modules/07_insignia/store";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const organization = ref<number>(1);
|
||||
const organizationOptions = ref<any>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
const DataStore = useInsigniaDataStore();
|
||||
|
||||
const props = defineProps({
|
||||
tab: {
|
||||
type: String,
|
||||
},
|
||||
roundId: {
|
||||
type: String,
|
||||
},
|
||||
fecthInsigniaAll: {
|
||||
type: Function,
|
||||
},
|
||||
fecthInsigniaByOc: {
|
||||
type: Function,
|
||||
},
|
||||
});
|
||||
|
||||
const organization = ref<string>("1");
|
||||
const organizationOptions = ref<any>([{ id: "1", name: "ทั้งหมด" }]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"citizenId",
|
||||
|
|
@ -173,6 +193,50 @@ const rows = ref<any[]>([
|
|||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
]);
|
||||
onMounted(async () => {
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
if (organization.value !== "" || organization.value !== undefined) {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
const changtypeOc = () => {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
};
|
||||
// const fecthInsigniaAll = async () => {
|
||||
// let data: any = [];
|
||||
// for (const item of DataStore.optionsTypeOc) {
|
||||
// await http
|
||||
// .get(
|
||||
// config.API.insigniaList(props.roundId, item["id"], "officer", props.tab)
|
||||
// )
|
||||
// .then((res) => {
|
||||
// // console.log(res);
|
||||
// data.push(res.data.result);
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// console.log(err);
|
||||
// });
|
||||
// }
|
||||
// console.log(data);
|
||||
// };
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
|
|
@ -212,6 +276,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<!-- <div>
|
||||
<q-btn size="md" icon="mdi-download" flat round color="primary">
|
||||
|
|
|
|||
|
|
@ -1,8 +1,28 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useInsigniaDataStore } from "@/modules/07_insignia/store";
|
||||
|
||||
const organization = ref<string>(1);
|
||||
const organizationOptions = ref<any>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
const DataStore = useInsigniaDataStore();
|
||||
|
||||
const props = defineProps({
|
||||
tab: {
|
||||
type: String,
|
||||
},
|
||||
roundId: {
|
||||
type: String,
|
||||
},
|
||||
fecthInsigniaAll: {
|
||||
type: Function,
|
||||
},
|
||||
fecthInsigniaByOc: {
|
||||
type: Function,
|
||||
},
|
||||
});
|
||||
|
||||
const organization = ref<string>("1");
|
||||
const organizationOptions = ref<any>([{ id: "1", name: "ทั้งหมด" }]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"citizenId",
|
||||
|
|
@ -172,6 +192,33 @@ const rows = ref<any[]>([
|
|||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
]);
|
||||
onMounted(async () => {
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
if (organization.value !== "" || organization.value !== undefined) {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
const changtypeOc = () => {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
|
|
@ -211,6 +258,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<!-- <div>
|
||||
<q-btn size="md" icon="mdi-download" flat round color="primary">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,13 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError } = mixin;
|
||||
|
||||
const organization = ref<string>(1);
|
||||
const organizationOptions = ref<any>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
|
|
@ -176,6 +184,25 @@ const rows = ref<any[]>([
|
|||
},
|
||||
]);
|
||||
|
||||
onMounted(async () => {
|
||||
await fecthAgency();
|
||||
});
|
||||
|
||||
const fecthAgency = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.insigniaAgency())
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, eer);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
const resetFilter = () => {
|
||||
|
|
|
|||
|
|
@ -37,7 +37,6 @@ const stat = ref<any>({
|
|||
});
|
||||
onMounted(async () => {
|
||||
console.log(DataStore.optionsTypeOc);
|
||||
|
||||
await fecthlistRound();
|
||||
await fecthType();
|
||||
});
|
||||
|
|
@ -54,32 +53,81 @@ const fecthlistRound = async () => {
|
|||
// const lastIndex = optionRound.value.length;
|
||||
const lastValue = optionRound.value[0];
|
||||
round.value = lastValue.id.toString();
|
||||
fecthStat(round.value);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
// messageError($q, err);
|
||||
messageError($q, err);
|
||||
});
|
||||
};
|
||||
const fecthType = async () => {
|
||||
await http
|
||||
.get(config.API.typeOc())
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
optiontypeOc.value = res.data.result.map((e: any) => ({
|
||||
id: e.organizationId,
|
||||
name: e.organizationName,
|
||||
}));
|
||||
console.log(typeof optiontypeOc.value);
|
||||
DataStore.optionsTypeOc = optiontypeOc.value;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
// messageError($q, err);
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = true;
|
||||
});
|
||||
};
|
||||
const fecthStat = async (id: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.insigniaDashboard(id))
|
||||
.then((res) => {
|
||||
stat.value = res.data.result;
|
||||
// console.log(res);
|
||||
console.log(stat.value);
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
const changround = () => {
|
||||
fecthStat(round.value);
|
||||
};
|
||||
const fecthInsigniaAll = async (periodId: string, tab: string) => {
|
||||
// let data: any = [];
|
||||
// for (const item of DataStore.optionsTypeOc) {
|
||||
// await http
|
||||
// .get(config.API.insigniaList(periodId, item["id"], "officer", tab))
|
||||
// .then((res) => {
|
||||
// // console.log(res);
|
||||
// data.push(res.data.result);
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// console.log(err);
|
||||
// });
|
||||
// }
|
||||
// console.log(data);
|
||||
};
|
||||
const fecthInsigniaByOc = async (
|
||||
roundId: string,
|
||||
ocId: string,
|
||||
role: string,
|
||||
status: string
|
||||
) => {
|
||||
console.log(status);
|
||||
await http
|
||||
.get(config.API.insigniaList(roundId, ocId, role, status))
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -97,28 +145,29 @@ const fecthType = async () => {
|
|||
map-options
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
@update:model-value="changround"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 row bg-white">
|
||||
<div class="fit q-px-md q-py-sm">
|
||||
<div class="row col-12 q-col-gutter-md fit">
|
||||
<cardTop
|
||||
:amount="stat.total"
|
||||
:amount="stat.orgAllCount"
|
||||
label="หน่วยงานทั้งหมด"
|
||||
color="#016987"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.sendName"
|
||||
:amount="stat.orgSendCount"
|
||||
label="หน่วยงานที่ส่งรายชื่อเเล้ว"
|
||||
color="#02A998"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.nonSend"
|
||||
:amount="stat.orgNoSendCount"
|
||||
label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ"
|
||||
color="#2EA0FF"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.personSend"
|
||||
:amount="stat.allUserUser"
|
||||
label="จำนวนคนที่ยื่นขอ"
|
||||
color="#4154B3"
|
||||
/>
|
||||
|
|
@ -147,16 +196,31 @@ const fecthType = async () => {
|
|||
<q-separator />
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="pending">
|
||||
<tab1 :tab="tab" :roundId="round" />
|
||||
<tab1
|
||||
:tab="tab"
|
||||
:roundId="round"
|
||||
:fecthInsigniaAll="fecthInsigniaAll"
|
||||
:fecthInsigniaByOc="fecthInsigniaByOc"
|
||||
/>
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="reject">
|
||||
<tab2 :tab="tab" />
|
||||
<tab2
|
||||
:tab="tab"
|
||||
:roundId="round"
|
||||
:fecthInsigniaAll="fecthInsigniaAll"
|
||||
:fecthInsigniaByOc="fecthInsigniaByOc"
|
||||
/>
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="delete">
|
||||
<tab3 :tab="tab" />
|
||||
<tab3
|
||||
:tab="tab"
|
||||
:roundId="round"
|
||||
:fecthInsigniaAll="fecthInsigniaAll"
|
||||
:fecthInsigniaByOc="fecthInsigniaByOc"
|
||||
/>
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="organization">
|
||||
<tab4 :tab="tab" />
|
||||
<tab4 :tab="tab" :roundId="round" />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-card>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue