<template>
|
<div class="add_commision">
|
<div class="content-main">
|
<div class="firstBox">
|
<div class="title">委托信息</div>
|
<div class="tableBox">
|
<div class="tableBox-header">
|
<el-button class="split" @click="dialogueFormVisible = true" type="primary" size="small"
|
style="background-color: rgb(1, 102, 226);">添加样品</el-button>
|
<!-- <el-input
|
v-model="searchData"
|
class="input-form split"
|
placeholder="扫描二维码录入样品..."
|
prefix-icon="el-icon-search"
|
style="width: 200px;"
|
>
|
</el-input>-->
|
<el-button type="primary" size="small" style="background-color: rgb(1, 102, 226);">重置</el-button>
|
</div>
|
<el-table ref="detectionInfo" :max-height="800" :cell-style="{textAlign: 'center'}"
|
:header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
|
:data="detectionInfo" style="width: 100%;margin-bottom: 20px;">
|
<el-table-column type="index" label="序号" min-width="10%" />
|
<el-table-column prop="sampleNumber" label="样品编号" min-width="8%" />
|
<el-table-column prop="sampleName" label="样品名称" min-width="10%" />
|
<el-table-column prop="specificationsModels" label="规格型号" min-width="10%" />
|
<el-table-column prop="unit" label="单位" min-width="8%" />
|
<el-table-column prop="samplesNumber" label="数量" min-width="8%" />
|
<el-table-column prop="addway" label="添加方式" min-width="8%">
|
<template slot-scope="scope">
|
<div v-if="scope.row.addway === 0">
|
<el-tag type="success" disable-transitions>扫描</el-tag>
|
</div>
|
<div v-if="scope.row.addway === 1">
|
<el-tag type="primary" disable-transitions>录入</el-tag>
|
</div>
|
<div v-else></div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="remarks" label="备注" min-width="8%" />
|
<el-table-column label="操作" min-width="8%">
|
<template slot-scope="scope">
|
<el-button type="text" size="small">修改</el-button>
|
<el-button type="text" size="small" @click="deleteRow(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="secondBox">
|
<el-row class="header">
|
<el-col :span="12" style="font-size: 16px;margin-bottom: 5px;">基本信息</el-col>
|
<el-col :span="12" style="text-align: right;">
|
</el-col>
|
</el-row>
|
<el-form :model="infoForm" ref="infoForm" class="infoForm" label-position="right" label-width="100px"
|
size="mini">
|
<div class="formwrapper">
|
<el-row :gutter="200">
|
<el-col :span="5">
|
<el-form-item label="委托编号：">
|
<el-input style="width: 200px" type="text" :value="infoForm.commisioncode" readonly disabled
|
autocomplete="off" size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="委托单位：">
|
<el-input style="width: 200px" v-model="infoForm.department" placeholder="请输入委托单位" size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="联系人：">
|
<el-input style="width: 200px" v-model="infoForm.contacter" placeholder="请输入委托单位" size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="联系电话：">
|
<el-input style="width: 200px" v-model="infoForm.tel" placeholder="请输入联系电话" size="small" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="200">
|
<el-col :span="5">
|
<el-form-item label="联系地址：">
|
<el-input style="width: 200px;" v-model="infoForm.address" placeholder="请输入联系地址" autocomplete="off"
|
size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="完成期限：">
|
<el-date-picker v-model="infoForm.deadline" type="date" placeholder="选择日期" style="width: 200px;"
|
size="small">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="送样时间：">
|
<el-date-picker v-model="infoForm.time" type="date" placeholder="选择日期" style="width: 200px;">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="送样方式：">
|
<el-select style="width: 200px;" v-model="infoForm.way" size="small" placeholder="送样">
|
<el-option v-for="options in sampleDeliveryMode" :key="options.key"
|
:value="options.value">{{ options.value }}</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="200">
|
<el-col :span="5">
|
<el-form-item label="送样人：">
|
<el-input style="width: 200px;" v-model="infoForm.sender" placeholder="请输入送样人" autocomplete="off"
|
size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="送样人电话：">
|
<el-input style="width: 200px;" v-model="infoForm.sendertel" placeholder="请输入送样人电话"
|
autocomplete="off" size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="报告数：">
|
<el-input style="width: 200px;" v-model="infoForm.num" placeholder="请输入报告数" autocomplete="off"
|
size="small" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="5">
|
<el-form-item label="委托备注：">
|
<el-input style="width: 200px;" v-model="infoForm.other" placeholder="备注" autocomplete="off"
|
size="small" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div class="submitBtn">
|
<el-button type="primary" size="small" @click="submitInspection"
|
style="background-color: rgb(1, 102, 226);">提交</el-button>
|
<!-- 点击返回，当前页面值为false -->
|
<el-button type="primary" size="mini" style="background-color: rgb(1, 102, 226); ">打印委托单</el-button>
|
</div>
|
</el-form>
|
</div>
|
</div>
|
<div class="checkType">
|
<el-dialog title="添加样品" :visible.sync="dialogueFormVisible" width="40%" top="30vh">
|
<el-form :model="addPointerForm" ref="addPointerForm" class="addPointerForm" label-position="right"
|
label-width="100px" size="mini">
|
<el-row :gutter="50">
|
<el-col :span="11">
|
<el-form-item label="样品编号：">
|
<el-input v-model="addPointerForm.sampleNumber" size="small" disabled>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="11">
|
<el-form-item label="样品名称：">
|
<el-select v-model="addPointerForm.sampleName" size="small" placeholder="请选择样品名称"
|
@change="upMaterialName">
|
<el-option v-for="options in sampleoptions" :value="options.key" :label="options.value"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="50">
|
<el-col :span="11">
|
<el-form-item label="规格型号：">
|
<el-select v-model="addPointerForm.specificationsModels" size="small" placeholder="请先选择样品名称">
|
<el-option v-for="options in model_spe_options" :value="options.value"
|
:key="options.key">{{ options.value }}</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="11">
|
<el-form-item label="样品单位：">
|
<el-input type="text" v-model="addPointerForm.unit" placeholder="请输入单位" autocomplete="off" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="50">
|
<el-col :span="11">
|
<el-form-item label="样品数量：">
|
<el-input type="text" v-model="addPointerForm.samplesNumber" placeholder="请输入数量" autocomplete="off" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="11">
|
<el-form-item label="备注：">
|
<el-input type="text" v-model="addPointerForm.remarks" placeholder="请输入备注" autocomplete="off" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="50">
|
<el-col :span="10">
|
<el-form-item label="添加项目：">
|
<el-checkbox-group v-model="addPointerForm.experiment" style="display: flex; flex-direction: column;">
|
<el-checkbox v-for="expers in experList" :label="expers.label"
|
:key="expers.key">{{ expers.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button type="primary" @click="addInspection">添加</el-button>
|
<el-button @click="dialogueFormVisible = false">取 消</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import {
|
getSampleName,
|
getModelSpecification,
|
getlink,
|
addInspection,
|
isIfViewUUID
|
} from '@/api/inspection/commisioninspection'
|
export default {
|
data() {
|
return {
|
currentPage: 0,
|
searchData: '',
|
infoForm: {
|
commisioncode: '',
|
department: '',
|
contacter: '',
|
tel: '',
|
address: '',
|
deadline: '',
|
time: '',
|
way: '',
|
sender: '',
|
sendertel: '',
|
num: '',
|
other: ''
|
},
|
detectionInfo: [],
|
addPointerForm: {
|
sampleNumber: '',
|
sampleName: '',
|
specificationsModels: '',
|
unit: '',
|
samplesNumber: '',
|
remarks: '',
|
experiment: [],
|
addway: ''
|
},
|
experList: [{
|
key: '1',
|
label: '外观检查'
|
}, {
|
key: '2',
|
label: '动作电压试验'
|
}, {
|
key: '3',
|
label: '电阻管泄漏电流试验'
|
}, {
|
key: '4',
|
label: '绝缘部分交流耐压试验'
|
}],
|
sampleoptions: [{
|
key: '1',
|
value: '选项1'
|
}, {
|
key: '2',
|
value: '选项2'
|
}],
|
samplecodeoptions: [{
|
key: '1',
|
value: ''
|
}],
|
model_spe_options: [],
|
sampleDeliveryMode: [{
|
key: '1',
|
value: '送样'
|
}, {
|
key: '2',
|
value: '上门'
|
}],
|
dialogueFormVisible: false,
|
showDetail: false,
|
viewId: null
|
}
|
},
|
created() {
|
this.viewId = this.$route.params.viewId
|
this.$store.commit('settings/SAVE_LINK', this.viewId)
|
this.getlink(this.$route.params.viewId)
|
},
|
mounted() {
|
this.getSampleName()
|
},
|
methods: {
|
getlink(viewId) {
|
if (viewId == null) {
|
this.$message.error('当前链接不在有效期内,系统自动关闭')
|
this.$router.push('/404')
|
return
|
}
|
isIfViewUUID({
|
viewId
|
}).then(res => {
|
if (!res.data) {
|
this.$message.error('当前链接不在有效期内,系统自动关闭')
|
this.$router.push('/404')
|
}
|
})
|
},
|
async getSampleName() {
|
const res = await getSampleName()
|
this.sampleoptions = res.data.map((item) => {
|
return {
|
key: item.id.toString(),
|
value: item.name,
|
code: item.code
|
}
|
})
|
},
|
async getModelSpecification(val) {
|
const res = await getModelSpecification({
|
materialId: val
|
})
|
this.model_spe_options = res.data.map((item) => {
|
return {
|
key: item.specificationsId,
|
value: item.specificationsName
|
}
|
})
|
},
|
addInspection() {
|
let exper = this.addPointerForm.experiment[0]
|
this.addPointerForm.addway = 1
|
for (let i = 1; i < this.addPointerForm.experiment.length; i++) {
|
exper += ',' + this.addPointerForm.experiment[i]
|
}
|
// console.log(exper)
|
this.addPointerForm.experiment = exper
|
let tmp = this.addPointerForm
|
this.detectionInfo.push(tmp)
|
this.dialogueFormVisible = false
|
this.addPointerForm = {
|
sampleNumber: '',
|
sampleName: '',
|
specificationsModels: '',
|
unit: '',
|
samplesNumber: '',
|
remarks: '',
|
experiment: [],
|
addway: ''
|
}
|
},
|
async submitInspection() {
|
let sampledeliveryway
|
if (this.infoForm.way === '送样') {
|
sampledeliveryway = 1
|
} else {
|
sampledeliveryway = 2
|
}
|
const res = await addInspection({
|
completionDeadline: this.infoForm.deadline,
|
contactAddress: this.infoForm.address,
|
contactNumber: this.infoForm.tel,
|
contacts: this.infoForm.contacter,
|
entrustRemarks: this.infoForm.other,
|
entrusted: this.infoForm.department,
|
inspectionTime: this.infoForm.time,
|
linkDetectionList: this.detectionInfo,
|
reportNumber: parseInt(this.infoForm.num),
|
sampleDeliveryMode: sampledeliveryway,
|
sampleDeliveryPhone: this.infoForm.sendertel,
|
sampleSender: this.infoForm.sender
|
})
|
this.infoForm.commisioncode = res.data
|
if (res.data) {
|
this.$message({
|
message: '恭喜你!',
|
type: 'success'
|
})
|
// 跳转页面
|
this.$router.push('/inspectionManagement/commissionInspection')
|
this.showDetail = true
|
} else {
|
this.$message.error(res.message)
|
}
|
},
|
handleSizeChange(pageSize) {
|
this.pageParams.pageSize = pageSize
|
},
|
handleCurrentChange(pageNo) {
|
this.pageParams.pageNo = pageNo
|
},
|
deleteRow(row) {
|
|
},
|
upMaterialName(val) {
|
this.sampleoptions.forEach(a => {
|
if (a.key == val) {
|
this.addPointerForm.sampleNumber = a.code
|
}
|
})
|
this.getModelSpecification(val)
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.content-main {
|
padding: 20px 40px;
|
background-color: #f0f2f5;
|
width: 100%;
|
height: 100vh;
|
|
.firstBox {
|
.title {
|
padding: 15px 10px;
|
font-size: 18px;
|
background-color: #0166e2;
|
color: #fff;
|
border-radius: 4px;
|
margin-bottom: 20px;
|
}
|
|
.tableBox {
|
background-color: #fff;
|
padding: 0px 20px;
|
flex: 1;
|
background: #fff;
|
/* padding: 20px 20px 10px 20px; */
|
display: flex;
|
flex-direction: column;
|
|
.tableBox-header {
|
padding: 20px 0px;
|
|
.split {
|
margin-right: 15px;
|
}
|
}
|
|
.el-table {
|
flex: 1;
|
}
|
|
>div:nth-child(3) {
|
display: flex;
|
justify-content: end;
|
margin: 10px 0;
|
}
|
}
|
}
|
|
.secondBox {
|
|
.header {
|
display: flex;
|
justify-content: space-between;
|
padding: 10px 20px;
|
margin-top: 10px;
|
}
|
|
.submitBtn {
|
display: flex;
|
justify-content: end;
|
margin-right: 40px;
|
margin-top: 20px;
|
}
|
}
|
|
.infoForm {
|
background-color: #fff;
|
padding: 20px 50px;
|
|
.formwrapper {
|
margin: 20px 0px;
|
padding-left: 30px;
|
|
.el-row {
|
margin: 10px 0px;
|
}
|
}
|
}
|
}
|
</style>
|
