<template>
|
<el-dialog
|
:title="!dataForm.partId ? '新增' : '修改'"
|
:close-on-click-modal="false"
|
:visible.sync="visible">
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="120px" class="l-mes">
|
<el-row >
|
<el-col :span="12">
|
<el-form-item label="零件" prop="partName" style="margin-left: 0px">
|
<el-input v-model="dataForm.partName" placeholder="请选择零件" readonly>
|
<el-button slot="append" icon="el-icon-search" @click="openPartDialog()"></el-button>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="零件编号" prop="partNo">
|
<el-input class="innerClass" v-model="dataForm.partNo" placeholder="零件编号" readonly></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row >
|
<el-col :span="12">
|
<el-form-item label="检测模板" prop="templateNo">
|
<el-input v-model="dataForm.templateNo" placeholder="请选择检测模板" readonly>
|
<el-button slot="append" icon="el-icon-search" @click="openTemplateDialog()"></el-button>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="模板描述" prop="templateDesc">
|
<el-input v-model="dataForm.templateDesc" placeholder="描述" readonly></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<!--弹出和选择的检测模板对应的检测项-->
|
<el-row>
|
<el-tabs type="border-card">
|
<el-tab-pane label="检验项">
|
<el-table
|
:data="dataForm.items"
|
height="300"
|
v-loading="dataListLoading"
|
class="tableItems"
|
>
|
|
<el-table-column
|
prop="testItems"
|
header-align="center"
|
align="center"
|
label="检测项目">
|
<template slot-scope="scope"><el-input v-model="scope.row.testItems" disabled></el-input></template>
|
</el-table-column>
|
<el-table-column
|
prop="testUnit"
|
header-align="center"
|
align="center"
|
label="计量单位">
|
<template slot-scope="scope">
|
<el-select v-model="scope.row.testUnit" filterable placeholder="请选择" disabled >
|
<el-option
|
v-for="(item,index) in testUnitTypeOptions"
|
:key="index"
|
:label="item.value"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="testMethod"
|
header-align="center"
|
align="center"
|
label="检验方法">
|
<template slot-scope="scope"><el-input v-model="scope.row.testMethod" disabled></el-input></template>
|
</el-table-column>
|
|
<el-table-column
|
prop="remark"
|
header-align="center"
|
align="center"
|
label="备注">
|
<template slot-scope="scope"><el-input v-model="scope.row.remark" disabled></el-input></template>
|
</el-table-column>
|
<el-table-column
|
prop="testRequirements"
|
header-align="center"
|
align="center"
|
label="检测要求"
|
>
|
<template slot-scope="scope">
|
<el-form-item :prop="'items.' + scope.$index + '.testRequirements'" :rules="dataRule.testRequirements" class="testRequirements">
|
<el-input v-model="scope.row.testRequirements" ></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
</el-table>
|
</el-tab-pane>
|
</el-tabs>
|
</el-row>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="visible = false">取消</el-button>
|
<el-button type="primary" @click="dataFormSubmit()":disabled="isDisable">确定</el-button>
|
</span>
|
<qualityPartDialog :currshowlist.sync="showPart" @listenToPartEvent="selectPart"/>
|
<templateDialog :currshowlist.sync="showTemplate" @listenToTemplateEvent="selectTemplate"/>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {getPartsJoinTemplateById,getPartsObj, addObj, putObj,selectItemsRequirementsByPartId} from '@/api/quality/parts'
|
import {getTemplateObj} from '@/api/quality/template'
|
import qualityPartDialog from '@/views/common/part.vue';
|
import templateDialog from '@/views/quality/parts/template.vue';
|
import {getObj} from '@/api/basic/part'
|
import {dir} from '@/api/quality/template'
|
export default {
|
|
components: {
|
qualityPartDialog,
|
templateDialog
|
},
|
data () {
|
return {
|
isDisable:false,//重复提交验证
|
visible: false,
|
showPart:false,
|
showTemplate:false,
|
updateData:false,
|
dataListLoading: false,
|
testUnitTypeOptions:[],
|
dataForm: {
|
templateId: '',
|
templateNo: '',
|
templateDesc: '',
|
partId: 0,
|
partNo: '',
|
partName: '',
|
items:[],
|
requirements:[],
|
templates:[]
|
},
|
dataRule: {
|
partName : [
|
{ required: true, message: '零件不能为空', trigger: 'blur' }
|
],
|
templateNo : [
|
{ required: true, message: '检测模板不能为空', trigger: 'blur' }
|
],
|
testRequirements: [
|
{ required: true, message: '检验要求不能为空', trigger: 'blur' }
|
]
|
}
|
}
|
},
|
methods: {
|
init (id) {
|
this.updateData=false
|
this.isDisable=false
|
this.cleanDataForm()
|
this.dataForm.partId = id || 0
|
this.visible = true
|
this.$nextTick(() => {
|
this.$refs['dataForm'].resetFields()
|
if (this.dataForm.partId) {
|
this.updateData=true
|
getPartsObj(this.dataForm.partId).then(response => {
|
this.dataForm.templateId=response.data.data.templates[0].id
|
this.dataForm.templateNo=response.data.data.templates[0].qtplNo
|
this.dataForm.templateDesc=response.data.data.templates[0].qtplDesc
|
this.selectPartInfo(response.data.data.partId);
|
})
|
}
|
|
})
|
},
|
//通过表partId查询相关信息展示
|
selectPartInfo(id){
|
//获取相关零件信息
|
getObj(id).then(response => {
|
this.selectItemsRequirementsByPartId(id,response.data.data.partNo,response.data.data.partName);
|
})
|
},
|
selectItemsRequirementsByPartId(id,a,b){
|
//获取检测项和检测要求信息
|
selectItemsRequirementsByPartId(id).then(response=>{
|
this.dataForm.items=response.data.data ? response.data.data : []
|
this.dataForm.partNo=a
|
this.dataForm.partName=b
|
})
|
},
|
// 表单提交
|
dataFormSubmit () {
|
this.$refs['dataForm'].validate((valid) => {
|
if (valid) {
|
this.isDisable=true//提交按钮置灰
|
if (this.updateData) {
|
this.addRequirementsObj();
|
putObj(this.dataForm).then(data => {
|
this.$message.success('修改成功')
|
this.visible = false
|
this.$emit('refreshDataList')
|
if (data.code==1){
|
this.isDisable=false
|
}
|
});
|
} else {
|
//将检测项信息存入requirements
|
this.addRequirementsObj();
|
addObj(this.dataForm).then(data => {
|
this.$message.success('添加成功')
|
this.visible = false
|
this.$emit('refreshDataList')
|
if (data.code==1){
|
this.isDisable=false
|
}
|
})
|
}
|
}
|
})
|
},
|
addRequirementsObj(){
|
this.dataForm.requirements=[]
|
for(let i=0;i<this.dataForm.items.length;i++){
|
let requirementsObj={};
|
requirementsObj.templateId=this.dataForm.templateId;
|
requirementsObj.partId=0;
|
requirementsObj.itemsId=this.dataForm.items[i].id;
|
requirementsObj.testRequirements=this.dataForm.items[i].testRequirements;
|
this.dataForm.requirements.push(requirementsObj)
|
}
|
},
|
//弹出零件表单
|
openPartDialog(index){
|
this.showPart=true;
|
},
|
//添加零件信息
|
selectPart(param){
|
if(!this.updateData){
|
if(typeof(param)!="undefined") {
|
//判断添加的零件是否已经绑定模板
|
getPartsJoinTemplateById(param.id).then(response => {
|
if(!response.data.data){
|
this.$message.warning('该零件已绑定检测模板')
|
}else{
|
this.dataForm.partId=param.id;
|
this.dataForm.partNo = param.partNo;
|
this.dataForm.partName = param.partName;
|
this.$refs['dataForm'].validateField('partName', valid => {
|
})
|
}
|
})
|
}
|
}else{
|
this.$message.warning('请勿修改零件')
|
}
|
},
|
//弹出检测模板表单
|
openTemplateDialog(index){
|
this.showTemplate=true;
|
},
|
//添加检测模板信息
|
selectTemplate(param){
|
this.dataForm.items=[]
|
if(typeof(param)!="undefined") {
|
getTemplateObj(param.id).then(response => {
|
this.dataForm.templateId=response.data.data.id;
|
this.dataForm.templateNo = response.data.data.qtplNo;
|
this.dataForm.templateDesc = response.data.data.qtplDesc;
|
//将后台传items的值付给dataForm的items
|
this.dataForm.items = response.data.data.items ? response.data.data.items : []
|
this.$refs['dataForm'].validateField('templateNo', valid => {
|
})
|
})
|
|
}
|
},
|
//清空
|
cleanDataForm(){
|
this.dataForm.templateId=0
|
this.dataForm.templateNo=null
|
this.dataForm.templateDesc=null
|
this.dataForm.partId=0
|
this.dataForm.partNo=null
|
this.dataForm.partName=null
|
this.dataForm.items=[]
|
this.dataForm.requirements=[]
|
},
|
|
initUnitType(index){
|
dir(index).then(res => {
|
this.testUnitTypeOptions = res.data.data;
|
})
|
}
|
}
|
}
|
</script>
|
<style>
|
.tableItems td {
|
padding: 0px 0px !important;
|
}
|
.testRequirements{
|
padding-bottom: 0px !important;
|
padding-top: 17px !important;
|
}
|
.testRequirements .el-form-item__content{
|
margin-left: 0px !important;
|
}
|
|
|
|
</style>
|
