From 1b4064f6550e8d678c1c0439c11443773e6f5e16 Mon Sep 17 00:00:00 2001
From: Free-sss <630042479@qq.com>
Date: Mon, 8 Sep 2025 13:56:24 +0800
Subject: [PATCH] =?UTF-8?q?refactor(Charts):=20=E9=87=8D=E6=9E=84=E6=8A=A5?=
 =?UTF-8?q?=E8=AD=A6=E5=88=97=E8=A1=A8=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 使用 PublicSmallBorder 组件替换原有的 SmallBorder 组件
---
 .../AlarmListHazC/config.ts                   |   2 +-
 .../AlarmListHazC/index.vue                   | 105 +++++++-----------
 2 files changed, 43 insertions(+), 64 deletions(-)

diff --git a/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/config.ts b/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/config.ts
index 6478843..684b4d9 100644
--- a/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/config.ts
+++ b/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/config.ts
@@ -37,7 +37,7 @@ export const option = {
   headerHeight: 28,
   itemHeight: 28,
   fontSize: 12,
-  title: '近60分钟报警信息',
+  titleText: '近60分钟报警信息',
   titleSize: 16,
   titleColor: '#eee',
   fontWeight: 'normal',
diff --git a/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/index.vue b/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/index.vue
index 091c94c..c4485d6 100644
--- a/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/index.vue
+++ b/src/packages/components/Charts/HazardousChemicalsSpace/AlarmListHazC/index.vue
@@ -1,57 +1,41 @@
 <template>
-  <SmallBorder class="SmallBorder">
-    <div class="go-alarm-list">
-      <div class="header">
-        <div class="title">
+  <div class="go-alarm-list">
+    <PublicSmallBorder :title-text="option.titleText">
+      <div class="content">
+        <div class="table-header" :style="{
+          height: option.headerHeight + 'px'
+        }">
+          <div v-for="header in option.header" :key="header" class="header-item"
+            :style="{ color: option.headerTextColor, fontSize: option.fontSize + 'px' }">
+            {{ header }}
+          </div>
+        </div>
+        <div class="table-body">
+          <div v-if="isLoading" style="display: flex; width: 100%; justify-content: center; margin-top: 16px">
+            <n-spin size="large" />
+          </div>
+          <div v-for="(item, index) in option.dataset" :key="index" class="table-row"
+            :style="{ backgroundColor: option.itemBackgroundColor, height: option.itemHeight + 'px' }">
+            <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
+              {{ item.alarmDescname }}
+            </div>
+            <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
+              {{ item.alarmTime }}
+            </div>
+            <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
+              {{ item.compName }}
+            </div>
+            <div class="row-item" :style="{ color: getStatusColor(item.alarmLevel), fontSize: option.fontSize + 'px' }">
+              {{ item.alarmLevel }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </PublicSmallBorder>
+  </div>
+
+
 
-          <div class="title-text">
-            <span :style="{
-              color: option.titleColor,
-              fontSize: option.titleSize + 'px',
-              fontWeight: option.fontWeight,
-              fontStyle: option.fontStyle,
-              marginLeft: option.paddingX + 'px',
-              marginTop: option.paddingY + 'px',
-              letterSpacing: option.letterSpacing + 'px'
-            }">{{ option.title }}</span>
-          </div>
-        </div>
-        <div v-if="option.isShowButton" class="header-right-squares">
-          <div class="square" style="background-color: #2e69e0"></div>
-          <div class="square" style="background-color: #2e9bf0"></div>
-          <div class="square" style="background-color: #2ef0b3"></div>
-        </div>
-      </div>
-      <div class="table-header" :style="{
-        height: option.headerHeight + 'px'
-      }">
-        <div v-for="header in option.header" :key="header" class="header-item"
-          :style="{ color: option.headerTextColor, fontSize: option.fontSize + 'px' }">
-          {{ header }}
-        </div>
-      </div>
-      <div class="table-body">
-        <div v-if="isLoading" style="display: flex; width: 100%; justify-content: center; margin-top: 16px">
-          <n-spin size="large" />
-        </div>
-        <div v-for="(item, index) in option.dataset" :key="index" class="table-row"
-          :style="{ backgroundColor: option.itemBackgroundColor, height: option.itemHeight + 'px' }">
-          <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
-            {{ item.alarmDescname }}
-          </div>
-          <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
-            {{ item.alarmTime }}
-          </div>
-          <div class="row-item" :style="{ color: option.textColor, fontSize: option.fontSize + 'px' }">
-            {{ item.compName }}
-          </div>
-          <div class="row-item" :style="{ color: getStatusColor(item.alarmLevel), fontSize: option.fontSize + 'px' }">
-            {{ item.alarmLevel }}
-          </div>
-        </div>
-      </div>
-    </div>
-  </SmallBorder>
 
 </template>
 
@@ -60,7 +44,7 @@ import { PropType, computed, ref, onMounted, onUnmounted } from 'vue'
 import { option as configOption } from './config'
 import SmallBorder from '../SmallBorder/index.vue'
 import axiosInstance from '@/api/axios'
-
+import PublicSmallBorder from '../../Public_SmallBorder/index.vue'
 const props = defineProps({
   chartConfig: {
     type: Object as PropType<{ option: typeof configOption }>,
@@ -89,7 +73,7 @@ const convertTimestampToDateTime = (timestamp: number | string) => {
 const fetchRecentAlarms = async () => {
   try {
     const res: any = await axiosInstance.get(
-      `/awjt/space/getRecentAlarms/${option.value.sceneCode}`,
+      `/awjt/space/getRecentAlarms`,
       {
         responseType: 'json',
         baseURL: ''
@@ -147,22 +131,17 @@ onUnmounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.SmallBorder {
-  position: relative;
-  // background-color: #ffffff;
+.go-alarm-list {
+  width: 100%;
+  height: 100%;
 }
 
-.go-alarm-list {
-  position: absolute;
-  top: 0;
-  right: 0;
+.content {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   color: #ffffff;
-  padding: 12px;
-  margin-top: 5px;
   box-sizing: border-box;
   // background-color: #4da6ff;
   z-index: 10;