TuBaoSoft-AP/pages/home/delivery/orderDetails/index.vue

<template>
	<view>
		<view class="ordertop">
			<view>
				<view class="iconblue"></view>
				<text class="license">基础信息</text>
			</view>
			<view class="line">
				<u-line color="#ccc" border-style='dashed' />
			</view>
			<view class="basic">
				<view>货主</view>
				<view>{{form.corpName}}</view>
			</view>
			<view class="basic">
				<view>提单号</view>
				<view>{{form.fMblno}}</view>
			</view>
			<view class="basic">
				<view>箱型</view>
				<view>{{form.cntrtypes}}</view>
			</view>
			<view class="basic">
				<view>箱量</view>
				<view>{{form.cntqty}}</view>
			</view>
			<view class="basic">
				<view>箱号</view>
				<view>{{form.cntrno}}</view>
			</view>
			<view class="basic">
				<view>出库日期</view>
				<view>{{form.bsdate}}</view>
			</view>
			<view class="basic">
				<view>出库状态</view>
				<view>{{form.billstatus}}</view>
			</view>
			<view class="basic">
				<view>品名</view>
				<view>{{form.goodsName}}</view>
			</view>
			<view class="basic">
				<view>车号</view>
				<view>{{form.fTruckno}}</view>
			</view>
			<view class="basic">
				<view>司机</view>
				<view>{{form.fDriverName}}</view>
			</view>
			<view class="basic">
				<view>司机电话</view>
				<view>{{form.fDriverTel}}</view>
			</view>
			<view class="basic">
				<view>货物属性</view>
				<view>{{form.businessType}}</view>
			</view>
			<!-- <view class="basic">
				<view>货物名称</view>
				<view>{{form.fMarks}}</view>
			</view> -->
			<view class="basic">
				<view>属性详情</view>
				<view>{{form.marks}}</view>
			</view>
			<!-- <view class="basic">
				<view>库区</view>
				<view>{{form.fWarehouseInformation}}</view>
			</view> -->
			<view class="basic">
				<view>劳务公司</view>
				<view>{{form.labour}}</view>
			</view>
		</view>
		<view class="ordertop">
			<view>
				<view class="iconblue"></view>
				<text class="license">可编辑</text>
			</view>
			<view class="line">
				<u-line color="#ccc" border-style='dashed' />
			</view>
			<view class="basic" style="margin: 0 auto;height: 55rpx;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="100rpx" label="件数：">
					<u-input type="digit" :clearable="false" v-model="form.fQty" />
				</u-form-item>
			</view>
			<view class="basic" style="margin: 0 auto;height: 55rpx;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="100rpx" label="毛重：">
					<u-input type="digit" :clearable="false" v-model="form.fGrossweight" />
				</u-form-item>
			</view>
			<view class="basic" style="margin: 0 auto;height: 55rpx;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="100rpx" label="净重：">
					<u-input type="digit" :clearable="false" v-model="form.fNetweight" />
				</u-form-item>
			</view>
			<view class="basic" style="margin: 0 auto;height: 55rpx;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="100rpx" label="库区：">
					<u-select v-model="formation" mode="mutil-column-auto" :list="list" @confirm="mation"
						label-name="label" value-name="id" child-name="children"></u-select>
					<u-input type="type" :clearable="false" v-model="warehouseInformation" placeholder="请选择库区" disabled
						@click="formation = !formation" />
				</u-form-item>
			</view>
			<view class="basic" style="margin: 0 auto;height: 55rpx;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="130rpx" label="装卸工：">
					<u-input type="type" :clearable="false" v-model="form.fStevedore" />
				</u-form-item>
			</view>
			<view class="basic" style="margin: 0 auto;">
				<u-form-item style="width: 100%;" :border-bottom="false" label-width="100rpx" label="备注：">
					<u-input type="textarea" height="20rpx" :clearable="false" v-model="form.remark" />
				</u-form-item>
			</view>
		</view>
		<view class="ordertop" v-if="form.billstatus == '出库中'" style="margin-bottom: 60rpx;">
			<view>
				<view class="iconblue"></view>
				<text class="license">附件上传</text>
				<view class="various" @click="attachmentP">保存附件</view>
			</view>
			<view class="line">
				<u-line color="#ccc" border-style='dashed' />
			</view>
			<view style="width: 94%;margin: 0 auto;">
				<u-upload ref="uUpload" :deletable="false" @on-remove="onRemove" :action="action" :header="headers"
					@on-success="success" :file-list="fileList">
				</u-upload>
			</view>
		</view>
		<br>
		<view
			style="width: 100%;position:fixed; bottom:0;background-color: #FFFFFF;padding-left: 20px;padding-right: 20px;">
			<u-button type="primary" @click="appCheckCode" v-if="form.billstatus == '出库中'">出库确认</u-button>
			<u-button type="primary" @click="appCheckCode"
				v-else-if="form.billstatus == '计划'||form.billstatus == '待出库'">叫车进场</u-button>
		</view>
		<u-modal v-model="submIt" @confirm="submit" :content="content" @cancel="submIt = false"
			:show-cancel-button="true" />
		<u-modal v-model="CheckStatus" @confirm="getForm" :content="content2" @cancel="CheckStatus = false"
			:show-cancel-button="true" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				urldata: "",
				CheckStatus: false,
				title: '', //标题
				formation: false,
				list: [],
				action: this.$u.http.config.baseUrl + '/common/upload',
				// action: 'https://test.tms.tubaosoft.com/prod-api/common/upload',
				headers: {
					Authorization: 'Bearer ' + this.$store.state.vuex_token
				},
				warehouseInformation: '',
				content: '是否确认提交',
				content2: "数据发生变化，是否需要更新一下？",
				fileList: [],
				submIt: false,
				operationType: '',
				lists: [],
				warehouseBills: {},
				form: {
					mblno: '', //提单号
					carregNo: '', //车号
					transUserId: '', //调度员*
					driverUserId: '', //驾驶员*
					goodsId: '', //装货品名
					cntrQty: '', //调度数量
					ysl: '', //船名
					voy: '', //航次
					loadAddr: '', //提箱地点
					loadDate: '', //提箱时间
					loadAttntel: '', //提箱联系
					mdLoadAddr: '', //装卸地点
					mdLoadDate: '', //装卸时间
					mdLoadAttnTel: '', //装卸联系
					unLoadAddrL: '', //卸车地点
					unLadDate: '', //卸车时间
					unLoadAttnTel: '' //卸车联系
				}
			}
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数
			// console.log(option); //打印出上个页面传递的参数.
			let listi = {
				fId: JSON.parse(decodeURIComponent(option.item)).fId
			}
			this.$u.get('/warehouseBusiness/applets/appWarehouseItemDataById', listi).then(res => {
				// console.log(res)
				this.form = res.data.item
				this.warehouseInformation = this.form.warehouseInformation
				this.warehouseBills = res.data.warehouseBills
				this.form.fWarehouseInformation = res.data.item.warehouseInformation
			}).catch(err => {
				console.log(err)
			})
			for (let item in this.form.enclosure) {
				this.fileList.push({
					url: this.form.enclosure[item].fUrl,
					response: {
						fileName: this.form.enclosure[item].fName,
						url: this.form.enclosure[item].fUrl
					}
				})
			}
			for (let item in this.form.enclosure) {
				this.fileList.push({
					url: this.form.enclosure[item].fUrl,
					response: {
						fileName: this.form.enclosure[item].fName,
						url: this.form.enclosure[item].fUrl
					}
				})
			}
			console.log(this.fileList)
			uni.showLoading({
				title: '加载中'
			});
			setTimeout(function() {
				uni.hideLoading();
			}, 1000);
		},
		methods: {
			getForm() {
				this.$u.get('/warehouseBusiness/applets/appWarehouseItemDataById', {
					fId: this.form.fId
				}).then(res => {
					this.form = res.data.item
					this.warehouseInformation = this.form.warehouseInformation
					this.warehouseBills = res.data.warehouseBills
				}).catch(err => {
					console.log(err)
				})
			},
			appCheckCode() {
				if (this.form.fWarehouseInformation) {
					this.$u.get('/warehouseBusiness/applets/appCheckCode', {
						fId: this.warehouseBills.fId,
						fType: "warehouse",
						codeVal: this.warehouseBills.fDateChanged,
					}).then(res => {
						if (!res.data) {
							this.CheckStatus = true
						} else {
							this.submIt = true
						}
					}).catch(err => {
						uni.showToast({
							icon: 'none',
							title: '网络繁忙请稍后再试',
							position: "bottom"
						})
					})
				} else {
					uni.showToast({
						icon: 'none',
						title: '请选择库区',
						position: "bottom"
					})
				}
			},
			mation(e) {
				// console.log(e)
				let res = ''
				let id = ''
				for (let item in e) {
					id = e[item].value
					res += e[item].label + '/'
				}
				this.form.fWarehouseInformation = res.substr(0, res.length - 1)
				this.form.fWarehouselocid = id
				this.warehouseInformation = res.substr(0, res.length - 1)
			},
			receiving(id, i) {
				// 获取当前时间
				let date = new Date();
				let dateYear = date.getFullYear(); //获取年 
				let dateMonth = date.getMonth(); //获取月  
				let dateDate = date.getDate(); //获取当日
				uni.setNavigationBarTitle({
					title: this.title
				})
				this.$u.post('/fleet/ftmsorderbillscars/selectDriver', {
					id: id
				}).then(res => {
					console.log(res)
					this.form = res.data.cars
					switch (i) {
						case 1:
							this.form.acceptDate = dateYear + '-' + dateMonth + '-' + dateDate
							break
						case 3:
							this.form.loadDate = dateYear + '-' + dateMonth + '-' + dateDate
							break
						case 4:
							this.form.mdLoadDate = dateYear + '-' + dateMonth + '-' + dateDate
							break
						case 5:
							this.form.unLoadDate = dateYear + '-' + dateMonth + '-' + dateDate
							break
						default:
							uni.showToast({
								icon: 'none',
								title: '未知错误状态=' + i,
								position: "bottom"
							})
							break
					}
					if (this.form.acceptDate) {
						this.form.acceptDate = this.form.acceptDate.slice(0, 10)
					}
					if (this.form.loadDate) {
						this.form.loadDate = this.form.loadDate.slice(0, 10)
					}
					if (this.form.mdLoadDate) {
						this.form.mdLoadDate = this.form.mdLoadDate.slice(0, 10)
					}
					if (this.form.unLoadDate) {
						this.form.unLoadDate = this.form.unLoadDate.slice(0, 10)
					}
				}).catch(err => {
					uni.showToast({
						icon: 'none',
						title: '网络繁忙请稍后再试',
						position: "bottom"
					})
				})
			},
			success(data, index, lists, name) {
				// console.log(data)
				// console.log(index)
				// console.log(lists)
				// console.log(name)
				// console.log(this.fileList)
			},
			attachmentP() {
				this.lists = []
				console.log(this.fileList)
				console.log(this.$refs.uUpload.lists)
				let lists = this.$refs.uUpload.lists
				if (lists.length != 0) {
					for (let item in this.$refs.uUpload.lists) {
						console.log(this.$refs.uUpload.lists[item].response)
						if (this.$refs.uUpload.lists[item].response) {
							this.lists.push({
								fUrl: this.$refs.uUpload.lists[item].response.url,
								fName: this.$refs.uUpload.lists[item].response.fileName
							})
						}
					}
				}
				let fileList = []
				console.log(this.fileList)
				if (this.fileList.length != 0) {
					for (let item in this.fileList) {
						fileList.push({
							fUrl: this.fileList[item].response.url,
							fName: this.fileList[item].response.fileName
						})
					}
				}
				this.lists = this.lists.concat(fileList)
				console.log(this.lists)
				this.$u.post('/warehouseBusiness/applets/appSubmitWarehouse', {
					item: this.form,
					attachs: this.lists
				}).then(res => {
					console.log(res)
					if (res.data.code == 500) {
						if (res.data.msg == 'parseDecimal error, field : oilAmt') {
							uni.showToast({
								icon: 'none',
								title: '数字不正确，请检查后再提交',
								position: "bottom"
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg,
								position: "bottom"
							})
						}
					} else if (res.data.code == 200) {
						// uni.navigateBack();
						uni.showToast({
							icon: 'none',
							title: '保存成功',
							position: "bottom"
						})
					}
				}).catch(err => {
					uni.showToast({
						icon: 'none',
						title: '网络繁忙请稍后再试',
						position: "bottom"
					})
				})
			},
			//提交
			submit() {
				if (this.form.billstatus == '出库中') {
					this.lists = []
					console.log(this.fileList)
					console.log(this.$refs.uUpload.lists)
					let lists = this.$refs.uUpload.lists
					if (lists.length != 0) {
						for (let item in this.$refs.uUpload.lists) {
							console.log(this.$refs.uUpload.lists[item].response)
							if (this.$refs.uUpload.lists[item].response) {
								this.lists.push({
									fUrl: this.$refs.uUpload.lists[item].response.url,
									fName: this.$refs.uUpload.lists[item].response.fileName
								})
							}
						}
					}
					let fileList = []
					console.log(this.fileList)
					if (this.fileList.length != 0) {
						for (let item in this.fileList) {
							fileList.push({
								fUrl: this.fileList[item].response.url,
								fName: this.fileList[item].response.fileName
							})
						}
					}
					this.lists = this.lists.concat(fileList)
					this.$u.post('/warehouseBusiness/applets/appOperationConfirmation', {
						item: this.form,
						attachs: this.lists
					}).then(res => {
						console.log(res)
						if (res.data.code == 500) {
							if (res.data.msg == 'parseDecimal error, field : oilAmt') {
								uni.showToast({
									icon: 'none',
									title: '数字不正确，请检查后再提交',
									position: "bottom"
								})
							} else {
								uni.showToast({
									icon: 'none',
									title: res.data.msg,
									position: "bottom"
								})
							}
						} else if (res.data.code == 200) {
							uni.navigateBack();
						}
					}).catch(err => {
						uni.showToast({
							icon: 'none',
							title: '网络繁忙请稍后再试',
							position: "bottom"
						})
					})
				} else {
					this.$u.post('/warehouseBusiness/applets/appWarehouseOperation', {
						item: this.form,
						attachs: []
					}).then(res => {
						console.log(res)
						if (res.data.code == 500) {
							if (res.data.msg == 'parseDecimal error, field : oilAmt') {
								uni.showToast({
									icon: 'none',
									title: '数字不正确，请检查后再提交',
									position: "bottom"
								})
							} else {
								uni.showToast({
									icon: 'none',
									title: res.data.msg,
									position: "bottom"
								})
							}
						} else if (res.data.code == 200) {
							uni.redirectTo({
								url: '../index'
							});
							uni.makePhoneCall({
								phoneNumber: '' + this.form.fDriverTel, // 手机号
							});
						}
					}).catch(err => {
						uni.showToast({
							icon: 'none',
							title: '网络繁忙请稍后再试',
							position: "bottom"
						})
					})
				}
			}
		}
	};
</script>

<style scoped lang="scss">
	.basic {
		width: 94%;
		margin: 10rpx auto;
		display: flex;
		justify-content: space-between;
	}

	.basic>view {
		margin-bottom: 10rpx;
	}

	.basic>view:nth-child(1) {
		color: #797979;
	}

	.license {
		float: left;
		font-size: 32rpx;
	}

	.ordertop {
		width: 96%;
		background-color: #fff;
		margin: 20rpx auto;
		border-radius: 20rpx;
		padding-top: 20rpx;
		box-shadow: 0px 0px 8px 0px rgba(165, 189, 251, 0.4);
		padding-bottom: 10rpx;
	}

	.ordertop>view:nth-child(1) {
		width: 98%;
		margin-bottom: 60rpx;
	}

	.iconblue {
		width: 10rpx;
		height: 45rpx;
		float: left;
		background-color: #3a63cf;
		margin-right: 10rpx;
	}

	.various {
		float: right;
		width: 150rpx;
		border: 2rpx solid #3a63cf;
		text-align: center;
		border-radius: 100rpx;
		color: #3a63cf;
	}

	.line {
		width: 92%;
		margin: 0 auto;
	}
</style>