refactor: use new page templates

chore: clients comment improvement
- use default ant components instead custom styles - remove comments in inbound info modal (duplicates information) - enhance tooltip usage
2025-10-30 03:42:51 +00:00 · 2025-06-21 15:38:43 +07:00 · 2025-06-21 15:24:52 +07:00 · 2025-06-21 14:55:35 +07:00
9 changed files with 874 additions and 769 deletions
--- a/web/html/common/head.html
+++ b/web/html/common/head.html
@ -1,31 +0,0 @@
-{{define "head"}}
-<head>
-  <meta charset="UTF-8">
-  <meta name="renderer" content="webkit">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta name="robots" content="noindex,nofollow">
-  <link rel="stylesheet" href="{{ .base_path }}assets/ant-design-vue/antd.min.css">
-  <link rel="stylesheet" href="{{ .base_path }}assets/css/custom.min.css?{{ .cur_ver }}">
-  <style>
-    [v-cloak] {
-      display: none;
-    }
-    /* vazirmatn-regular - arabic_latin_latin-ext */
-    @font-face {
-      font-display: swap;
-      font-family: 'Vazirmatn';
-      font-style: normal;
-      font-weight: 400;
-      src: url('{{ .base_path }}assets/Vazirmatn-UI-NL-Regular.woff2') format('woff2');
-      unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC, U+0030-0039;
-    }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Vazirmatn', 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB',
-        'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji',
-        'Segoe UI Emoji', 'Segoe UI Symbol';
-    }
-  </style>
-  <title>{{ .host }} – {{ i18n .title}}</title>
-</head>
-<div id="message"></div>
-{{end}}
--- a/web/html/common/js.html
+++ b/web/html/common/js.html
@ -1,14 +0,0 @@
-{{define "js"}}
-<script src="{{ .base_path }}assets/vue/vue.min.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/moment/moment.min.js"></script>
-<script src="{{ .base_path }}assets/ant-design-vue/antd.min.js"></script>
-<script src="{{ .base_path }}assets/axios/axios.min.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/qs/qs.min.js"></script>
-<script src="{{ .base_path }}assets/js/axios-init.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/js/util/date-util.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/js/util/index.js?{{ .cur_ver }}"></script>
-<script>
-    const basePath = '{{ .base_path }}';
-    axios.defaults.baseURL = basePath;
-</script>
-{{end}}
--- a/web/html/common/page.html
+++ b/web/html/common/page.html
@ -0,0 +1,58 @@
+{{ define "page/head_start" }}
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta name="renderer" content="webkit">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="robots" content="noindex,nofollow">
+  <link rel="stylesheet" href="{{ .base_path }}assets/ant-design-vue/antd.min.css">
+  <link rel="stylesheet" href="{{ .base_path }}assets/css/custom.min.css?{{ .cur_ver }}">
+  <style>
+    [v-cloak] {
+      display: none;
+    }
+    /* vazirmatn-regular - arabic_latin_latin-ext */
+    @font-face {
+      font-display: swap;
+      font-family: 'Vazirmatn';
+      font-style: normal;
+      font-weight: 400;
+      src: url('{{ .base_path }}assets/Vazirmatn-UI-NL-Regular.woff2') format('woff2');
+      unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC, U+0030-0039;
+    }
+    body {
+      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Vazirmatn', 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    }
+  </style>
+  <title>{{ .host }} – {{ i18n .title}}</title>
+{{ end }}
+
+{{ define "page/head_end" }}
+</head>
+{{ end }}
+
+{{ define "page/body_start" }}
+<body>
+  <div id="message"></div>
+{{ end }}
+
+{{ define "page/body_scripts" }}
+<script src="{{ .base_path }}assets/vue/vue.min.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/moment/moment.min.js"></script>
+<script src="{{ .base_path }}assets/ant-design-vue/antd.min.js"></script>
+<script src="{{ .base_path }}assets/axios/axios.min.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/qs/qs.min.js"></script>
+<script src="{{ .base_path }}assets/js/axios-init.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/js/util/date-util.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/js/util/index.js?{{ .cur_ver }}"></script>
+<script>
+  const basePath = '{{ .base_path }}';
+  axios.defaults.baseURL = basePath;
+</script>
+{{ end }}
+  
+{{ define "page/body_end" }}
+</body>
+</html>
+{{ end }}
--- a/web/html/component/aClientTable.html
+++ b/web/html/component/aClientTable.html
@ -41,6 +41,7 @@
  </template>
 </template>
 <template slot="client" slot-scope="text, client">
+  <a-space direction="horizontal" :size="2">
    <a-tooltip>
      <template slot="title">
        <template v-if="!isClientEnabled(record, client.email)">{{ i18n "depleted" }}</template>
@ -48,7 +49,20 @@
        <template v-else-if="client.enable && isClientOnline(client.email)">{{ i18n "online" }}</template>
      </template>
      <a-badge :class="isClientOnline(client.email)? 'online-animation' : ''" :color="client.enable ? statsExpColor(record, client.email) : themeSwitcher.isDarkTheme ? '#2c3950' : '#bcbcbc'"></a-badge>
-  </a-tooltip> [[ client.email ]]
+    </a-tooltip>
+    <a-space direction="vertical" :size="2">
+      <span class="client-email">[[ client.email ]]</span>
+      <template v-if="client.comment && client.comment.trim()">
+        <a-tooltip v-if="client.comment.length > 50" :overlay-class-name="themeSwitcher.currentTheme">
+          <template slot="title">
+            [[ client.comment ]]
+          </template>
+          <span class="client-comment">[[ client.comment.substring(0, 47) + '...' ]]</span>
+        </a-tooltip>
+        <span v-else class="client-comment">[[ client.comment ]]</span>
+      </template>
+    </a-space>
+  </a-space>
 </template>
 <template slot="traffic" slot-scope="text, client">
  <a-popover :overlay-class-name="themeSwitcher.currentTheme">
--- a/web/html/inbounds.html
+++ b/web/html/inbounds.html
@ -1,6 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
+{{ template "page/head_start" .}}
 <style>
  .ant-table:not(.ant-table-expanded-row .ant-table) {
    outline: 1px solid #f0f0f0;
@ -79,6 +77,19 @@
    max-width: 200px;
    overflow: hidden;
  }
+  .client-comment {
+    font-size: 12px;
+    opacity: 0.75;
+    cursor: help;
+  }
+  .client-email {
+    font-weight: 500;
+  }
+  .client-popup-item {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+  }
  .online-animation .ant-badge-status-dot {
    animation: onlineAnimation 1.2s linear infinite;
  }
@ -130,8 +141,9 @@
    padding: 12px 2px;
  }
 </style>
+{{ template "page/head_end" .}}

-<body>
+{{ template "page/body_start" .}}
 <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
  <a-sidebar></a-sidebar>
  <a-layout id="content-layout">
@ -382,25 +394,57 @@
                    <a-tag :style="{ margin: '0' }" color="green">[[ clientCount[dbInbound.id].clients ]]</a-tag>
                    <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="themeSwitcher.currentTheme">
                      <template slot="content">
-                        <div v-for="clientEmail in clientCount[dbInbound.id].deactive"><span>[[ clientEmail ]]</span></div>
+                        <div v-for="clientEmail in clientCount[dbInbound.id].deactive" :key="clientEmail" class="client-popup-item">
+                          <span>[[ clientEmail ]]</span>
+                          <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                            <template #title>
+                              [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                            </template>
+                            <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                          </a-tooltip>
+                        </div>
                      </template>
                      <a-tag :style="{ margin: '0', padding: '0 2px' }" v-if="clientCount[dbInbound.id].deactive.length">[[ clientCount[dbInbound.id].deactive.length ]]</a-tag>
                    </a-popover>
                    <a-popover title='{{ i18n "depleted" }}' :overlay-class-name="themeSwitcher.currentTheme">
                      <template slot="content">
-                        <div v-for="clientEmail in clientCount[dbInbound.id].depleted"><span>[[ clientEmail ]]</span></div>
+                        <div v-for="clientEmail in clientCount[dbInbound.id].depleted" :key="clientEmail" class="client-popup-item">
+                          <span>[[ clientEmail ]]</span>
+                          <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                            <template #title>
+                              [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                            </template>
+                            <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                          </a-tooltip>
+                        </div>
                      </template>
                      <a-tag :style="{ margin: '0', padding: '0 2px' }" color="red" v-if="clientCount[dbInbound.id].depleted.length">[[ clientCount[dbInbound.id].depleted.length ]]</a-tag>
                    </a-popover>
                    <a-popover title='{{ i18n "depletingSoon" }}' :overlay-class-name="themeSwitcher.currentTheme">
                      <template slot="content">
-                        <div v-for="clientEmail in clientCount[dbInbound.id].expiring"><span>[[ clientEmail ]]</span></div>
+                        <div v-for="clientEmail in clientCount[dbInbound.id].expiring" :key="clientEmail" class="client-popup-item">
+                          <span>[[ clientEmail ]]</span>
+                          <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                            <template #title>
+                              [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                            </template>
+                            <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                          </a-tooltip>
+                        </div>
                      </template>
                      <a-tag :style="{ margin: '0', padding: '0 2px' }" color="orange" v-if="clientCount[dbInbound.id].expiring.length">[[ clientCount[dbInbound.id].expiring.length ]]</a-tag>
                    </a-popover>
                    <a-popover title='{{ i18n "online" }}' :overlay-class-name="themeSwitcher.currentTheme">
                      <template slot="content">
-                        <div v-for="clientEmail in clientCount[dbInbound.id].online"><span>[[ clientEmail ]]</span></div>
+                        <div v-for="clientEmail in clientCount[dbInbound.id].online" :key="clientEmail" class="client-popup-item">
+                          <span>[[ clientEmail ]]</span>
+                          <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                            <template #title>
+                              [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                            </template>
+                            <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                          </a-tooltip>
+                        </div>
                      </template>
                      <a-tag :style="{ margin: '0', padding: '0 2px' }" color="blue" v-if="clientCount[dbInbound.id].online.length">[[ clientCount[dbInbound.id].online.length ]]</a-tag>
                    </a-popover>
@ -479,25 +523,57 @@
                            <a-tag :style="{ margin: '0' }" color="blue">[[ clientCount[dbInbound.id].clients ]]</a-tag>
                            <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="themeSwitcher.currentTheme">
                              <template slot="content">
-                                <p v-for="clientEmail in clientCount[dbInbound.id].deactive">[[ clientEmail ]]</p>
+                                <div v-for="clientEmail in clientCount[dbInbound.id].deactive" :key="clientEmail" class="client-popup-item">
+                                  <span>[[ clientEmail ]]</span>
+                                  <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                                    <template #title>
+                                      [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                                    </template>
+                                    <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                                  </a-tooltip>
+                                </div>
                              </template>
                              <a-tag :style="{ margin: '0', padding: '0 2px' }" v-if="clientCount[dbInbound.id].deactive.length">[[ clientCount[dbInbound.id].deactive.length ]]</a-tag>
                            </a-popover>
                            <a-popover title='{{ i18n "depleted" }}' :overlay-class-name="themeSwitcher.currentTheme">
                              <template slot="content">
-                                <p v-for="clientEmail in clientCount[dbInbound.id].depleted">[[ clientEmail ]]</p>
+                                <div v-for="clientEmail in clientCount[dbInbound.id].depleted" :key="clientEmail" class="client-popup-item">
+                                  <span>[[ clientEmail ]]</span>
+                                  <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                                    <template #title>
+                                      [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                                    </template>
+                                    <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                                  </a-tooltip>
+                                </div>
                              </template>
                              <a-tag :style="{ margin: '0', padding: '0 2px' }" color="red" v-if="clientCount[dbInbound.id].depleted.length">[[ clientCount[dbInbound.id].depleted.length ]]</a-tag>
                            </a-popover>
                            <a-popover title='{{ i18n "depletingSoon" }}' :overlay-class-name="themeSwitcher.currentTheme">
                              <template slot="content">
-                                <p v-for="clientEmail in clientCount[dbInbound.id].expiring">[[ clientEmail ]]</p>
+                                <div v-for="clientEmail in clientCount[dbInbound.id].expiring" :key="clientEmail" class="client-popup-item">
+                                  <span>[[ clientEmail ]]</span>
+                                  <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                                    <template #title>
+                                      [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                                    </template>
+                                    <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                                  </a-tooltip>
+                                </div>
                              </template>
                              <a-tag :style="{ margin: '0', padding: '0 2px' }" color="orange" v-if="clientCount[dbInbound.id].expiring.length">[[ clientCount[dbInbound.id].expiring.length ]]</a-tag>
                            </a-popover>
                            <a-popover title='{{ i18n "online" }}' :overlay-class-name="themeSwitcher.currentTheme">
                              <template slot="content">
-                                <p v-for="clientEmail in clientCount[dbInbound.id].online">[[ clientEmail ]]</p>
+                                <div v-for="clientEmail in clientCount[dbInbound.id].online" :key="clientEmail" class="client-popup-item">
+                                  <span>[[ clientEmail ]]</span>
+                                  <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
+                                    <template #title>
+                                      [[ getClientWithComment(clientEmail, dbInbound.id).comment ]]
+                                    </template>
+                                    <a-icon type="message" v-if="getClientWithComment(clientEmail, dbInbound.id).comment"></a-icon>
+                                  </a-tooltip>
+                                </div>
                              </template>
                              <a-tag :style="{ margin: '0', padding: '0 2px' }" color="green" v-if="clientCount[dbInbound.id].online.length">[[ clientCount[dbInbound.id].online.length ]]</a-tag>
                            </a-popover>
@ -580,7 +656,7 @@
    </a-layout-content>
  </a-layout>
 </a-layout>
-{{template "js" .}}
+{{template "page/body_scripts" .}}
 <script src="{{ .base_path }}assets/qrcode/qrious2.min.js?{{ .cur_ver }}"></script>
 <script src="{{ .base_path }}assets/uri/URI.min.js?{{ .cur_ver }}"></script>
 <script src="{{ .base_path }}assets/js/model/inbound.js?{{ .cur_ver }}"></script>
@ -589,6 +665,13 @@
 {{template "component/aThemeSwitch" .}}
 {{template "component/aCustomStatistic" .}}
 {{template "component/aPersianDatepicker" .}}
+{{template "modals/inboundModal"}}
+{{template "modals/promptModal"}}
+{{template "modals/qrcodeModal"}}
+{{template "modals/textModal"}}
+{{template "modals/inboundInfoModal"}}
+{{template "modals/clientsModal"}}
+{{template "modals/clientsBulkModal"}}
 <script>
    const columns = [{
        title: "ID",
@ -716,6 +799,17 @@
            loading(spinning = true) {
                this.spinning = spinning;
            },
+            getClientWithComment(email, inboundId) {
+                const dbInbound = this.dbInbounds.find(inbound => inbound.id === inboundId);
+                if (!dbInbound) return { email, comment: '' };
+                
+                const inboundSettings = JSON.parse(dbInbound.settings);
+                if (inboundSettings.clients) {
+                    const client = inboundSettings.clients.find(c => c.email === email);
+                    return client ? { email: client.email, comment: client.comment || '' } : { email, comment: '' };
+                }
+                return { email, comment: '' };
+            },
            async getDBInbounds() {
                this.refreshing = true;
                const msg = await HttpUtil.post('/panel/inbound/list');
@ -1519,13 +1613,4 @@
        },
    });
 </script>
-
-{{template "modals/inboundModal"}}
-{{template "modals/promptModal"}}
-{{template "modals/qrcodeModal"}}
-{{template "modals/textModal"}}
-{{template "modals/inboundInfoModal"}}
-{{template "modals/clientsModal"}}
-{{template "modals/clientsBulkModal"}}
-</body>
-</html>
+{{ template "page/body_end" .}}
--- a/web/html/index.html
+++ b/web/html/index.html
@ -1,6 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
+{{ template "page/head_start" .}}
 <style>
  @media (min-width: 769px) {
    .ant-layout-content {
@ -79,8 +77,9 @@
    }
  }
 </style>
+{{ template "page/head_end" .}}

-<body>
+{{ template "page/body_start" .}}
 <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
  <a-sidebar></a-sidebar>
  <a-layout id="content-layout">
@ -237,7 +236,7 @@
                    </a-tag>
                  </a>
                  <a rel="noopener" href="https://github.com/MHSanaei/3x-ui/wiki" target="_blank">
-                      <a-tag>
+                    <a-tag color="purple">
                      <span>{{ i18n "pages.index.documentation" }}</span>
                    </a-tag>
                  </a>
@ -456,7 +455,7 @@
    </a-list>
  </a-modal>
 </a-layout>
-{{template "js" .}}
+{{template "page/body_scripts" .}}
 {{template "component/aSidebar" .}}
 {{template "component/aThemeSwitch" .}}
 {{template "component/aCustomStatistic" .}}
@ -788,5 +787,4 @@
        },
    });
 </script>
-</body>
-</html>
+{{ template "page/body_end" .}}
--- a/web/html/login.html
+++ b/web/html/login.html
@ -1,6 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
+{{ template "page/head_start" .}}
 <style>
  html * {
    -webkit-font-smoothing: antialiased;
@ -453,8 +451,9 @@
    margin: 2px 0 4px;
  }
 </style>
+{{ template "page/head_end" .}}

-<body>
+{{ template "page/body_start" .}}
 <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
  <transition name="list" appear>
    <a-layout-content class="under" :style="{ minHeight: '0' }">
@ -543,7 +542,7 @@
    </a-layout-content>
  </transition>
 </a-layout>
-  {{template "js" .}}
+{{template "page/body_scripts" .}}
 {{template "component/aThemeSwitch" .}}
 <script>
  const app = new Vue({
@ -622,5 +621,4 @@
    }
  });
 </script>
-</body>
-</html>
+{{ template "page/body_end" .}}
--- a/web/html/settings.html
+++ b/web/html/settings.html
@ -1,6 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
+{{ template "page/head_start" .}}
 <style>
  @media (min-width: 769px) {
    .ant-layout-content {
@ -60,7 +58,9 @@
    margin-block-end: 12px;
  }
 </style>
-<body>
+{{ template "page/head_end" .}}
+
+{{ template "page/body_start" .}}
 <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
  <a-sidebar></a-sidebar>
  <a-layout id="content-layout">
@ -121,7 +121,7 @@
    </a-layout-content>
  </a-layout>
 </a-layout>
-{{template "js" .}}
+{{template "page/body_scripts" .}}
 <script src="{{ .base_path }}assets/qrcode/qrious2.min.js?{{ .cur_ver }}"></script>
 <script src="{{ .base_path }}assets/otpauth/otpauth.umd.min.js?{{ .cur_ver }}"></script>
 <script src="{{ .base_path }}assets/js/model/setting.js?{{ .cur_ver }}"></script>
@ -531,5 +531,4 @@
    }
  });
 </script>
-</body>
-</html>
+{{ template "page/body_end" .}}
--- a/web/html/xray.html
+++ b/web/html/xray.html
@ -1,22 +1,8 @@
-<!DOCTYPE html>
-<html lang="en">
-{{template "head" .}}
+{{ template "page/head_start" .}}
 <link rel="stylesheet" href="{{ .base_path }}assets/codemirror/codemirror.min.css?{{ .cur_ver }}">
 <link rel="stylesheet" href="{{ .base_path }}assets/codemirror/fold/foldgutter.css">
 <link rel="stylesheet" href="{{ .base_path }}assets/codemirror/xq.min.css?{{ .cur_ver }}">
 <link rel="stylesheet" href="{{ .base_path }}assets/codemirror/lint/lint.css">
-
-<script src="{{ .base_path }}assets/js/model/outbound.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/codemirror/codemirror.min.js?{{ .cur_ver }}"></script>
-<script src="{{ .base_path }}assets/codemirror/javascript.js"></script>
-<script src="{{ .base_path }}assets/codemirror/jshint.js"></script>
-<script src="{{ .base_path }}assets/codemirror/jsonlint.js"></script>
-<script src="{{ .base_path }}assets/codemirror/lint/lint.js"></script>
-<script src="{{ .base_path }}assets/codemirror/lint/javascript-lint.js"></script>
-<script src="{{ .base_path }}assets/codemirror/hint/javascript-hint.js"></script>
-<script src="{{ .base_path }}assets/codemirror/fold/foldcode.js"></script>
-<script src="{{ .base_path }}assets/codemirror/fold/foldgutter.js"></script>
-<script src="{{ .base_path }}assets/codemirror/fold/brace-fold.js"></script>
 <style>
  @media (min-width: 769px) {
    .ant-layout-content {
@ -46,7 +32,9 @@
    margin-block-end: 12px;
 }
 </style>
-<body>
+{{ template "page/head_end" .}}
+
+{{ template "page/body_start" .}}
 <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">
 <a-sidebar></a-sidebar>
 <a-layout id="content-layout">
@ -118,7 +106,18 @@
    </a-layout-content>
 </a-layout>
 </a-layout>
-{{template "js" .}}
+{{template "page/body_scripts" .}}
+<script src="{{ .base_path }}assets/js/model/outbound.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/codemirror/codemirror.min.js?{{ .cur_ver }}"></script>
+<script src="{{ .base_path }}assets/codemirror/javascript.js"></script>
+<script src="{{ .base_path }}assets/codemirror/jshint.js"></script>
+<script src="{{ .base_path }}assets/codemirror/jsonlint.js"></script>
+<script src="{{ .base_path }}assets/codemirror/lint/lint.js"></script>
+<script src="{{ .base_path }}assets/codemirror/lint/javascript-lint.js"></script>
+<script src="{{ .base_path }}assets/codemirror/hint/javascript-hint.js"></script>
+<script src="{{ .base_path }}assets/codemirror/fold/foldcode.js"></script>
+<script src="{{ .base_path }}assets/codemirror/fold/foldgutter.js"></script>
+<script src="{{ .base_path }}assets/codemirror/fold/brace-fold.js"></script>
 {{template "component/aSidebar" .}}
 {{template "component/aThemeSwitch" .}}
 {{template "component/aTableSortable" .}}
@ -1410,5 +1409,4 @@
        },
    });
 </script>
-</body>
-</html>
+{{ template "page/body_end" .}}
Author	SHA1	Message	Date
Shishkevich D.	d642774a44	refactor: use new page templates Some checks are pending Release 3X-UI / build (386) (push) Waiting to run Details Release 3X-UI / build (amd64) (push) Waiting to run Details Release 3X-UI / build (arm64) (push) Waiting to run Details Release 3X-UI / build (armv5) (push) Waiting to run Details Release 3X-UI / build (armv6) (push) Waiting to run Details Release 3X-UI / build (armv7) (push) Waiting to run Details Release 3X-UI / build (s390x) (push) Waiting to run Details	2025-06-21 15:38:43 +07:00
Shishkevich D.	1644904755	chore: clients comment improvement - use default ant components instead custom styles - remove comments in inbound info modal (duplicates information) - enhance tooltip usage	2025-06-21 15:24:52 +07:00
Vadim Iskuchekov	5c10035bd9	feat: add comments under client id (#3131 )	2025-06-21 14:55:35 +07:00