update filter tree selected
This commit is contained in:
parent
f1d1b722d8
commit
47909bf034
1 changed files with 170 additions and 156 deletions
|
|
@ -123,8 +123,9 @@ const myFilterMethod = (node: any, filter: string) => {
|
||||||
const filt = filter;
|
const filt = filter;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
((node.name && node.name == null) || !node.name) &&
|
// ((node.name && node.name == null) || !node.name) &&
|
||||||
((node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
(node.name && node.name.indexOf(filt) > -1) ||
|
||||||
|
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
||||||
(node.governmentCode &&
|
(node.governmentCode &&
|
||||||
|
|
@ -139,7 +140,7 @@ const myFilterMethod = (node: any, filter: string) => {
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
||||||
(node.executivePositionSide &&
|
(node.executivePositionSide &&
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
node.executivePositionSide.indexOf(filt) > -1) ||
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1))
|
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -354,6 +355,7 @@ const selectedPosition = async (data: any) => {
|
||||||
dataForm.positionTypeId = "";
|
dataForm.positionTypeId = "";
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
const checkPosition = (val: string) => {
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
const num = placementPosition.value.findIndex((e: string) => e === val);
|
||||||
return num;
|
return num;
|
||||||
|
|
@ -368,179 +370,191 @@ watch(props, () => {
|
||||||
});
|
});
|
||||||
console.log("personal", personal.value);
|
console.log("personal", personal.value);
|
||||||
}
|
}
|
||||||
if (personal.value.draft === false) {
|
|
||||||
const findData = dataRespone.value.find(findByPerson);
|
// console.log("draft===>", personal.value.draft);
|
||||||
console.log(findData);
|
|
||||||
loadTreeData();
|
if (personal.value.draft === true) {
|
||||||
selectedPosition(findData.children.children.children)
|
// const findData = dataRespone.value.find(findByPerson);
|
||||||
|
let findData: any = null;
|
||||||
|
dataRespone.value.map((x: any) => {
|
||||||
|
findData = findByPerson(x);
|
||||||
|
if (findData != null) {
|
||||||
|
console.log("findData===>", findData);
|
||||||
|
selectedPosition(findData)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// loadTreeData();
|
||||||
|
// selectedPosition(findData.children.children.children)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const findByPerson = (obj: any) => {
|
|
||||||
if (
|
function findByPerson(element: any) {
|
||||||
obj.positionLineId === personal.value.positionLineId &&
|
// console.log("searchTree element===>", element)
|
||||||
obj.positionTypeId === personal.value.positionTypeId &&
|
if (element.positionNumId && element.positionLineId === personal.value.positionLineId &&
|
||||||
obj.positionNumId === personal.value.posNoId
|
element.positionTypeId === personal.value.positionTypeId &&
|
||||||
|
element.positionNumId === personal.value.posNoId
|
||||||
) {
|
) {
|
||||||
return true;
|
return element;
|
||||||
|
} else if (element.children) {
|
||||||
|
var i;
|
||||||
|
var result = null;
|
||||||
|
for (i = 0; result == null && i < element.children.length; i++) {
|
||||||
|
result = findByPerson(element.children[i]);
|
||||||
|
}
|
||||||
|
return result;
|
||||||
}
|
}
|
||||||
if (obj.children && obj.children.length > 0) {
|
return null;
|
||||||
obj.children = obj.children.find(findByPerson);
|
}
|
||||||
return obj.children;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<q-dialog v-model="props.modal" persistent>
|
<q-dialog v-model="props.modal" persistent>
|
||||||
<q-card style="width: 700px; max-width: 80vw">
|
<q-card style="width: 900px; max-width: 80vw">
|
||||||
<q-form ref="myFormPosition">
|
<q-form ref="myFormPosition">
|
||||||
<DialogHeader title="เลือกหน่วยงานที่รับบรรจุ" :close="closeModal" />
|
<DialogHeader title="เลือกหน่วยงานที่รับบรรจุ" :close="closeModal" />
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
<q-card-section class="q-pa-sm bg-grey-1">
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
<div class="col-xs-12 col-sm-6 row">
|
<div class="col-xs-12 col-sm-7 row">
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
<q-card flat bordered class="fit q-pa-sm">
|
||||||
<q-scroll-area visible style="height: 70vh">
|
<q-scroll-area visible style="height: 70vh">
|
||||||
<q-input
|
<q-input
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
ref="filterRef"
|
ref="filterRef"
|
||||||
v-model="search"
|
v-model="search"
|
||||||
placeholder="ค้นหา"
|
placeholder="ค้นหา"
|
||||||
class="q-mb-sm"
|
class="q-mb-sm"
|
||||||
>
|
>
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon name="mdi-magnify" />
|
<q-icon name="mdi-magnify" />
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
<div class="q-pa-sm q-gutter-sm">
|
||||||
<q-tree
|
<q-tree
|
||||||
no-transition
|
no-transition
|
||||||
dense
|
dense
|
||||||
:nodes="treeData"
|
:nodes="treeData"
|
||||||
node-key="keyId"
|
node-key="keyId"
|
||||||
:filter="search"
|
:filter="search"
|
||||||
:no-results-label="notFound"
|
:no-results-label="notFound"
|
||||||
:no-nodes-label="noData"
|
:no-nodes-label="noData"
|
||||||
:filter-method="myFilterMethod"
|
:filter-method="myFilterMethod"
|
||||||
>
|
>
|
||||||
<template v-slot:header-organization="prop">
|
<template v-slot:header-organization="prop">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div
|
<div
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
||||||
>
|
>
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
||||||
<div class="text-weight-medium">
|
<div class="text-weight-medium">
|
||||||
{{ prop.node.organizationName }}
|
{{ prop.node.organizationName }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--แสดง Total Count PositionNum-->
|
<!--แสดง Total Count PositionNum-->
|
||||||
<!-- <q-badge rounded color="grey-2" text-color="dark"
|
<!-- <q-badge rounded color="grey-2" text-color="dark"
|
||||||
:label="prop.node.totalPositionCount" /> -->
|
:label="prop.node.totalPositionCount" /> -->
|
||||||
<q-badge
|
<q-badge
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
v-if="prop.node.totalPositionVacant > 0"
|
||||||
rounded
|
rounded
|
||||||
color="red"
|
color="red"
|
||||||
outline
|
outline
|
||||||
:label="prop.node.totalPositionVacant"
|
:label="prop.node.totalPositionVacant"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<q-space />
|
<q-space />
|
||||||
</div>
|
</div>
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
<div class="col items-center q-px-xs q-pt-xs">
|
||||||
<div class="text-weight-medium text-grey-7">
|
<div class="text-weight-medium text-grey-7">
|
||||||
{{ prop.node.governmentCode }}
|
{{ prop.node.governmentCode }}
|
||||||
{{ prop.node.organizationShortName }}
|
{{ prop.node.organizationShortName }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
<template v-slot:header-person="prop">
|
||||||
<q-item
|
<q-item
|
||||||
clickable
|
clickable
|
||||||
:active="selected == prop.node.keyId"
|
:active="selected == prop.node.keyId"
|
||||||
@click="selectedPosition(prop.node)"
|
@click="selectedPosition(prop.node)"
|
||||||
:disable="
|
:disable="prop.node.name != null ||
|
||||||
prop.node.name != null ||
|
checkPosition(prop.node.positionNumId) != -1
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
"
|
||||||
"
|
active-class="my-list-link text-primary text-weight-medium"
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
>
|
||||||
>
|
<img
|
||||||
<img
|
v-if="prop.node.avatar == '' ||
|
||||||
v-if="
|
prop.node.avatar ==
|
||||||
prop.node.avatar == '' ||
|
'https://cdn.quasar.dev/img/boy-avatar.png'
|
||||||
prop.node.avatar ==
|
"
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
src="@/assets/avatar_user.jpg"
|
||||||
"
|
class="col-xs-1 col-sm-2"
|
||||||
src="@/assets/avatar_user.jpg"
|
style="
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
width: 28px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
<img
|
<img
|
||||||
v-else
|
v-else
|
||||||
:src="prop.node.avatar"
|
:src="prop.node.avatar"
|
||||||
class="col-xs-1 col-sm-2"
|
class="col-xs-1 col-sm-2"
|
||||||
style="
|
style="
|
||||||
width: 28px;
|
width: 28px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
"
|
"
|
||||||
/>
|
/>
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
||||||
<div
|
<div
|
||||||
v-if="prop.node.name == null"
|
v-if="prop.node.name == null"
|
||||||
class="q-px-sm text-weight-medium text-red"
|
class="q-px-sm text-weight-medium text-red"
|
||||||
>
|
>
|
||||||
ว่าง
|
ว่าง
|
||||||
</div>
|
</div>
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
<!--=====หัวหน้า สีเขียว=====-->
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
<div v-else-if="prop.node.positionLeaderFlag">
|
||||||
<div
|
<div
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
class="q-px-sm text-weight-medium text-primary"
|
||||||
>
|
>
|
||||||
{{ prop.node.name }}
|
{{ prop.node.name }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
<!--=====ลูกน้อง สีปกติ=====-->
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div class="q-px-sm text-weight-medium">
|
<div class="q-px-sm text-weight-medium">
|
||||||
{{ prop.node.name }}
|
{{ prop.node.name }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
||||||
<div class="q-pr-sm">
|
<div class="q-pr-sm">
|
||||||
{{ prop.node.positionName }}
|
{{ prop.node.positionName }}
|
||||||
</div>
|
</div>
|
||||||
<div class="q-pr-sm">
|
<div class="q-pr-sm">
|
||||||
{{ prop.node.positionNum }}
|
{{ prop.node.positionNum }}
|
||||||
</div>
|
</div>
|
||||||
<div class="q-pr-sm">
|
<div class="q-pr-sm">
|
||||||
{{ prop.node.positionLevel }}
|
{{ prop.node.positionLevel }}
|
||||||
</div>
|
</div>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="prop.node.positionLeaderFlag"
|
v-if="prop.node.positionLeaderFlag"
|
||||||
class="q-mr-sm"
|
class="q-mr-sm"
|
||||||
size="15px"
|
size="15px"
|
||||||
color="primary"
|
color="primary"
|
||||||
name="mdi-bookmark"
|
name="mdi-bookmark"
|
||||||
></q-icon>
|
></q-icon>
|
||||||
|
|
||||||
<q-space />
|
<q-space />
|
||||||
</q-item>
|
</q-item>
|
||||||
</template>
|
</template>
|
||||||
</q-tree>
|
</q-tree>
|
||||||
</div>
|
</div>
|
||||||
</q-scroll-area>
|
</q-scroll-area>
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-5">
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
<q-card flat bordered class="fit q-pa-sm">
|
||||||
<q-scroll-area visible style="height: 70vh">
|
<q-scroll-area visible style="height: 70vh">
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
<div class="row col-12 q-col-gutter-xs">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue