204 lines
8.1 KiB
Vue
204 lines
8.1 KiB
Vue
|
<template>
|
|||
|
<div class="app-container">
|
|||
|
<el-form
|
|||
|
ref="form"
|
|||
|
:model="infoForm"
|
|||
|
:rules="rules"
|
|||
|
label-width="110px"
|
|||
|
style="width: 800px"
|
|||
|
>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故案号">
|
|||
|
<el-input v-model="infoForm.incidentNumber" autocomplete="off" />
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故名称">
|
|||
|
<el-input v-model="infoForm.incidentName" autocomplete="off" />
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故类型">
|
|||
|
<el-select v-model="infoForm.hiddenPartList" placeholder="请选择">
|
|||
|
<el-option
|
|||
|
v-for="item in hiddenPartList"
|
|||
|
:key="item.id"
|
|||
|
:label="item.type"
|
|||
|
:value="item.id"/>
|
|||
|
</el-select>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故级别">
|
|||
|
<el-select v-model="infoForm.incidentLevels" placeholder="请选择">
|
|||
|
<el-option
|
|||
|
v-for="item in incidentLevels"
|
|||
|
:key="item.id"
|
|||
|
:label="item.type"
|
|||
|
:value="item.id"/>
|
|||
|
</el-select>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故发生地点">
|
|||
|
<el-input v-model="infoForm.location" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故发生时间">
|
|||
|
<el-date-picker
|
|||
|
v-model="infoForm.incidentDate"
|
|||
|
type="date"
|
|||
|
placeholder="选择日期"
|
|||
|
style="width: 100%;"
|
|||
|
format="yyyy 年 MM 月 dd 日"
|
|||
|
value-format="yyyy-MM-dd HH:mm:ss"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="直接经济损失">
|
|||
|
<el-input v-model="infoForm.directLoss" type="number" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="受伤人数">
|
|||
|
<el-input v-model="infoForm.injured" type="number" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="死亡人数">
|
|||
|
<el-input v-model="infoForm.fatalities" type="number" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="重伤人数">
|
|||
|
<el-input v-model="infoForm.seriouslyInjured" type="number" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故起因">
|
|||
|
<el-input v-model="infoForm.cause" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故概述">
|
|||
|
<el-input v-model="infoForm.summary" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="事故照片">
|
|||
|
<!-- <el-upload
|
|||
|
:limit="1"
|
|||
|
:multiple="false"
|
|||
|
action=""
|
|||
|
list-type="picture-card"
|
|||
|
>
|
|||
|
<el-button size="small" type="primary">点击上传</el-button>
|
|||
|
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
|
|||
|
</el-upload> -->
|
|||
|
<el-upload
|
|||
|
ref="upload"
|
|||
|
:file-list="photos"
|
|||
|
:multiple="false"
|
|||
|
:limit="1"
|
|||
|
:on-remove="handleRemovePicture"
|
|||
|
:on-change="handleChangeIMG"
|
|||
|
:on-preview="handlePictureCardPreview"
|
|||
|
:before-upload="beforeHiddenUpload"
|
|||
|
:auto-upload="false"
|
|||
|
class="avatar-uploader"
|
|||
|
action="#"
|
|||
|
accept=".jpg,.jpeg,.png"
|
|||
|
list-type="picture-card">
|
|||
|
<i class="el-icon-plus" />
|
|||
|
</el-upload>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="原因分析及责任认定">
|
|||
|
<el-input v-model="infoForm.analysis" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="考核建议">
|
|||
|
<el-input v-model="infoForm.suggestions" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="整改措施">
|
|||
|
<el-input v-model="infoForm.measures" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="填表人">
|
|||
|
<el-input v-model="infoForm.creator" autocomplete="off"/>
|
|||
|
</el-form-item>
|
|||
|
<el-form-item :label-width="formLabelWidth" label="报出日期">
|
|||
|
<el-date-picker
|
|||
|
v-model="infoForm.reportDate"
|
|||
|
type="date"
|
|||
|
placeholder="选择日期"
|
|||
|
style="width: 100%;"
|
|||
|
format="yyyy 年 MM 月 dd 日"
|
|||
|
value-format="yyyy-MM-dd HH:mm:ss"/>
|
|||
|
</el-form-item>
|
|||
|
</el-form>
|
|||
|
|
|||
|
<div class="ui-height" />
|
|||
|
<div class="ui-foot">
|
|||
|
<el-button
|
|||
|
type="primary"
|
|||
|
icon="el-icon-arrow-left"
|
|||
|
plain
|
|||
|
@click="goBack">返回</el-button>
|
|||
|
<el-button type="primary" @click="confirm">确 定</el-button>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
infoForm: {
|
|||
|
id: '', // 主键ID
|
|||
|
incidentNumber: '', // 事故案号
|
|||
|
incidentName: '', // 事故名称
|
|||
|
incidentType: null, // 事故类型
|
|||
|
companyName: '', // 所属公司
|
|||
|
incidentLevel: '', // 事故级别
|
|||
|
incidentNature: '', // 事故性质
|
|||
|
location: '', // 事故发生地点
|
|||
|
incidentDate: null, // 事故发生时间
|
|||
|
directLoss: '', // 直接经济损失(万元)
|
|||
|
injured: null, // 受伤人数
|
|||
|
fatalities: null, // 死亡人数
|
|||
|
seriouslyInjured: null, // 重伤人数
|
|||
|
cause: '', // 事故起因
|
|||
|
summary: '', // 事故概述
|
|||
|
photos: [], // 事故照片
|
|||
|
analysis: '', // 原因分析及责任认定
|
|||
|
suggestions: '', // 考核建议
|
|||
|
measures: '', // 整改措施
|
|||
|
creator: '', // 填表人
|
|||
|
reportDate: null // 报出日期
|
|||
|
},
|
|||
|
formLabelWidth: '140px',
|
|||
|
hiddenPartList: [], // 事故类型字典
|
|||
|
incidentLevels: [], // 事故等级字典
|
|||
|
rules: {
|
|||
|
incidentNumber: [{ required: true, message: '事故案号不能为空', trigger: 'blur' }],
|
|||
|
incidentName: [{ required: true, message: '事故名称不能为空', trigger: 'blur' }],
|
|||
|
HIDDENTYPE: [{ required: true, message: '事故类型不能为空', trigger: 'blur' }],
|
|||
|
incidentType: [{ required: true, message: '隐患类型不能为空', trigger: 'blur' }],
|
|||
|
incidentLevel: [{ required: true, message: '事故级别不能为空', trigger: 'blur' }],
|
|||
|
incidentNature: [{ required: true, message: '事故性质不能为空', trigger: 'blur' }],
|
|||
|
location: [{ required: true, message: '事故发生地点不能为空', trigger: 'blur' }],
|
|||
|
incidentDate: [{ required: true, message: '事故发生时间不能为空', trigger: 'blur' }],
|
|||
|
directLoss: [{ required: true, message: '直接经济损失(万元)不能为空', trigger: 'blur' }],
|
|||
|
injured: [{ required: true, message: '受伤人数不能为空', trigger: 'blur' }],
|
|||
|
seriouslyInjured: [{ required: true, message: '隐患类型不能为空', trigger: 'blur' }],
|
|||
|
cause: [{ required: true, message: '事故起因不能为空', trigger: 'blur' }],
|
|||
|
summary: [{ required: true, message: '事故概述不能为空', trigger: 'blur' }],
|
|||
|
photos: [{ required: true, message: '事故照片不能为空', trigger: 'blur' }],
|
|||
|
analysis: [{ required: true, message: '原因分析及责任认定不能为空', trigger: 'blur' }],
|
|||
|
suggestions: [{ required: true, message: '考核建议不能为空', trigger: 'blur' }],
|
|||
|
measures: [{ required: true, message: '整改措施不能为空', trigger: 'blur' }],
|
|||
|
creator: [{ required: true, message: '填表人不能为空', trigger: 'blur' }],
|
|||
|
reportDate: [{ required: true, message: '报出日期不能为空', trigger: 'blur' }]
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
|
|||
|
methods: {
|
|||
|
handleRemovePicture() {},
|
|||
|
|
|||
|
handleChangeIMG() {},
|
|||
|
|
|||
|
handlePictureCardPreview() {},
|
|||
|
|
|||
|
beforeHiddenUpload() {},
|
|||
|
/**
|
|||
|
* 返回到列表页面
|
|||
|
*/
|
|||
|
goBack() {
|
|||
|
this.$parent.activeName = 'List'
|
|||
|
},
|
|||
|
|
|||
|
/**
|
|||
|
* 表单确认按钮
|
|||
|
*/
|
|||
|
confirm() {}
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style scoped lang="scss"></style>
|