<template>
|
<div class="app-container">
|
<div class="filter-container">
|
<div class="basic_search">
|
<span>状态：</span>
|
<el-select v-model="listQuery.status" class="analyseUnit_input">
|
<el-option
|
v-for="item in statusList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
></el-option>
|
</el-select>
|
</div>
|
<el-button class="filter-item" style="margin-left: 10px;margin-top: 10px" type="primary" icon="el-icon-refresh" @click="refreshHandle">搜索</el-button>
|
<el-button class="filter-item" style="margin-left: 10px;margin-top: 10px" type="primary" icon="el-icon-plus" @click="showSafetyRiskSpace('','新增')">新增</el-button>
|
</div>
|
<div class="table_content">
|
<el-table
|
v-loading="listLoading"
|
:key="tableKey"
|
:data="safetyRiskSpaceData"
|
border
|
fit
|
highlight-current-row
|
style="width: 100%;"
|
>
|
<el-table-column label="描述信息" prop="descInfo" align="center">
|
</el-table-column>
|
<el-table-column label="安全风险空间分布图" prop="img" align="center">
|
<template slot-scope="scope">
|
<el-popover placement="top-start" trigger="click">
|
<!-- <a href="http://192.168.0.7:8100/upload/enterprise/20210327184751998.png" target="_blank" title="查看最大化图片"><img src="http://192.168.0.7:8100/upload/enterprise/20210327184751998.png" style="width: 300px;height: 300px" /></a>-->
|
<!-- <img slot="reference" src="http://192.168.0.7:8100/upload/enterprise/20210327184751998.png" style="width:40px;height:40px;margin-left:10px;cursor:pointer" ></img>-->
|
<!-- <a :href="scope.row.enterpriseResources.url" target="_blank" title="查看最大化图片"><img v-for="(item,index) in scope.row.enterpriseResources" :src="item.url" style="width: 300px;height: 300px" /></a>-->
|
<img slot="reference" :src="scope.row.img" style="width:40px;height:40px;margin-left:10px;cursor:pointer" @click="showImg(scope.row.img)"></img>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column label="创建人" prop="createUname" align="center">
|
</el-table-column>
|
<el-table-column label="创建时间" prop="createTime" align="center">
|
</el-table-column>
|
<el-table-column label="最后修改人" prop="editUname" align="center">
|
</el-table-column>
|
<el-table-column label="最后修改时间" prop="editTime" align="center">
|
</el-table-column>
|
<el-table-column label="操作" align="center" width="280" class-name="small-padding fixed-width">
|
<template slot-scope="scope">
|
<el-button type="text" @click="showSafetyRiskSpace(scope.row,'查看')">查看</el-button>
|
<el-button type="text" style="color: red" @click="deleteById(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<br>
|
</div>
|
<el-dialog :title="title" :visible.sync="safetyRiskSpaceVisible" :modal-append-to-body="false" :close-on-click-modal="false" width="600px">
|
<el-form ref="safetyRiskSpaceForm" :rules="safetyRiskSpaceFormRules" :model="safetyRiskSpaceForm" label-position="right" label-width="165px">
|
<el-form-item label="风险分布图" prop="img">
|
<el-upload
|
accept=".pdf,.jpg,.png"
|
:action="fileRoad"
|
class="upload-demo"
|
ref="upload"
|
:headers="header"
|
:data="uploadForm"
|
list-type="picture-card"
|
:file-list="fileList"
|
v-model="safetyRiskSpaceForm.img"
|
:on-change="handleChangeFile"
|
:on-success="onFileSuccess"
|
:multiple="false"
|
:auto-upload="true">
|
<i slot="default" class="el-icon-plus"></i>
|
<div slot="file" slot-scope="{file}">
|
<img
|
class="el-upload-list__item-thumbnail"
|
:src="file.url" alt=""
|
>
|
<span class="el-upload-list__item-actions">
|
<span
|
class="el-upload-list__item-preview"
|
@click="handleFile(file)"
|
>
|
<i class="el-icon-zoom-in"></i>
|
</span>
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemove(file,'one')"
|
>
|
<i class="el-icon-delete"></i>
|
</span>
|
</span>
|
</div>
|
</el-upload>
|
</el-form-item>
|
<el-form-item label="描述信息" prop="descInfo">
|
<el-input v-model="safetyRiskSpaceForm.descInfo" class="analyseUnit_input"></el-input>
|
</el-form-item>
|
</el-form>
|
<div align="right">
|
<el-button @click="safetyRiskSpaceVisible = false">取消</el-button>
|
<el-button type="primary" @click="submitSafetyRiskSpace()">确认</el-button>
|
</div>
|
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
|
<img width="100%" :src="dialogImageUrl" alt="">
|
</el-dialog>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { mapGetters } from 'vuex'
|
import { addSafetyRiskSpace , getSafetyRiskSpaceList , deleteSafetyRiskSpace } from '@/api/safetyRiskSpace'
|
import { getAllCompany } from "../../../../api/unitManage";
|
import {getAnalyseUnitList} from "../../../../api/riskLevelManage";
|
import Cookies from "js-cookie";
|
export default {
|
name: 'index',
|
filters: {
|
parseMain(type){
|
if(type === 1){
|
return "是"
|
}else if(type === 0){
|
return "否"
|
}
|
},
|
},
|
computed: {
|
...mapGetters([
|
'userType'
|
])
|
},
|
data() {
|
const validateImg = (rule, value, callback) => {
|
if (!this.safetyRiskSpaceForm.img) {
|
callback(new Error('请上传风险空间分布图'))
|
} else {
|
callback()
|
}
|
}
|
return {
|
fileRoad:process.env.BASE_API + '/task/web/upload',
|
uploadForm:{
|
},
|
header:{Authorization:''},
|
tableKey: 0,
|
safetyRiskSpaceData: [],
|
fileList:[],
|
companyList:[],
|
statusList:[{id:0,name:'有效'},{id:1,name:'删除'}],
|
listLoading: false,
|
title:'',
|
dialogImageUrl:false,
|
dialogVisible:false,
|
disabled: false,
|
safetyRiskSpaceVisible:false,
|
safetyRiskSpaceFormRules:{
|
img: [{ required: true, validator: validateImg, trigger: 'blur' }],
|
descInfo: [{ required: true, message: '描述信息不能为空', trigger: 'blur' }],
|
},
|
safetyRiskSpaceForm:{
|
createTime: null,
|
createUid: null,
|
createUname: null,
|
descInfo: null,
|
editTime: null,
|
editUid: null,
|
editUname: null,
|
eid: null,
|
id: null,
|
img: null,
|
status: null
|
},
|
listQuery:{
|
status:0,
|
},
|
}
|
},
|
created() {
|
this.getSafetyRiskSpaceData()
|
this.getCompany()
|
},
|
methods: {
|
async getSafetyRiskSpaceData(){
|
this.listLoading = true
|
let params = {}
|
params["status"] = this.listQuery.status
|
let res = await getSafetyRiskSpaceList(params)
|
if(res.data.code === '200'){
|
if(res.data.message === '未找到数据'){
|
this.safetyRiskSpaceData = []
|
this.$message({
|
type:'success',
|
message:'未找到数据',
|
})
|
}else{
|
this.safetyRiskSpaceData = res.data.result.map( item => {
|
item.img = process.env.IMG_API + item.img
|
return item
|
})
|
}
|
}else{
|
this.$message({
|
message:res.data.message,
|
type:'warning'
|
})
|
}
|
this.listLoading = false
|
},
|
async getCompany(){
|
let res = await getAllCompany()
|
if(res.data.code === '200'){
|
this.companyList = res.data.result
|
}else{
|
this.$message({
|
message:res.data.message,
|
type:'warning'
|
})
|
}
|
},
|
showSafetyRiskSpace(value,type){
|
this.safetyRiskSpaceVisible = true
|
this.$nextTick(() =>{
|
this.$refs["safetyRiskSpaceForm"].clearValidate()
|
})
|
if(type === '新增'){
|
this.title = '新增'
|
this.safetyRiskSpaceForm = {
|
createUid: parseInt(Cookies.get('userId')),
|
descInfo: null,
|
img: null,
|
}
|
this.fileList = []
|
}else{
|
this.title = '查看'
|
this.safetyRiskSpaceForm = value
|
this.fileList = []
|
this.fileList.push({url:value.img})
|
}
|
},
|
submitSafetyRiskSpace(){
|
this.$refs["safetyRiskSpaceForm"].validate((valid) =>{
|
if(valid){
|
addSafetyRiskSpace(this.safetyRiskSpaceForm).then((res)=>{
|
if(res.data.code === '200'){
|
this.safetyRiskSpaceVisible = false
|
this.getSafetyRiskSpaceData()
|
this.$notify({
|
type:'success',
|
duration:2000,
|
message:'新增成功',
|
title:'成功'
|
})
|
}else{
|
this.$message({
|
type:'warning',
|
message:res.data.message
|
})
|
}
|
})
|
}else{
|
this.$message({
|
message:'请完善基本信息',
|
type:'warning'
|
})
|
}
|
})
|
},
|
deleteById(val){
|
this.$confirm('删除此条信息，是否继续','提示',{
|
confirmButtonText:'确定',
|
cancelButtonText:'取消',
|
type:'warning',
|
}).then(()=> {
|
deleteSafetyRiskSpace(val.id).then( ()=>{
|
this.getSafetyRiskSpaceData()
|
this.$notify({
|
title:'成功',
|
message:'删除成功',
|
type:'success',
|
duration:2000,
|
})
|
})
|
})
|
},
|
refreshHandle(){
|
this.getSafetyRiskSpaceData()
|
},
|
handleChangeFile(){
|
this.header.Authorization = Cookies.get('token')
|
},
|
onFileSuccess(response){
|
if(response.code === '200'){
|
this.safetyRiskSpaceForm.img = response.result.path
|
this.fileList = []
|
this.fileList.push({url:process.env.IMG_API + response.result.path})
|
this.$notify({
|
type:'success',
|
duration:2000,
|
message:'上传成功',
|
title:'成功',
|
})
|
}else{
|
this.$message({
|
message:res.data.message,
|
type:'warning'
|
})
|
}
|
},
|
handleFile(file){
|
this.dialogImageUrl = file.url;
|
this.dialogVisible = true;
|
},
|
showImg(file){
|
window.open(file, '_blank')
|
},
|
handleRemove(file){
|
return this.$confirm(`确定移除 ${ file.name }？`,'提示',{
|
confirmButtonText:'确定',
|
cancelButtonText:'取消',
|
type:'warning',
|
}).then(()=> {
|
this.safetyRiskSpaceForm.img = null
|
this.fileList = []
|
})
|
},
|
}
|
}
|
</script>
|
<style scoped>
|
.basic_search{
|
display:inline-block;
|
padding-bottom: 10px;
|
}
|
.analyseUnit_input{
|
width:200px;
|
}
|
</style>
|
