codemirror insert
This commit is contained in:
@@ -1,10 +1,10 @@
|
|||||||
<script>
|
<script>
|
||||||
|
|
||||||
// https://codesandbox.io/s/codemirror-remark-editor-4m4z9?file=/src/CodeEditor.js:374-387
|
// https://codesandbox.io/s/codemirror-remark-editor-4m4z9?file=/src/CodeEditor.js:374-387
|
||||||
import {onMount, onDestroy} from "svelte";
|
import {onDestroy, onMount} from "svelte";
|
||||||
import {basicSetup, EditorView} from "codemirror";
|
import {basicSetup, EditorView} from "codemirror";
|
||||||
import { autocompletion, completionKeymap } from "@codemirror/autocomplete";
|
import {autocompletion, completionKeymap} from "@codemirror/autocomplete";
|
||||||
import {EditorState, Compartment} from "@codemirror/state";
|
import {Compartment, EditorState} from "@codemirror/state";
|
||||||
import {keymap} from "@codemirror/view";
|
import {keymap} from "@codemirror/view";
|
||||||
import {indentWithTab} from "@codemirror/commands";
|
import {indentWithTab} from "@codemirror/commands";
|
||||||
import {markdown} from "@codemirror/lang-markdown";
|
import {markdown} from "@codemirror/lang-markdown";
|
||||||
@@ -15,6 +15,30 @@
|
|||||||
export let value;
|
export let value;
|
||||||
export let editable = true;
|
export let editable = true;
|
||||||
|
|
||||||
|
export function insertMedia(info) {
|
||||||
|
|
||||||
|
let insertText = "";
|
||||||
|
if (info.record._file.width > 0) {
|
||||||
|
insertText = ``;
|
||||||
|
} else {
|
||||||
|
insertText = `[${info.record._file.originalName}](${info.originalUrl})`;
|
||||||
|
}
|
||||||
|
const cursor = codeMirrorView.state.selection.main.head;
|
||||||
|
const transaction = codeMirrorView.state.update({
|
||||||
|
changes: {
|
||||||
|
from: cursor,
|
||||||
|
insert: insertText,
|
||||||
|
},
|
||||||
|
// the next 2 lines will set the appropriate cursor position after inserting the new text.
|
||||||
|
selection: {anchor: cursor + 1},
|
||||||
|
scrollIntoView: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (transaction) {
|
||||||
|
codeMirrorView.dispatch(transaction);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
let language = new Compartment();
|
let language = new Compartment();
|
||||||
let tabSize = new Compartment();
|
let tabSize = new Compartment();
|
||||||
@@ -51,7 +75,6 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
onDestroy(() => {
|
onDestroy(() => {
|
||||||
|
|||||||
@@ -98,6 +98,16 @@
|
|||||||
bind:graph
|
bind:graph
|
||||||
{record}
|
{record}
|
||||||
/>
|
/>
|
||||||
|
{:else if field.info.name === "markdown"}
|
||||||
|
<Markdown
|
||||||
|
bind:value={data[field.name]}
|
||||||
|
{schema}
|
||||||
|
{field}
|
||||||
|
{validationErrors}
|
||||||
|
{isCreateMode}
|
||||||
|
bind:graph
|
||||||
|
{record}
|
||||||
|
/>
|
||||||
{:else}
|
{:else}
|
||||||
<svelte:component
|
<svelte:component
|
||||||
this={formElement}
|
this={formElement}
|
||||||
|
|||||||
@@ -1,21 +1,37 @@
|
|||||||
<script>
|
<script>
|
||||||
import Codemirror from "../../libs/CodemirrorMarkdown.svelte";
|
import Codemirror from "../../libs/CodemirrorMarkdown.svelte";
|
||||||
import { getErrorMessage } from "./errorMessage";
|
import { getErrorMessage } from "./errorMessage";
|
||||||
|
import RichEditorFiles from "./RichEditorFiles.svelte";
|
||||||
|
|
||||||
|
|
||||||
export let value;
|
export let value;
|
||||||
export let field;
|
export let field;
|
||||||
|
export let graph;
|
||||||
|
export let record;
|
||||||
export let isCreateMode;
|
export let isCreateMode;
|
||||||
// export let id;
|
// export let id;
|
||||||
export let validationErrors;
|
export let validationErrors;
|
||||||
$: errorMessage = getErrorMessage(validationErrors, field.name);
|
$: errorMessage = getErrorMessage(validationErrors, field.name);
|
||||||
|
let editor;
|
||||||
|
|
||||||
|
function insertMedia(e){
|
||||||
|
editor.insertMedia(e.detail)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
|
|
||||||
<Codemirror bind:value editable={!field.readonly || isCreateMode} />
|
<Codemirror bind:this={editor} bind:value editable={!field.readonly || isCreateMode} />
|
||||||
|
{#if field.collections.length > 0}
|
||||||
|
<RichEditorFiles
|
||||||
|
bind:graph
|
||||||
|
{record}
|
||||||
|
{field}
|
||||||
|
{validationErrors}
|
||||||
|
on:editor-insert={insertMedia}
|
||||||
|
>
|
||||||
|
</RichEditorFiles>
|
||||||
|
{/if}
|
||||||
{#if errorMessage}
|
{#if errorMessage}
|
||||||
<div class="invalid-feedback d-block">
|
<div class="invalid-feedback d-block">
|
||||||
{errorMessage}
|
{errorMessage}
|
||||||
|
|||||||
@@ -27,7 +27,6 @@ class RecordController extends Controller
|
|||||||
public function __construct(
|
public function __construct(
|
||||||
private readonly RecordService $recordService,
|
private readonly RecordService $recordService,
|
||||||
private readonly AccountService $accountService,
|
private readonly AccountService $accountService,
|
||||||
private readonly AuthService $authService,
|
|
||||||
private readonly ChannelService $channelService,
|
private readonly ChannelService $channelService,
|
||||||
private readonly Svelte $svelte,
|
private readonly Svelte $svelte,
|
||||||
private readonly Query $query,
|
private readonly Query $query,
|
||||||
@@ -61,10 +60,12 @@ class RecordController extends Controller
|
|||||||
], $filter);
|
], $filter);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$skip = data_get($urlParams, "skip") ?? 0;
|
$skip = data_get($urlParams, "skip") ?? 0;
|
||||||
$limit = 30;
|
$limit = 30;
|
||||||
$records = [];
|
$records = [];
|
||||||
$graphArray = null;
|
$graphArray = null;
|
||||||
|
|
||||||
$graph = $this->query
|
$graph = $this->query
|
||||||
->filter($arguments)
|
->filter($arguments)
|
||||||
->notLinked($request->input("notlinked") ?? "")
|
->notLinked($request->input("notlinked") ?? "")
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ namespace Lucent\Query;
|
|||||||
|
|
||||||
use Illuminate\Contracts\Foundation\Application;
|
use Illuminate\Contracts\Foundation\Application;
|
||||||
use Illuminate\Database\Query\Builder;
|
use Illuminate\Database\Query\Builder;
|
||||||
|
use Illuminate\Support\Facades\DB;
|
||||||
use Lucent\Database\Database;
|
use Lucent\Database\Database;
|
||||||
use Lucent\Query\BuilderConverter\BuilderConverter;
|
use Lucent\Query\BuilderConverter\BuilderConverter;
|
||||||
use Lucent\Query\Filter\AndFilter;
|
use Lucent\Query\Filter\AndFilter;
|
||||||
|
|||||||
@@ -78,6 +78,7 @@ final class Query
|
|||||||
// ->toArray();
|
// ->toArray();
|
||||||
|
|
||||||
$formattedRecords = $this->formatRecords($resultsRecordsUnique, $resultChildrenEdges, $resultParentEdges);
|
$formattedRecords = $this->formatRecords($resultsRecordsUnique, $resultChildrenEdges, $resultParentEdges);
|
||||||
|
|
||||||
$this->reset();
|
$this->reset();
|
||||||
return $formattedRecords;
|
return $formattedRecords;
|
||||||
|
|
||||||
@@ -94,7 +95,9 @@ final class Query
|
|||||||
$queryRecords = collect($records)->map(function ($recordData) {
|
$queryRecords = collect($records)->map(function ($recordData) {
|
||||||
|
|
||||||
$record = Record::fromDB($recordData);
|
$record = Record::fromDB($recordData);
|
||||||
|
|
||||||
$record->data = $this->inputFormatter->fill($record->schema, $record->data);
|
$record->data = $this->inputFormatter->fill($record->schema, $record->data);
|
||||||
|
|
||||||
$queryRecord = QueryRecord::fromRecord($record);
|
$queryRecord = QueryRecord::fromRecord($record);
|
||||||
$queryRecord->isRoot = data_get($recordData, "isRoot") === true;
|
$queryRecord->isRoot = data_get($recordData, "isRoot") === true;
|
||||||
return $queryRecord;
|
return $queryRecord;
|
||||||
|
|||||||
@@ -16,8 +16,11 @@ class InputFormatter
|
|||||||
|
|
||||||
public function fill(string $schemaName, RecordData $input): RecordData
|
public function fill(string $schemaName, RecordData $input): RecordData
|
||||||
{
|
{
|
||||||
|
|
||||||
$schema = $this->channelService->getSchema($schemaName)->get();
|
$schema = $this->channelService->getSchema($schemaName)->get();
|
||||||
|
|
||||||
$data = $schema->fields->reduce(fn(array $carry, FieldInterface $field) => $field->format($input->toArray(), $carry), []);
|
$data = $schema->fields->reduce(fn(array $carry, FieldInterface $field) => $field->format($input->toArray(), $carry), []);
|
||||||
|
|
||||||
return new RecordData($data);
|
return new RecordData($data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -18,6 +18,7 @@ class Markdown implements FieldInterface, RequiredInterface
|
|||||||
public bool $required = false,
|
public bool $required = false,
|
||||||
public bool $nullable = false,
|
public bool $nullable = false,
|
||||||
public string $default = "",
|
public string $default = "",
|
||||||
|
public array $collections = [],
|
||||||
public string $help = "",
|
public string $help = "",
|
||||||
public ?int $min = null,
|
public ?int $min = null,
|
||||||
public ?int $max = null,
|
public ?int $max = null,
|
||||||
|
|||||||
Reference in New Issue
Block a user