save show/hide

Signed-off-by: Andrey Platov <andrey@hardcoreeng.com>

packages/ui/src/components/EditBox.svelte

@@ -14,7 +14,7 @@
 -->
 
 <script lang="ts">
-  import { onMount } from 'svelte'
+  import { createEventDispatcher, onMount } from 'svelte'
   import type { IntlString } from '@anticrm/platform'
   import Label from './Label.svelte'
 
@@ -25,6 +25,8 @@
   export let password: boolean = false
   export let focus: boolean = false
 
+  const dispatch = createEventDispatcher()
+
   let text: HTMLElement
   let input: HTMLInputElement
 
@@ -33,6 +35,7 @@
     const value = target.value
     text.innerHTML = (value === '' ? placeholder : value).replaceAll(' ', '&nbsp;')
     target.style.width = text.clientWidth + 'px'
+    dispatch('input')
   }
 
   onMount(() => {

plugins/recruit-resources/src/components/CreateCandidate.svelte

@@ -74,4 +74,4 @@
 
 </script>
 
-<DialogHeader {space} {object} {newValue} {resumeId} {resumeName} {resumeUuid} {resumeSize} {resumeType} on:save={createCandidate}/>
+<DialogHeader {space} {object} {newValue} {resumeId} {resumeName} {resumeUuid} {resumeSize} {resumeType} create={true} on:save={createCandidate}/>

plugins/recruit-resources/src/components/DialogHeader.svelte

@@ -41,8 +41,23 @@
   export let resumeSize: number
   export let resumeType: string
 
+  export let create = false
+
   let dragover = false
   let loading = false
+  let changed = false
+
+  function isChanged(): void {
+    console.log(object)
+    console.log(newValue)
+    for (const key in object) {
+      if ((newValue as any)[key] !== (object as any)[key]) {
+        changed = true
+        return
+      }
+    }
+    changed = false
+  }
 
   async function createAttachment(file: File) {
     loading = true
@@ -84,10 +99,10 @@
     <div class="avatar" on:click|stopPropagation={() => showModal(AvatarEditor, { label: 'Profile photo' })}><User /></div>
     <div class="flex-col">
       <div class="name">
-        <EditBox placeholder="John" bind:value={newValue.firstName}/>
-        <EditBox placeholder="Appleseed" bind:value={newValue.lastName}/>
+        <EditBox placeholder="Jonny" bind:value={newValue.firstName} on:input={isChanged}/>
+        <EditBox placeholder="Appleseed" bind:value={newValue.lastName} on:input={isChanged}/>
       </div>
-      <div class="title"><EditBox placeholder="Los Angeles" bind:value={newValue.city}/></div>
+      <div class="title"><EditBox placeholder="Los Angeles" bind:value={newValue.city} on:input={isChanged}/></div>
     </div>
   </div>
   <div class="abs-lb-content">
@@ -99,7 +114,9 @@
     {/if}
   </div>
   <div class="abs-rb-content">
-    <Button label={'Create'} size={'small'} transparent on:click={ () => { dispatch('save') } }/>
+    {#if changed}
+      <Button label={ create ? 'Create' : 'Save' } size={'small'} transparent on:click={ () => { dispatch('save') } }/>
+    {/if}
   </div>
   <div class="abs-rt-content">
     <Grid column={2} columnGap={.5}>

plugins/recruit-resources/src/components/EditCandidate.svelte

@@ -46,6 +46,8 @@
       }
     }
     await client.updateDoc(recruit.class.Candidate, object.space, object._id, attributes)
+
+    dispatch('close')
   }
 
   const tabModel = [
@@ -78,7 +80,7 @@
 </script>
 
 <div class="container">
-  <DialogHeader {space} {object} {newValue} {resumeId} {resumeName} {resumeUuid} {resumeSize} {resumeType}/>
+  <DialogHeader {space} {object} {newValue} {resumeId} {resumeName} {resumeUuid} {resumeSize} {resumeType} on:save={ save }/>
   <div class="tabs-container">
     <Tabs model={tabModel}/>
   </div>