github.com/e154/smart-home@v0.17.2-0.20240311175135-e530a6e5cd45/static_source/admin/src/views/Dashboard/main.vue (about) 1 <script setup lang="ts"> 2 import {nextTick, ref, watch} from "vue"; 3 import {ApiVariable} from "@/api/stub"; 4 import View from "@/views/Dashboard/view/view.vue"; 5 import api from "@/api/api"; 6 import {useAppStore} from "@/store/modules/app"; 7 8 const loading = ref(true) 9 const id = ref<Nullable<number>>(null) 10 11 // --------------------------------- 12 // common 13 // --------------------------------- 14 15 const reloadKey = ref(0); 16 const reload = () => { 17 reloadKey.value += 1 18 } 19 20 const appStore = useAppStore() 21 22 23 const fetchDashboard = async () => { 24 loading.value = true; 25 const res = await api.v1.variableServiceGetVariableByName('mainDashboard' + (appStore.isDark ? 'Dark' : 'Light')) 26 .catch(() => { 27 }) 28 .finally(() => { 29 loading.value = false 30 }) 31 32 if (!res) { 33 return; 34 } 35 36 const variable = res.data as ApiVariable 37 38 nextTick(() => { 39 id.value = parseInt(variable.value); 40 reload() 41 }) 42 43 loading.value = false; 44 } 45 46 47 watch( 48 () => appStore.isDark, 49 (val: boolean) => { 50 fetchDashboard() 51 }, 52 { 53 immediate: false 54 } 55 ) 56 57 fetchDashboard() 58 59 </script> 60 61 <template> 62 <View v-if="!loading && id" :id="id" :key="reloadKey"/> 63 </template> 64 65 <style lang="less" scoped> 66 67 </style>