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

update summary & layout

Browse source
This commit is contained in:
Warunee Tamkoo 2024-02-08 12:10:34 +07:00
parent c26efe6c21
commit 6e6e0d2cf9
6 changed files with 130 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/modules/02_organizationalNew/components/listView.vue
View file

@ -167,6 +167,7 @@ watch(
}
);
</script>
<template>
<div class="col-12">
<q-card bordered class="col-12 row caedNone">
@ -208,19 +209,42 @@ watch(
class="row col-12 justify-between list-summary q-gutter-xs bg-grey-1 q-pb-xs q-pr-xs"
>
<div class="row col q-pa-sm item">
<div class="ellipsis">ตำแหน่งทั้งหมด</div>
<div class="ellipsis">
ตำแหน่งทั้งหมด
</div>
<q-space />
<q-badge color="secondary" :label="store.sumPosition.total" />
<q-badge
color="secondary"
:label="
reqMaster.isAll
? store.sumPosition.total
: store.sumPosition.totalRoot
"
/>
</div>
<div class="row col q-pa-sm item">
<div class="ellipsis">ตำแหน่งที่มีคนครอง</div>
<q-space />
<q-badge color="primary" :label="store.sumPosition.use" />
<q-badge
color="primary"
:label="
reqMaster.isAll
? store.sumPosition.use
: store.sumPosition.useRoot
"
/>
</div>
<div class="row col q-pa-sm item">
<div class="ellipsis">ตำแหน่งว่าง</div>
<q-space />
<q-badge color="red" :label="store.sumPosition.vacant" />
<q-badge
color="red"
:label="
reqMaster.isAll
? store.sumPosition.vacant
: store.sumPosition.vacantRoot
"
/>
</div>
</q-card>

8
src/modules/02_organizationalNew/components/mainTree.vue
View file

@ -111,8 +111,12 @@ function updateSelected(data: DataTree) {
totalPositionCurrentVacant: data.totalPositionCurrentVacant,
totalPositionNextUse: data.totalPositionNextUse,
totalPositionNextVacant: data.totalPositionNextVacant,
totalRootPosition: data.totalRootPosition,
totalRootPositionCurrentUse: data.totalRootPositionCurrentUse,
totalRootPositionCurrentVacant: data.totalRootPositionCurrentVacant,
totalRootPositionNextUse: data.totalRootPositionNextUse,
totalRootPositionNextVacant: data.totalRootPositionNextVacant,
});
// }
}
@ -387,7 +391,7 @@ const modaeMenu = ref<boolean>(false);
</q-input>
</div>
</div>
<div class="bg-white tree-container">
<div class="bg-white tree-container q-pa-xs">
<q-tree
class="q-pa-sm q-gutter-sm"
dense

65
src/modules/02_organizationalNew/components/tableTree.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref } from "vue";
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import config from "@/app.config";
import http from "@/plugins/http";
@ -26,7 +26,7 @@ import { useOrganizational } from "@/modules/02_organizationalNew/store/organiza
import { useCounterMixin } from "@/stores/mixin";
const $q = useQuasar();
const stroe = useOrganizational();
const store = useOrganizational();
const { showLoader, hideLoader, messageError, success, dialogRemove } =
useCounterMixin();
@ -320,12 +320,37 @@ function openSelectPerson(data: DataPosition[]) {
modalSelectPerson.value = true;
dataDetailPos.value = data;
}
/** ลบคนครอง */
function removePerson(data: DataPosition[]) {
dialogRemove(
$q,
async () => {
showLoader();
// await http
// .delete(config.API.orgPosMasterById(id))
// .then(() => {
// success($q, "ลบข้อมูลสำเร็จ");
// props.fetchDataTable?.(reqMaster.value.id, reqMaster.value.type, false);
// })
// .catch((err) => {
// messageError($q, err);
// })
// .finally(() => {
hideLoader();
// });
},
"ยืนยันการลบคนครอง",
"ต้องการยืนยันการลบคนครองนี้ใช่หรือไม่?"
);
}
</script>
<template>
<!-- TOOLBAR -->
<div class="col-12">
<q-toolbar style="padding: 0">
<div v-if="stroe.typeOrganizational === 'draft'">
<div v-if="store.typeOrganizational === 'draft'">
<q-btn
flat
round
@ -467,21 +492,49 @@ function openSelectPerson(data: DataPosition[]) {
>
<q-menu>
<q-list dense style="min-width: 150px">
<!-- เลือกคนครอง -->
<q-item
v-if="props.row.positionIsSelected == 'ว่าง' && stroe.typeOrganizational === 'draft'"
v-if="
props.row.positionIsSelected == 'ว่าง' &&
store.typeOrganizational === 'draft'
"
clickable
v-close-popup
@click="openSelectPerson(props.row)"
>
<q-item-section>
<div class="row items-center">
<q-icon color="secondary" size="17px" name="mdi-account-circle" />
<q-icon
color="secondary"
size="17px"
name="mdi-account"
/>
<div class="q-pl-md">เลือกคนครอง</div>
</div>
</q-item-section>
</q-item>
<q-item
v-for="(item, index) in stroe.typeOrganizational === 'draft'
v-else-if="
props.row.positionIsSelected != 'ว่าง' &&
store.typeOrganizational === 'draft'
"
clickable
v-close-popup
@click="removePerson(props.row)"
>
<q-item-section>
<div class="row items-center">
<q-icon
color="red"
size="17px"
name="mdi-account-remove"
/>
<div class="q-pl-md">ลบคนครอง</div>
</div>
</q-item-section>
</q-item>
<q-item
v-for="(item, index) in store.typeOrganizational === 'draft'
? listMenu
: listMenu.filter(
(e) => e.type === 'HISTORY' || e.type === 'VIEWDETIAL'

7
src/modules/02_organizationalNew/interface/index/organizational.ts
View file

@ -72,8 +72,13 @@ interface DataTree {
totalPositionCurrentVacant: number;
totalPositionNextUse: number;
totalPositionNextVacant: number;
totalRootPosition: number;
totalRootPositionCurrentUse: number;
totalRootPositionCurrentVacant: number;
totalRootPositionNextUse: number;
totalRootPositionNextVacant: number;
children?: DataTree[];
}
export type { DataPosition, Position, FormDetailPosition, DataTree };

5
src/modules/02_organizationalNew/interface/response/organizational.ts
View file

@ -13,6 +13,11 @@ interface SumPosition {
totalPositionCurrentVacant: number;
totalPositionNextUse: number;
totalPositionNextVacant: number;
totalRootPosition: number;
totalRootPositionCurrentUse: number;
totalRootPositionCurrentVacant: number;
totalRootPositionNextUse: number;
totalRootPositionNextVacant: number;
}
interface OrgTree {

34
src/modules/02_organizationalNew/store/organizational.ts
View file

@ -23,18 +23,36 @@ export const useOrganizational = defineStore("organizationalStore", () => {
total: 0,
use: 0,
vacant: 0,
totalRoot: 0,
useRoot: 0,
vacantRoot: 0,
});
function getSumPosition(data: SumPosition) {
sumPosition.total = data.totalPosition;
sumPosition.use =
typeOrganizational.value == "draft"
? data.totalPositionNextUse
: data.totalPositionCurrentUse;
sumPosition.vacant =
typeOrganizational.value == "draft"
? data.totalPositionNextVacant
: data.totalPositionCurrentVacant;
sumPosition.totalRoot = data.totalRootPosition ? data.totalRootPosition : 0;
if (typeOrganizational.value == "draft") {
sumPosition.use = data.totalPositionNextUse;
sumPosition.useRoot = data.totalRootPositionNextUse
? data.totalRootPositionNextUse
: 0;
sumPosition.vacant = data.totalPositionNextVacant;
sumPosition.vacantRoot = data.totalRootPositionNextVacant
? data.totalRootPositionNextVacant
: 0;
} else {
sumPosition.use = data.totalPositionCurrentUse;
sumPosition.useRoot = data.totalRootPositionCurrentUse
? data.totalRootPositionCurrentUse
: 0;
sumPosition.vacant = data.totalPositionCurrentVacant;
sumPosition.vacantRoot = data.totalRootPositionCurrentVacant
? data.totalRootPositionCurrentVacant
: 0;
}
}
function fetchDataActive(data: DataActive) {