mirror of
https://github.com/hcengineering/platform.git
synced 2024-12-22 11:01:54 +03:00
Update mention popup. Add svelte-check. Fix warnings. (#854)
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov
GitHub
parent
ed1550839d
commit
e848480ef3
@ -205,7 +205,7 @@ dependencies:
|
||||
'@rush-temp/chunter-assets': file:projects/chunter-assets.tgz
|
||||
'@rush-temp/chunter-resources': file:projects/chunter-resources.tgz_096c09b0b673a57c275d9767a12070b1
|
||||
'@rush-temp/client': file:projects/client.tgz
|
||||
'@rush-temp/client-resources': file:projects/client-resources.tgz
|
||||
'@rush-temp/client-resources': file:projects/client-resources.tgz_ac194b5590200ebf8338e0f86ec190f4
|
||||
'@rush-temp/contact': file:projects/contact.tgz
|
||||
'@rush-temp/contact-assets': file:projects/contact-assets.tgz
|
||||
'@rush-temp/contact-resources': file:projects/contact-resources.tgz_096c09b0b673a57c275d9767a12070b1
|
||||
@ -9398,6 +9398,63 @@ packages:
|
||||
- sugarss
|
||||
dev: false
|
||||
|
||||
/svelte-check/2.3.0_4374c622c67ed7479ff0e44c29d09bce:
|
||||
resolution: {integrity: sha512-SBKdJyUmxzPmJf/ZPqDSQOoa9JzOcgEpV7u3UaYcgVn7fA0veZ3FA5JgLU8KYtf84Gp6guBVcrC7XKLjJa5SXQ==}
|
||||
hasBin: true
|
||||
peerDependencies:
|
||||
svelte: ^3.24.0
|
||||
dependencies:
|
||||
chokidar: 3.5.2
|
||||
fast-glob: 3.2.7
|
||||
import-fresh: 3.3.0
|
||||
minimist: 1.2.5
|
||||
picocolors: 1.0.0
|
||||
sade: 1.7.4
|
||||
source-map: 0.7.3
|
||||
svelte: 3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
transitivePeerDependencies:
|
||||
- '@babel/core'
|
||||
- coffeescript
|
||||
- less
|
||||
- node-sass
|
||||
- postcss
|
||||
- postcss-load-config
|
||||
- pug
|
||||
- sass
|
||||
- stylus
|
||||
- sugarss
|
||||
dev: false
|
||||
|
||||
/svelte-check/2.3.0_ac194b5590200ebf8338e0f86ec190f4:
|
||||
resolution: {integrity: sha512-SBKdJyUmxzPmJf/ZPqDSQOoa9JzOcgEpV7u3UaYcgVn7fA0veZ3FA5JgLU8KYtf84Gp6guBVcrC7XKLjJa5SXQ==}
|
||||
hasBin: true
|
||||
peerDependencies:
|
||||
svelte: ^3.24.0
|
||||
dependencies:
|
||||
chokidar: 3.5.2
|
||||
fast-glob: 3.2.7
|
||||
import-fresh: 3.3.0
|
||||
minimist: 1.2.5
|
||||
picocolors: 1.0.0
|
||||
sade: 1.7.4
|
||||
source-map: 0.7.3
|
||||
svelte-preprocess: 4.10.1_3ae2e5fc7d8fb60bbcea513ad0b15c0f
|
||||
typescript: 4.5.4
|
||||
transitivePeerDependencies:
|
||||
- '@babel/core'
|
||||
- coffeescript
|
||||
- less
|
||||
- node-sass
|
||||
- postcss
|
||||
- postcss-load-config
|
||||
- pug
|
||||
- sass
|
||||
- stylus
|
||||
- sugarss
|
||||
dev: false
|
||||
|
||||
/svelte-dev-helper/1.1.9:
|
||||
resolution: {integrity: sha1-fRh9tcbNu9ZNdaMvkbiZi94yc8M=}
|
||||
dev: false
|
||||
@ -10807,7 +10864,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -10868,7 +10925,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -10905,8 +10962,9 @@ packages:
|
||||
- supports-color
|
||||
dev: false
|
||||
|
||||
file:projects/client-resources.tgz:
|
||||
resolution: {integrity: sha512-e47yiBH1dhkmjli6rn91Rq2XbDYF7+nHL71ll9NIn0LwZys7VxpLFO7eilXcF3NUObCLLtgPoh67aYcpeA64ug==, tarball: file:projects/client-resources.tgz}
|
||||
file:projects/client-resources.tgz_ac194b5590200ebf8338e0f86ec190f4:
|
||||
resolution: {integrity: sha512-0Aexa54EuAfPkz9aIldqI9KQyiORenx6EXyqob6quCA+elkNUJL8GSjn/t3c9ORtOjf7Qm0AJgoGw5XxJeNBrg==, tarball: file:projects/client-resources.tgz}
|
||||
id: file:projects/client-resources.tgz
|
||||
name: '@rush-temp/client-resources'
|
||||
version: 0.0.0
|
||||
dependencies:
|
||||
@ -10920,9 +10978,21 @@ packages:
|
||||
eslint-plugin-node: 11.1.0_eslint@7.32.0
|
||||
eslint-plugin-promise: 5.2.0_eslint@7.32.0
|
||||
prettier: 2.5.1
|
||||
svelte-check: 2.3.0_ac194b5590200ebf8338e0f86ec190f4
|
||||
typescript: 4.5.4
|
||||
transitivePeerDependencies:
|
||||
- '@babel/core'
|
||||
- coffeescript
|
||||
- less
|
||||
- node-sass
|
||||
- postcss
|
||||
- postcss-load-config
|
||||
- pug
|
||||
- sass
|
||||
- stylus
|
||||
- sugarss
|
||||
- supports-color
|
||||
- svelte
|
||||
dev: false
|
||||
|
||||
file:projects/client.tgz:
|
||||
@ -10969,7 +11039,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -11159,7 +11229,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
transitivePeerDependencies:
|
||||
@ -11332,7 +11402,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -11389,7 +11459,7 @@ packages:
|
||||
sass: 1.45.0
|
||||
smartcrop: 2.0.5
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -11465,7 +11535,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -11526,7 +11596,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -11587,7 +11657,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12170,7 +12240,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12286,7 +12356,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12397,7 +12467,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12622,7 +12692,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12683,7 +12753,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
transitivePeerDependencies:
|
||||
@ -12760,7 +12830,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12903,7 +12973,7 @@ packages:
|
||||
prosemirror-state: 1.3.4
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -12938,7 +13008,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -13014,7 +13084,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -13056,7 +13126,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
@ -13117,7 +13187,7 @@ packages:
|
||||
prettier-plugin-svelte: 2.5.1_prettier@2.5.1+svelte@3.44.3
|
||||
sass: 1.45.0
|
||||
svelte: 3.44.3
|
||||
svelte-check: 2.2.11_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-check: 2.3.0_4374c622c67ed7479ff0e44c29d09bce
|
||||
svelte-loader: 3.1.2_svelte@3.44.3
|
||||
svelte-preprocess: 4.10.1_14d64cad431e31f100de7363af24a44f
|
||||
typescript: 4.5.4
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
{
|
||||
"string": {
|
||||
"Suggested": "SUGGESTED"
|
||||
"Suggested": "SUGGESTED",
|
||||
"NoItems": "No items"
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,8 +82,8 @@
|
||||
function updateStyle (popup: HTMLDivElement): void {
|
||||
const x = clientRect().left
|
||||
const height = popup.getBoundingClientRect().height
|
||||
const y = clientRect().top - height - 16
|
||||
style = `left: ${x}px; top: ${y}px;`
|
||||
const y = clientRect().bottom
|
||||
style = `left: ${x}px; bottom: calc(100vh - ${y}px + 1.75rem); max-height: calc(${y}px - 2.5rem);`
|
||||
}
|
||||
|
||||
let style = 'visibility: hidden'
|
||||
@ -101,27 +101,35 @@
|
||||
$: updateItems(category, query)
|
||||
</script>
|
||||
|
||||
<div>
|
||||
<div bind:this={popup} class="completion" {style} on:keydown={onKeyDown}>
|
||||
<div class='category-container'>
|
||||
{#each categories as c}
|
||||
<div class='category-selector' class:selected={category.label === c.label}>
|
||||
<ActionIcon label={c.label} icon={c.icon} size={'medium'} action={() => {
|
||||
category = c
|
||||
onCategory(c)
|
||||
updateItems(c, query)
|
||||
} }/>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
<div class='mt-4 mb-4'>
|
||||
<EditWithIcon icon={IconSearch} bind:value={query} on:input={() => updateItems(category, query) } placeholder={category.label} />
|
||||
</div>
|
||||
<Label label={plugin.string.Suggested}/>
|
||||
<div class="scroll mt-2">
|
||||
<svelte:window on:resize={() => updateStyle(popup)} />
|
||||
<div
|
||||
class="overlay"
|
||||
on:click={() => {
|
||||
close()
|
||||
}}
|
||||
/>
|
||||
<div bind:this={popup} class="antiPopup antiPopup-withHeader antiPopup-withCategory completion" {style} on:keydown={onKeyDown}>
|
||||
<div class="ap-category">
|
||||
{#each categories as c}
|
||||
<div class="ap-categoryItem" class:selected={category.label === c.label}>
|
||||
<ActionIcon label={c.label} icon={c.icon} size={'medium'} action={() => {
|
||||
category = c
|
||||
onCategory(c)
|
||||
updateItems(c, query)
|
||||
} }/>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
<div class="ap-header">
|
||||
<EditWithIcon icon={IconSearch} bind:value={query} on:input={() => updateItems(category, query) } placeholder={category.label} />
|
||||
<div class="ap-caption"><Label label={plugin.string.Suggested} /></div>
|
||||
</div>
|
||||
<div class="ap-space" />
|
||||
<div class="ap-scroll">
|
||||
<div class="ap-box">
|
||||
{#each items as item, i}
|
||||
<div
|
||||
class="item"
|
||||
class="ap-menuItem"
|
||||
class:selected={i === selected}
|
||||
on:click={() => {
|
||||
dispatchItem(item)
|
||||
@ -136,50 +144,30 @@
|
||||
<svelte:component this={item.component} value={item.doc} {...item.componentProps ?? {}} />
|
||||
</div>
|
||||
{/each}
|
||||
{#if !items.length}
|
||||
<div class="ap-menuItem empty"><Label label={plugin.string.NoItems} /></div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="ap-space" />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.selected {
|
||||
background-color: var(--theme-button-bg-focused);
|
||||
.overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 1999;
|
||||
}
|
||||
|
||||
.completion {
|
||||
position: absolute;
|
||||
z-index: 2010;
|
||||
min-width: 300px;
|
||||
height: 332px;
|
||||
padding: 16px;
|
||||
background-color: var(--theme-button-bg-hovered);
|
||||
border: 1px solid var(--theme-bg-accent-hover);
|
||||
border-radius: 0.75rem;
|
||||
box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.1);
|
||||
|
||||
.caption {
|
||||
margin: 8px 0;
|
||||
font-weight: 600;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.5px;
|
||||
color: var(--theme-content-trans-color);
|
||||
}
|
||||
.scroll {
|
||||
max-height: calc(300px - 128px);
|
||||
display: grid;
|
||||
grid-auto-flow: row;
|
||||
gap: 12px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.category-container {
|
||||
display: flex;
|
||||
.category-selector {
|
||||
margin-right: 1rem;
|
||||
opacity: 0.7;
|
||||
&.selected {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
min-width: 20rem;
|
||||
max-width: 30rem;
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
z-index: 2000;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -29,6 +29,7 @@ export default plugin(textEditorId, {
|
||||
},
|
||||
string: {
|
||||
Suggested: '' as IntlString,
|
||||
NoItems: '' as IntlString,
|
||||
Attach: '' as IntlString,
|
||||
TextStyle: '' as IntlString,
|
||||
Emoji: '' as IntlString,
|
||||
|
||||
@ -52,12 +52,26 @@
|
||||
color: var(--theme-content-color);
|
||||
border-radius: .5rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
|
||||
&.ap-woScroll { margin: 0 .5rem; }
|
||||
&.selected { background-color: var(--theme-button-bg-hovered); }
|
||||
&.empty {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-style: italic;
|
||||
color: var(--theme-content-trans-color);
|
||||
cursor: default;
|
||||
|
||||
&:hover {
|
||||
color: var(--theme-content-trans-color);
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--theme-caption-color);
|
||||
background-color: var(--theme-button-bg-hovered);
|
||||
cursor: pointer;
|
||||
}
|
||||
&:focus {
|
||||
color: var(--theme-content-accent-color);
|
||||
@ -103,6 +117,33 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-withCategory {
|
||||
.ap-category {
|
||||
flex-shrink: 0;
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
margin: 1rem 1rem .25rem;
|
||||
|
||||
.ap-categoryItem {
|
||||
margin: .25rem;
|
||||
color: var(--theme-content-trans-color);
|
||||
cursor: pointer;
|
||||
|
||||
&.selected { color: var(--theme-caption-color); }
|
||||
&:hover { color: var(--theme-content-accent-color); }
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar:horizontal { height: .125rem; }
|
||||
&::-webkit-scrollbar-thumb { background-color: var(--theme-button-bg-hovered); }
|
||||
}
|
||||
.ap-header {
|
||||
margin: .25rem 1rem 0;
|
||||
.ap-caption {
|
||||
margin: .5rem 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .popup .tr-body:hover { background-color: transparent !important; } // Remove highlights table rows in popups
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
import { createEventDispatcher } from 'svelte'
|
||||
import EditWithIcon from './EditWithIcon.svelte'
|
||||
import IconSearch from './icons/Search.svelte'
|
||||
import plugin from '../plugin'
|
||||
|
||||
export let value: string = ''
|
||||
|
||||
@ -11,6 +12,7 @@
|
||||
|
||||
<EditWithIcon
|
||||
icon={IconSearch}
|
||||
placeholder={plugin.string.Search}
|
||||
bind:value={_search}
|
||||
on:change={() => {
|
||||
if (_search === '') {
|
||||
|
||||
@ -9,7 +9,8 @@
|
||||
"build:docs": "api-extractor run --local",
|
||||
"lint": "svelte-check && eslint",
|
||||
"lint:fix": "eslint --fix src",
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src"
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src",
|
||||
"svelte-check": "svelte-check"
|
||||
},
|
||||
"devDependencies": {
|
||||
"svelte-loader": "^3.1.2",
|
||||
|
||||
@ -131,7 +131,7 @@
|
||||
config={['', 'lastModified']}
|
||||
options={{}}
|
||||
query={{ attachedTo: objectId }}
|
||||
loadingProps={ { length: attachments } }
|
||||
loadingProps={ { length: attachments ?? 0 } }
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
@ -47,7 +47,7 @@
|
||||
if (!file.type.startsWith('image/')) return
|
||||
loading++
|
||||
try {
|
||||
const uuid = await uploadFile(file, space, objectId)
|
||||
const uuid = await uploadFile(file, { space, attachedTo: objectId })
|
||||
console.log('uploaded file uuid', uuid)
|
||||
client.addCollection(attachment.class.Photo, space, objectId, _class, 'photos', {
|
||||
name: file.name,
|
||||
|
||||
@ -9,7 +9,8 @@
|
||||
"build:watch": "tsc",
|
||||
"lint:fix": "eslint --fix src",
|
||||
"lint": "eslint src",
|
||||
"format": "prettier --write src && eslint --fix src"
|
||||
"format": "prettier --write src && eslint --fix src",
|
||||
"svelte-check": "svelte-check"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@anticrm/platform-rig": "~0.6.0",
|
||||
@ -23,7 +24,8 @@
|
||||
"eslint-config-standard-with-typescript": "^21.0.1",
|
||||
"prettier": "^2.4.1",
|
||||
"@rushstack/heft": "^0.41.1",
|
||||
"typescript": "^4.3.5"
|
||||
"typescript": "^4.3.5",
|
||||
"svelte-check": "~2.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@anticrm/platform": "~0.6.5",
|
||||
|
||||
@ -9,7 +9,8 @@
|
||||
"build:docs": "api-extractor run --local",
|
||||
"lint": "svelte-check && eslint",
|
||||
"lint:fix": "eslint --fix src",
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src"
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src",
|
||||
"svelte-check": "svelte-check"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@anticrm/platform-rig": "~0.6.0",
|
||||
|
||||
@ -9,7 +9,8 @@
|
||||
"build:docs": "api-extractor run --local",
|
||||
"lint": "svelte-check && eslint",
|
||||
"lint:fix": "eslint --fix src",
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src"
|
||||
"format": "prettier --write --plugin-search-dir=. src && eslint --fix src",
|
||||
"svelte-check": "svelte-check"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@anticrm/platform-rig": "~0.6.0",
|
||||
|
||||
@ -14,14 +14,15 @@
|
||||
// limitations under the License.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { Doc, DocumentQuery } from '@anticrm/core'
|
||||
import { DocumentQuery } from '@anticrm/core'
|
||||
import { Button, Icon, Label, ScrollBox, SearchEdit, showPopup } from '@anticrm/ui'
|
||||
import type { Category } from '@anticrm/inventory'
|
||||
import inventory from '../plugin'
|
||||
import CreateCategory from './CreateCategory.svelte'
|
||||
import HierarchyView from './HierarchyView.svelte'
|
||||
|
||||
let search = ''
|
||||
let resultQuery: DocumentQuery<Doc> = {}
|
||||
let resultQuery: DocumentQuery<Category> = {}
|
||||
|
||||
function updateResultQuery (search: string): void {
|
||||
resultQuery = (search === '') ? { } : { $search: search }
|
||||
|
||||
@ -66,6 +66,12 @@
|
||||
>
|
||||
<StatusControl slot="error" {status} />
|
||||
<Grid column={1} rowGap={1.5}>
|
||||
<EditBox label={inventory.string.Category} bind:value={name} placeholder="Category" maxWidth={'16rem'} focus />
|
||||
<EditBox
|
||||
label={inventory.string.Category}
|
||||
bind:value={name}
|
||||
placeholder={inventory.string.Category}
|
||||
maxWidth={'16rem'}
|
||||
focus
|
||||
/>
|
||||
</Grid>
|
||||
</Card>
|
||||
|
||||
@ -14,7 +14,7 @@
|
||||
// limitations under the License.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { Account, generateId, Ref } from '@anticrm/core'
|
||||
import { Account, generateId, Ref, Doc } from '@anticrm/core'
|
||||
import { Card, createQuery, getClient } from '@anticrm/presentation'
|
||||
import { DropdownLabels, EditBox, Grid } from '@anticrm/ui'
|
||||
import { createEventDispatcher } from 'svelte'
|
||||
@ -24,7 +24,7 @@
|
||||
|
||||
const doc: Product = {
|
||||
name: '',
|
||||
attachedTo: undefined,
|
||||
attachedTo: '' as Ref<Doc>,
|
||||
attachedToClass: inventory.class.Category,
|
||||
_class: inventory.class.Product,
|
||||
space: inventory.space.Products,
|
||||
@ -71,14 +71,20 @@
|
||||
<Card
|
||||
label={inventory.string.CreateProduct}
|
||||
okAction={create}
|
||||
canSave={doc.name.trim().length > 0 && doc.attachedTo !== undefined}
|
||||
canSave={doc.name.trim().length > 0 && doc.attachedTo.length > 0}
|
||||
bind:space={doc.space}
|
||||
on:close={() => {
|
||||
dispatch('close')
|
||||
}}
|
||||
>
|
||||
<Grid column={1} rowGap={1.75}>
|
||||
<EditBox label={inventory.string.Product} bind:value={doc.name} placeholder="Product" maxWidth={'16rem'} focus />
|
||||
<EditBox
|
||||
label={inventory.string.Product}
|
||||
bind:value={doc.name}
|
||||
placeholder={inventory.string.Product}
|
||||
maxWidth={'16rem'}
|
||||
focus
|
||||
/>
|
||||
<DropdownLabels
|
||||
header
|
||||
items={categories}
|
||||
|
||||
@ -66,7 +66,18 @@
|
||||
}}
|
||||
>
|
||||
<Grid column={1} rowGap={1.75}>
|
||||
<EditBox label={inventory.string.Variant} bind:value={doc.name} placeholder="Variant" maxWidth={'16rem'} focus />
|
||||
<EditBox label={inventory.string.SKU} bind:value={doc.sku} placeholder="SKU" maxWidth={'16rem'} />
|
||||
<EditBox
|
||||
label={inventory.string.Variant}
|
||||
bind:value={doc.name}
|
||||
placeholder={inventory.string.Variant}
|
||||
maxWidth={'16rem'}
|
||||
focus
|
||||
/>
|
||||
<EditBox
|
||||
label={inventory.string.SKU}
|
||||
bind:value={doc.sku}
|
||||
placeholder={inventory.string.SKU}
|
||||
maxWidth={'16rem'}
|
||||
/>
|
||||
</Grid>
|
||||
</Card>
|
||||
|
||||
@ -59,14 +59,14 @@
|
||||
$: style = `margin-left: ${level * 1.5}rem;`
|
||||
</script>
|
||||
|
||||
{#each descendants.get(parent) ?? [] as object, row (object._id)}
|
||||
{#each descendants.get(parent) ?? [] as object (object._id)}
|
||||
<tr class="tr-body">
|
||||
{#each model as attribute, cell}
|
||||
{#if !cell}
|
||||
<td>
|
||||
<div class="firstCell" {style}>
|
||||
{#if descendants.has(object._id)}
|
||||
<div class="expand" on:click={(ev) => click(object._id)}>
|
||||
<div class="expand" on:click={() => click(object._id)}>
|
||||
{#if expanded.has(object._id)}
|
||||
<Expand size={'small'} />
|
||||
{:else}
|
||||
|
||||
@ -14,7 +14,7 @@
|
||||
// limitations under the License.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { Button, EditWithIcon, Icon, IconSearch, Label, ScrollBox, showPopup } from '@anticrm/ui'
|
||||
import ui, { Button, EditWithIcon, Icon, IconSearch, Label, ScrollBox, showPopup } from '@anticrm/ui'
|
||||
import CreateProduct from './CreateProduct.svelte'
|
||||
import inventory from '../plugin'
|
||||
import { Table } from '@anticrm/view-resources'
|
||||
@ -45,7 +45,7 @@
|
||||
|
||||
<EditWithIcon
|
||||
icon={IconSearch}
|
||||
placeholder={'Search'}
|
||||
placeholder={ui.string.Search}
|
||||
bind:value={search}
|
||||
on:change={() => {
|
||||
resultQuery = {}
|
||||
|
||||
@ -23,7 +23,7 @@
|
||||
|
||||
export let variants: number
|
||||
|
||||
const create = (ev: MouseEvent): void => showPopup(CreateVariant, { product: objectId }, ev.target as HTMLElement)
|
||||
const create = (ev: MouseEvent): void => { showPopup(CreateVariant, { product: objectId }, ev.target as HTMLElement) }
|
||||
</script>
|
||||
|
||||
<div class="variants-container">
|
||||
|
||||
@ -24,8 +24,8 @@
|
||||
import FileDuo from './icons/FileDuo.svelte'
|
||||
|
||||
export let objectId: Ref<Doc>
|
||||
export let space: Ref<Space>
|
||||
export let _class: Ref<Class<Doc>>
|
||||
// export let space: Ref<Space>
|
||||
// export let _class: Ref<Class<Doc>>
|
||||
|
||||
export let applications: number
|
||||
|
||||
|
||||
@ -66,11 +66,6 @@
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-button-bg-enabled);
|
||||
.tool {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
&:hover { background-color: var(--theme-button-bg-enabled); }
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,7 +26,7 @@
|
||||
import Header from './Header.svelte'
|
||||
|
||||
export let spaceId: Ref<Space> | undefined
|
||||
export let _class: Ref<Class<Doc>> | undefined
|
||||
// export let _class: Ref<Class<Doc>> | undefined
|
||||
export let createItemDialog: AnyComponent | undefined
|
||||
export let search: string
|
||||
export let viewlet: WithLookup<Viewlet> | undefined
|
||||
|
||||
Loading…
Reference in New Issue
Block a user