mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
feat: add overview
This commit is contained in:
@@ -78,11 +78,13 @@
|
||||
<div class="modal-content">
|
||||
<slot />
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<div class="u-flex u-main-end u-gap-12">
|
||||
<slot name="footer" />
|
||||
{#if $$slots.footer}
|
||||
<div class="modal-footer">
|
||||
<div class="u-flex u-main-end u-gap-12">
|
||||
<slot name="footer" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
+2
-6
@@ -1,7 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { Modal } from '$lib/components';
|
||||
import { option, options } from './attributes/store';
|
||||
import { Button, InputText, FormList } from '$lib/elements/forms';
|
||||
import { InputText, FormList } from '$lib/elements/forms';
|
||||
import type { Attributes } from './store';
|
||||
|
||||
export let showOverview = false;
|
||||
@@ -26,12 +26,8 @@
|
||||
disabled />
|
||||
|
||||
{#if selectedAttribute}
|
||||
<svelte:component this={$option.component} disabled={true} />
|
||||
<svelte:component this={$option.component} overview={true} {selectedAttribute} />
|
||||
{/if}
|
||||
</FormList>
|
||||
<svelte:fragment slot="footer">
|
||||
<Button secondary on:click={() => (showOverview = false)}>Cancel</Button>
|
||||
<Button submit>Create</Button>
|
||||
</svelte:fragment>
|
||||
</Modal>
|
||||
{/if}
|
||||
|
||||
+12
-6
@@ -4,14 +4,16 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let submitted = false;
|
||||
export let id: string;
|
||||
export let disabled = false;
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeBoolean;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
let def: boolean,
|
||||
let xdefault: boolean,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -22,7 +24,7 @@
|
||||
$collection.$id,
|
||||
id,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -37,8 +39,12 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} {disabled} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} {disabled} />
|
||||
<InputSwitch id="default" label="Default" bind:value={def} {disabled} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputSwitch id="default" label="Default" bind:value={xdefault} disabled={overview} />
|
||||
|
||||
+13
-5
@@ -4,10 +4,14 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
let def: string,
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeEmail;
|
||||
|
||||
let xdefault: string,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -19,7 +23,7 @@
|
||||
$collection.$id,
|
||||
id,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -34,8 +38,12 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} />
|
||||
<InputText id="default" label="Default" bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputText id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
+17
-6
@@ -4,10 +4,13 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
let def = '',
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeEnum;
|
||||
let xdefault = '',
|
||||
elements: string[],
|
||||
required = false,
|
||||
array = false;
|
||||
@@ -21,7 +24,7 @@
|
||||
id,
|
||||
elements,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -42,9 +45,17 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
$: if (overview) {
|
||||
({ required, array, elements, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputTags id="elements" label="Elements" bind:tags={elements} placeholder="Add elements here" />
|
||||
<InputSelect id="default" label="Default" bind:options bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} />
|
||||
<InputTags
|
||||
id="elements"
|
||||
label="Elements"
|
||||
bind:tags={elements}
|
||||
placeholder="Add elements here"
|
||||
readonly={overview} />
|
||||
<InputSelect id="default" label="Default" bind:options bind:value={xdefault} disabled={overview} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} disabled={overview} />
|
||||
|
||||
+14
-7
@@ -4,14 +4,17 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeFloat;
|
||||
let min: number,
|
||||
max: number,
|
||||
def: number,
|
||||
xdefault: number,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -24,7 +27,7 @@
|
||||
required,
|
||||
min,
|
||||
max,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -39,11 +42,15 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, min, max, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputNumber id="min" label="Min" bind:value={min} />
|
||||
<InputNumber id="max" label="Max" bind:value={max} />
|
||||
<InputNumber id="min" label="Min" bind:value={min} readonly={overview} />
|
||||
<InputNumber id="max" label="Max" bind:value={max} readonly={overview} />
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} />
|
||||
<InputNumber id="default" label="Default" bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputNumber id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
+16
-8
@@ -4,14 +4,17 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let id: string;
|
||||
export let id: string = null;
|
||||
export let submitted = false;
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeInteger;
|
||||
let min: number,
|
||||
max: number,
|
||||
def: number,
|
||||
xdefault: number,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -24,7 +27,7 @@
|
||||
required,
|
||||
min,
|
||||
max,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -39,11 +42,16 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
//TODO: fix xdefault
|
||||
({ required, array, min, max, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputNumber id="min" label="Min" bind:value={min} />
|
||||
<InputNumber id="max" label="Max" bind:value={max} />
|
||||
<InputNumber id="min" label="Min" bind:value={min} readonly={overview} />
|
||||
<InputNumber id="max" label="Max" bind:value={max} readonly={overview} />
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} />
|
||||
<InputNumber id="default" label="Default" bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="array" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputNumber id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
+12
-5
@@ -4,10 +4,13 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
let def: string,
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeIp;
|
||||
let xdefault: string,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -19,7 +22,7 @@
|
||||
$collection.$id,
|
||||
id,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -34,8 +37,12 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} />
|
||||
<InputText id="default" label="Default" bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputText id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
+13
-6
@@ -4,10 +4,13 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
let def: string,
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeString;
|
||||
let xdefault: string,
|
||||
size = 255,
|
||||
required = false,
|
||||
array = false;
|
||||
@@ -21,7 +24,7 @@
|
||||
id,
|
||||
size,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -36,9 +39,13 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, size, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputNumber id="size" label="Size" bind:value={size} required />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} />
|
||||
<InputText id="default" label="Default" bind:value={def} />
|
||||
<InputNumber id="size" label="Size" bind:value={size} required readonly={overview} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputText id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
+12
-5
@@ -4,10 +4,13 @@
|
||||
import { sdkForProject } from '$lib/stores/sdk';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import { collection } from '../store';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
|
||||
export let id: string;
|
||||
export let submitted = false;
|
||||
let def: string,
|
||||
export let overview = false;
|
||||
export let selectedAttribute: Models.AttributeUrl;
|
||||
let xdefault: string,
|
||||
required = false,
|
||||
array = false;
|
||||
|
||||
@@ -19,7 +22,7 @@
|
||||
$collection.$id,
|
||||
id,
|
||||
required,
|
||||
def ? def : undefined,
|
||||
xdefault ? xdefault : undefined,
|
||||
array
|
||||
);
|
||||
dispatch('created', attribute);
|
||||
@@ -34,8 +37,12 @@
|
||||
$: if (submitted) {
|
||||
submit();
|
||||
}
|
||||
|
||||
$: if (overview) {
|
||||
({ required, array, xdefault } = selectedAttribute);
|
||||
}
|
||||
</script>
|
||||
|
||||
<InputSwitch id="required" label="Required" bind:value={required} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} />
|
||||
<InputText id="default" label="Default" bind:value={def} />
|
||||
<InputSwitch id="required" label="Required" bind:value={required} disabled={overview} />
|
||||
<InputSwitch id="required" label="Array" bind:value={array} disabled={overview} />
|
||||
<InputText id="default" label="Default" bind:value={xdefault} readonly={overview} />
|
||||
|
||||
Reference in New Issue
Block a user