fix ApexCharts

This commit is contained in:
jxxghp
2025-01-19 14:31:51 +08:00
parent 615ce34a72
commit d523790c0f
7 changed files with 83 additions and 57 deletions
+53 -49
View File
@@ -132,59 +132,63 @@ onBeforeMount(() => {
<VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false"> <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
<VWindowItem value="download"> <VWindowItem value="download">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<VDataTable <div>
items-per-page="50" <VDataTable
:headers="downloadHeaders" items-per-page="50"
:items="downloadInfos" :headers="downloadHeaders"
:items-length="totalCount" :items="downloadInfos"
density="compact" :items-length="totalCount"
item-value="title" density="compact"
return-object item-value="title"
fixed-header return-object
hover fixed-header
items-per-page-text="每页条数" hover
page-text="{0}-{1} {2} " items-per-page-text="每页条数"
loading-text="加载中..." page-text="{0}-{1} {2} "
> loading-text="加载中..."
<template #item.episode_number="{ item }"> >
<div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div> <template #item.episode_number="{ item }">
</template> <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
<template #item.torrent_title="{ item }"> </template>
<div class="text-xs" v-for="file in item.download"> <template #item.torrent_title="{ item }">
{{ file.site_name }}{{ file.torrent_title }} <div class="text-xs" v-for="file in item.download">
</div> {{ file.site_name }}{{ file.torrent_title }}
</template> </div>
<template #item.file_path="{ item }"> </template>
<div class="text-xs" v-for="file in item.download">{{ file.file_path }}</div> <template #item.file_path="{ item }">
</template> <div class="text-xs" v-for="file in item.download">{{ file.file_path }}</div>
<template #no-data> 没有数据 </template> </template>
</VDataTable> <template #no-data> 没有数据 </template>
</VDataTable>
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
<VWindowItem value="library"> <VWindowItem value="library">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<VDataTable <div>
items-per-page="50" <VDataTable
:headers="libraryHeaders" items-per-page="50"
:items="libraryInfos" :headers="libraryHeaders"
:items-length="totalCount" :items="libraryInfos"
density="compact" :items-length="totalCount"
item-value="title" density="compact"
return-object item-value="title"
fixed-header return-object
hover fixed-header
items-per-page-text="每页条数" hover
page-text="{0}-{1} {2} " items-per-page-text="每页条数"
loading-text="加载中..." page-text="{0}-{1} {2} "
> loading-text="加载中..."
<template #item.episode_number="{ item }"> >
<div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div> <template #item.episode_number="{ item }">
</template> <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
<template #item.file_path="{ item }"> </template>
<div class="text-xs" v-for="file in item.library">{{ file.file_path }}</div> <template #item.file_path="{ item }">
</template> <div class="text-xs" v-for="file in item.library">{{ file.file_path }}</div>
<template #no-data> 没有数据 </template> </template>
</VDataTable> <template #no-data> 没有数据 </template>
</VDataTable>
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
</VWindow> </VWindow>
+3 -1
View File
@@ -42,7 +42,9 @@ onMounted(async () => {
<VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false"> <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
<VWindowItem v-for="item in downloaders" :value="item.name"> <VWindowItem v-for="item in downloaders" :value="item.name">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<DownloadingListView :name="item.name" /> <div>
<DownloadingListView :name="item.name" />
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
</VWindow> </VWindow>
+3 -1
View File
@@ -70,7 +70,9 @@ function jumpTab(tab: string) {
<!-- 规则 --> <!-- 规则 -->
<VWindowItem value="rule"> <VWindowItem value="rule">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<AccountSettingRule /> <div>
<AccountSettingRule />
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
+9 -3
View File
@@ -30,17 +30,23 @@ function jumpTab(tab: string) {
<VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false"> <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
<VWindowItem value="mysub"> <VWindowItem value="mysub">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<SubscribeListView :type="subType" :subid="subId" /> <div>
<SubscribeListView :type="subType" :subid="subId" />
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
<VWindowItem value="popular"> <VWindowItem value="popular">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<SubscribePopularView :type="subType" /> <div>
<SubscribePopularView :type="subType" />
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
<VWindowItem value="share"> <VWindowItem value="share">
<transition name="fade-slide" appear> <transition name="fade-slide" appear>
<SubscribeShareView /> <div>
<SubscribeShareView />
</div>
</transition> </transition>
</VWindowItem> </VWindowItem>
</VWindow> </VWindow>
+7 -1
View File
@@ -23,6 +23,8 @@ const variableTheme = controlledComputed(
() => vuetifyTheme.current.value.variables, () => vuetifyTheme.current.value.variables,
) )
const chartKey = ref(0)
// 定时器 // 定时器
let refreshTimer: NodeJS.Timeout | null = null let refreshTimer: NodeJS.Timeout | null = null
@@ -129,6 +131,10 @@ onUnmounted(() => {
refreshTimer = null refreshTimer = null
} }
}) })
onActivated(() => {
chartKey.value += 1
})
</script> </script>
<template> <template>
@@ -142,7 +148,7 @@ onUnmounted(() => {
<VCardTitle>CPU</VCardTitle> <VCardTitle>CPU</VCardTitle>
</VCardItem> </VCardItem>
<VCardText> <VCardText>
<VApexChart type="line" :options="chartOptions" :series="series" :height="150" /> <VApexChart :key="chartKey" type="line" :options="chartOptions" :series="series" :height="150" />
<p class="text-center font-weight-medium mb-0">当前{{ current }}%</p> <p class="text-center font-weight-medium mb-0">当前{{ current }}%</p>
</VCardText> </VCardText>
</VCard> </VCard>
+7 -1
View File
@@ -24,6 +24,8 @@ const variableTheme = controlledComputed(
() => vuetifyTheme.current.value.variables, () => vuetifyTheme.current.value.variables,
) )
const chartKey = ref(0)
// 定时器 // 定时器
let refreshTimer: NodeJS.Timeout | null = null let refreshTimer: NodeJS.Timeout | null = null
@@ -135,6 +137,10 @@ onUnmounted(() => {
refreshTimer = null refreshTimer = null
} }
}) })
onActivated(() => {
chartKey.value += 1
})
</script> </script>
<template> <template>
@@ -148,7 +154,7 @@ onUnmounted(() => {
<VCardTitle>内存</VCardTitle> <VCardTitle>内存</VCardTitle>
</VCardItem> </VCardItem>
<VCardText> <VCardText>
<VApexChart type="area" :options="chartOptions" :series="series" :height="150" /> <VApexChart :key="chartKey" type="area" :options="chartOptions" :series="series" :height="150" />
<p class="text-center font-weight-medium mb-0">当前{{ formatBytes(usedMemory) }}</p> <p class="text-center font-weight-medium mb-0">当前{{ formatBytes(usedMemory) }}</p>
</VCardText> </VCardText>
</VCard> </VCard>