<template>
|
<div class="lk">
|
<!-- 详情 -->
|
<div class="lk_box">
|
<div class="lk_box_title">{{info.mmodelName ? info.mmodelName : '-'}} | {{info.mmodelCode ? info.mmodelCode : '-'}} | {{info.batch ? info.batch : '-'}}</div>
|
<div class="lk_box_info">
|
<div class="lk_box_info_item"><span>所在仓库：</span><span>{{info.whmodelName}}</span></div>
|
<div class="lk_box_info_item"><span>所在货位：</span><span>{{info.lmodelUnionName}}</span></div>
|
<div class="lk_box_info_item">
|
<span>质量属性：</span>
|
<span class="green" v-if="info.qualityType === 0">合格</span>
|
<span class="yellow" v-else-if="info.qualityType === 1">不良</span>
|
<span class="red" v-else-if="info.qualityType === 2">报废</span>
|
<span v-else></span>
|
</div>
|
<div class="lk_box_info_item"><span>产生工序：</span><span>{{info.pmodelName ? info.pmodelName : '-'}}</span></div>
|
<div class="lk_box_info_item"><span>返修工序：</span><span>{{info.fxpmodelName ? info.fxpmodelName : '-'}}</span></div>
|
<div class="lk_box_info_item"><span>客返单号：</span><span>{{info.saleorderId ? info.saleorderId : '-'}}</span></div>
|
<div class="lk_box_info_item"><span>客返客户：</span><span>{{info.cmodelName ? info.cmodelName : '-'}}</span></div>
|
</div>
|
</div>
|
<!-- 扫工装 -->
|
<div class="lk_scode">
|
<div class="lk_scode_jiu" @click="openScanCode('old')">
|
<img src="@/assets/icon/jianyan_ic_saoma@2x.png" alt="" />
|
<span>扫码旧工装</span>
|
</div>
|
<div class="z"></div>
|
<div class="lk_scode_xin" @click="openScanCode('new')">
|
<img src="@/assets/icon/gon1gdan_ic_saoma@2x.png" alt="" />
|
<span>扫码新工装</span>
|
</div>
|
</div>
|
<div class="lk_content">
|
<!-- 旧工装 -->
|
<div class="lk_content_jiu">
|
<div class="lk_content_jiu_title">
|
<div class="lk_content_jiu_title_left">
|
<div class="x"></div>
|
<span>旧工装码</span>
|
</div>
|
<div class="lk_content_jiu_title_right" @click="openGZ(1)">
|
<img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="">
|
<span>新增</span>
|
</div>
|
</div>
|
<div class="lk_content_jiu_box">
|
<template v-if="data.oldList.length > 0">
|
<van-swipe-cell v-for="(item, i) in data.oldList" :key="item.code">
|
<div class="item">
|
<div class="item_wz">
|
<span class="green" v-if="item.smodelLabel === Attribute.HG">[合格]</span>
|
<span class="yellow" v-else-if="item.smodelLabel === Attribute.BL">[不良]</span>
|
<span class="red" v-else-if="item.smodelLabel === Attribute.BF">[报废]</span>
|
<span class="green" v-else-if="item.smodelLabel === Attribute.HH">[混合]</span>
|
<span> {{item.code}}</span>
|
</div>
|
<div class="item_num">{{item.num}}{{item.umodelName}}</div>
|
</div>
|
<template #right>
|
<van-button style="height: 100%" square type="danger" text="删除" @click="dele(1, i)" />
|
</template>
|
</van-swipe-cell>
|
</template>
|
<template v-else>
|
<div class="items">暂无数据</div>
|
</template>
|
</div>
|
</div>
|
<!-- 新工装 -->
|
<div class="lk_content_jiu">
|
<div class="lk_content_jiu_title">
|
<div class="lk_content_jiu_title_left">
|
<div class="x"></div>
|
<span>新工装码</span>
|
</div>
|
<div class="lk_content_jiu_title_right" @click="openGZ(2)">
|
<img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="">
|
<span>新增</span>
|
</div>
|
</div>
|
<div class="lk_content_jiu_box">
|
<template v-if="data.newList.length > 0">
|
<van-swipe-cell v-for="(item, i) in data.newList" :key="item.code">
|
<div class="item">
|
<div class="item_wz">
|
<span class="green" v-if="item.smodelLabel === Attribute.HG">[合格]</span>
|
<span class="yellow" v-else-if="item.smodelLabel === Attribute.BL">[不良]</span>
|
<span class="red" v-else-if="item.smodelLabel === Attribute.BF">[报废]</span>
|
<span class="green" v-else-if="item.smodelLabel === Attribute.HH">[混合]</span>
|
<span> {{item.code}}</span>
|
</div>
|
<div class="item_num">
|
<input type="number" v-model="item.num" @blur="changeNum(item.num, i, item.umodelData)" placeholder="0" />
|
<span>{{data.oldList[0].umodelName}}</span>
|
</div>
|
</div>
|
<template #right>
|
<van-button style="height: 100%" square type="danger" text="删除" @click="dele(2, i)" />
|
</template>
|
</van-swipe-cell>
|
</template>
|
<template v-else>
|
<div class="items">暂无数据</div>
|
</template>
|
</div>
|
</div>
|
</div>
|
<div class="lk_zw"></div>
|
<div class="lk_footer">
|
<button class="lk_footer_submit" @click="submit" v-preventReClick>提交</button>
|
</div>
|
<!-- 扫码 -->
|
<v-ScanCode
|
:openCode="openCode"
|
:infos="['请扫描工装码']"
|
@closePopup="closePopup"
|
@onDecode="onDecode">
|
</v-ScanCode>
|
<!-- 工装器具 -->
|
<Tooling :show="gzShow" :classification="true" :statusname="'1'" @close="close" @value="getValue" />
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ref, reactive, onMounted } from 'vue'
|
import { useRoute, useRouter } from "vue-router"
|
import { QRCodeType, Attribute } from '@/enum'
|
import { Toast } from 'vant'
|
import { REGULAR } from '@/utils/utils'
|
import { getBarcodeContent, getListByCondition, chageApplicance } from "@/apis/WorkOrderAPI"
|
import Tooling from '@/components/common/Tooling.vue'
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
let data = reactive<{ oldList: any, newList: any, type: string | number }>({ // 新旧工装数据
|
oldList: [],
|
newList: [],
|
type: ''
|
})
|
|
let gzShow = ref<boolean>(false)
|
let info = ref<any>({}) // 详情数据
|
let openCode = ref<boolean>(false)
|
let type = ref<string>('')
|
|
// 修改新工装数量
|
const changeNum = (num: any, i: number, umodelData: number): void => {
|
if (umodelData === 0) {
|
if (!REGULAR.positiveInteger.test(num)) {
|
Toast.fail({ message: '数量只能输入正整数' })
|
data.newList.forEach((element: any, index: number) => {
|
if (i === index) {
|
element.num = ''
|
}
|
})
|
}
|
} else if (umodelData === 1) {
|
if (!REGULAR.number.test(num)) {
|
Toast.fail({ message: '数量只能输入整数或小数(四位)' })
|
data.newList.forEach((element: any, index: number) => {
|
if (i === index) {
|
element.num = ''
|
}
|
})
|
}
|
// if (!REGULAR.positiveInteger.test(num) && !REGULAR.decimal.test(num)) {
|
// Toast.fail({ message: '数量只能输入整数或小数' })
|
// data.newList.forEach((element: any, index: number) => {
|
// if (i === index) {
|
// element.num = ''
|
// }
|
// })
|
// }
|
}
|
}
|
|
const openGZ = (Type: number): void => {
|
data.type = Type
|
gzShow.value = true
|
}
|
|
// 删除新旧工装
|
const dele = (type: number, i: number): void => {
|
if (type === 1) {
|
if (data.oldList.length === 1) {
|
Toast.fail({ message: '至少保留一项旧工装', duration: 2000 })
|
return
|
}
|
data.oldList.splice(i, 1)
|
} else if (type === 2) {
|
if (data.newList.length === 1) {
|
Toast.fail({ message: '至少保留一项新工装', duration: 2000 })
|
return
|
}
|
data.newList.splice(i, 1)
|
}
|
}
|
|
// 获取工装数据
|
const getValue = (item: any): void => {
|
const arr: Array<any> = [...data.oldList, ...data.newList]
|
if (data.type == 1) {
|
let next: boolean = true
|
arr.forEach((element: any) => {
|
if (item.id === element.id) {
|
next = false
|
Toast.fail({ message: '不能重复添加相同的工装' })
|
return
|
}
|
})
|
if (next) {
|
data.oldList.push(item)
|
}
|
} else if (data.type == 2) {
|
let next: boolean = true
|
arr.forEach((element: any) => {
|
if (item.id === element.id) {
|
next = false
|
Toast.fail({ message: '不能重复添加相同的工装' })
|
return
|
}
|
})
|
if (next) {
|
data.newList.push(item)
|
}
|
}
|
gzShow.value = false
|
}
|
|
const close = (): void => {
|
gzShow.value = false
|
}
|
|
const closePopup = (): void => {
|
openCode.value = false
|
}
|
|
// 获取扫码回调
|
const onDecode = async (datas: string[]): Promise<void> => {
|
openCode.value = false
|
const arr: Array<any> = [...data.oldList, ...data.newList]
|
let res = await getBarcodeContent({ // 扫码请求返回类型和id
|
barcode: datas[0]
|
})
|
if (res.code === 200) {
|
if (res.data.barcodeType === QRCodeType.GZ) {
|
let infos = await getListByCondition({ id: res.data.id })
|
if (infos.code === 200) {
|
|
if (type.value === 'new') {
|
if (info.value.smodelLabel === infos.data[0].smodelLabel) {
|
// if (infos.data[0].status === 1) {
|
data.newList.push(infos.data[0])
|
// } else {
|
// Toast.fail({ message: '工装状态必须为空', duration: 2000 })
|
// }
|
} else {
|
Toast.fail({ message: '工装属性不一致', duration: 2000 })
|
}
|
return
|
}
|
|
let next: boolean = true
|
arr.forEach((element: any) => {
|
if (element.id === infos.data[0].id) {
|
next = false
|
Toast.fail({ message: '不能重复添加相同的工装' })
|
}
|
})
|
if (next) {
|
if (type.value === 'old') {
|
if (info.value.warehouseId === infos.data[0].warehouseId) {
|
if (info.value.locationId === infos.data[0].locationId) {
|
if (info.value.qualityType === infos.data[0].qualityType) {
|
if (info.value.procedureId === infos.data[0].procedureId) {
|
if (info.value.fxpmodelName === infos.data[0].fxpmodelName) {
|
if (info.value.saleorderId === infos.data[0].saleorderId) {
|
if (info.value.cmodelName === infos.data[0].cmodelName) {
|
data.oldList.push(infos.data[0])
|
} else {
|
Toast.fail({ message: '客返客户不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '客返单号不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '返修工序不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '产生工序不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '质量属性不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '货位不一致', duration: 2000 })
|
}
|
} else {
|
Toast.fail({ message: '仓库不一致', duration: 2000 })
|
}
|
}
|
// else if (type.value === 'new') {
|
// if (info.value.smodelLabel === infos.data[0].smodelLabel) {
|
// if (infos.data[0].status === 1) {
|
// data.newList.push(infos.data[0])
|
// } else {
|
// Toast.fail({ message: '工装状态必须为空', duration: 2000 })
|
// }
|
// } else {
|
// Toast.fail({ message: '工装属性不一致', duration: 2000 })
|
// }
|
// }
|
}
|
} else {
|
Toast.fail({ message: '请扫描正确的工装码' })
|
}
|
}
|
}
|
}
|
|
// 打开扫一扫
|
const openScanCode = (Type: string): void => {
|
type.value = Type
|
openCode.value = true
|
}
|
|
// 获取工装详情
|
const getInfo = async () => {
|
let res = await getListByCondition({ id: route.query.id })
|
if (res.code === 200) {
|
info.value = res.data[0]
|
data.oldList.push(res.data[0])
|
}
|
}
|
|
// 提交换篮筐
|
const submit = async (): Promise<void> => {
|
if (data.oldList.length === 0) {
|
Toast.fail({ message: '旧工装不能为空' })
|
return
|
}
|
if (data.newList.length === 0) {
|
Toast.fail({ message: '新工装不能为空' })
|
return
|
}
|
let news: number = 0
|
let old: number = 0
|
data.oldList.forEach((element: any) => {
|
old = old + element.num
|
})
|
data.newList.forEach((element: any) => {
|
news = news + element.num
|
})
|
if (news !== old) {
|
Toast.fail({ message: '新旧工装数量必须一致' })
|
return
|
}
|
let res = await chageApplicance({
|
oldList: data.oldList,
|
newList: data.newList
|
})
|
if (res.code === 200) {
|
Toast.success({ message: '操作成功', forbidClick: true, duration: 3000 })
|
setTimeout(() => {
|
router.go(-1)
|
}, 2000)
|
}
|
}
|
|
onMounted(() => {
|
getInfo()
|
})
|
</script>
|
|
<style lang="scss" scoped>
|
.lk {
|
width: 100%;
|
height: 100%;
|
position: absolute;
|
background: #F7F7F7;
|
.lk_box {
|
padding: 30px;
|
background: white;
|
.lk_box_title {
|
font-size: 32px;
|
font-weight: 500;
|
color: #333333;
|
}
|
.lk_box_info {
|
margin-top: 30px;
|
background: #F7F7F7;
|
padding: 24px 30px;
|
.lk_box_info_item {
|
display: flex;
|
align-items: center;
|
margin-bottom: 24px;
|
&:last-child {
|
margin-bottom: 0 !important;
|
}
|
span {
|
font-size: 26px;
|
font-weight: 400;
|
&:first-child {
|
color: #666666;
|
}
|
&:last-child {
|
color: #222222;
|
}
|
}
|
}
|
}
|
}
|
.lk_scode {
|
margin-top: 30px;
|
padding: 0 30px;
|
display: flex;
|
align-items: center;
|
.lk_scode_jiu {
|
flex: 1;
|
height: 76px;
|
background: #FFFFFF;
|
border-radius: 36px;
|
border: 1PX solid #E5E5E5;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
img {
|
width: 28px;
|
height: 28px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 26px;
|
font-weight: 400;
|
color: #222222;
|
}
|
}
|
.z {
|
width: 30px;
|
}
|
.lk_scode_xin {
|
flex: 1;
|
height: 76px;
|
background: $nav-color;
|
border-radius: 36px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
img {
|
width: 28px;
|
height: 28px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 26px;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
}
|
.lk_content {
|
.lk_content_jiu {
|
margin-top: 40px;
|
.lk_content_jiu_title {
|
padding: 0 30px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.lk_content_jiu_title_left {
|
display: flex;
|
align-items: center;
|
.x {
|
width: 8px;
|
height: 30px;
|
background: #4275FC;
|
border-radius: 2px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 32px;
|
font-weight: 500;
|
color: #222222;
|
}
|
}
|
.lk_content_jiu_title_right {
|
display: flex;
|
align-items: center;
|
img {
|
width: 28px;
|
height: 28px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 28px;
|
font-weight: 400;
|
color: #4275FC;
|
}
|
}
|
}
|
.lk_content_jiu_box {
|
margin-top: 28px;
|
background: white;
|
display: flex;
|
flex-direction: column;
|
.items {
|
width: 100%;
|
height: 98px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 28px;
|
font-weight: 400;
|
color: #000000;
|
}
|
.item {
|
margin: 0 30px;
|
height: 98px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
border-bottom: 1PX solid #E5E5E5;
|
&:last-child {
|
border-bottom: 0PX !important;
|
}
|
.item_wz {
|
span {
|
font-size: 30px;
|
font-weight: 400;
|
color: #222222;
|
}
|
}
|
.item_num {
|
font-size: 28px;
|
font-weight: 400;
|
color: #333333;
|
input {
|
font-size: 28px;
|
font-weight: 400;
|
color: #333333;
|
width: 180px;
|
height: 60px;
|
background: #FFFFFF;
|
border-radius: 8px;
|
border: 1PX solid #CCCCCC;
|
padding: 0 30px;
|
box-sizing: border-box;
|
margin-right: 20px;
|
}
|
input::-webkit-input-placeholder {
|
font-size: 28px;
|
font-weight: 400;
|
color: #999999;
|
}
|
span {
|
font-size: 28px;
|
font-weight: 400;
|
color: #666666;
|
}
|
}
|
}
|
}
|
}
|
}
|
.lk_zw {
|
height: 168px;
|
}
|
.lk_footer {
|
position: fixed;
|
bottom: 0;
|
left: 30px;
|
padding-bottom: 60px;
|
width: calc(100% - 60px);
|
.lk_footer_submit {
|
border: none;
|
width: 100%;
|
height: 88px;
|
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;
|
font-size: 30px;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
}
|
</style>
|
