修改页面样式

This commit is contained in:
978184212@qq.com 2025-11-18 19:16:37 +08:00
parent a47eab0d42
commit 6b37bb3300
7 changed files with 423 additions and 443 deletions

View File

@ -33,6 +33,22 @@
</view> </view>
</picker> </picker>
</view> </view>
<view class="uni-form-item uni-column">
<radio-group name="radio" class="radio-group" @change="radioChange">
<label class="radio-label">
<radio value="radio1" color="#0f6efe" class="radio-item" />
<text class="radio-text"></text>
</label>
<label class="radio-label">
<radio value="radio2" color="#0f6efe" class="radio-item" />
<text class="radio-text"></text>
</label>
<label class="radio-label">
<radio value="radio3" color="#0f6efe" class="radio-item" />
<text class="radio-text"></text>
</label>
</radio-group>
</view>
<view class="qstcontent"> <view class="qstcontent">
<uni-ec-canvas :ec="ec" canvas-id="multi-charts-pie"></uni-ec-canvas> <uni-ec-canvas :ec="ec" canvas-id="multi-charts-pie"></uni-ec-canvas>
</view> </view>
@ -73,7 +89,7 @@
<view class="lists_item" v-for="(item,index) in list" :key="index"> <view class="lists_item" v-for="(item,index) in list" :key="index">
<block> <block>
<view class="jczbs" v-if="item.stationName"> <view class="jczbs" v-if="item.stationName">
{{item.stationName}} {{item.stationName}}
</view> </view>
<view class="jczbs" v-else></view> <view class="jczbs" v-else></view>
</block> </block>
@ -127,7 +143,7 @@
array1: [], array1: [],
arrays: [], arrays: [],
list: [], list: [],
tabList: ['站点名称', '告警指标', '指标值','告警时间'], tabList: ['站点名称', '告警指标', '指标值', '告警时间'],
pjlist: [], pjlist: [],
ec: { ec: {
option: { option: {
@ -182,7 +198,7 @@
'12月' '12月'
], ],
}], }],
yAxis: [{ yAxis: [{
type: 'value' type: 'value'
}], }],
@ -205,8 +221,8 @@
stationName1: '', stationName1: '',
stationCode1: null, stationCode1: null,
stationCode: '', stationCode: '',
arrays1:[], arrays1: [],
zxtdata:[] zxtdata: []
} }
}, },
onLoad() { onLoad() {
@ -216,7 +232,6 @@
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 //px rpx
console.log(this.height, ktxStatusHeight, navigationHeight)
this.scorllheight = this.height this.scorllheight = this.height
} }
}); });
@ -233,12 +248,10 @@
this.array = [] this.array = []
this.arrays = [] this.arrays = []
this.array1 = ['全部监测站点', ] this.array1 = ['全部监测站点', ]
this.arrays1 = [ this.arrays1 = [{
{ label: '全部监测站点',
label:'全部监测站点', value: ''
value:'' }]
}
]
this.$http.get('/applet/survStationInfo/list').then(res => { this.$http.get('/applet/survStationInfo/list').then(res => {
for (var i = 0; i < res.data.data.length; i++) { for (var i = 0; i < res.data.data.length; i++) {
this.arrays.push({ this.arrays.push({
@ -251,7 +264,6 @@
}) })
this.array.push(res.data.data[i].stationName) this.array.push(res.data.data[i].stationName)
this.array1.push(res.data.data[i].stationName) this.array1.push(res.data.data[i].stationName)
// console.log(this.array,this.array1)
} }
}) })
}, },
@ -281,32 +293,26 @@
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.indexOf('监测数据名称:') != -1){ if (data[i].alertContent.indexOf('监测数据名称:') != -1) {
data[i].alertContent = data[i].alertContent.replace('监测数据名称:','') data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '')
} }
} }
this.list = this.list.concat(data) this.list = this.list.concat(data)
this.total = res.data.data.total this.total = res.data.data.total
if (res.data.data.total != 0) { if (res.data.data.total != 0) {
this.allNum = Number(res.data.data.total) / Number(this.pageSize) + ''; this.allNum = Number(res.data.data.total) / Number(this.pageSize) + '';
console.log(this.allNum, '总页数')
if (this.allNum.indexOf('.') == -1) { if (this.allNum.indexOf('.') == -1) {
this.allNum = this.allNum; this.allNum = this.allNum;
console.log(this.allNum, 'if')
} else { } else {
this.allNum = parseInt(Number(this.allNum) + 1); this.allNum = parseInt(Number(this.allNum) + 1);
console.log(this.allNum, 'else')
} }
console.log(this.pageNo, this.allNum, '156156')
if (this.pageNo == this.allNum) { if (this.pageNo == this.allNum) {
this.isLastpage = true; this.isLastpage = true;
this.loadStatus = 'nomore' this.loadStatus = 'nomore'
console.log(this.isLastpage, 'true', 'nomore')
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true // this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
console.log(this.isLastpage, 'false')
} }
} else { } else {
this.isLastpage = true; this.isLastpage = true;
@ -319,7 +325,6 @@
}, },
// //
lower() { lower() {
console.log("最后一页了,取消下拉功能");
// //
if (this.isLastpage) { if (this.isLastpage) {
return return
@ -329,7 +334,6 @@
this.intervalId = setInterval(() => { this.intervalId = setInterval(() => {
num = num + 1; num = num + 1;
}, 1000) }, 1000)
console.log(this.intervalId, num)
this.pageNo = this.pageNo + 1; this.pageNo = this.pageNo + 1;
let params = {} let params = {}
params.pageNo = this.pageNo params.pageNo = this.pageNo
@ -351,8 +355,8 @@
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.indexOf('监测数据名称:') != -1){ if (data[i].alertContent.indexOf('监测数据名称:') != -1) {
data[i].alertContent = data[i].alertContent.replace('监测数据名称:','') data[i].alertContent = data[i].alertContent.replace('监测数据名称:', '')
} }
} }
this.list = this.list.concat(data) this.list = this.list.concat(data)
@ -360,12 +364,10 @@
if (this.pageNo == this.allNum) { if (this.pageNo == this.allNum) {
this.isLastpage = true; this.isLastpage = true;
this.loadStatus = 'nomore' this.loadStatus = 'nomore'
console.log(this.isLastpage, 'true')
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true // this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
console.log(this.isLastpage, 'false')
} }
} else { } else {
this.isLastpage = true; this.isLastpage = true;
@ -386,6 +388,10 @@
} }
}) })
}, },
//
radioChange(e){
console.log("选择年月日.......",e)
},
// 线 // 线
gettj() { gettj() {
if (!this.stationCode) { if (!this.stationCode) {
@ -393,94 +399,91 @@
} }
this.$http.post('/applet/wxclient/getPplutionSummry?stationCode=' + this.stationCode).then(res => { this.$http.post('/applet/wxclient/getPplutionSummry?stationCode=' + this.stationCode).then(res => {
this.zxtdata = res.data.data[0] this.zxtdata = res.data.data[0]
console.log(this.array[this.index],'弄哦文') this.ec.option.legend.data = ['总磷', '总氮', '硝态氮']
this.ec.option.legend.data = ['总磷', '总氮','硝态氮'] this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF']
this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF'] this.ec.option.series = [{
this.ec.option.series = [ name: '总磷',
{ type: 'line',
name: '总磷', stack: 'Total1',
type: 'line', areaStyle: { //
stack: 'Total1', color: {
areaStyle: { // type: 'linear',
color: { x: 0,
type: 'linear', y: 0,
x: 0, x2: 0,
y: 0, y2: 1,
x2: 0, colorStops: [{
y2: 1, offset: 0,
colorStops: [{ color: 'rgba(25, 213, 138, 1)' // 0%
offset: 0, }, {
color: 'rgba(25, 213, 138, 1)' // 0% offset: 1,
}, { color: 'rgba(255, 255, 255, 1)' // 100%
offset: 1, }],
color: 'rgba(255, 255, 255, 1)' // 100% global: false // false
}], }
global: false // false
}
},
emphasis: {
focus: 'series'
},
data: this.zxtdata.TPSummry
}, },
{ emphasis: {
name: '总氮', focus: 'series'
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
}, },
{ data: this.zxtdata.TPSummry
name: '硝态氮', },
type: 'line', {
stack: 'Total3', name: '总氮',
areaStyle: { // type: 'line',
color: { stack: 'Total2',
type: 'linear', areaStyle: { //
x: 0, color: {
y: 0, type: 'linear',
x2: 0, x: 0,
y2: 1, y: 0,
colorStops: [{ x2: 0,
offset: 0, y2: 1,
color: 'rgba(59, 160, 255, 1)' // 0% colorStops: [{
}, { offset: 0,
offset: 1, color: 'rgba(255, 197, 59, 1)' // 0%
color: 'rgba(255, 255, 255, 1)' // 100% }, {
}], offset: 1,
global: false // false color: 'rgba(255, 255, 255, 1)' // 100%
} }],
}, global: false // false
emphasis: { }
focus: 'series'
},
data: this.zxtdata.NOSummry
}, },
] emphasis: {
if(this.array[this.index].indexOf('畜禽') != -1){ focus: 'series'
this.ec.option.legend.data = ['总磷', '总氮','COD','氨氮'] },
this.ec.option.color = ['#19D58A', '#FFC53B', '#3BA0FF','#FF3B3B'] data: this.zxtdata.TNSummry
this.ec.option.series = [ },
{ {
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: '总磷', name: '总磷',
type: 'line', type: 'line',
stack: 'Total1', stack: 'Total1',
@ -590,7 +593,6 @@
}, },
// 线 // 线
bindPickerChange: function(e) { bindPickerChange: function(e) {
console.log('picker发送选择改变携带值为', e.detail.value)
this.index = e.detail.value this.index = e.detail.value
this.stationName = this.array[this.index] this.stationName = this.array[this.index]
for (var i = 0; i < this.arrays.length; i++) { for (var i = 0; i < this.arrays.length; i++) {
@ -602,7 +604,6 @@
}, },
// //
bindPickerChange1: function(e) { bindPickerChange1: function(e) {
console.log('picker发送选择改变携带值为', e.detail.value)
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.arrays.length; i++) {
@ -876,22 +877,25 @@
padding-bottom: 26rpx; padding-bottom: 26rpx;
} }
.tabitem:first-child{ .tabitem:first-child {
width: 31%; width: 31%;
// text-align: center // text-align: center
} }
.tabitem:nth-child(2){
.tabitem:nth-child(2) {
width: 27%; width: 27%;
// text-align: center // text-align: center
} }
.tabitem:nth-child(3){
.tabitem:nth-child(3) {
width: 19%; width: 19%;
// text-align: center // text-align: center
} }
.tabitem:nth-child(4){
flex:1 .tabitem:nth-child(4) {
// text-align: center flex: 1 // text-align: center
} }
.scroll-Y { .scroll-Y {
box-sizing: border-box; box-sizing: border-box;
} }
@ -955,6 +959,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
// text-align: center // text-align: center
} }
.load { .load {
// height: 50rpx; // height: 50rpx;
// line-height: 50rpx; // line-height: 50rpx;
@ -965,4 +970,65 @@
.pagebot { .pagebot {
height: 100rpx; height: 100rpx;
} }
//
.radio-group {
display: flex;
justify-content: space-around;
margin: 20rpx 32rpx 0;
background: #F6F9FF;
border-radius: 16rpx;
.radio-label {
display: flex;
align-items: center;
padding: 16rpx 32rpx;
border-radius: 12rpx;
transition: all 0.3s ease;
&:active {
background: rgba(15, 110, 254, 0.1);
}
.radio-item {
transform: scale(0.9);
//
&.radio-checked {
background-color: #0f6efe;
border-color: #0f6efe;
}
}
.radio-text {
font-size: 28rpx;
font-family: Source Han Sans SC;
font-weight: 500;
color: #667482;
margin-left: 16rpx;
transition: color 0.3s ease;
}
//
// .radio-item[checked] + .radio-text {
// color: #0f6efe;
// font-weight: 600;
// }
}
}
//
@media (prefers-color-scheme: dark) {
.radio-group {
background: #1a1a1a;
.radio-label {
.radio-text {
color: #999;
}
.radio-item[checked] + .radio-text {
color: #0f6efe;
}
}
}
}
</style> </style>

View File

@ -11,63 +11,28 @@
</scroll-view> </scroll-view>
</view> </view>
<block v-if="isActive == 1"> <block v-if="isActive == 1">
<view class="searchbox"> <view class="liebiaos" v-if="">
<image src="../../static/meishi_icon_sousuo.png" mode=""></image> <view class="searchbox">
<input class="search_input" v-model="deviceNo" placeholder="请输入要搜索的设备编号"> <view class="uni-px-8 uni-pb-8">
<view class="searchbutton" @click="changenr()"> <text>设备选择</text>
搜索 <uni-data-select v-model="value" :localdata="rangeList" @change="change"></uni-data-select>
</view>
<view class="example-body">
<text>时间区间</text>
<uni-datetime-picker v-model="rangetime" type="daterange" @maskClick="maskClick" />
</view>
</view> </view>
</view> </view>
<view class="liebiaos" v-if="List.length != 0"> <!-- <view class="zwsj" v-else>
<scroll-view :style="{height:scorllheight + 'rpx'}" scroll-y="true" class="scroll-Y" @scrolltolower="lower">
<view class="itembox" v-for="(item,index) in List" :key="index">
<view class="itembox_top">
<view class="itembox_lef" v-if="item.deviceNo">
<!-- <image src="../../static/fz.png" mode=""></image> -->
<view class="title">
编号{{item.deviceNo}}
</view>
</view>
</view>
<view class="itembox_bot">
<view class="bot_item" v-if="item.flg">
<span class="nrbt">报警原因:</span>
<view class="bj" v-if="item.deviceStatus == 1">
{{item.flg}}
</view>
<view class="jcbj" v-if="item.deviceStatus == 0">
{{item.flg}}
</view>
</view>
<view class="bot_item" v-if="item.userDeviceNo">
<span class="nrbt">用户设备编号:</span>
<span class="number">{{item.userDeviceNo}}</span>
</view>
<view class="bot_item" v-if="item.alertTime">
<span class="nrbt" v-if="item.deviceStatus == 1">报警时间:</span>
<span class="nrbt" v-if="item.deviceStatus == 0">解除时间:</span>
{{item.alertTime}}
</view>
<view class="bot_item" v-if="item.reveiveTime">
<span class="nrbt">上报时间:</span>
{{item.reveiveTime}}
</view>
</view>
</view>
<view class="load">
<uni-load-more :status="loadStatus"></uni-load-more>
</view>
</scroll-view>
</view>
<view class="zwsj" v-else>
<view class="inzwsj"> <view class="inzwsj">
<image src="../../static/zwsj.png" mode="" class="zwsjimg"></image> <image src="../../static/zwsj.png" mode="" class="zwsjimg"></image>
<view class="zwsjtext"> <view class="zwsjtext">
暂无数据 暂无数据
</view> </view>
</view> </view>
</view> </view> -->
</block> </block>
<!-- 监测站告警 -->
<block v-else-if="isActive == 0"> <block v-else-if="isActive == 0">
<view class="liebiaos" v-if="List.length != 0"> <view class="liebiaos" v-if="List.length != 0">
<scroll-view :style="{height:scorllheights + 'rpx'}" scroll-y="true" class="scroll-Y" @scrolltolower="lower"> <scroll-view :style="{height:scorllheights + 'rpx'}" scroll-y="true" class="scroll-Y" @scrolltolower="lower">
@ -171,7 +136,12 @@
dictLabel:'异常趋势图' dictLabel:'异常趋势图'
} }
], ],
value:0,
rangeList: [],
isActive:0, isActive:0,
rangetime: [Date.now(), Date.now()],
deployId:'',
resolt:[],
} }
}, },
onLoad() { onLoad() {
@ -181,7 +151,6 @@
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//px rpx
console.log(this.height,ktxStatusHeight,navigationHeight)
this.scorllheight = this.height - 174 this.scorllheight = this.height - 174
this.scorllheights = this.height - 90 this.scorllheights = this.height - 90
} }
@ -195,12 +164,19 @@
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//px rpx
console.log(this.height,ktxStatusHeight,navigationHeight)
this.scorllheight = this.height - 174 this.scorllheight = this.height - 174
this.scorllheights = this.height - 90 this.scorllheights = this.height - 90
} }
}); });
}, },
watch: {
rangetime(newval) {
console.log('范围选:', this.rangetime);
this.startTime = this.rangetime[0]
this.endTime = this.rangetime[1]
this.qushiList()
},
},
methods:{ methods:{
// //
refresherrefreshFun() { refresherrefreshFun() {
@ -218,6 +194,9 @@
this.pageNo = 1 this.pageNo = 1
this.deviceNo = '' this.deviceNo = ''
this.getList() this.getList()
if(index==1){
this.sbeiList()
}
}, },
getList(){ getList(){
var params = {} var params = {}
@ -238,36 +217,21 @@
this.$http.get(url,{params:params}).then(res =>{ this.$http.get(url,{params:params}).then(res =>{
if(res.data.code == 0){ if(res.data.code == 0){
var data = res.data.data.records var data = res.data.data.records
// for(var i=0;i<data.length;i++){
// if(data[i].alertContent){
// for(var j=0;j<data[i].alertContent.length;j++){
// data[i].alertContent[j] = JSON.parse(data[i].alertContent[j])
// console.log(data[i].alertContent[j])
// }
// console.log(data[i].alertContent)
// }
// }
this.List = this.List.concat(data) this.List = this.List.concat(data)
if(res.data.data.total != 0){ if(res.data.data.total != 0){
this.allNum = Number(res.data.data.total)/Number(this.pageSize)+''; this.allNum = Number(res.data.data.total)/Number(this.pageSize)+'';
console.log(this.allNum,'总页数')
if(this.allNum.indexOf('.') == -1) { if(this.allNum.indexOf('.') == -1) {
this.allNum = this.allNum; this.allNum = this.allNum;
console.log(this.allNum,'if')
} else { } else {
this.allNum = parseInt(Number(this.allNum)+1); this.allNum = parseInt(Number(this.allNum)+1);
console.log(this.allNum,'else')
} }
console.log(this.pageNo,this.allNum,'156156')
if(this.pageNo == this.allNum) { if(this.pageNo == this.allNum) {
this.isLastpage = true; this.isLastpage = true;
this.loadStatus='nomore' this.loadStatus='nomore'
console.log(this.isLastpage,'true','nomore')
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true // this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
console.log(this.isLastpage,'false')
} }
}else{ }else{
this.isLastpage = true; this.isLastpage = true;
@ -279,7 +243,6 @@
}) })
}, },
lower() { lower() {
console.log("最后一页了,取消下拉功能");
// //
if (this.isLastpage) { if (this.isLastpage) {
return return
@ -289,7 +252,6 @@
this.intervalId = setInterval(() => { this.intervalId = setInterval(() => {
num = num+1; num = num+1;
},1000) },1000)
console.log(this.intervalId,num)
this.pageNo = this.pageNo + 1; this.pageNo = this.pageNo + 1;
var params = {} var params = {}
params.pageNo = this.pageNo params.pageNo = this.pageNo
@ -305,26 +267,15 @@
this.$http.get(url,{params:params}).then(res =>{ this.$http.get(url,{params:params}).then(res =>{
if(res.data.code == 0){ if(res.data.code == 0){
var data = res.data.data.records var data = res.data.data.records
// for(var i=0;i<data.length;i++){
// if(data[i].alertContent){
// for(var j=0;j<data[i].alertContent.length;j++){
// data[i].alertContent[j] = JSON.parse(data[i].alertContent[j])
// console.log(data[i].alertContent[j])
// }
// console.log(data[i].alertContent)
// }
// }
this.List = this.List.concat(data) this.List = this.List.concat(data)
if(res.data.data.total != 0){ if(res.data.data.total != 0){
if(this.pageNo == this.allNum) { if(this.pageNo == this.allNum) {
this.isLastpage = true; this.isLastpage = true;
this.loadStatus='nomore' this.loadStatus='nomore'
console.log(this.isLastpage,'true')
} else { } else {
this.isLastpage = false; this.isLastpage = false;
// this.isLoadMore=true // this.isLoadMore=true
this.loadStatus = 'more' this.loadStatus = 'more'
console.log(this.isLastpage,'false')
} }
}else{ }else{
this.isLastpage = true; this.isLastpage = true;
@ -334,10 +285,58 @@
}) })
}, },
changenr(){ changenr(){
console.log(this.deviceNo)
this.pageNo = 1 this.pageNo = 1
this.getList() this.getList()
}, },
//
qushiList(){
const data = {
deployId:this.deployId,
startTime:this.startTime,
endTime:this.endTime,
}
this.$http.post('/applet/survAlertRecord/alertSummary',data).then(res => {
console.log("趋势数据",res.data.data)
let ovelit = res.data.data
this.resolt = ovelit.itemList.map(item=>{
return {
...item,
data:ovelit.dataMap[item.entity] || []
}
})
console.log("666666666666",this.resolt)
})
},
sbeiList(){
uni.showLoading({
title: '加载中'
});
this.$http.get('/applet/survDeviceDeploy/deviceList?stationCode=').then(res =>{
let sbList = []
this.rangeList = res.data.data.map((lit,index)=>{
return{
"value":index,
"text":lit.deployDes,
"id":lit.id,
}
})
this.deployId = this.rangeList[this.value].id
this.qushiList()
uni.hideLoading();
})
},
// deployid
change(e) {
console.log("单选值", this.rangeList[this.value].id)
this.deployId = this.rangeList[this.value].id
// this.sbeiList()
},
//
maskClick(e){
console.log('maskClick事件:', e);
this.startTime = e[0]
this.endTime = e[1]
}
} }
} }
</script> </script>
@ -345,37 +344,18 @@
<style lang="scss"> <style lang="scss">
page{ page{
height: 100%; height: 100%;
// background-color: #fff;
} }
.container{ .container{
height: 100%; height: 100%;
} }
.topcheck{
display: flex;
justify-content: space-between;
padding: 20rpx 0;
border-bottom: 1rpx solid #ededed;
background-color: white;
}
.left{
width: 50%;
display: flex;
justify-content: center;
}
.right{
width: 50%;
border-left: 4rpx solid #ededed;
display: flex;
justify-content: center;
}
.searchbox{ .searchbox{
height: 88rpx; height: 148rpx;
padding: 15rpx 30rpx; padding: 15rpx 30rpx;
// padding: 30rpx;
background-color: white; background-color: white;
position: relative; position: relative;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.search_input{ .search_input{
border: none; border: none;
@ -391,7 +371,6 @@
height: 32rpx; height: 32rpx;
position: absolute; position: absolute;
left: 40rpx; left: 40rpx;
// top: 24%;
top:35%; top:35%;
z-index: 99; z-index: 99;
} }
@ -410,15 +389,6 @@
.itembox:first-child{ .itembox:first-child{
margin-top: 0; margin-top: 0;
} }
.uni-input{
display: flex;
align-items: center;
}
.uni-input image{
height: 12rpx;
width: 24rpx;
margin-left: 5rpx;
}
.itembox_top{ .itembox_top{
display: flex; display: flex;
align-items: center; align-items: center;
@ -437,32 +407,8 @@
font-weight: 500; font-weight: 500;
width: 63%; width: 63%;
} }
.caozuo{ .title{
height: 100%; font-weight: bold;
display: flex;
align-items: center;
flex:1;
justify-content: flex-end;
}
.caozuo image{
width: 7rpx;
height: 29rpx;
z-index: 99;
}
.bot_item{
margin-top: 30rpx;
display: flex;
}
.nrbt{
color: #898989;
margin-right: 10rpx;
min-width: 120rpx;
}
.number{
// color: #ff6563;
}
.numbers{
color:#26bf64;
} }
.load{ .load{
height: 100rpx; height: 100rpx;
@ -470,21 +416,6 @@
text-align: center; text-align: center;
color: #c6c6c6; color: #c6c6c6;
} }
.add{
height: 150rpx;
width: 150rpx;
position: fixed;
bottom: 100rpx;
right: 60rpx;
}
.popup{
background-color: white;
height: 100%;
width: 100%;
}
.title{
font-weight: bold;
}
.zwsj{ .zwsj{
width: 100%; width: 100%;
display: flex; display: flex;
@ -507,35 +438,14 @@
line-height: 31rpx; line-height: 31rpx;
text-align: center; text-align: center;
} }
.bj{
padding: 6rpx 12rpx;
border-radius: 6rpx;
font-size: 24rpx;
font-family: Source Han Sans SC;
font-weight: 500;
color: #FFFFFF;
background-color: #FF4242;
}
.jcbj{
padding: 6rpx 12rpx;
border-radius: 6rpx;
font-size: 24rpx;
font-family: Source Han Sans SC;
font-weight: 500;
color: #FFFFFF;
background-color: #26bf64;
}
.topScroll{ .topScroll{
width: 100%; width: 100%;
height: 85rpx; height: 85rpx;
background-color: #fff; background-color: #fff;
border-bottom: 1rpx solid #ededed; border-bottom: 1rpx solid #ededed;
// line-height: 80rpx;
// padding:0 32rpx;
} }
.scroll{ .scroll{
height: 85rpx; height: 85rpx;
// line-height: 80rpx;
display: flex; display: flex;
white-space: nowrap; white-space: nowrap;
justify-content: space-between; justify-content: space-between;
@ -547,26 +457,12 @@
display: inline-block; display: inline-block;
font-size: 28rpx; font-size: 28rpx;
font-family: Source Han Sans SC; font-family: Source Han Sans SC;
// border-bottom: 2rpx solid #ededed;
// font-weight: 500;
// color: #545C6C;
}
.scroll-item:first-child{
border-right: 4rpx solid #ededed;
// border-bottom: 2rpx solid #ededed;
// border-right: 2rpx solid #ededed;
} }
.scroll-item2{ .scroll-item2{
font-size: 30rpx; font-size: 30rpx;
font-family: Source Han Sans SC; font-family: Source Han Sans SC;
// font-weight: bold;
color: #0F6EFF; color: #0F6EFF;
} }
.initem{
display: flex;
flex-direction: column;
// border-bottom: 2rpx solid #ededed;
}
.zliebs{ .zliebs{
width: 100rpx; width: 100rpx;
height: 4rpx; height: 4rpx;
@ -575,7 +471,6 @@
border-radius: 20rpx; border-radius: 20rpx;
} }
.lists_item { .lists_item {
// padding-top: 35rpx;
padding: 0rpx 0rpx 16rpx 0rpx; padding: 0rpx 0rpx 16rpx 0rpx;
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
@ -589,7 +484,6 @@
font-family: Source Han Sans SC; font-family: Source Han Sans SC;
font-weight: 400; font-weight: 400;
color: #667482; color: #667482;
// text-align: center
} }
.zbz { .zbz {
@ -597,24 +491,6 @@
font-size: 24rpx; font-size: 24rpx;
font-family: DIN Next LT Pro; font-family: DIN Next LT Pro;
font-weight: 400; font-weight: 400;
// color: #2FCD81;
// text-align: center
}
.zbzs {
color: #2FCD81;
}
.szqs {
width: 53rpx;
display: flex;
align-items: center;
justify-content: center;
}
.szqs image {
width: 24rpx;
height: 31rpx;
} }
.sbsj { .sbsj {
@ -625,8 +501,6 @@
width: 23%; width: 23%;
display: flex; display: flex;
align-items: center; align-items: center;
// text-align: center
// text-align: right;
} }
.zximg{ .zximg{
width: 30rpx; width: 30rpx;
@ -659,39 +533,17 @@
.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: 23%; width: 23%;
// text-align: center
} }
.tabitem:nth-child(4){ .tabitem:nth-child(4){
flex:1 flex:1
// text-align: center
}
.topcheck{
display: flex;
justify-content: space-between;
padding: 20rpx 0;
border-bottom: 1rpx solid #ededed;
background-color: white;
}
.left{
width: 50%;
display: flex;
justify-content: center;
}
.right{
width: 50%;
border-left: 4rpx solid #ededed;
display: flex;
justify-content: center;
} }
.itembox_right{ .itembox_right{
font-size: 26rpx; font-size: 26rpx;
} }
</style> </style>

View File

@ -1,3 +1,25 @@
## 2.0.122025-08-26
- 优化 uni-app x 下 size 类型问题
## 2.0.112025-08-18
- 修复 图标点击事件返回
## 2.0.92024-01-12
fix: 修复图标大小默认值错误的问题
## 2.0.82023-12-14
- 修复 项目未使用 ts 情况下打包报错的bug
## 2.0.72023-12-14
- 修复 size 属性为 string 时不加单位导致尺寸异常的bug
## 2.0.62023-12-11
- 优化 兼容老版本icon类型如 top bottom 等
## 2.0.52023-12-11
- 优化 兼容老版本icon类型如 top bottom 等
## 2.0.42023-12-06
- 优化 uni-app x 下示例项目图标排序
## 2.0.32023-12-06
- 修复 nvue下引入组件报错的bug
## 2.0.22023-12-05
-优化 size 属性支持单位
## 2.0.12023-12-05
- 新增 uni-app x 支持定义图标
## 1.3.52022-01-24 ## 1.3.52022-01-24
- 优化 size 属性可以传入不带单位的字符串数值 - 优化 size 属性可以传入不带单位的字符串数值
## 1.3.42022-01-24 ## 1.3.42022-01-24

View File

@ -1,24 +1,28 @@
<template> <template>
<!-- #ifdef APP-NVUE --> <!-- #ifdef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text> <text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text>
<!-- #endif --> <!-- #endif -->
<!-- #ifndef APP-NVUE --> <!-- #ifndef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text> <text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick">
<slot></slot>
</text>
<!-- #endif --> <!-- #endif -->
</template> </template>
<script> <script>
import icons from './icons.js'; import { fontData } from './uniicons_file_vue.js';
const getVal = (val) => { const getVal = (val) => {
const reg = /^[0-9]*$/g const reg = /^[0-9]*$/g
return (typeof val === 'number' || reg.test(val) )? val + 'px' : val; return (typeof val === 'number' || reg.test(val)) ? val + 'px' : val;
} }
// #ifdef APP-NVUE // #ifdef APP-NVUE
var domModule = weex.requireModule('dom'); var domModule = weex.requireModule('dom');
import iconUrl from './uniicons.ttf' import iconUrl from './uniicons.ttf'
domModule.addRule('fontFace', { domModule.addRule('fontFace', {
'fontFamily': "uniicons", 'fontFamily': "uniicons",
'src': "url('"+iconUrl+"')" 'src': "url('" + iconUrl + "')"
}); });
// #endif // #endif
@ -34,7 +38,7 @@
*/ */
export default { export default {
name: 'UniIcons', name: 'UniIcons',
emits:['click'], emits: ['click'],
props: { props: {
type: { type: {
type: String, type: String,
@ -48,31 +52,41 @@
type: [Number, String], type: [Number, String],
default: 16 default: 16
}, },
customPrefix:{ customPrefix: {
type: String,
default: ''
},
fontFamily: {
type: String, type: String,
default: '' default: ''
} }
}, },
data() { data() {
return { return {
icons: icons.glyphs icons: fontData
} }
}, },
computed:{ computed: {
unicode(){ unicode() {
let code = this.icons.find(v=>v.font_class === this.type) let code = this.icons.find(v => v.font_class === this.type)
if(code){ if (code) {
return unescape(`%u${code.unicode}`) return code.unicode
} }
return '' return ''
}, },
iconSize(){ iconSize() {
return getVal(this.size) return getVal(this.size)
},
styleObj() {
if (this.fontFamily !== '') {
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};`
}
return `color: ${this.color}; font-size: ${this.iconSize};`
} }
}, },
methods: { methods: {
_onClick() { _onClick(e) {
this.$emit('click') this.$emit('click', e)
} }
} }
} }
@ -81,9 +95,10 @@
<style lang="scss"> <style lang="scss">
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
@import './uniicons.css'; @import './uniicons.css';
@font-face { @font-face {
font-family: uniicons; font-family: uniicons;
src: url('./uniicons.ttf') format('truetype'); src: url('./uniicons.ttf');
} }
/* #endif */ /* #endif */
@ -92,5 +107,4 @@
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
} }
</style>
</style>

View File

@ -1,3 +1,12 @@
.uniui-cart-filled:before {
content: "\e6d0";
}
.uniui-gift-filled:before {
content: "\e6c4";
}
.uniui-color:before { .uniui-color:before {
content: "\e6cf"; content: "\e6cf";
} }
@ -58,10 +67,6 @@
content: "\e6c3"; content: "\e6c3";
} }
.uniui-gift-filled:before {
content: "\e6c4";
}
.uniui-fire-filled:before { .uniui-fire-filled:before {
content: "\e6c5"; content: "\e6c5";
} }
@ -82,6 +87,18 @@
content: "\e698"; content: "\e698";
} }
.uniui-arrowthinleft:before {
content: "\e6d2";
}
.uniui-arrowthinup:before {
content: "\e6d3";
}
.uniui-arrowthindown:before {
content: "\e6d4";
}
.uniui-back:before { .uniui-back:before {
content: "\e6b9"; content: "\e6b9";
} }
@ -94,55 +111,43 @@
content: "\e6bb"; content: "\e6bb";
} }
.uniui-arrowthinright:before {
content: "\e6bb";
}
.uniui-arrow-left:before { .uniui-arrow-left:before {
content: "\e6bc"; content: "\e6bc";
} }
.uniui-arrowthinleft:before {
content: "\e6bc";
}
.uniui-arrow-up:before { .uniui-arrow-up:before {
content: "\e6bd"; content: "\e6bd";
} }
.uniui-arrowthinup:before {
content: "\e6bd";
}
.uniui-arrow-down:before { .uniui-arrow-down:before {
content: "\e6be"; content: "\e6be";
} }
.uniui-arrowthindown:before { .uniui-arrowthinright:before {
content: "\e6be"; content: "\e6d1";
}
.uniui-down:before {
content: "\e6b8";
} }
.uniui-bottom:before { .uniui-bottom:before {
content: "\e6b8"; content: "\e6b8";
} }
.uniui-arrowdown:before { .uniui-arrowright:before {
content: "\e6b8"; content: "\e6d5";
} }
.uniui-right:before { .uniui-right:before {
content: "\e6b5"; content: "\e6b5";
} }
.uniui-arrowright:before { .uniui-up:before {
content: "\e6b5";
}
.uniui-top:before {
content: "\e6b6"; content: "\e6b6";
} }
.uniui-arrowup:before { .uniui-top:before {
content: "\e6b6"; content: "\e6b6";
} }
@ -150,8 +155,8 @@
content: "\e6b7"; content: "\e6b7";
} }
.uniui-arrowleft:before { .uniui-arrowup:before {
content: "\e6b7"; content: "\e6d6";
} }
.uniui-eye:before { .uniui-eye:before {
@ -638,10 +643,6 @@
content: "\e627"; content: "\e627";
} }
.uniui-cart-filled:before {
content: "\e629";
}
.uniui-checkbox:before { .uniui-checkbox:before {
content: "\e62b"; content: "\e62b";
} }

View File

@ -1,7 +1,7 @@
{ {
"id": "uni-icons", "id": "uni-icons",
"displayName": "uni-icons 图标", "displayName": "uni-icons 图标",
"version": "1.3.5", "version": "2.0.12",
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。", "description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。",
"keywords": [ "keywords": [
"uni-ui", "uni-ui",
@ -11,16 +11,14 @@
], ],
"repository": "https://github.com/dcloudio/uni-ui", "repository": "https://github.com/dcloudio/uni-ui",
"engines": { "engines": {
"HBuilderX": "^3.2.14" "HBuilderX": "^3.2.14",
"uni-app": "^4.08",
"uni-app-x": "^4.61"
}, },
"directories": { "directories": {
"example": "../../temps/example_temps" "example": "../../temps/example_temps"
}, },
"dcloudext": { "dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": { "sale": {
"regular": { "regular": {
"price": "0.00" "price": "0.00"
@ -37,48 +35,75 @@
"data": "无", "data": "无",
"permissions": "无" "permissions": "无"
}, },
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue",
"darkmode": "x",
"i18n": "x",
"widescreen": "x"
}, },
"uni_modules": { "uni_modules": {
"dependencies": ["uni-scss"], "dependencies": [
"uni-scss"
],
"encrypt": [], "encrypt": [],
"platforms": { "platforms": {
"cloud": { "cloud": {
"tcb": "y", "tcb": "x",
"aliyun": "y" "aliyun": "x",
"alipay": "x"
}, },
"client": { "client": {
"App": { "uni-app": {
"app-vue": "y", "vue": {
"app-nvue": "y" "vue2": "√",
"vue3": "√"
},
"web": {
"safari": "√",
"chrome": "√"
},
"app": {
"vue": "√",
"nvue": "-",
"android": {
"extVersion": "",
"minVersion": "29"
},
"ios": "√",
"harmony": "√"
},
"mp": {
"weixin": "√",
"alipay": "√",
"toutiao": "√",
"baidu": "√",
"kuaishou": "-",
"jd": "-",
"harmony": "-",
"qq": "√",
"lark": "-"
},
"quickapp": {
"huawei": "√",
"union": "√"
}
}, },
"H5-mobile": { "uni-app-x": {
"Safari": "y", "web": {
"Android Browser": "y", "safari": "√",
"微信浏览器(Android)": "y", "chrome": "√"
"QQ浏览器(Android)": "y" },
}, "app": {
"H5-pc": { "android": {
"Chrome": "y", "extVersion": "",
"IE": "y", "minVersion": "29"
"Edge": "y", },
"Firefox": "y", "ios": "√",
"Safari": "y" "harmony": "√"
}, },
"小程序": { "mp": {
"微信": "y", "weixin": "√"
"阿里": "y", }
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
} }
} }
} }