mirror of
https://github.com/hcengineering/platform.git
synced 2026-09-23 18:15:03 +02:00
80 lines
3.0 KiB
Svelte
80 lines
3.0 KiB
Svelte
<script lang="ts">
|
|
import { Doc, DocumentQuery } from '@hcengineering/core'
|
|
import { IntlString } from '@hcengineering/platform'
|
|
import { createQuery, getClient } from '@hcengineering/presentation'
|
|
import { Button, Icon, IconAdd, Label, showPopup, Component } from '@hcengineering/ui'
|
|
import view, { Viewlet } from '@hcengineering/view'
|
|
import { getViewOptions, ViewletSettingButton, getAdditionalHeader } from '@hcengineering/view-resources'
|
|
import viewplg from '@hcengineering/view-resources/src/plugin'
|
|
import tracker from '../../../plugin'
|
|
import RelatedIssues from './RelatedIssues.svelte'
|
|
import type { Issue } from '@hcengineering/tracker'
|
|
import { fade } from 'svelte/transition'
|
|
|
|
export let object: Doc
|
|
export let label: IntlString
|
|
|
|
const client = getClient()
|
|
let viewlet: Viewlet | undefined
|
|
|
|
const vquery = createQuery()
|
|
$: vquery.query(view.class.Viewlet, { _id: tracker.viewlet.SubIssues }, (res) => {
|
|
;[viewlet] = res
|
|
})
|
|
|
|
let viewOptions = getViewOptions(viewlet)
|
|
const createIssue = () => showPopup(tracker.component.CreateIssue, { relatedTo: object, space: object.space }, 'top')
|
|
|
|
let query: DocumentQuery<Issue>
|
|
$: query = { 'relations._id': object._id, 'relations._class': object._class }
|
|
const subIssuesQuery = createQuery()
|
|
let subIssues: Issue[] = []
|
|
$: subIssuesQuery.query(tracker.class.Issue, query, async (result) => (subIssues = result))
|
|
|
|
$: headerRemoval = viewOptions.groupBy.length === 0 || viewOptions.groupBy[0] === '#no_category'
|
|
$: extraHeaders = headerRemoval ? getAdditionalHeader(client, tracker.class.Issue) : undefined
|
|
</script>
|
|
|
|
<div class="antiSection">
|
|
<div class="antiSection-header">
|
|
<div class="antiSection-header__icon">
|
|
<Icon icon={tracker.icon.Issue} size={'small'} />
|
|
</div>
|
|
<span class="antiSection-header__title short">
|
|
<Label {label} />
|
|
</span>
|
|
{#if headerRemoval}
|
|
<div in:fade|local={{ duration: 150 }} class="antiSection-header__header flex-between">
|
|
<span class="dark-color"><Label label={viewplg.string.NoGrouping} /></span>
|
|
<div class="buttons-group font-normal text-normal">
|
|
{#if extraHeaders}
|
|
{#each extraHeaders as extra}
|
|
<Component is={extra} props={{ docs: subIssues }} />
|
|
{/each}
|
|
{/if}
|
|
<span class="antiSection-header__counter">{subIssues.length}</span>
|
|
</div>
|
|
</div>
|
|
{:else}
|
|
<span class="flex-grow" />
|
|
{/if}
|
|
<div class="buttons-group small-gap">
|
|
{#if viewlet && viewOptions}
|
|
<ViewletSettingButton bind:viewOptions {viewlet} kind={'transparent'} />
|
|
{/if}
|
|
<Button
|
|
id="add-sub-issue"
|
|
icon={IconAdd}
|
|
label={undefined}
|
|
labelParams={{ subIssues: 0 }}
|
|
kind={'transparent'}
|
|
shape={'circle'}
|
|
on:click={createIssue}
|
|
/>
|
|
</div>
|
|
</div>
|
|
{#if viewlet}
|
|
<RelatedIssues {object} {viewOptions} {viewlet} on:add-issue={createIssue} disableHeader={headerRemoval} />
|
|
{/if}
|
|
</div>
|