<template> <view> <cu-custom bgColor="bg-gradual-blueness" :isBack="true"> <block slot="backText">返回</block> <block slot="content">{{unit.name}}</block> </cu-custom> <view class="top-fixed"> <view class="cu-bar search bg-white"> <view class="search-form radius"> <text class="cuIcon-search"></text> <input @input="InputBlur" placeholder="请输入关键字" confirm-type="search"></input> </view> <view class="action"> <button class="cu-btn bg-green shadow-blur radius"@click="getQuery">搜索</button> </view> </view> <view class="line"></view> </view> <scroll-view class="dy-scroll" @scrolltolower="scrolltolower" scroll-y :style="'top:'+sTop+'px;height:calc(100vh - '+totalHeight+'px)'"> <view class="dy-list"> <!-- <view class="dy-list-item p201 arrow" @click="goToDetail"> <view class="dy-title-flex"> <text>风险类型:污水</text> <text class="bg-yellow light cu-tag radius">一般风险/C级</text> </view> <view class="dy-subtitle"> <text>风险源:泵仓</text> </view> <view class="dy-subtitle"> <text>管控部门/责任人:污水班组/班组长</text> </view> </view> --> <view class="dy-list-item p201 arrow" v-for="i in list" @click="goToDetail(i)"> <view class="dy-title-flex"> <text>事故类型:{{i.ACCIDENTS_NAME}}</text> <text v-if="i.LEVELID=='levelA'"class="bg-red light cu-tag radius">{{i.DNAME5}}</text> <text v-else-if="i.LEVELID=='levelB'"class="bg-orange light cu-tag radius">{{i.DNAME5}}</text> <text v-else-if="i.LEVELID=='levelC'"class="bg-yellow light cu-tag radius">{{i.DNAME5}}</text> <text v-else-if="i.LEVELID=='levelD'"class="bg-blue light cu-tag radius">{{i.DNAME5}}</text> </view> <view class="dy-subtitle"> <text>风险源:{{i.PARTSNAME}}</text> </view> <view class="dy-subtitle"> <text>管控部门/责任人:{{i.DEPT_NAME}}/{{i.USER_NAME}}</text> </view> </view> </view> <view class="cu-tabbar-height"></view> </scroll-view> </view> </template> <script> import { basePath,corpinfoId,loginSession } from '@/common/tool.js'; export default { data() { return { sTop:0, totalHeight:0, list:[],//返回数据 page:1,//分页参数--页数 rows:10,//分页参数--每页数据条数 totalCount:0,//分页参数--初始化页数 isEnd:false,//防止多次刷新 totalPage:0,//分页参数--分页数量 NameLikes : null, unit:[], } }, onLoad(e) {//页面第一次加载时触发,从跳转页面返回时不能触发,可以传递参 var _this = this; _this.unit=JSON.parse(e.unit); console.info(_this.unit); _this.getDate(); loginSession(); }, onShow() {//页面显示或从后台跳回小程序时显示此页面时触发,从跳转页面返回时触发,不能传递参数 var _this = this; _this.showCount = -1; _this.currentPage = 1; _this.list = []; _this.isEnd = false; _this.getDate(); }, methods: { //跳转事件 goToDetail(e) { uni.navigateTo({ url: '/pages/basics/risk-distribution/risk-distribution-detail?id='+e.RISKPOINT_ID }); }, getQuery(){ //搜索按钮事件 var _this = this; _this.showCount = -1; _this.currentPage = 1; _this.list = []; _this.isEnd = false; _this.getDate(); }, InputBlur(e){ this.NameLikes = e.detail.value }, // 滑动到底方法 scrolltolower(){ var _this = this; _this.showCount = -1; _this.currentPage = _this.currentPage + 1; _this.isEnd = false; if(_this.totalPage >= _this.currentPage){ _this.getDate();//开始分页查询 } }, getDate(){ var _this = this; if (_this.isEnd) { return }else{ this.isEnd =true; } uni.showLoading({ title:"加载中..." });//加载中动画 uni.request({ url: basePath +'/app/riskpoint/list?showCount='+_this.showCount+'¤tPage='+_this.currentPage , method: 'POST', dataType: 'json', header: { 'Content-type':'application/x-www-form-urlencoded' }, data: { RISK_UNIT_ID:_this.unit.id, CORPINFOID:corpinfoId, tm:new Date().getTime(), pdNameLiskes : _this.NameLikes, //关键字模糊查询 }, success: (res) => { uni.hideLoading();//结束加载中动画 if (res.data != null) { _this.totalPage = res.data.page.totalPage; if(_this.list.length == 0){ _this.list = res.data.varList; }else{ if(res.data.varList != null){ _this.list2 = res.data.varList; _this.list = _this.list.concat(_this.list2); } } } } }) }, } } </script> <style> .dy-card { background-color: #fff; border-radius: 10upx; margin: 30upx } .dy-card-title { display: flex; justify-content: space-between; border-bottom: 1px solid #eee; min-height: 80upx; line-height: 80upx; padding: 0 30upx; } .dy-card-content { padding: 0upx 30upx 30upx; } .dy-card-content-item { margin-top: 20upx; } .dy-card-content-item .title { display: flex; align-items: center; } .dy-card-content-item .title .l { width: 10upx; height: 30upx; border-radius: 20upx; background-color: #666; margin-right: 10upx; } .dy-card-content-item .content { background-color: #F1F1F1; padding: 10upx 14upx; margin-top: 14upx; line-height: 1.6; } .dy-card-content-item .name text { background-color: #F1F1F1; padding: 10upx 14upx; margin-top: 14upx; line-height: 1.6; display: inline-block; } .dy-card-foot { border-top: 1px solid #eee; padding: 30upx; } </style>