lint
This commit is contained in:
Martin McKeaveney
parent
f8c04cc586
commit
92098ceb59
|
|
@ -3,6 +3,8 @@
|
|||
import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
|
||||
|
||||
export let integration
|
||||
|
||||
let unsaved = false
|
||||
</script>
|
||||
|
||||
<form>
|
||||
|
|
@ -10,13 +12,14 @@
|
|||
{#if typeof integration[configKey] === 'object'}
|
||||
<Label small>{configKey}</Label>
|
||||
<Spacer small />
|
||||
<KeyValueBuilder bind:object={integration[configKey]} />
|
||||
<KeyValueBuilder bind:object={integration[configKey]} on:change />
|
||||
{:else}
|
||||
<div class="form-row">
|
||||
<Label small>{configKey}</Label>
|
||||
<Input
|
||||
outline
|
||||
type={integration[configKey].type}
|
||||
on:change
|
||||
bind:value={integration[configKey]} />
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -50,22 +50,6 @@
|
|||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<!-- {#if schema}
|
||||
{#each Object.keys(schema) as configKey}
|
||||
{#if schema[configKey].type === 'object'}
|
||||
<Label small>{configKey}</Label>
|
||||
<KeyValueBuilder bind:object={integration[configKey]} />
|
||||
{:else}
|
||||
<Label small>{configKey}</Label>
|
||||
<Input
|
||||
outline
|
||||
type={integration[configKey].type}
|
||||
bind:value={integration[configKey]} />
|
||||
{/if}
|
||||
<Spacer medium />
|
||||
{/each}
|
||||
{/if} -->
|
||||
</section>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -1,35 +0,0 @@
|
|||
<!--<script>
|
||||
import { backendUiStore, store, allScreens } from "builderStore"
|
||||
import { notifier } from "builderStore/store/notifications"
|
||||
import { DropdownMenu, Button, Input, TextButton, Icon } from "@budibase/bbui"
|
||||
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
|
||||
import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte"
|
||||
import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
|
||||
import ParameterBuilder from "components/integration/QueryParameterBuilder.svelte"
|
||||
|
||||
export let bindable
|
||||
export let parameters
|
||||
|
||||
let anchor
|
||||
let dropdown
|
||||
let confirmDeleteDialog
|
||||
|
||||
function hideEditor() {
|
||||
dropdown?.hide()
|
||||
}
|
||||
</script><div on:click|stopPropagation bind:this={anchor}>
|
||||
<TextButton text on:click={dropdown.show} active={false}>
|
||||
<Icon name="add" />
|
||||
Add Parameters
|
||||
</TextButton>
|
||||
<DropdownMenu align="right" {anchor} bind:this={dropdown}>
|
||||
<div class="wrapper">
|
||||
<ParameterBuilder bind:parameters {bindable} />
|
||||
</div>
|
||||
</DropdownMenu>
|
||||
</div><style>
|
||||
.wrapper {
|
||||
padding: var(--spacing-xl);
|
||||
min-width: 600px;
|
||||
}
|
||||
</style>-->
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
Input,
|
||||
Heading,
|
||||
Select,
|
||||
Spacer
|
||||
Spacer,
|
||||
} from "@budibase/bbui"
|
||||
import Editor from "./QueryEditor.svelte"
|
||||
import KeyValueBuilder from "./KeyValueBuilder.svelte"
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@
|
|||
|
||||
<section>
|
||||
<div class="controls">
|
||||
<Heading small>Parameters</Heading>
|
||||
<Heading small lh>Parameters</Heading>
|
||||
{#if !bindable}
|
||||
<Button secondary on:click={newQueryParameter}>Add Param</Button>
|
||||
{/if}
|
||||
|
|
@ -79,6 +79,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.parameters {
|
||||
|
|
|
|||
|
|
@ -131,10 +131,9 @@
|
|||
</script>
|
||||
|
||||
<section class="config">
|
||||
<Heading medium>Query {integrationInfo.friendlyName}</Heading>
|
||||
<Heading medium lh>Query {integrationInfo?.friendlyName}</Heading>
|
||||
<hr />
|
||||
<Heading small>Config</Heading>
|
||||
<Spacer medium />
|
||||
<Heading small lh>Config</Heading>
|
||||
<Body small grey>Provide a name for your query and select its function.</Body>
|
||||
<Spacer medium />
|
||||
<div class="config-field">
|
||||
|
|
@ -147,7 +146,9 @@
|
|||
<Label small>Function</Label>
|
||||
<Select primary outline thin bind:value={query.queryVerb}>
|
||||
{#each Object.keys(queryConfig) as queryVerb}
|
||||
<option value={queryVerb}>{queryConfig[queryVerb]?.displayName || queryVerb}</option>
|
||||
<option value={queryVerb}>
|
||||
{queryConfig[queryVerb]?.displayName || queryVerb}
|
||||
</option>
|
||||
{/each}
|
||||
</Select>
|
||||
</div>
|
||||
|
|
@ -160,7 +161,8 @@
|
|||
{#if shouldShowQueryConfig}
|
||||
<section>
|
||||
<div class="config">
|
||||
<Heading small>Fields</Heading>
|
||||
<Heading small lh>Fields</Heading>
|
||||
<Body small grey>Fill in the fields specific to this query.</Body>
|
||||
<Spacer medium />
|
||||
<IntegrationQueryEditor
|
||||
{datasource}
|
||||
|
|
@ -171,7 +173,7 @@
|
|||
<hr />
|
||||
|
||||
<div class="viewer-controls">
|
||||
<Heading small>Query Results</Heading>
|
||||
<Heading small lh>Query Results</Heading>
|
||||
<div class="button-container">
|
||||
<Button
|
||||
secondary
|
||||
|
|
@ -198,8 +200,10 @@
|
|||
<pre class="preview">
|
||||
{#if !data[0]}
|
||||
|
||||
|
||||
Please run your query to fetch some data.
|
||||
|
||||
|
||||
{:else}
|
||||
{JSON.stringify(data[0], undefined, 2)}
|
||||
{/if}
|
||||
|
|
@ -283,5 +287,6 @@
|
|||
justify-content: space-between;
|
||||
gap: var(--spacing-m);
|
||||
min-width: 150px;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
const QueryTypes = {
|
||||
SQL: "sql",
|
||||
JSON: "json",
|
||||
FIELDS: "fields"
|
||||
FIELDS: "fields",
|
||||
}
|
||||
|
||||
export let query
|
||||
|
|
@ -16,7 +16,9 @@
|
|||
export let schema
|
||||
export let editable = true
|
||||
|
||||
$: urlDisplay = schema.urlDisplay && `${datasource.config.url}${query.fields.path}${query.fields.queryString}`
|
||||
$: urlDisplay =
|
||||
schema.urlDisplay &&
|
||||
`${datasource.config.url}${query.fields.path}${query.fields.queryString}`
|
||||
|
||||
function updateQuery({ detail }) {
|
||||
query.fields[schema.type] = detail.value
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
<script>
|
||||
import { goto } from "@sveltech/routify"
|
||||
import { goto, beforeUrlChange } from "@sveltech/routify"
|
||||
import { Button, Heading, Body, Spacer, Icon } from "@budibase/bbui"
|
||||
import { backendUiStore } from "builderStore"
|
||||
import { notifier } from "builderStore/store/notifications"
|
||||
import IntegrationConfigForm from "components/backend/DatasourceNavigator/TableIntegrationMenu/IntegrationConfigForm.svelte"
|
||||
import ICONS from "components/backend/DatasourceNavigator/icons"
|
||||
|
||||
let unsaved = false
|
||||
|
||||
$: datasource = $backendUiStore.datasources.find(
|
||||
ds => ds._id === $backendUiStore.selectedDatasourceId
|
||||
)
|
||||
|
|
@ -14,6 +16,7 @@
|
|||
// Create datasource
|
||||
await backendUiStore.actions.datasources.save(datasource)
|
||||
notifier.success(`Datasource ${name} saved successfully.`)
|
||||
unsaved = false
|
||||
}
|
||||
|
||||
function onClickQuery(query) {
|
||||
|
|
@ -23,6 +26,21 @@
|
|||
backendUiStore.actions.queries.select(query)
|
||||
$goto(`../${query._id}`)
|
||||
}
|
||||
|
||||
function setUnsaved() {
|
||||
unsaved = true
|
||||
}
|
||||
|
||||
$beforeUrlChange((event, store) => {
|
||||
if (unsaved) {
|
||||
notifier.danger(
|
||||
"Unsaved changes. Please save your datasource configuration before leaving."
|
||||
)
|
||||
return false
|
||||
}
|
||||
|
||||
return true
|
||||
})
|
||||
</script>
|
||||
|
||||
{#if datasource}
|
||||
|
|
@ -39,7 +57,6 @@
|
|||
</header>
|
||||
<Spacer extraLarge />
|
||||
<div class="container">
|
||||
|
||||
<div class="config-header">
|
||||
<Heading small>Configuration</Heading>
|
||||
<Button secondary on:click={saveDatasource}>Save</Button>
|
||||
|
|
@ -49,7 +66,9 @@
|
|||
</Body>
|
||||
|
||||
<Spacer medium />
|
||||
<IntegrationConfigForm integration={datasource.config} />
|
||||
<IntegrationConfigForm
|
||||
integration={datasource.config}
|
||||
on:change={setUnsaved} />
|
||||
<Spacer medium />
|
||||
|
||||
<hr />
|
||||
|
|
|
|||
Loading…
Reference in New Issue