wieerwill/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2025-05-29 03:21:13 +00:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

TSK-1403 Improve tags filter (#3126)

Browse Source 
Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>
This commit is contained in:
Denis Bykhov 2023-05-04 08:39:38 +06:00 committed by GitHub
parent 149d8cda46
commit 1a98b10eee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 59 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/tags-resources/src/components/TagItem.svelte
View File

@ -31,7 +31,7 @@
$: name = element?.title ?? tag?.title ?? 'New item'
$: tagIcon = schema === '3' ? undefined : tagLevel[(((tag?.weight ?? 0) % 3) + 1) as 1 | 2 | 3]
$: tagIcon = schema !== '9' ? undefined : tagLevel[(((tag?.weight ?? 0) % 3) + 1) as 1 | 2 | 3]
</script>
{#if inline}

24
plugins/tags-resources/src/components/TagsEditor.svelte
View File

@ -37,7 +37,7 @@
export let key: KeyedAttribute
export let showTitle = true
export let elements: Map<Ref<TagElement>, TagElement>
export let schema: '3' | '9' = key.attr.schema ?? '9'
export let schema: '0' | '3' | '9' = key.attr.schema ?? '0'
const dispatch = createEventDispatcher()
@ -138,18 +138,20 @@
removeTag(tag._id)
}}
on:click={(evt) => {
showPopup(
WeightPopup,
{ value: tag.weight ?? 1, format: 'number', schema },
getEventPopupPositionElement(evt),
(res) => {
if (Number.isFinite(res) && res >= 0 && res <= 8) {
if (res != null) {
dispatch('change', { tag, weight: res })
if (schema !== '0') {
showPopup(
WeightPopup,
{ value: tag.weight ?? 1, format: 'number', schema },
getEventPopupPositionElement(evt),
(res) => {
if (Number.isFinite(res) && res >= 0 && res <= 8) {
if (res != null) {
dispatch('change', { tag, weight: res })
}
}
}
}
)
)
}
}}
/>
{/each}

76
plugins/tags-resources/src/components/TagsFilter.svelte
View File

@ -88,7 +88,7 @@
const el: HTMLElement = ev.currentTarget as HTMLElement
el.classList.toggle('show')
}
const show: boolean = false
$: show = categories.length <= 1
const getCount = (cat: TagCategory): string => {
const count = objects.filter((el) => el.category === cat._id).filter((it) => selected.includes(it._id)).length
@ -111,7 +111,7 @@
categories = categories
}
$: schema = filter.key.attribute.schema ?? '9'
$: schema = filter.key.attribute.schema ?? '0'
const dispatch = createEventDispatcher()
getValues(search)
@ -131,22 +131,24 @@
}}
placeholder={phTraslate}
/>
<div class="flex-row-center flex-between flex-grow p-1">
<Label label={tags.string.Weight} />
<Button
label={tagLevelLabel}
icon={tagLevelIcon}
on:click={(evt) => {
showPopup(WeightPopup, { value: level, schema }, getEventPopupPositionElement(evt), (res) => {
if (Number.isFinite(res) && res >= 0 && res <= 8) {
if (res != null) {
level = res
{#if schema !== '0'}
<div class="flex-row-center flex-between flex-grow p-1">
<Label label={tags.string.Weight} />
<Button
label={tagLevelLabel}
icon={tagLevelIcon}
on:click={(evt) => {
showPopup(WeightPopup, { value: level, schema }, getEventPopupPositionElement(evt), (res) => {
if (Number.isFinite(res) && res >= 0 && res <= 8) {
if (res != null) {
level = res
}
}
}
})
}}
/>
</div>
})
}}
/>
</div>
{/if}
</div>
<div class="scroll">
<div class="box">
@ -154,24 +156,32 @@
<Loading />
{:else}
{#each categories as cat}
{#if objects.filter((el) => el.category === cat._id).length > 0}
{@const values = objects.filter((el) => el.category === cat._id)}
{#if values.length > 0}
<div class="sticky-wrapper">
<button class="menu-group__header" class:show={search !== '' || show} on:click={toggleGroup}>
<div class="flex-row-center">
<span class="mr-1-5">{cat.label}</span>
<div class="icon">
<svg fill="var(--content-color)" viewBox="0 0 6 6" xmlns="http://www.w3.org/2000/svg">
<path d="M0,0L6,3L0,6Z" />
</svg>
<button
class="menu-group__header"
class:show={search !== '' || show}
class:hidden={show}
on:click={toggleGroup}
>
{#if categories.length > 1}
<div class="flex-row-center">
<span class="mr-1-5">{cat.label}</span>
<div class="icon">
<svg fill="var(--content-color)" viewBox="0 0 6 6" xmlns="http://www.w3.org/2000/svg">
<path d="M0,0L6,3L0,6Z" />
</svg>
</div>
</div>
</div>
<div class="flex-row-center text-xs">
<span class="content-color mr-1">({objects.filter((el) => el.category === cat._id).length})</span>
<span class="counter">{getCount(cat)}</span>
</div>
<div class="flex-row-center text-xs">
<span class="content-color mr-1">({values.length})</span>
<span class="counter">{getCount(cat)}</span>
</div>
{/if}
</button>
<div class="menu-group">
{#each objects.filter((el) => el.category === cat._id) as element}
{#each values as element}
<button
class="menu-item"
on:click={() => {
@ -217,4 +227,8 @@
display: flex;
align-items: center;
}
.hidden {
display: none;
}
</style>