v3-lab-xcx/pages_supplier/backlogManage/backlogManageRecycleDetail.vue

<!-- 回收申请-->
<template>
    <view id="register">
		<view class="register_li">
			<view class="register_li_min">
				<view></view>
				<view>实验地点：</view>
				<input v-model="form.qpTask.location" disabled type="text" >
			</view>
			<view class="register_li_min">
			    <view></view>
				<view>联系人：</view>
				<input v-model="form.qpTask.userName" disabled  type="text" >
			</view>
			<view class="register_li_min">
			    <view></view>
				<view>联系方式：</view>
				<input v-model="form.qpTask.phone" disabled  type="text" >
			</view>
			<view class="register_li_min" style="border: none;">
				<view></view>
				<view>申请回收时间：</view>
				<input v-model="form.bottleStorageOut.createTime" disabled  type="text" >
			</view>
		</view>
		<view class="register_li">
			<view class="register_li_min">
				<view></view>
				<view>{{specificationName.airName}}-{{specificationName.gasLevel}}：</view>
				<input v-model="'数量：'+form.taskDetail.bottleNumber" disabled  type="text" >
			</view>
		</view>
		<view  v-if="form.bottleStorageOut.outStatus==0" class="register_li">
			<picker @change="bindPickerPerson" :value="pickerIndex" :range="personList">
				<view class="register_li_min">
					<view>*</view>
					<view>运输人员：</view>
					<input v-model="form.userName" disabled type="text" placeholder="请选择运输人员">
				</view>
			</picker>
			<picker   @change="bindPickerCar" :value="pickerIndex" :range="carList">
				<view class="register_li_min">
					<view>*</view>
					<view>运输车辆：</view>
					<input v-model="form.carCode" disabled type="text" placeholder="请选择运输车辆">
				</view>
			</picker>
		</view>
		<view  v-if="form.bottleStorageOut.outStatus==0" class="sub_btn" @click="submitForm(1)">确认回收</view>
		<view  v-if="form.bottleStorageOut.outStatus==1" class="sub_btn" @click="submitForm(2)">已回收</view>
	</view>
</template>

<script>
    import {supplierBacklogDetail,
			supplierBacklogRecycleDetail,
			supplierBacklogIssueDetail,
			supplierBacklogPersonCar,
			supplierBacklogStorageOut,
			} from '@/api/apiDemo/index.js'
	import { config } from '@/api/request/config.js'
    export default {
        data() {
            return {
				listType:0,//0回收申请 1供气配送申请 2货品问题  3回收
				form:{},
				id:'',
				status:'',//gq hs wt
				personList:[],
				personListArr:[],
				carList:[],
				carListArr:[],
				editForm:{
					id:'',
					transportId:'',
					transportName:'',
					carId:'',
					carNumber:'',
					remark:'1',//确认回收1，已回收2
					outStatus:'1',//确认回收1，已回收2
				},//配送
				specificationName:{},//回收
            }
        },
       onLoad(option) {
			this.id=JSON.parse(decodeURIComponent(option.item)).id;
			this.status=JSON.parse(decodeURIComponent(option.item)).remark;
       },
        onShow(){
        },
		mounted() {
			this.getInfo();
			this.getPersonCarList();
		},
        methods: {
			//供气人员点击
			bindPickerPerson(e){
				let _this=this;
				let index=e.target.value
				_this.form.userName=this.personList[index]
				_this.editForm.transportName=this.personList[index]
				_this.personListArr.forEach(function(item){
					if(item.userName==_this.personList[index]){
						_this.editForm.transportId=item.id
					}
				})
			},
			//供气车辆点击
			bindPickerCar(e){
				let _this=this;
				let index=e.target.value
				_this.form.carCode=this.carList[index]
				_this.editForm.carNumber=this.carList[index]
				_this.carListArr.forEach(function(item){
					if(item.carCode==_this.carList[index]){
						_this.editForm.carId=item.id
					}
				})

			},

			async getPersonCarList(){
			    let _this = this;
				const {data} = await supplierBacklogPersonCar()
				if(data.code==200){
					let res=data.data
					//车辆
					_this.carListArr=res.carlist;
					if(res.carlist){
						res.carlist.forEach(function(item){
							_this.carList.push(item.carCode)
						})
					}
					//人员
					_this.personListArr=res.userlist;
					if(res.userlist){
						res.userlist.forEach(function(item){
							_this.personList.push(item.userName)
						})
					}
				}
			},
			//获取详情
			async getInfo(){
			    let _this = this;
				const {data} = await supplierBacklogRecycleDetail({id:this.id})
				if(data.code==200){
					let res=data.data
					_this.form=res;
					_this.specificationName=JSON.parse(res.taskDetail.applyDescribe)
				}
			},
			//确认回收
			async submitForm(type){
				let _this = this;

				if(type==1){
					if(!this.form.userName){
						uni.showToast({
							title: '请选择运输人员',
							icon:"none",
							mask:true,
							duration: 2000
						});
						return
					}
					if(!this.form.carCode){
						uni.showToast({
							title: '请选择运输车辆',
							icon:"none",
							mask:true,
							duration: 2000
						});
						return
					}
					this.editForm.remark=1
					this.editForm.outStatus=1
				}else{
					this.editForm.remark=2
					this.editForm.outStatus=2
					this.editForm.carId=null
					this.editForm.carNumber=null
					this.editForm.transportId=null
					this.editForm.transportName=null

				}
				_this.editForm.id=_this.id;
				const {data} = await supplierBacklogStorageOut(_this.editForm);
				if(data.code == 200){
				    uni.showToast({
				        title: '提交成功',
				        icon:"none",
				        mask:true,
				        duration: 2000
				    });
				   setTimeout(function(){
				       uni.redirectTo({
				            url: '/pages_supplier/backlogManage/backlogManage'
				        });
				    },2000);
				}

			},
        }
    }
</script>

<style lang="stylus" scoped>
    #register{
        height:auto;
        width:100%;
        display flex;
        flex-direction column;
		padding-bottom: 220rpx;
		.register_li{
			background #fff;
			border-radius:20rpx;
			margin:20rpx 20rpx 0;
			padding:20rpx 0;
			box-sizing: border-box;
			.register_li_min{
				margin:0 26rpx;
				display flex;
				align-items center;
				border-bottom: 1px solid #F5F5F5;
				view{
					line-height:100rpx;
					font-size:28rpx;
				}
				view:nth-child(1){
					color:red;
					line-height:28rpx;
					margin-right: 12rpx;
				}
				view:nth-child(2){
					//width:140rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #999999;
				}

				>input{
					flex:1;
					text-align: right;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}


			}
			.issue_li{
				margin:34rpx 26rpx 0;
				display flex;
				border-bottom: 1px solid #F5F5F5;
				view:nth-child(1){
					color:red;
					line-height:28rpx;
					margin-right: 12rpx;
				}
				view:nth-child(2){
					//width:140rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #999999;
				}
				.issue_img{
					width: 210rpx;
					height: 210rpx;
					border-radius: 10rpx;
					margin-left:310rpx;
				}
			}
		}
		/* 按钮 */
		.sub_btn{
			width: 650rpx;
			height: 100rpx;
			background: #0183FA;
			border-radius: 20rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 100rpx;
			text-align: center;
			margin-left: 50rpx;
			position: fixed;
			bottom:30rpx;
			z-index: 1000;
		}
	}
	/deep/.input-value-border{
		display :none !important;
	}
</style>