<template>
|
<div class="zk">
|
<div class="zk_list">
|
<div class="zk_list_item" @click="open('d')">
|
<span>单据类型</span>
|
<div class="zk_list_item_n">
|
<span :style="data.typeName ? 'color: black;' : ''">{{data.typeName ? data.typeName : '请选择'}}</span>
|
<van-icon name="arrow" color="#999999" size="20" />
|
</div>
|
</div>
|
<div class="zk_list_item" @click="open('c')">
|
<span>出库仓库</span>
|
<div class="zk_list_item_n">
|
<span :style="data.exWarehouse ? 'color: black;' : ''">{{data.exWarehouse ? data.exWarehouse : '请选择'}}</span>
|
<van-icon name="arrow" color="#999999" size="20" />
|
</div>
|
</div>
|
<div class="zk_list_item" @click="open('r')">
|
<span>入库仓库</span>
|
<div class="zk_list_item_n">
|
<span :style="data.warehousingWarehouseName ? 'color: black;' : ''">{{data.warehousingWarehouseName ? data.warehousingWarehouseName : '请选择'}}</span>
|
<van-icon name="arrow" color="#999999" size="20" />
|
</div>
|
</div>
|
</div>
|
<div class="zk_title">
|
<div class="zk_title_i"></div>
|
<span>转出物料列表</span>
|
</div>
|
<div class="zk_wl">
|
<template v-if="view.MaterialList.length > 0">
|
<van-swipe-cell v-for="(item, i) in view.MaterialList" :key="i">
|
<div class="zk_wl_item">
|
<span>{{item.materialName}}｜{{item.materialCode}}</span>
|
<span>
|
<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 ? item.procedureName : '-'}} | </span>
|
<span>{{item.batch ? item.batch : '-'}}</span>
|
</span>
|
<span>货位：{{item.locationName}}</span>
|
<div class="zk_wl_item_num">
|
<span>转出数量({{item.unitName}})：</span>
|
<input type="number" v-model="item.total" placeholder="0" />
|
</div>
|
</div>
|
<template #right>
|
<van-button square type="danger" style="height: 100%;" text="删除" @click="dele(i)" />
|
</template>
|
</van-swipe-cell>
|
</template>
|
<div class="zk_wl_w" v-else>
|
<span>暂无数据</span>
|
</div>
|
</div>
|
<div class="zk_z"></div>
|
<div class="zk_footer">
|
<div class="zk_footer_wl" @click="open('w')">选择物料</div>
|
<div style="width: 20px"></div>
|
<div class="zk_footer_submit" @click="submit">提交</div>
|
</div>
|
</div>
|
<!-- 单据类型 -->
|
<van-popup v-model:show="view.type" position="bottom" round :style="{ height: '50%' }">
|
<van-picker
|
title="请选择单据类型"
|
:columns="view.documentTypeDate"
|
@confirm="onConfirm"
|
@cancel="onCancel"
|
:columns-field-names="view.customFieldName"
|
/>
|
</van-popup>
|
<!-- 选择仓库 -->
|
<Warehouse :show="view.Warehouse" @close="view.Warehouse = false" @value="getValue" />
|
<!-- 选择物料 -->
|
<Materials
|
ref="Material"
|
:show="view.Material"
|
:warehouseQualityType="view.warehouseQualityType"
|
:id="data.exWarehouseId.toString()"
|
@close="view.Material = false"
|
@value="getValueWL" />
|
</template>
|
|
<script setup lang="ts">
|
import { reactive, ref } from 'vue'
|
import { documentType } from '@/constData'
|
import { Toast } from 'vant'
|
import { createZK } from '@/apis/agencyAPI'
|
import { setTime } from '@/utils/utils'
|
import { useRouter } from "vue-router"
|
import Warehouse from '@/components/common/Warehouse.vue'
|
import Materials from '@/components/common/Materials.vue'
|
|
const router = useRouter()
|
|
const Material = ref(null)
|
|
let data = reactive({
|
type: '',
|
outUserId: '',
|
inUserId: '',
|
typeName: '',
|
exWarehouse: '',
|
exWarehouseId: '',
|
warehousingWarehouse: '',
|
warehousingWarehouseName: ''
|
})
|
|
let view = reactive({
|
type: false,
|
Warehouse: false,
|
Material: false,
|
status: '',
|
MaterialList: [],
|
documentTypeDate: documentType,
|
warehouseQualityType: '',
|
customFieldName: {
|
text: 'name'
|
}
|
})
|
|
// 创建转库单
|
const submit = () => {
|
// let isOpen: boolean = true
|
if (!data.type) return Toast.fail({ message: '单据类型不能为空' })
|
if (!data.exWarehouse) return Toast.fail({ message: '出库仓库不能为空' })
|
if (!data.warehousingWarehouse) return Toast.fail({ message: '入库仓库不能为空' })
|
if (view.MaterialList.length === 0) return Toast.fail({ message: '转出物料不能为空' })
|
// view.MaterialList.forEach((element: any) => {
|
// if (Number(element.total) > Number(element.num)) {
|
// // isOpen = false
|
// Toast.fail({ message: '转库的物料数量不能大于库存量！' })
|
// return
|
// }
|
// })
|
for (let i = 0; i < view.MaterialList.length; i++) {
|
if (!view.MaterialList[i].total || view.MaterialList[i].total <= 0) {
|
Toast.fail({ message: '转出数量必须大于0' })
|
return
|
}
|
if (Number(view.MaterialList[i].total) > Number(view.MaterialList[i].num)) {
|
Toast.fail({ message: '转库的物料数量不能大于库存量！' })
|
return
|
}
|
}
|
// if (isOpen) {
|
let time = setTime(new Date(), '-')
|
let wtransferDetailBeanList: any = []
|
view.MaterialList.forEach((element: any) => {
|
wtransferDetailBeanList.push({
|
batch: element.batch,
|
materialId: element.materialId,
|
procedureId: element.procedureId,
|
procedureName: element.procedureName,
|
qualityType: element.qualityType,
|
unitId: element.unitId,
|
outPlanNum: element.total,
|
proceduresId: element.procedureId,
|
inLocationId: null,
|
outLocationId: element.locationId,
|
inWarehouseId: data.exWarehouseId,
|
outWarehouseId: data.warehousingWarehouse
|
})
|
})
|
createZK({
|
type: data.type,
|
outPlandate: time,
|
inPlandate: time,
|
origin: 0,
|
outUserId: data.outUserId,
|
inUserId: data.inUserId,
|
inWarehouseId: data.warehousingWarehouse,
|
outWarehouseId: data.exWarehouseId,
|
wtransferDetailBeanList
|
}).then(res => {
|
if (res.code === 200) {
|
Toast.success({ message: '创建成功', forbidClick: true, duration: 2000 })
|
setTimeout(() => {
|
router.go(-1)
|
}, 2000)
|
}
|
})
|
// }
|
}
|
|
// 删除物料
|
const dele = (i: number): void => {
|
if (view.MaterialList.length === 1) {
|
Toast.fail({ message: '至少保留一项物料' })
|
return
|
}
|
view.MaterialList.splice(i, 1)
|
}
|
|
// 物料回调
|
const getValueWL = (val: any): void => {
|
val.forEach((element: any) => {
|
element.total = element.num
|
})
|
view.MaterialList.push(...val)
|
view.Material = false
|
}
|
|
// 仓库回调
|
const getValue = (val: any): void => {
|
if (view.status === 'c') {
|
data.exWarehouse = val.name
|
data.exWarehouseId = val.id
|
data.outUserId = val.managerId
|
} else if (view.status === 'r') {
|
data.warehousingWarehouseName = val.name
|
data.warehousingWarehouse = val.id
|
data.inUserId = val.managerId
|
view.warehouseQualityType = val.tmodel.label
|
}
|
view.Warehouse = false
|
}
|
|
// 打开选择弹框
|
const open = (type: string): void => {
|
if (type === 'd') {
|
view.type = true
|
} else if (type === 'c') {
|
view.status = 'c'
|
view.Warehouse = true
|
} else if (type === 'r') {
|
view.status = 'r'
|
view.Warehouse = true
|
} else if (type === 'w') {
|
if (data.exWarehouseId) {
|
if (data.warehousingWarehouseName) {
|
let arr: Array<any> = []
|
view.MaterialList.forEach((element: any) => {
|
arr.push(element.id)
|
})
|
const { selected }: any = Material.value
|
Material.value.selected = arr
|
view.Material = true
|
} else {
|
Toast.fail({ message: '请先选择入库仓库', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '请先选择出库仓库', duration: 2000 })
|
}
|
}
|
}
|
|
// 确认单据类型
|
const onConfirm = (val: any): void => {
|
data.type = val.id
|
data.typeName = val.name
|
view.type = false
|
}
|
|
const onCancel = (): void => {
|
view.type = false
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.zk {
|
position: absolute;
|
width: 100%;
|
.zk_list {
|
padding: 0 30px;
|
background: white;
|
margin-top: 20px;
|
.zk_list_item {
|
height: 98px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
border-bottom: 1PX solid #E5E5E5;
|
&:last-child {
|
border: none !important;
|
}
|
span {
|
font-size: 30px;
|
font-weight: 400;
|
color: #222222;
|
}
|
.zk_list_item_n {
|
display: flex;
|
align-items: center;
|
span {
|
font-size: 28px;
|
font-weight: 400;
|
color: #999999;
|
margin-right: 10px;
|
}
|
}
|
}
|
}
|
.zk_title {
|
padding: 40px 30px 30px 30px;
|
display: flex;
|
align-items: center;
|
.zk_title_i {
|
width: 8px;
|
height: 30px;
|
background: #4275FC;
|
border-radius: 2px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 32px;
|
font-weight: 500;
|
color: #222222;
|
}
|
}
|
.zk_wl {
|
background: white;
|
.zk_wl_w {
|
width: 100%;
|
height: 200px;
|
background: white;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 26px;
|
color: black;
|
}
|
.zk_wl_item {
|
display: flex;
|
flex-direction: column;
|
padding: 30px;
|
border-bottom: 1PX solid #e2e2e2;
|
.zk_wl_item_num {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-top: 30px;
|
span {
|
font-size: 28px;
|
font-weight: 400;
|
color: #222222;
|
margin: 0!important;
|
}
|
input {
|
width: 180px;
|
height: 60px;
|
background: #FFFFFF;
|
border-radius: 8px;
|
border: 1PX solid #CCCCCC;
|
padding: 0 30px;
|
font-size: 28px;
|
}
|
input::-webkit-input-placeholder {
|
font-size: 28px;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
span {
|
&:nth-child(1) {
|
font-size: 30px;
|
font-weight: 500;
|
color: #222222;
|
margin-bottom: 24px;
|
}
|
&:nth-child(2) {
|
font-size: 24px;
|
font-weight: 400;
|
color: #666666;
|
margin-bottom: 30px;
|
span {
|
font-size: 24px;
|
}
|
}
|
&:nth-child(3) {
|
font-size: 28px;
|
font-weight: 400;
|
color: #333333;
|
}
|
}
|
}
|
}
|
.zk_z {
|
height: 168px;
|
}
|
.zk_footer {
|
width: 100%;
|
box-sizing: border-box;
|
padding: 0 30px;
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
padding-bottom: 68px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.zk_footer_wl {
|
flex: 1;
|
height: 88px;
|
background: #FFFFFF;
|
box-shadow: 0 0 12px 0 rgba(0,0,0,0.08);
|
border-radius: 8px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 30px;
|
font-weight: 500;
|
color: $nav-color;
|
}
|
.zk_footer_submit {
|
flex: 1;
|
height: 88px;
|
background: $nav-color;
|
box-shadow: 0 0 12px 0 rgba(0,0,0,0.08);
|
border-radius: 8px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 30px;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
}
|
</style>
|
