fix: สรรหา ปรับ pagin /โครงสร้าง ปิดดาวโหลดได้เเค่ root ปรับข้อความ

This commit is contained in:
setthawutttty 2025-09-10 11:08:18 +07:00
parent e4bdf45beb
commit 8263697759
8 changed files with 162 additions and 58 deletions

View file

@ -576,7 +576,9 @@ const dataCondition = ref<DataPositionCondition>();
function onClickCodition(data: PosMaster2) { function onClickCodition(data: PosMaster2) {
dataCondition.value = { dataCondition.value = {
conditionReason: data.conditionReason, conditionReason: data.conditionReason
? data.conditionReason.replace(/ /g, " \n")
: "",
id: data.id, id: data.id,
isCondition: data.isCondition, isCondition: data.isCondition,
orgShortname: data.orgShortname, orgShortname: data.orgShortname,
@ -600,7 +602,7 @@ async function fetchDataCondition() {
} }
function onClickAction(type: string, data: PosMaster2) { function onClickAction(type: string, data: PosMaster2) {
console.log(data);
switch (type) { switch (type) {
case "EDIT": case "EDIT":
onClickPosition(type, data.id, data); onClickPosition(type, data.id, data);
@ -698,7 +700,14 @@ watch(
</div> </div>
<!-- v-if="store.typeOrganizational === 'draft'" --> <!-- v-if="store.typeOrganizational === 'draft'" -->
<q-btn flat round dense color="deep-purple" icon="save_alt"> <q-btn
v-if="orgLevel == 0"
flat
round
dense
color="deep-purple"
icon="save_alt"
>
<q-menu> <q-menu>
<q-list <q-list
dense dense
@ -955,35 +964,36 @@ watch(
}} }}
</div> </div>
<div v-else-if="col.name == 'positionIsSelected'"> <div v-else-if="col.name == 'positionIsSelected'">
{{ <div class="row text-html items-center">
props.row.positionIsSelected {{
? props.row.positionIsSelected props.row.positionIsSelected
: "-" ? props.row.positionIsSelected
}} : "-"
{{ }}
props.row.isCondition && props.row.conditionReason {{
? `(${props.row.conditionReason})` props.row.isCondition && props.row.conditionReason
: "" ? `(${props.row.conditionReason})`
}} : ""
}}
<q-btn <q-btn
v-if="props.row.positionIsSelected != 'ว่าง'" v-if="props.row.positionIsSelected != 'ว่าง'"
size="12px" size="12px"
dense dense
flat flat
icon="info" icon="info"
color="info" color="info"
round round
@click=" @click="
(modalPerson = true), (modalPerson = true),
(personalId = (personalId =
store.typeOrganizational === 'draft' store.typeOrganizational === 'draft'
? props.row.next_holderId ? props.row.next_holderId
: props.row.current_holderId) : props.row.current_holderId)
" "
> >
<q-tooltip>อมลในทะเบยนประว</q-tooltip> <q-tooltip>อมลในทะเบยนประว</q-tooltip>
</q-btn> </q-btn>
</div>
</div> </div>
<div v-else> <div v-else>
{{ col.value ? col.value : "-" }} {{ col.value ? col.value : "-" }}

View file

@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { checkPermission } from "@/utils/permissions"; import { checkPermission } from "@/utils/permissions";
import { ref, useAttrs } from "vue"; import { ref, useAttrs, watch } from "vue";
import type { Pagination } from "@/modules/03_recruiting/interface/index/Main"; import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
const attrs = ref<any>(useAttrs()); const attrs = ref<any>(useAttrs());
@ -8,13 +8,17 @@ const table = ref<any>(null);
const filterRef = ref<any>(null); const filterRef = ref<any>(null);
const filter = defineModel<string>("filter", { required: true }); const filter = defineModel<string>("filter", { required: true });
const pagination = defineModel<Pagination>('pagination',{required:true}) const pagination = defineModel<Pagination>("pagination", { required: true });
const props = defineProps({ const props = defineProps({
onSearch: Function, onSearch: Function,
fetchData: Function,
count: Number, count: Number,
totalList: Number,
pass: Number, pass: Number,
notpass: Number, notpass: Number,
missed_exam: Number,
other: Number,
inputfilter: String, inputfilter: String,
name: String, name: String,
@ -44,9 +48,7 @@ const emit = defineEmits([
"update:inputvisible", "update:inputvisible",
"update:editvisible", "update:editvisible",
]); ]);
const updateInput = (value: string | number | null) => {
emit("update:inputfilter", value);
};
const updateVisible = (value: []) => { const updateVisible = (value: []) => {
emit("update:inputvisible", value); emit("update:inputvisible", value);
}; };
@ -66,11 +68,23 @@ function checkAdd() {
props.add(); props.add();
} }
/** reset ฟิลเตอร์ ที่ ค้นหา */ function updatePagination(newPagination: any) {
function resetFilter() { if (!props.nornmalData) {
emit("update:inputfilter", ""); pagination.value.page = 1;
filterRef.value.focus(); pagination.value.rowsPerPage = newPagination.rowsPerPage;
}
} }
function getList() {
props.fetchData?.();
}
watch(
() => pagination.value.rowsPerPage,
async () => {
getList();
}
);
</script> </script>
<template> <template>
<div class="q-pb-sm row q-col-gutter-sm"> <div class="q-pb-sm row q-col-gutter-sm">
@ -96,8 +110,8 @@ function resetFilter() {
<q-space /> <q-space />
<q-badge <q-badge
color="white" color="white"
class="text-weight-bold text-subtitle1 text-primary" class="text-weight-bold text-subtitle1 text-blue-7"
:label="`${count}`" :label="`${count?.toLocaleString()}`"
rounded rounded
/> />
</div> </div>
@ -108,8 +122,8 @@ function resetFilter() {
<q-space /> <q-space />
<q-badge <q-badge
color="white" color="white"
class="text-weight-bold text-subtitle1 text-blue" class="text-weight-bold text-subtitle1 text-primary"
:label="`${pass}`" :label="`${pass?.toLocaleString()}`"
rounded rounded
/> />
</div> </div>
@ -122,7 +136,41 @@ function resetFilter() {
<q-badge <q-badge
color="white" color="white"
class="text-weight-bold text-subtitle1 text-pink" class="text-weight-bold text-subtitle1 text-pink"
:label="`${notpass}`" :label="`${notpass?.toLocaleString()}`"
rounded
/>
</div>
</q-card>
<q-card
v-if="missed_exam && missed_exam !== 0"
bordered
flat
class="q-px-md no-wrap row"
>
<div class="col-12 text-subtitle2 row items-center">
<span class="text-weight-medium text-dark">ขาดสอบ</span>
<q-space />
<q-badge
color="white"
class="text-weight-bold text-subtitle1 text-orange"
:label="`${missed_exam?.toLocaleString()}`"
rounded
/>
</div>
</q-card>
<q-card
v-if="other && other !== 0"
bordered
flat
class="q-px-md no-wrap row"
>
<div class="col-12 text-subtitle2 row items-center">
<span class="text-weight-medium text-dark"> </span>
<q-space />
<q-badge
color="white"
class="text-weight-bold text-subtitle1 text-info"
:label="`${other?.toLocaleString()}`"
rounded rounded
/> />
</div> </div>
@ -175,8 +223,8 @@ function resetFilter() {
:virtual-scroll-sticky-size-start="48" :virtual-scroll-sticky-size-start="48"
dense dense
:pagination-label="paginationLabel" :pagination-label="paginationLabel"
v-model:pagination="pagination" :rows-per-page-options="nornmalData ? [0] : [1, 25, 50, 100]"
:rows-per-page-options="[0]" @update:pagination="updatePagination"
> >
<template v-slot:header="props"> <template v-slot:header="props">
<q-tr :props="props"> <q-tr :props="props">
@ -189,6 +237,20 @@ function resetFilter() {
<template #body="props"> <template #body="props">
<slot v-bind="props" name="columns"></slot> <slot v-bind="props" name="columns"></slot>
</template> </template>
<template v-if="!nornmalData" v-slot:pagination="scope">
งหมด {{ props.count && props.count.toLocaleString() }} รายการ
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
:max="totalList"
size="sm"
boundary-links
direction-links
:max-pages="5"
@update:model-value="getList"
></q-pagination>
</template>
</d-table> </d-table>
</template> </template>

View file

@ -1,5 +1,6 @@
import { ref } from "vue"; import { ref } from "vue";
interface Pagination { interface Pagination {
page: number;
rowsPerPage: number; rowsPerPage: number;
sortBy?: string; sortBy?: string;
} }

View file

@ -22,15 +22,19 @@ const { messageError, success, showLoader, hideLoader, onSearchDataTable } =
mixin; mixin;
const initialPagination = ref<Pagination>({ const initialPagination = ref<Pagination>({
rowsPerPage: 0, page:1,
rowsPerPage: 10,
sortBy: "year", sortBy: "year",
}); });
const year = ref<string>(""); const year = ref<string>("");
const round = ref<string>(""); const round = ref<string>("");
const name = ref<string>(""); const name = ref<string>("");
const count = ref<number>(0); const count = ref<number>(0);
const totalList = ref<number>(0);
const pass = ref<number>(0); const pass = ref<number>(0);
const notpass = ref<number>(0); const notpass = ref<number>(0);
const missed_exam = ref<number>(0);
const other = ref<number>(0);
const rows = ref<any[]>([]); const rows = ref<any[]>([]);
const rowsData = ref<any[]>([]); const rowsData = ref<any[]>([]);
const importId = ref<string>(route.params.id as string); // Period Import Id const importId = ref<string>(route.params.id as string); // Period Import Id
@ -352,6 +356,8 @@ async function fetchData() {
.post(config.API.getExamResultById(importId.value), { .post(config.API.getExamResultById(importId.value), {
examAttribute: "", examAttribute: "",
examResult: "", examResult: "",
page:initialPagination.value.page,
pageSize:initialPagination.value.rowsPerPage,
}) })
.then((res) => { .then((res) => {
let header = res.data.result.header; let header = res.data.result.header;
@ -359,6 +365,11 @@ async function fetchData() {
count.value = header.count; count.value = header.count;
pass.value = header.pass; pass.value = header.pass;
notpass.value = header.notpass; notpass.value = header.notpass;
missed_exam.value = header.missed_exam;
other.value = header.other;
totalList.value = Math.ceil(
header.count / initialPagination.value.rowsPerPage
);
if (period != null) { if (period != null) {
name.value = period.name; name.value = period.name;
round.value = period.order; round.value = period.order;
@ -483,6 +494,8 @@ onMounted(async () => {
:count="count" :count="count"
:pass="pass" :pass="pass"
:notpass="notpass" :notpass="notpass"
:missed_exam="missed_exam"
:other="other"
:rows="rows" :rows="rows"
:columns="columns" :columns="columns"
v-model:filter="filter" v-model:filter="filter"
@ -490,9 +503,11 @@ onMounted(async () => {
:visible-columns="visibleColumns" :visible-columns="visibleColumns"
v-model:inputfilter="filter" v-model:inputfilter="filter"
v-model:inputvisible="visibleColumns" v-model:inputvisible="visibleColumns"
v-model:totalList="totalList"
v-model:pagination="initialPagination" v-model:pagination="initialPagination"
:nornmalData="false" :nornmalData="false"
:conclude="true" :conclude="true"
:fetchData="fetchData"
> >
<template #columns="props"> <template #columns="props">
<q-tr :props="props" class="cursor-pointer"> <q-tr :props="props" class="cursor-pointer">

View file

@ -64,6 +64,7 @@ const textTittleResult = ref<string>("");
const rows = ref<ResponseRecruitPeriod[]>([]); const rows = ref<ResponseRecruitPeriod[]>([]);
const rowsData = ref<ResponseRecruitPeriod[]>([]); const rowsData = ref<ResponseRecruitPeriod[]>([]);
const initialPagination = ref<Pagination>({ const initialPagination = ref<Pagination>({
page: 0,
rowsPerPage: 0, rowsPerPage: 0,
sortBy: "year", sortBy: "year",
}); });
@ -646,7 +647,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลสมครสอบ</q-tooltip> <q-tooltip>นำเขาไฟลสมครสอบ</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ col.value }} {{ col.value.toLocaleString() }}
<q-btn <q-btn
v-if="checkPermission($route)?.attrIsUpdate" v-if="checkPermission($route)?.attrIsUpdate"
@ -693,7 +694,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลญชรวมคะแนน</q-tooltip> <q-tooltip>นำเขาไฟลญชรวมคะแนน</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ props.row.score.scoreCount }} {{ props.row.score.scoreCount.toLocaleString() }}
<q-btn <q-btn
:disable="props.row.examCount == 0" :disable="props.row.examCount == 0"
flat flat
@ -730,7 +731,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลผลการสอบ (ญชรายช)</q-tooltip> <q-tooltip>นำเขาไฟลผลการสอบ (ญชรายช)</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ props.row.score.resultCount }} {{ props.row.score.resultCount.toLocaleString() }}
<q-btn <q-btn
v-if="checkPermission($route)?.attrIsUpdate" v-if="checkPermission($route)?.attrIsUpdate"
dense dense

View file

@ -26,6 +26,7 @@ const year = ref<string>("2566");
const round = ref<string>("1"); const round = ref<string>("1");
const name = ref<string>(""); const name = ref<string>("");
const initialPagination = ref<Pagination>({ const initialPagination = ref<Pagination>({
page: 1,
rowsPerPage: 0, rowsPerPage: 0,
sortBy: "examID", sortBy: "examID",
}); });
@ -33,6 +34,10 @@ const initialPagination = ref<Pagination>({
const count = ref<number>(0); const count = ref<number>(0);
const pass = ref<number>(0); const pass = ref<number>(0);
const notpass = ref<number>(0); const notpass = ref<number>(0);
const missed_exam = ref<number>(0);
const other = ref<number>(0);
const totalList = ref<number>(0);
const importId = ref<string>(route.params.id as string); // Period Import Id const importId = ref<string>(route.params.id as string); // Period Import Id
const filter = ref<string>(""); //search data table const filter = ref<string>(""); //search data table
@ -293,6 +298,8 @@ async function fetchData() {
.post(config.API.getDisableExamResultById(importId.value), { .post(config.API.getDisableExamResultById(importId.value), {
examAttribute: "", examAttribute: "",
examResult: "", examResult: "",
page: initialPagination.value.page,
pageSize: initialPagination.value.rowsPerPage,
}) })
.then((res) => { .then((res) => {
var _data = res.data.result; var _data = res.data.result;
@ -300,7 +307,11 @@ async function fetchData() {
count.value = header.count; count.value = header.count;
pass.value = header.pass; pass.value = header.pass;
notpass.value = header.notpass; notpass.value = header.notpass;
missed_exam.value = header.missed_exam;
other.value = header.other;
totalList.value = Math.ceil(
header.count / initialPagination.value.rowsPerPage
);
const data = res.data.result.data; const data = res.data.result.data;
let result: RecruitDetailResponse[] = []; let result: RecruitDetailResponse[] = [];
if (data.length > 0) { if (data.length > 0) {
@ -422,6 +433,9 @@ onMounted(async () => {
:count="count" :count="count"
:pass="pass" :pass="pass"
:notpass="notpass" :notpass="notpass"
:missed_exam="missed_exam"
:other="other"
v-model:totalList="totalList"
:rows="rows" :rows="rows"
:columns="columns" :columns="columns"
v-model:filter="filter" v-model:filter="filter"
@ -432,6 +446,7 @@ onMounted(async () => {
v-model:inputvisible="visibleColumns" v-model:inputvisible="visibleColumns"
:nornmalData="false" :nornmalData="false"
:conclude="true" :conclude="true"
:fetchData="fetchData"
> >
<template #columns="props"> <template #columns="props">
<q-tr :props="props" class="cursor-pointer"> <q-tr :props="props" class="cursor-pointer">

View file

@ -50,7 +50,7 @@ async function fetchData() {
await http await http
.get(config.API.getDisableExamDetail(importId.value, examId.value)) .get(config.API.getDisableExamDetail(importId.value, examId.value))
.then((res) => { .then((res) => {
let data = res.data.result.data; let data = res.data.result;
if (data != null) { if (data != null) {
profile_id.value = data.profileID; profile_id.value = data.profileID;
examID.value = data.examID; examID.value = data.examID;
@ -82,7 +82,7 @@ async function fetchData() {
scoreD.value = data.scoreResult.scoreD; scoreD.value = data.scoreResult.scoreD;
} }
} else { } else {
dialogMessageNotify($q, "แข่งขัน ไม่พบข้อมูล"); dialogMessageNotify($q, "คัดเลือก ไม่พบข้อมูล");
} }
}) })
.catch((e) => { .catch((e) => {

View file

@ -595,7 +595,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลสมครสอบ</q-tooltip> <q-tooltip>นำเขาไฟลสมครสอบ</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ col.value }} {{ col.value.toLocaleString() }}
<q-btn <q-btn
v-if="checkPermission($route)?.attrIsUpdate" v-if="checkPermission($route)?.attrIsUpdate"
@ -642,7 +642,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลผลคะแนนสอบ</q-tooltip> <q-tooltip>นำเขาไฟลผลคะแนนสอบ</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ col.value }} {{ props.row.score.scoreCount.toLocaleString() }}
<q-btn <q-btn
v-if="checkPermission($route)?.attrIsUpdate" v-if="checkPermission($route)?.attrIsUpdate"
dense dense
@ -676,7 +676,7 @@ onMounted(async () => {
<q-tooltip>นำเขาไฟลผลการสอบ (ญชรายช)</q-tooltip> <q-tooltip>นำเขาไฟลผลการสอบ (ญชรายช)</q-tooltip>
</q-btn> </q-btn>
<div v-else> <div v-else>
{{ props.row.score.resultCount }} {{ props.row.score.resultCount.toLocaleString() }}
<q-btn <q-btn
v-if="checkPermission($route)?.attrIsUpdate" v-if="checkPermission($route)?.attrIsUpdate"
dense dense