forked from tsai/budibase
Michael Drury
5 years ago
committed by
GitHub
GitHub
36 changed files with 1825 additions and 239 deletions
@ -0,0 +1,11 @@ |
|||
<script> |
|||
export let value |
|||
</script> |
|||
|
|||
<div class="bold">{value}</div> |
|||
|
|||
<style> |
|||
.bold { |
|||
font-weight: bold; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,5 @@ |
|||
<script> |
|||
export let value |
|||
</script> |
|||
|
|||
<code>{value}</code> |
|||
@ -0,0 +1,54 @@ |
|||
<script> |
|||
import { Body, Table, BoldRenderer, CodeRenderer } from "@budibase/bbui" |
|||
import { queries as queriesStore } from "stores/backend" |
|||
import { goto } from "@roxi/routify" |
|||
|
|||
export let datasource |
|||
export let queries |
|||
|
|||
let dynamicVariables = [] |
|||
|
|||
$: enrichDynamicVariables(datasource, queries) |
|||
|
|||
const dynamicVariableSchema = { |
|||
name: "", |
|||
query: "", |
|||
value: "", |
|||
} |
|||
|
|||
const onClick = dynamicVariable => { |
|||
const queryId = dynamicVariable.queryId |
|||
queriesStore.select({ _id: queryId }) |
|||
$goto(`./${queryId}`) |
|||
} |
|||
|
|||
/** |
|||
* Add the query name to the dynamic variables |
|||
*/ |
|||
function enrichDynamicVariables(ds, possibleQueries) { |
|||
dynamicVariables = [] |
|||
ds.config.dynamicVariables?.forEach(dv => { |
|||
const query = possibleQueries.find(query => query._id === dv.queryId) |
|||
if (query) { |
|||
dynamicVariables.push({ ...dv, query: query.name }) |
|||
} |
|||
}) |
|||
} |
|||
</script> |
|||
|
|||
{#if dynamicVariables && dynamicVariables.length > 0} |
|||
<Table |
|||
on:click={({ detail }) => onClick(detail)} |
|||
schema={dynamicVariableSchema} |
|||
data={dynamicVariables} |
|||
allowEditColumns={false} |
|||
allowEditRows={false} |
|||
allowSelectRows={false} |
|||
customRenderers={[ |
|||
{ column: "name", component: BoldRenderer }, |
|||
{ column: "value", component: CodeRenderer }, |
|||
]} |
|||
/> |
|||
{:else} |
|||
<Body size="S"><i>No dynamic variables specified.</i></Body> |
|||
{/if} |
|||
@ -0,0 +1,54 @@ |
|||
<script> |
|||
import { Input, ModalContent, Modal, Body } from "@budibase/bbui" |
|||
|
|||
export let dynamicVariables |
|||
export let datasource |
|||
export let binding |
|||
|
|||
let name, modal, valid, allVariableNames |
|||
|
|||
export const show = () => { |
|||
modal.show() |
|||
} |
|||
export const hide = () => { |
|||
modal.hide() |
|||
} |
|||
|
|||
function checkValid(vars, name) { |
|||
if (!name) { |
|||
return false |
|||
} |
|||
return !allVariableNames.find( |
|||
varName => varName.toLowerCase() === name.toLowerCase() |
|||
) |
|||
} |
|||
|
|||
$: valid = checkValid(dynamicVariables, name) |
|||
$: allVariableNames = (datasource?.config?.dynamicVariables || []).map( |
|||
variable => variable.name |
|||
) |
|||
$: error = name && !valid ? "Variable name is already in use." : null |
|||
|
|||
async function saveVariable() { |
|||
const copiedName = name, |
|||
copiedBinding = binding |
|||
name = null |
|||
binding = null |
|||
dynamicVariables[copiedName] = copiedBinding |
|||
} |
|||
</script> |
|||
|
|||
<Modal bind:this={modal}> |
|||
<ModalContent |
|||
title="Add dynamic variable" |
|||
confirmText="Save" |
|||
onConfirm={saveVariable} |
|||
disabled={!valid} |
|||
> |
|||
<Body size="S" |
|||
>Specify a name for your new dynamic variable, this must be unique across |
|||
your datasource.</Body |
|||
> |
|||
<Input label="Variable name" bind:value={name} on:input {error} /> |
|||
</ModalContent> |
|||
</Modal> |
|||
File diff suppressed because it is too large
Loading…
Reference in new issue