513 lines
13 KiB
Vue
513 lines
13 KiB
Vue
<template>
|
||
<view class="container">
|
||
<scroll-view scroll-y="true" :style="{height:height + 'rpx'}" @refresherrefresh="refresherrefreshFun" @refresherpulling="refresherpullingFun" :refresher-triggered="isRefresher" refresher-enabled="true">
|
||
<view class="topcheck">
|
||
<view class="left">
|
||
<picker @change="bindPickerChange" :value="index" :range="array">
|
||
<view class="uni-input" v-if="!stationName">选择站点 <image src="../../static/xia.png"></image></view>
|
||
<view class="uni-input" v-else>{{stationName}} <image src="../../static/xia.png"></image></view>
|
||
</picker>
|
||
</view>
|
||
<view class="right">
|
||
<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
|
||
<view class="uni-input" v-if="!maintainTime">选择日期 <image src="../../static/xia.png"></image></view>
|
||
<view class="uni-input" v-else>{{maintainTime}} <image src="../../static/xia.png"></image></view>
|
||
</picker>
|
||
</view>
|
||
</view>
|
||
<view class="searchbox">
|
||
<image src="../../static/meishi_icon_sousuo.png" mode=""></image>
|
||
<input class="search_input" v-model="maintainPerson" placeholder="请输入要搜索的运维人员">
|
||
<view class="searchbutton" @click="changenr()">
|
||
搜索
|
||
</view>
|
||
</view>
|
||
<view class="liebiaos" v-if="List.length != 0">
|
||
<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" @click="todetails(item,index)">
|
||
<image src="../../static/fz.png" mode=""></image>
|
||
<view class="title">
|
||
{{item.stationName}}
|
||
</view>
|
||
</view>
|
||
<view class="caozuo" @click="caozuo(item)">
|
||
<image src="../../static/dian.png" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="bot_item" v-if="item.maintainData3">
|
||
<span class="nrbt">站点位置:</span>
|
||
<span class="number">{{item.maintainData3}}</span>
|
||
</view>
|
||
<view class="itembox_bot" @click="todetails(item,index)">
|
||
<view class="bot_item">
|
||
<span class="nrbt">监测情况:</span>
|
||
{{item.maintainData1}}
|
||
</view>
|
||
<view class="bot_item">
|
||
<span class="nrbt">负责人员:</span>
|
||
<span class="number">{{item.maintainPerson}}</span>
|
||
</view>
|
||
<view class="bot_item" v-if="item.maintainData2">
|
||
<span class="nrbt">联系方式:</span>
|
||
<span class="number">{{item.maintainData2}}</span>
|
||
</view>
|
||
<view class="bot_item">
|
||
<span class="nrbt">维护时间:</span>
|
||
{{item.maintainTime}}
|
||
</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">
|
||
<image src="../../static/zwsj.png" mode="" class="zwsjimg"></image>
|
||
<view class="zwsjtext">
|
||
暂无数据
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<image @click="toadd()" class="add" src="../../static/add.png" mode=""></image>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import api from "@/api/api"
|
||
import configService from '@/common/service/config.service.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
List:[],
|
||
baseUrl:configService.apiUrl,
|
||
array:[],
|
||
arrays:[],
|
||
index:'',
|
||
date:'',
|
||
searchValue:'',
|
||
allNum: '',
|
||
isLastpage: '',
|
||
intervalId: null,
|
||
loadStatus:'more', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
|
||
isLoadMore:false, //是否加载中
|
||
height:0,
|
||
scorllheight:0,
|
||
show:false,
|
||
show1:false,
|
||
top:0,
|
||
maintainPerson:'',
|
||
maintainTime:'',
|
||
omName:'',
|
||
pageNo:1,
|
||
pageSize:4,
|
||
deleteUrl:'/applet/survMaintainRecord/delete',
|
||
stationName:'',
|
||
stationCode:'',
|
||
isRefresher: false, //下拉刷新状态
|
||
reload:''
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
uni.getSystemInfo({
|
||
success: res => {
|
||
var pxToRpxScale = 750 / res.windowWidth
|
||
var ktxStatusHeight = res.statusBarHeight * pxToRpxScale
|
||
var navigationHeight = 44 * pxToRpxScale
|
||
this.height = res.windowHeight * pxToRpxScale//将px 转换rpx
|
||
console.log(this.height,ktxStatusHeight,navigationHeight)
|
||
this.scorllheight = this.height - 182
|
||
}
|
||
});
|
||
this.getList()
|
||
},
|
||
onShow() {
|
||
uni.getSystemInfo({
|
||
success: res => {
|
||
var pxToRpxScale = 750 / res.windowWidth
|
||
var ktxStatusHeight = res.statusBarHeight * pxToRpxScale
|
||
var navigationHeight = 44 * pxToRpxScale
|
||
this.height = res.windowHeight * pxToRpxScale//将px 转换rpx
|
||
console.log(this.height,ktxStatusHeight,navigationHeight)
|
||
this.scorllheight = this.height - 182
|
||
}
|
||
});
|
||
let pages = getCurrentPages();
|
||
let currPage = pages[pages.length - 1]; //当前页面
|
||
this.reload = currPage.data.reload
|
||
if(this.reload){
|
||
this.maintainTime = ''
|
||
this.stationCode = ''
|
||
this.stationName = ''
|
||
this.maintainPerson = ''
|
||
this.pageNo = 1
|
||
this.getList()
|
||
this.reload = ''
|
||
}
|
||
this.getazsurvMulchRecord()
|
||
},
|
||
methods:{
|
||
// 站点
|
||
getazsurvMulchRecord(){
|
||
this.array = []
|
||
this.arrays = []
|
||
this.$http.get('/applet/survStationInfo/list').then(res=>{
|
||
for(var i=0;i<res.data.data.length;i++){
|
||
this.arrays.push({
|
||
label:res.data.data[i].stationName,
|
||
value:res.data.data[i].stationCode
|
||
})
|
||
this.array.push(res.data.data[i].stationName)
|
||
console.log(this.array)
|
||
}
|
||
})
|
||
},
|
||
// 下拉刷新被触发
|
||
refresherrefreshFun() {
|
||
this.maintainTime = ''
|
||
this.stationCode = ''
|
||
this.stationName = ''
|
||
this.maintainPerson = ''
|
||
this.pageNo = 1
|
||
this.getList()
|
||
},
|
||
// 下拉刷新触发
|
||
refresherpullingFun() {
|
||
this.isRefresher= true
|
||
},
|
||
// 获取列表
|
||
getList(){
|
||
let params = {}
|
||
params.pageNo = this.pageNo
|
||
params.pageSize = this.pageSize
|
||
params.maintainPerson = this.maintainPerson
|
||
params.maintainTime = this.maintainTime
|
||
params.stationCode = this.stationCode
|
||
params.stationName = this.stationName
|
||
uni.showLoading({
|
||
title: '加载中'
|
||
});
|
||
this.List = []
|
||
this.$http.get('/applet/survMaintainRecord/list',{params:params}).then(res =>{
|
||
if(res.data.code == 0){
|
||
var data = res.data.data.records
|
||
this.List = this.List.concat(data)
|
||
if(res.data.data.total != 0){
|
||
this.allNum = Number(res.data.data.total)/Number(this.pageSize)+'';
|
||
console.log(this.allNum,'总页数')
|
||
if(this.allNum.indexOf('.') == -1) {
|
||
this.allNum = this.allNum;
|
||
console.log(this.allNum,'if')
|
||
} else {
|
||
this.allNum = parseInt(Number(this.allNum)+1);
|
||
console.log(this.allNum,'else')
|
||
}
|
||
console.log(this.pageNo,this.allNum,'156156')
|
||
if(this.pageNo == this.allNum) {
|
||
this.isLastpage = true;
|
||
this.loadStatus='nomore'
|
||
console.log(this.isLastpage,'true','nomore')
|
||
} else {
|
||
this.isLastpage = false;
|
||
// this.isLoadMore=true
|
||
this.loadStatus = 'more'
|
||
console.log(this.isLastpage,'false')
|
||
}
|
||
}else{
|
||
this.isLastpage = true;
|
||
this.loadStatus='nomore'
|
||
}
|
||
}
|
||
uni.hideLoading();
|
||
this.isRefresher= false
|
||
})
|
||
},
|
||
// 分页加载
|
||
lower() {
|
||
console.log("最后一页了，取消下拉功能");
|
||
// 最后一页了，取消下拉功能
|
||
if (this.isLastpage) {
|
||
return
|
||
}
|
||
clearInterval(this.intervalId);
|
||
var num = 1;
|
||
this.intervalId = setInterval(() => {
|
||
num = num+1;
|
||
},1000)
|
||
console.log(this.intervalId,num)
|
||
this.pageNo = this.pageNo + 1;
|
||
let params = {}
|
||
params.pageNo = this.pageNo
|
||
params.pageSize = this.pageSize
|
||
params.maintainPerson = this.maintainPerson
|
||
params.maintainTime = this.maintainTime
|
||
params.stationCode = this.stationCode
|
||
params.stationName = this.stationName
|
||
this.$http.get('/applet/survMaintainRecord/list',{params:params}).then(res =>{
|
||
if(res.data.code == 0){
|
||
var data = res.data.data.records
|
||
this.List = this.List.concat(data)
|
||
if(res.data.data.total != 0){
|
||
if(this.pageNo == this.allNum) {
|
||
this.isLastpage = true;
|
||
this.loadStatus='nomore'
|
||
console.log(this.isLastpage,'true')
|
||
} else {
|
||
this.isLastpage = false;
|
||
// this.isLoadMore=true
|
||
this.loadStatus = 'more'
|
||
console.log(this.isLastpage,'false')
|
||
}
|
||
}else{
|
||
this.isLastpage = true;
|
||
this.loadStatus='nomore'
|
||
}
|
||
}
|
||
})
|
||
},
|
||
bindPickerChange: function(e) {
|
||
console.log('picker发送选择改变，携带值为', e.detail.value)
|
||
this.index = e.detail.value
|
||
this.stationName = this.array[this.index]
|
||
for(var i=0;i<this.arrays.length;i++){
|
||
if(this.stationName == this.arrays[i].label){
|
||
this.stationCode = this.arrays[i].value
|
||
}
|
||
}
|
||
this.pageNo = 1
|
||
this.getList()
|
||
},
|
||
bindDateChange: function(e) {
|
||
this.maintainTime = e.detail.value
|
||
this.pageNo = 1
|
||
this.getList()
|
||
},
|
||
changenr(){
|
||
console.log(this.maintainPerson)
|
||
this.pageNo = 1
|
||
this.getList()
|
||
},
|
||
todetails(item,index){
|
||
uni.navigateTo({
|
||
url:'/packDetail/pages/operations/detail?item=' + encodeURIComponent(JSON.stringify(item))
|
||
})
|
||
},
|
||
toadd(){
|
||
uni.navigateTo({
|
||
url:'/packDetail/pages/operations/add'
|
||
})
|
||
},
|
||
caozuo(item){
|
||
console.log(item)
|
||
var that = this
|
||
uni.showActionSheet({
|
||
itemList: ['编辑', '删除'],
|
||
success: function (res) {
|
||
console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
|
||
if((res.tapIndex + 1) == 1){
|
||
uni.navigateTo({
|
||
url:'/packDetail/pages/operations/edit?item='+ encodeURIComponent(JSON.stringify(item))
|
||
})
|
||
}else{
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '是否删除数据？',
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
console.log('用户点击确定');
|
||
that.$http.delete(that.deleteUrl+'?id='+item.id).then(res =>{
|
||
if(res.data.code == 0){
|
||
uni.showToast({
|
||
title: '删除成功',
|
||
icon:'success',
|
||
duration: 2000
|
||
});
|
||
that.pageNo = 1
|
||
that.maintainTime = ''
|
||
that.stationCode = ''
|
||
that.stationName = ''
|
||
that.maintainPerson = ''
|
||
that.getList()
|
||
}
|
||
})
|
||
} else if (res.cancel) {
|
||
console.log('用户点击取消');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
},
|
||
fail: function (res) {
|
||
console.log(res.errMsg);
|
||
}
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page{
|
||
height: 100%;
|
||
}
|
||
.container{
|
||
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{
|
||
padding: 20rpx 30rpx;
|
||
background-color: white;
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
.search_input{
|
||
border: none;
|
||
height: 60rpx;
|
||
width: 86%;
|
||
font-size: 24rpx;
|
||
border-radius: 30rpx;
|
||
background-color: #F6F6F6;
|
||
padding-left: 50rpx;
|
||
}
|
||
.searchbox image{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
position: absolute;
|
||
left: 40rpx;
|
||
top: 35%;
|
||
z-index: 99;
|
||
}
|
||
.searchbutton{
|
||
width: 10%;
|
||
height: 60rpx;
|
||
font-size: 26rpx;
|
||
text-align: center;
|
||
line-height: 60rpx;
|
||
}
|
||
.itembox{
|
||
background-color: white;
|
||
padding: 30rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
.itembox:first-child{
|
||
margin-top: 0;
|
||
}
|
||
.uni-input{
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.uni-input image{
|
||
height: 12rpx;
|
||
width: 24rpx;
|
||
margin-left: 5rpx;
|
||
}
|
||
.itembox_top{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding-bottom: 30rpx;
|
||
border-bottom: 2rpx solid #e4e4e4;
|
||
}
|
||
.itembox_lef image{
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 14rpx;
|
||
}
|
||
.itembox_lef{
|
||
display: flex;
|
||
align-items: center;
|
||
font-weight: 500;
|
||
width: 70%;
|
||
}
|
||
.caozuo{
|
||
height: 100%;
|
||
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;
|
||
}
|
||
.nrbt{
|
||
color: #898989;
|
||
margin-right: 10rpx;
|
||
}
|
||
.number{
|
||
// color: #ff6563;
|
||
}
|
||
.numbers{
|
||
color:#26bf64;
|
||
}
|
||
.load{
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
text-align: center;
|
||
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{
|
||
width: 100%;
|
||
// height: 100%;
|
||
display: flex;
|
||
padding: 60% 170rpx 0;
|
||
}
|
||
.inzwsj{
|
||
width: 100%;
|
||
}
|
||
.zwsjimg{
|
||
width: 100%;
|
||
height: 224rpx;
|
||
margin-bottom: 37rpx;
|
||
}
|
||
.zwsjtext{
|
||
width: 100%;
|
||
font-size: 26rpx;
|
||
font-family: Source Han Sans SC;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
line-height: 31rpx;
|
||
text-align: center;
|
||
}
|
||
</style> |