diff options
| -rw-r--r-- | web/html/component/aClientTable.html | 14 | ||||
| -rw-r--r-- | web/html/inbounds.html | 14 | ||||
| -rw-r--r-- | web/html/modals/inbound_info_modal.html | 26 |
3 files changed, 34 insertions, 20 deletions
diff --git a/web/html/component/aClientTable.html b/web/html/component/aClientTable.html index 0626c334..0164161f 100644 --- a/web/html/component/aClientTable.html +++ b/web/html/component/aClientTable.html @@ -49,9 +49,9 @@ <a-space direction="horizontal" :size="2"> <a-tooltip> <template slot="title"> - <template v-if="isClientDepleted">{{ i18n "depleted" }}</template> - <template v-if="!isClientDepleted && !client.enable">{{ i18n "disabled" }}</template> - <template v-if="client.enable && isClientOnline(client.email)">{{ i18n "online" }}</template> + <template v-if="isClientDepleted(record, client.email)">{{ i18n "depleted" }}</template> + <template v-else-if="!client.enable">{{ i18n "disabled" }}</template> + <template v-else-if="client.enable && isClientOnline(client.email)">{{ i18n "online" }}</template> </template> <a-badge :class="isClientOnline(client.email)? 'online-animation' : ''" :color="client.enable ? statsExpColor(record, client.email) : themeSwitcher.isDarkTheme ? '#2c3950' : '#bcbcbc'"></a-badge> </a-tooltip> @@ -90,7 +90,7 @@ <a-progress :stroke-color="themeSwitcher.isDarkTheme ? 'rgb(72 84 105)' : '#bcbcbc'" :show-info="false" :percent="statsProgress(record, client.email)" /> </td> <td class="tr-table-bar" v-else-if="client.totalGB > 0"> - <a-progress :stroke-color="clientStatsColor(record, client.email)" :show-info="false" :status="isClientEnabled(record, client.email)? 'exception' : ''" :percent="statsProgress(record, client.email)" /> + <a-progress :stroke-color="clientStatsColor(record, client.email)" :show-info="false" :status="isClientDepleted(record, client.email)? 'exception' : ''" :percent="statsProgress(record, client.email)" /> </td> <td v-else class="infinite-bar tr-table-bar"> <a-progress :show-info="false" :percent="100"></a-progress> @@ -126,7 +126,7 @@ <tr class="tr-table-box"> <td class="tr-table-rt"> [[ remainedDays(client.expiryTime) ]] </td> <td class="infinite-bar tr-table-bar"> - <a-progress :show-info="false" :status="isClientEnabled(record, client.email)? 'exception' : ''" :percent="expireProgress(client.expiryTime, client.reset)" /> + <a-progress :show-info="false" :status="isClientDepleted(record, client.email)? 'exception' : ''" :percent="expireProgress(client.expiryTime, client.reset)" /> </td> <td class="tr-table-lt">[[ client.reset + "d" ]]</td> </tr> @@ -213,7 +213,7 @@ </tr> </table> </template> - <a-progress :stroke-color="clientStatsColor(record, client.email)" :show-info="false" :status="isClientEnabled(record, client.email)? 'exception' : ''" :percent="statsProgress(record, client.email)" /> + <a-progress :stroke-color="clientStatsColor(record, client.email)" :show-info="false" :status="isClientDepleted(record, client.email)? 'exception' : ''" :percent="statsProgress(record, client.email)" /> </a-popover> </td> <td width="120px" v-else class="infinite-bar"> @@ -247,7 +247,7 @@ </template> </span> </template> - <a-progress :show-info="false" :status="isClientEnabled(record, client.email)? 'exception' : ''" :percent="expireProgress(client.expiryTime, client.reset)" /> + <a-progress :show-info="false" :status="isClientDepleted(record, client.email)? 'exception' : ''" :percent="expireProgress(client.expiryTime, client.reset)" /> </a-popover> </td> <td width="60px">[[ client.reset + "d" ]]</td> diff --git a/web/html/inbounds.html b/web/html/inbounds.html index 5f17c98b..bea8e8d9 100644 --- a/web/html/inbounds.html +++ b/web/html/inbounds.html @@ -1434,15 +1434,19 @@ clientStats = dbInbound.clientStats ? dbInbound.clientStats.find(stats => stats.email === email) : null; return clientStats ? clientStats['enable'] : true; }, - // Returns true when client's traffic is exhausted or expiry time is passed isClientDepleted(dbInbound, email) { if (!email || !dbInbound || !dbInbound.clientStats) return false; const stats = dbInbound.clientStats.find(s => s.email === email); if (!stats) return false; - const now = new Date().getTime(); - const exhausted = stats.total > 0 && (stats.up + stats.down) >= stats.total; - const expired = stats.expiryTime > 0 && now >= stats.expiryTime; - return exhausted || expired; + const total = stats.total ?? 0; + const used = (stats.up ?? 0) + (stats.down ?? 0); + const hasTotal = total > 0; + const exhausted = hasTotal && used >= total; + const expiryTime = stats.expiryTime ?? 0; + const hasExpiry = expiryTime > 0; + const now = Date.now(); + const expired = hasExpiry && expiryTime <= now; + return expired || exhausted; }, isClientOnline(email) { return this.onlineClients.includes(email); diff --git a/web/html/modals/inbound_info_modal.html b/web/html/modals/inbound_info_modal.html index 55d9919c..25f43506 100644 --- a/web/html/modals/inbound_info_modal.html +++ b/web/html/modals/inbound_info_modal.html @@ -180,9 +180,9 @@ <tr> <td>{{ i18n "status" }}</td> <td> - <a-tag v-if="isEnable && isActive && !isDepleted" color="green">{{ i18n "enabled" }}</a-tag> - <a-tag v-if="!isEnable && !isDepleted">{{ i18n "disabled" }}</a-tag> <a-tag v-if="isDepleted" color="red">{{ i18n "depleted" }}</a-tag> + <a-tag v-else-if="isEnable" color="green">{{ i18n "enabled" }}</a-tag> + <a-tag v-else>{{ i18n "disabled" }}</a-tag> </td> </tr> <tr v-if="infoModal.clientStats"> @@ -524,7 +524,7 @@ this.dbInbound = new DBInbound(dbInbound); this.clientSettings = this.inbound.clients ? this.inbound.clients[index] : null; this.isExpired = this.inbound.clients ? this.inbound.isExpiry(index) : this.dbInbound.isExpiry; - this.clientStats = this.inbound.clients ? this.dbInbound.clientStats.find(row => row.email === this.clientSettings.email) : []; + this.clientStats = this.inbound.clients ? (this.dbInbound.clientStats.find(row => row.email === this.clientSettings.email) || null) : null; if ( [ @@ -588,11 +588,21 @@ return infoModal.dbInbound.isEnable; }, get isDepleted() { - const stats = this.infoModal.clientStats; - if (!stats) return false; - const now = new Date().getTime(); - const expired = stats.expiryTime > 0 && now >= stats.expiryTime; - const exhausted = stats.total > 0 && (stats.up + stats.down) >= stats.total; + const stats = infoModal.clientStats; + const settings = infoModal.clientSettings; + if (!stats || !settings) { + return false; + } + const total = stats.total ?? 0; + const used = (stats.up ?? 0) + (stats.down ?? 0); + const hasTotal = total > 0; + const exhausted = hasTotal && used >= total; + + const expiryTime = settings.expiryTime ?? 0; + const hasExpiry = expiryTime > 0; + const now = Date.now(); + const expired = hasExpiry && now >= expiryTime; + return expired || exhausted; }, }, |