fix: 看板通话时长格式化hms

This commit is contained in:
TsMask
2024-01-30 18:25:43 +08:00
parent acf4a946e8
commit ba8bd5c015
2 changed files with 51 additions and 20 deletions

View File

@@ -80,10 +80,10 @@ export function diffValue(
*/
export function parseDuration(seconds: number | string) {
seconds = Number(seconds) || 0;
const duration = dayjs().startOf('day').subtract(seconds, 'seconds');
const secondsLeft = duration.format('s');
const minutes = duration.format('m');
const hours = duration.format('H');
const duration = new Date(seconds * 1000);
const hours = duration.getUTCHours();
const minutes = duration.getUTCMinutes();
const secondsLeft = duration.getUTCSeconds();
if (+hours > 0) {
return `${hours}h${minutes}m${secondsLeft}s`;
}

View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { parseDuration } from '@/utils/date-utils';
import { parseDuration, parseDateToStr } from '@/utils/date-utils';
import { eventData, eventId } from '../../hooks/useUserActivity';
import useI18n from '@/hooks/useI18n';
const { t } = useI18n();
@@ -8,6 +8,7 @@ const { t } = useI18n();
<template>
<div class="activty">
<template v-for="item in eventData" :key="item.eId">
<!-- CDR事件 -->
<div
class="card-cdr"
:class="{ active: item.eId === eventId }"
@@ -15,29 +16,34 @@ const { t } = useI18n();
>
<div class="card-cdr-item">
<div>
{{ t('views.dashboard.overview.userActivity.type') }}:
{{ t('views.dashboard.overview.userActivity.type') }}:
<span>{{ item.data.callType }}</span>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.duration') }}:
{{ t('views.dashboard.overview.userActivity.duration') }}:
<span>{{ parseDuration(item.data.callDuration) }}</span>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.time') }}:
<span>{{ parseDateToStr(item.data.releaseTime * 1000) }}</span>
</div>
</div>
<div class="card-cdr-item">
<div>
{{ t('views.dashboard.overview.userActivity.caller') }}:
{{ t('views.dashboard.overview.userActivity.caller') }}:
<span>{{ item.data.callerParty }}</span>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.called') }}:
{{ t('views.dashboard.overview.userActivity.called') }}:
<span>{{ item.data.calledParty }}</span>
</div>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.result') }}:
<span>{{ item.data.cause }}</span>
<div>
{{ t('views.dashboard.overview.userActivity.result') }}:
<span>{{ item.data.cause }}</span>
</div>
</div>
</div>
<!-- UE事件 -->
<div
class="card-ue"
:class="{ active: item.eId === eventId }"
@@ -45,11 +51,14 @@ const { t } = useI18n();
>
<div class="card-ue-item">
<div>
{{ t('views.dashboard.overview.userActivity.type') }}:
{{ t('views.dashboard.overview.userActivity.type') }}:
<span>{{ item.type }}</span>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.time') }}:
IMSI: <span>{{ item.data.imei }}</span>
</div>
<div>
{{ t('views.dashboard.overview.userActivity.time') }}:
<span v-if="item.type === 'auth-result'">
{{ item.data.authTime }}
</span>
@@ -61,8 +70,8 @@ const { t } = useI18n();
</span>
</div>
</div>
<div>IMSI: <span>{{ item.data.imei }}</span></div>
<div class="card-ue-auth" v-if="item.type === 'auth-result'">
<div class="card-ue-w33" v-if="item.type === 'auth-result'">
<div>
GNB ID: <span>{{ item.data.gNBID }}</span>
</div>
@@ -70,7 +79,29 @@ const { t } = useI18n();
Cell ID: <span>{{ item.data.cellID }}</span>
</div>
<div>
Tac ID: <span>{{ item.data.tacID }}</span>
TAC ID: <span>{{ item.data.tacID }}</span>
</div>
</div>
<div class="card-ue-w33" v-if="item.type === 'auth-result'">
<div>
Code: <span>{{ item.data.authCode }}</span>
</div>
<div>
OnlineNumber: <span>{{ item.data.onlineNumber }}</span>
</div>
</div>
<div v-if="item.type === 'auth-result'">
Message: <span>{{ item.data.authMessage }}</span>
</div>
<div v-if="item.type === 'detach'">
Message: <span>{{ item.data.detachResult }}</span>
</div>
<div class="card-ue-w33" v-if="item.type === 'cm-state'">
<div>
Status: <span>{{ item.data.status }}</span>
</div>
<div>
OnlineNumber: <span>{{ item.data.onlineNumber }}</span>
</div>
</div>
</div>
@@ -186,7 +217,7 @@ const { t } = useI18n();
width: 50%;
}
}
&-auth {
&-w33 {
display: flex;
flex-direction: row;
justify-content: flex-start;
@@ -211,7 +242,7 @@ const { t } = useI18n();
flex-direction: row;
justify-content: flex-start;
& > div {
width: 50%;
flex: 1;
}
}
}