productDev/dmMes.git

			@@ -1,18 +1,403 @@
			<template>
			<div class="page">
			新增出库
			<div class="rework">
			<div class="rework_list">
			<div class="rework_list_item" @click="typeShow = true">
			<span><b>*</b>单据类型</span>
			<div class="rework_list_item_right">
			<span :class="form.typeName ? 'black' : ''">{{form.typeName ? form.typeName : '请选择'}}</span>
			<van-icon name="arrow" size="20" color="#999999" />
			</div>
			</div>
			<div class="rework_list_item" @click="warehouseShow = true">
			<span><b>*</b>出库仓库</span>
			<div class="rework_list_item_right">
			<span :class="form.warehouseName ? 'black' : ''">{{form.warehouseName ? form.warehouseName : '请选择'}}</span>
			<van-icon name="arrow" size="20" color="#999999" />
			</div>
			</div>
			</div>
			<div class="rework_qd">
			<div class="rework_qd_title">
			<div class="rework_qd_title_left">
			<div class="x"></div>
			<span>{{`出库物料清单${list.length}`}}</span>
			</div>
			<div class="rework_qd_title_right" @click="openMs">
			<img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" />
			<span>增加出库</span>
			</div>
			</div>
			<van-swipe-cell v-for="(item, index) in list" :key="index">
			<div class="rework_qd_item">
			<img class="rework_qd_item_dele" @click="dele(index)" src="@/assets/icon/chuku_ic_delete@2x.png" alt="" />
			<div class="rework_qd_item_wl">
			<span>{{ item.materialName }} \| {{ item.materialCode }}</span>
			</div>
			<div class="rework_qd_item_cate">
			<span class="green" v-if="item.qualityType === '0'">合格 \| </span>
			<span class="yellow" v-if="item.qualityType === '1'">不良 \| </span>
			<span class="red" v-if="item.qualityType === '2'">报废 \| </span>
			<span>{{ item.procedureName }} \| </span>
			<span>{{ item.batch }}</span>
			</div>
			<div class="rework_qd_item_hw">
			<span>出库货位：{{ item.locationName }}</span>
			<div class="rework_qd_item_hw_right">
			<span>数量：</span>
			<input type="number" v-model="item.num" placeholder="0" />
			<span>{{ item.unitName }}</span>
			</div>
			</div>
			</div>
			<!-- <template #right>
			<van-button style="height: 100%;" square type="danger" text="删除" @click="dele(index)" />
			</template> -->
			</van-swipe-cell>
			</div>
			<div class="rework_zw"></div>
			<div class="rework_footer">
			<button class="rework_footer_submit" @click="onConfirm">提交</button>
			</div>
			<Warehouse :show="warehouseShow" @close="close" @value="getValue" />
			<Materials ref="Material" :show="materialsShow" :id="form.warehouseId.toString()" @close="close1" @value="getValue1" />
			<!-- 单据类型 -->
			<van-popup v-model:show="typeShow" position="bottom" :style="{ height: '50%' }">
			<van-picker
			:columns="columns"
			@confirm="onConfirm1"
			@cancel="onCancel"
			:columns-field-names="customFieldName"
			/>
			</van-popup>
			</div>
			</template>

			<script setup lang="ts">
			import { onMounted, ref, reactive } from 'vue'
			import { useRouter } from 'vue-router'
			import { Toast } from 'vant'
			import { createForStandard } from '@/apis/WorkOrderAPI'
			import Warehouse from '@/components/common/Warehouse.vue'
			import Materials from '@/components/common/Materials.vue'
			const Material = ref(null)
			const router = useRouter()
			// 表单数据
			let form = reactive({
			warehouseName: '',
			warehouseId: '',
			type: '',
			typeName: ''
			})

			let columns = ref([
			{ name: '销售出库', id: 18 },
			{ name: '库存调整', id: 28 },
			{ name: '仓库报废', id: 21 }
			])
			const customFieldName = {
			text: 'name'
			};
			let mIds = ref('')
			let list = ref<Array<any>>([])
			let warehouseShow = ref<boolean>(false)
			let materialsShow = ref<boolean>(false)
			let typeShow = ref<boolean>(false)

			const onConfirm1 = (value: any) => {
			form.typeName = value.name
			form.type = value.id
			typeShow.value = false
			};
			const onCancel = () => {
			typeShow.value = false
			}

			// 获取当天年月日
			const getDay = () => {
			var date = new Date();
			var year = date.getFullYear();
			var month = date.getMonth() + 1;
			var day = date.getDate();
			return `${year}-${month <= 9 ? `0${month}` : month}-${day <= 9 ? `0${day}` : day}`
			}

			// 提交
			const onConfirm = () => {
			if (!form.type) return Toast('请选择单据类型')
			for (let i = 0; i < list.value.length; i++) {
			if (!list.value[i].num \|\| list.value[i].num == '' \|\| list.value[i].num == 0) {
			return Toast(`第${i + 1}个出库物料数量必须大于0`)
			}
			if (list.value[i].num > list.value[i].total) {
			return Toast(`第${i + 1}个物料数量不能大于库存量！`)
			}
			}
			createForStandard({
			billType: form.type,
			planDate: getDay(),
			origin: 0,
			type: 0,
			warehouseId: form.warehouseId,
			woutBoundDetailBeans: list.value
			}).then(res => {
			if (res.code === 200) {
			Toast.success({message: '出库成功'})
			setTimeout(() => {
			router.go(-1)
			}, 2000)
			}
			})
			}

			// 打开选择物料
			const openMs = () => {
			if (!form.warehouseId) return Toast('请先选择出库仓库')
			const { selected }: any = Material.value
			let ids = list.value.map(item => item.id)
			Material.value.selected = ids
			materialsShow.value = true
			}

			// 删除
			const dele = (index: any) => {
			if (list.value.length === 1) {
			Toast('至少保留一条工装信息')
			return
			}
			list.value.splice(index, 1)
			}
			// 关闭仓库选择弹框
			const close = (): void => {
			warehouseShow.value = false
			}
			// 关闭仓库选择弹框
			const close1 = (): void => {
			materialsShow.value = false
			}
			// 选择仓库回调
			const getValue = (item: any): void => {
			form.warehouseName = item.name
			form.warehouseId = item.id
			warehouseShow.value = false
			}
			const getValue1 = (item: any): void => {
			item.forEach((row: any) => {
			row.total = row.num
			})
			list.value = [...item, ...list.value]
			materialsShow.value = false
			console.log(list.value)
			}

			onMounted(() => {
			// 获取工装信息
			// getLKInfo(route.query.id as string)
			})
			</script>

			<style lang="scss" scoped>
			.page {
			width: 100%;
			height: 100%;
			position: absolute;
			background: #F7F7F7;
			}
			</style>
			.rework {
			width: 100%;
			height: 100%;
			position: absolute;
			.rework_list {
			display: flex;
			flex-direction: column;
			background: white;
			padding: 0 30px;
			box-sizing: border-box;
			.rework_list_item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 98px;
			border-bottom: 1PX solid #E5E5E5;
			&:last-child {
			border: none;
			}
			span {
			font-size: 30px;
			font-weight: 400;
			color: #222222;
			flex-shrink: 0;
			b {
			font-size: 30px;
			color: red;
			margin-right: 5px;
			}
			}
			.rework_list_item_right {
			display: flex;
			align-items: center;
			span {
			font-size: 28px;
			font-weight: 400;
			color: #999999;
			}
			.black {
			color: black !important;
			}
			input {
			width: 230px;
			font-size: 28px;
			border: none;
			}
			input::-webkit-input-placeholder { /* WebKit browsers */
			font-size: 28px;
			font-weight: 400;
			color: #B2B2B2;
			}
			}
			}
			}
			.rework_qd {
			margin-top: 40px;
			.rework_qd_title {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30px 30px 30px;
			.rework_qd_title_left {
			display: flex;
			align-items: center;
			span {
			font-size: 32px;
			font-weight: 500;
			color: #222222;
			}
			.x {
			width: 8px;
			height: 30px;
			background: #4275FC;
			border-radius: 2px;
			margin-right: 12px;
			}
			}
			.rework_qd_title_right {
			display: flex;
			align-items: center;
			img {
			width: 28px;
			height: 28px;
			margin-right: 12px;
			}
			span {
			font-size: 28px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #4275FC;
			}
			}
			}
			.rework_qd_item {
			background: #ffffff;
			padding: 30px;
			display: flex;
			flex-direction: column;
			margin-bottom: 30px;
			position: relative;
			.rework_qd_item_dele {
			position: absolute;
			right: 0;
			top: 0;
			width: 48px;
			height: 48px;
			}
			.rework_qd_item_wl {
			span {
			font-size: 30px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #222222;
			}
			}
			.rework_qd_item_cate {
			margin-top: 18px;
			span {
			font-size: 24px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;
			}
			}
			.rework_qd_item_hw {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 24px;
			span {
			font-size: 26px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			}
			.rework_qd_item_hw_right {
			display: flex;
			align-items: center;
			span {
			font-size: 26px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;
			}
			input {
			width: 140px;
			height: 60px;
			font-size: 28px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			background: #FFFFFF;
			border-radius: 8px;
			border: 1px solid #CCCCCC;
			margin: 0 20px;
			padding: 0 30px;
			box-sizing: border-box;
			text-align: right;
			}
			}
			}
			}
			}
			.rework_zw {
			height: 168px;
			}
			.rework_footer {
			width: calc(100% - 60px);
			position: fixed;
			bottom: 0;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30px 68px 30px;
			.rework_footer_add {
			flex: 1;
			height: 88px;
			font-size: 30px;
			font-weight: 500;
			color: $nav-color;
			background: #FFFFFF;
			box-shadow: 0 0 12px 0 rgba(0,0,0,0.0800);
			border-radius: 8px;
			display: flex;
			align-items: center;
			justify-content: center;
			}
			.rework_footer_submit {
			flex: 1;
			height: 88px;
			font-size: 30px;
			font-weight: 500;
			color: #ffffff;
			background: $nav-color;
			box-shadow: 0 0 12px 0 rgba(0,0,0,0.0800);
			border-radius: 8px;
			display: flex;
			align-items: center;
			justify-content: center;
			border: none;
			}
			}
			}
			</style>