mirror of
https://github.com/garraflavatra/rolens.git
synced 2025-07-19 14:14:05 +00:00
Index creation
This commit is contained in:
@ -0,0 +1,134 @@
|
||||
<script>
|
||||
import Icon from '../../../components/icon.svelte';
|
||||
import { input } from '../../../actions';
|
||||
import Modal from '../../../components/modal.svelte';
|
||||
import { CreateIndex } from '../../../../wailsjs/go/app/App';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
|
||||
export let collection = {};
|
||||
export let creatingNewIndex = false;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
let index = { model: [] };
|
||||
|
||||
function addRule() {
|
||||
index.model = [ ...index.model, {} ];
|
||||
}
|
||||
|
||||
function removeRule(ruleIndex) {
|
||||
index.model.splice(ruleIndex, 1);
|
||||
index.model = index.model;
|
||||
}
|
||||
|
||||
async function create() {
|
||||
const newIndexName = await CreateIndex(collection.hostKey, collection.dbKey, collection.key, JSON.stringify(index));
|
||||
if (newIndexName) {
|
||||
creatingNewIndex = false;
|
||||
index = { model: [] };
|
||||
dispatch('reload');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<Modal title="Create new index {collection ? `on collection ${collection.key}` : ''}" bind:show={creatingNewIndex}>
|
||||
<form on:submit|preventDefault={create}>
|
||||
<label class="field name">
|
||||
<span class="label">Name</span>
|
||||
<input type="text" placeholder="Optional" bind:value={index.name} use:input={{ autofocus: true }} />
|
||||
</label>
|
||||
|
||||
<div class="toggles">
|
||||
<label class="field">
|
||||
<span class="label">Background (legacy)</span>
|
||||
<span class="checkbox">
|
||||
<input type="checkbox" bind:checked={index.background} />
|
||||
</span>
|
||||
</label>
|
||||
<label class="field">
|
||||
<span class="label">Unique</span>
|
||||
<span class="checkbox">
|
||||
<input type="checkbox" bind:checked={index.unique} />
|
||||
</span>
|
||||
</label>
|
||||
<!-- <label class="field">
|
||||
<span class="label">Drop duplicates</span>
|
||||
<span class="checkbox">
|
||||
<input type="checkbox" bind:checked={index.dropDuplicates} />
|
||||
</span>
|
||||
</label> -->
|
||||
<label class="field">
|
||||
<span class="label">Sparse</span>
|
||||
<span class="checkbox">
|
||||
<input type="checkbox" bind:checked={index.sparse} />
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="model">
|
||||
{#each index.model as rule, ruleIndex}
|
||||
<div class="row">
|
||||
<label class="field">
|
||||
<span class="label">Key</span>
|
||||
<input type="text" placeholder="_id" bind:value={rule.key}>
|
||||
</label>
|
||||
<label class="field">
|
||||
<select bind:value={rule.sort}>
|
||||
<option value={1}>Ascending</option>
|
||||
<option value={-1}>Decending</option>
|
||||
<option value="hashed" disabled={index.model.length > 1}>Hashed</option>
|
||||
</select>
|
||||
</label>
|
||||
<button type="button" class="btn danger" on:click={() => removeRule(ruleIndex)} disabled={index.model.length < 2}>
|
||||
<Icon name="-" />
|
||||
</button>
|
||||
</div>
|
||||
{:else}
|
||||
No rules
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<div class="buttons">
|
||||
<button class="btn" type="button" on:click={addRule} disabled={index.model.some(r => r.sort === 'hashed')}>
|
||||
<Icon name="+" /> Add rule
|
||||
</button>
|
||||
<button class="btn" type="submit" disabled={!index.model.length || index.model.some(r => !r.key)}>
|
||||
<Icon name="+" /> Create index
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</Modal>
|
||||
|
||||
<style>
|
||||
.field.name {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.toggles {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.model {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
.model .row {
|
||||
display: grid;
|
||||
grid-template: 1fr / 1fr auto auto;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.buttons button[type="submit"] {
|
||||
margin-left: auto;
|
||||
}
|
||||
</style>
|
@ -3,12 +3,14 @@
|
||||
import ObjectGrid from '../../../components/objectgrid.svelte';
|
||||
import { DropIndex, GetIndexes } from '../../../../wailsjs/go/app/App';
|
||||
import Icon from '../../../components/icon.svelte';
|
||||
import IndexDetail from './indexes-detail.svelte';
|
||||
|
||||
export let collection;
|
||||
|
||||
let indexes = [];
|
||||
let activePath = [];
|
||||
let objectViewerData = '';
|
||||
let creatingNewIndex = false;
|
||||
|
||||
$: collection && getIndexes();
|
||||
|
||||
@ -19,6 +21,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
function createIndex() {
|
||||
creatingNewIndex = true;
|
||||
}
|
||||
|
||||
async function drop(key) {
|
||||
if (typeof key !== 'string') {
|
||||
key = activePath[0];
|
||||
@ -41,7 +47,7 @@
|
||||
<button class="btn" on:click={getIndexes}>
|
||||
<Icon name="reload" /> Reload
|
||||
</button>
|
||||
<button class="btn">
|
||||
<button class="btn" on:click={createIndex}>
|
||||
<Icon name="+" /> Create index…
|
||||
</button>
|
||||
<button class="btn danger" on:click={drop} disabled={!indexes?.length || !activePath[0]}>
|
||||
@ -61,6 +67,7 @@
|
||||
</div>
|
||||
|
||||
<ObjectViewer bind:data={objectViewerData} />
|
||||
<IndexDetail bind:creatingNewIndex {collection} on:reload={getIndexes} />
|
||||
|
||||
<style>
|
||||
.indexes {
|
||||
|
Reference in New Issue
Block a user