sfms3.0-uniapp/pages/inspect/coms/inspectComDetailCard.vue

<template>
	<view class="" style="background-color: #fff;">
		<view class="">
			<view class="" >
				<view class="cell_box uni-flex uni-row">
				<!-- 	<view class="cell_info">
						<view class="text_lightblue">类型</view>
						<view>{{getInspectType(jobContent.inspectType)}}</view>
					</view> -->
					<view class="cell_info">
						<view class="text_lightblue">收货数</view>
						<view>{{jobContent.receiveQty}}{{getUnitInfo(jobContent.uom)}}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue">检验数</view>
						<view>{{jobContent.sampleQty}}{{getUnitInfo(jobContent.uom)}}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue">不合格数</view>
						<view style="color: #F56C6C;">{{jobContent.failedQty}}{{getUnitInfo(jobContent.uom)}}</view>
					</view>
					
					<view class="cell_info">
						<view class="text_lightblue">报废数</view>
						<view style="color: #EC9C00">{{jobContent.crackQty}}{{getUnitInfo(jobContent.uom)}}</view>
					</view>
				</view>
				<!-- <u-line /> -->
			</view>
		</view>
		<u-line />
		<uni-collapse ref="collapse1" @change="">
			<uni-collapse-item :open="true">
				<template v-slot:title>
					<item-compare-qty :dataContent="dataContent" :handleQty="Number(dataContent.handleQty)" :isShowStdPack="false">
					</item-compare-qty>
					<view class="" style="margin-left: 20rpx; ">
						<batch :batch="jobContent.batch"></batch>
					</view>
				</template>
				<u-line />
				<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="item.scaned?scanOptions:detailOptions">
							<recommend :detail="item" :isShowPack="isShowPack" :isShowBatch="isShowBatch"
								:isShowFromLocation="isShowLocation"></recommend>
							<view v-if="item.failedQty>0||item.crackQty>0" :class="item.scaned?'scan_view':''" style="font-size: 32rpx;padding-left: 2px;">
								<view class="cell_box uni-flex uni-row">
									<view class="cell_info uni-flex uni-row">
										<view class="text_lightblue">
											不合格
										</view>
										<view style="padding-left: 12rpx;color: #F56C6C;">
											{{item.failedQty}}
										</view>
									</view>
									<view class="cell_info uni-flex uni-row">
										<view class="text_lightblue">
											报废
										</view>
										<view style="padding-left: 12rpx;color: #EC9C00">
											{{item.crackQty}}
										</view>
									</view>
									<view class="cell_info uni-flex uni-row">
										<view class="text_lightblue">
											合格
										</view>
										<view style="padding-left: 12rpx;color: #0A84FF">
											{{item.goodQty}}
										</view>
									</view>
								</view>
							</view>
						</uni-swipe-action-item>
					</uni-swipe-action>
					<u-line />
				</view>

			</uni-collapse-item>
		</uni-collapse>
		<inspectEdit ref='inspectEdit' @getInspectResult='getInspectResult'>
		</inspectEdit>
		<job-detail-popup ref="receiptHint" :dataContent="showItem"></job-detail-popup>
		<com-message ref="message"></com-message>
	</view>
</template>

<script>
	import itemCompareQty from '@/mycomponents/item/itemCompareQty.vue'
	import recommend from '@/mycomponents/recommend/recommend.vue'
	import jobDetailPopup from '@/mycomponents/job/jobDetailPopup.vue'
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import batch from '@/mycomponents/balance/batch.vue'
	import inspectEdit from "@/pages/inspect/coms/inspectEdit.vue"
	import {
		getDetailOption,
		getDetailEditRemoveOption,
		getDetailRemoveOption
	} from '@/common/array.js';
	import {
		getUnitInfo,
		getInspectType
	} from '@/common/directory.js';

	export default {
		components: {
			itemCompareQty,
			recommend,
			comMessage,
			jobDetailPopup,
			batch,
			inspectEdit
		},
		props: {
			dataContent: {
				type: Object,
				default: {}
			},
			jobContent: {
				type: Object,
				default: {}
			},
			isShowPack: {
				type: Boolean,
				default: true
			},
			isShowBatch: {
				type: Boolean,
				default: true
			},
			isShowLocation: {
				type: Boolean,
				default: true
			},
			jobType: {
				type: String,
				default: ""
			},
		},
		watch: {

		},

		data() {
			return {
				option: [],
				showItem: {},
				editItem: {},
				editIndex: 0,
				detailOptions: [],
				scanOptions: []
			}
		},

		mounted() {
			if (this.detailOptions.length == 0) {
				this.detailOptions = getDetailOption();
			}
			if (this.scanOptions.length == 0) {
				this.scanOptions = getDetailEditRemoveOption();
				// if (this.dataContent.allowModifyQty == 1) {
				// 	this.scanOptions = getDetailEditRemoveOption();
				// } else {
				// 	this.scanOptions = getDetailRemoveOption();
				// }
			}
		},

		methods: {
			getInspectType(value) {
				return getInspectType(value)
			},

			swipeClick(e, item, index) {
				if (e.content.text == "详情") {
					this.detail(item)
				} else if (e.content.text == "编辑") {
					this.edit(item, index)
				} else if (e.content.text == "移除") {
					this.remove(item)
				}
			},
			edit(item, index) {
				this.editIndex = index;
				this.editItem = item;
				this.$refs.inspectEdit.openEditPopup(this.editItem);
			},

			detail(item) {
				this.showItem = item;
				this.$refs.receiptHint.openScanPopup(item)
			},
			remove(item) {
				this.$refs.message.showQuestionMessage("确定移除扫描信息?",
					res => {
						if (res) {
							item.scaned = false
							item.failedQty = 0;
							item.crackQty = 0;
							item.sampleQty = 0;
							item.notPassedQty = 0;
							item.inspectResult = ""
							item.failedReason = ""
							item.handleQty = 0;
							item.photos = ""
							this.$forceUpdate()
							this.$emit('remove', item)
						}
					});
			},
			confirm(qty) {
				this.$emit('updateData')
			},
			getInspectResult(result) {
				this.dataContent.subList[this.editIndex] = result;
				if (this.$refs.collapse1 != undefined) {
					this.$nextTick(res => {
						this.$refs.collapse1.resize()
					})
				}
				this.$emit('updateData', )
			},
			getUnitInfo(value) {
				return getUnitInfo(value).label
			},

		}
	}
</script>

<style>
</style>