diff --git a/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/config.ts b/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/config.ts
index ccce633..28dbbc0 100644
--- a/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/config.ts
+++ b/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/config.ts
@@ -8,32 +8,34 @@ export const includes = ['xAxis', 'yAxis', 'grid']
 
 // 其它配置
 const otherConfig = {
-    dateTime: {
-        selectValue: 'day',
-        dataset: [
-            {
-                label: '当天',
-                value: 'day'
-            },
-            {
-                label: '本周',
-                value: 'week'
-            },
-            {
-                label: '当月',
-                value: 'month'
-            },
-            {
-                label: '本季度',
-                value: 'quarter'
-            },
-            {
-                label: '当年',
-                value: 'year'
-            }
-        ]
-    },
-    sceneCode: '',
+  dateTime: {
+    show: true,
+    selectValue: 'day',
+    dataset: [
+      {
+        label: '当天',
+        value: 'day'
+      },
+      {
+        label: '本周',
+        value: 'week'
+      },
+      {
+        label: '当月',
+        value: 'month'
+      },
+      {
+        label: '本季度',
+        value: 'quarter'
+      },
+      {
+        label: '当年',
+        value: 'year'
+      }
+    ]
+  },
+  sceneCode: '',
+  titleText: "报警趋势"
 }
 
 export const option = {
diff --git a/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/index.vue b/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/index.vue
index f638f6c..98d53b2 100644
--- a/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/index.vue
+++ b/src/packages/components/Charts/HazardousChemicalsSpace/LineDropdownHaz/index.vue
@@ -1,28 +1,24 @@
 <template>
   <div class="go-border-box">
-    <img src="./assets/title.svg" class="svg" />
-    <div class="header-title">报警趋势</div>
-    <CustomSelect 
-            :options="option.dateTime.dataset" 
-            :selectedValue="option.dateTime.selectValue"
-            @change="handleSelectChange"
-        />
-    
-    <div class="line-dropdown-container">
-      <!-- 新增的风险级别下拉框 -->
-      <div class="risk-level-select">
-        <CustomSelect 
-                :options="riskLevelOptions" 
-                :selectedValue="selectedRiskLevel"
-                @change="handleRiskLevelChange"
-            />
-      </div>
+    <PublicSmallBorder :title-text="option.titleText" :select-option="option.dateTime" @change="handleSelectChange">
+      <!-- <CustomSelect :options="option.dateTime.dataset" :selectedValue="option.dateTime.selectValue"
+        @change="handleSelectChange" /> -->
 
-      <!-- 折线图 -->
-      <div class="chart-container">
-        <v-chart ref="vChartRef" autoresize :init-options="initOptions" :theme="themeColor" :option="option"></v-chart>
+      <div class="line-dropdown-container">
+        <!-- 新增的风险级别下拉框 -->
+        <div class="risk-level-select">
+          <CustomSelect :options="riskLevelOptions" :selectedValue="selectedRiskLevel"
+            @change="handleRiskLevelChange" />
+        </div>
+
+        <!-- 折线图 -->
+        <div class="chart-container">
+          <v-chart ref="vChartRef" autoresize :init-options="initOptions" :theme="themeColor"
+            :option="option"></v-chart>
+        </div>
       </div>
-    </div>
+    </PublicSmallBorder>
+
   </div>
 </template>
 
@@ -39,6 +35,7 @@ import config, { includes } from './config'
 import { DatasetComponent, GridComponent, TooltipComponent } from 'echarts/components'
 import CustomSelect from './select.vue'
 import axiosInstance from '@/api/axios'
+import PublicSmallBorder from '../../Public_SmallBorder/index.vue'
 
 const props = defineProps({
   themeSetting: {
@@ -91,13 +88,13 @@ const fetchChartData = async (timeType: string, riskLevel: number) => {
 
 // 数据处理函数
 const processChartData = async (timeType: string, riskLevel: number) => {
-  
+
   // 调用API获取数据
   const rawData = await fetchChartData(timeType, riskLevel)
-  
+
   // 根据时间类型处理数据格式
-  let processedData: Array<{time: string, value: number}> = []
-  
+  let processedData: Array<{ time: string, value: number }> = []
+
   switch (timeType) {
     case 'day':
       processedData = rawData.map((item: any) => ({
@@ -128,7 +125,7 @@ const processChartData = async (timeType: string, riskLevel: number) => {
     default:
       processedData = []
   }
-  
+
   return {
     dimensions: ['time', 'value'],
     source: processedData
@@ -152,15 +149,15 @@ const handleDropdownChange = () => {
 
 // 处理时间下拉选择器变化
 const handleSelectChange = (value: any) => {
-    props.chartConfig.option.dateTime.selectValue = value
-    updateChartData()
+  props.chartConfig.option.dateTime.selectValue = value
+  updateChartData()
 }
 
 // 新增风险级别选择处理函数
 const handleRiskLevelChange = (value: any) => {
-    selectedRiskLevel.value = value
-    updateChartData()
-    console.log('Selected risk level:', value)
+  selectedRiskLevel.value = value
+  updateChartData()
+  console.log('Selected risk level:', value)
 }
 
 // 组件挂载时初始化数据
@@ -173,7 +170,7 @@ onMounted(() => {
 .line-dropdown-container {
   width: 100%;
   height: 100%;
-  background: rgba(13, 16, 22, 1);
+  /* background: rgba(13, 16, 22, 1); */
   position: relative;
 }
 
@@ -187,42 +184,42 @@ onMounted(() => {
   /* 添加边框样式到父容器 */
   border-radius: 8px;
   padding: 1px;
-  background: linear-gradient(to bottom, 
-    rgba(255, 255, 255, 0.8) 0%,
-    rgba(200, 200, 200, 0.6) 25%,
-    rgba(150, 150, 150, 0.5) 50%,
-    rgba(100, 100, 100, 0.4) 75%,
-    rgba(60, 60, 60, 0.3) 100%);
+  background: linear-gradient(to bottom,
+      rgba(255, 255, 255, 0.8) 0%,
+      rgba(200, 200, 200, 0.6) 25%,
+      rgba(150, 150, 150, 0.5) 50%,
+      rgba(100, 100, 100, 0.4) 75%,
+      rgba(60, 60, 60, 0.3) 100%);
   transition: all 0.3s ease;
 }
 
 /* hover状态的彩色渐变边框 */
 .dropdown-container:hover {
-  background: linear-gradient(to bottom, 
-    rgba(58, 160, 255, 1) 0%, 
-    rgba(98, 255, 198, 0.8) 25%, 
-    rgba(54, 110, 255, 1) 50%, 
-    rgba(28, 234, 160, 0.8) 75%, 
-    rgba(58, 160, 255, 1) 100%);
+  background: linear-gradient(to bottom,
+      rgba(58, 160, 255, 1) 0%,
+      rgba(98, 255, 198, 0.8) 25%,
+      rgba(54, 110, 255, 1) 50%,
+      rgba(28, 234, 160, 0.8) 75%,
+      rgba(58, 160, 255, 1) 100%);
 }
 
 /* focus状态的增强彩色渐变边框 */
 .dropdown-container:focus-within {
-  background: linear-gradient(to bottom, 
-    rgba(58, 160, 255, 1) 0%, 
-    rgba(98, 255, 198, 1) 25%, 
-    rgba(54, 110, 255, 1) 50%, 
-    rgba(28, 234, 160, 1) 75%, 
-    rgba(58, 160, 255, 1) 100%);
+  background: linear-gradient(to bottom,
+      rgba(58, 160, 255, 1) 0%,
+      rgba(98, 255, 198, 1) 25%,
+      rgba(54, 110, 255, 1) 50%,
+      rgba(28, 234, 160, 1) 75%,
+      rgba(58, 160, 255, 1) 100%);
 }
 
 .custom-dropdown1 {
   /* 渐变背景 */
-  background: linear-gradient(135deg, 
-    rgba(25, 35, 45, 0.95) 0%, 
-    rgba(15, 25, 35, 0.95) 50%, 
-    rgba(35, 45, 55, 0.95) 100%);
-  
+  background: linear-gradient(135deg,
+      rgba(25, 35, 45, 0.95) 0%,
+      rgba(15, 25, 35, 0.95) 50%,
+      rgba(35, 45, 55, 0.95) 100%);
+
   /* 移除边框，因为已经移到父容器 */
   border: none;
   border-radius: 7px;
@@ -246,10 +243,10 @@ onMounted(() => {
   box-shadow: 0 6px 20px rgba(58, 160, 255, 0.2);
   transform: translateY(-1px);
   /* 增强背景渐变 */
-  background: linear-gradient(135deg, 
-    rgba(35, 45, 55, 0.95) 0%, 
-    rgba(25, 35, 45, 0.95) 50%, 
-    rgba(45, 55, 65, 0.95) 100%);
+  background: linear-gradient(135deg,
+      rgba(35, 45, 55, 0.95) 0%,
+      rgba(25, 35, 45, 0.95) 50%,
+      rgba(45, 55, 65, 0.95) 100%);
 }
 
 .custom-dropdown1:focus {
@@ -268,7 +265,7 @@ onMounted(() => {
   border: none;
   transition: all 0.2s ease;
   cursor: pointer;
-  
+
   /* 添加细微的边框分隔 */
   border-bottom: 1px solid rgba(255, 255, 255, 0.05);
 }
@@ -319,7 +316,7 @@ onMounted(() => {
   transform: translateY(-50%) rotate(180deg);
 }
 
-.custom-dropdown1:focus + .dropdown-arrow {
+.custom-dropdown1:focus+.dropdown-arrow {
   transform: translateY(-50%) rotate(180deg);
   color: rgba(58, 160, 255, 1);
   text-shadow: 0 0 8px rgba(58, 160, 255, 0.5);
@@ -334,59 +331,6 @@ onMounted(() => {
 </style>
 
 <style lang="scss" scoped>
-@include go(border-box) {
-  position: relative;
-  border-radius: 5px;
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  // 不渐变
-  // background-color: #0E121B;
-  // 渐变
-  background: linear-gradient(to top,
-      rgba(14, 18, 27, 1) 0%,
-      rgba(14, 18, 27, 0.6) 100%);
-
-  &::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border-radius: 5px;
-    padding: 2px;
-    /* 边框宽度 */
-    background: linear-gradient(to top,
-        rgba(128, 128, 128, 0.3),
-        rgba(128, 128, 128, 0));
-    -webkit-mask:
-      linear-gradient(#fff, #fff) content-box,
-      linear-gradient(#fff, #fff);
-    -webkit-mask-composite: xor;
-    mask-composite: exclude;
-    pointer-events: none;
-  }
-}
-
-.header-title {
-  position: absolute;
-  height: 45px;
-  line-height: 45px;
-  left: 80px;
-  white-space: nowrap;
-  font-family: 'CustomFont';
-  font-style: italic;
-  letter-spacing: 0.5px;
-  color: #eee;
-  text-shadow: 1px 3px 10px #000000;
-  font-size: 16px;
-}
-
 // 新增风险级别下拉框样式
 .risk-level-select {
   position: relative;
@@ -399,7 +343,7 @@ onMounted(() => {
     top: 0;
     right: 0;
   }
-  
+
   :deep(.select-display) {
     background-color: rgb(19, 22, 33);
     border: 1px solid rgb(75, 83, 99);
@@ -410,28 +354,23 @@ onMounted(() => {
     font-size: 12px;
     min-width: 90px;
   }
-  
+
   :deep(.select-dropdown) {
     background-color: rgb(19, 22, 33);
     border: 1px solid rgb(75, 83, 99);
     border-radius: 6px;
   }
-  
+
   :deep(.select-option) {
     color: #fff;
-    
+
     &:hover {
       background-color: rgba(75, 83, 99, 0.3);
     }
-    
+
     &.selected {
       background-color: rgba(75, 83, 99, 0.5);
     }
   }
 }
-
-.svg {
-  width: 100%;
-  height: 45px;
-}
 </style>