<template>
|
<el-dialog
|
:visible.sync="dialogVisible"
|
append-to-body
|
:close-on-click-modal="false"
|
width="60%"
|
center
|
@close="reset()"
|
>
|
<div class="company-info">
|
<div>企业基本信息</div>
|
<div><span>企业名称：</span><span>{{enterpriseName}}</span></div>
|
<div>
|
<span>许可证：</span>
|
<span v-if="licenceValidStatus == 0">在有效期（有效期至：{{licenceValidDeadline}}）</span>
|
<span v-else>已过期</span>
|
</div>
|
<div><span>库存：</span><span>{{stockNum}}</span></div>
|
<div><span>库容：</span>
|
<span>
|
<el-input placeholder="请输入库容量" type="number" v-model="checkForm.storageCapacity"></el-input>
|
</span>
|
</div>
|
</div>
|
<el-divider/>
|
<div class="form-info">
|
<div>自查自改填报</div>
|
</div>
|
|
<el-form :model="checkForm" :rules="rules" ref="checkForm" label-width="150px" class="demo-ruleForm">
|
|
|
<el-form-item label="自查是否有隐患：" prop="hiddendangerStatus">
|
<el-radio-group v-model="checkForm.hiddendangerStatus">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<div class="risk-list" v-if="checkForm.hiddendangerStatus==1">
|
<table class="risk-table">
|
<th><span>序号</span><span>检查出的隐患问题</span><span>检查时间</span><span>最后整改期限</span><span>隐患等级</span><span>操作</span></th>
|
<tr v-for="(item,index) in checkForm.submitHiddendangers">
|
<td class="num">{{index + 1}}</td>
|
<td class="info"><el-input type="textarea" :rows="1" placeholder="请简述隐患问题" v-model="item.hiddendangerRemark"></el-input></td>
|
<td class="date"><el-date-picker v-model="item.checkTime" type="datetime" placeholder="选择检查时间" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker></td>
|
<td class="deadline"><el-date-picker v-model="item.rectifyDeadlineTime" type="datetime" placeholder="选择整改期限" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker></td>
|
<td class="level">
|
<el-radio-group v-model="item.hiddendangerLevel">
|
<el-radio :label="1">一般隐患</el-radio>
|
<el-radio :label="2">重大隐患</el-radio>
|
</el-radio-group>
|
</td>
|
<td class="edit">
|
<el-button type="text" @click="deleteItem(index)">删除</el-button>
|
</td>
|
</tr>
|
</table>
|
<div class="addBtn">
|
<el-button type="primary" plain icon="el-icon-plus" @click="addItem()">新增隐患问题</el-button>
|
</div>
|
</div>
|
<el-form-item label="填报人：" prop="selfcheckReportUserName">
|
<el-input v-model="checkForm.selfcheckReportUserName"></el-input>
|
</el-form-item>
|
|
<el-form-item label="电话号码：" prop="selfcheckReportUserMobile">
|
<el-input v-model="checkForm.selfcheckReportUserMobile"></el-input>
|
</el-form-item>
|
|
</el-form>
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button type="primary" @click="submitForm('checkForm')">提交</el-button>
|
</span>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {computePageCount} from "@/utils";
|
import { saveSelfCheckReport, getSelfBaseInfo } from '@/api/selfCheck'
|
export default {
|
name: "selfReport",
|
data(){
|
return{
|
dialogVisible: false,
|
id: null,
|
enterpriseName: '',
|
licenceValidStatus: 0,
|
licenceValidDeadline: '',
|
stockNum: 0,
|
checkForm:{
|
storageCapacity: null,
|
hiddendangerStatus: null,
|
submitHiddendangers: [
|
{
|
id: null,
|
hiddendangerRemark: '',
|
checkTime: '',
|
rectifyDeadlineTime: '',
|
hiddendangerLevel: null
|
}
|
],
|
selfcheckReportUserName: '',
|
selfcheckReportUserMobile: ''
|
},
|
rules: {
|
hiddendangerStatus: [
|
{ required: true, message: '请选择是否查出隐患', trigger: 'blur' }
|
],
|
selfcheckReportUserName: [{ required: true, message: '请输入填报人', trigger: 'blur' }],
|
selfcheckReportUserMobile: [{ required: true, message: '请输入电话号码', trigger: 'blur' }]
|
}
|
}
|
},
|
watch: {
|
},
|
created() {
|
console.log(this.id)
|
},
|
methods:{
|
addItem(){
|
const newItem = {
|
hiddendangerRemark: '',
|
checkTime: '',
|
rectifyDeadlineTime: '',
|
hiddendangerLevel: null
|
}
|
this.checkForm.submitHiddendangers.push(newItem)
|
},
|
deleteItem(i){
|
const t = this
|
if(t.checkForm.submitHiddendangers.length == 1){
|
t.$message({
|
type:'warning',
|
message: '检查的隐患信息不可为空'
|
})
|
}else{
|
t.checkForm.submitHiddendangers.splice(i,1)
|
}
|
},
|
|
async getReportInfo(){
|
const t = this
|
let res = await getSelfBaseInfo({id:t.id})
|
if(res.data.code === "200"){
|
t.enterpriseName = res.data.result.enterpriseName
|
t.licenceValidStatus = res.data.result.licenceValidStatus
|
t.licenceValidDeadline = res.data.result.licenceValidDeadline
|
t.stockNum = res.data.result.stockNum
|
}else{
|
t.$message({
|
type:'warning',
|
message:res.data.message
|
})
|
}
|
},
|
|
submitForm(formName){
|
const t = this
|
t.$refs[formName].validate(async (valid) => {
|
if(t.checkForm.hiddendangerStatus == 0){
|
t.checkForm.submitHiddendangers = []
|
}
|
|
if(valid){
|
if(t.checkForm.hiddendangerStatus == 1){
|
if(t.checkForm.submitHiddendangers.find((e) => e.hiddendangerRemark == '') || t.checkForm.submitHiddendangers.find((e) => e.checkTime == '') || t.checkForm.submitHiddendangers.find((e) => e.rectifyDeadlineTime == '') || t.checkForm.submitHiddendangers.find((e) => e.hiddendangerLevel == null)){
|
t.$message({
|
type:'warning',
|
message: '请完善检查的隐患信息'
|
})
|
return
|
}
|
}
|
if(t.checkForm.storageCapacity == null){
|
t.$message({
|
type:'warning',
|
message: '请输入库容信息'
|
})
|
return
|
}
|
t.checkForm.id = t.id
|
let res = await saveSelfCheckReport(t.checkForm)
|
if(res.data.code === "200"){
|
t.$message({
|
type:'success',
|
message: '提交成功！'
|
})
|
}else{
|
t.$message({
|
type:'warning',
|
message:res.data.message
|
})
|
}
|
t.dialogVisible = false
|
t.$parent.getUncheckList();
|
} else {
|
console.log('error submit!!');
|
return false;
|
}
|
})
|
},
|
reset(){
|
this.checkForm = {
|
storageCapacity: null,
|
hiddendangerStatus: null,
|
submitHiddendangers: [
|
{
|
id: null,
|
hiddendangerRemark: '',
|
checkTime: '',
|
rectifyDeadlineTime: '',
|
hiddendangerLevel: null
|
}
|
],
|
selfcheckReportUserName: '',
|
selfcheckReportUserMobile: ''
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.input-with-select .el-select {
|
width: 120px;
|
}
|
|
.el-date-editor.el-input{
|
width: 100%;
|
}
|
|
.el-divider__text{
|
background-color: #fafafa;
|
color: #034EA2;
|
}
|
|
.company-info{
|
margin-bottom: 20px;
|
&>div{
|
width: 100%;
|
margin-bottom: 10px;
|
padding-left: 15px;
|
span{
|
display: inline-block;
|
&:first-of-type{
|
width: 15%;
|
}
|
}
|
}
|
&>div:first-of-type{
|
font-size: 18px;
|
font-weight: bolder;
|
padding-left: 0;
|
}
|
}
|
.form-info{
|
font-size: 18px;
|
font-weight: bolder;
|
padding-left: 0;
|
}
|
.risk-list{
|
margin-bottom: 20px;
|
.risk-table{
|
width: 100%;
|
border-collapse: collapse;
|
border: 1px solid #ccc;
|
margin: 10px 0;
|
th{
|
width: 100%;
|
display: flex;
|
border-bottom: 1px solid #ccc;
|
align-items: center;
|
|
span{
|
height: 100%;
|
padding: 10px 0;
|
border-right: 1px solid #ccc;
|
box-sizing: border-box;
|
|
&:nth-of-type(1){
|
width: 5%;
|
border-left: none
|
}
|
&:nth-of-type(2){
|
width: 25%;
|
}
|
&:nth-of-type(3){
|
width: 20%;
|
}
|
&:nth-of-type(4){
|
width: 20%;
|
}
|
&:nth-of-type(5){
|
width: 20%;
|
}
|
&:nth-of-type(6){
|
width: 10%;
|
border-right: none;
|
}
|
}
|
}
|
tr{
|
width: 100%;
|
height: 44px;
|
line-height: 42px;
|
border-bottom: 1px solid #ccc;
|
|
&:last-of-type{
|
border-bottom: none;
|
}
|
|
td{
|
border-right: 1px solid #ccc;
|
display: inline-block;
|
height: 44px;
|
vertical-align: middle;
|
text-align: center;
|
line-height: 42px;
|
&:last-of-type{
|
border-right: none;
|
}
|
}
|
.num{
|
width: 5%
|
}
|
.info{
|
width: 25%;
|
|
::v-deep.el-textarea{
|
.el-textarea__inner{
|
min-height: 40px !important;
|
}
|
}
|
}
|
.date{
|
width: 20%;
|
}
|
.deadline{
|
width: 20%;
|
}
|
.level{
|
width: 20%;
|
|
.el-radio{
|
margin-right: 15px;
|
}
|
}
|
.edit{
|
width: 10%;
|
}
|
}
|
}
|
}
|
.addBtn{
|
display: flex;
|
justify-content: center;
|
}
|
</style>
|
