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
path: root/web/html/xui/inbounds.html
diff options
context:
space:
mode:
authorHo3ein <ho3ein.sanaei@gmail.com>2023-05-08 19:10:02 +0300
committerGitHub <noreply@github.com>2023-05-08 19:10:02 +0300
commit30a5f66f26164e1bcbdf9a0780a40bc56230e73c (patch)
tree749ce90b0895352639d2c45fa176a362b3105b32 /web/html/xui/inbounds.html
parent7bb3e517b2e279a52fb5627e011ea03fd91f648e (diff)
parentbb6e6861ca683894139c5307bd2d41f2e264fe00 (diff)
Merge pull request #381 from hamid-gh98/main
[FIX] bug logout path + [UPDATE] login UI and more ...
Diffstat (limited to 'web/html/xui/inbounds.html')
-rw-r--r--web/html/xui/inbounds.html138
1 files changed, 71 insertions, 67 deletions
diff --git a/web/html/xui/inbounds.html b/web/html/xui/inbounds.html
index a828a555..080a08cc 100644
--- a/web/html/xui/inbounds.html
+++ b/web/html/xui/inbounds.html
@@ -12,10 +12,11 @@
margin-top: 10px;
}
</style>
+
<body>
<a-layout id="app" v-cloak>
{{ template "commonSider" . }}
- <a-layout id="content-layout" :style="siderDrawer.isDarkTheme ? bgDarkStyle : ''">
+ <a-layout id="content-layout" :style="themeSwitcher.bgStyle">
<a-layout-content>
<a-spin :spinning="spinning" :delay="500" tip="loading">
<transition name="list" appear>
@@ -24,7 +25,7 @@
</a-tag>
</transition>
<transition name="list" appear>
- <a-card hoverable style="margin-bottom: 20px;" :class="siderDrawer.isDarkTheme ? darkClass : ''">
+ <a-card hoverable style="margin-bottom: 20px;" :class="themeSwitcher.darkCardClass">
<a-row>
<a-col :xs="24" :sm="24" :lg="12">
{{ i18n "pages.inbounds.totalDownUp" }}:
@@ -41,19 +42,19 @@
<a-col :xs="24" :sm="24" :lg="12">
{{ i18n "clients" }}:
<a-tag color="green">[[ total.clients ]]</a-tag>
- <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in total.deactive">[[ clientEmail ]]</p>
</template>
<a-tag v-if="total.deactive.length">[[ total.deactive.length ]]</a-tag>
</a-popover>
- <a-popover title='{{ i18n "depleted" }}' :overlay-class-name="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "depleted" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in total.depleted">[[ clientEmail ]]</p>
</template>
<a-tag color="red" v-if="total.depleted.length">[[ total.depleted.length ]]</a-tag>
</a-popover>
- <a-popover title='{{ i18n "depletingSoon" }}' :overlay-class-name="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "depletingSoon" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in total.expiring">[[ clientEmail ]]</p>
</template>
@@ -64,14 +65,14 @@
</a-card>
</transition>
<transition name="list" appear>
- <a-card hoverable :class="siderDrawer.isDarkTheme ? darkClass : ''">
+ <a-card hoverable :class="themeSwitcher.darkCardClass">
<div slot="title">
<a-row>
<a-col :xs="24" :sm="24" :lg="12">
<a-button type="primary" icon="plus" @click="openAddInbound">{{ i18n "pages.inbounds.addInbound" }}</a-button>
<a-dropdown :trigger="['click']">
<a-button type="primary" icon="menu">{{ i18n "pages.inbounds.generalActions" }}</a-button>
- <a-menu slot="overlay" @click="a => generalActions(a)" :theme="siderDrawer.theme">
+ <a-menu slot="overlay" @click="a => generalActions(a)" :theme="themeSwitcher.currentTheme">
<a-menu-item key="export">
<a-icon type="export"></a-icon>
{{ i18n "pages.inbounds.export" }}
@@ -96,7 +97,7 @@
style="width: 65px;"
v-if="isRefreshEnabled"
@change="changeRefreshInterval"
- :dropdown-class-name="siderDrawer.isDarkTheme ? 'ant-card-dark' : ''">
+ :dropdown-class-name="themeSwitcher.darkCardClass">
<a-select-option v-for="key in [5,10,30,60]" :value="key*1000">[[ key ]]s</a-select-option>
</a-select>
<a-icon type="sync" :spin="refreshing" @click="manualRefresh" style="margin: 0 5px;"></a-icon>
@@ -115,7 +116,7 @@
<a-icon type="edit" style="font-size: 22px" @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">
+ <a-menu slot="overlay" @click="a => clickAction(a, dbInbound)" :theme="themeSwitcher.currentTheme">
<a-menu-item key="edit">
<a-icon type="edit"></a-icon>
{{ i18n "edit" }}
@@ -174,19 +175,19 @@
<template slot="clients" slot-scope="text, dbInbound">
<template v-if="clientCount[dbInbound.id]">
<a-tag style="margin:0;" color="green">[[ clientCount[dbInbound.id].clients ]]</a-tag>
- <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "disabled" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in clientCount[dbInbound.id].deactive">[[ clientEmail ]]</p>
</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="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "depleted" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in clientCount[dbInbound.id].depleted">[[ clientEmail ]]</p>
</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="siderDrawer.isDarkTheme ? 'ant-dark' : ''">
+ <a-popover title='{{ i18n "depletingSoon" }}' :overlay-class-name="themeSwitcher.darkClass">
<template slot="content">
<p v-for="clientEmail in clientCount[dbInbound.id].expiring">[[ clientEmail ]]</p>
</template>
@@ -244,6 +245,7 @@
</a-layout>
</a-layout>
{{template "js" .}}
+{{template "component/themeSwitcher" .}}
<script>
const columns = [{
@@ -315,7 +317,7 @@
delimiters: ['[[', ']]'],
el: '#app',
data: {
- siderDrawer,
+ themeSwitcher,
spinning: false,
inbounds: [],
dbInbounds: [],
@@ -331,7 +333,7 @@
refreshInterval: Number(localStorage.getItem("refreshInterval")) || 5000,
},
methods: {
- loading(spinning=true) {
+ loading(spinning = true) {
this.spinning = spinning;
},
async getDBInbounds() {
@@ -361,29 +363,29 @@
to_inbound = dbInbound.toInbound()
this.inbounds.push(to_inbound);
this.dbInbounds.push(dbInbound);
- if([Protocols.VMESS, Protocols.VLESS, Protocols.TROJAN].includes(inbound.protocol) ){
- this.clientCount[inbound.id] = this.getClientCounts(inbound,to_inbound);
+ if ([Protocols.VMESS, Protocols.VLESS, Protocols.TROJAN].includes(inbound.protocol)) {
+ this.clientCount[inbound.id] = this.getClientCounts(inbound, to_inbound);
}
}
this.searchInbounds(this.searchKey);
},
- getClientCounts(dbInbound,inbound){
- let clientCount = 0,active = [], deactive = [], depleted = [], expiring = [];
+ getClientCounts(dbInbound, inbound) {
+ let clientCount = 0, active = [], deactive = [], depleted = [], expiring = [];
clients = this.getClients(dbInbound.protocol, inbound.settings);
clientStats = dbInbound.clientStats
now = new Date().getTime()
- if(clients){
+ if (clients) {
clientCount = clients.length;
- if(dbInbound.enable){
+ if (dbInbound.enable) {
clients.forEach(client => {
client.enable ? active.push(client.email) : deactive.push(client.email);
});
clientStats.forEach(client => {
- if(!client.enable) {
+ if (!client.enable) {
depleted.push(client.email);
} else {
- if ((client.expiryTime > 0 && (client.expiryTime-now < this.expireDiff)) ||
- (client.total > 0 && (client.total-(client.up+client.down) < this.trafficDiff ))) expiring.push(client.email);
+ if ((client.expiryTime > 0 && (client.expiryTime - now < this.expireDiff)) ||
+ (client.total > 0 && (client.total - (client.up + client.down) < this.trafficDiff))) expiring.push(client.email);
}
});
} else {
@@ -409,10 +411,10 @@
if (ObjectUtil.deepSearch(inbound, key)) {
const newInbound = new DBInbound(inbound);
const inboundSettings = JSON.parse(inbound.settings);
- if (inboundSettings.hasOwnProperty('clients')){
+ if (inboundSettings.hasOwnProperty('clients')) {
const searchedSettings = { "clients": [] };
inboundSettings.clients.forEach(client => {
- if (ObjectUtil.deepSearch(client, key)){
+ if (ObjectUtil.deepSearch(client, key)) {
searchedSettings.clients.push(client);
}
});
@@ -423,7 +425,7 @@
});
}
},
- generalActions(action){
+ generalActions(action) {
switch (action.key) {
case "export":
this.exportAllLinks();
@@ -476,7 +478,7 @@
break;
}
},
- openCloneInbound(dbInbound) {
+ openCloneInbound(dbInbound) {
this.$confirm({
title: '{{ i18n "pages.inbounds.cloneInbound"}} \"' + dbInbound.remark + '\"',
content: '{{ i18n "pages.inbounds.cloneInboundContent"}}',
@@ -621,21 +623,21 @@
isEdit: true
});
},
- findIndexOfClient(clients,client) {
+ findIndexOfClient(clients, client) {
firstKey = Object.keys(client)[0];
return clients.findIndex(c => c[firstKey] === client[firstKey]);
},
async addClient(clients, dbInboundId) {
const data = {
id: dbInboundId,
- settings: '{"clients": [' + clients.toString() +']}',
+ settings: '{"clients": [' + clients.toString() + ']}',
};
await this.submit(`/xui/inbound/addClient`, data);
},
async updateClient(client, dbInboundId, clientId) {
const data = {
id: dbInboundId,
- settings: '{"clients": [' + client.toString() +']}',
+ settings: '{"clients": [' + client.toString() + ']}',
};
await this.submit(`/xui/inbound/updateClient/${clientId}`, data);
},
@@ -644,7 +646,7 @@
this.$confirm({
title: '{{ i18n "pages.inbounds.resetTraffic"}}',
content: '{{ i18n "pages.inbounds.resetTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => {
@@ -659,26 +661,26 @@
this.$confirm({
title: '{{ i18n "pages.inbounds.deleteInbound"}}',
content: '{{ i18n "pages.inbounds.deleteInboundContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "delete"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => this.submit('/xui/inbound/del/' + dbInboundId),
});
},
- delClient(dbInboundId,client) {
+ delClient(dbInboundId, client) {
dbInbound = this.dbInbounds.find(row => row.id === dbInboundId);
- clientId = this.getClientId(dbInbound.protocol,client);
+ clientId = this.getClientId(dbInbound.protocol, client);
this.$confirm({
title: '{{ i18n "pages.inbounds.deleteInbound"}}',
content: '{{ i18n "pages.inbounds.deleteInboundContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "delete"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => this.submit(`/xui/inbound/${dbInboundId}/delClient/${clientId}`),
});
},
getClients(protocol, clientSettings) {
- switch(protocol){
+ switch (protocol) {
case Protocols.VMESS: return clientSettings.vmesses;
case Protocols.VLESS: return clientSettings.vlesses;
case Protocols.TROJAN: return clientSettings.trojans;
@@ -687,7 +689,7 @@
}
},
getClientId(protocol, client) {
- switch(protocol){
+ switch (protocol) {
case Protocols.TROJAN: return client.password;
case Protocols.SHADOWSOCKS: return client.email;
default: return client.id;
@@ -711,8 +713,8 @@
clients = this.getClients(dbInbound.protocol, inbound.settings);
index = this.findIndexOfClient(clients, client);
clients[index].enable = !clients[index].enable;
- clientId = this.getClientId(dbInbound.protocol,clients[index]);
- await this.updateClient(clients[index],dbInboundId, clientId);
+ clientId = this.getClientId(dbInbound.protocol, clients[index]);
+ await this.updateClient(clients[index], dbInboundId, clientId);
this.loading(false);
},
async submit(url, data) {
@@ -722,31 +724,31 @@
}
},
getInboundClients(dbInbound) {
- if(dbInbound.protocol == Protocols.VLESS) {
+ if (dbInbound.protocol == Protocols.VLESS) {
return dbInbound.toInbound().settings.vlesses;
- } else if(dbInbound.protocol == Protocols.VMESS) {
+ } else if (dbInbound.protocol == Protocols.VMESS) {
return dbInbound.toInbound().settings.vmesses;
- } else if(dbInbound.protocol == Protocols.TROJAN) {
+ } else if (dbInbound.protocol == Protocols.TROJAN) {
return dbInbound.toInbound().settings.trojans;
- } else if(dbInbound.protocol == Protocols.SHADOWSOCKS) {
+ } else if (dbInbound.protocol == Protocols.SHADOWSOCKS) {
return dbInbound.toInbound().settings.shadowsockses;
}
},
- resetClientTraffic(client,dbInboundId) {
+ resetClientTraffic(client, dbInboundId) {
this.$confirm({
title: '{{ i18n "pages.inbounds.resetTraffic"}}',
content: '{{ i18n "pages.inbounds.resetTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
- onOk: () => this.submit('/xui/inbound/' + dbInboundId + '/resetClientTraffic/'+ client.email),
+ onOk: () => this.submit('/xui/inbound/' + dbInboundId + '/resetClientTraffic/' + client.email),
})
},
resetAllTraffic() {
this.$confirm({
title: '{{ i18n "pages.inbounds.resetAllTrafficTitle"}}',
content: '{{ i18n "pages.inbounds.resetAllTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => this.submit('/xui/inbound/resetAllTraffics'),
@@ -754,9 +756,9 @@
},
resetAllClientTraffics(dbInboundId) {
this.$confirm({
- title: dbInboundId>0 ? '{{ i18n "pages.inbounds.resetInboundClientTrafficTitle"}}' : '{{ i18n "pages.inbounds.resetAllClientTrafficTitle"}}',
- content: dbInboundId>0 ? '{{ i18n "pages.inbounds.resetInboundClientTrafficContent"}}' : '{{ i18n "pages.inbounds.resetAllClientTrafficContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ title: dbInboundId > 0 ? '{{ i18n "pages.inbounds.resetInboundClientTrafficTitle"}}' : '{{ i18n "pages.inbounds.resetAllClientTrafficTitle"}}',
+ content: dbInboundId > 0 ? '{{ i18n "pages.inbounds.resetInboundClientTrafficContent"}}' : '{{ i18n "pages.inbounds.resetAllClientTrafficContent"}}',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => this.submit('/xui/inbound/resetAllClientTraffics/' + dbInboundId),
@@ -766,7 +768,7 @@
this.$confirm({
title: '{{ i18n "pages.inbounds.delDepletedClientsTitle"}}',
content: '{{ i18n "pages.inbounds.delDepletedClientsContent"}}',
- class: siderDrawer.isDarkTheme ? darkClass : '',
+ class: themeSwitcher.darkCardClass,
okText: '{{ i18n "reset"}}',
cancelText: '{{ i18n "cancel"}}',
onOk: () => this.submit('/xui/inbound/delDepletedClients/' + dbInboundId),
@@ -776,17 +778,17 @@
return dbInbound.toInbound().isExpiry(index)
},
getUpStats(dbInbound, email) {
- if(email.length == 0) return 0
+ if (email.length == 0) return 0
clientStats = dbInbound.clientStats.find(stats => stats.email === email)
return clientStats ? clientStats.up : 0
},
getDownStats(dbInbound, email) {
- if(email.length == 0) return 0
+ if (email.length == 0) return 0
clientStats = dbInbound.clientStats.find(stats => stats.email === email)
return clientStats ? clientStats.down : 0
},
isTrafficExhausted(dbInbound, email) {
- if(email.length == 0) return false
+ if (email.length == 0) return false
clientStats = dbInbound.clientStats.find(stats => stats.email === email)
return clientStats ? clientStats.down + clientStats.up > clientStats.total : false
},
@@ -794,28 +796,28 @@
clientStats = dbInbound.clientStats ? dbInbound.clientStats.find(stats => stats.email === email) : null
return clientStats ? clientStats['enable'] : true
},
- isRemovable(dbInbound_id){
+ 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);
+ txtModal.show('{{ i18n "pages.inbounds.export"}}', dbInbound.genInboundLinks, dbInbound.remark);
},
- exportAllLinks() {
+ exportAllLinks() {
let copyText = '';
for (const dbInbound of this.dbInbounds) {
copyText += dbInbound.genInboundLinks
}
- txtModal.show('{{ i18n "pages.inbounds.export"}}',copyText,'All-Inbounds');
+ txtModal.show('{{ i18n "pages.inbounds.export"}}', copyText, 'All-Inbounds');
},
async startDataRefreshLoop() {
while (this.isRefreshEnabled) {
- try {
- await this.getDBInbounds();
- } catch (e) {
- console.error(e);
- }
- await PromiseUtil.sleep(this.refreshInterval);
+ try {
+ await this.getDBInbounds();
+ } catch (e) {
+ console.error(e);
+ }
+ await PromiseUtil.sleep(this.refreshInterval);
}
},
toggleRefresh() {
@@ -824,11 +826,11 @@
this.startDataRefreshLoop();
}
},
- changeRefreshInterval(){
+ changeRefreshInterval() {
localStorage.setItem("refreshInterval", this.refreshInterval);
},
- async manualRefresh(){
- if(!this.refreshing){
+ async manualRefresh() {
+ if (!this.refreshing) {
this.spinning = true;
await this.getDBInbounds();
this.spinning = false;
@@ -876,6 +878,7 @@
}
},
});
+
</script>
{{template "inboundModal"}}
@@ -885,5 +888,6 @@
{{template "inboundInfoModal"}}
{{template "clientsModal"}}
{{template "clientsBulkModal"}}
+
</body>
</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2026-05-25 14:50:04 +0300