209 lines
6.1 KiB
Vue
209 lines
6.1 KiB
Vue
<template>
|
|
<el-container>
|
|
<el-header>
|
|
<div class="left-panel">
|
|
<el-button type="primary" icon="el-icon-plus" @click="tableAdd" v-auth="'qct.create'"></el-button>
|
|
</div>
|
|
<div class="right-panel">
|
|
<el-input v-model="query.search" placeholder="检验表名称" clearable @keyup.enter="handleQuery"></el-input>
|
|
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<scTable ref="table" :apiObj="apiObj" row-key="id">
|
|
<el-table-column type="selection" width="50"></el-table-column>
|
|
<el-table-column label="#" type="index" width="50"></el-table-column>
|
|
<el-table-column label="名称" prop="name"></el-table-column>
|
|
<el-table-column label="编号" prop="number"></el-table-column>
|
|
<el-table-column label="检测类型" prop="description" min-width="150">
|
|
<template #default="scope">
|
|
<span v-for="(item,index) in scope.row.tags" :key="item">{{ tags_[item] }} <span v-if="index < scope.row.tags.length - 1">、</span></span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" fixed="right" align="center" width="150">
|
|
<template #default="scope">
|
|
<el-button link size="small" @click="tableDetail(scope.row)" v-auth="'qct.update'" type="primary">详情</el-button>
|
|
<el-divider direction="vertical"></el-divider>
|
|
<el-button link size="small" @click="tableEdit(scope.row)" v-auth="'qct.update'" type="primary">编辑</el-button>
|
|
<el-divider direction="vertical"></el-divider>
|
|
<el-popconfirm title="确定删除吗？" @confirm="tableDel(scope.row, scope.$index)">
|
|
<template #reference>
|
|
<el-button link size="small" v-auth="'role.delete'" type="danger">删除</el-button>
|
|
</template>
|
|
</el-popconfirm>
|
|
</template>
|
|
</el-table-column>
|
|
</scTable>
|
|
</el-main>
|
|
<el-dialog :title="titleMap[type]" v-model="limitedVisible" @close="dialogClose" :width="600">
|
|
<el-form :model="form" :rules="rules" ref="form" autocomplete ="off" label-width="120px" label-position="right">
|
|
<el-form-item label="名称" prop="name">
|
|
<el-input v-model="form.name" clearable></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="编号 " prop="number">
|
|
<el-input v-model="form.number" clearable></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="最大不合格率">
|
|
<el-input-number
|
|
v-model="form.max_defect_rate"
|
|
class="width-100"
|
|
:max="1"
|
|
placeholder="大于这个值时，整个抽检层不合格"
|
|
step="0.1"/>
|
|
</el-form-item>
|
|
<el-form-item label="检验类型">
|
|
<el-checkbox-group v-model="form.tags">
|
|
<el-checkbox
|
|
v-for="item in tagsOptions"
|
|
:key="item.value"
|
|
:label="item.name"
|
|
:value="item.value"/>
|
|
</el-checkbox-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button @click="limitedVisible=false" >取 消</el-button>
|
|
<el-button v-if="type!=='show'" type="primary" :loading="isSaving" @click="submitHandle()">保 存</el-button>
|
|
</template>
|
|
</el-dialog>
|
|
<record-dialog
|
|
ref="showDrawer"
|
|
v-if="visibleDrawer"
|
|
:qctId="qctId"
|
|
@closed="visibleDrawer = false"
|
|
>
|
|
</record-dialog>
|
|
</el-container>
|
|
</template>
|
|
<script>
|
|
import recordDialog from "./qctDetail.vue";
|
|
const defaultForm = {
|
|
id:"",
|
|
name: "",
|
|
number: "",
|
|
tags:[],
|
|
};
|
|
export default {
|
|
name: 'qct',
|
|
components: {
|
|
recordDialog,
|
|
},
|
|
data() {
|
|
return {
|
|
apiObj:this.$API.qm.qct.list,
|
|
query: {search:''},
|
|
isSaving: false,
|
|
showDrawer: false,
|
|
limitedVisible: false,
|
|
visibleDrawer: false,
|
|
type: "add",
|
|
titleMap: {
|
|
add: '新增',
|
|
edit: '编辑',
|
|
show: '查看'
|
|
},
|
|
qctId:'',
|
|
//表单数据
|
|
form: defaultForm,
|
|
//验证规则
|
|
rules: {
|
|
name: [
|
|
{required: true, message: '请输入名称'}
|
|
],
|
|
number: [
|
|
{required: true, message: '请输入编号'}
|
|
],
|
|
},
|
|
tagsOptions: [
|
|
{value:"process",name:"过程检验"},
|
|
{value:"inm",name:"库存检验"},
|
|
{value:"fix",name:"返修检验"},
|
|
],
|
|
tags_:{
|
|
"process":"过程检验",
|
|
"inm":"库存检验",
|
|
"fix":"返修检验",
|
|
},
|
|
}
|
|
},
|
|
mounted() {},
|
|
methods: {
|
|
//添加检验表
|
|
tableAdd(){
|
|
this.limitedVisible = true;
|
|
this.type = "add";
|
|
this.form.id="";
|
|
this.form.name="";
|
|
this.form.number="";
|
|
this.form.max_defect_rate=0;
|
|
this.form.tags=[];
|
|
},
|
|
//编辑
|
|
tableEdit(row){
|
|
this.type='edit';
|
|
this.form.id=row.id;
|
|
this.form.name=row.name;
|
|
this.form.number=row.number;
|
|
this.form.tags=row.tags;
|
|
this.form.max_defect_rate=row.max_defect_rate;
|
|
this.limitedVisible = true;
|
|
},
|
|
//查看
|
|
tableDetail(row) {
|
|
this.$TOOL.data.set('qctCurrent',row);
|
|
this.type = row.type;
|
|
this.qctId = row.id;
|
|
this.visibleDrawer = true;
|
|
this.$nextTick(() => {
|
|
this.$refs.showDrawer.open();
|
|
});
|
|
},
|
|
//提交
|
|
submitHandle(){
|
|
let that = this;
|
|
that.$refs.form.validate( (valid) => {
|
|
if (valid) {
|
|
that.isSaving = true;
|
|
if(that.type==='add'){
|
|
that.$API.qm.qct.create.req(that.form).then(res=>{
|
|
that.isSaving = false;
|
|
that.limitedVisible = false;
|
|
that.$refs.table.refresh();
|
|
}).catch(e=>{that.isSaving = false;})
|
|
}else{
|
|
that.$API.qm.qct.update.req(that.form.id,that.form).then(res=>{
|
|
that.isSaving = false;
|
|
that.limitedVisible = false;
|
|
that.$refs.table.refresh();
|
|
}).catch(e=>{that.isSaving = false;})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
//删除检验表
|
|
async tableDel(row){
|
|
var id = row.id;
|
|
var res = await this.$API.qm.qct.delete.req(id);
|
|
if(res.err_msg){
|
|
this.$message.error(res.err_msg)
|
|
}else{
|
|
this.$refs.table.refresh();
|
|
this.$message.success("删除成功")
|
|
}
|
|
},
|
|
//搜索
|
|
handleQuery(){
|
|
this.$refs.table.queryData(this.query)
|
|
},
|
|
dialogClose(){
|
|
this.isSaving = false;
|
|
this.limitedVisible = false;
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.treeMain {width: 100%;height:280px;overflow: auto;border: 1px solid #dcdfe6;margin-bottom: 10px;}
|
|
</style>
|