1 files changed, 73 insertions, 0 deletions
diff --git a/web/html/xui/common_sider.html b/web/html/xui/common_sider.html
new file mode 100644
index 00000000..f4499eeb
--- /dev/null
+++ b/web/html/xui/common_sider.html
@@ -0,0 +1,73 @@
+{{define "menuItems"}}
+<a-menu-item key="{{ .base_path }}xui/">
+    <a-icon type="dashboard"></a-icon>
+    <span>{{ i18n "menu.dashboard"}}</span>
+</a-menu-item>
+<a-menu-item key="{{ .base_path }}xui/inbounds">
+    <a-icon type="user"></a-icon>
+    <span>{{ i18n "menu.inbounds"}}</span>
+</a-menu-item>
+<a-menu-item key="{{ .base_path }}xui/setting">
+    <a-icon type="setting"></a-icon>
+    <span>{{ i18n "menu.setting"}}</span>
+</a-menu-item>
+<!--<a-menu-item key="{{ .base_path }}xui/clients">-->
+<!--    <a-icon type="laptop"></a-icon>-->
+<!--    <span>client</span>-->
+<!--</a-menu-item>-->
+<a-sub-menu>
+    <template slot="title">
+        <a-icon type="link"></a-icon>
+        <span>others</span>
+    </template>
+    <a-menu-item key="https://github.com/mhsanaei/3x-ui/">
+        <a-icon type="github"></a-icon>
+        <span>Github</span>
+    </a-menu-item>
+    <a-menu-item key="https://t.me/xxxuiforever">
+        <a-icon type="usergroup-add"></a-icon>
+        <span>Telegram Group</span>
+    </a-menu-item>
+</a-sub-menu>
+<a-menu-item key="{{ .base_path }}logout">
+    <a-icon type="logout"></a-icon>
+    <span>{{ i18n "menu.logout"}}</span>
+</a-menu-item>
+{{end}}
+
+
+{{define "commonSider"}}
+<a-layout-sider id="sider" collapsible breakpoint="md" collapsed-width="0">
+    <a-menu theme="dark" mode="inline" :selected-keys="['{{ .request_uri }}']"
+            @click="({key}) => key.startsWith('http') ? window.open(key) : location.href = key">
+        {{template "menuItems" .}}
+    </a-menu>
+</a-layout-sider>
+<a-drawer id="sider-drawer" placement="left" :closable="false"
+          @close="siderDrawer.close()"
+          :visible="siderDrawer.visible" :wrap-style="{ padding: 0 }">
+    <div class="drawer-handle" @click="siderDrawer.change()" slot="handle">
+        <a-icon :type="siderDrawer.visible ? 'close' : 'menu-fold'"></a-icon>
+    </div>
+    <a-menu theme="light" mode="inline" :selected-keys="['{{ .request_uri }}']"
+        @click="({key}) => key.startsWith('http') ? window.open(key) : location.href = key">
+        {{template "menuItems" .}}
+    </a-menu>
+</a-drawer>
+<script>
+
+    const siderDrawer = {
+        visible: false,
+        show() {
+            this.visible = true;
+        },
+        close() {
+            this.visible = false;
+        },
+        change() {
+            this.visible = !this.visible;
+        }
+    };
+
+</script>
+{{end}}