feat: added reload nginx button to header

Author: 0xJacky

frontend/src/api/ngx.ts

@@ -11,6 +11,10 @@ const ngx = {
 
     format_code(content: string) {
         return http.post('/ngx/format_code', {content})
+    },
+
+    reload() {
+        return http.post('/nginx/reload')
     }
 }
 

frontend/src/layouts/HeaderLayout.vue

@@ -3,8 +3,9 @@ import SetLanguage from '@/components/SetLanguage/SetLanguage.vue'
 import gettext from '@/gettext'
 import {message} from 'ant-design-vue'
 import auth from '@/api/auth'
-import {HomeOutlined, LogoutOutlined, MenuUnfoldOutlined} from '@ant-design/icons-vue'
+import {HomeOutlined, LogoutOutlined, MenuUnfoldOutlined, ReloadOutlined} from '@ant-design/icons-vue'
 import {useRouter} from 'vue-router'
+import ngx from '@/api/ngx'
 
 const {$gettext} = gettext
 
@@ -18,6 +19,13 @@ function logout() {
     })
 }
 
+function reload_nginx() {
+    ngx.reload().then(r => {
+        message.success($gettext('Nginx reloaded successfully'))
+    }).catch(e => {
+        message.error($gettext('Server error') + ' ' + e?.message)
+    })
+}
 </script>
 
 <template>
@@ -26,17 +34,29 @@ function logout() {
             <MenuUnfoldOutlined @click="$emit('clickUnFold')"/>
         </div>
 
-        <div class="user-wrapper">
+        <a-space class="user-wrapper" :size="24">
             <set-language class="set_lang"/>
 
             <a href="/">
                 <HomeOutlined/>
             </a>
 
-            <a @click="logout" style="margin-left: 20px">
+            <a-popconfirm
+                :title="$gettext('Do you want to reload Nginx?')"
+                :ok-text="$gettext('Yes')"
+                :cancel-text="$gettext('No')"
+                @confirm="reload_nginx"
+                placement="bottomRight"
+            >
+                <a>
+                    <ReloadOutlined/>
+                </a>
+            </a-popconfirm>
+
+            <a @click="logout">
                 <LogoutOutlined/>
             </a>
-        </div>
+        </a-space>
     </div>
 </template>
 
@@ -75,11 +95,10 @@ function logout() {
 
 .user-wrapper {
     position: fixed;
-    right: 20px;
+    right: 28px;
 }
 
 .set_lang {
     display: inline;
-    margin-right: 25px;
 }
 </style>

frontend/src/views/domain/DomainEdit.vue

@@ -218,7 +218,7 @@ function on_change_enabled(checked: boolean) {
 
         <footer-tool-bar>
             <a-space>
-                <a-button @click="$router.go(-1)">
+                <a-button @click="$router.push('/domain/list')">
                     <translate>Back</translate>
                 </a-button>
                 <a-button type="primary" @click="save" :loading="saving">

frontend/yarn.lock

@@ -636,6 +636,11 @@
   resolved "https://registry.npmmirror.com/@types/node/-/node-18.11.18.tgz#8dfb97f0da23c2293e554c5a50d61ef134d7697f"
   integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
 
+"@types/nprogress@^0.2.0":
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/@types/nprogress/-/nprogress-0.2.0.tgz#86c593682d4199212a0509cc3c4d562bbbd6e45f"
+  integrity sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A==
+
 "@types/parse-json@^4.0.0":
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"
@@ -2136,6 +2141,11 @@ normalize-url@^6.0.1:
   resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-6.1.0.tgz#40d0885b535deffe3f3147bec877d05fe4c5668a"
   integrity sha512-DlL+XwOy3NxAQ8xuC0okPgK46iuVNAK01YN7RueYBqqFeGsBjV9XmCAzAdgt+667bCl5kPh9EqKKDwnaPG1I7A==
 
+nprogress@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1"
+  integrity sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==
+
 nth-check@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.1.1.tgz#c9eab428effce36cd6b92c924bdb000ef1f1ed1d"

server/api/ngx.go

@@ -4,6 +4,7 @@ import (
 	"github.com/0xJacky/Nginx-UI/server/pkg/nginx"
 	"github.com/gin-gonic/gin"
 	"net/http"
+	"strings"
 )
 
 func BuildNginxConfig(c *gin.Context) {
@@ -47,3 +48,18 @@ func FormatNginxConfig(c *gin.Context) {
 		"content": nginx.FmtCode(json.Content),
 	})
 }
+
+func ReloadNginx(c *gin.Context) {
+	output := nginx.Reload()
+
+	if output != "" && strings.Contains(output, "error") {
+		c.JSON(http.StatusInternalServerError, gin.H{
+			"message": output,
+		})
+		return
+	}
+
+	c.JSON(http.StatusOK, gin.H{
+		"message": "ok",
+	})
+}

server/router/routers.go

@@ -62,6 +62,8 @@ func InitRouter() *gin.Engine {
 			g.POST("ngx/tokenize_config", api.TokenizeNginxConfig)
 			// Format nginx configuration code
 			g.POST("ngx/format_code", api.FormatNginxConfig)
+			// nginx reload
+			g.POST("nginx/reload", api.ReloadNginx)
 
 			g.POST("domain/:name/enable", api.EnableDomain)
 			g.POST("domain/:name/disable", api.DisableDomain)