mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-05-12 02:21:06 +08:00
fix dashboard
This commit is contained in:
@@ -5,6 +5,9 @@ import { ScheduleInfo } from "@/api/types";
|
||||
// 定时服务列表
|
||||
const schedulerList = ref<ScheduleInfo[]>([]);
|
||||
|
||||
// 定时器
|
||||
let refreshTimer: NodeJS.Timer | null = null;
|
||||
|
||||
// 调用API加载定时服务列表
|
||||
const loadSchedulerList = async () => {
|
||||
try {
|
||||
@@ -17,6 +20,18 @@ const loadSchedulerList = async () => {
|
||||
|
||||
onMounted(() => {
|
||||
loadSchedulerList();
|
||||
// 启动定时器
|
||||
refreshTimer = setInterval(() => {
|
||||
loadSchedulerList();
|
||||
}, 60000);
|
||||
});
|
||||
|
||||
// 组件卸载时停止定时器
|
||||
onUnmounted(() => {
|
||||
if (refreshTimer) {
|
||||
clearInterval(refreshTimer);
|
||||
refreshTimer = null;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -36,12 +36,12 @@ const loadDownloaderInfo = async () => {
|
||||
downloadInfo.value = res;
|
||||
infoItems.value = [
|
||||
{
|
||||
avatar: "mdi-upload",
|
||||
avatar: "mdi-cloud-upload",
|
||||
title: "总上传量",
|
||||
amount: formatFileSize(res.upload_size),
|
||||
},
|
||||
{
|
||||
avatar: "mdi-download",
|
||||
avatar: "mdi-download-box",
|
||||
title: "总下载量",
|
||||
amount: formatFileSize(res.download_size),
|
||||
},
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import api from "@/api";
|
||||
import { hexToRgb } from "@layouts/utils";
|
||||
import VueApexCharts from "vue3-apexcharts";
|
||||
import { useTheme } from "vuetify";
|
||||
@@ -86,7 +87,25 @@ const options = controlledComputed(
|
||||
}
|
||||
);
|
||||
|
||||
const series = [{ data: [37, 57, 45, 75, 57, 40, 65] }];
|
||||
// 图表数据
|
||||
const series = ref([{ data: [37, 57, 45, 75, 57, 40, 65] }]);
|
||||
|
||||
// 总数
|
||||
const totalCount = computed(() => series.value[0].data.reduce((a, b) => a + b, 0));
|
||||
|
||||
// 调用API接口获取数据近7天数据
|
||||
const getWeeklyData = async () => {
|
||||
try {
|
||||
const res: number[] = await api.get("dashboard/transfer");
|
||||
series.value = [{ data: res }];
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getWeeklyData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -105,8 +124,8 @@ const series = [{ data: [37, 57, 45, 75, 57, 40, 65] }];
|
||||
<VueApexCharts type="bar" :options="options" :series="series" :height="220" />
|
||||
|
||||
<div class="d-flex align-center mb-3">
|
||||
<h5 class="text-h5 me-4">45</h5>
|
||||
<p>最近一周入库了 45 部影片 😎</p>
|
||||
<h5 class="text-h5 me-4">{{ totalCount }}</h5>
|
||||
<p>最近一周入库了 {{ totalCount }} 部影片 😎</p>
|
||||
</div>
|
||||
|
||||
<VBtn block to="/history"> 查看详情 </VBtn>
|
||||
|
||||
Reference in New Issue
Block a user