mes-vue/src/components/SumbitDetailCard.vue
2026-07-16 11:28:08 +08:00

138 lines
4.7 KiB
Vue

<template>
<n-tabs type="card" animated>
<n-tab-pane name="合格" tab="合格" v-if="showOkTab">
<SubmitDetailPage
key="ok"
:disabled="false"
:formDetailData="formDetailOKData"
:showTraceCode="showTraceCode"
@update:formDetailData= "handleFormDetailOKData"
/>
</n-tab-pane>
<n-tab-pane name="报废" tab="报废" v-if="showScrapTab">
<SubmitDetailPage
key="scrap"
:disabled="false"
:formDetailData="formDetailScrapData"
:showTraceCode="showTraceCode"
@update:formDetailData= "handleFormDetailScrapData"
/>
</n-tab-pane>
<n-tab-pane name="返工" tab="返工" v-if="showReworkTab">
<SubmitDetailPage
key="rework"
:disabled="false"
:formDetailData="formDetailReworkData"
:showTraceCode="showTraceCode"
@update:formDetailData= "handleFormDetailReworkData"
/>
</n-tab-pane>
<n-tab-pane name="让步接收" tab="让步接收" v-if="showConnessionTab">
<SubmitDetailPage
key="conession"
:disabled="false"
:formDetailData="formDetailConcessionData"
:showTraceCode="showTraceCode"
@update:formDetailData= "handleFormDetailConcessionData"
/>
</n-tab-pane>
</n-tabs>
</template>
<script setup lang="ts">
import { ref, reactive, watch } from 'vue'
import {
NButton, NSpace, useMessage
} from 'naive-ui'
import {useRoute} from "vue-router";
import {QcResultDetail} from "@/api/qcResultDetail.ts";
import { qualityTestingApi} from '@/api/qualityTesting'
import router from '@/router';
import SubmitDetailPage from '@/components/SubmitDetailPage.vue';
const props = defineProps({
showOkTab:Boolean,
showScrapTab:Boolean,
showReworkTab:Boolean,
showConnessionTab:Boolean,
showTraceCode:Boolean,
})
const message = useMessage()
const route = useRoute()
const traceCode = ref(String(route.params.traceCode))
const emit = defineEmits(['updateSubmitDetail'])
const submitDetail = reactive<any>({})
const defaultFormDetailData:QcResultDetail = {
qcId: undefined,
resultType: undefined,
qty: 0,
traceCode: undefined,
defectCode: undefined,
handleAction: undefined,
actionStatus: undefined,
remark: '',
title:undefined,
images:[],
attachments:[]
}
const formDetailOKData = reactive<QcResultDetail>({ ...defaultFormDetailData,traceCode:traceCode.value, resultType: 1,handleAction:'下一道工序',actionStatus:1 })
const formDetailScrapData = reactive<QcResultDetail>({ ...defaultFormDetailData,traceCode:traceCode.value,resultType: 2,handleAction:'报废次品',actionStatus:1 })
const formDetailReworkData = reactive<QcResultDetail>({ ...defaultFormDetailData,traceCode:traceCode.value,resultType: 3,handleAction:'返工',actionStatus:1 })
const formDetailConcessionData = reactive<QcResultDetail>({ ...defaultFormDetailData,traceCode:traceCode.value,resultType: 4,handleAction:'让步接收',actionStatus:1 })
function handleFormDetailOKData(formDetailData:QcResultDetail) {
console.log('===OK表单触发更新===', formDetailData)
Object.assign(formDetailOKData, formDetailData)
submitDetail.okData = formDetailOKData
}
function handleFormDetailScrapData(formDetailData:QcResultDetail) {
console.log('===报废表单触发更新===', formDetailData)
Object.assign(formDetailScrapData, formDetailData)
submitDetail.scrapData = formDetailScrapData
}
function handleFormDetailReworkData(formDetailData:QcResultDetail) {
Object.assign(formDetailReworkData, formDetailData)
}
function handleFormDetailConcessionData(formDetailData:QcResultDetail){
Object.assign(formDetailConcessionData, formDetailData)
}
watch(
submitDetail,
(newVal)=>{
console.log(newVal);
emit('updateSubmitDetail',{...newVal})
},{ deep: true }
)
function handleReset() {
Object.assign(formDetailOKData, { ...defaultFormDetailData, resultType: 1, handleAction: '下一道工序', actionStatus: 1 })
Object.assign(formDetailScrapData, { ...defaultFormDetailData, resultType: 2, handleAction: '报废次品', actionStatus: 1 })
Object.assign(formDetailReworkData, { ...defaultFormDetailData, resultType: 3, handleAction: '返工', actionStatus: 1 })
Object.assign(formDetailConcessionData, { ...defaultFormDetailData, resultType: 4, handleAction: '让步接收', actionStatus: 1 })
message.info("表单已重置")
}
</script>