|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<headerBar title="首页" />
|
|
|
- <div class="home-container">
|
|
|
+ <div class="home-container" v-loading="loading">
|
|
|
<!-- 背景图片 -->
|
|
|
<img src="@/assets/images/home/bg.png" alt="背景图片" class="background-image" />
|
|
|
|
|
|
@@ -20,39 +20,59 @@
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
import headerBar from "@/components/header-bar/index.vue";
|
|
|
-import {useRouter} from "vue-router";
|
|
|
-import configInfo from '@/stores/modules/config';
|
|
|
+import { useRouter } from "vue-router";
|
|
|
+import configInfo from '@/stores/modules/config';
|
|
|
+import { ref, onMounted } from 'vue';
|
|
|
+import axios from 'axios';
|
|
|
+
|
|
|
const configInfoStore = configInfo();
|
|
|
-const router = useRouter()
|
|
|
+const router = useRouter();
|
|
|
+const loading = ref(true);
|
|
|
|
|
|
|
|
|
import socket from "@/stores/modules/socket";
|
|
|
// 初始化 WebSocket 状态管理
|
|
|
-const socketStore = socket()
|
|
|
+const socketStore = socket();
|
|
|
|
|
|
function socketConnect(){
|
|
|
- socketStore.connectSocket()
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-const goCheck = ()=>{
|
|
|
-
|
|
|
- configInfoStore.updateAppModel(1)
|
|
|
- router.push({
|
|
|
- name:'PhotographyCheck'
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-const goShot = ()=>{
|
|
|
- socketConnect()
|
|
|
- configInfoStore.updateAppModel(2)
|
|
|
- router.push({
|
|
|
- name:'PhotographyShot'
|
|
|
- })
|
|
|
+ socketStore.connectSocket();
|
|
|
}
|
|
|
|
|
|
+const goCheck = () => {
|
|
|
+ configInfoStore.updateAppModel(1);
|
|
|
+ router.push({
|
|
|
+ name: 'PhotographyCheck'
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const goShot = () => {
|
|
|
+ socketConnect();
|
|
|
+ configInfoStore.updateAppModel(2);
|
|
|
+ router.push({
|
|
|
+ name: 'PhotographyShot'
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+// 健康检查函数
|
|
|
+const checkHealth = async () => {
|
|
|
+ try {
|
|
|
+ const response = await axios.get('http://127.0.0.1:7074');
|
|
|
+ if (response.status === 200) {
|
|
|
+ loading.value = false; // 健康检查成功,关闭 loading
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('健康检查失败:', error);
|
|
|
+ setTimeout(() => {
|
|
|
+ checkHealth(); // 延迟检查
|
|
|
+ }, 2000);
|
|
|
+ // 可以在这里处理错误,例如显示错误提示
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 在组件挂载时执行健康检查
|
|
|
+onMounted(() => {
|
|
|
+ checkHealth();
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
|