[ui] remove online animation

Co-Authored-By: Alireza Ahmadi <alireza7@gmail.com>
This commit is contained in:
MHSanaei 2024-03-13 00:11:04 +03:30
parent b042f01e58
commit e7ae846823
2 changed files with 6 additions and 15 deletions

View File

@ -19,7 +19,7 @@
:overlay-class-name="themeSwitcher.currentTheme" :overlay-class-name="themeSwitcher.currentTheme"
ok-text='{{ i18n "reset"}}' ok-text='{{ i18n "reset"}}'
cancel-text='{{ i18n "cancel"}}'> cancel-text='{{ i18n "cancel"}}'>
<a-icon slot="icon" type="question-circle-o" :style="themeSwitcher.isDarkTheme ? 'color: #008771' : 'color: #008771'"></a-icon> <a-icon slot="icon" type="question-circle-o" :style="themeSwitcher.isDarkTheme ? 'color: #3c89e8' : 'color: blue'"></a-icon>
<a-icon style="font-size: 24px; cursor: pointer;" class="normal-icon" type="retweet" v-if="client.email.length > 0"></a-icon> <a-icon style="font-size: 24px; cursor: pointer;" class="normal-icon" type="retweet" v-if="client.email.length > 0"></a-icon>
</a-popconfirm> </a-popconfirm>
</a-tooltip> </a-tooltip>
@ -54,7 +54,7 @@
<template v-else-if="!client.enable">{{ i18n "disabled" }}</template> <template v-else-if="!client.enable">{{ i18n "disabled" }}</template>
<template v-else-if="client.enable && isClientOnline(client.email)">{{ i18n "online" }}</template> <template v-else-if="client.enable && isClientOnline(client.email)">{{ i18n "online" }}</template>
</template> </template>
<a-badge :class="isClientOnline(client.email)? 'online-animation' : ''" :color="client.enable ? statsExpColor(record, client.email) : themeSwitcher.isDarkTheme ? '#2c3950' : '#bcbcbc'"> <a-badge :color="client.enable ? statsExpColor(record, client.email) : themeSwitcher.isDarkTheme ? '#2c3950' : '#bcbcbc'">
</a-badge> </a-badge>
</a-tooltip> </a-tooltip>
[[ client.email ]] [[ client.email ]]
@ -86,13 +86,12 @@
<td width="120px" v-else-if="client.totalGB > 0"> <td width="120px" v-else-if="client.totalGB > 0">
<a-progress :stroke-color="clientStatsColor(record, client.email)" <a-progress :stroke-color="clientStatsColor(record, client.email)"
:show-info="false" :show-info="false"
:status="isClientOnline(client.email)? 'active' : isClientEnabled(record, client.email)? 'exception' : ''" :status="isClientEnabled(record, client.email)? 'exception' : ''"
:percent="statsProgress(record, client.email)"/> :percent="statsProgress(record, client.email)"/>
</td> </td>
<td width="120px" v-else class="infinite-bar"> <td width="120px" v-else class="infinite-bar">
<a-progress <a-progress
:show-info="false" :show-info="false"
:status="isClientOnline(client.email)? 'active' : ''"
:percent="100"></a-progress> :percent="100"></a-progress>
</td> </td>
<td width="60px"> <td width="60px">
@ -117,7 +116,7 @@
</td> </td>
<td width="120px" class="infinite-bar"> <td width="120px" class="infinite-bar">
<a-progress :show-info="false" <a-progress :show-info="false"
:status="isClientOnline(client.email)? 'active' : isClientEnabled(record, client.email)? 'exception' : ''" :status="isClientEnabled(record, client.email)? 'exception' : ''"
:percent="expireProgress(client.expiryTime, client.reset)"/> :percent="expireProgress(client.expiryTime, client.reset)"/>
</td> </td>
<td width="60px">[[ client.reset + "d" ]]</td> <td width="60px">[[ client.reset + "d" ]]</td>
@ -202,14 +201,13 @@
</template> </template>
<a-progress :stroke-color="clientStatsColor(record, client.email)" <a-progress :stroke-color="clientStatsColor(record, client.email)"
:show-info="false" :show-info="false"
:status="isClientOnline(client.email)? 'active' : isClientEnabled(record, client.email)? 'exception' : ''" :status="isClientEnabled(record, client.email)? 'exception' : ''"
:percent="statsProgress(record, client.email)"/> :percent="statsProgress(record, client.email)"/>
</a-popover> </a-popover>
</td> </td>
<td width="120px" v-else class="infinite-bar"> <td width="120px" v-else class="infinite-bar">
<a-progress :stroke-color="themeSwitcher.isDarkTheme ? '#2c1e32':'#F2EAF1'" <a-progress :stroke-color="themeSwitcher.isDarkTheme ? '#2c1e32':'#F2EAF1'"
:show-info="false" :show-info="false"
:status="isClientOnline(client.email)? 'active' : ''"
:percent="100"></a-progress> :percent="100"></a-progress>
</td> </td>
<td width="80px"> <td width="80px">
@ -235,7 +233,7 @@
<span v-else>[[ DateUtil.formatMillis(client._expiryTime) ]]</span> <span v-else>[[ DateUtil.formatMillis(client._expiryTime) ]]</span>
</template> </template>
<a-progress :show-info="false" <a-progress :show-info="false"
:status="isClientOnline(client.email)? 'active' : isClientEnabled(record, client.email)? 'exception' : ''" :status="isClientEnabled(record, client.email)? 'exception' : ''"
:percent="expireProgress(client.expiryTime, client.reset)"/> :percent="expireProgress(client.expiryTime, client.reset)"/>
</a-popover> </a-popover>
</td> </td>

View File

@ -36,13 +36,6 @@
.ant-collapse { .ant-collapse {
margin: 5px 0; margin: 5px 0;
} }
.online-animation .ant-badge-status-dot {
animation: 1.2s ease infinite normal none running onlineAnimation;
}
@keyframes onlineAnimation {
0%, 50%, 100% { transform: scale(1); opacity: 1; }
10% { transform: scale(1.5); opacity: .2; }
}
.info-large-tag { .info-large-tag {
max-width: 200px; max-width: 200px;
overflow: hidden; overflow: hidden;