Compare commits

...

2 Commits

7 changed files with 239 additions and 253 deletions

View File

@ -1,12 +1,10 @@
NODE_ENV = development
# 正式服务器
#VUE_APP_BASE_API =http://223.99.16.253:9001/api
#VUE_APP_BASE_IMG_URL =http://223.99.16.253:9001
# APP_BASE_WS_URL = ws://221.2.83.254:9002/ws
VUE_APP_BASE_API =http://221.2.83.254:9001/api
VUE_APP_BASE_IMG_URL =http://221.2.83.254:9001
# 测试服务区
VUE_APP_BASE_API = http://123.132.248.154:9224/api
VUE_APP_BASE_IMG_URL = http://123.132.248.154:9224
APP_BASE_WS_URL = ws://123.132.248.154:9225/ws
# VUE_APP_BASE_API = http://123.132.248.154:9224/api
# VUE_APP_BASE_IMG_URL = http://123.132.248.154:9224

View File

@ -1,10 +1,8 @@
NODE_ENV = production
#VUE_APP_BASE_API = http://192.168.10.123:9159/api
#VUE_APP_BASE_IMG_URL = http://192.168.10.123:9159
#VUE_APP_BASE_API = http://123.132.248.154:9224/api
#VUE_APP_BASE_IMG_URL = http://123.132.248.154:9224
VUE_APP_BASE_API = http://123.132.248.154:9223/api
VUE_APP_BASE_IMG_URL = http://123.132.248.154:9223
# 正式服务器
VUE_APP_BASE_API =http://221.2.83.254:9001/api
VUE_APP_BASE_IMG_URL =http://221.2.83.254:9001
# 测试服务区
# VUE_APP_BASE_API = http://123.132.248.154:9224/api
# VUE_APP_BASE_IMG_URL = http://123.132.248.154:9224

View File

@ -0,0 +1,3 @@
const WS_URL_PRODUCTION = 'ws://221.2.83.254:9002/ws'
// const WS_URL_PRODUCTION = 'ws://123.132.248.154:9225/ws'
export const WS_URL = WS_URL_PRODUCTION

View File

@ -1,274 +1,260 @@
<template>
<div class="table-box">
<div class="max-w flex jc-sb">
<div class="flex-1 mr-1 call-persondata flex">
<div class="flex-1 flex ai-c jc-c">
<img class="img" src="img/zcry.png" />
</div>
<div class="flex-1 flex column jc-c">
<div class="titles">注册人员</div>
<div class="span">{{listDataInfo.allcount}}</div>
</div>
</div>
<div class="flex-1 call-persondata flex">
<div class="flex-1 flex ai-c jc-c">
<img class="img" src="img/zxry.png" />
</div>
<div class="flex-1 flex column jc-c">
<div class="titles">在线人员</div>
<div class="span">{{listDataInfo.onlineCount}}</div>
</div>
</div>
</div>
<div class="call-line"></div>
<div class="call-content flex column">
<el-carousel height="150px" indicator-position="outside">
<el-carousel-item v-for="(item,index) in BannersArr" :key="index">
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">督查长</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.dcz}}</div>
</div>
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">副督查长</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.fdcz}}</div>
</div>
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">防火片区</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.xzqmc}}</div>
</div>
</el-carousel-item>
</el-carousel>
</div>
<div >
<img class="call-phone cursor" src="img/callphone.png" @click="callUser" />
</div>
<div class="table-box">
<div class="max-w flex jc-sb">
<div class="flex-1 mr-1 call-persondata flex">
<div class="flex-1 flex ai-c jc-c">
<img class="img" src="img/zcry.png" />
</div>
<div class="flex-1 flex column jc-c">
<div class="titles">注册人员</div>
<div class="span">{{ listDataInfo.allcount }}</div>
</div>
</div>
<div class="flex-1 call-persondata flex">
<div class="flex-1 flex ai-c jc-c">
<img class="img" src="img/zxry.png" />
</div>
<div class="flex-1 flex column jc-c">
<div class="titles">在线人员</div>
<div class="span">{{ listDataInfo.onlineCount }}</div>
</div>
</div>
</div>
<div class="call-line"></div>
<div class="call-content flex column">
<el-carousel height="150px" indicator-position="outside">
<el-carousel-item v-for="(item, index) in BannersArr" :key="index">
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">督查长</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height: 28px">
{{ item.dcz }}
</div>
</div>
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">副督查长</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height: 28px">
{{ item.fdcz }}
</div>
</div>
<div class="content-li flex">
<div class="content-title flex ai-c">
<span class="content-title-span"></span>
<span class="fz-14 fw-b fc-w">防火片区</span>
</div>
<div class="flex-1 fz-14 fc-w" style="line-height: 28px">
{{ item.xzqmc }}
</div>
</div>
</el-carousel-item>
</el-carousel>
</div>
<div>
<img
class="call-phone cursor"
src="img/callphone.png"
@click="callUser"
/>
</div>
</div>
</template>
<script>
import axios from 'axios'
import { postMethodCommon,getMethodCommon } from '@/api/common.js';
import { postMethodCommon, getMethodCommon } from "@/api/common.js";
import { WS_URL } from "../../../utils/websocketApi";
export default {
name: 'setting',
props:['globalmap'],
data(){
return {
allPersonArr:[],
areaName: localStorage.getItem("areaName"),
BannersArr:[
{
title: '张效玺',
label: '解清 杨东霞 鲍衍萍',
value: '大田庄乡、上冶镇、国有塔山林场平山分区、国有塔山林场牛岚分区'
},
{
title: '刘文军',
label: '朱孔现 王永祥 马杰',
value: '薛庄镇、胡阳镇、国有大青山林场、山东沂蒙抽水蓄能有限公司'
},
{
title: '张 雷',
label: '张 浩 刘成武',
value: '费城街道、国有祊河林场、国有许家崖林场'
},
{
title: '孔德阳',
label: '谭成亮 纪成永 于 杰 刘 露 刘宏达 张勇 ',
value: '梁邱镇、石井镇、新庄镇、朱田镇、国有老虎山林场'
},
{
title: '黄 芸',
label: '王 雷',
value: '东蒙镇、国有塔山林场塔山分区、国有塔山林场谭庄分区、山东天蒙旅游开发有限公司'
},
{
title: '赵元吉',
label: '龙希锋 周均营 郭永军 孟凡学',
value: '探沂镇、马庄镇'
}
],
listDataInfo:[]
name: "setting",
props: ["globalmap"],
data() {
return {
allPersonArr: [],
areaName: localStorage.getItem("areaName"),
BannersArr: [],
listDataInfo: [],
};
},
watch: {},
created() {
this.initWebSocket();
this.getListData();
// 线
this.getOnLineInfo();
this.getBannerArr();
},
mounted() {
setInterval(() => {
this.getOnLineInfo();
}, 2000);
},
methods: {
getBannerArr() {
getMethodCommon("/FireGrid/GetTowInfo", {
pageindex: 1,
pagesize: 20,
}).then((res) => {
if (res.code == 200) {
this.BannersArr = res.data;
}
});
},
watch:{
getOnLineInfo() {
getMethodCommon("/FireManagement/GetOnOffLineInfo").then((res) => {
this.listDataInfo = res.data;
});
},
created(){
this.initWebSocket()
this.getListData()
// 线
this.getOnLineInfo();
this.getBannerArr();
getListData() {
let arr = [1, 2];
let _this = this;
postMethodCommon(
"/FireCodePC/GetForestRangers?areaname=" + this.areaName,
arr
).then((res) => {
let rel = res.data;
_this.allPersonArr = rel;
});
},
mounted(){
callUser() {
this.$emit("callUser");
},
methods:{
getBannerArr(){
getMethodCommon("/FireGrid/GetTowInfo",{pageindex:1,pagesize:20}).then(res=>{
if(res.code == 200){
this.BannersArr = res.data;
}
})
},
getOnLineInfo(){
getMethodCommon("/FireManagement/GetOnOffLineInfo").then(res =>{
this.listDataInfo = res.data
})
},
getListData(){
let arr = [1,2]
let _this = this
postMethodCommon("/FireCodePC/GetForestRangers?areaname="+this.areaName,arr).then(res =>{
let rel = res.data
_this.allPersonArr = rel
})
},
callUser(){
this.$emit("callUser");
},
initWebSocket() {
let _this = this;
if ("WebSocket" in window) {
// web socket
var ws = new WebSocket(process.env.NODE_ENV.APP_BASE_WS_URL);
var heartCheck;
ws.onopen = function () {
//Web Socket 使 send()
console.log('WEBSOCKET-ONLINE')
heartCheck = setInterval(function() {
ws.send('HeartBeat');
}, 5000);
};
ws.onmessage = function (evt) {
clearInterval(heartCheck);
heartCheck = setInterval(function() {
ws.send('HeartBeat');
}, 5000);
_this.getOnLineInfo()
};
ws.onclose = function () {
console.log('WEBSOCKET-CLOSED')
clearInterval(heartCheck);
_this.initWebSocket()
};
} else {
// WebSocket
alert("您的浏览器不支持 WebSocket!");
}
},
}
}
initWebSocket() {
let _this = this;
if ("WebSocket" in window) {
// web socket
var ws = new WebSocket(WS_URL);
var heartCheck;
ws.onopen = function () {
//Web Socket 使 send()
console.log("WEBSOCKET-ONLINE");
heartCheck = setInterval(function () {
ws.send("HeartBeat");
}, 5000);
};
ws.onmessage = function (evt) {
clearInterval(heartCheck);
heartCheck = setInterval(function () {
ws.send("HeartBeat");
}, 5000);
};
ws.onclose = function () {
console.log("WEBSOCKET-CLOSED");
clearInterval(heartCheck);
_this.initWebSocket();
};
} else {
// WebSocket
alert("您的浏览器不支持 WebSocket!");
}
},
},
};
</script>
<style scoped>
.table-box{
width: 100%;
height: 100%;
padding: 20px 15px;
.table-box {
width: 100%;
height: 100%;
padding: 20px 15px;
}
.call-persondata{
height: 86px;
border-image: linear-gradient(270deg, rgba(255, 223, 105, 0), rgba(255, 189, 56, 1)) 1 1;
.call-persondata {
height: 86px;
border-image: linear-gradient(
270deg,
rgba(255, 223, 105, 0),
rgba(255, 189, 56, 1)
)
1 1;
}
.call-persondata .img{
width: 68px;
height: 67px;
.call-persondata .img {
width: 68px;
height: 67px;
}
.call-persondata .titles{
font-weight: bold;
color: #FFA513;
font-size: 18px;
.call-persondata .titles {
font-weight: bold;
color: #ffa513;
font-size: 18px;
}
.call-persondata .span{
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #D0D0D0;
.call-persondata .span {
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #d0d0d0;
}
.call-line{
width: 404px;
height: 2px;
margin-top: 25px;
.call-line {
width: 404px;
height: 2px;
margin-top: 25px;
}
.call-content{
height: 185px;
.call-content {
height: 185px;
}
.content-li{
width: 400px;
min-height: 28px;
/* background: linear-gradient(270deg, rgba(121,74,14,0) 0%, #442406 100%); */
background-image:url(/img/call-center-bar.png);
background:100% 100%;
margin-top: 12px;
.content-li {
width: 400px;
min-height: 28px;
/* background: linear-gradient(270deg, rgba(121,74,14,0) 0%, #442406 100%); */
background-image: url(/img/call-center-bar.png);
background: 100% 100%;
margin-top: 12px;
}
.content-title{
width: 111px;
height: 28px;
/* background-image: url(/img/callleftbg.png); */
background-size: 100% 28px;
margin-right: 8px;
.content-title {
width: 111px;
height: 28px;
/* background-image: url(/img/callleftbg.png); */
background-size: 100% 28px;
margin-right: 8px;
}
.content-title-span{
width: 6px;
height: 6px;
background: #FACD44;
margin: 0 10px;
.content-title-span {
width: 6px;
height: 6px;
background: #facd44;
margin: 0 10px;
}
.call-phone{
width: 360px;
height: 78px;
.call-phone {
width: 360px;
height: 78px;
}
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
border: 0
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
border: 0;
}
::-webkit-scrollbar {
height: 10px;
width: 10px;
background: transparent;
border-radius: 5px
height: 10px;
width: 10px;
background: transparent;
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
padding-top: 100px;
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
background-color: #797979;
min-height: 28px;
border-radius: 4px;
background-clip: padding-box
padding-top: 100px;
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1),
inset -1px -1px 0 rgba(0, 0, 0, 0.07);
background-color: #797979;
min-height: 28px;
border-radius: 4px;
background-clip: padding-box;
}
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
border: 0
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
border: 0;
}
::-webkit-scrollbar-thumb:hover {
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .25);
background-color: rgba(0, 0, 0, .4)
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.25);
background-color: rgba(0, 0, 0, 0.4);
}
::-webkit-scrollbar-thumb:active {
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .35);
background-color: rgba(0, 0, 0, .5)
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.35);
background-color: rgba(0, 0, 0, 0.5);
}
</style>
</style>

View File

@ -25,7 +25,7 @@
<script>
let BASE_URL = process.env.VUE_APP_BASE_API
import axios from 'axios'
import { parse } from '../lib/handleGeojson';
import { WS_URL } from "../../../utils/websocketApi";
export default {
name: 'toolbox',
props:['globalmap','checkList','checkNumber','mergeSuccessRandom'],
@ -72,7 +72,7 @@
if ("WebSocket" in window) {
// web socket
var ws = new WebSocket(process.env.NODE_ENV.APP_BASE_WS_URL);
var ws = new WebSocket(WS_URL);
var heartCheck;
ws.onopen = function () {
//Web Socket 使 send()

View File

@ -44,7 +44,7 @@
<script>
let BASE_URL = process.env.VUE_APP_BASE_API
import axios from 'axios'
import { parse } from '../lib/handleGeojson';
import {WS_URL} from '../../../utils/websocketApi'
export default {
name: 'toolbox',
props:['globalmap','checkList','checkNumber','mergeSuccessRandom'],
@ -284,8 +284,7 @@
if ("WebSocket" in window) {
// web socket
var ws = new WebSocket(process.env.NODE_ENV.APP_BASE_WS_URL);
var ws = new WebSocket(WS_URL);
ws.onopen = function () {
//Web Socket 使 send()
console.log('WEBSOCKET-ONLINE')

View File

@ -22,6 +22,7 @@
import { mapState,mapGetters } from "vuex";
import axios from "axios";
import { postMethodCommon,getMethodCommon } from '@/api/common.js';
import {WS_URL} from '../../../utils/websocketApi'
export default {
name: 'monitorbox',
computed: {
@ -158,7 +159,8 @@ export default {
let _this = this;
if ("WebSocket" in window) {
// web socket
var ws = new WebSocket(process.env.NODE_ENV.APP_BASE_WS_URL);
var ws = new WebSocket(WS_URL);
var heartCheck;
ws.onopen = function () {
//Web Socket 使 send()