aiotagro/nxxmdata
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改大屏和继续完善官网

Browse Source
This commit is contained in:
dengyuxin
2025-09-15 17:55:15 +08:00
parent fab7e3e4ea
commit be32363412
5 changed files with 58 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
datav/index.html
View File

@@ -2,7 +2,7 @@
<html lang="">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>宁夏智慧畜牧大数据平台</title>
</head>

BIN
datav/public/favicon.ico
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.2 KiB

24
datav/public/favicon.svg Normal file
View File

@@ -0,0 +1,24 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<!-- 背景圆形 -->
<circle cx="16" cy="16" r="15" fill="#0c1426" stroke="#00d4ff" stroke-width="2"/>
<!-- 牛头轮廓 -->
<path d="M8 18 Q8 12 12 10 Q16 8 20 10 Q24 12 24 18 L22 20 Q20 22 16 22 Q12 22 10 20 Z" fill="#00d4ff" opacity="0.8"/>
<!-- 牛角 -->
<path d="M10 12 Q8 10 7 8" stroke="#00ffff" stroke-width="2" fill="none" stroke-linecap="round"/>
<path d="M22 12 Q24 10 25 8" stroke="#00ffff" stroke-width="2" fill="none" stroke-linecap="round"/>
<!-- 眼睛 -->
<circle cx="13" cy="15" r="1.5" fill="#ffffff"/>
<circle cx="19" cy="15" r="1.5" fill="#ffffff"/>
<!-- 鼻子 -->
<ellipse cx="16" cy="18" rx="2" ry="1" fill="#ffffff" opacity="0.6"/>
<!-- 数据点装饰 -->
<circle cx="6" cy="8" r="1" fill="#00ffff" opacity="0.6"/>
<circle cx="26" cy="8" r="1" fill="#00ffff" opacity="0.6"/>
<circle cx="6" cy="24" r="1" fill="#00ffff" opacity="0.6"/>
<circle cx="26" cy="24" r="1" fill="#00ffff" opacity="0.6"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

3
datav/src/components/Alert.vue
View File

@@ -353,6 +353,7 @@ export default {
name: '智能耳标',
type: 'bar',
stack: 'total',
barWidth: '40%',
data: currentEarTags,
itemStyle: {
color: '#00d4ff'
@@ -362,6 +363,7 @@ export default {
name: '智能项圈',
type: 'bar',
stack: 'total',
barWidth: '40%',
data: currentCollars,
itemStyle: {
color: '#0099cc'
@@ -371,6 +373,7 @@ export default {
name: '主机',
type: 'bar',
stack: 'total',
barWidth: '40%',
data: currentHosts,
itemStyle: {
color: '#336699'

60
datav/src/components/Home.vue
View File

@@ -134,7 +134,7 @@
<h3> 牛只参保统计</h3>
</div>
<div class="insurance-stats">
<div class="insurance-circle">
<div class="insurance-circle" style="display: flex; align-items: center;">
<v-chart
class="insurance-chart"
:option="insuranceChartOption"
@@ -274,8 +274,14 @@ export default {
axisLabel: {
color: '#ffffff',
fontSize: 10,
rotate: 0
}
rotate: 0,
margin: 10
},
axisTick: {
alignWithLabel: true,
show: true
},
boundaryGap: true
},
yAxis: {
type: 'value',
@@ -299,32 +305,22 @@ export default {
}
}
},
series: [
{
name: '口蹄疫防疫',
type: 'bar',
data: [32.67],
itemStyle: {
color: '#00ffff'
}
},
{
name: '猪瘟防疫',
type: 'bar',
data: [0, 20.3],
itemStyle: {
color: '#84acf0'
}
},
{
name: '其他类型防疫',
type: 'bar',
data: [0, 0, 1.91],
itemStyle: {
color: '#96ceb4'
series: [{
name: '防疫统计',
type: 'bar',
data: [
{ value: 32.67, itemStyle: { color: '#00ffff' } },
{ value: 20.3, itemStyle: { color: '#84acf0' } },
{ value: 1.91, itemStyle: { color: '#96ceb4' } }
],
barWidth: '30%',
itemStyle: {
color: function(params) {
const colors = ['#00ffff', '#84acf0', '#96ceb4'];
return colors[params.dataIndex];
}
}
]
}]
},
// 出售统计柱状图配置
salesChartOption: {
@@ -383,6 +379,7 @@ export default {
name: '出售统计',
type: 'bar',
data: [3000, 3500, 400, 425, 450, 4750],
barWidth: '30%',
itemStyle: {
color: '#00ffff'
},
@@ -1062,12 +1059,13 @@ export default {
display: flex;
flex-direction: column;
gap: 10px;
min-width: 120px;
min-width: 100px;
padding-top: 20px;
}
.flip-card {
background-color: transparent;
width: 120px;
width: 100px;
height: 90px;
perspective: 1000px;
}
@@ -1139,7 +1137,7 @@ export default {
.cattle-insurance-panel .insurance-stats {
display: flex;
align-items: center;
height: 250px;
height: 220px;
padding: 10px 15px 15px 15px;
}
@@ -1149,6 +1147,8 @@ export default {
height: 120px;
margin-right: 20px;
flex-shrink: 0;
align-self: flex-start;
margin-top: 15px;
}
.insurance-chart {