From 5ffc36a1db18d3112a9b50a9cf3953d7fcf21bae Mon Sep 17 00:00:00 2001
From: huanghongfeng <huanghongfeng@hnkhzn.com>
Date: 星期二, 19 八月 2025 16:37:24 +0800
Subject: [PATCH] 更新
---
项目代码/DP/src/views/indexs/station-one.vue | 132 +++++++++++++++++++++++--------------------
1 files changed, 70 insertions(+), 62 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/DP/src/views/indexs/station-one.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/DP/src/views/indexs/station-one.vue"
index f4936a2..06bd00d 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/DP/src/views/indexs/station-one.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/DP/src/views/indexs/station-one.vue"
@@ -1,84 +1,92 @@
<template>
- <div class="table-container">
- <table class="data-table">
- <thead>
- <tr>
- <th v-for="(header, index) in headers" :key="index">
- {{ header }}
- </th>
- </tr>
- </thead>
- <tbody>
- <tr v-for="(row, rowIndex) in tableData" :key="rowIndex">
- <td v-for="(cell, cellIndex) in row" :key="cellIndex">
- {{ cell }}
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </template>
-
- <script>
+ <div class="table-container">
+ <table class="data-table">
+ <thead>
+ <tr>
+ <th>璐т綅淇℃伅</th>
+ <th v-for="(status, index) in statusTypes" :key="index">
+ {{ status }}
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>鏁伴噺</td>
+ <td v-for="(count, index) in statusCounts" :key="index">
+ {{ count }}
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</template>
+
+<script>
import axios from 'axios';
export default {
data() {
return {
- headers: ['璐т綅淇℃伅', '鏁伴噺'],
- tableData: []
+ statusTypes: ['鏈夎揣', '绌鸿揣浣�', '鏈夎揣绂佺敤', '閿佸畾'], // 琛ㄥご鐘舵�佺被鍨�
+ statusCounts: [0, 0, 0,0] // 瀵瑰簲鐘舵�佺殑鏁伴噺
};
},
created() {
- this.fetchData();
+ this.fetchData();
},
methods: {
fetchData() {
axios.post("http://127.0.0.1:5000/api/LocationInfo/LocationStatus", null)
.then((response) => {
- this.tableData = [];
- response.forEach(item => {
- this.tableData.push([
- item.status,
- item.count
- ]);
- });
+ // 鍋囪API杩斿洖鐨勬暟鎹牸寮忎负锛歔{status: '鏈夎揣', count: 9}, {status: '绌鸿揣浣�', count: 2}, ...]
+ const newCounts = [0, 0, 0,0];
+ console.log(response.data)
+ newCounts[0] = response.data.data[0].count;
+ newCounts[1] = response.data.data[1].count;
+ newCounts[2] = response.data.data[2].count;
+ newCounts[3] = response.data.data[3].count;
+
+ this.statusCounts = newCounts;
})
.catch((error) => {
console.error("璇锋眰澶辫触:", error);
- this.tableData = [
- ['绌鸿揣浣�', 0],
- ['鏈夎揣', 0],
- ['鍗犵敤', 0]
- ];
+ // 浣跨敤榛樿鏁版嵁
+ this.statusCounts = [0, 0, 0,0];
});
}
}
};
</script>
-
- <style scoped>
- .table-container {
- width: 100%;
- overflow-x: auto;
- }
-
- .data-table {
- width: 100%;
- border-collapse: collapse;
- margin: 20px 0;
- font-family: Arial, sans-serif;
- }
-
- .data-table th {
- font-weight: bold;
- padding: 12px 15px;
- text-align: left;
- border-bottom: 2px solid #c9aeae;
- }
-
- .data-table td {
- padding: 10px 15px;
- border-bottom: 1px solid #ddd;
- }
- </style>
\ No newline at end of file
+
+<style scoped>
+.table-container {
+ width: 100%;
+ overflow-x: auto;
+}
+
+.data-table {
+ width: 100%;
+ border-collapse: collapse;
+ margin: 20px 0;
+ font-family: Arial, sans-serif;
+}
+
+.data-table th {
+ font-weight: bold;
+ padding: 12px 15px;
+ text-align: center;
+ border-bottom: 2px solid #c5c5c5;
+}
+
+.data-table td {
+ padding: 10px 15px;
+ border-bottom: 1px solid #696969;
+ text-align: center;
+}
+
+.data-table th:first-child,
+.data-table td:first-child {
+ text-align: left;
+ font-weight: bold;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3