Skip to content

E
energyai_vue
Commit aeae8ce3 authored by co_dengxiongwen's avatar co_dengxiongwen
Browse files
Options

tj

parent 267120a7
Hide whitespace changes
Inline Side-by-side
Showing with 23 additions and 1465 deletions
src/App - 副本.vue deleted 100644 → 0
View file @ 267120a7
<template>
<div id="app">
<router-view />
</div>
</template>
<script>
import util from '@/libs/util.js'
import util from '@/libs/util.js'
export default {
name: 'app',
data () {
return {
LogTimeout: null
}
},
mounted () {
//let token = util.cookies.get('token')
//this.initWebSocket()
// this.setTimeout()
},
destroyed: function () {
this.websocketclose()
},
methods: {
//初始化weosocket
initWebSocket () {
if (typeof WebSocket === 'undefined') {
alert('您的浏览器不支持WebSocket')
return false
}
// websocket地址
const wsuri = this.$http.adornUrl('').slice(5)
const webpath =
'ws:' + wsuri.substring(0, wsuri.indexOf(':')) + ':8091/websocket/1001'
this.websock = new WebSocket(webpath)
this.websock.onopen = this.websocketonopen
this.websock.onmessage = this.websocketonmessage
this.websock.onerror = this.websocketonerror
this.websock.onclose = this.websocketclose
// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = this.onbeforeunload
},
//连接成功
websocketonopen () {
console.log('WebSocket连接成功')
},
//接收后端返回的数据
websocketonmessage (e) {
console.log(e + '*****')
let dataJson = e.data
console.log(dataJson + '*****')
// 在这里使用后端返回的数据，对数据进行处理渲染
},
//连接建立失败重连
websocketonerror (e) {
console.log(`连接失败的信息：`, e)
this.initWebSocket() // 连接失败后尝试重新连接
},
//关闭连接
websocketclose (e) {
console.log('断开连接', e)
},
//设置定时器
setTimeout () {
if (this.LogTimeout) {
this.closeTimeout()
}
this.LogTimeout = setInterval(this.getDateList, 5000)
},
// 关闭定时器
closeTimeout () {
if (this.LogTimeout) {
clearInterval(this.LogTimeout)
}
},
getDateList () {
console.log('开始定时循环')
if (util.cookies.get('token') && util.cookies.get('token') != undefined) {
this.$http({
url: this.$http.adornUrlAlarm('/alarmsInfo/queryList'),
method: 'post',
params: this.$http.adornParams({
status: 1,
stationId: localStorage.getItem('stationId')
})
}).then(data => {
if (data && data.code === 0) {
this.dataList = data.list
console.log('报警弹框')
for (var i = 0; i < data.list.length; i++) {
if (i === 4) {
break
}
this.$toast({
tip: 'tip' + (i + 1),
id: data.list[i].id,
stationName: '', //站点名
tierName: data.list[i].tierName, //站层名
resourceName: data.list[i].resourceName, //资源点名
occurrenceSite: data.list[i].occurrenceSite, //发生地点
level: data.list[i].eventLevel, // 等级
times: data.list[i].occurrenceTime, //时间
type: data.list[i].eventName, // 类型
// explain: data.list[i].explain, //说明
// url: data.list[i].url, //图片地址
duration: '4900',
router: this.$router
})
}
// this.closeTimeout()
}
})
}
}
}
}
</script>
<style lang="scss">
@import "~@/assets/style/public-class.scss";
.d2-layout-header-aside-group
.d2-layout-header-aside-content
.d2-theme-container
.d2-theme-container-main
.d2-theme-container-main-body
.container-component
.d2-container-full
.d2-container-full__body {
margin-bottom: 50px;
}
//-- 公共样式--//
// page页背景色
.d2-container-full__body {
background-color: #b9c9e3 !important;
}
// 状态-点
// .danger,
// .success,
// .warning {
// width: 5px;
// height: 5px;
// border-radius: 100%;
// background: #ff3723;
// display: inline-block;
// vertical-align: middle;
// }
// .success {
// background: #42cd00;
// }
// .warning {
// background: #ffa101;
// }
// 弹出框
.el-dialog__title {
line-height: 24px;
font-size: 18px;
color: #303133;
padding-left: 10px;
}
.el-dialog__header {
border-top: 3px solid #21acfc;
padding: 14px 20px 10px !important;
background-color: #edeef1;
border-bottom: 1px solid #e9e9e9;
}
// 自定义===============
// 标题加粗
.title-bold {
font-weight: bold;
font-size: 17px;
}
// 标题左侧颜色
.title-left-color {
border-left: 5px solid #21acfc;
padding-left: 10px;
}
.treeCard .el-card__header {
height: 42px;
line-height: 42px;
background: #e1edf4;
padding: 0 0 0 10px !important;
}
.tableCard .el-card__header {
height: 42px;
line-height: 42px;
background: #edeef1;
padding: 0 0 0 10px !important;
}
.tableHeader .el-table__header-wrapper {
height: 42px;
line-height: 42px;
background: #edeef1;
padding: 0 0 0 0 !important;
transform: translateY(0px);
}
.tableHeader .has-gutter {
transform: translateY(-12px);
}
// .elTree{
// background:#f4f4f4!important;
// }
// 二级菜单
.monitor_menu {
.menu_item {
width: 120px;
height: 46px;
line-height: 46px;
text-align: center;
color: #ccc;
box-shadow: 0px 0 2px #000 !important;
background-image: linear-gradient(to top, #335274, #4d759a) !important;
text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.3) !important;
}
.is-active {
color: #fff !important;
background: linear-gradient(
0deg,
rgba(33, 172, 252, 1),
rgba(48, 136, 193, 1)
) !important;
}
ul {
a:nth-child(1) {
li {
border-radius: 9px 0 0 9px !important;
}
}
a:last-child {
li {
border-radius: 0 9px 9px 0 !important;
}
}
}
}
//-- 公共样式--//
</style>
src/App copy.vue deleted 100644 → 0
View file @ 267120a7
<template>
<div id="app">
<router-view v-if="isRouterAlive" />
<div>
<div v-for="(item,index) in showList" :key='index' v-if="index < 4 && ishowAlarm">
<div :class="'tip'+(index+1)">
<div class="title">
<el-row :span='24'>
<el-col :sm='15' style="color:red;font-size:20px;">{{item.eventName}}
</el-col>
<el-col :sm='9' style="text-align:right;padding-right:10px;">等级：
<span class="tip_level" v-if="item.eventLevel ==1" style="color:red">特别重大</span>
<span class="tip_level" v-if="item.eventLevel ==2" style="color:red">重大</span>
<span class="tip_level" v-if="item.eventLevel ==3">一般</span>
</el-col>
</el-row>
</div>
<el-divider></el-divider>
<div class="tip_warp">
<el-row class="tip_content" type='flex' justify="space-around">
<el-col :span='15'>
<el-row :span='24'>
<el-col :span='24' style="color:red">报警地点：{{item.occurrenceSite}}
</el-col>
<el-col :span='24'>报警时间：{{item.occurrenceTime}}</el-col>
<el-col :title="item.type" :span='24'>报警类型：{{item.eventName}}
</el-col>
<el-col :title="item.resourceName+item.eventName" :span='24'>
报警说明：{{item.resourceName}}{{item.eventName}}
</el-col>
</el-row>
</el-col>
<el-col class="tip_imgwarp" :span='8'>
<img v-if="item.path" :src="urlPath + item.path" alt="">
<img v-else src="./assets/images/videoImg.png" alt="">
</el-col>
</el-row>
<el-row class="btn_warp alarms_warp" type='flex' justify="space-around">
<el-col :span='3' :offset='1'>
<el-button class="tip_btn" type="primary" size="medium" round @click="doBtn(item)">去处理
</el-button>
</el-col>
<el-col :span='4'>
<el-button class="tip_btn" type="info" size="medium" round @click="closeTip(item.id,index)">关闭
</el-button>
</el-col>
</el-row>
</div>
</div>
</div>
</div>
<dispose-info v-if='queryDetailVisible' ref='queryDetail'></dispose-info>
<el-dialog :close-on-click-modal='false' title="申请接管站点信息" :visible.sync="dialogVisible" width="30%"
class="takeover_dialog" :before-close="takeoverClose" :show-close='false'>
<div slot='title'>
<span class="title-bold">申请接管站点信息</span>
</div>
<el-form ref="takeoverForm" :model="takeoverInfo" label-width="140px" size="mini">
<el-form-item label="申请接管站点单位：">
<font>{{takeoverInfo.takeoverOrgName}}</font>
</el-form-item>
<el-form-item label="申请人：">
<font>{{takeoverInfo.applyUserName}}</font>
</el-form-item>
<el-form-item label="接管类型：">
<font>{{takeoverInfo.takeoverType ===1 ? '主动接管' : '被动接管'}}</font>
</el-form-item>
<el-form-item label="申请时间：">
<font>{{takeoverInfo.applyTime}}</font>
</el-form-item>
<el-form-item label="申请理由：">
<font>{{takeoverInfo.reason}}</font>
</el-form-item>
</el-form>
<div slot="footer" align='center'>
<el-button class="btn" type="primary" @click='disagree'>拒绝</el-button>
<el-button class="btn" type="primary" @click='agreed'>同意</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import util from '@/libs/util.js'
import DisposeInfo from '@/pages/alarms/untreated/dispose-info'
import { mapActions } from 'vuex'
import $ from 'jquery'
export default {
name: 'app',
provide() {
return {
reload: this.reload
}
},
data() {
return {
ishowAlarm: true,
dialogVisible: false,
isRouterAlive: true,
queryDetailVisible: false,
urlPath: window.CONFIG.urlPath,
tipList: [],
showList: [],
src: window.CONFIG.bimPath,
takeoverInfo: ''
}
},
components: {
DisposeInfo
},
watch: {
takeover(newValue) {
// console.log(2222, newValue)
if (newValue) {
this.takeoverInfo = newValue
this.dialogVisible = true
} else {
this.dialogVisible = false
}
}
},
computed: {
takeover() {
return this.$store.state.d2admin.takeover.takeover
}
},
mounted() {
//let token = util.cookies.get('token')
this.initWebSocket()
this.initWebSocket2()
this.getDateList()
window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.addEventListener('unload', e => this.unloadHandler(e))
},
destroyed() {
this.websocketclose()
window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
window.removeEventListener('unload', e => this.unloadHandler(e))
},
methods: {
...mapActions('d2admin/account', ['logout']),
beforeunloadHandler(){
this._beforeUnload_time=new Date().getTime();
// return e.returnValue='ssssss'
},
unloadHandler(e){
let that=this
this._gap_time=new Date().getTime()-this._beforeUnload_time;
//判断是窗口关闭还是刷新
if(this._gap_time<=5){
//如果是登录状态，关闭窗口前
if (sessionStorage.getItem('token') && sessionStorage.getItem('token') != undefined){
// util.cookies.set('close####',that.$http.adornUrl('/sys/logout'))
if(navigator.sendBeacon){
let result= navigator.sendBeacon(that.$http.adornUrl('/sys/logout'));
if(result){
util.cookies.set('success',result)
}else{
util.cookies.set('error',result)
}
}
// $.ajax({
// type: 'POST',
// url:that.$http.adornUrl('/sys/logout'),
// async:false,
// success:function(data){
// util.cookies.set('success',data)
// localStorage.setItem('success',JSON.stringify(data))
// },
// error:function(err){
// util.cookies.set('error',err)
// localStorage.setItem('erroe',JSON.stringify(err))
// }
// })
// this.logout({
// vm: that,
// confirm: true
// })
// this.$http({
// url: this.$http.adornUrl('/sys/logout'),
// method: 'post',
// data: this.$http.adornData()
// }).then(data => {
// if (data && data.code === 0) {
// util.cookies.set('aaaaa','xxxxxxxxxx')
// }
// }).catch(()=>{
// util.cookies.set('bbbbbb','xxxxxxxxxx')
// })
}
}
},
sendMessage(code) {
setTimeout(() => {
if (!this.$refs.iframe) {
return
}
this.$refs.iframe.contentWindow.postMessage({
func: 'alarm',
data: {
code: code
}
}, this.src)
}, 1000)
},
reload() {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
},
//初始化weosocket
initWebSocket() {
if (typeof WebSocket === 'undefined') {
alert('您的浏览器不支持WebSocket')
return false
}
// websocket地址？
const wsuri = this.$http.adornUrl('').slice(5)
console.log('wsuriLog:' + wsuri)
let webpath = ''
//wsuri.substring(0, wsuri.indexOf(':'))
if (wsuri != null && wsuri.indexOf(':') <= -1) {
webpath = 'ws://api.crsh.cn:8091/websocket/1001'
} else {
webpath = 'ws:' + wsuri.substring(0, wsuri.indexOf(':')) + ':8091/websocket/1001'
}
console.log('webpathLog:' + webpath)
this.websock = new WebSocket(webpath)
this.websock.onopen = this.websocketonopen
this.websock.onmessage = this.websocketonmessage
this.websock.onerror = this.websocketonerror
this.websock.onclose = this.websocketclose
// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = this.websocketclose
},
//连接成功
websocketonopen() {
console.log('WebSocket连接成功')
// this.send()
},
//接收后端返回的数据
websocketonmessage(e) {
console.log('takeover:', sessionStorage.getItem('takeover'))
if (sessionStorage.getItem('takeover') != undefined && sessionStorage.getItem('takeover') == 'true') {
this.ishowAlarm = false
} else {
this.ishowAlarm = true
}
// 在这里使用后端返回的数据，对数据进行处理渲染
// this.tipList = []
this.showList = []
if (sessionStorage.getItem('token') && sessionStorage.getItem('token') != undefined) {
// if (util.cookies.get('token') && util.cookies.get('token') != undefined) { //登录才能获取
// this.tipList = JSON.parse(e.data)
var alarmsInfo = JSON.parse(e.data)
//console.log(alarmsInfo, '-------')
if (alarmsInfo.status != 1) {
for (var i in this.tipList) {
if (alarmsInfo.id === this.tipList[i].id) {
this.tipList.splice(i, 1)
break
}
}
} else {
for (var index in this.tipList) {
if (alarmsInfo.id === this.tipList[index].id) {
this.tipList.splice(index, 1)
break
}
}
this.tipList.push(alarmsInfo)
this.sendMessage(alarmsInfo.resourceCode)
this.tipList.sort(this.sortBy('occurrenceTime', false)) //按发生时间降序
var alarmId = this.$store.state.d2admin.alramfj.alarmId
var num = 0
if (alarmId && alarmId.substring(0, alarmId.indexOf('-')) === alarmsInfo.id) {
num = Number(alarmId.substring(alarmId.indexOf('-') + 1)) + 1
this.$store.dispatch('d2admin/alramfj/set', alarmsInfo.id + '-' + num)
} else {
this.$store.dispatch('d2admin/alramfj/set', alarmsInfo.id + '-0')
}
// console.log(this.$store.state.d2admin.alramfj.alarmId)
// console.log(this.$store.state.d2admin.alramfj.alarmId.substring(0,this.$store.state.d2admin.alramfj.alarmId.indexOf('-')))
}
if (this.tipList.length < 4) {
this.tipList.forEach(element => {
this.showList.push(element)
})
} else if (this.tipList.length >= 4) {
for (let index = 0; index < 4; index++) {
this.showList.push(this.tipList[index])
}
}
if (this.showList) {
this.showList.sort(this.sortBy('occurrenceTime', true))
}
//console.log(this.showList, '----------')
// console.log(this.showList[0].hmdfj.path, '1----------1')
// console.log(this.showList[0].hmdfjPath, '1----------1')
// console.log(this.tipList, '+++++++++')
// console.log(this.tipList[0].hmdfj.path, '2----------2')
// console.log(this.tipList[0].hmdfjPath, '2----------2')
this.$store.dispatch('d2admin/toast/set', this.tipList.length)
}
},
//连接建立失败重连
websocketonerror(e) {
console.log(`连接失败的信息：`, e)
this.initWebSocket() // 连接失败后尝试重新连接
},
//关闭连接
websocketclose(e) {
console.log('断开连接', e)
},
send() {
this.websock.send('1')
},
// ====================================
//初始化weosocket2
initWebSocket2() {
if (typeof WebSocket === 'undefined') {
alert('您的浏览器不支持WebSocket')
return false
}
// websocket地址？
const wsuri = this.$http.adornUrl('').slice(5)
console.log('wsuriLog:' + wsuri)
let webpath = ''
//wsuri.substring(0, wsuri.indexOf(':'))
if (wsuri != null && wsuri.indexOf(':') <= -1) {
webpath = 'ws://api.crsh.cn:8091/websocket/1002'
} else {
webpath = 'ws:' + wsuri.substring(0, wsuri.indexOf(':')) + ':8091/websocket/1002'
}
console.log('webpathLog:' + webpath)
this.websock2 = new WebSocket(webpath)
this.websock2.onopen = this.websocketonopen2
this.websock2.onmessage = this.websocketonmessage2
this.websock2.onerror = this.websocketonerror2
this.websock2.onclose = this.websocketclose2
// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = this.websocketclose2
},
//连接成功
websocketonopen2() {
console.log('WebSocket连接成功2')
// this.takeoverInfo = 1
// this.send2()
},
//接收后端返回的数据
websocketonmessage2(e) {
// 在这里使用后端返回的数据，对数据进行处理渲染
if (sessionStorage.getItem('token') && sessionStorage.getItem('token') != undefined) { //登录才能获取
// this.tipList = JSON.parse(e.data)
console.log('接管数据' + e.data)
let st = e.data.split('_')[0]
let bean = JSON.parse(e.data.split('_')[1])
if (st === 'one') {
//重连查询接管信息--站点用
if (bean) {
sessionStorage.setItem('takeover', true)
} else {
sessionStorage.removeItem('takeover')
}
return
} else if (st === 'list') {
//重连查询---线路路网用
return
}
if (bean && bean.status === 1) {
// 申请接管
this.takeoverInfo = bean
this.dialogVisible = true
} else if (bean && bean.status === 5 && bean.valids === 0) {
// 提示断开接管
sessionStorage.removeItem('takeover')
this.$message.warning(bean.lineName + '放弃了对此站点的接管')
// this.dialogVisible = false
this.ishowAlarm = true
} else if (bean && bean.valids === 1 && bean.status === 2) {
console.log('同意接管1111111111')
this.ishowAlarm = false
this.$message.success('同意了接管申请')
sessionStorage.setItem('takeover', true)
this.clickClose(bean.id)
} else if (bean && bean.valids === 1 && bean.status === 3) {
this.ishowAlarm = true
this.$message.success('拒绝了接管申请')
sessionStorage.removeItem('takeover')
this.$store.dispatch('d2admin/takeover/set', true)
this.clickClose(bean.id)
} else if (bean && bean.valids === 0 && bean.status === 4) {
sessionStorage.removeItem('takeover')
this.$message.success('中断了接管')
this.ishowAlarm = true
}
this.$store.dispatch('d2admin/takeover/set', true)
// console.log(this.takeoverInfo, '-------')
}
},
//关闭连接
takeoverClose() {
//直接关闭
this.takeoverInfo = {}
this.dialogVisible = false
this.$store.dispatch('d2admin/takeover/setTakeover', null)
},
clickClose(id) {
if (id && id === this.takeoverInfo.id) {
//有id的话只关闭id跟后台传递过来id相同的弹出层，不一样不关。防止一边同意一边立马申请，申请后发的但是先到了。websocket先发但是后到
console.log('关闭的时候', this.takeoverInfo)
//只关闭id跟返回的id一样的数据
this.takeoverClose()
}
},
//连接建立失败重连
websocketonerror2(e) {
console.log(`连接失败的信息2：`, e)
this.initWebSocket2() // 连接失败后尝试重新连接
},
//关闭连接
websocketclose2(e) {
console.log('断开连接2', e)
},
send2() {
this.websock.send('2')
},
// 同意被接管
agreed() {
let item = this.takeoverInfo
item.status = 2
// 修改表中数据
this.$http({
url: this.$http.adornUrl('/sysStationTakeover/agree'),
method: 'post',
data: item
}).then(data => {
if (data && data.code === 0) {
// this.$message.success('操作成功')
sessionStorage.setItem('takeover', true)
this.takeoverClose()
location.reload(true)
}
})
},
// 不同意
disagree() {
let item = this.takeoverInfo
item.status = 3
// 修改表中数据
this.$http({
url: this.$http.adornUrl('/sysStationTakeover/agree'),
method: 'post',
data: item
}).then(data => {
if (data && data.code === 0) {
// this.$message.success('操作成功')
sessionStorage.removeItem('takeover')
this.$store.dispatch('d2admin/takeover/set', true)
this.takeoverClose()
}
})
},
// ====================================
//登录后页面刷新的时候获取
getDateList() {
console.log('takeover:', sessionStorage.getItem('takeover'))
if (sessionStorage.getItem('takeover') != undefined && sessionStorage.getItem('takeover') == 'true') {
this.ishowAlarm = false
} else {
this.ishowAlarm = true
}
console.log('ishowAlarm:', this.ishowAlarm)
this.tipList = []
this.showList = []
if (sessionStorage.getItem('token') && sessionStorage.getItem('token') != undefined) {
this.$http({
url: this.$http.adornUrlAlarm('/alarmsInfo/queryList'),
method: 'post',
params: this.$http.adornParams({
status: 1,
stationId: localStorage.getItem('stationId')
})
}).then(data => {
if (data && data.code === 0) {
this.tipList = data.list
if (this.tipList.length < 4) {
this.tipList.forEach(element => {
this.showList.push(element)
})
} else if (this.tipList.length >= 4) {
for (let index = 0; index < 4; index++) {
this.showList.push(this.tipList[index])
}
}
if (this.showList) {
this.showList.sort(this.sortBy('occurrenceTime', true))
}
// console.log(this.tipList, '-------')
// console.log(this.showList, '-------')
//console.log(this.showList, '1----------1')
this.$store.dispatch('d2admin/toast/set', this.tipList.length)
}
})
} else {
//清空接管提示框
this.$store.dispatch('d2admin/takeover/setTakeover', null)
}
},
/**数组根据数组对象中的某个属性值进行排序的方法
* 使用例子：newArray.sort(sortBy('number',false)) //表示根据number属性降序排列;若第二个参数不传递，默认表示升序排序
* @param attr 排序的属性 如number属性
* @param rev true表示升序排列，false降序排序
* */
sortBy: function (attr, rev) {
//第二个参数没有传递 默认升序排列
if (rev == undefined) {
rev = 1
} else {
rev = (rev) ? 1 : -1
}
return function (a, b) {
a = a[attr]
b = b[attr]
if (a < b) {
return rev * -1
}
if (a > b) {
return rev * 1
}
return 0
}
},
doBtn(item) {
this.queryDetailVisible = true
this.$nextTick(() => {
this.$refs.queryDetail.init(item)
})
},
closeTip(id, index) {
var ruleForm = {
id: id,
status: 2,
beSend: true
}
this.$http({
url: this.$http.adornUrlAlarm(
`/alarmsInfo/update`
),
method: 'post',
data: ruleForm
}).then(data => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500
})
//目前websocket未移到alarms项目，使用下列关闭
// this.tipList.splice(index, 1)
// console.log(this.showList, '-------')
this.$store.dispatch('d2admin/toast/set', this.tipList.length)
} else {
this.$message.error(data.msg)
}
})
}
}
}
</script>
<style lang="scss">
@import "~@/assets/style/public-class.scss";
// .takeover_warp {
// width: 400px;
// height: 220px;
// position: fixed;
// z-index: 100;
// bottom: 80px;
// right: 20px;
// border: 1px solid #ccc;
// background: white;
// .title {
// width: 100%;
// height: 30px;
// line-height: 30px;
// text-indent: 10px;
// border-bottom: 1px solid #ccc;
// i {
// float: right;
// line-height: 30px;
// margin-right: 5px;
// }
// }
// .info {
// width: 400px;
// text-indent: 20px;
// div {
// margin-top: 5px;
// }
// }
// .btn_group {
// text-align: center;
// margin-top: 15px;
// .btn {
// width: 100px;
// height: 30px;
// line-height: 30px;
// }
// /deep/.el-button {
// padding: 0 !important;
// }
// }
// }
.takeover_dialog {
.el-form-item--mini.el-form-item {
margin-bottom: 0 !important;
}
}
// body{
// padding-right:0 !important
// }
// openlayer 样式
.resource-container {
.ol-overviewmap {
left: 89%;
button {
display: none;
}
}
}
// -----------
.d2-layout-header-aside-group .d2-layout-header-aside-content .d2-theme-container .d2-theme-container-main .d2-theme-container-main-body .container-component .d2-container-full .d2-container-full__body {
margin-bottom: 50px;
}
//-- 公共样式--//
// page页背景色
.d2-container-full__body {
background-color: #b9c9e3 !important;
}
// 状态-点
// .danger,
// .success,
// .warning {
// width: 5px;
// height: 5px;
// border-radius: 100%;
// background: #ff3723;
// display: inline-block;
// vertical-align: middle;
// }
// .success {
// background: #42cd00;
// }
// .warning {
// background: #ffa101;
// }
// 弹出框
.el-dialog__title {
line-height: 24px;
font-size: 18px;
color: #303133;
padding-left: 10px;
}
.el-dialog__header {
border-top: 3px solid #21acfc;
padding: 14px 20px 10px !important;
background-color: #edeef1;
border-bottom: 1px solid #e9e9e9;
}
// 自定义===============
// 标题加粗
.title-bold {
font-weight: bold;
font-size: 17px;
}
// 标题左侧颜色
.title-left-color {
border-left: 5px solid #21acfc;
padding-left: 10px;
}
.treeCard .el-card__header {
height: 42px;
line-height: 42px;
background: #e1edf4;
padding: 0 0 0 10px !important;
}
.treeCard>div {
padding: 0 !important;
}
.tableCard .el-card__header {
height: 42px;
line-height: 42px;
background: #edeef1;
padding: 0 0 0 10px !important;
}
.tableHeader .el-table__header-wrapper {
height: 42px;
line-height: 42px;
background: #edeef1;
padding: 0 0 0 0 !important;
transform: translateY(0px);
}
.tableHeader .has-gutter {
transform: translateY(-12px);
}
// .elTree{
// background:#f4f4f4!important;
// }
// 二级菜单
.monitor_menu {
.menu_item {
width: 120px;
height: 46px;
line-height: 46px;
text-align: center;
color: #ccc;
box-shadow: 0px 0 2px #000 !important;
background-image: linear-gradient(to top, #335274, #4d759a) !important;
text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.3) !important;
}
.is-active {
color: #fff !important;
background: linear-gradient(0deg,
rgba(33, 172, 252, 1),
rgba(48, 136, 193, 1)) !important;
}
ul {
a:nth-child(1) {
li {
border-radius: 9px 0 0 9px !important;
}
}
a:last-child {
li {
border-radius: 0 9px 9px 0 !important;
}
}
}
}
.el-table .cell {
/*display: flex;*/
/*justify-content: center;*/
}
//-- 公共样式--//
.my_checkbox {
.el-checkbox__input.is-checked+.el-checkbox__label {
color: #32A5EA !important;
}
.el-checkbox__input.is-disabled+span.el-checkbox__label {
color: #606266;
}
.el-checkbox__input.is-disabled .el-checkbox__inner {
background-color: #FFF;
}
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
background-color: #32A5EA;
border-color: #32A5EA;
}
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
border-color: #FFF;
}
}
.my_radio {
.el-radio__input.is-disabled+span.el-radio__label {
color: #606266;
}
.el-radio__input.is-checked+.el-radio__label {
color: #32A5EA !important;
}
.el-radio__input.is-checked .el-radio__inner {
border-color: #32A5EA;
background: #32A5EA;
}
.el-radio__input.is-disabled.is-checked .el-radio__inner::after {
background-color: #F5F7FA;
}
.el-radio__input.is-disabled .el-radio__inner {
background-color: #FFF;
}
.el-radio__input.is-disabled.is-checked .el-radio__inner {
border-color: #32A5EA;
background: #32A5EA;
}
}
.mycard {
/* width: 80% !important; */
margin: 0 auto !important;
}
.mywidth {
width: 100% !important;
}
.box_main {
margin-top: 10px;
padding: 10px 20px !important;
background-color: white;
.el-card {
border: 0;
box-shadow: 0 0 !important;
.el-table {
border-left: 1px solid #EBEEF5;
border-right: 1px solid #EBEEF5;
border-top: 1px solid #EBEEF5;
}
}
.el-card__body {
/*padding: 20px 10px 0 10px;*/
/*padding-bottom: 0;*/
padding: 0;
}
}
//文本域样式
.el-textarea__inner {
// font: 400 13.3333px Arial;
font-weight: 400;
font-family: Arial, Helvetica, sans-serif;
font-size: inherit;
}
//按钮样式
.el-button--text {
font-size: 14px !important;
font-family: Arial, Helvetica, sans-serif !important;
}
//el-step步骤样式
.is-vertical {
flex-basis: auto !important;
}
.d2-theme-container-main-body {
/*background-color: white !important;*/
}
.box_footer {
background-color: white;
}
.el-icon-back2 {
background: url(assets/images/icon/back.png) center no-repeat;
background-size: cover;
}
.el-icon-back2:before {
content: "替";
font-size: 10px;
visibility: hidden;
}
.el_container-style {
padding: 0px;
height: 77.6vh;
}
.el_header-style {
height: 42px !important;
line-height: 42px;
border: 1px solid rgba(195, 195, 195, 1);
background: #f4f4f4;
}
.el-table td div {
text-overflow: ellipsis !important;
overflow: hidden !important;
white-space: nowrap !important;
}
.el-table td,
.el-table th {
padding: 0 !important;
line-height: 49px;
height: 49px;
}
</style>
<style lang="scss" scoped>
.tip1 {
width: 400px;
height: 220px;
position: fixed;
z-index: 100;
bottom: 80px;
right: 10px;
border: 1px solid #ccc;
background: white;
.title {
height: 40px;
line-height: 40px;
text-indent: 15px;
// color: #fff;
background: #f1f5f8;
span {
font-size: 17px;
font-weight: 400;
}
}
.tip_warp {
height: 180px;
background: #f1f5f8;
.tip_content {
padding: 10px;
color: #000000;
.tip_level {
font-size: 17px;
color: red;
}
}
.tip_imgwarp {
img {
width: 130px;
height: 85px;
}
}
.btn_warp {
padding-top: 10px;
.tip_btn {
width: 80px;
}
}
}
}
.tip2 {
width: 400px;
height: 220px;
position: fixed;
z-index: 100;
bottom: 80px;
right: 420px;
border: 1px solid #ccc;
background: white;
.title {
height: 40px;
line-height: 40px;
text-indent: 15px;
// color: #fff;
background: #f1f5f8;
span {
font-size: 17px;
font-weight: 400;
}
}
.tip_warp {
height: 180px;
background: #f1f5f8;
.tip_content {
padding: 10px;
color: #000000;
.tip_level {
font-size: 17px;
color: red;
}
}
.tip_imgwarp {
img {
width: 130px;
height: 85px;
}
}
.btn_warp {
padding-top: 10px;
.tip_btn {
width: 80px;
}
}
}
}
.tip3 {
width: 400px;
height: 220px;
position: fixed;
z-index: 100;
bottom: 80px;
right: 830px;
border: 1px solid #ccc;
background: white;
.title {
height: 40px;
line-height: 40px;
text-indent: 15px;
// color: #fff;
background: f1f5f8;
span {
font-size: 17px;
font-weight: 400;
}
}
.tip_warp {
height: 180px;
background: #f1f5f8;
.tip_content {
padding: 10px;
color: #000000;
.tip_level {
font-size: 17px;
color: red;
}
}
.tip_imgwarp {
img {
width: 130px;
height: 85px;
}
}
.btn_warp {
padding-top: 10px;
.tip_btn {
width: 80px;
}
}
}
}
.tip4 {
width: 400px;
height: 220px;
position: fixed;
z-index: 100;
bottom: 80px;
right: 1240px;
border: 1px solid #ccc;
background: white;
.title {
height: 40px;
line-height: 40px;
text-indent: 15px;
// color: #fff;
background: f1f5f8;
span {
font-size: 17px;
font-weight: 400;
}
}
.tip_warp {
height: 180px;
background: #f1f5f8;
.tip_content {
padding: 10px;
color: #000000;
.tip_level {
font-size: 17px;
color: red;
}
}
.tip_imgwarp {
img {
width: 130px;
height: 85px;
}
}
.btn_warp {
padding-top: 10px;
.tip_btn {
width: 80px;
}
}
}
}
.el-divider--horizontal {
margin: 1px 0;
padding: 1px 1px;
background: 0 0;
border-top: 1px dashed;
}
// ie 弹出层闪烁
.el-dialog__wrapper {
transition: none !important;
&.dialog-fade-enter-active {
transition: none !important;
-ms-animation: none !important;
}
&.dialog-fade-leave-active {
transition: none !important;
-ms-animation: none !important;
}
}
</style>
src/App.vue
View file @ aeae8ce3
......@@ -10,21 +10,21 @@
<div :class="'tip' + (index + 1)">
<div class="title">
<el-row :span="24">
<el-col :sm="15" style="color:red;font-size:20px;"
<el-col :sm="15" style="color: red; font-size: 20px"
>{{ item.eventTypeName }}
</el-col>
<el-col :sm="9" style="text-align:right;padding-right:10px;"
<el-col :sm="9" style="text-align: right; padding-right: 10px"
>等级：
<span
class="tip_level"
v-if="item.eventLevel == 1"
style="color:red"
style="color: red"
>特别重大</span
>
<span
class="tip_level"
v-if="item.eventLevel == 2"
style="color:red"
style="color: red"
>重大</span
>
<span class="tip_level" v-if="item.eventLevel == 3">一般</span>
......@@ -36,7 +36,7 @@
<el-row class="tip_content" type="flex" justify="space-around">
<el-col :span="15">
<el-row :span="24">
<el-col :span="24" style="color:red"
<el-col :span="24" style="color: red"
>报警地点：{{ item.occurrenceSite }}
</el-col>
<el-col :span="24"
......@@ -138,7 +138,7 @@ export default {
name: 'app',
provide() {
return {
reload: this.reload,
reload: this.reload
}
},
data() {
......@@ -152,7 +152,7 @@ export default {
tipList: [],
showList: [],
src: window.CONFIG.bimPath,
takeoverInfo: '',
takeoverInfo: ''
}
},
watch: {
......@@ -164,25 +164,25 @@ export default {
} else {
this.dialogVisible = false
}
},
}
},
computed: {
takeover() {
return this.$store.state.d2admin.takeover.takeover
},
}
},
mounted() {
this.initWebSocket()
this.initWebSocket2()
// this.getDateList()
},
destroyed: function() {
destroyed: function () {
this.websocketclose()
},
methods: {
reload() {
this.isRouterAlive = false
this.$nextTick(function() {
this.$nextTick(function () {
this.isRouterAlive = true
})
},
......@@ -482,7 +482,7 @@ export default {
this.$http({
url: this.$http.adornUrl('/sysStationTakeover/agree'),
method: 'post',
data: item,
data: item
}).then((data) => {
if (data && data.code === 0) {
// this.$message.success('操作成功')
......@@ -500,7 +500,7 @@ export default {
this.$http({
url: this.$http.adornUrl('/sysStationTakeover/agree'),
method: 'post',
data: item,
data: item
}).then((data) => {
if (data && data.code === 0) {
// this.$message.success('操作成功')
......@@ -536,8 +536,8 @@ export default {
method: 'post',
params: this.$http.adornParams({
status: 1,
stationId: localStorage.getItem('stationId'),
}),
stationId: localStorage.getItem('stationId')
})
}).then((data) => {
if (data && data.code === 0) {
this.tipList = data.list
......@@ -571,7 +571,7 @@ export default {
* @param attr 排序的属性 如number属性
* @param rev true表示升序排列，false降序排序
* */
sortBy: function(attr, rev) {
sortBy: function (attr, rev) {
//第二个参数没有传递 默认升序排列
if (rev == undefined) {
rev = 1
......@@ -579,7 +579,7 @@ export default {
rev = rev ? 1 : -1
}
return function(a, b) {
return function (a, b) {
a = a[attr]
b = b[attr]
if (a < b) {
......@@ -601,18 +601,18 @@ export default {
var ruleForm = {
id: id,
status: 2,
beSend: true,
beSend: true
}
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsInfo/update`),
method: 'post',
data: ruleForm,
data: ruleForm
}).then((data) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
duration: 1500
})
//目前websocket未移到alarms项目，使用下列关闭
// this.tipList.splice(index, 1)
......@@ -622,8 +622,8 @@ export default {
this.$message.error(data.msg)
}
})
},
},
}
}
}
</script>
<style lang="scss">
......
src/main.js
View file @ aeae8ce3
......@@ -106,7 +106,7 @@ new Vue({
// this.$store.commit('d2admin/menu/headerSet', menuHeader)
// // 初始化菜单搜索功能
// this.$store.commit('d2admin/search/init', menuHeader)
const pattern = /[_`~^*|{}<>￥……*|&‘”“/#【】《》\\[\]$%+=]/ //这些字段不允许输入
const pattern = /[`~^*|{}<>￥……*|&‘”“/#【】《》\\[\]$%+=]/ //这些字段不允许输入
const testMark = function (s) {
return pattern.test(s)
}
......
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