feat: 替换首页背景图

src/components/Footer.vue

@@ -2,7 +2,7 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-03-06 15:00:26
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-06-23 15:58:27
+ * @LastEditTime: 2025-09-04 16:55:32
  * @FilePath: \vite-ai\data-dashboard\src\views\dashboard\components\footer.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -64,7 +64,8 @@ const isActive = (path: string) => {
                     background-image: url('@/assets/footer/menu#{$i}.png');
                     // 其他背景样式设置
                     background-repeat: no-repeat;
-                    background-size: cover;
+                    background-size: contain;
+                    background-position: center;
                     // 这里可以根据实际情况设置宽度和高度
                     width: 96px;
                     height: 96px;

src/components/HeaderBar/homeSubTitle.vue

@@ -12,7 +12,7 @@
         <!-- 左侧标题区域 -->
         <div class="flex items-center left-section pl-[16px]">
             <img src="@/assets/common/alarm_title.png" class="w-[16px] h-[20px]">
-            <div class="fg-title ml-[12px] text-[18px]">
+            <div class="fg-title ml-[12px]">
                 {{ title }}
                 <slot name="title"></slot>
             </div>

src/hooks/useTrainSaveToExcel copy.ts

@@ -1,166 +0,0 @@
-import ExcelJS from "exceljs";
-// import { saveAs } from 'file-saver-es';
-
-// 模拟列表数据 (替换成你的真实数据)
-
-export const useTrainSaveToExcel = (props) => {
-  const { arrive_at, data, leave_at } = props;
-  console.log("useTrainSaveToExcel_data", data);
-  const listData = [
-    {
-      trainCode: "T-20250508",
-      trainType: "C54K",
-      occurrenceTime: 5785.67354,
-      alarmType: "车辆损坏",
-      faultType: "搭扣未扣",
-    },
-    {
-      trainCode: "T-20250508",
-      trainType: "C54K",
-      occurrenceTime: 5785.67354,
-      alarmType: "车辆损坏",
-      faultType: "搭扣未扣",
-    },
-    {
-      trainCode: "T-20250508",
-      trainType: "C54K",
-      occurrenceTime: 5785.67354,
-      alarmType: "车辆损坏",
-      faultType: "搭扣未扣",
-    },
-  ];
-  // 模拟图片 URL (替换成你的真实图片URL)
-  const imageUrl =
-    "http://192.168.10.14:8123/sftp/2025-07-01/20250701_131010.jpg"; // Fallback
-
-  const convertImageToBase64 = async (url: string) => {
-    try {
-      const response = await fetch(url);
-      const blob = await response.blob();
-      return new Promise<string>((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onloadend = () => resolve(reader.result as string);
-        reader.onerror = reject;
-        reader.readAsDataURL(blob);
-      });
-    } catch (error) {
-      console.error("Error loading image:", error);
-      return null;
-    }
-  };
-
-  const saveToExcel = async () => {
-    const workbook = new ExcelJS.Workbook();
-    const worksheet = workbook.addWorksheet("Sheet1");
-
-    // 1. 设置列宽 (根据你的内容调整)
-    worksheet.getColumn("A").width = 15;
-    worksheet.getColumn("B").width = 15;
-    worksheet.getColumn("C").width = 15;
-    worksheet.getColumn("D").width = 10; // Smaller width for '车型'
-    worksheet.getColumn("E").width = 15;
-    worksheet.getColumn("F").width = 15;
-    worksheet.getColumn("G").width = 15;
-    worksheet.getColumn("H").width = 10;
-    worksheet.getColumn("I").width = 10;
-
-    // 2. 添加头部数据
-    worksheet.getCell("A1").value = "进场时间";
-    worksheet.getCell("B1").value = "出场时间";
-    worksheet.getCell("A3").value = "车厢编号";
-    worksheet.getCell("C3").value = "1234567890"; // Example Value
-
-    // 3. 添加表格头部
-    worksheet.getCell("C5").value = "列车编号";
-    worksheet.getCell("D5").value = "车型";
-    worksheet.getCell("E5").value = "发生时间";
-    worksheet.getCell("F5").value = "告警类型";
-    worksheet.getCell("G5").value = "故障类型";
-
-    const loadRemark =  async (record) => {
-      try {
-        if (imageUrl) {
-          const base64Image = await convertImageToBase64(imageUrl);
-
-          if (base64Image) {
-            const imageId = workbook.addImage({
-              base64: base64Image,
-              extension: "png", // Adjust extension if needed (jpeg, etc.)
-            });
-
-            // Add the image to the worksheet
-            worksheet.addImage(imageId, {
-              tl: { col: 2, row: 8 }, // Top left corner of the image (C9 in Excel)
-              br: { col: 7, row: 25 }, // Bottom right corner of the image (H26 in Excel)
-            });
-          }
-        }
-      } catch (error) {
-        console.error("Error adding image:", error);
-      }
-    }
-
-    // 4. 填充表格数据
-    listData.forEach((item, index) => {
-      const row = index + 6; // 从第6行开始
-      worksheet.getCell(`C${row}`).value = item.trainCode;
-      worksheet.getCell(`D${row}`).value = item.trainType;
-      worksheet.getCell(`E${row}`).value = item.occurrenceTime;
-      worksheet.getCell(`F${row}`).value = item.alarmType;
-      worksheet.getCell(`G${row}`).value = item.faultType;
-      loadRemark(item);
-    });
-
-    // 5. 添加图片
-
-    // Load the image (using a data URL or URL)
-
-    // 6. 添加 "车身缺陷" 文本
-    worksheet.getCell("A17").value = "车身缺陷";
-
-    // 7.  设置 H 列的背景色
-    for (let i = 8; i <= 28; i++) {
-      const cell = worksheet.getCell(`H${i}`);
-      cell.fill = {
-        type: "pattern",
-        pattern: "solid",
-        fgColor: { argb: "ADD8E6" }, // Light blue color
-      };
-    }
-
-    // 8.  (Optional) Style the header rows
-    const headerRanges = ["A1:G5", "B1:G5"]; // Adjust as needed
-    // const headerRange = "A1:G5, B8:G5"; // Adjust as needed
-    for (const headerRange of headerRanges) {
-      worksheet.getCell(headerRange).font = { bold: true };
-      worksheet.getCell(headerRange).alignment = {
-        vertical: "middle",
-        horizontal: "center",
-      }; // Center align headers
-    }
-
-    // 9. 下载 Excel 文件
-    const buffer = await workbook.xlsx.writeBuffer();
-    try {
-      const blob = new Blob([buffer], {
-        type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-      });
-      const url = URL.createObjectURL(blob);
-      const link = document.createElement("a");
-      link.href = url;
-      link.download = "车辆信息.xlsx";
-      link.click();
-      URL.revokeObjectURL(url);
-    } catch (error) {
-      console.error("导出 Excel 文件时出错:", error);
-    }
-    //   saveAs(
-    //     new Blob([buffer], { type: "application/octet-stream" }),
-    //     "车辆信息.xlsx"
-    //   );
-  };
-
-  return {
-    saveToExcel,
-  };
-};

src/styles/common.scss

@@ -41,13 +41,13 @@
 .fg-title {
   font-family: "DouyinSansBold"; // 自定义字体名称
   // 字体样式（根据需求调整）
-  font-size: 16px;
+  font-size: 20px;
-  color: #96e6ff; // 初始字体颜色, 浅蓝色
+  color: #fff; // 初始字体颜色, 浅蓝色
   // 背景渐变和裁剪
-  background: linear-gradient(to bottom, #ffffff, #96e6ff);
+  // background: linear-gradient(to bottom, #ffffff, #96e6ff);
-  -webkit-background-clip: text;
+  // -webkit-background-clip: text;
-  background-clip: text;
+  // background-clip: text;
-  -webkit-text-fill-color: transparent;
+  // -webkit-text-fill-color: transparent;
 }
 // 特殊标记1
 .fg-mark1 {

src/views/dashboard/DataOverview.scss

@@ -87,8 +87,8 @@
     .device-info {
       .total-device {
         .device-total-icon {
-          width: 80px;
+          width: 96px;
-          height: 90px;
+          height: 102px;
           background: url("@/assets/common/deviceTotal.png") no-repeat center;
           background-size: 100%;
         }

src/views/dashboard/DataOverview.vue

@@ -307,7 +307,7 @@ onMounted(() => {
     </div>
     <!-- 中部检测模块 -->
     <div class="realTime-monitor-box">
-      <div class="w-full h-[35px] fg-title px-[16px] py-[20px]">
+      <div class="w-full h-[35px] fg-title px-[16px] py-[18px]">
         实时监测画面
       </div>
       <ul class="flex monitor-images">