FE-V2-XCX/pages_manage/workbench/securityCheck/inspectionRecords.vue

<!--检查记录-->
<template>
    <view id="safetyInspect" style="display: flex;flex-direction: column;flex: 1;">
		<view class="tabTitle"  v-if="userType==1">
			<view class="tabTitle_li" @tap="tabClick(index)"  :key="index" v-for="(item,index) in tabText">
				<view :class="{on:curTab==index}" class="tabTitle_text">{{item}}</view>
			    <view :class="{on:curTab==index}" class="tabTitle_across"></view>
			</view>
		</view>
		<view class="top-button-box" :style="userType==1?'margin-top: 116rpx;':'margin-top: 0rpx;'">
		    <view class="left-title">检查状态</view>
		    <picker @change="bindPickerChange" :value="pickerIndex" :range="pickerArray" class="right-button-big-box">
		        <view class="right-button-box">
		            <view class="uni-input">{{pickerArray[pickerIndex]}}</view>
		            <img src="@/pages_manage/images/icon_06.png">
		        </view>
		    </picker>
		</view>
		<scroll-view scroll-y @scrolltolower="scrollGet" class="scroll-box">
		    <view class="for-big-box" v-for="(item,index) in dataList" :key="index">
		        <view class="for-time-p">{{item.createTime}}</view>
		        <img class="for-back-img" src="@/pages_manage/images/Version2.2/for_min_bg.png">
		        <view class="for-list-box" @click="goInfo(minItem.id)"
				v-for="(minItem,indexTwo) in item.recordList" :key="indexTwo">
		            <view class="min-for-title-box">
		                <view class="min-for-type-p viewColor1" v-if="minItem.isYuqi">逾期</view>
		                <view class="min-for-type-p" v-if="!minItem.isYuqi" :class="minItem.zgStatus==5?'viewColor1':(minItem.zgStatus==0?'viewColor2':(minItem.zgStatus==1?'viewColor3':(minItem.zgStatus==2?'viewColor4':(minItem.zgStatus==3?'viewColor5':(minItem.zgStatus==4?'viewColor6':'')))))">{{minItem.zgStatus==5?'逾期':(minItem.zgStatus==0?'待整改':(minItem.zgStatus==1?'待复核':(minItem.zgStatus==2?'驳回':(minItem.zgStatus==3?'整改中':(minItem.zgStatus==4?'已完成':'')))))}}</view>
		                <view class="min-for-name-p">{{minItem.laboratoryName}}</view>
						<view class="min-for-zd-p" v-if="minItem.zgType == 1">(重大)</view>
		                <view class="min-for-timee-p">{{minItem.createTime}}</view>
		            </view>
		            <view class="min-for-info-box">
		                <view class="min-for-info-min-box">
		                    <img src="@/pages_manage/images/Version2.2/icon_jcjl_xm.png">
		                    <view>{{minItem.fzrName}}</view>
		                </view>
		                <view class="min-for-info-min-box">
		                    <img src="@/pages_manage/images/Version2.2/icon_jcjl_dh.png">
		                    <view>{{minItem.fzrLxfs}}</view>
		                </view>
		            </view>
		        </view>
		    </view>
		</scroll-view>
		<view class="bottom-button-p" @click="startButton">开始安全检查</view>
		<view class="position-box" @click="goPage">
		    <img src="@/pages_manage/images/Version2.2/icon_wtj.png">
		</view>
	</view>
</template>

<script>
    import { listOrderByYyyymmdd } from '@/api/index.js'
	import { rectifyList } from '@/pages_manage/workbench/problemRectification/rectifyList.vue'
    export default {
		components: {
		    rectifyList,
		},
        name: "inspectionRecords",
        data() {
            return {
				userType:uni.getStorageSync('userType'),
				//列表请求参数
				getData:{
				    pageNum:1,
					pageSize:20,
					isCg:0,
					zgStatus:"",
                    getType:true,
                    nullDataType:true,
				},
				curTab:0,
				tabText:['检查记录','问题整改',],
                pickerIndex:0,
                pickerArray:['全部','待整改','待复核','驳回','已完成','逾期'],
				dataList:[]
            }
        },
        onLoad() {
			//判断如果是学生端进入只显示问题整改
			if(this.userType==2){
				this.pageType=1
			}
        },
        onShow() {
			this.dataList=[];
			this.getList();
        },
		mounted(){
			
		},
        methods: {
			//顶部tab点击
			tabClick(index) {
				
				if(index==1){
					uni.redirectTo({
					    url: '/pages_manage/workbench/problemRectification/rectifyList',//问题整改
					});
				}

			},
            //开始检查
            startButton(){
                uni.navigateTo({
                    url: '/pages_manage/workbench/securityCheck/startChecking',//开始安全检查
                });
            },
            //跳转
            goPage(){
                uni.navigateTo({
                    url: '/pages_manage/workbench/securityCheck/unsubmittedList',//未提交列表
                });
            },
            //去详情
            goInfo(id){
                uni.navigateTo({
                    url: '/pages_manage/workbench/securityCheck/recordDetails?id='+id,//未提交列表
                });
            },
            //下啦选择
            bindPickerChange(e){
				if(e.target.value == 0){
					this.getData.zgStatus = "";
					this.getData.isYuqi = "";
				}else if(e.target.value == 1){
					this.getData.zgStatus = 0;
					this.getData.isYuqi = "";
				}else if(e.target.value == 2){
					this.getData.zgStatus = 1;
					this.getData.isYuqi = "";
				}else if(e.target.value == 3){
					this.getData.zgStatus = 2;
					this.getData.isYuqi = "";
				}/* else if(e.target.value == 4){
					this.getData.zgStatus = 3;
					this.getData.isYuqi = "";
				} */else if(e.target.value == 4){
					this.getData.zgStatus = 4;
					this.getData.isYuqi = "";
				}else if(e.target.value == 5){
					this.getData.zgStatus = 5;
					this.getData.isYuqi = "";
				}
				this.pickerIndex = e.target.value;
				this.getData.pageNum = 1;
				this.getData.getType = true;
				this.getData.nullDataType = true;
				this.dataList = [];
				this.getList();
            },
            //滚动加载事件
            scrollGet(){
                if(this.getData.getType){
                    this.getData.pageNum += 1;
                    this.getList();
                }
            },
			//获取列表数据
			async getList(){
			    let self = this;
				
				let obj = {
					pageNum : this.getData.pageNum,
					pageSize : this.getData.pageSize,
					isYuqi:this.getData.isYuqi,
					zgStatus : this.getData.zgStatus,
					isCg : this.getData.isCg,
				}
			    const {data} = await listOrderByYyyymmdd(obj);
			    if(data.code==200){
					let self = this;
					for(let i=0;i<data.rows.length;i++){
						data.rows[i].createTime = data.rows[i].createTime.split(' ')[0];
						for(let o=0;o<data.rows[i].recordList.length;o++){
							data.rows[i].recordList[o].createTime = data.rows[i].recordList[o].createTime.split(' ')[1];
							let timeList = data.rows[i].recordList[o].createTime.split(':');
							data.rows[i].recordList[o].createTime = timeList[0]+':'+timeList[1]
						}
					}
			        if(self.pageNum==1){
			            if(data.rows.length > 0 && data.rows.length == self.getData.pageSize){
			                self.dataList = data.rows;
			            }else if(data.rows.length > 0 && data.rows.length != self.getData.pageSize){
			                self.dataList = data.rows;
			                self.getData.getType = false;
			                self.getData.nullDataType = true;
			            }else{
			                self.getData.getType = false;
			                self.getData.nullDataType = true;
			            }
			        }else{
			            if(data.rows.length > 0 && data.rows.length == self.getData.pageSize){
			                self.dataList = self.dataList.concat(data.rows)
			            }else if(data.rows.length > 0 && data.rows.length != self.getData.pageSize){
			                self.dataList = self.dataList.concat(data.rows);
			                self.getData.getType = false;
			                self.getData.nullDataType = true;
			            }else{
			                self.getData.getType = false;
			                self.getData.nullDataType = true;
			            }
			        }
			    }
			},
        }
    }
</script>

<style lang="stylus" scoped>
    #safetyInspect{
		height: 100%;
        width: 100%;
        display flex;
        flex-direction column;
		.tabTitle{
			position: fixed;
			z-index: 1000;
			display flex;
			width:100%;
			height: 100rpx;
			background: #fff;

			.tabTitle_li{
				width:146rpx;
				text-align center;
				.tabTitle_text{
					display: inline-block;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
					line-height: 70rpx;
					&.on{
						color:#0183FA;
					}
				}
				.tabTitle_across{
					width: 80rpx;
					height: 5rpx;
					background: #0183FA;
					border-radius: 3rpx;
					margin-left 34rpx;
					display none;
					&.on{
						display block;
					}
				}

			}


		}

		.top-button-box{
		    height:150rpx;
		    margin-bottom:20rpx;
		    display flex
		    padding:0 20rpx;
		    background #fff;
		    .left-title{
		        line-height:150rpx;
		        margin-right:15rpx;
		        font-size:28rpx;
		        color:#333;
		    }
		    .right-button-big-box{
		        flex:1;
		        .right-button-box{
		            margin:34rpx 0;
		            border:1rpx solid #A2A2A2;
		            border-radius:10rpx;
		            height:80rpx;
		            display flex
		            flex:1;
		            view{
		                flex:1;
		                line-height:80rpx;
		                margin-left:20rpx;
		                color: #999999;
		                font-size:28rpx;
		            }
		            img{
		                width:24rpx;
		                height:12rpx;
		                margin:35rpx 22rpx;
		            }
		        }
		    }
		}
		.scroll-box{
		   // flex:1;
		    overflow-y scroll;
			padding-bottom: 128rpx;

		    .for-big-box:last-child{
		        margin-bottom:180rpx;
		    }
		    .for-big-box{
		        margin:0 20rpx 20rpx;
		        overflow hidden
		        border-bottom-left-radius :20rpx;
		        border-bottom-right-radius :20rpx;
		        .for-time-p{
		            background #fff
		            line-height:87rpx;
		            font-size:30rpx;
		            padding:0 22rpx;
		            border-top-left-radius:20rpx;
		            border-top-right-radius:20rpx;
		        }
		        .for-back-img{
		            height:30rpx;
		            width:710rpx;
		        }
		        .for-list-box:nth-child(3){
		            .min-for-title-box{
		                border:none;
		            }
		        }
		        .for-list-box{
		            background #fff
		            padding:6rpx 0;
		            .min-for-title-box{
		                display flex
		                margin:0 20rpx;
		                border-top:1rpx solid #e0e0e0;
		                view{
		                    line-height:35rpx;
		                    height:35rpx;
		                    margin:15rpx 0;
		                }
		                .min-for-type-p{
		                    border-radius:6rpx;
		                    font-size:22rpx;
		                    width:100rpx;
		                    text-align center
		                    margin-right:20rpx;
		                }
		                .min-for-name-p{
		                    
							width: 400rpx;
		                    font-size:28rpx;
							display:block;
							overflow:hidden;
							text-overflow:ellipsis;
							white-space:nowrap;
		                }
						.min-for-zd-p{
							font-size:26rpx;
							color:#D80000;
							margin-right:10rpx;
						}
		                .min-for-timee-p{
							flex: 1;
							text-align: right;
		                    font-size:26rpx;
		                    color:#999;
		                }
		                .viewColor1{
		                    background #ffe6e6;
		                    color:#ff5555;
		                }
		                .viewColor2{
		                    background #fef2dd;
		                    color:#f6a71d;
		                }
		                .viewColor3{
		                    background #e0f1e2;
		                    color:#30a23d;
		                }
		                .viewColor4{
		                    background #f2dddd;
		                    color:#a51919;
		                }
		                .viewColor5{
		                    background #e2f6f8;
		                    color:#3ac3d3;
		                }
		                .viewColor6{
		                    background #d9edfe;
		                    color:#0183fa;
		                }
		            }
		            .min-for-info-box{
		                display flex
		                margin:0 20rpx;
		                .min-for-info-min-box:nth-child(1){
		                    view{
		                        min-width:200rpx;
		                    }
		                }
		                .min-for-info-min-box{
		                    display flex
		                    height:28rpx;
		                    margin:14rpx 0;
		                    img{
		                        width:28rpx;
		                        height:28rpx;
		                        margin-right:10rpx;
		                    }
		                    view{
		                        font-size:26rpx;
		                        line-height:28rpx;
		                    }
		                }
		            }
		        }
		    }
		}
		.bottom-button-p{
		    position fixed
		    bottom:20rpx;
		    left:50rpx;
		    width:650rpx;
		    height:100rpx;
		    line-height:100rpx;
		    text-align center;
		    background #0183FA;
		    color:#fff;
		    font-size:28rpx;
		    border-radius: 20rpx
		}
		.position-box{
		    position fixed
		    bottom:240rpx;
		    right:30rpx;
		    img{
		        width:152rpx;
		        height:152rpx;
		    }
		}



	}
</style>