Add EditCandidates, EditVacancy and SpacePanel (#293)

Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-11-03 16:01:21 +03:00 committed by GitHub
parent 4aa9ab877b
commit 18ca47a4e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
44 changed files with 1401 additions and 1117 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -107,7 +107,8 @@ export function createModel (builder: Builder): void {
label: chunter.string.Channels,
spaceClass: chunter.class.Channel,
addSpaceLabel: chunter.string.CreateChannel,
createComponent: chunter.component.CreateChannel
createComponent: chunter.component.CreateChannel,
editComponent: chunter.component.EditChannel
}
]
}

View File

@ -93,13 +93,15 @@ export function createModel (builder: Builder): void {
label: recruit.string.Vacancies,
spaceClass: recruit.class.Vacancy,
addSpaceLabel: recruit.string.CreateVacancy,
createComponent: recruit.component.CreateVacancy
createComponent: recruit.component.CreateVacancy,
editComponent: recruit.component.EditVacancy
},
{
label: recruit.string.CandidatePools,
spaceClass: recruit.class.Candidates,
addSpaceLabel: recruit.string.CreateCandidates,
createComponent: recruit.component.CreateCandidates
createComponent: recruit.component.CreateCandidates,
editComponent: recruit.component.EditCandidates
}
]
}

View File

@ -40,6 +40,8 @@ export default mergeIds(recruitId, recruit, {
CreateCandidate: '' as AnyComponent,
CreateApplication: '' as AnyComponent,
EditCandidate: '' as AnyComponent,
EditCandidates: '' as AnyComponent,
EditVacancy: '' as AnyComponent,
KanbanCard: '' as AnyComponent,
ApplicationPresenter: '' as AnyComponent,
ApplicationsPresenter: '' as AnyComponent

View File

@ -74,7 +74,8 @@ export function createModel (builder: Builder): void {
label: task.string.Projects,
spaceClass: task.class.Project,
addSpaceLabel: task.string.CreateProject,
createComponent: task.component.CreateProject
createComponent: task.component.CreateProject,
editComponent: task.component.EditTask
}
]
}

View File

@ -26,7 +26,8 @@ export default mergeIds(taskId, task, {
component: {
ProjectView: '' as AnyComponent,
CreateProject: '' as AnyComponent,
CreateTask: '' as AnyComponent
CreateTask: '' as AnyComponent,
EditTask: '' as AnyComponent
},
class: {
Project: '' as Ref<Class<Project>>

View File

@ -136,14 +136,14 @@
.dialog-container {
overflow: hidden;
position: fixed;
top: 1.5rem;
bottom: 1.5rem;
top: 32px;
bottom: 1.25rem;
left: 50%;
right: 1.5rem;
right: 1rem;
display: flex;
flex-direction: column;
height: calc(100% - 3rem);
height: calc(100% - 32px - 1.25rem);
background: rgba(31, 31, 37, 0.7);
border-radius: 1.25rem;
box-shadow: 0px 44px 154px rgba(0, 0, 0, .75);
@ -201,7 +201,7 @@
.fullSize {
flex-direction: row;
left: 1.5rem;
left: 1rem;
}
.leftSection, .rightSection {

View File

@ -0,0 +1,164 @@
<!--
// 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, AnyComponent } from '@anticrm/ui'
import { IconClose, Label, ScrollBox, Icon, Tabs } from '@anticrm/ui'
import { createEventDispatcher } from 'svelte'
export let label: IntlString
export let icon: Asset | AnySvelteComponent
const dispatch = createEventDispatcher()
interface Tab {
id: number
label: IntlString
}
const tabs: Tab[] = [{ id: 0, label: 'General' as IntlString }, { id: 1, label: 'Members' as IntlString }]
let selected: Tab = tabs[0]
</script>
<div class="overlay" on:click={() => { dispatch('close') }}/>
<div class="dialog-container">
<div class="flex-row-center header">
{#if typeof (icon) === 'string'}
<Icon {icon} size={'medium'} />
{:else}
<svelte:component this={icon} size={'medium'} />
{/if}
<div class="flex-grow fs-title ml-2"><Label {label} /></div>
<div class="tool" on:click={() => { dispatch('close') }}><IconClose size={'small'} /></div>
</div>
<div class="flex-row-center subtitle">
Subtitle
</div>
<div class="flex-stretch tab-container">
{#each tabs as tab}
<div class="flex-row-center tab" class:selected={tab === selected}
on:click={() => { selected = tab }}>
<Label label={tab.label}/>
</div>
{/each}
<div class="grow"/>
</div>
<div class="scroll">
<div class="flex-col box">
{#if !selected.id}
<slot />
{:else}
Members and other
{/if}
</div>
</div>
</div>
<style lang="scss">
.dialog-container {
overflow: hidden;
position: fixed;
top: 32px;
bottom: 1.25rem;
left: 50%;
right: 1rem;
display: flex;
flex-direction: column;
height: calc(100% - 32px - 1.25rem);
background: var(--theme-dialog-bg);
border-radius: 1.25rem;
box-shadow: var(--theme-dialog-shadow);
backdrop-filter: blur(10px);
.header {
flex-shrink: 0;
padding: 0 2rem 0 2.5rem;
height: 4.5rem;
border-bottom: 1px solid var(--theme-dialog-divider);
.tool {
margin-left: .75rem;
transform-origin: center center;
transform: scale(.75);
color: var(--theme-content-accent-color);
cursor: pointer;
&:hover { color: var(--theme-caption-color); }
}
}
.subtitle {
flex-shrink: 0;
padding: 0 2.5rem;
height: 3.5rem;
border-bottom: 1px solid var(--theme-dialog-divider);
}
}
.tab-container {
flex-shrink: 0;
flex-wrap: nowrap;
margin: 0 2.5rem;
height: 4.5rem;
border-bottom: 1px solid var(--theme-menu-divider);
.tab {
height: 4.5rem;
font-weight: 500;
color: var(--theme-content-trans-color);
cursor: pointer;
user-select: none;
&.selected {
border-top: .125rem solid transparent;
border-bottom: .125rem solid var(--theme-caption-color);
color: var(--theme-caption-color);
cursor: default;
}
}
.tab + .tab {
margin-left: 2.5rem;
}
.grow {
min-width: 2.5rem;
flex-grow: 1;
}
}
.scroll {
flex-grow: 1;
overflow-x: hidden;
overflow-y: auto;
margin: 1rem 0;
padding: 1.5rem 2.5rem;
.box {
margin-right: 1px;
height: 100%;
}
}
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--theme-menu-color);
opacity: .6;
}
</style>

View File

@ -28,3 +28,4 @@ export { default as Backlink } from './components/Backlink.svelte'
export { default as PDFViewer } from './components/PDFViewer.svelte'
export { default as MessageBox } from './components/MessageBox.svelte'
export { default as SpaceCreateCard } from './components/SpaceCreateCard.svelte'
export { default as SpacePanel } from './components/SpacePanel.svelte'

View File

@ -64,7 +64,9 @@
--theme-menu-selection: #1D1D23;
--theme-menu-divider: rgba(255, 255, 255, .05);
--theme-scroll-bar: #2C2C34;
--theme-bg-modal: #2C2B35;
--theme-dialog-bg: rgba(47, 47, 53, .7);
--theme-dialog-divider: rgba(255, 255, 255, .06);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
--theme-chat-divider: rgb(36, 36, 41);
@ -134,7 +136,9 @@
--theme-menu-selection: #37363F;
--theme-menu-divider: rgba(255, 255, 255, .05);
--theme-scroll-bar: #494852;
--theme-bg-modal: #2C2B35;
--theme-dialog-bg: rgba(47, 47, 53, .7);
--theme-dialog-divider: rgba(255, 255, 255, .06);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
--theme-chat-divider: rgb(66, 65, 76);
@ -203,7 +207,9 @@
--theme-menu-selection: #DBDBDB;
--theme-menu-divider: rgba(0, 0, 0, .08);
--theme-scroll-bar: #CBCBCB;
--theme-bg-modal: #fff;
--theme-dialog-bg: #fff;
--theme-dialog-divider: rgba(31, 33, 43, .06);
--theme-dialog-shadow: 0px 44px 154px rgba(0, 0, 0, 0.75);
--theme-border-modal: rgba(0, 0, 0, 0.2);
--theme-chat-selection: radial-gradient(135.96% 3333.35% at -2.36% -27.63%, rgba(210, 183, 156, 0.11) 0%, rgba(204, 196, 184, 0.0785128) 20.8%, rgba(104, 104, 114, 0.11) 100%);
--theme-chat-divider: rgb(233, 233, 233);

View File

@ -240,6 +240,7 @@ a.no-line {
font-weight: 500;
font-size: 1rem;
color: var(--theme-caption-color);
user-select: none;
}
.fs-subtitle { font-size: .75rem; }
.over-underline {

View File

@ -42,22 +42,25 @@
<style lang="scss">
.button {
color: var(--theme-caption-color);
border-radius: .125rem;
.icon {
opacity: .3;
// transform-origin: center center;
// transform: scale(.75);
color: var(--theme-content-trans-color);
&.invisible {
opacity: 0;
}
}
&:hover .icon {
opacity: 1;
color: var(--theme-caption-color);
}
&:focus {
border: 1px solid var(--primary-button-focused-border);
box-shadow: 0 0 0 3px var(--primary-button-outline);
.icon {
opacity: 1;
color: var(--theme-caption-color);
}
}
}

View File

@ -76,6 +76,7 @@
<style lang="scss">
.container { cursor: pointer; }
.btn {
flex-shrink: 0;
width: 2.25rem;
height: 2.25rem;
color: var(--theme-caption-color);

View File

@ -19,7 +19,7 @@
export let icon: Asset
export let size: 'small' | 'medium' | 'large'
export let fill = 'var(--theme-caption-color)'
export let fill = 'currentColor'
let url: string
$: url = getMetadata(icon) ?? 'https://anticrm.org/logo.svg'

View File

@ -39,11 +39,11 @@
<style lang="scss">
.container {
flex-shrink: 0;
flex-wrap: nowrap;
margin-bottom: 1rem;
margin-bottom: 2.5rem;
width: 100%;
height: 4.5rem;
min-height: 4.5rem;
border-bottom: 1px solid var(--theme-menu-divider);
.tab {

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">

View File

@ -0,0 +1,25 @@
<!--
// 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">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path d="M15.4,14.5h-6c-0.3,0-0.6,0.3-0.6,0.6s0.3,0.6,0.6,0.6h6c0.3,0,0.6-0.3,0.6-0.6S15.7,14.5,15.4,14.5z"/>
<path d="M12.2,7.1C12.2,7.1,12.2,7.1,12.2,7.1c1.5-1.9,1.6-2,1.6-2c0.3-0.5,0.5-1.2,0.3-1.8c-0.1-0.6-0.5-1.2-1-1.5 c0,0-1.4-1.1-1.4-1.1c-1-0.8-2.6-0.7-3.4,0.3c0,0,0,0,0,0l-7.7,9.7c-0.4,0.5-0.5,1.1-0.4,1.7l0.7,2.8c0.1,0.3,0.3,0.5,0.6,0.5 c0,0,0,0,0,0l3,0c0.6,0,1.2-0.3,1.5-0.8C9.1,10.9,11,8.5,12.2,7.1C12.1,7.1,12.2,7.1,12.2,7.1z M9.1,1.9c0.4-0.5,1.2-0.6,1.7-0.2 c0,0,1.4,1.1,1.5,1.1c0.3,0.2,0.5,0.4,0.5,0.7c0.1,0.3,0,0.6-0.1,0.8c0,0.1-0.5,0.6-1.2,1.5L8.1,3.2L9.1,1.9z M4.9,14.2 c-0.1,0.2-0.4,0.3-0.6,0.3l-2.5,0l-0.6-2.4c-0.1-0.2,0-0.4,0.1-0.6l5.9-7.4l3.5,2.7C9.1,9,6.5,12.2,4.9,14.2z"/>
</svg>

View File

@ -3,8 +3,8 @@
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M11.8,10.3c-1,0-1.8,0.8-1.8,1.7s0.8,1.7,1.8,1.7c1,0,1.8-0.8,1.8-1.7S12.7,10.3,11.8,10.3z" />
<path d="M18,10.3c-1,0-1.8,0.8-1.8,1.7s0.8,1.7,1.8,1.7c1,0,1.8-0.8,1.8-1.7S18.9,10.3,18,10.3z" />
<path d="M5.5,10.3c-1,0-1.8,0.8-1.8,1.7s0.8,1.7,1.8,1.7c1,0,1.8-0.8,1.8-1.7S6.5,10.3,5.5,10.3z" />
<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<path d="M8,6.6C7.2,6.6,6.6,7.2,6.6,8c0,0.8,0.6,1.4,1.4,1.4S9.4,8.8,9.4,8C9.4,7.2,8.8,6.6,8,6.6z" />
<path d="M3.2,6.6C2.4,6.6,1.8,7.2,1.8,8c0,0.8,0.6,1.4,1.4,1.4S4.6,8.8,4.6,8C4.6,7.2,4,6.6,3.2,6.6z" />
<path d="M12.8,6.6c-0.8,0-1.4,0.6-1.4,1.4c0,0.8,0.6,1.4,1.4,1.4s1.4-0.6,1.4-1.4C14.2,7.2,13.6,6.6,12.8,6.6z" />
</svg>

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">

View File

@ -74,6 +74,7 @@ export { default as IconExpand } from './components/icons/Expand.svelte'
export { default as IconActivity } from './components/icons/Activity.svelte'
export { default as IconUp } from './components/icons/Up.svelte'
export { default as IconDown } from './components/icons/Down.svelte'
export { default as IconEdit } from './components/icons/Edit.svelte'
export * from './utils'

View File

@ -0,0 +1,40 @@
<!--
// 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 { createEventDispatcher } from 'svelte'
import { TextArea, EditBox, ToggleWithLabel, Grid, IconComments, IconThread } from '@anticrm/ui'
import { SpacePanel } from '@anticrm/presentation'
import type { Ref, Space, Doc, Class } from '@anticrm/core'
import chunter from '../plugin'
export let _id: Ref<Doc>
export let spaceClass: Ref<Class<Space>>
const dispatch = createEventDispatcher()
let name: string
let locked: boolean = false
</script>
<SpacePanel label={'Open'}
icon={chunter.icon.Chunter}
on:close={() => { dispatch('close') }}>
<Grid column={1} rowGap={1.5}>
<EditBox label={chunter.string.ChannelName} icon={(locked) ? chunter.icon.Lock : chunter.icon.Hashtag} bind:value={name} placeholder={'Start type...'} focus/>
<ToggleWithLabel label={chunter.string.MakePrivate} description={chunter.string.MakePrivateDescription} bind:on={locked} />
</Grid>
</SpacePanel>

View File

@ -14,6 +14,7 @@
//
import CreateChannel from './components/CreateChannel.svelte'
import EditChannel from './components/EditChannel.svelte'
import ChannelView from './components/ChannelView.svelte'
import Activity from './components/Activity.svelte'
import AttachmentsPresenter from './components/AttachmentsPresenter.svelte'
@ -24,6 +25,7 @@ export { AttachmentsPresenter }
export default async () => ({
component: {
CreateChannel,
EditChannel,
ChannelView,
Activity,
AttachmentsPresenter,

View File

@ -24,6 +24,7 @@ import chunter, { chunterId } from '@anticrm/chunter'
export default mergeIds(chunterId, chunter, {
component: {
CreateChannel: '' as AnyComponent,
EditChannel: '' as AnyComponent,
ChannelView: '' as AnyComponent,
},
class: {

View File

@ -1,98 +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 { createEventDispatcher } from 'svelte'
import { TextArea, EditBox, Dialog, ToggleWithLabel, Tabs, Section, Grid, IconFile } from '@anticrm/ui'
import { getClient } from '@anticrm/presentation'
import Recruiting from './icons/Recruiting.svelte'
import recruit from '../plugin'
import core from '@anticrm/core'
import view from '@anticrm/view'
const dispatch = createEventDispatcher()
let name: string = ''
let description: string = ''
const client = getClient()
const colors = [
'#7C6FCD',
'#6F7BC5',
'#A5D179',
'#77C07B',
'#F28469'
]
async function createVacancy() {
const id = await client.createDoc(recruit.class.Vacancy, core.space.Model, {
name,
description,
private: false,
members: [],
states: [],
order: []
})
const s1 = await client.createDoc(core.class.State, id, {
title: 'Initial',
color: colors[0]
})
const s2 = await client.createDoc(core.class.State, id, {
title: 'Interview 1',
color: colors[1]
})
const s3 = await client.createDoc(core.class.State, id, {
title: 'Interview 2',
color: colors[2]
})
const s4 = await client.createDoc(core.class.State, id, {
title: 'Interview 3',
color: colors[3]
})
const s5 = await client.createDoc(core.class.State, id, {
title: 'Interview 4',
color: colors[4]
})
const s6 = await client.createDoc(core.class.State, id, {
title: 'Final',
color: colors[0]
})
// await client.updateDoc(recruit.class.Vacancy, core.space.Model, id, {
// })
await client.createDoc(view.class.Kanban, id, {
attachedTo: id,
states: [s1, s2, s3, s4, s5, s6],
order: []
})
}
</script>
<Dialog label={recruit.string.CreateVacancy}
okLabel={recruit.string.CreateVacancy}
okAction={createVacancy}
on:close={() => { dispatch('close') }}>
<Section icon={IconFile} label={'General Information'}>
<Grid column={1}>
<EditBox label={recruit.string.VacancyName} bind:value={name} placeholder="Software Engineer" maxWidth="39rem" focus/>
<TextArea label={recruit.string.VacancyDescription} bind:value={description} placeholder="Start typing..."/>
<ToggleWithLabel label={recruit.string.MakePrivate} description={recruit.string.MakePrivateDescription}/>
</Grid>
</Section>
<Section icon={Recruiting} label={'Vacancy Members'}>
</Section>
</Dialog>

View File

@ -0,0 +1,41 @@
<!--
// 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 { createEventDispatcher } from 'svelte'
import { TextArea, EditBox, ToggleWithLabel, Grid, IconFolder } from '@anticrm/ui'
import { SpacePanel } from '@anticrm/presentation'
import type { Ref, Space, Doc, Class } from '@anticrm/core'
import recruit from '../plugin'
export let _id: Ref<Doc>
export let spaceClass: Ref<Class<Space>>
const dispatch = createEventDispatcher()
let name: string
let description: string
</script>
<SpacePanel label={'Open'}
icon={recruit.icon.RecruitApplication}
on:close={() => { dispatch('close') }}>
<Grid column={1} rowGap={1.5}>
<EditBox label={recruit.string.CandidatesName} icon={IconFolder} bind:value={name} placeholder={'The Boring Pool'} focus/>
<!-- <TextArea label={recruit.string.CandidatesDescription} bind:value={description}/> -->
<ToggleWithLabel label={recruit.string.MakePrivate} description={recruit.string.MakePrivateDescription}/>
</Grid>
</SpacePanel>

View File

@ -0,0 +1,41 @@
<!--
// 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 { createEventDispatcher } from 'svelte'
import { EditBox, Dropdown, Grid } from '@anticrm/ui'
import { SpacePanel } from '@anticrm/presentation'
import type { Ref, Space, Doc, Class } from '@anticrm/core'
import Company from './icons/Company.svelte'
import Vacancy from './icons/Vacancy.svelte'
import recruit from '../plugin'
export let _id: Ref<Doc>
export let spaceClass: Ref<Class<Space>>
const dispatch = createEventDispatcher()
let name: string
</script>
<SpacePanel label={'Open'}
icon={recruit.icon.Vacancy}
on:close={() => { dispatch('close') }}>
<Grid rowGap={1.5}>
<EditBox label={recruit.string.VacancyName} icon={Vacancy} bind:value={name} placeholder="Software Engineer" maxWidth="39rem" focus/>
<Dropdown icon={Company} label={'Company *'} placeholder={'The Boring Company'} />
</Grid>
</SpacePanel>

View File

@ -20,6 +20,8 @@ import CreateCandidates from './components/CreateCandidates.svelte'
import CreateCandidate from './components/CreateCandidate.svelte'
import CreateApplication from './components/CreateApplication.svelte'
import EditCandidate from './components/EditCandidate.svelte'
import EditCandidates from './components/EditCandidates.svelte'
import EditVacancy from './components/EditVacancy.svelte'
import Attachments from './components/Attachments.svelte'
import KanbanCard from './components/KanbanCard.svelte'
import ApplicationPresenter from './components/ApplicationPresenter.svelte'
@ -41,6 +43,8 @@ export default async () => ({
CreateCandidate,
CreateApplication,
EditCandidate,
EditCandidates,
EditVacancy,
Attachments,
KanbanCard,
ApplicationPresenter,

View File

@ -23,6 +23,7 @@
"@anticrm/ui": "~0.6.0",
"@anticrm/presentation": "~0.6.1",
"@anticrm/text-editor": "~0.6.0",
"@anticrm/contact": "~0.6.0"
"@anticrm/contact": "~0.6.0",
"@anticrm/core": "~0.6.11"
}
}

View File

@ -0,0 +1,40 @@
<!--
// 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 { createEventDispatcher } from 'svelte'
import { TextArea, EditBox, ToggleWithLabel, Grid, IconToDo } from '@anticrm/ui'
import { SpacePanel } from '@anticrm/presentation'
import type { Ref, Space, Doc, Class } from '@anticrm/core'
import task from '../plugin'
export let _id: Ref<Doc>
export let spaceClass: Ref<Class<Space>>
const dispatch = createEventDispatcher()
let name: string
let description: string
</script>
<SpacePanel label={'Open'}
icon={task.icon.Task}
on:close={() => { dispatch('close') }}>
<Grid column={1} rowGap={1.5}>
<EditBox label={'Task name'} icon={IconToDo} bind:value={name} placeholder={'Task name'} focus/>
<ToggleWithLabel label={'MakePrivate'} description={'MakePrivateDescription'}/>
</Grid>
</SpacePanel>

View File

@ -15,9 +15,11 @@
//
import CreateTask from './components/CreateTask.svelte'
import EditTask from './components/EditTask.svelte'
export default async () => ({
component: {
CreateTask
CreateTask,
EditTask
},
})

View File

@ -51,32 +51,22 @@
align-items: center;
width: 3.25rem;
height: 3.25rem;
opacity: .3;
color: var(--theme-content-trans-color);
.normal-font &.noty {
clip-path: url(#notify-normal);
}
.small-font &.noty {
clip-path: url(#notify-small);
}
.normal-font &.noty { clip-path: url(#notify-normal); }
.small-font &.noty { clip-path: url(#notify-small); }
}
&:hover .icon-container {
opacity: 1;
}
&:hover .icon-container { color: var(--theme-caption-color); }
&:focus {
border: 1px solid var(--primary-button-focused-border);
box-shadow: 0 0 0 3px var(--primary-button-outline);
.icon-container {
opacity: 1;
}
.icon-container { color: var(--theme-caption-color); }
}
&.selected {
background-color: var(--theme-menu-selection);
.icon-container {
opacity: 1;
}
.icon-container { color: var(--theme-caption-color); }
}
}

View File

@ -14,8 +14,7 @@
-->
<script lang="ts">
import Close from './icons/Close.svelte'
import Add from './icons/Add.svelte'
import { IconAdd, IconClose } from '@anticrm/ui'
export let title: string = 'Unknown'
</script>
@ -24,8 +23,8 @@
<div class="title"><span>{title}</span></div>
<div class="separator"/>
<div class="buttons">
<div class="button"><Close/></div>
<div class="button"><Add/></div>
<div class="button"><IconClose size={'small'} /></div>
<div class="button"><IconAdd size={'small'} /></div>
</div>
</div>

View File

@ -32,7 +32,7 @@
position: relative;
display: flex;
flex-direction: column;
padding: 1rem 1.5rem 1.25rem;
padding: 32px 1.5rem 1.25rem;
border-radius: .75rem;
.label {
@ -63,4 +63,4 @@
z-index: -1;
}
}
</style>
</style>

View File

@ -15,10 +15,9 @@
<script lang="ts">
import type { Ref, Space } from '@anticrm/core'
import { Icon, ActionIcon, Button, IconMoreH } from '@anticrm/ui'
import { Icon, ActionIcon, Button, IconMoreH, IconAdd } from '@anticrm/ui'
import type { AnyComponent } from '@anticrm/ui'
import Header from './Header.svelte'
import Add from './icons/Add.svelte'
import Star from './icons/Star.svelte'
import { getClient, createQuery } from '@anticrm/presentation'
@ -48,7 +47,7 @@
<Button label="Create" primary={true} size={'small'} on:click={(ev) => showCreateDialog(ev)}/>
{/if}
<ActionIcon label={'Favorite'} icon={Star} size={'small'}/>
<ActionIcon label={'Create'} icon={Add} size={'small'}/>
<ActionIcon label={'Create'} icon={IconAdd} size={'small'}/>
<ActionIcon label={'More...'} icon={IconMoreH} size={'small'}/>
{/if}
</div>

View File

@ -1,8 +0,0 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M20,11.2h-7.2V4c0-0.4-0.3-0.8-0.8-0.8S11.2,3.6,11.2,4v7.2H4c-0.4,0-0.8,0.3-0.8,0.8s0.3,0.8,0.8,0.8h7.2V20 c0,0.4,0.3,0.8,0.8,0.8s0.8-0.3,0.8-0.8v-7.2H20c0.4,0,0.8-0.3,0.8-0.8S20.4,11.2,20,11.2z"/>
</svg>

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">

View File

@ -1,6 +1,6 @@
<script lang="ts">
export let size: 'small' | 'medium' | 'large'
const fill: string = 'var(--theme-caption-color)'
const fill: string = 'currentColor'
</script>
<svg class="svg-{size}" {fill} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">

View File

@ -19,7 +19,7 @@
import type { Asset, IntlString } from '@anticrm/platform'
import type { Ref, Space, Doc } from '@anticrm/core'
import type { SpacesNavModel } from '@anticrm/workbench'
import { Action, navigate, getCurrentLocation, location, IconAdd } from '@anticrm/ui'
import { Action, navigate, getCurrentLocation, location, IconAdd, IconMoreH, IconEdit } from '@anticrm/ui'
import { getClient, createQuery } from '@anticrm/presentation'
import { showPopup } from '@anticrm/ui'
@ -50,12 +50,20 @@
const editStatuses: Action = {
label: 'Edit Statuses' as IntlString,
icon: IconAdd,
icon: IconMoreH,
action: async (_id: Ref<Doc>): Promise<void> => {
showPopup(EditStatuses, { _id, spaceClass: model.spaceClass }, 'right')
}
}
const editSpace: Action = {
label: 'Open' as IntlString,
icon: IconEdit,
action: async (_id: Ref<Doc>): Promise<void> => {
showPopup(model.editComponent!, { _id, spaceClass: model.spaceClass }, 'right')
}
}
function selectSpace(id: Ref<Space>) {
const loc = getCurrentLocation()
loc.path[2] = id
@ -71,7 +79,7 @@
<div>
<TreeNode label={model.label} actions={[addSpace]}>
{#each spaces as space}
<TreeItem _id={space._id} title={space.name} icon={classIcon(client, space._class)} selected={selected === space._id} actions={[editStatuses]} on:click={() => { selectSpace(space._id) }}/>
<TreeItem _id={space._id} title={space.name} icon={classIcon(client, space._class)} selected={selected === space._id} actions={[editSpace, editStatuses]} on:click={() => { selectSpace(space._id) }}/>
{/each}
</TreeNode>
</div>

View File

@ -77,7 +77,7 @@
.icon {
min-width: 1rem;
opacity: .3;
color: var(--theme-content-trans-color);
margin: 0 1.125rem 0 .625rem;
&.sub { margin: 0 .5rem 0 2.75rem }
}

View File

@ -37,6 +37,7 @@ export interface SpacesNavModel {
spaceClass: Ref<Class<Space>>
addSpaceLabel: IntlString
createComponent: AnyComponent
editComponent: AnyComponent
component?: AnyComponent
}

File diff suppressed because it is too large Load Diff