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

ทะเบียนประวัติ ==> ข้อมูลตำแหน่ง

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2025-02-26 14:25:06 +07:00
parent 3d527561c5
commit 3e17d3a25a
4 changed files with 198 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/modules/21_report/components/CardPosition.vue Normal file
View file

@ -0,0 +1,67 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
/** props*/
const props = defineProps({
id: {
type: String,
requier: true,
},
type: { type: String, default: "" },
});
const cardData = ref<any[]>([
{
label: "ระยะเวลาดำรงตำแหน่งในสายงาน",
data: [
{ name: "ตำแหน่ง", time: "1 ปี" },
{ name: "ตำแหน่ง", time: "1 ปี" },
{ name: "ตำแหน่ง", time: "1 ปี" },
{ name: "ตำแหน่ง", time: "1 ปี" },
{ name: "ตำแหน่ง", time: "1 ปี" },
],
},
{
label: "ระยะเวลาดำรงตำแหน่งตามระดับ",
data: [{ name: "ละดับ", time: "1 ปี" }],
},
{
label: "ระยะเวลาดำรงตำแหน่งทางการบริหาร",
data: [{ name: "ตำแหน่งทางการบริหาร", time: "1 ปี" }],
},
]);
onMounted(() => {
console.log(props.id);
console.log(props.type);
});
</script>
<template>
<div class="q-pa-md">
<div class="text-weight-bold row items-center">
<q-icon name="mdi-account-tie" color="grey-7" />
<span class="q-ml-md">ข้อมูลตำแหน่ง </span>
</div>
<div class="row q-pa-sm">
<q-list flat bordered class="col-12" style="border-radius: 5px;">
<q-card flat v-for="(item, index) in cardData" :key="index">
<q-item>
<q-item-section>
<q-item-label class="text-grey-6">{{ item.label }}</q-item-label>
<q-item-label
><li v-for="data in item.data" :key="data.id">
{{ data.name }} {{ data.time }}
</li>
</q-item-label>
</q-item-section>
</q-item>
<q-separator spaced v-if="index !== 2" />
</q-card>
</q-list>
</div>
</div>
</template>
<style scoped></style>

108
src/modules/21_report/views/02_reportRegistry.vue
View file

@ -301,7 +301,7 @@ const columns = computed<QTableProps["columns"]>(() => {
{
name: "lengthPosition",
align: "left",
label: "ระยะเวลาดำรงตำแหน่งในเเต่ละระดับ",
label: "ระยะเวลาดำรงตำแหน่งในระดับปัจจุบัน",
sortable: true,
field: "lengthPosition",
headerStyle: "font-size: 14px",
@ -318,6 +318,12 @@ const visibleColumns = computed<string[]>(() => {
: visibleColumnsBase.value.filter((e: string) => e !== "positionExecutive");
});
const typeTerm = ref<string>("");
const rangeTerm = ref<RangeAge>({
min: 0,
max: 20,
});
function onOpenOrg() {
modalOrg.value = true;
}
@ -616,6 +622,10 @@ function clearFilter() {
expandedModal.value = false;
filterTree.value = "";
typeTerm.value = "";
rangeTerm.value.min = 0;
rangeTerm.value.max = 20;
}
watch(
@ -1421,48 +1431,68 @@ onMounted(async () => {
</q-select>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<!-- <q-btn-dropdown
:label="
sortBy
? sortBy == 'DESC'
? `เรียงตามวันที่บรรจุเเต่งตั้ง
(เก่า-ล่าสุด)`
: `เรียงตามวันที่บรรจุเเต่งตั้ง
(ล่าสุด-เก่า)`
: 'ลำดับการเเสดงผล'
"
dropdown-icon="mdi-chevron-down"
rounded
text-color="primary"
dense
padding="xs md"
label-color="white"
outline
>
<q-list>
<q-item clickable v-close-popup @click="sortBy = 'ASC'">
<q-item-section>
<q-item-label
>เรียงตามวันที่บรรจุเเต่งตั้ง
(ล่าสุด-เก่า)</q-item-label
>
</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="sortBy = 'DESC'">
<q-item-section>
<q-item-label
>เรียงตามวันที่บรรจุเเต่งตั้ง
(เก่า-ล่าสุด)</q-item-label
>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown> -->
<div class="">
<q-radio
v-model="typeTerm"
val="position"
label="ระยะเวลาดำรงตำแหน่งปัจจุบัน"
size="xs"
class="text-grey-8"
/>
<q-radio
v-model="typeTerm"
val="level"
label="ระยะเวลาดำรงตำแหน่งในระดับปัจจุบัน"
size="xs"
class="text-grey-8"
/>
</div>
<div class="q-pa-md" v-if="typeTerm">
<q-range
v-model="rangeTerm"
:min="0"
:max="20"
label
color="primary"
track-size="4px"
thumb-size="16px"
switch-label-side
dense
>
</q-range>
<div
class="col-12 justify-around items-center row no-wrap q-pt-sm"
>
<div>
<q-input
readonly
type="number"
style="max-width: 60px"
v-model="rangeTerm.min"
dense
standout="bg-teal text-white"
/>
</div>
<div class="q-px-sm text-grey-8">-</div>
<div>
<q-input
readonly
type="number"
style="max-width: 60px"
v-model="rangeTerm.max"
dense
standout="bg-teal text-white"
/>
</div>
</div>
</div>
</div>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12 row q-pa-sm">
<q-space />
<q-btn