mirror of
https://github.com/hcengineering/platform.git
synced 2024-11-22 03:14:40 +03:00
UBER-450: update MentionList. (#3431)
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov
GitHub
parent
ef6d5a519f
commit
8a28be507b
@ -705,7 +705,7 @@ export function createModel (builder: Builder): void {
|
||||
presentation.class.ObjectSearchCategory,
|
||||
core.space.Model,
|
||||
{
|
||||
icon: contact.icon.Person,
|
||||
icon: contact.icon.Persona,
|
||||
label: contact.string.SearchPerson,
|
||||
query: contact.completion.PersonQuery
|
||||
},
|
||||
|
||||
@ -18,15 +18,16 @@
|
||||
|
||||
import { getResource, IntlString } from '@hcengineering/platform'
|
||||
import ui, {
|
||||
Button,
|
||||
createFocusManager,
|
||||
deviceOptionsStore,
|
||||
EditBox,
|
||||
FocusHandler,
|
||||
IconSearch,
|
||||
Label,
|
||||
ListView,
|
||||
resizeObserver
|
||||
resizeObserver,
|
||||
Icon,
|
||||
tooltip,
|
||||
EditWithIcon
|
||||
} from '@hcengineering/ui'
|
||||
import { createEventDispatcher } from 'svelte'
|
||||
import presentation from '../plugin'
|
||||
@ -149,85 +150,64 @@
|
||||
$: updateItems(category, query, relatedDocuments)
|
||||
|
||||
const manager = createFocusManager()
|
||||
|
||||
const isStatusDisabled = (status: number) => status === 0
|
||||
</script>
|
||||
|
||||
<FocusHandler {manager} />
|
||||
|
||||
<form
|
||||
class="antiCard dialog completion objectPopup"
|
||||
on:keydown={onKeyDown}
|
||||
use:resizeObserver={() => dispatch('changeSize')}
|
||||
>
|
||||
<div class="header-dialog">
|
||||
<form class="antiPopup" on:keydown={onKeyDown} use:resizeObserver={() => dispatch('changeSize')}>
|
||||
<div class="ap-menuHeader">
|
||||
{#if label}
|
||||
<div class="fs-title flex-grow mb-4">
|
||||
<div class="ap-subheader caption">
|
||||
<Label {label} />
|
||||
</div>
|
||||
{/if}
|
||||
<div class="flex-row-center gap-1">
|
||||
<div class="tabs">
|
||||
{#each categories as c, i}
|
||||
{@const status = categoryStatus[c._id] ?? 0}
|
||||
<div class="ap-categoryItem">
|
||||
<Button
|
||||
focusIndex={i + 1}
|
||||
kind={'transparent'}
|
||||
showTooltip={{ label: c.label }}
|
||||
selected={category?._id === c._id}
|
||||
icon={c.icon}
|
||||
size={'x-large'}
|
||||
disabled={status === 0}
|
||||
on:click={() => {
|
||||
category = c
|
||||
}}
|
||||
/>
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
|
||||
<div
|
||||
class="tab"
|
||||
class:selected={category?._id === c._id}
|
||||
class:disabled={isStatusDisabled(status)}
|
||||
use:tooltip={{ label: c.label }}
|
||||
tabindex={i + 1}
|
||||
on:click={() => (category = c)}
|
||||
>
|
||||
<Icon icon={c.icon} size={'small'} />
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
<EditBox
|
||||
autoFocus={!$deviceOptionsStore.isMobile}
|
||||
</div>
|
||||
<div class="pt-2 pb-1 pl-2 pr-2">
|
||||
<EditWithIcon
|
||||
icon={IconSearch}
|
||||
kind={'search-style'}
|
||||
focusIndex={0}
|
||||
size={'large'}
|
||||
width={'100%'}
|
||||
autoFocus={!$deviceOptionsStore.isMobile}
|
||||
bind:value={query}
|
||||
on:input={() => updateItems(category, query, relatedDocuments)}
|
||||
placeholder={category?.label}
|
||||
on:input={() => updateItems(category, query, relatedDocuments)}
|
||||
/>
|
||||
</div>
|
||||
<div class="ap-menuItem separator halfMargin" />
|
||||
<div class="ap-subheader">
|
||||
<Label label={ui.string.Suggested} />
|
||||
</div>
|
||||
<div class="antiCard-content min-h-60 max-h-60 p-4">
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<ListView bind:this={list} bind:selection count={items.length}>
|
||||
<svelte:fragment slot="item" let:item>
|
||||
{@const doc = items[item]}
|
||||
<div class="p-1 cursor-pointer" on:click={() => dispatchItem(doc)}>
|
||||
<svelte:component this={doc.component} value={doc.doc} {...doc.componentProps ?? {}} />
|
||||
</div>
|
||||
</svelte:fragment>
|
||||
</ListView>
|
||||
</div>
|
||||
{#if !hideButtons}
|
||||
<div class="antiCard-footer reverse">
|
||||
<div class="buttons-group text-sm flex-no-shrink">
|
||||
<Button label={presentation.string.Cancel} on:click={() => dispatch('close')} />
|
||||
</div>
|
||||
<div class="ap-scroll">
|
||||
<div class="ap-box">
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<ListView bind:this={list} bind:selection count={items.length}>
|
||||
<svelte:fragment slot="item" let:item>
|
||||
{@const doc = items[item]}
|
||||
<div class="ap-menuItem withComp" on:click={() => dispatchItem(doc)}>
|
||||
<svelte:component this={doc.component} value={doc.doc} {...doc.componentProps ?? {}} />
|
||||
</div>
|
||||
</svelte:fragment>
|
||||
</ListView>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="ap-space x2" />
|
||||
</form>
|
||||
|
||||
<style lang="scss">
|
||||
.header-dialog {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
padding: 1.125rem 1.125rem 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.completion {
|
||||
z-index: 2000;
|
||||
}
|
||||
.objectPopup {
|
||||
min-height: 10rem;
|
||||
min-width: 10rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -65,9 +65,11 @@
|
||||
let tempStyle = ''
|
||||
if (rect.top < hDoc - rect.bottom) {
|
||||
// 20rem - 1.75rem
|
||||
tempStyle = `top: calc(${rect.bottom}px + .75rem); max-height: calc(${hDoc - rect.bottom}px - 1.75rem); `
|
||||
const maxH: number = hDoc - rect.bottom - 40 >= 480 ? 480 : hDoc - rect.bottom - 40
|
||||
tempStyle = `top: calc(${rect.bottom}px + .75rem); max-height: ${maxH}px; `
|
||||
} else {
|
||||
tempStyle = `bottom: calc(${hDoc - rect.top}px + .75rem); max-height: calc(${rect.top}px - 1.75rem); `
|
||||
const maxH: number = rect.top - 40 >= 480 ? 480 : rect.top - 40
|
||||
tempStyle = `bottom: calc(${hDoc - rect.top}px + .75rem); max-height: ${maxH}px; `
|
||||
}
|
||||
if (rect.left + wPopup > wDoc - 16) {
|
||||
// 30rem - 1.75rem
|
||||
@ -95,7 +97,7 @@
|
||||
updateStyle()
|
||||
}}
|
||||
>
|
||||
<ObjectSearchPopup bind:this={searchPopup} {query} on:close={(evt) => dispatchItem(evt.detail)} hideButtons={true} />
|
||||
<ObjectSearchPopup bind:this={searchPopup} {query} on:close={(evt) => dispatchItem(evt.detail)} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
@ -110,10 +112,10 @@
|
||||
|
||||
.completion {
|
||||
position: absolute;
|
||||
// min-width: 20rem;
|
||||
// max-width: 30rem;
|
||||
// min-height: 0;
|
||||
// max-height: 30rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
z-index: 10001;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -726,11 +726,15 @@ input.search {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
}
|
||||
.svg-x-large {
|
||||
width: 1.75rem;
|
||||
height: 1.75rem;
|
||||
}
|
||||
.svg-full {
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
}
|
||||
.svg-card, .svg-x-small, .svg-small, .svg-medium, .svg-large { flex-shrink: 0; }
|
||||
.svg-card, .svg-x-small, .svg-small, .svg-medium, .svg-large, .svg-x-large { flex-shrink: 0; }
|
||||
|
||||
.svg-mask {
|
||||
position: absolute;
|
||||
|
||||
@ -244,6 +244,7 @@
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.ap-menuItem {
|
||||
flex-shrink: 0;
|
||||
@ -255,10 +256,18 @@
|
||||
|
||||
&:not(.separator) {
|
||||
margin: 0 .5rem;
|
||||
padding: .25rem .5rem;
|
||||
min-height: 2.25rem;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
&:not(.separator, .withComp) { padding: .25rem .5rem; }
|
||||
&.withComp {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
padding: .25rem .5rem .25rem 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
&.selected,
|
||||
&.hoverable:hover { background: var(--theme-popup-hover); }
|
||||
&.empty {
|
||||
@ -324,9 +333,11 @@
|
||||
|
||||
&.separator {
|
||||
flex-shrink: 0;
|
||||
margin: .5rem 0;
|
||||
height: 1px;
|
||||
background-color: var(--theme-popup-divider);
|
||||
|
||||
&:not(.halfMargin) { margin: .5rem 0; }
|
||||
&.halfMargin { margin: .25rem 0; }
|
||||
}
|
||||
}
|
||||
.ap-check {
|
||||
@ -336,20 +347,60 @@
|
||||
height: 1rem;
|
||||
color: var(--theme-dark-color);
|
||||
}
|
||||
.ap-subheader {
|
||||
flex-shrink: 0;
|
||||
padding: .5rem 1rem;
|
||||
min-width: 0;
|
||||
min-height: 2rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
font-size: .625rem;
|
||||
color: var(--theme-dark-color);
|
||||
|
||||
&:not(.caption) { letter-spacing: 1px; }
|
||||
&.caption {
|
||||
padding-top: 1rem;
|
||||
color: var(--theme-caption-color);
|
||||
}
|
||||
}
|
||||
.ap-menuHeader {
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 .5rem;
|
||||
width: 100%;
|
||||
height: 3rem;
|
||||
color: var(--theme-caption-color);
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
flex-direction: column;
|
||||
border-bottom: 1px solid var(--theme-popup-divider);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-popup-divider);
|
||||
outline: none;
|
||||
.tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 .375rem;
|
||||
min-width: 0;
|
||||
|
||||
.tab {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-width: 2.25rem;
|
||||
min-height: 2.75rem;
|
||||
color: var(--theme-dark-color);
|
||||
outline: none;
|
||||
|
||||
&:not(:last-child) { margin-right: .375rem; }
|
||||
&:not(.selected, .disabled) { cursor: pointer; }
|
||||
&.disabled { color: var(--theme-darker-color); }
|
||||
&.selected {
|
||||
color: var(--theme-caption-color);
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
left: 0;
|
||||
bottom: -1px;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: var(--theme-link-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -65,6 +65,10 @@
|
||||
<path d="M8 3.99988C7.50555 3.99988 7.0222 4.1465 6.61108 4.4212C6.19995 4.69591 5.87952 5.08635 5.6903 5.54317C5.50108 5.99998 5.45158 6.50265 5.54804 6.9876C5.6445 7.47256 5.88261 7.91801 6.23224 8.26764C6.58187 8.61728 7.02733 8.85538 7.51228 8.95184C7.99723 9.0483 8.4999 8.9988 8.95671 8.80958C9.41353 8.62036 9.80397 8.29993 10.0787 7.8888C10.3534 7.47768 10.5 6.99433 10.5 6.49988C10.5 5.83684 10.2366 5.20095 9.76777 4.73211C9.29893 4.26327 8.66304 3.99988 8 3.99988ZM8 7.99988C7.70333 7.99988 7.41332 7.9119 7.16665 7.74708C6.91997 7.58226 6.72771 7.34799 6.61418 7.0739C6.50065 6.79981 6.47095 6.49821 6.52882 6.20724C6.5867 5.91627 6.72956 5.649 6.93934 5.43922C7.14912 5.22944 7.4164 5.08658 7.70737 5.0287C7.99834 4.97082 8.29994 5.00053 8.57403 5.11406C8.84812 5.22759 9.08239 5.41985 9.24721 5.66652C9.41203 5.9132 9.5 6.20321 9.5 6.49988C9.49955 6.89756 9.34137 7.27883 9.06017 7.56004C8.77896 7.84125 8.39769 7.99943 8 7.99988Z" />
|
||||
<path d="M8 0.999878C6.61553 0.999878 5.26216 1.41042 4.11101 2.17959C2.95987 2.94876 2.06266 4.04201 1.53285 5.32109C1.00303 6.60018 0.86441 8.00764 1.13451 9.36551C1.4046 10.7234 2.07129 11.9707 3.05026 12.9496C4.02922 13.9286 5.2765 14.5953 6.63437 14.8654C7.99224 15.1355 9.3997 14.9968 10.6788 14.467C11.9579 13.9372 13.0511 13.04 13.8203 11.8889C14.5895 10.7377 15 9.38435 15 7.99988C14.9979 6.144 14.2597 4.36474 12.9474 3.05244C11.6351 1.74014 9.85588 1.00197 8 0.999878ZM5 13.1881V12.4999C5.00044 12.1022 5.15862 11.7209 5.43983 11.4397C5.72104 11.1585 6.10231 11.0003 6.5 10.9999H9.5C9.89769 11.0003 10.279 11.1585 10.5602 11.4397C10.8414 11.7209 10.9996 12.1022 11 12.4999V13.1881C10.0896 13.7197 9.05426 13.9999 8 13.9999C6.94574 13.9999 5.91042 13.7197 5 13.1881ZM11.9963 12.4628C11.9863 11.8069 11.7191 11.1812 11.2521 10.7205C10.7852 10.2598 10.156 10.001 9.5 9.99988H6.5C5.84405 10.001 5.2148 10.2598 4.74786 10.7205C4.28093 11.1812 4.01369 11.8069 4.00375 12.4628C3.09703 11.6532 2.45762 10.5872 2.17017 9.40611C1.88272 8.22501 1.9608 6.98445 2.39407 5.84871C2.82734 4.71297 3.59536 3.73561 4.59644 3.04606C5.59751 2.35651 6.78442 1.98729 8 1.98729C9.21558 1.98729 10.4025 2.35651 11.4036 3.04606C12.4046 3.73561 13.1727 4.71297 13.6059 5.84871C14.0392 6.98445 14.1173 8.22501 13.8298 9.40611C13.5424 10.5872 12.903 11.6532 11.9963 12.4628Z" />
|
||||
</symbol>
|
||||
<symbol id="persona" viewBox="0 0 32 32">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 16C19.3137 16 22 13.3137 22 10C22 6.68629 19.3137 4 16 4C12.6863 4 10 6.68629 10 10C10 13.3137 12.6863 16 16 16ZM16 18C20.4183 18 24 14.4183 24 10C24 5.58172 20.4183 2 16 2C11.5817 2 8 5.58172 8 10C8 14.4183 11.5817 18 16 18Z" />
|
||||
<path d="M13 20C9.13401 20 6 23.134 6 27V29C6 29.5523 6.44772 30 7 30C7.55228 30 8 29.5523 8 29V27C8 24.2386 10.2386 22 13 22H19C21.7614 22 24 24.2386 24 27V29C24 29.5523 24.4477 30 25 30C25.5523 30 26 29.5523 26 29V27C26 23.134 22.866 20 19 20H13Z" />
|
||||
</symbol>
|
||||
<symbol id="social-edit" viewBox="0 0 24 24">
|
||||
<path d="M22,12.2c-0.4,0-0.8,0.3-0.8,0.8v2c0,4.6-1.6,6.2-6.2,6.2H9c-4.6,0-6.2-1.6-6.2-6.2V9c0-4.6,1.6-6.2,6.2-6.2h2 c0.4,0,0.8-0.3,0.8-0.8S11.4,1.2,11,1.2H9C3.6,1.2,1.2,3.6,1.2,9v6c0,5.4,2.3,7.8,7.8,7.8h6c5.4,0,7.8-2.3,7.8-7.8v-2 C22.8,12.6,22.4,12.2,22,12.2z" />
|
||||
<path d="M14.4,3.6l-6.8,6.8c-0.4,0.4-0.8,1.2-0.9,1.7l-0.4,3c-0.1,0.8,0.1,1.5,0.6,2c0.4,0.4,1,0.6,1.6,0.6c0.1,0,0.2,0,0.4,0 l3-0.4c0.6-0.1,1.3-0.5,1.7-0.9l7.9-7.9c0.9-0.9,1.4-1.8,1.5-2.7c0.1-1.1-0.4-2.2-1.5-3.3c-2-2-4-2-6,0L14.4,3.6 C14.4,3.6,14.4,3.6,14.4,3.6z M12.6,15.3c-0.2,0.2-0.6,0.4-0.9,0.5l-3,0.4c-0.3,0-0.5,0-0.7-0.2c-0.2-0.1-0.2-0.4-0.2-0.7l0.4-3 c0-0.3,0.3-0.7,0.4-0.9l5.9-5.9c0.8,1.7,2.2,3.1,3.9,3.9L12.6,15.3z M20.4,3.5c0.8,0.8,1.1,1.5,1,2.1c0,0.5-0.4,1.1-1,1.8l-0.8,0.8 c-1.8-0.6-3.2-2.1-3.9-3.9l0.8-0.8C17.7,2.4,18.8,1.9,20.4,3.5z" />
|
||||
|
||||
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
@ -34,6 +34,7 @@ loadMetadata(contact.icon, {
|
||||
GitHub: `${icons}#github`,
|
||||
Edit: `${icons}#edit`,
|
||||
Person: `${icons}#person`,
|
||||
Persona: `${icons}#persona`,
|
||||
Company: `${icons}#company`,
|
||||
SocialEdit: `${icons}#social-edit`,
|
||||
Homepage: `${icons}#homepage`,
|
||||
|
||||
@ -150,7 +150,7 @@ const toObjectSearchResult = (e: WithLookup<Contact>): ObjectSearchResult => ({
|
||||
icon: Avatar,
|
||||
iconProps: { size: 'x-small', avatar: e.avatar },
|
||||
component: UserInfo,
|
||||
componentProps: { size: 'x-small' }
|
||||
componentProps: { size: 'smaller' }
|
||||
})
|
||||
|
||||
async function queryContact (
|
||||
|
||||
@ -237,6 +237,7 @@ export const contactPlugin = plugin(contactId, {
|
||||
GitHub: '' as Asset,
|
||||
Edit: '' as Asset,
|
||||
Person: '' as Asset,
|
||||
Persona: '' as Asset,
|
||||
Company: '' as Asset,
|
||||
SocialEdit: '' as Asset,
|
||||
Homepage: '' as Asset,
|
||||
|
||||
@ -8,11 +8,8 @@
|
||||
<path d="M7.91486 10.1761C7.80538 9.1186 6.91913 8.30487 5.8592 8.29183C5.53827 8.92804 5.21105 9.90848 5.01729 10.5311C4.93355 10.8002 5.16675 11.0527 5.44262 10.9905C6.16831 10.8268 7.36057 10.5217 7.91486 10.1761Z"/>
|
||||
<path d="M4.75 2C2.67893 2 1 3.67893 1 5.75V11.25C1 13.3211 2.67893 15 4.75 15H10.2501C12.3212 15 14.0001 13.3211 14.0001 11.25V8C14.0001 7.58579 13.6643 7.25 13.2501 7.25C12.8359 7.25 12.5001 7.58579 12.5001 8V11.25C12.5001 12.4926 11.4927 13.5 10.2501 13.5H4.75C3.50736 13.5 2.5 12.4926 2.5 11.25V5.75C2.5 4.50736 3.50736 3.5 4.75 3.5H7C7.41421 3.5 7.75 3.16421 7.75 2.75C7.75 2.33579 7.41421 2 7 2H4.75Z"/>
|
||||
</symbol>
|
||||
<symbol id="document" viewBox="0 0 24 24">
|
||||
<path d="M21.2,7.9c0-0.1,0-0.1,0-0.2c0-0.1-0.1-0.1-0.1-0.1c0,0,0-0.1-0.1-0.1l-5.5-6c0,0,0,0,0,0c0,0-0.1-0.1-0.1-0.1c0,0-0.1-0.1-0.1-0.1c0,0-0.1,0-0.1,0c-0.1,0-0.1,0-0.2,0c0,0,0,0,0,0H6.5C6.1,1.2,5.8,1.6,5.8,2v17c0,0.4,0.3,0.8,0.8,0.8h14c0.4,0,0.8-0.3,0.8-0.8V8C21.2,8,21.2,7.9,21.2,7.9z M15.8,3.9l3,3.3h-3V3.9z M19.8,18.2H7.2V2.8h7V8c0,0.4,0.3,0.8,0.8,0.8h4.8V18.2z"/>
|
||||
<path d="M14,21.2H4.2V10c0-0.4-0.3-0.8-0.8-0.8S2.8,9.6,2.8,10v12c0,0.4,0.3,0.8,0.8,0.8H14c0.4,0,0.8-0.3,0.8-0.8C14.8,21.6,14.4,21.2,14,21.2z"/>
|
||||
<path d="M9.5,10.8h2c0.4,0,0.8-0.3,0.8-0.8c0-0.4-0.3-0.8-0.8-0.8h-2c-0.4,0-0.8,0.3-0.8,0.8C8.8,10.4,9.1,10.8,9.5,10.8z"/>
|
||||
<path d="M8.8,14c0,0.4,0.3,0.8,0.8,0.8h6c0.4,0,0.8-0.3,0.8-0.8c0-0.4-0.3-0.8-0.8-0.8h-6C9.1,13.2,8.8,13.6,8.8,14z"/>
|
||||
<symbol id="document" viewBox="0 0 32 32">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10 4C8.89543 4 8 4.89543 8 6V26C8 27.1046 8.89543 28 10 28H22C23.1046 28 24 27.1046 24 26V12H20C17.7909 12 16 10.2091 16 8V4H10ZM18 4.41421V8C18 9.10457 18.8954 10 20 10H23.5858L18 4.41421ZM6 6C6 3.79086 7.79086 2 10 2H17.5858C18.1162 2 18.6249 2.21071 19 2.58579L25.4142 9C25.7893 9.37507 26 9.88378 26 10.4142V26C26 28.2091 24.2091 30 22 30H10C7.79086 30 6 28.2091 6 26V6ZM10 17C10 16.4477 10.4477 16 11 16H15C15.5523 16 16 16.4477 16 17C16 17.5523 15.5523 18 15 18H11C10.4477 18 10 17.5523 10 17ZM10 21C10 20.4477 10.4477 20 11 20H21C21.5523 20 22 20.4477 22 21C22 21.5523 21.5523 22 21 22H11C10.4477 22 10 21.5523 10 21Z" />
|
||||
</symbol>
|
||||
<symbol id="library" viewBox="0 0 24 24">
|
||||
<path d="M21,2.2h-5h-5c-0.4,0-0.8,0.3-0.8,0.8v18c0,0.4,0.3,0.8,0.8,0.8h5h5c0.4,0,0.8-0.3,0.8-0.8V3C21.8,2.6,21.4,2.2,21,2.2z M11.8,3.8h3.5v16.5h-3.5V3.8z M20.2,20.2h-3.5V3.8h3.5V20.2z"/>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.2 KiB |
@ -26,18 +26,14 @@
|
||||
const lastVersion = versions.length > 0 ? versions[versions.length - 1] : undefined
|
||||
</script>
|
||||
|
||||
<div class="flex item">
|
||||
<Icon icon={document.icon.Document} size={'medium'} />
|
||||
<div class="ml-2">
|
||||
<div class="flex-row-center">
|
||||
<div class="flex-center p-1 content-dark-color flex-no-shrink mr-2-5">
|
||||
<Icon icon={document.icon.Document} size={'medium'} />
|
||||
</div>
|
||||
<span class="overflow-label">
|
||||
{value.name}
|
||||
{#if lastVersion}
|
||||
- {lastVersion?.version}
|
||||
{/if}
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -19,9 +19,12 @@
|
||||
<path d="M9.6,9.9H5.8c-0.3,0-0.5,0.2-0.5,0.5s0.2,0.5,0.5,0.5h3.8c0.3,0,0.5-0.2,0.5-0.5S9.9,9.9,9.6,9.9z"/>
|
||||
<path d="M5.8,8.3h2.4c0.3,0,0.5-0.2,0.5-0.5S8.4,7.3,8.2,7.3H5.8c-0.3,0-0.5,0.2-0.5,0.5S5.5,8.3,5.8,8.3z"/>
|
||||
</symbol>
|
||||
<symbol id="application" viewBox="0 0 24 24">
|
||||
<path d="M12,10.8c2.6,0,4.8-2.1,4.8-4.8S14.6,1.2,12,1.2C9.4,1.2,7.2,3.4,7.2,6S9.4,10.8,12,10.8z M12,2.8 c1.8,0,3.2,1.5,3.2,3.2S13.8,9.2,12,9.2S8.8,7.8,8.8,6S10.2,2.8,12,2.8z" />
|
||||
<path d="M12,12.2c-5.4,0-9.8,4.4-9.8,9.8c0,0.4,0.3,0.8,0.8,0.8s0.8-0.3,0.8-0.8c0-4.2,3.1-7.7,7.2-8.2l-1.7,5.5 c-0.1,0.2,0,0.5,0.1,0.7l2,2.5c0.1,0.2,0.4,0.3,0.6,0.3s0.4-0.1,0.6-0.3l2-2.5c0.2-0.2,0.2-0.5,0.1-0.7L13,13.8 c4.1,0.5,7.2,4,7.2,8.2c0,0.4,0.3,0.8,0.8,0.8s0.8-0.3,0.8-0.8C21.8,16.6,17.4,12.2,12,12.2z M12,20.8l-1.2-1.5l1.2-3.8l1.2,3.8 L12,20.8z" />
|
||||
<symbol id="application" viewBox="0 0 32 32">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.2223 16.3259C13.5645 16.7654 12.7911 17 12 17C10.9391 17 9.92172 16.5786 9.17157 15.8284C8.42143 15.0783 8 14.0609 8 13C8 12.2089 8.2346 11.4355 8.67412 10.7777C9.11365 10.1199 9.73836 9.60723 10.4693 9.30448C11.2002 9.00173 12.0044 8.92252 12.7804 9.07686C13.5563 9.2312 14.269 9.61216 14.8284 10.1716C15.3878 10.731 15.7688 11.4437 15.9231 12.2196C16.0775 12.9956 15.9983 13.7998 15.6955 14.5307C15.3928 15.2616 14.8801 15.8864 14.2223 16.3259ZM13.1111 11.3371C12.7822 11.1173 12.3956 11 12 11C11.4696 11 10.9609 11.2107 10.5858 11.5858C10.2107 11.9609 10 12.4696 10 13C10 13.3956 10.1173 13.7822 10.3371 14.1111C10.5568 14.44 10.8692 14.6964 11.2346 14.8478C11.6001 14.9991 12.0022 15.0387 12.3902 14.9616C12.7781 14.8844 13.1345 14.6939 13.4142 14.4142C13.6939 14.1345 13.8844 13.7781 13.9616 13.3902C14.0387 13.0022 13.9991 12.6001 13.8478 12.2346C13.6964 11.8692 13.44 11.5568 13.1111 11.3371Z" />
|
||||
<path d="M20 10C19.4477 10 19 10.4477 19 11C19 11.5523 19.4477 12 20 12H25C25.5523 12 26 11.5523 26 11C26 10.4477 25.5523 10 25 10H20Z" />
|
||||
<path d="M10 20C8.89543 20 8 20.8954 8 22V23C8 23.5523 7.55229 24 7 24C6.44771 24 6 23.5523 6 23V22C6 19.7909 7.79086 18 10 18H14C16.2091 18 18 19.7909 18 22V23C18 23.5523 17.5523 24 17 24C16.4477 24 16 23.5523 16 23V22C16 20.8954 15.1046 20 14 20H10Z" />
|
||||
<path d="M20 14C19.4477 14 19 14.4477 19 15C19 15.5523 19.4477 16 20 16H22C22.5523 16 23 15.5523 23 15C23 14.4477 22.5523 14 22 14H20Z" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M6 4C3.79086 4 2 5.79086 2 8V24C2 26.2091 3.79086 28 6 28H26C28.2091 28 30 26.2091 30 24V8C30 5.79086 28.2091 4 26 4H6ZM4 8C4 6.89543 4.89543 6 6 6H26C27.1046 6 28 6.89543 28 8V24C28 25.1046 27.1046 26 26 26H6C4.89543 26 4 25.1046 4 24V8Z" />
|
||||
</symbol>
|
||||
<symbol id="new-candidate" viewBox="0 0 16 16">
|
||||
<path d="M14.7826 3.26359C15.1313 2.69123 15.0606 1.93115 14.5705 1.43492C14.0757 0.933932 13.3153 0.865765 12.7483 1.23041C13.2123 2.09277 13.9198 2.79999 14.7826 3.26359Z"/>
|
||||
|
||||
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 13 KiB |
@ -32,19 +32,13 @@
|
||||
})
|
||||
</script>
|
||||
|
||||
<div class="flex item">
|
||||
<div class="flex-row-center">
|
||||
<!-- <Icon icon={recruit.icon.Application} size={'medium'} /> -->
|
||||
<PersonPresenter value={person} shouldShowName={false} />
|
||||
<div class="ml-2">
|
||||
<PersonPresenter value={person} avatarSize={'smaller'} shouldShowName={false} />
|
||||
<span class="ml-2">
|
||||
{#if shortLabel}{shortLabel}-{/if}{value.number}
|
||||
</div>
|
||||
</span>
|
||||
{#if person}
|
||||
<div class="ml-1">{getName(person)}</div>
|
||||
<span class="ml-1">{getName(person)}</span>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -21,15 +21,11 @@
|
||||
export let value: Vacancy
|
||||
</script>
|
||||
|
||||
<div class="flex item">
|
||||
<Icon icon={recruit.icon.Vacancy} size={'medium'} />
|
||||
<div class="ml-2">
|
||||
{value.name}
|
||||
<div class="flex-row-center">
|
||||
<div class="flex-center p-1 content-dark-color flex-no-shrink mr-2-5">
|
||||
<Icon icon={recruit.icon.Vacancy} size={'medium'} />
|
||||
</div>
|
||||
<span class="overflow-label">
|
||||
{value.name}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -25,20 +25,14 @@
|
||||
$: st = $statusStore.get(value.status)
|
||||
</script>
|
||||
|
||||
<div class="flex item h-8">
|
||||
<div class="flex-row-center h-8">
|
||||
<!-- <Icon icon={tracker.icon.TrackerApplication} size={'medium'} /> -->
|
||||
<FixedColumn key="object-popup-issue-status">
|
||||
{#if st}
|
||||
<IssueStatusIcon value={st} size={'small'} />
|
||||
{/if}
|
||||
</FixedColumn>
|
||||
<div class="ml-2 max-w-120 overflow-label">
|
||||
<span class="ml-2 max-w-120 overflow-label">
|
||||
{title} - {value.title}
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user