<template>
	<view>
		<cu-custom bgColor="bg-gradual-blueness" :isBack="true" :isRingt="true">
			<block slot="backText">返回</block>
			<block slot="content">隐患记录</block>
			<block slot="right">
				<view @click="showDrawer('showRight')">查询</view>
			</block>
		</cu-custom>
		<uni-drawer ref="showRight" mode="right" :mask-click="true" @change="change($event,'showRight')">
			<view class="scroll-view">
				<scroll-view class="scroll-view-box" scroll-y="true">
					<view class="de-drawer">
						<view class="padding-sm bb-default">
							隐患级别
						</view>
						<view class="flex margin-top-xs sr-s">
							<view class="cu-btn radiued margin-xs"  :class="HIDDENLEVEL=='hiddenLevel0001'?'bg-blue':'line-blue'" @click="changeLevel('hiddenLevel0001')">一般隐患</view>
							<view class="cu-btn radiued margin-xs"  :class="HIDDENLEVEL=='hiddenLevel0002'?'bg-blue':'line-blue'" @click="changeLevel('hiddenLevel0002')">重大隐患</view>
						</view>
						<view class="padding-sm bb-default text-semi">
							时间查询
						</view>
						<view class="search-time-box">
							<view class="time-style">
								<picker mode="date" @change="changeStarDate">
									<text class="cuIcon-calendar text-gray mr10"></text>
									<text class="text-grey f24">{{starDate==''?'开始时间':starDate}}</text>
								</picker>
							</view>
							<view class="fenge">-</view>
							<view class="time-style">
								<picker mode="date" @change="changeEndDate">
									<text class="cuIcon-calendar text-gray mr10"></text>
									<text class="text-grey f24">{{endDate==''?'结束时间':endDate}}</text>
								</picker>
							</view>
						</view>
						<view class="padding-sm bb-default">
							隐患状态
						</view>
						<view class="de-drawer-nr">
							<view class="cu-btn radiued margin-sm" :class="STATE=='1'?'bg-blue':'line-blue'" @click="changeState('1')">未整改</view>
							<view class="cu-btn radiued margin-sm" :class="STATE=='3'?'bg-blue':'line-blue'" @click="changeState('3')">已整改</view>
							<view class="cu-btn radiued margin-sm" :class="STATE=='4'?'bg-blue':'line-blue'" @click="changeState('4')">已验收</view>
							<view class="cu-btn radiued margin-sm" :class="STATE=='-1'?'bg-blue':'line-blue'" @click="changeState('-1')">已过期</view>

						</view>
						
						<view class="de-drawer-bottom">
							<view class="cz-btn">
								<text class="cu-btn" @click="reset">重置</text>
							</view>
							<view class="done-btn" @click="closeDrawer('showRight')">
								<text class="cu-btn bg-blue">完成</text>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>	
		</uni-drawer>
		<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="请输入关键字"></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 v-if="total>0" class="dy-list">		
					<view v-for="(item,index) of list" :key="index" :data-id="item.HIDDEN_ID" class="dy-list-item p201 arrow" @click="$noMultipleClicks(gotRectify,item.HIDDEN_ID)">
						<view class="dy-title-flex">
							<text v-if="item.HIDDENDESCR">{{item.HIDDENDESCR.length>15?item.HIDDENDESCR.substr(0,15)+'...':item.HIDDENDESCR}}</text>
							<text v-else>暂无</text>
							<text v-if="item.HIDDENLEVEL=='hiddenLevel0001'" class="cu-tag radius bg-yellow light">{{item.HIDDENLEVELNAME}}</text>
							<text v-else-if="item.HIDDENLEVEL=='hiddenLevel0002'" class="cu-tag radius bg-red light" >{{item.HIDDENLEVELNAME}}</text>
						</view>
						<view class="dy-subtitle">
							<text v-if="item.SOURCE=='1'">来源：隐患快报</text>
							<text v-else-if="item.SOURCE=='2'">来源：隐患排查</text>
						</view>
						<view class="dy-subtitle-flex">
							<text>整改人：{{item.RECTIFICATIONORNAME?item.RECTIFICATIONORNAME:'暂无'}}</text>
							<text class="text-gray f20">{{item.RECTIFICATIONTIME}}</text>
						</view>
					</view>
				</view>
				<view v-else-if="dataFlag=='noData'" class="dy-null">
				    <view class="dy-null-img">
						<image src="../../../../static/null.png" mode=""></image>
				    </view>
				    <view class="dy-null-title">
						暂无数据
				    </view>
				</view>
				<view class="cu-tabbar-height"></view>
			</scroll-view>
	</view>	
</template>

<script>
	import {
		basePath,corpinfoId,loginUserId,loginSession,loginUser
	} from '@/common/tool.js';
	export default {
		data() {
			return {
				showRight: false,
				sTop:0,
				totalHeight:0,
				scrollLeft: 0,
				time: '12:01',
				date: '2018-12-25',
				starDate:'',
				endDate:'',
				page: 1,
				rows: 10,
				totalCount:0,
				isEnd: false,
				total:0,
				varList:[],
				noClick:true,
				dataFlag:'noData',
				list:[],
				initflag:false,
				name:'',
				HIDDENLEVEL:"",
				STATE:''
			}
		},		
		onLoad() {
			this.getData();
			loginSession();
		},
		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()
				}
			})
		},
		onShow(){
			var _this = this;
			if(_this.initflag){
				_this.initflag = false;
				_this.getQuery()
			}
		},
		methods: {
			getData() {
				var _this = this;
					if (_this.isEnd) {
						return
					}
					uni.showLoading({
						title: '请稍候'
					});
					let DISPOSESTATE = 2;
					uni.request({
						url: basePath + '/app/hidden/list',
						method: 'POST',
						dataType: 'json',
						header:{
							'Content-type':'application/x-www-form-urlencoded'
						},
						data: {
							tm:new Date().getTime(),
							showCount:_this.rows,
							currentPage:_this.page,
							totalResult:_this.total,
							DISPOSESTATE:-1,
							STARTTIME:_this.starDate,
							ENDTIME:_this.endDate,
							HIDDENLEVEL:_this.HIDDENLEVEL,
							STATE:_this.STATE,
							USERDEPT:loginUser.DEPARTMENT_ID,
							SELFUSERID:loginUserId,
							CORPINFO_ID:corpinfoId,
							HIDDENDESCR:_this.name
						},
						success: (res) => {
							// console.info(res.data);
							if (res.data.result == 'success') {
								uni.hideLoading();
								_this.total = res.data.page.totalResult;
								if (_this.totalCount < res.data.page.totalResult) {
									var content = res.data.varList;
									_this.list = _this.list.concat(content);
									_this.page++;
									_this.totalCount += content.length;
								} else {
									_this.isEnd = true
								}
								
							} else {
								uni.showToast({
									title: res.data.message,
									duration: 2000
								});
							}
						}
					});
				
			},
			changeStarDate(e) {
				this.starDate = e.detail.value
				this.getQuery();
			},
			changeEndDate(e) {
				this.endDate = e.detail.value
				this.getQuery();
			},
			changeLevel(e) {
				var _this=this;
				_this.HIDDENLEVEL = e
				_this.getQuery();
			},
			changeState(e) {
				var _this=this;
				_this.STATE = e
				_this.getQuery();
			},
			reset(){
				var _this=this;
				_this.starDate= '';
				_this.endDate= '';
				_this.HIDDENLEVEL= '';
				_this.STATE = '';
				_this.getQuery();
			},
			getQuery(){
				var _this = this;
				_this.page = 1;
				_this.isEnd = false;
				_this.totalCount = 0;
				_this.total =0;
				_this.list = [];
				_this.getData()
			},
			getlist() {
				var _this = this;
				_this.page = 1;
				_this.isEnd = false;
				_this.totalCount = 0;
				_this.total =0;
				_this.list = [];
				_this.getData()
			},
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
				this.getQuery();
			},
			InputBlur(e){
				this.name = e.detail.value
			},
			PickerChange(e) {
				this.index = e.detail.value
			},
			TimeChange(e) {
				this.time = e.detail.value
			},
			DateChange(e) {
				this.date = e.detail.value
			},
			// 打开窗口
			showDrawer(e) {
				this.$refs[e].open()
			},
			// 关闭窗口
			closeDrawer(e) {
				this.$refs[e].close()
			},
			// 抽屉状态发生变化触发
			change(e, type) {
				console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭'));
				this[type] = e
			},
			//跳转事件
			gotRectify(e) {
				uni.navigateTo({
					url: '/pages/application/hidden-danger-management/hidden-danger-record/hidden-danger-record-detail?id='+e,
				});
			},
			//跳转事件
			gotReview(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-review?id='+e,
				});
			},
			//跳转事件
			gotCheck(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-check?id='+e,
				});
			},
			//跳转事件
			gotDetail(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-details?id='+e,
				});
			},
			scrolltolower(){
				this.getData();
			}	
		}
	}
</script>
<style>
	.sr-s .cu-btn{
		font-size: 24upx;
		height: 54upx;
		flex: 1;
	}
	.scroll-view {
		/* #ifndef APP-NVUE */
		width: 100%;
		height: 100%;
		/* #endif */
		flex: 1;
		
	}
	
	.scroll-view-box {
		flex: 1;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	
	}
</style>