MHSanaei/3x-ui
1
0
Fork 0
mirror of https://github.com/MHSanaei/3x-ui.git synced 2025-03-01 01:20:49 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

UI improvements (#1813)

Browse Source
This commit is contained in:
Tara Rostami 2024-02-17 19:52:23 +03:30 committed by GitHub
parent bb9d00a0b3
commit 73718a5dc5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
18 changed files with 590 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
web/assets/css/custom.css
View File

@ -1050,12 +1050,17 @@ li.ant-select-dropdown-menu-item:empty:after {
color: rgba(255, 255, 255, 0.25); color: rgba(255, 255, 255, 0.25);
} }
.ant-input-group.ant-input-group-compact-addon:not(:first-child):not(
:last-child
),
.ant-input-group.ant-input-group-compact-wrap:not(:first-child):not(
:last-child
),
.ant-input-group.ant-input-group-compact
> .ant-input:not(:first-child):not(:last-child),
.ant-input-number-handler,
.ant-input-number-handler-wrap { .ant-input-number-handler-wrap {
border-radius: 0; border-radius: 0;
}
.ant-input-number-handler {
border-radius: 0;
} }
.ant-input-number { .ant-input-number {
@ -1089,7 +1094,8 @@ li.ant-select-dropdown-menu-item:empty:after {
> td, > td,
.ant-table-thead .ant-table-thead
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
> td { > td,
.ant-calendar-time-picker-select li:hover {
background-color: rgb(232 244 242); background-color: rgb(232 244 242);
} }
@ -1121,3 +1127,11 @@ li.ant-select-dropdown-menu-item:empty:after {
.ant-input-group-addon:not(:first-child):not(:last-child), .ant-input-group-wrap:not(:first-child):not(:last-child), .ant-input-group>.ant-input:not(:first-child):not(:last-child) { .ant-input-group-addon:not(:first-child):not(:last-child), .ant-input-group-wrap:not(:first-child):not(:last-child), .ant-input-group>.ant-input:not(:first-child):not(:last-child) {
border-radius: 0rem 1rem 1rem 0rem; border-radius: 0rem 1rem 1rem 0rem;
} }
.ant-tag {
margin-right: 6px;
}
b, strong {
font-weight: 500;
}

455
web/assets/persian-datepicker/persian-datepicker.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
web/html/login.html
View File

@ -31,7 +31,7 @@
} }
.title { .title {
font-size: 32px; font-size: 32px;
font-weight: bold; font-weight: 600;
} }
#app { #app {
overflow: hidden; overflow: hidden;
@ -204,7 +204,7 @@
position: relative; position: relative;
width: 100%; width: 100%;
height: 15vh; height: 15vh;
margin-bottom: -5px; /*Fix for safari gap*/ margin-bottom: -8px; /*Fix for safari gap*/
min-height: 100px; min-height: 100px;
max-height: 150px; max-height: 150px;
} }
@ -212,23 +212,27 @@
animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
} }
.dark .parallax > use { .dark .parallax > use {
fill: rgb(10 117 87 / 20%); fill: #0f2d32;
} }
.parallax > use:nth-child(1) { .parallax > use:nth-child(1) {
animation-delay: -2s; animation-delay: -2s;
animation-duration: 7s; animation-duration: 4s;
opacity: 0.2; opacity: 0.2;
} }
.parallax > use:nth-child(2) { .parallax > use:nth-child(2) {
animation-delay: -3s; animation-delay: -3s;
animation-duration: 10s; animation-duration: 7s;
opacity: 0.4; opacity: 0.4;
} }
.parallax > use:nth-child(3) { .parallax > use:nth-child(3) {
animation-delay: -4s; animation-delay: -4s;
animation-duration: 13s; animation-duration: 10s;
opacity: 0.6; opacity: 0.6;
} }
.parallax > use:nth-child(4) {
animation-delay: -5s;
animation-duration: 13s;
}
@keyframes move-forever { @keyframes move-forever {
0% { 0% {
transform: translate3d(-90px, 0, 0); transform: translate3d(-90px, 0, 0);
@ -255,9 +259,10 @@
<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" /> <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
</defs> </defs>
<g class="parallax"> <g class="parallax">
<use xlink:href="#gentle-wave" x="48" y="0" fill="rgba(0, 135, 113, 0.08)" />
<use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(0, 135, 113, 0.08)" /> <use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(0, 135, 113, 0.08)" />
<use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(0, 135, 113, 0.08)" /> <use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(0, 135, 113, 0.08)" />
<use xlink:href="#gentle-wave" x="48" y="7" fill="rgba(0, 135, 113, 0.08)" /> <use xlink:href="#gentle-wave" x="48" y="7" fill="#c7ebe2" />
</g> </g>
</svg> </svg>
</div> </div>
@ -290,7 +295,7 @@
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-row justify="center" class="centered"> <a-row justify="center" class="centered">
<div class="wave-btn-bg wave-btn-bg-cl" :style="loading ? { width: '54px' } : { display: 'inline-block' }"> <div class="wave-btn-bg wave-btn-bg-cl" :style="loading ? { width: '52px' } : { display: 'inline-block' }">
<a-button class="ant-btn-primary-login" type="primary" :loading="loading" @click="login" :icon="loading ? 'poweroff' : undefined"> <a-button class="ant-btn-primary-login" type="primary" :loading="loading" @click="login" :icon="loading ? 'poweroff' : undefined">
[[ loading ? '' : '{{ i18n "login" }}' ]] [[ loading ? '' : '{{ i18n "login" }}' ]]
</a-button> </a-button>

10
web/html/xui/common_sider.html
View File

@ -1,19 +1,19 @@
{{define "menuItems"}} {{define "menuItems"}}
<a-menu-item key="{{ .base_path }}panel/"> <a-menu-item key="{{ .base_path }}panel/">
<a-icon type="dashboard"></a-icon> <a-icon type="dashboard"></a-icon>
<span>{{ i18n "menu.dashboard"}}</span> <span><b>{{ i18n "menu.dashboard"}}</b></span>
</a-menu-item> </a-menu-item>
<a-menu-item key="{{ .base_path }}panel/inbounds"> <a-menu-item key="{{ .base_path }}panel/inbounds">
<a-icon type="user"></a-icon> <a-icon type="user"></a-icon>
<span>{{ i18n "menu.inbounds"}}</span> <span><b>{{ i18n "menu.inbounds"}}</b></span>
</a-menu-item> </a-menu-item>
<a-menu-item key="{{ .base_path }}panel/settings"> <a-menu-item key="{{ .base_path }}panel/settings">
<a-icon type="setting"></a-icon> <a-icon type="setting"></a-icon>
<span>{{ i18n "menu.settings"}}</span> <span><b>{{ i18n "menu.settings"}}</b></span>
</a-menu-item> </a-menu-item>
<a-menu-item key="{{ .base_path }}panel/xray"> <a-menu-item key="{{ .base_path }}panel/xray">
<a-icon type="tool"></a-icon> <a-icon type="tool"></a-icon>
<span>{{ i18n "menu.xray"}}</span> <span><b>{{ i18n "menu.xray"}}</b></span>
</a-menu-item> </a-menu-item>
<!--<a-menu-item key="{{ .base_path }}panel/clients">--> <!--<a-menu-item key="{{ .base_path }}panel/clients">-->
<!-- <a-icon type="laptop"></a-icon>--> <!-- <a-icon type="laptop"></a-icon>-->
@ -21,7 +21,7 @@
<!--</a-menu-item>--> <!--</a-menu-item>-->
<a-menu-item key="{{ .base_path }}logout"> <a-menu-item key="{{ .base_path }}logout">
<a-icon type="logout"></a-icon> <a-icon type="logout"></a-icon>
<span>{{ i18n "menu.logout"}}</span> <span><b>{{ i18n "menu.logout"}}</b></span>
</a-menu-item> </a-menu-item>
{{end}} {{end}}

2
web/html/xui/component/persianDatepicker.html
View File

@ -5,7 +5,7 @@
@input="$emit('input', convertToGregorian($event.target.value)); jalaliDatepicker.hide();" @input="$emit('input', convertToGregorian($event.target.value)); jalaliDatepicker.hide();"
:placeholder="placeholder"> :placeholder="placeholder">
<template #addonAfter> <template #addonAfter>
<a-icon type="calendar" style="font-size: 16px;"/> <a-icon type="calendar" style="font-size: 14px; opacity: 0.5;"/>
</template> </template>
</a-input> </a-input>
</div> </div>

2
web/html/xui/form/inbound.html
View File

@ -54,7 +54,7 @@
<a-icon type="question-circle"></a-icon> <a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</template> </template>
<a-date-picker v-if="datepicker == 'gregorian'" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss" <a-date-picker style="width: 100%;" v-if="datepicker == 'gregorian'" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
:dropdown-class-name="themeSwitcher.currentTheme" :dropdown-class-name="themeSwitcher.currentTheme"
v-model="dbInbound._expiryTime"></a-date-picker> v-model="dbInbound._expiryTime"></a-date-picker>
<persian-datepicker v-else placeholder='{{ i18n "pages.settings.datepickerPlaceholder" }}' <persian-datepicker v-else placeholder='{{ i18n "pages.settings.datepickerPlaceholder" }}'

2
web/html/xui/form/stream/external_proxy.html
View File

@ -20,7 +20,7 @@
<a-input-number style="width: 15%;" v-model.number="row.port" min="1" max="65531"></a-input-number> <a-input-number style="width: 15%;" v-model.number="row.port" min="1" max="65531"></a-input-number>
</a-tooltip> </a-tooltip>
<a-input style="width: 20%" v-model.trim="row.remark" placeholder='{{ i18n "remark" }}'></a-input> <a-input style="width: 20%" v-model.trim="row.remark" placeholder='{{ i18n "remark" }}'></a-input>
<a-button style="width: 10%; margin: 0px" @click="inbound.stream.externalProxy.splice(index, 1)">-</a-button> <a-button style="width: 10%; margin: 0px; border-radius: 0 1rem 1rem 0;" @click="inbound.stream.externalProxy.splice(index, 1)">-</a-button>
</a-input-group> </a-input-group>
</a-form> </a-form>
{{end}} {{end}}

2
web/html/xui/form/stream/stream_tcp.html
View File

@ -33,7 +33,7 @@
</template> </template>
</a-form-item> </a-form-item>
<a-form-item label='{{ i18n "pages.inbounds.stream.tcp.requestHeader" }}'> <a-form-item label='{{ i18n "pages.inbounds.stream.tcp.requestHeader" }}'>
<a-button size="small" @click="inbound.stream.tcp.request.addHeader('host', '')">+</a-button> <a-button size="small" @click="inbound.stream.tcp.request.addHeader('Host', '')">+</a-button>
</a-form-item> </a-form-item>
<a-form-item :wrapper-col="{span:24}"> <a-form-item :wrapper-col="{span:24}">
<a-input-group compact v-for="(header, index) in inbound.stream.tcp.request.headers"> <a-input-group compact v-for="(header, index) in inbound.stream.tcp.request.headers">

2
web/html/xui/form/stream/stream_ws.html
View File

@ -7,7 +7,7 @@
<a-input v-model.trim="inbound.stream.ws.path"></a-input> <a-input v-model.trim="inbound.stream.ws.path"></a-input>
</a-form-item> </a-form-item>
<a-form-item label='{{ i18n "pages.inbounds.stream.tcp.requestHeader" }}'> <a-form-item label='{{ i18n "pages.inbounds.stream.tcp.requestHeader" }}'>
<a-button size="small" @click="inbound.stream.ws.addHeader('host', '')">+</a-button> <a-button size="small" @click="inbound.stream.ws.addHeader('Host', '')">+</a-button>
</a-form-item> </a-form-item>
<a-form-item :wrapper-col="{span:24}"> <a-form-item :wrapper-col="{span:24}">
<a-input-group compact v-for="(header, index) in inbound.stream.ws.headers"> <a-input-group compact v-for="(header, index) in inbound.stream.ws.headers">

144
web/html/xui/index.html
View File

@ -18,6 +18,14 @@
.ant-card-dark h2 { .ant-card-dark h2 {
color: hsla(0, 0%, 100%, .65); color: hsla(0, 0%, 100%, .65);
} }
.ant-tag-df {
color: rgb(0 0 0 / 80%);
}
.dark .ant-tag-df {
color: rgb(255 255 255 / 80%);
}
</style> </style>
<body> <body>
@ -36,15 +44,15 @@
<a-progress type="dashboard" status="normal" <a-progress type="dashboard" status="normal"
:stroke-color="status.cpu.color" :stroke-color="status.cpu.color"
:percent="status.cpu.percent"></a-progress> :percent="status.cpu.percent"></a-progress>
<div>CPU: [[ cpuCoreFormat(status.cpuCores) ]]</div> <div><b>CPU:</b> [[ cpuCoreFormat(status.cpuCores) ]]</div>
<div>Speed: [[ cpuSpeedFormat(status.cpuSpeedMhz) ]]</div> <div><b>Speed:</b> [[ cpuSpeedFormat(status.cpuSpeedMhz) ]]</div>
</a-col> </a-col>
<a-col :span="12" style="text-align: center"> <a-col :span="12" style="text-align: center">
<a-progress type="dashboard" status="normal" <a-progress type="dashboard" status="normal"
:stroke-color="status.mem.color" :stroke-color="status.mem.color"
:percent="status.mem.percent"></a-progress> :percent="status.mem.percent"></a-progress>
<div> <div>
{{ i18n "pages.index.memory"}}: [[ sizeFormat(status.mem.current) ]] / [[ sizeFormat(status.mem.total) ]] <b>{{ i18n "pages.index.memory"}}:</b> [[ sizeFormat(status.mem.current) ]] / [[ sizeFormat(status.mem.total) ]]
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
@ -56,7 +64,7 @@
:stroke-color="status.swap.color" :stroke-color="status.swap.color"
:percent="status.swap.percent"></a-progress> :percent="status.swap.percent"></a-progress>
<div> <div>
Swap: [[ sizeFormat(status.swap.current) ]] / [[ sizeFormat(status.swap.total) ]] <b>Swap:</b> [[ sizeFormat(status.swap.current) ]] / [[ sizeFormat(status.swap.total) ]]
</div> </div>
</a-col> </a-col>
<a-col :span="12" style="text-align: center"> <a-col :span="12" style="text-align: center">
@ -64,7 +72,7 @@
:stroke-color="status.disk.color" :stroke-color="status.disk.color"
:percent="status.disk.percent"></a-progress> :percent="status.disk.percent"></a-progress>
<div> <div>
{{ i18n "pages.index.hard"}}: [[ sizeFormat(status.disk.current) ]] / [[ sizeFormat(status.disk.total) ]] <b>{{ i18n "pages.index.hard"}}:</b> [[ sizeFormat(status.disk.current) ]] / [[ sizeFormat(status.disk.total) ]]
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
@ -75,25 +83,25 @@
</transition> </transition>
<transition name="list" appear> <transition name="list" appear>
<a-row> <a-row>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
3X-UI <a href="https://github.com/MHSanaei/3x-ui/releases" target="_blank"><a-tag color="green">v{{ .cur_ver }}</a-tag></a> <b>3X-UI:</b>
Xray <a-tag color="green" style="cursor: pointer;" @click="openSelectV2rayVersion">v[[ status.xray.version ]]</a-tag> <a rel="noopener" href="https://github.com/MHSanaei/3x-ui/releases" target="_blank"><a-tag color="green">v{{ .cur_ver }}</a-tag></a>
<a href="https://t.me/panel3xui" target="_blank"><a-tag color="green">@panel3xui</a-tag></a> <a rel="noopener" href="https://t.me/panel3xui" target="_blank"><a-tag color="green">@Panel3xui</a-tag></a>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
{{ i18n "menu.link" }}: <b>{{ i18n "pages.index.operationHours" }}:</b>
<a-tag color="purple" style="cursor: pointer;" @click="openLogs()">{{ i18n "pages.index.logs" }}</a-tag> <a-tag class="ant-tag-df">Xray [[ formatSecond(status.appStats.uptime) ]]</a-tag>
<a-tag color="purple" style="cursor: pointer;" @click="openConfig">{{ i18n "pages.index.config" }}</a-tag> <a-tag class="ant-tag-df">OS [[ formatSecond(status.uptime) ]]</a-tag>
<a-tag color="purple" style="cursor: pointer;" @click="openBackup">{{ i18n "pages.index.backup" }}</a-tag>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
{{ i18n "pages.index.xrayStatus" }}: <b>{{ i18n "pages.index.xrayStatus" }}:</b>
<a-tag :color="status.xray.color">[[ status.xray.state ]]</a-tag> <a-tag style="text-transform: capitalize;" :color="status.xray.color">[[ status.xray.state ]]
</a-tag>
<a-popover v-if="status.xray.state === State.Error" <a-popover v-if="status.xray.state === State.Error"
:overlay-class-name="themeSwitcher.currentTheme"> :overlay-class-name="themeSwitcher.currentTheme">
<span slot="title" style="font-size: 12pt">An error occurred while running Xray <span slot="title" style="font-size: 12pt">An error occurred while running Xray
@ -106,137 +114,143 @@
</a-popover> </a-popover>
<a-tag color="purple" style="cursor: pointer;" @click="stopXrayService">{{ i18n "pages.index.stopXray" }}</a-tag> <a-tag color="purple" style="cursor: pointer;" @click="stopXrayService">{{ i18n "pages.index.stopXray" }}</a-tag>
<a-tag color="purple" style="cursor: pointer;" @click="restartXrayService">{{ i18n "pages.index.restartXray" }}</a-tag> <a-tag color="purple" style="cursor: pointer;" @click="restartXrayService">{{ i18n "pages.index.restartXray" }}</a-tag>
<a-tag color="purple" style="cursor: pointer;" @click="openSelectV2rayVersion">{{ i18n "pages.index.xraySwitch" }}</a-tag> <a-tag color="purple" style="cursor: pointer;" @click="openSelectV2rayVersion">v[[ status.xray.version ]]</a-tag>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
{{ i18n "pages.index.operationHours" }}: <b>{{ i18n "menu.link" }}:</b>
Xray <a-tag color="purple" style="cursor: pointer;" @click="openLogs()">{{ i18n "pages.index.logs" }}</a-tag>
<a-tag color="green">[[ formatSecond(status.appStats.uptime) ]]</a-tag> <a-tag color="purple" style="cursor: pointer;" @click="openConfig">{{ i18n "pages.index.config" }}</a-tag>
OS <a-tag color="purple" style="cursor: pointer;" @click="openBackup">{{ i18n "pages.index.backup" }}</a-tag>
<a-tag color="green">[[ formatSecond(status.uptime) ]]</a-tag>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
{{ i18n "pages.index.systemLoad" }}: [[ status.loads[0] ]] | [[ status.loads[1] ]] | [[ status.loads[2] ]] <b>{{ i18n "pages.index.systemLoad" }}:</b>
<a-tag class="ant-tag-df">
<a-tooltip> <a-tooltip>
[[ status.loads[0] ]] | [[ status.loads[1] ]] | [[ status.loads[2] ]]
<template slot="title"> <template slot="title">
{{ i18n "pages.index.systemLoadDesc" }} {{ i18n "pages.index.systemLoadDesc" }}
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
{{ i18n "usage"}}: <b>{{ i18n "usage"}}:</b>
RAM [[ sizeFormat(status.appStats.mem) ]] - <a-tag class="ant-tag-df">
Threads [[ status.appStats.threads ]] RAM [[ sizeFormat(status.appStats.mem) ]]
</a-tooltip> </a-tag>
<a-tag class="ant-tag-df">
Threads [[ status.appStats.threads ]]
</a-tag>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
<a-row> <a-row>
<a-col :span="12"> <a-col :span="12">
<a-icon type="global"></a-icon> <a-tag class="ant-tag-df">
IPv4:
<a-tooltip> <a-tooltip>
<a-icon type="global"></a-icon> IPv4
<template slot="title"> <template slot="title">
[[ status.publicIP.ipv4 ]] [[ status.publicIP.ipv4 ]]
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-col> </a-tag>
<a-col :span="12"> </a-col>
<a-icon type="global"></a-icon> <a-col :span="12">
IPv6: <a-tag class="ant-tag-df">
<a-tooltip> <a-tooltip>
<a-icon type="global"></a-icon> IPv6
<template slot="title"> <template slot="title">
[[ status.publicIP.ipv6 ]] [[ status.publicIP.ipv6 ]]
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
<a-row> <a-row>
<a-col :span="12"> <a-col :span="12">
<a-icon type="swap"></a-icon> <a-tag class="ant-tag-df">
TCP: [[ status.tcpCount ]]
<a-tooltip> <a-tooltip>
<a-icon type="swap"></a-icon> TCP: [[ status.tcpCount ]]
<template slot="title"> <template slot="title">
{{ i18n "pages.index.connectionTcpCountDesc" }} {{ i18n "pages.index.connectionTcpCountDesc" }}
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-icon type="swap"></a-icon> <a-tag class="ant-tag-df">
UDP: [[ status.udpCount ]]
<a-tooltip> <a-tooltip>
<a-icon type="swap"></a-icon> UDP: [[ status.udpCount ]]
<template slot="title"> <template slot="title">
{{ i18n "pages.index.connectionUdpCountDesc" }} {{ i18n "pages.index.connectionUdpCountDesc" }}
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
<a-row> <a-row>
<a-col :span="12"> <a-col :span="12">
<a-icon type="arrow-up"></a-icon> <a-tag class="ant-tag-df">
[[ sizeFormat(status.netIO.up) ]]/s
<a-tooltip> <a-tooltip>
<a-icon type="arrow-up"></a-icon>
Up: [[ sizeFormat(status.netIO.up) ]]/s
<template slot="title"> <template slot="title">
{{ i18n "pages.index.upSpeed" }} {{ i18n "pages.index.upSpeed" }}
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-icon type="arrow-down"></a-icon> <a-tag class="ant-tag-df">
[[ sizeFormat(status.netIO.down) ]]/s
<a-tooltip> <a-tooltip>
<a-icon type="arrow-down"></a-icon>
Down: [[ sizeFormat(status.netIO.down) ]]/s
<template slot="title"> <template slot="title">
{{ i18n "pages.index.downSpeed" }} {{ i18n "pages.index.downSpeed" }}
</template> </template>
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
<a-col :sm="24" :md="12"> <a-col :sm="24" :lg="12">
<a-card hoverable> <a-card hoverable>
<a-row> <a-row>
<a-col :span="12"> <a-col :span="12">
<a-icon type="cloud-upload"></a-icon> <a-tag class="ant-tag-df">
[[ sizeFormat(status.netTraffic.sent) ]]
<a-tooltip> <a-tooltip>
<a-icon type="cloud-upload"></a-icon>
<template slot="title"> <template slot="title">
{{ i18n "pages.index.totalSent" }} {{ i18n "pages.index.totalSent" }}
</template> </template> Out: [[ sizeFormat(status.netTraffic.sent) ]]
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-icon type="cloud-download"></a-icon> <a-tag class="ant-tag-df">
[[ sizeFormat(status.netTraffic.recv) ]]
<a-tooltip> <a-tooltip>
<a-icon type="cloud-download"></a-icon>
<template slot="title"> <template slot="title">
{{ i18n "pages.index.totalReceive" }} {{ i18n "pages.index.totalReceive" }}
</template> </template> In: [[ sizeFormat(status.netTraffic.recv) ]]
<a-icon type="question-circle"></a-icon>
</a-tooltip> </a-tooltip>
</a-tag>
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
@ -256,7 +270,7 @@
></a-alert> ></a-alert>
<template v-for="version, index in versionModal.versions"> <template v-for="version, index in versionModal.versions">
<a-tag :color="index % 2 == 0 ? 'purple' : 'green'" <a-tag :color="index % 2 == 0 ? 'purple' : 'green'"
style="margin: 10px" @click="switchV2rayVersion(version)"> style="margin-right: 10px" @click="switchV2rayVersion(version)">
[[ version ]] [[ version ]]
</a-tag> </a-tag>
</template> </template>

8
web/html/xui/settings.html
View File

@ -76,15 +76,15 @@
<a-layout-content> <a-layout-content>
<a-spin :spinning="spinning" :delay="500" tip='{{ i18n "loading"}}'> <a-spin :spinning="spinning" :delay="500" tip='{{ i18n "loading"}}'>
<a-space direction="vertical"> <a-space direction="vertical">
<a-card hoverable style="margin-bottom: .5rem;"> <a-card hoverable style="margin-bottom: .5rem; overflow-x: hidden;">
<a-row> <a-row style="display: flex; flex-wrap: wrap; align-items: center;">
<a-col :xs="24" :sm="8" style="padding: 4px;"> <a-col :xs="24" :sm="10" style="padding: 4px;">
<a-space direction="horizontal"> <a-space direction="horizontal">
<a-button type="primary" :disabled="saveBtnDisable" @click="updateAllSetting">{{ i18n "pages.settings.save" }}</a-button> <a-button type="primary" :disabled="saveBtnDisable" @click="updateAllSetting">{{ i18n "pages.settings.save" }}</a-button>
<a-button type="danger" :disabled="!saveBtnDisable" @click="restartPanel">{{ i18n "pages.settings.restartPanel" }}</a-button> <a-button type="danger" :disabled="!saveBtnDisable" @click="restartPanel">{{ i18n "pages.settings.restartPanel" }}</a-button>
</a-space> </a-space>
</a-col> </a-col>
<a-col :xs="24" :sm="16"> <a-col :xs="24" :sm="14">
<template> <template>
<div> <div>
<template> <template>

2
web/translation/translate.en_US.toml
View File

@ -76,7 +76,7 @@
"title" = "Overview" "title" = "Overview"
"memory" = "RAM" "memory" = "RAM"
"hard" = "Disk" "hard" = "Disk"
"xrayStatus" = "Status" "xrayStatus" = "Xray"
"stopXray" = "Stop" "stopXray" = "Stop"
"restartXray" = "Restart" "restartXray" = "Restart"
"xraySwitch" = "Version" "xraySwitch" = "Version"

2
web/translation/translate.es_ES.toml
View File

@ -76,7 +76,7 @@
"title" = "Estado del Sistema" "title" = "Estado del Sistema"
"memory" = "Memoria" "memory" = "Memoria"
"hard" = "Disco Duro" "hard" = "Disco Duro"
"xrayStatus" = "Estado de" "xrayStatus" = "Xray"
"stopXray" = "Detener" "stopXray" = "Detener"
"restartXray" = "Reiniciar" "restartXray" = "Reiniciar"
"xraySwitch" = "Versión" "xraySwitch" = "Versión"

2
web/translation/translate.fa_IR.toml
View File

@ -76,7 +76,7 @@
"title" = "نمای کلی" "title" = "نمای کلی"
"memory" = "RAM" "memory" = "RAM"
"hard" = "Disk" "hard" = "Disk"
"xrayStatus" = "وضعیت‌ایکس‌ری" "xrayStatus" = "ایکس‌ری"
"stopXray" = "توقف" "stopXray" = "توقف"
"restartXray" = "شروع‌مجدد" "restartXray" = "شروع‌مجدد"
"xraySwitch" = "‌نسخه" "xraySwitch" = "‌نسخه"

2
web/translation/translate.id_ID.toml
View File

@ -76,7 +76,7 @@
"title" = "Ikhtisar" "title" = "Ikhtisar"
"memory" = "RAM" "memory" = "RAM"
"hard" = "Disk" "hard" = "Disk"
"xrayStatus" = "Status" "xrayStatus" = "Xray"
"stopXray" = "Stop" "stopXray" = "Stop"
"restartXray" = "Restart" "restartXray" = "Restart"
"xraySwitch" = "Versi" "xraySwitch" = "Versi"

2
web/translation/translate.ru_RU.toml
View File

@ -76,7 +76,7 @@
"title" = "Статус системы" "title" = "Статус системы"
"memory" = "Память" "memory" = "Память"
"hard" = "Жесткий диск" "hard" = "Жесткий диск"
"xrayStatus" = "Статус" "xrayStatus" = "Xray"
"stopXray" = "Остановить" "stopXray" = "Остановить"
"restartXray" = "Перезапустить" "restartXray" = "Перезапустить"
"xraySwitch" = "Версия" "xraySwitch" = "Версия"

2
web/translation/translate.vi_VN.toml
View File

@ -76,7 +76,7 @@
"title" = "Trạng thái hệ thống" "title" = "Trạng thái hệ thống"
"memory" = "Ram" "memory" = "Ram"
"hard" = "Dung lượng" "hard" = "Dung lượng"
"xrayStatus" = "Trạng thái Xray" "xrayStatus" = "Xray"
"stopXray" = "Dừng lại" "stopXray" = "Dừng lại"
"restartXray" = "Khởi động lại" "restartXray" = "Khởi động lại"
"xraySwitch" = "Phiên bản" "xraySwitch" = "Phiên bản"

2
web/translation/translate.zh_Hans.toml
View File

@ -76,7 +76,7 @@
"title" = "系统状态" "title" = "系统状态"
"memory" = "内存" "memory" = "内存"
"hard" = "硬盘" "hard" = "硬盘"
"xrayStatus" = "状态" "xrayStatus" = "Xray"
"stopXray" = "停止" "stopXray" = "停止"
"restartXray" = "重启" "restartXray" = "重启"
"xraySwitch" = "版本" "xraySwitch" = "版本"