From 007da526216562a1c17982048b4e13136c097714 Mon Sep 17 00:00:00 2001
From: wzy-warehouse <18135009705@163.com>
Date: Thu, 16 Apr 2026 09:42:21 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=AD=E8=A3=82=E5=B8=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/component/earthquake/FaultComponent.vue  | 27 ++++++++++++
 src/stores/useStatusStore.ts                 |  2 +
 src/views/home/earthquake/EarthquakeView.vue | 43 +++++---------------
 3 files changed, 39 insertions(+), 33 deletions(-)
 create mode 100644 src/component/earthquake/FaultComponent.vue

diff --git a/src/component/earthquake/FaultComponent.vue b/src/component/earthquake/FaultComponent.vue
new file mode 100644
index 0000000..1cf26be
--- /dev/null
+++ b/src/component/earthquake/FaultComponent.vue
@@ -0,0 +1,27 @@
+<!-- 加载断层组件 -->
+<template>
+  <div></div>
+</template>
+<script setup lang="ts">
+  import { xianFaultData } from '@/assets';
+  import { CesiumUtilsSingleton } from '@/utils/cesium/CesiumUtils';
+  import { Color } from 'cesium';
+  import { onMounted } from 'vue';
+
+  onMounted(() => {
+    CesiumUtilsSingleton.addGeoJsonLayer(
+      'xian-earthque-fault-data',
+      xianFaultData,
+      {
+        showName: false,
+        isDefault: true,
+        polylineStyle: {
+          width: 2,
+          material: Color.RED,
+          clampToGround: true,
+        },
+      }
+    );
+  });
+</script>
+<style scoped lang="less"></style>
diff --git a/src/stores/useStatusStore.ts b/src/stores/useStatusStore.ts
index e40f72f..1bd8d99 100644
--- a/src/stores/useStatusStore.ts
+++ b/src/stores/useStatusStore.ts
@@ -37,6 +37,8 @@ export const useStatusStore = defineStore('status', () => {
     hiddenDangerPointShow: true,
     /** 风险点显示状态 */
     riskPointShow: true,
+    /** 断裂带显示状态 */
+    faultShow: true,
   });
 
   /**
diff --git a/src/views/home/earthquake/EarthquakeView.vue b/src/views/home/earthquake/EarthquakeView.vue
index ebc75bd..16db611 100644
--- a/src/views/home/earthquake/EarthquakeView.vue
+++ b/src/views/home/earthquake/EarthquakeView.vue
@@ -6,6 +6,14 @@
       :key="route.fullPath"
     />
 
+    <!-- 断裂带 -->
+    <FaultComponent
+      v-if="
+        useStatusStore().appLoadingCompleted &&
+        useStatusStore().mapLayers.faultShow
+      "
+    />
+
     <!-- 灾害链影响列表组件 -->
     <DisasterChainPointComponent
       :select-options="selectOptions"
@@ -31,7 +39,7 @@
 </template>
 
 <script setup lang="ts">
-  import { xianFaultData } from '@/assets';
+  import FaultComponent from '@/component/earthquake/FaultComponent.vue';
   import BasicComponent from '@/component/rain-earthquake/BasicComponent.vue';
   import ControlShowComponent from '@/component/rain-earthquake/ControlShowComponent.vue';
   import DisasterChainPointComponent from '@/component/rain-earthquake/DisasterChainPointComponent.vue';
@@ -41,9 +49,7 @@
   import { useEarthquakeDisasterChain } from '@/hooks/earthquake/useEarthquakeDisasterChain';
   import { useStatusStore } from '@/stores/useStatusStore';
   import { DisasterType } from '@/types/common/DisasterType.ts';
-  import { CesiumUtilsSingleton } from '@/utils/cesium/CesiumUtils';
-  import { Color } from 'cesium';
-  import { onMounted, watch } from 'vue';
+  import { watch } from 'vue';
   import { useRoute } from 'vue-router';
 
   const route = useRoute();
@@ -62,35 +68,6 @@
     changeCurrentPage,
   } = useEarthquakeDisasterChain();
 
-  /**
-   * 组件挂载
-   */
-  onMounted(() => {
-    /**
-     * 加载西安断层数据
-     */
-    watch(
-      () => useStatusStore().appLoadingCompleted,
-      (newStatue: boolean) => {
-        if (newStatue) {
-          CesiumUtilsSingleton.addGeoJsonLayer(
-            'xian-earthque-fault-data',
-            xianFaultData,
-            {
-              showName: false,
-              isDefault: true,
-              polylineStyle: {
-                width: 2,
-                material: Color.RED,
-                clampToGround: true,
-              },
-            }
-          );
-        }
-      }
-    );
-  });
-
   // 监听条件变化
   watch(
     conditions,