pagination and sub URI support #1300

2026-03-19 17:15:49 +00:00 · 2023-12-08 17:18:51 +01:00
parent 549f230221
commit 5e47b4e949
14 changed files with 142 additions and 59 deletions
--- a/web/html/common/qrcode_modal.html
+++ b/web/html/common/qrcode_modal.html
@@ -86,8 +86,7 @@
                });
            },
            genSubLink(subID) {
-                const { domain: host, port, tls: isTLS, path: base } = app.subSettings;
-                return buildURL({ host, port, isTLS, base, path: subID+'?name='+remark });
+                return app.subSettings.subURI+subID+'?name='+subID;
            }
        },
        updated() {
--- a/web/html/xui/component/setting.html
+++ b/web/html/xui/component/setting.html
@@ -13,10 +13,10 @@
        </a-col>
        <a-col :lg="24" :xl="12">
            <template v-if="type === 'text'">
-                <a-input :value="value" @input="$emit('input', $event.target.value)"></a-input>
+                <a-input :value="value" @input="$emit('input', $event.target.value)" :placeholder="placeholder"></a-input>
            </template>
            <template v-else-if="type === 'number'">
-                <a-input-number :value="value" @change="value => $emit('input', value)" :min="min" style="width: 100%;"></a-input-number>
+                <a-input-number :value="value" :step="step" @change="value => $emit('input', value)" :min="min" style="width: 100%;"></a-input-number>
            </template>
            <template v-else-if="type === 'switch'">
                <a-switch :checked="value" @change="value => $emit('input', value)"></a-switch>
@@ -29,7 +29,7 @@
 {{define "component/setting"}}
 <script>
    Vue.component('setting-list-item', {
-        props: ["type", "title", "desc", "value", "min"],
+        props: ["type", "title", "desc", "value", "min", "step", "placeholder"],
        template: `{{template "component/settingListItem"}}`,
    });
 </script>
--- a/web/html/xui/inbound_info_modal.html
+++ b/web/html/xui/inbound_info_modal.html
@@ -300,8 +300,7 @@
            infoModal.visible = false;
        },
        genSubLink(subID) {
-            const { domain: host, port, tls: isTLS, path: base } = app.subSettings;
-            return buildURL({ host, port, isTLS, base, path: subID+'?name='+remark });
+            return app.subSettings.subURI+subID+'?name='+subID;
        }
    };

--- a/web/html/xui/inbounds.html
+++ b/web/html/xui/inbounds.html
@@ -173,14 +173,13 @@
                        <a-table :columns="isMobile ? mobileColums : columns" :row-key="dbInbound => dbInbound.id"
                                 :data-source="searchedInbounds"
                                 :scroll="isMobile ? {} : { x: 1000 }"
-                                 :pagination="false"
+                                 :pagination=pagination(searchedInbounds)
                                 :expand-icon-as-cell="false"
                                 :expand-row-by-click="false"
                                 :expand-icon-column-index="0"
                                 :indent-size="0"
                                 :row-class-name="dbInbound => (dbInbound.isMultiUser() ? '' : 'hideExpandIcon')"
-                                 style="margin-top: 10px"
-                                 @change="() => getDBInbounds()">
+                                 style="margin-top: 10px">
                            <template slot="action" slot-scope="text, dbInbound">
                                <a-icon type="edit" style="font-size: 22px" @click="openEditInbound(dbInbound.id);"></a-icon>
                                <a-dropdown :trigger="['click']">
@@ -416,7 +415,7 @@
                                :row-key="client => client.id"
                                :columns="isMobile ? innerMobileColumns : innerColumns"
                                :data-source="getInboundClients(record)"
-                                :pagination="false"
+                                :pagination=pagination(getInboundClients(record))
                                :style="isMobile ? 'margin: -16px -5px -17px;' : 'margin-left: 10px;'">
                                    {{template "client_table"}}
                                </a-table>
@@ -547,12 +546,10 @@
            refreshInterval: Number(localStorage.getItem("refreshInterval")) || 5000,
            subSettings: {
                enable : false,
-                port: 0,
-                path: '',
-                domain: '',
-                tls: false
+                subURI : ''
            },
            tgBotEnable: false,
+            pageSize: 0,
            isMobile: window.innerWidth <= 768,
        },
        methods: {
@@ -592,11 +589,9 @@
                    this.tgBotEnable = tgBotEnable;
                    this.subSettings = {
                        enable : subEnable,
-                        port: subPort,
-                        path: subPath,
-                        domain: subDomain,
-                        tls: subTLS
+                        subURI: subURI
                    };
+                    this.pageSize = pageSize;
                }
            },
            setInbounds(dbInbounds) {
@@ -1216,6 +1211,27 @@
                    this.spinning = false;
                }
            },
+            pagination(obj){
+                if (this.pageSize > 0 && obj.length>this.pageSize) {
+                    // Set page options based on object size
+                    sizeOptions = []
+                    for (i=this.pageSize;i<=obj.length;i=i+this.pageSize) {
+                        sizeOptions.push(i.toString());
+                    }
+                    // Add option to see all in one page
+                    sizeOptions.push(i.toString());
+
+                    p = {
+                        showSizeChanger: true,
+                        size: 'small',
+                        position: 'bottom',
+                        pageSize: this.pageSize,
+                        pageSizeOptions: sizeOptions
+                    }
+                    return p
+                }
+                return false
+            },
            onResize() {
                this.isMobile = window.innerWidth <= 768;
            }
--- a/web/html/xui/settings.html
+++ b/web/html/xui/settings.html
@@ -112,6 +112,7 @@
                                <setting-list-item type="text" title='{{ i18n "pages.settings.privateKeyPath"}}' desc='{{ i18n "pages.settings.privateKeyPathDesc"}}' v-model="allSetting.webKeyFile"></setting-list-item>
                                <setting-list-item type="text" title='{{ i18n "pages.settings.panelUrlPath"}}' desc='{{ i18n "pages.settings.panelUrlPathDesc"}}' v-model="allSetting.webBasePath"></setting-list-item>
                                <setting-list-item type="number" title='{{ i18n "pages.settings.sessionMaxAge" }}' desc='{{ i18n "pages.settings.sessionMaxAgeDesc" }}' v-model="allSetting.sessionMaxAge" :min="0"></setting-list-item>
+                                <setting-list-item type="number" title='{{ i18n "pages.settings.pageSize" }}' desc='{{ i18n "pages.settings.pageSizeDesc" }}' v-model="allSetting.pageSize" :min="0" :step="5"></setting-list-item>
                                <setting-list-item type="number" title='{{ i18n "pages.settings.expireTimeDiff" }}' desc='{{ i18n "pages.settings.expireTimeDiffDesc" }}' v-model="allSetting.expireDiff" :min="0"></setting-list-item>
                                <setting-list-item type="number" title='{{ i18n "pages.settings.trafficDiff" }}' desc='{{ i18n "pages.settings.trafficDiffDesc" }}' v-model="allSetting.trafficDiff" :min="0"></setting-list-item>
                                <setting-list-item type="text" title='{{ i18n "pages.settings.timeZone"}}' desc='{{ i18n "pages.settings.timeZoneDesc"}}' v-model="allSetting.timeLocation"></setting-list-item>
@@ -243,6 +244,7 @@
                                <setting-list-item type="text" title='{{ i18n "pages.settings.subPath"}}' desc='{{ i18n "pages.settings.subPathDesc"}}' v-model="allSetting.subPath"></setting-list-item>
                                <setting-list-item type="text" title='{{ i18n "pages.settings.subCertPath"}}' desc='{{ i18n "pages.settings.subCertPathDesc"}}' v-model="allSetting.subCertFile"></setting-list-item>
                                <setting-list-item type="text" title='{{ i18n "pages.settings.subKeyPath"}}' desc='{{ i18n "pages.settings.subKeyPathDesc"}}' v-model="allSetting.subKeyFile"></setting-list-item>
+                                <setting-list-item type="text" title='{{ i18n "pages.settings.subURI"}}' desc='{{ i18n "pages.settings.subURIDesc"}}' v-model="allSetting.subURI" placeholder="(http|https)://domain[:port]/path/"></setting-list-item>
                                <setting-list-item type="number" title='{{ i18n "pages.settings.subUpdates"}}' desc='{{ i18n "pages.settings.subUpdatesDesc"}}' v-model="allSetting.subUpdates"></setting-list-item>
                            </a-list>
                        </a-tab-pane>