From 02409bfbe15f22fc3b5dccadabfd860a660a49d9 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 11 Oct 2025 10:37:14 +0800
Subject: [PATCH] feat: 名称修改
---
src/views/wel/components/statistics.vue | 59 ++++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 42 insertions(+), 17 deletions(-)
diff --git a/src/views/wel/components/statistics.vue b/src/views/wel/components/statistics.vue
index 295996a..8b57f02 100644
--- a/src/views/wel/components/statistics.vue
+++ b/src/views/wel/components/statistics.vue
@@ -67,7 +67,7 @@
</template>
<template v-else-if="test[item]?.name == '机巢保险'">
<div
- v-for="statusKey in [1, 0]"
+ v-for="statusKey in [1, 0,2]"
:key="statusKey"
class="status-item"
:class="getStatusStyle(test[item]?.name, statusKey)"
@@ -84,6 +84,28 @@
<span class="count">
{{ newtitleData[item].status_map[statusKey] }}
{{ test[item]?.name === '无人机' ? '架' : '个' }}
+ </span>
+ </div>
+ </template>
+ <template v-else-if="test[item]?.name == '无人机流量'">
+ <div
+ v-for="statusKey in [ 0,2,1]"
+ :key="statusKey"
+ class="status-item"
+ :class="getStatusStyle(test[item]?.name, statusKey)"
+ :style="{ color: getStatusColor(test[item]?.name, statusKey) }"
+ >
+ <span
+ class="indicator"
+ :style="{
+ backgroundColor: getStatusBackground(test[item]?.name, statusKey),
+ color: getStatusColor(test[item]?.name, statusKey),
+ }"
+ ></span>
+ <span class="label">{{ getStatusLabel(test[item]?.name, statusKey) }}</span>
+ <span class="count">
+ {{ newtitleData[item].status_map[statusKey] }}
+ {{ test[item]?.name === '无人机流量' ? '架' : '个' }}
</span>
</div>
</template>
@@ -190,6 +212,7 @@
const insureStatus = {
0: '临近到期',
1: '正常期限',
+ 2:'保险过期'
};
const moveListStatus = {
'-1': '离线中',
@@ -198,28 +221,29 @@
// 样式配置对象
const statusStyles = {
机巢保险: {
- 0: { class: 'expired', color: '#7C8091', background: '#7C8091' },
- 1: { class: 'normal', color: '#1B94FF', background: '#1B94FF' },
+ 0: { class: 'expired', color: '#FFA600', background: '#FFA600' },
+ 1: { class: 'normal', color: 'rgba(0, 180, 69, 1)', background: 'rgba(0, 180, 69, 1)' },
+ 2: { class: 'flying',color: 'rgba(255, 36, 36, 1)', background: 'rgba(255, 36, 36, 1)' },
},
无人机流量: {
- 0: { class: 'offline', color: '#11CE3E', background: '#11CE3E' },
- 1: { class: 'flying', color: '#1B94FF', background: '#1B94FF' },
- 2: { class: 'flying', color: '#7C8091', background: '#7C8091' },
+ 0: { class: 'offline', color: 'rgba(0, 180, 69, 1)', background: 'rgba(0, 180, 69, 1)' },
+ 1: { class: 'flying', color: 'rgba(255, 36, 36, 1)', background: 'rgba(255, 36, 36, 1)' },
+ 2: { class: 'flying', color: '#FFA600', background: '#FFA600' },
},
监控设备: {
- 0: { class: 'offline', color: '#bababa', background: '#bababa' },
- 1: { class: 'flying', color: '#1B94FF', background: '#1B94FF' },
+ 0: { class: 'offline', color: 'rgba(186, 186, 186, 1)', background: 'rgba(186, 186, 186, 1)' },
+ 1: { class: 'flying', color: 'rgba(255, 106, 0, 1)', background: 'rgba(255, 106, 0, 1)' },
},
移动机巢: {
- '-1': { class: 'offline', color: '#bababa', background: '#bababa' },
- 4: { class: 'flying', color: '#1B94FF', background: '#1B94FF' },
+ '-1': { class: 'offline', color: 'rgba(186, 186, 186, 1)', background: 'rgba(186, 186, 186, 1)' },
+ 4: { class: 'flying', color: 'rgba(255, 106, 0, 1)', background: 'rgba(255, 106, 0, 1)' },
},
// 默认样式配置
default: {
- 0: { class: 'warning', color: '#1b94ff', background: '#1b94ff' },
- 4: { class: 'success', color: '#11ce3e', background: '#11ce3e' },
- '-1': { class: 'success', color: '#bababa', background: '#bababa' },
+ 0: { class: 'warning', color: 'rgba(0, 180, 69, 1)', background: 'rgba(0, 180, 69, 1)' },
+ 4: { class: 'success', color: 'rgba(255, 106, 0, 1)', background: 'rgba(255, 106, 0, 1)' },
+ '-1': { class: 'success', color: 'rgba(186, 186, 186, 1)', background: 'rgba(186, 186, 186, 1)' },
},
};
@@ -295,7 +319,8 @@
<style scoped lang="scss">
.statistics {
- min-height: 174px;
+ // height: 174px;
+ height: pxToVh(174);
background: #ffffff;
border-radius: 8px 8px 8px 8px;
margin-bottom: 10px;
@@ -332,15 +357,15 @@
padding: 0 14px 0 21px;
// display: grid;
// grid-template-columns: repeat(4, 1fr);
- height: 80px;
+ height: pxToVh(80);
display: flex;
justify-content: space-around;
:deep(.el-empty ){
width: 60px;
- height: 60px;
+ height: pxToVh(60);
.el-empty__image{
width: 60px !important;
- height: 60px !important;}
+ height: pxToVh(60)!important;}
.custom-text {
font-size: 12px;
color: #7c8091;
--
Gitblit v1.9.3