Mirrors/WGDashboard
1
0
Fork 0
mirror of https://github.com/donaldzou/WGDashboard.git synced 2025-10-14 04:46:18 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Working on some updates

Browse Source
This commit is contained in:
Donald Zou
2024-08-14 22:45:36 -04:00
parent fd0e519e41
commit 47efb644b7
17 changed files with 208 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/static/app/dist/assets/index.css vendored
View File

File diff suppressed because one or more lines are too long

56
src/static/app/dist/assets/index.js vendored
View File

File diff suppressed because one or more lines are too long

1
src/static/app/src/components/configurationComponents/peerCreate.vue
View File

@@ -108,7 +108,6 @@ export default {
</h3>
<h3 class="text-body mb-0">Add Peers</h3>
</RouterLink>
</div>
<div class="d-flex flex-column gap-2">
<BulkAdd :saving="saving" :data="this.data" :availableIp="this.availableIp"></BulkAdd>

7
src/static/app/src/components/configurationComponents/peerList.vue
View File

@@ -402,7 +402,7 @@ export default {
</script>
<template>
<div v-if="!this.loading">
<div v-if="!this.loading" class="container-md">
<div class="d-flex align-items-center">
<div>
<small CLASS="text-muted">CONFIGURATION</small>
@@ -545,10 +545,7 @@ export default {
</div>
</div>
</div>
<div class="mb-4">
<!-- <div class="d-flex align-items-center gap-3 mb-2">-->
<!-- <h3>Peers</h3>-->
<!-- </div>-->
<div class="mb-3">
<PeerSearch
@jobsAll="this.peerScheduleJobsAll.modalOpen = true"
@jobLogs="this.peerScheduleJobsLogs.modalOpen = true"

154
src/static/app/src/components/configurationComponents/peerSearch.vue
View File

@@ -30,7 +30,9 @@ export default {
'60000': '1 Minutes'
},
searchString: "",
searchStringTimeout: undefined
searchStringTimeout: undefined,
showDisplaySettings: false,
showMoreSettings: false
}
},
methods: {
@@ -93,68 +95,98 @@ export default {
@click="this.downloadAllPeer()">
<i class="bi bi-download me-2"></i> Download All
</button>
<div class="flex-grow-1">
<div class="flex-grow-1 mt-3 mt-md-0">
<input class="form-control rounded-3 bg-secondary-subtle border-1 border-secondary-subtle shadow-sm w-100"
placeholder="Search..."
id="searchPeers"
@keyup="this.debounce()"
v-model="this.searchString">
</div>
<div class="">
</div>
<div class="dropdown dropup">
<button class="btn text-secondary-emphasis bg-secondary-subtle rounded-3 border-1 border-secondary-subtle shadow-sm"
type="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-filter-circle me-2"></i>
Display
</button>
<ul class="dropdown-menu mt-2 shadow rounded-3 animate__animated animation__fadeInDropdown dropdown-menu-end">
<li>
<small class="dropdown-header">Sort by</small>
</li>
<li v-for="(value, key) in this.sort">
<a class="dropdown-item d-flex align-items-center" role="button" @click="this.updateSort(key)">
<small class="me-auto">{{value}}</small>
<i class="bi bi-check text-primary"
v-if="store.Configuration.Server.dashboard_sort === key"></i>
</a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<small class="dropdown-header">Refresh Interval</small>
</li>
<li v-for="(value, key) in this.interval">
<a class="dropdown-item d-flex" role="button" @click="updateRefreshInterval(key)">
<small class="me-auto">{{value}}</small>
<i class="bi bi-check text-primary"
v-if="store.Configuration.Server.dashboard_refresh_interval === key"></i>
</a>
</li>
</ul>
</div>
<div class="dropdown dropup">
<button class="btn text-secondary-emphasis bg-secondary-subtle rounded-3 border-1 border-secondary-subtle shadow-sm"
type="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-three-dots"></i>
</button>
<ul class="dropdown-menu shadow mt-2 rounded-3 animate__animated animation__fadeInDropdown">
<li>
<h6 class="dropdown-header">Peer Jobs</h6>
</li>
<li>
<a role="button" class="dropdown-item" @click="this.$emit('jobsAll')">
Active Jobs
</a>
</li>
<li>
<a role="button" class="dropdown-item" @click="this.$emit('jobLogs')">
Logs
</a>
</li>
</ul>
</div>
<button
@click="this.showDisplaySettings = true"
class="btn text-secondary-emphasis bg-secondary-subtle rounded-3 border-1 border-secondary-subtle shadow-sm"
type="button" aria-expanded="false">
<i class="bi bi-filter-circle me-2"></i>
Display
</button>
<button class="btn text-secondary-emphasis bg-secondary-subtle rounded-3 border-1 border-secondary-subtle shadow-sm"
@click="this.showMoreSettings = true"
type="button" aria-expanded="false">
<i class="bi bi-three-dots"></i>
</button>
<Transition name="zoom">
<div
v-if="this.showDisplaySettings"
class="peerSettingContainer w-100 h-100 position-absolute top-0 start-0 overflow-y-scroll displayModal">
<div class="container-md d-flex h-100 w-100">
<div class="m-auto modal-dialog-centered dashboardModal">
<div class="card rounded-3 shadow w-100">
<div class="card-header bg-transparent d-flex align-items-center gap-2 border-0 p-4 pb-2">
<h4 class="mb-0 fw-normal">Display
</h4>
<button type="button" class="btn-close ms-auto" @click="this.showDisplaySettings = false"></button>
</div>
<div class="card-body px-4 pb-4 d-flex gap-3 flex-column">
<div>
<p class="text-muted fw-bold mb-2"><small>Sort by</small></p>
<div class="list-group">
<a v-for="(value, key) in this.sort" class="list-group-item list-group-item-action d-flex" role="button" @click="this.updateSort(key)">
<span class="me-auto">{{value}}</span>
<i class="bi bi-check text-primary"
v-if="store.Configuration.Server.dashboard_sort === key"></i>
</a>
</div>
</div>
<div>
<p class="text-muted fw-bold mb-2"><small>Refresh interval</small></p>
<div class="list-group">
<a v-for="(value, key) in this.interval"
class="list-group-item list-group-item-action d-flex" role="button"
@click="this.updateRefreshInterval(key)">
<span class="me-auto">{{value}}</span>
<i class="bi bi-check text-primary"
v-if="store.Configuration.Server.dashboard_refresh_interval === key"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</Transition>
<Transition name="zoom">
<div
v-if="this.showMoreSettings"
class="peerSettingContainer w-100 h-100 position-absolute top-0 start-0 overflow-y-scroll displayModal">
<div class="container-md d-flex h-100 w-100">
<div class="m-auto modal-dialog-centered dashboardModal">
<div class="card rounded-3 shadow w-100">
<div class="card-header bg-transparent d-flex align-items-center gap-2 border-0 p-4 pb-2">
<h4 class="mb-0 fw-normal">Configuration Settings
</h4>
<button type="button" class="btn-close ms-auto" @click="this.showMoreSettings = false"></button>
</div>
<div class="card-body px-4 pb-4 d-flex gap-3 flex-column">
<div>
<p class="text-muted fw-bold mb-2"><small>Peer Jobs</small></p>
<div class="list-group">
<a class="list-group-item list-group-item-action d-flex" role="button"
@click="this.$emit('jobsAll')">
Active Jobs
</a>
<a class="list-group-item list-group-item-action d-flex" role="button"
@click="this.$emit('jobLogs')">
Logs
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</Transition>
</div>
</div>
</template>
@@ -180,9 +212,17 @@ export default {
}
}
.displayModal .dashboardModal{
width: 400px !important;
}
@media screen and (max-width: 768px) {
.peerSearchContainer{
flex-direction: column;
}
.peerSettingContainer .dashboardModal{
width: 100% !important;
}
}
</style>

2
src/static/app/src/components/configurationList.vue
View File

@@ -31,7 +31,7 @@ export default {
<template>
<div class="mt-5">
<div class="mt-md-5 mt-3">
<div class="container-md">
<div class="d-flex mb-4 configurationListTitle">
<h3 class="text-body d-flex">

2
src/static/app/src/components/navbar.vue
View File

@@ -41,8 +41,8 @@ export default {
<li class="nav-item">
<RouterLink :to="'/configuration/'+c.Name + '/peers'" class="nav-link nav-conf-link rounded-3"
active-class="active"
v-for="c in this.wireguardConfigurationsStore.Configurations">
<span class="dot me-2" :class="{active: c.Status}"></span>
{{c.Name}}
</RouterLink>
</li>

3
src/static/app/src/components/signInComponents/RemoteServer.vue
View File

@@ -18,8 +18,9 @@ export default {
methods: {
async handshake(){
this.active = false;
this.refreshing = true;
if (this.server.host && this.server.apiKey){
this.refreshing = true;
this.startTime = undefined;
this.endTime = undefined;
this.startTime = dayjs()

4
src/static/app/src/stores/DashboardConfigurationStore.js
View File

@@ -26,7 +26,7 @@ export const DashboardConfigurationStore = defineStore('DashboardConfigurationSt
this.ActiveServerConfiguration = localStorage.getItem("ActiveCrossServerConfiguration");
}
if (currentConfiguration === null){
localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
window.localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
}else{
this.CrossServerConfiguration = JSON.parse(currentConfiguration)
}
@@ -34,7 +34,7 @@ export const DashboardConfigurationStore = defineStore('DashboardConfigurationSt
},
syncCrossServerConfiguration(){
localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
window.localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
},
addCrossServerConfiguration(){
this.CrossServerConfiguration.ServerList[v4().toString()] = {host: "", apiKey: "", active: false}

4
src/static/app/src/utilities/fetch.js
View File

@@ -20,8 +20,8 @@ const getUrl = (url) => {
return `${apiKey.host}${url}`
}
console.log("URL fetching: ", import.meta.env.MODE === 'development' ? url
: `${window.location.protocol}//${(window.location.host + window.location.pathname + url).replace(/\/\//g, '/')}`)
// console.log("URL fetching: ", import.meta.env.MODE === 'development' ? url
// : `${window.location.protocol}//${(window.location.host + window.location.pathname + url).replace(/\/\//g, '/')}`)
return import.meta.env.MODE === 'development' ? url
: `${window.location.protocol}//${(window.location.host + window.location.pathname + url).replace(/\/\//g, '/')}`
}

2
src/static/app/src/views/configuration.vue
View File

@@ -5,7 +5,7 @@ export default {
</script>
<template>
<div class="mt-5 text-body">
<div class="mt-md-5 mt-3 text-body">
<RouterView v-slot="{ Component, route }">
<Transition name="fade2" mode="out-in">
<Suspense>

2
src/static/app/src/views/ping.vue
View File

@@ -60,7 +60,7 @@ export default {
</script>
<template>
<div class="mt-5 text-body">
<div class="mt-md-5 mt-3 text-body">
<div class="container">
<h3 class="mb-3 text-body">Ping</h3>
<div class="row">

4
src/static/app/src/views/settings.vue
View File

@@ -39,8 +39,8 @@ export default {
</script>
<template>
<div class="mt-5">
<div class="container">
<div class="mt-md-5 mt-3">
<div class="container-md">
<h3 class="mb-3 text-body">Settings</h3>
<DashboardTheme></DashboardTheme>
<div class="card mb-4 shadow rounded-3">

4
src/static/app/src/views/traceroute.vue
View File

@@ -38,8 +38,8 @@ export default {
</script>
<template>
<div class="mt-5 text-body">
<div class="container">
<div class="mt-md-5 mt-3 text-body">
<div class="container-md">
<h3 class="mb-3 text-body">Traceroute</h3>
<div class="row">
<div class="col-sm-4 d-flex gap-2 flex-column">

10
src/wg-dashboard.service
View File

@@ -5,11 +5,11 @@ ConditionPathIsDirectory=/etc/wireguard
[Service]
Type=forking
PIDFile=/opt/wgdashboard/src/gunicorn.pid
WorkingDirectory=/opt/wgdashboard/src
ExecStart=/opt/wgdashboard/src/wgd.sh start
ExecStop=/opt/wgdashboard/src/wgd.sh stop
ExecReload=/opt/wgdashboard/src/wgd.sh restart
PIDFile=<absolute_path_of_wgdashboard_src>/gunicorn.pid
WorkingDirectory=<absolute_path_of_wgdashboard_src>
ExecStart=<absolute_path_of_wgdashboard_src>/wgd.sh start
ExecStop=<absolute_path_of_wgdashboard_src>/wgd.sh stop
ExecReload=<absolute_path_of_wgdashboard_src>/wgd.sh restart
TimeoutSec=120
PrivateTmp=yes
Restart=always

7
src/wgd.sh
View File

@@ -64,13 +64,13 @@ _determineOS(){
_installPython(){
case "$OS" in
ubuntu|debian)
{ sudo apt update ; sudo apt-get install -y python3; printf "\n\n"; } &>> ./log/install.txt
{ sudo apt update ; sudo apt-get install -y python3 net-tools; printf "\n\n"; } &>> ./log/install.txt
;;
centos|fedora|redhat)
if command -v dnf &> /dev/null; then
{ sudo dnf install -y python3; printf "\n\n"; } >> ./log/install.txt
{ sudo dnf install -y python3 net-tools; printf "\n\n"; } >> ./log/install.txt
else
{ sudo yum install -y python3; printf "\n\n"; } >> ./log/install.txt
{ sudo yum install -y python3 net-tools ; printf "\n\n"; } >> ./log/install.txt
fi
;;
# arch)
@@ -305,7 +305,6 @@ update_wgd() {
fi
}
if [ "$#" != 1 ];
then
help