FE-V2-XCX/pages_manage/workbench/problemRectification/rectifyList.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="for-max-box">
			<view class="for-big-box">
				<view class="for-box" @click="goInfo(item)" v-for="(item,index) in infoList" :key="index">
					<view class="for-title-box">
                        <view  v-if="item.isYuqi" class="viewColor1">逾期</view>
						<view v-if="!item.isYuqi" :class="item.spStatus==5?'viewColor1':(item.spStatus==0?'viewColor2':(item.spStatus==1?'viewColor3':(item.spStatus==2?'viewColor4':(item.spStatus==3?'viewColor5':(item.spStatus==4?'viewColor6':'')))))">{{item.spStatus==5?'逾期':(item.spStatus==0?'待整改':(item.spStatus==1?'待复核':(item.spStatus==2?'驳回':(item.spStatus==3?'整改中':(item.spStatus==4?'已完成':'')))))}}</view>
						<view class="min-for-name-p">{{item.laboratoryName}}</view>
						<view v-if="item.zgType == 1">(重大)</view>
					</view>
					<view class="for-address-box">
						<img src="@/pages_manage/images/Version2.2/icon_wtzg_xx.png">
						<view>{{item.yhMs|ellipsis}}</view>
					</view>
					<view class="for-time-box">
						<img src="@/pages_manage/images/Version2.2/icon_wtzg_sj.png">
						<view>{{item.checkTime}}</view>
					</view>
				</view>
			</view>
			<img class="null-img" v-if="!infoList[0]" src="@/pages_manage/images/null-data-1.png">
		</scroll-view>
	</view>
</template>

<script>
	import { config } from '@/api/request/config.js'
	import { listWtzgList,checkSign} from '@/api/index.js'
	export default {
		name: "rectifyList",
		data() {
			return {
				userType:uni.getStorageSync('userType'),
				infoList:[],
				//列表请求参数
				getData:{
					zgStatus:"",
					spStatus:'',
					isZgStatus:"",
					isCg:0,
					page:1,
					pageSize:20,
					getType:true,
					nullDataType:true,
				},
				curTab:1,
				tabText:['检查记录','问题整改',],
				//下拉框
                pickerIndex:0,
                pickerArray:['全部','待整改','待复核','驳回','已完成','逾期'],

			}
		},
		filters:{
			ellipsis(value){
			  if (!value) return '';
			  if (value.length > 20) {
				return value.slice(0,20) + '...'
			  }
			  return value
			}
		},
		onLoad() {
			//判断如果是学生端进入只显示问题整改
			if(this.userType==2){
				this.pageType=1
			}
		},
		onShow() {

			this.infoList=[];
			this.getList();

		},
		mounted(){
			
		},
		methods: {
			//顶部tab点击
			tabClick(index) {
				if(index==0){
					uni.redirectTo({
					    url: '/pages_manage/workbench/securityCheck/inspectionRecords',//安全检查
					});
				}
			
			},
			//去详情
			async goInfo(item){
				console.log(item)

				if(item.zgType==1){//重大-点击时需要判断是否上传签名，如果未上传签名需要上传签名信息才可以提交整改
					const {data} = await checkSign();
					if(data.code==200){
						if(data.data==false){//true有电子签名false没有电子签名
							uni.showModal({
							  title: '',
							  cancelColor:'#999999',
							  confirmColor:'#FF6E6E',
							  content: '重大整改需上传电子签名,是否上传?',
							  success (res) {
								if (res.confirm) {
								  console.log('用户点击确定')
								  uni.navigateTo({
								      url: '/pages_manage/workbench/signature/signature'
								  });

								} else if (res.cancel) {
								  console.log('用户点击取消')

								}
							  }
							})
						}else{
							uni.navigateTo({
							    url: '/pages_manage/workbench/problemRectification/rectifyDetails?item='+JSON.stringify(item),//未提交列表
							});
						}
					}
				}else{
					uni.navigateTo({
					    url: '/pages_manage/workbench/problemRectification/rectifyDetails?item='+JSON.stringify(item),//未提交列表
					});
				}

			},
			//下啦选择
			bindPickerChange(e){
				console.log(e.target.value)
				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 = '';
				}else if(e.target.value == 6){
					this.getData.isZgStatus = 1;
					this.getData.spStatus = '';
				}
			    this.pickerIndex = e.target.value
				this.getData.page = 1;
				this.getData.getType = true;
				this.getData.nullDataType = true;
				this.infoList = [];
				this.getList();
			},
            //滚动加载事件
            scrollGet(){
                if(this.getData.getType){
                    this.getData.page += 1;
                    this.getList();
                }
            },
			//获取列表数据
			async getList(){
			    let self = this;
				
			    let obj = {
					spStatus:this.getData.zgStatus,
					isZgStatus:this.getData.isZgStatus,
					isCg:0,
			        pageNum:this.getData.page,
			        pageSize:this.getData.pageSize,
			    };
				this.getData.isCg = 0;
			    const {data} = await listWtzgList(obj);
			    if(data.code==200){
			        if(self.page==1){
			            if(data.rows.length > 0 && data.rows.length == self.getData.pageSize){
			                self.infoList = data.rows;
			            }else if(data.rows.length > 0 && data.rows.length != self.getData.pageSize){
			                self.infoList = 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.infoList = self.infoList.concat(data.rows)
			            }else if(data.rows.length > 0 && data.rows.length != self.getData.pageSize){
			                self.infoList = self.infoList.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;
					}
				}
			}
		}
		.for-max-box{
			flex:1;
			overflow-y scroll
			.for-big-box{
				background:#fff;
				border-radius:20rpx;
				margin:20rpx;
				.for-box:nth-child(1){
					.for-title-box{
						border:none;
					}
				}
				.for-box{
					overflow hidden
					.for-title-box{
						display:flex;
						margin:0 26rpx 0;
						border-top:1rpx solid #dedede;
						padding-top:45rpx;
						view:nth-of-type(1){
							width:98rpx;
							line-height:38rpx;
							height:38rpx;
							border-radius:6rpx;
							font-size:20rpx;
							text-align center;
							margin-right:10rpx;
						}
						.min-for-name-p{
							width: 468rpx;
						    font-size:28rpx;
							display:block;
							overflow:hidden;
							text-overflow:ellipsis;
							white-space:nowrap;
						}
						view:nth-of-type(3){
							font-size:30rpx;
							color:#333;
							height:36rpx;
							lin-height:36rpx;
							color:#D80000;
						}
						.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;
						}
					}
					.for-address-box{
						display:flex;
						margin:33rpx 26rpx 0;
						img{
							width:28rpx;
							height:28rpx;
							margin-right:20rpx;
						}
						view{
							font-size:28rpx;
							line-height:28rpx;
							color:#666;
						}
					}
					.for-time-box{
						display:flex;
						margin:26rpx 26rpx 0;
						padding-bottom:32rpx;
						img{
							width:28rpx;
							height:28rpx;
							margin-right:20rpx;
						}
						view{
							font-size:28rpx;
							line-height:28rpx;
							color:#666;
						}
					}
				}
			}
			.null-img{
				display block
				width:276rpx;
				height:321rpx;
				position absolute
				top:100rpx;
				left:274rpx;
			}
		}
	}
</style>