direktil/local-server
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ui rework

Browse Source
This commit is contained in:
Mikaël Cluseau
2026-06-17 22:40:44 +02:00
parent f6b301c9a0
commit 38ad620759
20 changed files with 1016 additions and 553 deletions
Download Patch File Download Diff File Expand all files Collapse all files
html/ui/index.html
+32 -27
View File
@@ -10,32 +10,27 @@
<style>@import url('/ui/style.css');@import url('/ui/app.css');</style>
<script src="/ui/jsonpatch.min-942279a1c4209cc2.js" integrity="sha384-GcPrkRS12jtrElEkbJcrZ8asvvb9s3mc+CUq9UW/8bL4L0bpkmh9M+oFnWN6qLq2"></script>
<script src="/ui/app-e7fb26679b9aa0f2.js" defer integrity="sha384-4oRQalb7IIBcqQzfDkeCj53qYOP6dLsTwqcjnm3EiBa92oNDD3chUw38W2gEC+3p" type="module"></script>
<script src="/ui/Downloads-25b2e1f4aeaaff61.js" integrity="sha384-MP2lefUuPRss5MQ11H5SzGp8Gmy+hPAdeEC79h4c/SDAp4qFGUjhxBtQL8rnP38U"></script>
<script src="/ui/GetCopy-7e3c9678f9647d40.js" integrity="sha384-LzxUXylxE/t25HyTch8y2qvKcehvP2nqCo37swIBGEKZZUzHVJVQrS5UJDWNskTA"></script>
<script src="/ui/ClusterAccess-e67af72c976d642c.js" integrity="sha384-QU0xM0hvd7tVSJ42IVfmL0u0uJbzyZBrxn1vVbOh/15Xa80JK9j9VieoACGYFjx2"></script>
<script src="/ui/ClusterCAs-d6eba07c367b6306.js" integrity="sha384-2zV1VzNHw7hUS6SNIqDzIczma3Ixp3G9u6BJI4MtGHK4rNYWeCOOu9kttsZzkPYC"></script>
<script src="/ui/Cluster-361bc6b76a062d88.js" integrity="sha384-msh65M8IktAuqPyO5c7GFLkRYTtN2wh5KN23SDNuC5m1gwPpuiEeY4qkr9g1bCi1"></script>
<script src="/ui/app-4f0c6935250753e9.js" defer integrity="sha384-SrAfGs5pnGcgL5E78t2MszNYmdkGME9yPgtPsDg61Rljw+dfiP+rabjPnrMkWDUH" type="module"></script>
<script src="/ui/Downloads-3c8cba0572aebfae.js" integrity="sha384-Pof/sPwhdqKGp7NUmYkDc0pSSyACabwLjkRRylZKHxRmiHBV3SGomPUMAWG9y7Ix"></script>
<script src="/ui/GetCopy-2e04b7b63750e25a.js" integrity="sha384-sNvTYXhjog3BkYL20RzrUWIG9VGyHNO8oEiP5oxL5f2WKmLj/03fdR79FgHfzlj+"></script>
<script src="/ui/ClusterAccess-8b4165435ba4fcac.js" integrity="sha384-C1mVnhsaxmn3Dpp1vtcBuctxxXI1Rlh+qmxicCIpNv7ukyTbB524pg0ZwhvAnfH7"></script>
<script src="/ui/ClusterCAs-4f0a381bfb0c1b88.js" integrity="sha384-QcSHKzEHNSCqyjFELXfYFAdfmIZZwJHDzPqI2prH47jHrkeomJD60rcEMLkVAO3o"></script>
<script src="/ui/Cluster-34a012ee0910827c.js" integrity="sha384-Q0sXP0WFJu4gHOI/8NMOGwpJvvFDNBR3T/vDCYxCWL2szAu4+sQuwHm81Jcad/ve"></script>
<script src="/ui/Host-61916516a854adff.js" integrity="sha384-/wh3KrC0sb4MT7ekO2U84rswxI42WSH/0jB4dbDaaGaGhX60xTEZHFsdQAf7UgTG"></script>
<body>
<div id="app">
<header>
<div id="logo">
<img src="favicon.ico" />
<span>Direktil Local Server</span>
</div>
<div class="utils">
<span id="logo"><img src="favicon.ico" /> Direktil Local Server</span>
<span class="utils">
<span id="login-hdr" v-if="session.token">
Logged in
<button class="link" @click="copyText(session.token)">&#x1F5D0;</button>
</span>
<span>server <code>{{ serverVersion || '-----' }}</code></span>
<span>ui <code>{{ uiHash || '-----' }}</code></span>
<span :class="publicState ? 'green' : 'red'">&#x1F5F2;</span>
</div>
</span>
</header>
<div class="error" v-if="error">
@@ -44,11 +39,13 @@
<div class="message">{{ error.message }}</div>
</div>
<template v-if="!publicState">
<p>Not connected.</p>
</template>
<div class="toasts"><div v-for="t in toasts" :class="'toast '+t.kind" @click="dismissToast(t.id)">{{ t.message }}</div></div>
<template v-else-if="publicState.Store.New">
<main class="content" v-if="!publicState">
<p>Not connected.</p>
</main>
<main class="content" v-else-if="publicState.Store.New">
<p>Store is new.</p>
<p>Option 1: initialize a new store</p>
<form @submit="unlockStore">
@@ -62,17 +59,17 @@
<input type="file" ref="storeUpload" />
<input type="submit" value="upload" />
</form>
</template>
</main>
<template v-else-if="!publicState.Store.Open">
<main class="content" v-else-if="!publicState.Store.Open">
<p>Store is not open.</p>
<form @submit="unlockStore">
<input type="password" name="passphrase" v-model="forms.store.pass1" required placeholder="Passphrase" />
<input type="submit" value="unlock" :disabled="!forms.store.pass1" />
</form>
</template>
</main>
<template v-else-if="!state">
<main class="content" v-else-if="!state">
<p v-if="!session.token">Not logged in.</p>
<p v-else>Invalid token</p>
@@ -80,13 +77,20 @@
<input type="password" v-model="forms.store.pass1" required placeholder="Passphrase" />
<input type="submit" value="log in"/>
</form>
</template>
</main>
<template v-else>
<div style="float:right;"><input type="search" placeholder="Filter" v-model="viewFilter"/></div>
<p class="view-links"><span v-for="v in views" @click="view = v" :class="{selected: view.type==v.type && view.name==v.name}">{{v.title}}</span></p>
<h2 v-if="view">{{view.title}}</h2>
<nav class="sidebar">
<input type="search" placeholder="Filter" v-model="viewFilter"/>
<p class="nav-section">Admin</p>
<p class="view-links"><button type="button" v-for="v in adminViews" @click="view = v" :class="{selected: isActive(v)}">{{v.title}}</button></p>
<p class="nav-section" v-if="clusterViews.length">Clusters</p>
<p class="view-links" v-if="clusterViews.length"><button type="button" v-for="v in clusterViews" @click="view = v" :class="{selected: isActive(v)}">{{v.title}}</button></p>
<p class="nav-section" v-if="hostViews.length">Hosts</p>
<p class="view-links" v-if="hostViews.length"><button type="button" v-for="v in hostViews" @click="view = v" :class="{selected: isActive(v)}">{{v.title}}</button></p>
</nav>
<main class="content">
<h2 v-if="view">{{ view.type == 'cluster' ? 'Cluster ' : view.type == 'host' ? 'Host ' : '' }}{{view.title}}</h2>
<div v-if="view.type == 'cluster'" id="clusters">
<Cluster :cluster="viewObj" :token="session.token" :state="state" />
@@ -147,6 +151,7 @@
</form>
</template>
</div>
</main>
</template>
</div>
</body>