lucent/lucent-laravel
2
0
Fork 0
Code Issues 14 Pull Requests Releases 1 Activity

sveltel fixes

Browse Source
This commit is contained in:
Alex Lingris
2023-10-06 18:47:50 +03:00
parent 9bbe5ee9b4
commit 0eaf410090
28 changed files with 361 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/js/svelte/records/ContentTabs.svelte
-2
View File
@@ -1,7 +1,5 @@
<script>
export let recordGraph;
export let record;
export let schema;
export let isCreateMode;
export let active = "";
front/js/svelte/records/Edit.svelte
-4
View File
@@ -14,7 +14,6 @@
const channel = getContext("channel");
export let schema;
export let title;
export let record;
export let graph = {
records: [],
@@ -25,7 +24,6 @@
export let users;
let originalContent;
let activeContentTab = "";
let recordGraph = null;
$: hasUnsavedData = false;
$: validationErrors = null;
$: errorMessage = validationErrors
@@ -202,8 +200,6 @@
{schema}
{isCreateMode}
bind:active={activeContentTab}
{record}
bind:recordGraph
/>
{#if !["_graph", "_info"].includes(activeContentTab)}
<FilePreview {record} {schema}/>
front/js/svelte/records/FormField.svelte
+10 -1
View File
@@ -1,5 +1,6 @@
<script>
import Text from "./elements/Text.svelte";
import Slug from "./elements/Slug.svelte";
import Reference from "./elements/Reference.svelte";
import ReferenceInline from "./elements/ReferenceInline.svelte";
import Block from "./block/Block.svelte";
@@ -19,6 +20,7 @@
const formElements = {
text: Text,
slug: Slug,
textarea: Textarea,
rich: RichEditor,
color: Color,
@@ -56,7 +58,6 @@
<ReferenceTable
bind:graph
{record}
{schema}
{field}
{validationErrors}
/>
@@ -87,6 +88,14 @@
{validationErrors}
{isCreateMode}
/>
{:else if field.info.name === "slug"}
<Slug
bind:value={data[field.name]}
{field}
{id}
{validationErrors}
{isCreateMode}
/>
{:else if field.info.name === "textarea"}
<Textarea
bind:value={data[field.name]}
front/js/svelte/records/Info.svelte
-5
View File
@@ -227,11 +227,6 @@
display: inline-block;
}
td {
vertical-align: inherit;
white-space: normal;
max-width: none;
}
.active {
background-color: #eee;
front/js/svelte/records/elements/Datalist.svelte
+8 -1
View File
@@ -36,7 +36,10 @@
{#if field.optionsFrom}
{#each options as option (option.id)}
<div on:click={(e) => select(e, option)}>
<div
on:click={(e) => select(e, option)}
on:keypress={(e) => select(e, option)}
>
<span class="dropdown-item">
{previewTitle(channel.schemas, option)}
<small class="text-muted "
@@ -51,6 +54,10 @@
value = search;
search = "";
}}
on:keypress={(e) => {
value = search;
search = "";
}}
>
<span class="dropdown-item">
Add "{search}"
front/js/svelte/records/elements/Date.svelte
-1
View File
@@ -58,7 +58,6 @@
placeholder="Search for options"
data-bs-toggle="dropdown"
autocomplete="off"
aria-expanded="false"
readonly={field.readonly && !isCreateMode}
/>
<button
front/js/svelte/records/elements/Datetime.svelte
-2
View File
@@ -9,7 +9,6 @@
export let field;
export let value;
export let schema;
export let isCreateMode;
export let validationErrors;
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
@@ -65,7 +64,6 @@
placeholder="Search for options"
data-bs-toggle="dropdown"
autocomplete="off"
aria-expanded="false"
readonly={field.readonly && !isCreateMode}
/>
<button
front/js/svelte/records/elements/Number.svelte
-1
View File
@@ -41,7 +41,6 @@
class:is-invalid={errorMessage}
data-bs-toggle="dropdown"
autocomplete="off"
aria-expanded="false"
readonly={field.readonly && !isCreateMode}
/>
front/js/svelte/records/elements/ReferenceTable.svelte
-2
View File
@@ -14,8 +14,6 @@
export let record;
export let graph;
export let schema;
export let children;
export let validationErrors;
$: errorMessage = getErrorMessage(validationErrors, field.name);
front/js/svelte/records/elements/Selectlist.svelte
+23
View File
@@ -0,0 +1,23 @@
<script>
export let field;
export let value;
export let search;
function select(e, option) {
e.preventDefault();
value = option;
search = "";
}
</script>
{#if field.selectOptions}
{#each field.selectOptions as suggestion (suggestion)}
<div
on:click={(e) => select(e, suggestion)}
on:keypress={(e) => select(e, suggestion)}
>
<span class="dropdown-item">
{suggestion}
</span>
</div>
{/each}
{/if}
front/js/svelte/records/elements/Slug.svelte
+30
View File
@@ -0,0 +1,30 @@
<script>
import { getErrorMessage } from "./errorMessage";
export let field;
export let value;
export let isCreateMode;
export let validationErrors;
let thisEl;
$: errorMessage = getErrorMessage(validationErrors, field.name);
export let id;
</script>
<div class="mb-0">
<input
type="text"
{id}
class="form-control"
class:is-invalid={errorMessage}
bind:value
autocomplete="off"
readonly={field.readonly && !isCreateMode}
/>
{#if errorMessage}
<div class="invalid-feedback d-block">
{errorMessage}
</div>
{/if}
</div>
front/js/svelte/records/elements/Text.svelte
+41 -1
View File
@@ -1,5 +1,6 @@
<script>
import Datalist from "./Datalist.svelte";
import Selectlist from "./Selectlist.svelte";
import {getErrorMessage} from "./errorMessage";
export let field;
@@ -13,6 +14,10 @@
let list;
$: listMode = field.optionsFrom && !(field.readonly && !isCreateMode);
</script>
<div class="mb-0">
@@ -29,7 +34,6 @@
placeholder="Search for options"
data-bs-toggle="dropdown"
autocomplete="off"
aria-expanded="false"
readonly={field.readonly && !isCreateMode}
/>
@@ -58,6 +62,42 @@
</div>
</span>
{/if}
{:else if field.selectOptions}
<div class="dropdown">
<input
type="search"
{id}
class="form-control dropdown-toggle"
class:is-invalid={errorMessage}
bind:value={search}
placeholder="Search for options"
data-bs-toggle="dropdown"
autocomplete="off"
readonly={field.readonly && !isCreateMode}
/>
<div class="dropdown-menu w-100">
<Selectlist
{field}
bind:value
bind:search
/>
</div>
</div>
{#if value}
<span class="badge rounded-pill bg-light text-dark fs-6 mt-3">
<div class="d-flex align-items-center ">
{value}
<button
on:click|preventDefault={(e) => (value = "")}
type="button"
class="btn-close btn-sm ms-1"
style="font-size:10px"
aria-label="Close"
/>
</div>
</span>
{/if}
{:else}
<input
type="text"