mirror of
https://github.com/vx3r/wg-gen-web.git
synced 2024-12-18 00:13:23 +00:00
refactor backend and frontend, migrate structs, organize front view, add mtu
This commit is contained in:
parent
6cafb97e31
commit
0aad10cb63
@ -1,7 +1,29 @@
|
||||
stages:
|
||||
- build artifacts
|
||||
- build docker image
|
||||
- push docker hub
|
||||
|
||||
build-back:
|
||||
stage: build artifacts
|
||||
image: golang:latest
|
||||
script:
|
||||
- GOOS=linux GOARCH=amd64 go build -o ${CI_PROJECT_NAME}-linux-amd64
|
||||
artifacts:
|
||||
paths:
|
||||
- ${CI_PROJECT_NAME}-linux-amd64
|
||||
|
||||
build-front:
|
||||
stage: build artifacts
|
||||
image: node:10-alpine
|
||||
script:
|
||||
- cd ./ui
|
||||
- npm install
|
||||
- npm run build
|
||||
- cd ..
|
||||
artifacts:
|
||||
paths:
|
||||
- ui/dist
|
||||
|
||||
build:
|
||||
stage: build docker image
|
||||
image: docker:latest
|
||||
|
@ -27,6 +27,7 @@ The goal is to run Wg Gen Web in a container and WireGuard on host system.
|
||||
* Self-hosted and web based
|
||||
* Automatically select IP from the netowrk pool assigned to client
|
||||
* QR-Code for convenient mobile client configuration
|
||||
* Sent email to client with QR-code and client config
|
||||
* Enable / Disable client
|
||||
* Generation of `wg0.conf` after any modification
|
||||
* Dockerized
|
||||
|
@ -16,7 +16,6 @@ import (
|
||||
"path/filepath"
|
||||
"sort"
|
||||
"strconv"
|
||||
"strings"
|
||||
"time"
|
||||
)
|
||||
|
||||
@ -49,8 +48,8 @@ func CreateClient(client *model.Client) (*model.Client, error) {
|
||||
}
|
||||
|
||||
ips := make([]string, 0)
|
||||
for _, network := range strings.Split(client.Address, ",") {
|
||||
ip, err := util.GetAvailableIp(strings.TrimSpace(network), reserverIps)
|
||||
for _, network := range client.Address {
|
||||
ip, err := util.GetAvailableIp(network, reserverIps)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
@ -61,7 +60,7 @@ func CreateClient(client *model.Client) (*model.Client, error) {
|
||||
}
|
||||
ips = append(ips, ip)
|
||||
}
|
||||
client.Address = strings.Join(ips, ",")
|
||||
client.Address = ips
|
||||
client.Created = time.Now().UTC()
|
||||
client.Updated = client.Created
|
||||
|
||||
|
189
core/migrate.go
Normal file
189
core/migrate.go
Normal file
@ -0,0 +1,189 @@
|
||||
package core
|
||||
|
||||
import (
|
||||
"encoding/json"
|
||||
uuid "github.com/satori/go.uuid"
|
||||
log "github.com/sirupsen/logrus"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/model"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/storage"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/util"
|
||||
"io/ioutil"
|
||||
"os"
|
||||
"path/filepath"
|
||||
"strings"
|
||||
"time"
|
||||
)
|
||||
|
||||
// Migrate all changes, current struct fields change
|
||||
func Migrate() error {
|
||||
clients, err := readClients()
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
|
||||
s, err := deserialize("server.json")
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
|
||||
for _, client := range clients {
|
||||
switch v := client["allowedIPs"].(type) {
|
||||
case []interface{}:
|
||||
log.Infof("client %s has been already migrated", client["id"])
|
||||
continue
|
||||
default:
|
||||
log.Infof("unexpected type %T, mus be migrated", v)
|
||||
}
|
||||
|
||||
c := &model.Client{}
|
||||
c.Id = client["id"].(string)
|
||||
c.Name = client["name"].(string)
|
||||
c.Email = client["email"].(string)
|
||||
c.Enable = client["enable"].(bool)
|
||||
c.AllowedIPs = make([]string, 0)
|
||||
for _, address := range strings.Split(client["allowedIPs"].(string), ",") {
|
||||
if util.IsValidCidr(strings.TrimSpace(address)) {
|
||||
c.AllowedIPs = append(c.AllowedIPs, strings.TrimSpace(address))
|
||||
}
|
||||
}
|
||||
c.Address = make([]string, 0)
|
||||
for _, address := range strings.Split(client["address"].(string), ",") {
|
||||
if util.IsValidCidr(strings.TrimSpace(address)) {
|
||||
c.Address = append(c.Address, strings.TrimSpace(address))
|
||||
}
|
||||
}
|
||||
c.PrivateKey = client["privateKey"].(string)
|
||||
c.PublicKey = client["publicKey"].(string)
|
||||
created, err := time.Parse(time.RFC3339, client["created"].(string))
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to parse time")
|
||||
continue
|
||||
}
|
||||
c.Created = created
|
||||
updated, err := time.Parse(time.RFC3339, client["updated"].(string))
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to parse time")
|
||||
continue
|
||||
}
|
||||
c.Updated = updated
|
||||
|
||||
err = storage.Serialize(c.Id, c)
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to Serialize client")
|
||||
}
|
||||
}
|
||||
|
||||
switch v := s["address"].(type) {
|
||||
case []interface{}:
|
||||
log.Info("server has been already migrated")
|
||||
return nil
|
||||
default:
|
||||
log.Infof("unexpected type %T, mus be migrated", v)
|
||||
}
|
||||
|
||||
server := &model.Server{}
|
||||
|
||||
server.Address = make([]string, 0)
|
||||
for _, address := range strings.Split(s["address"].(string), ",") {
|
||||
if util.IsValidCidr(strings.TrimSpace(address)) {
|
||||
server.Address = append(server.Address, strings.TrimSpace(address))
|
||||
}
|
||||
}
|
||||
server.ListenPort = int(s["listenPort"].(float64))
|
||||
server.PrivateKey = s["privateKey"].(string)
|
||||
server.PublicKey = s["publicKey"].(string)
|
||||
server.PresharedKey = s["presharedKey"].(string)
|
||||
server.Endpoint = s["endpoint"].(string)
|
||||
server.PersistentKeepalive = int(s["persistentKeepalive"].(float64))
|
||||
server.Dns = make([]string, 0)
|
||||
for _, address := range strings.Split(s["dns"].(string), ",") {
|
||||
if util.IsValidIp(strings.TrimSpace(address)) {
|
||||
server.Dns = append(server.Dns, strings.TrimSpace(address))
|
||||
}
|
||||
}
|
||||
if val, ok := s["preUp"]; ok {
|
||||
server.PreUp = val.(string)
|
||||
}
|
||||
if val, ok := s["postUp"]; ok {
|
||||
server.PostUp = val.(string)
|
||||
}
|
||||
if val, ok := s["preDown"]; ok {
|
||||
server.PreDown = val.(string)
|
||||
}
|
||||
if val, ok := s["postDown"]; ok {
|
||||
server.PostDown = val.(string)
|
||||
}
|
||||
created, err := time.Parse(time.RFC3339, s["created"].(string))
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to parse time")
|
||||
}
|
||||
server.Created = created
|
||||
updated, err := time.Parse(time.RFC3339, s["updated"].(string))
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to parse time")
|
||||
}
|
||||
server.Updated = updated
|
||||
|
||||
err = storage.Serialize("server.json", server)
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Errorf("failed to Serialize server")
|
||||
}
|
||||
|
||||
return nil
|
||||
}
|
||||
|
||||
func readClients() ([]map[string]interface{}, error) {
|
||||
clients := make([]map[string]interface{}, 0)
|
||||
|
||||
files, err := ioutil.ReadDir(filepath.Join(os.Getenv("WG_CONF_DIR")))
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
for _, f := range files {
|
||||
// clients file name is an uuid
|
||||
_, err := uuid.FromString(f.Name())
|
||||
if err == nil {
|
||||
c, err := deserialize(f.Name())
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
"path": f.Name(),
|
||||
}).Error("failed to deserialize client")
|
||||
} else {
|
||||
clients = append(clients, c)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return clients, nil
|
||||
}
|
||||
|
||||
func deserialize(id string) (map[string]interface{}, error) {
|
||||
path := filepath.Join(os.Getenv("WG_CONF_DIR"), id)
|
||||
|
||||
data, err := util.ReadFile(path)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
var d map[string]interface{}
|
||||
err = json.Unmarshal(data, &d)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
return d, nil
|
||||
}
|
@ -10,7 +10,6 @@ import (
|
||||
"golang.zx2c4.com/wireguard/wgctrl/wgtypes"
|
||||
"os"
|
||||
"path/filepath"
|
||||
"strings"
|
||||
"time"
|
||||
)
|
||||
|
||||
@ -32,12 +31,19 @@ func ReadServer() (*model.Server, error) {
|
||||
}
|
||||
server.PresharedKey = presharedKey.String()
|
||||
|
||||
server.Name = "Created with default values"
|
||||
server.Endpoint = "wireguard.example.com:123"
|
||||
server.ListenPort = 51820
|
||||
server.Address = "fd9f:6666::10:6:6:1/112, 10.6.6.1/24"
|
||||
server.Dns = "fd9f::10:0:0:2, 10.0.0.2"
|
||||
|
||||
server.Address = make([]string, 0)
|
||||
server.Address = append(server.Address, "fd9f:6666::10:6:6:1/64")
|
||||
server.Address = append(server.Address, "10.6.6.1/24")
|
||||
|
||||
server.Dns = make([]string, 0)
|
||||
server.Dns = append(server.Dns, "fd9f::10:0:0:2")
|
||||
server.Dns = append(server.Dns, "10.0.0.2")
|
||||
|
||||
server.PersistentKeepalive = 16
|
||||
server.Mtu = 0
|
||||
server.PreUp = "echo WireGuard PreUp"
|
||||
server.PostUp = "echo WireGuard PostUp"
|
||||
server.PreDown = "echo WireGuard PreDown"
|
||||
@ -131,12 +137,12 @@ func GetAllReservedIps() ([]string, error) {
|
||||
reserverIps := make([]string, 0)
|
||||
|
||||
for _, client := range clients {
|
||||
for _, cidr := range strings.Split(client.Address, ",") {
|
||||
ip, err := util.GetIpFromCidr(strings.TrimSpace(cidr))
|
||||
for _, cidr := range client.Address {
|
||||
ip, err := util.GetIpFromCidr(cidr)
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
"cidr": err,
|
||||
"cidr": cidr,
|
||||
}).Error("failed to ip from cidr")
|
||||
} else {
|
||||
reserverIps = append(reserverIps, ip)
|
||||
@ -144,8 +150,8 @@ func GetAllReservedIps() ([]string, error) {
|
||||
}
|
||||
}
|
||||
|
||||
for _, cidr := range strings.Split(server.Address, ",") {
|
||||
ip, err := util.GetIpFromCidr(strings.TrimSpace(cidr))
|
||||
for _, cidr := range server.Address {
|
||||
ip, err := util.GetIpFromCidr(cidr)
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
|
17
main.go
17
main.go
@ -9,6 +9,7 @@ import (
|
||||
"github.com/joho/godotenv"
|
||||
log "github.com/sirupsen/logrus"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/api"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/core"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/util"
|
||||
"os"
|
||||
"path/filepath"
|
||||
@ -40,6 +41,14 @@ func main() {
|
||||
}
|
||||
}
|
||||
|
||||
// check server.json or create it
|
||||
_, err = core.ReadServer()
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Fatal("failed to ensure server.json exists")
|
||||
}
|
||||
|
||||
if os.Getenv("GIN_MODE") == "debug" {
|
||||
// set gin release debug
|
||||
gin.SetMode(gin.DebugMode)
|
||||
@ -50,6 +59,14 @@ func main() {
|
||||
gin.DisableConsoleColor()
|
||||
}
|
||||
|
||||
// migrate
|
||||
err = core.Migrate()
|
||||
if err != nil {
|
||||
log.WithFields(log.Fields{
|
||||
"err": err,
|
||||
}).Fatal("failed to migrate")
|
||||
}
|
||||
|
||||
// creates a gin router with default middleware: logger and recovery (crash-free) middleware
|
||||
app := gin.Default()
|
||||
|
||||
|
@ -3,7 +3,6 @@ package model
|
||||
import (
|
||||
"fmt"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/util"
|
||||
"strings"
|
||||
"time"
|
||||
)
|
||||
|
||||
@ -13,8 +12,8 @@ type Client struct {
|
||||
Name string `json:"name"`
|
||||
Email string `json:"email"`
|
||||
Enable bool `json:"enable"`
|
||||
AllowedIPs string `json:"allowedIPs"`
|
||||
Address string `json:"address"`
|
||||
AllowedIPs []string `json:"allowedIPs"`
|
||||
Address []string `json:"address"`
|
||||
PrivateKey string `json:"privateKey"`
|
||||
PublicKey string `json:"publicKey"`
|
||||
Created time.Time `json:"created"`
|
||||
@ -41,22 +40,22 @@ func (a Client) IsValid() []error {
|
||||
errs = append(errs, fmt.Errorf("email %s is invalid", a.Email))
|
||||
}
|
||||
// check if the allowedIPs empty
|
||||
if a.AllowedIPs == "" {
|
||||
if len(a.AllowedIPs) == 0 {
|
||||
errs = append(errs, fmt.Errorf("allowedIPs field is required"))
|
||||
}
|
||||
// check if the allowedIPs are valid
|
||||
for _, allowedIP := range strings.Split(a.AllowedIPs, ",") {
|
||||
if !util.IsValidCidr(strings.TrimSpace(allowedIP)) {
|
||||
for _, allowedIP := range a.AllowedIPs {
|
||||
if !util.IsValidCidr(allowedIP) {
|
||||
errs = append(errs, fmt.Errorf("allowedIP %s is invalid", allowedIP))
|
||||
}
|
||||
}
|
||||
// check if the address empty
|
||||
if a.Address == "" {
|
||||
if len(a.Address) == 0 {
|
||||
errs = append(errs, fmt.Errorf("address field is required"))
|
||||
}
|
||||
// check if the address are valid
|
||||
for _, address := range strings.Split(a.Address, ",") {
|
||||
if !util.IsValidCidr(strings.TrimSpace(address)) {
|
||||
for _, address := range a.Address {
|
||||
if !util.IsValidCidr(address) {
|
||||
errs = append(errs, fmt.Errorf("address %s is invalid", address))
|
||||
}
|
||||
}
|
||||
|
@ -3,21 +3,20 @@ package model
|
||||
import (
|
||||
"fmt"
|
||||
"gitlab.127-0-0-1.fr/vx3r/wg-gen-web/util"
|
||||
"strings"
|
||||
"time"
|
||||
)
|
||||
|
||||
// Server structure
|
||||
type Server struct {
|
||||
Name string `json:"name"`
|
||||
Address string `json:"address"`
|
||||
Address []string `json:"address"`
|
||||
ListenPort int `json:"listenPort"`
|
||||
Mtu int `json:"mtu"`
|
||||
PrivateKey string `json:"privateKey"`
|
||||
PublicKey string `json:"publicKey"`
|
||||
PresharedKey string `json:"presharedKey"`
|
||||
Endpoint string `json:"endpoint"`
|
||||
PersistentKeepalive int `json:"persistentKeepalive"`
|
||||
Dns string `json:"dns"`
|
||||
Dns []string `json:"dns"`
|
||||
PreUp string `json:"preUp"`
|
||||
PostUp string `json:"postUp"`
|
||||
PreDown string `json:"preDown"`
|
||||
@ -29,21 +28,13 @@ type Server struct {
|
||||
func (a Server) IsValid() []error {
|
||||
errs := make([]error, 0)
|
||||
|
||||
// check if the name empty
|
||||
if a.Name == "" {
|
||||
errs = append(errs, fmt.Errorf("name is required"))
|
||||
}
|
||||
// check the name field is between 3 to 40 chars
|
||||
if len(a.Name) < 2 || len(a.Name) > 40 {
|
||||
errs = append(errs, fmt.Errorf("name must be between 2-40 chars"))
|
||||
}
|
||||
// check if the address empty
|
||||
if a.Address == "" {
|
||||
if len(a.Address) == 0 {
|
||||
errs = append(errs, fmt.Errorf("address is required"))
|
||||
}
|
||||
// check if the address are valid
|
||||
for _, address := range strings.Split(a.Address, ",") {
|
||||
if !util.IsValidCidr(strings.TrimSpace(address)) {
|
||||
for _, address := range a.Address {
|
||||
if !util.IsValidCidr(address) {
|
||||
errs = append(errs, fmt.Errorf("address %s is invalid", address))
|
||||
}
|
||||
}
|
||||
@ -59,13 +50,13 @@ func (a Server) IsValid() []error {
|
||||
if a.PersistentKeepalive < 0 {
|
||||
errs = append(errs, fmt.Errorf("persistentKeepalive %d is invalid", a.PersistentKeepalive))
|
||||
}
|
||||
// check if the dns empty
|
||||
if a.Dns == "" {
|
||||
errs = append(errs, fmt.Errorf("dns is required"))
|
||||
// check if the mtu is valid
|
||||
if a.Mtu < 0 {
|
||||
errs = append(errs, fmt.Errorf("MTU %d is invalid", a.PersistentKeepalive))
|
||||
}
|
||||
// check if the address are valid
|
||||
for _, dns := range strings.Split(a.Dns, ",") {
|
||||
if !util.IsValidIp(strings.TrimSpace(dns)) {
|
||||
for _, dns := range a.Dns {
|
||||
if !util.IsValidIp(dns) {
|
||||
errs = append(errs, fmt.Errorf("dns %s is invalid", dns))
|
||||
}
|
||||
}
|
||||
|
@ -197,45 +197,54 @@ var (
|
||||
</html>
|
||||
`
|
||||
|
||||
clientTpl = `
|
||||
[Interface]
|
||||
Address = {{.Client.Address}}
|
||||
PrivateKey = {{.Client.PrivateKey}}
|
||||
DNS = {{.Server.Dns}}
|
||||
clientTpl = `[Interface]
|
||||
Address = {{ StringsJoin .Client.Address ", " }}
|
||||
PrivateKey = {{ .Client.PrivateKey }}
|
||||
{{ if ne (len .Server.Dns) 0 -}}
|
||||
DNS = {{ StringsJoin .Server.Dns ", " }}
|
||||
{{- end }}
|
||||
{{ if ne .Server.Mtu 0 -}}
|
||||
MTU = {{.Server.Mtu}}
|
||||
{{- end}}
|
||||
[Peer]
|
||||
PublicKey = {{.Server.PublicKey}}
|
||||
PresharedKey = {{.Server.PresharedKey}}
|
||||
AllowedIPs = {{.Client.AllowedIPs}}
|
||||
Endpoint = {{.Server.Endpoint}}
|
||||
PersistentKeepalive = {{.Server.PersistentKeepalive}}`
|
||||
PublicKey = {{ .Server.PublicKey }}
|
||||
PresharedKey = {{ .Server.PresharedKey }}
|
||||
AllowedIPs = {{ StringsJoin .Client.AllowedIPs ", " }}
|
||||
Endpoint = {{ .Server.Endpoint }}
|
||||
{{ if ne .Server.PersistentKeepalive 0 -}}
|
||||
PersistentKeepalive = {{.Server.PersistentKeepalive}}
|
||||
{{- end}}
|
||||
`
|
||||
|
||||
wgTpl = `
|
||||
# {{.Server.Name}} / Updated: {{.Server.Updated}} / Created: {{.Server.Created}}
|
||||
wgTpl = `# Updated: {{ .Server.Updated }} / Created: {{ .Server.Created }}
|
||||
[Interface]
|
||||
{{range .ServerAdresses}}
|
||||
Address = {{.}}
|
||||
{{end}}
|
||||
ListenPort = {{.Server.ListenPort}}
|
||||
PrivateKey = {{.Server.PrivateKey}}
|
||||
PreUp = {{.Server.PreUp}}
|
||||
PostUp = {{.Server.PostUp}}
|
||||
PreDown = {{.Server.PreDown}}
|
||||
PostDown = {{.Server.PostDown}}
|
||||
{{$server := .Server}}
|
||||
{{range .Clients}}
|
||||
{{if .Enable}}
|
||||
{{- range .Server.Address }}
|
||||
Address = {{ . }}
|
||||
{{- end }}
|
||||
ListenPort = {{ .Server.ListenPort }}
|
||||
PrivateKey = {{ .Server.PrivateKey }}
|
||||
{{ if ne .Server.Mtu 0 -}}
|
||||
MTU = {{.Server.Mtu}}
|
||||
{{- end}}
|
||||
PreUp = {{ .Server.PreUp }}
|
||||
PostUp = {{ .Server.PostUp }}
|
||||
PreDown = {{ .Server.PreDown }}
|
||||
PostDown = {{ .Server.PostDown }}
|
||||
{{ $server := .Server }}
|
||||
{{- range .Clients }}
|
||||
{{ if .Enable -}}
|
||||
# {{.Name}} / {{.Email}} / Updated: {{.Updated}} / Created: {{.Created}}
|
||||
[Peer]
|
||||
PublicKey = {{.PublicKey}}
|
||||
PresharedKey = {{$server.PresharedKey}}
|
||||
AllowedIPs = {{.Address}}
|
||||
{{end}}
|
||||
{{end}}`
|
||||
PublicKey = {{ .PublicKey }}
|
||||
PresharedKey = {{ $server.PresharedKey }}
|
||||
AllowedIPs = {{ StringsJoin .Address ", " }}
|
||||
{{- end }}
|
||||
{{ end }}`
|
||||
)
|
||||
|
||||
// DumpClientWg dump client wg config with go template
|
||||
func DumpClientWg(client *model.Client, server *model.Server) ([]byte, error) {
|
||||
t, err := template.New("client").Parse(clientTpl)
|
||||
t, err := template.New("client").Funcs(template.FuncMap{"StringsJoin": strings.Join}).Parse(clientTpl)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
@ -251,19 +260,17 @@ func DumpClientWg(client *model.Client, server *model.Server) ([]byte, error) {
|
||||
|
||||
// DumpServerWg dump server wg config with go template, write it to file and return bytes
|
||||
func DumpServerWg(clients []*model.Client, server *model.Server) ([]byte, error) {
|
||||
t, err := template.New("server").Parse(wgTpl)
|
||||
t, err := template.New("server").Funcs(template.FuncMap{"StringsJoin": strings.Join}).Parse(wgTpl)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
configDataWg, err := dump(t, struct {
|
||||
Clients []*model.Client
|
||||
Server *model.Server
|
||||
ServerAdresses []string
|
||||
Clients []*model.Client
|
||||
Server *model.Server
|
||||
}{
|
||||
ServerAdresses: strings.Split(server.Address, ","),
|
||||
Clients: clients,
|
||||
Server: server,
|
||||
Clients: clients,
|
||||
Server: server,
|
||||
})
|
||||
if err != nil {
|
||||
return nil, err
|
||||
|
33
ui/package-lock.json
generated
33
ui/package-lock.json
generated
@ -3561,12 +3561,14 @@
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
@ -3581,17 +3583,20 @@
|
||||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
@ -3708,7 +3713,8 @@
|
||||
"inherits": {
|
||||
"version": "2.0.4",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
@ -3720,6 +3726,7 @@
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
@ -3734,6 +3741,7 @@
|
||||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
@ -3741,12 +3749,14 @@
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.9.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.2",
|
||||
"yallist": "^3.0.0"
|
||||
@ -3765,6 +3775,7 @@
|
||||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
@ -3854,7 +3865,8 @@
|
||||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
@ -3866,6 +3878,7 @@
|
||||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
@ -3987,6 +4000,7 @@
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
@ -8920,11 +8934,6 @@
|
||||
"moment": "^2.19.2"
|
||||
}
|
||||
},
|
||||
"vue-plugin-axios": {
|
||||
"version": "1.0.14",
|
||||
"resolved": "https://registry.npmjs.org/vue-plugin-axios/-/vue-plugin-axios-1.0.14.tgz",
|
||||
"integrity": "sha512-hpFdi17XsSdYQnrlHrml4BnmH9ceJSkpCoMGbPCz5vfDoY7okWuzKgeKK44NgRlZzlUCrq7ug3fGLZ2nv/qNNA=="
|
||||
},
|
||||
"vue-router": {
|
||||
"version": "3.1.5",
|
||||
"resolved": "https://registry.npm.taobao.org/vue-router/download/vue-router-3.1.5.tgz",
|
||||
|
@ -12,7 +12,6 @@
|
||||
"moment": "^2.24.0",
|
||||
"vue": "^2.6.10",
|
||||
"vue-moment": "^4.1.0",
|
||||
"vue-plugin-axios": "^1.0.14",
|
||||
"vue-router": "^3.1.3",
|
||||
"vuetify": "^2.1.0"
|
||||
},
|
||||
|
449
ui/src/components/Clients.vue
Normal file
449
ui/src/components/Clients.vue
Normal file
@ -0,0 +1,449 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Clients</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
<v-btn
|
||||
color="success"
|
||||
@click="startAddClient"
|
||||
>
|
||||
Add new client
|
||||
<v-icon right dark>mdi-account-multiple-plus-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-list-item>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(client, i) in clients"
|
||||
:key="i"
|
||||
cols="6"
|
||||
>
|
||||
<v-card
|
||||
:color="client.enable ? '#1F7087' : 'warning'"
|
||||
class="mx-auto"
|
||||
raised
|
||||
shaped
|
||||
>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">{{ client.name }}</v-list-item-title>
|
||||
<v-list-item-subtitle>{{ client.email }}</v-list-item-subtitle>
|
||||
<v-list-item-subtitle>Created: {{ client.created | formatDate }}</v-list-item-subtitle>
|
||||
<v-list-item-subtitle>Updated: {{ client.updated | formatDate }}</v-list-item-subtitle>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-item-avatar
|
||||
tile
|
||||
size="150"
|
||||
>
|
||||
<v-img :src="`${apiBaseUrl}/client/${client.id}/config?qrcode=true`"/>
|
||||
</v-list-item-avatar>
|
||||
</v-list-item>
|
||||
|
||||
<v-card-text class="text--primary">
|
||||
<v-chip
|
||||
v-for="(ip, i) in client.address"
|
||||
:key="i"
|
||||
color="indigo"
|
||||
text-color="white"
|
||||
>
|
||||
<v-icon left>mdi-ip-network</v-icon>
|
||||
{{ ip }}
|
||||
</v-chip>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-btn
|
||||
text
|
||||
:href="`${apiBaseUrl}/client/${client.id}/config?qrcode=false`"
|
||||
>
|
||||
Download
|
||||
<v-icon right dark>mdi-cloud-download-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click.stop="startUpdateClient(client)"
|
||||
>
|
||||
Edit
|
||||
<v-icon right dark>mdi-square-edit-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click="deleteClient(client)"
|
||||
>
|
||||
Delete
|
||||
<v-icon right dark>mdi-trash-can-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click="sendEmailClient(client.id)"
|
||||
>
|
||||
Send email
|
||||
<v-icon right dark>mdi-email-send-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-spacer/>
|
||||
<v-tooltip right>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-switch
|
||||
dark
|
||||
v-on="on"
|
||||
color="success"
|
||||
v-model="client.enable"
|
||||
v-on:change="updateClient(client)"
|
||||
/>
|
||||
</template>
|
||||
<span> {{client.enable ? 'Disable' : 'Enable'}} this client</span>
|
||||
</v-tooltip>
|
||||
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-dialog
|
||||
v-if="client"
|
||||
v-model="dialogAddClient"
|
||||
max-width="550"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Add new client</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
>
|
||||
<v-form
|
||||
ref="form"
|
||||
v-model="valid"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="client.name"
|
||||
label="Client friendly name"
|
||||
:rules="[
|
||||
v => !!v || 'Client name is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="client.email"
|
||||
label="Client email"
|
||||
:rules="[
|
||||
v => !!v || 'E-mail is required',
|
||||
v => /.+@.+\..+/.test(v) || 'E-mail must be valid',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-select
|
||||
v-model="client.address"
|
||||
:items="server.address"
|
||||
label="Client IP will be chosen from these networks"
|
||||
:rules="[
|
||||
v => !!v || 'Network is required',
|
||||
]"
|
||||
multiple
|
||||
chips
|
||||
persistent-hint
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="client.allowedIPs"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Allowed IPs"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.allowedIPs.splice(client.allowedIPs.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
|
||||
<v-switch
|
||||
v-model="client.enable"
|
||||
color="red"
|
||||
inset
|
||||
:label="client.enable ? 'Enable client after creation': 'Disable client after creation'"
|
||||
/>
|
||||
</v-form>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer/>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
color="success"
|
||||
@click="addClient(client)"
|
||||
>
|
||||
Submit
|
||||
<v-icon right dark>mdi-check-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="dialogAddClient = false"
|
||||
>
|
||||
Cancel
|
||||
<v-icon right dark>mdi-close-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<v-dialog
|
||||
v-if="client"
|
||||
v-model="dialogEditClient"
|
||||
max-width="550"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Edit client</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
>
|
||||
<v-form
|
||||
ref="form"
|
||||
v-model="valid"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="client.name"
|
||||
label="Friendly name"
|
||||
:rules="[
|
||||
v => !!v || 'Client name is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="client.email"
|
||||
label="Email"
|
||||
:rules="[
|
||||
v => !!v || 'Email is required',
|
||||
v => /.+@.+\..+/.test(v) || 'Email must be valid',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="client.address"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Addresses"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.address.splice(client.address.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
<v-combobox
|
||||
v-model="client.allowedIPs"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Allowed IPs"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.allowedIPs.splice(client.allowedIPs.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
</v-form>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer/>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
color="success"
|
||||
@click="updateClient(client)"
|
||||
>
|
||||
Submit
|
||||
<v-icon right dark>mdi-check-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="dialogEditClient = false"
|
||||
>
|
||||
Cancel
|
||||
<v-icon right dark>mdi-close-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<Notification v-bind:notification="notification"/>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
import {ApiService, API_BASE_URL} from '../services/ApiService'
|
||||
import Notification from '../components/Notification'
|
||||
|
||||
export default {
|
||||
name: 'Clients',
|
||||
|
||||
components: {
|
||||
Notification
|
||||
},
|
||||
|
||||
data: () => ({
|
||||
api: null,
|
||||
apiBaseUrl: API_BASE_URL,
|
||||
clients: [],
|
||||
notification: {
|
||||
show: false,
|
||||
color: '',
|
||||
text: '',
|
||||
},
|
||||
dialogAddClient: false,
|
||||
dialogEditClient: false,
|
||||
client: null,
|
||||
server: null,
|
||||
valid: false,
|
||||
}),
|
||||
|
||||
mounted () {
|
||||
this.api = new ApiService();
|
||||
this.getClients();
|
||||
this.getServer()
|
||||
},
|
||||
|
||||
methods: {
|
||||
getClients() {
|
||||
this.api.get('/client').then((res) => {
|
||||
this.clients = res
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
|
||||
getServer() {
|
||||
this.api.get('/server').then((res) => {
|
||||
this.server = res;
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
|
||||
startAddClient() {
|
||||
this.dialogAddClient = true;
|
||||
this.client = {
|
||||
name: "",
|
||||
email: "",
|
||||
enable: true,
|
||||
allowedIPs: ["0.0.0.0/0", "::/0"],
|
||||
address: this.server.address,
|
||||
}
|
||||
},
|
||||
addClient(client) {
|
||||
if (client.allowedIPs.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client allowed IPs');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.allowedIPs.length; i++){
|
||||
if (this.$isCidr(client.allowedIPs[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
this.dialogAddClient = false;
|
||||
|
||||
this.api.post('/client', client).then((res) => {
|
||||
this.notify('success', `Client ${res.name} successfully added`);
|
||||
this.getClients()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
|
||||
deleteClient(client) {
|
||||
if(confirm(`Do you really want to delete ${client.name} ?`)){
|
||||
this.api.delete(`/client/${client.id}`).then((res) => {
|
||||
this.notify('success', "Client successfully deleted");
|
||||
this.getClients()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
sendEmailClient(id) {
|
||||
this.api.get(`/client/${id}/email`).then((res) => {
|
||||
this.notify('success', "Email successfully sent");
|
||||
this.getClients()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
|
||||
startUpdateClient(client) {
|
||||
this.client = client;
|
||||
this.dialogEditClient = true;
|
||||
},
|
||||
updateClient(client) {
|
||||
// check allowed IPs
|
||||
if (client.allowedIPs.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client allowed IPs');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.allowedIPs.length; i++){
|
||||
if (this.$isCidr(client.allowedIPs[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
// check address
|
||||
if (client.address.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.address.length; i++){
|
||||
if (this.$isCidr(client.address[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
// all good, submit
|
||||
this.dialogEditClient = false;
|
||||
|
||||
this.api.patch(`/client/${client.id}`, client).then((res) => {
|
||||
this.notify('success', `Client ${res.name} successfully updated`);
|
||||
this.getClients()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
|
||||
notify(color, msg) {
|
||||
this.notification.show = true;
|
||||
this.notification.color = color;
|
||||
this.notification.text = msg;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
25
ui/src/components/Notification.vue
Normal file
25
ui/src/components/Notification.vue
Normal file
@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<v-snackbar
|
||||
v-model="notification.show"
|
||||
:right="true"
|
||||
:top="true"
|
||||
:color="notification.color"
|
||||
>
|
||||
{{ notification.text }}
|
||||
<v-btn
|
||||
dark
|
||||
text
|
||||
@click="notification.show = false"
|
||||
>
|
||||
Close
|
||||
</v-btn>
|
||||
</v-snackbar>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'Notification',
|
||||
props: ['notification'],
|
||||
data: () => ({
|
||||
}),
|
||||
};
|
||||
</script>
|
230
ui/src/components/Server.vue
Normal file
230
ui/src/components/Server.vue
Normal file
@ -0,0 +1,230 @@
|
||||
<template>
|
||||
<v-container v-if="server">
|
||||
<v-row>
|
||||
<v-col cols="6">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Server's interface configuration</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<div class="d-flex flex-no-wrap justify-space-between">
|
||||
<v-col cols="12">
|
||||
<v-text-field
|
||||
v-model="server.publicKey"
|
||||
label="Public key"
|
||||
disabled
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.presharedKey"
|
||||
label="Preshared key"
|
||||
disabled
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.listenPort"
|
||||
type="number"
|
||||
:rules="[
|
||||
v => !!v || 'Listen port is required',
|
||||
]"
|
||||
label="Listen port"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="server.address"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Server interface addresses"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="server.address.splice(server.address.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
</v-col>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Client's global configuration</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<div class="d-flex flex-no-wrap justify-space-between">
|
||||
<v-col cols="12">
|
||||
<v-text-field
|
||||
v-model="server.endpoint"
|
||||
label="Public endpoint for clients to connect to"
|
||||
:rules="[
|
||||
v => !!v || 'Public endpoint for clients to connect to is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="server.dns"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 address and hit enter"
|
||||
label="DNS servers for clients"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="server.dns.splice(server.dns.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
<v-text-field
|
||||
type="number"
|
||||
v-model="server.mtu"
|
||||
label="Define global MTU"
|
||||
hint="Leave at 0 and let wg-quick take care of MTU"
|
||||
/>
|
||||
<v-text-field
|
||||
type="number"
|
||||
v-model="server.persistentKeepalive"
|
||||
label="Persistent keepalive"
|
||||
hint="Leave at 0 if you dont want to specify persistent keepalive"
|
||||
/>
|
||||
</v-col>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Interface configuration hooks</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<div class="d-flex flex-no-wrap justify-space-between">
|
||||
<v-col cols="12">
|
||||
<v-text-field
|
||||
v-model="server.preUp"
|
||||
label="PreUp: script snippets which will be executed by bash before setting up the interface"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.postUp"
|
||||
label="PostUp: script snippets which will be executed by bash after setting up the interface"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.preDown"
|
||||
label="PreDown: script snippets which will be executed by bash before setting down the interface"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.postDown "
|
||||
label="PostDown : script snippets which will be executed by bash after setting down the interface"
|
||||
/>
|
||||
</v-col>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-divider dark/>
|
||||
<v-divider dark/>
|
||||
<v-row justify="center">
|
||||
<v-btn
|
||||
class="ma-2"
|
||||
color="warning"
|
||||
@click="updateServer"
|
||||
>
|
||||
Update server configuration
|
||||
<v-icon right dark>mdi-update</v-icon>
|
||||
</v-btn>
|
||||
</v-row>
|
||||
<Notification v-bind:notification="notification"/>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
import {ApiService} from "../services/ApiService";
|
||||
import Notification from '../components/Notification'
|
||||
|
||||
export default {
|
||||
name: 'Server',
|
||||
|
||||
components: {
|
||||
Notification
|
||||
},
|
||||
|
||||
data: () => ({
|
||||
api: null,
|
||||
server: null,
|
||||
notification: {
|
||||
show: false,
|
||||
color: '',
|
||||
text: '',
|
||||
},
|
||||
}),
|
||||
|
||||
mounted () {
|
||||
this.api = new ApiService();
|
||||
this.getServer()
|
||||
},
|
||||
|
||||
methods: {
|
||||
getServer() {
|
||||
this.api.get('/server').then((res) => {
|
||||
this.server = res;
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
updateServer () {
|
||||
// convert int values
|
||||
this.server.listenPort = parseInt(this.server.listenPort, 10);
|
||||
this.server.persistentKeepalive = parseInt(this.server.persistentKeepalive, 10);
|
||||
this.server.mtu = parseInt(this.server.mtu, 10);
|
||||
|
||||
// check server addresses
|
||||
if (this.server.address.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for server interface');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < this.server.address.length; i++){
|
||||
if (this.$isCidr(this.server.address[i]) === 0) {
|
||||
this.notify('error', `Invalid CIDR detected, please correct ${this.server.address[i]} before submitting`);
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
// check DNS correct
|
||||
for (let i = 0; i < this.server.dns.length; i++){
|
||||
if (this.$isCidr(this.server.dns[i] + '/32') === 0) {
|
||||
this.notify('error', `Invalid IP detected, please correct ${this.server.dns[i]} before submitting`);
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.api.patch('/server', this.server).then((res) => {
|
||||
this.notify('success', "Server successfully updated");
|
||||
this.server = res;
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
notify(color, msg) {
|
||||
this.notification.show = true;
|
||||
this.notification.color = color;
|
||||
this.notification.text = msg;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
@ -2,7 +2,6 @@ import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import vuetify from './plugins/vuetify';
|
||||
import './plugins/axios';
|
||||
import './plugins/moment';
|
||||
import './plugins/cidr'
|
||||
|
||||
|
@ -1,13 +0,0 @@
|
||||
import Vue from 'vue'
|
||||
import VueAxios from 'vue-plugin-axios'
|
||||
import axios from 'axios'
|
||||
|
||||
export const myVar = 'This is my variable'
|
||||
|
||||
// https://www.npmjs.com/package/vue-cli-plugin-vuetify
|
||||
Vue.use(VueAxios, {
|
||||
axios,
|
||||
config: {
|
||||
baseURL: process.env.VUE_APP_API_BASE_URL || '/api/v1.0',
|
||||
},
|
||||
});
|
@ -2,7 +2,7 @@ import Vue from 'vue'
|
||||
import moment from 'moment';
|
||||
import VueMoment from 'vue-moment'
|
||||
|
||||
moment.locale('es');
|
||||
moment.locale('en');
|
||||
|
||||
Vue.use(VueMoment, {
|
||||
moment
|
||||
|
40
ui/src/services/ApiService.js
Normal file
40
ui/src/services/ApiService.js
Normal file
@ -0,0 +1,40 @@
|
||||
import axios from 'axios'
|
||||
|
||||
let baseUrl = "/api/v1.0";
|
||||
if (process.env.NODE_ENV === "development"){
|
||||
baseUrl = process.env.VUE_APP_API_BASE_URL
|
||||
}
|
||||
|
||||
export const API_BASE_URL = baseUrl;
|
||||
|
||||
export class ApiService {
|
||||
get(resource) {
|
||||
return axios
|
||||
.get(`${API_BASE_URL}${resource}`)
|
||||
.then(response => response.data)
|
||||
};
|
||||
|
||||
post(resource, data) {
|
||||
return axios
|
||||
.post(`${API_BASE_URL}${resource}`, data)
|
||||
.then(response => response.data)
|
||||
};
|
||||
|
||||
put(resource, data) {
|
||||
return axios
|
||||
.put(`${API_BASE_URL}${resource}`, data)
|
||||
.then(response => response.data)
|
||||
};
|
||||
|
||||
patch(resource, data) {
|
||||
return axios
|
||||
.patch(`${API_BASE_URL}${resource}`, data)
|
||||
.then(response => response.data)
|
||||
};
|
||||
|
||||
delete(resource) {
|
||||
return axios
|
||||
.delete(`${API_BASE_URL}${resource}`)
|
||||
.then(response => response.data)
|
||||
};
|
||||
}
|
@ -1,638 +1,19 @@
|
||||
<template>
|
||||
<v-content>
|
||||
<v-row v-if="server">
|
||||
<v-col cols="12">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Server configurations</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<div class="d-flex flex-no-wrap justify-space-between">
|
||||
<v-col cols="6">
|
||||
<v-text-field
|
||||
v-model="server.name"
|
||||
:rules="[
|
||||
v => !!v || 'Friendly name is required',
|
||||
]"
|
||||
label="Friendly name"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
type="number"
|
||||
v-model="server.persistentKeepalive"
|
||||
label="Persistent keepalive"
|
||||
:rules="[
|
||||
v => !!v || 'Persistent keepalive is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.endpoint"
|
||||
label="Public endpoint for clients to connect to"
|
||||
:rules="[
|
||||
v => !!v || 'Public endpoint for clients to connect to is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="server.address"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Server interface addresses"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="server.address.splice(server.address.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
<v-text-field
|
||||
v-model="server.preUp"
|
||||
label="PreUp: script snippets which will be executed by bash before setting up the interface"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.postUp"
|
||||
label="PostUp: script snippets which will be executed by bash after setting up the interface"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<v-text-field
|
||||
v-model="server.publicKey"
|
||||
label="Public key"
|
||||
disabled
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.presharedKey"
|
||||
label="Preshared key"
|
||||
disabled
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.listenPort"
|
||||
type="number"
|
||||
:rules="[
|
||||
v => !!v || 'Listen port is required',
|
||||
]"
|
||||
label="Listen port"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="server.dns"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 address and hit enter"
|
||||
label="DNS servers for clients"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="server.dns.splice(server.dns.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
<v-text-field
|
||||
v-model="server.preDown"
|
||||
label="PreDown: script snippets which will be executed by bash before setting down the interface"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="server.postDown "
|
||||
label="PostDown : script snippets which will be executed by bash after setting down the interface"
|
||||
/>
|
||||
</v-col>
|
||||
</div>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer/>
|
||||
<v-btn
|
||||
class="ma-2"
|
||||
color="warning"
|
||||
@click="updateServer"
|
||||
>
|
||||
Update server configuration
|
||||
<v-icon right dark>mdi-update</v-icon>
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-divider dark/>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-card dark>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">Clients</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
<v-btn
|
||||
color="success"
|
||||
@click.stop="startAddClient"
|
||||
>
|
||||
Add new client
|
||||
<v-icon right dark>mdi-account-multiple-plus-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-list-item>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(client, i) in clients"
|
||||
:key="i"
|
||||
cols="6"
|
||||
>
|
||||
<v-card
|
||||
:color="client.enable ? '#1F7087' : 'warning'"
|
||||
class="mx-auto"
|
||||
raised
|
||||
shaped
|
||||
>
|
||||
<v-list-item>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="headline">{{ client.name }}</v-list-item-title>
|
||||
<v-list-item-subtitle>{{ client.email }}</v-list-item-subtitle>
|
||||
<v-list-item-subtitle>Created: {{ client.created | formatDate }}</v-list-item-subtitle>
|
||||
<v-list-item-subtitle>Updated: {{ client.updated | formatDate }}</v-list-item-subtitle>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-item-avatar
|
||||
tile
|
||||
size="150"
|
||||
>
|
||||
<v-img :src="getUrlToConfig(client.id, true)"/>
|
||||
</v-list-item-avatar>
|
||||
</v-list-item>
|
||||
|
||||
<v-card-text class="text--primary">
|
||||
<v-chip
|
||||
v-for="(ip, i) in client.address.split(',')"
|
||||
:key="i"
|
||||
color="indigo"
|
||||
text-color="white"
|
||||
>
|
||||
<v-icon left>mdi-ip-network</v-icon>
|
||||
{{ ip }}
|
||||
</v-chip>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-btn
|
||||
text
|
||||
:href="getUrlToConfig(client.id, false)"
|
||||
>
|
||||
Download
|
||||
<v-icon right dark>mdi-cloud-download-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click.stop="editClient(client.id)"
|
||||
>
|
||||
Edit
|
||||
<v-icon right dark>mdi-square-edit-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click="deleteClient(client.id)"
|
||||
>
|
||||
Delete
|
||||
<v-icon right dark>mdi-trash-can-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
text
|
||||
@click="sendEmailClient(client.id)"
|
||||
>
|
||||
Send email
|
||||
<v-icon right dark>mdi-email-send-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-spacer/>
|
||||
<v-tooltip right>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-switch
|
||||
dark
|
||||
v-on="on"
|
||||
color="success"
|
||||
v-model="client.enable"
|
||||
v-on:change="disableClient(client)"
|
||||
/>
|
||||
</template>
|
||||
<span> {{client.enable ? 'Disable' : 'Enable'}} this client</span>
|
||||
</v-tooltip>
|
||||
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-dialog
|
||||
v-if="client"
|
||||
v-model="dialogAddClient"
|
||||
max-width="550"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Add new client</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
>
|
||||
<v-form
|
||||
ref="form"
|
||||
v-model="valid"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="client.name"
|
||||
label="Client friendly name"
|
||||
:rules="[
|
||||
v => !!v || 'Client name is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="client.email"
|
||||
label="Client email"
|
||||
:rules="[
|
||||
v => !!v || 'E-mail is required',
|
||||
v => /.+@.+\..+/.test(v) || 'E-mail must be valid',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-select
|
||||
v-model="clientAddress"
|
||||
:items="serverAddress"
|
||||
label="Client IP will be chosen from these networks"
|
||||
:rules="[
|
||||
v => !!v || 'Network is required',
|
||||
]"
|
||||
multiple
|
||||
chips
|
||||
persistent-hint
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="client.allowedIPs"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Allowed IPs"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.allowedIPs.splice(client.allowedIPs.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
|
||||
<v-switch
|
||||
v-model="client.enable"
|
||||
color="red"
|
||||
inset
|
||||
:label="client.enable ? 'Enable client after creation': 'Disable client after creation'"
|
||||
/>
|
||||
</v-form>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer/>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
color="success"
|
||||
@click="addClient(client)"
|
||||
>
|
||||
Submit
|
||||
<v-icon right dark>mdi-check-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="dialogAddClient = false"
|
||||
>
|
||||
Cancel
|
||||
<v-icon right dark>mdi-close-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<v-dialog
|
||||
v-if="client"
|
||||
v-model="dialogEditClient"
|
||||
max-width="550"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">Edit client</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
>
|
||||
<v-form
|
||||
ref="form"
|
||||
v-model="valid"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="client.name"
|
||||
label="Friendly name"
|
||||
:rules="[
|
||||
v => !!v || 'Client name is required',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="client.email"
|
||||
label="Email"
|
||||
:rules="[
|
||||
v => !!v || 'Email is required',
|
||||
v => /.+@.+\..+/.test(v) || 'Email must be valid',
|
||||
]"
|
||||
required
|
||||
/>
|
||||
<v-combobox
|
||||
v-model="client.address"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Addresses"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.address.splice(client.address.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
<v-combobox
|
||||
v-model="client.allowedIPs"
|
||||
chips
|
||||
hint="Write IPv4 or IPv6 CIDR and hit enter"
|
||||
label="Allowed IPs"
|
||||
multiple
|
||||
dark
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="client.allowedIPs.splice(client.allowedIPs.indexOf(item), 1)"
|
||||
>
|
||||
<strong>{{ item }}</strong>
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
</v-form>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer/>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
color="success"
|
||||
@click="updateClient(client)"
|
||||
>
|
||||
Submit
|
||||
<v-icon right dark>mdi-check-outline</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="dialogEditClient = false"
|
||||
>
|
||||
Cancel
|
||||
<v-icon right dark>mdi-close-circle-outline</v-icon>
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<v-snackbar
|
||||
v-model="notification.show"
|
||||
:right="true"
|
||||
:top="true"
|
||||
:color="notification.color"
|
||||
>
|
||||
{{ notification.text }}
|
||||
<v-btn
|
||||
dark
|
||||
text
|
||||
@click="notification.show = false"
|
||||
>
|
||||
Close
|
||||
</v-btn>
|
||||
</v-snackbar>
|
||||
<Server/>
|
||||
<Clients/>
|
||||
</v-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Server from '../components/Server'
|
||||
import Clients from '../components/Clients'
|
||||
|
||||
export default {
|
||||
name: 'home',
|
||||
mounted () {
|
||||
this.getData()
|
||||
},
|
||||
data: () => ({
|
||||
notification: {
|
||||
show: false,
|
||||
color: '',
|
||||
text: '',
|
||||
},
|
||||
valid: true,
|
||||
checkbox: false,
|
||||
server: null,
|
||||
clients: [],
|
||||
ipDns: "",
|
||||
ipAddress: "",
|
||||
clientAddress: [],
|
||||
serverAddress: [],
|
||||
dialogAddClient: false,
|
||||
dialogEditClient: false,
|
||||
client: null,
|
||||
}),
|
||||
methods: {
|
||||
startAddClient() {
|
||||
this.dialogAddClient = true;
|
||||
this.client = {
|
||||
name: "",
|
||||
email: "",
|
||||
enable: true,
|
||||
allowedIPs: ["0.0.0.0/0", "::/0"],
|
||||
address: "",
|
||||
}
|
||||
},
|
||||
editClient(id) {
|
||||
this.$get(`/client/${id}`).then((res) => {
|
||||
this.dialogEditClient = true;
|
||||
res.allowedIPs = res.allowedIPs.split(',');
|
||||
res.address = res.address.split(',');
|
||||
this.client = res
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
disableClient(client) {
|
||||
if(!Array.isArray(client.allowedIPs)){
|
||||
client.allowedIPs = client.allowedIPs.split(',');
|
||||
}
|
||||
if(!Array.isArray(client.address)){
|
||||
client.address = client.address.split(',');
|
||||
}
|
||||
this.updateClient(client)
|
||||
},
|
||||
getData() {
|
||||
this.$get('/server').then((res) => {
|
||||
res.address = res.address.split(',');
|
||||
res.dns = res.dns.split(',');
|
||||
this.server = res;
|
||||
this.clientAddress = this.serverAddress = this.server.address
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
|
||||
this.$get('/client').then((res) => {
|
||||
this.clients = res
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
updateServer () {
|
||||
// convert int values
|
||||
this.server.listenPort = parseInt(this.server.listenPort, 10);
|
||||
this.server.persistentKeepalive = parseInt(this.server.persistentKeepalive, 10);
|
||||
// check server addresses
|
||||
if (this.server.address.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for server interface');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < this.server.address.length; i++){
|
||||
if (this.$isCidr(this.server.address[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
this.server.address = this.server.address.join(',');
|
||||
this.server.dns = this.server.dns.join(',');
|
||||
|
||||
this.$patch('/server', this.server).then((res) => {
|
||||
this.notify('success', "Server successfully updated");
|
||||
this.getData()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
addClient(client) {
|
||||
if (client.allowedIPs.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client allowed IPs');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.allowedIPs.length; i++){
|
||||
if (this.$isCidr(client.allowedIPs[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.dialogAddClient = false;
|
||||
client.address = this.clientAddress.join(',');
|
||||
client.allowedIPs = this.client.allowedIPs.join(',');
|
||||
|
||||
this.$post('/client', client).then((res) => {
|
||||
this.notify('success', "Client successfully added");
|
||||
this.getData()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
deleteClient(id) {
|
||||
if(confirm("Do you really want to delete?")){
|
||||
this.$delete(`/client/${id}`).then((res) => {
|
||||
this.notify('success', "Client successfully deleted");
|
||||
this.getData()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
}
|
||||
},
|
||||
sendEmailClient(id) {
|
||||
this.$get(`/client/${id}/email`).then((res) => {
|
||||
this.notify('success', "Email successfully sent");
|
||||
this.getData()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
getUrlToConfig(id, qrcode){
|
||||
let base = "/api/v1.0";
|
||||
if (process.env.NODE_ENV === "development"){
|
||||
base = process.env.VUE_APP_API_BASE_URL
|
||||
}
|
||||
if (qrcode){
|
||||
return `${base}/client/${id}/config?qrcode=true`
|
||||
} else {
|
||||
return `${base}/client/${id}/config`
|
||||
}
|
||||
},
|
||||
updateClient(client) {
|
||||
// check allowed IPs
|
||||
if (client.allowedIPs.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client allowed IPs');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.allowedIPs.length; i++){
|
||||
if (this.$isCidr(client.allowedIPs[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
// check address
|
||||
if (client.address.length < 1) {
|
||||
this.notify('error', 'Please provide at least one valid CIDR address for client');
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < client.address.length; i++){
|
||||
if (this.$isCidr(client.address[i]) === 0) {
|
||||
this.notify('error', 'Invalid CIDR detected, please correct before submitting');
|
||||
return
|
||||
}
|
||||
}
|
||||
// all good, submit
|
||||
this.dialogEditClient = false;
|
||||
client.allowedIPs = client.allowedIPs.join(',');
|
||||
client.address = client.address.join(',');
|
||||
|
||||
this.$patch(`/client/${client.id}`, client).then((res) => {
|
||||
this.notify('success', "Client successfully updated");
|
||||
this.getData()
|
||||
}).catch((e) => {
|
||||
this.notify('error', e.response.status + ' ' + e.response.statusText);
|
||||
});
|
||||
},
|
||||
notify(color, msg) {
|
||||
this.notification.show = true;
|
||||
this.notification.color = color;
|
||||
this.notification.text = msg;
|
||||
},
|
||||
|
||||
},
|
||||
components: {
|
||||
Server,
|
||||
Clients
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
Loading…
Reference in New Issue
Block a user