Skip to content

G
gassafety-progress
Commit 20dce006 authored by zhangjianqian's avatar zhangjianqian
Browse files
Options

应急处置 修改上传 以及部分样式

parent 7febb60a
Show whitespace changes
Inline Side-by-side
Showing with 117 additions and 72 deletions
gassafetyprogress-web/src/views/system/eventInfo/index.vue
View file @ 20dce006
......@@ -155,7 +155,7 @@
/>
<!-- 添加或修改事件处置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<div class="division">
<div style="width: 45%">
......@@ -185,21 +185,7 @@
<el-form-item label="事件地点" prop="eventLocation">
<el-input v-model="form.eventLocation" placeholder="请输入事件地点" :disabled="readonly"/>
</el-form-item>
<el-form-item label="图片上传" prop="iconUrl">
<el-upload
:action="uploadImgUrl"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-success ="uploadsuccess"
:on-remove="handleRemove"
:file-list="fileList">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
<!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />-->
</el-form-item>
</div>
<div style="width: 50%">
<el-form-item label="所属企业" prop="beyondEnterpriseId">
......@@ -236,8 +222,27 @@
<el-form-item label="事件评估信息" prop="eventAssessment" style="width: 60%">
<el-input v-model="form.eventAssessment" type="textarea" placeholder="请输入事件评估信息" :disabled="readonly"/>
</el-form-item>
<el-form-item label="事件附件" prop="iconUrl" :style="display" >
<FileUpload
listType="picture"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList"
style="width: 70%"
/>
<el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
<!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />-->
</el-form-item>
<el-form-item label="事件附件" prop="iconUrl" :style="display1">
<span
class="dbtn"
@click="checkFile(form.iconUrl)"
v-if="form.iconUrl != ''"
>
<i class="el-icon el-icon-view"></i>查看/下载
</span>
<span v-else>-</span>
</el-form-item>
<!--<el-form-item label="所属企业名称" prop="beyondEnterpriseName">-->
<!--<el-input v-model="form.beyondEnterpriseName" placeholder="请输入所属企业名称" />-->
<!--</el-form-item>-->
......@@ -255,10 +260,12 @@
<script>
import { listEventInfo, getEventInfo, delEventInfo, addEventInfo, updateEventInfo, exportEventInfo ,enterpriseList} from "@/api/system/eventInfo";
import FileUpload from '@/components/FileUpload';
let uploadfile = require("@/assets/uploadfile.png");
export default {
name: "EventInfo",
components: {
FileUpload
},
data() {
return {
......@@ -284,10 +291,10 @@ export default {
enterpriseList:[],
// 弹出层标题
title: "",
display:"",
display1:"display:none",
// 是否显示弹出层
open: false,
dialogImageUrl: '',
dialogVisible: false,
fileList:[],
// 事件类型：1.泄漏 2.火灾 3.爆炸字典
eventTypeOptions: [],
......@@ -356,20 +363,20 @@ export default {
});
},
//上传
handleRemove(file, fileList) {
//console.log(file, fileList);
document.getElementsByClassName("el-upload")[0].style.display=""
getFileInfo(res){
//this.form.dealPlan = res.fileName;
this.form.iconUrl = res.url;
this.fileList.push({
name: res.fileName,
url: uploadfile,
});
},
uploadsuccess(response){
this.form.iconUrl=response.url;
console.log(document.getElementsByClassName("el-upload")[0])
this.$nextTick(()=>{
document.getElementsByClassName("el-upload")[0].style.display="none"
})
listRemove(e) {
this.form.dealPlan = "";
this.fileList = [];
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
checkFile(url) {
window.open(url,'_blank');
},
qiyechang(value){
let obj = {};
......@@ -440,9 +447,8 @@ export default {
this.reset();
this.open = true;
this.title = "添加事件处置";
this.$nextTick(()=>{
document.getElementsByClassName("el-upload")[0].style.display=""
})
this.display="";
this.display1="display:none";
},
handleDtail(row){
this.fileList = [];
......@@ -454,9 +460,10 @@ export default {
this.form = response.data;
this.title = "修改事件处置";
if(row.iconUrl!=null){
this.fileList = [{name: 'file', url: row.iconUrl}];
this.fileList = [{name: '附件', url: uploadfile}];
}
document.getElementsByClassName("el-upload")[0].style.display="none"
this.display="display:none";
this.display1="";
});
},
/** 修改按钮操作 */
......@@ -470,11 +477,10 @@ export default {
this.open = true;
this.title = "修改事件处置";
if(row.iconUrl!=null){
this.fileList = [{name: 'file', url: row.iconUrl}];
this.$nextTick(()=>{
document.getElementsByClassName("el-upload")[0].style.display="none"
})
this.fileList = [{name: '附件', url: uploadfile}];
}
this.display="";
this.display1="display:none";
});
},
/** 提交按钮 */
......@@ -535,6 +541,17 @@ export default {
flex-direction:row;
justify-content:flex-start;
}
.dbtn {
display: inline-block;
line-height: normal;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
border-radius: 3px;
border-style: solid;
border-width: 0;
color: rgb(48, 180, 107);
}
</style>
<style lang="scss" scoped>
::v-deep .el-select{
......
gassafetyprogress-web/src/views/system/planInfo/index.vue
View file @ 20dce006
......@@ -147,6 +147,7 @@
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<div class="division">
<div style="width: 40%;">
<div class="titletitle">预案基本信息</div>
<el-form-item label="预案标题" prop="planTitle" >
<el-input v-model="form.planTitle" placeholder="请输入预案标题" :disabled="readonly"/>
</el-form-item>
......@@ -187,31 +188,37 @@
<el-input v-model="form.remarks" placeholder="请输入备注" :disabled="readonly" />
</el-form-item>
<el-form-item label="预案附件" id="fujian" prop="iconUrl">
<el-upload
:action="uploadImgUrl"
list-type="picture-card"
:on-success ="uploadsuccess"
:on-remove="handleRemove"
:file-list="fileList">
<i class="el-icon-plus"></i>
<!--<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>-->
</el-upload>
<FileUpload
listType="picture"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList"
/>
<el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
<!--<el-dialog :visible.sync="dialogVisible">-->
<!--<img width="100%" :src="dialogImageUrl" alt="">-->
<!--</el-dialog>-->
</el-form-item>
<el-form-item label="预案附件" id="fujianxia" prop="iconUrl" style="display: none">
<a @click="downloadFile" style="color: blue">下载附件>></a>
<span
class="dbtn"
@click="checkFile(form.iconUrl)"
v-if="form.iconUrl != ''"
>
<i class="el-icon el-icon-view"></i>查看/下载
</span>
<span v-else>-</span>
<!--<el-input v-model="fileurl" placeholder="" />-->
</el-form-item>
</div>
<div style="width: 60%;">
<el-form-item label="应急方案" prop="planContents">
<div style="width: 58%;margin-left: 2%">
<div class="titletitle">方案内容</div>
<!--<el-form-item label="应急方案" prop="planContents">-->
<!--<el-input v-model="form.planContents" placeholder="" />-->
<editor v-model="form.planContents" style="height: 300px;" :readOnly="readonly"/>
<!--<textarea id="editorA" v-model="form.planContents" height="100%"></textarea>-->
</el-form-item>
<!--</el-form-item>-->
</div>
</div>
......@@ -235,14 +242,15 @@
<script>
import { listPlanInfo, getPlanInfo, delPlanInfo, addPlanInfo, updatePlanInfo, exportPlanInfo,enterpriseList } from "@/api/system/planInfo";
import Editor from '@/components/Editor';
import FileUpload from '@/components/FileUpload';
let uploadfile = require("@/assets/uploadfile.png");
export default {
name: "PlanInfo",
components: {
Editor
Editor,FileUpload
},
data() {
return {
uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
// 遮罩层
loading: true,
readonly: true,
......@@ -334,19 +342,21 @@ export default {
this.form.beyondEnterpriseName = obj.enterpriseName;
this.form.beyondEnterpriseId = value;
},
//上传图片
uploadsuccess(response){
this.form.iconUrl=response.url;
console.log(this.fileList)
//console.log(document.getElementsByClassName("el-upload--picture-card"))
document.getElementsByClassName("el-upload--picture-card")[0].style.display="none";
//上传
getFileInfo(res){
//this.form.dealPlan = res.fileName;
this.form.iconUrl = res.url;
this.fileList.push({
name: res.fileName,
url: uploadfile,
});
},
handleRemove(file, fileList) {
document.getElementsByClassName("el-upload--picture-card")[0].style.display="";
listRemove(e) {
this.form.dealPlan = "";
this.fileList = [];
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
checkFile(url) {
window.open(url,'_blank');
},
// 取消按钮
cancel() {
......@@ -434,7 +444,7 @@ export default {
this.form = response.data;
this.title = "应急预案详情";
this.fileList = [{name: 'file', url: row.iconUrl}];
this.fileList = [{name: 'file', url:uploadfile}];
this.fileurl = row.iconUrl;
document.getElementById("yesbutton").style.display="none" ;
document.getElementById("fujian").style.display="none"
......@@ -452,7 +462,7 @@ export default {
this.open = true;
this.title = "修改应急预案";
if(row.iconUrl!=null||row.iconUrl==""){
this.fileList = [{name: 'file', url: row.iconUrl}];
this.fileList = [{name: 'file', url:uploadfile}];
this.$nextTick(()=>{
document.getElementsByClassName("el-upload--picture-card")[0].style.display="none"
document.getElementById("yesbutton").style.display="" ;
......@@ -530,6 +540,24 @@ export default {
flex-direction:row;
justify-content:flex-start;
}
.dbtn {
display: inline-block;
line-height: normal;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
border-radius: 3px;
border-style: solid;
border-width: 0;
color: rgb(48, 180, 107);
}
.titletitle{
background: #1c84c6;
color: white;height:
20px;line-height:
20px;text-align: center;
margin-bottom: 10px;
}
</style>
<style lang="scss" scoped>
::v-deep .el-select{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment