Add the ability to restrict adding / removing attachments (#3479)

Signed-off-by: Sergei Ogorelkov <sergei.ogorelkov@icloud.com>
This commit is contained in:
Sergei Ogorelkov 2023-07-04 22:46:35 +04:00 committed by GitHub
parent a0ecb3c04f
commit 10a7b0f379
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 10 deletions

View File

@ -24,6 +24,8 @@
export let attachments: number export let attachments: number
export let object: Doc export let object: Doc
export let canAdd = true
export let canRemove = true
const client = getClient() const client = getClient()
@ -41,8 +43,10 @@
) )
function add () { function add () {
if (canAdd) {
inputFile.click() inputFile.click()
} }
}
async function createAttachment (file: File) { async function createAttachment (file: File) {
const uuid = await uploadFile(file) const uuid = await uploadFile(file)
@ -68,8 +72,10 @@
let inputFile: HTMLInputElement let inputFile: HTMLInputElement
async function remove (doc: Attachment): Promise<void> { async function remove (doc: Attachment): Promise<void> {
if (canRemove) {
await client.remove(doc) await client.remove(doc)
} }
}
</script> </script>
<div class="container"> <div class="container">
@ -86,14 +92,16 @@
<div class="fs-title"> <div class="fs-title">
<Label label={attachment.string.Attachments} /> <Label label={attachment.string.Attachments} />
</div> </div>
{#if canAdd}
<div> <div>
<ActionIcon size={'medium'} icon={IconAdd} action={add} /> <ActionIcon size={'medium'} icon={IconAdd} action={add} />
</div> </div>
{/if}
</div> </div>
<div class="content"> <div class="content">
{#each docs as doc} {#each docs as doc}
<div class="item"> <div class="item">
<AttachmentPresenter value={doc} showPreview removable on:remove={() => remove(doc)} /> <AttachmentPresenter value={doc} showPreview removable={canRemove} on:remove={() => remove(doc)} />
</div> </div>
{/each} {/each}
</div> </div>

View File

@ -25,17 +25,21 @@
export let kind: ButtonKind = 'link' export let kind: ButtonKind = 'link'
export let showCounter: boolean = true export let showCounter: boolean = true
export let compactMode: boolean = false export let compactMode: boolean = false
export let disabled = false
export let canAdd = true
export let canRemove = true
</script> </script>
{#if value && value > 0} {#if value && value > 0}
{@const popupProps = { objectId: object._id, attachments: value, object, canAdd, canRemove }}
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<DocNavLink {object} inline noUnderline={true} shrink={0}> <DocNavLink {object} {disabled} inline noUnderline shrink={0}>
{#if kind === 'list'} {#if kind === 'list'}
{#if compactMode} {#if compactMode}
<div <div
use:tooltip={{ use:tooltip={{
component: AttachmentPopup, component: AttachmentPopup,
props: { objectId: object._id, attachments: value, object } props: popupProps
}} }}
class="sm-tool-icon" class="sm-tool-icon"
> >
@ -48,7 +52,7 @@
{size} {size}
showTooltip={{ showTooltip={{
component: AttachmentPopup, component: AttachmentPopup,
props: { objectId: object._id, attachments: value, object } props: popupProps
}} }}
> >
<div slot="icon"><IconAttachment {size} /></div> <div slot="icon"><IconAttachment {size} /></div>
@ -61,7 +65,7 @@
<div <div
use:tooltip={{ use:tooltip={{
component: AttachmentPopup, component: AttachmentPopup,
props: { objectId: object._id, attachments: value, object } props: popupProps
}} }}
class="sm-tool-icon" class="sm-tool-icon"
> >