<template> <view> <cu-custom bgColor="bg-gradual-blueness" :isBack="true" :isRingt="true"> <block slot="backText">返回</block> <block slot="content">安全环保检查记录</block> <block v-if="corpinfoId!='1e6dbbe16004402f8d2c0e52afd9a676'&&corpinfoId!='3a854eefa7894e06aaa1a2611bca80f6' &&corpinfoId!='0be65eec933b453bb04fb0a3ede1de8d'&&corpinfoId!='47af8a537f564e40af6dc7424d6f66e6'" slot="right"> <view @click="$noMultipleClicks(goToAdd)">发起</view> </block> </cu-custom> <view class="select-fixed 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" /> </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 v-if="list.length>0" > <view class="dy-list"> <view v-for="(item,index) of list" :key="index" :data-id="item.INSPECTION_ID" @click="$noMultipleClicks(goToDetail,item.KEYPROJECTCHECK_ID)" class="dy-list-item p20"> <view class="dy-title-flex align-center"> <text>{{item.INSPECTION_PLACE}}</text> </view> <view class="dy-subtitle-flex"> <text> 检查状态:{{ state[item.INSPECTION_STATUS] }} </text> </view> <view class="dy-subtitle-flex"> <text>检查类型:{{ item.INSPECTION_TYPE_NAME }}</text> </view> <view class="dy-subtitle-flex"> <text>检查人:{{ item.INSPECTION_USERS }}</text> </view> <view class="dy-subtitle-flex"> <text>被检查人:{{item.PERSON_NAME}}</text> </view> <view class="dy-subtitle-flex"> <text>检查时间:{{item.INSPECTION_TIME_START}}-{{item.INSPECTION_TIME_END}}</text> </view> <view class="dy-subtitle-flex" style="height: 34upx;"> <text>检查隐患数:{{item.HIDDEN_COUNT}}</text> <text> <button class="cu-btn bg-blue margin-tb-sm sm" @click="$noMultipleClicks(goToDetail,item.KEYPROJECTCHECK_ID)">查看</button> </text> </view> </view> </view> </view> <view v-else-if="dataFlag=='noData'" class="dy-null"> <view class="dy-null-img"> <image :src="background[dataFlag].url" mode=""></image> </view> <view class="dy-null-title"> {{background[dataFlag].msg}} </view> </view> <view class="cu-tabbar-height"></view> </scroll-view> </view> </template> <script> import { basePath,corpinfoId,loginSession,formatDate,loginUser } from '@/common/tool.js'; import tkiTree from "@/components/select-tree/select-tree.vue" export default { components: { tkiTree }, data() { return { corpinfoId, showRight: false, dataFlag:'noData', sTop:0, totalHeight:0, list:[],//返回数据 page:1,//分页参数--页数 rows:10,//分页参数--每页数据条数 totalCount:0,//分页参数--初始化页数 isEnd:false,//防止多次刷新 totalPage: 0, //分页参数--分页数量 NameLikes : '', OUTSOURCED_ID : '', noClick:true, state:{ '-1':'检查人驳回', '0':'待被检查人确认', '1':'被检查人已确认', '2':'已归档', } } }, onReady() { let that=this; let CustomBar = this.CustomBar; uni.getSystemInfo({ //调用uni-app接口获取屏幕高度 success(res) { //成功回调函数 let titleH=uni.createSelectorQuery().select(".top-fixed"); //想要获取高度的元素名(class/id) titleH.boundingClientRect(data=>{ that._data.sTop=data.height //计算高度:元素高度=窗口高度-元素距离顶部的距离(data.top) that.totalHeight = data.height+CustomBar }).exec() } }) }, onLoad(e) {//页面第一次加载时触发,从跳转页面返回时不能触发,可以传递参 this.OUTSOURCED_ID = e.OUTSOURCED_ID }, onShow() { //页面显示或从后台跳回小程序时显示此页面时触发,从跳转页面返回时触发,不能传递参数 var _this = this; _this.background = require('@/common/background.json'); _this.showCount = 10; _this.currentPage = 1; _this.list = []; _this.isEnd = false; _this.getData(); loginSession(); }, methods: { //跳转事件 goToDetail(e) { uni.navigateTo({ url: '/pages/application/key-project-management/safety-environmental-inspection/detail?KEYPROJECTCHECK_ID='+e + '&OUTSOURCED_ID=' + this.OUTSOURCED_ID }); }, goToAdd(e) { uni.navigateTo({ url: '/pages/application/key-project-management/safety-environmental-inspection/detail?OUTSOURCED_ID=' + this.OUTSOURCED_ID }); }, getQuery(){ //搜索按钮事件 var _this = this; _this.showCount = 10; _this.currentPage = 1; _this.list = []; _this.isEnd = false; _this.getData(); }, InputBlur(e){ this.NameLikes = e.detail.value }, // 滑动到底方法 scrolltolower(){ var _this = this; _this.showCount = 10; _this.currentPage = _this.currentPage + 1; _this.isEnd = false; if(_this.totalPage >= _this.currentPage){ _this.getData();//开始分页查询 } }, getData(){ var _this = this; if (_this.isEnd) { return }else{ this.isEnd =true; } uni.showLoading({ title:"加载中..." });//加载中动画 uni.request({ url: basePath +'/app/keyprojectcheck/list?showCount='+_this.showCount+'¤tPage='+_this.currentPage , method: 'POST', dataType: 'json', header: { 'Content-type':'application/x-www-form-urlencoded' }, data: { KEYWORDS : _this.NameLikes, //关键字模糊查询 CORPINFO_ID:corpinfoId, OUTSOURCED_ID:this.OUTSOURCED_ID, }, 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>