新增设施环境控制总览页面

src/views/system/fasc/index.vue

@@ -0,0 +1,64 @@
+<template>
+    <div class="fasc-card-container">
+        <el-card
+            v-for="card in cards"
+            :key="card.id"
+            :header="card.title"
+            :body-style="{ padding: '20px' }"
+            class="card"
+            @click.native="goToDetailPage(card)"
+        >
+            <p>{{ card.description }}</p>
+        </el-card>
+    </div>
+</template>
+
+<script>
+export default {
+    data () {
+        return {
+            cards: [
+                { id: 1, title: '室内温湿度监控', description: '今日已监测：0，剩余：0' },
+                { id: 2, title: '冰箱温度监控', description: '今日已监测：0，剩余：0' },
+                { id: 3, title: '温浴箱温度监控', description: '今日已监测：0，剩余：0' },
+                { id: 4, title: '阴凉柜温度监控', description: '今日已监测：0，剩余：0' },
+                { id: 5, title: '纯水机水质监测', description: '今日已监测：0，剩余：0' },
+                { id: 6, title: '每日安全检查', description: '今日已监测：0，剩余：0' },
+                { id: 7, title: '每月安全检查', description: '今日已监测：0，剩余：0' },
+                { id: 8, title: '含氯有效性监测', description: '今日已监测：0，剩余：0' },
+                { id: 9, title: '紫外灯辐照测定', description: '今日已监测：0，剩余：0' },
+                { id: 10, title: '洗眼器检查', description: '今日已监测：0，剩余：0' },
+                { id: 11, title: '紧急淋浴器检查', description: '今日已监测：0，剩余：0' },
+                { id: 12, title: '紫外灯消毒', description: '今日已监测：0，剩余：0' }
+            ],
+            hoverId: null
+        }
+    },
+    methods: {
+        goToDetailPage (card) {
+            if (!card.pagePath) {
+                this.$message.warning('该卡片暂未配置页面路径')
+                return
+            }
+            this.$router.push(card.pagePath)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+    .fasc-card-container {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+        .card {
+            width: 300px;
+            margin: 20px;
+            transition: all 0.3s ease;
+            cursor: pointer;
+            &:hover {
+                transform: scale(1.05);
+                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            }
+        }
+    }
+  </style>