<template>
|
<div class="app-container">
|
<div class="search">
|
<span></span>
|
<div class="btn">
|
<el-button type="primary" size="small" @click="openAdd" v-if="planState != 1">新增</el-button>
|
<el-button type="primary" size="small" @click="isEdit = true" v-if="planState != 1">编辑</el-button>
|
<el-button type="primary" size="small" @click="save" :loading="saveLoading" v-if="planState != 1">保存</el-button>
|
<el-button size="small" @click="goback">返回</el-button>
|
</div>
|
</div>
|
<el-table :data="tableData" style="width: 100%">
|
<el-table-column prop="date" label="检测项" width="180">
|
</el-table-column>
|
<el-table-column prop="name" label="测试标准" width="180">
|
<template slot-scope="scope">
|
<el-select v-model="scope.row.name" placeholder="请选择" v-if="isEdit" size="small">
|
<el-option v-for="item in standardList" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
<span v-else>{{ scope.row.name }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="address" label="频次">
|
<template slot-scope="scope">
|
<el-select v-model="scope.row.name" placeholder="请选择" v-if="isEdit" size="small">
|
<el-option v-for="item in dict.type.planned_frequency" :key="item.value" :label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
<span v-else>{{ scope.row.name }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="address" label="备注">
|
<template slot-scope="scope">
|
<el-input size="small" placeholder="请输入" v-model="scope.row.address" v-if="isEdit">
|
</el-input>
|
<span v-else>{{ scope.row.address }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column fixed="right" label="操作" width="100" v-if="planState != 1">
|
<template slot-scope="scope">
|
<el-button type="text" size="small" @click="handleDelete(scope.row)" style="color: red;">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-dialog title="新增" :visible.sync="addDia" width="500px">
|
<el-form :model="addForm" ref="addForm" :rules="addRules" label-position="right" label-width="120px">
|
<el-form-item label="检验项" prop="name">
|
<el-select v-model="addForm.name" placeholder="请选择" size="small" style="width: 100%;">
|
<el-option v-for="item in itemList" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="测试标准" prop="number">
|
<el-select v-model="addForm.name" placeholder="请选择" size="small" style="width: 100%;">
|
<el-option v-for="item in standardList" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="频次" prop="number">
|
<el-select v-model="addForm.name" placeholder="请选择" size="small" style="width: 100%;">
|
<el-option v-for="item in dict.type.planned_frequency" :key="item.value" :label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="备注" prop="number">
|
<el-input size="small" placeholder="请输入" v-model="addForm.address">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="addDia = false">取 消</el-button>
|
<el-button type="primary" @click="submitProduct('addForm')">确 认</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
dicts: ["planned_frequency"],
|
data() {
|
return {
|
tableData: [
|
{}
|
],
|
isEdit: false,
|
standardList: [],//标准列表
|
saveLoading: false,
|
addForm: {},
|
addRules: {
|
name: [{ required: true, message: "请输入检验项", trigger: "blur" }],
|
},
|
addDia: false,
|
itemList: [],//检验项列表
|
planId: null,//主计划表id
|
planType: null,//主计划表类型
|
planState: null,//主计划表审核状态
|
}
|
},
|
mounted() {
|
const { id, type, state } = this.$route.query
|
this.planId = id;
|
this.planType = type;
|
this.planState = state
|
},
|
methods: {
|
// 删除
|
handleDelete(row) { },
|
// 保存
|
save() {
|
this.saveLoading = true;
|
this.isEdit = false
|
},
|
goback() {
|
this.$tab.closePage();
|
},
|
openAdd() {
|
this.addForm = {}
|
this.addDia = true;
|
},
|
submitProduct() { }
|
}
|
}
|
</script>
|
|
<style scoped>
|
.search {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 16px;
|
}
|
</style>
|
