Skip to content

A
AmosBankView
Commit b2c4121e authored by zhengjiangtao's avatar zhengjiangtao
Browse files
Options

告警数据隔离

parent eeff67e2
Hide whitespace changes
Inline Side-by-side
Showing with 279 additions and 152 deletions
src/view/bank/3dview/indexMap.js
View file @ b2c4121e
......@@ -49,18 +49,20 @@ const mapConfig = {
features: ['bg', 'road', 'point'] //隐藏默认楼块
};
const options = {
//默认 30 * 1000毫秒，收到 CONNACK 之前等待的时间，即连接超时时间。
connectTimeout: 40000,
// 客户端 ID,随机生成
clientId: 'bank_mqtt' + Math.random().toString(16).substr(2, 8),
clientId:
'bank_mqtt' +
Math.random()
.toString(16)
.substr(2, 8),
clean: true,
//默认 1000 毫秒，两次重新连接之间的间隔，客户端 ID 重复、认证失败等客户端会重新连接；
reconnectPeriod: 1000 * 50
}
let client = mqtt.connect(mqttURI, options)
};
let client = mqtt.connect(mqttURI, options);
const layers = [
new AMap.TileLayer({
......@@ -69,7 +71,7 @@ const layers = [
},
zIndex: 0
})
]
];
const twoDimensionalMapConfig = {
zooms: [_showZoom[0], _showZoom[2]],
......@@ -108,8 +110,9 @@ class IndexMap extends Component {
currentCard: 1,
currentCss: 1,
chartsViewFlag: [],
type: 'small',//当前图层展示的末端marker标识
styleCss: {//末端marker样式
type: 'small', //当前图层展示的末端marker标识
styleCss: {
//末端marker样式
background: `url('/src/assets/sy/afterbody.png')`,
backgroundSize: 'contain',
backgroundRepeat: 'no-repeat',
......@@ -121,15 +124,15 @@ class IndexMap extends Component {
lineHeight: '40px'
},
dotTipNum: 0,
pmdList: [],//跑马灯集合
pmdList: [], //跑马灯集合
xianVisible: false,
xianyangVisible: false,
xianAisleList: [],//西安通道集合
xianyangAisleList: [],//咸阳通道集合
centerList: [],//中心点集合
xianAisleList: [], //西安通道集合
xianyangAisleList: [], //咸阳通道集合
centerList: [], //中心点集合
bankInfoList: [],
isEncircleShow: false,//是否环绕显示
isOnClickCity: false//是否点击的城市
isEncircleShow: false, //是否环绕显示
isOnClickCity: false //是否点击的城市
};
}
......@@ -144,13 +147,13 @@ class IndexMap extends Component {
//mqtt接收可删除
receivcemqtt = () => {
client.on('connect', (e) => {
console.log("连接成功！！！")
client.on('connect', e => {
console.log('连接成功！！！');
//QoS0，最多一次送达。也就是发出去就fire掉，没有后面的事情了。
// QoS1，至少一次送达。发出去之后必须等待ack，没有ack，就要找时机重发
// QoS2，准确一次送达。消息id将拥有一个简单的生命周期。
// client.subscribe('bank/equipment/ping', { qos: 1 }, (res) => {
client.subscribe('bank/aisle/alarm', { qos: 1 }, (res) => {
client.subscribe('bank/aisle/alarm', { qos: 1 }, res => {
if (!res) {
console.log('订阅成功');
// fetchJsonAction('/src/_mock/map/eqp.json', (data) => {
......@@ -176,15 +179,15 @@ class IndexMap extends Component {
});
// 断开发起重连
client.on('reconnect', (error) => {
console.log('正在重连:', error)
client.on('reconnect', error => {
console.log('正在重连:', error);
});
// 链接异常处理
client.on('error', (error) => {
console.log('连接失败:', error)
client.on('error', error => {
console.log('连接失败:', error);
});
});
}
};
/**
* 初始化登录用户权限
*/
......@@ -203,14 +206,14 @@ class IndexMap extends Component {
});
lsTool.write('orgCode', orgCode);
}
};
/**
* 查询银行经纬度列表
*/
getBankInfoList = () => {
let { bankInfoList } = this.state;
getBankInfoListData().then((data) => {
getBankInfoListData().then(data => {
if (data) {
data.centerList.map(e => {
bankInfoList.push(e);
......@@ -224,7 +227,7 @@ class IndexMap extends Component {
});
}
});
}
};
/**
* 初始化数据，判断权限
......@@ -245,23 +248,23 @@ class IndexMap extends Component {
/**
* 查询通道信息及状态
*/
queryAisleList = (city) => {
queryAisleList = city => {
if (city === '西安') {
queryAisleDataByCity(city).then((data) => {
queryAisleDataByCity(city).then(data => {
let temp = this.isExist(xaMapData, data);
this.setState({
xianAisleList: temp
});
});
} else {
queryAisleDataByCity(city).then((data) => {
queryAisleDataByCity(city).then(data => {
let temp = this.isExist(xyMapData, data);
this.setState({
xianyangAisleList: temp
});
});
}
}
};
/**
* 重构数据，增加alarmState字段，渲染不同曲线颜色
......@@ -284,7 +287,7 @@ class IndexMap extends Component {
}
});
return mapData;
}
};
/**
* 经纬度获取坐标曲线
......@@ -295,7 +298,7 @@ class IndexMap extends Component {
*/
calcCoorArr = (point_start, point_end, num, key) => {
return calcCoorArrUtil(point_start, point_end, num, key);
}
};
/**
* 监听图层
......@@ -305,7 +308,7 @@ class IndexMap extends Component {
window.map.on('zoomchange', () => {
thisMap.setStyleC(window.map.getZoom());
});
}
};
/**
* 根据传入的名称查询匹配orgCode
......@@ -336,19 +339,19 @@ class IndexMap extends Component {
// }
// }
getCompanyId = (jsonObjDep) => {
getCompanyId = jsonObjDep => {
if (jsonObjDep && jsonObjDep !== null) {
let companyId = jsonObjDep.companySeq;
return companyId;
}
}
};
/**
* 点
*/
markerEvents = {
click: (e) => {
let map = { 'is3DPage': true, 'city': e.target.F.extData.city };
click: e => {
let map = { is3DPage: true, city: e.target.F.extData.city };
//this.props.indexViewChange(map);
}
};
......@@ -356,16 +359,17 @@ class IndexMap extends Component {
/**
* 圆
*/
circleEvents = { click: () => { } };
circleEvents = { click: () => {} };
/**
* 线
*/
lineEvents = {
click: (e) => {
click: e => {
let line = e.target.F.extData;
let pointData = { citys: line.name };
setTimeout(() => {//设置延时判断点击的线还是点
setTimeout(() => {
//设置延时判断点击的线还是点
let { isOnClickCity } = this.state;
if (isOnClickCity === false && line.name[0] === '西安') {
browserHistory.push({ pathname: '/biz/defaultRoute', state: { cityLine: JSON.stringify(pointData) } });
......@@ -375,8 +379,8 @@ class IndexMap extends Component {
};
/**
* 根据城市返回字典中配置的组织orgCode
*/
* 根据城市返回字典中配置的组织orgCode
*/
getSelectOrgCode = (city, dictionaryList) => {
let orgCode = null;
dictionaryList.map(item => {
......@@ -385,22 +389,20 @@ class IndexMap extends Component {
}
});
return orgCode;
}
};
/**
* 根据城市的orgCode，返回城市名称
*/
* 根据城市的orgCode，返回城市名称
*/
getSelectCityByOrgCode = (orgCode, dictionaryList) => {
let city = null;
dictionaryList.map(item => {
if (item.dictDataValue === orgCode) {
city = item.dictDataKey;
}
})
});
return city;
}
};
/**
* 切换城市
......@@ -442,8 +444,8 @@ class IndexMap extends Component {
// }
/**
* 展示陕西省地图
*/
* 展示陕西省地图
*/
showIndexMap(status) {
let { currentCss } = this.state;
this.setState({ isIndexMap: true, currentCss: status });
......@@ -453,8 +455,8 @@ class IndexMap extends Component {
}
/**
* 展示全国地图
*/
* 展示全国地图
*/
show2dMap(currentCss) {
this.setState({ isIndexMap: false, currentCss });
}
......@@ -479,14 +481,14 @@ class IndexMap extends Component {
} else {
message.danger('当前没有巡检计划');
}
}
};
closePatrol = () => {
this.setState({
patrolView: false
});
}
chartsView = (itemKey) => {
};
chartsView = itemKey => {
if (itemKey.length < 1 || itemKey[0] === 'dangerMsg' || itemKey[0] === 'applyMsg') {
this.setState({
chartsViewFlag: itemKey,
......@@ -497,12 +499,12 @@ class IndexMap extends Component {
chartsViewFlag: itemKey
});
}
}
};
/**
* 不同图层渲染图标大小
*/
setStyleC = (zoom) => {
setStyleC = zoom => {
if (zoom >= 8) {
this.setState({
type: 'middle',
......@@ -527,7 +529,7 @@ class IndexMap extends Component {
}
});
}
}
};
/**
* 13层以上设置地名环绕
......@@ -536,12 +538,12 @@ class IndexMap extends Component {
this.setState({
isEncircleShow: true
});
}
};
/**
* 通道末端marker点
*/
setBodyMarker = (bankInfoList) => {
setBodyMarker = bankInfoList => {
let { styleCss, type, isEncircleShow } = this.state;
if (isEncircleShow) {
// return xaMapData.map((item, index) => {
......@@ -555,14 +557,23 @@ class IndexMap extends Component {
// }
// });
return bankInfoList.map((item, index) => {
if (item.eName !== 'xian' && item.eName !== 'xianyang' && item.eName !== 'xidajie' && item.eName !== 'bj-bank' && item.eName !== 'wx-bank' && item.eName !== 'sh-bank') {
return (<Marker zIndex={19} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents}>
<div className={`after_line_${type} line${item.id}`} style={styleCss} ></div>
<div className={`after_circle_title`}>
<span>{item.aName}</span>
{item.status === 1 && <div className={`pulse-spread-circle`} />}
</div>
</Marker>)
if (
item.eName !== 'xian' &&
item.eName !== 'xianyang' &&
item.eName !== 'xidajie' &&
item.eName !== 'bj-bank' &&
item.eName !== 'wx-bank' &&
item.eName !== 'sh-bank'
) {
return (
<Marker zIndex={19} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents}>
<div className={`after_line_${type} line${item.id}`} style={styleCss}></div>
<div className={`after_circle_title`}>
<span>{item.aName}</span>
{item.status === 1 && <div className={`pulse-spread-circle`} />}
</div>
</Marker>
);
}
});
} else {
......@@ -578,93 +589,122 @@ class IndexMap extends Component {
// }
// });
return bankInfoList.map((item, index) => {
if (item.eName !== 'xian' && item.eName !== 'xianyang' && item.eName !== 'xidajie' && item.eName !== 'bj-bank' && item.eName !== 'wx-bank' && item.eName !== 'sh-bank') {
return (<Marker zIndex={19} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents}>
<div className={`after_line_${type} line${item.id}`} style={styleCss} ></div>
{/*<div className={`after_circle_${type} title${item.id}`}>
if (
item.eName !== 'xian' &&
item.eName !== 'xianyang' &&
item.eName !== 'xidajie' &&
item.eName !== 'bj-bank' &&
item.eName !== 'wx-bank' &&
item.eName !== 'sh-bank'
) {
return (
<Marker zIndex={19} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents}>
<div className={`after_line_${type} line${item.id}`} style={styleCss}></div>
{/*<div className={`after_circle_${type} title${item.id}`}>
<img src={item.imgSrc} ></img>
<span>{item.alias}</span>
</div>*/}
</Marker>);
</Marker>
);
}
});
}
}
};
/**
*设置中心点的marker点
*
* @memberof IndexMap
*/
setCenterMarker = (centerList) => {
setCenterMarker = centerList => {
let { isEncircleShow, xianVisible, xianyangVisible } = this.state;
if (isEncircleShow) {
return centerList.map((item, index) => {
if (item) {
return (<Marker key={item} zIndex={20} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents} extData={{ 'city': item.eName }}>
<div className={`after_circle_title_center`}>
<span onClick={() => { this.markerOnClick(item.eName) }}>{item.aName}</span>
{item.eName === 'xian' && xianVisible && <div className="pulse-spread-xian" />}
{item.eName === 'xianyang' && xianyangVisible && <div className="pulse-spread-xianyang" />}
</div>
<div className={`after_circle_center`}>
<img src="/src/assets/sy/center.png" onClick={() => { this.markerOnClick(item.eName) }}></img>
</div>
</Marker>);
return (
<Marker key={item} zIndex={20} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents} extData={{ city: item.eName }}>
<div className={`after_circle_title_center`}>
<span
onClick={() => {
this.markerOnClick(item.eName);
}}
>
{item.aName}
</span>
{item.eName === 'xian' && xianVisible && <div className="pulse-spread-xian" />}
{item.eName === 'xianyang' && xianyangVisible && <div className="pulse-spread-xianyang" />}
</div>
<div className={`after_circle_center`}>
<img
src="/src/assets/sy/center.png"
onClick={() => {
this.markerOnClick(item.eName);
}}
></img>
</div>
</Marker>
);
}
});
} else {
return centerList.map((item, index) => {
if (item) {
return (<Marker key={item} zIndex={20} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents} extData={{ 'city': item.eName }}>
<div className={`after_circle_small center`}>
<img src="/src/assets/sy/center.png" onClick={() => { this.markerOnClick(item.eName) }}></img>
</div>
</Marker>);
return (
<Marker key={item} zIndex={20} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents} extData={{ city: item.eName }}>
<div className={`after_circle_small center`}>
<img
src="/src/assets/sy/center.png"
onClick={() => {
this.markerOnClick(item.eName);
}}
></img>
</div>
</Marker>
);
}
});
}
}
};
/**
* 根据状态匹配不同通道颜色
* @param {} alarmState
*/
setSelectAisleStyle = (alarmState) => {
setSelectAisleStyle = alarmState => {
switch (alarmState) {
case '正常':
return this.state.selectStyle;
case '异常':
return this.setSelectColor(4);
}
}
};
setUnSelectAisleStyle = (alarmState) => {
setUnSelectAisleStyle = alarmState => {
switch (alarmState) {
case '正常':
return this.state.unSelectStyle;
case '异常':
return this.setUnSelectColor(4);
}
}
};
setSelectColor = (index) => {
setSelectColor = index => {
let colorStyle = { strokeColor: LineColors[index], fillColor: LineColors[index], strokeWeight: '3' };
return colorStyle;
}
};
setUnSelectColor = (index) => {
setUnSelectColor = index => {
let colorStyle = { strokeColor: LineColors[index], fillColor: LineColors[index], strokeWeight: '1' };
return colorStyle;
}
};
/**
* 点击名称切换三维
*/
markerOnClick = (city, sourceIdStr) => {
//跳转告警页面
if (city !== 'xian' && city !== 'xianyang' && city !== 'xidajie'){
if (!sourceIdStr){
if (city !== 'xian' && city !== 'xianyang' && city !== 'xidajie') {
if (!sourceIdStr) {
message.danger('该银行未绑定设备');
return;
}
......@@ -683,40 +723,37 @@ class IndexMap extends Component {
let companyName = this.getSelectCityByOrgCode(selectedCompanyOrg, dicCodeList);
let map = null;
if (companyName && companyName.indexOf("清算中心") !== -1) {
if (companyName && companyName.indexOf('清算中心') !== -1) {
let orgCode = this.getSelectOrgCode(city, dicCodeList);
if (city === 'xian' || city === 'xianyang' || city === 'xidajie') {
map = { 'is3DPage': true, 'city': city, 'orgCode': orgCode };
map = { is3DPage: true, city: city, orgCode: orgCode };
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '' };
map = { is3DPage: true, city: '', orgCode: '' };
}
} else if (companyName && companyName.indexOf("科技处") !== -1) {
} else if (companyName && companyName.indexOf('科技处') !== -1) {
// map = { 'is3DPage': true, 'city': '', 'orgCode': selectedCompanyOrg };
let newOrgCode = null;
if (city === 'xian') {
newOrgCode = this.getSelectOrgCode('科技处西安', dicCodeList);
};
}
if (city === 'xianyang') {
newOrgCode = this.getSelectOrgCode('科技处咸阳', dicCodeList);
};
}
if (city === 'xian' || city === 'xianyang' || city === 'xidajie') {
map = { 'is3DPage': true, 'city': city, 'orgCode': newOrgCode };
map = { is3DPage: true, city: city, orgCode: newOrgCode };
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '' };
map = { is3DPage: true, city: '', orgCode: '' };
}
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '' };
map = { is3DPage: true, city: '', orgCode: '' };
}
this.props.indexViewChange(map);
}
};
markerOnClick1 = (city, flag, id, pointName, pointAttrs, floor, pointtype) => {
this.state.isOnClickCity = true;
let selectedCompanyOrg = lsTool.read('selectedCompanyOrg');
let dictionaryList = lsTool.read('dictionaryList');
......@@ -724,14 +761,24 @@ class IndexMap extends Component {
let companyName = this.getSelectCityByOrgCode(selectedCompanyOrg, dicCodeList);
let map = null;
if (companyName && companyName.indexOf("清算中心") !== -1) {
if (companyName && companyName.indexOf('清算中心') !== -1) {
let orgCode = this.getSelectOrgCode(city, dicCodeList);
if (city === 'xian' || city === 'xianyang' || city === 'xidajie') {
map = { 'is3DPage': true, 'city': city, 'orgCode': orgCode, 'flag': flag, 'pid': id, 'pointName': pointName, 'pointAttrs': pointAttrs, 'floor': floor, 'pointtype': pointtype };
map = {
is3DPage: true,
city: city,
orgCode: orgCode,
flag: flag,
pid: id,
pointName: pointName,
pointAttrs: pointAttrs,
floor: floor,
pointtype: pointtype
};
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '', 'flag': flag, 'pid': id, 'pointName': pointName, 'pointAttrs': pointAttrs, 'floor': floor, 'pointtype': pointtype };
map = { is3DPage: true, city: '', orgCode: '', flag: flag, pid: id, pointName: pointName, pointAttrs: pointAttrs, floor: floor, pointtype: pointtype };
}
} else if (companyName && companyName.indexOf("科技处") !== -1) {
} else if (companyName && companyName.indexOf('科技处') !== -1) {
// map = { 'is3DPage': true, 'city': '', 'orgCode': selectedCompanyOrg };
let newOrgCode = null;
if (city === 'xian') {
......@@ -743,31 +790,71 @@ class IndexMap extends Component {
}
if (city === 'xian' || city === 'xianyang' || city === 'xidajie') {
map = { 'is3DPage': true, 'city': city, 'orgCode': newOrgCode, 'flag': flag, 'pid': id, 'pointName': pointName, 'pointAttrs': pointAttrs, 'floor': floor, 'pointtype': pointtype };
map = {
is3DPage: true,
city: city,
orgCode: newOrgCode,
flag: flag,
pid: id,
pointName: pointName,
pointAttrs: pointAttrs,
floor: floor,
pointtype: pointtype
};
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '', 'flag': flag, 'pid': id, 'pointName': pointName, 'pointAttrs': pointAttrs, 'floor': floor, 'pointtype': pointtype };
map = { is3DPage: true, city: '', orgCode: '', flag: flag, pid: id, pointName: pointName, pointAttrs: pointAttrs, floor: floor, pointtype: pointtype };
}
} else {
map = { 'is3DPage': true, 'city': '', 'orgCode': '', 'flag': flag, 'pid': id, 'pointName': pointName, 'pointAttrs': pointAttrs, 'floor': floor, 'pointtype': pointtype };
map = { is3DPage: true, city: '', orgCode: '', flag: flag, pid: id, pointName: pointName, pointAttrs: pointAttrs, floor: floor, pointtype: pointtype };
}
this.props.indexViewChange(map);
}
};
dotTipNumChange = (num) => {
dotTipNumChange = num => {
if (num !== this.state.dotTipNum) {
this.setState({
dotTipNum: num
});
}
}
};
existData = (code, orgCode) => {
let xianshi = false;
if ( code ){
if (code.indexOf('#') !== -1) {
let split = code.split('#') || [];
split.map(item => {
if (item.indexOf('-') !== -1) {
let array = item.split('-') || [];
if (array.length > 0 && array[0] === orgCode) {
xianshi = true;
}
}else{
if ( item === orgCode){
xianshi = true;
}
}
});
} else {
let arr = code.split('-') || [];
if (arr.length > 0 && arr[0] === orgCode) {
xianshi = true;
}
}
}
return xianshi;
};
/**
* 初始化告警数据
*/
queeryAlarms = () => {
let dictionaryList = lsTool.read('dictionaryList');
let dicCodeList = JSON.parse(dictionaryList);
let xianCode = this.getSelectOrgCode('xian', dicCodeList);
......@@ -783,26 +870,34 @@ class IndexMap extends Component {
getAlarms().then(data => {
//过滤该公司没有权限的设备（有则跑马灯显示，否则不显示）
let newData = [];
data.map(e => {
if ((e.code.indexOf(orgCode) !== -1) || (e.authOrg && e.authOrg.indexOf(orgCode) !== -1)) {
let xianshi = this.existData(e.code,orgCode);
let authOrgXianshi = this.existData(e.authOrg,orgCode);
if (xianshi || authOrgXianshi) {
newData.push(e);
}
})
});
if (!utils.isEmpty(newData) && utils.isArray(newData)) {
const xianFlag = newData.some(e => {
// if (e.code === xianCode) {
if (e.code.startsWith(xianCode) || (e.authOrg && e.authOrg.indexOf(xianCode) !== -1 || (e.authOrg && e.authOrg.indexOf(kejichuxianCode) !== -1))) {
if (
e.code.startsWith(xianCode) ||
((e.authOrg && e.authOrg.indexOf(xianCode) !== -1) || (e.authOrg && e.authOrg.indexOf(kejichuxianCode) !== -1))
) {
return true;
}
});
const xianyangFlag = newData.some(e => {
if (e.code.startsWith(xianyangCode) || (e.authOrg && e.authOrg.indexOf(xianyangCode) !== -1 || (e.authOrg && e.authOrg.indexOf(kejichuxianyangCode) !== -1))) {
if (
e.code.startsWith(xianyangCode) ||
((e.authOrg && e.authOrg.indexOf(xianyangCode) !== -1) || (e.authOrg && e.authOrg.indexOf(kejichuxianyangCode) !== -1))
) {
return true;
}
});
this.setState({
pmdList: newData,
xianVisible: xianFlag,
......@@ -814,9 +909,7 @@ class IndexMap extends Component {
}
});
}
}
};
/**
* 根据告警city或者eqpId的重构数据
......@@ -836,12 +929,12 @@ class IndexMap extends Component {
this.setState({
bankInfoList
});
}
};
/**
* webSocket接收轨迹数据
*/
handleData = (data) => {
handleData = data => {
let dictionaryList = lsTool.read('dictionaryList');
let dicCodeList = JSON.parse(dictionaryList);
let xianCode = this.getSelectOrgCode('xian', dicCodeList);
......@@ -872,12 +965,12 @@ class IndexMap extends Component {
xianVisible: handleXianFlag,
xianyangVisible: handleXianyangFlag
});
}
};
/**
* webSocket接收通道状态数据
*/
aisleIndexHandleData = (data) => {
aisleIndexHandleData = data => {
//data = data.index;
console.log('aisleWS', data);
if (data) {
......@@ -901,14 +994,37 @@ class IndexMap extends Component {
// });
// }
}
}
};
render() {
const events = {
created: this.setInstanceToGlobal
};
let { mapCenter, isIndexMap, patrolView, patrolDescData, city, selectStyle, unSelectStyle, orgCode, sequenceNbr, companys, currentCard, currentCss,
chartsViewFlag, dotTipNum, pmdList, xianVisible, xianyangVisible, xianAisleList, xianyangAisleList, centerList, isEncircleShow, bankInfoList, styleCss } = this.state;
let {
mapCenter,
isIndexMap,
patrolView,
patrolDescData,
city,
selectStyle,
unSelectStyle,
orgCode,
sequenceNbr,
companys,
currentCard,
currentCss,
chartsViewFlag,
dotTipNum,
pmdList,
xianVisible,
xianyangVisible,
xianAisleList,
xianyangAisleList,
centerList,
isEncircleShow,
bankInfoList,
styleCss
} = this.state;
let cardCss1 = 'small-card-css';
let cardCss2 = 'small-card-css';
// 旧版点击样式，正式上线前需删除
......@@ -944,10 +1060,10 @@ class IndexMap extends Component {
return (
<div className="content indexPage">
<AmosWebSocket ref={node => this.aws = node} url={wsURL} onMessage={this.handleData} reconnect debug />
<AmosWebSocket ref={node => this.aws = node} url={aisleURL} onMessage={this.aisleIndexHandleData} reconnect debug />
<AmosWebSocket ref={node => (this.aws = node)} url={wsURL} onMessage={this.handleData} reconnect debug />
<AmosWebSocket ref={node => (this.aws = node)} url={aisleURL} onMessage={this.aisleIndexHandleData} reconnect debug />
<AlarmMarquee pmdList={pmdList} />
<div className='body-left'>
<div className="body-left">
{/**<div className='body-left' style={{ display: chartsViewFlag[0] === 'dangerMsg' ? 'block' : 'none' }}>**/}
{/**<div><img src='/src/assets/sy/indexLeft.png' /></div>*/}
<LeftCharts currentCode={orgCode} dotTipNumChange={this.dotTipNumChange} />
......@@ -965,7 +1081,12 @@ class IndexMap extends Component {
</div>
</Col>
</div>*/}
<div className="new_track" onClick={() => { currentCss === 1 ? this.show2dMap(2) : this.showIndexMap(1) }}>
<div
className="new_track"
onClick={() => {
currentCss === 1 ? this.show2dMap(2) : this.showIndexMap(1);
}}
>
<img src={currentCss === 1 ? newTrackUnSelect : newTrackSelect} />
</div>
{/* <div className="middle">
......@@ -979,7 +1100,7 @@ class IndexMap extends Component {
</div>
{currentCss === 1 && <LeftDown></LeftDown>}
{isIndexMap ? (
<div className='body-center'>
<div className="body-center">
<BaseMap events={events} center={mapCenter} {...mapConfig}>
{/* 三个可点击的中心点（西安|咸阳|西大街） */}
{/* {(centerList || []).map((item, index) => (
......@@ -1032,16 +1153,23 @@ class IndexMap extends Component {
}
</Marker>
))}*/}
{(bankInfoList || []).map((item) => (
<Marker key={item.id} zIndex={18} position={{ longitude: item.lng, latitude: item.lat }} events={this.markerEvents} extData={{ 'city': item.eName }}>
{(bankInfoList || []).map(item => (
<Marker
key={item.id}
zIndex={18}
position={{ longitude: item.lng, latitude: item.lat }}
events={this.markerEvents}
extData={{ city: item.eName }}
>
{isEncircleShow === false && <TwinkleDiv info={item} markerOnClick={this.markerOnClick} styleCss={styleCss} />}
</Marker>
))}
</BaseMap>
</div>
) : (<TwoDimensionalMap twoDimensionalMapConfig={twoDimensionalMapConfig}></TwoDimensionalMap>)
}
<div className='body-right' >
) : (
<TwoDimensionalMap twoDimensionalMapConfig={twoDimensionalMapConfig}></TwoDimensionalMap>
)}
<div className="body-right">
<RightCharts currentCode={orgCode} curCompanyId={sequenceNbr} patrolDetailView={this.patrolDetailView} chartsViewFlag={chartsViewFlag[0]} />
</div>
{/*{
......@@ -1053,7 +1181,6 @@ class IndexMap extends Component {
{patrolView ? <PatrolDetail closePatrol={this.closePatrol} dataList={patrolDescData} markerOnClick1={this.markerOnClick1} /> : ''}
{/*{patrolView && chartsViewFlag.length > 0 ? <PatrolDetail closePatrol={this.closePatrol} dataList={patrolDescData} /> : ''}
<IndexSidePane chartsView={this.chartsView} nowKey={chartsViewFlag} dotTipNum={dotTipNum} />*/}
</div>
);
}
......
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