dnyAppTruck/pages/feedback/scancodeCar.vue

<template>
	<view style="padding-bottom:118rpx;">
		<uni-list :border="false">
			<uni-list-item v-for="(item,index) in breedTaskList" :key="item.id" :index="index" :threshold="0">
				<template slot="body">
					<uni-card>
						<u-row>
							<u-col span="10">
								<view class="demo-layout">
									<view>{{item.branchLineName}}<span>{{item.shipmentPackageCount}}</span>{{item.shipmentUnit}}</view>
                  <view>{{item.erpOrderCode}}</view>
									<view>{{item.shipmentName}}</view>
								</view>
							</u-col>
							<u-col span="2">
								<u-button @click="deleteBtn(index)" size="small" type="warning" text="移除"></u-button>
							</u-col>
						</u-row>
					</uni-card>
				</template>
			</uni-list-item>
		</uni-list>
		<view class="footer">
			<view>
				<view>
					<text style="margin-top: -10rpx;" class="footer-text">包数：<span>{{totalUnit}}</span></text>
				</view>
			</view>
			<view @click="confirmOrderCodes">确认装车</view>
		</view>

		<uni-fab style="bottom: 100rpx;" ref="fab" :pattern="fabPattern" icon="color" :popMenu="false" horizontal="right" vertical="bottom"
			@fabClick="scanFabClick" />
	</view>
</template>

<script>
	import request from '@/common/libs/request.js';
	export default {
		data() {
			return {
				token:"",
				totalUnit:0,
				fabPattern: {
					color: '#7A7E83',
					backgroundColor: '#fff',
					selectedColor: '#007AFF',
					buttonColor: '#007AFF',
					iconColor: '#fff'
				},
				breedTaskList: []
			}
		},
		mounted() {
			this.initData()
		},
		methods: {
			confirmOrderCodes(){
				let _that = this;
				var ids = [];
				if(_that.breedTaskList.length<=0){
					uni.showToast({
						title: "请先扫码",
						icon: 'none'
					})
          return
				}
				for (let i = 0; i < _that.breedTaskList.length; i++) {
					ids.push(_that.breedTaskList[i].id)
				}
				let parms = {
					idBillItems: ids.join(','),
					token: _that.token
				}
				request.httpPost("/dnyDriver/truckUp", parms, true).then(res => {
					_that.initData()
					if (res.httpCode == 200) {
					_that.breedTaskList = [];
					_that.totalUnit=0;
					uni.showToast({
						title: "装车成功",
					})
					}else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							mask: true,
							duration: 3000,
						})
					}
				});
			},
			initData(){
				let _that = this;
				request.httpPost("/dnyDriver/driverFormToken", {},true).then(tokenRes => {
					console.log(tokenRes)
					_that.token = tokenRes.data
				})
			},
			scanFabClick() {
				let _that = this;
				uni.scanCode({
					onlyFromCamera: true,
					scanType: ['barCode', 'qrCode'],
					success: function(res) {
            if (res.result.indexOf('sendOrder') != -1) {
              let idOrder = res.result.split("-")[2];
              _that.truckUpOrder(idOrder)
            }else if(res.result.indexOf('orderLabel') != -1){
              let orderCode = res.result.split("-")[1];
              _that.getShipDetails(orderCode)
            }else {
              uni.showToast({
                title: "请扫包上的标签码",
                icon: 'none'
              })
            }

					}
				})
			},
      truckUpOrder(idOrder){
        let _that = this;
        let parms = {
          idOrder: idOrder
        }
        request.httpPost("/dnyDriver/truckUpScanSendOrder", parms, true).then(res => {
          if(res.httpCode==200){
            var datas = res.data.inputItemList;
            for (let i = 0; i < datas.length; i++) {
              var items = datas[i]
              var itemData = {
                'branchLineName':items.branchLineName,
                'shipmentName':items.shipmentName,
                'shipmentPackageCount':items.shipmentPackageCount,
                'erpOrderCode':items.erpOrderCode,
                'shipmentUnit':items.shipmentUnit,
                'id':items.id
              }
              if(!_that.breedTaskList.find(x => x.id === items.id)){
                _that.totalUnit+=items.shipmentPackageCount
                _that.breedTaskList.push(itemData)
              }else {
                uni.showToast({
                  title: "此单已扫码",
                  icon: 'none'
                })
              }

            }

            if(res.data.inputString){
              uni.showToast({
                title: res.data.inputString,
                icon: 'none',
                mask: true,
                duration: 4000,
              })
            }
          }else {
            uni.showToast({
              title: res.msg,
              icon: 'none',
              mask: true,
              duration: 4000,
            })
          }
        })
      },
			getShipDetails(orderCode) {
				let _that = this;
				let parms = {
          orderCode: orderCode
				}
				request.httpPost("/dnyDriver/truckUpScanERPOrder", parms, true).then(res => {
          if(res.httpCode==200){
            var datas = res.data.inputItemList;
            for (let i = 0; i < datas.length; i++) {
              var items = datas[i]
              var itemData = {
                'branchLineName':items.branchLineName,
                'shipmentName':items.shipmentName,
                'shipmentPackageCount':items.shipmentPackageCount,
                'shipmentUnit':items.shipmentUnit,
                'erpOrderCode':items.erpOrderCode,
                'id':items.id
              }
              if(!_that.breedTaskList.find(x => x.id === items.id)){
                _that.totalUnit+=items.shipmentPackageCount
                _that.breedTaskList.push(itemData)
              }else {
                uni.showToast({
                  title: "此单已扫码",
                  icon: 'none'
                })
              }

            }

            if(res.data.inputString){
              uni.showToast({
                title: res.data.inputString,
                icon: 'none',
                mask: true,
                duration: 4000,
              })
            }
          }else {
            uni.showToast({
              title: res.msg,
              icon: 'none',
              mask: true,
              duration: 4000,
            })
          }

				});
			},

			deleteBtn(index){
				this.totalUnit = this.totalUnit-this.breedTaskList[index].shipmentPackageCount
				this.breedTaskList.splice(index, 1)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.footer-text span{
		font-weight: bold;
		color: #e4493c;
		padding: 0 10rpx;
	}
	.demo-layout span{
		font-weight: bold;
		color: #e4493c;
		padding: 0 10rpx;
	}
	.span-txt{
		font-weight: bold;
		color: #e4493c;
	}
	.demo-layout{
		font-size: 36rpx;
	}
	/deep/ .uni-card .uni-card__header{
		border-bottom: none !important;
	}
	/deep/ .uni-list-item__container {
		padding: 0rpx;
	}
	/deep/ .fab{
		.uniui-plusempty:before {
			//content: "\e67b";
			content: '\e654' !important;
		}
	}
	.card-actions {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		height: 45px;
		border-top: 1px #eee solid;
	}

	.card-actions-item {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.card-actions-item-text {
		font-size: 12px;
		color: #666;
		margin-left: 5px;
	}

	.textTitle {
		border-left: 0px solid #007AFF;
		display: inline-block;
		width: 180rpx;
		text-align: left;
		margin-bottom: 5px;
		color: #8799a3;
	}

	.u-popup-slot {
		width: 750rpx;
		height: 400px;
		@include flex;
		justify-content: center;
		align-items: center;
		padding: 20px;
	}
	.footer {
		position: fixed;
		bottom: 0;
		z-index: 10;
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 108rpx;
		background: #FFFFFF;
		border-top: 1px solid #E8E8E8;

		>view {
			width: 50%;
			height: 100%;
			font-size: 34rpx;
			font-weight: 600;
			display: flex;
			justify-content: center;
			align-items: center;

			&:active {
				opacity: 0.8;
			}

			.cart {
				width: 67rpx;
				height: 67rpx;
				margin-top: 10rpx;
				margin-right: 25rpx;
			}

			.amout {
				font-size: 34rpx;

				>text {
					font-size: 20rpx;
				}
			}

			.badge {
				position: relative;

				>text {
					position: absolute;
					top: 2rpx;
					right: 10rpx;
					z-index: 10;
					font-size: 22rpx;
					background: #FF3D00;
					border-radius: 50%;
					color: #fff;
					padding: 0 10rpx 2rpx;
				}
			}
		}
		>view:last-child {
			background: #FFD202;
		}
	}
</style>