From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/iot/home/components/ComparisonCard.vue | 50 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 50 insertions(+), 0 deletions(-)
diff --git a/src/views/iot/home/components/ComparisonCard.vue b/src/views/iot/home/components/ComparisonCard.vue
new file mode 100644
index 0000000..2da729e
--- /dev/null
+++ b/src/views/iot/home/components/ComparisonCard.vue
@@ -0,0 +1,50 @@
+<template>
+ <el-card class="stat-card" shadow="never" :loading="loading">
+ <div class="flex flex-col">
+ <div class="flex justify-between items-center mb-1">
+ <span class="text-gray-500 text-base font-medium">{{ title }}</span>
+ <Icon :icon="icon" :class="`text-[32px] ${iconColor}`" />
+ </div>
+ <span class="text-3xl font-bold text-gray-700">
+ <span v-if="value === -1">--</span>
+ <span v-else>{{ value }}</span>
+ </span>
+ <el-divider class="my-2" />
+ <div class="flex justify-between items-center text-gray-400 text-sm">
+ <span>浠婃棩鏂板</span>
+ <span class="text-green-500" v-if="todayCount !== -1">+{{ todayCount }}</span>
+ <span v-else>--</span>
+ </div>
+ </div>
+ </el-card>
+</template>
+
+<script lang="ts" setup>
+import { propTypes } from '@/utils/propTypes'
+
+/** 銆愭�绘暟 + 鏂板鏁般�戠粺璁″崱鐗囩粍浠� */
+defineOptions({ name: 'IoTComparisonCard' })
+
+const props = defineProps({
+ title: propTypes.string.def('').isRequired,
+ value: propTypes.number.def(0).isRequired,
+ todayCount: propTypes.number.def(0).isRequired,
+ icon: propTypes.string.def('').isRequired,
+ iconColor: propTypes.string.def(''),
+ loading: {
+ type: Boolean,
+ default: false
+ }
+})
+</script>
+
+<style lang="scss" scoped>
+.stat-card {
+ transition: all 0.3s;
+
+ &:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 5px 15px rgb(0 0 0 / 8%);
+ }
+}
+</style>
--
Gitblit v1.8.0