forked from TEAM-MAT/lockerweb
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #344 from Twinsteak/feat/config-import
[feat] 설정 데이터 내보내기/가져오기
- Loading branch information
Showing
12 changed files
with
475 additions
and
28 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| <script lang="ts"> | ||
| export let id: string; | ||
| export let value: string; | ||
| export let label: string; | ||
| export let showLabel: boolean = false; | ||
| export let labelClass: string = ''; | ||
| export let inputClass: string = ''; | ||
| export let invalidClass: string = ''; | ||
| export let invalidText: string = '이 값은 올바르지 않습니다.'; | ||
| let clazz = ''; | ||
| export { clazz as class }; | ||
| </script> | ||
|
|
||
| <div class="{clazz} flex flex-col"> | ||
| <!--suppress XmlInvalidId --> | ||
| <label class="{labelClass} mb-1 block font-bold" for={id} class:hidden={!showLabel} | ||
| >{label ?? ''} <span class:hidden={!$$props.required} class="text-red-800">*</span></label> | ||
| <textarea | ||
| {id} | ||
| class="{inputClass} resize-none grow rounded-md border-transparent bg-gray-100 transition-all | ||
| invalid:outline-red-600 hover:bg-gray-200 focus:bg-white disabled:bg-gray-300 disabled:text-gray-400" | ||
| bind:value | ||
| {...$$restProps} /> | ||
| <p class="{invalidClass} mt-1 hidden">{invalidText}</p> | ||
| </div> | ||
|
|
||
| <style lang="postcss"> | ||
| input:invalid ~ p { | ||
| @apply block; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
108 changes: 108 additions & 0 deletions
108
packages/client/src/components/molecule/admin/department/DepartmentImportExportModal.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,108 @@ | ||
| <script lang="ts"> | ||
| import Modal from '../../Modal.svelte'; | ||
| import { config } from '$lib/store'; | ||
| import DocumentArrowRight from '../../../../icons/DocumentArrowRight.svelte'; | ||
| import { createEventDispatcher } from 'svelte'; | ||
| import { DepartmentConfigSchema, getDepartmentConfigs } from '$lib/api/config'; | ||
| import TextGrammarCheckmark from '../../../../icons/TextGrammarCheckmark.svelte'; | ||
| import TextArea from 'src/components/atom/form/TextArea.svelte'; | ||
| import { z } from 'zod'; | ||
| import Checkmark from 'src/icons/Checkmark.svelte'; | ||
| import Dismiss from 'src/icons/Dismiss.svelte'; | ||
| const dispatch = createEventDispatcher<{ | ||
| submit: DepartmentConfigResponse[]; | ||
| }>(); | ||
| $: departments = $config && $config.success ? getDepartmentConfigs($config.result) : []; | ||
| export let open = false; | ||
| const title = '학과(부) 설정 가져오기/내보내기'; | ||
| let configText; | ||
| $: if(departments && !configText) { | ||
| configText = JSON.stringify(departments, null, 2); | ||
| } | ||
| let green = false; | ||
| let error = ''; | ||
| $: if(configText) { | ||
| error = ''; | ||
| green = false; | ||
| } | ||
| function checkConfigJSON(): boolean { | ||
| try { | ||
| const parsed = z.array(DepartmentConfigSchema).safeParse(JSON.parse(configText)); | ||
| if(parsed.success == false) { | ||
| error = JSON.stringify(parsed.error, null, 2); | ||
| } | ||
| return parsed.success; | ||
| } catch (e) { | ||
| console.error(e.message); | ||
| error = e.message; | ||
| return false; | ||
| } | ||
| } | ||
| function updateConfigs() { | ||
| const parsed = z.array(DepartmentConfigSchema).safeParse(JSON.parse(configText)); | ||
| if(parsed.success) { | ||
| const configs = parsed.data; | ||
| const configResponse: DepartmentConfigResponse[] = configs.map((conf) => { | ||
| const { id, name, activateFrom, activateTo, contact } = conf; | ||
| return { | ||
| id, | ||
| name, | ||
| ...(activateFrom | ||
| ? { activate_from: activateFrom.toISOString() } | ||
| : { activate_from: null }), | ||
| ...(activateTo | ||
| ? { activate_to: activateTo.toISOString() } | ||
| : { activate_to: null }), | ||
| ...(contact ? { contact } : { contact: null }), | ||
| }; | ||
| }); | ||
| dispatch('submit', configResponse); | ||
| } | ||
| } | ||
| </script> | ||
|
|
||
| <Modal | ||
| on:close | ||
| on:click:secondary={() => green = checkConfigJSON()} | ||
| on:click={updateConfigs} | ||
| {title} | ||
| bind:open | ||
| primaryDisabled={!green} | ||
| primaryText="가져오기" | ||
| secondaryText="검증" | ||
| isPrimaryBtnIconRight | ||
| isSecondaryBtnIconRight | ||
| {...$$restProps}> | ||
| <div class="flex flex-col gap-3 h-full"> | ||
| <TextArea | ||
| class="h-full" | ||
| id="json" | ||
| bind:value={configText} | ||
| label="서비스 설정 데이터" | ||
| showLabel | ||
| /> | ||
| <p class="text-gray-800 text-sm">데이터를 복사하여 저장하거나, 직접 수정하여 서비스에 적용할 수 있습니다.</p> | ||
| {#if green} | ||
| <div class="text-green-800 flex items-center gap-1"> | ||
| <Checkmark class="w-3" /> | ||
| <p class="text-xs font-bold">검증 성공!</p> | ||
| </div> | ||
| {:else if error} | ||
| <div class="text-red-800 flex items-center gap-1"> | ||
| <Dismiss class="w-3" /> | ||
| <p class="text-xs font-bold">검증 실패</p> | ||
| </div> | ||
| <pre class="rounded-md p-1 bg-white text-red-800 whitespace-pre-wrap text-xs font-mono">{error}</pre> | ||
| {:else} | ||
| <p class="text-xs">데이터를 가져오려면 검증하세요.</p> | ||
| {/if} | ||
| </div> | ||
| <DocumentArrowRight slot="primaryIcon" /> | ||
| <TextGrammarCheckmark slot="secondaryIcon" /> | ||
| </Modal> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
105 changes: 105 additions & 0 deletions
105
packages/client/src/components/molecule/admin/service/ServiceImportExportModal.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,105 @@ | ||
| <script lang="ts"> | ||
| import Modal from '../../Modal.svelte'; | ||
| import { config } from '$lib/store'; | ||
| import DocumentArrowRight from '../../../../icons/DocumentArrowRight.svelte'; | ||
| import { createEventDispatcher } from 'svelte'; | ||
| import { ServiceConfigSchema, getServiceConfig } from '$lib/api/config'; | ||
| import TextGrammarCheckmark from '../../../../icons/TextGrammarCheckmark.svelte'; | ||
| import TextArea from 'src/components/atom/form/TextArea.svelte'; | ||
| import Checkmark from 'src/icons/Checkmark.svelte'; | ||
| import Dismiss from 'src/icons/Dismiss.svelte'; | ||
| const dispatch = createEventDispatcher<{ | ||
| submit: ServiceConfigResponse; | ||
| }>(); | ||
| $: serviceConfig = $config && $config.success ? getServiceConfig($config.result) : {}; | ||
| export let open = false; | ||
| const title = '서비스 설정 가져오기/내보내기'; | ||
| let configText; | ||
| $: if(serviceConfig && !configText) { | ||
| configText = JSON.stringify(serviceConfig, null, 2); | ||
| } | ||
| let green = false; | ||
| let error = ''; | ||
| $: if(configText) { | ||
| error = ''; | ||
| green = false; | ||
| } | ||
| function checkConfigJSON(): boolean { | ||
| try { | ||
| const parsed = ServiceConfigSchema.safeParse(JSON.parse(configText)); | ||
| if(parsed.success == false) { | ||
| error = JSON.stringify(parsed.error, null, 2); | ||
| } | ||
| return parsed.success; | ||
| } catch (e) { | ||
| console.error(e.message); | ||
| error = e.message; | ||
| return false; | ||
| } | ||
| } | ||
| function updateConfigs() { | ||
| const parsed = ServiceConfigSchema.safeParse(JSON.parse(configText)); | ||
| if(parsed.success) { | ||
| const { name, activateFrom, activateTo, alert, buildings } = parsed.data as ServiceConfig; | ||
| const configResponse: ServiceConfigResponse = { | ||
| id: 'SERVICE', | ||
| name, | ||
| ...(activateFrom | ||
| ? { activate_from: activateFrom.toISOString() } | ||
| : { activate_from: null }), | ||
| ...(activateTo | ||
| ? { activate_to: activateTo.toISOString() } | ||
| : { activate_to: null }), | ||
| ...(alert ? { alert } : { alert: null }), | ||
| buildings, | ||
| } | ||
| dispatch('submit', configResponse); | ||
| } | ||
| } | ||
| </script> | ||
|
|
||
| <Modal | ||
| on:close | ||
| on:click:secondary={() => green = checkConfigJSON()} | ||
| on:click={updateConfigs} | ||
| {title} | ||
| bind:open | ||
| primaryDisabled={!green} | ||
| primaryText="가져오기" | ||
| secondaryText="검증" | ||
| isPrimaryBtnIconRight | ||
| isSecondaryBtnIconRight | ||
| {...$$restProps}> | ||
| <div class="flex flex-col gap-3 h-full"> | ||
| <TextArea | ||
| class="h-full" | ||
| id="json" | ||
| bind:value={configText} | ||
| label="서비스 설정 데이터" | ||
| showLabel | ||
| /> | ||
| <p class="text-gray-800 text-sm">데이터를 복사하여 저장하거나, 직접 수정하여 서비스에 적용할 수 있습니다.</p> | ||
| {#if green} | ||
| <div class="text-green-800 flex items-center gap-1"> | ||
| <Checkmark class="w-3" /> | ||
| <p class="text-xs font-bold">검증 성공!</p> | ||
| </div> | ||
| {:else if error} | ||
| <div class="text-red-800 flex items-center gap-1"> | ||
| <Dismiss class="w-3" /> | ||
| <p class="text-xs font-bold">검증 실패</p> | ||
| </div> | ||
| <pre class="rounded-md p-1 bg-white text-red-800 whitespace-pre-wrap text-xs font-mono">{error}</pre> | ||
| {:else} | ||
| <p class="text-xs">데이터를 가져오려면 검증하세요.</p> | ||
| {/if} | ||
| </div> | ||
| <DocumentArrowRight slot="primaryIcon" /> | ||
| <TextGrammarCheckmark slot="secondaryIcon" /> | ||
| </Modal> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.