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

修改细节内容

This commit is contained in:
978184212@qq.com 2026-07-23 19:25:06 +08:00
parent 7ec7cea507
commit eb7c194ea9
3 changed files with 217 additions and 360 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -40,11 +40,11 @@
</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" :class="{ 'checked': current === index }">
<radio :value="item.value" :checked="index === current" class="radio-item" /> <radio :value="item.value" :checked="index === current" class="radio-item" color="#0f6efe" />
<view class="radio-text">{{item.name}}</view> <view class="radio-text">{{item.name}}</view>
</label> </label>
</radio-group> </radio-group>
@ -126,16 +126,19 @@
height: 0, height: 0,
scorllheight: 0, scorllheight: 0,
zt: '', zt: '',
date: new Date().getFullYear(), date: new Date().getFullYear().toString(),
array: [], array: [],
index: '', index: 0,
index1: '', index1: 0,
array1: [], array1: [],
arrays: [], arrays: [],
list: [], list: [],
tabList: ['站点名称', '告警指标', '指标值', '告警时间'], tabList: ['站点名称', '告警指标', '指标值', '告警时间'],
pjlist: [], pjlist: [],
chartData: {}, chartData: {
categories: [],
series: []
},
opts: { opts: {
color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"], color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
padding: [15,10,0,15], padding: [15,10,0,15],
@ -144,9 +147,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 +178,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,
@ -190,8 +192,7 @@
zxtdata: [], zxtdata: [],
timList: [{ timList: [{
value: 'yearMonth', value: 'yearMonth',
name: '年', name: '年'
checked: 'true'
}, },
{ {
value: 'monthDays', value: 'monthDays',
@ -203,9 +204,11 @@
}, },
], ],
current: 0, current: 0,
dateqs:new Date().getFullYear(), dateqs: new Date().getFullYear().toString(),
datetwo:currentDate, datetwo: currentDate,
riqinumber:'yearMonth', riqinumber: 'yearMonth',
startDate: '2000-01-01',
endDate: '2030-12-31'
} }
}, },
onLoad() { onLoad() {
@ -214,7 +217,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,10 +227,14 @@
this.importWyw() this.importWyw()
this.getazsurvMulchRecord() this.getazsurvMulchRecord()
this.getyjList() this.getyjList()
// this.gettj()
this.qushicov()
}, },
methods: { methods: {
// 格式化数字
cutMoneyFiter(val) {
if (!val && val !== 0) return 0
return val
},
// 获取站点列表
importWyw() { importWyw() {
this.array = [] this.array = []
this.arrays = [] this.arrays = []
@ -247,12 +254,22 @@
}) })
this.array.push(res.data.data[i].stationName) this.array.push(res.data.data[i].stationName)
} }
// 站点数据加载完成后，设置默认站点并获取趋势数据
if (this.array.length > 0) {
this.stationCode = this.arrays[0]?.value || ''
// 延迟一点确保数据已渲染
setTimeout(() => {
this.qushicov()
}, 300)
}
}).catch(err => {
console.log('获取站点列表失败', err)
}) })
}, },
// 获取监测站点数据 // 获取监测站点设备数据
getazsurvMulchRecord() { getazsurvMulchRecord() {
this.arrays = [] this.arrays = []
this.array1 = ['全部监测设备', ] this.array1 = ['全部监测设备']
this.arrays1 = [{ this.arrays1 = [{
label: '全部监测设备', label: '全部监测设备',
value: '' value: ''
@ -269,6 +286,8 @@
}) })
this.array1.push(res.data.data[i].fullDeviceName) this.array1.push(res.data.data[i].fullDeviceName)
} }
}).catch(err => {
console.log('获取设备列表失败', err)
}) })
}, },
// 获取预警列表 // 获取预警列表
@ -295,11 +314,18 @@
data[i].shi = data[i].times[3]; data[i].shi = data[i].times[3];
data[i].fen = data[i].times[4]; data[i].fen = data[i].times[4];
data[i].miao = data[i].times[5]; data[i].miao = data[i].times[5];
data[i].datetime = data[i].yue + '-' + data[i].ri + ' ' + data[i].shi + ':' + data[i] data[i].datetime = data[i].yue + '-' + data[i].ri + ' ' + data[i].shi + ':' + data[i].fen
.fen if (data[i].alertContent && data[i].alertContent.indexOf('监测数据名称:') != -1) {
if (data[i].alertContent.indexOf('监测数据名称:') != -1) {
data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '') data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '')
} }
// 如果alertContent是字符串，转换为数组格式
if (typeof data[i].alertContent === 'string') {
data[i].alertContent = [{
name: '告警',
val: data[i].alertContent,
unit: ''
}]
}
} }
this.list = this.list.concat(data) this.list = this.list.concat(data)
this.total = res.data.data.total this.total = res.data.data.total
@ -315,7 +341,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 {
@ -325,11 +350,13 @@
} }
uni.hideLoading(); uni.hideLoading();
this.isRefresher = false this.isRefresher = false
}).catch(err => {
uni.hideLoading();
console.log('获取预警列表失败', err)
}) })
}, },
// 分页加载 // 分页加载
lower() { lower() {
// 最后一页了，取消下拉功能
if (this.isLastpage) { if (this.isLastpage) {
return return
} }
@ -357,11 +384,17 @@
data[i].shi = data[i].times[3]; data[i].shi = data[i].times[3];
data[i].fen = data[i].times[4]; data[i].fen = data[i].times[4];
data[i].miao = data[i].times[5]; data[i].miao = data[i].times[5];
data[i].datetime = data[i].yue + '-' + data[i].ri + ' ' + data[i].shi + ':' + data[i] data[i].datetime = data[i].yue + '-' + data[i].ri + ' ' + data[i].shi + ':' + data[i].fen
.fen if (data[i].alertContent && data[i].alertContent.indexOf('监测数据名称:') != -1) {
if (data[i].alertContent.indexOf('监测数据名称:') != -1) {
data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '') data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '')
} }
if (typeof data[i].alertContent === 'string') {
data[i].alertContent = [{
name: '告警',
val: data[i].alertContent,
unit: ''
}]
}
} }
this.list = this.list.concat(data) this.list = this.list.concat(data)
if (res.data.data.total != 0) { if (res.data.data.total != 0) {
@ -370,7 +403,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 {
@ -378,6 +410,8 @@
this.loadStatus = 'nomore' this.loadStatus = 'nomore'
} }
} }
}).catch(err => {
console.log('加载更多预警失败', err)
}) })
}, },
// 获取评价 // 获取评价
@ -390,94 +424,129 @@
this.pjnr = data[i].detailValue this.pjnr = data[i].detailValue
} }
} }
}).catch(err => {
console.log('获取评价失败', err)
}) })
}, },
// 选择年月日 // 选择年月日
radioChange(e){ radioChange(e) {
this.riqinumber = e.detail.value this.riqinumber = e.detail.value
this.bindDateqsChange(this.datetwo,'twotime') // 更新当前选中的索引
}, this.timList.forEach((item, index) => {
// 趋势时间 if (item.value === e.detail.value) {
bindDateqsChange(e,tiem) { this.current = index
if (tiem=='twotime') {
let selectedDate = e
if (this.riqinumber === 'monthDays') {
this.dateqs = selectedDate.slice(0, 7); // YYYY-MM
} else if (this.riqinumber === 'yearMonth') {
this.dateqs = selectedDate.slice(0, 4); // YYYY
} else {
this.dateqs = selectedDate; // YYYY-MM-DD
}
} else {
let selectedDate = e.detail.value;
if (this.riqinumber === 'monthDays') {
this.dateqs = selectedDate.slice(0, 7); // YYYY-MM
} else if (this.riqinumber === 'yearMonth') {
this.dateqs = selectedDate.slice(0, 4); // YYYY
} else {
this.dateqs = selectedDate; // YYYY-MM-DD
}
} }
})
// 根据选择的模式调整日期格式
let currentDate = new Date()
let year = currentDate.getFullYear()
let month = String(currentDate.getMonth() + 1).padStart(2, '0')
let day = String(currentDate.getDate()).padStart(2, '0')
this.qushicov(); if (this.riqinumber === 'yearMonth') {
this.dateqs = String(year)
} else if (this.riqinumber === 'monthDays') {
this.dateqs = year + '-' + month
} else {
this.dateqs = year + '-' + month + '-' + day
}
this.qushicov()
},
// 趋势时间选择
bindDateqsChange(e) {
let selectedDate = e.detail.value
if (this.riqinumber === 'yearMonth') {
this.dateqs = selectedDate.slice(0, 4)
} else if (this.riqinumber === 'monthDays') {
this.dateqs = selectedDate.slice(0, 7)
} else {
this.dateqs = selectedDate
}
this.qushicov()
}, },
// 趋势接口 // 趋势接口
qushicov() { qushicov() {
// 如果没有站点编码，使用默认值或等待
if (!this.stationCode) {
console.log('站点编码为空，使用默认站点')
if (this.arrays.length > 0) {
this.stationCode = this.arrays[0].value
} else {
// 如果站点还没加载完成，延迟重试
setTimeout(() => {
if (this.arrays.length > 0) {
this.stationCode = this.arrays[0].value
this.qushicov()
}
}, 500)
return
}
}
let data = { let data = {
summrayMode: this.riqinumber, summrayMode: this.riqinumber,
startTime: this.dateqs, startTime: this.dateqs,
stationCode:this.stationCode, stationCode: this.stationCode,
} }
console.log('请求趋势数据参数:', data)
this.$http.post('/applet/survDeviceDeploy/waterIntegrateStatistic', data).then(iem => { this.$http.post('/applet/survDeviceDeploy/waterIntegrateStatistic', data).then(iem => {
let lynum = iem.data.data let lynum = iem.data.data
console.log('趋势数据返回:', lynum)
// 数据为空时显示空图表
if (!lynum || !lynum.tableHead || !lynum.tableData2 || lynum.tableHead.length === 0) {
console.log('趋势数据为空')
this.chartData = {
categories: [],
series: []
}
return
}
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) { // 处理X轴数据
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 - 1]
// 创建显示用的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 - 1) {
return item; return item
} }
return ''; return ''
}); })
} }
// 处理series数据
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
}); })
series.push({ series.push({
name: header.eleDesc, name: header.eleDesc || header.name || '指标',
data: seriesData data: seriesData
}); })
}); })
// 动态计算Y轴范围 // 动态计算Y轴范围
const maxValue = Math.max(...allValues); if (allValues.length > 0) {
const minValue = Math.min(...allValues); const maxValue = Math.max(...allValues)
const minValue = Math.min(...allValues)
const padding = maxValue * 0.1 || 10
const yAxisMax = maxValue + padding
const yAxisMin = Math.max(0, minValue - padding)
// 设置合适的上下边界，增加一些余量
const padding = maxValue * 0.1; // 10%的余量
const yAxisMax = maxValue + padding;
const yAxisMin = Math.max(0, minValue - padding); // 确保最小值不小于0
// 更新opts中的yAxis配置
this.opts = { this.opts = {
...this.opts, ...this.opts,
yAxis: { yAxis: {
@ -486,239 +555,47 @@
data: [ data: [
{ {
min: yAxisMin, min: yAxisMin,
max: yAxisMax max: yAxisMax || 100
} }
] ]
} }
}; }
} }
let res = { this.chartData = {
categories: displayCategories, // 使用处理后的显示数据 categories: displayCategories,
series: series series: series
};
this.chartData = JSON.parse(JSON.stringify(res));
}, 500);
})
},
// 获取折线图
gettj() {
if (!this.stationCode) {
this.stationCode = 'S_1'
} }
this.$http.post('/applet/wxclient/getPplutionSummry?stationCode=' + this.stationCode).then(res => { console.log('图表数据:', this.chartData)
this.zxtdata = res.data.data[0] }, 300)
this.ec.option.legend.data = ['总磷', '总氮', '硝态氮'] }).catch(err => {
this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF'] console.log('趋势数据请求失败', err)
this.ec.option.series = [{ this.chartData = {
name: '总磷', categories: [],
type: 'line', series: []
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] let stationName = this.array[this.index]
for (var i = 0; i < this.arrays.length; i++) { for (var i = 0; i < this.arrays.length; i++) {
if (this.stationName == this.arrays[i].label) { if (stationName == this.arrays[i].label) {
this.stationCode = this.arrays[i].value this.stationCode = this.arrays[i].value
break
} }
} }
// 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]
for (var i = 0; i < this.arrays.length; i++) { for (var i = 0; i < this.arrays1.length; i++) {
if (this.stationName1 == this.arrays1[i].label) { if (this.stationName1 == this.arrays1[i].label) {
this.stationCode1 = this.arrays1[i].value this.stationCode1 = this.arrays1[i].value
break
} }
} }
if (this.stationName1 == '全部监测设备') { if (this.stationName1 == '全部监测设备') {
@ -739,7 +616,6 @@
let year = date.getFullYear(); let year = date.getFullYear();
let month = date.getMonth() + 1; let month = date.getMonth() + 1;
let day = date.getDate(); let day = date.getDate();
if (type === 'start') { if (type === 'start') {
year = year - 10; year = year - 10;
} else if (type === 'end') { } else if (type === 'end') {
@ -755,12 +631,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 +670,6 @@
} }
.ybecharts image { .ybecharts image {
// position: absolute;
width: 90%; width: 90%;
height: 100%; height: 100%;
} }
@ -1009,21 +882,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 +953,6 @@
} }
} }
// .lists_item:first-child {
// padding-top: 0;
// }
.jczbs { .jczbs {
width: 32%; width: 32%;
font-size: 24rpx; font-size: 24rpx;
@ -1096,7 +962,6 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center
} }
.zbz { .zbz {
@ -1108,7 +973,6 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center
} }
.sbsj { .sbsj {
@ -1117,8 +981,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 +996,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 +1006,13 @@
.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 +1027,6 @@
background: rgba(15, 110, 254, 0.1); background: rgba(15, 110, 254, 0.1);
} }
// 选中状态背景
&.checked { &.checked {
background: #0f6efe; background: #0f6efe;
@ -1183,7 +1040,6 @@
transform: scale(0.8); transform: scale(0.8);
margin-right: 8rpx; margin-right: 8rpx;
// 选中状态样式
&[checked] { &[checked] {
color: #ffffff; color: #ffffff;
} }

17
packDetail/pages/sjdyj/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="container"> <view class="container">
<!-- 顶部选项卡 --> <!-- 顶部选项卡 -->
<view class="topScroll"> <!-- <view class="topScroll">
<scroll-view scroll-x="true" class="scroll"> <scroll-view scroll-x="true" class="scroll">
<view class="scroll-item" v-for="(item,index) in topItems" :key="index" @click="chooseClick(item,index)" <view class="scroll-item" v-for="(item,index) in topItems" :key="index" @click="chooseClick(item,index)"
:class="{'scroll-item2':isActive == index}"> :class="{'scroll-item2':isActive == index}">
@ -10,7 +10,7 @@
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
</view> </view> -->
<!-- 监测站告警 --> <!-- 监测站告警 -->
<block v-if="isActive == 0"> <block v-if="isActive == 0">
@ -135,12 +135,13 @@
arrays: [], arrays: [],
isRefresher: false, //下拉刷新状态 isRefresher: false, //下拉刷新状态
reload: '', reload: '',
topItems: [{ topItems: [
dictLabel: '监测站告警' // {
}, // dictLabel: '监测站告警'
{ // },
dictLabel: '异常趋势图' // {
} // dictLabel: '异常趋势图'
// }
], ],
value: 0, value: 0,
rangeList: [], rangeList: [],

2
pages/index/indexData.js
View File

@ -409,7 +409,7 @@ const indexData = {
img: require('../../static/home_icon_jiance.png'), img: require('../../static/home_icon_jiance.png'),
path: '/packDetail/pages/Site/index' path: '/packDetail/pages/Site/index'
}, { }, {
name: '智能告警', name: '智能预警',
img: require('../../static/scd.png'), img: require('../../static/scd.png'),
path: '/packDetail/pages/sjdyj/index' path: '/packDetail/pages/sjdyj/index'
}, },