mirror of
https://github.com/donaldzou/WGDashboard.git
synced 2024-11-22 15:20:09 +01:00
Adjusted some UI
This commit is contained in:
parent
e3f82e136a
commit
3a34a0eb40
6
src/static/app/dist/assets/index.css
vendored
6
src/static/app/dist/assets/index.css
vendored
File diff suppressed because one or more lines are too long
40
src/static/app/dist/assets/index.js
vendored
40
src/static/app/dist/assets/index.js
vendored
File diff suppressed because one or more lines are too long
@ -25,12 +25,13 @@ const getActiveCrossServer = computed(() => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<nav class="navbar bg-dark sticky-top" data-bs-theme="dark">
|
<nav class="navbar bg-dark sticky-top border-bottom border-secondary-subtle" data-bs-theme="dark">
|
||||||
<div class="container-fluid d-flex text-body align-items-center">
|
<div class="container-fluid d-flex text-body align-items-center">
|
||||||
<span class="navbar-brand mb-0 h1">WGDashboard</span>
|
<span class="navbar-brand mb-0 h1">WGDashboard</span>
|
||||||
<small class="ms-auto text-muted" v-if="getActiveCrossServer !== undefined">
|
<small class="ms-auto text-muted" v-if="getActiveCrossServer !== undefined">
|
||||||
<i class="bi bi-server me-2"></i>{{getActiveCrossServer.host}}
|
<i class="bi bi-server me-2"></i>{{getActiveCrossServer.host}}
|
||||||
</small>
|
</small>
|
||||||
|
<a role="button"><i class="bi bi-list"></i></a>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
<Suspense>
|
<Suspense>
|
||||||
|
@ -14,7 +14,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="col-md-3 col-lg-2 d-md-block p-3" style="height: calc(-50px + 100vh);">
|
<div class="col-md-3 col-lg-2 d-md-block p-3 navbar-container bg-body" style="height: calc(-50px + 100vh);">
|
||||||
<nav id="sidebarMenu" class=" bg-body-tertiary sidebar border h-100 rounded-3 shadow overflow-y-scroll" >
|
<nav id="sidebarMenu" class=" bg-body-tertiary sidebar border h-100 rounded-3 shadow overflow-y-scroll" >
|
||||||
<div class="sidebar-sticky pt-3">
|
<div class="sidebar-sticky pt-3">
|
||||||
<ul class="nav flex-column px-2">
|
<ul class="nav flex-column px-2">
|
||||||
@ -75,5 +75,10 @@ export default {
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.navbar-container{
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
@ -65,7 +65,7 @@ export default {
|
|||||||
<div class="card mb-4 shadow rounded-3">
|
<div class="card mb-4 shadow rounded-3">
|
||||||
<div class="card-header d-flex">
|
<div class="card-header d-flex">
|
||||||
API Keys
|
API Keys
|
||||||
<div class="form-check form-switch ms-auto">
|
<div class="form-check form-switch ms-auto" v-if="!this.store.getActiveCrossServer()">
|
||||||
<input class="form-check-input" type="checkbox"
|
<input class="form-check-input" type="checkbox"
|
||||||
v-model="this.value"
|
v-model="this.value"
|
||||||
@change="this.toggleDashboardAPIKeys()"
|
@change="this.toggleDashboardAPIKeys()"
|
||||||
@ -78,6 +78,7 @@ export default {
|
|||||||
<div class="card-body position-relative d-flex flex-column gap-2" v-if="this.value">
|
<div class="card-body position-relative d-flex flex-column gap-2" v-if="this.value">
|
||||||
<button class="ms-auto btn bg-primary-subtle text-primary-emphasis border-1 border-primary-subtle rounded-3 shadow-sm"
|
<button class="ms-auto btn bg-primary-subtle text-primary-emphasis border-1 border-primary-subtle rounded-3 shadow-sm"
|
||||||
@click="this.newDashboardAPIKey = true"
|
@click="this.newDashboardAPIKey = true"
|
||||||
|
v-if="!this.store.getActiveCrossServer()"
|
||||||
>
|
>
|
||||||
<i class="bi bi-key me-2"></i> Create
|
<i class="bi bi-key me-2"></i> Create
|
||||||
</button>
|
</button>
|
||||||
|
@ -44,18 +44,22 @@ export default {
|
|||||||
<small class="text-muted">Expire At</small>
|
<small class="text-muted">Expire At</small>
|
||||||
{{this.apiKey.ExpiredAt ? this.apiKey.ExpiredAt : 'Never'}}
|
{{this.apiKey.ExpiredAt ? this.apiKey.ExpiredAt : 'Never'}}
|
||||||
</div>
|
</div>
|
||||||
<a role="button" class="btn btn-sm bg-danger-subtle text-danger-emphasis rounded-3" @click="this.confirmDelete = true">
|
<a role="button" class="btn btn-sm bg-danger-subtle text-danger-emphasis rounded-3"
|
||||||
|
v-if="!this.store.getActiveCrossServer()"
|
||||||
|
@click="this.confirmDelete = true">
|
||||||
<i class="bi bi-trash-fill"></i>
|
<i class="bi bi-trash-fill"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="card-body d-flex gap-3 align-items-center justify-content-end">
|
<div v-else class="card-body d-flex gap-3 align-items-center justify-content-end"
|
||||||
|
v-if="!this.store.getActiveCrossServer()">
|
||||||
Are you sure to delete this API key?
|
Are you sure to delete this API key?
|
||||||
<a role="button" class="btn btn-sm bg-success-subtle text-success-emphasis rounded-3"
|
<a role="button" class="btn btn-sm bg-success-subtle text-success-emphasis rounded-3"
|
||||||
@click="this.deleteAPIKey()"
|
@click="this.deleteAPIKey()"
|
||||||
>
|
>
|
||||||
<i class="bi bi-check-lg"></i>
|
<i class="bi bi-check-lg"></i>
|
||||||
</a>
|
</a>
|
||||||
<a role="button" class="btn btn-sm bg-secondary-subtle text-secondary-emphasis rounded-3" @click="this.confirmDelete = false">
|
<a role="button" class="btn btn-sm bg-secondary-subtle text-secondary-emphasis rounded-3"
|
||||||
|
@click="this.confirmDelete = false">
|
||||||
<i class="bi bi-x-lg"></i>
|
<i class="bi bi-x-lg"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -77,8 +77,8 @@ export default {
|
|||||||
<AccountSettingsInputPassword
|
<AccountSettingsInputPassword
|
||||||
targetData="password">
|
targetData="password">
|
||||||
</AccountSettingsInputPassword>
|
</AccountSettingsInputPassword>
|
||||||
<hr class="m-0">
|
<hr class="m-0" v-if="!this.dashboardConfigurationStore.getActiveCrossServer()">
|
||||||
<AccountSettingsMFA></AccountSettingsMFA>
|
<AccountSettingsMFA v-if="!this.dashboardConfigurationStore.getActiveCrossServer()"></AccountSettingsMFA>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<DashboardAPIKeys></DashboardAPIKeys>
|
<DashboardAPIKeys></DashboardAPIKeys>
|
||||||
|
Loading…
Reference in New Issue
Block a user