From 07dc8c4803878399ffffb3df0bd0fa1c9ebfc009 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 4 May 2023 10:04:21 +0000
Subject: Bump go.uber.org/atomic from 1.10.0 to 1.11.0

Bumps [go.uber.org/atomic](https://github.com/uber-go/atomic) from 1.10.0 to 1.11.0.
- [Release notes](https://github.com/uber-go/atomic/releases)
- [Changelog](https://github.com/uber-go/atomic/blob/master/CHANGELOG.md)
- [Commits](https://github.com/uber-go/atomic/compare/v1.10.0...v1.11.0)

---
updated-dependencies:
- dependency-name: go.uber.org/atomic
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 go.mod | 2 +-
 go.sum | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/go.mod b/go.mod
index 56dbfdd1..0e82ce53 100644
--- a/go.mod
+++ b/go.mod
@@ -15,7 +15,7 @@ require (
 	github.com/robfig/cron/v3 v3.0.1
 	github.com/shirou/gopsutil/v3 v3.23.4
 	github.com/xtls/xray-core v1.8.1
-	go.uber.org/atomic v1.10.0
+	go.uber.org/atomic v1.11.0
 	golang.org/x/text v0.9.0
 	google.golang.org/grpc v1.54.0
 	gorm.io/driver/sqlite v1.5.0
diff --git a/go.sum b/go.sum
index e3af703f..3c020b45 100644
--- a/go.sum
+++ b/go.sum
@@ -172,8 +172,8 @@ github.com/yuin/goldmark v1.4.13/go.mod h1:6yULJ656Px+3vBD8DxQVa3kxgyrAnzto9xy5t
 github.com/yusufpapurcu/wmi v1.2.2 h1:KBNDSne4vP5mbSWnJbO+51IMOXJB67QiYCSBrubbPRg=
 github.com/yusufpapurcu/wmi v1.2.2/go.mod h1:SBZ9tNy3G9/m5Oi98Zks0QjeHVDvuK0qfxQmPyzfmi0=
 go.starlark.net v0.0.0-20230302034142-4b1e35fe2254 h1:Ss6D3hLXTM0KobyBYEAygXzFfGcjnmfEJOBgSbemCtg=
-go.uber.org/atomic v1.10.0 h1:9qC72Qh0+3MqyJbAn8YU5xVq1frD8bn3JtD2oXtafVQ=
-go.uber.org/atomic v1.10.0/go.mod h1:LUxbIzbOniOlMKjJjyPfpl4v+PKK2cNJn91OQbhoJI0=
+go.uber.org/atomic v1.11.0 h1:ZvwS0R+56ePWxUNi+Atn9dWONBPp/AUETXlHW0DxSjE=
+go.uber.org/atomic v1.11.0/go.mod h1:LUxbIzbOniOlMKjJjyPfpl4v+PKK2cNJn91OQbhoJI0=
 golang.org/x/arch v0.0.0-20210923205945-b76863e36670/go.mod h1:5om86z9Hs0C8fWVUuoMHwpExlXzs5Tkyp9hOrfG7pp8=
 golang.org/x/arch v0.3.0 h1:02VY4/ZcO/gBOH6PUaoiptASxtXU10jazRCP865E97k=
 golang.org/x/arch v0.3.0/go.mod h1:5om86z9Hs0C8fWVUuoMHwpExlXzs5Tkyp9hOrfG7pp8=
-- 
cgit v1.2.3


From dbac48f05db6328bb9e19fc354c61d1a9e85de74 Mon Sep 17 00:00:00 2001
From: Hamidreza Ghavami <hamid.r.gh.1998@gmail.com>
Date: Thu, 4 May 2023 20:58:16 +0430
Subject: updated sub remark to include inbound name

---
 web/service/sub.go | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/web/service/sub.go b/web/service/sub.go
index 2aaee06a..69cafda1 100644
--- a/web/service/sub.go
+++ b/web/service/sub.go
@@ -105,9 +105,10 @@ func (s *SubService) genVmessLink(inbound *model.Inbound, email string) string {
 	if inbound.Protocol != model.VMess {
 		return ""
 	}
+	remark := fmt.Sprintf("%s-%s", inbound.Remark, email)
 	obj := map[string]interface{}{
 		"v":    "2",
-		"ps":   email,
+		"ps":   remark,
 		"add":  s.address,
 		"port": inbound.Port,
 		"type": "none",
@@ -380,7 +381,8 @@ func (s *SubService) genVlessLink(inbound *model.Inbound, email string) string {
 	// Set the new query values on the URL
 	url.RawQuery = q.Encode()
 
-	url.Fragment = email
+	remark := fmt.Sprintf("%s-%s", inbound.Remark, email)
+	url.Fragment = remark
 	return url.String()
 }
 
@@ -558,7 +560,8 @@ func (s *SubService) genTrojanLink(inbound *model.Inbound, email string) string
 	// Set the new query values on the URL
 	url.RawQuery = q.Encode()
 
-	url.Fragment = email
+	remark := fmt.Sprintf("%s-%s", inbound.Remark, email)
+	url.Fragment = remark
 	return url.String()
 }
 
-- 
cgit v1.2.3


From 4f8de18d1f21518b98aba82cbf14d2d23c0c178c Mon Sep 17 00:00:00 2001
From: Hamidreza Ghavami <hamid.r.gh.1998@gmail.com>
Date: Thu, 4 May 2023 21:09:08 +0430
Subject: renamed setting.html to settings.html and update its route name

---
 web/controller/xui.go          |   6 +-
 web/html/xui/common_sider.html |   2 +-
 web/html/xui/setting.html      | 775 -----------------------------------------
 web/html/xui/settings.html     | 775 +++++++++++++++++++++++++++++++++++++++++
 4 files changed, 779 insertions(+), 779 deletions(-)
 delete mode 100644 web/html/xui/setting.html
 create mode 100644 web/html/xui/settings.html

diff --git a/web/controller/xui.go b/web/controller/xui.go
index 5832be84..c836057a 100644
--- a/web/controller/xui.go
+++ b/web/controller/xui.go
@@ -23,7 +23,7 @@ func (a *XUIController) initRouter(g *gin.RouterGroup) {
 
 	g.GET("/", a.index)
 	g.GET("/inbounds", a.inbounds)
-	g.GET("/setting", a.setting)
+	g.GET("/settings", a.settings)
 
 	a.inboundController = NewInboundController(g)
 	a.settingController = NewSettingController(g)
@@ -37,6 +37,6 @@ func (a *XUIController) inbounds(c *gin.Context) {
 	html(c, "inbounds.html", "pages.inbounds.title", nil)
 }
 
-func (a *XUIController) setting(c *gin.Context) {
-	html(c, "setting.html", "pages.setting.title", nil)
+func (a *XUIController) settings(c *gin.Context) {
+	html(c, "settings.html", "pages.setting.title", nil)
 }
diff --git a/web/html/xui/common_sider.html b/web/html/xui/common_sider.html
index 278dc4e5..c7765d60 100644
--- a/web/html/xui/common_sider.html
+++ b/web/html/xui/common_sider.html
@@ -7,7 +7,7 @@
     <a-icon type="user"></a-icon>
     <span>{{ i18n "menu.inbounds"}}</span>
 </a-menu-item>
-<a-menu-item key="{{ .base_path }}xui/setting">
+<a-menu-item key="{{ .base_path }}xui/settings">
     <a-icon type="setting"></a-icon>
     <span>{{ i18n "menu.setting"}}</span>
 </a-menu-item>
diff --git a/web/html/xui/setting.html b/web/html/xui/setting.html
deleted file mode 100644
index 7cbb44a2..00000000
--- a/web/html/xui/setting.html
+++ /dev/null
@@ -1,775 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
-<style>
-    @media (min-width: 769px) {
-        .ant-layout-content {
-            margin: 24px 16px;
-        }
-    }
-
-    .ant-col-sm-24 {
-        margin-top: 10px;
-    }
-
-    .ant-tabs-bar {
-        margin: 0;
-    }
-
-    .ant-list-item {
-        display: block;
-    }
-
-    :not(.ant-card-dark)>.ant-tabs-top-bar {
-        background: white;
-    }
-</style>
-
-<body>
-    <a-layout id="app" v-cloak>
-        {{ template "commonSider" . }}
-        <a-layout id="content-layout" :style="siderDrawer.isDarkTheme ? bgDarkStyle : ''">
-            <a-layout-content>
-                <a-spin :spinning="spinning" :delay="500" tip="loading">
-                    <a-space direction="vertical">
-                        <a-space direction="horizontal">
-                            <a-button type="primary" :disabled="saveBtnDisable" @click="updateAllSetting">{{ i18n "pages.setting.save" }}</a-button>
-                            <a-button type="danger" :disabled="!saveBtnDisable" @click="restartPanel">{{ i18n "pages.setting.restartPanel" }}</a-button>
-                        </a-space>
-
-                        <a-tabs default-active-key="1" :class="siderDrawer.isDarkTheme ? darkClass : ''">
-                            <a-tab-pane key="1" tab='{{ i18n "pages.setting.panelConfig"}}'>
-                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.panelListeningIP"}}' desc='{{ i18n "pages.setting.panelListeningIPDesc"}}' v-model="allSetting.webListen"></setting-list-item>
-                                    <setting-list-item type="number" title='{{ i18n "pages.setting.panelPort"}}' desc='{{ i18n "pages.setting.panelPortDesc"}}' v-model.number="allSetting.webPort"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.publicKeyPath"}}' desc='{{ i18n "pages.setting.publicKeyPathDesc"}}' v-model="allSetting.webCertFile"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.privateKeyPath"}}' desc='{{ i18n "pages.setting.privateKeyPathDesc"}}' v-model="allSetting.webKeyFile"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.panelUrlPath"}}' desc='{{ i18n "pages.setting.panelUrlPathDesc"}}' v-model="allSetting.webBasePath"></setting-list-item>
-                                    <setting-list-item type="number" title='{{ i18n "pages.setting.sessionMaxAge" }}' desc='{{ i18n "pages.setting.sessionMaxAgeDesc" }}'  v-model="allSetting.sessionMaxAge" :min="0"></setting-list-item>
-                                    <setting-list-item type="number" title='{{ i18n "pages.setting.expireTimeDiff" }}' desc='{{ i18n "pages.setting.expireTimeDiffDesc" }}'  v-model="allSetting.expireDiff" :min="0"></setting-list-item>
-                                    <setting-list-item type="number" title='{{ i18n "pages.setting.trafficDiff" }}' desc='{{ i18n "pages.setting.trafficDiffDesc" }}'  v-model="allSetting.trafficDiff" :min="0"></setting-list-item>
-                                    <a-list-item>
-                                        <a-row style="padding: 20px">
-                                            <a-col :lg="24" :xl="12">
-                                                <a-list-item-meta title="Language" />
-                                            </a-col>
-
-                                            <a-col :lg="24" :xl="12">
-                                                <template>
-                                                    <a-select
-                                                        ref="selectLang"
-                                                        v-model="lang"
-                                                        @change="setLang(lang)"
-                                                        :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''"
-                                                        style="width: 100%"
-                                                    >
-                                                        <a-select-option :value="l.value" :label="l.value" v-for="l in supportLangs">
-                                                            <span role="img" aria-label="l.name" v-text="l.icon"></span>&nbsp;&nbsp;<span v-text="l.name"></span>
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </template>
-                                            </a-col>
-                                        </a-row>
-                                    </a-list-item>
-                                </a-list>
-                            </a-tab-pane>
-
-                            <a-tab-pane key="2" tab='{{ i18n "pages.setting.userSetting"}}'>
-                                <a-form :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65); padding: 20px;': 'background: white; padding: 20px;'">
-                                    <a-form-item label='{{ i18n "pages.setting.oldUsername"}}'>
-                                        <a-input v-model="user.oldUsername" style="max-width: 300px"></a-input>
-                                    </a-form-item>
-                                    <a-form-item label='{{ i18n "pages.setting.currentPassword"}}'>
-                                        <a-input type="password" v-model="user.oldPassword" style="max-width: 300px"></a-input>
-                                    </a-form-item>
-                                    <a-form-item label='{{ i18n "pages.setting.newUsername"}}'>
-                                        <a-input v-model="user.newUsername" style="max-width: 300px"></a-input>
-                                    </a-form-item>
-                                    <a-form-item label='{{ i18n "pages.setting.newPassword"}}'>
-                                        <a-input type="password" v-model="user.newPassword" style="max-width: 300px"></a-input>
-                                    </a-form-item>
-                                    <a-form-item>
-                                        <a-button type="primary" @click="updateUser">{{ i18n "confirm" }}</a-button>
-                                    </a-form-item>
-                                </a-form>
-                                <a-form :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65); padding: 20px;': 'background: white; padding: 20px;'">
-                                    <a-list-item style="padding: 20px">
-                                       <a-row>
-                                         <a-col :lg="24" :xl="12">
-                                            <a-list-item-meta title='{{ i18n "pages.setting.loginSecurity" }}' description='{{ i18n "pages.setting.loginSecurityDesc" }}'/>
-                                         </a-col>
-                                         <a-col :lg="24" :xl="12">
-                                            <template>
-                                                <a-switch @change="toggleToken(allSetting.secretEnable)" v-model="allSetting.secretEnable"></a-switch>
-                                            </template>
-                                         </a-col>
-                                       </a-row>
-                                    </a-list-item>
-                                    <a-list-item style="padding: 20px">
-                                      <a-row>
-                                        <a-col :lg="24" :xl="12">
-                                          <a-list-item-meta title='{{ i18n "pages.setting.secretToken" }}' description='{{ i18n "pages.setting.secretTokenDesc" }}'/>
-                                
-                                        </a-col>
-                                        <a-col :lg="24" :xl="12">
-                                           <svg 
-                                                  @click="getNewSecret"
-                                                  xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="anticon anticon-question-circle" viewBox="0 0 16 16"> <path d="M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41zm-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9z"/> <path fill-rule="evenodd" d="M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5.002 5.002 0 0 0 8 3zM3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9H3.1z"/> 
-                                           </svg>
-                                           <template>
-                                               <a-textarea type="text" id='token' :disabled="!allSetting.secretEnable" v-model="user.loginSecret"></a-textarea>
-                                           </template>
-                                        </a-col>
-                                      </a-row>
-                                    </a-list-item>
-                                    <a-button type="primary" @click="updateSecret">{{ i18n "confirm" }}</a-button>
-                                </a-form>
-                            </a-tab-pane>
-                            <a-tab-pane key="3" tab='{{ i18n "pages.setting.xrayConfiguration"}}'>
-                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
-                                    <a-divider>{{ i18n "pages.setting.actions"}}</a-divider>
-                                    <a-space direction="horizontal" style="padding: 0 20px">
-                                        <a-button type="primary" @click="resetXrayConfigToDefault">{{ i18n "pages.setting.resetDefaultConfig" }}</a-button>
-                                    </a-space>
-
-                                    <a-divider>{{ i18n "pages.setting.basicTemplate"}}</a-divider>
-                                    <a-collapse>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.generalConfigs"}}'>
-                                            <a-row :xs="24" :sm="24" :lg="12">
-                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
-                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
-                                                    {{ i18n "pages.setting.generalConfigsDesc" }}
-                                                </h2>
-                                            </a-row>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigTorrent"}}' desc='{{ i18n "pages.setting.xrayConfigTorrentDesc"}}'  v-model="torrentSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigPrivateIp"}}' desc='{{ i18n "pages.setting.xrayConfigPrivateIpDesc"}}'  v-model="privateIpSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigAds"}}' desc='{{ i18n "pages.setting.xrayConfigAdsDesc"}}'  v-model="AdsSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigPorn"}}' desc='{{ i18n "pages.setting.xrayConfigPornDesc"}}'  v-model="PornSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.countryConfigs"}}'>
-                                            <a-row :xs="24" :sm="24" :lg="12">
-                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
-                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
-                                                    {{ i18n "pages.setting.countryConfigsDesc" }}
-                                                </h2>
-                                            </a-row>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigIRIp"}}' desc='{{ i18n "pages.setting.xrayConfigIRIpDesc"}}'  v-model="IRIpSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigIRDomain"}}' desc='{{ i18n "pages.setting.xrayConfigIRDomainDesc"}}'  v-model="IRDomainSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigChinaIp"}}' desc='{{ i18n "pages.setting.xrayConfigChinaIpDesc"}}'  v-model="ChinaIpSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigChinaDomain"}}' desc='{{ i18n "pages.setting.xrayConfigChinaDomainDesc"}}'  v-model="ChinaDomainSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigRussiaIp"}}' desc='{{ i18n "pages.setting.xrayConfigRussiaIpDesc"}}'  v-model="RussiaIpSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigRussiaDomain"}}' desc='{{ i18n "pages.setting.xrayConfigRussiaDomainDesc"}}'  v-model="RussiaDomainSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.ipv4Configs"}}'>
-                                            <a-row :xs="24" :sm="24" :lg="12">
-                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
-                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
-                                                    {{ i18n "pages.setting.ipv4ConfigsDesc" }}
-                                                </h2>
-                                            </a-row>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigGoogleIPv4"}}' desc='{{ i18n "pages.setting.xrayConfigGoogleIPv4Desc"}}'  v-model="GoogleIPv4Settings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigNetflixIPv4"}}' desc='{{ i18n "pages.setting.xrayConfigNetflixIPv4Desc"}}'  v-model="NetflixIPv4Settings"></setting-list-item>
-                                        </a-collapse-panel>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.warpConfigs"}}'>
-                                            <a-row :xs="24" :sm="24" :lg="12">
-                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
-                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
-                                                    {{ i18n "pages.setting.warpConfigsDesc" }}
-                                                </h2>
-                                            </a-row>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigGoogleWARP"}}' desc='{{ i18n "pages.setting.xrayConfigGoogleWARPDesc"}}'  v-model="GoogleWARPSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigOpenAIWARP"}}' desc='{{ i18n "pages.setting.xrayConfigOpenAIWARPDesc"}}'  v-model="OpenAIWARPSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigNetflixWARP"}}' desc='{{ i18n "pages.setting.xrayConfigNetflixWARPDesc"}}'  v-model="NetflixWARPSettings"></setting-list-item>
-                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigSpotifyWARP"}}' desc='{{ i18n "pages.setting.xrayConfigSpotifyWARPDesc"}}'  v-model="SpotifyWARPSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                    </a-collapse>
-
-                                    <a-divider>{{ i18n "pages.setting.advancedTemplate"}}</a-divider>
-                                    <a-collapse>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.xrayConfigInbounds"}}'>
-                                            <setting-list-item type="textarea" title='{{ i18n "pages.setting.xrayConfigInbounds"}}' desc='{{ i18n "pages.setting.xrayConfigInboundsDesc"}}' v-model="inboundSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.xrayConfigOutbounds"}}'>
-                                            <setting-list-item type="textarea" title='{{ i18n "pages.setting.xrayConfigOutbounds"}}' desc='{{ i18n "pages.setting.xrayConfigOutboundsDesc"}}' v-model="outboundSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                        <a-collapse-panel header='{{ i18n "pages.setting.xrayConfigRoutings"}}'>
-                                            <setting-list-item type="textarea" title='{{ i18n "pages.setting.xrayConfigRoutings"}}' desc='{{ i18n "pages.setting.xrayConfigRoutingsDesc"}}' v-model="routingRuleSettings"></setting-list-item>
-                                        </a-collapse-panel>
-                                    </a-collapse>
-
-                                    <a-divider>{{ i18n "pages.setting.completeTemplate"}}</a-divider>
-                                    <setting-list-item type="textarea" title='{{ i18n "pages.setting.xrayConfigTemplate"}}' desc='{{ i18n "pages.setting.xrayConfigTemplateDesc"}}' v-model="allSetting.xrayTemplateConfig"></setting-list-item>
-                                </a-list>
-                            </a-tab-pane>
-
-                            <a-tab-pane key="4" tab='{{ i18n "pages.setting.TGReminder"}}'>
-                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
-                                    <setting-list-item type="switch" title='{{ i18n "pages.setting.telegramBotEnable" }}' desc='{{ i18n "pages.setting.telegramBotEnableDesc" }}' v-model="allSetting.tgBotEnable"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.telegramToken"}}' desc='{{ i18n "pages.setting.telegramTokenDesc"}}' v-model="allSetting.tgBotToken"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.telegramChatId"}}' desc='{{ i18n "pages.setting.telegramChatIdDesc"}}' v-model="allSetting.tgBotChatId"></setting-list-item>
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.telegramNotifyTime"}}' desc='{{ i18n "pages.setting.telegramNotifyTimeDesc"}}' v-model="allSetting.tgRunTime"></setting-list-item>
-                                    <setting-list-item type="switch" title='{{ i18n "pages.setting.tgNotifyBackup" }}' desc='{{ i18n "pages.setting.tgNotifyBackupDesc" }}' v-model="allSetting.tgBotBackup"></setting-list-item>
-                                    <setting-list-item type="number" title='{{ i18n "pages.setting.tgNotifyCpu" }}' desc='{{ i18n "pages.setting.tgNotifyCpuDesc" }}' v-model="allSetting.tgCpu" :min="0" :max="100"></setting-list-item>
-                                </a-list>
-                            </a-tab-pane>
-
-                            <a-tab-pane key="5" tab='{{ i18n "pages.setting.otherSetting"}}'>
-                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
-                                    <setting-list-item type="text" title='{{ i18n "pages.setting.timeZonee"}}' desc='{{ i18n "pages.setting.timeZoneDesc"}}' v-model="allSetting.timeLocation"></setting-list-item>
-                                </a-list>
-                            </a-tab-pane>
-                        </a-tabs>
-                    </a-space>
-                </a-spin>
-            </a-layout-content>
-        </a-layout>
-    </a-layout>
-    {{template "js" .}}
-    {{template "component/setting"}}
-    <script>
-
-        const app = new Vue({
-            delimiters: ['[[', ']]'],
-            el: '#app',
-            data: {
-                siderDrawer,
-                spinning: false,
-                oldAllSetting: new AllSetting(),
-                allSetting: new AllSetting(),
-                saveBtnDisable: true,
-                user: new User(),
-                lang: getLang(),
-                ipv4Settings: {
-                    tag: "IPv4",
-                    protocol: "freedom",
-                    settings: {
-                        domainStrategy: "UseIPv4"
-                    }
-                },
-                warpSettings: {
-                    tag: "WARP",
-                    protocol: "socks",
-                    settings: {
-                        servers: [
-                            {
-                                address: "127.0.0.1",
-                                port: 40000
-                            }
-                        ]
-                    }
-                },
-                settingsData: {
-                    protocols: {
-                        bittorrent: ["bittorrent"],
-                    },
-                    ips: {
-                        local: ["geoip:private"],
-                        google: ["geoip:google"],
-                        cn: ["geoip:cn"],
-                        ir: ["geoip:ir"],
-                        ru: ["geoip:ru"],
-                    },
-                    domains: {
-                        ads: [
-                            "geosite:category-ads-all",
-                            "geosite:category-ads",
-                            "geosite:google-ads",
-                            "geosite:spotify-ads"
-                        ],
-                        porn: ["geosite:category-porn"],
-                        openai: ["geosite:openai"],
-                        google: ["geosite:google"],
-                        spotify: ["geosite:spotify"],
-                        netflix: ["geosite:netflix"],
-                        cn: ["geosite:cn"],
-                        ru: ["geosite:category-ru-gov"],
-                        ir: [
-                            "regexp:.*\\.ir$",
-                            "ext:iran.dat:ir",
-                            "ext:iran.dat:other",
-                            "ext:iran.dat:ads",
-                            "geosite:category-ir"
-                        ]
-                    },
-                }
-            },
-            methods: {
-                loading(spinning = true , obj) {
-                if(obj == null)
-                  this.spinning = spinning;
-                },
-                async getAllSetting() {
-                    this.loading(true);
-                    const msg = await HttpUtil.post("/xui/setting/all");
-                    this.loading(false);
-                    if (msg.success) {
-                        this.oldAllSetting = new AllSetting(msg.obj);
-                        this.allSetting = new AllSetting(msg.obj);
-                        this.saveBtnDisable = true;
-                    }
-                    await this.getUserSecret();
-                },
-                async updateAllSetting() {
-                    this.loading(true);
-                    const msg = await HttpUtil.post("/xui/setting/update", this.allSetting);
-                    this.loading(false);
-                    if (msg.success) {
-                        await this.getAllSetting();
-                    }
-                },
-                async updateUser() {
-                    this.loading(true);
-                    const msg = await HttpUtil.post("/xui/setting/updateUser", this.user);
-                    this.loading(false);
-                    if (msg.success) {
-                        this.user = {};
-                        window.location.replace("/logout")
-                    }
-                },
-                async restartPanel() {
-                    await new Promise(resolve => {
-                        this.$confirm({
-                            title: '{{ i18n "pages.setting.restartPanel" }}',
-                            content: '{{ i18n "pages.setting.restartPanelDesc" }}',
-                            okText: '{{ i18n "sure" }}',
-                            cancelText: '{{ i18n "cancel" }}',
-                            onOk: () => resolve(),
-                        });
-                    });
-                    this.loading(true);
-                    const msg = await HttpUtil.post("/xui/setting/restartPanel");
-                    this.loading(false);
-                    if (msg.success) {
-                        this.loading(true);
-                        await PromiseUtil.sleep(5000);
-                        location.reload();
-                    }
-                },
-                async getUserSecret(){
-                const user_msg = await HttpUtil.post("/xui/setting/getUserSecret", this.user);
-                if (user_msg.success){
-                    this.user = user_msg.obj;
-                }
-                this.loading(false);
-                },
-                async updateSecret(){
-                this.loading(true);
-                const msg = await HttpUtil.post("/xui/setting/updateUserSecret", this.user);
-                if (msg.success){
-                    this.user = msg.obj;
-                    window.location.replace("/logout")
-                }
-                this.loading(false);
-                await this.updateAllSetting();
-                },
-                async getNewSecret(){
-                this.loading(true);
-                await PromiseUtil.sleep(1000);
-                var chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890';
-                var string = '';
-                var len = 64;
-                for(var ii=0; ii<len; ii++){
-                    string += chars[Math.floor(Math.random() * chars.length)];
-                }
-                this.user.loginSecret = string;
-                document.getElementById('token').value =this.user.loginSecret; 
-                this.loading(false);
-                },
-                async toggleToken(value){
-                if(value)
-                  this.getNewSecret();
-                else 
-                  this.user.loginSecret = "";
-                },
-                async resetXrayConfigToDefault() {
-                    this.loading(true);
-                    const msg = await HttpUtil.get("/xui/setting/getDefaultJsonConfig");
-                    this.loading(false);
-                    if (msg.success) {
-                        this.templateSettings = JSON.parse(JSON.stringify(msg.obj, null, 2));
-                        this.saveBtnDisable = true;
-                    }
-                },
-                checkRequiredOutbounds() {
-                    const newTemplateSettings = this.templateSettings;
-                    const haveIPv4Outbounds = newTemplateSettings.outbounds.some((o) => o?.tag === "IPv4");
-                    const haveIPv4Rules = newTemplateSettings.routing.rules.some((r) => r?.outboundTag === "IPv4");
-                    const haveWARPOutbounds = newTemplateSettings.outbounds.some((o) => o?.tag === "WARP");
-                    const haveWARPRules = newTemplateSettings.routing.rules.some((r) => r?.outboundTag === "WARP");
-                    if (haveWARPRules && !haveWARPOutbounds) {
-                        newTemplateSettings.outbounds.push(this.warpSettings);
-                    }
-                    if (haveIPv4Rules && !haveIPv4Outbounds) {
-                        newTemplateSettings.outbounds.push(this.ipv4Settings);
-                    }
-                    this.templateSettings = newTemplateSettings;
-                },
-                templateRuleGetter(routeSettings) {
-                    const { data, property, outboundTag } = routeSettings;
-                    let result = false;
-                    if (this.templateSettings != null) {
-                        this.templateSettings.routing.rules.forEach(
-                            (routingRule) => {
-                                if (
-                                    routingRule.hasOwnProperty(property) &&
-                                    routingRule.hasOwnProperty("outboundTag") &&
-                                    routingRule.outboundTag === outboundTag
-                                ) {
-                                    if (data.includes(routingRule[property][0])) {
-                                        result = true;
-                                    }
-                                }
-                            }
-                        );
-                    }
-                    return result;
-                },
-                templateRuleSetter(routeSettings) {
-                    const { newValue, data, property, outboundTag } = routeSettings;
-                    const oldTemplateSettings = this.templateSettings;
-                    const newTemplateSettings = oldTemplateSettings;
-                    if (newValue) {
-                        const propertyRule = {
-                            type: "field",
-                            outboundTag,
-                            [property]: data
-                        };
-                        newTemplateSettings.routing.rules.push(propertyRule);
-                    }
-                    else {
-                        const newRules = [];
-                        newTemplateSettings.routing.rules.forEach(
-                            (routingRule) => {
-                                if (
-                                    routingRule.hasOwnProperty(property) &&
-                                    routingRule.hasOwnProperty("outboundTag") &&
-                                    routingRule.outboundTag === outboundTag
-                                ) {
-                                    if (data.includes(routingRule[property][0])) {
-                                        return;
-                                    }
-                                }
-                                newRules.push(routingRule);
-                            }
-                        );
-                        newTemplateSettings.routing.rules = newRules;
-                    }
-                    this.templateSettings = newTemplateSettings;
-                    this.checkRequiredOutbounds();
-                }
-            },
-            async mounted() {
-                await this.getAllSetting();
-                while (true) {
-                    await PromiseUtil.sleep(1000);
-                    this.saveBtnDisable = this.oldAllSetting.equals(this.allSetting);
-                }
-            },
-            computed: {
-                templateSettings: {
-                    get: function () { return this.allSetting.xrayTemplateConfig ? JSON.parse(this.allSetting.xrayTemplateConfig) : null; },
-                    set: function (newValue) { this.allSetting.xrayTemplateConfig = JSON.stringify(newValue, null, 2) },
-                },
-                inboundSettings: {
-                    get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.inbounds, null, 2) : null; },
-                    set: function (newValue) {
-                        newTemplateSettings = this.templateSettings;
-                        newTemplateSettings.inbounds = JSON.parse(newValue)
-                        this.templateSettings = newTemplateSettings
-                    },
-                },
-                outboundSettings: {
-                    get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.outbounds, null, 2) : null; },
-                    set: function (newValue) {
-                        newTemplateSettings = this.templateSettings;
-                        newTemplateSettings.outbounds = JSON.parse(newValue)
-                        this.templateSettings = newTemplateSettings
-                    },
-                },
-                routingRuleSettings: {
-                    get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.routing.rules, null, 2) : null; },
-                    set: function (newValue) {
-                        newTemplateSettings = this.templateSettings;
-                        newTemplateSettings.routing.rules = JSON.parse(newValue)
-                        this.templateSettings = newTemplateSettings
-                    },
-                },
-                torrentSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "protocol",
-                            data: this.settingsData.protocols.bittorrent
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "protocol",
-                            data: this.settingsData.protocols.bittorrent
-                        });
-                    },
-                },
-                privateIpSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.local
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.local
-                        });
-                    },
-                },
-                AdsSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ads
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ads
-                        });
-                    },
-                },
-                PornSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.porn
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.porn
-                        });
-                    },
-                },
-                GoogleIPv4Settings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "IPv4",
-                            property: "domain",
-                            data: this.settingsData.domains.google
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "IPv4",
-                            property: "domain",
-                            data: this.settingsData.domains.google
-                        });
-                    },
-                },
-                NetflixIPv4Settings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "IPv4",
-                            property: "domain",
-                            data: this.settingsData.domains.netflix
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "IPv4",
-                            property: "domain",
-                            data: this.settingsData.domains.netflix
-                        });
-                    },
-                },
-                IRIpSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.ir
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.ir
-                        });
-                    },
-                },
-                IRDomainSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ir
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ir
-                        });
-                    },
-                },
-                ChinaIpSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.cn
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.cn
-                        });
-                    },
-                },
-                ChinaDomainSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.cn
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.cn
-                        });
-                    },
-                },
-                RussiaIpSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.ru
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "ip",
-                            data: this.settingsData.ips.ru
-                        });
-                    },
-                },
-                RussiaDomainSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ru
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "blocked",
-                            property: "domain",
-                            data: this.settingsData.domains.ru
-                        });
-                    },
-                },
-                GoogleWARPSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.google
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.google
-                        });
-                    },
-                },
-                OpenAIWARPSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.openai
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.openai
-                        });
-                    },
-                },
-                NetflixWARPSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.netflix
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.netflix
-                        });
-                    },
-                },
-                SpotifyWARPSettings: {
-                    get: function () {
-                        return this.templateRuleGetter({
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.spotify
-                        });
-                    },
-                    set: function (newValue) {
-                        this.templateRuleSetter({
-                            newValue,
-                            outboundTag: "WARP",
-                            property: "domain",
-                            data: this.settingsData.domains.spotify
-                        });
-                    },
-                },
-            }
-        });
-
-    </script>
-</body>
-
-</html>
diff --git a/web/html/xui/settings.html b/web/html/xui/settings.html
new file mode 100644
index 00000000..7cbb44a2
--- /dev/null
+++ b/web/html/xui/settings.html
@@ -0,0 +1,775 @@
+<!DOCTYPE html>
+<html lang="en">
+{{template "head" .}}
+<style>
+    @media (min-width: 769px) {
+        .ant-layout-content {
+            margin: 24px 16px;
+        }
+    }
+
+    .ant-col-sm-24 {
+        margin-top: 10px;
+    }
+
+    .ant-tabs-bar {
+        margin: 0;
+    }
+
+    .ant-list-item {
+        display: block;
+    }
+
+    :not(.ant-card-dark)>.ant-tabs-top-bar {
+        background: white;
+    }
+</style>
+
+<body>
+    <a-layout id="app" v-cloak>
+        {{ template "commonSider" . }}
+        <a-layout id="content-layout" :style="siderDrawer.isDarkTheme ? bgDarkStyle : ''">
+            <a-layout-content>
+                <a-spin :spinning="spinning" :delay="500" tip="loading">
+                    <a-space direction="vertical">
+                        <a-space direction="horizontal">
+                            <a-button type="primary" :disabled="saveBtnDisable" @click="updateAllSetting">{{ i18n "pages.setting.save" }}</a-button>
+                            <a-button type="danger" :disabled="!saveBtnDisable" @click="restartPanel">{{ i18n "pages.setting.restartPanel" }}</a-button>
+                        </a-space>
+
+                        <a-tabs default-active-key="1" :class="siderDrawer.isDarkTheme ? darkClass : ''">
+                            <a-tab-pane key="1" tab='{{ i18n "pages.setting.panelConfig"}}'>
+                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
+                                    <setting-list-item type="text" title='{{ i18n "pages.setting.panelListeningIP"}}' desc='{{ i18n "pages.setting.panelListeningIPDesc"}}' v-model="allSetting.webListen"></setting-list-item>
+                                    <setting-list-item type="number" title='{{ i18n "pages.setting.panelPort"}}' desc='{{ i18n "pages.setting.panelPortDesc"}}' v-model.number="allSetting.webPort"></setting-list-item>
+                                    <setting-list-item type="text" title='{{ i18n "pages.setting.publicKeyPath"}}' desc='{{ i18n "pages.setting.publicKeyPathDesc"}}' v-model="allSetting.webCertFile"></setting-list-item>
+                                    <setting-list-item type="text" title='{{ i18n "pages.setting.privateKeyPath"}}' desc='{{ i18n "pages.setting.privateKeyPathDesc"}}' v-model="allSetting.webKeyFile"></setting-list-item>
+                                    <setting-list-item type="text" title='{{ i18n "pages.setting.panelUrlPath"}}' desc='{{ i18n "pages.setting.panelUrlPathDesc"}}' v-model="allSetting.webBasePath"></setting-list-item>
+                                    <setting-list-item type="number" title='{{ i18n "pages.setting.sessionMaxAge" }}' desc='{{ i18n "pages.setting.sessionMaxAgeDesc" }}'  v-model="allSetting.sessionMaxAge" :min="0"></setting-list-item>
+                                    <setting-list-item type="number" title='{{ i18n "pages.setting.expireTimeDiff" }}' desc='{{ i18n "pages.setting.expireTimeDiffDesc" }}'  v-model="allSetting.expireDiff" :min="0"></setting-list-item>
+                                    <setting-list-item type="number" title='{{ i18n "pages.setting.trafficDiff" }}' desc='{{ i18n "pages.setting.trafficDiffDesc" }}'  v-model="allSetting.trafficDiff" :min="0"></setting-list-item>
+                                    <a-list-item>
+                                        <a-row style="padding: 20px">
+                                            <a-col :lg="24" :xl="12">
+                                                <a-list-item-meta title="Language" />
+                                            </a-col>
+
+                                            <a-col :lg="24" :xl="12">
+                                                <template>
+                                                    <a-select
+                                                        ref="selectLang"
+                                                        v-model="lang"
+                                                        @change="setLang(lang)"
+                                                        :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''"
+                                                        style="width: 100%"
+                                                    >
+                                                        <a-select-option :value="l.value" :label="l.value" v-for="l in supportLangs">
+                                                            <span role="img" aria-label="l.name" v-text="l.icon"></span>&nbsp;&nbsp;<span v-text="l.name"></span>
+                                                        </a-select-option>
+                                                    </a-select>
+                                                </template>
+                                            </a-col>
+                                        </a-row>
+                                    </a-list-item>
+                                </a-list>
+                            </a-tab-pane>
+
+                            <a-tab-pane key="2" tab='{{ i18n "pages.setting.userSetting"}}'>
+                                <a-form :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65); padding: 20px;': 'background: white; padding: 20px;'">
+                                    <a-form-item label='{{ i18n "pages.setting.oldUsername"}}'>
+                                        <a-input v-model="user.oldUsername" style="max-width: 300px"></a-input>
+                                    </a-form-item>
+                                    <a-form-item label='{{ i18n "pages.setting.currentPassword"}}'>
+                                        <a-input type="password" v-model="user.oldPassword" style="max-width: 300px"></a-input>
+                                    </a-form-item>
+                                    <a-form-item label='{{ i18n "pages.setting.newUsername"}}'>
+                                        <a-input v-model="user.newUsername" style="max-width: 300px"></a-input>
+                                    </a-form-item>
+                                    <a-form-item label='{{ i18n "pages.setting.newPassword"}}'>
+                                        <a-input type="password" v-model="user.newPassword" style="max-width: 300px"></a-input>
+                                    </a-form-item>
+                                    <a-form-item>
+                                        <a-button type="primary" @click="updateUser">{{ i18n "confirm" }}</a-button>
+                                    </a-form-item>
+                                </a-form>
+                                <a-form :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65); padding: 20px;': 'background: white; padding: 20px;'">
+                                    <a-list-item style="padding: 20px">
+                                       <a-row>
+                                         <a-col :lg="24" :xl="12">
+                                            <a-list-item-meta title='{{ i18n "pages.setting.loginSecurity" }}' description='{{ i18n "pages.setting.loginSecurityDesc" }}'/>
+                                         </a-col>
+                                         <a-col :lg="24" :xl="12">
+                                            <template>
+                                                <a-switch @change="toggleToken(allSetting.secretEnable)" v-model="allSetting.secretEnable"></a-switch>
+                                            </template>
+                                         </a-col>
+                                       </a-row>
+                                    </a-list-item>
+                                    <a-list-item style="padding: 20px">
+                                      <a-row>
+                                        <a-col :lg="24" :xl="12">
+                                          <a-list-item-meta title='{{ i18n "pages.setting.secretToken" }}' description='{{ i18n "pages.setting.secretTokenDesc" }}'/>
+                                
+                                        </a-col>
+                                        <a-col :lg="24" :xl="12">
+                                           <svg 
+                                                  @click="getNewSecret"
+                                                  xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="anticon anticon-question-circle" viewBox="0 0 16 16"> <path d="M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41zm-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9z"/> <path fill-rule="evenodd" d="M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5.002 5.002 0 0 0 8 3zM3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9H3.1z"/> 
+                                           </svg>
+                                           <template>
+                                               <a-textarea type="text" id='token' :disabled="!allSetting.secretEnable" v-model="user.loginSecret"></a-textarea>
+                                           </template>
+                                        </a-col>
+                                      </a-row>
+                                    </a-list-item>
+                                    <a-button type="primary" @click="updateSecret">{{ i18n "confirm" }}</a-button>
+                                </a-form>
+                            </a-tab-pane>
+                            <a-tab-pane key="3" tab='{{ i18n "pages.setting.xrayConfiguration"}}'>
+                                <a-list item-layout="horizontal" :style="siderDrawer.isDarkTheme ? 'color: hsla(0,0%,100%,.65);': 'background: white;'">
+                                    <a-divider>{{ i18n "pages.setting.actions"}}</a-divider>
+                                    <a-space direction="horizontal" style="padding: 0 20px">
+                                        <a-button type="primary" @click="resetXrayConfigToDefault">{{ i18n "pages.setting.resetDefaultConfig" }}</a-button>
+                                    </a-space>
+
+                                    <a-divider>{{ i18n "pages.setting.basicTemplate"}}</a-divider>
+                                    <a-collapse>
+                                        <a-collapse-panel header='{{ i18n "pages.setting.generalConfigs"}}'>
+                                            <a-row :xs="24" :sm="24" :lg="12">
+                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
+                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
+                                                    {{ i18n "pages.setting.generalConfigsDesc" }}
+                                                </h2>
+                                            </a-row>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigTorrent"}}' desc='{{ i18n "pages.setting.xrayConfigTorrentDesc"}}'  v-model="torrentSettings"></setting-list-item>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigPrivateIp"}}' desc='{{ i18n "pages.setting.xrayConfigPrivateIpDesc"}}'  v-model="privateIpSettings"></setting-list-item>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigAds"}}' desc='{{ i18n "pages.setting.xrayConfigAdsDesc"}}'  v-model="AdsSettings"></setting-list-item>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigPorn"}}' desc='{{ i18n "pages.setting.xrayConfigPornDesc"}}'  v-model="PornSettings"></setting-list-item>
+                                        </a-collapse-panel>
+                                        <a-collapse-panel header='{{ i18n "pages.setting.countryConfigs"}}'>
+                                            <a-row :xs="24" :sm="24" :lg="12">
+                                                <h2 style="color: inherit; font-weight: bold; font-size: 18px; padding: 10px 20px; border-bottom: 2px solid;">
+                                                    <a-icon type="warning" style="color: inherit; font-size: 24px;"></a-icon>
+                                                    {{ i18n "pages.setting.countryConfigsDesc" }}
+                                                </h2>
+                                            </a-row>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigIRIp"}}' desc='{{ i18n "pages.setting.xrayConfigIRIpDesc"}}'  v-model="IRIpSettings"></setting-list-item>
+                                            <setting-list-item type="switch" title='{{ i18n "pages.setting.xrayConfigIRDomain"}}' desc='{{ i18n "pages.setting.xrayConfig