<template>
	<view class="taskList">
		<!-- -->
		<u-navbar
			
			title="待检测列表"
			:safeAreaInsetTop="false"
		>
			<view class="u-nav-slot" slot="right" @click="show = true">
				...
			</view>
		</u-navbar>
		<u-popup :show="show" mode="center" @close="close">
			<view>
				<u-button type="primary" size="small" text="切换账号" @click="changeUser"></u-button>
			</view>
		</u-popup>
		<view v-if="taskList.length!=0" style="margin-top:44px;">
			<view class="taskItem" v-for="(i,index) in taskList" :key="index">
				
				<view class="item">
					<view class="code rowItem">
						<view>
							炉号：{{i.heat_number}}
						</view>
						<view>
							任务编号：{{i.art_number}}
						</view>
					</view>
					
					<view class="rowItem code">
						<view class="num">
							待质检数：{{i.num}}
						</view>
						<view>
							员工：{{i.username}}
						</view>
					</view>
					<view class="rowItem">
						<view class="num" style="color:#E03023">
							注意事项：{{i.needing_remake?i.needing_remake:'-'}}
						</view>
					</view>
					<view class="code rowItem">
						<view class="num">
							附件：<text @click="downLoad(i)" style="color:#0076F6;text-decoration: underline;margin-left:10upx;">查看</text>
						</view>
						<view>
							数量：<text>{{i.total}}</text>
						</view>
					</view>
					<view class="code rowItem" style="color:#E03023" v-for="(p,r) in i.content" :key="r">
						<view>
							{{p.key}}
						</view>
						<view>
							{{p.value}}
						</view>
					</view>
					<view class="code rowItem" v-if="i.rejects!='null'">
						不良品：{{i.rejects}}
					</view>
					<view class="code rowItem">
						<view>
							不良品数量：{{i.rejects_num}}
						</view>
						<view class="lookdetails" v-if="i.is_check==1"  @click="checkHandle(i)">
							检测
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view v-else class="empty-list">
			<view class="empty-list-content">
				<image src="/static/list-empty.png"></image>
				<p class="empty-list-text">暂无数据</p>
			</view>
		</view>
		<u-modal :show="checkDialog" class="checkDialog" 
		:showCancelButton="true"
		confirmText="确认检测"
		@confirm="confirmHandle"
		@cancel="checkDialog=false"
		title="检测" >
			<view class="slot-content">
				<text>合格数</text>
				<u--input
				    placeholder="请输入内容"
				    border="surround"
					
				    v-model="qualified_num"
				  ></u--input>
			</view>
		</u-modal>
	</view>
</template>


<script>
	import {checkList,logout,procedureCheckHandle} from "@/api/user.js"
	export default {
		data() {
			return {
				taskList:[],
				show:false,
				checkDialog:false,
				qualified_num:'',
				selectedId:null
			};
		},
		methods:{
			checkHandle(i){
				console.log(i)
				this.selectedId = i.id;
				this.checkDialog = true
			},
			confirmHandle(){
				if(!this.qualified_num){
					uni.showToast({
						icon: 'none',
						mask: true,
						title: '请输入合格数'
					});
					return;
				}
				procedureCheckHandle({id:this.selectedId,num:this.qualified_num}).then(res=>{
					if(code==200){
						this.checkDialog = false
						this.getData()
						
					}else{
						uni.showToast({
							icon: 'none',
							mask: true,
							title: res.msg
						});
					}
				})
			},
			close() {
			  this.show = false
			},
			getData(){
				checkList().then(res=>{
					console.log(res)
					this.taskList = res.data.list
				})
			},
			changeUser(){
				logout().then(res=>{
					console.log(res)
					uni.redirectTo({
						url: '/pages/login/login'
					})
					uni.removeStorage({
					    key: 'userToken'
					})
					this.$store.commit('logout')
				})
			},
			downLoad(item) {
				console.log(item)
				if (item.file_suffix == 'png') {
					uni.previewImage({
						urls: [item.path]
					})
				} else {
					uni.downloadFile({
						url: item.path,
						success: (data) => {
							if (data.statusCode === 200) {
								uni.saveFile({
									tempFilePath: data.tempFilePath,
									success: function(res) {
										uni.showToast({
											icon: 'none',
											mask: true,
											title: '文件已保存' + res.savedFilePath,
											duration: 3000
										});
										setTimeout(() => {
											uni.openDocument({
												filePath: res.savedFilePath,
												success: function(res) {
													console.log('文档打开成功')
												}
											})
										}, 3000)
									}
								})
							}
						},
						fail: () => {
							uni.showToast({
								icon: 'none',
								mask: true,
								title: '失败请重新下载'
							})
						}
					});
				}	
			},
			goProgress(item){
				// uni.navigateTo({
				// 	url:'/pages/processList/processList?id=' + item.id+'&code=' + item.art_number
				// });
			}
		},
		onLoad() {
			this.getData()
		}
	}
</script>

<style lang="scss">
	/deep/.u-popup__content{
		border-radius:20upx;
		padding:50upx 70upx;
	}
	.checkDialog /deep/.u-popup__content{
		padding: 0 !important; 
	}
	.slot-content{
		display: flex;
		align-items: center;
		text{
			margin-right:20upx;
			color:#333333
		}
	}
.taskList{
	min-height: calc(100vh - 100upx);
	background-color: #F7F8FA;
	.taskItem{
		background: #FFFFFF;
		box-shadow: 0upx 4upx 13upx 0upx rgba(17,21,38,0.06);
		padding:30upx 25upx;
		margin-bottom:20upx;
		.title{
			font-size: 36upx;
			font-family: Alibaba PuHuiTi;
			font-weight: 400;
			color: #333333;
		}
		.item{
			background: #F6F6F6;
			border-radius: 4upx;
			padding:25upx 20upx;
			// margin-top:30upx;
			.rowItem{
				margin-bottom:25upx;
				display: flex;
				justify-content: space-between;
			}
			.code{
				font-size: 28upx;
				font-family: Alibaba PuHuiTi;
				font-weight: 400;
				color: #333333;
			}
			.right{
				width:171upx;
			}
			.num{
				font-size: 28upx;
				font-family: Alibaba PuHuiTi;
				font-weight: 400;
				color: #0DC0F4;
			}
			.status{
				font-size: 28upx;
				font-family: Alibaba PuHuiTi;
				font-weight: 400;
				color: #333333;
				text{
					color:#FFAD0F;
				}
			}
			.finish{
				color:#0DC0F4 !important;
			}
			.planTime{
				
				font-size: 24upx;
				font-family: Alibaba PuHuiTi;
				font-weight: 400;
				color: #999999;
			}
			.lookdetails{
				font-size: 28upx;
				font-family: Alibaba PuHuiTi;
				font-weight: 400;
				color: #0076F6;
				text-decoration: underline;
			}
		}
	}
	.empty-list{
		padding-top:20%;
		text-align: center;
	}
}
/deep/.u-navbar__content__left{
	display: none;
}

</style>
