Merge branch 'master' of github.com:Budibase/budibase into bugfixes
This commit is contained in:
commit
4f03481652
5 changed files with 86 additions and 131 deletions
|
@ -5,6 +5,7 @@
|
||||||
import { notifier } from "builderStore/store/notifications"
|
import { notifier } from "builderStore/store/notifications"
|
||||||
import WorkflowBlockSetup from "./WorkflowBlockSetup.svelte"
|
import WorkflowBlockSetup from "./WorkflowBlockSetup.svelte"
|
||||||
import DeleteWorkflowModal from "./DeleteWorkflowModal.svelte"
|
import DeleteWorkflowModal from "./DeleteWorkflowModal.svelte"
|
||||||
|
import { Button } from "@budibase/bbui"
|
||||||
|
|
||||||
const { open, close } = getContext("simple-modal")
|
const { open, close } = getContext("simple-modal")
|
||||||
|
|
||||||
|
@ -90,26 +91,21 @@
|
||||||
{testResult}
|
{testResult}
|
||||||
</button>
|
</button>
|
||||||
{/if}
|
{/if}
|
||||||
<button class="workflow-button hoverable" on:click={testWorkflow}>
|
<Button secondary wide on:click={testWorkflow}>Test Workflow</Button>
|
||||||
Test
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{#if selectedTab === 'SETUP'}
|
{#if selectedTab === 'SETUP'}
|
||||||
{#if workflowBlock}
|
{#if workflowBlock}
|
||||||
<WorkflowBlockSetup {workflowBlock} />
|
<WorkflowBlockSetup {workflowBlock} />
|
||||||
<div class="buttons">
|
<div class="buttons">
|
||||||
<button
|
<Button
|
||||||
|
green
|
||||||
|
wide
|
||||||
data-cy="save-workflow-setup"
|
data-cy="save-workflow-setup"
|
||||||
class="workflow-button hoverable"
|
|
||||||
on:click={saveWorkflow}>
|
on:click={saveWorkflow}>
|
||||||
Save Workflow
|
Save Workflow
|
||||||
</button>
|
</Button>
|
||||||
<button
|
<Button red wide on:click={deleteWorkflowBlock}>Delete Block</Button>
|
||||||
class="delete-workflow-button hoverable"
|
|
||||||
on:click={deleteWorkflowBlock}>
|
|
||||||
Delete Block
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
{:else if $workflowStore.currentWorkflow}
|
{:else if $workflowStore.currentWorkflow}
|
||||||
<div class="panel">
|
<div class="panel">
|
||||||
|
@ -141,15 +137,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="buttons">
|
<div class="buttons">
|
||||||
<button
|
<Button
|
||||||
|
green
|
||||||
|
wide
|
||||||
data-cy="save-workflow-setup"
|
data-cy="save-workflow-setup"
|
||||||
class="workflow-button hoverable"
|
|
||||||
on:click={saveWorkflow}>
|
on:click={saveWorkflow}>
|
||||||
Save Workflow
|
Save Workflow
|
||||||
</button>
|
</Button>
|
||||||
<button class="delete-workflow-button" on:click={deleteWorkflow}>
|
<Button red wide on:click={deleteWorkflow}>Delete Workflow</Button>
|
||||||
Delete Workflow
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
@ -175,11 +170,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
font-size: 20px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
font-family: inter;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 18px;
|
margin-bottom: 20px;
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -190,13 +186,12 @@
|
||||||
.block-label {
|
.block-label {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: var(--ink);
|
color: var(--grey-7);
|
||||||
margin: 0px 0px 16px 0px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.config-item {
|
.config-item {
|
||||||
margin: 0px 0px 4px 0px;
|
margin-bottom: 20px;
|
||||||
padding: 12px 0px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.budibase_input {
|
.budibase_input {
|
||||||
|
@ -214,6 +209,7 @@
|
||||||
header > span {
|
header > span {
|
||||||
color: var(--grey-5);
|
color: var(--grey-5);
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form {
|
.form {
|
||||||
|
@ -228,52 +224,10 @@
|
||||||
|
|
||||||
.buttons {
|
.buttons {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 10px;
|
bottom: 20px;
|
||||||
}
|
display: grid;
|
||||||
|
|
||||||
.delete-workflow-button {
|
|
||||||
cursor: pointer;
|
|
||||||
border: 1px solid var(--red);
|
|
||||||
border-radius: 3px;
|
|
||||||
width: 260px;
|
|
||||||
padding: 8px 16px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
background: var(--white);
|
|
||||||
color: var(--red);
|
|
||||||
font-size: 14px;
|
|
||||||
font-weight: 500;
|
|
||||||
transition: all 2ms;
|
|
||||||
align-self: flex-end;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.delete-workflow-button:hover {
|
|
||||||
background: var(--red);
|
|
||||||
border: 1px solid var(--red);
|
|
||||||
color: var(--white);
|
|
||||||
}
|
|
||||||
|
|
||||||
.workflow-button {
|
|
||||||
cursor: pointer;
|
|
||||||
border: 1px solid var(--grey-4);
|
|
||||||
border-radius: 3px;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8px 16px;
|
gap: 12px;
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
background: white;
|
|
||||||
color: var(--ink);
|
|
||||||
font-size: 14px;
|
|
||||||
font-weight: 500;
|
|
||||||
transition: all 2ms;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.workflow-button:hover {
|
|
||||||
background: var(--grey-1);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.access-level {
|
.access-level {
|
||||||
|
@ -301,7 +255,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.passed {
|
.passed {
|
||||||
background: #84c991;
|
background: var(--green);
|
||||||
}
|
}
|
||||||
|
|
||||||
.failed {
|
.failed {
|
||||||
|
|
|
@ -13,85 +13,84 @@
|
||||||
: []
|
: []
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<label class="uk-form-label">{workflowBlock.type}: {workflowBlock.name}</label>
|
<label class="selected-label">{workflowBlock.type}: {workflowBlock.name}</label>
|
||||||
{#each workflowParams as [parameter, type]}
|
{#each workflowParams as [parameter, type]}
|
||||||
<div class="block-field">
|
<div class="block-field">
|
||||||
<label class="uk-form-label">{parameter}</label>
|
<label class="label">{parameter}</label>
|
||||||
<div class="uk-form-controls">
|
{#if Array.isArray(type)}
|
||||||
{#if Array.isArray(type)}
|
<select class="budibase_input" bind:value={workflowBlock.args[parameter]}>
|
||||||
<select
|
{#each type as option}
|
||||||
class="budibase_input"
|
<option value={option}>{option}</option>
|
||||||
bind:value={workflowBlock.args[parameter]}>
|
{/each}
|
||||||
{#each type as option}
|
</select>
|
||||||
<option value={option}>{option}</option>
|
{:else if type === 'component'}
|
||||||
{/each}
|
<ComponentSelector bind:value={workflowBlock.args[parameter]} />
|
||||||
</select>
|
{:else if type === 'accessLevel'}
|
||||||
{:else if type === 'component'}
|
<select class="budibase_input" bind:value={workflowBlock.args[parameter]}>
|
||||||
<ComponentSelector bind:value={workflowBlock.args[parameter]} />
|
<option value="ADMIN">Admin</option>
|
||||||
{:else if type === 'accessLevel'}
|
<option value="POWER_USER">Power User</option>
|
||||||
<select
|
</select>
|
||||||
class="budibase__input"
|
{:else if type === 'password'}
|
||||||
bind:value={workflowBlock.args[parameter]}>
|
<input
|
||||||
<option value="ADMIN">Admin</option>
|
type="password"
|
||||||
<option value="POWER_USER">Power User</option>
|
class="budibase_input"
|
||||||
</select>
|
bind:value={workflowBlock.args[parameter]} />
|
||||||
{:else if type === 'password'}
|
{:else if type === 'number'}
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="number"
|
||||||
class="budibase__input"
|
class="budibase_input"
|
||||||
bind:value={workflowBlock.args[parameter]} />
|
bind:value={workflowBlock.args[parameter]} />
|
||||||
{:else if type === 'number'}
|
{:else if type === 'longText'}
|
||||||
<input
|
<textarea
|
||||||
type="number"
|
type="text"
|
||||||
class="budibase__input"
|
class="budibase_input"
|
||||||
bind:value={workflowBlock.args[parameter]} />
|
bind:value={workflowBlock.args[parameter]} />
|
||||||
{:else if type === 'longText'}
|
{:else if type === 'model'}
|
||||||
<textarea
|
<ModelSelector bind:value={workflowBlock.args[parameter]} />
|
||||||
type="text"
|
{:else if type === 'record'}
|
||||||
class="budibase__input"
|
<RecordSelector bind:value={workflowBlock.args[parameter]} />
|
||||||
bind:value={workflowBlock.args[parameter]} />
|
{:else if type === 'string'}
|
||||||
{:else if type === 'model'}
|
<input
|
||||||
<ModelSelector bind:value={workflowBlock.args[parameter]} />
|
type="text"
|
||||||
{:else if type === 'record'}
|
class="budibase_input"
|
||||||
<RecordSelector bind:value={workflowBlock.args[parameter]} />
|
bind:value={workflowBlock.args[parameter]} />
|
||||||
{:else if type === 'string'}
|
{/if}
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
class="budibase__input"
|
|
||||||
bind:value={workflowBlock.args[parameter]} />
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.block-field {
|
.block-field {
|
||||||
border-radius: 3px;
|
display: grid;
|
||||||
background: var(--grey-1);
|
|
||||||
padding: 12px;
|
|
||||||
margin: 0px 0px 4px 0px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.budibase_input {
|
.budibase_input {
|
||||||
height: 36px;
|
height: 36px;
|
||||||
width: 220px;
|
border-radius: 5px;
|
||||||
border-radius: 3px;
|
background-color: var(--grey-2);
|
||||||
border: 1px solid var(--grey-4);
|
border: 1px solid var(--grey-2);
|
||||||
text-align: left;
|
text-align: left;
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
padding-left: 12px;
|
padding-left: 12px;
|
||||||
|
margin-top: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label {
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selected-label {
|
||||||
|
text-transform: capitalize;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
min-height: 150px;
|
min-height: 150px;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
padding: 5px;
|
padding: 12px;
|
||||||
|
margin-top: 8px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -81,7 +81,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.play-button.highlighted {
|
.play-button.highlighted {
|
||||||
background: var(--primary);
|
background: var(--purple);
|
||||||
}
|
}
|
||||||
|
|
||||||
.stop-button.highlighted {
|
.stop-button.highlighted {
|
||||||
|
|
|
@ -67,6 +67,10 @@
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
div:hover {
|
div:hover {
|
||||||
transform: scale(1.05);
|
transform: scale(1.05);
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
import { onMount, getContext } from "svelte"
|
import { onMount, getContext } from "svelte"
|
||||||
import { backendUiStore, workflowStore } from "builderStore"
|
import { backendUiStore, workflowStore } from "builderStore"
|
||||||
import CreateWorkflowModal from "./CreateWorkflowModal.svelte"
|
import CreateWorkflowModal from "./CreateWorkflowModal.svelte"
|
||||||
|
import { Button } from "@budibase/bbui"
|
||||||
|
|
||||||
const { open, close } = getContext("simple-modal")
|
const { open, close } = getContext("simple-modal")
|
||||||
|
|
||||||
|
@ -27,10 +28,7 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<button class="new-workflow-button hoverable" on:click={newWorkflow}>
|
<Button purple wide on:click{newWorkflow}>Create New Workflow</Button>
|
||||||
<i class="icon ri-add-circle-fill" />
|
|
||||||
Create New Workflow
|
|
||||||
</button>
|
|
||||||
<ul>
|
<ul>
|
||||||
{#each $workflowStore.workflows as workflow}
|
{#each $workflowStore.workflows as workflow}
|
||||||
<li
|
<li
|
||||||
|
@ -74,10 +72,10 @@
|
||||||
|
|
||||||
.workflow-item {
|
.workflow-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
border-radius: 3px;
|
border-radius: 5px;
|
||||||
padding-left: 12px;
|
padding-left: 12px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
height: 40px;
|
height: 36px;
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue