style: 样式拆分.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a-spin :loading="loading" class="main-container">
|
||||
<div class="main-container">
|
||||
<span class="extra-message">
|
||||
<template v-if="user">
|
||||
只展示用户 <span class="user-info">{{ user.nickname }}({{ user.username }})</span> 最近登录的 30 条历史记录
|
||||
@@ -8,8 +8,14 @@
|
||||
只展示最近登录的 30 条历史记录
|
||||
</template>
|
||||
</span>
|
||||
<!-- 加载中 -->
|
||||
<a-skeleton v-if="loading"
|
||||
style="width: 70%;"
|
||||
:animation="true">
|
||||
<a-skeleton-line :rows="4" />
|
||||
</a-skeleton>
|
||||
<!-- 登录历史时间线 -->
|
||||
<a-timeline v-if="list.length">
|
||||
<a-timeline v-else-if="list.length">
|
||||
<a-timeline-item v-for="item in list"
|
||||
:key="item.id">
|
||||
<!-- 图标 -->
|
||||
@@ -41,16 +47,9 @@
|
||||
</div>
|
||||
</a-timeline-item>
|
||||
</a-timeline>
|
||||
<!-- 加载中 -->
|
||||
<a-space direction="vertical"
|
||||
v-else-if="loading"
|
||||
:style="{width: '70%'}"
|
||||
size="large">
|
||||
<a-skeleton-line :rows="4" />
|
||||
</a-space>
|
||||
<!-- 空 -->
|
||||
<a-empty v-else />
|
||||
</a-spin>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -64,7 +63,7 @@
|
||||
import type { LoginHistoryQueryResponse } from '@/api/user/operator-log';
|
||||
import type { PropType } from 'vue';
|
||||
import useLoading from '@/hooks/loading';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ref, onBeforeMount } from 'vue';
|
||||
import { ResultStatus } from '../types/const';
|
||||
import { getCurrentLoginHistory } from '@/api/user/mine';
|
||||
import { getLoginHistory } from '@/api/user/operator-log';
|
||||
@@ -80,7 +79,7 @@
|
||||
const { loading, setLoading } = useLoading();
|
||||
|
||||
// 查询操作日志
|
||||
onMounted(async () => {
|
||||
onBeforeMount(async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
if (props.user) {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a-spin :loading="loading" class="main-container">
|
||||
<div class="main-container">
|
||||
<span class="extra-message">
|
||||
<template v-if="user">
|
||||
用户 <span class="user-info">{{ user.nickname }}({{ user.username }})</span> 所有登录设备的会话列表
|
||||
@@ -8,8 +8,14 @@
|
||||
所有登录设备的会话列表
|
||||
</template>
|
||||
</span>
|
||||
<!-- 加载中 -->
|
||||
<a-skeleton v-if="loading"
|
||||
style="width: 70%;"
|
||||
:animation="true">
|
||||
<a-skeleton-line :rows="4" />
|
||||
</a-skeleton>
|
||||
<!-- 登录会话时间线 -->
|
||||
<a-timeline v-if="list.length">
|
||||
<a-timeline v-else-if="list.length">
|
||||
<template v-for="item in list"
|
||||
:key="item.loginTime">
|
||||
<a-timeline-item v-if="item.visible">
|
||||
@@ -48,16 +54,9 @@
|
||||
</a-timeline-item>
|
||||
</template>
|
||||
</a-timeline>
|
||||
<!-- 加载中 -->
|
||||
<a-space direction="vertical"
|
||||
v-else-if="loading"
|
||||
:style="{width: '70%'}"
|
||||
size="large">
|
||||
<a-skeleton-line :rows="4" />
|
||||
</a-space>
|
||||
<!-- 空 -->
|
||||
<a-empty v-else />
|
||||
</a-spin>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -71,7 +70,7 @@
|
||||
import type { UserSessionQueryResponse } from '@/api/user/user';
|
||||
import type { PropType } from 'vue';
|
||||
import useLoading from '@/hooks/loading';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ref, onBeforeMount } from 'vue';
|
||||
import { getCurrentUserSessionList, offlineCurrentUserSession } from '@/api/user/mine';
|
||||
import { dateFormat } from '@/utils';
|
||||
import { isMobile } from '@/utils/is';
|
||||
@@ -104,7 +103,7 @@
|
||||
};
|
||||
|
||||
// 查询登录会话
|
||||
onMounted(async () => {
|
||||
onBeforeMount(async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
let sessions: UserSessionQueryResponse[];
|
||||
|
||||
Reference in New Issue
Block a user