<template>
		<view class="details">
			<view class="search">
				<u--text type="error"  decoration="underline" :text="'待办: '+undo" @click="showUndo"></u--text>
				<u--text type="success" decoration="underline" :text="'完成: '+done" @click="showDone"></u--text>
				<u-icon name="scan" size="36px" @click="scan" />
			</view>
			<!-- 设备信息 -->
			<view class="main" v-show="show">
				<u--form labelPosition="left" labelAlign="center" :model="detail" ref="form1" >
					<u-form-item label="卡片号码" prop="detail.assetNumber" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.assetNumber" border="none" placeholder="请输入卡片号码"></u--input>
					</u-form-item>
					<u-form-item label="资产名称" prop="detail.name" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.name" border="none" placeholder="请输入资产名称"></u--input>
					<!-- <u--text :text="detail.name"></u--text> -->
					</u-form-item>
					<u-form-item label="资产型号" prop="detail.specifications" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.specifications" border="none" placeholder="请输入资产型号"></u--input>
					<!-- <u--text :text="detail.specifications"></u--text> -->
					</u-form-item>
					<u-form-item label="资产品牌" prop="detail.brand" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.brand" border="none" placeholder="请输入资产品牌"></u--input>
					<!-- <u--text :text="detail.brand"></u--text> -->
					</u-form-item>
					<u-form-item label="资产金额" prop="detail.amount" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.amount" border="none" placeholder="请输入资产金额"></u--input>
					</u-form-item>
					<u-form-item label="资产归属" prop="detail.belongTo" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.belongTo" border="none" placeholder="请输入资产归属"></u--input>
					</u-form-item>
					<u-form-item label="取得日期" prop="detail.getDate" labelWidth="auto" borderBottom ref="item1" >
						<u--input v-model="detail.getDate" border="none" placeholder="请输入取得日期"></u--input>
					</u-form-item>
					<u-form-item
							label="使用部门"
							prop="detail.deptName"
							borderBottom
							@click="showDept = true"
							labelWidth="auto"
							ref="item1"
					>
						<u--input
								v-model="detail.deptName"
								disabled
								disabledColor="#ffffff"
								placeholder="请选择使用部门"
								border="none"
						></u--input>
						<u-icon
								slot="right"
								name="arrow-right"
						></u-icon>
					</u-form-item>
					<u-form-item
							label="资产状态"
							prop="detail.statusName"
							labelWidth="auto"
							borderBottom
							@click="showStatus = true; hideKeyboard()"
							ref="item1"
					>
						<u--input
								v-model="detail.statusName"
								disabled
								disabledColor="#ffffff"
								placeholder="请选择状态"
								border="none"
						></u--input>
						<u-icon
								slot="right"
								name="arrow-right"
						></u-icon>
					</u-form-item>
					<u-form-item label="上传照片" prop="detail.photo" labelWidth="auto" borderBottom ref="item1" >
					<u-upload
						:fileList="fileList1"
						@afterRead="afterRead"
						@delete="deletePic"
						name="1"
						multiple
						:maxCount="10"
						:previewFullImage="true"
					></u-upload>
					</u-form-item>
					<u-form-item label="说明内容" prop="detail.remark" labelWidth="auto" borderBottom ref="item1" >
						<u--textarea v-model="detail.remark" placeholder="请输入说明内容" ></u--textarea>
					</u-form-item>
				</u--form>
				<u-action-sheet
						:show="showStatus"
						:actions="actions"
						title="请选择状态"
						@close="showStatus = false"
						@select="statusSelect"
				>
				</u-action-sheet>
				<u-action-sheet
						:show="showDept"
						:actions="deptActions"
						title="请选择部门"
						@close="showDept = false"
						@select="deptSelect"
				>
				</u-action-sheet>
			</view>
			<view class="submit" v-show="show" >
				<u-button type="primary" text="提 交" @click="toSubmit"></u-button>
			</view>
			<!-- <view class="submit" v-show=" undoInfoList.length == 0 && detailTaskStatus<2 " @click="pdDone"> -->
			<view class="submit" v-show="detailTaskStatus<2 && !show" @click="pdDone">
				<u-button type="primary" text="完 成"></u-button>
			</view>
			<u-popup :show="doneInfoShow" @close="doneInfoShow=false" round="6" mode="bottom">
				<view class="popup">
					<u--text type="success" text="已完成任务"></u--text>
					<u-cell-group v-for="(item, index) in doneInfoList" :key="index">
						<u-cell arrow-direction="down" icon="checkmark-circle-fill" :title="item.name+' ['+item.assetNumber+']'" :value="item.nickName"></u-cell>
					</u-cell-group>
				</view>
			</u-popup>
			<u-popup :show="undoInfoShow" @close="undoInfoShow=false" round="6" mode="bottom">
				<view class="popup">
					<u--text type="error" :text="'未完成任务'+undoNumber"></u--text>
					<u-cell-group v-for="(item, index) in undoInfoList" :key="index">
						<u-cell arrow-direction="down" icon="clock-fill" :title="item.name+' ['+item.assetNumber+']'" :value="item.nickName"></u-cell>
					</u-cell-group>
				</view>
			</u-popup>
			<view >
				<u-modal @confirm="submit" @cancel="sbmtClose" showCancelButton="true" :show="sbmtShow">确定将资产[{{detail.name}}]与[{{nickName}}]进行绑定？</u-modal>
			</view>
			<!-- <u-popup :show="sbmtShow" @close="sbmtClose" mode="bottom">
			    <view>
			        <text></text>
			    </view>
				<u-button type="primary" text="确 定" @click="submit"></u-button>
			</u-popup> -->
		</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				detail: {
					detailsId: null,
					statusName: null,
					picUrl:''
				},
				useUserId: null,
				nickName: '',
				inspectionList: [],
				done: 0,
				undo: 0,
				showStatus: false,
				actions: [
					{
						name: '正常',
						value: 0
					},
					{
						name: '故障',
						value: 1
					}
				],
				showDept: false,
				deptActions: [
				],
				fileList1: [
					// {
					// 	url: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
					// }
				],
				doneInfoShow: false,
				undoInfoShow: false,
				doneInfoList:[
					
				],
				undoInfoList:[
				],
				detailTaskStatus: null,
				number:0,
				undoNumber:'',
				sbmtShow: false
			}
		},
		
		onLoad: function(options) {
			let data = JSON.parse(options.task);
			this.detail.detailsId=data.id;
			this.useUserId = data.useUserId;
			this.nickName = data.nickName;
			this.detailTaskStatus = data.status;
			this.number = data.number;
			this.getTaskDetailsCount()
			this.getDept();
		},
		
		created() {
		},
		
		onPullDownRefresh(){
			this.getTaskDetailsCount()
			// this.stopPullDownRefresh()
		},
		
		methods: {
			async getTaskDetailsCount() {
				const { data:res } = await this.$http('/taskDetailsList/'+this.detail.detailsId, {});
				if(res.code) return
				this.done=res.done;
				this.undo=res.undo;
			},
			scan() {
				var that = this;
				if(that.detailTaskStatus==2)
				return uni.showToast({
						title: "任务已审核",
						icon: 'error'
				})
				uni.scanCode({
					success: function(res) {
						that.refresh();
						that.getdeviceinfo(res.result)
					}
				})
			},
			async getdeviceinfo(msg) {
				let id = msg;
				let link = '';
				//
				if(msg.indexOf("huastech")>-1){
					id = msg.substring(msg.lastIndexOf("=")+1);
				}else{
					link = msg.substring(msg.lastIndexOf("//")+2);
					id = '0';
				}
				// if(msg.indexOf("http")>-1){
				// 	link = msg.substring(msg.lastIndexOf("//")+2);
				// 	id = '0';
				// }
				const { data:res } = await this.$http('/searchAsset', {
					'assetId': id,
					'detailsId': this.detail.detailsId,
					'remark': link,
					'userId':this.useUserId
				});
				if(res.code) return;
				if(res.ads && res.ads.operationTime){
					uni.showToast({
						title: "当前资产已盘点",
						icon: 'error'
					})
				}
				this.detail = res.asset;
				this.detail.detailsId = res.detailsId;
				this.detail.statusName = res.asset.status == 1 ? '故障' : '正常';
				let urls = this.detail.photo.split(",")
				for (var i = 0; i < urls.length; i++) {
					this.fileList1.push({
						url: this.API_URL + urls[i]
					})
				}
				this.show=true;
			},
			async getDept() {
				const { data:res } = await this.$http('/deptList', {});
				if(res.code) return
				this.deptActions = [];
				for (var i = 0; i < res.data.length; i++) {
					this.deptActions.push({
						name: res.data[i].deptName,
						value: res.data[i].id
					})
				}
			},
			refresh(){
				this.getDept();
				this.fileList1=[];
				this.show=false;
			},
			statusSelect(e) {
				this.detail.statusName = e.name
				this.detail.status = e.value
				this.$refs.form1.validateField('detail.status')
			},
			deptSelect(e) {
				this.detail.deptName = e.name
				this.detail.deptId = e.value
				this.$refs.form1.validateField('detail.deptName')
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					const token = uni.getStorageSync("token");
					let a = uni.uploadFile({
						url: this.BASE_URL+'/upload', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						header: {
							"Authorization":"Bearer " + token,
						},
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								let data = JSON.parse(res.data)
								console.log(data)
								resolve(data.fileName)
							}, 1000)
						}
					});
				})
			},
			showDone(){
				this.queryAsset(1);
				this.doneInfoShow = true;
			},
			showUndo(){
				this.queryAsset(0);
				this.undoInfoShow = true;
			},
			async queryAsset(status){
				const { data:res } = await this.$http('/queryAsset', {
					'detailsId':this.detail.detailsId,
					'status': status
					});
				if(res.code) return
				if(status == 0){
					this.undoInfoList = res.data;

					if(this.undo > 0){
						this.undoNumber = "(未知剩余："+(this.undo-this.undoInfoList.length)+")";
					}else{
						this.undoNumber=''
					}
				}else{
					this.doneInfoList = res.data;
				}
			},
			toSubmit(){
				//判断是否已绑定
				if(this.detail.id){
					this.submit()
				}else{
					this.sbmtShow = true
				}
				
			},
			submit(){
				this.sbmtShow = false
				let url = [];
				for (var i = 0; i < this.fileList1.length; i++) {
					url.push(this.fileList1[i].url.slice(this.fileList1[i].url.indexOf("/profile")))
				}
				for (var i = 0; i < this.fileList1.length; i++) {
					url.push(this.fileList1[i].url)
				}
				this.detail.picUrl = url.join(",");
				this.detail.useUserId = this.useUserId;
				this.detail.nickName = this.nickName;
				if(!this.detail.assetNumber || this.fileList1.length==0){
					return uni.showToast({
						title: "请将内容补充完整",
						icon: 'error'
					})
				}
				this.pdAsset()
			},
			async pdAsset(){
				const { data:res } = await this.$http('/pdAsset', this.detail);
				if(res.code) return
				this.show = false;
				this.getTaskDetailsCount()
			},
			async pdDone(){
				const { data:res } = await this.$http('/pdAssetEnd/'+this.detail.detailsId, {});
				if(res.code) return
				this.back()
			},
			back(){
				//uni.navigateBack()//默认delta:1
				uni.navigateBack({
					delta:1,//返回层数，2则上上页
				})
			},
			sbmtClose() {
			  this.sbmtShow = false
			}
		}
	}
</script>

<style lang="scss">
	.details {
		background: #f6f6f6;
		height: 100vh;
		.search {
			padding: 0 5vw;
			background: #eef;
			display: flex;
			// .u-icon {
			// 	margin-left: 10px;
			// }
			.u-text{
				justify-content: center !important;
			}
		}
		.main {
			background: #ffffff;
			margin: 2.667vw;
			padding: 2vw;
			border-radius: 8px;
			
			.u-form-item__body__right{
				padding-left: 20vw;
			}
		}
		.submit{
			margin: 1vh 2.667vw;
		}
		.popup{
			padding: 3vw 0;
			.u-text{
				justify-content: center !important;
				margin-bottom: 3vw !important;
			}
		}
	}
</style>