Adjusted some code for electron version

This commit is contained in:
Donald Zou 2024-08-11 16:39:00 -04:00
parent 55f55820c5
commit 96ccb03eea
15 changed files with 2331 additions and 139 deletions

View file

@ -1,16 +0,0 @@
#!/bin/bash
# if [ -z "$(ls -A /etc/wireguard)" ]; then
# mv /wg0.conf /etc/wireguard
# echo "Moved conf file to /etc/wireguard"
# else
# rm wg0.conf
# echo "Removed unneeded conf file"
# fi
# wg-quick up wg0
chmod u+x /opt/wgdashboard/wgd.sh
if [ ! -f "/opt/wgdashboard/wg-dashboard.ini" ]; then
/opt/wgdashboard/wgd.sh install
fi
/opt/wgdashboard/wgd.sh debug

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 180 KiB

View file

@ -1,14 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="./favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WGDashboard</title>
<script type="module" crossorigin src="./assets/index.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index.css">
</head>
<body>
<div id="app" class="w-100 vh-100"></div>
</body>
</html>

File diff suppressed because it is too large Load diff

View file

@ -6,7 +6,7 @@
"scripts": {
"dev": "vite",
"build": "vite build",
"build electron": "vite build --mode electron",
"build electron": "vite build --mode electron && cd ../../../../WGDashboard-Desktop && electron-builder",
"preview": "vite preview"
},
"dependencies": {
@ -18,6 +18,7 @@
"bootstrap-icons": "^1.11.2",
"cidr-tools": "^7.0.4",
"dayjs": "^1.11.12",
"electron-builder": "^24.13.3",
"fuse.js": "^7.0.0",
"i": "^0.3.7",
"is-cidr": "^5.0.3",

View file

@ -1,9 +1,13 @@
<script setup>
import { RouterView } from 'vue-router'
import {DashboardConfigurationStore} from "@/stores/DashboardConfigurationStore.js";
import {watch} from "vue";
import {computed, watch} from "vue";
const store = DashboardConfigurationStore();
store.initCrossServerConfiguration();
if (window.IS_WGDASHBOARD_DESKTOP){
store.IsElectronApp = true;
store.CrossServerConfiguration.Enable = true;
}
watch(store.CrossServerConfiguration, () => {
store.syncCrossServerConfiguration()
@ -11,16 +15,22 @@ watch(store.CrossServerConfiguration, () => {
deep: true
});
const getActiveCrossServer = computed(() => {
if (store.ActiveServerConfiguration){
return store.CrossServerConfiguration.ServerList[store.ActiveServerConfiguration]
}
return undefined
})
</script>
<template>
<nav class="navbar bg-dark sticky-top" data-bs-theme="dark">
<div class="container-fluid d-flex text-body">
<div class="container-fluid d-flex text-body align-items-center">
<span class="navbar-brand mb-0 h1">WGDashboard</span>
<span class="ms-auto" v-if="store.getActiveCrossServer() !== undefined">
<i class="bi bi-server me-2"></i>{{store.getActiveCrossServer().host}}
</span>
<small class="ms-auto text-muted" v-if="getActiveCrossServer !== undefined">
<i class="bi bi-server me-2"></i>{{getActiveCrossServer.host}}
</small>
</div>
</nav>
<Suspense>

View file

@ -27,8 +27,9 @@ export default {
<RemoteServer v-for="(server, key) in this.store.CrossServerConfiguration.ServerList"
@setActiveServer="this.store.setActiveCrossServer(key)"
@delete="this.store.deleteCrossServerConfiguration(key)"
:key="key"
:server="server"></RemoteServer>
<h6 class="text-muted m-auto" v-if="this.store.CrossServerConfiguration.ServerList.length === 0">
<h6 class="text-muted m-auto" v-if="Object.keys(this.store.CrossServerConfiguration.ServerList).length === 0">
Click<i class="bi bi-plus-circle-fill mx-1"></i>to add your server</h6>
</div>
</div>

View file

@ -14,16 +14,23 @@ export const DashboardConfigurationStore = defineStore('DashboardConfigurationSt
CrossServerConfiguration:{
Enable: false,
ServerList: {}
}
},
ActiveServerConfiguration: undefined,
IsElectronApp: false
}),
actions: {
initCrossServerConfiguration(){
const currentConfiguration = localStorage.getItem('CrossServerConfiguration');
if (localStorage.getItem("ActiveCrossServerConfiguration") !== null){
this.ActiveServerConfiguration = localStorage.getItem("ActiveCrossServerConfiguration");
}
if (currentConfiguration === null){
localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
}else{
this.CrossServerConfiguration = JSON.parse(currentConfiguration)
}
},
syncCrossServerConfiguration(){
localStorage.setItem('CrossServerConfiguration', JSON.stringify(this.CrossServerConfiguration))
@ -42,9 +49,11 @@ export const DashboardConfigurationStore = defineStore('DashboardConfigurationSt
return undefined
},
setActiveCrossServer(key){
this.ActiveServerConfiguration = key;
localStorage.setItem('ActiveCrossServerConfiguration', key)
},
removeActiveCrossServer(){
this.ActiveServerConfiguration = undefined;
localStorage.removeItem('ActiveCrossServerConfiguration')
},

View file

@ -32,7 +32,7 @@ export const fetchGet = async (url, params=undefined, callback=undefined) => {
if (!x.ok){
if (x.status !== 200){
if (x.status === 401){
router.push({path: '/signin'})
store.newMessage("WGDashboard", "Session Ended", "warning")
}
throw new Error(x.statusText)
@ -42,6 +42,7 @@ export const fetchGet = async (url, params=undefined, callback=undefined) => {
}
}).then(x => callback ? callback(x) : undefined).catch(x => {
console.log(x)
router.push({path: '/signin'})
})
}
@ -55,7 +56,7 @@ export const fetchPost = async (url, body, callback) => {
if (!x.ok){
if (x.status !== 200){
if (x.status === 401){
router.push({path: '/signin'})
store.newMessage("WGDashboard", "Session Ended", "warning")
}
throw new Error(x.statusText)
@ -65,5 +66,6 @@ export const fetchPost = async (url, body, callback) => {
}
}).then(x => callback ? callback(x) : undefined).catch(x => {
console.log(x)
router.push({path: '/signin'})
})
}

View file

@ -9,14 +9,17 @@ export default {
components: {RemoteServerList, Message},
async setup(){
const store = DashboardConfigurationStore()
let theme = ""
let theme = "dark"
let totpEnabled = false;
await fetchGet("/api/getDashboardTheme", {}, (res) => {
theme = res.data
});
await fetchGet("/api/isTotpEnabled", {}, (res) => {
totpEnabled = res.data
});
if (!store.IsElectronApp){
await fetchGet("/api/getDashboardTheme", {}, (res) => {
theme = res.data
});
await fetchGet("/api/isTotpEnabled", {}, (res) => {
totpEnabled = res.data
});
}
store.removeActiveCrossServer();
return {store, theme, totpEnabled}
},
data(){
@ -132,7 +135,7 @@ export default {
</form>
<RemoteServerList v-else></RemoteServerList>
<div class="d-flex mt-3">
<div class="d-flex mt-3" v-if="!this.store.IsElectronApp">
<div class="form-check form-switch ms-auto">
<input
v-model="this.store.CrossServerConfiguration.Enable"

View file

@ -20,13 +20,8 @@ export default defineConfig(({mode}) => {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
server:{
proxy: {
'/api': proxy
}
},
build: {
outDir: 'electron',
outDir: '../../../../WGDashboard-Desktop',
rollupOptions: {
output: {
entryFileNames: `assets/[name].js`,