From 5ef8a5a37ec7e6b7df710fa61b0324ab5a6617ab Mon Sep 17 00:00:00 2001
From: MHSanaei <33454419+MHSanaei@users.noreply.github.com>
Date: Thu, 23 Mar 2023 23:22:50 +0330
Subject: old design
---
web/html/xui/inbounds.html | 245 +++++++++++++++------------------------------
1 file changed, 79 insertions(+), 166 deletions(-)
(limited to 'web/html/xui/inbounds.html')
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);
- }
@@ -31,15 +27,15 @@
- {{ i18n "pages.inbounds.totalDownUp" }}:
+ {{ i18n "pages.inbounds.totalDownUp" }}:
[[ sizeFormat(total.up) ]] / [[ sizeFormat(total.down) ]]
- {{ i18n "pages.inbounds.totalUsage" }}:
+ {{ i18n "pages.inbounds.totalUsage" }}:
[[ sizeFormat(total.up + total.down) ]]
- {{ i18n "pages.inbounds.inboundCount" }}:
+ {{ i18n "pages.inbounds.inboundCount" }}:
[[ dbInbounds.length ]]
@@ -54,10 +50,10 @@
-
{{ i18n "pages.inbounds.addInbound" }}
-
{{ i18n "pages.inbounds.export" }}
+
Add Inbound
+
Export Links
-
+
- e.preventDefault()">{{ i18n "pages.inbounds.operate" }}
- clickAction(a, dbInbound)" :theme="siderDrawer.theme" style="border: 1px solid rgba(255, 255, 255, 0.65);">
+ e.preventDefault()">{{ i18n "pages.inbounds.operate" }}
+ clickAction(a, dbInbound)">
{{ i18n "qrCode" }}
@@ -77,26 +73,12 @@
{{ i18n "edit" }}
-
-
-
- {{ i18n "pages.client.add"}}
-
-
-
- {{ i18n "pages.client.bulk"}}
-
+
{{ i18n "pages.inbounds.export"}}
-
-
-
- {{ i18n "info"}}
-
-
{{ i18n "pages.inbounds.resetTraffic" }}
@@ -128,7 +110,7 @@
{{ i18n "none" }}
-
+
@@ -149,7 +131,7 @@
:data-source="getInboundClients(record)"
:pagination="false"
>
- {{template "client_table"}}
+ {{template "client_row"}}
- {{template "client_table"}}
+ {{template "client_row"}}
+
+
+ {{template "client_row"}}
@@ -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"}}
-