byte-sailing-storage-android/pages/store-manage/day-check/day-check-result.vue

<!-- 批量盘点提交结果 -->
<template>
	<view class="container-wrap">
		<uni-nav-bar title="异常标签处理" :status-bar="true" background-color="#3F92F9" color="#FFF">
			<view slot="left">
				<u-icon name="account-fill" color="#FFF" size="35"></u-icon>
				<span style="padding: 0 5rpx;color: #FFFFFF;">{{ userInfo.name }}</span>
			</view>
			<view slot="right" @tap="$utils.back()">
				<span style="color: #FFFFFF;">返回</span>
			</view>
		</uni-nav-bar>
		<view class="container">
			<!-- 扫描到RFID标签时，打开质检结果 -->
			<view class="info" style="margin: 30rpx 0;">
				<view class="row flex-start">
					<view class="col">
						<view class="label">
							物料类型：
						</view>
						<view class="value">
							{{ data.materialType }}
						</view>
					</view>
					<view class="col">
						<view class="label">
							标签编码：
						</view>
						<view class="value">
							{{ data.materialCode }}
						</view>
					</view>
				</view>
				<view class="row flex-start">
					<view class="col">
						<view class="label">
							物料名称：
						</view>
						<view class="value">
							{{ data.materialName }}
						</view>
					</view>
				</view>
				<view class="row flex-start">
					<view class="col">
						<view class="label">
							所在仓库：
						</view>
						<view class="value">
							{{ data.saveHouse }}
						</view>
					</view>
					<view class="col">
						<view class="label">
							放置区域：
						</view>
						<view class="value">
							{{ data.stockArea }}
						</view>
					</view>
				</view>
				<view class="row flex-start">
					<view class="col">
						<view class="label">
							库存件数：
						</view>
						<view class="value">
							{{ data.tagNum }}
						</view>
					</view>
					<view class="col">
						<view class="label">
							库存数量：
						</view>
						<view class="value">
							{{ data.quantity }}
						</view>
					</view>
				</view>
			</view>
			<view @tap="newTag" style="color: #007AFF;text-align: right;padding: 10rpx 20rpx;">新建标签</view>
			<view class="info bottom-list">
				<view class="item" v-for="(item, index) in list" :key="index" @tap="errTagHandle(item)">
					<view class="row">
						<view class="col">
							<view class="label">标签值：</view>
							<view class="value">{{ item.rfidCode }}</view>
						</view>
						<view v-if="item.isNewTagFlag"
							style="color: #FFFFFF;background-color: red;border-radius: 20rpx;height: 32rpx;line-height: 32rpx;padding: 0 10rpx;">
							new
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">绑定数量：</view>
							<view class="value">{{ item.quantity }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">异常类型：</view>
							<view class="value">{{ item.statusColor === 'red' ? '不存在库' : '未扫描到' }}</view>
						</view>
						<view class="col">
							<view class="label">处置类型：</view>
							<view class="value">{{ item.tagDealTypeName }}</view>
						</view>
					</view>
				</view>
			</view>
			<view style="padding: 10rpx 0;text-align: center;">标签异常数量：{{ list.length }}</view>
		</view>
		<view class="btn">
			<my-fixed-button :customClick="true" @click="over" text="提交"></my-fixed-button>
			<!-- 标签处置（未扫描到） -->
			<my-dialog v-model="notScanShow" title="标签处置（未扫描到）" :showCancelButton="false" :closeOnClickOverlay="true"
				@cfmClick="notScanCfm" @cancelClick="notScanCancel">
				<view slot="content" style="width: 100%;padding: 0 20rpx;">
					<view class="row">
						<view class="col">
							<view class="label">标签值：</view>
							<view class="value">{{ currentItem.rfidCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">数量：</view>
							<view class="value">{{ currentItem.quantity }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">处置类型：</view>
							<view class="value">
								<select-lay :value="tagDealType" placeholder="请选择处置类型" :options="notScanTypeList"
									@selectitem="notScanTypeSelect" :zindex="1000"></select-lay>
							</view>
						</view>
					</view>
					<view class="row" v-if="tagDealTypeName === '补出库'">
						<view class="col" style="align-items: center;">
							<view class="label">处理人：</view>
							<view class="value">
								<select-lay :value="stockUserId" placeholder="请选择处理人" :options="stockUserList"
									@selectitem="userSelect" :zindex="1001"></select-lay>
							</view>
						</view>
					</view>
					<view class="row" v-if="tagDealTypeName === '标签损坏'">
						<view class="col" style="align-items: center;overflow: hidden;">
							<view class="label">更换标签：</view>
							<view class="value" style="flex: 1;overflow: hidden;word-break: break-all;word-wrap: break-word;">
								{{ rfidCode }}
							</view>
						</view>
						<view class="col" style="flex: 0;">
							<u-button throttleTime="300" @click="rfidChangeScan" type="primary" size="mini">扫描</u-button>
						</view>
					</view>
				</view>
			</my-dialog>
			<!-- 标签处置（不在库存） -->
			<my-dialog v-model="notInStockShow" title="标签处置（不在库存）" :showCancelButton="false" :closeOnClickOverlay="true"
				@cfmClick="notInStockCfm()">
				<view slot="content" style="width: 100%;padding: 0 20rpx;">
					<view class="row">
						<view class="col">
							<view class="label">标签值：</view>
							<view class="value">{{ currentItem.rfidCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">数量：</view>
							<view class="value">{{ currentItem.quantity }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">处置类型：</view>
							<view class="value">
								<select-lay :value="tagDealType" placeholder="请选择处置类型" :options="handleTypeList"
									@selectitem="handleTypeSelect" :zindex="1000"></select-lay>
							</view>
						</view>
					</view>
				</view>
			</my-dialog>
			<!-- 新建标签弹窗 -->
			<my-dialog v-model="newTagShow" title="新建标签" :showCancelButton="false" :closeOnClickOverlay="true"
				@cancelClick="newTagCancel" @cfmClick="newTagCfm()">
				<view slot="content" style="width: 100%;padding: 0 20rpx;">
					<view class="row">
						<view class="col">
							<view class="label">物料类型：</view>
							<view class="value">{{ data.materialType }}</view>
						</view>
						<view class="col">
							<view class="label">物料编码：</view>
							<view class="value">{{ data.materialCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">物料名称：</view>
							<view class="value">{{ data.materialName }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">所在仓库：</view>
							<view class="value">{{ data.saveHouse }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">放置区域：</view>
							<view class="value">{{ data.stockArea }}</view>
						</view>
					</view>
					<view class="row">
						<!-- 扫描rfid -->
						<view class="reading">
							<u-image height="150rpx" mode="aspectFit" src="../../../static/images/rfid.png"></u-image>
							<view class="title" v-if="isReading">扫描中...</view>
							<view class="title" v-if="!isReading">扫描结果</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">标签值：</view>
							<view class="value">{{ rfidCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">关联合同：</view>
							<view class="value" style="display: flex;justify-content: space-between;">
								<p style="flex: 1;overflow: hidden;word-wrap: break-word;">{{ purchaseBillNo }}</p>
								<view @tap="chooseContract" style="color: #007AFF;">选择合同批次</view>
							</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">批次号：</view>
							<view class="value">{{ batchNo }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">处置类型：</view>
							<view class="value">
								<select-lay :value="tagDealType" placeholder="请选择处置类型" :options="handleTypeList"
									@selectitem="handleTypeSelect" :zindex="1000"></select-lay>
							</view>
						</view>
					</view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">数量：</view>
							<view class="value">
								<u-input v-model="quantity" :border="true" />
							</view>
						</view>
					</view>
				</view>
			</my-dialog>
			<!-- 标签更换 -->
			<my-dialog v-model="changeRfidShow" title="标签更换" :showCancelButton="false" :closeOnClickOverlay="true"
				@cancelClick="changeRfidCancel" @cfmClick="changeRfidCfm">
				<view slot="content" style="width: 100%;padding: 0 20rpx;">
					<view class="row">
						<view class="col">
							<view class="label">物料类型：</view>
							<view class="value">{{ data.materialType }}</view>
						</view>
						<view class="col">
							<view class="label">物料编码：</view>
							<view class="value">{{ data.materialCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">物料名称：</view>
							<view class="value">{{ data.materialName }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">所在仓库：</view>
							<view class="value">{{ data.saveHouse }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">放置区域：</view>
							<view class="value">{{ data.stockArea }}</view>
						</view>
					</view>
					<view class="row">
						<!-- 扫描rfid -->
						<view class="reading">
							<u-image height="150rpx" mode="aspectFit" src="../../../static/images/rfid.png"></u-image>
							<view class="title" v-if="isReading">扫描中...</view>
							<view class="title" v-if="!isReading">扫描结果</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">原标签值：</view>
							<view class="value">{{ currentItem.rfidCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">原数量：</view>
							<view class="value">{{ currentItem.quantity }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">新标签值：</view>
							<view class="value">{{ newRfidCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">新数量：</view>
							<view class="value">
								<u-input v-model="newQuantity" :border="true" />
							</view>
						</view>
					</view>
				</view>
			</my-dialog>
			<!-- 盘点结果弹窗 -->
			<my-dialog v-model="show" title="盘点结果" :showCancelButton="false" :closeOnClickOverlay="true"
				@cancelClick="cancel" @cfmClick="cfm">
				<view slot="content" style="width: 100%;padding: 0 20rpx;">
					<view class="row">
						<view class="col">
							<view class="label">物料类型：</view>
							<view class="value">{{ data.materialType }}</view>
						</view>
						<view class="col">
							<view class="label">物料编码：</view>
							<view class="value">{{ data.materialCode }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">物料名称：</view>
							<view class="value">{{ data.materialName }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">所在仓库：</view>
							<view class="value">{{ data.saveHouse }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label">放置区域：</view>
							<view class="value">{{ data.stockArea }}</view>
						</view>
					</view>
					<view class="row border"></view>
					<view class="row">
						<view class="col">
							<view class="label">库存件数：</view>
							<view class="value">{{ data.tagNum }}</view>
						</view>
						<view class="col">
							<view class="label">扫描件数：</view>
							<view class="value">{{ scanCount }}</view>
						</view>
					</view>
					<view class="row">
						<view class="col">
							<view class="label" style="width: 180rpx;color: red;">异常标签数：</view>
							<view class="value" style="color: red;">{{ list.length }}</view>
						</view>
					</view>
					<view class="row border"></view>
					<view class="row">
						<view class="col" style="align-items: center;">
							<view class="label">实物件数：</view>
							<view class="value">
								<u-input v-model="quantity" :border="true" />
							</view>
						</view>
					</view>
				</view>
			</my-dialog>
		</view>
	</view>
</template>

<script>
	const uhf = uni.requireNativePlugin('js-uhf');
	export default {
		data() {
			return {
				rfidCode: '',
				quantity: '',
				newQuantity: '',
				newRfidCode: '',
				purchaseBillNo: '', // 关联合同号
				batchNo: '', // 关联批次号
				stockUserId: '',
				tagDealType: '',
				tagDealTypeName: '',
				timer: null,
				changeRfidShow: false, // 标签更换
				notScanShow: false, // 未扫描到
				notInStockShow: false, // 不在库存
				newTagShow: false, // 新建标签
				show: false,
				isReading: true,
				currentItem: {}, // 当前处理对象
				data: {},
				stockUserList: [],
				normalList: [],
				rfidItems: [],
				scanCount: 0,
				list: [],
				// 新建标签处置类型
				handleTypeList: [{
						label: '补入库',
						value: 13
					},
					{
						label: '盘盈',
						value: 11
					}
				],
				// 未扫描到处理类型
				notScanTypeList: [
					{
						label: '补出库',
						value: 23
					},
					{
						label: '标签错误',
						value: 24
					},
					{
						label: '标签损坏',
						value: 10
					},
					{
						label: '盘亏',
						value: 21
					}
				]			
			};
		},
		methods: {
			/* 未扫描到确认 */
			notScanCfm () {
				if(!this.tagDealTypeName) return this.$msg.showToast('请选择处置类型')
				if(this.tagDealTypeName === '补出库') {
					if(!this.stockUserId) return this.$msg.showToast('请选择处理人')
					this.currentItem.stockUserId = this.stockUserId
				}
				if(this.tagDealTypeName === '标签损坏') {
					if(!this.rfidCode) return this.$msg.showToast('请绑定需要更换的标签')
					this.currentItem.newQuantity = this.quantity
				}
				this.currentItem.tagDealType = this.tagDealType
				this.currentItem.tagDealTypeName = this.tagDealTypeName
				this.currentItem.newRfidCode = this.rfidCode
				this.notScanCancel()
			},
			notScanCancel () {
				this.notScanShow = false
				this.currentItem = {}
				this.tagDealTypeName = ''
				this.tagDealType = ''
				this.rfidCode = ''
				this.quantity = ''
				this.stockUserId = ''
			},
			/* 更换标签确认 */
			changeRfidCfm () {
				if (!this.newRfidCode) return this.$msg.showToast('请绑定标签')
				if (!this.newQuantity) return this.$msg.showToast('请输入数量')
				this.rfidCode = this.newRfidCode
				this.quantity = this.newQuantity
				this.changeRfidCancel()
			},
			changeRfidCancel () {
				this.$pda.uhfStop()
				this.changeRfidShow = false
				this.newRfidCode = ''
				this.newQuantity = ''
			},
			/* 扫描更换标签 */
			rfidChangeScan () {
				this.isReading = true
				this.changeRfidShow = true
				this.rfidCode = ''
				this.quantity = ''
				this.$pda.uhfScan().then(res => {
					console.log(res)
					this.isReading = false
					this.newRfidCode = res[0].epc
					console.log(this.rfidCode)
				}).catch(() => {
					this.$msg.showToast('未识别到有效RFID标签！')
					this.timer = setTimeout(() => {
						this.changeRfidShow = false
					}, 1000)
				})
			},
			/* 标签点击处理 */
			errTagHandle(item) {
				this.currentItem = item
				if (item.statusColor === 'red') {
					this.notInStockShow = true
				} else {
					this.notScanShow = true
				}
			},
			/* 新建标签 */
			newTag() {
				this.newTagShow = true
				this.isReading = true
				this.$pda.uhfScan().then(res => {
					console.log(res)
					this.isReading = false
					this.rfidCode = res[0].epc
					console.log(this.rfidCode)
				}).catch(() => {
					this.$msg.showToast('未识别到有效RFID标签！')
					this.timer = setTimeout(() => {
						this.newTagShow = false
					}, 1000)
				})
			},
			/* 新建标签提交 */
			newTagCfm() {
				if (!this.rfidCode) return this.$msg.showToast('请绑定标签')
				if (!this.quantity) return this.$msg.showToast('请输入数量')
				this.$http.CreateTag({
					materialCode: this.data.materialCode,
					rfidCode: this.rfidCode,
					quantity: this.quantity,
					purchaseBillNo: this.purchaseBillNo,
					batchNo: this.batchNo
				}).then(res => {
					if (res.code === 0) {
						this.$msg.showToast(res.msg || '操作成功')
						this.list.push({
							rfidCode: this.rfidCode,
							quantity: this.quantity,
							statusColor: 'red',
							tagDealType: this.tagDealType,
							tagDealTypeName: this.tagDealTypeName,
							isNewTagFlag: true
						})
						this.newTagCancel()
					}
				})
			},
			/* 新建标签弹窗关闭 */
			newTagCancel() {
				this.newTagShow = false
				this.$pda.uhfStop()
				this.rfidCode = ''
				this.quantity = ''
				this.tagDealType = ''
				this.tagDealTypeName = ''
				this.purchaseBillNo = ''
				this.batchNo = ''
			},
			/* 选择处理人 */
			userSelect(index, item) {
				this.stockUserId = item.value;
			},
			/* 新建标签/不在库存处置 处置类型选择 */
			handleTypeSelect(index, item) {
				this.tagDealType = item.value;
				this.tagDealTypeName = this.handleTypeList[index].label
			},
			/* 未扫描到 处置类型选择 */
			notScanTypeSelect(index, item) {
				this.tagDealType = item.value;
				this.tagDealTypeName = this.notScanTypeList[index].label
			},
			/* 标签处置（不在库存）确认 */
			notInStockCfm () {
				this.currentItem.tagDealType = this.tagDealType
				this.currentItem.tagDealTypeName = this.tagDealTypeName
				this.notInStockShow = false
				this.tagDealType = ''
				this.tagDealTypeName = ''
				this.currentItem = {}
			},
			/* 选择合同 */
			chooseContract() {
				this.$utils.open(`/pages/store-manage/contract-list/contract-list?materialCode=${this.data.materialCode}`)
			},
			cancel() {
				this.quantity = ''
				this.show = false
			},
			over() {
				this.handQty = this.data.quantity
				this.handTagQty = this.data.tagNum
				this.show = true
			},
			cfm() {
				if (!this.quantity) {
					return this.$msg.showToast('请输入实物件数！')
				}
				let list = [...this.list, ...this.normalList]
				list.forEach(item => {
					item.checkTagState = item.statusColor === 'black' ? 0 : item.statusColor === 'red' ? 1 : 2
				})
				console.log({
					detailId: this.data.id,
					handTagQty: this.quantity,
					errorTagList: list
				})
				this.$http.SubmitCheckResult({
					detailId: this.data.id,
					handTagQty: this.quantity,
					errorTagList: list
				}).then(res => {
					console.log(res)
					if (res.code === 0) {
						this.$msg.showToast(res.msg || '操作成功！')
						this.timer = setTimeout(() => {
							this.$utils.back(2)
						}, 1000)
					}
				})
			},
			getStockUserList() {
				this.$http.GetUserPageList({
					pageIndex: 1,
					pageSize: 999,
					takeUser: true
				}).then(res => {
					if(res.code == 0) {
						let list = res.result.list.map(item => {
							return {
							  label: item.realName,
							  value: item.id
							}
						})
						this.stockUserList = list
					}
				})
			}
		},
		onLoad(option) {
			this.data = JSON.parse(option.data)
			this.list = JSON.parse(option.list)
			this.normalList = JSON.parse(option.normalList)
			this.rfidItems = JSON.parse(option.rfidItems)
			this.scanCount = option.scanCount
			this.getStockUserList()
			console.log(this.data)
			uni.$on('chooseContract', res => {
				console.log('purchaseBillNo-', this.purchaseBillNo)
				this.purchaseBillNo = res.purchaseBillNo
				this.batchNo = res.batchNo
			})
		},
		onUnload() {
			this.$pda.uhfStop()
			clearTimeout(this.timer)
			uni.$off('chooseContract')
		}
	}
</script>

<style lang="scss" scoped>
	.container-wrap {
		overflow: hidden;

		.container {
			padding: 0 10rpx;
			height: calc(100vh - var(--status-bar-height) - 44px);
			overflow: hidden;
			display: flex;
			flex-direction: column;
			padding-bottom: 80rpx;

			.title {
				margin: 20rpx 60rpx;
				font-size: 36rpx;
				font-weight: bold;
				text-align: center;
			}

			.reading {
				width: 100%;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;

				.title {
					font-size: 28rpx;
				}
			}

			.info {
				padding: 10rpx 60rpx;
				border-radius: 10rpx;

				.row {
					justify-content: space-between;
					align-items: flex-start;

					.col {
						display: flex;
						flex: 1;
						overflow: hidden;
						justify-content: flex-start;
					}

					.label {
						color: inherit;
						font-size: 28rpx;
						width: 140rpx;
					}

					.value {
						color: inherit;
						font-size: 28rpx;
						flex: 1;
						overflow: hidden;
						word-wrap: break-word;
					}
				}

				.item {
					padding: 20rpx;
					background-color: #FFFFFF;
					margin-bottom: 10rpx;
					border-radius: 10rpx;
				}
			}

			.bottom-list {
				flex: 1;
				overflow: auto;
				padding: 10rpx 20rpx;
			}

			.btn {
				height: 180rpx;

				.row {
					padding: 0;
					padding-bottom: 10rpx;
					width: 100%;

					&:last-child {
						padding-bottom: 0;
					}
				}
			}

			.border {
				border-top: 1px solid #646464;
			}
		}
	}
</style>