sveltel fixes

2023-10-06 18:47:50 +03:00
parent 9bbe5ee9b4
commit 0eaf410090
28 changed files with 361 additions and 218 deletions
@@ -1,14 +1,14 @@
 {
  "main.js": {
-    "file": "assets/main.aacd1b62.js",
+    "file": "assets/main.91253d73.js",
    "src": "main.js",
    "isEntry": true,
    "css": [
-      "assets/main.632850b9.css"
+      "assets/main.e0c13bde.css"
    ]
  },
  "main.css": {
-    "file": "assets/main.632850b9.css",
+    "file": "assets/main.e0c13bde.css",
    "src": "main.css"
  }
 }
@@ -21,7 +21,7 @@
    export let view;
    export let user;
    export let data;
-    export let layout;
+    // export let layout;
    export let channel;


@@ -7,13 +7,12 @@
    import {getContext} from "svelte";

    const channel = getContext("channel");
-    export let title;
    export let schema;
    export let users;
    export let records;
    export let graph;

-    export let visibleFields;
+    // export let visibleFields;
    export let systemFields;
    export let sort;
    export let operators;
@@ -14,6 +14,7 @@

    const renderElements = {
        text: Text,
+        slug: Text,
        rich: Rich,
        textarea: Text,
        color: Color,
@@ -1,6 +1,5 @@
 <script>
    export let value;
-    export let field;
 </script>
 <span
 class="badge rounded-pill bg-primary bg-opacity-75"
@@ -8,7 +8,7 @@
    export let value;
    export let inModal;
    export let modalUrl;
-    export let systemFields;
+    // export let systemFields;

    let filterSplit = key.split("_");
    let operator = filterSplit[filterSplit.length - 1] ?? "eq";
@@ -15,7 +15,7 @@
    export let modalUrl;
    export let records;
    export let systemFields = [];
-    export let visibleFields = [];
+    // export let visibleFields = [];

    let url = new URL(window.location.href);

@@ -8,7 +8,6 @@


    const channel = getContext("channel");
-    export let title;
    export let users;
    export let roles;
    let name;
@@ -1,7 +1,5 @@
 <script>

-    export let recordGraph;
-    export let record;
    export let schema;
    export let isCreateMode;
    export let active = "";
@@ -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}/>
@@ -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]}
@@ -227,11 +227,6 @@
        display: inline-block;
    }

-    td {
-        vertical-align: inherit;
-        white-space: normal;
-        max-width: none;
-    }

    .active {
        background-color: #eee;
@@ -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}"
@@ -58,7 +58,6 @@
                placeholder="Search for options"
                data-bs-toggle="dropdown"
                autocomplete="off"
-                aria-expanded="false"
                readonly={field.readonly && !isCreateMode}
            />
            <button
@@ -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
@@ -41,7 +41,6 @@
                class:is-invalid={errorMessage}
                data-bs-toggle="dropdown"
                autocomplete="off"
-                aria-expanded="false"
                readonly={field.readonly && !isCreateMode}
            />

@@ -14,8 +14,6 @@

    export let record;
    export let graph;
-    export let schema;
-    export let children;
    export let validationErrors;
    $: errorMessage = getErrorMessage(validationErrors, field.name);

@@ -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}
@@ -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>
+
@@ -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"
@@ -346,18 +346,18 @@ class RecordController extends Controller
        );
        return ok();
    }
-//
-//    public function delete(Request $request)
-//    {
-//        $ids = $request->input("ids");
-//
-//        try {
-//            $this->recordService->deleteMany($ids);
-//        } catch (Throwable $th) {
-//            return fail($th);
-//        }
-//        return ok();
-//    }
+
+    public function delete(Request $request)
+    {
+        $ids = $request->input("ids");
+
+        try {
+            $this->recordService->deleteMany($ids);
+        } catch (Throwable $th) {
+            return fail($th);
+        }
+        return ok();
+    }
 //
 //    public function rollback(Request $request)
 //    {
@@ -6,7 +6,9 @@ use Illuminate\Support\Facades\DB;

 class RecordRepo
 {
-
+    public function __construct()
+    {
+    }

    public static function create(Record $record): void
    {
@@ -36,7 +38,7 @@ class RecordRepo
    /**
     * @param string[] $ids
     */
-    public static function deleteMany(
+    public function deleteMany(
        array $ids,
    ): void
    {
@@ -27,7 +27,8 @@ readonly class RecordService
        private ChannelService  $channelService,
        private Validator       $recordValidator,
        private Query           $query,
-        private InputFormatter  $inputFormatter
+        private InputFormatter  $inputFormatter,
+        private RecordRepo      $recordRepo
    )
    {
    }
@@ -213,7 +214,7 @@ readonly class RecordService
        array $recordsIds,
    ): void
    {
-        RecordRepo::deleteMany($recordsIds);
+        $this->recordRepo->deleteMany($recordsIds);
    }


@@ -0,0 +1,49 @@
+<?php
+
+namespace Lucent\Schema\Ui;
+
+use Illuminate\Support\Str;
+use Lucent\Schema\FieldInfo;
+use Lucent\Schema\FieldInterface;
+use Lucent\Schema\FieldType;
+use Lucent\Schema\Nullable;
+use Lucent\Schema\Validator\RequiredInterface;
+
+class Slug implements FieldInterface, RequiredInterface
+{
+    public FieldInfo $info;
+
+    public function __construct(
+        public string $name,
+        public string $label,
+        public bool   $required = false,
+        public bool   $nullable = false,
+        public ?int   $min = null,
+        public ?int   $max = null,
+        public string $default = "",
+        public bool   $readonly = false,
+        public string $source = "",
+        public string $group = "",
+    )
+    {
+        $this->info = new FieldInfo("slug", "Slug", FieldType::STRING);
+    }
+
+    public function format(array $input, array $output): array
+    {
+        $value = $input[$this->name] ?? null;
+        if(empty($value)){
+            $value = Str::slug($input[$this->source]);
+        }
+
+        $output[$this->name] = (new Nullable($this->nullable, $value, ""))->value();
+        return $output;
+    }
+
+
+    public function failRequired(mixed $value): bool
+    {
+        return empty(trim($value));
+    }
+}
+
@@ -24,6 +24,7 @@ class Text implements FieldInterface, RequiredInterface
        public string $optionsFrom = "",
        public string $optionsField = "",
        public bool   $optionsSuggest = false,
+        public ?array $selectOptions = null,
        public string $group = "",
    )
    {