aiot-app/pages/salesServiceManagement/demandList/components/itemSelect.vue

<template>
	<u-list class="listContent">
		<checkbox-group v-for="(item, index) in listData" :key="index" @change="e => selectVal(e, item, index)">
			<label>
				<view class="listBox">
					<view class="listBox-sel">
						<checkbox :value="item.id" color="#fff" :disabled="item.disabled" :checked="item.checked" />
					</view>
					<view class="listBox-con">
						<view class="listBox-top">
							<view class="listBox-name">
								{{ item.categoryName }}
							</view>

						</view>
						<view class="listBox-bottom">
							<view>类型：{{ item.productCategoryName }}</view>
							<view>编码：{{ item.categoryCode }}</view>
							<view>牌号：{{ item.productBrand }}</view>
							<view>型号：{{ item.categoryModel }}</view>
							<view>规格：{{ item.packingSpecification }}</view>
							<view>批次号：{{ item.batchNo }}</view>
							<view>计量数量：{{ item.measureQuantity }}</view>
							<view>单价（元）：{{ item.singlePrice }}</view>
							<view>发货条码/车架号：{{ item.barcodes }}</view>
						</view>
					</view>
				</view>
			</label>
		</checkbox-group>
		<u-empty class="noDate" style="margin-top: 20vh" v-if="!listData.length"></u-empty>
	</u-list>
</template>

<script>
	import {
		saleordersendrecord,
		getSaleOrderDetail
	} from '@/api/saleManage/saleorder/index.js'
	import {
		parameterGetByCode
	} from '@/api/mainData/index.js';
	import {
		getInfoBySourceBizNoAll
	} from "@/api/wms/index.js"
	import {
		getSendSaleOrderrecordDetailSplit
	} from "@/api/salesServiceManagement/demandList/index.js"
	const dayjs = require('dayjs');
	export default {
		data() {
			return {
				listData: [],
				sectionList: [],
			}
		},
		onLoad({}) {},
		methods: {
			async getData(row, associationType) {
				this.sectionList = [];
				this.listData = [];
				console.log(associationType)
				if (associationType === '1') {
					let params = {
						code: 'after_sales_product_list_source'
					};
					const res = await parameterGetByCode(params);
					if (res.value == '1') {
						this.getInfo(row);
					} else {
						this._getInfo(row.docNo);
					}
				} else {
					this.getSaleInfo(row)
				}

			},
			resetTable() {
				this.sectionList = [];
				this.listData = [];
			},
			async _getInfo(sourceBizNo) {
				const dataArray = await getInfoBySourceBizNoAll(sourceBizNo);
				let res = {};
				if (dataArray && dataArray.length > 0) {
					res = JSON.parse(JSON.stringify(dataArray[0]));
					res['outInDetailList'] = [];
					dataArray.forEach((item) => {
						item.outInDetailList.forEach((val) => {
							res['outInDetailList'].push(val);
						});
					});
				}
				this.init(res);
			},
			init(res) {
				let productList = res?.outInDetailList?.map(
					(productItem, productIndex) => {
						return {
							...productItem,
							productCategoryName: productItem.categoryLevelPath,
							productBrand: productItem.brandNum,
							outInDetailRecordRequestList: productItem.outInDetailRecordRequestList.map((
								packingItem) => {
								return {
									...packingItem,
									categoryName: productItem.categoryName,
									categoryCode: productItem.categoryCode,
									productCategoryName: productItem.categoryLevelPath,
									categoryModel: productItem.categoryModel,
									produceTime: packingItem.produceTime || null,
									shipmentDate: res.createTime || null,
									guaranteePeriodDeadline: this.getTime(res.createTime)[0],
									warrantyStatus: this.getTime(res.createTime)[1]
								};
							})
						};
					}
				);
				// 获取包装维度数据
				const arr = [];
				for (const key in productList) {
					if (productList[key].outInDetailRecordRequestList.length) {
						for (const k in productList[key].outInDetailRecordRequestList) {
							arr.push({
								...productList[key].outInDetailRecordRequestList[k]
							});
						}
					} else {
						arr.push(productList[key])
					}

				}
				this.listData = arr;
			},
			async getInfo(row) {
				const res = await getSendSaleOrderrecordDetailSplit(row.id);
				let list = res.productList.map((el) => {
					el.categoryCode = el.productCode;
					el.categoryName = el.productName;
					el.categoryModel = el.modelType;
					el.measureQuantity = el.totalCount;
					el.barcodes = el.carCode;
					el.packingSpecification = el.specification;
					el.shipmentDate = row.createTime || null;
					(el.guaranteePeriodDeadline = this.getTime(row.createTime)[0]),
					(el.warrantyStatus = this.getTime(row.createTime)[1]);
					return el;
				});
				this.listData = list;
			},
			async getSaleInfo(row) {
				const res = await getSaleOrderDetail(row.id);
				let list = res.productList.map((el) => {
					el.categoryCode = el.productCode;
					el.categoryName = el.productName;
					el.categoryModel = el.modelType;
					el.measureQuantity = el.totalCount;
					el.barcodes = el.carCode;
					el.packingSpecification = el.specification;
					el.shipmentDate = row.createTime || null;
					(el.guaranteePeriodDeadline = this.getTime(row.createTime)[0]),
					(el.warrantyStatus = this.getTime(row.createTime)[1]);
					return el;
				});
				this.listData = list;
			},
			async selectVal(e, val, index) {
				// 添加进选中的数组
				if (e.detail.value.length && e.detail.value[0] === val.id) {
					this.sectionList.push(val)
				}
				if (!e.detail.value.length) {
					this.sectionList = this.sectionList.filter(item => item.id !== val.id)
				}
				// if()
				console.log(this.sectionList);
				this.$set(this.listData[index], 'checked', !this.listData[index].checked)
				// this.listData.forEach((item, i) => {
				// 	if (item.id != val.id) {
				// 		this.$set(this.listData[i], 'checked', false)
				// 	}
				// })
				// this.sectionList.push(val)
				// let data = val.checked ? val : {};
				this.$emit('getDetails', this.sectionList);
			},
			getTime(createTime) {
				let date = new Date(createTime);
				date.setMonth(date.getMonth() + 13); // 月份加13月
				let time = dayjs(date).format('YYYY-MM-DD HH:mm:ss');
				let warrantyStatus =
					new Date(time).getTime() > new Date().getTime() ? 0 : 1;
				return [time, warrantyStatus];
			}
		},
	}
</script>

<style lang="scss" scoped>
	@import './invoice.scss';

	.u-reset-button {
		position: absolute;
		right: 10rpx;
		top: 20rpx;
		width: 160rpx;
	}
</style>