diff options
Diffstat (limited to 'web/html/xui/index.html')
| -rw-r--r-- | web/html/xui/index.html | 42 |
1 files changed, 33 insertions, 9 deletions
diff --git a/web/html/xui/index.html b/web/html/xui/index.html index 141174dc..604c6621 100644 --- a/web/html/xui/index.html +++ b/web/html/xui/index.html @@ -15,24 +15,26 @@ <body> <a-layout id="app" v-cloak> {{ template "commonSider" . }} - <a-layout id="content-layout"> + <a-layout id="content-layout" :style="siderDrawer.isDarkTheme ? bgDarkStyle : ''"> <a-layout-content> <a-spin :spinning="spinning" :delay="200" :tip="loadingTip"/> <transition name="list" appear> <a-row> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> <a-row> <a-col :sm="24" :md="12"> <a-row> <a-col :span="12" style="text-align: center"> <a-progress type="dashboard" status="normal" :stroke-color="status.cpu.color" + :class="siderDrawer.isDarkTheme ? darkClass : ''" :percent="status.cpu.percent"></a-progress> <div>CPU</div> </a-col> <a-col :span="12" style="text-align: center"> <a-progress type="dashboard" status="normal" :stroke-color="status.mem.color" + :class="siderDrawer.isDarkTheme ? darkClass : ''" :percent="status.mem.percent"></a-progress> <div> {{ i18n "pages.index.memory"}}: [[ sizeFormat(status.mem.current) ]] / [[ sizeFormat(status.mem.total) ]] @@ -45,6 +47,7 @@ <a-col :span="12" style="text-align: center"> <a-progress type="dashboard" status="normal" :stroke-color="status.swap.color" + :class="siderDrawer.isDarkTheme ? darkClass : ''" :percent="status.swap.percent"></a-progress> <div> Swap: [[ sizeFormat(status.swap.current) ]] / [[ sizeFormat(status.swap.total) ]] @@ -53,6 +56,7 @@ <a-col :span="12" style="text-align: center"> <a-progress type="dashboard" status="normal" :stroke-color="status.disk.color" + :class="siderDrawer.isDarkTheme ? darkClass : ''" :percent="status.disk.percent"></a-progress> <div> {{ i18n "pages.index.hard"}}: [[ sizeFormat(status.disk.current) ]] / [[ sizeFormat(status.disk.total) ]] @@ -67,7 +71,7 @@ <transition name="list" appear> <a-row> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> {{ i18n "pages.index.xrayStatus" }}: <a-tag :color="status.xray.color">[[ status.xray.state ]]</a-tag> <a-tooltip v-if="status.xray.state === State.Error"> @@ -77,11 +81,13 @@ <a-icon type="question-circle" theme="filled"></a-icon> </a-tooltip> <a-tag color="green" @click="openSelectV2rayVersion">[[ status.xray.version ]]</a-tag> - <a-tag color="blue" @click="openSelectV2rayVersion">{{ i18n "pages.index.xraySwitch"}}</a-tag> + <a-tag color="blue" @click="stopXrayService">{{ i18n "pages.index.stopXray" }}</a-tag> + <a-tag color="blue" @click="restartXrayService">{{ i18n "pages.index.restartXray" }}</a-tag> + <a-tag color="blue" @click="openSelectV2rayVersion">{{ i18n "pages.index.xraySwitch" }}</a-tag> </a-card> </a-col> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> {{ i18n "pages.index.operationHours" }}: <a-tag color="#87d068">[[ formatSecond(status.uptime) ]]</a-tag> <a-tooltip> @@ -93,12 +99,12 @@ </a-card> </a-col> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> {{ i18n "pages.index.systemLoad" }}: [[ status.loads[0] ]] | [[ status.loads[1] ]] | [[ status.loads[2] ]] </a-card> </a-col> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> TCP / UDP {{ i18n "pages.index.connectionCount" }}: [[ status.tcpCount ]] / [[ status.udpCount ]] <a-tooltip> <template slot="title"> @@ -109,7 +115,7 @@ </a-card> </a-col> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> <a-row> <a-col :span="12"> <a-icon type="arrow-up"></a-icon> @@ -135,7 +141,7 @@ </a-card> </a-col> <a-col :sm="24" :md="12"> - <a-card hoverable> + <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''"> <a-row> <a-col :span="12"> <a-icon type="cloud-upload"></a-icon> @@ -316,6 +322,24 @@ }, }); }, + //here add stop xray function + async stopXrayService() { + this.loading(true); + const msg = await HttpUtil.post('server/stopXrayService'); + this.loading(false); + if (!msg.success) { + return; + } + }, + //here add restart xray function + async restartXrayService() { + this.loading(true); + const msg = await HttpUtil.post('server/restartXrayService'); + this.loading(false); + if (!msg.success) { + return; + } + }, }, async mounted() { while (true) { |