From b87474d70c8fe720fdc72c3104f6b31eb26b2ba1 Mon Sep 17 00:00:00 2001
From: Alireza Ahmadi <alireza7@gmail.com>
Date: Sat, 5 Aug 2023 17:42:38 +0200
Subject: [PATCH] [front] better info modal

---
 web/html/xui/inbound_info_modal.html | 60 ++++++++++++++--------------
 1 file changed, 30 insertions(+), 30 deletions(-)

diff --git a/web/html/xui/inbound_info_modal.html b/web/html/xui/inbound_info_modal.html
index f59e4c78..a479faa1 100644
--- a/web/html/xui/inbound_info_modal.html
+++ b/web/html/xui/inbound_info_modal.html
@@ -45,17 +45,28 @@
             </template>
             </table>
         </td></tr>
-            <tr colspan="2" v-if="dbInbound.hasLink()">
-                <td v-if="inbound.tls">
-                    tls: <a-tag color="green">{{ i18n "enabled" }}</a-tag><br />
-                    tls {{ i18n "domainName" }}: <a-tag :color="inbound.serverName ? 'green' : 'orange'">[[ inbound.serverName ? inbound.serverName : '' ]]</a-tag>
-                </td>
-                <td v-else-if="inbound.reality">
-                    reality: <a-tag color="green">{{ i18n "enabled" }}</a-tag><br />
-                    reality Destination: <a-tag :color="inbound.stream.reality.dest ? 'green' : 'orange'">[[ inbound.stream.reality.dest ]]</a-tag>
-                </td>
-                <td v-else>tls: <a-tag color="red">{{ i18n "disabled" }}</a-tag>
+        <tr colspan="2" v-if="dbInbound.hasLink()">
+            <td v-if="inbound.tls">
+                tls: <a-tag color="green">{{ i18n "enabled" }}</a-tag><br />
+                tls {{ i18n "domainName" }}: <a-tag :color="inbound.serverName ? 'green' : 'orange'">[[ inbound.serverName ? inbound.serverName : '' ]]</a-tag>
             </td>
+            <td v-else-if="inbound.reality">
+                reality: <a-tag color="green">{{ i18n "enabled" }}</a-tag><br />
+                reality Destination: <a-tag :color="inbound.stream.reality.dest ? 'green' : 'orange'">[[ inbound.stream.reality.dest ]]</a-tag>
+            </td>
+            <td v-else>tls: <a-tag color="red">{{ i18n "disabled" }}</a-tag></td>
+        </tr>
+    </table>
+    <table v-if="dbInbound.isSS" style="margin-bottom: 10px; width: 100%;">
+        <tr>
+            <td>{{ i18n "encryption" }}</td>
+            <td><a-tag color="green">[[ inbound.settings.method ]]</a-tag></td>
+        </tr><tr v-if="inbound.isSS2022">
+            <td>{{ i18n "password" }}</td>
+            <td><a-tag color="blue">[[ inbound.settings.password ]]</a-tag></td>
+        </tr><tr>
+            <td>{{ i18n "pages.inbounds.network" }}</td>
+            <td><a-tag color="green">[[ inbound.settings.network ]]</a-tag></td>
         </tr>
     </table>
     <template v-if="infoModal.clientSettings">
@@ -163,19 +174,7 @@
         </template>
     </template>
     <template v-else>
-        <a-divider></a-divider>
-        <table v-if="inbound.protocol == Protocols.SHADOWSOCKS" style="margin-bottom: 10px; width: 100%;">
-            <tr>
-                <th>{{ i18n "encryption" }}</th>
-                <th>{{ i18n "password" }}</th>
-                <th>{{ i18n "pages.inbounds.network" }}</th>
-            </tr><tr>
-                <td><a-tag color="green">[[ inbound.settings.method ]]</a-tag></td>
-                <td><a-tag color="blue">[[ inbound.settings.password ]]</a-tag></td>
-                <td><a-tag color="green">[[ inbound.settings.network ]]</a-tag></td>
-            </tr>
-        </table>
-        <template v-if="inbound.protocol == Protocols.SHADOWSOCKS && !inbound.isSSMultiUser">
+        <template v-if="dbInbound.isSS && !inbound.isSSMultiUser">
             <a-divider>URL</a-divider>
             <a-row v-for="(link,index) in infoModal.links">
                 <a-col :span="22"><a-tag color="cyan">[[ link.remark ]]</a-tag><br />[[ link.link ]]</a-col>
@@ -201,17 +200,19 @@
                 <td><a-tag color="blue">[[ inbound.settings.followRedirect ]]</a-tag></td>
             </tr>
         </table>
-        </table>
-        <table v-if="inbound.protocol == Protocols.SOCKS" style="margin-bottom: 10px; width: 100%;">
+        <table v-if="dbInbound.isSocks" style="margin-bottom: 10px; width: 100%;">
             <tr>
                 <th>{{ i18n "password" }} Auth</th>
                 <th>{{ i18n "pages.inbounds.enable" }} udp</th>
                 <th>IP</th>
-            </tr><tr>
+            </tr>
+            <tr>
                 <td><a-tag color="green">[[ inbound.settings.auth ]]</a-tag></td>
                 <td><a-tag color="blue">[[ inbound.settings.udp]]</a-tag></td>
                 <td><a-tag color="green">[[ inbound.settings.ip ]]</a-tag></td>
-            </tr><tr v-if="inbound.settings.auth == 'password'">
+            </tr>
+            <template v-if="inbound.settings.auth == 'password'">
+            <tr>
                 <td> </td>
                 <td>{{ i18n "username" }}</td>
                 <td>{{ i18n "password" }}</td>
@@ -220,9 +221,9 @@
                 <td><a-tag color="blue">[[ account.user ]]</a-tag></td>
                 <td><a-tag color="green">[[ account.pass ]]</a-tag></td>
             </tr>
+            </template>
         </table>
-        </table>
-        <table v-if="inbound.protocol == Protocols.HTTP" style="margin-bottom: 10px; width: 100%;">
+        <table v-if="dbInbound.isHTTP" style="margin-bottom: 10px; width: 100%;">
             <tr>
                 <th> </th>
                 <th>{{ i18n "username" }}</th>
@@ -233,7 +234,6 @@
                 <td><a-tag color="green">[[ account.pass ]]</a-tag></td>
             </tr>
         </table>
-        </table>
     </template>
 </a-modal>
 <script>