sfms3.0-uniapp/src/pages/palletLabel/coms/comPallLabelCard.vue

<template>
	<view class="" style="background-color: #fff;">
		<uni-collapse ref="collapse1">
			<uni-collapse-item :open="true">
				<template v-slot:title>
					<uni-swipe-action ref="swipeAction">
						<uni-swipe-action-item @click="removeData($event,dataContent)" :right-options="removeOptions">
							<view class="uni-flex uni-row space-between center"
								style="background-color:#fff; margin-left: 15px;">
								<view>
									<item :dataContent="dataContent"></item>
								</view>
								<view>
									<view class="center">
										<view class="uni-flex uni-row text_balance">
											<text>
												{{Number(dataContent.qty)}}
											</text>
										</view>
										<!-- v-if="dataContent.packQty==undefined" -->

									</view>
									<!-- <view class="" style="font-size: 25rpx;color: gray ">
										{{dataContent.packQty}} • {{dataContent.uom}}
									</view> -->
								</view>
							</view>
							
							
						</uni-swipe-action-item>
					</uni-swipe-action>
				</template>
				<view class="split_line"></view>
				

				<view class="" v-for="(item,index) in dataContent.subList">
					<uni-swipe-action ref="swipeAction">
						<uni-swipe-action-item @click="swipeClick($event,item,index)"
							:right-options="removeOptions">
							<view class="">
									
								<view :class="item.scaned?'scan_view':''">
									<view class="uni-flex uni-column ">
										<view class="uni-flex uni-row space-between " style="align-items: center">
											<view>
												<view class="card_view">
													<text class="card_packing_code " style="color: #BA5A59;">托码</text>
													<text class="card_content ">{{item.parentPackingNumber}}</text>
												</view>
												<pack :packingCode="item.packingNumber">
												</pack>
												<batch :batch="item.batch"></batch>
												<location title="来源库位" :locationCode="item.fromLocationCode"></location>
											</view>
											<view>
												
												<view class="uni-flex uni-row">
													<view class="uni-flex uni-row  " style=" align-items: center;">
														<view :class="statusStyle(item.inventoryStatus)" style="font-size: 40rpx;">
															•
														</view>
														<view style="font-size: 35rpx;">
															{{Number(item.qty)}}
														</view>
														<view style=" margin-left: 5rpx;  font-size: 15rpx;color: gray;  display: flex; align-items: center ">{{dataContent.uom}}</view>
														
													</view>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>

						</uni-swipe-action-item>
					</uni-swipe-action>
					<view class='split_line'></view>
					
				</view>
			</uni-collapse-item>
		</uni-collapse>
		<balanceQtyEdit ref="balanceQtyEdit" @confirm="confirm" :isShowStatus="isShowStatus"
			:allowEditStatus="allowEditStatus" :allowEditQty="allowEditQty">
		</balanceQtyEdit>
		<job-detail-popup ref="winHint" :dataContent="showItem"></job-detail-popup>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	import itemQty from '@/mycomponents/item/itemQty.vue'
	import recommend from '@/mycomponents/recommend/recommend.vue'
	import jobDetailPopup from '@/mycomponents/job/jobDetailPopup.vue'
	import balance from '@/mycomponents/balance/balance.vue'
	import balanceMove from '@/mycomponents/balance/balanceMove.vue'
	import comMovebalance from '@/pages/inventoryMove/coms/comMovebalance.vue'
	import balanceQtyEdit from '@/mycomponents/qty/balanceQtyEdit.vue'
	import pack from '@/mycomponents/balance/pack.vue'
	import item from '@/mycomponents/item/item.vue'
	import balanceQty from '@/mycomponents/qty/balanceQty.vue'
	import uom from '@/mycomponents/qty/uom.vue'
	import location from '@/mycomponents/balance/location.vue'
	import batch from '@/mycomponents/balance/batch.vue'

	import {
		getDetailOption,
		getDetailEditRemoveOption,
		getRemoveOption
	} from '@/common/array.js';
	import {
		getInventoryStatusStyle,
	} from '@/common/directory.js';
	export default {
		components: {
			itemQty,
			recommend,
			jobDetailPopup,
			balance,
			balanceQtyEdit,
			balanceMove,
			comMovebalance,
			pack,
			balanceQty,
			item,
			uom,
			location,
			batch
		},
		props: {
			dataContent: {
				type: Object,
				default: {}
			},
			settingParam: {
				type: Object,
				default: {}
			},
			fromInventoryStatus: {
				type: String,
				default: ""
			},
			toInventoryStatus: {
				type: String,
				default: ""
			},
			isShowStatus: {
				type: Boolean,
				default: true
			},
			allowEditStatus: {
				type: Boolean,
				default: false
			},
			allowEditQty: {
				type: Boolean,
				default: false
			},

		},
		watch: {
			dataContent: {
				handler(newName, oldName) {
					if (this.dataContent.subList.length > 0) {
						this.$nextTick(res => {
							setTimeout(() => {
								if (this.$refs.collapse1) {
									this.$refs.collapse1.resize();
								}
							}, 500)
						})
					}
				},


				immediate: true,
				deep: true
			}
		},

		data() {
			return {
				option: [],
				title: "推荐详情",
				showItem: {},
				editItem: {},
				detailOptions: [],
				scanOptions: [],
				removeOptions: [],
				dataList: [],
				currentHandleQty: 0
			}
		},

		mounted() {
			// this.detailOptions = getDetailOption();
			// this.scanOptions = getDetailEditRemoveOption();
			this.removeOptions = getRemoveOption();
		},

		methods: {
			statusStyle: function(val) {
				return getInventoryStatusStyle(val);
			},
			removeData(e, dataContent) {
				if (e.content.text == "移除") {
					this.$refs.comMessage.showQuestionMessage("确定移除扫描信息?",
						res => {
							if (res) {
								this.$emit('removeData', dataContent)
							}
						});
				}
			},
			swipeClick(e, item, index) {
				if (e.content.text == "详情") {
					this.detail(item)
				} else if (e.content.text == "编辑") {
					this.edit(item)
				} else if (e.content.text == "移除") {
					this.remove(item, index)
				}
			},

			edit(item) {
				this.editItem = item;
				this.currentHandleQty = item.handleQty;
				this.$refs.balanceQtyEdit.openEditPopup(item, item.qty);
			},

			detail(item) {
				this.showItem = item;
				this.dataList = [

					{
						title: "箱码",
						content: item.packingNumber
					},
					{
						title: "批次",
						content: item.batch
					},
					{
						title: "库位",
						content: item.formLocationCode
					},
					{
						title: "数量",
						content: item.qty
					},
					{
						title: "单位",
						content: item.uom
					}
				]
				this.$refs.winHint.openScanPopup(this.showItem)
			},
			remove(item, index) {
				this.$refs.comMessage.showQuestionMessage("确定移除扫描信息?",
					res => {
						if (res) {
							this.dataContent.subList.splice(index, 1)
							this.$emit('removePack', item)
						}
					});
			},
			confirm(qty) {
				this.editItem.handleQty = this.currentHandleQty;
				this.$emit('updateData')
			}
		}
	}
</script>

<style>
</style>