feat(wip): collapsible panel for NgxConfigEditor

2025-05-11 02:15:48 +02:00 · 2023-12-14 18:53:36 +08:00 · 2023-12-14 18:53:36 +08:00 · b2854d4965
commit b2854d4965
parent 43074728bf
22 changed files with 536 additions and 344 deletions
--- a/app/gettext.config.cjs
+++ b/app/gettext.config.cjs
@ -1,7 +1,7 @@
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const i18n = require('./i18n.json')
-module.export = {
+module.exports = {
  input: {
    include: ['**/*.js', '**/*.ts', '**/*.vue', '**/*.jsx', '**/*.tsx'],
  },
--- a/app/package.json
+++ b/app/package.json
@ -34,7 +34,7 @@
    "vue-router": "^4.2.5",
    "vue3-ace-editor": "2.2.4",
    "vue3-apexcharts": "^1.4.4",
-    "vue3-gettext": "^3.0.0-beta.2",
+    "vue3-gettext": "3.0.0-beta.2",
    "vuedraggable": "^4.1.0",
    "xterm": "^5.3.0",
    "xterm-addon-attach": "^0.9.0",
--- a/app/pnpm-lock.yaml
+++ b/app/pnpm-lock.yaml
@ -75,7 +75,7 @@ dependencies:
    specifier: ^1.4.4
    version: 1.4.4(apexcharts@3.44.0)(vue@3.3.11)
  vue3-gettext:
-    specifier: ^3.0.0-beta.2
+    specifier: 3.0.0-beta.2
    version: 3.0.0-beta.2(@vue/compiler-sfc@3.3.10)(vue@3.3.11)
  vuedraggable:
    specifier: ^4.1.0
--- a/app/src/language/LINGUAS
+++ b/app/src/language/LINGUAS
@ -1 +1 @@
-en
+en zh_CN zh_TW fr_FR es ru_RU vi_VN
--- a/app/src/language/en/app.po
+++ b/app/src/language/en/app.po
@ -27,7 +27,8 @@ msgstr "Action"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr ""
@ -35,8 +36,8 @@ msgstr ""
 msgid "Add Directive Below"
 msgstr "Add Directive Below"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "Add Location"
@ -90,7 +91,7 @@ msgstr "Are you sure you want to remove this directive?"
 msgid "Are you sure you want to remove this directive?"
 msgstr "Are you sure you want to remove this directive?"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 #, fuzzy
 msgid "Are you sure you want to remove this location?"
 msgstr "Are you sure you want to remove this directive?"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "Base information"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 #, fuzzy
 msgid "Basic"
@ -171,8 +172,9 @@ msgstr ""
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "Cancel"
@ -242,9 +244,9 @@ msgid "Cleared successfully"
 msgstr "Disabled successfully"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "Comments"
@ -274,8 +276,8 @@ msgid "Connected"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "Content"
@ -316,7 +318,7 @@ msgid "Current Version"
 msgstr ""
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr ""
@ -330,7 +332,8 @@ msgstr "Database (Optional, default: database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr ""
@ -344,7 +347,7 @@ msgid "Deleted successfully"
 msgstr "Disabled successfully"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr ""
@ -444,16 +447,21 @@ msgstr "Are you sure you want to remove this directive?"
 msgid "Do you want to enable this site?"
 msgstr "Are you sure you want to remove this directive?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 #, fuzzy
 msgid "Do you want to enable TLS?"
 msgstr "Are you sure you want to remove this directive?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 #, fuzzy
 msgid "Do you want to remove this server?"
 msgstr "Are you sure you want to remove this directive?"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "Are you sure you want to remove this directive?"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -519,6 +527,7 @@ msgstr "Edit Site"
 msgid "Email (*)"
 msgstr "Email (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 #, fuzzy
 msgid "Enable"
@ -545,13 +554,12 @@ msgstr "Enable failed"
 msgid "Enable successfully"
 msgstr "Enabled successfully"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "Enable TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "Enabled"
@ -749,10 +757,6 @@ msgstr "Enabled successfully"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "Intermediate Certification Authorities: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -810,11 +814,11 @@ msgstr "Load Averages:"
 msgid "Local"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Locations"
@ -894,9 +898,11 @@ msgstr "Single Directive"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "Name"
@ -920,6 +926,7 @@ msgstr "Network Total Send"
 msgid "New version released"
 msgstr ""
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -965,7 +972,7 @@ msgstr "Saved successfully"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "No"
@ -1026,8 +1033,9 @@ msgstr ""
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr ""
@ -1077,8 +1085,8 @@ msgid "Password (*)"
 msgstr "Password (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "Path"
@ -1203,6 +1211,15 @@ msgstr ""
 msgid "Removed successfully"
 msgstr "Saved successfully"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "Username"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1473,7 +1490,7 @@ msgstr ""
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1488,7 +1505,7 @@ msgstr ""
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1579,7 +1596,7 @@ msgid "Writing certificate to disk"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "Yes"
@ -1591,6 +1608,10 @@ msgstr ""
 msgid "You can check Nginx UI upgrade at this page."
 msgstr ""
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "Server Info"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "Leave blank for no change"
--- a/app/src/language/es/app.po
+++ b/app/src/language/es/app.po
@ -32,7 +32,8 @@ msgstr "Acción"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "Agregar"
@ -40,8 +41,8 @@ msgstr "Agregar"
 msgid "Add Directive Below"
 msgstr "Añadir directiva a continuación"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "Agregar Ubicación"
@ -92,7 +93,7 @@ msgstr "¿Está seguro de que quiere borrar?"
 msgid "Are you sure you want to remove this directive?"
 msgstr "¿Está seguro de que quiere borrar esta directiva?"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 msgid "Are you sure you want to remove this location?"
 msgstr "¿Está seguro de que quiere borrar esta ubicación?"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "Información general"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 msgid "Basic"
 msgstr "Básico"
@ -169,8 +170,9 @@ msgstr "Directorio CA"
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "Cancelar"
@ -239,9 +241,9 @@ msgid "Cleared successfully"
 msgstr "Desactivado con éxito"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "Comentarios"
@ -270,8 +272,8 @@ msgid "Connected"
 msgstr "Conectado"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "Contenido"
@ -312,7 +314,7 @@ msgid "Current Version"
 msgstr "Versión actual"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "Personalizado"
@ -326,7 +328,8 @@ msgstr "Base de datos (Opcional, default: database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "Eliminar"
@ -340,7 +343,7 @@ msgid "Deleted successfully"
 msgstr "Desactivado con éxito"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr "Desplegar"
@ -436,14 +439,19 @@ msgstr "¿Quieres deshabilitar este sitio?"
 msgid "Do you want to enable this site?"
 msgstr "¿Quieres habilitar este sitio?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 msgid "Do you want to enable TLS?"
 msgstr "¿Quieres habilitar TLS?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 msgid "Do you want to remove this server?"
 msgstr "¿Quieres eliminar este servidor?"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "¿Quieres eliminar este servidor?"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -508,6 +516,7 @@ msgstr "Editar Sitio"
 msgid "Email (*)"
 msgstr "Correo (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 #, fuzzy
 msgid "Enable"
@ -533,13 +542,12 @@ msgstr "Falló la habilitación"
 msgid "Enable successfully"
 msgstr "Habilitado con éxito"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "Habilitar TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "Habilitado"
@ -735,10 +743,6 @@ msgstr "Instalación exitosa"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "Autoridades de certificación intermedias: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -794,11 +798,11 @@ msgstr "Promedios de carga:"
 msgid "Local"
 msgstr "Local"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Ubicación"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Ubicaciones"
@ -875,9 +879,11 @@ msgstr "Directiva multilínea"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "Nombre"
@ -901,6 +907,7 @@ msgstr "Total enviado por la red"
 msgid "New version released"
 msgstr "Se liberó una nueva versión"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -943,7 +950,7 @@ msgstr "Nginx reiniciado con éxito"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "No"
@ -1003,8 +1010,9 @@ msgstr "Desconectado"
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr "OK"
@ -1053,8 +1061,8 @@ msgid "Password (*)"
 msgstr "Contraseña (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "Ruta"
@ -1183,6 +1191,15 @@ msgstr "Recargando Nginx"
 msgid "Removed successfully"
 msgstr "Guardado con éxito"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "Nombre de usuario"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1449,7 +1466,7 @@ msgstr "Este campo no debe estar vacío"
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1468,7 +1485,7 @@ msgstr "Tipo"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1558,7 +1575,7 @@ msgid "Writing certificate to disk"
 msgstr "Escribir certificado a disco"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "Si"
@ -1570,6 +1587,10 @@ msgstr "Estás usando la última versión"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "Puede consultar la actualización de Nginx UI en esta página."
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "Información del servidor"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "Para no modificar dejar en blanco"
--- a/app/src/language/fr_FR/app.po
+++ b/app/src/language/fr_FR/app.po
@ -29,7 +29,8 @@ msgstr "Action"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "Ajouter"
@ -37,8 +38,8 @@ msgstr "Ajouter"
 msgid "Add Directive Below"
 msgstr "Ajouter une directive"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "Ajouter une localisation"
@ -91,7 +92,7 @@ msgstr "Etes-vous sûr que vous voulez supprimer ?"
 msgid "Are you sure you want to remove this directive?"
 msgstr "Voulez-vous vraiment supprimer cette directive ?"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 msgid "Are you sure you want to remove this location?"
 msgstr "Voulez-vous vraiment supprimer cette localisation ?"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "Information générale"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 msgid "Basic"
 msgstr "Basique"
@ -170,8 +171,9 @@ msgstr ""
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "Annuler"
@ -240,9 +242,9 @@ msgid "Cleared successfully"
 msgstr "Désactivé avec succès"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "Commentaires"
@ -271,8 +273,8 @@ msgid "Connected"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "Contenu"
@ -313,7 +315,7 @@ msgid "Current Version"
 msgstr "Version actuelle"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "Custom"
@ -327,7 +329,8 @@ msgstr "Base de données (Facultatif, par défaut : database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "Supprimer"
@ -341,7 +344,7 @@ msgid "Deleted successfully"
 msgstr "Désactivé avec succès"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr ""
@ -439,14 +442,19 @@ msgstr "Voulez-vous désactiver ce site ?"
 msgid "Do you want to enable this site?"
 msgstr "Voulez-vous activer ce site ?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 msgid "Do you want to enable TLS?"
 msgstr "Voulez-vous activer TLS ?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 msgid "Do you want to remove this server?"
 msgstr "Voulez-vous supprimer ce serveur ?"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "Voulez-vous supprimer ce serveur ?"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -515,6 +523,7 @@ msgstr "Modifier le site"
 msgid "Email (*)"
 msgstr "Email (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 #, fuzzy
 msgid "Enable"
@ -541,13 +550,12 @@ msgstr "Échec de l'activation"
 msgid "Enable successfully"
 msgstr "Activé avec succès"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "Activer TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "Activé"
@ -745,10 +753,6 @@ msgstr "Installé avec succès"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "Autorités de certification intermédiaires : %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -805,12 +809,12 @@ msgstr "Charges moyennes :"
 msgid "Local"
 msgstr "Localisation"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 #, fuzzy
 msgid "Location"
 msgstr "Localisation"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 #, fuzzy
 msgid "Locations"
 msgstr "Localisations"
@ -889,9 +893,11 @@ msgstr "Directive multiligne"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "Nom"
@ -915,6 +921,7 @@ msgstr "Envoi total réseau"
 msgid "New version released"
 msgstr "Nouvelle version publiée"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -958,7 +965,7 @@ msgstr "Nginx a redémarré avec succès"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "Non"
@ -1019,8 +1026,9 @@ msgstr ""
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr "OK"
@ -1069,8 +1077,8 @@ msgid "Password (*)"
 msgstr "Mot de passe (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "Chemin"
@ -1203,6 +1211,15 @@ msgstr "Rechargement de nginx"
 msgid "Removed successfully"
 msgstr "Enregistré avec succès"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "Nom d'utilisateur"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1473,7 +1490,7 @@ msgstr ""
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1492,7 +1509,7 @@ msgstr "Type"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1583,7 +1600,7 @@ msgid "Writing certificate to disk"
 msgstr "Écriture du certificat sur le disque"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "Oui"
@ -1595,6 +1612,10 @@ msgstr "Vous utilisez la dernière version"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "Vous pouvez vérifier la mise à niveau de Nginx UI sur cette page."
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "Informations sur le serveur"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "Laisser vide pour aucun changement"
--- a/app/src/language/messages.pot
+++ b/app/src/language/messages.pot
@ -24,7 +24,8 @@ msgstr ""
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr ""
@ -32,8 +33,8 @@ msgstr ""
 msgid "Add Directive Below"
 msgstr ""
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr ""
@ -84,7 +85,7 @@ msgstr ""
 msgid "Are you sure you want to remove this directive?"
 msgstr ""
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 msgid "Are you sure you want to remove this location?"
 msgstr ""
@ -134,7 +135,7 @@ msgid "Base information"
 msgstr ""
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 msgid "Basic"
 msgstr ""
@ -163,8 +164,9 @@ msgstr ""
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr ""
@ -231,9 +233,9 @@ msgid "Cleared successfully"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr ""
@ -262,8 +264,8 @@ msgid "Connected"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr ""
@ -305,7 +307,7 @@ msgid "Current Version"
 msgstr ""
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr ""
@ -319,7 +321,8 @@ msgstr ""
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr ""
@ -332,7 +335,7 @@ msgid "Deleted successfully"
 msgstr ""
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr ""
@ -428,14 +431,18 @@ msgstr ""
 msgid "Do you want to enable this site?"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 msgid "Do you want to enable TLS?"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 msgid "Do you want to remove this server?"
 msgstr ""
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 msgid "Do you want to remove this upstream?"
 msgstr ""
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -498,6 +505,7 @@ msgstr ""
 msgid "Email (*)"
 msgstr ""
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 msgid "Enable"
 msgstr ""
@ -522,13 +530,12 @@ msgstr ""
 msgid "Enable successfully"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr ""
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184
 #: src/views/domain/DomainList.vue:32
 msgid "Enabled"
@ -726,10 +733,6 @@ msgstr ""
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr ""
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 msgid "Issue wildcard certificate"
 msgstr ""
@ -780,11 +783,11 @@ msgstr ""
 msgid "Local"
 msgstr ""
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr ""
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr ""
@ -860,9 +863,10 @@ msgstr ""
 #: src/views/certificate/DNSCredential.vue:13
 #: src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
 #: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr ""
@ -887,6 +891,7 @@ msgstr ""
 msgid "New version released"
 msgstr ""
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -930,7 +935,7 @@ msgstr ""
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr ""
@ -990,8 +995,9 @@ msgstr ""
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr ""
@ -1041,8 +1047,8 @@ msgid "Password (*)"
 msgstr ""
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr ""
@ -1161,6 +1167,14 @@ msgstr ""
 msgid "Removed successfully"
 msgstr ""
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 msgid "Rename"
 msgstr ""
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 msgid "Renew Certificate"
@ -1413,7 +1427,7 @@ msgstr ""
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid "To make sure the certification auto-renewal can work normally, we need to add a location which can proxy the request from authority to backend, and we need to save this file and reload the Nginx. Are you sure you want to continue?"
 msgstr ""
@ -1426,7 +1440,7 @@ msgstr ""
 #: src/views/certificate/DNSCredential.vue:26
 #: src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44
 #: src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
@ -1513,7 +1527,7 @@ msgid "Writing certificate to disk"
 msgstr ""
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr ""
--- a/app/src/language/ru_RU/app.po
+++ b/app/src/language/ru_RU/app.po
@ -27,7 +27,8 @@ msgstr "Действие"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "Добавить"
@ -35,8 +36,8 @@ msgstr "Добавить"
 msgid "Add Directive Below"
 msgstr "Добавить директиву ниже"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "Добавить Location"
@ -90,7 +91,7 @@ msgstr "Вы уверены, что хотите удалить эту дире
 msgid "Are you sure you want to remove this directive?"
 msgstr "Вы уверены, что хотите удалить эту директиву?"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 #, fuzzy
 msgid "Are you sure you want to remove this location?"
 msgstr "Вы уверены, что хотите удалить эту директиву?"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "Основная информация"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 #, fuzzy
 msgid "Basic"
@ -171,8 +172,9 @@ msgstr ""
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "Отмена"
@ -242,9 +244,9 @@ msgid "Cleared successfully"
 msgstr "Отключено успешно"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "Комментарии"
@ -274,8 +276,8 @@ msgid "Connected"
 msgstr "Подключено"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "Содержание"
@ -316,7 +318,7 @@ msgid "Current Version"
 msgstr "Текущяя версия"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "Пользовательский"
@ -330,7 +332,8 @@ msgstr "База данных (Опционально, по умолчанию:
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "Удалить"
@ -344,7 +347,7 @@ msgid "Deleted successfully"
 msgstr "Отключено успешно"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr ""
@ -444,16 +447,21 @@ msgstr "Вы хотите отключить этот сайт?"
 msgid "Do you want to enable this site?"
 msgstr "Вы хотите включить этот сайт?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 #, fuzzy
 msgid "Do you want to enable TLS?"
 msgstr "Включить TLS?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 #, fuzzy
 msgid "Do you want to remove this server?"
 msgstr "Вы хотите удалить этот сервер?"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "Вы хотите удалить этот сервер?"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -521,6 +529,7 @@ msgstr "Редактировать Сайт"
 msgid "Email (*)"
 msgstr "Email (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 #, fuzzy
 msgid "Enable"
@ -547,13 +556,12 @@ msgstr "Включить не удалось"
 msgid "Enable successfully"
 msgstr "Активировано успешно"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "Включить TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "Включено"
@ -752,10 +760,6 @@ msgstr "Установленно"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "Промежуточные центры сертификации: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -813,11 +817,11 @@ msgstr "Средняя нагрузка:"
 msgid "Local"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Locations"
@ -897,9 +901,11 @@ msgstr "Одиночная директива"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "Имя"
@ -923,6 +929,7 @@ msgstr "Всего отправлено"
 msgid "New version released"
 msgstr "Вышла новая версия"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -969,7 +976,7 @@ msgstr "Nginx успешно перезапущен"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "Нет"
@ -1030,8 +1037,9 @@ msgstr ""
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr ""
@ -1081,8 +1089,8 @@ msgid "Password (*)"
 msgstr "Пароль (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "Путь"
@ -1209,6 +1217,15 @@ msgstr "Перезагружается nginx"
 msgid "Removed successfully"
 msgstr "Успешно сохранено"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "Имя пользователя"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1480,7 +1497,7 @@ msgstr ""
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1495,7 +1512,7 @@ msgstr "Тип"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1586,7 +1603,7 @@ msgid "Writing certificate to disk"
 msgstr "Запись сертификата на диск"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "Да"
@ -1598,6 +1615,10 @@ msgstr "Вы используете последнюю версию"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "Вы можете проверить обновление Nginx UI на этой странице."
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "Информация о сервере"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "Оставьте пустым без изменений"
--- a/app/src/language/vi_VN/app.po
+++ b/app/src/language/vi_VN/app.po
@ -27,7 +27,8 @@ msgstr "Hành động"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "Thêm"
@ -35,8 +36,8 @@ msgstr "Thêm"
 msgid "Add Directive Below"
 msgstr "Thêm Directive"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "Thêm Location"
@ -90,7 +91,7 @@ msgstr "Bạn chắc chắn muốn xóa nó "
 msgid "Are you sure you want to remove this directive?"
 msgstr "Bạn chắc chắn muốn xoá directive này ?"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 #, fuzzy
 msgid "Are you sure you want to remove this location?"
 msgstr "Bạn chắc chắn muốn xoá location này ?"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "Thông tin"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 #, fuzzy
 msgid "Basic"
@ -171,8 +172,9 @@ msgstr ""
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "Huỷ"
@ -242,9 +244,9 @@ msgid "Cleared successfully"
 msgstr "Đã xóa thành công"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "Bình luận"
@ -274,8 +276,8 @@ msgid "Connected"
 msgstr "Đã kết nối"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "Nội dung"
@ -316,7 +318,7 @@ msgid "Current Version"
 msgstr "Phiên bản hiện tại"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "Tuỳ chỉnh"
@ -330,7 +332,8 @@ msgstr "Tên cơ sở dữ liệu (Tuỳ chọn, Mặc định là: database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "Xoá"
@ -344,7 +347,7 @@ msgid "Deleted successfully"
 msgstr "Đã xoá thành công"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr "Triển khai"
@ -444,16 +447,21 @@ msgstr "Bạn muốn tắt trang web này ?"
 msgid "Do you want to enable this site?"
 msgstr "Bạn muốn bật trang web này ?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 #, fuzzy
 msgid "Do you want to enable TLS?"
 msgstr "Bạn muốn bật TLS ?"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 #, fuzzy
 msgid "Do you want to remove this server?"
 msgstr "Bạn muốn xóa máy chủ này ?"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "Bạn muốn xóa máy chủ này ?"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr ""
@ -521,6 +529,7 @@ msgstr "Sửa trang web"
 msgid "Email (*)"
 msgstr "Email (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 #, fuzzy
 msgid "Enable"
@ -547,13 +556,12 @@ msgstr "Bật không thành công"
 msgid "Enable successfully"
 msgstr "Đã bật"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "Bật TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "Đã bật"
@ -752,10 +760,6 @@ msgstr "Cài đặt thành công"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "Cơ quan cấp chứng chỉ: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -813,11 +817,11 @@ msgstr "Tải trung bình:"
 msgid "Local"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Locations"
@ -896,9 +900,11 @@ msgstr "Single Directive"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "Tên"
@ -922,6 +928,7 @@ msgstr "Tổng lưu lượng mạng đã gửi"
 msgid "New version released"
 msgstr "Đã có phiên bản mới"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -967,7 +974,7 @@ msgstr "Restart Nginx thành công"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "Không"
@ -1028,8 +1035,9 @@ msgstr "Ngoại tuyến"
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr ""
@ -1079,8 +1087,8 @@ msgid "Password (*)"
 msgstr "Mật khẩu (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "Đường dẫn"
@ -1209,6 +1217,15 @@ msgstr "Tải lại nginx"
 msgid "Removed successfully"
 msgstr "Xoá thành công"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "Username"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1474,7 +1491,7 @@ msgstr "Trường này không được để trống"
 msgid "Title"
 msgstr "Tiêu đề"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1493,7 +1510,7 @@ msgstr "Loại"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1588,7 +1605,7 @@ msgid "Writing certificate to disk"
 msgstr "Ghi chứng chỉ vào disk"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "Có"
@ -1600,6 +1617,10 @@ msgstr "Bạn đang sử dụng phiên bản mới nhất"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "Bạn có thể kiểm tra nâng cấp Nginx UI tại trang này"
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "Thông tin máy chủ"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "Bỏ trống nếu không thay đổi"
--- a/app/src/language/zh_CN/app.mo
+++ b/app/src/language/zh_CN/app.mo
--- a/app/src/language/zh_CN/app.po
+++ b/app/src/language/zh_CN/app.po
@ -31,7 +31,8 @@ msgstr "操作"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "添加"
@ -39,8 +40,8 @@ msgstr "添加"
 msgid "Add Directive Below"
 msgstr "在下面添加指令"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "添加 Location"
@ -90,7 +91,7 @@ msgstr "您确定要删除吗？"
 msgid "Are you sure you want to remove this directive?"
 msgstr "您确定要删除这条指令？"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 msgid "Are you sure you want to remove this location?"
 msgstr "您确定要删除这个 Location？"
@ -138,7 +139,7 @@ msgid "Base information"
 msgstr "基本信息"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 msgid "Basic"
 msgstr "基本"
@ -167,8 +168,9 @@ msgstr "CADir"
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "取消"
@ -234,9 +236,9 @@ msgid "Cleared successfully"
 msgstr "清除成功"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "注释"
@ -265,8 +267,8 @@ msgid "Connected"
 msgstr "已连接"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "内容"
@ -307,7 +309,7 @@ msgid "Current Version"
 msgstr "当前版本"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "自定义"
@ -321,7 +323,8 @@ msgstr "数据库 (可选，默认: database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "删除"
@ -334,7 +337,7 @@ msgid "Deleted successfully"
 msgstr "删除成功"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr "部署"
@ -427,14 +430,18 @@ msgstr "你想停用这个网站吗？"
 msgid "Do you want to enable this site?"
 msgstr "你想启用这个网站吗？"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 msgid "Do you want to enable TLS?"
 msgstr "你想启用TLS吗？"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 msgid "Do you want to remove this server?"
 msgstr "你想删除这个服务器吗？"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 msgid "Do you want to remove this upstream?"
 msgstr "你想删除这个 Upstream 吗？"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr "域名"
@ -496,6 +503,7 @@ msgstr "编辑站点"
 msgid "Email (*)"
 msgstr "邮箱 (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 msgid "Enable"
 msgstr "启用"
@ -520,13 +528,12 @@ msgstr "启用失败"
 msgid "Enable successfully"
 msgstr "启用成功"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "启用 TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "启用"
@ -716,19 +723,13 @@ msgstr "安装成功"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "中级证书颁发机构: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
-msgstr "更新证书"
+msgstr "签发通配符证书"
 #: src/views/certificate/WildcardCertificate.vue:58
 #, fuzzy
 msgid "Issue Wildcard Certificate"
-msgstr "添加证书"
+msgstr "颁发通配符证书"
 #: src/language/constants.ts:24
 msgid "Issued certificate successfully"
@ -772,11 +773,11 @@ msgstr "系统负载:"
 msgid "Local"
 msgstr "本地"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Locations"
@ -850,9 +851,11 @@ msgstr "多行指令"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "名称"
@ -876,6 +879,7 @@ msgstr "上传流量"
 msgid "New version released"
 msgstr "新版本发布"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -918,7 +922,7 @@ msgstr "Nginx 重启成功"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "取消"
@ -976,8 +980,9 @@ msgstr "离线"
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr "确定"
@ -1026,8 +1031,8 @@ msgid "Password (*)"
 msgstr "密码 (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "路径"
@ -1151,6 +1156,14 @@ msgstr "正在重载 Nginx"
 msgid "Removed successfully"
 msgstr "删除成功"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 msgid "Rename"
 msgstr "重命名"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr "重新命名 Upstream"
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 msgid "Renew Certificate"
@ -1401,7 +1414,7 @@ msgstr "该字段不能为空"
 msgid "Title"
 msgstr "标题"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1418,7 +1431,7 @@ msgstr "类型"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1506,7 +1519,7 @@ msgid "Writing certificate to disk"
 msgstr "正在将证书写入磁盘"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "是的"
@ -1518,6 +1531,12 @@ msgstr "您使用的是最新版本"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "你可以在这个页面检查Nginx UI的升级。"
 #~ msgid "Server"
 #~ msgstr "Server"
 #~ msgid "Upstream"
 #~ msgstr "Upstream"
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "留空不会有任何变化。"
--- a/app/src/language/zh_TW/app.po
+++ b/app/src/language/zh_TW/app.po
@ -32,7 +32,8 @@ msgstr "操作"
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:115
 #: src/components/StdDesign/StdDataDisplay/StdCurd.vue:141
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:119
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:305
+#: src/views/domain/ngx_conf/NgxServer.vue:163
 #: src/views/domain/ngx_conf/NgxUpstream.vue:96
 msgid "Add"
 msgstr "新增"
@ -40,8 +41,8 @@ msgstr "新增"
 msgid "Add Directive Below"
 msgstr "在下方新增指令"
-#: src/views/domain/ngx_conf/LocationEditor.vue:117
+#: src/views/domain/ngx_conf/LocationEditor.vue:115
-#: src/views/domain/ngx_conf/LocationEditor.vue:144
+#: src/views/domain/ngx_conf/LocationEditor.vue:142
 msgid "Add Location"
 msgstr "新增 Location"
@ -92,7 +93,7 @@ msgstr "您確定要刪除嗎？"
 msgid "Are you sure you want to remove this directive?"
 msgstr "您確定要刪除這條指令嗎？"
-#: src/views/domain/ngx_conf/LocationEditor.vue:74
+#: src/views/domain/ngx_conf/LocationEditor.vue:72
 msgid "Are you sure you want to remove this location?"
 msgstr "您確定要刪除此 Location 嗎？"
@ -140,7 +141,7 @@ msgid "Base information"
 msgstr "基本資訊"
 #: src/views/config/ConfigEdit.vue:117
-#: src/views/domain/components/RightSettings.vue:73
+#: src/views/domain/components/RightSettings.vue:76
 #: src/views/preference/Preference.vue:90
 msgid "Basic"
 msgstr "基本"
@ -169,8 +170,9 @@ msgstr "CADir"
 #: src/views/domain/cert/components/ObtainCert.vue:137
 #: src/views/domain/components/Deploy.vue:24
 #: src/views/domain/components/RightSettings.vue:52
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:213
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:49
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
+#: src/views/domain/ngx_conf/NgxServer.vue:84
 #: src/views/domain/ngx_conf/NgxUpstream.vue:28
 msgid "Cancel"
 msgstr "取消"
@ -239,9 +241,9 @@ msgid "Cleared successfully"
 msgstr "成功停用"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:97
-#: src/views/domain/ngx_conf/LocationEditor.vue:121
+#: src/views/domain/ngx_conf/LocationEditor.vue:119
-#: src/views/domain/ngx_conf/LocationEditor.vue:90
+#: src/views/domain/ngx_conf/LocationEditor.vue:88
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:281
+#: src/views/domain/ngx_conf/NgxServer.vue:139
 msgid "Comments"
 msgstr "備註"
@ -270,8 +272,8 @@ msgid "Connected"
 msgstr "已連結"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:102
-#: src/views/domain/ngx_conf/LocationEditor.vue:102
+#: src/views/domain/ngx_conf/LocationEditor.vue:100
-#: src/views/domain/ngx_conf/LocationEditor.vue:130
+#: src/views/domain/ngx_conf/LocationEditor.vue:128
 msgid "Content"
 msgstr "內容"
@ -312,7 +314,7 @@ msgid "Current Version"
 msgstr "目前版本"
 #: src/views/domain/ngx_conf/config_template/ConfigTemplate.vue:126
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:238
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:185
 msgid "Custom"
 msgstr "自訂"
@ -326,7 +328,8 @@ msgstr "資料庫 (可選，預設: database)"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:360
 #: src/views/domain/DomainList.vue:156
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:256
+#: src/views/domain/ngx_conf/NgxServer.vue:114
 #: src/views/domain/ngx_conf/NgxUpstream.vue:77
 msgid "Delete"
 msgstr "刪除"
@ -340,7 +343,7 @@ msgid "Deleted successfully"
 msgstr "成功停用"
 #: src/views/domain/components/Deploy.vue:109
-#: src/views/domain/components/RightSettings.vue:91
+#: src/views/domain/components/RightSettings.vue:94
 msgid "Deploy"
 msgstr "部署"
@ -434,14 +437,19 @@ msgstr "您想停用這個網站嗎？"
 msgid "Do you want to enable this site?"
 msgstr "您要啟用此網站嗎？"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:41
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
 msgid "Do you want to enable TLS?"
 msgstr "您想啟用 TLS 嗎？"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:209
+#: src/views/domain/ngx_conf/NgxServer.vue:80
 msgid "Do you want to remove this server?"
 msgstr "您要移除此伺服器嗎？"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:24
 #, fuzzy
 msgid "Do you want to remove this upstream?"
 msgstr "您要移除此伺服器嗎？"
 #: src/views/certificate/WildcardCertificate.vue:69
 msgid "Domain"
 msgstr "網域"
@ -504,6 +512,7 @@ msgstr "編輯網站"
 msgid "Email (*)"
 msgstr "電子郵件 (*)"
 #: src/views/domain/components/Deploy.vue:89
 #: src/views/domain/DomainList.vue:133
 msgid "Enable"
 msgstr "啟用"
@ -528,13 +537,12 @@ msgstr "啟用失敗"
 msgid "Enable successfully"
 msgstr "啟用成功"
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:233
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:174
 msgid "Enable TLS"
 msgstr "啟用 TLS"
 #: src/views/domain/cert/ChangeCert.vue:44
-#: src/views/domain/components/Deploy.vue:89
+#: src/views/domain/components/RightSettings.vue:78
 #: src/views/domain/components/RightSettings.vue:75
 #: src/views/domain/DomainEdit.vue:184 src/views/domain/DomainList.vue:32
 msgid "Enabled"
 msgstr "已啟用"
@ -728,10 +736,6 @@ msgstr "安裝成功"
 msgid "Intermediate Certification Authorities: %{issuer}"
 msgstr "中級憑證頒發機構: %{issuer}"
 #: src/views/certificate/WildcardCertificate.vue:84
 msgid "Issue"
 msgstr ""
 #: src/views/certificate/Certificate.vue:137
 #, fuzzy
 msgid "Issue wildcard certificate"
@ -787,11 +791,11 @@ msgstr "系統負載:"
 msgid "Local"
 msgstr "本機"
-#: src/views/domain/ngx_conf/LocationEditor.vue:65
+#: src/views/domain/ngx_conf/LocationEditor.vue:63
 msgid "Location"
 msgstr "Location"
-#: src/views/domain/ngx_conf/LocationEditor.vue:48
+#: src/views/domain/ngx_conf/LocationEditor.vue:47
 msgid "Locations"
 msgstr "Locations"
@ -867,9 +871,11 @@ msgstr "多行指令"
 #: src/views/certificate/CertificateEditor.vue:145
 #: src/views/certificate/DNSCredential.vue:13 src/views/config/config.ts:9
 #: src/views/domain/cert/ChangeCert.vue:21
-#: src/views/domain/components/RightSettings.vue:81
+#: src/views/domain/components/RightSettings.vue:84
 #: src/views/domain/components/SiteDuplicate.vue:135
-#: src/views/domain/DomainList.vue:16 src/views/environment/Environment.vue:15
+#: src/views/domain/DomainList.vue:16
 #: src/views/domain/ngx_conf/NgxUpstream.vue:108
 #: src/views/environment/Environment.vue:15
 msgid "Name"
 msgstr "名稱"
@ -893,6 +899,7 @@ msgstr "上傳流量"
 msgid "New version released"
 msgstr "新版本發布"
 #: src/views/certificate/WildcardCertificate.vue:84
 #: src/views/domain/cert/components/ObtainCert.vue:203
 #: src/views/domain/DomainAdd.vue:145
 msgid "Next"
@ -935,7 +942,7 @@ msgstr "Nginx 重啟成功"
 #: src/components/StdDesign/StdDataDisplay/StdTable.vue:351
 #: src/views/domain/DomainList.vue:145
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:81
-#: src/views/domain/ngx_conf/LocationEditor.vue:76
+#: src/views/domain/ngx_conf/LocationEditor.vue:74
 #: src/views/notification/Notification.vue:71
 msgid "No"
 msgstr "取消"
@ -995,8 +1002,9 @@ msgstr "離線"
 #: src/views/domain/components/Deploy.vue:23
 #: src/views/domain/components/RightSettings.vue:51
 #: src/views/domain/DomainList.vue:146
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:212
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:48
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:47
+#: src/views/domain/ngx_conf/NgxServer.vue:83
 #: src/views/domain/ngx_conf/NgxUpstream.vue:27
 #: src/views/notification/Notification.vue:72
 msgid "OK"
 msgstr "確定"
@ -1045,8 +1053,8 @@ msgid "Password (*)"
 msgstr "密碼 (*)"
 #: src/views/config/ConfigEdit.vue:120
-#: src/views/domain/ngx_conf/LocationEditor.vue:124
+#: src/views/domain/ngx_conf/LocationEditor.vue:122
-#: src/views/domain/ngx_conf/LocationEditor.vue:96
+#: src/views/domain/ngx_conf/LocationEditor.vue:94
 msgid "Path"
 msgstr "路徑"
@ -1172,6 +1180,15 @@ msgstr "正在重新載入 Nginx"
 msgid "Removed successfully"
 msgstr "儲存成功"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:74
 #, fuzzy
 msgid "Rename"
 msgstr "使用者名稱"
 #: src/views/domain/ngx_conf/NgxUpstream.vue:103
 msgid "Rename Upstream"
 msgstr ""
 #: src/views/certificate/RenewCert.vue:43
 #: src/views/certificate/RenewCert.vue:47
 #, fuzzy
@ -1435,7 +1452,7 @@ msgstr "此欄位不應為空"
 msgid "Title"
 msgstr ""
-#: src/views/domain/ngx_conf/NgxConfigEditor.vue:42
+#: src/views/domain/ngx_conf/NgxConfigEditor.vue:43
 msgid ""
 "To make sure the certification auto-renewal can work normally, we need to "
 "add a location which can proxy the request from authority to backend, and we "
@ -1452,7 +1469,7 @@ msgstr "類型"
 #: src/views/certificate/DNSCredential.vue:26 src/views/config/config.ts:29
 #: src/views/config/ConfigEdit.vue:123
-#: src/views/domain/components/RightSettings.vue:84
+#: src/views/domain/components/RightSettings.vue:87
 #: src/views/domain/DomainList.vue:44 src/views/environment/Environment.vue:98
 #: src/views/user/User.vue:40
 msgid "Updated at"
@ -1542,7 +1559,7 @@ msgid "Writing certificate to disk"
 msgstr "將憑證寫入磁碟"
 #: src/views/domain/ngx_conf/directive/DirectiveEditorItem.vue:80
-#: src/views/domain/ngx_conf/LocationEditor.vue:75
+#: src/views/domain/ngx_conf/LocationEditor.vue:73
 msgid "Yes"
 msgstr "是的"
@ -1554,6 +1571,10 @@ msgstr "您正在使用最新版本"
 msgid "You can check Nginx UI upgrade at this page."
 msgstr "您可以在此頁面檢查 Nginx UI 的升級。"
 #, fuzzy
 #~ msgid "Server"
 #~ msgstr "伺服器資訊"
 #, fuzzy
 #~ msgid "Leave blank will not change anything."
 #~ msgstr "留空表示不修改"
--- a/app/src/version.json
+++ b/app/src/version.json
@ -1 +1 @@
-{"version":"2.0.0-beta.7","build_id":93,"total_build":297}
+{"version":"2.0.0-beta.7","build_id":94,"total_build":298}
--- a/app/src/views/certificate/WildcardCertificate.vue
+++ b/app/src/views/certificate/WildcardCertificate.vue
@ -81,7 +81,7 @@ const issueCert = () => {
            type="primary"
            @click="issueCert"
          >
-            {{ $gettext('Issue') }}
+            {{ $gettext('Next') }}
          </AButton>
        </div>
      </template>
--- a/app/src/views/domain/components/Deploy.vue
+++ b/app/src/views/domain/components/Deploy.vue
@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { useGettext } from 'vue3-gettext'
 import { inject, reactive, ref } from 'vue'
 import { InfoCircleOutlined } from '@ant-design/icons-vue'
 import { Modal, notification } from 'ant-design-vue'
 import type { Ref } from 'vue'
 import domain from '@/api/domain'
 import NodeSelector from '@/components/NodeSelector/NodeSelector.vue'
@ -86,7 +86,7 @@ function deploy() {
  />
  <div class="node-deploy-control">
    <ACheckbox v-model:checked="enabled">
-      {{ $gettext('Enabled') }}
+      {{ $gettext('Enable') }}
    </ACheckbox>
    <div class="overwrite">
      <ACheckbox v-model:checked="overwrite">
--- a/app/src/views/domain/components/RightSettings.vue
+++ b/app/src/views/domain/components/RightSettings.vue
@ -19,7 +19,7 @@ const enabled = inject('enabled') as Ref<boolean>
 const name = inject('name') as Ref<string>
 const history_chatgpt_record = inject('history_chatgpt_record') as Ref<ChatComplicationMessage[]>
 const filename = inject('filename')
-const data: Ref<Site> = inject('data') as Ref<Site>
+const data = inject('data') as Ref<Site>
 const [modal, ContextHolder] = Modal.useModal()
--- a/app/src/views/domain/ngx_conf/NgxConfigEditor.vue
+++ b/app/src/views/domain/ngx_conf/NgxConfigEditor.vue
@ -162,6 +162,8 @@ const autoCertRef = computed({
 })
 provide('directivesMap', directivesMap)
 const activeKey = ref(['3'])
 </script>
 <template>
@ -174,23 +176,38 @@ provide('directivesMap', directivesMap)
      <ASwitch @change="confirm_change_tls" />
    </AFormItem>
-    <div class="mb-4">
+    <ACollapse
-      <h2>{{ $gettext('Custom') }}</h2>
+      v-model:activeKey="activeKey"
-      <CodeEditor
+      ghost
-        v-model:content="ngx_config.custom"
+    >
-        default-height="150px"
+      <ACollapsePanel
-      />
+        key="1"
-    </div>
+        :header="$gettext('Custom')"
-
+      >
-    <NgxUpstream />
+        <div class="mb-4">
-
+          <CodeEditor
-    <ADivider />
+            v-model:content="ngx_config.custom"
-
+            default-height="150px"
-    <NgxServer
+          />
-      v-model:auto-cert="autoCertRef"
+        </div>
-      :enabled="enabled"
+      </ACollapsePanel>
-      :cert-info="certInfo"
+      <ACollapsePanel
-    />
+        key="2"
        header="Upstream"
      >
        <NgxUpstream />
      </ACollapsePanel>
      <ACollapsePanel
        key="3"
        header="Server"
      >
        <NgxServer
          v-model:auto-cert="autoCertRef"
          :enabled="enabled"
          :cert-info="certInfo"
        />
      </ACollapsePanel>
    </ACollapse>
  </div>
 </template>
--- a/app/src/views/domain/ngx_conf/NgxServer.vue
+++ b/app/src/views/domain/ngx_conf/NgxServer.vue
@ -12,15 +12,14 @@ import DirectiveEditor from '@/views/domain/ngx_conf/directive/DirectiveEditor.v
 import type { NgxConfig, NgxDirective } from '@/api/ngx'
 import type { CertificateInfo } from '@/api/cert'
-const props = defineProps<{
+defineProps<{
  autoCert: boolean
  enabled: boolean
  certInfo?: {
    [key: number]: CertificateInfo
  }
 }>()
-const emit = defineEmits(['callback', 'update:autoCert'])
+const emit = defineEmits(['callback'])
 const { $gettext } = useGettext()
@ -45,14 +44,7 @@ const current_support_ssl = computed(() => {
  return false
 })
-const autoCertRef = computed({
+const autoCert = defineModel<boolean>('autoCert', { default: false })
  get() {
    return props.autoCert
  },
  set(value) {
    emit('update:autoCert', value)
  },
 })
 const router = useRouter()
@ -106,7 +98,6 @@ provide('ngx_directives', ngx_directives)
 <template>
  <div>
    <h2>Server</h2>
    <ContextHolder />
    <ATabs v-model:activeKey="current_server_index">
      <ATabPane
@ -136,11 +127,11 @@ provide('ngx_directives', ngx_directives)
          <template v-if="current_support_ssl && enabled">
            <Cert
              v-if="current_support_ssl"
-              v-model:enabled="autoCertRef"
+              v-model:enabled="autoCert"
              :config-name="ngx_config.name"
              :cert-info="certInfo?.[k]"
              :current-server-index="current_server_index"
-              @callback="$emit('callback')"
+              @callback="emit('callback')"
            />
          </template>
--- a/app/src/views/domain/ngx_conf/NgxUpstream.vue
+++ b/app/src/views/domain/ngx_conf/NgxUpstream.vue
@ -38,11 +38,26 @@ const ngx_directives = computed(() => {
 })
 provide('ngx_directives', ngx_directives)
 const open = ref(false)
 const renameIdx = ref(-1)
 const buffer = ref('')
 function rename(idx: number) {
  open.value = true
  renameIdx.value = idx
  buffer.value = ngx_config?.upstreams?.[renameIdx.value].name ?? ''
 }
 function ok() {
  if (ngx_config?.upstreams?.[renameIdx.value])
    ngx_config.upstreams[renameIdx.value].name = buffer.value
  open.value = false
 }
 </script>
 <template>
  <div>
    <h2>Upstream</h2>
    <ContextHolder />
    <ATabs v-model:activeKey="current_upstream_index">
      <ATabPane
@ -55,6 +70,9 @@ provide('ngx_directives', ngx_directives)
            <MoreOutlined />
            <template #overlay>
              <AMenu>
                <AMenuItem>
                  <a @click="rename(k)">{{ $gettext('Rename') }}</a>
                </AMenuItem>
                <AMenuItem>
                  <a @click="remove_upstream(k)">{{ $gettext('Delete') }}</a>
                </AMenuItem>
@ -64,16 +82,6 @@ provide('ngx_directives', ngx_directives)
        </template>
        <div class="tab-content">
          <div class="mb-4">
            <h2>{{ $gettext('Name') }}</h2>
            <AInput v-model:value="v.name" />
          </div>
          <div class="mb-4">
            <h2>{{ $gettext('Comments') }}</h2>
            <ATextarea v-model:value="v.comments" />
          </div>
          <DirectiveEditor />
        </div>
      </ATabPane>
@ -89,6 +97,19 @@ provide('ngx_directives', ngx_directives)
        </AButton>
      </template>
    </ATabs>
    <AModal
      v-model:open="open"
      :title="$gettext('Rename Upstream')"
      centered
      @ok="ok"
    >
      <AForm layout="vertical">
        <AFormItem :label="$gettext('Name')">
          <AInput v-model:value="buffer" />
        </AFormItem>
      </AForm>
    </AModal>
  </div>
 </template>
--- a/app/version.json
+++ b/app/version.json
@ -1 +1 @@
-{"version":"2.0.0-beta.7","build_id":93,"total_build":297}
+{"version":"2.0.0-beta.7","build_id":94,"total_build":298}
--- a/app/vite.config.ts
+++ b/app/vite.config.ts
@ -53,7 +53,11 @@ export default defineConfig(({ mode }) => {
    plugins: [
      fixAntdvWarningPlugin(),
-      vue(),
+      vue({
        script: {
          defineModel: true,
        },
      }),
      vueJsx(),
      vitePluginBuildId(),
		`@ -1 +1 @@`
			`{"version":"2.0.0-beta.7","build_id":93,"total_build":297}`				`{"version":"2.0.0-beta.7","build_id":94,"total_build":298}`