aiot-app/pages/home/wt/components/inBound/taskForm.vue

<template>
	<view class="task-form-container">
		<u-sticky offset-top="50">
			<u-subsection fontSize="25" mode="subsection" :list="tabList" :current="curNow" @change="sectionChange"
				activeColor="#157A2C" bgColor="#fff"></u-subsection>
		</u-sticky>

		<!-- 入库信息 -->
		<view v-show="curNow === 0">
			<u--form style="margin: 0 20px;" labelPosition="left" :model="infoData" ref="uForm" labelWidth="180rpx">
				<u-form-item label="入库单号" borderBottom>
					{{ infoData.bizNo || '-' }}
				</u-form-item>
				<u-form-item label="入库物品类型" borderBottom>
					{{ handleAssetType(extInfo.assetType) || '-' }}
				</u-form-item>
				<u-form-item label="入库场景" borderBottom>
					{{ getSceneState(infoData.bizType) || '-' }}
				</u-form-item>
				<u-form-item label="关联订单" borderBottom>
					{{ extInfo.documentSource || '-' }}
				</u-form-item>
				<u-form-item label="客户名称" borderBottom>
					{{ infoData.clientName || '-' }}
				</u-form-item>
				<u-form-item label="供应商" borderBottom>
					{{ extInfo.supplierName || '-' }}
				</u-form-item>
				<u-form-item label="供应商代号" borderBottom>
					{{ extInfo.supplierCode || '-' }}
				</u-form-item>
				<u-form-item label="入库时间" borderBottom>
					{{ infoData.storageTime || infoData.createTime || '-' }}
				</u-form-item>
				<u-form-item label="入库登记人" borderBottom>
					{{ extInfo.createUserName || '-' }}
				</u-form-item>
				<u-form-item label="权属部门" borderBottom>
					{{ extInfo.deptName || '-' }}
				</u-form-item>
				<u-form-item label="审核人" borderBottom>
					{{ infoData.verifyName || '-' }}
				</u-form-item>
				<u-form-item label="状态" borderBottom>
					{{ stepsTitle }}
				</u-form-item>
				<u-form-item label="备注" borderBottom>
					{{ infoData.remark || '-' }}
				</u-form-item>
			</u--form>
		</view>

		<!-- 产品信息 -->
		<view v-show="curNow === 1">
			<common-product-list :list="productList" :tableField="productFields"></common-product-list>
		</view>

		<!-- 包装明细 -->
		<view v-show="curNow === 2">
			<common-product-list :list="showPackingList" :tableField="packingFields"></common-product-list>
		</view>
	</view>
</template>

<script>
	import { getInboundDetailsById, getInboundDetailsByIds } from '@/api/warehouseManagement'
	import { getInfoBySourceBizNoAll } from '@/api/wms'
	import { allCategoryLevel } from '@/api/wt';
	import { useDictLabel } from '@/utils/dict/index';
	import { sceneState, qualityResults, qualityStatus } from '@/enum/dict.js';
	import { mapGetters, mapActions } from 'vuex';
	import { parameterGetByCode } from '@/api/mainData/index.js';
	import commonProductList from '../common/commonProductList.vue';

	export default {
		components: { commonProductList },
		props: {
			bizType: {
				type: String,
				default: ''
			},
			businessId: {
				type: String,
				default: ''
			},
			isUpload: {
				type: Boolean,
				default: false
			},
			isInterior: {
				type: Boolean,
				default: true
			},
			isIds: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				tabList: ['入库信息', '产品信息', '包装明细'],
				curNow: 0,
				qualityStatus,
				qualityResults,
				productList: [],
				showPackingList: [],
				packingList: [],
				extInfo: {},
				codeList: [],
				infoData: {},
				stepsTitle: '已完成',
				stepsStatus: 'success',
				active: 0,
				isPrice: 1,
				// 产品信息字段配置
				productFields: [
					{ label: '仓库', field: 'warehouseName' },
					// { label: '编码', field: 'categoryCode' },
					// { label: '名称', field: 'categoryName' },
					{ label: '型号', field: 'categoryModel' },
					{ label: '规格', field: 'specification' },
					{ label: '牌号', field: 'brandNum' },
					{ label: '批次号', field: 'batchNo' },
					{ label: '包装数量', field: 'packingQuantity' },
					{ label: '单位', field: 'packingUnit' },
					{ label: '计量数量', field: 'measureQuantity' },
					{ label: '计量单位', field: 'measureUnit' },
					{ label: '重量', field: 'weight' },
					{ label: '重量单位', field: 'weightUnit' },
					{ label: '机型', field: 'modelKey' },
					{ label: '颜色', field: 'colorKey' },
					{ label: '允许拆包', field: 'isUnpack' },
					{ label: '供应商', field: 'supplierName' },
				],
				// 包装明细字段配置
				packingFields: [
					{ label: '批次号', field: 'batchNo' },
					{ label: '包装编码', field: 'packageNo' },
					// { label: '名称', field: 'categoryName' },
					// { label: '编码', field: 'categoryCode' },
					{ label: '型号', field: 'categoryModel' },
					{ label: '规格', field: 'specification' },
					{ label: '牌号', field: 'brandNum' },
					{ label: '发货条码', field: 'barcodes' },
					{ label: '包装数量', field: 'packingQuantity' },
					{ label: '包装单位', field: 'packingUnit' },
					{ label: '计量数量', field: 'measureQuantity' },
					{ label: '计量单位', field: 'measureUnit' },
					{ label: '物料代号', field: 'materielDesignation' },
					{ label: '客户代号', field: 'clientCode' },
					{ label: '刻码', field: 'engrave' },
					{ label: '重量', field: 'weight' },
					{ label: '重量单位', field: 'weightUnit' },
					{ label: '机型', field: 'modelKey' },
					{ label: '颜色', field: 'colorKey' },
					{ label: '供应商', field: 'supplierName' },
					{ label: '供应商代号', field: 'supplierCode' },
					{ label: '质检结果', field: 'result' },
					{ label: '质检状态', field: 'status' },
					{ label: '仓库', field: 'warehouseName' },
					{ label: '生产日期', field: 'productionDate' },
					{ label: '采购日期', field: 'purchaseDate' },
					{ label: '失效日期', field: 'expireDate' },
				],
			};
		},
		watch: {
			'infoData.verifyStatus': {
				immediate: true,
				handler(val) {
					if (val == 0) {
						this.active = 1;
						this.stepsTitle = '未审核';
						this.stepsStatus = 'wait';
					} else if (val == 1) {
						this.active = 2;
						this.stepsTitle = '审核中';
						this.stepsStatus = 'process';
					} else if (val == 2) {
						this.active = 2;
						this.stepsTitle = '审核通过';
						this.stepsStatus = 'success';
					} else if (val == 3) {
						this.active = 2;
						this.stepsTitle = '驳回';
						this.stepsStatus = 'error';
					}
				}
			},
			businessId(val) {
				if (val) {
					this._getInfo(val);
				}
			}
		},
		computed: {
			...mapGetters(['getDictValue']),
			clientEnvironmentId() {
				return this.$store.state.user.info.clientEnvironmentId;
			},
		},
		created() {
			parameterGetByCode({
				code: 'wms_price'
			}).then((res) => {
				this.isPrice = res.value;
			});
			this.requestDict('类型用途');
			this.getAllCategoryType();
			this._getInfo(this.businessId);
		},
		methods: {
			...mapActions('dict', ['requestDict']),
			getSceneState: useDictLabel(sceneState),
			sectionChange(index) {
				this.curNow = index;
			},
			handleAssetType(r) {
				if (!r) return '-';
				var arr = r.split(',');
				var filteredData = this.codeList.filter(function(item) {
					return arr.indexOf(item.dictCode) !== -1;
				});
				return filteredData.map(function(item) { return item.dictValue; }).join(',');
			},
			async getAllCategoryType() {
				var data = await allCategoryLevel();
				this.codeList = data.map(function(item) {
					return { dictCode: item.id, dictValue: item.name };
				});
			},
			async _getInfo(id) {
				if (!id) return;
				var res = null;
				var resAll = null;
				if (this.isInterior) {
					res = await getInboundDetailsById(id);
				} else if (this.isIds) {
					resAll = await getInboundDetailsByIds(id);
				} else {
					res = await getInfoBySourceBizNoAll(id);
					res = res[0] || {};
				}
				if (this.isIds) {
					res = JSON.parse(JSON.stringify(resAll[0]));
					this.extInfo = resAll[0].extInfo;
					res['outInDetailList'] = [];
					resAll.forEach(function(item) {
						item.outInDetailList.forEach(function(val) {
							val['bizNo'] = item.bizNo;
							res['outInDetailList'].push(val);
						});
					});
					res['bizNo'] = resAll.map(function(item) { return item.bizNo; });
					this.infoData = res;
				} else {
					this.infoData = res;
					this.extInfo = res.extInfo || {};
				}
				this.productList = (res && res.outInDetailList && res.outInDetailList.map(function(productItem) {
					return {
						productCode: productItem.categoryCode,
						productName: productItem.categoryName,
						categoryCode: productItem.categoryCode,
						categoryName: productItem.categoryName,
						categoryModel: productItem.categoryModel,
						specification: productItem.specification,
						brandNum: productItem.brandNum,
						batchNo: productItem.batchNo,
						packingQuantity: productItem.packingQuantity,
						packingUnit: productItem.packingUnit,
						measureQuantity: productItem.measureQuantity,
						measureUnit: productItem.measureUnit,
						weight: productItem.weight,
						weightUnit: productItem.weightUnit,
						modelKey: productItem.modelKey,
						colorKey: productItem.colorKey,
						warehouseName: productItem.warehouseName,
						supplierName: productItem.supplierName,
						supplierCode: productItem.supplierCode,
						productionRequirements: productItem.productionRequirements,
						isUnpack: productItem.isUnpack == 1 ? '是' : '否',
						supplierName: productItem.supplierName,
						outInDetailRecordRequestList: (productItem.outInDetailRecordRequestList && productItem.outInDetailRecordRequestList.map(function(packingItem) {
							return {
								productCode: packingItem.packageNo || packingItem.categoryCode,
								productName: packingItem.categoryName || '包装',
								categoryName: productItem.categoryName,
								categoryCode: productItem.categoryCode,
								categoryModel: productItem.categoryModel,
								specification: productItem.specification,
								brandNum: productItem.brandNum,
								batchNo: packingItem.batchNo,
								packageNo: packingItem.packageNo,
								barcodes: packingItem.barcodes,
								packingQuantity: packingItem.packingQuantity,
								packingUnit: packingItem.packingUnit,
								measureQuantity: packingItem.measureQuantity,
								measureUnit: packingItem.measureUnit,
								materielDesignation: packingItem.materielDesignation,
								clientCode: packingItem.clientCode,
								engrave: packingItem.engrave,
								weight: packingItem.weight,
								weightUnit: packingItem.weightUnit,
								modelKey: packingItem.modelKey,
								colorKey: packingItem.colorKey,
								supplierName: productItem.supplierName,
								supplierCode: productItem.supplierCode,
								result: qualityResults[packingItem.result] != null ? qualityResults[packingItem.result] : packingItem.result,
								status: qualityStatus[packingItem.status] != null ? qualityStatus[packingItem.status] : packingItem.status,
								warehouseName: packingItem.warehouseName,
								areaName: packingItem.areaName,
								goodsShelfName: packingItem.goodsShelfName,
								goodsAllocationName: packingItem.goodsAllocationName,
								productionDate: packingItem.productionDate,
								purchaseDate: packingItem.purchaseDate,
								expireDate: packingItem.expireDate,
							};
						}))
					};
				})) || [];
				// 获取包装维度数据
				var arr = [];
				var that = this;
				this.productList.forEach(function(item) {
					(item.outInDetailRecordRequestList || []).forEach(function(k) {
						arr.push(k);
					});
				});
				this.packingList = arr;
				this.showPackingList = arr;
			},
			getTableValue() {
				return {};
			}
		}
	};
</script>

<style lang="scss" scoped>
	.task-form-container {
		min-height: 100vh;
		background-color: #fff;
	}
</style>