jsy-app/pages/retrace/signBillAdd.vue

<template></template>
<!-- <template>
	<view class="create-container">
		<custom-nav-bar :left="true" title="签收单新增">
			<template v-slot:right>
				<view class="fixed">
					<view align="right" class="icon iconfont icon-scan" @click="toQRCode"></view>
					<view align="right" class="icon iconfont icon-NFC1" @click="nfc"></view>
					<view align="right" class="iconfont icon-jia icon" @click="add"></view>
				</view>
			</template>
		</custom-nav-bar>
		<uni-section title="基础信息" type="line">
			<u--form labelPosition="left" :model="briefForm" :rules="rules" ref="form">
				<u-line color="#D2D2D2"></u-line>
				<u-form-item class="form-item" label="仓库" prop="storageInName" labelWidth="100px" required>
					<u--input style="background: white" @click="showStorageIn=true" v-model="briefForm.storageInName"
						border="none" disabled placeholder="请选择仓库" suffixIcon="arrow-right"
						class="custom-input"></u--input>
				</u-form-item>
				<u-line color="#D2D2D2"></u-line>
				<u-form-item class="form-item" label="单据日期" prop="billDate" labelWidth="100px" required>
					<uni-datetime-picker v-model="briefForm.billDate" type="date" class="custom-input" />
				</u-form-item>
				<u-line color="#D2D2D2"></u-line>
				<u-form-item class="form-item" label="操作人" prop="operUser" labelWidth="100px" required>
					<u--input v-model.trim="briefForm.operUser" border="none" placeholder="" disabled
						class="custom-input"></u--input>
				</u-form-item>
				<u-line color="#D2D2D2"></u-line>
			</u--form>
		</uni-section>
		<uni-section title="明细清单" type="line">
			<u-line color="#D2D2D2"></u-line>
			<view class="item-container" v-for="item in dataList">
				<view style="display: flex; align-items: center; justify-content: space-between;">
					<view class="flex-text" style="margin: 15px;">
						<view class="flex-text-one" style="color: black;">
							{{ item.deviceCode }}：{{ item.deviceTypeName }}</view>
					</view>
					<view style="margin-right: 5px;">
						<u-button type="success" text="删除" @click="deleteDetail(item)" />
					</view>
				</view>
				<u-gap height="1" bgColor="#D2D2D2"></u-gap>
			</view>
		</uni-section>
		<view class="buttons">
			<u-button type="success" @click="submit">确认</u-button>
			<u-button @click="cancel">取消</u-button>
		</view>
		<u-action-sheet :show="showStorageIn" :actions="deviceStorageInData" title="仓库" description=""
			@close="showStorageIn = false" @select="onStorageInSelect"></u-action-sheet>
		<u-modal title="手动输入" :show="showDeviceModal" showCancelButton buttonReverse height="300px"
			@confirm="confirmDevice" @cancel="cancelDeviceInfo">
			<view class="slot-content">
				<u--form labelPosition="left" :model="deviceInfoData" ref="formDevice">
					<u-form-item label="编号" prop="deviceCode" labelWidth="100px" required>
						<u--input v-model="deviceInfoData.deviceCode" placeholder="请输入编号"></u--input>
					</u-form-item>
				</u--form>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import store from "@/store"
	import plugin from "@/plugins"
	// import {
	// 	getDeviceList
	// } from "@/api/iot/device"
	// import {
	// 	getDeviceBillInfo,
	// 	addDeviceBill,
	// 	updateDeviceBill
	// } from "@/api/iot/deviceBill"
	// import {
	// 	deleteDeviceBillWms
	// } from "@/api/iot/deviceBillWms"
	import {
		initNFC,
		closeNFC,
		//类型
		setNfcType
	} from '@/utils/nfc.js';
	export default {
		data() {
			return {
				user: store.state.user.user,
				type: "add",
				billId: null,
				form: null,
				formDevice: null,
				dataList: [],
				briefForm: {},
				addType: 1,
				showStorageIn: false,
				showDeviceModal: false,
				storageInData: store.state.user.userStorage,
				deviceStorageInData: [],
				deviceInfoData: {
					deviceCode: null
				},
				rules: {
					storageInName: {
						type: "string",
						required: true,
						message: "仓库不能为空",
						trigger: ["blur", "change"]
					},
					operUser: [{
						type: "string",
						required: true,
						message: "请填写操作人",
						trigger: ["blur", "change"]
					}],
					billDate: [{
						type: "string",
						required: true,
						message: "单据日期不能为空",
						trigger: ["blur", "change"]
					}]
				},
				editFlag: false
			}
		},
		created() {
			this.reset();
		},
		onLoad(options) {
			initNFC(({
				code,
				data,
				message
			}) => {
				if (code !== 200) {
					uni.$u.toast(message);
					return;
				}
				switch (data.type) {
					case 'cardNo':
						if (this.addType == 2) {
							this.getDeviceInfo(data.id);
						}
						break;
					case 'read':
						uni.$u.toast(data.text);
						break;
					case 'write':
						uni.$u.toast(message);
						break;
					default:
						uni.$u.toast("未知属性");
				}
			});
			if (options) {
				if (options.type) {
					this.type = options.type;
				}
				if (options.id) {
					this.billId = options.id;
				}
			}
			this.getDeviceStorageInData();
			if (this.type == "edit") {
				this.getDeviceBill();
			}
		},
		onShow() {
			setNfcType("cardNo");
		},
		methods: {
			reset() {
				this.briefForm = {
					billId: null,
					billTypeId: 2001,
					storageInId: this.storageInData[0].id,
					storageInName: this.storageInData[0].storageName,
					billDate: this.getNowFormatDate(),
					billTime: null,
					sourceBillId: null,
					sourceBillTypeId: null,
					storageOutId: null,
					operUser: this.user.userName,
					operUserId: this.user.userId,
					status: 0,
					billTime: null,
					deviceBillWmsVos: []
				};
			},
			//删除明细
			deleteDetail(item) {
				let index = this.dataList.findIndex(x => x.deviceId == item.deviceId);
				if (index != -1) {
					this.dataList.splice(index, 1);
				}
				if (this.type == "edit") {
					//明细时删除明细及更改设备仓库id及在库状态
					deleteDeviceBillWms(item.billDetailId)
						.then(res => {})
				}
			},
			onStorageInSelect(e) {
				this.briefForm.storageInId = e.id
				this.briefForm.storageInName = e.name
			},
			//提交
			submit() {
				if (this.type == "edit") {
					this.$refs["form"]
						.validate()
						.then(res => {
							//修改接口
							this.briefForm.deviceBillWmsVos = this.dataList;
							updateDeviceBill(this.briefForm).then(res => {
								plugin.modal.msgSuccess("修改成功")
								this.cancel();
							})
						})
						.catch(errors => {
							uni.$u.toast("请补充摘要信息")
						})
				} else {
					// 新增用户
					this.$refs["form"]
						.validate()
						.then(res => {
							//新增接口
							this.briefForm.deviceBillWmsVos = this.dataList;
							addDeviceBill(this.briefForm).then(res => {
								plugin.modal.msgSuccess("新增成功"+res.msg)
								this.cancel();
							})
						})
						.catch(errors => {
							uni.$u.toast("请补充摘要信息")
						})
				}
			},
			//返回
			cancel() {
				plugin.tab.navigateBack();
				uni.$emit("cancelpage", "close")
			},
			//扫码
			toQRCode() {
				this.addType = 1;
				var mpaasScanModule = uni.requireNativePlugin("Mpaas-Scan-Module")
				mpaasScanModule.mpaasScan({
					// 扫码识别类型，参数可多选，qrCode、barCode，不设置，默认识别所有
					'scanType': ['qrCode', 'barCode'],
					// 是否隐藏相册，默认false不隐藏
					'hideAlbum': false,
					//ios需要设置这个参数，只支持中英文 zh-Hans、en，默认中文                       
					'language': 'en',
					//相册选择照片识别错误提示(ios)
					'failedMsg': '未识别到二维码，请重试',
					//Android支持全屏需要设置此参数
					'screenType': 'full'
				}, (ret) => {
					if (ret.resp_code == 1000) {
						this.getDeviceInfo(ret.resp_result);
					}
				})
			},
			add: function() {
				this.showDeviceModal = true;
				this.addType = 1;
			},
			//nfc
			nfc() {
				this.addType = 2;
			},
			confirmDevice() {
				this.addType = 1;
				this.showDeviceModal = false;
				this.getDeviceInfo(this.deviceInfoData.deviceCode);
			},
			cancelDeviceInfo() {
				this.showDeviceModal = false;
			},
			//获取扫码或nfc查询设备
			getDeviceInfo(code) {
				let query = {};
				if (this.addType == 1) {
					query.deviceCode = code;
				} else {
					query.nfcCode = code;
				}

				getDeviceList(query).then(res => {
					if (res && res.data && res.data.length) {
						let index = this.dataList.findIndex(x => x.deviceId == res.data[0].id);
						if (index == -1) {
							let addObj = {}
							addObj.deviceId = res.data[0].id;
							addObj.deviceCode = res.data[0].deviceCode;
							addObj.deviceTypeId = res.data[0].deviceTypeId;
							addObj.deviceTypeName = res.data[0].deviceTypeName;
							this.dataList.push(addObj);
						}
					} else {
						uni.$u.toast("未查询到设备" + code)
					}
				})
			},
			getDeviceBill() {
				getDeviceBillInfo(this.billId).then(res => {
					if (res && res.data) {
						this.briefForm = res.data;
						if (this.briefForm) {
							this.dataList = this.briefForm.deviceBillWmsVos;
						}
					}
				})
			},
			getDeviceStorageInData() {
				this.deviceStorageInData = this.storageInData.map(
					item => {
						return {
							name: item.storageName,
							id: item.id,
							item: item
						}
					});
			},
			//获取当前日期
			getNowFormatDate() {
				let date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let d = date.getDate();
				if (month < 10) {
					month = "0" + month;
				}
				if (d < 10) {
					d = "0" + d;
				}
				return year + "-" + month + "-" + d;
			}
		}
	}
</script>
<style lang="scss">
	.create-container {
		background-color: #FFF;

		.custom-input {
			width: 280px;
		}

		.form-item {
			width: 100%;
			margin-left: 20px;
			display: flex;
			justify-content: center;
			align-items: flex-start;
		}

		.buttons {
			margin: 10px 50px;
			display: flex;
			justify-content: space-between;

			button {
				margin: 0px 20px;
			}
		}

		.item-container {
			margin: 10px 10px;
			background-color: white;
			padding-bottom: 10px;
			border-radius: 10px;
			box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.05);
		}

		.flex-text {
			display: flex;
			align-items: center;

			.flex-text-one {
				color: #939393;
				font-weight: bold;
			}
		}

		.data {
			margin: 10px 20px !important;
			width: 100%;

			.uni-col {
				margin-bottom: 5px;
			}
		}
	}
</style> -->