Add descriptions for rotues and redirects

This commit is contained in:
Melon 2023-10-28 22:44:18 +01:00
parent 1315a8912b
commit e4c2563811
Signed by: melon
GPG Key ID: 6C9D970C50D26A25
7 changed files with 36 additions and 6 deletions

View File

@ -4,19 +4,22 @@
import Flags from "./Flags.svelte";
const dispatch = createEventDispatcher();
let redirect: Redirect = {src: "", dst: "", flags: 0, active: true};
let redirect: Redirect = {src: "", dst: "", desc: "", flags: 0, active: true};
const descCols = 50;
</script>
<tr class="created">
<td><input type="text" class="code-font" bind:value={redirect.src} size={Math.max(20, redirect.src.length + 2)} /></td>
<td><input type="text" class="code-font" bind:value={redirect.dst} size={Math.max(20, redirect.dst.length + 2)} /></td>
<td><Flags value={redirect.flags} editable keys={redirectKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} bind:value={redirect.desc} /></td>
<td><input type="checkbox" bind:checked={redirect.active} /></td>
<td>
<button
on:click={() => {
dispatch("make", redirect);
redirect = {src: "", dst: "", flags: 0, active: true};
redirect = {src: "", dst: "", desc: "", flags: 0, active: true};
}}
>
Create

View File

@ -8,6 +8,8 @@
function resetRedirect(): any {
redirect.client = JSON.parse(JSON.stringify(redirect.server));
}
const descCols = 50;
</script>
{#if noCPair(redirect)}
@ -15,6 +17,7 @@
<td class="code-font"><a href="https://{redirect.server.src}" target="_blank">{redirect.server.src}</a></td>
<td><input type="text" class="code-font" disabled bind:value={redirect.server.dst} size={Math.max(20, redirect.server.dst.length + 2)} /></td>
<td><Flags value={redirect.server.flags} keys={redirectKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} disabled value={redirect.server.desc} /></td>
<td><input type="checkbox" disabled checked={false} /></td>
<td><button on:click={() => resetRedirect()}>Restore</button></td>
</tr>
@ -23,6 +26,7 @@
<td class="code-font"><a href="https://{redirect.client.src}" target="_blank">{redirect.client.src}</a></td>
<td><input type="text" class="code-font" bind:value={redirect.client.dst} size={Math.max(20, redirect.client.dst.length + 2)} /></td>
<td><Flags bind:value={redirect.client.flags} editable keys={redirectKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} bind:value={redirect.client.desc} /></td>
<td><input type="checkbox" bind:checked={redirect.client.active} /></td>
<td>
{#if !noSPair(redirect)}

View File

@ -4,19 +4,22 @@
import Flags from "./Flags.svelte";
const dispatch = createEventDispatcher();
let route: Route = {src: "", dst: "", flags: 0, active: true};
let route: Route = {src: "", dst: "", desc: "", flags: 0, active: true};
const descCols = 50;
</script>
<tr class="created">
<td><input type="text" class="code-font" bind:value={route.src} size={Math.max(20, route.src.length + 2)} /></td>
<td><input type="text" class="code-font" bind:value={route.dst} size={Math.max(20, route.dst.length + 2)} /></td>
<td><Flags value={route.flags} editable keys={routeKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} bind:value={route.desc} /></td>
<td><input type="checkbox" bind:checked={route.active} /></td>
<td>
<button
on:click={() => {
dispatch("make", route);
route = {src: "", dst: "", flags: 0, active: true};
route = {src: "", dst: "", desc: "", flags: 0, active: true};
}}
>
Create

View File

@ -8,6 +8,8 @@
function resetRoute(): any {
route.client = JSON.parse(JSON.stringify(route.server));
}
const descCols = 50;
</script>
{#if noCPair(route)}
@ -15,6 +17,7 @@
<td class="code-font"><a href="https://{route.server.src}" target="_blank">{route.server.src}</a></td>
<td><input type="text" class="code-font" disabled bind:value={route.server.dst} size={Math.max(20, route.server.dst.length + 2)} /></td>
<td><Flags value={route.server.flags} keys={routeKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} disabled value={route.server.desc} /></td>
<td><input type="checkbox" disabled checked={false} /></td>
<td><button on:click={() => resetRoute()}>Restore</button></td>
</tr>
@ -23,6 +26,7 @@
<td class="code-font"><a href="https://{route.client.src}" target="_blank">{route.client.src}</a></td>
<td><input type="text" class="code-font" bind:value={route.client.dst} size={Math.max(20, route.client.dst.length + 2)} /></td>
<td><Flags bind:value={route.client.flags} editable keys={routeKeys} /></td>
<td class="desc"><textarea rows="3" cols={descCols} bind:value={route.client.desc} /></td>
<td><input type="checkbox" bind:checked={route.client.active} /></td>
<td>
{#if !noSPair(route)}
@ -65,4 +69,8 @@
td input[type="text"] {
padding: 4px;
}
.desc textarea {
resize: none;
}
</style>

View File

@ -1,6 +1,7 @@
export interface Route {
src: string;
dst: string;
desc: string;
flags: number;
active: boolean;
}
@ -8,18 +9,19 @@ export interface Route {
export interface Redirect {
src: string;
dst: string;
desc: string;
flags: number;
active: boolean;
}
export function routeEqual(a: Route, b: Route): boolean {
if (b == null) return false;
return a.src === b.src && a.dst === b.dst && a.flags === b.flags && a.active === b.active;
return a.src === b.src && a.dst === b.dst && a.desc === b.desc && a.flags === b.flags && a.active === b.active;
}
export function redirectEqual(a: Redirect, b: Redirect): boolean {
if (b == null) return false;
return a.src === b.src && a.dst === b.dst && a.flags === b.flags && a.active === b.active;
return a.src === b.src && a.dst === b.dst && a.desc === b.desc && a.flags === b.flags && a.active === b.active;
}
export const routeKeys = [

View File

@ -82,6 +82,7 @@
<th>Source</th>
<th>Destination</th>
<th>Flags</th>
<th>Description</th>
<th>Active</th>
<th>Option</th>
</tr>
@ -119,6 +120,7 @@
<th>Source</th>
<th>Destination</th>
<th>Flags</th>
<th>Description</th>
<th>Active</th>
<th>Option</th>
</tr>

View File

@ -109,24 +109,28 @@ func apiServer(verify mjwt.Verifier) {
{
"src": "example.com",
"dst": "127.0.0.1:8080",
"desc": "This is a test description",
"flags": 181,
"active": true,
},
{
"src": "test.example.com",
"dst": "127.0.0.1:8081",
"desc": "This is a test description",
"flags": 17,
"active": true,
},
{
"src": "example.org/hello",
"dst": "127.0.0.1:8082",
"desc": "This is a test description",
"flags": 16,
"active": true,
},
{
"src": "test.example.org/hello",
"dst": "127.0.0.1:8083",
"desc": "This is a test description",
"flags": 15,
"active": true,
},
@ -137,24 +141,28 @@ func apiServer(verify mjwt.Verifier) {
{
"src": "example.org",
"dst": "127.0.0.1:8084",
"desc": "This is a test description",
"flags": 181,
"active": true,
},
{
"src": "test.example.org",
"dst": "127.0.0.1:8085",
"desc": "This is a test description",
"flags": 17,
"active": true,
},
{
"src": "example.org/hello",
"dst": "127.0.0.1:8086",
"desc": "This is a test description",
"flags": 16,
"active": true,
},
{
"src": "test.example.org/hello",
"dst": "127.0.0.1:8087",
"desc": "This is a test description",
"flags": 15,
"active": true,
},