Administrator
/
FenXiNspUniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改统计内容

This commit is contained in:
978184212@qq.com 2026-08-25 14:18:44 +08:00
parent 246f34358c
commit c1a999b23d
1 changed files with 20 additions and 263 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

283
packDetail/pages/analysis/index.vue
View File

@ -40,7 +40,7 @@
</picker> </picker>
</view> </view>
</view> </view>
<!-- 在template部分，找到年月日选择器部分，修改为以下代码 --> <!-- 年月日选择器 -->
<view class="uni-form-item uni-column"> <view class="uni-form-item uni-column">
<radio-group class="radio-group" @change="radioChange"> <radio-group class="radio-group" @change="radioChange">
<label class="radio-label" v-for="(item, index) in timList" :key="item.value"> <label class="radio-label" v-for="(item, index) in timList" :key="item.value">
@ -144,9 +144,8 @@
enableScroll: false, enableScroll: false,
legend: {}, legend: {},
xAxis: { xAxis: {
disabled: false, // 启用X轴 disabled: false,
// 不设置itemCount，因为我们自定义显示的数据 gridType: 'dash',
gridType: 'dash', // 网格类型
dashLength: 2, dashLength: 2,
}, },
yAxis: { yAxis: {
@ -176,8 +175,8 @@
allNum: '', allNum: '',
isLastpage: '', isLastpage: '',
intervalId: null, intervalId: null,
loadStatus: 'more', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式 loadStatus: 'more',
isLoadMore: false, //是否加载中 isLoadMore: false,
show: false, show: false,
show1: false, show1: false,
top: 0, top: 0,
@ -214,7 +213,7 @@
var pxToRpxScale = 750 / res.windowWidth var pxToRpxScale = 750 / res.windowWidth
var ktxStatusHeight = res.statusBarHeight * pxToRpxScale var ktxStatusHeight = res.statusBarHeight * pxToRpxScale
var navigationHeight = 44 * pxToRpxScale var navigationHeight = 44 * pxToRpxScale
this.height = res.windowHeight * pxToRpxScale //将px 转换rpx this.height = res.windowHeight * pxToRpxScale
this.scorllheight = this.height this.scorllheight = this.height
} }
}); });
@ -224,7 +223,6 @@
this.importWyw() this.importWyw()
this.getazsurvMulchRecord() this.getazsurvMulchRecord()
this.getyjList() this.getyjList()
// this.gettj()
this.qushicov() this.qushicov()
}, },
methods: { methods: {
@ -249,7 +247,6 @@
} }
}) })
}, },
// 获取监测站点数据
getazsurvMulchRecord() { getazsurvMulchRecord() {
this.arrays = [] this.arrays = []
this.array1 = ['全部监测设备', ] this.array1 = ['全部监测设备', ]
@ -271,7 +268,6 @@
} }
}) })
}, },
// 获取预警列表
getyjList() { getyjList() {
let params = {} let params = {}
params.pageNo = this.pageNo params.pageNo = this.pageNo
@ -315,7 +311,6 @@
this.loadStatus = 'nomore' this.loadStatus = 'nomore'
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
} }
} else { } else {
@ -327,9 +322,7 @@
this.isRefresher = false this.isRefresher = false
}) })
}, },
// 分页加载
lower() { lower() {
// 最后一页了，取消下拉功能
if (this.isLastpage) { if (this.isLastpage) {
return return
} }
@ -370,7 +363,6 @@
this.loadStatus = 'nomore' this.loadStatus = 'nomore'
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
} }
} else { } else {
@ -380,7 +372,6 @@
} }
}) })
}, },
// 获取评价
getpj() { getpj() {
this.$http.post('/applet/wxclient/displayInfo?infoType=' + 'effect_assess').then(res => { this.$http.post('/applet/wxclient/displayInfo?infoType=' + 'effect_assess').then(res => {
let data = res.data.data.effect_assess.detailList let data = res.data.data.effect_assess.detailList
@ -392,36 +383,32 @@
} }
}) })
}, },
// 选择年月日
radioChange(e){ radioChange(e){
this.riqinumber = e.detail.value this.riqinumber = e.detail.value
this.bindDateqsChange(this.datetwo,'twotime') this.bindDateqsChange(this.datetwo,'twotime')
}, },
// 趋势时间
bindDateqsChange(e,tiem) { bindDateqsChange(e,tiem) {
if (tiem=='twotime') { if (tiem=='twotime') {
let selectedDate = e let selectedDate = e
if (this.riqinumber === 'monthDays') { if (this.riqinumber === 'monthDays') {
this.dateqs = selectedDate.slice(0, 7); // YYYY-MM this.dateqs = selectedDate.slice(0, 7);
} else if (this.riqinumber === 'yearMonth') { } else if (this.riqinumber === 'yearMonth') {
this.dateqs = selectedDate.slice(0, 4); // YYYY this.dateqs = selectedDate.slice(0, 4);
} else { } else {
this.dateqs = selectedDate; // YYYY-MM-DD this.dateqs = selectedDate;
} }
} else { } else {
let selectedDate = e.detail.value; let selectedDate = e.detail.value;
if (this.riqinumber === 'monthDays') { if (this.riqinumber === 'monthDays') {
this.dateqs = selectedDate.slice(0, 7); // YYYY-MM this.dateqs = selectedDate.slice(0, 7);
} else if (this.riqinumber === 'yearMonth') { } else if (this.riqinumber === 'yearMonth') {
this.dateqs = selectedDate.slice(0, 4); // YYYY this.dateqs = selectedDate.slice(0, 4);
} else { } else {
this.dateqs = selectedDate; // YYYY-MM-DD this.dateqs = selectedDate;
} }
} }
this.qushicov(); this.qushicov();
}, },
// 趋势接口
qushicov() { qushicov() {
let data = { let data = {
summrayMode: this.riqinumber, summrayMode: this.riqinumber,
@ -433,20 +420,18 @@
setTimeout(() => { setTimeout(() => {
let categories = []; let categories = [];
let displayCategories = []; // 用于显示的X轴数据 let displayCategories = [];
let series = []; let series = [];
let allValues = []; // 收集所有数值 let allValues = [];
if (lynum.tableHead && lynum.tableHead.length > 0) { if (lynum.tableHead && lynum.tableHead.length > 0) {
categories = lynum.tableIndex; categories = lynum.tableIndex;
// 计算要显示的X轴数据：第一个、中间、最后一个
if (categories.length > 0) { if (categories.length > 0) {
const first = categories[0]; const first = categories[0];
const middle = categories[Math.floor(categories.length / 2)]; const middle = categories[Math.floor(categories.length / 2)];
const last = categories[categories.length - 3]; const last = categories[categories.length - 3];
// 创建显示用的categories数组，只在这三个位置有值，其他为空字符串
displayCategories = categories.map((item, index) => { displayCategories = categories.map((item, index) => {
if (index === 0 || index === Math.floor(categories.length / 2) || index === categories.length - 2) { if (index === 0 || index === Math.floor(categories.length / 2) || index === categories.length - 2) {
return item; return item;
@ -458,7 +443,7 @@
lynum.tableHead.forEach((header, index) => { lynum.tableHead.forEach((header, index) => {
const seriesData = lynum.tableData2.map(row => { const seriesData = lynum.tableData2.map(row => {
const value = row[index] === "0" ? 0 : parseFloat(row[index]) || 0; const value = row[index] === "0" ? 0 : parseFloat(row[index]) || 0;
allValues.push(value); // 收集数值 allValues.push(value);
return value; return value;
}); });
@ -468,16 +453,12 @@
}); });
}); });
// 动态计算Y轴范围
const maxValue = Math.max(...allValues); const maxValue = Math.max(...allValues);
const minValue = Math.min(...allValues); const minValue = Math.min(...allValues);
const padding = maxValue * 0.1;
// 设置合适的上下边界，增加一些余量
const padding = maxValue * 0.1; // 10%的余量
const yAxisMax = maxValue + padding; const yAxisMax = maxValue + padding;
const yAxisMin = Math.max(0, minValue - padding); // 确保最小值不小于0 const yAxisMin = Math.max(0, minValue - padding);
// 更新opts中的yAxis配置
this.opts = { this.opts = {
...this.opts, ...this.opts,
yAxis: { yAxis: {
@ -494,213 +475,13 @@
} }
let res = { let res = {
categories: displayCategories, // 使用处理后的显示数据 categories: displayCategories,
series: series series: series
}; };
this.chartData = JSON.parse(JSON.stringify(res)); this.chartData = JSON.parse(JSON.stringify(res));
}, 500); }, 500);
}) })
}, },
// 获取折线图
gettj() {
if (!this.stationCode) {
this.stationCode = 'S_1'
}
this.$http.post('/applet/wxclient/getPplutionSummry?stationCode=' + this.stationCode).then(res => {
this.zxtdata = res.data.data[0]
this.ec.option.legend.data = ['总磷', '总氮', '硝态氮']
this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF']
this.ec.option.series = [{
name: '总磷',
type: 'line',
stack: 'Total1',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(25, 213, 138, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.TPSummry
},
{
name: '总氮',
type: 'line',
stack: 'Total2',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(255, 197, 59, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.TNSummry
},
{
name: '硝态氮',
type: 'line',
stack: 'Total3',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(59, 160, 255, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.NOSummry
},
]
if (this.array[this.index].indexOf('畜禽') != -1) {
this.ec.option.legend.data = ['总磷', '总氮', 'COD', '氨氮']
this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF', '#FF3B3B']
this.ec.option.series = [{
name: '总磷',
type: 'line',
stack: 'Total1',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(25, 213, 138, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.TPSummry
},
{
name: '总氮',
type: 'line',
stack: 'Total2',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(255, 197, 59, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.TNSummry
},
{
name: 'COD',
type: 'line',
stack: 'Total3',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(59, 160, 255, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.CODSummry
},
{
name: '氨氮',
type: 'line',
stack: 'Total4',
areaStyle: { //区域填充渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: 'rgba(255, 59, 59, 1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 255, 255, 1)' // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.NHSummry
},
]
}
})
},
// 折线图切换站点
bindPickerChange: function(e) { bindPickerChange: function(e) {
this.index = e.detail.value this.index = e.detail.value
this.stationName = this.array[this.index] this.stationName = this.array[this.index]
@ -709,10 +490,8 @@
this.stationCode = this.arrays[i].value this.stationCode = this.arrays[i].value
} }
} }
// this.gettj()
this.qushicov() this.qushicov()
}, },
// 预警切换站点
bindPickerChange1: function(e) { bindPickerChange1: function(e) {
this.index1 = e.detail.value this.index1 = e.detail.value
this.stationName1 = this.array1[this.index1] this.stationName1 = this.array1[this.index1]
@ -727,7 +506,6 @@
this.pageNo = 1 this.pageNo = 1
this.getyjList() this.getyjList()
}, },
// 预警切换日期
bindDateChange: function(e) { bindDateChange: function(e) {
this.yearStr = e.detail.value this.yearStr = e.detail.value
this.date = e.detail.value this.date = e.detail.value
@ -755,12 +533,10 @@
<style lang="scss"> <style lang="scss">
page { page {
// height: 100%;
background-color: #0f6efe; background-color: #0f6efe;
} }
.container { .container {
// height: 100%;
padding: 0 32rpx; padding: 0 32rpx;
box-sizing: border-box; box-sizing: border-box;
overflow-y: scroll; overflow-y: scroll;
@ -796,7 +572,6 @@
} }
.ybecharts image { .ybecharts image {
// position: absolute;
width: 90%; width: 90%;
height: 100%; height: 100%;
} }
@ -1009,21 +784,18 @@
.tabitem:first-child { .tabitem:first-child {
width: 31%; width: 31%;
// text-align: center
} }
.tabitem:nth-child(2) { .tabitem:nth-child(2) {
width: 27%; width: 27%;
// text-align: center
} }
.tabitem:nth-child(3) { .tabitem:nth-child(3) {
width: 19%; width: 19%;
// text-align: center
} }
.tabitem:nth-child(4) { .tabitem:nth-child(4) {
flex: 1 // text-align: center flex: 1
} }
.scroll-Y { .scroll-Y {
@ -1083,10 +855,6 @@
} }
} }
// .lists_item:first-child {
// padding-top: 0;
// }
.jczbs { .jczbs {
width: 32%; width: 32%;
font-size: 24rpx; font-size: 24rpx;
@ -1096,7 +864,6 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center
} }
.zbz { .zbz {
@ -1108,7 +875,6 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center
} }
.sbsj { .sbsj {
@ -1117,8 +883,6 @@
font-weight: 400; font-weight: 400;
color: #667482; color: #667482;
flex: 1; flex: 1;
// text-align: center
// text-align: right;
} }
.szqss { .szqss {
@ -1134,12 +898,9 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center
} }
.load { .load {
// height: 50rpx;
// line-height: 50rpx;
text-align: center; text-align: center;
color: #c6c6c6; color: #c6c6c6;
} }
@ -1147,14 +908,12 @@
.pagebot { .pagebot {
height: 100rpx; height: 100rpx;
} }
// 选择年月日
.radio-group { .radio-group {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
// margin: 20rpx 32rpx 0;
border-radius: 20rpx; border-radius: 20rpx;
padding: 8rpx; padding: 8rpx;
// width: 60%;
.radio-label { .radio-label {
display: flex; display: flex;
align-items: center; align-items: center;
@ -1169,7 +928,6 @@
background: rgba(15, 110, 254, 0.1); background: rgba(15, 110, 254, 0.1);
} }
// 选中状态背景
&.checked { &.checked {
background: #0f6efe; background: #0f6efe;
@ -1183,7 +941,6 @@
transform: scale(0.8); transform: scale(0.8);
margin-right: 8rpx; margin-right: 8rpx;
// 选中状态样式
&[checked] { &[checked] {
color: #ffffff; color: #ffffff;
} }