create record wip
This commit is contained in:
@@ -0,0 +1,128 @@
|
||||
<script>
|
||||
import { post } from "../../modules/remote";
|
||||
import { getApp } from "../../app";
|
||||
|
||||
// import Tools from "./tools/Tools.svelte";
|
||||
// import Pagination from "./pagination/Pagination.svelte";
|
||||
// import ActionsOnSelected from "./ActionsOnSelected.svelte";
|
||||
// import Table from "./Table.svelte";
|
||||
let { channel, data } = $props();
|
||||
let newRecordName = $state("");
|
||||
const app = getApp();
|
||||
// export let schema;
|
||||
// export let users;
|
||||
// export let records;
|
||||
// export let graph;
|
||||
// // export let visibleFields;
|
||||
// export let systemFields;
|
||||
// export let sortParam;
|
||||
// export let sortField;
|
||||
// export let operators;
|
||||
// export let filter;
|
||||
// export let limit;
|
||||
// export let skip;
|
||||
// export let total;
|
||||
let inModal = false;
|
||||
// export let modalUrl;
|
||||
// export let selected = [];
|
||||
// export let isWritable = false;
|
||||
|
||||
// function refresh(e) {
|
||||
// const newUrl = e.detail;
|
||||
// axios
|
||||
// .get(newUrl)
|
||||
// .then((response) => {
|
||||
// records = response.data.records;
|
||||
// sortParam = response.data.sortParam;
|
||||
// sortField = response.data.sortField;
|
||||
// operators = response.data.operators;
|
||||
// filter = response.data.filter;
|
||||
// skip = response.data.skip;
|
||||
// limit = response.data.limit;
|
||||
// total = response.data.total;
|
||||
// modalUrl = response.data.modalUrl;
|
||||
// document.querySelector("dialog h3").scrollIntoView();
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.log(error);
|
||||
// });
|
||||
// }
|
||||
//
|
||||
|
||||
function handleRecordCreate(e) {
|
||||
e.preventDefault();
|
||||
post(
|
||||
channel.lucentUrl + "/records",
|
||||
{
|
||||
schemaId: data.schema.id,
|
||||
title: newRecordName,
|
||||
},
|
||||
(data, err) => {
|
||||
if (err.isEmpty()) {
|
||||
Turbo.visit(app.url("records/" + data.id));
|
||||
}
|
||||
},
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="">
|
||||
<div class={inModal ? "mt-0" : "mt-5"}>
|
||||
<h3 class="header-normal mb-5">
|
||||
{data.schema.name}
|
||||
</h3>
|
||||
<details style="max-width: 400px;">
|
||||
<summary>New Record</summary>
|
||||
<form onsubmit={handleRecordCreate}>
|
||||
<fieldset>
|
||||
<input
|
||||
bind:value={newRecordName}
|
||||
placeholder="Record title"
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
<button type="submit">Create</button>
|
||||
</form>
|
||||
</details>
|
||||
<!-- {#if selected.length > 0 && !inModal && isWritable}
|
||||
<ActionsOnSelected {schema} {selected} {filter}/>
|
||||
{:else}
|
||||
<Tools
|
||||
bind:schema
|
||||
bind:records
|
||||
{systemFields}
|
||||
{sortParam}
|
||||
{sortField}
|
||||
{operators}
|
||||
{filter}
|
||||
{graph}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
{isWritable}
|
||||
on:refresh={refresh}
|
||||
/>
|
||||
{/if}
|
||||
|
||||
<Table
|
||||
{records}
|
||||
{graph}
|
||||
{schema}
|
||||
{sortParam}
|
||||
{sortField}
|
||||
{systemFields}
|
||||
{inModal}
|
||||
{users}
|
||||
{isWritable}
|
||||
bind:selected
|
||||
/> -->
|
||||
</div>
|
||||
<!--
|
||||
<Pagination
|
||||
{limit}
|
||||
{skip}
|
||||
{total}
|
||||
on:refresh={refresh}
|
||||
{inModal}
|
||||
{modalUrl}
|
||||
/> -->
|
||||
</div>
|
||||
@@ -48,6 +48,14 @@
|
||||
Edit <em>{data.field.type}</em> field {data.field.name}
|
||||
</h3>
|
||||
|
||||
{#if data.field.alias == "_title"}
|
||||
{@render titleField()}
|
||||
{:else}
|
||||
{@render normalfield()}
|
||||
{/if}
|
||||
{/snippet}
|
||||
|
||||
{#snippet normalfield()}
|
||||
<form onsubmit={handleUpdate}>
|
||||
<fieldset>
|
||||
<label>
|
||||
@@ -74,6 +82,14 @@
|
||||
Developers will use this to reference the field
|
||||
</small>
|
||||
</label>
|
||||
<label>
|
||||
<input
|
||||
bind:checked={data.field.translatable}
|
||||
type="checkbox"
|
||||
role="switch"
|
||||
/>
|
||||
Is Translatable
|
||||
</label>
|
||||
</fieldset>
|
||||
|
||||
{#if data.field.type === "text"}
|
||||
@@ -88,3 +104,20 @@
|
||||
{/snippet}
|
||||
</DeleteButton>
|
||||
{/snippet}
|
||||
|
||||
{#snippet titleField()}
|
||||
<form onsubmit={handleUpdate}>
|
||||
<fieldset>
|
||||
<label>
|
||||
<input
|
||||
bind:checked={data.field.translatable}
|
||||
type="checkbox"
|
||||
role="switch"
|
||||
/>
|
||||
Is Translatable
|
||||
</label>
|
||||
</fieldset>
|
||||
|
||||
<button type="submit">Update</button>
|
||||
</form>
|
||||
{/snippet}
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
<script>
|
||||
import AccountLayout from "../../layouts/AccountLayout.svelte";
|
||||
import Step from "./Step.svelte";
|
||||
let { channel, data } = $props();
|
||||
</script>
|
||||
|
||||
<AccountLayout {body} {channel}></AccountLayout>
|
||||
{#snippet body()}
|
||||
<div class="wrapper-tiny">
|
||||
{#each data.steps as step}
|
||||
<Step {step}></Step>
|
||||
{/each}
|
||||
|
||||
<div style="text-align: center;margin-top: 30px;">
|
||||
{#if data.allSuccess}
|
||||
<a href="/lucent/register" class="bt">Create the first user</a>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/snippet}
|
||||
@@ -0,0 +1,61 @@
|
||||
<script>
|
||||
import Icon from "../../common/Icon.svelte";
|
||||
|
||||
let { step } = $props();
|
||||
</script>
|
||||
|
||||
<div class="step step-{step.status}">
|
||||
<div style="width:100%">
|
||||
<details>
|
||||
<summary>
|
||||
{#if step.status === "success"}
|
||||
<Icon icon="check"></Icon> {step.name}
|
||||
{:else}
|
||||
<Icon icon="close"></Icon> {step.name}
|
||||
{/if}
|
||||
</summary>
|
||||
<code class="instructions">{step.instructions}</code>
|
||||
</details>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.step-success .step-icon {
|
||||
background: var(--suc10);
|
||||
color: var(--suc100);
|
||||
}
|
||||
|
||||
.step-fail .step-icon {
|
||||
background: var(--err10);
|
||||
color: var(--err100);
|
||||
}
|
||||
|
||||
.step-icon {
|
||||
padding: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.step {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: start;
|
||||
gap: 10px;
|
||||
justify-content: space-between;
|
||||
|
||||
padding: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.instructions {
|
||||
margin-top: 20px;
|
||||
padding: 12px;
|
||||
border-radius: 12px;
|
||||
background: var(--p10);
|
||||
white-space: break-spaces;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user