wieerwill/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2025-04-22 00:10:37 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Remove findNode from TableView (#281)

Browse Source 
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-10-23 15:56:04 +03:00 committed by GitHub
parent 7cdaaf9224
commit ec2f80d59b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
plugins/view-resources/src/components/TableView.svelte
View File

@ -34,6 +34,7 @@
let sortKey = 'modifiedOn' let sortKey = 'modifiedOn'
let sortOrder = SortingOrder.Descending let sortOrder = SortingOrder.Descending
let selectRow: number | undefined = undefined
let objects: Doc[] let objects: Doc[]
@ -55,21 +56,9 @@
const client = getClient() const client = getClient()
let checking: boolean = false let checking: boolean = false
const findNode = (el: HTMLElement, name: string): any => { const showMenu = (ev: MouseEvent, object: Doc, row: number): void => {
while (el.parentNode !== null) { selectRow = row
if (el.classList.contains(name)) return el showPopup(Menu, { object }, ev.target as HTMLElement, (() => { selectRow = undefined }))
el = el.parentNode as HTMLElement
}
return false
}
const showMenu = (ev: MouseEvent, object: Doc): void => {
const elRow: HTMLElement = findNode(ev.target as HTMLElement, 'tr-body')
const elBtn: HTMLElement = findNode(ev.target as HTMLElement, 'menuRow')
elRow.classList.add('fixed')
showPopup(Menu, { object }, elBtn, (() => {
elRow.classList.remove('fixed')
}))
} }
function changeSorting(key: string) { function changeSorting(key: string) {
@ -120,13 +109,13 @@
{#if objects} {#if objects}
<tbody> <tbody>
{#each objects as object, row (object._id)} {#each objects as object, row (object._id)}
<tr class="tr-body" class:checking> <tr class="tr-body" class:checking class:fixed={row === selectRow}>
{#each model as attribute, cell} {#each model as attribute, cell}
{#if !cell} {#if !cell}
<td><div class="checkCell"><CheckBox bind:checked={checking} /></div></td> <td><div class="checkCell"><CheckBox bind:checked={checking} /></div></td>
<td><div class="firstCell"> <td><div class="firstCell">
<svelte:component this={attribute.presenter} value={getValue(object, attribute.key)}/> <svelte:component this={attribute.presenter} value={getValue(object, attribute.key)}/>
<div class="menuRow" on:click={(ev) => showMenu(ev, object)}><MoreV size={'small'} /></div> <div class="menuRow" on:click={(ev) => showMenu(ev, object, row)}><MoreV size={'small'} /></div>
</div></td> </div></td>
{:else} {:else}
<td><svelte:component this={attribute.presenter} value={getValue(object, attribute.key)}/></td> <td><svelte:component this={attribute.presenter} value={getValue(object, attribute.key)}/></td>
@ -211,7 +200,7 @@
&:hover .firstCell .menuRow { visibility: visible; } &:hover .firstCell .menuRow { visibility: visible; }
} }
:global(.fixed) { .fixed {
background-color: var(--theme-table-bg-hover); background-color: var(--theme-table-bg-hover);
.checkCell { visibility: visible; } .checkCell { visibility: visible; }
.menuRow { visibility: visible; } .menuRow { visibility: visible; }