perf(admin): 实现切页即时导航与列表 loading 壳
非阻塞 session 刷新、侧边栏 chunk 预取、KeepAlive 对齐,以及按 tab 延迟加载重型列表页。
This commit is contained in:
@@ -1,5 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted, watch, reactive, h } from 'vue';
|
||||
defineOptions({ name: 'AgentPlayers' });
|
||||
|
||||
import { ref, computed, onMounted, onActivated, watch, reactive, h } from 'vue';
|
||||
import { useAdminLocale } from '../../composables/useAdminLocale';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import api from '../../api';
|
||||
@@ -288,22 +290,52 @@ const transferAmountCapError = computed(() => {
|
||||
onMounted(async () => {
|
||||
await loadProfile();
|
||||
await loadAgentOptions();
|
||||
await loadAllPlayers();
|
||||
if (canManageSubAgents.value) {
|
||||
const tab = activeViewTab.value;
|
||||
if (tab === 'players') {
|
||||
await loadAllPlayers();
|
||||
} else if (canManageSubAgents.value) {
|
||||
await reloadSubAgentTabs();
|
||||
const m = /^agentLevel-(\d+)$/.exec(tab);
|
||||
if (m) loadSubAgentsAtLevel(Number(m[1]));
|
||||
}
|
||||
});
|
||||
|
||||
onActivated(() => {
|
||||
const tab = activeViewTab.value;
|
||||
if (tab === 'players' && allPlayers.value.length > 0) void loadAllPlayers();
|
||||
else {
|
||||
const m = /^agentLevel-(\d+)$/.exec(tab);
|
||||
if (m) {
|
||||
const lvl = Number(m[1]);
|
||||
const st = subAgentLevelState[lvl];
|
||||
if (st?.agents.length) loadSubAgentsAtLevel(lvl);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
watch(activeViewTab, (tab) => {
|
||||
const m = /^agentLevel-(\d+)$/.exec(tab);
|
||||
if (m) loadSubAgentsAtLevel(Number(m[1]));
|
||||
if (m) {
|
||||
if (!subAgentLevelState[Number(m[1])]?.agents.length) {
|
||||
if (canManageSubAgents.value && !Object.keys(subAgentLevelState).length) {
|
||||
void reloadSubAgentTabs().then(() => loadSubAgentsAtLevel(Number(m[1])));
|
||||
} else {
|
||||
loadSubAgentsAtLevel(Number(m[1]));
|
||||
}
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (tab === 'players' && !allPlayers.value.length) void loadAllPlayers();
|
||||
});
|
||||
|
||||
watch(visibleSubAgentTabLevels, (levels, prev) => {
|
||||
for (const lvl of levels) {
|
||||
if (!prev?.includes(lvl) || !subAgentLevelState[lvl]?.agents.length) {
|
||||
loadSubAgentsAtLevel(lvl);
|
||||
}
|
||||
watch(visibleSubAgentTabLevels, (levels) => {
|
||||
const tab = activeViewTab.value;
|
||||
const m = /^agentLevel-(\d+)$/.exec(tab);
|
||||
if (!m) return;
|
||||
const activeLevel = Number(m[1]);
|
||||
if (levels.includes(activeLevel)) {
|
||||
const st = subAgentLevelState[activeLevel];
|
||||
if (!st?.agents.length) loadSubAgentsAtLevel(activeLevel);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user