mirror of
https://github.com/hcengineering/platform.git
synced 2025-04-14 12:25:17 +00:00
Remove extra files (#1217)
Signed-off-by: Denis Bykhov <80476319+BykhovDenis@users.noreply.github.com>
This commit is contained in:
Denis Bykhov
GitHub
parent
a9d11bc0dd
commit
80185a2e4e
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
@ -1,189 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
<script lang="ts">
|
|
||||||
import type { Platform } from '@anticrm/platform'
|
|
||||||
import { Severity, Status } from '@anticrm/platform'
|
|
||||||
import { getContext } from 'svelte'
|
|
||||||
import login from '..'
|
|
||||||
import { CheckBox } from '@anticrm/ui'
|
|
||||||
import type { ApplicationRoute, ApplicationRouter } from '@anticrm/platform-ui'
|
|
||||||
import twofactor from 'node-2fa'
|
|
||||||
import type { Options } from 'node-2fa/dist/interfaces'
|
|
||||||
|
|
||||||
export let router: ApplicationRouter<ApplicationRoute>
|
|
||||||
const object = { oldPassword: '', newPassword: '', newPasswordConfirm: '', clientSecret: '', secondFactorCode: '' }
|
|
||||||
let changePassword = false
|
|
||||||
let status = new Status(Severity.OK, 0, '')
|
|
||||||
|
|
||||||
const platform = getContext('platform') as Platform
|
|
||||||
const loginService = platform.getPlugin(login.id)
|
|
||||||
|
|
||||||
let secondFactorInitEnabled = false
|
|
||||||
let secondFactorEnabled = false
|
|
||||||
let secondFactorCurrentEnabled = false
|
|
||||||
let newSecret:
|
|
||||||
| {
|
|
||||||
secret: string
|
|
||||||
uri: string
|
|
||||||
qr: string
|
|
||||||
}
|
|
||||||
| false
|
|
||||||
let src: string
|
|
||||||
|
|
||||||
$: secondFactorCurrentEnabled = secondFactorEnabled && !secondFactorInitEnabled
|
|
||||||
$: newSecret = secondFactorCurrentEnabled && twofactor.generateSecret({ name: 'Anticrm' } as Options)
|
|
||||||
$: src = newSecret.qr
|
|
||||||
$: object.clientSecret = newSecret.secret
|
|
||||||
|
|
||||||
const secondFactorCheck = loginService.then((ls) => {
|
|
||||||
ls.getLoginInfo().then((li) => {
|
|
||||||
secondFactorInitEnabled = !!li?.secondFactorEnabled
|
|
||||||
secondFactorEnabled = secondFactorInitEnabled
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
function navigateLoginForm (): Promise<void> {
|
|
||||||
return Promise.resolve(router.navigate({ route: '' }))
|
|
||||||
}
|
|
||||||
|
|
||||||
let description: string
|
|
||||||
$: description = status.message
|
|
||||||
|
|
||||||
async function saveSetting (): Promise<void> {
|
|
||||||
if (!object.oldPassword) {
|
|
||||||
status = new Status(Severity.INFO, 0, 'Поле пароль обязательно к заполнению.')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (changePassword && object.newPassword !== object.newPasswordConfirm) {
|
|
||||||
status = new Status(Severity.INFO, 0, 'Пароль и подтверждения пароля не совпадают')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (secondFactorCurrentEnabled) {
|
|
||||||
if (object.clientSecret && !object.secondFactorCode) {
|
|
||||||
status = new Status(Severity.INFO, 0, 'Поле код подтверждения обязательно для заполнения')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!object.clientSecret && object.secondFactorCode) {
|
|
||||||
status = new Status(Severity.INFO, 0, 'Поле секретный код обязательно для заполнения')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
status = new Status(Severity.INFO, 0, 'Соединяюсь с сервером...')
|
|
||||||
|
|
||||||
status = await (await loginService).saveSetting(
|
|
||||||
object.oldPassword,
|
|
||||||
changePassword ? object.newPassword : '',
|
|
||||||
secondFactorEnabled,
|
|
||||||
secondFactorCurrentEnabled ? object.clientSecret : '',
|
|
||||||
secondFactorCurrentEnabled ? object.secondFactorCode : ''
|
|
||||||
)
|
|
||||||
if (status.severity === Severity.OK) {
|
|
||||||
await navigateLoginForm()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<form class="form">
|
|
||||||
<div class="status">{description}</div>
|
|
||||||
<div class="field">
|
|
||||||
<input class="editbox" name="oldPassword" placeholder="Пароль" type="password" bind:value={object.oldPassword} />
|
|
||||||
</div>
|
|
||||||
<div class="field">
|
|
||||||
<CheckBox bind:checked={changePassword}>Изменить пароль</CheckBox>
|
|
||||||
</div>
|
|
||||||
{#if changePassword}
|
|
||||||
<div class="field">
|
|
||||||
<input
|
|
||||||
class="editbox"
|
|
||||||
name="newPassword"
|
|
||||||
placeholder="Новый пароль"
|
|
||||||
type="password"
|
|
||||||
bind:value={object.newPassword} />
|
|
||||||
</div>
|
|
||||||
<div class="field">
|
|
||||||
<input
|
|
||||||
class="editbox"
|
|
||||||
name="newPasswordConfirm"
|
|
||||||
placeholder="Подтверждение пароля"
|
|
||||||
type="password"
|
|
||||||
bind:value={object.newPasswordConfirm} />
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#await secondFactorCheck then value}
|
|
||||||
<div class="field">
|
|
||||||
<CheckBox bind:checked={secondFactorEnabled}>Включить двухфакторную авторизацию</CheckBox>
|
|
||||||
</div>
|
|
||||||
{#if secondFactorCurrentEnabled}
|
|
||||||
<div class="field">
|
|
||||||
<input
|
|
||||||
class="editbox"
|
|
||||||
name="clientSecret"
|
|
||||||
placeholder="Секретный код"
|
|
||||||
type="text"
|
|
||||||
bind:value={object.clientSecret} />
|
|
||||||
</div>
|
|
||||||
{#if src}
|
|
||||||
<div>
|
|
||||||
<img {src} alt="qr code" />
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
<div class="field">
|
|
||||||
<input
|
|
||||||
class="editbox"
|
|
||||||
name="secondFactorCode"
|
|
||||||
placeholder="Код подтверждения"
|
|
||||||
type="text"
|
|
||||||
bind:value={object.secondFactorCode} />
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{/await}
|
|
||||||
<div class="buttons">
|
|
||||||
<button class="button" on:click|preventDefault={navigateLoginForm}> Отменить</button>
|
|
||||||
<button class="button" on:click|preventDefault={saveSetting}> Сохранить</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
img {
|
|
||||||
display: block;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
width: 50%;
|
|
||||||
border: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
form {
|
|
||||||
margin: auto;
|
|
||||||
margin-top: 3vh;
|
|
||||||
width: 30em;
|
|
||||||
padding: 1em;
|
|
||||||
border-radius: 1em;
|
|
||||||
border: 1px solid var(--theme-bg-accent-color);
|
|
||||||
.status {
|
|
||||||
margin-top: 0.5em;
|
|
||||||
}
|
|
||||||
.field {
|
|
||||||
.editbox {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,79 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { ScrollBox, IconAdd } from '@anticrm/ui'
|
|
||||||
|
|
||||||
import type { Doc, Ref, Space } from '@anticrm/core'
|
|
||||||
import { createQuery } from '@anticrm/presentation'
|
|
||||||
import type { Attachment } from '@anticrm/chunter'
|
|
||||||
|
|
||||||
import chunter from '@anticrm/chunter'
|
|
||||||
|
|
||||||
export let object: Doc
|
|
||||||
export let space: Ref<Space>
|
|
||||||
|
|
||||||
let files: Attachment[] = []
|
|
||||||
|
|
||||||
console.log('query space', space)
|
|
||||||
|
|
||||||
const query = createQuery()
|
|
||||||
$: query.query(chunter.class.Attachment, { space }, result => { files = result})
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<ScrollBox vertical>
|
|
||||||
{#each files as file}
|
|
||||||
<div class="item flex-row-center">
|
|
||||||
<div class="flex-center file-icon">pdf</div>
|
|
||||||
<div class="flex-col flex-grow">
|
|
||||||
<div class="overflow-label caption-color">{file.name}</div>
|
|
||||||
<div class="overflow-label file-desc">{file.type}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/each}
|
|
||||||
<div class="item add-file">
|
|
||||||
<button class="add-btn focused-button"><IconAdd size={'small'} /></button>
|
|
||||||
<div class="caption-color">Add attachment</div>
|
|
||||||
</div>
|
|
||||||
</ScrollBox>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: .75rem 1rem;
|
|
||||||
}
|
|
||||||
.file-icon, .add-btn {
|
|
||||||
margin-right: 1.25rem;
|
|
||||||
width: 2rem;
|
|
||||||
height: 2rem;
|
|
||||||
border-radius: .5rem;
|
|
||||||
}
|
|
||||||
.file-icon {
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 0.625rem;
|
|
||||||
line-height: 150%;
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: #fff;
|
|
||||||
background-color: #7C6FCD;
|
|
||||||
border: 1px solid rgba(0, 0, 0, .1);
|
|
||||||
}
|
|
||||||
.file-desc {
|
|
||||||
font-size: 0.75rem;
|
|
||||||
color: var(--theme-content-dark-color);
|
|
||||||
}
|
|
||||||
.item + .add-file, .item + .item { border-top: 1px solid var(--theme-bg-accent-hover); }
|
|
||||||
</style>
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { Asset, IntlString } from '@anticrm/platform'
|
|
||||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
|
||||||
import { CircleButton, Label } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let icon: Asset | AnySvelteComponent | undefined = undefined
|
|
||||||
export let label: IntlString
|
|
||||||
export let component: AnySvelteComponent
|
|
||||||
export let props: any
|
|
||||||
export let minimize: boolean = false
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{#if icon}
|
|
||||||
<div class="flex-row-center">
|
|
||||||
<CircleButton icon={icon} size={'large'} />
|
|
||||||
{#if !minimize}
|
|
||||||
<div class="flex-col with-icon">
|
|
||||||
<Label {label} />
|
|
||||||
<div class="value"><svelte:component this={component} {...props} /></div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
{:else}
|
|
||||||
<div class="flex-col">
|
|
||||||
<Label {label} />
|
|
||||||
<div class="value"><svelte:component this={component} {...props} /></div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.with-icon { margin-left: .5rem; }
|
|
||||||
.value {
|
|
||||||
font-weight: 500;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,111 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
// Copyright © 2021 Hardcore Engineering Inc.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString } from '@anticrm/platform'
|
|
||||||
import presentation from '@anticrm/presentation'
|
|
||||||
import { Button,Grid,IconClose,Label } from '@anticrm/ui'
|
|
||||||
import { createEventDispatcher } from 'svelte'
|
|
||||||
import Avatar from '../../img/avatar.png'
|
|
||||||
import recruit from '../plugin'
|
|
||||||
export let label: IntlString
|
|
||||||
|
|
||||||
const dispatch = createEventDispatcher()
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="dialog-container">
|
|
||||||
<div class="abs-lt-content label">
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
<div class="abs-rt-content tool" on:click={() => { dispatch('close') }}>
|
|
||||||
<IconClose size={'small'} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="avatar">
|
|
||||||
<img src={Avatar} alt={'Avatar'} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="abs-lb-content actions">
|
|
||||||
<Grid columnGap={.5}>
|
|
||||||
<Button label={recruit.string.Edit} />
|
|
||||||
<Button label={recruit.string.Delete} />
|
|
||||||
</Grid>
|
|
||||||
</div>
|
|
||||||
<div class="abs-rb-content">
|
|
||||||
<Button label={presentation.string.Save} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.dialog-container {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: 40rem;
|
|
||||||
height: 23.75rem;
|
|
||||||
background-color: var(--theme-bg-color);
|
|
||||||
border-radius: 1.25rem;
|
|
||||||
filter: drop-shadow(0 0 4rem rgba(0, 0, 0, .35));
|
|
||||||
|
|
||||||
.label {
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 1rem;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
position: relative;
|
|
||||||
width: 13.75rem;
|
|
||||||
height: 13.75rem;
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 50%;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
&::after, &::before {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
&::after {
|
|
||||||
top: .65rem;
|
|
||||||
left: .65rem;
|
|
||||||
bottom: .65rem;
|
|
||||||
right: .65rem;
|
|
||||||
border: 1px solid rgba(255, 255, 255, .6);
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
&::before {
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 13.75rem;
|
|
||||||
height: 13.75rem;
|
|
||||||
background-color: rgba(255, 255, 255, .2);
|
|
||||||
clip-path: path('M110,0C49.2,0,0,49.2,0,110c0,60.8,49.2,110,110,110s110-49.2,110-110C220,49.2,170.8,0,110,0z M110,212 C53.7,212,8,166.3,8,110C8,53.7,53.7,8,110,8s102,45.7,102,102C212,166.3,166.3,212,110,212z');
|
|
||||||
filter: blur(3px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tool {
|
|
||||||
opacity: .4;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover { opacity: 1; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,47 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
// Copyright © 2021 Hardcore Engineering Inc.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
|
|
||||||
import { TextArea, EditBox, Dialog, Tabs, Section, Grid, IconFile } from '@anticrm/ui'
|
|
||||||
import { AttributeEditor, getClient } from '@anticrm/presentation'
|
|
||||||
import type { Candidate } from '@anticrm/recruit'
|
|
||||||
|
|
||||||
import Address from './icons/Address.svelte'
|
|
||||||
|
|
||||||
import contact from '@anticrm/contact'
|
|
||||||
|
|
||||||
export let object: Candidate
|
|
||||||
export let newValue: Candidate
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<Section icon={IconFile} label={'Personal Information'}>
|
|
||||||
<Grid>
|
|
||||||
<AttributeEditor _class={contact.class.Person} key={'firstName'} {newValue} oldValue={object} focus/>
|
|
||||||
<AttributeEditor _class={contact.class.Person} key={'lastName'} {newValue} oldValue={object}/>
|
|
||||||
<AttributeEditor _class={contact.class.Person} key={'email'} {newValue} oldValue={object}/>
|
|
||||||
<AttributeEditor _class={contact.class.Person} key={'phone'} {newValue} oldValue={object}/>
|
|
||||||
</Grid>
|
|
||||||
</Section>
|
|
||||||
<Section icon={Address} label={'Address'}>
|
|
||||||
<Grid>
|
|
||||||
<EditBox label={'Street'} placeholder={'Broderick st'} />
|
|
||||||
<EditBox label={'City *'} placeholder={'Los Angeles'} bind:value={newValue.city}/>
|
|
||||||
<EditBox label={'ZIP / Postal code'} placeholder={'26892'} />
|
|
||||||
<EditBox label={'Country'} placeholder={'United States'} />
|
|
||||||
</Grid>
|
|
||||||
</Section>
|
|
||||||
@ -1,83 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { Avatar } from '@anticrm/presentation'
|
|
||||||
import { IconFile } from '@anticrm/ui'
|
|
||||||
import LabelStatus from './LabelStatus.svelte'
|
|
||||||
import Tag from './Tag.svelte'
|
|
||||||
|
|
||||||
interface Person {
|
|
||||||
firstName: string
|
|
||||||
lastName: string
|
|
||||||
email: string
|
|
||||||
description: string
|
|
||||||
city: string
|
|
||||||
state: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export let user: Person
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="status"><LabelStatus label={user.state} color={'var(--primary-button-enabled)'} /></div>
|
|
||||||
<div class="avatar"><Avatar size={'large'} /></div>
|
|
||||||
<div class="name">{user.lastName} {user.firstName}</div>
|
|
||||||
<div class="description">{user.description}</div>
|
|
||||||
<div class="city">{user.city}</div>
|
|
||||||
<Tag icon={IconFile} label={'Application'} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
padding: 1.25rem 1.5rem;
|
|
||||||
background-color: var(--theme-button-bg-enabled);
|
|
||||||
border: 1px solid var(--theme-bg-accent-color);
|
|
||||||
border-radius: .75rem;
|
|
||||||
|
|
||||||
.status {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row-reverse;
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.avatar {
|
|
||||||
height: 5rem;
|
|
||||||
}
|
|
||||||
.name {
|
|
||||||
margin: 1rem 0 .25rem;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: 150%;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
}
|
|
||||||
.description, .city {
|
|
||||||
font-size: .75rem;
|
|
||||||
color: var(--theme-content-dark-color);
|
|
||||||
}
|
|
||||||
.city {
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: var(--theme-bg-accent-hover);
|
|
||||||
box-shadow: 0px .75rem 2.5rem rgba(0, 0, 0, .15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,73 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString } from '@anticrm/platform'
|
|
||||||
import { Label, IconAdd } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let label: IntlString
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="card-container">
|
|
||||||
<div class="circle">
|
|
||||||
<div class="icon">
|
|
||||||
<IconAdd size={'large'} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.card-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 20px 24px;
|
|
||||||
font-size: 14px;
|
|
||||||
line-height: 18px;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
background-color: var(--theme-button-bg-enabled);
|
|
||||||
border: 1px solid var(--theme-bg-accent-color);
|
|
||||||
border-radius: .75rem;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.circle {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
background-color: var(--theme-bg-accent-color);
|
|
||||||
border-radius: 50%;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
opacity: .6;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: var(--theme-bg-accent-hover);
|
|
||||||
box-shadow: 0px 12px 40px rgba(0, 0, 0, .15);
|
|
||||||
|
|
||||||
.circle .icon {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,60 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { ScrollBox } from '@anticrm/ui'
|
|
||||||
import Card from './Card.svelte.txt'
|
|
||||||
import CardEmpty from './CardEmpty.svelte'
|
|
||||||
|
|
||||||
interface Person {
|
|
||||||
firstName: string
|
|
||||||
lastName: string
|
|
||||||
email: string
|
|
||||||
description: string
|
|
||||||
city: string
|
|
||||||
state: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const cards: Array<Person> = [
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Hired' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Interview' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Submission' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Hired' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Interview' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Submission' },
|
|
||||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' }
|
|
||||||
]
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<ScrollBox vertical>
|
|
||||||
<div class="cards-container">
|
|
||||||
<CardEmpty label={'Create new task'} />
|
|
||||||
{#each cards as card}
|
|
||||||
<Card user={card} />
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
</ScrollBox>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.cards-container {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(220px, auto));
|
|
||||||
grid-auto-rows: minmax(280px, auto);
|
|
||||||
grid-gap: 24px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
// Copyright © 2021 Hardcore Engineering Inc.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
|
|
||||||
import type { Doc } from '@anticrm/core'
|
|
||||||
import { Label, showPopup } from '@anticrm/ui'
|
|
||||||
import CreateApplication from './CreateApplication.svelte'
|
|
||||||
|
|
||||||
export let value: Doc
|
|
||||||
|
|
||||||
let button: HTMLElement
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="flex-center presenter-container" bind:this={button}
|
|
||||||
on:click={() => { showPopup(CreateApplication, { candidate: value._id, preserveCandidate: true }, button) }}
|
|
||||||
>
|
|
||||||
<Label label="Create Application" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.presenter-container {
|
|
||||||
padding: .25rem .75rem;
|
|
||||||
width: max-content;
|
|
||||||
font-size: .75rem;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
background-color: var(--theme-bg-accent-color);
|
|
||||||
border: 1px solid var(--theme-bg-accent-color);
|
|
||||||
border-radius: .5rem;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,210 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
// Copyright © 2021 Hardcore Engineering Inc.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { createEventDispatcher } from 'svelte'
|
|
||||||
|
|
||||||
import type { Ref, Space, Doc } from '@anticrm/core'
|
|
||||||
import { generateId } from '@anticrm/core'
|
|
||||||
import { EditBox, Button, CircleButton, Grid, Label, Link, showPopup, Component, IconFile as FileIcon } from '@anticrm/ui'
|
|
||||||
import type { AnyComponent } from '@anticrm/ui'
|
|
||||||
import { getClient, PDFViewer } from '@anticrm/presentation'
|
|
||||||
import type { Attachment } from '@anticrm/chunter'
|
|
||||||
|
|
||||||
import AvatarEditor from './AvatarEditor.svelte'
|
|
||||||
import FileUpload from './icons/FileUpload.svelte'
|
|
||||||
import Edit from './icons/Edit.svelte'
|
|
||||||
import Twitter from './icons/Twitter.svelte'
|
|
||||||
import User from './icons/User.svelte'
|
|
||||||
import SocialEditor from './SocialEditor.svelte'
|
|
||||||
|
|
||||||
import { uploadFile } from '../utils'
|
|
||||||
import { Candidate } from '@anticrm/recruit'
|
|
||||||
|
|
||||||
import chunter from '@anticrm/chunter'
|
|
||||||
import contact from '@anticrm/contact'
|
|
||||||
|
|
||||||
import equals from 'deep-equal'
|
|
||||||
|
|
||||||
const dispatch = createEventDispatcher()
|
|
||||||
|
|
||||||
export let space: Ref<Space>
|
|
||||||
export let object: Candidate
|
|
||||||
export let newValue: Candidate
|
|
||||||
export let create = false
|
|
||||||
|
|
||||||
export let resume: {
|
|
||||||
id: Ref<Doc> | undefined
|
|
||||||
name: string
|
|
||||||
uuid: string
|
|
||||||
size: number
|
|
||||||
type: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const client = getClient()
|
|
||||||
|
|
||||||
if (newValue.resume !== undefined) {
|
|
||||||
client.findOne(chunter.class.Attachment, { _id: newValue.resume }).then(result => {
|
|
||||||
if (result !== undefined) {
|
|
||||||
resume = {
|
|
||||||
id: result._id,
|
|
||||||
name: result.name,
|
|
||||||
uuid: result.file,
|
|
||||||
size: result.size,
|
|
||||||
type: result.type,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
let dragover = false
|
|
||||||
let loading = false
|
|
||||||
let changed = false
|
|
||||||
|
|
||||||
function isChanged(): void {
|
|
||||||
for (const key in newValue) {
|
|
||||||
if (!equals((newValue as any)[key], (object as any)[key])) {
|
|
||||||
changed = true
|
|
||||||
return
|
|
||||||
}
|
|
||||||
}
|
|
||||||
changed = false
|
|
||||||
}
|
|
||||||
|
|
||||||
async function createAttachment(file: File) {
|
|
||||||
loading = true
|
|
||||||
try {
|
|
||||||
const id = generateId<Attachment>()
|
|
||||||
resume.uuid = await uploadFile(id, space, file)
|
|
||||||
resume.id = id
|
|
||||||
resume.name = file.name
|
|
||||||
resume.size = file.size
|
|
||||||
resume.type = file.type
|
|
||||||
|
|
||||||
newValue.resume = id
|
|
||||||
isChanged()
|
|
||||||
|
|
||||||
console.log('uploaded file uuid', resume.uuid)
|
|
||||||
|
|
||||||
} finally {
|
|
||||||
loading = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function drop(event: DragEvent) {
|
|
||||||
dragover = false
|
|
||||||
const droppedFile = event.dataTransfer?.files[0]
|
|
||||||
if (droppedFile !== undefined) { createAttachment(droppedFile) }
|
|
||||||
}
|
|
||||||
|
|
||||||
let inputFile: HTMLInputElement
|
|
||||||
|
|
||||||
function fileSelected() {
|
|
||||||
console.log(inputFile.files)
|
|
||||||
const file = inputFile.files?.[0]
|
|
||||||
if (file !== undefined) { createAttachment(file) }
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<form on:submit|preventDefault={()=>{}}>
|
|
||||||
<div class="header" class:dragover={dragover}
|
|
||||||
on:dragenter={ () => { dragover = true } }
|
|
||||||
on:dragover|preventDefault={ ()=>{} }
|
|
||||||
on:dragleave={ () => { dragover = false } }
|
|
||||||
on:drop|preventDefault|stopPropagation={drop}>
|
|
||||||
<div class="flex-row-center main-content">
|
|
||||||
<div class="avatar" on:click|stopPropagation={() => showPopup(AvatarEditor, { label: 'Profile photo' })}><User /></div>
|
|
||||||
<div class="flex-col">
|
|
||||||
<div class="name">
|
|
||||||
<EditBox placeholder="John" bind:value={newValue.firstName} on:input={isChanged} focus={create}/>
|
|
||||||
<EditBox placeholder="Appleseed" bind:value={newValue.lastName} on:input={isChanged}/>
|
|
||||||
</div>
|
|
||||||
<div class="title"><EditBox placeholder="Location" bind:value={newValue.city} on:input={isChanged}/></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="abs-lb-content flex-row-center">
|
|
||||||
{#if resume.id}
|
|
||||||
<Link label={resume.name} href={'#'} icon={FileIcon} on:click={ () => { showPopup(PDFViewer, { file: resume.uuid }, 'right') } }/>
|
|
||||||
{:else}
|
|
||||||
<Button label={'Upload resume'} {loading} icon={FileUpload} size={'small'} transparent primary on:click={() => { inputFile.click() }}/>
|
|
||||||
<input bind:this={inputFile} type="file" name="file" id="file" style="display: none" on:change={fileSelected}/>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<div class="abs-rb-content">
|
|
||||||
{#if changed}
|
|
||||||
<Button label={ create ? 'Create' : 'Save' } size={'small'} transparent on:click={ () => { dispatch('save') } }/>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<div class="abs-rt-content flex-row-center">
|
|
||||||
<div style="margin-right: .25rem"><Component is='contact:component:ChannelsPresenter' props={ { value: newValue.channels } }/></div>
|
|
||||||
<CircleButton icon={Edit} label={'Edit'} on:click={(ev) => showPopup(SocialEditor, { values: newValue.channels ?? [] }, ev.target, (result) => { newValue.channels = result; isChanged() })} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.header {
|
|
||||||
position: relative;
|
|
||||||
padding: 1.5rem 1.5rem 0;
|
|
||||||
width: 45rem;
|
|
||||||
min-height: 12.5rem;
|
|
||||||
height: 12.5rem;
|
|
||||||
background-image: url(../../img/bg-pink-mixed.jpg);
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-clip: border-box;
|
|
||||||
background-size: cover;
|
|
||||||
border-radius: 1.25rem;
|
|
||||||
|
|
||||||
&.dragover {
|
|
||||||
border: 1px solid red;
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-content {
|
|
||||||
.avatar {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-right: 1.25rem;
|
|
||||||
width: 6rem;
|
|
||||||
height: 6rem;
|
|
||||||
border-radius: 50%;
|
|
||||||
background-color: rgba(255, 255, 255, .2);
|
|
||||||
backdrop-filter: blur(3px);
|
|
||||||
box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, .3);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.name {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
font-size: 1.25rem;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #fff;
|
|
||||||
input {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
border: none;
|
|
||||||
&::placeholder { color: var(--theme-content-dark-color); }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.title {
|
|
||||||
margin-top: .5rem;
|
|
||||||
font-size: .75rem;
|
|
||||||
font-weight: 500;
|
|
||||||
color: rgba(255, 255, 255, .6);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString, Asset } from '@anticrm/platform'
|
|
||||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
|
||||||
import { Icon, Label } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let icon: Asset | AnySvelteComponent
|
|
||||||
export let label: IntlString
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="label-container">
|
|
||||||
<div class="icon">
|
|
||||||
{#if typeof (icon) === 'string'}
|
|
||||||
<Icon {icon} size={'large'}/>
|
|
||||||
{:else}
|
|
||||||
<svelte:component this={icon} size={'large'} />
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.label-container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
margin-right: .5em;
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,56 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
// Copyright © 2021 Hardcore Engineering Inc.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString, Asset } from '@anticrm/platform'
|
|
||||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
|
||||||
import { Label, Icon } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let label: IntlString
|
|
||||||
export let icon: Asset | AnySvelteComponent
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="flex-row-center container">
|
|
||||||
<Icon {icon} size='small'/>
|
|
||||||
<span><Label {label} /></span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.container {
|
|
||||||
padding: .5rem .75rem;
|
|
||||||
color: #fff;
|
|
||||||
background-color: rgba(255, 255, 255, .17);
|
|
||||||
border: 1px solid rgba(255, 255, 255, .14);
|
|
||||||
border-radius: .5rem;
|
|
||||||
backdrop-filter: blur(3px);
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin-left: 0.376rem;
|
|
||||||
font-weight: 500;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: rgba(255, 255, 255, .22);
|
|
||||||
border-color: rgba(255, 255, 255, .19);
|
|
||||||
box-shadow: 0 0 1rem rgba(0, 0, 0, .3);
|
|
||||||
}
|
|
||||||
&:active {
|
|
||||||
box-shadow: 0 0 1rem rgba(0, 0, 0, .1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,169 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import { UserInfo, Avatar } from '@anticrm/presentation'
|
|
||||||
import { showPopup, Label, IconThread, IconAttachment } from '@anticrm/ui'
|
|
||||||
import type { WithLookup } from '@anticrm/core'
|
|
||||||
import type { Applicant } from '@anticrm/recruit'
|
|
||||||
|
|
||||||
import EditCandidate from './EditCandidate.svelte'
|
|
||||||
import EditApplication from './EditApplication.svelte'
|
|
||||||
|
|
||||||
import { AttachmentsPresenter } from '@anticrm/chunter-resources'
|
|
||||||
import { formatName } from '@anticrm/contact'
|
|
||||||
|
|
||||||
export let object: WithLookup<Applicant>
|
|
||||||
export let draggable: boolean
|
|
||||||
|
|
||||||
function showCandidate() {
|
|
||||||
showPopup(EditCandidate, { _id: object.candidate }, 'full')
|
|
||||||
}
|
|
||||||
|
|
||||||
function showApplication() {
|
|
||||||
showPopup(EditApplication, { _id: object._id }, 'full')
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="card-container" {draggable} class:draggable on:dragstart on:dragend>
|
|
||||||
<div class="card-bg" />
|
|
||||||
<div class="content">
|
|
||||||
<div class="flex-center">
|
|
||||||
<div class="avatar">
|
|
||||||
<Avatar size={'large'} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex-col">
|
|
||||||
<div class="name" on:click={showCandidate}>{formatName(object.$lookup?.candidate?.name)}</div>
|
|
||||||
<div class="city">{object.$lookup?.candidate?.city ?? ''}</div>
|
|
||||||
<div class="tags">
|
|
||||||
<div class="tag" on:click={showApplication}><Label label={'Application'} /></div>
|
|
||||||
<!-- <div class="tag"><Label label={'Resume'} /></div> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="footer">
|
|
||||||
<Avatar size={'small'} />
|
|
||||||
<div class="flex-row-center">
|
|
||||||
<div class="flex-row-center caption-color tool">
|
|
||||||
<!-- <span class="icon"><IconAttachment size={'small'} /></span>
|
|
||||||
4 -->
|
|
||||||
<AttachmentsPresenter value={object} />
|
|
||||||
</div>
|
|
||||||
<div class="flex-row-center caption-color tool">
|
|
||||||
<span class="icon"><IconThread size={'small'} /></span>
|
|
||||||
5
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
@import '../node_modules/@anticrm/theme/styles/mixins.scss';
|
|
||||||
|
|
||||||
.card-container {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: stretch;
|
|
||||||
border-radius: .75rem;
|
|
||||||
overflow: hidden;
|
|
||||||
user-select: none;
|
|
||||||
backdrop-filter: blur(30px);
|
|
||||||
|
|
||||||
.content {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 1.25rem;
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
position: relative;
|
|
||||||
margin-right: 1rem;
|
|
||||||
width: 5rem;
|
|
||||||
height: 5rem;
|
|
||||||
border-radius: 50%;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
content: '';
|
|
||||||
@include bg-layer(transparent, .1);
|
|
||||||
border: 2px solid #fff;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.name {
|
|
||||||
margin: .25rem 0;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 1rem;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover { text-decoration: underline; }
|
|
||||||
}
|
|
||||||
.city {
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: .75rem;
|
|
||||||
}
|
|
||||||
.tags {
|
|
||||||
display: flex;
|
|
||||||
margin-top: .5rem;
|
|
||||||
|
|
||||||
.tag {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: .375rem .5rem;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: .625rem;
|
|
||||||
text-align: center;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
content: '';
|
|
||||||
@include bg-layer(#fff, .04);
|
|
||||||
border-radius: .5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.tag + .tag { margin-left: .5rem; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.footer {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: .75rem 1.25rem;
|
|
||||||
width: 100%;
|
|
||||||
min-height: 3rem;
|
|
||||||
&::after {
|
|
||||||
content: '';
|
|
||||||
@include bg-layer(#fff, .04);
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
.tool .icon {
|
|
||||||
margin-right: .25rem;
|
|
||||||
opacity: .4;
|
|
||||||
}
|
|
||||||
.tool + .tool { margin-left: .75rem; }
|
|
||||||
}
|
|
||||||
.card-bg {
|
|
||||||
@include bg-layer(var(--theme-card-bg), .06);
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
&.draggable { cursor: grab; }
|
|
||||||
}
|
|
||||||
|
|
||||||
:global(.card-container + .card-container) { margin-top: .75rem; }
|
|
||||||
</style>
|
|
||||||
@ -1,47 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString } from '@anticrm/platform'
|
|
||||||
import { Label } from '@anticrm/ui'
|
|
||||||
|
|
||||||
enum StatusColors {
|
|
||||||
TURQUOISE = '#79C4CE',
|
|
||||||
PURPLE = '#9D92C4',
|
|
||||||
STINKYBLUE = '#72A6CC',
|
|
||||||
GREEN = '#69B46D',
|
|
||||||
ORANGE = '#C97661'
|
|
||||||
}
|
|
||||||
|
|
||||||
export let label: IntlString
|
|
||||||
export let color: string = StatusColors.TURQUOISE
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="label-container" style="background-color: {color}">
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.label-container {
|
|
||||||
padding: 4px 8px;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 12px;
|
|
||||||
text-align: center;
|
|
||||||
color: #fff;
|
|
||||||
border: 1px solid var(--theme-bg-accent-hover);
|
|
||||||
border-radius: .5rem;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,54 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString, Asset } from '@anticrm/platform'
|
|
||||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
|
||||||
import { Icon, Label } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let icon: Asset | AnySvelteComponent
|
|
||||||
export let label: IntlString
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="tag-container">
|
|
||||||
<div class="icon">
|
|
||||||
{#if typeof (icon) === 'string'}
|
|
||||||
<Icon {icon} size={'small'}/>
|
|
||||||
{:else}
|
|
||||||
<svelte:component this={icon} size={'small'} />
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.tag-container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 6px 10px;
|
|
||||||
font-size: 12px;
|
|
||||||
text-align: center;
|
|
||||||
background-color: var(--theme-bg-accent-color);
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
border-radius: .5rem;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
margin-right: .3em;
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,66 +0,0 @@
|
|||||||
<!--
|
|
||||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
|
||||||
//
|
|
||||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
|
||||||
// you may not use this file except in compliance with the License. You may
|
|
||||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
|
||||||
//
|
|
||||||
// Unless required by applicable law or agreed to in writing, software
|
|
||||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
//
|
|
||||||
// See the License for the specific language governing permissions and
|
|
||||||
// limitations under the License.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import type { IntlString } from '@anticrm/platform'
|
|
||||||
import { Label } from '@anticrm/ui'
|
|
||||||
import { IconAdd } from '@anticrm/ui'
|
|
||||||
|
|
||||||
export let label: IntlString
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="panel-container step-lr75">
|
|
||||||
<div class="circle">
|
|
||||||
<div class="icon">
|
|
||||||
<IconAdd size={'large'} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Label {label} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.panel-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
width: 20rem;
|
|
||||||
height: 100%;
|
|
||||||
padding: .75rem;
|
|
||||||
color: var(--theme-caption-color);
|
|
||||||
background-color: var(--theme-bg-color);
|
|
||||||
border: 1px dotted var(--theme-bg-accent-color);
|
|
||||||
border-radius: .75rem;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.circle {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 1.25rem;
|
|
||||||
width: 5rem;
|
|
||||||
height: 5rem;
|
|
||||||
background-color: var(--theme-bg-accent-color);
|
|
||||||
border-radius: 50%;
|
|
||||||
|
|
||||||
.icon { opacity: .6; }
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: var(--theme-bg-accent-color);
|
|
||||||
.circle .icon { opacity: 1; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in New Issue
Block a user