Skip to content

G
gassafety-progress
Commit 7617257a authored by wuqinghua's avatar wuqinghua
Browse files
Options

Merge remote-tracking branch 'origin/master' 

# Conflicts:
#	gassafetyprogress-web/src/views/regulation/device/index.vue
#	gassafetyprogress-web/src/views/regulation/gasuser/index.vue
parents 76b34c17 9c8ee7c5
Show whitespace changes
Inline Side-by-side
Showing with 3225 additions and 767 deletions
gassafetyprogress-admin/src/main/java/com/zehong/web/controller/operationMonitor/THiddenTroubleInfoController.java
View file @ 7617257a
...@@ -27,7 +27,7 @@ import com.zehong.common.core.page.TableDataInfo; ...@@ -27,7 +27,7 @@ import com.zehong.common.core.page.TableDataInfo;
* @date 2022-03-24 * @date 2022-03-24
*/ */
@RestController @RestController
@RequestMapping("/system/info") @RequestMapping("/system/hidden")
public class THiddenTroubleInfoController extends BaseController public class THiddenTroubleInfoController extends BaseController
{ {
@Autowired @Autowired
...@@ -36,7 +36,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -36,7 +36,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 查询燃气隐患列表 * 查询燃气隐患列表
*/ */
@PreAuthorize("@ss.hasPermi('system:info:list')") @PreAuthorize("@ss.hasPermi('system:hidden:list')")
@GetMapping("/list") @GetMapping("/list")
public TableDataInfo list(THiddenTroubleInfo tHiddenTroubleInfo) public TableDataInfo list(THiddenTroubleInfo tHiddenTroubleInfo)
{ {
...@@ -53,7 +53,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -53,7 +53,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 导出燃气隐患列表 * 导出燃气隐患列表
*/ */
@PreAuthorize("@ss.hasPermi('system:info:export')") @PreAuthorize("@ss.hasPermi('system:hidden:export')")
@Log(title = "燃气隐患", businessType = BusinessType.EXPORT) @Log(title = "燃气隐患", businessType = BusinessType.EXPORT)
@GetMapping("/export") @GetMapping("/export")
public AjaxResult export(THiddenTroubleInfo tHiddenTroubleInfo) public AjaxResult export(THiddenTroubleInfo tHiddenTroubleInfo)
...@@ -66,7 +66,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -66,7 +66,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 获取燃气隐患详细信息 * 获取燃气隐患详细信息
*/ */
@PreAuthorize("@ss.hasPermi('system:info:query')") @PreAuthorize("@ss.hasPermi('system:hidden:query')")
@GetMapping(value = "/{hiddenTroubleId}") @GetMapping(value = "/{hiddenTroubleId}")
public AjaxResult getInfo(@PathVariable("hiddenTroubleId") Long hiddenTroubleId) public AjaxResult getInfo(@PathVariable("hiddenTroubleId") Long hiddenTroubleId)
{ {
...@@ -76,7 +76,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -76,7 +76,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 新增燃气隐患 * 新增燃气隐患
*/ */
@PreAuthorize("@ss.hasPermi('system:info:add')") @PreAuthorize("@ss.hasPermi('system:hidden:add')")
@Log(title = "燃气隐患", businessType = BusinessType.INSERT) @Log(title = "燃气隐患", businessType = BusinessType.INSERT)
@PostMapping @PostMapping
public AjaxResult add(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo) public AjaxResult add(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo)
...@@ -87,7 +87,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -87,7 +87,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 修改燃气隐患 * 修改燃气隐患
*/ */
@PreAuthorize("@ss.hasPermi('system:info:edit')") @PreAuthorize("@ss.hasPermi('system:hidden:edit')")
@Log(title = "燃气隐患", businessType = BusinessType.UPDATE) @Log(title = "燃气隐患", businessType = BusinessType.UPDATE)
@PutMapping @PutMapping
public AjaxResult edit(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo) public AjaxResult edit(@RequestBody THiddenTroubleInfo tHiddenTroubleInfo)
...@@ -98,7 +98,7 @@ public class THiddenTroubleInfoController extends BaseController ...@@ -98,7 +98,7 @@ public class THiddenTroubleInfoController extends BaseController
/** /**
* 删除燃气隐患 * 删除燃气隐患
*/ */
@PreAuthorize("@ss.hasPermi('system:info:remove')") @PreAuthorize("@ss.hasPermi('system:hidden:remove')")
@Log(title = "燃气隐患", businessType = BusinessType.DELETE) @Log(title = "燃气隐患", businessType = BusinessType.DELETE)
@DeleteMapping("/{hiddenTroubleIds}") @DeleteMapping("/{hiddenTroubleIds}")
public AjaxResult remove(@PathVariable Long[] hiddenTroubleIds) public AjaxResult remove(@PathVariable Long[] hiddenTroubleIds)
......
gassafetyprogress-system/src/main/java/com/zehong/system/domain/TComplainDeal.java
View file @ 7617257a
...@@ -37,7 +37,7 @@ public class TComplainDeal extends BaseEntity ...@@ -37,7 +37,7 @@ public class TComplainDeal extends BaseEntity
@Excel(name = "转办记录") @Excel(name = "转办记录")
private String transferRecord; private String transferRecord;
@Excel(name = "反馈事件") @Excel(name = "反馈时间")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private Date dealTime; private Date dealTime;
/** 办理情况 */ /** 办理情况 */
......
gassafetyprogress-system/src/main/java/com/zehong/system/domain/THiddenTroubleInfo.java
View file @ 7617257a
...@@ -83,6 +83,17 @@ public class THiddenTroubleInfo extends BaseEntity ...@@ -83,6 +83,17 @@ public class THiddenTroubleInfo extends BaseEntity
@Excel(name = "备注") @Excel(name = "备注")
private String remarks; private String remarks;
/**上报人名称*/
private String reportPersonName;
public String getReportPersonName() {
return reportPersonName;
}
public void setReportPersonName(String reportPersonName) {
this.reportPersonName = reportPersonName;
}
public void setHiddenTroubleId(Long hiddenTroubleId) public void setHiddenTroubleId(Long hiddenTroubleId)
{ {
this.hiddenTroubleId = hiddenTroubleId; this.hiddenTroubleId = hiddenTroubleId;
......
gassafetyprogress-system/src/main/resources/mapper/system/THiddenTroubleInfoMapper.xml
View file @ 7617257a
...@@ -21,10 +21,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" ...@@ -21,10 +21,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
<result property="hiddenTroubleDealFinishTime" column="hidden_trouble_deal_finish_time" /> <result property="hiddenTroubleDealFinishTime" column="hidden_trouble_deal_finish_time" />
<result property="isDel" column="is_del" /> <result property="isDel" column="is_del" />
<result property="remarks" column="remarks" /> <result property="remarks" column="remarks" />
<result property="reportPersonName" column="report_person_name" />
</resultMap> </resultMap>
<sql id="selectTHiddenTroubleInfoVo"> <sql id="selectTHiddenTroubleInfoVo">
select hidden_trouble_id, work_id, hidden_trouble_name, hidden_trouble_level, hidden_trouble_type, longitude, latitude, picture_url, hidden_trouble_describe, report_time, (select u.user_name from sys_user u where u.user_id = report_person) AS report_person, hidden_trouble_deal_status, hidden_trouble_deal_condition, hidden_trouble_deal_finish_time, is_del, remarks from t_hidden_trouble_info select hidden_trouble_id, work_id, hidden_trouble_name, hidden_trouble_level, hidden_trouble_type, longitude, latitude, picture_url, hidden_trouble_describe, report_time, (select u.user_name from sys_user u where u.user_id = report_person) AS report_person_name, report_person, hidden_trouble_deal_status, hidden_trouble_deal_condition, hidden_trouble_deal_finish_time, is_del, remarks from t_hidden_trouble_info
</sql> </sql>
<select id="selectTHiddenTroubleInfoList" parameterType="THiddenTroubleInfo" resultMap="THiddenTroubleInfoResult"> <select id="selectTHiddenTroubleInfoList" parameterType="THiddenTroubleInfo" resultMap="THiddenTroubleInfoResult">
......
gassafetyprogress-web/src/api/operationMonitor/hiddenTrouble.js
View file @ 7617257a
...@@ -3,7 +3,7 @@ import request from '@/utils/request' ...@@ -3,7 +3,7 @@ import request from '@/utils/request'
// 查询燃气隐患列表 // 查询燃气隐患列表
export function listInfo(query) { export function listInfo(query) {
return request({ return request({
url: '/system/info/list', url: '/system/hidden/list',
method: 'get', method: 'get',
params: query params: query
}) })
...@@ -12,7 +12,7 @@ export function listInfo(query) { ...@@ -12,7 +12,7 @@ export function listInfo(query) {
// 查询燃气隐患 // 查询燃气隐患
export function hiddenTroubleList(query) { export function hiddenTroubleList(query) {
return request({ return request({
url: '/system/info/hiddenTroubleList', url: '/system/hidden/hiddenTroubleList',
method: 'get', method: 'get',
params: query params: query
}) })
...@@ -21,41 +21,41 @@ export function hiddenTroubleList(query) { ...@@ -21,41 +21,41 @@ export function hiddenTroubleList(query) {
// 查询燃气隐患详细 // 查询燃气隐患详细
export function getInfo(hiddenTroubleId) { export function getInfo(hiddenTroubleId) {
return request({ return request({
url: '/system/info/' + hiddenTroubleId, url: '/system/hidden/' + hiddenTroubleId,
method: 'get' method: 'get'
}) })
} }
// 新增燃气隐患 // 新增燃气隐患
export function addInfo(data) { export function addHiddenInfo(data) {
return request({ return request({
url: '/system/info', url: '/system/hidden',
method: 'post', method: 'post',
data: data data: data
}) })
} }
// 修改燃气隐患 // 修改燃气隐患
export function updateInfo(data) { export function updateHiddenInfo(data) {
return request({ return request({
url: '/system/info', url: '/system/hidden',
method: 'put', method: 'put',
data: data data: data
}) })
} }
// 删除燃气隐患 // 删除燃气隐患
export function delInfo(hiddenTroubleId) { export function delHiddenInfo(hiddenTroubleId) {
return request({ return request({
url: '/system/info/' + hiddenTroubleId, url: '/system/hidden/' + hiddenTroubleId,
method: 'delete' method: 'delete'
}) })
} }
// 导出燃气隐患 // 导出燃气隐患
export function exportInfo(query) { export function exportHiddenInfo(query) {
return request({ return request({
url: '/system/info/export', url: '/system/hidden/export',
method: 'get', method: 'get',
params: query params: query
}) })
......
gassafetyprogress-web/src/assets/iconfont/monitorData/iconfont.css
View file @ 7617257a
@font-face { @font-face {
font-family: "iconfont"; /* Project id 3276749 */ font-family: "iconfont"; /* Project id 3276749 */
src: url('iconfont.woff2?t=1648286292510') format('woff2'), src: url('iconfont.woff2?t=1648524577887') format('woff2'),
url('iconfont.woff?t=1648286292510') format('woff'), url('iconfont.woff?t=1648524577887') format('woff'),
url('iconfont.ttf?t=1648286292510') format('truetype'); url('iconfont.ttf?t=1648524577887') format('truetype');
} }
.iconfont { .iconfont {
...@@ -13,6 +13,14 @@ ...@@ -13,6 +13,14 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.icon-bingo:before {
content: "\e625";
}
.icon-x:before {
content: "\e600";
}
.icon-jt:before { .icon-jt:before {
content: "\e8f1"; content: "\e8f1";
} }
......
gassafetyprogress-web/src/assets/styles/all.scss
View file @ 7617257a
...@@ -56,8 +56,8 @@ ...@@ -56,8 +56,8 @@
.el-dialog:not(.is-fullscreen) { .el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important; margin-top: 6vh !important;
} }
.el-dialog__header{ .el-dialog__header {
border-bottom:1px solid #cccccc; border-bottom: 1px solid #cccccc;
} }
.bigwindow { .bigwindow {
// 全局表格样式 // 全局表格样式
...@@ -613,19 +613,17 @@ ...@@ -613,19 +613,17 @@
// overflow-y: none !important; // overflow-y: none !important;
} }
} }
// map里的label // map里的label
.amap-info { .amap-info {
position: fixed !important; position: fixed !important;
z-index: 999 !important; z-index: 999 !important;
} }
.amap-marker-label{ .amap-marker-label {
background-color: rgba(9, 18, 32, 0.6) !important; background-color: rgba(9, 18, 32, 0.6) !important;
color: #fff !important; color: #fff !important;
border:none !important; border: none !important;
padding:10px; padding: 10px;
} }
.left { .left {
.el-table__body-wrapper { .el-table__body-wrapper {
...@@ -668,12 +666,16 @@ ...@@ -668,12 +666,16 @@
padding: 0 2px !important; padding: 0 2px !important;
} }
//去除高德logo //去除高德logo
.amap-logo{ .amap-logo {
display: none; display: none;
opacity:0 !important; opacity: 0 !important;
} }
.amap-copyright { .amap-copyright {
opacity:0; opacity: 0;
}
.paddingnone {
padding: 0 !important;
} }
.zzz { .zzz {
......
gassafetyprogress-web/src/components/emergency/Timeline.vue
View file @ 7617257a
<template> <template>
<ul class="timeline-wrapper"> <ul class="timeline-wrapper">
<li class="timeline-item" >
<div class="timeline-box">
<div class="out-circle">
<div class="in-circle"></div>
</div>
<div class="long-line"></div>
</div>
<div class="timeline-content">
<div class="timeline-date el-form-div">
<div style="width: 180px">{{nowItem.createTime}}</div>
<div >事件发布</div>
</div>
<div class="timeline-title">{{ nowItem.eventName}}</div>
<div class="timeline-title">地址：{{ nowItem.address}}</div>
</div>
</li>
<li class="timeline-item" v-for="t in timelineList" :key="t.id"> <li class="timeline-item" v-for="t in timelineList" :key="t.id">
<div class="timeline-box"> <div class="timeline-box">
<div class="out-circle"> <div class="out-circle">
...@@ -8,7 +24,11 @@ ...@@ -8,7 +24,11 @@
<div class="long-line"></div> <div class="long-line"></div>
</div> </div>
<div class="timeline-content"> <div class="timeline-content">
<div class="timeline-date">{{t.createTime}}</div> <div class="timeline-date el-form-div">
<div style="width: 180px">{{t.createTime}}</div>
<div v-if="t.eventType==2">预案指引</div>
<div v-if="t.eventType==1">信息处置</div>
</div>
<div class="timeline-title">{{ t.management}}</div> <div class="timeline-title">{{ t.management}}</div>
<div class="timeline-desc"> <div class="timeline-desc">
<span <span
...@@ -36,8 +56,8 @@ ...@@ -36,8 +56,8 @@
default: () => { default: () => {
return [] return []
} }
} },
nowItem:{}
}, },
methods: { methods: {
checkFile(url) { checkFile(url) {
...@@ -53,7 +73,12 @@ ...@@ -53,7 +73,12 @@
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.el-form-div{
display:flex;
flex-direction:row;
justify-content:flex-start;
width: 100%;
}
/* 时间线 */ /* 时间线 */
.timeline-item { .timeline-item {
position: relative; position: relative;
......
gassafetyprogress-web/src/components/emergency/rightBar.vue
View file @ 7617257a
...@@ -21,35 +21,76 @@ ...@@ -21,35 +21,76 @@
v-if="(item.governmentRead==0&&userType==-2)||(item.companyRead==0&&userType!=-2)" class="massage"> (您有新消息)</span> v-if="(item.governmentRead==0&&userType==-2)||(item.companyRead==0&&userType!=-2)" class="massage"> (您有新消息)</span>
</div> </div>
<div v-if="item.status==4" style="width: 80%;margin-left: 5px;">已完结</div> <div v-if="item.status==4" style="width: 80%;margin-left: 5px;">已完结</div>
<div style="height:30px;color: red;cursor:pointer;" v-if="userType==-2" @click="handleDelete(item.id)">取消事件</div> <div style="height:30px;color: red;cursor:pointer;" v-if="userType==-2" @click="handleDelete(item.id)">关闭事件</div>
</div>
<div class="content-div el-form-div" style="margin-top: -5px;overflow:hidden;">
<div style="width: 65%; white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;">事件名称：{{item.eventName}}</div>
<div>事件分类：{{item.eventTypeName}}</div>
</div>
<div class="content-div el-form-div">
<div style="width: 65%">发生时间：{{item.inforTime}}</div>
<div>事件级别：{{item.eventGradeName}}</div>
</div> </div>
<div class="content-div" style="margin-top: -5px;">事件名称：{{item.eventName}}</div>
<div class="content-div">发生时间：{{item.inforTime}}</div>
<div class="content-div">事件地点：{{item.address}}</div> <div class="content-div">事件地点：{{item.address}}</div>
<div class="content-div">最新进展：</div>
<div class="el-form-div"> <div class="el-form-div">
<div v-if="item.status==1 && userType==-2" class="button-div" @click="assignTask(item)">任务指派</div> <div v-if="item.status==1 && userType==-2" class="button-div" @click="assignTask(item)">任务指派</div>
<div v-if="userType==-2" class="button-div" @click="showList(item.id)" >预案指引</div> <div v-if="userType==-2" class="button-div" @click="showList(item)" >预案指引</div>
<div v-if="item.status==3 && userType==-2" class="button-div" @click="endevent(item.id)">事件结案</div> <div v-if="item.status==3 && userType==-2" class="button-div" @click="endevent(item.id)">事件结案</div>
<div v-if="userType!=-2" class="button-div" @click="showList(item.id)">信息处置</div> <div v-if="userType!=-2" class="button-div" @click="showList(item)">信息处置</div>
<div class="button-div" @click="showDetail(item.id,item.eventName)">详情</div> <div class="button-div" @click="showDetail(item.id,item.eventName)">详情</div>
</div> </div>
</div> </div>
<div id = "detail" class="show-detail" style="display: none;margin-top: 15px;margin-bottom: 20px;position:fixed;right: 470px;width: 300px; <div id = "detail" class="show-detail" style="display: none;margin-top: 15px;margin-bottom: 20px;position:fixed;right: 470px;width: 300px;
background: #ffffff;top: 110px"> background: #ffffff;top: 110px;border-right:1px solid #99a9bf">
<div class="el-form-div" style="height: 30px;"> <div class="el-form-div" style="height: 30px;">
<div class="detail-title">{{detailTitle}}</div> <div class="detail-title">事件详情</div>
<div style="cursor: pointer;" @click="closeDetail()"> <div style="cursor: pointer;" @click="closeDetail()">
<img style="width: 20px;height: 20px;margin-top: 5px;" src="@/assets/mapImages/close.png" alt="" /> <img style="width: 20px;height: 20px;margin-top: 5px;" src="@/assets/mapImages/close.png" alt="" />
</div> </div>
</div> </div>
<timeline :timeline-list="handleList"></timeline> <timeline :timeline-list="handleList" :nowItem="nowItem"></timeline>
<div style="height: 40px;"> <div style="height: 40px;">
</div> </div>
</div> </div>
</div> </div>
<el-dialog :title="title" :visible.sync="open" width="900px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
<div class="el-form-div" style="width: 100%;margin-bottom: 20px;overflow-y:hidden;">
<div style="width: 140px;">
<div class="el-form-div" >
<div class="num-div" @click="switchForm(nowItem,$event)">1</div>
<div v-if="handleList.length>0" class="num-line"></div>
</div>
<div class="num-title">
事件发布
</div>
<div class="num-title">
{{dataTime}}
</div>
</div>
<div v-for="(item,index) in handleList" style="width: 140px;">
<div class="el-form-div" >
<div class="num-div" @click="switchForm(item,$event)">{{index+2}}</div>
<div v-if="index<handleList.length-1" class="num-line"></div>
</div>
<div v-if="item.eventType==1" class="num-title">
处置信息
</div>
<div v-if="item.eventType==2" class="num-title">
预案指引
</div>
<div class="num-title">
{{item.createTime}}
</div>
</div>
</div>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5" v-if="userType!=-2"> <el-col :span="1.5" v-if="userType!=-2">
<el-button <el-button
...@@ -70,83 +111,52 @@ ...@@ -70,83 +111,52 @@
>新增预案指引</el-button> >新增预案指引</el-button>
</el-col> </el-col>
</el-row> </el-row>
<el-table v-loading="loading" :data="handleList" > <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-table-column label="类型" align="center" prop="eventType" :formatter="getType" width="120px"/> <el-form-item label="事件名称" v-if="form.eventType==3">
<el-table-column label="处置信息/指导意见" align="center" prop="management" /> <el-input v-model="form.eventName" :readonly="readonly" />
<el-table-column label="处置附件/引导方案" align="center" prop="managementEvent" width="150px"> </el-form-item>
<template slot-scope="scope"> <el-form-item label="事件分类" v-if="form.eventType==3">
<el-input v-model="form.eventTypeName" :readonly="readonly"/>
</el-form-item>
<el-form-item label="事件等级" v-if="form.eventType==3">
<el-input v-model="form.eventGradeName" :readonly="readonly"/>
</el-form-item>
<el-form-item label="发生时间" v-if="form.eventType==3">
<el-input v-model="form.inforTime" :readonly="readonly"/>
</el-form-item>
<el-form-item label="发生地点" v-if="form.eventType==3">
<el-input v-model="form.address" :readonly="readonly"/>
</el-form-item>
<el-form-item label="处置信息" prop="management" v-if="form.eventType==1">
<el-input v-model="form.management" type="textarea" placeholder="请输入处置信息" />
</el-form-item>
<el-form-item label="指导意见" prop="management" v-if="form.eventType==2">
<el-input v-model="form.management" type="textarea" placeholder="请输入指导意见" />
</el-form-item>
<el-form-item label="预案附件" :style="display2" v-if="form.eventType==2">
<span <span
class="dbtn" class="dbtn"
@click="checkFile(scope.row.managementEvent)" @click="checkFile(form.managementEvent)"
v-if="scope.row.managementEvent != null && scope.row.managementEvent!=''" v-if="form.managementEvent != null && form.managementEvent!=''"
> >
<i class="el-icon el-icon-view"></i>查看/下载 <i class="el-icon el-icon-view"></i>查看/下载
</span> </span>
<span v-else>-</span> <span v-else>-</span>
</template>
</el-table-column>
<!--<el-table-column label="指导意见" align="center" prop="guidanceOpinion" />-->
<!--<el-table-column label="指导方案" align="center" prop="planUrl" >-->
<!--<template slot-scope="scope">-->
<!--<span-->
<!--class="dbtn"-->
<!--@click="checkFile(scope.row.planUrl)"-->
<!--v-if="scope.row.planUrl != null && scope.row.planUrl!=''"-->
<!--&gt;-->
<!--<i class="el-icon el-icon-view"></i>查看/下载-->
<!--</span>-->
<!--<span v-else>-</span>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
<!--<template slot-scope="scope">-->
<!--<span>{{ parseTime(scope.row.guidanceTime, '{y}-{m}-{d}') }}</span>-->
<!--</template>-->
</el-table-column>
<!--<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">-->
<!--<template slot-scope="scope">-->
<!--&lt;!&ndash;<el-button&ndash;&gt;-->
<!--&lt;!&ndash;size="mini"&ndash;&gt;-->
<!--&lt;!&ndash;type="text"&ndash;&gt;-->
<!--&lt;!&ndash;icon="el-icon-edit"&ndash;&gt;-->
<!--&lt;!&ndash;@click="handleUpdate(scope.row)"&ndash;&gt;-->
<!--&lt;!&ndash;v-hasPermi="['system:handle:edit']"&ndash;&gt;-->
<!--&lt;!&ndash;&gt;修改</el-button>&ndash;&gt;-->
<!--<el-button-->
<!--v-if="userType==-2"-->
<!--size="mini"-->
<!--type="text"-->
<!--icon="el-icon-edit"-->
<!--@click="handleUpdate(scope.row)"-->
<!--&gt;预案指引</el-button>-->
<!--<el-button-->
<!--v-if="userType!=-2"-->
<!--size="mini"-->
<!--type="text"-->
<!--icon="el-icon-delete"-->
<!--@click="handleDelete2(scope.row)"-->
<!--&gt;删除</el-button>-->
<!--</template>-->
<!--</el-table-column>-->
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams2.pageNum"
:limit.sync="queryParams2.pageSize"
@pagination="getHandleList"
/>
</el-dialog>
<!-- 添加或修改事件处置对话框 -->
<el-dialog :title="title2" :visible.sync="open2" width="550px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="处置信息" prop="management" :style="display">
<el-input v-model="form.management" type="textarea" placeholder="请输入处置信息" />
</el-form-item> </el-form-item>
<el-form-item label="指导意见" prop="management" :style="display2"> <el-form-item label="处置信息附件" :style="display2" v-if="form.eventType==1">
<el-input v-model="form.management" type="textarea" placeholder="请输入指导意见" /> <span
class="dbtn"
@click="checkFile(form.managementEvent)"
v-if="form.managementEvent != null && form.managementEvent!=''"
>
<i class="el-icon el-icon-view"></i>查看/下载
</span>
<span v-else>-</span>
</el-form-item>
<el-form-item label="操作时间" :style="display2">
<el-input v-model="form.createTime" :readonly="readonly"/>
</el-form-item> </el-form-item>
<el-form-item label="应急预案" prop="planId" :style="display2"> <el-form-item label="应急预案" prop="planId" :style="display" v-if="form.eventType==2">
<el-select v-model="form.planId" placeholder="请选择预案等级" @change="fananchange" > <el-select v-model="form.planId" placeholder="请选择预案等级" @change="fananchange" >
<el-option <el-option
v-for = "dict in planInfoList" v-for = "dict in planInfoList"
...@@ -156,7 +166,7 @@ ...@@ -156,7 +166,7 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="处置附件" prop="managementEvent" :style="display"> <el-form-item label="处置附件" prop="managementEvent" :style="display" v-if="form.eventType==1">
<FileUpload <FileUpload
listType="picture" listType="picture"
:fileType="fileType" :fileType="fileType"
...@@ -167,12 +177,16 @@ ...@@ -167,12 +177,16 @@
<el-input v-show="false" disabled v-model="form.managementEvent"></el-input> <el-input v-show="false" disabled v-model="form.managementEvent"></el-input>
<!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />--> <!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />-->
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer" :style="display">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 添加或修改事件处置对话框 -->
</div> </div>
</template> </template>
...@@ -194,14 +208,15 @@ export default { ...@@ -194,14 +208,15 @@ export default {
}, },
data() { data() {
return { return {
readonly:true,
fileType:['png', 'jpg', 'jpeg',"doc", "xls", "ppt", "txt", "pdf"], fileType:['png', 'jpg', 'jpeg',"doc", "xls", "ppt", "txt", "pdf"],
dataTime:"",
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
open2: false, open2: false,
fileList:[], fileList:[],
receiveList:[], receiveList:[],
userType:"", userType:"",
readonly1:false,
display:"display:none", display:"display:none",
display2:"", display2:"",
//方案列表 //方案列表
...@@ -236,7 +251,10 @@ export default { ...@@ -236,7 +251,10 @@ export default {
management: [ management: [
{ required: true, message: "请输入处置信息", trigger: "blur" }, { required: true, message: "请输入处置信息", trigger: "blur" },
], ],
} },
eventTypeOptions:[],
eventGradeOptions:[],
nowItem:{},
}; };
}, },
computed:{ computed:{
...@@ -244,6 +262,14 @@ export default { ...@@ -244,6 +262,14 @@ export default {
"emergencyData" "emergencyData"
]), ]),
}, },
created(){
this.getDicts("event_type").then(response => {
this.eventTypeOptions = response.data;
});
this.getDicts("event_grade").then(response => {
this.eventGradeOptions = response.data;
});
},
mounted() { mounted() {
// this.$nextTick(()=>{ // this.$nextTick(()=>{
// this.getScrollHeight(); // this.getScrollHeight();
...@@ -302,6 +328,7 @@ export default { ...@@ -302,6 +328,7 @@ export default {
var newList = response.rows; var newList = response.rows;
newList.forEach((model) => { newList.forEach((model) => {
this.receiveList.forEach((item) => { this.receiveList.forEach((item) => {
//判断登录账户等级
if(item.id == model.id){ if(item.id == model.id){
if(this.userType==-2){ if(this.userType==-2){
item.governmentRead =0; item.governmentRead =0;
...@@ -316,7 +343,6 @@ export default { ...@@ -316,7 +343,6 @@ export default {
}, },
/** 查询事件接报列表 */ /** 查询事件接报列表 */
getList(type) { getList(type) {
console.log("******"+type)
listReceive(this.queryParams).then(response => { listReceive(this.queryParams).then(response => {
this.receiveList = response.rows; this.receiveList = response.rows;
if(type==1){ if(type==1){
...@@ -324,6 +350,12 @@ export default { ...@@ -324,6 +350,12 @@ export default {
this.showDetail(this.$route.query.eventId,this.$route.query.eventName); this.showDetail(this.$route.query.eventId,this.$route.query.eventName);
} }
} }
//
this.receiveList.forEach((item) => {
//console.log("ggg"+item.eventGrade, this.eventGradeOptions[item.eventGrade-1].dictLabel)
item.eventGradeName = this.eventGradeOptions[item.eventGrade-1].dictLabel;
item.eventTypeName = this.eventTypeOptions[item.eventType-1].dictLabel;
});
//this.total = response.total; //this.total = response.total;
//console.log(this.receiveList) //console.log(this.receiveList)
}); });
...@@ -333,20 +365,26 @@ export default { ...@@ -333,20 +365,26 @@ export default {
this.loading = true; this.loading = true;
listHandle(this.queryParams2).then(response => { listHandle(this.queryParams2).then(response => {
this.handleList = response.rows; this.handleList = response.rows;
this.form = this.handleList[this.handleList.length-1]
this.total = response.total; this.total = response.total;
this.loading = false; this.loading = false;
return response.total; //document.getElementsByClassName("num-div")[this.handleList.length].setAttribute("class","num-div2")
}); });
}, },
showList(id) { showList(item) {
this.closeDetail();
item.eventType=3;
this.nowItem = item;
this.dataTime = item.createTime;
this.form = item;
this.open = true; this.open = true;
this.title = "事件处置"; this.title = "事件处置";
this.queryParams2.eventId= id this.queryParams2.eventId= item.id
if(this.userType==-2){ // if(this.userType==-2){
this.queryParams2.eventType= 2; // this.queryParams2.eventType= 2;
}else { // }else {
this.queryParams2.eventType= 1; // this.queryParams2.eventType= 1;
} // }
this.getHandleList(); this.getHandleList();
}, },
choice() { choice() {
...@@ -362,22 +400,20 @@ export default { ...@@ -362,22 +400,20 @@ export default {
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.fileList=[] this.fileList=[]
this.readonly1=false; this.form.eventType=1;
this.display="";
this.display2="display:none"; this.display2="display:none";
this.open2 = true; this.display="";
this.title2 = "添加事件处置"; //this.title2 = "添加事件处置";
this.form.eventId = this.queryParams2.eventId this.form.eventId = this.queryParams2.eventId
}, },
/** 新增预案 */ /** 新增预案 */
handleUpdate() { handleUpdate() {
this.reset(); this.reset();
this.readonly1=true; this.display2="display:none";
this.display="display:none"; this.display="";
this.display2="";
//this.form = row; //this.form = row;
this.open2 = true; // this.open2 = true;
this.title2 = "预案指引"; // this.title2 = "预案指引";
this.form.eventId = this.queryParams2.eventId this.form.eventId = this.queryParams2.eventId
this.form.eventType=2; this.form.eventType=2;
this.yuanList(); this.yuanList();
...@@ -416,18 +452,18 @@ export default { ...@@ -416,18 +452,18 @@ export default {
}, },
/** 提交按钮 处置信息*/ /** 提交按钮 处置信息*/
submitForm() { submitForm() {
this.display2="";
this.display="display:none";
this.$refs["form"].validate(valid => { this.$refs["form"].validate(valid => {
if (valid) { if (valid) {
if (this.form.handleId != null) { if (this.form.handleId != null) {
updateHandle(this.form).then(response => { updateHandle(this.form).then(response => {
this.msgSuccess("修改成功"); this.msgSuccess("修改成功");
this.open2 = false;
this.getHandleList(); this.getHandleList();
}); });
} else { } else {
addHandle(this.form).then(response => { addHandle(this.form).then(response => {
this.msgSuccess("新增成功"); this.msgSuccess("新增成功");
this.open2 = false;
this.getHandleList(); this.getHandleList();
this.upReceive(this.form.eventId); this.upReceive(this.form.eventId);
}); });
...@@ -453,8 +489,10 @@ export default { ...@@ -453,8 +489,10 @@ export default {
}, },
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open2 = false; this.display2="";
this.display="display:none";
this.reset(); this.reset();
this.getHandleList();
}, },
endevent(id){ endevent(id){
var that = this; var that = this;
...@@ -500,6 +538,13 @@ export default { ...@@ -500,6 +538,13 @@ export default {
this.$parent.handleUpdate(item); this.$parent.handleUpdate(item);
}, },
async showDetail(id,title){ async showDetail(id,title){
//列表信息
this.receiveList.forEach((item) => {
if(item.id==id){
this.nowItem = item;
}
});
//详情
var that = this; var that = this;
that.detailTitle=title; that.detailTitle=title;
that.queryParams2.eventId= id that.queryParams2.eventId= id
...@@ -537,6 +582,17 @@ export default { ...@@ -537,6 +582,17 @@ export default {
} }
}); });
}, },
switchForm(item,$event){
if(document.getElementsByClassName("num-div2")[0]!=undefined){
document.getElementsByClassName("num-div2")[0].setAttribute("class","num-div")
}
$event.target.setAttribute("class","num-div2");
if(item!=null){
this.form = item;
}
},
//上传 //上传
getFileInfo(res){ getFileInfo(res){
//this.form.dealPlan = res.fileName; //this.form.dealPlan = res.fileName;
...@@ -672,8 +728,13 @@ export default { ...@@ -672,8 +728,13 @@ export default {
height: 100%; height: 100%;
width: 270px; width: 270px;
color: #000000; color: #000000;
margin-left: 20px; text-align: center;
margin-top: 5px; background-image: linear-gradient(
to left,
#fff,
rgb(49 151 195 / 70%) 50%,
#fff
);
} }
.massage{ .massage{
color: #00ffff; color: #00ffff;
...@@ -684,8 +745,52 @@ export default { ...@@ -684,8 +745,52 @@ export default {
background : #112238; background : #112238;
border-radius: 10px; border-radius: 10px;
} }
.num-div{
width: 30px;
height: 30px;
border:2px solid #b0b0b0;
color: #b0b0b0;
border-radius: 15px;
text-align: center;
font-size: 18px;
line-height: 26px;
margin-left: 5px;
cursor:pointer;
}
.num-div2{
width: 30px;
height: 30px;
border:2px solid #000000;
color: #000000;
border-radius: 15px;
text-align: center;
font-size: 18px;
line-height: 26px;
margin-left: 5px;
cursor:pointer;
}
.num-line{
margin-left: 5px;
width: 100px;
height: 1px;
border:1px solid #b0b0b0;
margin-top: 14px;
}
.num-title{
width: 140px;
height: 30px;
line-height: 30px;
}
.show-detail{
overflow-y: scroll;
max-height: 800px;
}
.show-detail::-webkit-scrollbar {
width:0px;
}
::v-deep .el-dialog:not(.is-fullscreen) { ::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 13vh !important; margin-top: 13vh !important;
min-height: 500px; min-height: 500px;
} }
</style> </style>
gassafetyprogress-web/src/layout/components/Navbar.vue
View file @ 7617257a
...@@ -11,11 +11,30 @@ ...@@ -11,11 +11,30 @@
<!--<img src="@/assets/xiaoxi.png" :hidden="xiaohidden" style="height: 40px;width: 40px;margin-top: 5px;cursor: pointer;">--> <!--<img src="@/assets/xiaoxi.png" :hidden="xiaohidden" style="height: 40px;width: 40px;margin-top: 5px;cursor: pointer;">-->
<!--</div>--> <!--</div>-->
<!-- <search id="header-search" class="right-menu-item" /> --> <!-- <search id="header-search" class="right-menu-item" /> -->
          <el-badge :value="total" :max="99" class="item" > <!--          <el-badge :value="total" :max="99" class="item" >-->
            <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" @click="$router.push('/emergency/emergency')"></i> <!--            <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" ></i>-->
          </el-badge> <!--          </el-badge>-->
<el-dropdown class="avatar-container right-menu-item hover-effect" style="margin-right: 0px" trigger="click">
<div class="avatar-wrapper" >
<el-badge :value="total" :max="99" class="item" >
   <i class="el-icon-chat-dot-round" style="width: 10px;height: 10px;" ></i>
 </el-badge>
</div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-if="total==0">
<span>暂无消息</span>
</el-dropdown-item>
<div v-for="(item,index) in receivedList" >
<el-dropdown-item v-if="index==0" @click.native="openMassage(item.id,item.eventName)">
<span>您有新消息：{{item.eventName}}</span>
</el-dropdown-item>
<el-dropdown-item v-if="index>0" divided @click.native="openMassage(item.id,item.eventName)">
<span>您有新消息：{{item.eventName}}</span>
</el-dropdown-item>
</div>
</el-dropdown-menu>
</el-dropdown>
<screenfull id="screenfull" class="right-menu-item hover-effect" /> <screenfull id="screenfull" class="right-menu-item hover-effect" />
<!-- <el-tooltip content="布局大小" effect="dark" placement="bottom"> <!-- <el-tooltip content="布局大小" effect="dark" placement="bottom">
...@@ -46,7 +65,7 @@ ...@@ -46,7 +65,7 @@
</template> </template>
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters,mapMutations } from 'vuex'
import Breadcrumb from '@/components/Breadcrumb' import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav' import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger' import Hamburger from '@/components/Hamburger'
...@@ -69,13 +88,15 @@ export default { ...@@ -69,13 +88,15 @@ export default {
userType:-2, userType:-2,
total:null, total:null,
xiaohidden:false, xiaohidden:false,
receivedList:[],
routerPath:"",
} }
}, },
computed: { computed: {
...mapGetters([ ...mapGetters([
'sidebar', 'sidebar',
'avatar', 'avatar',
'device' 'device',
]), ]),
setting: { setting: {
get() { get() {
...@@ -95,11 +116,71 @@ export default { ...@@ -95,11 +116,71 @@ export default {
} }
}, },
mounted(){ mounted(){
getUserProfile().then(response => { getUserProfile().then(response => {
this.userType = response.data.deptId; this.userType = response.data.deptId;
if(this.userType!=-2){
this.queryParams.enterpriseId = response.data.deptId;
}
this.getList();
}); });
//定时检测新消息 this.socket();
setInterval(() => { },
methods: {
...mapMutations({
SET_EMERGENCY:"bigWindowCompany/SET_EMERGENCY"
}
),
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
async logout() {
this.$confirm('确定注销并退出系统吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$store.dispatch('LogOut').then(() => {
location.href = '/index';
})
}).catch(() => {});
},
openMassage(id,title){
//this.$router.push('/emergency/emergency?eventid='+id);
this.routerPath="/emergency/emergency";
if(window.location.pathname==this.routerPath){
// this.$parent.showDetail(id,title);
this.SET_EMERGENCY({
eventId:id,
eventName:title,
})
}else {
this.$router.push({path: this.routerPath,query:{eventId:id,eventName:title}});
}
},
socket() {
console.log("socket执行");
this.ws = new WebSocket(
"ws://192.168.2.17:8903/gassafety/websocketServer"
);
this.ws.onopen = (evt) => {
console.log("WebSockets开启");
};
this.ws.onmessage = (evt) => {
console.log("推送", evt);
const obj = JSON.parse(evt.data);
console.log("接受socketobj", obj);
this.getList();
};
this.ws.onclose = () => {
console.log("ws协议关闭");
};
},
getList(){
console.log(this.userType)
var params = { var params = {
pageNum: 1, pageNum: 1,
pageSize: 100, pageSize: 100,
...@@ -113,29 +194,13 @@ mounted(){ ...@@ -113,29 +194,13 @@ mounted(){
params.companyRead=0 params.companyRead=0
} }
listReceive(params).then(response => { listReceive(params).then(response => {
this.receivedList = response.rows;
if(response.total!=0){ if(response.total!=0){
this.total= response.total; this.total= response.total;
}else{ }else{
this.total= ""; this.total= "";
} }
}); });
}, 5000);
},
methods: {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
async logout() {
this.$confirm('确定注销并退出系统吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$store.dispatch('LogOut').then(() => {
location.href = '/index';
})
}).catch(() => {});
} }
} }
} }
......
gassafetyprogress-web/src/utils/mapClass/mapbigwindow.js 0 → 100644
View file @ 7617257a
/*
* @Author: your name
* @Date: 2022-01-11 13:45:12
* @LastEditTime: 2022-03-22 10:35:13
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /test/hello-world/src/utils/mapClass.js
*/
import { pipeColor, svgUrl, svgAlarm } from "@/utils/mapClass/config.js";
// 编辑类
// 在地图上新增的设备可以直接编辑，
// 已经保存完成的设备需要点编辑才可以编辑
export class EditorMap {
// 地图的对象实例
map = null;
// 外部传进来的中心店
center = null;
// 父vue的实例
vue = null;
// 操作 新建，编辑，删除，编辑跟删除只对已经在图上的设备有效 默认值：0， 新建：1，编辑：2, 删除: 3。
// 新建的时候会把未保存的线条清空
control = 0;
// 鼠标事件对象，用来将点跟线上图
mousetool = null;
// 当前正在手动绘制的对象
nowMouseTarget = null;
// 当线mousetool线被按下的时候的flag 当线被按下的时候为true，就不询问是否删除了
mosueToolPolineDownFlag = false;
// 绘制marer的时候的配置，在绘制完挂载事件的时候需要使用
mouseToolMarkerOptions = null;
// 绘制poline的时候的配置，在绘制完挂载事件的时候需要使用
mouseToolPolineOptions = null;
// 存放所有的设备的数组集合，这是一个对象，对象里面是各种设备的数组
allDevice = {};
// 存放所有的管道
pipeArr = {};
// 报警设备的对象
alarmObj = {};
// 当前的infowindow的组件
infowindowComponent = null;
// infowindow本身
infowindow = null;
constructor(contaienr, config = {}, vue) {
this.map = new AMap.Map(contaienr, {
viewMode: "3D",
center: [114.196007, 38.260288],
layers: [AMap.createDefaultLayer()], // layers 字段为空或者不赋值将会自动创建默认底图。
zoom: 14,
...config,
});
const { center } = config;
this.center = center;
this.vue = vue;
this.init();
}
init() {
// 地图事件
this.mapEvent();
// 手动点线上图准备,编辑模式
this.mouseAddDevice();
// this.mouseAddMarker();
// this.mouseAddPipeline();
// 地图边界
this.map.getCity((res) => {
const city = res.district;
this.mapBound(city);
}, this.center);
}
mapBound(city) {
var district = new AMap.DistrictSearch({
extensions: "all", // 返回行政区边界坐标等具体信息
level: "district", // 设置查询行政区级别为 区
});
district.search(city, (status, result) => {
// 获取朝阳区的边界信息
var bounds = result.districtList[0].boundaries;
var polygons = [];
console.log("boundsboundsboundsboundsbounds", bounds);
if (bounds) {
for (var i = 0, l = bounds.length; i < l; i++) {
//生成行政区划polygon
// new AMap.Polygon({
// map: this.map,
// strokeWeight: 2,
// path: bounds[i],
// fillOpacity: 1,
// fillColor: "transparent",
// strokeColor: "#09f",
// });
new AMap.Polyline({
map: this.map,
strokeWeight: 4,
strokeColor: "#09f",
path: bounds[i],
});
// polygons.push(polygon);
}
}
});
}
// map的事件监听
mapEvent() {
this.map.on("click", () => {
// mousetool对象画出的对象的操作
// 如果有手动绘制对象，要手动清楚一下，因为画线的时候不好清除旧线，这其实是用来清楚旧线的
// 当画出来的线被mousedown，不删除，但是mouseToolPipeLineFlag要归位，在移出线的时候统一归位
// 如果对象是marker，直接删除
if (this.nowMouseTarget?.type == "AMap.Marker") {
this.mouseToolDrawClear();
} else {
// 当地图上已经画了线，并且没有点在线上，询问是否删除
if (this.nowMouseTarget && !this.mosueToolPolineDownFlag) {
this.confirm("是否重新绘制管道", { type: "warning" })
.then(() => {
// 删除原来的线
this.mouseToolDrawClear();
// 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
this.mousetool.polyline(this.mouseToolPolineOptions);
})
.catch(() => {});
}
}
});
this.map.on("moveend", () => {
console.log("地图停止移动");
if (this.flag) {
console.log("弹框");
this.flag = false;
}
});
window.panTo = () => {
this.flag = true;
this.map.panTo([116.428285, 39.886129]);
};
}
// 弹框工具
confirm(message, obj) {
return this.vue.$confirm(message, obj);
}
// 改变操作状态
changeControl(num) {
this.control = num;
}
// 点线编辑上图准备
mouseAddDevice() {
this.map.plugin(["AMap.MouseTool"], () => {
this.mousetool = new AMap.MouseTool(this.map);
});
// 挂载绘制结束的事件
this.mouseDrawEvent();
}
// 点或者线上图结束后触发的事件
mouseDrawEvent() {
this.mousetool.on("draw", (e) => {
const target = e.obj;
// console.log([target._position.lng, target._position.lat]);
const { type: targetType } = target;
// 当这个点是marker的时候
if (targetType == "AMap.Marker") {
this.mouseToolMarkerEvent(target);
} else {
// 如果是线,挂上编辑
this.lineEditor(target);
this.mousetool.close();
this.mouseToolPolineEvent(target);
console.log(targetType, "当前对象是管道");
}
this.nowMouseTarget = target;
});
}
// 绘制marker结束后，在marker身上添加的事件
mouseToolMarkerEvent(target) {
// 由于画出来的marker点击会换位置，所以当移入的时候删除绘制事件，移出去在增加绘制事件
target.on("mouseover", (e) => {
// 鼠标事件关闭
this.mousetool.close(false);
});
target.on("mouseout", (e) => {
// 这里不方便获取原来的属性，因为position不好解决，还是设置一个值吧
// 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
this.mousetool.marker(this.mouseToolMarkerOptions);
});
// 点
target.on("click", (e) => {
// 弹框
});
}
// 挂上线以及线的事件
lineEditor(line) {
// line.editor && line.editor.close();
// 当前点击次数，1次为编辑，2次为弹框
line.editorNum = 0;
line.editor = new AMap.PolyEditor(this.map, line);
}
// 绘制管道的时候，挂载的事件
mouseToolPolineEvent(target) {
// 线按下的时候会变成编辑，mousetool事件会清空 移出线的时候 在把polyline事件加上
target.on("mouseover", (e) => {
// 鼠标事件关闭
// this.mousetool.close(false);
});
target.on("mouseout", (e) => {
// 有时候按在线上移动地图，map点击事件中mosueToolPolineDownFlag无法归位，在这里归位
this.mosueToolPolineDownFlag = false;
// 鼠标事件开启，并且赋值原来的属性，this.mouseToolMarkerOptions是开启绘制的时候记录的
// this.mousetool.polyline(this.mouseToolPolineOptions);
});
// 线
target.on("mousedown", (e) => {
const line = e.target;
// mosueTool按下的flag,按在线上，不询问是否删除
this.mosueToolPolineDownFlag = true;
// 按下的时候要关闭事件
this.mousetool.close(false);
// 如果当前状态不是编辑，则进入编辑状态
if (line.editorNum < 1) {
// 打开并且++
line.editor.open();
line.editorNum++;
} else {
// 这里就要弹框了
console.log(line.getPath());
}
});
}
// 设备点击上图开启
mouseAddMarker(markerObj = {}) {
// 清空已经绘制完的对象
this.mousetoolClose(true);
// 记录一下配置项，在挂载点击的时候，需要使用
this.mouseToolMarkerOptions = {
draggable: true,
...markerObj,
};
this.mousetool.marker(this.mouseToolMarkerOptions);
}
// 管线点击上图开启
mouseAddPipeline(pipeObj = {}) {
this.mousetoolClose(true);
// 开始画线
this.mosuetoolPolineFlag = true;
this.mouseToolPolineOptions = {
strokeWeight: 5,
...pipeObj,
};
this.mousetool.polyline(this.mouseToolPolineOptions);
}
// 手动清除map上绘制的对象
mouseToolDrawClear() {
if (this.nowMouseTarget) {
this.map.remove(this.nowMouseTarget);
// 如果有editor,则关闭
this.nowMouseTarget.editor && this.nowMouseTarget.editor.close();
this.nowMouseTarget = null;
}
}
// 关闭点击上图事件 true清除之前绘制的图像，false 仅关闭上图事件
mousetoolClose(boolean) {
// 清空地图上的绘制对象的同时,也要清楚这个nowMouseTarget控制对象
if (this.nowMouseTarget) {
// 如果有editor,则关闭
this.nowMouseTarget.editor && this.nowMouseTarget.editor.close();
this.nowMouseTarget = null;
}
this.mousetool.close(boolean);
}
/**
*
*
*
*
*
*
* 地图上add设备
*
*
* @description:
* @param {*} deviceData marker的数据
* @param {*} compontent marker点击弹出的infowindow的组件
* @return {*}
*/
addDevice(deviceData, compontent) {
const { longitude: lng, latitude: lat, iconType } = deviceData;
const icon = svgUrl[iconType];
console.log("icon", icon);
let device = this.createMarker({
map: this.map,
anchor: "bottom-center",
icon,
position: [lng, lat],
extData: deviceData,
// label:{
// content:123,
// direction:"top",
// }
});
// device.hide();
// 如果没有有这个公司的数组，就创建，有就直接push
if (!Array.isArray(this.allDevice[iconType])) {
this.allDevice[iconType] = [];
}
this.allDevice[iconType].push(device);
// 设备的事件函数
this.deviceEvent(device, compontent);
}
deviceEvent(device, compontent) {
device.on("click", (e) => {
const target = e.target;
// 如果control==0就是默认值，没有使用123功能，就显示infowindow
if (this.control == 0) {
this.markerClick(target, compontent);
} else if (this.control == 2) {
// 2是已经上图的设备拥有的编辑功能
} else if (this.control == 3) {
// 3是删除操作
}
});
device.on("mouseover", (e) => {
const target = e.target;
const data = target.getExtData();
console.log(data);
const name =
data.nickName ||
data.deviceName ||
data.videoName ||
data.stationName ||
data.time;
target.setLabel({ content: name, direction: "top" });
});
device.on("mouseout", (e) => {
const target = e.target;
const data = target.getExtData();
target.setLabel({ content: "" });
});
}
/** 点击marker出现infowindow
* @description:
* @param {*} target 点击的对象
* @param {*} compontent marker点击弹出的infowindow的组件
* @return {*}
*/
markerClick(target, compontent) {
const deviceExtData = target.getExtData();
const { longitude: lng, latitude: lat } = deviceExtData;
// 创建一个可以控制的组件，将其dom插入infowindow
this.infowindowComponent = this.createInfowindowDom(
this.vue,
this,
deviceExtData,
compontent
);
// 没恩么用，控制台测试的时候用着玩的
window.func = () => {
const { longitude: lng, latitude: lat } = target.getExtData();
const cd = {
id: 1,
name: "9",
lng,
lat,
};
this.infowindowComponentChange(cd);
target.setExtData(cd);
};
this.infowindow = new AMap.InfoWindow({
isCustom: true,
content: this.infowindowComponent.$el,
position: [lng, lat],
// anchor: "top-left",
// offset: [20, -45],
anchor: "middle-left",
offset: [20, -10],
});
this.infowindow.open(this.map);
}
// 创建要加入到infowindow里的
createInfowindowDom(vueRoot, mapClass, deviceData, compontent) {
const Component = this.vue.$Vue.extend(compontent, {});
return new Component({
data() {
return {
// 当前vue实例
vueRoot,
// 自己写的map类
mapClass,
// 数据
deviceData,
};
},
}).$mount();
}
// 当前显示的infowindow内部的数据发生变化，一般在socket传回数据的时候使用
infowindowComponentChange(data) {
this.infowindowComponent.deviceData = data;
}
// 创建marker
createMarker(MarkerOptions) {
return new AMap.Marker(MarkerOptions);
}
// 地图上add管道
addPipeLine(objData, component) {
const { path, pipePressure, iconType } = objData;
// 根据压力获取颜色
const color = pipeColor[pipePressure + 1];
const pipe = this.createPipeLine({
path: eval(path),
strokeWeight: 4,
strokeColor: color,
extData: objData,
cursor: "pointer",
});
this.map.add(pipe);
// pipe.hide();
if (!Array.isArray(this.pipeArr[iconType])) {
this.pipeArr[iconType] = [];
}
this.pipeArr[iconType].push(pipe);
// console.log(this.pipeArr);
// this.map.panTo([path[0][0], path[0][1]]);
this.pipeEvent(pipe, component);
}
createPipeLine(pipeLineOptions) {
return new AMap.Polyline(pipeLineOptions);
}
pipeEvent(pipe, compontent) {
pipe.on("mouseover", (e) => {
const target = e.target;
// 获取当前颜色
const options = target.getOptions();
options.strokeColor = "blue";
target.setOptions(options);
});
pipe.on("mouseout", (e) => {
const target = e.target;
// 根据管道压力获取颜色
const { pipePressure } = target.getExtData();
const color = pipeColor[pipePressure + 1];
// 获取当前颜色
const options = target.getOptions();
options.strokeColor = color;
target.setOptions(options);
});
pipe.on("click", (e) => {
const target = e.target;
target.lnglat = e.lnglat;
// 如果control==0就是默认值，没有使用123功能，就显示infowindow
if (this.control == 0) {
this.pipeClick(target, compontent);
} else if (this.control == 2) {
// 2是已经上图的设备拥有的编辑功能
} else if (this.control == 3) {
// 3是删除操作
}
});
}
pipeClick(target, compontent) {
const deviceExtData = target.getExtData();
const { lng, lat } = target.lnglat;
// 创建一个可以控制的组件，将其dom插入infowindow
this.infowindowComponent = this.createInfowindowDom(
this.vue,
this,
deviceExtData,
compontent
);
// 没恩么用，控制台测试的时候用着玩的
// window.func = () => {
// const { lng, lat } = target.getExtData();
// const cd = {
// id: 1,
// name: "9",
// lng,
// lat,
// };
// this.infowindowComponentChange(cd);
// target.setExtData(cd);
// };
this.infowindow = new AMap.InfoWindow({
isCustom: true,
content: this.infowindowComponent.$el,
position: [lng, lat],
// anchor: "top-left",
// offset: [20, -15],
anchor: "middle-left",
offset: [20, 0],
});
this.infowindow.open(this.map);
}
infowindowClose() {
if (!this.infowindow) return;
this.infowindow.close();
}
// 设备以及公司过滤
allfilter(companyArr, typeArr) {
for (let pipeItem in this.pipeArr) {
this.pipeArr[pipeItem].forEach((pipe) => {
const data = pipe.getExtData();
if (companyArr.indexOf(data.companyType + "") >= 0) {
pipe.show();
} else {
pipe.hide();
}
});
}
for (let deviceItem in this.allDevice) {
this.allDevice[deviceItem].forEach((device) => {
const data = device.getExtData();
// 设备过滤受到bigwindow页面的的两种制约，companyArr, typeArr 两个数组制约显示隐藏
// 燃气没有公司，所以没有device.companyType不收到公司的控制
const companyHas = companyArr.indexOf(data.companyType + "") >= 0;
// 设备存在 受到设备按钮限制
const deviceHas = typeArr.indexOf(+data.iconType) >= 0;
// 如果是燃气公司的话，不受按钮限制
const enterprise = data.iconType == 7 || data.iconType == 8;
// 必须设备存在数组里，才会显示设备 !data.companyType代表用户不受公司制约
if (enterprise || (deviceHas && (companyHas || !data.companyType))) {
device.show();
} else {
device.hide();
}
});
}
}
// 普通调用方法
// 设备报警
deviceAlarm(obj) {
// 设备的类型
const { iconType } = obj;
const publicId = obj.userId || obj.deviceId;
// 找到这个设备所属的空间
const device = this.allDevice[iconType].filter(
(item) =>
(item.getExtData().userId || item.getExtData().deviceId) == publicId
)[0];
// 更改的icon
const icon = svgAlarm[iconType];
device.setIcon(icon);
device.setzIndex(13);
// 将旧的值缓存一下
// device.oldData = device.getExtData();
// device.setExtData(obj);
// 可能出现infoWindow数据变化
this.alarmInfowindowChange(obj);
if (!this.alarmObj[iconType]) {
this.alarmObj[iconType] = [];
}
const ind = this.alarmObj[iconType].indexOf(publicId);
if (ind < 0) {
this.alarmObj[iconType].push(publicId);
}
}
// 报警时候，可能发生infowindowComponent存在，也要变化
alarmInfowindowChange(obj) {
if (!this.infowindowComponent) return;
// 如果infowindow是打开的，就改变里面的数据 必须是 调压箱2 阀门3 用户6 才会发生变化电话
const infowindowDeviceType = [2, 3, 6].includes(
this.infowindowComponent.deviceData.iconType
);
// 如果存在userId就用userId，如果存在deviceId就用deviceId
const infowindowDeviceId =
this.infowindowComponent.deviceData.userId ||
this.infowindowComponent.deviceData.deviceId;
// 如果存在userId就用userId，如果存在deviceId就用deviceId
const objId = obj.userId || obj.deviceId;
// 如果两个值匹配,才可以改变infowindow身上的组件
const infowindowComponentHas = infowindowDeviceId == objId;
if (
this.infowindowComponent &&
infowindowDeviceType &&
infowindowComponentHas
) {
// this.infowindowComponentChange(obj);
if (this.infowindowComponent.http) {
this.infowindowComponent.myHttp();
}
}
}
//如果传过来的报警设备中，有不在deviceAlarm中，就是恢复的设备恢复
relieveAlarm(alarmObj) {
// 把报警数组改变结构,如果有userId就是用户，如果有deviceId就是其他设备
const httpObj = {};
alarmObj.forEach((item) => {
const publicId = item.userId || item.deviceId;
if (!Array.isArray(httpObj[item.iconType])) {
httpObj[item.iconType] = [];
}
httpObj[item.iconType].push(publicId);
});
// 循环现有报警设备
for (let iconType in this.alarmObj) {
const arr = this.alarmObj[iconType];
// 循环现有报警设备
for (let i = 0; i < arr.length; i++) {
// 看看现有报警设备中有没有不在 报警数组中的值，有就恢复可能是userId，也可能是deviceId
const publicId = arr[i];
// 看看接口传来的数据中还有没有这些Id，如果没有了，就是修好了
const hasId = httpObj[iconType]?.includes(publicId);
// 如果已经不在报警数组中,就要去大数组中找他,利用userId
// 如果id不存在了，说明不报警了
if (!hasId) {
// 过滤出来这个要恢复的设备
const device = this.allDevice[iconType].filter(
(item) =>
(item.getExtData().userId || item.getExtData().deviceId) ==
publicId
)[0];
// 恢复
const icon = svgUrl[iconType];
device.setIcon(icon);
// 赋值
// const deviceData = { ...device.oldData };
// device.setExtData(deviceData);
// device.oldData = null;
// 如果infowindow是打开的
this.alarmInfowindowChange(device.getExtData());
// 在arr中删掉
arr.splice(i, 1);
// 由于删掉了当前，所以要--恢复位置
i--;
}
}
}
}
// ws协议方法
wsAlarm(obj) {
const { iconType, userId, userStatus } = obj;
const decice = this.allDevice[iconType].filter(
(item) => item.getExtData().userId == userId
)[0];
let icon = null;
// 2报警，1恢复
if (userStatus == 2) {
icon = svgAlarm[iconType];
device.oldData = device.getExtData();
device.setExtData(obj);
} else if (userStatus == 1) {
icon = svgUrl[iconType];
const oldData = device.oldData;
device.setExtData(oldData);
device.oldData = null;
}
decice.setIcon(icon);
}
// 卫星图切换
satellite = null;
changeMap(bool) {
// 卫星,
if (!bool) {
if (this.satellite) return;
this.satellite = new AMap.TileLayer.Satellite();
this.map.addLayer(this.satellite);
} else {
if (this.satellite) {
this.map.removeLayer(this.satellite);
this.satellite = null;
}
}
}
// 轨迹回放
/**
* @description:
* @param {*} vehicleId 设备id
* @param {*} path 轨迹回访率丼
* @return {*}
*/
backTrack(vehicleId, path, times,component) {
this.infowindowClose();
AMap.plugin("AMap.MoveAnimation", () => {
let marker = this.allDevice[9].filter(
(item) => item.getExtData().vehicleId == vehicleId
)[0];
// 绘制轨迹
marker.polyline = new AMap.Polyline({
map: this.map,
path,
showDir: true,
strokeColor: "#28F", //线颜色
// strokeOpacity: 1, //线透明度
strokeWeight: 6, //线宽
// strokeStyle: "solid" //线样式
});
marker.passedPolyline = new AMap.Polyline({
map: this.map,
strokeColor: "#AF5", //线颜色
strokeWeight: 6, //线宽
});
marker.on("moving", (e) => {
marker.passedPolyline.setPath(e.passedPath);
// this.map.setCenter(e.target.getPosition(), true);
// console.log(getPosition());
});
// 每个path的点
// marker.pointArr = [];
// carTarget
//点击的时候，先传进来一个点
const carPathData = { ...marker.getExtData(), time: times[0] };
carPathData.iconType = 14;
this.addDevice(carPathData,component);
// marker.pointArr.push(point);
marker.on("moveend", (e) => {
// this.addDevice(carPathData,carBackComponent);
// 如果不是最后一个点，就创建一个新的worderpoint，如果是就不创建，并且把自身删除
let z = {
longitude: e.pos[0],
latitude: e.pos[1],
iconType: 14,
time: times[e.index],
};
// if (e.index == path.length - 1) {
// point = this.addDevice(z, null);
// } else {
this.addDevice(z,component);
// workPoint.infoWindow.open(map,e.passedPos);
// }
console.log("定点", e);
});
marker.moveAlong(path, {
// 每一段的时长
duration: 8000, //可根据实际采集时间间隔设置
// JSAPI2.0 是否延道路自动设置角度在 moveAlong 里设置
autoRotation: true,
});
});
}
clearbackTrack(vehicleId) {
// let marker = this.allDevice[9].filter(
// (item) => item.getExtData().vehicleId == vehicleId
// )[0];
this.allDevice["9"]?.forEach((item) => {
if (item) {
// 停止运动
item.stopMove();
// 删除每个点
console.log(item.pointArr);
if (item.polyline) {
this.map.remove(item.polyline);
}
if (item.passedPolyline) {
this.map.remove(item.passedPolyline);
}
this.map.remove(item);
}
});
// 最后把数组清空
this.allDevice["9"] = [];
// 把car的路径点也清空
this.allDevice["14"]?.forEach((iten) => {
this.map.remove(iten);
});
this.allDevice["14"] = [];
this.infowindowClose();
}
}
gassafetyprogress-web/src/utils/mapClass/yjmap.js
View file @ 7617257a
...@@ -734,6 +734,9 @@ export class EditorMap { ...@@ -734,6 +734,9 @@ export class EditorMap {
}); });
} }
} }
setZoomAndCenter(longitude,latitude){
this.map.setZoomAndCenter(14, [longitude,latitude]);
}
// 普通调用方法 // 普通调用方法
// 设备报警 // 设备报警
deviceAlarm(obj) { deviceAlarm(obj) {
......
gassafetyprogress-web/src/views/complainDeal/index.vue
View file @ 7617257a
...@@ -159,7 +159,7 @@ ...@@ -159,7 +159,7 @@
<el-input v-model="form.complainName" placeholder="请输入投诉人姓名" :disabled="readonly"/> <el-input v-model="form.complainName" placeholder="请输入投诉人姓名" :disabled="readonly"/>
</el-form-item> </el-form-item>
<el-form-item label="指派单位" prop="complainAssignEnterproseId" > <el-form-item label="指派单位" prop="complainAssignEnterproseId" >
<el-select style="width: 100%" v-model="form.complainAssignEnterproseName" placeholder="请选择预案等级" @change="qiyechang" :disabled="readonly"> <el-select style="width: 100%" v-model="form.complainAssignEnterproseName" placeholder="请选择指派单位" @change="qiyechang" :disabled="readonly">
<el-option <el-option
v-for = "dict in enterpriseList" v-for = "dict in enterpriseList"
:key = "dict.enterpriseId" :key = "dict.enterpriseId"
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
<el-input v-model="form.complainPhone" placeholder="请输入投诉人电话" :disabled="readonly"/> <el-input v-model="form.complainPhone" placeholder="请输入投诉人电话" :disabled="readonly"/>
</el-form-item> </el-form-item>
<el-form-item label="指派人" prop="complainAssignManId"> <el-form-item label="指派人" prop="complainAssignManId">
<el-select v-model="form.complainAssignMan" placeholder="请选择预案等级" clearable style = "width: 100%" @change="manChang" :disabled="readonly"> <el-select v-model="form.complainAssignMan" placeholder="请选择指派人" clearable style = "width: 100%" @change="manChang" :disabled="readonly">
<el-option <el-option
v-for = "dict in peopleList" v-for = "dict in peopleList"
:key = "dict.id" :key = "dict.id"
...@@ -191,6 +191,16 @@ ...@@ -191,6 +191,16 @@
<el-form-item label="投诉事项" prop="complainMatter"> <el-form-item label="投诉事项" prop="complainMatter">
<el-input v-model="form.complainMatter" type = "textarea" placeholder="请输入投诉事项" :disabled="readonly"/> <el-input v-model="form.complainMatter" type = "textarea" placeholder="请输入投诉事项" :disabled="readonly"/>
</el-form-item> </el-form-item>
<el-form-item label="反馈时间" prop="dealTime" :style="display">
<el-date-picker clearable size="small"
v-model="form.dealTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择反馈时间"
:disabled="readonly"
style="width: 280px">
</el-date-picker>
</el-form-item>
<el-form-item label="反馈内容" prop="dealCondition" :style="display"> <el-form-item label="反馈内容" prop="dealCondition" :style="display">
<el-input v-model="form.dealCondition" type = "textarea" placeholder="请输入办理情况" :disabled="readonly"/> <el-input v-model="form.dealCondition" type = "textarea" placeholder="请输入办理情况" :disabled="readonly"/>
</el-form-item> </el-form-item>
...@@ -479,7 +489,7 @@ export default { ...@@ -479,7 +489,7 @@ export default {
getComplainDeal(complainDealId).then(response => { getComplainDeal(complainDealId).then(response => {
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "修改投诉处置"; this.title = "投诉处置详情";
var statusName = this.selectDictLabel(this.taskStateOptions, row.complainStatus); var statusName = this.selectDictLabel(this.taskStateOptions, row.complainStatus);
this.form.complainStatus=statusName; this.form.complainStatus=statusName;
}); });
......
gassafetyprogress-web/src/views/emergency/index.vue
View file @ 7617257a
...@@ -114,9 +114,9 @@ ...@@ -114,9 +114,9 @@
> >
<img <img
:src="item.imgurl" :src="item.imgurl"
style="margin-top: 6px;float: left; margin-right: 3px;width: 18px;height: 18px;margin-left: 10px;" style="margin-top: 8px;float: left; margin-right: 3px;width: 18px;height: 18px;margin-left: 10px;"
/> />
{{ item.name }} {{ item.name }} ({{ item.num }})
</div> </div>
</div> </div>
...@@ -365,36 +365,42 @@ export default { ...@@ -365,36 +365,42 @@ export default {
arr2: [ arr2: [
{ {
val: 10, val: 10,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-jydw.png"), imgurl: require("@/assets/image/yj-jydw.png"),
name: "救援队伍", name: "救援队伍",
}, },
{ {
val: 11, val: 11,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-wz.png"), imgurl: require("@/assets/image/yj-wz.png"),
name: "救援物资", name: "救援物资",
}, },
{ {
val: 12, val: 12,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-cl.png"), imgurl: require("@/assets/image/yj-cl.png"),
name: "救援车辆", name: "救援车辆",
}, },
{ {
val: 13, val: 13,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-yy.png"), imgurl: require("@/assets/image/yj-yy.png"),
name: "医 院", name: "医 院",
}, },
{ {
val: 15, val: 15,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-xf.png"), imgurl: require("@/assets/image/yj-xf.png"),
name: "消防队伍", name: "消防队伍",
}, },
{ {
val: 16, val: 16,
num:0,
ischeck: false, ischeck: false,
imgurl: require("@/assets/image/yj-xj.png"), imgurl: require("@/assets/image/yj-xj.png"),
name: "巡检人员", name: "巡检人员",
...@@ -478,8 +484,9 @@ export default { ...@@ -478,8 +484,9 @@ export default {
this.map = new EditorMap( this.map = new EditorMap(
"map", "map",
{ {
center: path, //center: path,
//mapStyle: "amap://styles/f71d3a3d73e14f5b2bf5508bf1411758", //mapStyle: "amap://styles/f71d3a3d73e14f5b2bf5508bf1411758",
center: [114.208007, 38.260288],
zoom: 14.5, zoom: 14.5,
}, },
this this
...@@ -536,6 +543,12 @@ export default { ...@@ -536,6 +543,12 @@ export default {
listDevice(params).then(response => { listDevice(params).then(response => {
response.rows.forEach((item) => { response.rows.forEach((item) => {
item.iconType = item.deviceType+9; item.iconType = item.deviceType+9;
if(item.deviceType<5){
this.arr2[item.deviceType-1].num++;
}else {
this.arr2[item.deviceType-2].num++;
}
}); });
this.deviceList = response.rows; this.deviceList = response.rows;
//console.log(this.deviceList) //console.log(this.deviceList)
...@@ -598,8 +611,8 @@ export default { ...@@ -598,8 +611,8 @@ export default {
this.dialogTableVisible = false; this.dialogTableVisible = false;
}, },
getPath(res){ getPath(res){
console.log("res", res); //console.log("res", res);
console.log(this.form.longitude, this.form.latitude); //console.log(this.form.longitude, this.form.latitude);
//确认选择经纬度 //确认选择经纬度
this.form.longitude = res[0]; this.form.longitude = res[0];
this.form.latitude = res[1]; this.form.latitude = res[1];
...@@ -745,12 +758,30 @@ export default { ...@@ -745,12 +758,30 @@ export default {
this.selarr1.splice(ind, 1); this.selarr1.splice(ind, 1);
} else { } else {
this.selarr1.push(item.val); this.selarr1.push(item.val);
//找中心点
console.log(item.val);
if(item.val>=10){
for(var i=0;i<this.deviceList.length;i++){
if(this.deviceList[i].iconType==item.val){
console.log(this.deviceList[i])
this.map.setZoomAndCenter(this.deviceList[i].longitude,this.deviceList[i].latitude);
break;
}
}
// this.deviceList.forEach((item2) => (
// if(item2.iconType==item.val){
//
// }
//
// ));
}
} }
this.map.allfilter(this.selarr, this.selarr1); this.map.allfilter(this.selarr, this.selarr1);
//this.map.setZoomAndCenter(14, [116.326655,39.899438]);
}, },
//用户的设备center //用户的设备center
getDetectorInfoList(httpFunc, queryParams, title) { getDetectorInfoList(httpFunc, queryParams, title) {
console.log(queryParams); //console.log(queryParams);
return httpFunc(queryParams).then((res) => { return httpFunc(queryParams).then((res) => {
// console.log("queryParams", res); // console.log("queryParams", res);
if (res.code == 200) { if (res.code == 200) {
...@@ -1009,7 +1040,7 @@ export default { ...@@ -1009,7 +1040,7 @@ export default {
.typelist-div { .typelist-div {
width: 450px; width: 450px;
height: 50px; height: 50px;
z-index: 9999; z-index: 999;
position: fixed; position: fixed;
top: 0; top: 0;
margin-top: 80px; margin-top: 80px;
...@@ -1017,16 +1048,17 @@ export default { ...@@ -1017,16 +1048,17 @@ export default {
} }
.typelist-div2{ .typelist-div2{
width: 150px; width: 150px;
height: 50px; height: 230px;
z-index: 9999; z-index: 999;
position: fixed; position: fixed;
margin-top: 80px; margin-top: 80px;
margin-left: 10px; margin-left: 10px;
background: white;
margin-left: 15px;
} }
.list { .list {
z-index: 9999; z-index: 9999;
float: left; float: left;
margin-left: 15px;
color: #000000; color: #000000;
line-height: auto; line-height: auto;
background: #ffffff; background: #ffffff;
......
gassafetyprogress-web/src/views/inspectionWork/workOrder/components/HiddenFeedTrouble.vue 0 → 100644
View file @ 7617257a
<template>
<div class="hidden">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="small"
@click="handleAdd"
v-if="!isView"
>新增隐患信息</el-button>
</el-col>
</el-row>
<!--隐患信息-->
<el-table :data="hiddenList">
<el-table-column label="隐患名称" align="center" prop="hiddenTroubleName" />
<el-table-column label="隐患等级" align="center" prop="hiddenTroubleLevel">
<template slot-scope="scope">
<span v-if="scope.row.hiddenTroubleLevel == '1'">I级</span>
<span v-if="scope.row.hiddenTroubleLevel == '2'">II级</span>
<span v-if="scope.row.hiddenTroubleLevel == '3'">III级</span>
</template>
</el-table-column>
<el-table-column label="隐患类型" align="center" prop="hiddenTroubleType">
<template slot-scope="scope">
<span v-if="item.dictValue == scope.row.hiddenTroubleType" v-for="item in hiddenTroubleOptions" :key="item.dictValue">
{{ item.dictLabel }}
</span>
</template>
</el-table-column>
<el-table-column label="隐患图片" align="center" prop="pictureUrl">
<template slot-scope="scope">
<el-image :src="scope.row.pictureUrl" :preview-src-list="[scope.row.pictureUrl]" v-if="scope.row.pictureUrl != '' && scope.row.pictureUrl != null" :z-index=5000 style="width: auto;height: auto;"></el-image>
</template>
</el-table-column>
<el-table-column label="上报时间" align="center" prop="reportTime" width="150">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.reportTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="上报人" align="center" prop="reportPersonName" />
<el-table-column label="处理状态" align="center" prop="hiddenTroubleDealStatus">
<template slot-scope="scope">
<span v-if="scope.row.hiddenTroubleDealStatus == '1'">待处理</span>
<span v-if="scope.row.hiddenTroubleDealStatus == '2'">处理中</span>
<span v-if="scope.row.hiddenTroubleDealStatus == '3'">已完成</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="viewDetail(scope.row,scope.$index)"
v-if="isView"
>详情</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row,scope.$index)"
v-if="!isView"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-if="!isView"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改燃气隐患对话框 -->
<el-dialog :title="title" :visible.sync="hiddenOpen" width="900px" append-to-body destroy-on-close @close="cancel">
<el-form ref="hiddenForm" :model="hiddenForm" :rules="rules" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="隐患名称" prop="hiddenTroubleName">
<el-input v-model="hiddenForm.hiddenTroubleName" placeholder="请输入隐患名称" :disabled="isView"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="隐患等级" prop="hiddenTroubleLevel">
<el-select v-model="hiddenForm.hiddenTroubleLevel" placeholder="请选择隐患类型" style="width: 330px" :disabled="isView">
<el-option label="I级" value="1" />
<el-option label="II级" value="2" />
<el-option label="III级" value="3" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="隐患类型" prop="hiddenTroubleType">
<el-select v-model="hiddenForm.hiddenTroubleType" placeholder="请选择隐患类型" style="width: 330px" :disabled="isView">
<el-option
v-for="dict in hiddenTroubleOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
<el-row>
<el-col :span="24">
<el-form-item label="经纬度坐标" prop="longitude">
<el-col :span="8">
<el-input v-model="hiddenForm.longitude" placeholder="请输入经度" :disabled="isView"/>
</el-col>
<el-col :span="8" style="margin-left: 20px">
<el-input v-model="hiddenForm.latitude" placeholder="请输入纬度" :disabled="isView"/>
</el-col>
<el-col :span="4" style="margin-left: 30px">
<el-button type="primary" plain @click="MapdialogFun" v-if="!isView">选择经纬度</el-button>
</el-col>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="图片地址" prop="pictureUrl">
<MyFileUpload
listType="picture-card"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList"
v-if="!isView"
/>
<div style="width: 20%;" v-if="isView">
<el-image :src="hiddenForm.pictureUrl" :preview-src-list="[hiddenForm.pictureUrl]" style="width: auto;height: auto;" :z-index= "3000"></el-image>
</div>
<el-input v-show="false" disabled v-model="hiddenForm.pictureUrl"></el-input>
</el-form-item>
<el-form-item label="隐患描述" prop="hiddenTroubleDescribe">
<el-input v-model="hiddenForm.hiddenTroubleDescribe" type="textarea" placeholder="请输入隐患描述" :disabled="isView"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" v-if="!isView">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<GetPos
:dialogVisible.sync="dialogTableVisibles"
device=""
:devicePos="devicePos"
@close="dialogcancelFun"
@getPath="getPath"
style="z-index: 3000"
/>
</div>
</template>
<script>
import MyFileUpload from '@/components/MyFileUpload';
import GetPos from '@/components/GetPos';
import moment from "moment";
import { hiddenTroubleList, addHiddenInfo , updateHiddenInfo ,delHiddenInfo } from "@/api/operationMonitor/hiddenTrouble"
export default {
name: "HiddenTrouble",
components: {
MyFileUpload,
GetPos
},
props:{
workId:{
type:Number
},
//是否为查看
isView:{
type:Boolean,
default:true
}
},
data() {
return {
// 遮罩层
loading: true,
// 燃气隐患表格数据
/* infoList: [],*/
// 弹出层标题
title: "",
// 是否显示弹出层
hiddenOpen: false,
// 表单参数
hiddenForm: {
pictureUrl: ""
},
/**隐患信息数据*/
hiddenList:[],
// 表单校验
rules: {
hiddenTroubleName: [
{ required: true, message: "请输入隐患名称", trigger: "blur" }
],
hiddenTroubleLevel: [
{ required: true, message: "请输入隐患等级", trigger: "blur" }
],
hiddenTroubleType: [
{ required: true, message: "请输入隐患类型", trigger: "blur" }
],
longitude: [
{ required: true, message: "请输入经纬度", trigger: ["blur","change"] }
],
pictureUrl: [
{ required: true, message: "请上传图片", trigger: "blur" }
],
hiddenTroubleDescribe: [
{ required: true, message: "请输入隐患描述", trigger: "blur" }
]
},
fileList:[],
devicePos: [],
dialogTableVisibles: false,
hiddenTroubleOptions:[],
/**修改时当前数据下标*/
index: -1,
};
},
created(){
this.getDicts("t_hidden_trouble_type").then(response => {
this.hiddenTroubleOptions = response.data;
});
console.log("fdafdsafds",this.workId)
this.getHiddenInfoList({workId:this.workId});
},
methods: {
// 取消按钮
cancel() {
this.hiddenOpen = false;
this.fileList = [];
this.reset();
},
/**获取隐患信息*/
getHiddenInfoList(param){
hiddenTroubleList(param).then(res =>{
this.hiddenList = res.data;
/* this.hiddenList.forEach(item=>{
item.reportPersonName = item.reportPerson;
})*/
});
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.title = "新增隐患信息"
this.hiddenOpen = true;
},
/** 详情按钮操作 */
viewDetail(row,index) {
this.reset();
this.index = index;
this.hiddenForm = {...row};
this.title = "查看隐患信息"
this.hiddenOpen = true;
if (this.hiddenForm.pictureUrl) {
this.fileList.push({
url: this.hiddenForm.pictureUrl,
});
}
},
/** 修改按钮操作 */
handleUpdate(row,index) {
this.reset();
this.index = index;
this.hiddenForm = {...row};
console.log(row,"ffffffffff",this.hiddenForm);
this.title = "修改隐患信息"
this.hiddenOpen = true;
if (this.hiddenForm.pictureUrl) {
this.fileList.push({
url: this.hiddenForm.pictureUrl,
});
}
},
/** 提交按钮 */
submitForm() {
this.$refs["hiddenForm"].validate(valid => {
if (valid) {
if (this.hiddenForm.hiddenTroubleId != null) {
updateHiddenInfo(this.hiddenForm).then(response => {
this.msgSuccess("修改成功");
this.hiddenOpen = false;
this.getHiddenInfoList({workId:this.workId});
});
} else {
this.hiddenForm.workId = this.workId;
this.hiddenForm.reportTime = moment().format("YYYY-MM-DD HH:mm:ss");
this.hiddenForm.reportPersonName = this.$store.state.user.name;
this.hiddenForm.reportPerson = this.$store.state.user.userId;
addHiddenInfo(this.hiddenForm).then(response => {
this.msgSuccess("新增成功");
this.hiddenOpen = false;
this.getHiddenInfoList({workId:this.workId});
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const hiddenTroubleId = row.hiddenTroubleId;
this.$confirm('是否确认删除隐患名称为"' + row.hiddenTroubleName + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delHiddenInfo(hiddenTroubleId);
}).then(() => {
this.getHiddenInfoList({workId:this.workId});
this.msgSuccess("删除成功");
}).catch(() => {});
},
getFileInfo(res){
this.hiddenForm.pictureUrl = res.url;
},
listRemove(e) {
this.fileList = [];
},
// 表单重置
reset() {
this.hiddenForm = {
hiddenTroubleId: null,
workId: null,
hiddenTroubleName: null,
hiddenTroubleLevel: null,
hiddenTroubleType: null,
longitude: null,
latitude: null,
pictureUrl: null,
hiddenTroubleDescribe: null,
reportTime: null,
reportPerson: null,
hiddenTroubleDealStatus: null,
hiddenTroubleDealCondition: null,
hiddenTroubleDealFinishTime: null,
isDel: null,
remarks: null,
uniqueMark: null,
reportPersonName:null
};
this.resetForm("hiddenForm");
},
/**
* 经纬度坐标方法
*/
MapdialogFun() {
this.dialogTableVisibles = true;
},
/**
* 地图关闭方法
*/
dialogcancelFun() {
this.dialogTableVisibles = false;
},
/**
* 经纬度 选择
* @param res
*/
getPath(res){
//确认选择经纬度
this.hiddenForm.longitude = res[0];
this.hiddenForm.latitude = res[1];
},
/**父组件校验子组件数据*/
checkChildData(){
return this.hiddenList.length <=0;
}
}
}
</script>
<style lang="scss" scoped>
.hidden{
.el-dialog__header{
height: 52px;
}
}
</style>
gassafetyprogress-web/src/views/inspectionWork/workOrder/components/HiddenTrouble.vue
View file @ 7617257a
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
size="mini" size="mini"
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row,scope.$index)" @click="viewDetail(scope.row,scope.$index)"
v-if="isView" v-if="isView"
>详情</el-button> >详情</el-button>
<el-button <el-button
...@@ -236,6 +236,19 @@ export default { ...@@ -236,6 +236,19 @@ export default {
this.title = "新增隐患信息" this.title = "新增隐患信息"
this.hiddenOpen = true; this.hiddenOpen = true;
}, },
/** 详情按钮操作 */
viewDetail(row,index) {
this.reset();
this.index = index;
this.hiddenForm = {...row};
this.title = "查看隐患信息"
this.hiddenOpen = true;
if (this.hiddenForm.pictureUrl) {
this.fileList.push({
url: this.hiddenForm.pictureUrl,
});
}
},
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row,index) { handleUpdate(row,index) {
this.reset(); this.reset();
......
gassafetyprogress-web/src/views/inspectionWork/workOrder/index.vue
View file @ 7617257a
...@@ -71,9 +71,10 @@ ...@@ -71,9 +71,10 @@
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="任务内容" align="center" prop="workContent" />--> <!-- <el-table-column label="任务内容" align="center" prop="workContent" />-->
<el-table-column label="创建时间" align="center" prop="createTime" width="180"/>
<el-table-column label="创建单位" align="center" prop="workCreateEnterpriseName" /> <el-table-column label="创建单位" align="center" prop="workCreateEnterpriseName" />
<el-table-column label="指派单位" align="center" prop="workAssignEnterproseName" /> <el-table-column label="执行单位" align="center" prop="workAssignEnterproseName" />
<el-table-column label="指派人" align="center" prop="workAssignMan" /> <el-table-column label="执行人" align="center" prop="workAssignMan" />
<el-table-column label="任务状态" align="center" prop="workStatus"> <el-table-column label="任务状态" align="center" prop="workStatus">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.workStatus == 0" style="color: #ff7272">派发中</span> <span v-if="scope.row.workStatus == 0" style="color: #ff7272">派发中</span>
...@@ -98,8 +99,8 @@ ...@@ -98,8 +99,8 @@
<!--<el-table-column label="图片路径" align="center" prop="iconUrl" />--> <!--<el-table-column label="图片路径" align="center" prop="iconUrl" />-->
<!-- <el-table-column label="整改方案" align="center" prop="rectificationPlan" /> <!-- <el-table-column label="整改方案" align="center" prop="rectificationPlan" />
<el-table-column label="整改结果" align="center" prop="rectificationResult" />--> <el-table-column label="整改结果" align="center" prop="rectificationResult" />-->
<el-table-column label="责任单位" align="center" prop="responsibleUnit" /> <!--<el-table-column label="责任单位" align="center" prop="responsibleUnit" />
<el-table-column label="责任人员" align="center" prop="responsiblePerson" /> <el-table-column label="责任人员" align="center" prop="responsiblePerson" />-->
<el-table-column label="截止日期" align="center" prop="expiryDate" width="180"> <el-table-column label="截止日期" align="center" prop="expiryDate" width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.expiryDate, '{y}-{m}-{d} {h}:{i}:{s}') }}</span> <span>{{ parseTime(scope.row.expiryDate, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
...@@ -131,7 +132,7 @@ ...@@ -131,7 +132,7 @@
v-if="('zhengfu'== roleType || (('enterprise'== roleType || 'doubleRole' == roleType) && scope.row.workCreateEnterpriseId == $store.state.user.enterpriseId))&& scope.row.workStatus == '0'" v-if="('zhengfu'== roleType || (('enterprise'== roleType || 'doubleRole' == roleType) && scope.row.workCreateEnterpriseId == $store.state.user.enterpriseId))&& scope.row.workStatus == '0'"
key="detele" key="detele"
>删除</el-button> >删除</el-button>
<el-button v-if="'inpector'!= roleType && (scope.row.workAssignManId == '' || scope.row.workAssignManId == null) && scope.row.workStatus == '0'" <el-button v-if="'inpector'!= roleType && (scope.row.workAssignManId == '' || scope.row.workAssignManId == null) && scope.row.workStatus == '0' && scope.row.workCreateEnterpriseId == $store.state.user.enterpriseId"
size="mini" size="mini"
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
...@@ -155,7 +156,7 @@ ...@@ -155,7 +156,7 @@
v-hasPermi="['system:order:edit']" v-hasPermi="['system:order:edit']"
key="feedbook" key="feedbook"
>反馈</el-button> >反馈</el-button>
<el-button v-if="'zhengfu'!= roleType && scope.row.workStatus == '2'" <el-button v-if="'inpector'!= roleType && scope.row.workStatus == '2' && scope.row.workCreateEnterpriseId == $store.state.user.enterpriseId"
size="mini" size="mini"
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
...@@ -163,6 +164,14 @@ ...@@ -163,6 +164,14 @@
v-hasPermi="['system:order:edit']" v-hasPermi="['system:order:edit']"
key="sort" key="sort"
>归档</el-button> >归档</el-button>
<el-button v-if="'zhengfu'!= roleType && scope.row.workStatus != '3'"
size="mini"
type="text"
icon="el-icon-edit"
@click="hiddenFeed(scope.row)"
v-hasPermi="['system:order:edit']"
key="hidden"
>隐患反馈</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -176,17 +185,17 @@ ...@@ -176,17 +185,17 @@
/> />
<!-- 添加或修改燃气任务对话框 --> <!-- 添加或修改燃气任务对话框 -->
<el-dialog :title="title" :visible.sync="open" width="900px" @closed="dialogClose" @open="dialogOpen" :close-on-click-modal="false"> <el-dialog :title="title" :visible.sync="open" width="800px" @closed="dialogClose" @open="dialogOpen" :close-on-click-modal="false">
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<el-col :span="12"> <el-col :span="11">
<el-form-item label="任务标题" prop="workTitle"> <el-form-item label="任务标题" prop="workTitle">
<el-input v-model="form.workTitle" placeholder="请输入任务标题" :disabled="isDetail"/> <el-input v-model="form.workTitle" placeholder="请输入任务标题" :disabled="isDetail"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="任务类型" prop="workType"> <el-form-item label="任务类型" prop="workType">
<el-select v-model="form.workType" placeholder="请选择任务类型" style="width: 350px" :disabled="isDetail"> <el-select v-model="form.workType" placeholder="请选择任务类型" style="width: 100%" :disabled="isDetail">
<el-option label="入户安检" value="1" /> <el-option label="入户安检" value="1" />
<el-option label="巡检" value="2" /> <el-option label="巡检" value="2" />
<!--<el-option label="报警巡查" value="3" />--> <!--<el-option label="报警巡查" value="3" />-->
...@@ -195,16 +204,19 @@ ...@@ -195,16 +204,19 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="23">
<el-form-item label="任务内容" prop="workContent"> <el-form-item label="任务内容" prop="workContent">
<!--<editor v-model="form.workContent" :min-height="192" :readOnly="!s"/>--> <!--<editor v-model="form.workContent" :min-height="192" :readOnly="!s"/>-->
<editor v-if="isOpen" v-model="form.workContent" :min-height="192" :readOnly="isDetail"/> <editor v-if="isOpen" v-model="form.workContent" :min-height="192" :readOnly="isDetail"/>
</el-form-item> </el-form-item>
</el-col>
</el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="11">
<el-form-item label="指派单位" prop="workAssignEnterproseId"> <el-form-item label="执行单位" prop="workAssignEnterproseId">
<!--<el-input v-model="form.workAssignEnterproseName" placeholder="请输入指派单位名称" />--> <!--<el-input v-model="form.workAssignEnterproseName" placeholder="请输入执行单位名称" />-->
<el-select v-model="form.workAssignEnterproseId" placeholder="请选择指派单位名称" style="width: 350px" @change="selectworkAssignEnterprose($event)" :disabled="isDetail || isEnterproser"> <el-select v-model="form.workAssignEnterproseId" placeholder="请选择执行单位名称" style="width: 100%" @change="selectworkAssignEnterprose($event)" :disabled="isDetail || isEnterproser">
<el-option <el-option
v-for="item in enterprises" v-for="item in enterprises"
:key="item.enterpriseId" :key="item.enterpriseId"
...@@ -215,9 +227,9 @@ ...@@ -215,9 +227,9 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="指派人" prop="workAssignMan"> <el-form-item label="执行人" prop="workAssignMan">
<!--<el-input v-model="form.workAssignManId" placeholder="请输入指派人" />--> <!--<el-input v-model="form.workAssignManId" placeholder="请输入执行人" />-->
<el-select v-model="form.workAssignManId" placeholder="请输入指派人" style="width: 350px" @change="selectInspection($event,'edit')" :disabled="isDetail" clearable> <el-select v-model="form.workAssignManId" placeholder="请输入执行人" style="width: 100%" @change="selectInspection($event,'edit')" :disabled="isDetail" clearable>
<el-option <el-option
v-for="item in inspectors" v-for="item in inspectors"
:key="item.userId " :key="item.userId "
...@@ -229,8 +241,8 @@ ...@@ -229,8 +241,8 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12" v-show="isDetail"> <el-col :span="11" v-show="isDetail">
<el-form-item label="创建单位" prop="inspectionDate"> <el-form-item label="创建单位" prop="workCreateEnterpriseName">
<el-input v-model="form.workCreateEnterpriseName" placeholder="请输入创建单位名称" :disabled="isDetail"/> <el-input v-model="form.workCreateEnterpriseName" placeholder="请输入创建单位名称" :disabled="isDetail"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -240,21 +252,34 @@ ...@@ -240,21 +252,34 @@
v-model="form.inspectionDate" v-model="form.inspectionDate"
type="date" type="date"
value-format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择巡检时间" style="width: 350px" :disabled="isDetail"> placeholder="选择巡检时间" style="width: 100%" :disabled="isDetail">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="23">
<el-form-item label="巡检路线" prop="inspectionRoute" v-show="form.workType=='2'"> <el-form-item label="巡检路线" prop="inspectionRoute" v-show="form.workType=='2'">
<el-input v-model="form.inspectionRoute" type="textarea" placeholder="请输入巡检路线" :disabled="isDetail"/> <el-input v-model="form.inspectionRoute" type="textarea" placeholder="请输入巡检路线" :disabled="isDetail"/>
</el-form-item> </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="问题描述" prop="problemDescription" v-show="form.workType=='3'"> <el-form-item label="问题描述" prop="problemDescription" v-show="form.workType=='3'">
<el-input v-model="form.problemDescription" type="textarea" placeholder="请输入问题描述" :disabled="isDetail"/> <el-input v-model="form.problemDescription" type="textarea" placeholder="请输入问题描述" :disabled="isDetail"/>
</el-form-item> </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="整改方案" prop="rectificationPlan" v-show="form.workType=='3' && isDetail && (form.workStatus =='2' || form.workStatus =='3')"> <el-form-item label="整改方案" prop="rectificationPlan" v-show="form.workType=='3' && isDetail && (form.workStatus =='2' || form.workStatus =='3')">
<el-input v-model="form.rectificationPlan" type="textarea" placeholder="请输入整改方案" :disabled="isDetail"/> <el-input v-model="form.rectificationPlan" type="textarea" placeholder="请输入整改方案" :disabled="isDetail"/>
</el-form-item> </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="反馈图片" prop="iconUrl" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3') && form.iconUrl !='' && form.iconUrl != null"> <el-form-item label="反馈图片" prop="iconUrl" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3') && form.iconUrl !='' && form.iconUrl != null">
<!--<MyFileUpload <!--<MyFileUpload
listType="picture-card" listType="picture-card"
...@@ -268,15 +293,17 @@ ...@@ -268,15 +293,17 @@
<el-image :src="form.iconUrl" :preview-src-list="[form.iconUrl]" style="width: auto;height: auto;" :z-index= "3000"></el-image> <el-image :src="form.iconUrl" :preview-src-list="[form.iconUrl]" style="width: auto;height: auto;" :z-index= "3000"></el-image>
</div> </div>
</el-form-item> </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="23">
<el-form-item label="反馈信息" prop="rectificationResult" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3')"> <el-form-item label="反馈信息" prop="rectificationResult" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3')">
<el-input v-model="form.rectificationResult" type="textarea" placeholder="请输入整改结果" :disabled="isDetail"/> <el-input v-model="form.rectificationResult" type="textarea" placeholder="请输入整改结果" :disabled="isDetail"/>
</el-form-item> </el-form-item>
<el-form-item label="隐患信息" prop="rectificationResult" v-show="isDetail && (form.workStatus =='2' || form.workStatus =='3')"> </el-col>
<HiddenTrouble </el-row>
:hiddenList="hiddenInfoList"/>
</el-form-item>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="11">
<el-form-item label="责任单位" prop="responsibleUnit"> <el-form-item label="责任单位" prop="responsibleUnit">
<el-input v-model="form.responsibleUnit" placeholder="请输入责任单位" :disabled="isDetail"/> <el-input v-model="form.responsibleUnit" placeholder="请输入责任单位" :disabled="isDetail"/>
</el-form-item> </el-form-item>
...@@ -287,16 +314,24 @@ ...@@ -287,16 +314,24 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="23">
<el-form-item label="截止日期" prop="expiryDate"> <el-form-item label="截止日期" prop="expiryDate">
<el-date-picker clearable size="small" <el-date-picker clearable size="small"
v-model="form.expiryDate" v-model="form.expiryDate"
type="datetime" type="datetime"
value-format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择截止日期" style="width: 350px" :disabled="isDetail"> placeholder="选择截止日期" style="width: 100%" :disabled="isDetail">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col>
</el-row>
</el-form> </el-form>
<div v-if="hiddenInfoList.length > 0">
<div class="hiddenInfo">隐患信息</div>
<HiddenTrouble
:hiddenList="hiddenInfoList"/>
</div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" v-show="!isDetail">确 定</el-button> <el-button type="primary" @click="submitForm" v-show="!isDetail">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
...@@ -324,9 +359,9 @@ ...@@ -324,9 +359,9 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="指派单位" prop="workAssignEnterproseId"> <el-form-item label="执行单位" prop="workAssignEnterproseId">
<!--<el-input v-model="form.workAssignEnterproseName" placeholder="请输入指派单位名称" />--> <!--<el-input v-model="form.workAssignEnterproseName" placeholder="请输入执行单位名称" />-->
<el-select v-model="workForm.workAssignEnterproseId" placeholder="请选择指派单位名称" style="width: 350px" @change="selectworkAssignEnterprose($event)" :disabled="isEnterproser"> <el-select v-model="workForm.workAssignEnterproseId" placeholder="请选择执行单位名称" style="width: 350px" @change="selectworkAssignEnterprose($event)" :disabled="isEnterproser">
<el-option <el-option
v-for="item in enterprises" v-for="item in enterprises"
:key="item.enterpriseId" :key="item.enterpriseId"
...@@ -337,9 +372,9 @@ ...@@ -337,9 +372,9 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="指派人" prop="workAssignMan"> <el-form-item label="执行人" prop="workAssignMan">
<!--<el-input v-model="form.workAssignManId" placeholder="请输入指派人" />--> <!--<el-input v-model="form.workAssignManId" placeholder="请输入执行人" />-->
<el-select v-model="workForm.workAssignManId" placeholder="请输入指派人" style="width: 350px" @change="selectInspection($event,'work')"> <el-select v-model="workForm.workAssignManId" placeholder="请输入执行人" style="width: 350px" @change="selectInspection($event,'work')">
<el-option <el-option
v-for="item in inspectors" v-for="item in inspectors"
:key="item.userId " :key="item.userId "
...@@ -406,6 +441,37 @@ ...@@ -406,6 +441,37 @@
<el-button @click="cancelFeedBook">取 消</el-button> <el-button @click="cancelFeedBook">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 隐患反馈信息 -->
<el-dialog :title="title" :visible.sync="hiddenFeedOpen" width="900px" append-to-body @close="cancelHiddenFeedForm">
<el-form ref="hiddenFeedForm" :model="hiddenFeedForm" :rules="hiddenFeedRules" label-width="80px">
<el-row>
<el-col :span="12">
<el-form-item label="任务标题" prop="workTitle">
<span>{{hiddenFeedForm.workTitle}}</span>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务类型" prop="workType">
<span v-if="hiddenFeedForm.workType == '1'">入户安检</span>
<span v-if="hiddenFeedForm.workType == '2'">巡检</span>
<!-- <span v-if="feedBookForm.workType == '3'">报警巡查</span>-->
<span v-if="hiddenFeedForm.workType == '4'">其他</span>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="隐患信息" prop="hiddenInfo">
<HiddenFeedTrouble
:workId="hiddenFeedForm.workId"
:isView="false"
ref="hiddenChild"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitHiddenFeedForm">确 定</el-button>
<el-button @click="cancelHiddenFeedForm">取 消</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
...@@ -418,15 +484,24 @@ import { enterpriseLists } from "@/api/regulation/info"; ...@@ -418,15 +484,24 @@ import { enterpriseLists } from "@/api/regulation/info";
import { getInspectionUsers } from "@/api/system/user"; import { getInspectionUsers } from "@/api/system/user";
import ScrollPane from "../../../layout/components/TagsView/ScrollPane"; import ScrollPane from "../../../layout/components/TagsView/ScrollPane";
import HiddenTrouble from "./components/HiddenTrouble"; import HiddenTrouble from "./components/HiddenTrouble";
import HiddenFeedTrouble from "./components/HiddenFeedTrouble"
export default { export default {
name: "Order", name: "Order",
components: { components: {
ScrollPane, ScrollPane,
Editor, Editor,
MyFileUpload, MyFileUpload,
HiddenTrouble HiddenTrouble,
HiddenFeedTrouble
}, },
data() { data() {
const validateHiddenFeedInfo = (rule, value, callback) => {
if (this.$refs.hiddenChild.checkChildData()) {
callback(new Error("隐患信息不能为空！"));
} else {
callback();
}
};
return { return {
isOpen:false, isOpen:false,
// 遮罩层 // 遮罩层
...@@ -500,7 +575,7 @@ export default { ...@@ -500,7 +575,7 @@ export default {
{ required: true, message: "任务内容", trigger: "blur" } { required: true, message: "任务内容", trigger: "blur" }
], ],
workAssignEnterproseId: [ workAssignEnterproseId: [
{ required: true, message: "指派单位", trigger: "blur" } { required: true, message: "执行单位", trigger: "blur" }
], ],
expiryDate: [ expiryDate: [
{ required: true, message: "截止时间", trigger: "blur" } { required: true, message: "截止时间", trigger: "blur" }
...@@ -509,10 +584,10 @@ export default { ...@@ -509,10 +584,10 @@ export default {
//任务下发表单校验 //任务下发表单校验
workRules: { workRules: {
workAssignEnterproseId: [ workAssignEnterproseId: [
{ required: true, message: "指派单位", trigger: "blur" } { required: true, message: "执行单位", trigger: "blur" }
], ],
workAssignMan: [ workAssignMan: [
{ required: true, message: "指派人", trigger: "blur" } { required: true, message: "执行人", trigger: "blur" }
] ]
}, },
//反馈校验 //反馈校验
...@@ -533,7 +608,17 @@ export default { ...@@ -533,7 +608,17 @@ export default {
}, },
feedBookOpen: false, feedBookOpen: false,
//详情隐患信息 //详情隐患信息
hiddenInfoList:[] hiddenInfoList:[],
hiddenFeedOpen:false,
hiddenFeedForm:{
hiddenList:[]
},
//反馈校验
hiddenFeedRules: {
hiddenInfo: [
{ type: "array", validator: validateHiddenFeedInfo, required: true }
]
}
}; };
}, },
...@@ -642,6 +727,7 @@ export default { ...@@ -642,6 +727,7 @@ export default {
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "修改燃气任务"; this.title = "修改燃气任务";
this.getHiddenInfos({workId : workId});
this.getEnterpriseLists(); this.getEnterpriseLists();
this.getInspectionUserList(response.data.workAssignEnterproseId); this.getInspectionUserList(response.data.workAssignEnterproseId);
}); });
...@@ -707,7 +793,7 @@ export default { ...@@ -707,7 +793,7 @@ export default {
showPicture(row){ showPicture(row){
this.$refs['a'+row.workId].showViewer = true; this.$refs['a'+row.workId].showViewer = true;
}, },
//指派单位 //执行单位
getEnterpriseLists(){ getEnterpriseLists(){
const param = {}; const param = {};
this.judgeOperateType(param); this.judgeOperateType(param);
...@@ -715,7 +801,7 @@ export default { ...@@ -715,7 +801,7 @@ export default {
this.enterprises = response.rows; this.enterprises = response.rows;
}); });
}, },
//根据用户角色和操作类型设置指派人是否可选 //根据用户角色和操作类型设置执行人是否可选
judgeOperateType(param){ judgeOperateType(param){
if(this.roleType != "zhengfu"){ if(this.roleType != "zhengfu"){
param.enterpriseId = this.$store.state.user.enterpriseId; param.enterpriseId = this.$store.state.user.enterpriseId;
...@@ -735,7 +821,7 @@ export default { ...@@ -735,7 +821,7 @@ export default {
this.inspectors = response.data; this.inspectors = response.data;
}) })
}, },
//选择指派单位 //选择执行单位
selectworkAssignEnterprose(enterpriseId){ selectworkAssignEnterprose(enterpriseId){
this.form.workAssignManId = ""; this.form.workAssignManId = "";
this.workForm.workAssignManId = ""; this.workForm.workAssignManId = "";
...@@ -745,7 +831,7 @@ export default { ...@@ -745,7 +831,7 @@ export default {
let enterpriseName = this.enterprises.find(val=>val.enterpriseId == enterpriseId).enterpriseName; let enterpriseName = this.enterprises.find(val=>val.enterpriseId == enterpriseId).enterpriseName;
this.form.workAssignEnterproseName = enterpriseName; this.form.workAssignEnterproseName = enterpriseName;
}, },
//获取指派人 //获取执行人
selectInspection(userId,type){ selectInspection(userId,type){
if(userId){ if(userId){
let userName = this.inspectors.find(val=>val.userId == userId).userName; let userName = this.inspectors.find(val=>val.userId == userId).userName;
...@@ -777,11 +863,13 @@ export default { ...@@ -777,11 +863,13 @@ export default {
this.open = true; this.open = true;
this.title = "燃气任务详情"; this.title = "燃气任务详情";
this.form = response.data; this.form = response.data;
if(this.form.workStatus == '2' || this.form.workStatus == '3'){ /*if(this.form.workStatus == '2' || this.form.workStatus == '3'){
const param = {}; const param = {};
param.workId = this.form.workId; param.workId = this.form.workId;
this.getHiddenInfos(param);
} }*/
//查询隐患信息
this.getHiddenInfos({workId : this.form.workId});
this.getEnterpriseLists(); this.getEnterpriseLists();
this.getInspectionUserList(response.data.workAssignEnterproseId); this.getInspectionUserList(response.data.workAssignEnterproseId);
}); });
...@@ -915,11 +1003,43 @@ export default { ...@@ -915,11 +1003,43 @@ export default {
getHiddenInfos(param){ getHiddenInfos(param){
hiddenTroubleList(param).then(res =>{ hiddenTroubleList(param).then(res =>{
this.hiddenInfoList = res.data; this.hiddenInfoList = res.data;
this.hiddenInfoList.forEach(item=>{ /*this.hiddenInfoList.forEach(item=>{
item.reportPersonName = item.reportPerson; item.reportPersonName = item.reportPerson;
}) })*/
}); });
},
//隐患信息反馈
hiddenFeed(row){
this.title = "隐患反馈信息";
this.hiddenFeedOpen = true;
this.hiddenFeedForm.workId = row.workId;
this.hiddenFeedForm.workTitle = row.workTitle;
this.hiddenFeedForm.workType = row.workType;
},
//隐患反馈提交
submitHiddenFeedForm(){
this.$refs["hiddenFeedForm"].validate(valid => {
if (valid) {
this.msgSuccess("隐患信息反馈成功");
this.hiddenFeedOpen = false;
this.getList();
} }
});
},
//隐患反馈取消
cancelHiddenFeedForm(){
this.hiddenFeedOpen = false;
this.hiddenFeedForm = {hiddenList:[]};
this.fileList = [];
},
} }
}; };
</script> </script>
<style lang="scss" scoped>
.hiddenInfo{
font-weight: 700;
font-size: 18px;
margin-left: 12px;
margin-bottom: 9px;
}
</style>
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Cg.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 17:15:31 * @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-26 17:14:12 * @LastEditTime: 2022-03-29 11:11:54
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
--> -->
<template> <template>
<div class="czcard"> <div class="chars-card">
<my-collapse title="储罐" ref="myCollapse"> <my-collapse
title="储罐"
ref="myCollapse"
:listNum="czList.filter((item) => item.show).length"
>
<template v-slot:chackbox> <template v-slot:chackbox>
<div <FilterVue2
:filterList="filterList"
@fliterTypeChange="fliterTypeChange"
/>
<!-- <div
class="filter" class="filter"
:class="`one-${item.state}`" :class="`one-${item.state}`"
v-for="item in filterList" v-for="item in filterList"
...@@ -24,18 +32,62 @@ ...@@ -24,18 +32,62 @@
>{{ item.value }}</span >{{ item.value }}</span
> >
<span class="number">({{ item.count }})</span> <span class="number">({{ item.count }})</span>
</div> </div> -->
</template> </template>
<template #container> <template #container>
<div class="container flex"> <div class="container flex">
<div <div
class="com" class="com"
v-for="item in czList" v-for="(item, index) in czList"
:key="item.deviceName" :key="item.deviceName"
v-show="item.show" v-show="item.show"
> >
<div :title="item.companyName" class="left zzz">{{ item.companyName }}</div> <el-popover
<div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div> :ref="'popo' + index"
placement="right-end"
width="330"
trigger="click"
popper-class="paddingnone"
>
<div class="cz-item">
<div class="title">
<div class="text">
{{ item.companyName }}
</div>
<div @click="change(index)" class="x">
<i class="iconfont icon-x"></i>
</div>
</div>
<CzItem
ref="czItem"
:list="item"
:changeStyle="true"
:stateType="stateType"
/>
</div>
<template slot="reference">
<div class="flex">
<div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div
:class="`one-${item.state}`"
class="state"
@click="change"
>
{{ typeState[item.state - 1] }}
</div>
</div>
</template>
<!-- <el-button slot="reference">click 激活</el-button> -->
</el-popover>
<!-- <div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div :class="`one-${item.state}`" class="state">
{{ typeState[item.state - 1] }}
</div> -->
</div> </div>
</div> </div>
</template> </template>
...@@ -46,17 +98,21 @@ ...@@ -46,17 +98,21 @@
<script> <script>
import MyCollapse from "./MyCollapse"; import MyCollapse from "./MyCollapse";
import CzItem from "./CzItem"; import CzItem from "./CzItem";
import FilterVue2 from "./FilterVue2";
// 场罐
export default { export default {
components: { components: {
MyCollapse, MyCollapse,
CzItem, CzItem,
FilterVue2,
}, },
data() { data() {
return { return {
carHide: true, carHide: true,
visible: true,
addStartNum: 3, addStartNum: 3,
filterList: [ filterList: [
{ value: "全部", count: 100, state: "all" },
{ value: "正常", count: 100, state: 1 }, { value: "正常", count: 100, state: 1 },
{ value: "报警", count: 100, state: 2 }, { value: "报警", count: 100, state: 2 },
{ value: "离线", count: 100, state: 3 }, { value: "离线", count: 100, state: 3 },
...@@ -64,25 +120,148 @@ export default { ...@@ -64,25 +120,148 @@ export default {
typeState: ["正常", "报警", "离线"], typeState: ["正常", "报警", "离线"],
deviceTypeArr: [1, 2, 3], deviceTypeArr: [1, 2, 3],
czList: [ czList: [
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, {
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, companyName: "河北泽宏股份储罐",
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, state: 1,
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, c: 54,
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, d: 15,
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, e: 56,
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, image: "",
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, show: true,
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, popoVidible: true,
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, },
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, {
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, companyName: "河北泽宏股份储罐",
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, state: 2,
{ companyName: "河北泽宏股份储罐", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份储罐", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份储罐", state: 3, show: true }, c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份储罐",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份储罐",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份储罐",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份储罐",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
], ],
stateType: {
1: "正常",
2: "报警",
3: "离线",
},
}; };
}, },
computed: { computed: {
...@@ -98,6 +277,9 @@ export default { ...@@ -98,6 +277,9 @@ export default {
hide() { hide() {
this.carHide = !this.carHide; this.carHide = !this.carHide;
}, },
change(index) {
this.$refs["popo" + index][0].showPopper = false;
},
// 根据父子元素自动计算是否需要添加值start // 根据父子元素自动计算是否需要添加值start
changeAddStartNum() { changeAddStartNum() {
const czItem = this.$refs.czItem; const czItem = this.$refs.czItem;
...@@ -118,18 +300,14 @@ export default { ...@@ -118,18 +300,14 @@ export default {
}, },
//过滤选择 //过滤选择
fliterTypeChange(data) { fliterTypeChange(data) {
const { state } = data; // const { state } = data;
const index = this.deviceTypeArr.indexOf(state); // const index = this.deviceTypeArr.indexOf(state);
if (index >= 0) { // if (index >= 0) {
this.deviceTypeArr.splice(index, 1); // this.deviceTypeArr.splice(index, 1);
} else { // } else {
this.deviceTypeArr.push(state); // this.deviceTypeArr.push(state);
} // }
this.filter(this.deviceTypeArr); this.filter([...data]);
// 改变大小
this.$nextTick(() => {
this.$refs.myCollapse.getHeight();
});
}, },
// 过滤对象 // 过滤对象
filter(arr) { filter(arr) {
...@@ -170,7 +348,6 @@ $active: #06d7b1 !important; ...@@ -170,7 +348,6 @@ $active: #06d7b1 !important;
top: 50%; top: 50%;
margin-top: -3px; margin-top: -3px;
} }
&.active { &.active {
color: $active; color: $active;
} }
...@@ -188,33 +365,18 @@ $active: #06d7b1 !important; ...@@ -188,33 +365,18 @@ $active: #06d7b1 !important;
.text { .text {
color: $one; color: $one;
} }
.text {
&:before {
background-color: $one;
}
}
} }
&.one-2 { &.one-2 {
.number, .number,
.text { .text {
color: $two; color: $two;
} }
.text {
&:before {
background-color: $two;
}
}
} }
&.one-3 { &.one-3 {
.number, .number,
.text { .text {
color: $three; color: $three;
} }
.text {
&:before {
background-color: $three;
}
}
} }
} }
.container { .container {
...@@ -223,23 +385,25 @@ $active: #06d7b1 !important; ...@@ -223,23 +385,25 @@ $active: #06d7b1 !important;
margin-left: 35px; margin-left: 35px;
&.start { &.start {
justify-content: flex-start; // justify-content: flex-start;
& > div { & > div {
// margin-right: 50px; // margin-right: 50px;
} }
} }
& > div { .com {
margin-bottom: 20px; margin-bottom: 20px;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
// margin-right: 45px; // margin-right: 45px;
width: 15%; width: 15%;
min-width: 190px; min-width: 190px;
margin-right: 1%; margin-right: 1.5%;
.left { .left {
margin-right: 4px; margin-right: 4px;
font-size: 14px; font-size: 14px;
max-width: 112px; max-width: 112px;
cursor: pointer;
} }
.state { .state {
font-size: 8px; font-size: 8px;
...@@ -257,17 +421,47 @@ $active: #06d7b1 !important; ...@@ -257,17 +421,47 @@ $active: #06d7b1 !important;
border-radius: 2px; border-radius: 2px;
background-color: #ff6c68; background-color: #ff6c68;
} }
&.one-3{ &.one-3 {
color: #fff; color: #fff;
border: 1px solid #AAAAAA; border: 1px solid #aaaaaa;
border-radius: 2px; border-radius: 2px;
background-color: #bbbbbb; background-color: #bbbbbb;
} }
} }
} }
} }
.flex { .flex {
display: flex; display: flex;
justify-content: flex-start; // justify-content: flex-start;
}
.cz-item {
.title {
display: flex;
justify-content: space-between;
// height: 20px;
border-bottom: 1px solid #e6ebf5;
box-sizing: border-box;
padding: 13px 0px 6px 10px;
.text {
font-size: 13px;
color: #666666;
padding-left: 10px;
}
.x {
color: #666666;
padding-right: 10px;
cursor: pointer;
.iconfont {
font-size: 12px;
&::hover {
color: #000000;
}
}
}
}
}
.paddingnone {
padding: 0;
} }
</style> </style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 17:15:31 * @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-26 17:12:04 * @LastEditTime: 2022-03-29 10:09:52
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
...@@ -9,21 +9,24 @@ ...@@ -9,21 +9,24 @@
<template> <template>
<div class="czcard"> <div class="czcard">
<my-collapse title="场站" ref="myCollapse"> <my-collapse
<template v-slot:chackbox> title="场站"
<div class="filter" v-for="item in filterList" :key="item.value"> ref="myCollapse"
<span :listNum="czList.filter((item) => item.show).length"
class="text"
:class="{ active: deviceTypeArr.indexOf(item.type) >= 0 }"
@click="fliterTypeChange(item)"
>{{ item.value }}</span
> >
<span class="number">({{ item.count }})</span> <template v-slot:chackbox>
</div> <FilterVue
:filterList="filterList"
@fliterTypeChange="fliterTypeChange"
/>
</template> </template>
<template #container> <template #container>
<div class="container" :class="{ start: getShowNum }"> <div class="container" :class="{ start: getShowNum }">
<div v-for="item in czList" :key="item.deviceName" v-show="item.show"> <div
v-for="(item, index) in czList"
:key="item.deviceName + index"
v-show="item.show"
>
<CzItem ref="czItem" :list="item" v-if="item.show" /> <CzItem ref="czItem" :list="item" v-if="item.show" />
</div> </div>
</div> </div>
...@@ -35,29 +38,31 @@ ...@@ -35,29 +38,31 @@
<script> <script>
import MyCollapse from "./MyCollapse"; import MyCollapse from "./MyCollapse";
import CzItem from "./CzItem"; import CzItem from "./CzItem";
import FilterVue from "./FilterVue";
export default { export default {
// 场站
components: { components: {
MyCollapse, MyCollapse,
CzItem, CzItem,
FilterVue,
}, },
data() { data() {
return { return {
carHide: true, carHide: true,
addStartNum: 3, addStartNum: 3,
filterList: [ filterList: [
{ value: "全部", count: 100, type: "all" },
{ value: "加气站", count: 100, type: 1 }, { value: "加气站", count: 100, type: 1 },
{ value: "加气站1", count: 100, type: 2 }, { value: "门站", count: 100, type: 2 },
{ value: "加气站2", count: 100, type: 3 }, { value: "调压站", count: 100, type: 3 },
{ value: "加气站3", count: 100, type: 4 }, { value: "储备站", count: 100, type: 4 },
{ value: "加气站4", count: 100, type: 5 }, { value: "气化站", count: 100, type: 5 },
{ value: "加气站5", count: 100, type: 6 },
{ value: "加气站7", count: 100, type: 7 },
], ],
deviceTypeArr: [1, 2, 3, 4, 5, 6, 7], deviceTypeArr: [1, 2, 3, 4, 5],
czList: [ czList: [
{ {
deviceName: "加气站a", deviceName: "加气站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -69,8 +74,8 @@ export default { ...@@ -69,8 +74,8 @@ export default {
type: 1, type: 1,
}, },
{ {
deviceName: "加气站b", deviceName: "门站",
state: 1, state: 2,
a: 25, a: 25,
b: 56, b: 56,
c: 54, c: 54,
...@@ -81,7 +86,7 @@ export default { ...@@ -81,7 +86,7 @@ export default {
type: 2, type: 2,
}, },
{ {
deviceName: "加气站c", deviceName: "调压站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -93,7 +98,7 @@ export default { ...@@ -93,7 +98,7 @@ export default {
type: 3, type: 3,
}, },
{ {
deviceName: "加气站d", deviceName: "储备站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -105,7 +110,7 @@ export default { ...@@ -105,7 +110,7 @@ export default {
type: 4, type: 4,
}, },
{ {
deviceName: "加气站e", deviceName: "气化站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -114,10 +119,10 @@ export default { ...@@ -114,10 +119,10 @@ export default {
e: 56, e: 56,
image: "", image: "",
show: true, show: true,
type: 4, type: 5,
}, },
{ {
deviceName: "加气站f", deviceName: "气化站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -126,10 +131,10 @@ export default { ...@@ -126,10 +131,10 @@ export default {
e: 56, e: 56,
image: "", image: "",
show: true, show: true,
type: 4, type: 5,
}, },
{ {
deviceName: "加气站g", deviceName: "储备站",
state: 1, state: 1,
a: 25, a: 25,
b: 56, b: 56,
...@@ -140,7 +145,6 @@ export default { ...@@ -140,7 +145,6 @@ export default {
show: true, show: true,
type: 4, type: 4,
}, },
], ],
}; };
}, },
...@@ -156,6 +160,7 @@ export default { ...@@ -156,6 +160,7 @@ export default {
methods: { methods: {
hide() { hide() {
this.carHide = !this.carHide; this.carHide = !this.carHide;
// this.myCollapse();
}, },
// 根据父子元素自动计算是否需要添加值start // 根据父子元素自动计算是否需要添加值start
changeAddStartNum() { changeAddStartNum() {
...@@ -177,18 +182,16 @@ export default { ...@@ -177,18 +182,16 @@ export default {
}, },
//过滤选择 //过滤选择
fliterTypeChange(data) { fliterTypeChange(data) {
const { type } = data; this.filter([...data]);
const index = this.deviceTypeArr.indexOf(type); // 改变大小,因为动画原因加个延迟
if (index >= 0) { // this.$nextTick(() => {
this.deviceTypeArr.splice(index, 1); // setTimeout(()=>{
} else { // this.myCollapse()
this.deviceTypeArr.push(type); // }, 300);
} // });
this.filter(this.deviceTypeArr); },
// 改变大小 myCollapse() {
this.$nextTick(() => { // this.$refs.myCollapse.getHeight();
this.$refs.myCollapse.getHeight();
});
}, },
// 过滤对象 // 过滤对象
filter(arr) { filter(arr) {
...@@ -206,24 +209,7 @@ export default { ...@@ -206,24 +209,7 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.filter {
margin-right: 12px;
margin-top: 5px;
font-size: 14px;
.text {
cursor: pointer;
&:hover {
color: #06d7b189 !important;
}
&.active {
color: #06d7b1;
}
}
.number {
font-weight: 500;
color: #1890ff;
}
}
.container { .container {
width: 100%; width: 100%;
flex-wrap: wrap; flex-wrap: wrap;
...@@ -236,9 +222,13 @@ export default { ...@@ -236,9 +222,13 @@ export default {
} }
& > div { & > div {
margin-bottom: 20px; margin-bottom: 20px;
margin-left:1%; margin-left: 1%;
width: 24%; width: 24%;
min-width: 295px; min-width: 295px;
border: 1px solid #e6ebf5;
border-radius: 4px;
box-sizing: border-box;
} }
} }
.flex { .flex {
......
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzItem.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-26 10:27:00 * @Date: 2022-03-26 10:27:00
* @LastEditTime: 2022-03-26 16:38:29 * @LastEditTime: 2022-03-28 18:03:04
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzItem.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzItem.vue
--> -->
<template> <template>
<div class="czitem flex"> <div class="czitem flex" :class="{nopadding:changeStyle}">
<div class="left"> <div class="left">
<div class="img"> <div class="img">
<div class="state"> <div class="state" :class="{active1:list.state=='1',active2:list.state=='2',active3:list.state=='3'}">
{{ list.state == "0" ? "正常" : "报警" }} {{ stateType[list.state] }}
</div> </div>
<img v-if="list.src" src="" alt="" /> <img v-if="list.src" src="" alt="" />
暂无图片 暂无图片
</div> </div>
<div v-unValue class="device-name zzz">{{ list.deviceName }}</div> <div v-if="!changeStyle" v-unValue class="device-name zzz">{{ list.deviceName }}</div>
</div> </div>
<div class="right"> <div class="right">
<div>温度：<span :class="{active:list.a>50}">{{list.a}}°C</span></div> <div>
<div>水温：<span :class="{active:list.b>50}">{{list.b}}°C</span></div> 温度：<span :class="{ active: list.a > 50 }">{{ list.a }}°C</span>
<div>压力：<span :class="{active:list.c>50}">{{list.c}}Pa</span></div> </div>
<div>湿度：<span :class="{active:list.d>50}">{{list.d}}°C</span></div> <div>
<div>水温：<span :class="{active:list.e>50}">{{list.e}}°C</span></div> 水温：<span :class="{ active: list.b > 50 }">{{ list.b }}°C</span>
</div>
<div>
压力：<span :class="{ active: list.c > 50 }">{{ list.c }}Pa</span>
</div>
<div>
湿度：<span :class="{ active: list.d > 50 }">{{ list.d }}°C</span>
</div>
<div>
水温：<span :class="{ active: list.e > 50 }">{{ list.e }}°C</span>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
// 场站子组件
props: { props: {
list: { list: {
type: Object, type: Object,
}, },
// 从外部传一个值，来改变一些样式
changeStyle:{
type:Boolean,
default:false,
},
stateType:{
type:Object,
default:()=>({"1":"正常",2:"报警"})
}
}, },
}; };
</script> </script>
...@@ -46,8 +68,6 @@ export default { ...@@ -46,8 +68,6 @@ export default {
min-height: 191px; min-height: 191px;
padding: 14px 12px 18px 25px; padding: 14px 12px 18px 25px;
box-sizing: border-box; box-sizing: border-box;
border-radius: 4px;
border: 1px solid #e6ebf5;
// display: flex; // display: flex;
.left { .left {
// margin-right: 48px; // margin-right: 48px;
...@@ -73,6 +93,15 @@ export default { ...@@ -73,6 +93,15 @@ export default {
line-height: 28px; line-height: 28px;
color: #06d7b1; color: #06d7b1;
font-size: 14px; font-size: 14px;
&.active1 {
color: #06d7b1;
}
&.active2 {
color: #FF6C68;
}
&.active3 {
color: #bbbbbb;
}
} }
img { img {
width: 100%; width: 100%;
...@@ -90,7 +119,7 @@ export default { ...@@ -90,7 +119,7 @@ export default {
min-width: 80px; min-width: 80px;
& > div { & > div {
margin-bottom: 10px; margin-bottom: 10px;
span.active{ span.active {
color: red; color: red;
} }
} }
...@@ -100,4 +129,8 @@ export default { ...@@ -100,4 +129,8 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.nopadding{
padding-bottom:0 !important;
min-height:170px;
}
</style> </style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/FilterVue.vue 0 → 100644
View file @ 7617257a
<!--
* @Author: your name
* @Date: 2022-03-29 09:41:23
* @LastEditTime: 2022-03-29 11:08:25
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Filter.vue
-->
<template>
<div class="fliter-vue">
<div class="filter" v-for="(item, index) in filterList" :key="item.value">
<!-- 全部 -->
<template v-if="index == 0">
<span
class="text"
:class="{
active: deviceTypeArr.length == filterList.length - 1
}"
@click="fliterTypeChange(item)"
>{{ item.value }}
<i class="iconfont icon-bingo"></i>
</span>
<span class="number">({{ item.count }})</span>
</template>
<template v-else>
<span
class="text"
:class="{ active: deviceTypeArr.indexOf(item.type) >= 0 }"
@click="fliterTypeChange(item)"
>{{ item.value }}
<i class="iconfont icon-bingo"></i>
</span>
<span class="number">({{ item.count }})</span>
</template>
</div>
</div>
</template>
<script>
export default {
data() {
return {
deviceTypeArr: [],
allArray: [],
};
},
props: {
// 传进来的参数
filterList: Array,
},
created() {
this.deviceTypeArr = this.filterList
.filter((item) => item.type > 0)
.map((item) => item.type);
// 全选时的数组内容
this.allArray = [...this.deviceTypeArr];
},
methods: {
fliterTypeChange(data) {
const { type } = data;
// 如果点的是全选
if (type == "all") {
if (this.deviceTypeArr.length == this.filterList.length - 1) {
this.deviceTypeArr = [];
} else {
this.deviceTypeArr = [...this.allArray];
}
} else {
const index = this.deviceTypeArr.indexOf(type);
if (index >= 0) {
this.deviceTypeArr.splice(index, 1);
} else {
this.deviceTypeArr.push(type);
}
}
this.$emit("fliterTypeChange", [...this.deviceTypeArr]);
},
},
};
</script>
<style lang="scss" scoped>
.fliter-vue {
display: flex;
}
.filter {
margin-right: 30px;
margin-top: 5px;
font-size: 14px;
.text {
cursor: pointer;
position: relative;
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
top: 0px;
color: rgba(0, 0, 0, 0);
}
&:before {
content: "";
position: absolute;
width: 10px;
height: 10px;
border: 1px solid #000000;
left: -12px;
top: 50%;
margin-top: -5px;
}
&:hover {
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
color: rgba(0, 0, 0, .5);
}
}
&.active {
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
color: rgba(0, 0, 0, 1);
}
}
}
.number {
font-weight: 500;
color: #1890ff;
}
}
</style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/FilterVue2.vue 0 → 100644
View file @ 7617257a
<!--
* @Author: your name
* @Date: 2022-03-29 09:41:23
* @LastEditTime: 2022-03-29 11:14:11
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Filter.vue
-->
<template>
<div class="fliter-vue">
<div
class="filter"
v-for="(item, index) in filterList"
:key="item.value"
:class="`one-${item.state}`"
>
<!-- 全部 -->
<template v-if="index == 0">
<span
class="text"
@click="fliterTypeChange(item)"
:class="{ active: deviceTypeArr.length == filterList.length - 1}"
>{{ item.value }}
<i class="iconfont icon-bingo"></i>
</span>
<span class="number">({{ item.count }})</span>
</template>
<template v-else>
<span
class="text"
:class="{ active: deviceTypeArr.indexOf(item.state) >= 0 }"
@click="fliterTypeChange(item)"
>{{ item.value }}
<i class="iconfont icon-bingo"></i>
</span>
<span class="number">({{ item.count }})</span>
</template>
</div>
</div>
</template>
<script>
export default {
data() {
return {
deviceTypeArr: [],
allArray: [],
};
},
props: {
// 传进来的参数
filterList: Array,
},
created() {
this.deviceTypeArr = this.filterList
.filter((item) => item.state > 0)
.map((item) => item.state);
// 全选时的数组内容
this.allArray = [...this.deviceTypeArr];
},
methods: {
fliterTypeChange(data) {
const { state } = data;
// 如果点的是全选
if (state == "all") {
if (this.deviceTypeArr.length == this.filterList.length - 1) {
this.deviceTypeArr = [];
} else {
this.deviceTypeArr = [...this.allArray];
}
} else {
const index = this.deviceTypeArr.indexOf(state);
if (index >= 0) {
this.deviceTypeArr.splice(index, 1);
} else {
this.deviceTypeArr.push(state);
}
}
this.$emit("fliterTypeChange", [...this.deviceTypeArr]);
},
},
};
</script>
<style lang="scss" scoped>
$one: #06d7b1 !important;
$two: #ff6c68 !important;
$three: #bbbbbb !important;
$all: #000000;
.fliter-vue {
display: flex;
}
.filter {
margin-right: 30px;
margin-top: 5px;
font-size: 14px;
.text {
cursor: pointer;
position: relative;
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
top: 0px;
color: rgba(0, 0, 0, 0);
}
&:before {
content: "";
position: absolute;
width: 10px;
height: 10px;
border: 1px solid #000000;
left: -12px;
top: 50%;
margin-top: -5px;
}
&:hover {
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
color: rgba(0, 0, 0, .5);
}
}
&.active {
.iconfont {
font-size: 10px;
position: absolute;
left: -12px;
color: rgba(0, 0, 0, 1);
}
}
}
.number {
font-weight: 500;
color: #1890ff !important;
}
&.one-all {
.number,
.text {
color: $all;
}
}
&.one-1 {
.number,
.text {
color: $one;
}
}
&.one-2 {
.number,
.text {
color: $two;
}
}
&.one-3 {
.number,
.text {
color: $three;
}
}
}
</style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Fmj.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 17:15:31 * @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-26 17:16:36 * @LastEditTime: 2022-03-29 11:12:39
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
--> -->
<template> <template>
<div class="czcard"> <div class="chars-card">
<my-collapse title="阀门井" ref="myCollapse"> <my-collapse
title="阀门井"
ref="myCollapse"
:listNum="czList.filter((item) => item.show).length"
>
<template v-slot:chackbox> <template v-slot:chackbox>
<div <FilterVue2
:filterList="filterList"
@fliterTypeChange="fliterTypeChange"
/>
<!-- <div
class="filter" class="filter"
:class="`one-${item.state}`" :class="`one-${item.state}`"
v-for="item in filterList" v-for="item in filterList"
...@@ -24,18 +32,62 @@ ...@@ -24,18 +32,62 @@
>{{ item.value }}</span >{{ item.value }}</span
> >
<span class="number">({{ item.count }})</span> <span class="number">({{ item.count }})</span>
</div> </div> -->
</template> </template>
<template #container> <template #container>
<div class="container flex"> <div class="container flex">
<div <div
class="com" class="com"
v-for="item in czList" v-for="(item, index) in czList"
:key="item.deviceName" :key="item.deviceName"
v-show="item.show" v-show="item.show"
> >
<div :title="item.companyName" class="left zzz">{{ item.companyName }}</div> <el-popover
<div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div> :ref="'popo' + index"
placement="right-end"
width="330"
trigger="click"
popper-class="paddingnone"
>
<div class="cz-item">
<div class="title">
<div class="text">
{{ item.companyName }}
</div>
<div @click="change(index)" class="x">
<i class="iconfont icon-x"></i>
</div>
</div>
<CzItem
ref="czItem"
:list="item"
:changeStyle="true"
:stateType="stateType"
/>
</div>
<template slot="reference">
<div class="flex">
<div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div
:class="`one-${item.state}`"
class="state"
@click="change"
>
{{ typeState[item.state - 1] }}
</div>
</div>
</template>
<!-- <el-button slot="reference">click 激活</el-button> -->
</el-popover>
<!-- <div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div :class="`one-${item.state}`" class="state">
{{ typeState[item.state - 1] }}
</div> -->
</div> </div>
</div> </div>
</template> </template>
...@@ -46,17 +98,21 @@ ...@@ -46,17 +98,21 @@
<script> <script>
import MyCollapse from "./MyCollapse"; import MyCollapse from "./MyCollapse";
import CzItem from "./CzItem"; import CzItem from "./CzItem";
import FilterVue2 from "./FilterVue2";
// 场罐
export default { export default {
components: { components: {
MyCollapse, MyCollapse,
CzItem, CzItem,
FilterVue2,
}, },
data() { data() {
return { return {
carHide: true, carHide: true,
visible: true,
addStartNum: 3, addStartNum: 3,
filterList: [ filterList: [
{ value: "全部", count: 100, state: "all" },
{ value: "正常", count: 100, state: 1 }, { value: "正常", count: 100, state: 1 },
{ value: "报警", count: 100, state: 2 }, { value: "报警", count: 100, state: 2 },
{ value: "离线", count: 100, state: 3 }, { value: "离线", count: 100, state: 3 },
...@@ -64,25 +120,148 @@ export default { ...@@ -64,25 +120,148 @@ export default {
typeState: ["正常", "报警", "离线"], typeState: ["正常", "报警", "离线"],
deviceTypeArr: [1, 2, 3], deviceTypeArr: [1, 2, 3],
czList: [ czList: [
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, {
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, companyName: "河北泽宏股份阀门井",
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, state: 1,
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, c: 54,
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, d: 15,
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, e: 56,
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, image: "",
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, show: true,
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, popoVidible: true,
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, },
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, {
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, companyName: "河北泽宏股份阀门井",
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, state: 2,
{ companyName: "河北泽宏股份阀门井", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份阀门井", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份阀门井", state: 3, show: true }, c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份阀门井",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份阀门井",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份阀门井",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份阀门井",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
], ],
stateType: {
1: "正常",
2: "报警",
3: "离线",
},
}; };
}, },
computed: { computed: {
...@@ -98,6 +277,9 @@ export default { ...@@ -98,6 +277,9 @@ export default {
hide() { hide() {
this.carHide = !this.carHide; this.carHide = !this.carHide;
}, },
change(index) {
this.$refs["popo" + index][0].showPopper = false;
},
// 根据父子元素自动计算是否需要添加值start // 根据父子元素自动计算是否需要添加值start
changeAddStartNum() { changeAddStartNum() {
const czItem = this.$refs.czItem; const czItem = this.$refs.czItem;
...@@ -118,18 +300,14 @@ export default { ...@@ -118,18 +300,14 @@ export default {
}, },
//过滤选择 //过滤选择
fliterTypeChange(data) { fliterTypeChange(data) {
const { state } = data; // const { state } = data;
const index = this.deviceTypeArr.indexOf(state); // const index = this.deviceTypeArr.indexOf(state);
if (index >= 0) { // if (index >= 0) {
this.deviceTypeArr.splice(index, 1); // this.deviceTypeArr.splice(index, 1);
} else { // } else {
this.deviceTypeArr.push(state); // this.deviceTypeArr.push(state);
} // }
this.filter(this.deviceTypeArr); this.filter([...data]);
// 改变大小
this.$nextTick(() => {
this.$refs.myCollapse.getHeight();
});
}, },
// 过滤对象 // 过滤对象
filter(arr) { filter(arr) {
...@@ -170,7 +348,6 @@ $active: #06d7b1 !important; ...@@ -170,7 +348,6 @@ $active: #06d7b1 !important;
top: 50%; top: 50%;
margin-top: -3px; margin-top: -3px;
} }
&.active { &.active {
color: $active; color: $active;
} }
...@@ -188,33 +365,18 @@ $active: #06d7b1 !important; ...@@ -188,33 +365,18 @@ $active: #06d7b1 !important;
.text { .text {
color: $one; color: $one;
} }
.text {
&:before {
background-color: $one;
}
}
} }
&.one-2 { &.one-2 {
.number, .number,
.text { .text {
color: $two; color: $two;
} }
.text {
&:before {
background-color: $two;
}
}
} }
&.one-3 { &.one-3 {
.number, .number,
.text { .text {
color: $three; color: $three;
} }
.text {
&:before {
background-color: $three;
}
}
} }
} }
.container { .container {
...@@ -223,23 +385,25 @@ $active: #06d7b1 !important; ...@@ -223,23 +385,25 @@ $active: #06d7b1 !important;
margin-left: 35px; margin-left: 35px;
&.start { &.start {
justify-content: flex-start; // justify-content: flex-start;
& > div { & > div {
// margin-right: 50px; // margin-right: 50px;
} }
} }
& > div { .com {
margin-bottom: 20px; margin-bottom: 20px;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
// margin-right: 45px; // margin-right: 45px;
width: 15%; width: 15%;
min-width: 190px; min-width: 190px;
margin-right: 1%; margin-right: 1.5%;
.left { .left {
margin-right: 4px; margin-right: 4px;
font-size: 14px; font-size: 14px;
max-width: 112px; max-width: 112px;
cursor: pointer;
} }
.state { .state {
font-size: 8px; font-size: 8px;
...@@ -257,17 +421,47 @@ $active: #06d7b1 !important; ...@@ -257,17 +421,47 @@ $active: #06d7b1 !important;
border-radius: 2px; border-radius: 2px;
background-color: #ff6c68; background-color: #ff6c68;
} }
&.one-3{ &.one-3 {
color: #fff; color: #fff;
border: 1px solid #AAAAAA; border: 1px solid #aaaaaa;
border-radius: 2px; border-radius: 2px;
background-color: #bbbbbb; background-color: #bbbbbb;
} }
} }
} }
} }
.flex { .flex {
display: flex; display: flex;
justify-content: flex-start; // justify-content: flex-start;
}
.cz-item {
.title {
display: flex;
justify-content: space-between;
// height: 20px;
border-bottom: 1px solid #e6ebf5;
box-sizing: border-box;
padding: 13px 0px 6px 10px;
.text {
font-size: 13px;
color: #666666;
padding-left: 10px;
}
.x {
color: #666666;
padding-right: 10px;
cursor: pointer;
.iconfont {
font-size: 12px;
&::hover {
color: #000000;
}
}
}
}
}
.paddingnone {
padding: 0;
} }
</style> </style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/MyCollapse.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 17:15:31 * @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-26 15:33:25 * @LastEditTime: 2022-03-29 10:12:49
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
> >
<div class="title flex"> <div class="title flex">
<div class="left"> <div class="left">
<div class="device">{{title}}</div> <div class="device">{{ title }}</div>
<slot name="chackbox" /> <slot name="chackbox" />
</div> </div>
<div class="right"> <div class="right">
...@@ -28,8 +28,12 @@ ...@@ -28,8 +28,12 @@
</div> </div>
</div> </div>
<div ref="container"> <div ref="container">
<transition name="fade" mode="out-in">
<div :key="listNum">
<slot name="container" /> <slot name="container" />
</div> </div>
</transition>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -38,9 +42,15 @@ ...@@ -38,9 +42,15 @@
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
export default { export default {
props:{ props: {
title:String, title: String,
// 动画需求
listNum: {
type: Number,
default: "1",
},
}, },
data() { data() {
return { return {
carHide: true, carHide: true,
...@@ -56,25 +66,32 @@ export default { ...@@ -56,25 +66,32 @@ export default {
setTimeout(this.getHeight, 200); setTimeout(this.getHeight, 200);
// this.getHeight(); // this.getHeight();
}, },
listNum(val) {
console.log(val);
setTimeout(() => {
this.getHeight();
}, 300);
},
}, },
mounted() { mounted() {
this.getHeight(); this.getHeight();
}, },
methods: { methods: {
hide() { hide() {
this.carHide = !this.carHide; this.carHide = !this.carHide;
this.getHeight();
}, },
getHeight() { getHeight() {
const { height } = this.$refs?.container?.getBoundingClientRect(); const { height } = this.$refs?.container?.getBoundingClientRect();
if(!height){ // if (!height) {
return;
} // return;
// }
// 高度必须是一个指定的值才能过渡变化，这样就计算出了整个元素的指定高度，然后赋值 // 高度必须是一个指定的值才能过渡变化，这样就计算出了整个元素的指定高度，然后赋值
if (height > 0) { if (height > 0) {
this.transitionHeight = height + 60 + 18 + "px"; this.transitionHeight = height + 60 + 18 + "px";
}else{ } else {
this.transitionHeight="60px"; this.transitionHeight = "60px";
} }
}, },
}, },
...@@ -82,6 +99,13 @@ export default { ...@@ -82,6 +99,13 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.fade-enter-active,
.fade-leave-active {
transition: all 0.25s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
.card { .card {
transition: all 0.5s; transition: all 0.5s;
// height: 212px; // height: 212px;
...@@ -92,12 +116,12 @@ export default { ...@@ -92,12 +116,12 @@ export default {
box-sizing: border-box; box-sizing: border-box;
padding: 15px 22px 18px 22px; padding: 15px 22px 18px 22px;
overflow: hidden; overflow: hidden;
margin-bottom:20px; margin-bottom: 20px;
&.hide { &.hide {
height: 60px !important; height: 60px !important;
} }
.title { .title {
margin-bottom: 12px; margin-bottom: 16px;
margin-left: 40px; margin-left: 40px;
.left { .left {
display: flex; display: flex;
......
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/Tyx.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 17:15:31 * @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-26 17:16:52 * @LastEditTime: 2022-03-29 11:12:33
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
--> -->
<template> <template>
<div class="czcard"> <div class="chars-card">
<my-collapse title="调压箱" ref="myCollapse"> <my-collapse
title="调压箱"
ref="myCollapse"
:listNum="czList.filter((item) => item.show).length"
>
<template v-slot:chackbox> <template v-slot:chackbox>
<div <FilterVue2
:filterList="filterList"
@fliterTypeChange="fliterTypeChange"
/>
<!-- <div
class="filter" class="filter"
:class="`one-${item.state}`" :class="`one-${item.state}`"
v-for="item in filterList" v-for="item in filterList"
...@@ -24,18 +32,62 @@ ...@@ -24,18 +32,62 @@
>{{ item.value }}</span >{{ item.value }}</span
> >
<span class="number">({{ item.count }})</span> <span class="number">({{ item.count }})</span>
</div> </div> -->
</template> </template>
<template #container> <template #container>
<div class="container flex"> <div class="container flex">
<div <div
class="com" class="com"
v-for="item in czList" v-for="(item, index) in czList"
:key="item.deviceName" :key="item.deviceName"
v-show="item.show" v-show="item.show"
> >
<div :title="item.companyName" class="left zzz">{{ item.companyName }}</div> <el-popover
<div :class="`one-${item.state}`" class="state">{{ typeState[item.state - 1] }}</div> :ref="'popo' + index"
placement="right-end"
width="330"
trigger="click"
popper-class="paddingnone"
>
<div class="cz-item">
<div class="title">
<div class="text">
{{ item.companyName }}
</div>
<div @click="change(index)" class="x">
<i class="iconfont icon-x"></i>
</div>
</div>
<CzItem
ref="czItem"
:list="item"
:changeStyle="true"
:stateType="stateType"
/>
</div>
<template slot="reference">
<div class="flex">
<div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div
:class="`one-${item.state}`"
class="state"
@click="change"
>
{{ typeState[item.state - 1] }}
</div>
</div>
</template>
<!-- <el-button slot="reference">click 激活</el-button> -->
</el-popover>
<!-- <div :title="item.companyName" class="left zzz">
{{ item.companyName }}
</div>
<div :class="`one-${item.state}`" class="state">
{{ typeState[item.state - 1] }}
</div> -->
</div> </div>
</div> </div>
</template> </template>
...@@ -46,17 +98,21 @@ ...@@ -46,17 +98,21 @@
<script> <script>
import MyCollapse from "./MyCollapse"; import MyCollapse from "./MyCollapse";
import CzItem from "./CzItem"; import CzItem from "./CzItem";
import FilterVue2 from "./FilterVue2";
// 场罐
export default { export default {
components: { components: {
MyCollapse, MyCollapse,
CzItem, CzItem,
FilterVue2,
}, },
data() { data() {
return { return {
carHide: true, carHide: true,
visible: true,
addStartNum: 3, addStartNum: 3,
filterList: [ filterList: [
{ value: "全部", count: 100, state: "all" },
{ value: "正常", count: 100, state: 1 }, { value: "正常", count: 100, state: 1 },
{ value: "报警", count: 100, state: 2 }, { value: "报警", count: 100, state: 2 },
{ value: "离线", count: 100, state: 3 }, { value: "离线", count: 100, state: 3 },
...@@ -64,25 +120,148 @@ export default { ...@@ -64,25 +120,148 @@ export default {
typeState: ["正常", "报警", "离线"], typeState: ["正常", "报警", "离线"],
deviceTypeArr: [1, 2, 3], deviceTypeArr: [1, 2, 3],
czList: [ czList: [
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, {
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, companyName: "河北泽宏股份调压箱",
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, state: 1,
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, c: 54,
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, d: 15,
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, e: 56,
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, image: "",
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, show: true,
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, popoVidible: true,
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, },
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, {
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, companyName: "河北泽宏股份调压箱",
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, state: 2,
{ companyName: "河北泽宏股份调压箱", state: 1, show: true }, a: 25,
{ companyName: "河北泽宏股份调压箱", state: 2, show: true }, b: 56,
{ companyName: "河北泽宏股份调压箱", state: 3, show: true }, c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份调压箱",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份调压箱",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
popoVidible: false,
},
{
companyName: "河北泽宏股份调压箱",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 1,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 2,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
{
companyName: "河北泽宏股份调压箱",
state: 3,
a: 25,
b: 56,
c: 54,
d: 15,
e: 56,
image: "",
show: true,
},
], ],
stateType: {
1: "正常",
2: "报警",
3: "离线",
},
}; };
}, },
computed: { computed: {
...@@ -98,6 +277,9 @@ export default { ...@@ -98,6 +277,9 @@ export default {
hide() { hide() {
this.carHide = !this.carHide; this.carHide = !this.carHide;
}, },
change(index) {
this.$refs["popo" + index][0].showPopper = false;
},
// 根据父子元素自动计算是否需要添加值start // 根据父子元素自动计算是否需要添加值start
changeAddStartNum() { changeAddStartNum() {
const czItem = this.$refs.czItem; const czItem = this.$refs.czItem;
...@@ -118,18 +300,14 @@ export default { ...@@ -118,18 +300,14 @@ export default {
}, },
//过滤选择 //过滤选择
fliterTypeChange(data) { fliterTypeChange(data) {
const { state } = data; // const { state } = data;
const index = this.deviceTypeArr.indexOf(state); // const index = this.deviceTypeArr.indexOf(state);
if (index >= 0) { // if (index >= 0) {
this.deviceTypeArr.splice(index, 1); // this.deviceTypeArr.splice(index, 1);
} else { // } else {
this.deviceTypeArr.push(state); // this.deviceTypeArr.push(state);
} // }
this.filter(this.deviceTypeArr); this.filter([...data]);
// 改变大小
this.$nextTick(() => {
this.$refs.myCollapse.getHeight();
});
}, },
// 过滤对象 // 过滤对象
filter(arr) { filter(arr) {
...@@ -170,7 +348,6 @@ $active: #06d7b1 !important; ...@@ -170,7 +348,6 @@ $active: #06d7b1 !important;
top: 50%; top: 50%;
margin-top: -3px; margin-top: -3px;
} }
&.active { &.active {
color: $active; color: $active;
} }
...@@ -188,33 +365,18 @@ $active: #06d7b1 !important; ...@@ -188,33 +365,18 @@ $active: #06d7b1 !important;
.text { .text {
color: $one; color: $one;
} }
.text {
&:before {
background-color: $one;
}
}
} }
&.one-2 { &.one-2 {
.number, .number,
.text { .text {
color: $two; color: $two;
} }
.text {
&:before {
background-color: $two;
}
}
} }
&.one-3 { &.one-3 {
.number, .number,
.text { .text {
color: $three; color: $three;
} }
.text {
&:before {
background-color: $three;
}
}
} }
} }
.container { .container {
...@@ -223,23 +385,25 @@ $active: #06d7b1 !important; ...@@ -223,23 +385,25 @@ $active: #06d7b1 !important;
margin-left: 35px; margin-left: 35px;
&.start { &.start {
justify-content: flex-start; // justify-content: flex-start;
& > div { & > div {
// margin-right: 50px; // margin-right: 50px;
} }
} }
& > div { .com {
margin-bottom: 20px; margin-bottom: 20px;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
// margin-right: 45px; // margin-right: 45px;
width: 15%; width: 15%;
min-width: 190px; min-width: 190px;
margin-right: 1%; margin-right: 1.5%;
.left { .left {
margin-right: 4px; margin-right: 4px;
font-size: 14px; font-size: 14px;
max-width: 112px; max-width: 112px;
cursor: pointer;
} }
.state { .state {
font-size: 8px; font-size: 8px;
...@@ -257,17 +421,47 @@ $active: #06d7b1 !important; ...@@ -257,17 +421,47 @@ $active: #06d7b1 !important;
border-radius: 2px; border-radius: 2px;
background-color: #ff6c68; background-color: #ff6c68;
} }
&.one-3{ &.one-3 {
color: #fff; color: #fff;
border: 1px solid #AAAAAA; border: 1px solid #aaaaaa;
border-radius: 2px; border-radius: 2px;
background-color: #bbbbbb; background-color: #bbbbbb;
} }
} }
} }
} }
.flex { .flex {
display: flex; display: flex;
justify-content: flex-start; // justify-content: flex-start;
}
.cz-item {
.title {
display: flex;
justify-content: space-between;
// height: 20px;
border-bottom: 1px solid #e6ebf5;
box-sizing: border-box;
padding: 13px 0px 6px 10px;
.text {
font-size: 13px;
color: #666666;
padding-left: 10px;
}
.x {
color: #666666;
padding-right: 10px;
cursor: pointer;
.iconfont {
font-size: 12px;
&::hover {
color: #000000;
}
}
}
}
}
.paddingnone {
padding: 0;
} }
</style> </style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/index.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-25 13:46:23 * @Date: 2022-03-25 13:46:23
* @LastEditTime: 2022-03-26 17:15:43 * @LastEditTime: 2022-03-28 15:05:04
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData.vue
...@@ -46,6 +46,8 @@ export default { ...@@ -46,6 +46,8 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.chars-data { .chars-data {
padding: 26px 108px 0 88px; // padding: 26px 108px 0 88px;
padding: 20px;
padding-right: 50px;
} }
</style> </style>
\ No newline at end of file
gassafetyprogress-web/src/views/operationMonitor/monitorData/index.vue
View file @ 7617257a
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2022-03-08 17:28:57 * @Date: 2022-03-08 17:28:57
* @LastEditTime: 2022-03-25 15:27:44 * @LastEditTime: 2022-03-28 17:20:55
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/index.vue * @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/index.vue
...@@ -16,7 +16,11 @@ ...@@ -16,7 +16,11 @@
@click="isComChange(index)" @click="isComChange(index)"
></div> ></div>
</div> </div>
<transition name="fade-transform" mode="out-in">
<keep-alive>
<component :is="currentTabComponent"></component> <component :is="currentTabComponent"></component>
</keep-alive>
</transition>
</div> </div>
</template> </template>
...@@ -50,7 +54,7 @@ export default { ...@@ -50,7 +54,7 @@ export default {
display: flex; display: flex;
justify-content: right; justify-content: right;
margin-right: 37px; margin-right: 37px;
padding-top: 38px; padding-top: 15px;
div { div {
cursor: pointer; cursor: pointer;
padding: 4px; padding: 4px;
......
gassafetyprogress-web/src/views/regulation/device/index.vue
View file @ 7617257a
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> <el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="设备名称" prop="deviceName"> <el-form-item label="设备名称" prop="deviceName">
<el-input <el-input
v-model="queryParams.deviceName" v-model="queryParams.deviceName"
...@@ -19,18 +25,17 @@ ...@@ -19,18 +25,17 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="所在地址" prop="deviceAddr">-->
<!-- <el-input-->
<!-- v-model="queryParams.deviceAddr"-->
<!-- placeholder="请输入所在地址"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -365,7 +370,7 @@ ...@@ -365,7 +370,7 @@
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="设备类型" prop="deviceType"> <el-form-item label="设备类型" prop="deviceType">
<el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 100%"> <el-select v-model="form.deviceType" placeholder="请选择设备类型">
<el-option label="阀井" value="1" /> <el-option label="阀井" value="1" />
<el-option label="调压箱" value="2" /> <el-option label="调压箱" value="2" />
</el-select> </el-select>
...@@ -374,7 +379,7 @@ ...@@ -374,7 +379,7 @@
<el-col :span="11"> <el-col :span="11">
<el-form-item label="权属单位" prop="beyondEnterpriseId"> <el-form-item label="权属单位" prop="beyondEnterpriseId">
<el-select v-model="form.beyondEnterpriseId" style="width: 100%" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable> <el-select v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable>
<el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId"> <el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId">
</el-option> </el-option>
</el-select> </el-select>
......
gassafetyprogress-web/src/views/regulation/gasuser/index.vue
View file @ 7617257a
...@@ -155,9 +155,9 @@ ...@@ -155,9 +155,9 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="11" > <el-col :span="11">
<el-form-item label="用户类型" prop="userType"> <el-form-item label="用户类型" prop="userType">
<el-select v-model="form.userType" placeholder="请选择用户类型" style="width:220px"> <el-select v-model="form.userType" placeholder="请选择用户类型">
<el-option label="居民用户" value="1" /> <el-option label="居民用户" value="1" />
<el-option label="商业用户" value="2" /> <el-option label="商业用户" value="2" />
<el-option label="工业用户" value="3" /> <el-option label="工业用户" value="3" />
......
gassafetyprogress-web/src/views/regulation/info/index.vue
View file @ 7617257a
...@@ -153,32 +153,20 @@ ...@@ -153,32 +153,20 @@
/> />
<!-- 添加或修改企业信息对话框 --> <!-- 添加或修改企业信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="780px" 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="130px"> <el-form ref="form" :model="form" :rules="rules" label-width="130px">
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="企业名称" prop="enterpriseName"> <el-form-item label="企业名称" prop="enterpriseName">
<el-input v-model="form.enterpriseName" placeholder="请输入企业名称" /> <el-input v-model="form.enterpriseName" placeholder="请输入企业名称" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="注册地址" prop="registerAddress">
<el-input v-model="form.registerAddress" placeholder="请输入注册地址" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="营业执照"> <el-form-item label="注册地址" prop="registerAddress">
<FileUpload <el-input v-model="form.registerAddress" placeholder="请输入注册地址" />
listType="picture"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList">
</FileUpload>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -189,9 +177,7 @@ ...@@ -189,9 +177,7 @@
<el-input v-model="form.legalRepresentative" placeholder="请输入法定代表人" /> <el-input v-model="form.legalRepresentative" placeholder="请输入法定代表人" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12">
<el-col :span="10">
<el-form-item label="许可证有效期" prop="licenseValidityTime"> <el-form-item label="许可证有效期" prop="licenseValidityTime">
<el-date-picker <el-date-picker
v-model="form.licenseValidityTime" v-model="form.licenseValidityTime"
...@@ -199,41 +185,55 @@ ...@@ -199,41 +185,55 @@
placeholder="请选择许可证有效期" placeholder="请选择许可证有效期"
format="yyyy 年 MM 月 dd 日" format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
style="width: 117%"> style="width: 100%">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="许可证编号" prop="licenseKey"> <el-form-item label="许可证编号" prop="licenseKey">
<el-input v-model="form.licenseKey" placeholder="请输入许可证编号" /> <el-input v-model="form.licenseKey" placeholder="请输入许可证编号" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12">
<el-col :span="11">
<el-form-item label="经营区域" prop="businessArea"> <el-form-item label="经营区域" prop="businessArea">
<el-input v-model="form.businessArea" placeholder="请输入经营区域" /> <el-input v-model="form.businessArea" placeholder="请输入经营区域" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="23">
<el-form-item label="营业执照">
<FileUpload
listType="picture"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList">
</FileUpload>
</el-form-item>
</el-col>
</el-row>
<el-row> <el-row>
<el-col :span="23">
<el-form-item label="年度监督检查情况" prop="annualSupervisionInspection"> <el-form-item label="年度监督检查情况" prop="annualSupervisionInspection">
<el-input v-model="form.annualSupervisionInspection" type="textarea" placeholder="请输入年度监督检查情况" /> <el-input v-model="form.annualSupervisionInspection" type="textarea" placeholder="请输入年度监督检查情况" />
</el-form-item> </el-form-item>
</el-col>
</el-row> </el-row>
<el-row>
<el-col :span="23">
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" /> <el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
</el-col>
</el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
......
gassafetyprogress-web/src/views/regulation/pipe/index.vue
View file @ 7617257a
...@@ -155,9 +155,8 @@ ...@@ -155,9 +155,8 @@
/> />
<!-- 添加或修改管道信息对话框 --> <!-- 添加或修改管道信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="780px" 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="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
...@@ -167,7 +166,7 @@ ...@@ -167,7 +166,7 @@
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="管径" prop="pipeDiameter"> <el-form-item label="管径" prop="pipeDiameter">
<el-input v-model="form.pipeDiameter" placeholder="请输入管径" > <el-input v-model="form.pipeDiameter" placeholder="请输入管径" >
<template slot="append">厘米</template> <template slot="append">厘米</template>
...@@ -183,7 +182,7 @@ ...@@ -183,7 +182,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="走向" prop="pipeTrend"> <el-form-item label="走向" prop="pipeTrend">
<el-input v-model="form.pipeTrend" placeholder="请输入走向" /> <el-input v-model="form.pipeTrend" placeholder="请输入走向" />
</el-form-item> </el-form-item>
...@@ -197,7 +196,7 @@ ...@@ -197,7 +196,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="材质" prop="pipeMaterial"> <el-form-item label="材质" prop="pipeMaterial">
<el-input v-model="form.pipeMaterial" placeholder="请输入材质" /> <el-input v-model="form.pipeMaterial" placeholder="请输入材质" />
</el-form-item> </el-form-item>
...@@ -211,8 +210,7 @@ ...@@ -211,8 +210,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12">
<el-col :span="11">
<el-form-item label="建设年代" prop="buildDate" > <el-form-item label="建设年代" prop="buildDate" >
<el-date-picker <el-date-picker
v-model="form.buildDate" v-model="form.buildDate"
...@@ -238,7 +236,7 @@ ...@@ -238,7 +236,7 @@
<el-col :span="11"> <el-col :span="11">
<el-form-item label="权属单位" prop="beyondEnterpriseName"> <el-form-item label="权属单位" prop="beyondEnterpriseName">
<el-select style="width: 230%" v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable> <el-select style="width: 100%" v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable>
<el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId"> <el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId">
</el-option> </el-option>
</el-select> </el-select>
...@@ -246,9 +244,8 @@ ...@@ -246,9 +244,8 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="18"> <el-col :span="19">
<el-form-item label="坐标" prop="coordinates"> <el-form-item label="坐标" prop="coordinates">
<el-input v-model="form.coordinates" type="textarea" placeholder="请输入坐标" /> <el-input v-model="form.coordinates" type="textarea" placeholder="请输入坐标" />
</el-form-item> </el-form-item>
...@@ -258,17 +255,14 @@ ...@@ -258,17 +255,14 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" /> <el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
......
gassafetyprogress-web/src/views/regulation/project/index.vue
View file @ 7617257a
...@@ -125,8 +125,8 @@ ...@@ -125,8 +125,8 @@
/> />
<!-- 添加或修改工程项目信息对话框 --> <!-- 添加或修改工程项目信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="780px" 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="90px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="项目年度" prop="projectYear"> <el-form-item label="项目年度" prop="projectYear">
...@@ -139,7 +139,7 @@ ...@@ -139,7 +139,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="企业名称" prop="enterpriseCode"> <el-form-item label="企业名称" prop="enterpriseCode">
<el-input :disabled="true" v-model="form.enterpriseCode" placeholder="企业名称" > <el-input :disabled="true" v-model="form.enterpriseCode" placeholder="企业名称" >
</el-input> </el-input>
...@@ -160,7 +160,7 @@ ...@@ -160,7 +160,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="门站投资额" prop="gateStationInvestment"> <el-form-item label="门站投资额" prop="gateStationInvestment">
<el-input :disabled="isGateStationDisabled" v-model="form.gateStationInvestment" placeholder="请输入门站投资额" > <el-input :disabled="isGateStationDisabled" v-model="form.gateStationInvestment" placeholder="请输入门站投资额" >
<template slot="append">万元</template> <template slot="append">万元</template>
...@@ -183,7 +183,7 @@ ...@@ -183,7 +183,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="管道投资额" prop="pipeInvestment"> <el-form-item label="管道投资额" prop="pipeInvestment">
<el-input :disabled="isPipelineAmount" v-model="form.pipeInvestment" placeholder="请输入管道投资额" > <el-input :disabled="isPipelineAmount" v-model="form.pipeInvestment" placeholder="请输入管道投资额" >
<template slot="append">万元</template> <template slot="append">万元</template>
...@@ -207,7 +207,7 @@ ...@@ -207,7 +207,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" /> <el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
......
gassafetyprogress-web/src/views/regulation/station/index.vue
View file @ 7617257a
...@@ -19,15 +19,6 @@ ...@@ -19,15 +19,6 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="备注" label-width="40px" prop="remarks">-->
<!-- <el-input-->
<!-- v-model="queryParams.remarks"-->
<!-- placeholder="请输入备注"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
...@@ -167,7 +158,7 @@ ...@@ -167,7 +158,7 @@
<!-- 添加或修改场站信息对话框 --> <!-- 添加或修改场站信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" 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="90px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<el-col :span="11"> <el-col :span="11">
...@@ -182,7 +173,7 @@ ...@@ -182,7 +173,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="权属单位" prop="beyondEnterpriseName"> <el-form-item label="权属单位" prop="beyondEnterpriseName">
<el-select style="width: 100%" v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable> <el-select style="width: 100%" v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable>
<el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId"> <el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId">
...@@ -204,44 +195,23 @@ ...@@ -204,44 +195,23 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="建设单位" prop="buildUnit"> <el-form-item label="建设单位" prop="buildUnit">
<el-input v-model="form.buildUnit" placeholder="请输入建设单位" /> <el-input v-model="form.buildUnit" placeholder="请输入建设单位" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<!-- <el-form-item label="权属单位" prop="beyondEnterpriseId">-->
<!-- <el-input v-model="form.beyondEnterpriseId" placeholder="请输入权属单位" />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="权属单位名称" prop="beyondEnterpriseName">-->
<!-- <el-input v-model="form.beyondEnterpriseName" placeholder="请输入权属单位名称" />-->
<!-- </el-form-item>-->
<!-- <el-row>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="经度" prop="longitude">-->
<!-- <el-input v-model="form.longitude" placeholder="请输入经度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="纬度" prop="latitude">-->
<!-- <el-input v-model="form.latitude" placeholder="请输入纬度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-row> <el-row>
<el-col :span="24"> <el-col :span="23">
<el-form-item label="经纬度坐标" prop="longitude"> <el-form-item label="经纬度坐标" prop="longitude">
<el-col :span="8"> <el-col :span="9">
<el-input v-model="form.longitude" placeholder="请输入经度" /> <el-input v-model="form.longitude" placeholder="请输入经度" />
</el-col> </el-col>
<el-col :span="8" style="margin-left: 20px"> <el-col :span="9" style="margin-left: 10px">
<el-input v-model="form.latitude" placeholder="请输入纬度"/> <el-input v-model="form.latitude" placeholder="请输入纬度"/>
</el-col> </el-col>
<el-col :span="4" style="margin-left: 30px"> <el-col :span="3" style="margin-left: 30px">
<el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button> <el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
</el-col> </el-col>
</el-form-item> </el-form-item>
...@@ -249,7 +219,7 @@ ...@@ -249,7 +219,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="上传照片"> <el-form-item label="上传照片">
<FileUpload <FileUpload
listType="picture" listType="picture"
...@@ -262,7 +232,7 @@ ...@@ -262,7 +232,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="场站名称" prop="siteStationName"> <el-form-item label="场站名称" prop="siteStationName">
<el-input v-model="form.siteStationName" placeholder="请输入场站名称" /> <el-input v-model="form.siteStationName" placeholder="请输入场站名称" />
</el-form-item> </el-form-item>
...@@ -270,7 +240,7 @@ ...@@ -270,7 +240,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" /> <el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
......
gassafetyprogress-web/src/views/regulation/supervise/index.vue
View file @ 7617257a
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
/> />
<!-- 添加或修改从业人员信息对话框 --> <!-- 添加或修改从业人员信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="780px" 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="130px"> <el-form ref="form" :model="form" :rules="rules" label-width="130px">
<el-row> <el-row>
...@@ -174,7 +174,7 @@ ...@@ -174,7 +174,7 @@
<el-input v-model="form.employedPeopleName" placeholder="请输入姓名" /> <el-input v-model="form.employedPeopleName" placeholder="请输入姓名" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="身份证号" prop="idCard"> <el-form-item label="身份证号" prop="idCard">
<el-input v-model="form.idCard" placeholder="请输入身份证号" /> <el-input v-model="form.idCard" placeholder="请输入身份证号" />
</el-form-item> </el-form-item>
...@@ -182,7 +182,7 @@ ...@@ -182,7 +182,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="上传照片"> <el-form-item label="上传照片">
<FileUpload <FileUpload
listType="picture" listType="picture"
...@@ -208,9 +208,9 @@ ...@@ -208,9 +208,9 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="受聘企业名称" prop="beyondEnterpriseId"> <el-form-item label="受聘企业名称" prop="beyondEnterpriseId">
<el-select v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择名称" maxlength="255" :disabled="false" clearable> <el-select v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择名称" maxlength="255" :disabled="false" clearable style="width: 100%;">
<el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId"> <el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId">
</el-option> </el-option>
</el-select> </el-select>
...@@ -225,9 +225,9 @@ ...@@ -225,9 +225,9 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="任职岗位" prop="peopleOccupation"> <el-form-item label="任职岗位" prop="peopleOccupation">
<el-select v-model="form.peopleOccupation" placeholder="请选择任职岗位"> <el-select v-model="form.peopleOccupation" placeholder="请选择任职岗位" style="width: 100%;">
<el-option label="主要负责人" value="1" /> <el-option label="主要负责人" value="1" />
<el-option label="安全管理人员" value="2" /> <el-option label="安全管理人员" value="2" />
<el-option label="运行维护和抢修人员" value="3" /> <el-option label="运行维护和抢修人员" value="3" />
...@@ -243,15 +243,22 @@ ...@@ -243,15 +243,22 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="12">
<el-form-item label="复检日期" prop="certificateChange"> <el-form-item label="复检日期" prop="certificateChange">
<el-input v-model="form.certificateChange" placeholder="请输入复检日期" /> <el-date-picker
v-model="form.certificateChange"
type="date"
placeholder="请输入复检日期"
format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd"
style="width: 100%">
</el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="22"> <el-col :span="23">
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" /> <el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
</el-form-item> </el-form-item>
...@@ -391,6 +398,7 @@ export default { ...@@ -391,6 +398,7 @@ export default {
avatarAddress:null, avatarAddress:null,
}; };
this.resetForm("form"); this.resetForm("form");
this.fileList = [];
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
...@@ -490,8 +498,6 @@ export default { ...@@ -490,8 +498,6 @@ export default {
}).catch(() => {}); }).catch(() => {});
}, },
} }
}; };
</script> </script>
......
gassafetyprogress-web/src/views/standingBook/equipment/index.vue
View file @ 7617257a
...@@ -321,6 +321,9 @@ export default { ...@@ -321,6 +321,9 @@ export default {
}, },
created() { created() {
this.getList(); this.getList();
this.getDicts("t_equipment_type").then(response => {
this.options = response.data;
});
}, },
methods: { methods: {
change(){ change(){
...@@ -409,18 +412,12 @@ export default { ...@@ -409,18 +412,12 @@ export default {
/** 新增按钮操作 */ /** 新增按钮操作 */
handleAdd() { handleAdd() {
this.reset1(); this.reset1();
this.getDicts("t_equipment_type").then(response => {
this.options = response.data;
});
this.open1 = true; this.open1 = true;
this.title1 = "添加用户加装安全装置台账"; this.title1 = "添加用户加装安全装置台账";
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset1(); this.reset1();
this.getDicts("t_equipment_type").then(response => {
this.options = response.data;
});
getEquipment(row.safeEquipmentId).then(response => { getEquipment(row.safeEquipmentId).then(response => {
let data = response.data; let data = response.data;
data.equipments = []; data.equipments = [];
......
gassafetyprogress-web/src/views/system/eventInfo/index.vue
View file @ 7617257a
...@@ -145,7 +145,7 @@ ...@@ -145,7 +145,7 @@
<!-- 添加或修改事件处置对话框 --> <!-- 添加或修改事件处置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" 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"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<div class="division"> <div class="division">
<div style="width: 45%"> <div style="width: 45%">
<el-form-item label="事件名称" prop="eventTitle"> <el-form-item label="事件名称" prop="eventTitle">
...@@ -171,9 +171,6 @@ ...@@ -171,9 +171,6 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="事件地点" prop="eventLocation">
<el-input v-model="form.eventLocation" placeholder="请输入事件地点" :disabled="readonly"/>
</el-form-item>
</div> </div>
<div style="width: 50%"> <div style="width: 50%">
...@@ -197,14 +194,15 @@ ...@@ -197,14 +194,15 @@
type="datetime" type="datetime"
value-format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
:disabled="readonly" :disabled="readonly"
placeholder="选择报案时间"> placeholder="选择报案时间"
style="width: 100%;">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" placeholder="请输入备注" :disabled="readonly"/>
</el-form-item>
</div> </div>
</div> </div>
<el-form-item label="事件地点" prop="eventLocation" style="width: 95%">
<el-input v-model="form.eventLocation" placeholder="请输入事件地点" :disabled="readonly"/>
</el-form-item>
<el-form-item label="事件处置信息" prop="eventDeal" style="width: 95%"> <el-form-item label="事件处置信息" prop="eventDeal" style="width: 95%">
<el-input v-model="form.eventDeal" type="textarea" placeholder="请输入事件处置信息" :disabled="readonly"/> <el-input v-model="form.eventDeal" type="textarea" placeholder="请输入事件处置信息" :disabled="readonly"/>
</el-form-item> </el-form-item>
...@@ -217,7 +215,7 @@ ...@@ -217,7 +215,7 @@
@resFun="getFileInfo" @resFun="getFileInfo"
@remove="listRemove" @remove="listRemove"
:fileArr="fileList" :fileArr="fileList"
style="width: 70%" style="width: 94%"
/> />
<el-input v-show="false" disabled v-model="form.iconUrl"></el-input> <el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
<!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />--> <!--<el-input v-model="form.iconUrl" type="textarea" placeholder="请输入内容" />-->
...@@ -235,8 +233,9 @@ ...@@ -235,8 +233,9 @@
<!--<el-form-item label="所属企业名称" prop="beyondEnterpriseName">--> <!--<el-form-item label="所属企业名称" prop="beyondEnterpriseName">-->
<!--<el-input v-model="form.beyondEnterpriseName" placeholder="请输入所属企业名称" />--> <!--<el-input v-model="form.beyondEnterpriseName" placeholder="请输入所属企业名称" />-->
<!--</el-form-item>--> <!--</el-form-item>-->
<el-form-item label="备注" prop="remarks" style="width: 95%">
<el-input v-model="form.remarks" placeholder="请输入备注" :disabled="readonly"/>
</el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
......
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