fix: site add issues

Author: 0xJacky

frontend/docs/.vitepress/config.ts

@@ -29,7 +29,7 @@ export default defineConfig({
         nav: [
             {text: 'Home', link: '/'},
             {text: 'Guide', link: '/guide/about'},
-            {text: 'Demo', link: 'https://nginxui.jackyu.cn'}
+            {text: 'Demo', link: 'https://demo.nginxui.com'}
         ],
 
         sidebar: sidebar(),

frontend/docs/guide/about.md

@@ -38,7 +38,7 @@ managing your Nginx server.
 
 ## Demo
 
-URL：[https://nginxui.jackyu.cn](https://nginxui.jackyu.cn)
+URL：[https://demo.nginxui.com](https://demo.nginxui.com)
 
 - Username：admin
 - Password：admin

frontend/docs/zh_CN/guide/about.md

@@ -36,7 +36,7 @@ Nginx UI 是一个全新的 Nginx 网络管理界面，旨在简化 Nginx 服务
 
 ## 在线预览
 
-网址：[https://nginxui.jackyu.cn](https://nginxui.jackyu.cn)
+网址：[https://demo.nginxui.com](https://demo.nginxui.com)
 
 - 用户名：admin
 - 密码：admin

frontend/src/views/domain/DomainAdd.vue

@@ -5,7 +5,7 @@ import NgxConfigEditor from '@/views/domain/ngx_conf/NgxConfigEditor.vue'
 import {useGettext} from 'vue3-gettext'
 import domain from '@/api/domain'
 import ngx from '@/api/ngx'
-import {computed, reactive, ref} from 'vue'
+import {computed, provide, reactive, ref} from 'vue'
 import {message} from 'ant-design-vue'
 import {useRouter} from 'vue-router'
 
@@ -38,13 +38,12 @@ function init() {
 }
 
 function save() {
-    ngx.build_config(ngx_config).then(r => {
+    return ngx.build_config(ngx_config).then(r => {
         domain.save(ngx_config.name, {name: ngx_config.name, content: r.content, overwrite: true}).then(() => {
             message.success($gettext('Saved successfully'))
 
             domain.enable(ngx_config.name).then(() => {
                 message.success($gettext('Enabled successfully'))
-                current_step.value++
                 window.scroll({top: 0, left: 0, behavior: 'smooth'})
             }).catch(r => {
                 message.error(r.message ?? $gettext('Enable failed'), 5)
@@ -79,6 +78,13 @@ const has_server_name = computed(() => {
 
     return false
 })
+
+provide('save_site_config', save)
+
+async function next() {
+    await save()
+    current_step.value++
+}
 </script>
 
 <template>
@@ -129,7 +135,7 @@ const has_server_name = computed(() => {
             <a-space v-if="current_step<2">
                 <a-button
                     type="primary"
-                    @click="save"
+                    @click="next"
                     :disabled="!ngx_config.name||!has_server_name"
                 >
                     <translate>Next</translate>

frontend/src/views/domain/cert/IssueCert.vue

@@ -48,7 +48,7 @@ async function onchange() {
 </script>
 
 <template>
-    <obtain-cert ref="obtain_cert" :key="update"/>
+    <obtain-cert ref="obtain_cert" :key="update" @update:auto_cert="r=>enabled=r"/>
     <div class="issue-cert">
         <a-form-item :label="$gettext('Encrypt website with Let\'s Encrypt')">
             <a-switch

frontend/src/views/domain/cert/components/AutoCertStepOne.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import {inject, Ref} from 'vue'
+import {inject} from 'vue'
 import {useGettext} from 'vue3-gettext'
 import DNSChallenge from '@/views/domain/cert/components/DNSChallenge.vue'
 
 const {$gettext} = useGettext()
-const no_server_name: Ref = inject('no_server_name')!
-const data: Ref = inject('data')!
+const no_server_name = inject('no_server_name')
+const data = inject('data')
 </script>
 
 <template>

frontend/src/views/domain/cert/components/ObtainCert.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import {useGettext} from 'vue3-gettext'
-import {computed, inject, nextTick, provide, reactive, Ref, ref} from 'vue'
+import {computed, inject, nextTick, provide, reactive, ref} from 'vue'
 import websocket from '@/lib/websocket'
 import Modal from 'ant-design-vue/lib/modal'
 import {message} from 'ant-design-vue'
@@ -10,6 +10,8 @@ import AutoCertStepOne from '@/views/domain/cert/components/AutoCertStepOne.vue'
 
 const {$gettext, interpolate} = useGettext()
 
+const emit = defineEmits(['update:auto_cert'])
+
 const modalVisible = ref(false)
 
 const step = ref(1)
@@ -34,10 +36,10 @@ provide('data', data)
 
 const logContainer = ref(null)
 
-const save_site_config: Function = inject('save_site_config')!
-const no_server_name: Ref = inject('no_server_name')!
+const save_site_config = inject('save_site_config')!
+const no_server_name = inject('no_server_name')!
 const props: any = inject('props')!
-const issuing_cert: Ref<boolean> = inject('issuing_cert')!
+const issuing_cert = inject('issuing_cert')!
 
 async function callback(ssl_certificate: string, ssl_certificate_key: string) {
     props.directivesMap['ssl_certificate'][0]['params'] = ssl_certificate
@@ -69,19 +71,22 @@ async function onchange(r: boolean) {
 
                 v.locations.push(...r.locations)
             })
+        }).then(async () => {
+            // if ssl_certificate is empty, do not save, just use the config from last step.
+            if (props.directivesMap['ssl_certificate']?.[0]) {
+                await save_site_config()
+            }
+            job()
         })
-        // if ssl_certificate is empty, do not save, just use the config from last step.
-        if (!props.directivesMap['ssl_certificate']?.[0]) {
-            await save_site_config()
-        }
-        job()
     } else {
         await props.ngx_config.servers.forEach((v: any) => {
             v.locations = v.locations.filter((l: any) => l.path !== '/.well-known/acme-challenge')
         })
         save_site_config()
         change_auto_cert(r)
     }
+
+    emit('update:auto_cert', r)
 }
 
 function job() {

frontend/src/views/domain/ngx_conf/NgxConfigEditor.vue

@@ -36,9 +36,13 @@ function confirm_change_tls(r: boolean) {
         okText: $gettext('OK'),
         cancelText: $gettext('Cancel'),
         async onOk() {
-            await template.get_block('letsencrypt.conf').then(r => {
+            await template.get_block('letsencrypt.conf').then(async r => {
                 const first = props.ngx_config.servers[0]
-                first.locations = first.locations.filter((l: any) => l.path !== '/.well-known/acme-challenge')
+                if (!first.locations) {
+                    first.locations = []
+                } else {
+                    first.locations = first.locations.filter((l: any) => l.path !== '/.well-known/acme-challenge')
+                }
                 first.locations.push(...r.locations)
             })
             await save_site_config()

resources/development/nginx/sites-available/test.nginxui.com

@@ -0,0 +1,24 @@
+server {
+    listen 80;
+    listen [::]:80;
+    server_name test.nginxui.com;
+    location /.well-known/acme-challenge {
+        proxy_set_header Host $host;
+        proxy_set_header X-Real_IP $remote_addr;
+        proxy_set_header X-Forwarded-For $remote_addr:$remote_port;
+        proxy_pass http://127.0.0.1:5002;
+    }
+}
+server {
+    listen 443 ssl http2;
+    listen [::]:443 ssl http2;
+    server_name test.nginxui.com;
+    ssl_certificate /etc/nginx/ssl/test.nginxui.com/fullchain.cer;
+    ssl_certificate_key /etc/nginx/ssl/test.nginxui.com/private.key;
+    location /.well-known/acme-challenge {
+        proxy_set_header Host $host;
+        proxy_set_header X-Real_IP $remote_addr;
+        proxy_set_header X-Forwarded-For $remote_addr:$remote_port;
+        proxy_pass http://127.0.0.1:5002;
+    }
+}

resources/development/nginx/sites-enabled/test.nginxui.com

@@ -0,0 +1 @@
+/etc/nginx/sites-available/test.nginxui.com