Merge branch 'developer' of http://172.16.10.76/station/amos-station-module-view into developer

mods/components/3dviewConvertor/consts/imgStatic.js

@@ -227,3 +227,11 @@ export const marker3DIoncMapper = {
 
 
 };
+
+
+export const safetyIndexIconMapper = {
+  allEror: '/mods/components/3dviewConvertor/threeres/markers/exception_all@2x.png',
+  faultEror: '/mods/components/3dviewConvertor/threeres/markers/exception_fault.png',
+  riskEror: '/mods/components/3dviewConvertor/threeres/markers/exception_risk.png',
+  transparent_rpn: require('./../threeres/markers/transparent_rpn.png')
+};

mods/components/3dviewConvertor/consts/urlConsts.js

@@ -62,15 +62,8 @@ export const FscSerUrl = {
   safetyIndexWeekUrl: completePrefix(convertorURI, 'api/view3d/safetyIndex/week'),//一周安全指数趋势查询
   statisticsCheckUrl: completePrefix(convertorURI, 'api/view3d/statistics/check'),//今日巡检统计接口
   statisticsDutyUrl: completePrefix(convertorURI, 'api/view3d/statistics/duty'), //今日值班统计
-  onlineDayUrl: completePrefix(convertorURI, 'api/view3d/online/date') //消防安全执行天数
-
-
-
-
-
-
-
-
+  onlineDayUrl: completePrefix(convertorURI, 'api/view3d/online/date'),//消防安全执行天数
+  exceptionRegionListUrl: completePrefix(baseURI, 'api/view3d/region/exception/list'),//异常区域查询
 };
 
 export const FasSerUrl = {
@@ -143,4 +136,4 @@ export const ModuleEditUrl = {
   getPointListUrl:completePrefix(convertorURI, 'api/view3d/init3dViewNode'),//获取初始三维点 type=impEquipment&riskSourceId=1
   savePointListUrl:completePrefix(convertorURI, 'api/view3d/point/bind'),//批量保存点绑定关系
 
- }
\ No newline at end of file
+ }

mods/components/3dviewConvertor/services/panoramicService.js

@@ -58,3 +58,11 @@ export const statisticsCheckAction = () => {
 export const statisticsDutyAction = () => {
   return commonGet(FscSerUrl.statisticsDutyUrl);
 };
+
+/**
+ * 异常区域
+ */
+export const exceptionRegionListAction = ()=>{
+  return commonGet(FscSerUrl.exceptionRegionListUrl);
+};
+

mods/components/3dviewConvertor/view/ConvertorView3DRoot.js

@@ -6,6 +6,7 @@ import AmosWebSocket from 'amos-websocket';
 import * as endConf from 'amos-processor/lib/config/endconf';
 import PilotController from 'amos-viz/lib/board/PilotController';
 import SysWsURL, { completeToken } from './../consts/wsUrlConsts';
+import { eventTopics } from './consts';
 import ScreenSaverView from './screenSaver/ScreenSaverView';
 import View3D from './View3D';
 import PanoramicLeft from './../view/panoramic/statistical/indexLeft';
@@ -29,7 +30,6 @@ const delayTime = AmosConfig.sysConf.convertor.screenSaverConf.delayTime;
 class ConvertorView3DRoot extends Basic {
   constructor(props) {
     super(props);
-
     this.state = {
       showScreenSaver: false, //是否打开屏保
       isEdit: false
@@ -51,7 +51,7 @@ class ConvertorView3DRoot extends Basic {
   editModelChange = (status) => {
     this.setState({
       isEdit: status
-    })
+    });
   }
 
   onLoadCompleted = () => {
@@ -106,23 +106,22 @@ class ConvertorView3DRoot extends Basic {
 
 
   render() {
+    const { isEdit } = this.state;
+    debugger
     const wsURL = completeToken(SysWsURL.convertorView3dws);
     return (
       <div>
-        
         {
-          this.state.isEdit?'':<PanoramicLeft /> 
+          isEdit ? '' : <PanoramicLeft />
         }
-       <div className="sys-view-3d">
-        <AmosWebSocket ref={node => this.aws = node} url={wsURL} onMessage={this.handleData} reconnect debug />
-        <View3D onLoadCompleted={this.onLoadCompleted} hiddenScreenSaver={this.hiddenScreenSaver} editModelChange={this.editModelChange}/>
-        {this.getScreenSaver()}
-
+        <div className="sys-view-3d">
+          <AmosWebSocket ref={node => this.aws = node} url={wsURL} onMessage={this.handleData} reconnect debug />
+          <View3D onLoadCompleted={this.onLoadCompleted} hiddenScreenSaver={this.hiddenScreenSaver} editModelChange={this.editModelChange}/>
+          {this.getScreenSaver()}
         </div>
         {
-          this.state.isEdit?'':<PanoramicRight />
+          isEdit ? '' : <PanoramicRight />
         }
-        
       </div>
     );
   }

mods/components/3dviewConvertor/view/MaskContent.js

@@ -5,13 +5,12 @@ import AmosWebSocket from 'amos-websocket';
 import SysWsURL, { completeToken } from './../consts/wsUrlConsts';
 import SideControl from './sideControl';
 import DataPane from './datapane';
-import Explain from './explain';
-import RulesLayer from './global/RulesLayer';
 import globalMsg from './pagefactory/msgFactory';
 import { eventTopics, rulesDataFactory } from './consts';
 import LayerPool from './LayerPool';
 import TopMsg from './sideControl/TopMsg';
 import ActionBar from './actionbar';
+import ModelHeader from './common/ModelHeader';
 
 const eventConnect = Connect.eventConnect;
 
@@ -21,7 +20,8 @@ class MaskContent extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      sideControlShow: true
+      planStarted: false,
+      activeAction: 'panoramic'
     };
   }
 
@@ -29,11 +29,11 @@ class MaskContent extends Component {
     this.setState({ planStarted: this.props.planStarted });
   }
 
-
   componentWillReceiveProps  = (nextProps) => {
     this.setState({ planStarted: nextProps.planStarted });
   }
 
+
   /**
    * 监控视图消息 (规则 ws)
    */
@@ -48,23 +48,36 @@ class MaskContent extends Component {
     this.props.trigger(topic, content);
   };
 
-  actionBarClick = (type) => {
-    this.changeSideControlShow(type);
-    this.props.onActionItemClick && this.props.onActionItemClick(type);
+  actionBarClick = ({ singleClick, type, label, showLabel }) => {
+    if (!singleClick){//设置选中状态
+      this.setState({ activeAction: type });
+    }
+    this.props.onActionItemClick && this.props.onActionItemClick(type, label, showLabel);
+  }
+
+  handleExceptModel =(type)=>{
+    this.initViewModel();
+    this.props.handleExceptModel && this.props.handleExceptModel(type);
   }
 
-  changeSideControlShow = (type) => {
-    let sideControlShow = false;
-    if(type === "panoramicMode"){
-      sideControlShow = true;
-    }
-    this.setState({sideControlShow});
+  initViewModel = ()=>{
+    this.setState({ activeAction: 'panoramic' });
   }
 
   render() {
-    const { planStarted,sideControlShow } = this.state;
-    const { multiple, onItemClick, layerConfig, showExplain, onExplainClose, alarmStarted, alarmStart, planStart, planQuit } = this.props;
-    const { onActionItemClick } = this.props;
+    const { planStarted, activeAction } = this.state;
+    const {
+      multiple,
+      onItemClick,
+      layerConfig,
+      alarmStarted,
+      alarmStart,
+      planStart,
+      planQuit,
+      sideControlShow,
+      isShowActionBar,
+      headerName
+    } = this.props;
     const wsURL = completeToken(SysWsURL.convertorRulews);
     const controlAnimation = {
       animateName: 'zoom-comb-left',
@@ -98,11 +111,9 @@ class MaskContent extends Component {
         { sideControlShow && <SideControl multiple={multiple} onItemClick={onItemClick} layerConfig={layerConfig} animationProps={controlAnimation} />}
         { sideControlShow && <DataPane animationProps={datapaneAnim} />}
         <TopMsg alarmStart={alarmStart} />
-        {this.props.isEditMode?'':<ActionBar onActionItemClick={(e) => this.actionBarClick(e)} animationProps={controlAnimation}/>}
-        
-        {/* <RulesLayer />
-        {alarmStarted && <LayerPool animationProps={layerPoolAnimation} planStart={planStart} planQuit={planQuit} planStarted={planStarted} />} 
-        <Explain visible={showExplain} onExplainClose={onExplainClose} />*/}
+        {!isShowActionBar && <ModelHeader headerName={headerName} handleExceptModel={this.handleExceptModel} />}
+        {isShowActionBar && <ActionBar activeAction={activeAction} onActionItemClick={(e) => this.actionBarClick(e)} animationProps={controlAnimation}/> }
+        {/*{alarmStarted && <LayerPool animationProps={layerPoolAnimation} planStart={planStart} planQuit={planQuit} planStarted={planStarted} />}*/}
       </div>
     );
   }
@@ -122,7 +133,13 @@ MaskContent.propTypes = {
   alarmStart: PropTypes.func,
   planStart: PropTypes.func,
   planQuit: PropTypes.func,
-  alarmStarted: PropTypes.bool
+  alarmStarted: PropTypes.bool,
+  onActionItemClick: PropTypes.func,
+  sideControlShow: PropTypes.bool,
+  isShowActionBar: PropTypes.bool,
+  headerName: PropTypes.string,
+  setHeaderName: PropTypes.string,
+  handleExceptModel: PropTypes.func
 };
 
 MaskContent.defaultProps = {

mods/components/3dviewConvertor/view/View3D.js

@@ -23,7 +23,6 @@ import {
   fireIconDisplay,
   setMinPictureDisPlay,
   fireCarDisPlay,
-  // fireCarLineDisPlay,
   fireDetailBussiness,
   equipReleteCameraOpen,
   matchingFireEquipDisPlay,
@@ -38,16 +37,16 @@ import AreaLeftTree from './moduleEditComponent/AreaLeftTree';
 import PointLeftTree from './moduleEditComponent/PointLeftTree';
 import RightEditPointPanel from './moduleEditComponent/RightEditPointPanel';
 import RightEditRegionPanel from './moduleEditComponent/RightEditRegionPanel';
-import { EVENTS_CONSTS, dispatchMouseDown } from './../consts/EventConsts';
+import { EVENTS_CONSTS } from './../consts/EventConsts';
+import ExceptionArea from './exceptionArea/ExceptionArea';
+import { exceptionRegionListAction } from './../services/panoramicService';
+
 
 const AmosConfig = endConf.AmosConfig;
 const view3dFile = AmosConfig.sysConf.convertor.view3dFile;
-let mousewheelCount = AmosConfig.sysConf.convertor.mapLevelconfig.mousewheelCount * 100;
-// const showInterval = AmosConfig.sysConf.convertor.screenSaverConf.delayTime * 1000;
 const { resizeConnect } = Connect;
 const eventConnect = UIConnect.eventConnect;
-const { BaseObjHelper } = transitionHelper;
-const { FlameFire, FlameFire2, FlameFire3 } = FireObject;
+const { FlameFire } = FireObject;
 
 const LENS_LEVEL = {
   ROOT: 'root',
@@ -102,16 +101,20 @@ class View3D extends Component {
       //编辑模式
       drawing: false,//画线状态
       selectArea: "",//选中区域
-      selectPoints:"",//选中点
+      selectPoints: "",//选中点
       treeData: [],//左树
-      pointTypeArr:[],
-      routePathData:[], //区域线位置
+      pointTypeArr: [],
+      routePathData: [], //区域线位置
       pageType: 'region', //编辑类型
       pointType: '', //筛选框点类型
       editFlag: false,//编辑模式
       showRightPanel: false, //是否显示右侧详情
       simpleTipVisible: false,  //简单提示
-      dragItem: '' //拖动的节点
+      dragItem: '', //拖动的节点,
+      exceptionAreas: [], //异常区域
+      startLoadExceptionArea: false, //是否开始加载区域marker
+      sideControlShow: false, //隐藏耳朵
+      isShowActionBar: true //显示工具栏
     };
 
     getObjFromNet(view3dFile, (objs, asyncModels) => {
@@ -125,12 +128,12 @@ class View3D extends Component {
     this.drowItem = '';
     this.areas = [];
     this.areaStyles = {
-      normal:{
+      normal: {
         regionColor: '#02B00F', // 区域颜色
         lineColor: '#00FF70', // 边框颜色
         regionOpacity: 0.3
       },
-      noDrop:{
+      noDrop: {
         regionColor: '#969696', // 区域颜色
         lineColor: '#878787', // 边框颜色
         regionOpacity: 0.4
@@ -140,15 +143,17 @@ class View3D extends Component {
       onMouseDown: this.onMouseDown,
       onMouseMove: this.onMouseMove
     };
+    this._marker = [];
   }
 
   componentDidMount() {
     // 模拟启动预案
-
     this._registerEvents();
     this._bindPubSubEvents();
     this._bindRulesPubSubEvents();
+    this.getExceptionAreaList();
   }
+
   genPenId = () => {
     return UUID.timeUUID('pen');
   };
@@ -316,7 +321,7 @@ class View3D extends Component {
           break;
         case 'base3d.fromws.optionArea_': //交互区推数据
           this.props.trigger(eventTopics.optionArea_view, data);
-          this.setState({contingencyPlanId:data.contingencyPlanId})
+          this.setState({ contingencyPlanId: data.contingencyPlanId })
           break;
         case eventTopics.map_bubble:
           parseBubbleMarkers(this, content); // 监控屏气泡
@@ -503,7 +508,7 @@ class View3D extends Component {
           me.outlineFactory.toggleOutline(evt.object);
           me.focusObject(evt.object);
         }
-        
+
       });
     }
     // 处理跳跃
@@ -598,7 +603,7 @@ class View3D extends Component {
               ...pen.userParams,
               points: pen.getFmtPoints()
             },
-            position: pen.position 
+            position: pen.position
           });
           me.a3dRef.changeDrawState(PEN_STATE.FINISHED);
           this.state.routePathData.push({
@@ -607,7 +612,7 @@ class View3D extends Component {
               routePath:penPoints,
               regionHeigth:1
             }),
-            
+
           })
           this.setState({
             drawing: false,
@@ -760,7 +765,7 @@ class View3D extends Component {
       showRightPanel: true
     })
   }
-  
+
   getAreas = (treeData) => {
     let { dragItem } = this.state;
     // console.log(treeData)
@@ -771,29 +776,29 @@ class View3D extends Component {
           if (item.children&&item.children.length > 0) {
             if (dragItem) {
               if ( dragItem.parentId &&  dragItem.parentId == item.id) {
-                this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>) 
+                this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>)
               } else {
-                this.areas.push(<PolygonRegion {...this.areaStyles.noDrop}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />) 
+                this.areas.push(<PolygonRegion {...this.areaStyles.noDrop}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />)
               }
               {this.getAreas(item.children)}
             } else {
-              this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />) 
+              this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />)
               {this.getAreas(item.children)}
             }
-            
+
           }else {
             if (dragItem) {
               if ( dragItem&&dragItem.parentId &&  dragItem.parentId == item.id) {
-                this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>) 
+                this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>)
               } else {
-                this.areas.push(<PolygonRegion {...this.areaStyles.noDrop}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />) 
+                this.areas.push(<PolygonRegion {...this.areaStyles.noDrop}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}} />)
               }
             } else {
-              this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>) 
+              this.areas.push(<PolygonRegion {...this.areaStyles.normal}  points={item.routePath?JSON.parse(item.routePath).routePath:''} onCreated={(e) => {this.onRegionCreated(e,item)}}/>)
             }
-            
+
           }
-          
+
         } else {
           if (item.children&&item.children.length > 0) {
             {this.getAreas(item.children)}
@@ -830,7 +835,7 @@ class View3D extends Component {
     }, eer => {
       message.error('保存失败！');
     });
-  } 
+  }
   //保存点绑定
   savePointData = () => {
     let { markers } = this.state;
@@ -869,7 +874,7 @@ class View3D extends Component {
   //删除区域
   deleteAreaBind = () => {
     let { selectArea,routePathData } = this.state;
-    if (selectArea) { 
+    if (selectArea) {
       let areaParams = [];
       areaParams.push({
         riskSourceId:  selectArea.id,
@@ -888,7 +893,7 @@ class View3D extends Component {
       });
     }
   }
-  
+
 
 /**
  * 切换区域和点页面
@@ -977,7 +982,7 @@ class View3D extends Component {
           simpleTipVisible: true
         })
         return false;
-        
+
       }
       let uid = UUID.uuidFast()
       let addPointParam = {
@@ -990,7 +995,7 @@ class View3D extends Component {
         label: dragItem.name,
         level:'1',
         levelStr: 'level_2',
-  
+
       }
       markers.riskSource.push(addPointParam)
       console.log(markers)
@@ -1024,7 +1029,7 @@ class View3D extends Component {
       console.log(data);
       this.setState({
         pointTypeArr: data||[],
-        pointType:data[0]?data[0].code:''
+        pointType:data[0] ? data[0].code : ''
       })
     })
     this.getPointList();
@@ -1203,27 +1208,38 @@ class View3D extends Component {
     }
   };
 
-  onActionItemClick = (actionType) => {
-    console.log('onActionItemClick');
+
+  onActionItemClick = (actionType, label, showLabel) => {
     this.clearMarkers();
-    this.props.editModelChange(false)
+    this.props.editModelChange(false);
     this.setState({
-      editFlag:false
-    })
-    if(actionType === "impEquipment"){
+      editFlag: false
+    });
+    if (showLabel){//进入各个模式名称设置
+      this.setHeaderName(label);
+    }
+    if (actionType === 'impEquipment'){
       this.asyncLoadImpEquipment(actionType);
-      this.props.editModelChange(false)
+      this.props.editModelChange(true);
       this.setState({
-        editFlag:false
-      })
-    }else if(actionType === "editMode"){
-      this.editButtonClick()
-      this.props.editModelChange(true)
+        editFlag: false,
+        isShowActionBar: false, //隐藏工具栏
+        startLoadExceptionArea: false,//隐藏marker
+        sideControlShow: false //隐藏耳朵
+      });
+    } else if (actionType === 'editMode'){
+      this.editButtonClick();
+      this.props.editModelChange(true);
+      this.setState({
+        isShowActionBar: false, //隐藏工具栏
+        startLoadExceptionArea: false,//隐藏marker
+        sideControlShow: false //隐藏耳朵
+      });
     } else {
-      this.props.editModelChange(false)
+      this.props.editModelChange(false);
       this.setState({
-        editFlag:false
-      })
+        editFlag: false
+      });
     }
   }
 
@@ -1242,6 +1258,70 @@ class View3D extends Component {
 
   }
 
+  onRectCreated = (polygonRegion,area,index) => {
+    polygonRegion.visible = false;
+    const { regionHeigth = 10 } = area.routePath;
+    const { exceptionAreas } = this.state;
+    this._marker.push({
+      ...area,
+      position: {
+        x: polygonRegion.centerPos[0],
+        y: regionHeigth ? regionHeigth : 0,
+        z: polygonRegion.centerPos[1]
+      }
+    });
+    if (index === exceptionAreas.length - 1){
+      this.setState({
+        exceptionMarkers: this._marker,
+        startLoadExceptionArea: true
+      });
+    }
+  }
+
+  getExceptionAreaList = () => {
+    exceptionRegionListAction().then(data=>{
+      this.setState({ exceptionAreas: data });
+    });
+  }
+
+  renderPolygonRegion = (exceptionAreas)=> {
+    const regionConf = {
+      regionColor: '#76d015', // 区域颜色
+      lineColor: '#ffffff', // 边框颜色
+      regionOpacity: 1 // 不透明度 (默认是 0.5 半透明)
+    };
+    return exceptionAreas.map((area,index) =>{
+      const { routePath: points = [] } = area.routePath;
+      return <PolygonRegion key={area.id} {...regionConf} points={points} onCreated={e=>this.onRectCreated(e,area,index)} />;
+    });
+  }
+
+  handleExceptModel =(type)=>{
+    this.clearMarkers();
+    if(type === 'into_except_model'){//进入耳朵模式
+      this.props.editModelChange(true);//隐藏全景统计
+      this.setState({
+        sideControlShow: true, //显示耳朵
+        isShowActionBar: false, //隐藏工具栏
+        startLoadExceptionArea: false,//隐藏marker
+        headerName: '故障点模式' //设置头名称
+      });
+    } else if(type === 'out_except_model'){
+      this.props.editModelChange(false);//显示全景统计
+      this.setState({
+        sideControlShow: false, //隐藏耳朵
+        isShowActionBar: true, //显示工具栏
+        startLoadExceptionArea: true, //显示marker，
+        headerName: '', //设置头名称
+        editFlag: false //推出编辑模式
+      });
+    }
+  }
+
+  setHeaderName =(name)=>{
+    this.setState({ headerName: name });
+  }
+
   render() {
     const {
       objs,
@@ -1254,7 +1334,11 @@ class View3D extends Component {
       planStarted,
       alarmStarted,
       fireEquipmentPosition,
-      drawing, pageType, pointType, pointTypeArr, editFlag, showRightPanel, selectPoints, selectArea
+      drawing, pageType, pointTypeArr, editFlag, showRightPanel, selectPoints, selectArea,
+      exceptionAreas, exceptionMarkers,startLoadExceptionArea,
+      sideControlShow,
+      isShowActionBar,
+      headerName
     } = this.state;
     const { dimension, hiddenScreenSaver } = this.props;
     const graphicProps = {
@@ -1278,7 +1362,7 @@ class View3D extends Component {
     };
     const positionCtlProps = {
       prevProcessTarget: this.prevProcessTarget
-    }
+    };
 
     let firePosition = null;
     if (fireEquipmentPosition && fireEquipmentPosition.length > 0) {
@@ -1293,9 +1377,9 @@ class View3D extends Component {
 
     return (
       <div className='ModuleEditPage'>
-        <div 
+        <div
           className='designerBox'
-          onDragOver={(e) => {e.preventDefault();}} 
+          onDragOver={(e) => {e.preventDefault();}}
           onDrop={(e)=>this.drop(e)}
         >
           <A3DDesigner
@@ -1303,7 +1387,7 @@ class View3D extends Component {
             enableModelParser
             disabledEdit
             defaultLoading={false}
-            ref={node => (this.a3dRef = node)}
+            ref={node => this.a3dRef = node}
             baseObjs={objs}
             maskContent={
               <MaskContent
@@ -1312,13 +1396,17 @@ class View3D extends Component {
                 onItemClick={this.changeMarkerType}
                 layerConfig={layerConfig}
                 showExplain={showExplain}
+                sideControlShow={sideControlShow}
+                isShowActionBar={isShowActionBar}
                 onExplainClose={this.handleExplainClose}
                 hiddenScreenSaver={hiddenScreenSaver}
                 alarmStart={this.alarmStart}
                 planStart={this.planStart}
                 planQuit={this.planQuit}
+                headerName={headerName}
+                setHeaderName={this.setHeaderName}
                 onActionItemClick={this.onActionItemClick}
-                isEditMode={editFlag}
+                handleExceptModel={this.handleExceptModel}
               />
             }
             modelContentProps={modelContentProps}
@@ -1330,61 +1418,54 @@ class View3D extends Component {
             positionCtlProps={positionCtlProps}
           >
             {startAsyncLoad && <WorkerObjContent objs={asyncModels} onWorkerMessage={this.onWorkerLoading} enableLoading afterInit={this.onAfterWorkerInit} />}
-            {editFlag&&pageType == 'region'?'':<PointsPool markers={markers} updateMarker={this.updateMarker} planStarted={alarmStarted} stagePilot={this.stagePilot} isEditMode={editFlag}/>}
+            {editFlag && pageType === 'region' ? '' : <PointsPool markers={markers} updateMarker={this.updateMarker} planStarted={alarmStarted} stagePilot={this.stagePilot} />}
             {fireTruckRoute && <FatLine {...lineData.fatLineConf} linePath={JSON.parse(fireTruckRoute)} visible={showFireTruckRoute} />}
             <FlameFire position={firePosition} width={10} height={20} depth={8} sliceSpacing={1} visible={planStarted} />
             {this.renderAreas()}
+            {this.renderPolygonRegion(exceptionAreas)}
+            {startLoadExceptionArea && <ExceptionArea markers={exceptionMarkers} handleExceptModel={this.handleExceptModel} />}
           </A3DDesigner>
         </div>
         {/* <div className="editButton" onClick={() => this.editButtonChange()}>编辑模式</div> */}
-        { editFlag && 
+        { editFlag &&
           <div>
             {
-              pageType == 'region'?
-              <AreaLeftTree 
-                startDrow={this.startDrow} 
-                treeData={this.state.treeData} 
-                saveAreaData={this.saveAreaData} 
-                selectItemChange={this.selectItemChange} 
-                // stopDrowing={this.stopDrowing}  
-                pageType={pageType}
-                // pointType={pointType}
-                pointTypeArr={pointTypeArr}
-                pointTypeChange={this.pointTypeChange}
-                dragItemChange={this.dragItemChange}
-                deleteAreaBind={this.deleteAreaBind}
-              />:
-              <PointLeftTree
-                treeData={this.state.treeData} 
-                savePointData={this.savePointData} 
-                selectPointChange={this.selectPointChange} 
-                // stopDrowing={this.stopDrowing}  
-                pageType={pageType}
-                // pointType={pointType}
-                pointTypeArr={pointTypeArr}
-                pointTypeChange={this.pointTypeChange}
-                dragItemChange={this.dragItemChange}
-                deletePointBind={this.deletePointBind}
-              />
-              
+              pageType === 'region' ?
+                <AreaLeftTree
+                  startDrow={this.startDrow}
+                  treeData={this.state.treeData}
+                  saveAreaData={this.saveAreaData}
+                  selectItemChange={this.selectItemChange}
+                  // stopDrowing={this.stopDrowing}
+                  pageType={pageType}
+                  pointTypeArr={pointTypeArr}
+                  pointTypeChange={this.pointTypeChange}
+                  dragItemChange={this.dragItemChange}
+                  deleteAreaBind={this.deleteAreaBind}
+                /> :
+                <PointLeftTree
+                  treeData={this.state.treeData}
+                  savePointData={this.savePointData}
+                  selectPointChange={this.selectPointChange}
+                  // stopDrowing={this.stopDrowing}
+                  pageType={pageType}
+                  // pointType={pointType}
+                  pointTypeArr={pointTypeArr}
+                  pointTypeChange={this.pointTypeChange}
+                  dragItemChange={this.dragItemChange}
+                  deletePointBind={this.deletePointBind}
+                />
             }
-              
-            <div className='topBox'>
-              <span className='editTitle'>
-                <span className='titleText'>编辑模式</span>
-              </span>
-              <span className='quipBtn' onClick={this.quitEditMode}></span>
-            </div>
             <div className='bottomBox'>
-              <span className={`editAreaBtn ${pageType == 'region'?'selected':'noSelect'}`} onClick={this.changeAreaPoint.bind(this,'region')}></span>
-              <span className={`editPointBtn ${pageType == 'point'?'selected':'noSelect'}`} onClick={this.changeAreaPoint.bind(this,'point')}></span>
+              <span className={`editAreaBtn ${pageType === 'region' ? 'selected' : 'noSelect'}`} onClick={this.changeAreaPoint.bind(this,'region')} />
+              <span className={`editPointBtn ${pageType === 'point' ? 'selected' : 'noSelect'}`} onClick={this.changeAreaPoint.bind(this,'point')} />
             </div>
             <div className='rightBox'>
               {
-                showRightPanel && pageType == 'region'? <RightEditRegionPanel detailData={selectArea} />:''
+                showRightPanel && pageType === 'region' ? <RightEditRegionPanel detailData={selectArea} /> : ''
               }
               {
-                showRightPanel && pageType == 'point'? <RightEditPointPanel detailData={selectPoints} />:''
+                showRightPanel && pageType === 'point' ? <RightEditPointPanel detailData={selectPoints} /> : ''
               }
             </div>
           </div>
@@ -1394,8 +1475,7 @@ class View3D extends Component {
           header="基本模态框"
           visible={this.state.simpleTipVisible}
           noDefaultHeader
-          // onCancel={this.simpleTipCancel}
-          onOk = {this.simpleTipOk}
+          onOk={this.simpleTipOk}
           content={<div>{this.tipMsg}</div>}
         />
       </div>

mods/components/3dviewConvertor/view/actionbar/index.js

@@ -5,29 +5,19 @@ import { Connect } from 'amos-framework';
 import { SidePane } from 'amos-framework';
 import { actionBars } from './../conf';
 import { eventTopics } from './../consts';
-import BizIcon from './../common/icon/BizIcon';
 
 const eventConnect = Connect.eventConnect;
-
 /**
  * 底部操作栏
  */
 @eventConnect
 class ActionBar extends Component {
-
   constructor(props) {
     super(props);
-    this.state = {
-      activeAction: "panoramicMode"
-    };
   }
 
   itemClick = (item) => {
-    if(!item.singleClick){
-      this.setState({ activeAction: item.type });
-    }
-    this.props.onActionItemClick && this.props.onActionItemClick(item.type);
-
+    this.props.onActionItemClick && this.props.onActionItemClick(item);
     this.props.trigger(eventTopics.innate_operater, {
       key: item.type,
       value: true
@@ -35,8 +25,7 @@ class ActionBar extends Component {
   }
 
   render() {
-    const { activeAction } = this.state;
-    const { onActionItemClick,animationProps } = this.props;
+    const { animationProps, activeAction = 'panoramic' } = this.props;
     return (
       <SidePane className="action-pane-data" {...animationProps}>
         <div className="action-list">
@@ -47,12 +36,12 @@ class ActionBar extends Component {
                 'action-active': activeAction === a.type && !a.singleClick
               });
               return (
-                <div className={cls} onClick={()=> this.itemClick(a)}>
+                <div key={a.key} className={cls} onClick={()=> this.itemClick(a)}>
                   <div className="action-item-title">
                     <p className="">{a.label}</p>
                   </div>
                   <div className="action-item-content">
-                    <img className="action-item-icon" src={require(`./../../assets/convertor/3dview/actionbars/${a.icon}.png`)} />
+                    <img className="action-item-icon"  alt="" src={require(`./../../assets/convertor/3dview/actionbars/${a.icon}.png`)} />
                   </div>
                 </div>
               );
@@ -65,7 +54,10 @@ class ActionBar extends Component {
 }
 
 ActionBar.propTypes = {
-  animationProps: PropTypes.object
+  animationProps: PropTypes.object,
+  onActionItemClick: PropTypes.func,
+  trigger: PropTypes.func,
+  activeAction: PropTypes
 };
 
 export default ActionBar;

mods/components/3dviewConvertor/view/common/ModelHeader.js

+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+export default class ModelHeader extends Component {
+  constructor(props) {
+    super(props);
+  }
+
+  quitEditMode = (e) => {
+    e.stopPropagation();
+    this.props.handleExceptModel && this.props.handleExceptModel('out_except_model');
+  }
+
+  render() {
+    const { headerName } = this.props;
+    return (
+      <div className='ModuleEditPage'>
+        <div className='topBox'>
+          <span className='editTitle'>
+            <span className='titleText'>{headerName}</span>
+          </span>
+          <span className='quipBtn' onClick={this.quitEditMode} />
+        </div>
+      </div>
+    );
+  }
+}
+
+ModelHeader.propTypes = {
+  headerName: PropTypes.string,
+  handleExceptModel: PropTypes.func
+};

mods/components/3dviewConvertor/view/conf.js

@@ -79,11 +79,11 @@ export const viewController = [
  * 视图控制
  */
 export const actionBars = [
-  { key: 'impEquipment-action', icon: 'impEquipment', type: 'impEquipment', singleClick: false, label: '重点设备' },
-  { key: 'panoramic-action', icon: 'panoramic', type: 'panoramic', singleClick: false, label: '全景' },
-  { key: 'burst-action', icon: 'burst', type: 'burst', singleClick: true, label: '分解' },
-  { key: 'fitview-action', icon: 'fitview', type: 'fitview', singleClick: true, label: '初始视图' },
-  { key: 'edit-action', icon: 'editMode', type: 'editMode', singleClick: false, label: '编辑' }
+  { key: 'impEquipment-action', icon: 'impEquipment', type: 'impEquipment', singleClick: false, label: '重点设备',showLabel: true },
+  { key: 'panoramic-action', icon: 'panoramic', type: 'panoramic', singleClick: false, label: '全景', showLabel: true },
+  { key: 'burst-action', icon: 'burst', type: 'burst', singleClick: true, label: '分解' , showLabel: false },
+  { key: 'fitview-action', icon: 'fitview', type: 'fitview', singleClick: true, label: '初始视图' , showLabel: false },
+  { key: 'edit-action', icon: 'editMode', type: 'editMode', singleClick: false, label: '编辑' , showLabel: true }
 ];
 
 /**

mods/components/3dviewConvertor/view/exceptionArea/ExceptionArea.js

+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { utils, Store } from 'amos-tool';
+import { Markers } from 'amos-3d/lib/designer';
+import { connect3D } from 'amos-3d/lib/designer';
+import { BaseObjHelper } from 'base-r3d/lib/factory';
+import { safetyIndexIconMapper } from './../../consts/imgStatic';
+
+
+const lsTool = Store.lsTool;
+const getIcon = (exceptionType) => {
+  return safetyIndexIconMapper[exceptionType];
+};
+
+const buildMarkerOptions = (markers) => {
+  if (!utils.isEmpty(markers)){
+    markers.forEach(m => {
+      const url = getIcon(m.exceptionType || 'allEror');
+      let position;
+      if (!utils.isArray(m.position)){
+        position = Object.values(m.position);
+      }
+      m.key = m.key || m.id;
+      m.url = url;
+      m.position = utils.isArray(m.position) ? m.position : position;
+      m.size = 23;
+    });
+  }
+  return markers;
+};
+
+/**
+ * 异常区域点
+ */
+@connect3D
+class ExceptionArea extends Component {
+  constructor(props) {
+    super(props);
+    this.markerEvents = {
+      click: this.onMarkerClick
+    };
+  }
+
+  componentWillMount = () => {
+  }
+
+  onMarkerClick = (marker) => {
+    const { extData } = marker;
+    lsTool.write('errorAreaId',extData.id);
+    this.props.handleExceptModel && this.props.handleExceptModel('into_except_model');
+  }
+
+  setTopCardConf = (obj,{ safetyIndex })=>{
+    obj.baseObjHelper.titleConfig = {
+      // 顶牌平面参数
+      planeOptions: {
+        width: 40,
+        height: 40,
+        position: [0,4,0],
+        doubleSide: true
+      },
+      canvasOptions: {
+        font: '34px Microsoft YaHei',
+        fillStyle: 'white',
+        textBaseline: 'middle',
+        textAlign: 'center',
+        textX: 128
+      },
+      imgWidth: 256,
+      imgHeight: 128,
+      image: safetyIndexIconMapper['transparent_rpn']
+    };
+    obj.baseObjHelper.title = safetyIndex;
+  }
+
+  markerCreated = ({ markersCache }) => {
+    this.markersCache = markersCache;
+    markersCache.eachValue(item=>{
+      const obj = item.node;
+      const boh = new BaseObjHelper({ obj });
+      obj.baseObjHelper = boh;
+      this.setTopCardConf(obj, item.extData);
+    });
+  }
+
+  render() {
+    const { markers = [], ...rest } = this.props;
+    const result = buildMarkerOptions(markers);
+    return (
+      <Markers
+        {...rest}
+        markers={result}
+        events={this.markerEvents}
+        onCreated={this.markerCreated}
+      />
+    );
+  }
+}
+
+ExceptionArea.propTypes = {
+  markers: PropTypes.array,
+  handleExceptModel: PropTypes.func
+};
+
+export default ExceptionArea;

mods/components/panoramic/styles/view/panoramic/index.scss

@@ -6,5 +6,4 @@
     height: calc(100% - 40px);
     width: 100%;
     //background: black;
-    color: white;
 }

mods/components/panoramic/styles/view/panoramic/statistical.scss

@@ -9,6 +9,7 @@
     width: 350px;
     float: left;
     z-index: 1;
+    color: white;
 
     .equipStatusList{
       padding-left: 97px;