Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/MHSanaei/3x-ui.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMHSanaei <33454419+MHSanaei@users.noreply.github.com>2023-03-23 22:52:50 +0300
committerMHSanaei <33454419+MHSanaei@users.noreply.github.com>2023-03-23 22:52:50 +0300
commit5ef8a5a37ec7e6b7df710fa61b0324ab5a6617ab (patch)
tree8356d79072560de703f6dbc1d26fa5d51a6d5ac1 /web/html/xui/inbounds.html
parentc49a9e877cb8481a98564b45f3462f8f73189f6e (diff)
old designv1.0.9
Diffstat (limited to 'web/html/xui/inbounds.html')
-rw-r--r--web/html/xui/inbounds.html245
1 files changed, 79 insertions, 166 deletions
diff --git a/web/html/xui/inbounds.html b/web/html/xui/inbounds.html
index d5f69733..2c9a4b76 100644
--- a/web/html/xui/inbounds.html
+++ b/web/html/xui/inbounds.html
@@ -11,10 +11,6 @@
.ant-col-sm-24 {
margin-top: 10px;
}
-
- .ant-table-row-expand-icon {
- color: rgba(0,0,0,.65);
- }
</style>
<body>
<a-layout id="app" v-cloak>
@@ -31,15 +27,15 @@
<a-card hoverable style="margin-bottom: 20px;" :class="siderDrawer.isDarkTheme ? darkClass : ''">
<a-row>
<a-col :xs="24" :sm="24" :lg="12">
- {{ i18n "pages.inbounds.totalDownUp" }}:
+ {{ i18n "pages.inbounds.totalDownUp" }}:
<a-tag color="green">[[ sizeFormat(total.up) ]] / [[ sizeFormat(total.down) ]]</a-tag>
</a-col>
<a-col :xs="24" :sm="24" :lg="12">
- {{ i18n "pages.inbounds.totalUsage" }}:
+ {{ i18n "pages.inbounds.totalUsage" }}:
<a-tag color="green">[[ sizeFormat(total.up + total.down) ]]</a-tag>
</a-col>
<a-col :xs="24" :sm="24" :lg="12">
- {{ i18n "pages.inbounds.inboundCount" }}:
+ {{ i18n "pages.inbounds.inboundCount" }}:
<a-tag color="green">[[ dbInbounds.length ]]</a-tag>
</a-col>
<a-col :xs="24" :sm="24" :lg="12">
@@ -54,10 +50,10 @@
<transition name="list" appear>
<a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''">
<div slot="title">
- <a-button type="primary" icon="plus" @click="openAddInbound">{{ i18n "pages.inbounds.addInbound" }}</a-button>
- <a-button type="primary" icon="export" @click="exportAllLinks">{{ i18n "pages.inbounds.export" }}</a-button>
+ <a-button type="primary" @click="openAddInbound">Add Inbound</a-button>
+ <a-button type="primary" @click="exportAllLinks" class="copy-btn">Export Links</a-button>
</div>
- <a-input v-model.lazy="searchKey" placeholder="{{ i18n "search" }}" autofocus style="max-width: 300px"></a-input>
+ <a-input v-model.lazy="searchKey" placeholder="{{ i18n "search" }}" autofocus style="max-width: 300px"></a-input>
<a-table :columns="columns" :row-key="dbInbound => dbInbound.id"
:data-source="searchedInbounds"
:loading="spinning" :scroll="{ x: 1300 }"
@@ -67,8 +63,8 @@
<template slot="action" slot-scope="text, dbInbound">
<a-icon type="edit" style="font-size: 25px" @click="openEditInbound(dbInbound.id);"></a-icon>
<a-dropdown :trigger="['click']">
- <a @click="e => e.preventDefault()">{{ i18n "pages.inbounds.operate" }}</a>
- <a-menu slot="overlay" @click="a => clickAction(a, dbInbound)" :theme="siderDrawer.theme" style="border: 1px solid rgba(255, 255, 255, 0.65);">
+ <a @click="e => e.preventDefault()">{{ i18n "pages.inbounds.operate" }}</a>
+ <a-menu slot="overlay" @click="a => clickAction(a, dbInbound)">
<a-menu-item v-if="dbInbound.isSS" key="qrcode">
<a-icon type="qrcode"></a-icon>
{{ i18n "qrCode" }}
@@ -77,26 +73,12 @@
<a-icon type="edit"></a-icon>
{{ i18n "edit" }}
</a-menu-item>
- <template v-if="dbInbound.isTrojan || dbInbound.isVLess || dbInbound.isVMess">
- <a-menu-item key="addClient">
- <a-icon type="user"></a-icon>
- {{ i18n "pages.client.add"}}
- </a-menu-item>
- <a-menu-item key="addBulkClient">
- <a-icon type="team"></a-icon>
- {{ i18n "pages.client.bulk"}}
- </a-menu-item>
+ <template v-if="dbInbound.isTrojan || dbInbound.isVLess || dbInbound.isVMess">
<a-menu-item key="export">
<a-icon type="export"></a-icon>
{{ i18n "pages.inbounds.export"}}
</a-menu-item>
</template>
- <template v-else>
- <a-menu-item key="showInfo">
- <a-icon type="info-circle"></a-icon>
- {{ i18n "info"}}
- </a-menu-item>
- </template>
<a-menu-item key="resetTraffic">
<a-icon type="retweet"></a-icon> {{ i18n "pages.inbounds.resetTraffic" }}
</a-menu-item>
@@ -128,7 +110,7 @@
<template v-else>{{ i18n "none" }}</template>
</template>
<template slot="enable" slot-scope="text, dbInbound">
- <a-switch v-model="dbInbound.enable" @change="switchEnable(dbInbound.id)"></a-switch>
+ <a-switch v-model="dbInbound.enable" @change="switchEnable(dbInbound)"></a-switch>
</template>
<template slot="expiryTime" slot-scope="text, dbInbound">
<template v-if="dbInbound.expiryTime > 0">
@@ -149,7 +131,7 @@
:data-source="getInboundClients(record)"
:pagination="false"
>
- {{template "client_table"}}
+ {{template "client_row"}}
</a-table>
<a-table
v-else-if="record.protocol === Protocols.TROJAN"
@@ -158,7 +140,16 @@
:data-source="getInboundClients(record)"
:pagination="false"
>
- {{template "client_table"}}
+ {{template "client_row"}}
+ </a-table>
+ <a-table
+ v-else
+ :row-key="client => client.id"
+ :columns="innerOneColumns"
+ :data-source="record"
+ :pagination="false"
+ >
+ {{template "client_row"}}
</a-table>
</template>
</a-table>
@@ -182,7 +173,7 @@
width: 40,
scopedSlots: { customRender: 'enable' },
}, {
- title: "ID",
+ title: "Id",
align: 'center',
dataIndex: "id",
width: 30,
@@ -206,7 +197,7 @@
align: 'center',
width: 150,
scopedSlots: { customRender: 'traffic' },
- }, {
+ },{
title: '{{ i18n "pages.inbounds.transportConfig" }}',
align: 'center',
width: 60,
@@ -219,20 +210,26 @@
}];
const innerColumns = [
- { title: '{{ i18n "pages.inbounds.operate" }}', width: 70, scopedSlots: { customRender: 'actions' } },
+ { title: '', width: 70, scopedSlots: { customRender: 'actions' } },
{ title: '{{ i18n "pages.inbounds.client" }}', width: 60, scopedSlots: { customRender: 'client' } },
{ title: '{{ i18n "pages.inbounds.traffic" }}↑|↓', width: 100, scopedSlots: { customRender: 'traffic' } },
{ title: '{{ i18n "pages.inbounds.expireDate" }}', width: 70, scopedSlots: { customRender: 'expiryTime' } },
{ title: 'UID', width: 150, dataIndex: "id" },
+
];
+
const innerTrojanColumns = [
- { title: '{{ i18n "pages.inbounds.operate" }}', width: 70, scopedSlots: { customRender: 'actions' } },
+ { title: '', width: 70, scopedSlots: { customRender: 'actions' } },
{ title: '{{ i18n "pages.inbounds.client" }}', width: 60, scopedSlots: { customRender: 'client' } },
{ title: '{{ i18n "pages.inbounds.traffic" }}↑|↓', width: 100, scopedSlots: { customRender: 'traffic' } },
{ title: '{{ i18n "pages.inbounds.expireDate" }}', width: 70, scopedSlots: { customRender: 'expiryTime' } },
{ title: 'Password', width: 100, dataIndex: "password" },
];
+ const innerOneColumns = [
+ { title: '', width: 70, scopedSlots: { customRender: 'actions' } },
+ ];
+
const app = new Vue({
delimiters: ['[[', ']]'],
el: '#app',
@@ -256,7 +253,6 @@
return;
}
this.setInbounds(msg.obj);
- this.searchKey = '';
},
setInbounds(dbInbounds) {
this.inbounds.splice(0);
@@ -297,26 +293,17 @@
case "qrcode":
this.showQrcode(dbInbound);
break;
- case "showInfo":
- this.showInfo(dbInbound);
+ case "export":
+ this.inboundLinks(dbInbound.id);
break;
case "edit":
this.openEditInbound(dbInbound.id);
break;
- case "addClient":
- this.openAddClient(dbInbound.id)
- break;
- case "addBulkClient":
- this.openAddBulkClient(dbInbound.id)
- break;
- case "export":
- this.inboundLinks(dbInbound.id);
- break;
case "resetTraffic":
- this.resetTraffic(dbInbound.id);
+ this.resetTraffic(dbInbound);
break;
case "delete":
- this.delInbound(dbInbound.id);
+ this.delInbound(dbInbound);
break;
}
},
@@ -333,8 +320,8 @@
isEdit: false
});
},
- openEditInbound(dbInboundId) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
+ openEditInbound(dbInbound_id) {
+ dbInbound = this.dbInbounds.find(row => row.id === dbInbound_id);
const inbound = dbInbound.toInbound();
inModal.show({
title: '{{ i18n "pages.inbounds.modifyInbound"}}',
@@ -363,10 +350,9 @@
port: inbound.port,
protocol: inbound.protocol,
settings: inbound.settings.toString(),
+ streamSettings: inbound.stream.toString(),
+ sniffing: inbound.canSniffing() ? inbound.sniffing.toString() : '{}',
};
- if (inbound.canEnableStream()) data.streamSettings = inbound.stream.toString();
- if (inbound.canSniffing()) data.sniffing = inbound.sniffing.toString();
-
await this.submit('/xui/inbound/add', data, inModal);
},
async updateInbound(inbound, dbInbound) {
@@ -382,80 +368,15 @@
port: inbound.port,
protocol: inbound.protocol,
settings: inbound.settings.toString(),
+ streamSettings: inbound.stream.toString(),
+ sniffing: inbound.canSniffing() ? inbound.sniffing.toString() : '{}',
};
- if (inbound.canEnableStream()) data.streamSettings = inbound.stream.toString();
- if (inbound.canSniffing()) data.sniffing = inbound.sniffing.toString();
-
await this.submit(`/xui/inbound/update/${dbInbound.id}`, data, inModal);
},
- openAddClient(dbInboundId) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- clientModal.show({
- title: '{{ i18n "pages.client.add"}}',
- okText: '{{ i18n "pages.client.submitAdd"}}',
- dbInbound: dbInbound,
- confirm: async (inbound, dbInbound, index) => {
- clientModal.loading();
- await this.addClient(inbound, dbInbound);
- clientModal.close();
- },
- isEdit: false
- });
- },
- openAddBulkClient(dbInboundId) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- clientsBulkModal.show({
- title: '{{ i18n "pages.client.bulk"}} ' + dbInbound.remark,
- okText: '{{ i18n "pages.client.bulk"}}',
- dbInbound: dbInbound,
- confirm: async (inbound, dbInbound) => {
- clientsBulkModal.loading();
- await this.addClient(inbound, dbInbound);
- clientsBulkModal.close();
- },
- });
- },
- openEditClient(dbInboundId, client) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- clients = this.getInboundClients(dbInbound);
- index = this.findIndexOfClient(clients, client);
- clientModal.show({
- title: '{{ i18n "pages.client.edit"}}',
- okText: '{{ i18n "pages.client.submitEdit"}}',
- dbInbound: dbInbound,
- index: index,
- confirm: async (inbound, dbInbound, index) => {
- clientModal.loading();
- await this.updateClient(inbound, dbInbound, index);
- clientModal.close();
- },
- isEdit: true
- });
- },
- findIndexOfClient(clients,client) {
- firstKey = Object.keys(client)[0];
- return clients.findIndex(c => c[firstKey] === client[firstKey]);
- },
- async addClient(inbound, dbInbound) {
- const data = {
- id: dbInbound.id,
- settings: inbound.settings.toString(),
- };
- await this.submit('/xui/inbound/addClient', data);
- },
- async updateClient(inbound, dbInbound, index) {
- const data = {
- id: dbInbound.id,
- settings: inbound.settings.toString(),
- };
- await this.submit(`/xui/inbound/updateClient/${index}`, data);
- },
- resetTraffic(dbInboundId) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
+ resetTraffic(dbInbound) {
this.$confirm({
title: '{{ i18n "pages.inbounds.resetTraffic"}}',
content: '{{ i18n "pages.inbounds.resetTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => {
@@ -466,37 +387,16 @@
},
});
},
- delInbound(dbInboundId) {
- this.$confirm({
- title: '{{ i18n "pages.inbounds.deleteInbound"}}',
- content: '{{ i18n "pages.inbounds.deleteInboundContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
- okText: '{{ i18n "delete"}}',
- cancelText: '{{ i18n "cancel"}}',
- onOk: () => this.submit('/xui/inbound/del/' + dbInboundId),
- });
- },
- delClient(dbInboundId,client) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- newDbInbound = new DBInbound(dbInbound);
- inbound = newDbInbound.toInbound();
- clients = this.getClients(dbInbound.protocol, inbound.settings);
- index = this.findIndexOfClient(clients, client);
- clients.splice(index, 1);
- const data = {
- id: dbInboundId,
- settings: inbound.settings.toString(),
- };
+ delInbound(dbInbound) {
this.$confirm({
title: '{{ i18n "pages.inbounds.deleteInbound"}}',
content: '{{ i18n "pages.inbounds.deleteInboundContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
okText: '{{ i18n "delete"}}',
cancelText: '{{ i18n "cancel"}}',
- onOk: () => this.submit('/xui/inbound/delClient/' + client.email, data),
+ onOk: () => this.submit('/xui/inbound/del/' + dbInbound.id),
});
},
- getClients(protocol, clientSettings) {
+ getClients(protocol, clientSettings) {
switch(protocol){
case Protocols.VMESS: return clientSettings.vmesses;
case Protocols.VLESS: return clientSettings.vlesses;
@@ -504,19 +404,18 @@
default: return null;
}
},
- showQrcode(dbInbound, clientIndex) {
+ showQrcode(dbInbound, clientIndex) {
const link = dbInbound.genLink(clientIndex);
qrModal.show('{{ i18n "qrCode"}}', link, dbInbound);
},
showInfo(dbInbound, index) {
infoModal.show(dbInbound, index);
},
- switchEnable(dbInboundId) {
- dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- this.submit(`/xui/inbound/update/${dbInboundId}`, dbInbound);
+ switchEnable(dbInbound) {
+ this.submit(`/xui/inbound/update/${dbInbound.id}`, dbInbound);
},
- async submit(url, data) {
- const msg = await HttpUtil.postWithModal(url, data);
+ async submit(url, data, modal) {
+ const msg = await HttpUtil.postWithModal(url, data, modal);
if (msg.success) {
await this.getDBInbounds();
}
@@ -530,15 +429,34 @@
return dbInbound.toInbound().settings.trojans
}
},
- resetClientTraffic(client,dbInboundId) {
+ resetClientTraffic(client,inbound,event) {
this.$confirm({
title: '{{ i18n "pages.inbounds.resetTraffic"}}',
content: '{{ i18n "pages.inbounds.resetTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
- onOk: () => this.submit('/xui/inbound/' + dbInboundId + '/resetClientTraffic/'+ client.email),
- })
+ onOk: () => {
+ this.resetClTraffic(client,inbound,event);
+ },
+ });
+ },
+ async resetClTraffic(client,inbound,event) {
+ const msg = await HttpUtil.post('/xui/inbound/resetClientTraffic/'+ client.email);
+ if (!msg.success) {
+ return;
+ }
+ clientStats = inbound.clientStats
+ if(clientStats.length > 0)
+ {
+ for (const key in clientStats) {
+ if (Object.hasOwnProperty.call(clientStats, key)) {
+ if(clientStats[key]['email'] == client.email){
+ clientStats[key]['up'] = 0
+ clientStats[key]['down'] = 0
+ }
+ }
+ }
+ }
},
isExpiry(dbInbound, index) {
return dbInbound.toInbound().isExpiry(index)
@@ -558,13 +476,6 @@
clientStats = dbInbound.clientStats.find(stats => stats.email === email)
return clientStats ? clientStats.down + clientStats.up > clientStats.total : false
},
- isClientEnabled(dbInbound, email) {
- clientStats = dbInbound.clientStats ? dbInbound.clientStats.find(stats => stats.email === email) : null
- return clientStats ? clientStats['enable'] : true
- },
- isRemovable(dbInbound_id){
- return this.getInboundClients(this.dbInbounds.find(row => row.id === dbInbound_id)).length > 1
- },
inboundLinks(dbInboundId) {
dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
txtModal.show('{{ i18n "pages.inbounds.export"}}',dbInbound.genInboundLinks,dbInbound.remark);
@@ -576,6 +487,10 @@
}
txtModal.show('{{ i18n "pages.inbounds.export"}}',copyText,'All-Inbounds');
},
+ isClientEnabled(dbInbound, email) {
+ clientStats = dbInbound.clientStats ? dbInbound.clientStats.find(stats => stats.email === email) : null
+ return clientStats ? clientStats['enable'] : true
+ },
},
watch: {
searchKey: debounce(function (newVal) {
@@ -588,7 +503,7 @@
computed: {
total() {
let down = 0, up = 0;
- let clients = 0, active = 0, deactive = 0;
+ let clients = 0, active = 0, deactive = 0;
this.dbInbounds.forEach(dbInbound => {
down += dbInbound.down;
up += dbInbound.up;
@@ -626,7 +541,5 @@
{{template "qrcodeModal"}}
{{template "textModal"}}
{{template "inboundInfoModal"}}
-{{template "clientsModal"}}
-{{template "clientsBulkModal"}}
</body>
-</html> \ No newline at end of file
+</html>