<template>
|
<view>
|
<!-- <view class="place"></view> -->
|
<view class="main">
|
<view class="itme-box">
|
<view class="h-table">
|
<view class="h-tr h-tr-6 h-thead ">
|
<view class="h-td column-0">序号</view>
|
<view class="h-td column-1">水库</view>
|
<view class="h-td column-2">测点</view>
|
<view class="h-td column-3">时间</view>
|
<view class="h-td column-4">渗透压力(kpa)</view>
|
<view class="h-td column-5">渗压水位(m)</view>
|
</view>
|
<scroll-view scroll-y style="height: 74vh;width: 100%;" @scrolltolower="scrolltolower">
|
<view class="h-tr h-tr-6" v-for="(item,index) in tableList" :key="index">
|
<view class="h_box h-tr h-tr-6">
|
<view class="h-td column-0">{{index+1}}</view>
|
<view class="h-td column-1 name ">
|
<view @click.stop="goReservoirDetail(item)"> {{item.res_nm}}</view>
|
</view>
|
<view class="h-td column-2">{{item.cd}}</view>
|
<view class="h-td column-3">{{item.tm}}</view>
|
<view class="h-td column-4">{{item.oms_pressure}}</view>
|
<view class="h-td column-5">{{item.sw_val}}</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
</view>
|
<u-loading-icon text="加载中" textSize="18" :show="showLoading"></u-loading-icon>
|
</view>
|
<u-loading-page :loading="pageLoading"></u-loading-page>
|
</view>
|
</template>
|
|
<script>
|
import {
|
getSyList
|
} from "@/api/dataCenter/dbSafety/dbSafety"
|
export default {
|
props: {
|
res_nm: {
|
type: String,
|
default: "",
|
},
|
},
|
data() {
|
return {
|
tableList: [],
|
isShow: false,
|
pages: {
|
pageNo: 1,
|
pageSize: 25
|
},
|
region: {},
|
showLoading: false,
|
pageLoading: false,
|
}
|
},
|
created() {
|
this.getSyListData()
|
},
|
options: {
|
styleIsolation: 'shared'
|
},
|
methods: {
|
showCity() {
|
this.isShow = !this.isShow
|
},
|
|
getSyListData() {
|
let regionData = uni.getStorageSync("adCodeBase")
|
if (!regionData) return
|
let params = {
|
pageSize: this.pages.pageSize,
|
pageNo: this.pages.pageNo,
|
res_nm: this.res_nm
|
}
|
if (!this.region.label && !this.region.value) {
|
if (regionData.adGrad == 1) {
|
params.province_cd = regionData.adCode
|
} else if (regionData.adGrad == 2) {
|
params.city_cd = regionData.adCode
|
} else if (regionData.adGrad == 3) {
|
params.county_cd = regionData.adCode
|
}
|
params.bas_guid = this.region.name
|
} else {
|
params[this.region.label] = this.region.value
|
params.bas_guid = this.region.name
|
}
|
this.getSyList(params)
|
},
|
|
// 渗压列表
|
getSyList(params) {
|
this.pageLoading = true
|
getSyList(params).then(res => {
|
console.log(res, "res====")
|
this.tableList = res.data.data
|
this.tableList.forEach(e => {
|
e.tm = e.tm.substring(5, 16)
|
// let tm = new Date(e.tm)
|
// let formatter = dateFormat(tm, 'MM-dd hh:mm')
|
// e.tm = formatter
|
})
|
this.pageLoading = false
|
uni.stopPullDownRefresh()
|
})
|
},
|
|
scrolltolower() {
|
this.pages.pageNo += 1
|
this.showLoading = true
|
let params = {
|
pageSize: this.pages.pageSize,
|
pageNo: this.pages.pageNo,
|
res_nm: this.res_nm
|
}
|
|
|
params[this.region.label] = this.region.value
|
getSyList(params).then(res => {
|
let data = res.data.data
|
data.forEach(v => {
|
v.tm = v.tm.substring(5, 16)
|
})
|
this.tableList = this.tableList.concat(data)
|
this.showLoading = false
|
})
|
},
|
|
// 搜索
|
search() {
|
this.pages.pageNo = 1
|
this.getSyListData()
|
},
|
|
|
//跳转到水库详情页
|
goReservoirDetail(item) {
|
let data = {
|
id: item.res_cd,
|
name: item.res_nm
|
}
|
let dataStr = JSON.stringify(data)
|
let url = "/subPackage/realtimeMonitor/reservoir/detail?item=" + dataStr
|
this.$u.func.globalNavigator(url, "navTo")
|
},
|
|
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
/* 引入表格样式表 */
|
@import "@/subPackage/rainWaterCondition/static/style/helang-table.scss";
|
|
::v-deep .h-table .h-tr {
|
flex-wrap: wrap;
|
}
|
|
.place {
|
height: 200rpx;
|
}
|
|
|
.h-table {
|
.h-thead {
|
color: #51A4FA;
|
background-color: #E1F3FF;
|
justify-content: space-between;
|
}
|
|
.h-td {
|
border-right-width: 0;
|
font-size: 25rpx;
|
}
|
|
.show_city {
|
width: 100% !important;
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
padding: 0 26rpx;
|
background: #f5f5f5;
|
transition: width 150ms ease-in;
|
}
|
|
.h_box {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
width: 100%;
|
}
|
|
.h-tr {
|
border-width: 0;
|
text-align: center;
|
|
.column-0 {
|
width: 10%;
|
}
|
|
.column-1 {
|
width: 24%;
|
}
|
|
.column-2 {
|
width: 10%;
|
}
|
|
.column-3 {
|
width: 24%;
|
}
|
|
.column-4 {
|
width: 16%;
|
}
|
|
.column-5 {
|
width: 16%;
|
}
|
}
|
|
.name {
|
color: #3c9cff;
|
}
|
|
.differ {
|
color: #ff0000;
|
}
|
|
|
|
}
|
</style>
|
