From 8a84570a2e4623d3688425780f47ae5fa2121afe Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期四, 27 十一月 2025 16:10:35 +0800
Subject: [PATCH] 改bug
---
screen/src/views/KeyCabinet.vue | 108 +++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 79 insertions(+), 29 deletions(-)
diff --git a/screen/src/views/KeyCabinet.vue b/screen/src/views/KeyCabinet.vue
index 85ff37e..8dbc11f 100644
--- a/screen/src/views/KeyCabinet.vue
+++ b/screen/src/views/KeyCabinet.vue
@@ -59,7 +59,7 @@
</div>
<div class="tabs">
<div class="tab" :class="type1 === 0 ? 'active' : ''" @click="clickOneItem(0)">杩�7澶�</div>
- <div class="separate"> 锝� </div>
+ <div class="separate"> </div>
<div class="tab" :class="type1 === 1 ? 'active' : ''" @click="clickOneItem(1)">杩�15澶�</div>
</div>
<img src="@/assets/images/task/title@2x.png" class="bg" alt="" />
@@ -75,7 +75,7 @@
</div>
<div class="tabs">
<div class="tab" :class="type2 === 0 ? 'active' : ''" @click="clickTwoItem(0)">杩�7澶�</div>
- <div class="separate"> 锝� </div>
+ <div class="separate"> </div>
<div class="tab" :class="type2 === 1 ? 'active' : ''" @click="clickTwoItem(1)">杩�15澶�</div>
</div>
<img src="@/assets/images/task/title@2x.png" class="bg" alt="" />
@@ -122,6 +122,7 @@
<div class="header line">
<span class="item">杞︾墝鍙�</span>
<span class="item">棰嗗彇浜�</span>
+ <span class="item">棰嗗彇鏃堕棿</span>
<span class="item">褰掕繕鏃堕棿</span>
<span class="item">鐘舵��</span>
<span class="item">澶囨敞</span>
@@ -131,6 +132,7 @@
<div class="line one-swiper-slide swiper-slide item" v-for="(item, i) in data5" :key="i">
<span class="item">{{item.carCode}}</span>
<span class="item">{{item.memberName}}</span>
+ <span class="item">{{item.createDate}}</span>
<span class="item">{{item.returnDate || '-'}}</span>
<span class="item">
<span v-if="item.status === 0" style="color: #FEAF01;">鏈綊杩�</span>
@@ -139,14 +141,11 @@
</span>
<span class="item">{{item.remark || '-'}}</span>
</div>
+ <div v-if="data5.length == 0" class="empty_wrap" style="margin-top: 50px;">
+ <img src="@/assets/images/default_empty.png" alt="">
+ </div>
</div>
</div>
-<!-- <template>-->
-<!-- <Loading />-->
-<!-- <div class="empty">-->
-<!-- <img src="@/assets/images/default_nodata.png" alt="">-->
-<!-- </div>-->
-<!-- </template>-->
</div>
</div>
</div>
@@ -189,21 +188,21 @@
<div class="icon" :style="{ background: `linear-gradient(270deg, ${colors[0].color1} 0%, ${colors[0].color2} 100%)` }"></div>
<div class="text">閰掔簿妫�娴嬪憡璀�</div>
</div>
- <div class="num">{{fenbu.alcoholNum}}娆★綔{{fenbu.alcoholNumPct}}%</div>
+ <div class="num" :style="{ color: '#01ABFE' }">{{fenbu.alcoholNum}}娆★綔{{fenbu.alcoholNumPct}}%</div>
</div>
<div class="item1">
<div class="line">
<div class="icon" :style="{ background: `linear-gradient(270deg, ${colors[1].color1} 0%, ${colors[1].color2} 100%)` }"></div>
<div class="text">鏌滈棬鏈叧鍛婅</div>
</div>
- <div class="num">{{fenbu.timeOutNum}}娆★綔{{fenbu.timeOutNumPct}}%</div>
+ <div class="num" :style="{ color: '#FEAF01' }">{{fenbu.timeOutNum}}娆★綔{{fenbu.timeOutNumPct}}%</div>
</div>
<div class="item1">
<div class="line">
<div class="icon" :style="{ background: `linear-gradient(270deg, ${colors[2].color1} 0%, ${colors[2].color2} 100%)` }"></div>
<div class="text">瓒呮椂鏈繕鍛婅</div>
</div>
- <div class="num">{{fenbu.unCloseNum}}娆★綔{{fenbu.unCloseNumPct}}%</div>
+ <div class="num" :style="{ color: '#28F0C4' }">{{fenbu.unCloseNum}}娆★綔{{fenbu.unCloseNumPct}}%</div>
</div>
</div>
</div>
@@ -232,19 +231,14 @@
<div class="title">
<img class="xf" src="@/assets/images/FireFighting/ic_gaojing_red@2x.png" alt="">
<span>{{item.content}}</span>
-<!-- <div class="data">-->
-<!-- <img src="@/assets/images/ic_guihao@2x.png" />-->
-<!-- <span>鏌滃彿锛�19</span>-->
-<!-- </div>-->
</div>
</div>
- <!-- <div class="status">澶勭悊涓�</div> -->
</div>
</div>
</div>
-<!-- <div v-if="data7.length == 0" class="empty_wrap" style="margin-top: 50px;">-->
-<!-- <img src="@/assets/images/default_empty.png" alt="">-->
-<!-- </div>-->
+ <div v-if="alarm.length == 0" class="empty_wrap" style="margin-top: 50px;">
+ <img src="@/assets/images/default_empty.png" alt="">
+ </div>
</div>
</div>
</div>
@@ -335,7 +329,7 @@
getKeyUseRecord({ carCode: form.value.carCode, status: form.value.status })
.then(res => {
if (res.code === 200) {
- data5.value = res.data
+ // data5.value = res.data
}
})
}
@@ -473,21 +467,38 @@
myChart.setOption({
tooltip: {
trigger: 'axis',
- axisPointer: {
- type: 'line'
- },
+ backgroundColor: 'transparent',
+ borderColor: 'transparent',
+ borderWidth: 0,
+ padding: 0,
+ formatter: function(params) {
+ return `
+ <div style="position: relative;padding: 16px;box-sizing: border-box;background: rgba(17,34,74,0.6);border-radius: 4px;border: 1px solid rgba(1,217,254,0.29);">
+ <div style="position: absolute;top: 0;left: 0;width: 10px;height: 10px;border-left: 1px solid #01D9FE;border-top: 1px solid #01D9FE;"></div>
+ <div style="position: absolute;bottom: 0;right: 0;width: 10px;height: 10px;border-right: 1px solid #01D9FE;border-bottom: 1px solid #01D9FE;"></div>
+ <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">${params[0].axisValue}</div>
+ <div style="display: flex; align-items: center;margin-top: 4px;">
+ <div style="width: 12px;height: 12px;background: #00F2F3;border-radius: 50%;margin-right: 12px;"></div>
+ <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">娲捐溅鏁伴噺锛�</div>
+ <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[0].data}杈�</div>
+ </div>
+ </div>
+ `;
+ }
},
xAxis: {
type: 'category',
boundaryGap: false,
axisLabel: {
- color: '#D2E0FF'
+ color: '#D2E0FF',
+ rotate: 45 // 鏃嬭浆45搴�
},
data: data4.value.map(i => i.name)
},
yAxis: {
type: 'value',
name: '鍗曚綅锛氳締',
+ minInterval: 1,
nameTextStyle: {
padding: [0, 0, 0, -16], // 鍥涗釜鏁板瓧鍒嗗埆涓轰笂鍙充笅宸︿笌鍘熶綅缃窛绂�
color: '#D2E0FF'
@@ -502,7 +513,8 @@
splitNumber: 4
},
axisLabel: {
- color: '#D2E0FF'
+ color: '#D2E0FF',
+ formatter: '{value}'
}
},
grid: {
@@ -581,6 +593,16 @@
var myChart = echarts.init(document.querySelector('.three_two_chat'))
myChart.setOption({
+ legend: {
+ top: '5%',
+ right: '2%',
+ itemWidth: 16,
+ itemHeight: 4,
+ itemGap: 50,
+ textStyle: {
+ color: '#D2E0FF'
+ }
+ },
grid: {
top: '20%',
left: '6%',
@@ -589,20 +611,46 @@
containLabel: true
},
tooltip: {
- trigger: 'axis'
+ trigger: 'axis',
+ backgroundColor: 'transparent',
+ borderColor: 'transparent',
+ borderWidth: 0,
+ padding: 0,
+ formatter: function(params) {
+ return `
+ <div style="position: relative;padding: 16px;box-sizing: border-box;background: rgba(17,34,74,0.6);border-radius: 4px;border: 1px solid rgba(1,217,254,0.29);">
+ <div style="position: absolute;top: 0;left: 0;width: 10px;height: 10px;border-left: 1px solid #01D9FE;border-top: 1px solid #01D9FE;"></div>
+ <div style="position: absolute;bottom: 0;right: 0;width: 10px;height: 10px;border-right: 1px solid #01D9FE;border-bottom: 1px solid #01D9FE;"></div>
+ <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">${params[0].axisValue}</div>
+ <div style="display: flex; align-items: center;margin-top: 4px;">
+ <div style="width: 12px;height: 12px;background: #00C2FF;border-radius: 50%;margin-right: 12px;"></div>
+ <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">棰嗗彇锛�</div>
+ <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[0].data}涓�</div>
+ </div>
+ <div style="display: flex; align-items: center;margin-top: 4px;">
+ <div style="width: 12px;height: 12px;background: #FF8A00;border-radius: 50%;margin-right: 12px;"></div>
+ <div style="color: #FFFFFF;font-size: 14px;font-weight: 400;">褰掕繕锛�</div>
+ <div style="color: #00F2F3;font-size: 14px;font-weight: 500;">${params[1].data}涓�</div>
+ </div>
+ </div>
+ `;
+ }
},
xAxis: {
type: 'category',
axisLabel: {
- color: '#D2E0FF'
+ color: '#D2E0FF',
+ rotate: 45 // 鏃嬭浆45搴�
},
data: data2.value.map(i => i.name)
},
yAxis: {
type: 'value',
- name: '鍗曚綅锛歬',
+ name: '鍗曚綅锛氫釜',
+ minInterval: 1,
axisLabel: {
- color: '#D2E0FF'
+ color: '#D2E0FF',
+ formatter: '{value}'
},
nameTextStyle: {
color: '#D2E0FF',
@@ -618,6 +666,7 @@
},
series: [
{
+ name: '棰嗗彇',
data: data2.value.map(i => i.num),
type: 'bar',
barWidth: 10,
@@ -635,6 +684,7 @@
}
},
{
+ name: '褰掕繕',
data: data2.value.map(i => i.nextNum),
type: 'bar',
barWidth: 10,
--
Gitblit v1.9.3