<template>
	<view>
		<view>
			<sl-filter :themeColor="themeColor" :menuList="menuList" @result="result"></sl-filter>
		</view>
		<scroll-view :scroll-y="true" class="page">
			<view class="cu-list menu card-menu margin-top">
				<view class="cu-item" style="margin-top: 10rpx;" v-for="(item,index) in data" @click="itemClick(item)">
					<view class="content">
						<view class="cu-form-group">
							<view class="title" style="min-width: calc(6em + 15px);">制衣生产车间</view>
							<text class="text-grey" style="flex: 1;">{{item.zyProductWorkshop}}</text>
						</view>
						<view class="cu-form-group">
							<view class="title" style="min-width: calc(6em + 15px);">制衣班组</view>
							<text class="text-grey" style="flex: 1;">{{item.zyTeam}}</text>
						</view>
						<view class="cu-form-group">
							<view class="title" style="min-width: calc(6em + 15px);">库存量</view>
							<text class="text-grey" style="flex: 1;">{{item.stockQty}}</text>
						</view>
						<view class="cu-form-group">
							<view class="title" style="min-width: calc(6em + 15px);">订单号</view>
							<text class="text-grey" style="flex: 1;">{{item.orderNo}}</text>
						</view>
						<view class="cu-form-group">
							<view class="title" style="min-width: calc(6em + 15px);">交期</view>
							<text class="text-grey" style="flex: 1;">{{item.deliveryDate}}</text>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		<dp-number-modal ref="dpNumberModal" @confirm='dpNumberModalConfirm'></dp-number-modal>
		<u-notify ref='uNotify'></u-notify>
	</view>
</template>

<script>
	import {
		listAvailable
	} from '@/api/biz/filing.js'
	import {
		add
	} from '@/api/biz/receive.js'
	import dpNumberModal from '@/components/dp-number-modal/dp-number-modal.vue'
	export default {
		components: {
			dpNumberModal
		},
		data() {
			return {
				themeColor: '#000000',
				filterResult: '',
				menuList: [{
						'title': '车间',
						'detailTitle': '请选择制衣生产车间（可多选）',
						'isMutiple': true,
						'key': 'workshop',
						'detailList': [{
							'title': '不限',
							'value': ''
						}, {
							'title': '制衣一厂',
							'value': '1'
						}, {
							'title': '制衣二厂',
							'value': '1'
						}]
					},
					{
						'title': '排序',
						'key': 'sort',
						'isSort': true,
						'detailList': [{
							'title': '默认排序',
							'value': ''
						}]
					}
				],
				data: [],
				focusItem: {}
			}
		},
		onLoad() {
			this.initData()
		},
		methods: {
			itemClick(item) {
				this.$refs.dpNumberModal.show = true
				this.focusItem = item
			},
			dpNumberModalConfirm() {
				let id = this.focusItem.id+''
				let qty = this.$refs.dpNumberModal.value
				const param = {
					"orderId": id,
					"receiveQty": qty
				}
				add(param).then(res=>{
					if(res.success){
						this.$refs.uNotify.show({
							type: 'success',
							message: "领活操作成功"
						})
						this.$refs.dpNumberModal.value=0
						this.$refs.dpNumberModal.show = false
						this.focusItem.stockQty = parseInt(this.focusItem.stockQty)+parseInt(qty)
					}else{
						console.log(res)
						this.$refs.uNotify.show({
							type: 'error',
							message: res.message
						})
					}
					
				})
				
			},
			initData() {
				listAvailable().then(res => {
					if (res.success) {
						this.data = res.data
					}
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.page {
		height: 100Vh;
		width: 100vw;
	}

	.page.show {
		overflow: hidden;
	}

	.cu-form-group {
		min-height: 0;
		border: none;

	}
</style>
