Merge pull request #332 from hamid-gh98/main

[Update] sub remark + settings UI

11 files changed, 39 insertions, 40 deletions

diff --git a/web/html/xui/form/client.html b/web/html/xui/form/client.html
index 38402ec7..501861db 100644
--- a/web/html/xui/form/client.html
+++ b/web/html/xui/form/client.html
@@ -22,7 +22,7 @@
         <a-input v-model.trim="client.password" style="width: 150px;" ></a-input>
     </a-form-item>
     <a-form-item label='{{ i18n "additional" }} ID' v-if="inbound.protocol === Protocols.VMESS">
-        <a-input type="number" v-model.number="client.alterId" style="width: 70px;"></a-input>
+        <a-input-number v-model="client.alterId" style="width: 70px;"></a-input-number>
     </a-form-item>
     <a-form-item label="ID" v-if="inbound.protocol === Protocols.VMESS || inbound.protocol === Protocols.VLESS">
         <a-input v-model.trim="client.id" style="width: 300px;"></a-input>
@@ -43,7 +43,7 @@
 				<a-icon type="question-circle" theme="filled"></a-icon>
 			</a-tooltip>
 		</span>
-		<a-input type="number" v-model.number="client.limitIp" min="0" style="width: 70px;" ></a-input>
+		<a-input-number v-model="client.limitIp" min="0" style="width: 70px;"></a-input-number>
 	</a-form-item>
 	<a-form-item v-if="client.email && client.limitIp > 0 && isEdit">
 		<span slot="label">
@@ -82,7 +82,7 @@
     </a-form-item>
     <a-form-item>
         <span slot="label">
-            <span >{{ i18n "pages.inbounds.totalFlow" }}</span>(GB)
+            <span >{{ i18n "pages.inbounds.totalFlow" }}</span> (GB)
             <a-tooltip>
                 <template slot="title">
                     0 <span>{{ i18n "pages.inbounds.meansNoLimit" }}</span>
@@ -108,7 +108,7 @@
         <a-switch v-model="clientModal.delayedStart" @click="client._expiryTime=0"></a-switch>
     </a-form-item>
     <a-form-item label='{{ i18n "pages.client.expireDays" }}' v-if="clientModal.delayedStart">
-        <a-input type="number" v-model.number="delayedExpireDays" :min="0"></a-input>
+        <a-input-number v-model="delayedExpireDays" :min="0"></a-input-number>
     </a-form-item>
     <a-form-item v-else>
         <span slot="label">
diff --git a/web/html/xui/form/inbound.html b/web/html/xui/form/inbound.html
index 09e7099d..603ca46a 100644
--- a/web/html/xui/form/inbound.html
+++ b/web/html/xui/form/inbound.html
@@ -25,11 +25,11 @@
         <a-input v-model.trim="inbound.listen"></a-input>
     </a-form-item>
     <a-form-item label='{{ i18n "pages.inbounds.port" }}'>
-        <a-input type="number" v-model.number="inbound.port"></a-input>
+        <a-input-number v-model="inbound.port"></a-input-number>
     </a-form-item>
     <a-form-item>
         <span slot="label">
-            <span >{{ i18n "pages.inbounds.totalFlow" }}</span>(GB)
+            <span >{{ i18n "pages.inbounds.totalFlow" }}</span> (GB)
             <a-tooltip>
                 <template slot="title">
                     0 <span>{{ i18n "pages.inbounds.meansNoLimit" }}</span>
diff --git a/web/html/xui/form/protocol/dokodemo.html b/web/html/xui/form/protocol/dokodemo.html
index 53c82c3c..f9204b8c 100644
--- a/web/html/xui/form/protocol/dokodemo.html
+++ b/web/html/xui/form/protocol/dokodemo.html
@@ -4,7 +4,7 @@
         <a-input v-model.trim="inbound.settings.address"></a-input>
     </a-form-item>
     <a-form-item label='{{ i18n "pages.inbounds.destinationPort"}}'>
-        <a-input type="number" v-model.number="inbound.settings.port"></a-input>
+        <a-input-number v-model="inbound.settings.port"></a-input-number>
     </a-form-item>
     <a-form-item label='{{ i18n "pages.inbounds.network"}}'>
         <a-select v-model="inbound.settings.network" style="width: 100px;" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
diff --git a/web/html/xui/form/protocol/socks.html b/web/html/xui/form/protocol/socks.html
index 2662f1d6..89cde72c 100644
--- a/web/html/xui/form/protocol/socks.html
+++ b/web/html/xui/form/protocol/socks.html
@@ -1,6 +1,5 @@
 {{define "form/socks"}}
 <a-form layout="inline">
-    <!--    <a-form-item label="Password authentication">-->
     <a-form-item label='{{ i18n "password" }}'>
         <a-switch :checked="inbound.settings.auth === 'password'"
                   @change="checked => inbound.settings.auth = checked ? 'password' : 'noauth'"></a-switch>
diff --git a/web/html/xui/form/protocol/trojan.html b/web/html/xui/form/protocol/trojan.html
index b52c4dd9..e63943e6 100644
--- a/web/html/xui/form/protocol/trojan.html
+++ b/web/html/xui/form/protocol/trojan.html
@@ -33,7 +33,7 @@
                     <a-icon type="question-circle" theme="filled"></a-icon>
                 </a-tooltip>
             </span>
-            <a-input type="number" v-model.number="client.limitIp" min="0"  style="width: 70px;" ></a-input>
+            <a-input-number v-model="client.limitIp" min="0"  style="width: 70px;"></a-input-number>
         </a-form-item>
         <a-form-item v-if="inbound.xtls" label="Flow">
             <a-select v-model="client.flow" style="width: 150px" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
@@ -43,7 +43,7 @@
         </a-form-item>
         <a-form-item>
             <span slot="label">
-                <span >{{ i18n "pages.inbounds.totalFlow" }}</span>(GB)
+                <span >{{ i18n "pages.inbounds.totalFlow" }}</span> (GB)
                 <a-tooltip>
                     <template slot="title">
                         0 <span>{{ i18n "pages.inbounds.meansNoLimit" }}</span>
@@ -113,7 +113,7 @@
             <a-input v-model="fallback.dest"></a-input>
         </a-form-item>
         <a-form-item label="xVer">
-            <a-input type="number" v-model.number="fallback.xver"></a-input>
+            <a-input-number v-model="fallback.xver"></a-input-number>
         </a-form-item>
         <a-divider v-if="inbound.settings.fallbacks.length - 1 === index"/>
     </a-form>
diff --git a/web/html/xui/form/protocol/vless.html b/web/html/xui/form/protocol/vless.html
index 1d733d02..33e0c170 100644
--- a/web/html/xui/form/protocol/vless.html
+++ b/web/html/xui/form/protocol/vless.html
@@ -33,7 +33,7 @@
                     <a-icon type="question-circle" theme="filled"></a-icon>
                 </a-tooltip>
             </span>
-            <a-input type="number" v-model.number="client.limitIp" min="0"  style="width: 70px;" ></a-input>
+            <a-input-number v-model="client.limitIp" min="0"  style="width: 70px;"></a-input-number>
         </a-form-item>
         <a-form-item v-if="inbound.xtls" label="Flow">
             <a-select v-model="inbound.settings.vlesses[index].flow" style="width: 200px" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
@@ -49,7 +49,7 @@
         </a-form-item>
         <a-form-item>
             <span slot="label">
-                <span >{{ i18n "pages.inbounds.totalFlow" }}</span>(GB)
+                <span >{{ i18n "pages.inbounds.totalFlow" }}</span> (GB)
                 <a-tooltip>
                     <template slot="title">
                         0 <span>{{ i18n "pages.inbounds.meansNoLimit" }}</span>
@@ -119,7 +119,7 @@
             <a-input v-model="fallback.dest"></a-input>
         </a-form-item>
         <a-form-item label="xVer">
-            <a-input type="number" v-model.number="fallback.xver"></a-input>
+            <a-input-number v-model="fallback.xver"></a-input-number>
         </a-form-item>
         <a-divider v-if="inbound.settings.fallbacks.length - 1 === index"/>
     </a-form>
diff --git a/web/html/xui/form/protocol/vmess.html b/web/html/xui/form/protocol/vmess.html
index 9cd48544..6471e20d 100644
--- a/web/html/xui/form/protocol/vmess.html
+++ b/web/html/xui/form/protocol/vmess.html
@@ -15,7 +15,7 @@
             <a-input v-model.trim="client.email" style="width: 150px;"></a-input>
         </a-form-item>
         <a-form-item label='{{ i18n "additional" }} ID'>
-            <a-input type="number" v-model.number="client.alterId" style="width: 70px;"></a-input>
+            <a-input-number v-model="client.alterId" style="width: 70px;"></a-input-number>
         </a-form-item>
         <a-form-item label="ID">
             <a-input v-model.trim="client.id" style="width: 300px;"></a-input>
@@ -36,11 +36,11 @@
                     <a-icon type="question-circle" theme="filled"></a-icon>
                 </a-tooltip>
             </span>
-            <a-input type="number" v-model.number="client.limitIp" min="0" style="width: 70px;"></a-input>
+            <a-input-number v-model="client.limitIp" min="0" style="width: 70px;"></a-input-number>
         </a-form-item>
         <a-form-item>
             <span slot="label">
-                <span >{{ i18n "pages.inbounds.totalFlow" }}</span>(GB)
+                <span >{{ i18n "pages.inbounds.totalFlow" }}</span> (GB)
                 <a-tooltip>
                     <template slot="title">
                         0 <span>{{ i18n "pages.inbounds.meansNoLimit" }}</span>
@@ -67,7 +67,7 @@
     </a-collapse-panel>     
 </a-collapse>
 <a-collapse v-else>
-    <a-collapse-panel :header="'{{ i18n "pages.client.clientCount"}} : ' + inbound.settings.vmesses.length">
+    <a-collapse-panel :header="'{{ i18n "pages.client.clientCount" }}: ' + inbound.settings.vmesses.length">
         <table width="100%">
                 <tr class="client-table-header">
                 <th v-for="col in Object.keys(inbound.settings.vmesses[0]).slice(0, 3)">[[ col ]]</th>
diff --git a/web/html/xui/form/stream/stream_kcp.html b/web/html/xui/form/stream/stream_kcp.html
index fd31b1ee..52a930f9 100644
--- a/web/html/xui/form/stream/stream_kcp.html
+++ b/web/html/xui/form/stream/stream_kcp.html
@@ -2,37 +2,37 @@
 <a-form layout="inline">
     <a-form-item label='{{ i18n "camouflage" }}'>
         <a-select v-model="inbound.stream.kcp.type" style="width: 280px;">
-            <a-select-option value="none">None（Not Camouflage）</a-select-option>
-            <a-select-option value="srtp">SRTP（Camouflage Video Call）</a-select-option>
-            <a-select-option value="utp">UTP（Camouflage BT Download）</a-select-option>
-            <a-select-option value="wechat-video">Wechat-Video（Camouflage WeChat Video）</a-select-option>
-            <a-select-option value="dtls">DTLS（Camouflage DTLS 1.2 Packages）</a-select-option>
-            <a-select-option value="wireguard">Wireguard（Camouflage Wireguard Packages）</a-select-option>
+            <a-select-option value="none">None (Not Camouflage)</a-select-option>
+            <a-select-option value="srtp">SRTP (Camouflage Video Call)</a-select-option>
+            <a-select-option value="utp">UTP (Camouflage BT Download)</a-select-option>
+            <a-select-option value="wechat-video">Wechat-Video (Camouflage WeChat Video)</a-select-option>
+            <a-select-option value="dtls">DTLS (Camouflage DTLS 1.2 Packages)</a-select-option>
+            <a-select-option value="wireguard">Wireguard (Camouflage Wireguard Packages)</a-select-option>
         </a-select>
     </a-form-item>
     <a-form-item label='{{ i18n "password" }}'>
-        <a-input v-model.number="inbound.stream.kcp.seed"></a-input>
-    </a-form-item>
+        <a-input v-model="inbound.stream.kcp.seed"></a-input>
+    </a-form-item><br />
     <a-form-item label="MTU">
-        <a-input type="number" v-model.number="inbound.stream.kcp.mtu"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.mtu"></a-input-number>
     </a-form-item>
     <a-form-item label="TTI (ms)">
-        <a-input type="number" v-model.number="inbound.stream.kcp.tti"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.tti"></a-input-number>
     </a-form-item>
     <a-form-item label="Uplink Capacity (MB/S)">
-        <a-input type="number" v-model.number="inbound.stream.kcp.upCap"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.upCap"></a-input-number>
     </a-form-item>
     <a-form-item label="Downlink Capacity (MB/S)">
-        <a-input type="number" v-model.number="inbound.stream.kcp.downCap"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.downCap"></a-input-number>
     </a-form-item>
     <a-form-item label="Congestion">
         <a-switch v-model="inbound.stream.kcp.congestion"></a-switch>
     </a-form-item>
     <a-form-item label="Read Buffer Size (MB)">
-        <a-input type="number" v-model.number="inbound.stream.kcp.readBuffer"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.readBuffer"></a-input-number>
     </a-form-item>
     <a-form-item label="Write Buffer Size (MB)">
-        <a-input type="number" v-model.number="inbound.stream.kcp.writeBuffer"></a-input>
+        <a-input-number v-model="inbound.stream.kcp.writeBuffer"></a-input-number>
     </a-form-item>
 </a-form>
 {{end}}
\ No newline at end of file
diff --git a/web/html/xui/form/stream/stream_quic.html b/web/html/xui/form/stream/stream_quic.html
index 2a48af84..4d04587a 100644
--- a/web/html/xui/form/stream/stream_quic.html
+++ b/web/html/xui/form/stream/stream_quic.html
@@ -12,12 +12,12 @@
     </a-form-item>
     <a-form-item label='{{ i18n "camouflage" }}'>
         <a-select v-model="inbound.stream.quic.type" style="width: 280px;" :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
-            <a-select-option value="none">none（not camouflage）</a-select-option>
-            <a-select-option value="srtp">srtp（camouflage video call）</a-select-option>
-            <a-select-option value="utp">utp（camouflage BT download）</a-select-option>
-            <a-select-option value="wechat-video">wechat-video（camouflage WeChat video）</a-select-option>
-            <a-select-option value="dtls">dtls（camouflage DTLS 1.2 packages）</a-select-option>
-            <a-select-option value="wireguard">wireguard（camouflage wireguard packages）</a-select-option>
+            <a-select-option value="none">none (not camouflage)</a-select-option>
+            <a-select-option value="srtp">srtp (camouflage video call)</a-select-option>
+            <a-select-option value="utp">utp (camouflage BT download)</a-select-option>
+            <a-select-option value="wechat-video">wechat-video (camouflage WeChat video)</a-select-option>
+            <a-select-option value="dtls">dtls (camouflage DTLS 1.2 packages)</a-select-option>
+            <a-select-option value="wireguard">wireguard (camouflage wireguard packages)</a-select-option>
         </a-select>
     </a-form-item>
 </a-form>
diff --git a/web/html/xui/form/stream/stream_tcp.html b/web/html/xui/form/stream/stream_tcp.html
index 958f8f25..993fb0d0 100644
--- a/web/html/xui/form/stream/stream_tcp.html
+++ b/web/html/xui/form/stream/stream_tcp.html
@@ -4,7 +4,7 @@
     <a-form-item label="AcceptProxyProtocol">
         <a-switch v-model="inbound.stream.tcp.acceptProxyProtocol"></a-switch>
     </a-form-item>
-    <a-form-item label="HTTP {{ i18n "camouflage" }}">
+    <a-form-item label='HTTP {{ i18n "camouflage" }}'>
         <a-switch
                 :checked="inbound.stream.tcp.type === 'http'"
                 @change="checked => inbound.stream.tcp.type = checked ? 'http' : 'none'">
diff --git a/web/html/xui/form/tls_settings.html b/web/html/xui/form/tls_settings.html
index e4be34cf..7962acf3 100644
--- a/web/html/xui/form/tls_settings.html
+++ b/web/html/xui/form/tls_settings.html
@@ -140,7 +140,7 @@
         </a-switch>
     </a-form-item>
     <a-form-item label="xVer">
-        <a-input type="number" v-model.number="inbound.stream.reality.xver" :min="0" style="width: 60px"></a-input>
+        <a-input-number v-model="inbound.stream.reality.xver" :min="0" style="width: 60px"></a-input-number>
     </a-form-item>
     <a-form-item label="uTLS" >
         <a-select v-model="inbound.stream.reality.settings.fingerprint"