lotus/curiosrc/web/static/config/index.html
Andrew Jackson (Ajax) 1a789d3acb
feat: curioweb: Improve UX, add top menu (#11901)
* cfg edit 1

* jsonschema deps

* feat: lp mig - first few steps

* lp mig: default tasks

* code comments

* docs

* lp-mig-progress

* shared

* comments and todos

* fix: curio: rename lotus-provider to curio (#11645)

* rename provider to curio

* install gotext

* fix lint errors, mod tidy

* fix typo

* fix API_INFO and add gotext to circleCI

* add back gotext

* add gotext after remerge

* lp: channels doc

* finish easy-migration TODOs

* out generate

* merging and more renames

* avoid make-all

* minor doc stuff

* cu: make gen

* make gen fix

* make gen

* tryfix

* go mod tidy

* minor ez migration fixes

* ez setup - ui cleanups

* better error message

* guided setup colors

* better path to saveconfigtolayer

* loadconfigwithupgrades fix

* readMiner oops

* guided - homedir

* err if miner is running

* prompt error should exit

* process already running, miner_id sectors in migration

* dont prompt for language a second time

* check miner stopped

* unlock repo

* render and sql oops

* curio easyMig - some fixes

* easyMigration runs successfully

* lint

* part 2 of last

* message

* merge addtl

* fixing guided setup for myself

* warn-on-no-post

* EditorLoads

* cleanups and styles

* create info

* fix tests

* make gen

* sector early bird

* sectors v2

* sector termination v1

* terminate2

* mjs

* minor things

* flag bad sectors

* fix errors

* add dealweight and deals

* change column width

* ui looking better

* cleanups

* fix pipeline page

* comments

* curioweb: Add missing sector info file

* curioweb: fix hapi root template

---------

Co-authored-by: LexLuthr <88259624+LexLuthr@users.noreply.github.com>
Co-authored-by: LexLuthr <lexluthr@protocol.ai>
Co-authored-by: LexLuthr <lexluthr@curiostorage.org>
Co-authored-by: Łukasz Magiera <magik6k@gmail.com>
2024-04-19 19:08:21 +04:00

97 lines
2.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Configuration Editor</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script type="module" src="/ux/curio-ux.mjs"></script>
</head>
<body style="visibility:hidden">
<!-- Get the machines -->
<script type="module">
import { LitElement, html, css } from 'https://cdn.jsdelivr.net/gh/lit/dist@3/all/lit-all.min.js';
window.customElements.define('config-list', class MyElement extends LitElement {
connectedCallback() {
super.connectedCallback();
}
constructor() {
super();
this.layers = [];
this.topo = [];
this.loadData();
this.message = this.readCookie('message');
this.eraseCookie('message');
}
static get styles() {
return [css`
.alert {
font-size: 24px;
display: inline-block;
color: green;
}
`];
}
render() {
return html`
${this.message ? html`<div class="alert">${this.message}</div>` : ''}
<table>
${this.layers.map((layer, index) => html`
<tr>
<td style="width: 50%"><a href="/config/edit.html?layer=${layer}"><button>${layer}</button></a></td>
<td>
Used By: ${(f=> f.length?f.map(topo => html`${topo.Server}`):'-')(
this.topo.filter(topo => topo.LayersCSV.split(",").includes(layer)))}
</td>
</tr>
`)}
</table>
`;
}
loadData() {
Promise.all([
axios.get('/api/config/layers'),
axios.get('/api/config/topo'),
axios.get('/api/config/default')
])
.then(responses => {
this.layers = responses[0].data;
this.layers.unshift('default');
this.topo = responses[1].data;
super.requestUpdate();
})
.catch(error => {
console.error('Error fetching data:', error);
});
}
readCookie(name) {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
if (cookie.startsWith(name + '=')) {
return cookie.substring(name.length + 1);
}
}
return '';
}
eraseCookie(name) {
document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
}
});
</script>
<curio-ux>
<div class="row">
<div class="col-md-3">
</div>
<div class="col-md-3" style="width: 70%">
<h1 style="text-wrap: none">Configuration Editor</h1>
<h3 style="text-wrap: none">Click on a layer to edit its configuration</h3>
<config-list></config-list>
</div>
<div class="col-md-3">
</div>
</div>
</curio-ux>
</body>
</html>