From 2aae64521f9bd60bde9ff1ec7747bbbe7447913d Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Sat, 5 Sep 2020 21:53:10 +0100 Subject: [PATCH] events panel work - backup --- .../common/Icons/CloseCircle.svelte | 12 +++ .../src/components/common/Icons/index.js | 1 + .../EventsEditor/EventEditorModal.svelte | 27 +++-- .../EventsEditor/actions/NavigateTo.svelte | 19 +++- .../EventsEditor/actions/UpdateRecord.svelte | 98 ++++++++++++++++++- 5 files changed, 147 insertions(+), 10 deletions(-) create mode 100644 packages/builder/src/components/common/Icons/CloseCircle.svelte diff --git a/packages/builder/src/components/common/Icons/CloseCircle.svelte b/packages/builder/src/components/common/Icons/CloseCircle.svelte new file mode 100644 index 0000000000..cdad65f422 --- /dev/null +++ b/packages/builder/src/components/common/Icons/CloseCircle.svelte @@ -0,0 +1,12 @@ + + + + diff --git a/packages/builder/src/components/common/Icons/index.js b/packages/builder/src/components/common/Icons/index.js index 4e4b41082d..7082b1b5e0 100644 --- a/packages/builder/src/components/common/Icons/index.js +++ b/packages/builder/src/components/common/Icons/index.js @@ -32,3 +32,4 @@ export { default as TwitterIcon } from "./Twitter.svelte" export { default as InfoIcon } from "./Info.svelte" export { default as CloseIcon } from "./Close.svelte" export { default as MoreIcon } from "./More.svelte" +export { default as CloseCircleIcon } from "./CloseCircle.svelte" diff --git a/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte b/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte index 5ef8a3075d..5a9af8de9d 100644 --- a/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte +++ b/packages/builder/src/components/userInterface/EventsEditor/EventEditorModal.svelte @@ -7,7 +7,7 @@ Heading, DropdownMenu, } from "@budibase/bbui" - import { AddIcon } from "components/common/Icons/" + import { AddIcon, ArrowDownIcon } from "components/common/Icons/" import { EVENT_TYPE_MEMBER_NAME } from "../../common/eventHandlers" import actionTypes from "./actions" import { createEventDispatcher } from "svelte" @@ -95,9 +95,11 @@ {#each actions as action, index}
- +

{index + 1}. {action[EVENT_TYPE_MEMBER_NAME]} - +

{#if action === selectedAction}
@@ -154,16 +156,25 @@ .actions-container { flex: 1; min-height: 0px; - padding: var(--spacing-xl); - padding-bottom: var(--spacing-m); - padding-top: var(--spacing-m); + padding-bottom: var(--spacing-s); + padding-top: 0; border: var(--border-light); border-width: 0 0 1px 0; + overflow-y: auto; } .action-container { border: var(--border-light); border-width: 1px 0 0 0; + padding-left: var(--spacing-xl); + padding-right: var(--spacing-xl); + padding-top: 0; + padding-bottom: 0; + } + + .selected-action-container { + padding-bottom: var(--spacing-s); + padding-top: var(--spacing-s); } .delete-action-button { @@ -191,4 +202,8 @@ .footer > a:hover { color: var(--blue); } + + .rotate :global(svg) { + transform: rotate(-90deg); + } diff --git a/packages/builder/src/components/userInterface/EventsEditor/actions/NavigateTo.svelte b/packages/builder/src/components/userInterface/EventsEditor/actions/NavigateTo.svelte index 4d07c0a719..f3ab468ccc 100644 --- a/packages/builder/src/components/userInterface/EventsEditor/actions/NavigateTo.svelte +++ b/packages/builder/src/components/userInterface/EventsEditor/actions/NavigateTo.svelte @@ -5,12 +5,25 @@ export let parameters -
+
- + {/each}
+ + diff --git a/packages/builder/src/components/userInterface/EventsEditor/actions/UpdateRecord.svelte b/packages/builder/src/components/userInterface/EventsEditor/actions/UpdateRecord.svelte index afd901ed31..22125ee7c3 100644 --- a/packages/builder/src/components/userInterface/EventsEditor/actions/UpdateRecord.svelte +++ b/packages/builder/src/components/userInterface/EventsEditor/actions/UpdateRecord.svelte @@ -1,5 +1,101 @@ -
Update Record
+
+ + + + {#if parameters.model && fields} + {#each fields as field} + + + + +
+ + + +
+ {/each} + {/if} + +
+ +