2020-12-18 19:19:43 +01:00
|
|
|
<script>
|
2021-01-14 21:51:03 +01:00
|
|
|
import Editor from "./QueryEditor.svelte"
|
2021-01-13 15:11:53 +01:00
|
|
|
import FieldsBuilder from "./QueryFieldsBuilder.svelte"
|
2021-02-22 13:23:46 +01:00
|
|
|
import { Label, Input } from "@budibase/bbui"
|
2021-01-06 13:28:51 +01:00
|
|
|
|
2020-12-18 19:19:43 +01:00
|
|
|
const QueryTypes = {
|
|
|
|
SQL: "sql",
|
2021-01-11 22:01:21 +01:00
|
|
|
JSON: "json",
|
|
|
|
FIELDS: "fields",
|
2020-12-18 19:19:43 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
export let query
|
2021-02-18 19:55:08 +01:00
|
|
|
export let datasource
|
2021-01-13 15:11:53 +01:00
|
|
|
export let schema
|
2021-01-14 15:22:24 +01:00
|
|
|
export let editable = true
|
2021-02-18 18:44:56 +01:00
|
|
|
export let height = 500
|
2021-01-11 18:18:22 +01:00
|
|
|
|
2021-02-19 15:31:07 +01:00
|
|
|
$: urlDisplay =
|
|
|
|
schema.urlDisplay &&
|
2021-10-05 12:20:09 +02:00
|
|
|
`${datasource.config.url}${
|
|
|
|
query.fields.path ? "/" + query.fields.path : ""
|
|
|
|
}${query.fields.queryString ? "?" + query.fields.queryString : ""}`
|
2021-02-18 19:55:08 +01:00
|
|
|
|
2021-01-11 18:18:22 +01:00
|
|
|
function updateQuery({ detail }) {
|
2021-01-13 17:39:47 +01:00
|
|
|
query.fields[schema.type] = detail.value
|
2021-01-11 18:18:22 +01:00
|
|
|
}
|
2020-12-18 19:19:43 +01:00
|
|
|
</script>
|
|
|
|
|
2021-01-13 17:39:47 +01:00
|
|
|
{#if schema}
|
2021-01-18 16:37:32 +01:00
|
|
|
{#key query._id}
|
|
|
|
{#if schema.type === QueryTypes.SQL}
|
|
|
|
<Editor
|
2021-02-18 18:44:56 +01:00
|
|
|
editorHeight={height}
|
2021-01-18 16:37:32 +01:00
|
|
|
label="Query"
|
|
|
|
mode="sql"
|
|
|
|
on:change={updateQuery}
|
|
|
|
readOnly={!editable}
|
2021-02-01 12:51:53 +01:00
|
|
|
value={query.fields.sql}
|
2021-05-04 12:04:42 +02:00
|
|
|
parameters={query.parameters}
|
|
|
|
/>
|
2021-01-18 16:37:32 +01:00
|
|
|
{:else if schema.type === QueryTypes.JSON}
|
|
|
|
<Editor
|
2021-02-18 18:44:56 +01:00
|
|
|
editorHeight={height}
|
2021-01-18 16:37:32 +01:00
|
|
|
label="Query"
|
|
|
|
mode="json"
|
|
|
|
on:change={updateQuery}
|
|
|
|
readOnly={!editable}
|
2021-02-01 12:51:53 +01:00
|
|
|
value={query.fields.json}
|
2021-05-04 12:04:42 +02:00
|
|
|
parameters={query.parameters}
|
|
|
|
/>
|
2021-01-18 16:37:32 +01:00
|
|
|
{:else if schema.type === QueryTypes.FIELDS}
|
|
|
|
<FieldsBuilder bind:fields={query.fields} {schema} {editable} />
|
2021-02-18 19:55:08 +01:00
|
|
|
{#if schema.urlDisplay}
|
|
|
|
<div class="url-row">
|
|
|
|
<Label small>URL</Label>
|
|
|
|
<Input thin outline disabled value={urlDisplay} />
|
|
|
|
</div>
|
|
|
|
{/if}
|
2021-01-18 16:37:32 +01:00
|
|
|
{/if}
|
|
|
|
{/key}
|
2021-01-12 11:28:41 +01:00
|
|
|
{/if}
|
2021-02-18 19:55:08 +01:00
|
|
|
|
|
|
|
<style>
|
2021-02-19 15:31:07 +01:00
|
|
|
.url-row {
|
|
|
|
display: grid;
|
|
|
|
grid-template-columns: 20% 1fr;
|
|
|
|
grid-gap: var(--spacing-l);
|
|
|
|
align-items: center;
|
|
|
|
}
|
2021-02-18 19:55:08 +01:00
|
|
|
</style>
|