<template>
|
<el-dialog
|
:title="!dataForm.id ? '新增' : '修改'"
|
: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="8"><div class="grid-content bg-purple">
|
<el-form-item label="模板编号" prop="qtplNo">
|
<el-input v-model="dataForm.qtplNo" placeholder="模板编号" v-bind:disabled='showDisable'></el-input>
|
</el-form-item>
|
<el-form-item label="模板描述" prop="qtplDesc">
|
<el-input v-model="dataForm.qtplDesc" placeholder="模板描述"></el-input>
|
</el-form-item>
|
<el-form-item label="检验周期" prop="testCycle">
|
<el-input type="number" v-model="dataForm.testCycle" placeholder="检验周期"></el-input>
|
</el-form-item>
|
</div></el-col>
|
|
<el-col :span="8"><div class="grid-content bg-purple-light">
|
<el-form-item label="体系文档编号" prop="sysNo">
|
<el-input v-model="dataForm.sysNo" placeholder="体系文档编号"></el-input>
|
</el-form-item>
|
<el-form-item label="体系文档描述" prop="sysDesc">
|
<el-input v-model="dataForm.sysDesc" placeholder="体系文档描述"></el-input>
|
</el-form-item>
|
<el-form-item label="启用状态" prop="status">
|
<el-switch v-model="dataForm.status"
|
:active-value='true'
|
:inactive-value='false' ></el-switch>
|
</el-form-item>
|
</div></el-col>
|
|
<el-col :span="8"><div class="grid-content bg-purple">
|
<el-form-item label="检验类型" prop="testType">
|
<el-select v-model="dataForm.testType" filterable placeholder="请选择" >
|
<el-option
|
v-for="(item,index) in testTypeOptions"
|
:key="index"
|
:label="item.value"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="检验规则" prop="testRule">
|
<el-select v-model="dataForm.testRule" filterable placeholder="请选择" >
|
<el-option
|
v-for="(item,index) in testRuleTypeOptions"
|
:key="index"
|
:label="item.value"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</div></el-col>
|
</el-row>
|
<!--模板对应检验项和零件维护-->
|
<el-row>
|
<el-tabs type="border-card">
|
<el-tab-pane label="检验项">
|
<!--检验项-->
|
<el-table
|
:data="dataForm.items"
|
height="400"
|
v-loading="dataListLoading" class="tableItems">
|
<el-table-column
|
prop="testItems"
|
header-align="center"
|
align="center"
|
label="检测项目">
|
<template slot-scope="scope">
|
<el-form-item :prop="'items.' + scope.$index + '.testItems'" :rules="dataRule.testItems" class="testItems">
|
<el-input v-model="scope.row.testItems" ></el-input>
|
</el-form-item>
|
</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="请选择" >
|
<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"></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"></el-input></template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
width="60px">
|
<template slot="header" slot-scope="scope">
|
<el-button type="text" icon="el-icon-circle-plus-outline" size="medium" style="color: #e6a23c"
|
@click="addItems()"></el-button>
|
</template>
|
<template slot-scope="scope">
|
<el-button
|
type="text"
|
icon="el-icon-delete"
|
size="medium"
|
style="color: red"
|
@click="deleteItemHandle(scope.$index,scope.row.id)"></el-button>
|
</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()">确定</el-button>
|
</span>
|
</el-dialog>
|
|
</template>
|
|
<script>
|
import {getTemplateObj, addObj, putObj,dir} from '@/api/quality/template'
|
import {delItemsObj} from '@/api/quality/items'
|
|
export default {
|
|
data () {
|
return {
|
partIndex:0,
|
showDisable:false,
|
showPart:false,
|
dataListLoading: false,
|
addThisPart:false,
|
visible: false,
|
testTypeOptions:[],
|
testRuleTypeOptions:[],
|
testUnitTypeOptions:[],
|
partsOldLength:0,
|
itemsOldLength:0,
|
dataForm: {
|
id: 0,
|
qtplNo: '',
|
qtplDesc: '',
|
sysNo: '',
|
sysDesc: '',
|
testType: '',
|
testRule: '',
|
testCycle: '',
|
status: '',
|
items:[],
|
},
|
dataRule: {
|
qtplNo: [
|
{ required: true, message: '模板编号不能为空', trigger: 'blur' }
|
],
|
qtplDesc: [
|
{ required: true, message: '模板描述不能为空', trigger: 'blur' }
|
],
|
testRule: [
|
{ required: true, message: '检验规则不能为空', trigger: 'blur' }
|
],
|
testCycle: [
|
{ required: true, message: '检验周期不能为空', trigger: 'blur' }
|
],
|
createDate: [
|
{ required: true, message: '编制日期不能为空', trigger: 'blur' }
|
],
|
testItems: [
|
{ required: true, message: '检测项目不能为空', trigger: 'blur' }
|
],
|
}
|
}
|
},
|
methods: {
|
init (id) {
|
this.initUnitType("unit")
|
this.initDirTestType("test_type")
|
this.initDirTestRuleType("test_rule_type")
|
this.dataForm.id = id || 0
|
this.visible = true
|
this.$nextTick(() => {
|
this.$refs['dataForm'].resetFields()
|
if (this.dataForm.id) {
|
this.showDisable=true
|
getTemplateObj(this.dataForm.id).then(response => {
|
this.dataForm = response.data.data
|
//将后台传items的值付给dataForm的items
|
this.dataForm.items = response.data.data.items ? response.data.data.items : []
|
})
|
}else{
|
this.initDefaultForm()
|
}
|
})
|
},
|
//初始化表单
|
initDefaultForm(){
|
this.dataForm.id= 0,
|
this.dataForm.qtplNo=null,
|
this.dataForm.qtplDesc=null,
|
this.dataForm.sysDesc=null,
|
this.dataForm.testType=null,
|
this.dataForm.testRule=null,
|
this.dataForm.testCycle=null,
|
this.dataForm.status=true,
|
this.dataForm.items=[],
|
this.showDisable=false
|
},
|
// 表单提交
|
dataFormSubmit () {
|
this.$refs['dataForm'].validate((valid) => {
|
if (valid) {
|
if (this.dataForm.id) {
|
putObj(this.dataForm).then(data => {
|
this.$message.success('修改成功')
|
this.visible = false
|
this.$emit('refreshDataList')
|
});
|
} else {
|
addObj(this.dataForm).then(data => {
|
this.$message.success('添加成功')
|
this.visible = false
|
this.$emit('refreshDataList')
|
})
|
}
|
}
|
})
|
},
|
//添加检验项行
|
addItems(){
|
let itemsInfo={};
|
itemsInfo.testItems=null;
|
itemsInfo.testUnit=null;
|
itemsInfo.testMethod=null;
|
itemsInfo.remark=null;
|
this.dataForm.items.push(itemsInfo);
|
|
},
|
//删除检验项行
|
deleteItemHandle(index,id) {
|
if("undefined" == typeof id ){
|
this.dataForm.items.splice(index, 1);
|
}else{
|
this.$confirm('是否确认删除此检验项', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
closeOnClickModal:false,
|
type: 'warning'
|
}).then(function () {
|
return delItemsObj(id)
|
}).then(data => {
|
this.$message.success('删除成功')
|
this.dataForm.items.splice(index, 1);
|
})
|
}
|
},
|
//数据字典传值
|
initDirTestType(index) {
|
dir(index).then(res => {
|
this.testTypeOptions = res.data.data;
|
})
|
},
|
initDirTestRuleType(index) {
|
dir(index).then(res => {
|
this.testRuleTypeOptions = res.data.data;
|
})
|
},
|
initUnitType(index){
|
dir(index).then(res => {
|
this.testUnitTypeOptions = res.data.data;
|
})
|
}
|
}
|
}
|
</script>
|
<style>
|
.tableItems td {
|
padding: 0px 0px !important;
|
}
|
.testItems{
|
padding-bottom: 0px !important;
|
padding-top: 16px !important;
|
}
|
.testItems .el-form-item__content{
|
margin-left: 0px !important;
|
}
|
|
|
</style>
|