hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Merge branch 'develop' into devTee

Browse source 
# Conflicts:
#	src/api/15_development/api.development.ts
#	src/modules/15_development/interface/index/Main.ts
#	src/modules/15_development/interface/request/Main.ts
This commit is contained in:
STW_TTTY\stwtt 2024-04-03 17:13:53 +07:00
commit 5c1747262f
12 changed files with 210 additions and 98 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/modules/04_registry/components/TableProfile.vue
View file

@ -14,8 +14,8 @@
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:pagination="scope">
ทั้งหมด {{ props.total }} รายการ
<template v-slot:pagination="scope">
ทั้งหมด {{ props.total }} รายการ
<q-pagination
v-model="currentPage"
active-color="primary"
@ -24,7 +24,8 @@
size="sm"
boundary-links
direction-links
></q-pagination>
:max-pages="5"
></q-pagination>
</template>
<template v-slot:top="props">
@ -450,7 +451,7 @@
<PopupADdEmployee v-model:modal="modalEmployee" />
</template>
<script setup lang="ts">
import { ref, useAttrs, reactive,watch } from "vue";
import { ref, useAttrs, reactive, watch } from "vue";
import type { Pagination } from "@/modules/04_registry/interface/index/Main";
import type { DataOption } from "@/modules/04_registry/components/profileType";
import PopupHistory from "./PopupHistory.vue";
@ -461,7 +462,6 @@ const maxPage = ref<number>(1);
const page = ref<number>(1);
const rowsPerPage = ref<number>(50);
const attrs = ref<any>(useAttrs());
const table = ref<any>(null);
const filterRef = ref<any>(null);
@ -470,7 +470,7 @@ const searchPanel = ref<boolean>(true);
/**
*pagination ของตาราง
*/
const pagination = ref({
const pagination = ref({
descending: false,
page: page.value,
rowsPerPage: rowsPerPage.value,
@ -681,11 +681,14 @@ watch(
}
);
watch(()=>props.page,()=>{
if(props.page){
currentPage.value = props.page
watch(
() => props.page,
() => {
if (props.page) {
currentPage.value = props.page;
}
}
})
);
</script>
<style lang="scss">
.icon-color {

39
src/modules/04_registryNew/components/TableView.vue
View file

@ -22,6 +22,7 @@ const props = defineProps({
rows: { type: Array },
fetchData: { type: Function },
fetchType: { type: Function },
total: { type: Number },
});
const columns = ref<QTableProps["columns"]>([
@ -74,7 +75,7 @@ const columns = ref<QTableProps["columns"]>([
align: "left",
label: "สายงาน",
sortable: true,
field: (v) => (v.posType ? v.posType.posTypeName : "-"),
field: "posType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -85,7 +86,7 @@ const columns = ref<QTableProps["columns"]>([
align: "left",
label: "ระดับตำแหน่ง",
sortable: true,
field: (v) => (v.posLevel ? v.posLevel.posLevelName : "-"),
field: "posLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -282,12 +283,8 @@ watch(
</q-tr>
</template>
<template v-slot:body="props" v-if="store.mode === 'table'">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.id"
@click="onClickViewDetail(props.row.id)"
>
<q-tr :props="props">
<q-td v-for="col in props.cols" :key="col.id">
<div v-if="col.name === 'no'">
{{
(formFilter.page - 1) * formFilter.pageSize + props.rowIndex + 1
@ -311,7 +308,11 @@ watch(
</q-avatar>
</q-item-section>
<q-item-section>
<div class="text-weight-medium">
<div
class="text-weight-medium text-primary cursor-pointer"
@click="onClickViewDetail(props.row.id)"
>
<q-tooltip>ดูทะเบียนประวัติ</q-tooltip>
{{
`${props.row.prefix}${props.row.firstName} ${props.row.lastName}`
}}
@ -329,18 +330,13 @@ watch(
</template>
<template v-slot:item="props" v-else>
<div class="col-xs-12 col-sm-4 col-md-3">
<q-card
flat
bordered
class="cardRO"
@click="onClickViewDetail(props.row.id)"
>
<q-card flat bordered class="">
<q-card-section class="text-center q-pb-none">
<q-avatar size="80px">
<img src="@/assets/avatar_user.jpg" />
</q-avatar>
<div class="text-weight-medium q-mt-md textName">
<div class="text-weight-medium q-mt-md">
{{
`${props.row.prefix}${props.row.firstName} ${props.row.lastName}`
}}
@ -384,7 +380,7 @@ watch(
<q-item-section>
<q-item-label caption class="text-black">
{{
props.row.posType ? props.row.posType.posTypeName : "-"
props.row.posType ? props.row.posType : "-"
}}</q-item-label
>
</q-item-section>
@ -397,9 +393,7 @@ watch(
<q-item-section>
<q-item-label caption class="text-black">
{{
props.row.posLevel
? props.row.posLevel.posLevelName
: "-"
props.row.posLevel ? props.row.posLevel : "-"
}}</q-item-label
>
</q-item-section>
@ -407,18 +401,19 @@ watch(
</q-list>
</q-card>
</q-card-section>
<!-- <q-separator inset />
<q-separator inset />
<q-btn
flat
color="black"
label="ดูเพิ่มเติม"
class="hover-button full-width q-pa-md"
@click="onClickViewDetail(props.row.id)"
/> -->
/>
</q-card>
</div>
</template>
<template v-slot:pagination="scope">
ทั้งหมด {{ props.total }} รายการ
<q-pagination
v-model="formFilter.page"
active-color="primary"

3
src/modules/04_registryNew/views/list.vue
View file

@ -109,6 +109,7 @@ function fetchYearOption() {
}
}
const total = ref<number>(0);
async function fetchDataPerson(search: boolean = false) {
showLoader();
@ -150,6 +151,7 @@ async function fetchDataPerson(search: boolean = false) {
.then((res) => {
maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
dataPersonMain.value = res.data.result.data;
total.value = res.data.result.total;
})
.catch((err) => {
messageError($q, err);
@ -603,6 +605,7 @@ onMounted(async () => {
v-model:maxPage="maxPage"
:fetchData="fetchDataPerson"
:fetchType="fetchType"
:total="total"
/>
</q-card-section>
</q-card>

35
src/modules/13_salary/components/SalaryEmployeeLists/TableTypeOther.vue
View file

@ -94,6 +94,27 @@ const columns = ref<QTableProps["columns"]>([
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "group",
align: "left",
label: "ผังค่าจ้าง(เดิม)",
sortable: false,
field: "group",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format(val, row) {
return val ? "กลุ่ม" + val : "-";
},
},
{
name: "salaryLevel",
align: "left",
label: "ขั้น(เดิม)",
sortable: false,
field: "salaryLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "amount",
align: "left",
@ -140,6 +161,8 @@ const visibleColumns = ref<string[]>([
"position",
"posType",
"posLevel",
"group",
"salaryLevel",
"amount",
"amountUse",
"positionSalaryAmount",
@ -283,7 +306,7 @@ watch(
store.roundMainCode === 'OCT'
? columns
: columns
? columns.slice(0, 10)
? columns.slice(0, 11)
: []
"
option-value="name"
@ -299,7 +322,7 @@ watch(
store.roundMainCode === 'OCT'
? columns
: columns
? columns.slice(0, 10)
? columns.slice(0, 11)
: []
"
:rows="props.rows"
@ -382,16 +405,12 @@ watch(
}}
</div>
<div
v-else-if="
col.name === 'isRetired' && store.roundMainCode === 'OCT'
"
>
<div v-else-if="col.name === 'isRetired'">
<q-icon
name="check"
color="primary"
size="24px"
v-if="props.row.isRetired"
v-if="props.row.isRetired && store.roundMainCode === 'OCT'"
/>
</div>

23
src/modules/13_salary/components/SalaryEmployeeLists/TableTypePending.vue
View file

@ -89,6 +89,27 @@ const columns = ref<QTableProps["columns"]>([
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "group",
align: "left",
label: "ผังค่าจ้าง(เดิม)",
sortable: false,
field: "group",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format(val, row) {
return val ? "กลุ่ม" + val : "-";
},
},
{
name: "salaryLevel",
align: "left",
label: "ขั้น(เดิม)",
sortable: false,
field: "salaryLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "amount",
align: "left",
@ -176,6 +197,8 @@ const visibleColumns = ref<string[]>([
"isSuspension",
"isAbsent",
"isLeave",
"group",
"salaryLevel",
]);
/** modalDialog*/

8
src/modules/13_salary/components/SalaryLists/TableTypeOther.vue
View file

@ -392,16 +392,12 @@ watch(
}}
</div>
<div
v-else-if="
col.name === 'isRetired' && store.roundMainCode === 'OCT'
"
>
<div v-else-if="col.name === 'isRetired'">
<q-icon
name="check"
color="primary"
size="24px"
v-if="props.row.isRetired"
v-if="props.row.isRetired && store.roundMainCode === 'OCT'"
/>
</div>

16
src/modules/15_development/interface/index/Main.ts
View file

@ -22,4 +22,18 @@ interface FormFilter {
isProbation: boolean | null;
}
export type { DataOption, DataOptionCheckBox,FormFilter };
interface ItemsMenu {
label: string;
value: string;
icon: string;
color: string;
}
interface NewPagination {
descending: boolean;
page: number;
rowsPerPage: number;
sortBy: string;
}
export type { DataOption, DataOptionCheckBox, ItemsMenu, NewPagination ,FormFilter};

6
src/modules/15_development/interface/request/Main.ts
View file

@ -1,5 +1,7 @@
interface FormQueryProject {
interface FormQueryListProject {
year: number;
page: number;
pageSize: number;
keyword: string;
}
@ -94,7 +96,7 @@ interface FormAddHistoryProject {
}
export type {
FormQueryProject,
FormQueryListProject,
FormBasicinfo,
FormGroupTarget,
FormGroupRelate,

8
src/modules/15_development/interface/response/Main.ts
View file

@ -14,4 +14,10 @@ interface ResLevel {
posLevelAuthority: string;
}
export type { ResGroup, ResLevel };
interface ResListProject {
id: string;
projectName: string;
year: number;
}
export type { ResGroup, ResLevel, ResListProject };

13
src/modules/15_development/store/developmentStore.ts
View file

@ -1,23 +1,16 @@
import { defineStore } from "pinia";
import { reactive } from "vue";
import { ref } from 'vue'
import type { FormQueryProject } from "@/modules/15_development/interface/request/Main";
import { ref } from "vue";
import type { QTableProps } from "quasar";
// store
export const useDevelopmentDataStore = defineStore(
"developmentDataStore",
() => {
const formFilter = reactive<FormQueryProject>({
year: new Date().getFullYear(),
keyword: "",
});
const visibleColumns = ref<string[]>([]);
const columns = ref<QTableProps["columns"]>([]);
const rows = ref<any[]>([])
const rows = ref<any[]>([]);
return {
formFilter,
visibleColumns,
columns,
rows,

132
src/modules/15_development/views/MainPage.vue
View file

@ -1,20 +1,27 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ref, onMounted, reactive, watch } from "vue";
import { useQuasar, type QTableProps } from "quasar";
import { useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
/**importType*/
import type {
ItemsMenu,
NewPagination,
} from "@/modules/15_development/interface/index/Main";
import type { FormQueryListProject } from "@/modules/15_development/interface/request/Main";
import type { ResListProject } from "@/modules/15_development/interface/response/Main";
/** importStore*/
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const store = useDevelopmentDataStore();
const $q = useQuasar();
const router = useRouter();
const { showLoader, hideLoader } = useCounterMixin();
const { showLoader, hideLoader, messageError } = useCounterMixin();
/** หัวตาราง */
const rows = ref<any>([]);
const columns = ref<QTableProps["columns"]>([
{
name: "year",
@ -23,16 +30,17 @@ const columns = ref<QTableProps["columns"]>([
sortable: true,
field: "year",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
style: "font-size: 14px ;width: 10%",
format: (val) => val + 543,
},
{
name: "name",
name: "projectName",
align: "left",
label: "ชื่อโครงการ/กิจกรรม/หลักสูตร",
sortable: true,
field: "name",
field: "projectName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
style: "font-size: 14px;width: 45%",
},
{
@ -42,12 +50,13 @@ const columns = ref<QTableProps["columns"]>([
sortable: true,
field: "org",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
style: "font-size: 14px ;width: 45%",
},
]);
const visibleColumns = ref<string[]>(["year", "name", "org"]);
const visibleColumns = ref<string[]>(["year", "projectName", "org"]);
const itemDownload = ref<any>([
/** เมนูดาวน์โหลด*/
const itemDownload = ref<ItemsMenu[]>([
{
label: "ดาวน์โหลด 1",
value: "",
@ -68,32 +77,63 @@ const itemDownload = ref<any>([
},
]);
/** formQuery*/
const formQuery = reactive<FormQueryListProject>({
year: new Date().getFullYear(),
page: 1,
pageSize: 10,
keyword: "",
});
const totalList = ref<number>(1); //จำนวนข้อมูลรายการ
const rows = ref<ResListProject[]>([]); // ข้อมูลรายการ
/** funciton fetch รายการโครงการ*/
function fetchListProject() {
showLoader();
const data = [
{
id: "1",
year: 2567,
name: "โครงการฝึกอบรมสำนักงานข้าราชการ",
org: "สำนักงานข้าราชการ/กองบริหารทั่วไป/กลุ่มงานช่วยนักบริหาร",
},
{
id: "2",
year: 2567,
name: "โครงการฝึกอบรม",
org: "สำนักงานข้าราชการ/กองบริหารทั่วไป/กลุ่มงานช่วยนักบริหาร",
},
];
rows.value = data;
setTimeout(() => {
hideLoader();
}, 500);
http
.get(
config.API.developmentMain +
`?page=${formQuery.page}&pageSize=${formQuery.pageSize}&keyword=${formQuery.keyword}&year=${formQuery.year}`
)
.then((res) => {
const data = res.data.result.data;
totalList.value = Math.ceil(res.data.result.total / formQuery.pageSize);
rows.value = data;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
/**
* funciotn redirect to page เพิ่มหริอแก้ไข รายการโครงการ
* @param status สถานะแก่ไข
* @param id รายการโครงการ
*/
function onClickAddOrView(status: boolean = false, id: string = "") {
status ? router.push(`development/${id}`) : router.push("development/add");
}
/**
* function updatePagination
* @param newPagination ข้อมูล Pagination ใหม่
*/
function updatePagination(newPagination: NewPagination) {
formQuery.page = 1;
formQuery.pageSize = newPagination.rowsPerPage;
}
/** callbackFunction ทำเมื่อมีการอัปเดท pageSize*/
watch(
() => formQuery.pageSize,
() => {
fetchListProject();
}
);
onMounted(() => {
fetchListProject();
});
@ -107,11 +147,12 @@ onMounted(() => {
<q-toolbar style="padding: 0px">
<datepicker
menu-class-name="modalfix"
v-model="store.formFilter.year"
v-model="formQuery.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="fetchListProject"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
@ -122,7 +163,7 @@ onMounted(() => {
dense
lazy-rules
outlined
:model-value="Number(store.formFilter.year) + 543"
:model-value="Number(formQuery.year) + 543"
:label="`${'ปีงบประมาณ'}`"
>
<template v-slot:prepend>
@ -172,19 +213,19 @@ onMounted(() => {
<q-input
standout
dense
v-model="store.formFilter.keyword"
v-model="formQuery.keyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
@keyup.enter="fetchListProject"
>
<template v-slot:append>
<q-icon v-if="store.formFilter.keyword == ''" name="search" />
<q-icon v-if="formQuery.keyword == ''" name="search" />
<q-icon
v-if="store.formFilter.keyword !== ''"
v-if="formQuery.keyword !== ''"
name="clear"
class="cursor-pointer"
@click="store.formFilter.keyword = ''"
@click="(formQuery.keyword = ''), fetchListProject()"
/>
</template>
</q-input>
@ -212,12 +253,14 @@ onMounted(() => {
ref="table"
:columns="columns"
:rows="rows"
row-key="subject"
row-key="id"
flat
bordered
dense
class="custom-header-table"
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="visibleColumns"
@update:pagination="updatePagination"
>
<template v-slot:header="props">
<q-tr :props="props">
@ -240,6 +283,19 @@ onMounted(() => {
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="formQuery.page"
active-color="primary"
color="dark"
:max="Number(totalList)"
size="sm"
boundary-links
direction-links
:max-pages="5"
@update:model-value="fetchListProject"
></q-pagination>
</template>
</d-table>
</div>
</q-card>