fix:检测表中的项目添加编辑

This commit is contained in:
shijing 2024-12-26 17:10:12 +08:00
parent a8c948775e
commit 8432b41a82
2 changed files with 149 additions and 65 deletions

View File

@ -9,7 +9,7 @@
<template> <template>
<div class="sc-form-table" ref="scFormTable"> <div class="sc-form-table" ref="scFormTable">
<el-table :data="data" ref="table" border > <el-table :data="data" ref="table" border :height="tableHeight">
<el-table-column type="index" width="50" fixed="left"> <el-table-column type="index" width="50" fixed="left">
<template #header> <template #header>
<el-button v-if="!hideAdd" type="primary" icon="el-icon-plus" size="small" circle @click="rowAdd"></el-button> <el-button v-if="!hideAdd" type="primary" icon="el-icon-plus" size="small" circle @click="rowAdd"></el-button>
@ -39,6 +39,10 @@
export default { export default {
props: { props: {
tableHeight:{
type: [Number, String],
default: 300
},
modelValue: { type: Array, default: () => [] }, modelValue: { type: Array, default: () => [] },
addTemplate: { type: Object, default: () => {} }, addTemplate: { type: Object, default: () => {} },
placeholder: { type: String, default: "暂无数据" }, placeholder: { type: String, default: "暂无数据" },

View File

@ -26,17 +26,19 @@
<sc-form-table <sc-form-table
hideDelete hideDelete
hideIndex hideIndex
:tableHeight="200"
v-model="qctmatlist" v-model="qctmatlist"
:addTemplate="mataddTemplate" :addTemplate="mataddTemplate"
placeholder="暂无数据" placeholder="暂无数据"
> >
<el-table-column prop="type" label="物料"> <el-table-column prop="type" label="物料">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.id">{{ scope.row.material_name }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.material_name }}</span>
<xtSelect <xtSelect
v-else v-else
:apiObj="apiObj" :apiObj="apiObj"
v-model="scope.row.material" v-model="scope.row.material"
v-model:label="scope.row.material_name"
style="width:100%" style="width:100%"
> >
<el-table-column label="名称" prop="name"></el-table-column> <el-table-column label="名称" prop="name"></el-table-column>
@ -47,7 +49,7 @@
</el-table-column> </el-table-column>
<el-table-column prop="time" label="追溯层级"> <el-table-column prop="time" label="追溯层级">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.id">{{ tracing_[scope.row.tracing] }}</span> <span v-if="!scope.row.isEdit">{{ tracing_[scope.row.tracing] }}</span>
<el-select <el-select
v-else v-else
v-model="scope.row.tracing" v-model="scope.row.tracing"
@ -63,10 +65,18 @@
</el-select> </el-select>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="open" label="操作" width="80" align="center"> <el-table-column prop="open" label="操作" width="125" align="center">
<template #default="scope"> <template #default="scope">
<el-button <el-button
v-if="!scope.row.edit" v-if="scope.row.isEdit"
text
type="primary"
size="small"
@click="formTableAdd(scope.row,'mat')"
>保存</el-button
>
<el-button
v-else
text text
type="primary" type="primary"
size="small" size="small"
@ -74,21 +84,14 @@
>编辑</el-button >编辑</el-button
> >
<el-button <el-button
v-if="scope.row.id" v-if="!scope.row.isEdit"
text text
type="danger" type="danger"
size="small" size="small"
@click="formTableDel(scope.row.id,'mat')" @click="formTableDel(scope.row.id,'mat')"
>删除</el-button >删除</el-button
> >
<el-button
v-if="scope.row.edit"
text
type="primary"
size="small"
@click="formTableAdd(scope.row,'mat')"
>保存</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</sc-form-table> </sc-form-table>
@ -97,23 +100,25 @@
<el-card style="width: 100%" header="检测项" shadow="hover"> <el-card style="width: 100%" header="检测项" shadow="hover">
<sc-form-table <sc-form-table
hideIndex hideIndex
:tableHeight="300"
v-model="qcttestitemlist" v-model="qcttestitemlist"
:addTemplate="defectaddTemplate" :addTemplate="defectaddTemplate"
placeholder="暂无数据" placeholder="暂无数据"
> >
<el-table-column prop="val" label="排序" width="80"> <el-table-column prop="val" label="排序" width="80">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.id">{{ scope.row.sort }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.sort }}</span>
<el-input v-else v-model="scope.row.sort" placeholder="排序"></el-input> <el-input v-else v-model="scope.row.sort" placeholder="排序"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="time" label="检测项"> <el-table-column prop="time" label="检测项">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.id">{{scope.row.testitem_name}}</span> <span v-if="!scope.row.isEdit">{{scope.row.testitem_name}}</span>
<xtSelect <xtSelect
v-else v-else
:apiObj="apiObj2" :apiObj="apiObj2"
v-model="scope.row.testitem" v-model="scope.row.testitem"
v-model:label="scope.row.testitem_name"
v-model:obj="testitemrow" v-model:obj="testitemrow"
style="width:100%" style="width:100%"
> >
@ -124,14 +129,22 @@
</el-table-column> </el-table-column>
<el-table-column prop="type" label="备注"> <el-table-column prop="type" label="备注">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.id">{{ scope.row.note }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.note }}</span>
<el-input v-else v-model="testitemrow.description" placeholder="备注"></el-input> <el-input v-else v-model="testitemrow.description" placeholder="备注"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="open" label="操作" width="80" align="center"> <el-table-column prop="open" label="操作" width="125" align="center">
<template #default="scope"> <template #default="scope">
<el-button <el-button
v-if="!scope.row.edit" v-if="scope.row.isEdit"
text
type="primary"
size="small"
@click="formTableAdd(scope.row,'testitem')"
>保存</el-button
>
<el-button
v-else
text text
type="primary" type="primary"
size="small" size="small"
@ -139,21 +152,14 @@
>编辑</el-button >编辑</el-button
> >
<el-button <el-button
v-if="scope.row.id" v-if="!scope.row.isEdit"
text text
type="danger" type="danger"
size="small" size="small"
@click="formTableDel(scope.row.id,'testitem')" @click="formTableDel(scope.row.id,'testitem')"
>删除</el-button >删除</el-button
> >
<el-button
v-if="scope.row.edit"
text
type="primary"
size="small"
@click="formTableAdd(scope.row,'testitem')"
>保存</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</sc-form-table> </sc-form-table>
@ -162,24 +168,26 @@
<el-card style="width: 100%" header="检测缺陷项" shadow="hover"> <el-card style="width: 100%" header="检测缺陷项" shadow="hover">
<sc-form-table <sc-form-table
hideIndex hideIndex
:tableHeight="300"
v-model="qctdefectlist" v-model="qctdefectlist"
:addTemplate="testitemaddTemplate" :addTemplate="testitemaddTemplate"
placeholder="暂无数据" placeholder="暂无数据"
> >
<el-table-column prop="val" label="排序" width="80"> <el-table-column prop="val" label="排序" width="80">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.edit">{{ scope.row.sort }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.sort }}</span>
<el-input v-else v-model="scope.row.sort" placeholder="排序"></el-input> <el-input v-else v-model="scope.row.sort" placeholder="排序"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="time" label="缺陷项"> <el-table-column prop="time" label="缺陷项">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.edit">{{scope.row.defect_name}}</span> <span v-if="!scope.row.isEdit">{{scope.row.defect_name}}</span>
<xtSelect <xtSelect
v-else v-else
:apiObj="apiObj3" :apiObj="apiObj3"
v-model="scope.row.defect" v-model="scope.row.defect"
v-model:obj="defectrow" v-model:obj="defectrow"
v-model:label="scope.row.defect_name"
style="width:100%" style="width:100%"
> >
<el-table-column label="名称" prop="name"></el-table-column> <el-table-column label="名称" prop="name"></el-table-column>
@ -189,42 +197,42 @@
</el-table-column> </el-table-column>
<el-table-column prop="val" label="判定表达式" min-width="150"> <el-table-column prop="val" label="判定表达式" min-width="150">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.edit">{{ scope.row.rule_expression }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.rule_expression }}</span>
<el-input v-else v-model="scope.row.rule_expression" placeholder="请输入判定表达式"></el-input> <el-input v-else v-model="scope.row.rule_expression" placeholder="请输入判定表达式"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="type" label="备注"> <el-table-column prop="type" label="备注">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.edit">{{ scope.row.note }}</span> <span v-if="!scope.row.isEdit">{{ scope.row.note }}</span>
<el-input v-else v-model="scope.row.note" placeholder="备注"></el-input> <el-input v-else v-model="scope.row.note" placeholder="备注"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="open" label="操作" width="125" align="center"> <el-table-column prop="open" label="操作" width="125" align="center">
<template #default="scope"> <template #default="scope">
<el-button <el-button
v-if="!scope.row.edit" v-if="scope.row.isEdit"
text
type="danger"
size="small"
@click="formTableDel(scope.row.id,'defect')"
>删除</el-button
>
<el-button
v-if="scope.row.id"
text
type="primary"
size="small"
@click="formTableEdit(scope.row.id,'defect')"
>编辑</el-button
>
<el-button
v-if="scope.row.edit"
text text
type="primary" type="primary"
size="small" size="small"
@click="formTableAdd(scope.row,'defect')" @click="formTableAdd(scope.row,'defect')"
>保存</el-button >保存</el-button
> >
<el-button
v-else
text
type="primary"
size="small"
@click="formTableEdit(scope.row,'defect')"
>编辑</el-button
>
<el-button
v-if="!scope.row.isEdit"
text
type="danger"
size="small"
@click="formTableDel(scope.row.id,'defect')"
>删除</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</sc-form-table> </sc-form-table>
@ -323,23 +331,23 @@ export default {
that.qctmatlist = [],that.qctdefectlist =[],that.qcttestitemlist =[]; that.qctmatlist = [],that.qctdefectlist =[],that.qcttestitemlist =[];
that.$API.qm.qctmat.list.req({qct:that.qctItem.id,page:0}).then(res=>{ that.$API.qm.qctmat.list.req({qct:that.qctItem.id,page:0}).then(res=>{
res.forEach(item=>{ res.forEach(item=>{
let obj = object.assign({},item); let obj = Object.assign({},item);
obj.edit = false; obj.isEdit = false;
that.qctmatlist.push(obj); that.qctmatlist.push(obj);
}) })
}); });
that.$API.qm.qctdefect.list.req({qct:that.qctItem.id,page:0}).then(res=>{ that.$API.qm.qctdefect.list.req({qct:that.qctItem.id,page:0}).then(res=>{
res.forEach(item=>{ res.forEach(item=>{
let obj = object.assign({},item); let obj = Object.assign({},item);
obj.edit = false; obj.isEdit = false;
that.qctdefectlist.push(obj); that.qctdefectlist.push(obj);
}) })
// that.qctdefectlist = res; // that.qctdefectlist = res;
}); });
that.$API.qm.qcttestitem.list.req({qct:that.qctItem.id,page:0}).then(res=>{ that.$API.qm.qcttestitem.list.req({qct:that.qctItem.id,page:0}).then(res=>{
res.forEach(item=>{ res.forEach(item=>{
let obj = object.assign({},item); let obj = Object.assign({},item);
obj.edit = false; obj.isEdit = false;
that.qcttestitemlist.push(obj); that.qcttestitemlist.push(obj);
}) })
// that.qcttestitemlist = res; // that.qcttestitemlist = res;
@ -347,30 +355,102 @@ export default {
}, },
// //
formTableAdd(row,type) { formTableAdd(row,type) {
console.log('formTableAdd',row);
let that = this,api = '';
if(type=='defect'){
if(row.id!==''&&row.id!==undefined&&row.id!==null){
api = that.$API.qm.qctdefect.update;
}else{
row.note = that.defectrow.note;
api = that.$API.qm.qctdefect.create;
}
}else if(type=='mat'){
if(row.id!==''&&row.id!==undefined&&row.id!==null){
api = that.$API.qm.qctmat.update;
}else{
api = that.$API.qm.qctmat.create;
}
}else if(type=='testitem'){
if(row.id!==''&&row.id!==undefined&&row.id!==null){
api = that.$API.qm.qcttestitem.update;
}else{
row.note = that.testitemrow.description;
api = that.$API.qm.qcttestitem.create;
}
}
this.$nextTick(() => {
if(row.id!==''&&row.id!==undefined&&row.id!==null){
api.req(row.id,row).then((res) => {
that.$message.success("编辑成功");
that.getLists();
return res;
}).catch((err) => {
return err;
});
}else{
api.req(row).then((res) => {
that.$message.success("添加成功");
that.getLists();
return res;
}).catch((err) => {
return err;
});
}
})
},
//
formTableSave(row,type) {
let that = this,api = ''; let that = this,api = '';
if(type=='defect'){ if(type=='defect'){
// console.log(that.defectrow);
row.note = that.defectrow.note; row.note = that.defectrow.note;
api = that.$API.qm.qctdefect.create; api = that.$API.qm.qctdefect.create;
}else if(type=='mat'){ }else if(type=='mat'){
api = that.$API.qm.qctmat.create; api = that.$API.qm.qctmat.create;
}else if(type=='testitem'){ }else if(type=='testitem'){
// console.log(that.testitemrow);
row.note = that.testitemrow.description; row.note = that.testitemrow.description;
api = that.$API.qm.qcttestitem.create; api = that.$API.qm.qcttestitem.create;
} }
this.$nextTick(() => { this.$nextTick(() => {
api.req(row).then((res) => { if(row.id!==''&&row.id!==undefined&&row.id!==null){
that.$message.success("添加成功"); api.req(row).then((res) => {
that.getLists(); that.$message.success("添加成功");
return res; that.getLists();
}).catch((err) => { return res;
return err; }).catch((err) => {
}); return err;
});
}else{
api.req(row).then((res) => {
that.$message.success("添加成功");
that.getLists();
return res;
}).catch((err) => {
return err;
});
}
}) })
}, },
formTableEdit(row,type) { formTableEdit(row,type) {
if(type=='mat'){
this.qctmatlist.forEach((item, index) => {
if (item.id == row.id) {
this.qctmatlist[index].isEdit = true;
}
});
}else if(type=='testitem'){
this.qcttestitemlist.forEach((item, index) => {
if (item.id == row.id) {
this.qcttestitemlist[index].isEdit = true;
}
});
}else if(type=='defect'){
this.qctdefectlist.forEach((item, index) => {
if (item.id == row.id) {
this.qctdefectlist[index].isEdit = true;
}
});
}
}, },
// //
formTableDel(id,type) { formTableDel(id,type) {