chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

fix: tree 01 & 04 active

Browse source
This commit is contained in:
puriphatt 2024-07-23 07:25:11 +00:00
parent 1f61b6046f
commit 9429fac0e3
3 changed files with 36 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/css/quasar.variables.scss
View file

@ -109,10 +109,6 @@ div.fullscreen.q-drawer__backdrop {
padding-block: 0px;
}
i.q-icon.mdi.mdi-play.q-tree__arrow {
color: hsl(var(--text-mute));
}
.q-tree__node-header:before {
color: hsl(var(--text-mute));
}
@ -123,12 +119,12 @@ i.q-icon.mdi.mdi-play.q-tree__arrow {
background-color: hsla(var(--info-bg) / 0.1);
}
.q-tree__node-header.relative-position.row.no-wrap.items-center.q-tree__node--link.q-hoverable.q-focusable:has(
i.q-icon.mdi.mdi-play.q-tree__arrow.q-tree__arrow--rotate
.q-tree__node-header.relative-position.row.no-wrap.items-center:has(
.clickable-node.active-node
) {
background-color: hsla(var(--info-bg) / 0.1);
}
.q-tree > .q-tree__node--child > .q-tree__node-header {
padding-left: 32px;
.q-tree__node-header {
padding-left: 0px !important;
}

12
src/pages/01_branch-management/MainPage.vue
View file

@ -636,7 +636,10 @@ watch(
<template #default-header="{ node }">
<div
class="full-width q-py-xs"
:class="{ 'clickable-node': node.isHeadOffice }"
:class="{
'clickable-node': node.isHeadOffice,
'active-node': expandedTree[0] === node.id,
}"
v-touch-hold.mouse="handleHold(node)"
@click.stop="
() => {
@ -687,10 +690,13 @@ watch(
"
name="mdi-triangle-down"
size="12px"
class="app-text-muted q-mr-md"
class="app-text-muted q-mr-md q-ml-sm"
:style="`rotate: ${expandedTree[0] === node.id ? '0deg' : '30deg'}`"
/>
<div class="col row">
<div
class="col row"
:style="`padding-left:${node.isHeadOffice && node._count.branch === 0 ? '36px' : ''}`"
>
<span
class="ellipsis col-12"
style="white-space: nowrap"

35
src/pages/04_product-service/MainPage.vue
View file

@ -1200,7 +1200,15 @@ async function enterGroup(id: string, name: string) {
}
async function enterType(id: string, name: string) {
expandedTree.value.push(id);
if (
expandedTree.value.length > 1 &&
expandedTree.value[expandedTree.value.length - 1] !== id
) {
expandedTree.value.pop();
expandedTree.value.push(id);
} else {
expandedTree.value.push(id);
}
pathTypeName.value = name;
currentIdType.value = id;
productMode.value = 'service';
@ -1442,6 +1450,12 @@ watch(
<template #default-header="{ node }">
<div
class="full-width q-py-xs clickable-node"
:class="{
'cursor-pointer':
node.type === 'group' || node.type === 'type',
'active-node':
expandedTree[expandedTree.length - 1] === node.id,
}"
v-touch-hold.mouse="handleHold(node)"
@click.stop="
async () => {
@ -1469,17 +1483,12 @@ watch(
if (currentIdType === node.id) {
currentIdType = '';
productMode = 'type';
expandedTree.pop();
return;
}
}
}
"
:class="{
'cursor-pointer':
node.type === 'group' || node.type === 'type',
'selector-tree':
node.type === 'group' && node._count.type > 0,
}"
>
<div
class="row col items-center justify-between full-width no-wrap"
@ -1488,10 +1497,14 @@ watch(
v-if="node.type === 'group' && node._count.type > 0"
name="mdi-triangle-down"
size="12px"
class="app-text-muted q-mr-md"
class="app-text-muted q-mr-md q-ml-sm"
:style="`rotate: ${expandedTree[0] === node.id ? '0deg' : '30deg'}`"
/>
<div class="col row">
<div
class="col row"
:class="{ 'q-pl-sm': node.type === 'type' }"
:style="`padding-left:${node.type === 'group' && node._count.type === 0 ? '36px' : ''}`"
>
<span
class="ellipsis col-12"
style="white-space: nowrap"
@ -3207,9 +3220,7 @@ watch(
? 'productType'
: productMode === 'group'
? 'productGroup'
: productMode === 'type'
? 'productType'
: 'defaultKey',
: 'productType',
{
name: formDataGroup.code,
},