Skip to content

A
amos-station-module-view
Commit dbfb0677 authored by suhuiguang's avatar suhuiguang
Browse files
Options

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

# Conflicts: # mods/components/3dviewConvertor/view/View3D.js
parents 029270c7 ef93eb7e
Hide whitespace changes
Inline Side-by-side
Showing with 881 additions and 839 deletions
mods/components/3dviewConvertor/consts/imgStatic.js
View file @ dbfb0677
......@@ -67,7 +67,7 @@ export default {
search: require('../assets/convertor/3dview/datapanel/search.png'),
smilingFace: require('../assets/convertor/3dview/datapanel/smilingFace.png'),
user: require('../assets/convertor/3dview/datapanel/user.png'),
searchPane: require('../assets/convertor/3dview/actionbars/chaxun.png'),
searchPane: require('../assets/convertor/3dview/actionbars/chaxun.png')
},
markers: {
riskSource_0: require('../assets/convertor/3dview/markers/risk-0.png'),
......
mods/components/3dviewConvertor/styles/actionbar.scss
View file @ dbfb0677
.action-pane-data{
.action-pane-data {
position: absolute;
bottom: 5%;
left: 50%;
transform: translateX(-50%);
.action-list {
height: 40px;
padding: 0 1rem;
border-radius: 6px;
background:rgba(216,216,216,0.24);
border:1px solid rgba(146,149,151,1);
.action-list {
height: 40px;
padding: 0 1rem;
background-color: rgba(216, 216, 216, 0.24);
border: 1px solid rgba(146, 149, 151, 1);
border-radius: 6px;
.action-item{
float: left;
width: 40px;
height: 38px;
text-align: center;
cursor: pointer ;
border:1px solid rgba(146,149,151,1);
.action-item {
float: left;
width: 40px;
height: 38px;
text-align: center;
cursor: pointer;
border: 1px solid rgba(146, 149, 151, 1);
.action-item-title{
color: #e0e0e0;
position: absolute;
top: -20px;
white-space: nowrap;
width: 51px;
-webkit-transform-origin-x: 0;
-webkit-transform: scale(0.80);
text-align: center;
}
.action-item-title {
position: absolute;
top: -20px;
width: 51px;
color: #e0e0e0;
text-align: center;
white-space: nowrap;
-webkit-transform-origin-x: 0;
-webkit-transform: scale(0.8);
}
.action-item-content{
text-align: center;
position: relative;
width: 100%;
height: 100%;
.action-item-content {
position: relative;
width: 100%;
height: 100%;
text-align: center;
.action-item-icon{
margin: 8px;
width: 21px;
height: 21px;
position: relative;
}
}
.action-item-icon {
position: relative;
width: 21px;
height: 21px;
margin: 8px;
}
}
}
.action-active{
background: linear-gradient(180deg,rgba(0,96,154,0.8) 0%,rgba(0,54,105,0.5) 100%);
}
.action-active {
background: linear-gradient(180deg, rgba(0, 96, 154, 0.8) 0%, rgba(0, 54, 105, 0.5) 100%);
}
}
}
mods/components/3dviewConvertor/styles/moduleEdit.scss
View file @ dbfb0677
.ModuleEditPage {
position: relative;
height: 100%;
::-webkit-scrollbar { /* 血槽宽度 */
width:5px;
height: 5px;
background-color: rgba(10, 53, 62, 1);
border-radius: 5px;
}
::-webkit-scrollbar-thumb { /* 拖动条 */
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.4);
}
::-webkit-scrollbar-track { /* 背景槽 */
background-color:rgba(17, 44, 88, 0.2);
}
position: relative;
height: 100%;
::-webkit-scrollbar {
/* 血槽宽度 */
width: 5px;
height: 5px;
background-color: rgba(10, 53, 62, 1);
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
/* 拖动条 */
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.4);
}
::-webkit-scrollbar-track {
/* 背景槽 */
background-color: rgba(17, 44, 88, 0.2);
}
.topBox {
position: absolute;
top: 45px;
left: 50%;
transform: translateX(-50%);
span {
display: inline-block;
}
.editTitle {
width:257px;
height:55px;
background: url('../assets/convertor/moduleEdit/title.png') no-repeat 100% 100%;
// opacity:0.4;
font-size: 24px;
text-align: center;
color: #fff;
vertical-align: top;
.topBox {
position: absolute;
top: 45px;
left: 50%;
transform: translateX(-50%);
span {
display: inline-block;
}
.editTitle {
width: 257px;
height: 55px;
background: url('../assets/convertor/moduleEdit/title.png') no-repeat 100% 100%;
// opacity:0.4;
font-size: 24px;
text-align: center;
color: #fff;
vertical-align: top;
.titleText {
width: 100%;
height: 100%;
line-height: 55px;
// border-bottom:2px transparent solid;
// border-image:linear-gradient(90deg,rgba(50,217,239,0) 2%,rgba(50,217,239,0.49) 29%,rgba(50,217,239,0.73) 73%,rgba(50,217,239,0) 100%);
}
}
.titleText {
width: 100%;
height: 100%;
line-height: 55px;
// border-bottom:2px transparent solid;
// border-image:linear-gradient(90deg,rgba(50,217,239,0) 2%,rgba(50,217,239,0.49) 29%,rgba(50,217,239,0.73) 73%,rgba(50,217,239,0) 100%);
}
}
.quipBtn {
width: 169px;
......@@ -50,253 +53,247 @@
cursor: pointer;
background: url('../assets/convertor/moduleEdit/quip.png') no-repeat 100% 100%;
}
}
.bottomBox {
position: absolute;
bottom: 34px;
left: 50%;
transform: translateX(-50%);
span {
display: inline-block;
width: 177px;
height: 42px;
line-height: 42px;
background: rgba(46, 217, 239, 0.2);
// border: 2px solid #2ED9EF;
margin: 0 10px;
text-align: center;
font-size: 16px;
// color: #2ED9EF;
cursor: pointer;
}
.bottomBox {
position: absolute;
bottom: 34px;
left: 50%;
transform: translateX(-50%);
span {
display: inline-block;
width: 177px;
height: 42px;
line-height: 42px;
background: rgba(46,217,239,0.2);
// border: 2px solid #2ED9EF;
margin: 0 10px;
text-align: center;
font-size: 16px;
// color: #2ED9EF;
cursor: pointer;
}
.editAreaBtn {
background: url('../assets/convertor/moduleEdit/areaBtn.png') no-repeat 100% 100%;
.editAreaBtn {
background: url('../assets/convertor/moduleEdit/areaBtn.png') no-repeat 100% 100%;
}
.editPointBtn {
background: url('../assets/convertor/moduleEdit/pointBtn.png') no-repeat 100% 100%;
}
.editAreaBtn.selected {
background: url('../assets/convertor/moduleEdit/areaBtn_select.png') no-repeat 100% 100%;
}
.editPointBtn.selected {
background: url('../assets/convertor/moduleEdit/poingBtn_select.png') no-repeat 100% 100%;
}
}
// 左侧树
.leftTree {
position: absolute;
top: 0;
left: 15px;
width: 264px;
height: 100%;
padding-top: 55px;
padding-bottom: 15px;
user-select: none;
.leftContainer {
width: 100%;
height: 100%;
background-color: rgba(10, 53, 62, 0.68);
border: 1px solid rgba(46, 217, 239, 0.59);
padding: 12px;
}
.topForm {
.leftSelect {
height: 39px;
width: 100%;
margin-bottom: 10px;
background: url('../assets/convertor/moduleEdit/selectBox.png') no-repeat 100% 100%;
border: none;
line-height: 31px;
padding: 5px;
color: #f0df2d;
}
.leftSearch {
height: 33px;
line-height: 33px;
background: url('../assets/convertor/moduleEdit/searchBg.png') no-repeat 100% 100%;
input {
background-color: transparent;
box-shadow: none;
padding-left: 15px;
color: #fff;
}
.editPointBtn {
background: url('../assets/convertor/moduleEdit/pointBtn.png') no-repeat 100% 100%;
.amosicon-search {
color: #2ed9ef;
}
.editAreaBtn.selected {
background: url('../assets/convertor/moduleEdit/areaBtn_select.png') no-repeat 100% 100%;
}
}
.treeBox {
height: calc(100% - 132px);
overflow-y: auto;
.amos-tree {
color: rgba(15, 235, 255, 1);
.amos-tree-node-content-wrapper {
color: #fff;
font-size: 15px;
}
.editPointBtn.selected {
background: url('../assets/convertor/moduleEdit/poingBtn_select.png') no-repeat 100% 100%;
}
.icon {
margin-left: 5px;
vertical-align: middle;
img {
vertical-align: initial;
margin-left: 10px;
}
}
}
.bottomBtns {
padding-top: 15px;
text-align: center;
.sureBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/sureBtn.png') no-repeat 100% 100%;
border: none;
}
.deleteBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/deleteBtn.png') no-repeat 100% 100%;
border: none;
}
}
}
// 左侧树
.leftTree {
position: absolute;
top: 0;
left: 15px;
width: 264px;
height: 100%;
padding-top: 55px;
padding-bottom: 15px;
user-select: none;
.leftContainer {
width: 100%;
height: 100%;
background-color: rgba(10, 53, 62, 0.68);
border: 1px solid rgba(46, 217, 239, 0.59);
padding: 12px;
// 右侧面板
.rightEditPanel {
position: absolute;
top: 0;
right: 15px;
width: 264px;
height: 100%;
padding-top: 55px;
padding-bottom: 15px;
.rightContainer {
position: relative;
width: 100%;
height: 100%;
background-color: rgba(10, 53, 62, 0.68);
border: 1px solid rgba(46, 217, 239, 0.59);
padding: 12px;
color: #fff;
.basic-demo {
height: calc(100% - 53px);
overflow-y: auto;
}
.amos-form-item-label {
color: #fff;
}
.topForm {
.rightTitle {
margin-left: -15px;
.titleText {
margin-left: 5px;
}
}
.topForm {
.leftSelect {
height: 39px;
width: 100%;
margin-bottom: 10px;
background: url('../assets/convertor/moduleEdit/selectBox.png') no-repeat 100% 100%;
border: none;
line-height: 31px;
padding: 5px;
color: #F0DF2D;
}
.leftSearch {
height: 33px;
line-height: 33px;
background: url('../assets/convertor/moduleEdit/searchBg.png') no-repeat 100% 100%;
input {
background-color: transparent;
box-shadow: none;
padding-left: 15px;
color: #fff;
}
.amosicon-search {
color: #2ED9EF;
}
}
.amos-input {
background-color: rgba(4, 30, 36, 0.4);
border-radius: 1px;
border: solid 1px rgba(46, 217, 239, 0.59);
font-size: 14px;
color: #fff;
}
.treeBox {
height: calc(100% - 132px);
overflow-y: auto;
.amos-tree {
color: rgba(15, 235, 255, 1);
.amos-tree-node-content-wrapper {
color: #fff;
font-size: 15px;
}
}
.icon {
margin-left: 5px;
vertical-align: middle;
img {
vertical-align: initial;
margin-left: 10px;
}
}
.moduleTitle {
height: 50px;
display: flex;
align-items: center;
.titleText {
margin-left: 5px;
}
}
.bottomBtns {
padding-top: 15px;
text-align: center;
.sureBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/sureBtn.png') no-repeat 100% 100%;
border: none;
}
.deleteBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/deleteBtn.png') no-repeat 100% 100%;
border: none;
}
height: calc(100% - 48px);
padding-left: 20px;
.amos-input {
width: 100%;
}
}
// 右侧面板
.rightEditPanel {
position: absolute;
top: 0;
right: 15px;
width: 264px;
height: 100%;
padding-top: 55px;
padding-bottom: 15px;
.rightContainer {
position: relative;
width: 100%;
height: 100%;
background-color: rgba(10, 53, 62, 0.68);
border: 1px solid rgba(46, 217, 239, 0.59);
padding: 12px;
color: #fff;
.basic-demo{
height: calc(100% - 53px);
overflow-y: auto;
}
.amos-form-item-label {
color: #fff;
}
.topForm {
.rightTitle{
margin-left: -15px;
.titleText{
margin-left: 5px;
}
}
.amos-input{
background-color: rgba(4, 30, 36,0.4);
border-radius: 1px;
border: solid 1px rgba(46, 217, 239, 0.59);
font-size: 14px;
color:#fff;
}
.moduleTitle{
height: 50px;
display: flex;
align-items: center;
.titleText{
margin-left: 5px;
}
}
height: calc(100% - 48px);
padding-left: 20px;
.amos-input {
width: 100%;
}
.amos-select {
width: 100%;
}
.radio-text{
color:#fff
}
}
.amos-select {
width: 100%;
}
.bottomBtns {
position: absolute;
bottom:15px;
padding-top: 15px;
left:50%;
margin-left: -100px;
.sureBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/sureBtn.png') no-repeat 100% 100%;
border: none;
}
.deleteBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/deleteBtn.png') no-repeat 100% 100%;
border: none;
}
.cancelBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/cancelBtn.png') no-repeat 100% 100%;
border: none;
}
.radio-text {
color: #fff;
}
}
}
.editButton {
position: absolute;
bottom: 100px;
left: 50%;
.bottomBtns {
position: absolute;
bottom: 15px;
padding-top: 15px;
left: 50%;
margin-left: -100px;
.sureBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/sureBtn.png') no-repeat 100% 100%;
border: none;
}
.deleteBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/deleteBtn.png') no-repeat 100% 100%;
border: none;
}
.cancelBtn {
width: 100px;
height: 33px;
background: url('../assets/convertor/moduleEdit/cancelBtn.png') no-repeat 100% 100%;
border: none;
}
}
}
.editButton {
position: absolute;
bottom: 100px;
left: 50%;
}
}
.amos-select-options{
.selectOption{
color:#fff;
.amos-select-options {
.selectOption {
color: #fff;
background-color: rgba(10, 53, 62, 0.8);
}
.selectOption:hover{
color:#F0DF2D;
background-color: rgba(10, 53, 62, 0.8)
.selectOption:hover {
color: #f0df2d;
background-color: rgba(10, 53, 62, 0.8);
}
}
.pormpt-modal{
height:100%;
.amos-modal-container{
.pormpt-modal {
height: 100%;
.amos-modal-container {
background-image: url('../assets/convertor/3dview/promptModal.png');
background-repeat: no-repeat;
background-size: 100% 100%;
height:253px;
height: 253px;
width: 392px !important;
background-color: transparent;
box-shadow: none;
.amos-modal-content{
.amos-modal-content {
width: 100%;
height: 100%;
color: #fff;
font-size: 20px;
font-weight: normal;
.prompt-content{
.prompt-content {
width: 100%;
height: 100%;
padding-top:40px ;
display:flex;
padding-top: 40px;
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
.prompt-buttons{
.prompt-buttons {
span {
display: inline-block;
width: 71px;
......@@ -305,24 +302,22 @@
margin: 0 10px;
text-align: center;
}
.promptOk{
.promptOk {
background: url('../assets/convertor/3dview/promptOk.png') no-repeat 100% 100%;
}
.promptNo {
background: url('../assets/convertor/3dview/promptNo.png') no-repeat 100% 100%;
}
.promptSave{
.promptSave {
background: url('../assets/convertor/3dview/promptSave.png') no-repeat 100% 100%;
}
.promptCancel{
.promptCancel {
background: url('../assets/convertor/3dview/promptCancel.png') no-repeat 100% 100%;
}
}
}
}
}
}
// .rayd-modal{
// background-color: rgba(25, 86, 147, 0.6) !important;
......
mods/components/3dviewConvertor/styles/pointsDetails.scss
View file @ dbfb0677
......@@ -48,7 +48,7 @@
.carousel-img {
width: 100%;
height: 100%;
padding: 5px
padding: 5px;
}
.carousel-indicators {
......@@ -138,9 +138,7 @@
float: left;
width: 131px;//9.84%;
height: 40px;
//background: $biz-table-title-color;//#333;
background: rgba(25, 86, 147, 1);
// border-left: 1px solid $core-border-color;
box-sizing: border-box;
flex: 1;
}
......
mods/components/3dviewConvertor/view/MaskContent.js
View file @ dbfb0677
......@@ -56,7 +56,7 @@ class MaskContent extends Component {
this.setState({ activeAction: type });
}
this.props.onActionItemClick && this.props.onActionItemClick(type, label, showLabel);
if(type === "search"){
if (type === 'search'){
this.changeSearchPaneVisible();
}
}
......
mods/components/3dviewConvertor/view/PointsPool.js
View file @ dbfb0677
......@@ -93,7 +93,7 @@ class PointsPool extends Component {
}
return (
<Shuttle>
<RiskPoint
<RiskPoint
{...rest}
markers={markers.riskSource}
onCreated={(val) => this.onMarkersCreated('riskSource', val)}
......@@ -136,12 +136,18 @@ class PointsPool extends Component {
markers={markers.pool}
onCreated={(val) => this.onMarkersCreated('pool', val)}
isEditMode={this.props.isEditMode}
addMarker={this.addMarker}
stagePilot={this.props.stagePilot}
selectPoints={this.props.selectPoints}
/>
<FireResourcePoint
{...rest}
markers={markers.hydrant}
onCreated={(val) => this.onMarkersCreated('hydrant', val)}
isEditMode={this.props.isEditMode}
addMarker={this.addMarker}
stagePilot={this.props.stagePilot}
selectPoints={this.props.selectPoints}
/>
<FireResourcePoint
{...rest}
......@@ -157,12 +163,18 @@ class PointsPool extends Component {
markers={markers.fireChamber}
onCreated={(val) => this.onMarkersCreated('fireChamber', val)}
isEditMode={this.props.isEditMode}
addMarker={this.addMarker}
stagePilot={this.props.stagePilot}
selectPoints={this.props.selectPoints}
/>
<FireResourcePoint
{...rest}
markers={markers.fireFoamRoom}
onCreated={(val) => this.onMarkersCreated('fireFoamRoom', val)}
isEditMode={this.props.isEditMode}
addMarker={this.addMarker}
stagePilot={this.props.stagePilot}
selectPoints={this.props.selectPoints}
/>
{!hideDetector ?
<FireResourcePoint
......@@ -204,6 +216,9 @@ class PointsPool extends Component {
markers={markers.fireCar}
onCreated={(val) => this.onMarkersCreated('fireCar', val)}
isEditMode={this.props.isEditMode}
addMarker={this.addMarker}
stagePilot={this.props.stagePilot}
selectPoints={this.props.selectPoints}
/>
<PointStatistics
{...rest}
......
mods/components/3dviewConvertor/view/PromptModal.js
View file @ dbfb0677
import React, { Component } from 'react';
import { Modal ,Button} from 'amos-framework';
import { Modal } from 'amos-framework';
class PromptModal extends Component {
constructor(props) {
super(props);
this.state = {
};
this.state = {};
}
cancel = ()=>{
const {isback} =this.props.promptData
this.props.closePromptModal()
if(isback){
this.props.handleOutExceptModel()
cancel = () => {
const { isback } = this.props.promptData;
this.props.closePromptModal();
if (isback) {
this.props.handleOutExceptModel();
}
}
saveData=()=>{
const {isback,type} =this.props.promptData
if(isback){
this.props.handleOutExceptModel()
};
saveData = () => {
const { isback, type } = this.props.promptData;
if (isback) {
this.props.handleOutExceptModel();
}
this.props.closePromptModal()
if(type=='region')
{
this.props.saveAreaData()
}else{
this.props.savePointData()
this.props.closePromptModal();
if (type === 'region') {
this.props.saveAreaData();
} else {
this.props.savePointData();
}
}
};
render() {
const {promptData} =this.props
const { promptData } = this.props;
return (
<Modal
visible={promptData.promptvisible}
className={'pormpt-modal'}
content={<div className ='prompt-content'>
<div>{promptData.promptContent}</div>
{promptData.btnType =='isOk'?
<div className='prompt-buttons'>
<span className={'promptOk'} onClick={this.saveData} />
<span className={'promptNo'} onClick={this.cancel} />
</div>:
<div className='prompt-buttons'>
<span className={'promptSave'} onClick={this.saveData} />
<span className={'promptCancel'} onClick={this.cancel} />
</div>
}
</div>
}
noDefaultFooter
noDefaultHeader
destroyContent
onCancel={this.cancel}
closable={false}
/>
<Modal
visible={promptData.promptvisible}
className={'pormpt-modal'}
content={
<div className="prompt-content">
<div>{promptData.promptContent}</div>
{promptData.btnType == 'isOk' ? (
<div className="prompt-buttons">
<span className={'promptOk'} onClick={this.saveData} />
<span className={'promptNo'} onClick={this.cancel} />
</div>
) : (
<div className="prompt-buttons">
<span className={'promptSave'} onClick={this.saveData} />
<span className={'promptCancel'} onClick={this.cancel} />
</div>
)}
</div>
}
noDefaultFooter
noDefaultHeader
destroyContent
onCancel={this.cancel}
closable={false}
/>
);
}
}
......
mods/components/3dviewConvertor/view/View3D.js
View file @ dbfb0677
......@@ -95,27 +95,28 @@ class View3D extends Component {
fireEquipmentPosition: [],
contingencyPlanId: '',
markers: {
riskSource:[],//风险点 - riskSource；
patrol:[],//巡检点 -
impEquipment:[],//重点设备 -
monitorEquipment:[],//探测器 -
video:[],//摄像头 -
fireEquipment:[],//消防设备 -
person:[],
pool:[],
hydrant:[],
fireChamber:[],
fireCar:[],
fire:[],
fireDetection:[]
riskSource: [],//风险点 - riskSource；
patrol: [],//巡检点 -
impEquipment: [],//重点设备 -
monitorEquipment: [],//探测器 -
video: [],//摄像头 -
fireEquipment: [],//消防设备 -
person: [],
pool: [],
hydrant: [],
fireChamber: [],
fireCar: [],
fire: [],
fireDetection: [],
fireFoamRoom: []
},
markerType: null,
planStarted: false,
alarmStarted: false,
//编辑模式
drawing: false,//画线状态
selectArea: "",//选中区域
selectPoints: "",//选中点
selectArea: '',//选中区域
selectPoints: '',//选中点
treeData: [],//左树
pointTypeArr: [],
routePathData: [], //区域线位置
......@@ -129,17 +130,17 @@ class View3D extends Component {
sideControlShow: false, //隐藏耳朵
isShowActionBar: true, //显示工具栏
errorAreaId: '' ,//异常区域id
positionxyz:'',
rightHeight:10,
isPointSave:false,
isAreaSave:false,
treeDataList:[],
promptData:{
promptvisible:false,
promptContent:'',
type:'region',
btnType:'isOk',
isback:false
positionxyz: '',
rightHeight: 10,
isPointSave: false,
isAreaSave: false,
treeDataList: [],
promptData: {
promptvisible: false,
promptContent: '',
type: 'region',
btnType: 'isOk',
isback: false
}
};
......@@ -164,7 +165,7 @@ class View3D extends Component {
lineColor: '#878787', // 边框颜色
regionOpacity: 0.4
},
select:{
select: {
regionColor: '#FD0400', // 区域颜色
lineColor: '#FD0400', // 边框颜色
regionOpacity: 0.4
......@@ -296,8 +297,8 @@ class View3D extends Component {
_bindRulesPubSubEvents = () => {
this.props.subscribe(eventTopics.fromws, (topic, content) => {
let data = content.data;
console.log('消息类型--->' + topic);
console.log('data==' + JSON.stringify(data));
console.log(`消息类型--->${topic}`);
console.log(`data==${JSON.stringify(data)}`);
switch (topic) {
case 'base3d.fromws.mapArea_action1-1': //“极I高端8111换流变A相”所在建筑高亮+报警logo+建筑模型上气泡弹出（极I高端8111换流变A相）
// this.equipmentId = data.equipmentId;
......@@ -335,7 +336,7 @@ class View3D extends Component {
dealTroubleMarkers(this, data); //处理设备报警：切换图层到探测器、显示报警的探测器（闪烁-报警，不闪烁-报警解除）--已完成
break;
case 'base3d.fromws.topArea_CONTINGENCY': //消防报警
data["contingencyPlanId"]=this.state.contingencyPlanId;
data['contingencyPlanId'] = this.state.contingencyPlanId;
this.props.trigger(eventTopics.top_ae_msg, data);
break;
case 'base3d.fromws.recordArea_refresh': //记录区刷新
......@@ -353,7 +354,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); // 监控屏气泡
......@@ -524,7 +525,6 @@ class View3D extends Component {
cacheObjsSave(me,obj,LENS_LEVEL);//缓存对象及对应关系
if (!obj.isForceParent) {
obj.on('click', evt => {
const me = this;
if (this.state.isEditMode === false) {
// this.focusPosition(evt.pickedPosition);
me.outlineFactory.toggleOutline(evt.object);
......@@ -566,9 +566,9 @@ class View3D extends Component {
getPointLoop = ({ markers }, pointType, treeData) => {
treeData.forEach( t => {
if(t.isRegion && t.children && t.children.length > 0){
this.getPointLoop( { markers }, pointType, t.children)
}else if(t.position3d && !t.isRegion){
if (t.isRegion && t.children && t.children.length > 0){
this.getPointLoop( { markers }, pointType, t.children);
} else if (t.position3d && !t.isRegion){
t.position = t.position3d;
t.key = `${t.type}-${t.id}`;
t.label = t.name;
......@@ -580,32 +580,46 @@ class View3D extends Component {
//编辑模式获取点
getPointList = (pointType,treeData) => {
this.clearMarkers();
if(treeData){
let markers = {};
markers[pointType] = [];
if (treeData){
let markers = {
riskSource: [],//风险点
patrol: [],//巡检点
impEquipment: [],//重点设备
monitorEquipment: [],//探测器
video: [],//摄像头
fireEquipment: [],//消防设备
person: [],
pool: [],
hydrant: [],
fireChamber: [],
fireCar: [],
fire: [],
fireDetection: [],
fireFoamRoom: []
};
this.getPointLoop( { markers }, pointType, treeData);
this.setState({markers})
this.setState({ markers });
}
}
startDrow = (areaItem) => {
// this.a3dRef.addPen(m);
this.setState({ isAreaSave: true });
console.log('drow--------')
console.log('drow--------');
this.setState({
selectArea:areaItem,
rightHeight:10,
selectArea: areaItem,
rightHeight: 10,
showRightPanel: true
});
this.drowItem = areaItem;
this.addPen(areaItem.id)
this.addPen(areaItem.id);
}
addPen(areaKey) {
let params = { "displayName": "进攻线路", "thumb": "/a3dres/images/pathline/line-attack.png", "descr": "", "objParam": null, "type": "pen" }
let params = { 'displayName': '进攻线路', 'thumb': '/a3dres/images/pathline/line-attack.png', 'descr': '', 'objParam': null, 'type': 'pen' };
// console.log(this.state.selectArea)
const penProps = {
key: this.genPenId(),
color: 0x00ff00,
areaKey: areaKey,
areaKey,
...params
};
this.a3dRef.newPen(penProps);
......@@ -639,13 +653,13 @@ class View3D extends Component {
});
me.a3dRef.changeDrawState(PEN_STATE.FINISHED);
this.state.routePathData.push({
riskSourceId: this.drowItem.id,
riskSourceId: this.drowItem.id,
routePath: JSON.stringify({
routePath:penPoints,
regionHeigth:10
}),
routePath: penPoints,
regionHeigth: 10
})
})
});
this.setState({
drawing: false,
routePathData: this.state.routePathData
......@@ -669,8 +683,8 @@ class View3D extends Component {
const me = this;
me.a3dRef.changeDrawState(PEN_STATE.CLEARED);
// 结束绘制
this.setState({
drawing: false
this.setState({
drawing: false
});
}
......@@ -767,7 +781,7 @@ class View3D extends Component {
points: pen.getFmtPoints()
});
console.log(pen);
console.log(pen.getFmtPoints())
console.log(pen.getFmtPoints());
this.enableDrawPath = false;
}
}
......@@ -785,18 +799,19 @@ class View3D extends Component {
selectItemChange = (selectArea) => {
this.a3dRef.changeDrawState(PEN_STATE.CLEARED);//清除当前路径
// 结束绘制
this.setState({
drawing: false
});
this.setState({
drawing: false
});
this.setState({
selectArea,
rightHeight:JSON.parse(selectArea.routePath).regionHeigth,
rightHeight: JSON.parse(selectArea.routePath).regionHeigth,
showRightPanel: true
});
}
//选中点变化
selectPointChange = (selectPoints) => {
const { markers, pointType } = this.state;
this.stagePilot.positionCtl.clearDrag();
if (selectPoints.isRegion){
this.setState({ selectArea: selectPoints, selectPoints });
} else {
......@@ -819,32 +834,32 @@ class View3D extends Component {
if (treeData && treeData.length > 0) {
treeData.map((item) => {
if (item.isRegion && item.isBind) {
if(selectArea && selectArea.id == item.id){
this.areas.push(<PolygonRegion {...this.areaStyles.select} points={item.routePath ? JSON.parse(item.routePath).routePath : ''} onCreated={(e) => {this.onRegionCreated(e,item)}} />);
if (selectArea && selectArea.id === item.id){
this.areas.push(<PolygonRegion {...this.areaStyles.select} points={item.routePath ? JSON.parse(item.routePath).routePath : ''} onCreated={(e) => {this.onRegionCreated(e,item);}} />);
this.getAreas(item.children);
}else{
} else {
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)}} />);
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);}} />);
} 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)}
{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.getAreas(item.children)}
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);}} />);
}
}
......@@ -860,7 +875,7 @@ class View3D extends Component {
}
renderAreas = () => {
this.areas = [];
console.log(this.state.treeData)
console.log(this.state.treeData);
this.getAreas(this.state.treeData);
return this.areas;
}
......@@ -873,10 +888,10 @@ class View3D extends Component {
message.success('保存成功！');
getAreaTreeAction().then(data => {
//console.log(data);
console.log(JSON.stringify(data))
console.log(JSON.stringify(data));
this.setState({
treeData: data || [],
routePathData:[]
routePathData: []
});
});
}, eer => {
......@@ -890,7 +905,7 @@ class View3D extends Component {
//保存区域绑定
saveAreaData = () => {
let { routePathData } = this.state;
this.setState({isAreaSave: false});
this.setState({ isAreaSave: false });
saveAreaDataAction(routePathData).then(d => {
message.success('保存成功！');
this.a3dRef.changeDrawState(PEN_STATE.CLEARED);//清除当前路径
......@@ -900,10 +915,10 @@ class View3D extends Component {
});
getAreaTreeAction().then(data => {
//console.log(data);
console.log(JSON.stringify(data))
console.log(JSON.stringify(data));
this.setState({
treeData: data || [],
routePathData:[]
routePathData: []
});
});
}, eer => {
......@@ -914,20 +929,42 @@ class View3D extends Component {
//保存点绑定
savePointData = () => {
let { markers, pointType, isPointSave} = this.state;
this.setState({isPointSave: false});
let paramsArr = [];
paramsArr = markers[pointType].filter(e=> e.isEdit).map(item=>{
return {
pointId: item.id,
pointType: item.type,
position3d: item.position.length > 1 ? `${item.position[0]},${item.position[1]},${item.position[2]}` : null
};
});
this.savePointList(pointType,paramsArr);
let { markers, pointType } = this.state;
this.setState({ isPointSave: false });
if (pointType === 'fireEquipment') {
let typeArr = ['fireEquipment','pool','hydrant','fireChamber','fireCar','fireFoamRoom'];
for (let i = 0;i < typeArr.length;i++){
let paramsArr = [];
if (markers[typeArr[i]].length > 0){
paramsArr = markers[typeArr[i]].filter(e=> e.isEdit).map(item=>{
return {
pointId: item.id,
pointType: item.type,
position3d: item.position.length > 1 ? `${item.position[0]},${item.position[1]},${item.position[2]}` : null
};
});
if (i === 0){
this.savePointList(pointType,paramsArr);
} else {
this.savePointList(pointType,paramsArr,true);
}
}
}
} else {
let paramsArr = [];
paramsArr = markers[pointType].filter(e=> e.isEdit).map(item=>{
return {
pointId: item.id,
pointType: item.type,
position3d: item.position.length > 1 ? `${item.position[0]},${item.position[1]},${item.position[2]}` : null
};
});
this.savePointList(pointType,paramsArr);
}
}
savePointList = (pointType,paramsArr) => {
savePointList = (pointType,paramsArr,isfirst = true) => {
savePointListAction(paramsArr).then(
data => {
getPointTreeAction(pointType).then(
......@@ -939,14 +976,18 @@ class View3D extends Component {
});
}
);
message.success('保存成功');
},error => message.error('保存失败')
isfirst && message.success('保存成功');
},error =>{
isfirst && message.error('保存失败');
}
);
}
// 删除点绑定
deletePointBind = () => {
let { selectPoints ,pointTypeArr,pointType,markers} = this.state;
let { selectPoints ,pointType } = this.state;
if (selectPoints && !selectPoints.isRegion) {
let pointParams = [];
......@@ -956,24 +997,7 @@ class View3D extends Component {
position3d: ``
});
this.savePointAndRefreshMarker(pointType,pointParams);
}else if(selectPoints && selectPoints.isRegion && selectPoints.children){
// AmosAlert.confirm('提示', '是否删除该区域下所有点?', {
// callback: (flag) => {
// if (flag){
// let pointParams = [];
// pointParams = selectPoints.children.filter(e => e.position3d && e.position3d.length > 0).map(item=>{
// return {
// pointId: item.id,
// pointType: item.type,
// position3d: ''
// };
// });
// this.savePointAndRefreshMarker(pointType,pointParams);
// } else {
// }
// }
// });
} else if (selectPoints && selectPoints.isRegion && selectPoints.children){
let pointParams = [];
pointParams = selectPoints.children.filter(e => e.position3d && e.position3d.length > 0).map(item=>{
return {
......@@ -983,14 +1007,14 @@ class View3D extends Component {
};
});
this.savePointAndRefreshMarker(pointType,pointParams);
this.setState({promptData:{
promptvisible:true,
promptContent:'是否删除该区域下所有点?',
type:'point',
btnType:'isOk',
isback:false,
}
})
this.setState({ promptData: {
promptvisible: true,
promptContent: '是否删除该区域下所有点?',
type: 'point',
btnType: 'isOk',
isback: false
}
});
}
}
......@@ -1009,10 +1033,10 @@ class View3D extends Component {
//删除区域
deleteAreaBind = () => {
let { selectArea,treeData } = this.state;
let { selectArea } = this.state;
if (selectArea) {
getPointsByRegionIdAction(selectArea.id).then(d => {
if (d && d.length == 0){
if (d && d.length === 0){
this.state.routePathData.push({
riskSourceId: selectArea.id,
routePath: ''
......@@ -1024,21 +1048,21 @@ class View3D extends Component {
this.setState({
routePathData: this.state.routePathData,
//treeData: tree.children,
selectArea: '',
selectArea: ''
});
this.setState({ promptData: {
promptvisible: true,
promptContent: '确定将选中删除？',
type: 'region',
btnType: 'isOk',
isback: false
}
});
this.setState({promptData:{
promptvisible:true,
promptContent:'确定将选中删除？',
type:'region',
btnType:'isOk',
isback:false
}
})
} else {
message.danger('请先清除点的绑定再进行删除！');
}
});
}else{
} else {
message.danger('请先选择已绑定的区域再进行删除！');
}
}
......@@ -1046,38 +1070,38 @@ class View3D extends Component {
* 处理数据
*/
generateList = data => {
let {treeDataList } =this.state;
let { treeDataList } = this.state;
for (let i = 0; i < data.length; i++) {
const node = data[i];
const key = node.id;
const title = node.name;
treeDataList.push({ key, title });
if (node.children.length>0) {
if (node.children.length > 0) {
this.generateList(node.children);
}
}
this.setState({treeDataList})
this.setState({ treeDataList });
}
removeTreeDataRoutePathByChildId = ( areaId, obj ) => {
let oldSize = obj.children.length;
let flag = false;
if(oldSize > 0){
if (oldSize > 0){
obj.children && obj.children.some( t => {
if(t.id == areaId){
if (t.id === areaId){
t.routePath = '';
t.isBind = false;
flag = true
flag = true;
}
});
if(flag){//移除
if (flag){//移除
return;
}else{
} else {
obj.children && obj.children.some(t => {
this.removeTreeDataRoutePathByChildId( areaId, t );
});
}
}else{
} else {
return;
}
}
......@@ -1087,7 +1111,12 @@ class View3D extends Component {
*/
changeAreaPoint = (type) => {
let { pointTypeArr } = this.state;
this.setState({ treeDataList: [] });
this.setState( {
treeDataList: [],
dragItem: '',
selectArea: '',
selectPoints: ''
} );
this.stagePilot.positionCtl.clearDrag();//清除已有选中
if (type === 'region') {
getAreaTreeAction().then(data => {
......@@ -1107,7 +1136,8 @@ class View3D extends Component {
pointType: pointTypeArr[0].code || '',
treeData: data || [],
pageType: 'point',
showRightPanel: false
showRightPanel: false ,
selectArea: ''
});
});
this.enableCamera();
......@@ -1118,9 +1148,13 @@ class View3D extends Component {
if (isPointSave){
this.showConfirm();
}
this.stagePilot.positionCtl.clearDrag();
this.setState({
pointType,
treeData: []
treeData: [],
selectArea: '',
selectPoints: '',
dragItem: ''
});
getPointTreeAction(pointType).then(data => {
//alert(JSON.stringify(data))
......@@ -1132,35 +1166,26 @@ class View3D extends Component {
});
}
showConfirm = () => {
// AmosAlert.confirm('提示', '有未保存数据，是否保存?', {
// callback: (flag) => {
// if (flag){
// this.savePointData();
// } else {
// this.setState({ isPointSave: true });
// }
// }
// });
this.setState({promptData:
{
promptvisible:true,
promptContent:`有未保存数据，是否保存??`,
type:'point',
btnType:'isOk',
isback:false
}
})
this.setState({ promptData:
{
promptvisible: true,
promptContent: `有未保存数据，是否保存?`,
type: 'point',
btnType: 'isOk',
isback: false
}
});
};
dragItemChange = (dragItem) => {
let { treeData } = this.state;
this.stagePilot.positionCtl.clearDrag();
if (dragItem.isRegion) {
//是区域
} else {
if (dragItem.isBind) {
//已绑定
} else {
let hasRegion = false;
//未绑定
}
}
this.setState({
......@@ -1185,7 +1210,7 @@ class View3D extends Component {
if (objs.length > 0){
position = objs[0].point;
}
const isInside = this.polygonRegion[dragItem.parentId].pointInPolygon([position.x,position.y,position.z])
const isInside = this.polygonRegion[dragItem.parentId].pointInPolygon([position.x,position.y,position.z]);
console.log(isInside);
if (dragItem) {
if (isInside === false) {
......@@ -1211,7 +1236,7 @@ class View3D extends Component {
id: dragItem.id,
type: dragItem.type
};
markers[`${type}`] = markers[`${type}`].filter(e => e.id != dragItem.id );
markers[`${type}`] = markers[`${type}`] && markers[`${type}`].filter(e => e.id !== dragItem.id );
markers[`${type}`].push(addPointParam);
this.setState({
markers: deepCopy(markers),
......@@ -1236,7 +1261,7 @@ class View3D extends Component {
this.setState({ isEditMode });
if (isEditMode === true) {
getAreaTreeAction().then(treeData => {
this.generateList(treeData)
this.generateList(treeData);
this.setState({
treeData: treeData || []
});
......@@ -1452,7 +1477,7 @@ class View3D extends Component {
// markers[markerType] = d;
this.setState({
markers,
markerType: "impEquipmentMode"
markerType: 'impEquipmentMode'
});
return;
});
......@@ -1519,17 +1544,19 @@ class View3D extends Component {
this.props.editModelChange(false);//显示全景统计
this.enableCamera();//恢复相机
this.setState({
treeData: [],
pageType: 'region',//区域
sideControlShow: false, //隐藏耳朵
isShowActionBar: true, //显示工具栏
startLoadExceptionArea: true, //显示marker，
headerName: '', //设置头名称
isEditMode: false, //推出编辑模式
errorAreaId: '',
selectArea: "",//选中区域
selectPoints: "",//选中点
});
treeData: [],
pageType: 'region',//区域
sideControlShow: false, //隐藏耳朵
isShowActionBar: true, //显示工具栏
startLoadExceptionArea: true, //显示marker，
headerName: '', //设置头名称
isEditMode: false, //推出编辑模式
errorAreaId: '',
dragItem: '',
selectArea: '',
selectPoints: '',
showRightPanel: false
});
}
handleExceptModel =(type,areaId)=>{
let { isPointSave,isAreaSave } = this.state;
......@@ -1545,30 +1572,30 @@ class View3D extends Component {
});
} else if (type === 'out_except_model'){
this.stagePilot.positionCtl.clearDrag();
if(isAreaSave){
this.setState({promptData:
if (isAreaSave){
this.setState({ promptData:
{
promptvisible: true,
promptContent: `要在退出之前保存对风险区域的更改吗?`,
type: 'region',
btnType: 'isSave',
isback: true
}
});
return;
} else {
if (isPointSave){
this.setState({ promptData:
{
promptvisible:true,
promptContent:`要在退出之前保存对风险区域的更改吗?`,
type:'region',
btnType:'isSave',
isback:true
promptvisible: true,
promptContent: `要在退出之前保存对风险点的更改吗?`,
type: 'point',
btnType: 'isSave',
isback: true
}
})
return
}else{
if (isPointSave){
this.setState({promptData:
{
promptvisible:true,
promptContent:`要在退出之前保存对风险点的更改吗?`,
type:'point',
btnType:'isSave',
isback:true
}
})
});
} else {
this.handleOutExceptModel()
this.handleOutExceptModel();
}
}
}
......@@ -1604,7 +1631,7 @@ class View3D extends Component {
addMarker=({ extData, position })=>{
const me = this;
const { markers } = me.state;
const isInside = me.polygonRegion && extData.parentId && me.polygonRegion[extData.parentId].pointInPolygon([position.x,position.y,position.z]);
//const isInside = me.polygonRegion && extData.parentId && me.polygonRegion[extData.parentId].pointInPolygon([position.x,position.y,position.z]);
// if (isInside){
markers[extData.type].forEach(e => {
if (e.id === extData.id){
......@@ -1625,10 +1652,10 @@ class View3D extends Component {
}
closePromptModal=()=>{
this.setState({
promptData:{promptvisible:false},
isPointSave:false,
isAreaSave:false,}
)
promptData: { promptvisible: false },
isPointSave: false,
isAreaSave: false
});
}
render() {
const {
......@@ -1648,7 +1675,6 @@ class View3D extends Component {
isShowActionBar,
headerName,
errorAreaId,
positionxyz,
rightHeight,
treeDataList,
promptData
......@@ -1692,10 +1718,11 @@ class View3D extends Component {
return (
<div className='ModuleEditPage'>
<PromptModal promptData={promptData}
saveAreaData={this.saveAreaData}
handleOutExceptModel={this.handleOutExceptModel}
savePointData={this.savePointData}
closePromptModal={this.closePromptModal}/>
saveAreaData={this.saveAreaData}
handleOutExceptModel={this.handleOutExceptModel}
savePointData={this.savePointData}
closePromptModal={this.closePromptModal}
/>
<div
className='designerBox'
......@@ -1748,7 +1775,7 @@ class View3D extends Component {
<FlameFire position={firePosition} width={10} height={20} depth={8} sliceSpacing={1} visible={planStarted} />
{isEditMode && this.renderAreas()}
{this.renderPolygonRegion(exceptionAreas)}
{startLoadExceptionArea && <ExceptionArea markers={exceptionMarkers} handleExceptModel={this.handleExceptModel} />}
{startLoadExceptionArea && <ExceptionArea markers={exceptionMarkers} handleExceptModel={this.handleExceptModel} focusPosition={this.focusPosition} />}
</A3DDesigner>
</div>
{ isEditMode &&
......@@ -1788,10 +1815,10 @@ class View3D extends Component {
</div>
<div className='rightBox'>
{
showRightPanel && pageType === 'region' ? <RightEditRegionPanel detailData={selectArea} rightHeight={rightHeight} closeRightPanel={()=>this.setState({showRightPanel:false})} changeRoutePath={this.changeRoutePath} routePathData={this.state.routePathData}/> : ''
showRightPanel && pageType === 'region' ? <RightEditRegionPanel detailData={selectArea} rightHeight={rightHeight} closeRightPanel={()=>this.setState({ showRightPanel: false })} changeRoutePath={this.changeRoutePath} routePathData={this.state.routePathData} /> : ''
}
{
showRightPanel && pageType === 'point' ? <RightEditPointPanel detailData={selectPoints} showRightPanel={showRightPanel} closeRightPanel={()=>this.setState({showRightPanel:false})} markers={markers} changeMarkersData={this.changeMarkersData}/> : ''
showRightPanel && pageType === 'point' ? <RightEditPointPanel detailData={selectPoints} showRightPanel={showRightPanel} closeRightPanel={()=>this.setState({ showRightPanel: false })} markers={markers} changeMarkersData={this.changeMarkersData} /> : ''
}
</div>
</div>
......
mods/components/3dviewConvertor/view/exceptionArea/ExceptionArea.js
View file @ dbfb0677
......@@ -44,10 +44,13 @@ class ExceptionArea extends Component {
}
onMarkerClick = (marker) => {
console.log(marker);
const { extData } = marker;
this.props.handleExceptModel && this.props.handleExceptModel('into_except_model',extData.id);
this.props.focusPosition(this.toCameraPosition(extData.position));
}
setTopCardConf = (obj,{ safetyIndex })=>{
obj.baseObjHelper.titleConfig = {
// 顶牌平面参数
......@@ -71,6 +74,16 @@ class ExceptionArea extends Component {
obj.baseObjHelper.title = safetyIndex;
}
toCameraPosition = (item) => {
if (item && item.x){
return { x: item.x , y: item.y + 200 , z: item.z + 200 };
} else if (item && item[0]){
return { x: item[0] , y: item[1] + 200 , z: item[2] + 200 };
} else {
return;
}
}
markerCreated = ({ markersCache }) => {
this.markersCache = markersCache;
markersCache.eachValue(item=>{
......@@ -97,7 +110,8 @@ class ExceptionArea extends Component {
ExceptionArea.propTypes = {
markers: PropTypes.array,
handleExceptModel: PropTypes.func
handleExceptModel: PropTypes.func,
focusPosition: PropTypes.func
};
export default ExceptionArea;
mods/components/3dviewConvertor/view/moduleEditComponent/PointLeftTree.js
View file @ dbfb0677
/* eslint-disable react/prop-types */
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Connect, Tree, Select, Search, Button } from 'amos-framework';
......@@ -29,15 +30,15 @@ class PointLeftTree extends Component {
this.state = {
// showScreenSaver: false //是否打开屏保
expandedKeys: [],
autoExpandParent: true,
checkedKeys: [],
selectedKeys: [],
treeData:[],
pointTypeArr:[],
pointType:'',
treeDataList : [],
searchValue:''
expandedKeys: [],
autoExpandParent: true,
checkedKeys: [],
selectedKeys: [],
treeData: [],
pointTypeArr: [],
pointType: '',
treeDataList: [],
searchValue: ''
};
}
......@@ -53,27 +54,22 @@ class PointLeftTree extends Component {
// console.log(this.props)
}
componentWillUnmount() {
}
componentWillReceiveProps(nextProps) {
console.log(nextProps)
let {treeData,pointTypeArr,treeDataList} = nextProps;
this.setState({
treeData,
treeDataList,
//pointTypeArr,
//pointType: pointTypeArr[0]?pointTypeArr[0].code:''
})
console.log(nextProps);
let { treeData,treeDataList } = nextProps;
this.setState({
treeData,
treeDataList
});
}
onSelectChange = (value, item) =>{
console.log(value, item);
this.setState({pointType:value})
this.setState({ pointType: value });
this.props.pointTypeChange(value);
}
onSearchChange = e => {
const {treeDataList,treeData} = this.state
const { treeDataList,treeData } = this.state;
const value = e.target.value;
const expandedKeys = treeDataList
.map(item => {
......@@ -84,16 +80,13 @@ class PointLeftTree extends Component {
})
.filter((item, i, self) => item && self.indexOf(item) === i);
this.setState({
expandedKeys,
searchValue: value,
autoExpandParent: true
});
}
expandedKeys,
searchValue: value,
autoExpandParent: true
});
}
onExpand = (expandedKeys) => {
//console.log('onExpand', arguments);
// if not set autoExpandParent to false, if children expanded, parent can not collapse.
// or, you can remove all expanded children keys.
this.setState({
expandedKeys,
autoExpandParent: false
......@@ -107,10 +100,11 @@ class PointLeftTree extends Component {
}
// eslint-disable-next-line react/sort-comp
renderTreeNodes = (data) => {
let {searchValue} =this.state
let { searchValue } = this.state;
// console.log(data);
if (data.length>0) {
if (data.length > 0) {
return data.map((item) => {
const index = item.name.indexOf(searchValue);
const beforeStr = item.name.substr(0, index);
......@@ -162,11 +156,12 @@ class PointLeftTree extends Component {
</span>}
</div>
}
key={item.id}
dataRef={item}
onDragStart={() => {
this.props.dragItemChange(item)
}}>
key={item.id}
dataRef={item}
onDragStart={() => {
this.props.dragItemChange(item);
}}
>
{this.renderTreeNodes(item.children)}
</TreeNode>
);
......@@ -184,55 +179,52 @@ class PointLeftTree extends Component {
this.props.selectPointChange(selectItem);
}
render() {
let { treeData, checkedPointsKeys,pointTypeArr,pointType } = this.state;
let { pageType } = this.props;
return (
let { treeData,pointTypeArr,pointType } = this.state;
return (
<div className="leftTree">
<div className='leftContainer'>
<div className='topForm'>
{(pointType!='') &&
<Select onChange={this.onSelectChange} defaultValue={pointType} value={pointType} className='leftSelect'>
{
pointTypeArr.map(item => {
return (<Option className='selectOption' value={item.code} >{item.name}</Option>)
<div className='leftContainer'>
<div className='topForm'>
{(pointType !== '') &&
<Select onChange={this.onSelectChange} defaultValue={pointType} value={pointType} className='leftSelect'>
{
pointTypeArr.map((item )=> {
return (<Option key={item} className='selectOption' value={item.code} >{item.name}</Option>);
})
}
</Select>
</Select>
}
<Search className='leftSearch' icon="search" onChange={this.onSearchChange} onIconClick={this.onSearchChange} />
</div>
<div className='treeBox'>
<Tree
// checkable
// checkStrictly
selectable={true}
onExpand={this.onExpand}
expandedKeys={this.state.expandedKeys}
autoExpandParent={this.state.autoExpandParent}
// onCheck={this.onCheck}
// checkedKeys={checkedPointsKeys}
onSelect={this.onTreeSelect}
selectedKeys={this.state.selectedKeys}
blockNode
>
{this.renderTreeNodes(treeData)}
</Tree>
</div>
<div className='bottomBtns'>
<Button
className='sureBtn'
onClick={() => {
this.props.savePointData()
}} ></Button>
<Button
className='deleteBtn'
onClick={() => {
this.props.deletePointBind()
}} ></Button>
</div>
<Search className='leftSearch' icon="search" onChange={this.onSearchChange} onIconClick={this.onSearchChange} />
</div>
<div className='treeBox'>
<Tree
selectable
onExpand={this.onExpand}
expandedKeys={this.state.expandedKeys}
autoExpandParent={this.state.autoExpandParent}
onSelect={this.onTreeSelect}
selectedKeys={this.state.selectedKeys}
blockNode
>
{this.renderTreeNodes(treeData)}
</Tree>
</div>
<div className='bottomBtns'>
<Button
className='sureBtn'
onClick={() => {
this.props.savePointData();
}}
/>
<Button
className='deleteBtn'
onClick={() => {
this.props.deletePointBind();
}}
/>
</div>
</div>
</div>
);
......
mods/components/3dviewConvertor/view/moduleEditComponent/RightEditRegionPanel.js
View file @ dbfb0677
......@@ -89,7 +89,6 @@ class RightEditRegionPanel extends Component {
this.form.validate((valid, dataValues, errors) => {
console.log('返回内容:', dataValues, valid, errors);
if (valid) {
let routePathData=[ {
riskSourceId: detailData.id,
routePath: JSON.stringify({
......@@ -106,8 +105,10 @@ class RightEditRegionPanel extends Component {
})
}
this.props.changeRoutePath(routePathDataNode);
this.props.closeRightPanel()
} else {
console.log('error submit!!');
this.props.closeRightPanel()
return false;
}
});
......
mods/components/3dviewConvertor/view/points/marker3DFactory.js
View file @ dbfb0677
......@@ -15,10 +15,10 @@ const getIcon = (markerType, level) => {
if (markerType === 'riskSource' || markerType === 'patrol' || markerType === 'impEquipmentMode') {
return marker3DIoncMapper[`${markerType}_${level}`];
}
return marker3DIoncMapper[`${markerType}`]
return marker3DIoncMapper[`${markerType}`];
};
const createMarkerLabel = (text) => {
const createMarkerLabel = text => {
const div = document.createElement('div');
div.style.position = 'absolute';
div.style.marginTop = '-3rem';
......@@ -27,18 +27,17 @@ const createMarkerLabel = (text) => {
return div;
};
const urlMapper = {
fireCar: { file: 'fire-car',label: '消防车'},
fireEquipment:{file: 'fireEquip',label: '消防车'},
fireFoamRoom:{file: 'fireFoam',label: '泡沫间'},
fireChamber:{file: 'fireChamber',label: '消防室'},
hydrant:{file: 'hydrant',label: '消防栓'},
pool:{file: 'pool',label: '灭火水池'},
fireCar: { file: 'fire-car', label: '消防车' },
fireEquipment: { file: 'pool', label: '消防' },
fireFoamRoom: { file: 'fireFoam', label: '泡沫间' },
fireChamber: { file: 'fireChamber', label: '消防室' },
hydrant: { file: 'hydrant', label: '消防栓' },
pool: { file: 'pool', label: '灭火水池' }
};
export default function marker3DFactory(WrappedComponent = 'div', options){
export default function marker3DFactory(WrappedComponent = 'div', options) {
const { markerType, markerParams } = options;
class MarkerPoints extends Component {
static propTypes = {
// marker 显隐
visible: PropTypes.bool,
......@@ -52,25 +51,25 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
click: this.onMarkerClick,
// dblclick: this.onMarkerDblClick,
dragend: this.markerDragend,
mouseover: (marker) => {
console.log('111')
if(marker.object2DPipe){
mouseover: marker => {
console.log('111');
if (marker.object2DPipe) {
marker.object2DPipe.pipeNode.visible = true;
marker.object2DPipe.pipeNode.elementVisible = true;
marker.object2DPipe.toggleDisplay(true);
}
if(marker.extData.type === 'riskSource'){
if (marker.extData.type === 'riskSource') {
marker.baseObjHelper.title = marker.extData.name;
marker.object2DPipe && marker.object2DPipe.toggleDisplay(true);
}
},
mouseout: (marker) => {
if(marker.object2DPipe){
mouseout: marker => {
if (marker.object2DPipe) {
marker.object2DPipe.pipeNode.visible = false;
marker.object2DPipe.pipeNode.elementVisible = false;
marker.object2DPipe.toggleDisplay(false);
}
if(marker.extData.type === 'riskSource'){
if (marker.extData.type === 'riskSource') {
marker.baseObjHelper.title = marker.extData.title;
marker.object2DPipe.toggleDisplay(false);
}
......@@ -83,41 +82,44 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
componentWillMount = () => {
this.setState({ planStarted: this.props.planStarted });
}
};
componentWillReceiveProps = nextProps => {
if(nextProps.isEditMode){
this.markersCache.eachValue(obj=>{
if (nextProps.isEditMode) {
this.markersCache.eachValue(obj => {
// this.setTopCardConf(obj, obj.extData);
if(nextProps.selectPoints.type == obj.extData.type && nextProps.selectPoints.id ==obj.extData.id ){
if (nextProps.selectPoints.type == obj.extData.type && nextProps.selectPoints.id == obj.extData.id) {
this.setTwinkleConf(obj);
}
});
}
this.setState({ planStarted: nextProps.planStarted });
}
};
componentWillUnmount() {
this.objAnchorHelper && this.objAnchorHelper.destroy();
}
onMarkerDblClick = (marker, e) => {
console.log('marker3DFactory','onMarkerDblClick')
console.log('marker3DFactory', 'onMarkerDblClick');
if (this.props.isEditMode) {
return false
return false;
}
clearTimeout(this.time);
// tirggerPlanTopic(CONSTS.plan_detail, { type: marker.extData.type, data: marker.extData });
if (marker.extData.markerType === 'fire' && void 0 !== marker.extData.show) {
tirggerTransTopic(CONSTS.forward, { details: { type: 'impEquipment', dialogId: marker.extData.equipmentId, show: marker.extData.show }, dateTime: Date.now() });
tirggerTransTopic(CONSTS.forward, {
details: { type: 'impEquipment', dialogId: marker.extData.equipmentId, show: marker.extData.show },
dateTime: Date.now()
});
return;
}
this.pdRef.tirggerBussines(marker);
}
};
onMarkerClick = (marker, e) => {
const { isClick } = this.state;
if (this.props.isEditMode) {
return false
return false;
}
tirggerPlanTopic(CONSTS.plan_detail, { type: marker.extData.type, data: marker.extData });
......@@ -125,7 +127,7 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
this.setState({ isClick: false }); //将isClick 变成false，将不会执行处理事件
// this.pdRef && this.pdRef.onOpenClick(marker);
this.time = setTimeout(() => this.pdRef && this.pdRef.onOpenClick(marker), 1000);
}else{
} else {
this.onMarkerDblClick(marker, e);
}
const that = this; // 为定时器中的setState绑定this
......@@ -133,50 +135,51 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
// 设置延迟事件，3秒后将执行
that.setState({ isClick: true }); // 将isClick设置为true
}, 1000);
}
};
markerDragend = (marker, evt) => {
if (marker){
if (marker) {
console.log(marker.position);
console.log(marker.extData);
this.props.addMarker(marker);
}
}
};
markerCreated = ({ markersCache }) => {
let { isEditMode,selectKey } =this.props;
let { isEditMode, selectKey } = this.props;
this.markersCache = markersCache;
this.stagePilot = this.props.stagePilot;
this.outlineHelper = this.stagePilot ? this.stagePilot.outlineHelper : undefined;
markersCache.eachValue(obj=>{
markersCache.eachValue(obj => {
this.setTopCardConf(obj, obj.extData);
if(obj.extData.type === "riskSource" && markerType != 'impEquipmentMode' && !isEditMode){
if (obj.extData.type === 'riskSource' && markerType != 'impEquipmentMode' && !isEditMode) {
this.setTwinkleConf(obj);
}
});
}
};
setTwinkleConf = ( obj ) => {
const { twinkle,frequency } = obj.extData;
let pulsePeriod = (twinkle && frequency != 0 ? 1 / frequency : null)
let color = twinkle && frequency != 0 ? '#FF0000': null;
if (!obj.baseObjHelper.outlineHelper){
setTwinkleConf = obj => {
const { twinkle, frequency } = obj.extData;
let pulsePeriod = twinkle && frequency != 0 ? 1 / frequency : null;
let color = twinkle && frequency != 0 ? '#FF0000' : null;
if (!obj.baseObjHelper.outlineHelper) {
obj.baseObjHelper.setOutlineHelper(this.outlineHelper);
}
obj.baseObjHelper.style.outlineColor = color;
pulsePeriod && obj.baseObjHelper.outlineHelper.setConfig({
pulsePeriod: pulsePeriod.toFixed(2)
});
}
pulsePeriod &&
obj.baseObjHelper.outlineHelper.setConfig({
pulsePeriod: pulsePeriod.toFixed(2)
});
};
setTopCardConf = (obj, extData )=>{
const { title, label , type, showInfo , name } = extData;
setTopCardConf = (obj, extData) => {
const { title, label, type, showInfo, name } = extData;
let cardTitle = null;
console.log(extData)
console.log(extData);
obj.baseObjHelper.titleConfig = {
// 顶牌平面参数
planeOptions: {
width: 40,
height: 20,
position: [0,20,0],
position: [0, 20, 0],
doubleSide: true
},
canvasOptions: {
......@@ -190,36 +193,36 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
imgHeight: 128,
image: markerTitleBgMapper['base']
};
if(type === 'riskSource' && !this.props.isEditMode){
cardTitle = '风险值' + title
}else{
if (type === 'riskSource' && !this.props.isEditMode) {
cardTitle = '风险值' + title;
} else {
cardTitle = name ? name : title;
}
obj.baseObjHelper.title = cardTitle;
}
};
buildMarkerOptions = (markers, markerType, defaultParams = {}) => {
console.log(markers)
console.log(markers);
const { isEditMode } = this.props;
if (!utils.isEmpty(markers)){
if (!utils.isEmpty(markers)) {
markers.forEach(m => {
const url = getIcon(markerType, m.level);
let position;
if (!utils.isArray(m.position)){
if (!utils.isArray(m.position)) {
position = Object.values(m.position);
}
for (let k of Object.keys(defaultParams)) {
if((markerType === 'riskSource' || markerType === 'patrol' ) && k != 'useModel' && !isEditMode){
if ((markerType === 'riskSource' || markerType === 'patrol') && k !== 'useModel' && !isEditMode) {
m[k] = formatUrl(defaultParams[k], { url: `${markerType}-${m.level}` });
}else if((markerType === 'riskSource' || markerType === 'patrol' ) && k != 'useModel' && isEditMode){
if(markerType === 'riskSource'){
} else if ((markerType === 'riskSource' || markerType === 'patrol') && k !== 'useModel' && isEditMode) {
if (markerType === 'riskSource') {
m[k] = formatUrl(defaultParams[k], { url: `${markerType}-4` });
}else{
} else {
m[k] = formatUrl(defaultParams[k], { url: `${markerType}-1` });
}
}else if(markerType === 'fireResource' && k != 'useModel' && isEditMode && urlMapper[m.type]){
m[k] = formatUrl(defaultParams[k], { url: `${urlMapper[m.type].file}`});
}else{
} else if (markerType === 'fireResource' && k !== 'useModel' && isEditMode && urlMapper[m.type]) {
m[k] = formatUrl(defaultParams[k], { url: `${urlMapper[m.type].file}` });
} else {
m[k] = defaultParams[k];
}
}
......@@ -236,21 +239,15 @@ export default function marker3DFactory(WrappedComponent = 'div', options){
};
render() {
const { markers,isEditMode, ...rest } = this.props;
const { markers, isEditMode, ...rest } = this.props;
const { planStarted } = this.state;
let dialogStyle = { zIndex: 1000 };
const result = this.buildMarkerOptions(markers, markerType, markerParams);
return (
<WrappedComponent>
<Markers
{...rest}
draggable={isEditMode}
markers={result}
events={this.markerEvents}
onCreated={this.markerCreated}
/>
{ !planStarted && <PointDialog style={dialogStyle} ref={node => this.pdRef = node} />}
<Markers {...rest} draggable={isEditMode} markers={result} events={this.markerEvents} onCreated={this.markerCreated} />
{!planStarted && <PointDialog style={dialogStyle} ref={node => (this.pdRef = node)} />}
</WrappedComponent>
);
}
......
mods/components/3dviewConvertor/view/searchPane/index.js
View file @ dbfb0677
......@@ -20,73 +20,73 @@ const getColumns = (self,retrieveType) => {
switch (retrieveType) {
case 'riskSource':
return [
{title: '编号',dataIndex: 'code',key: 'code',width: '25%'},
{title: '名称',dataIndex: 'label',key: 'label',width: '25%'},
{title: '等级',dataIndex: 'levelStr',key: 'level',width: '25%'},
{title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%'}
{ title: '编号',dataIndex: 'code',key: 'code',width: '25%' },
{ title: '名称',dataIndex: 'label',key: 'label',width: '25%' },
{ title: '等级',dataIndex: 'levelStr',key: 'level',width: '25%' },
{ title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%' }
];
case 'patrol':
return [
{title: '编号',dataIndex: 'code',key: 'code',width: '16.5%'},
{title: '名称',dataIndex: 'label',key: 'label',width: '16.5%'},
{title: '路线',dataIndex: 'routeName',key: 'level',width: '16.5%'},
{title: '状态',dataIndex: 'title',key: 'level',width: '16.5%'},
{title: '责任人',dataIndex: 'person',key: 'level',width: '16.5%'},
{title: '类别',dataIndex: 'typeName',key: 'typeName',width: '16.5%'}
{ title: '编号',dataIndex: 'code',key: 'code',width: '16.5%' },
{ title: '名称',dataIndex: 'label',key: 'label',width: '16.5%' },
{ title: '路线',dataIndex: 'routeName',key: 'level',width: '16.5%' },
{ title: '状态',dataIndex: 'title',key: 'level',width: '16.5%' },
{ title: '责任人',dataIndex: 'person',key: 'level',width: '16.5%' },
{ title: '类别',dataIndex: 'typeName',key: 'typeName',width: '16.5%' }
];
case 'monitorEquipment':
return [
{title: '编号',dataIndex: 'code',key: 'code',width: '25%'},
{title: '名称',dataIndex: 'label',key: 'label',width: '25%'},
{title: '监控对象',dataIndex: 'level',key: 'protectObjName',width: '25%'},
{title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%'}
]
{ title: '编号',dataIndex: 'code',key: 'code',width: '25%' },
{ title: '名称',dataIndex: 'label',key: 'label',width: '25%' },
{ title: '监控对象',dataIndex: 'level',key: 'protectObjName',width: '25%' },
{ title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%' }
];
case 'video':
return [
{title: '编号',dataIndex: 'code',key: 'code',width: '25%'},
{title: '名称',dataIndex: 'label',key: 'label',width: '25%'},
{title: '监控对象',dataIndex: 'level',key: 'protectObjName',width: '25%'},
{title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%'}
]
{ title: '编号',dataIndex: 'code',key: 'code',width: '25%' },
{ title: '名称',dataIndex: 'label',key: 'label',width: '25%' },
{ title: '监控对象',dataIndex: 'level',key: 'protectObjName',width: '25%' },
{ title: '类别',dataIndex: 'typeName',key: 'typeName',width: '25%' }
];
default:
return [
{title: '编号',dataIndex: 'code',key: 'code',width: '33%'},
{title: '名称',dataIndex: 'label',key: 'label',width: '33%'},
{title: '类别',dataIndex: 'typeName',key: 'typeName',width: '33%'}
{ title: '编号',dataIndex: 'code',key: 'code',width: '33%' },
{ title: '名称',dataIndex: 'label',key: 'label',width: '33%' },
{ title: '类别',dataIndex: 'typeName',key: 'typeName',width: '33%' }
];
}
};
const getMsgColumns = () => {
return [
{title: '标题',dataIndex: 'title',key: 'title',width: '15%'},
{title: '类型',dataIndex: 'type',key: 'type',width: '15%'},
{title: '时间',dataIndex: 'timeStr',key: 'timeStr',width: '15%'},
{title: '内容',dataIndex: 'content',key: 'content',width: '55%'}
]
}
{ title: '标题',dataIndex: 'title',key: 'title',width: '15%' },
{ title: '类型',dataIndex: 'type',key: 'type',width: '15%' },
{ title: '时间',dataIndex: 'timeStr',key: 'timeStr',width: '15%' },
{ title: '内容',dataIndex: 'content',key: 'content',width: '55%' }
];
};
const getRecordColumns = () => {
return [
{title: '名称',dataIndex: 'fire_Equipment_Name',key: 'name',width: '33%'},
{title: '时间',dataIndex: 'create_time',key: 'create_time',width: '33%'},
{title: '重点设备',dataIndex: 'equipment_Name',key: 'equipment_Name',width: '33%'}
]
}
{ title: '名称',dataIndex: 'fire_Equipment_Name',key: 'name',width: '33%' },
{ title: '时间',dataIndex: 'create_time',key: 'create_time',width: '33%' },
{ title: '重点设备',dataIndex: 'equipment_Name',key: 'equipment_Name',width: '33%' }
];
};
const getTrajectoryColumns = () => {
return [
{title: '巡检人',dataIndex: 'userName',key: 'userName',width: '33%'},
{title: '时间',dataIndex: 'checkTime',key: 'checkTime',width: '33%'},
{title: '轨迹',dataIndex: 'pointName',key: 'pointName',width: '33%'}
]
}
{ title: '巡检人',dataIndex: 'userName',key: 'userName',width: '33%' },
{ title: '时间',dataIndex: 'checkTime',key: 'checkTime',width: '33%' },
{ title: '轨迹',dataIndex: 'pointName',key: 'pointName',width: '33%' }
];
};
const tabs = [
{ id: '1', key: 'search', closable: false, title: '检索' },
{ id: '2', key: 'message', closable: false, title: '消息' },
{ id: '3', key: 'record', closable: false, title: '步骤' },
{ id: '4', key: 'trajectory', closable: false, title: '轨迹' },
{ id: '4', key: 'trajectory', closable: false, title: '轨迹' }
];
class SearchPane extends Component {
......@@ -110,21 +110,19 @@ class SearchPane extends Component {
}
componentDidMount() {
const { type } = this.props;
const { activeKey } = this.state;
this.fetchRetrieveData();
}
paramsOnChange = (filter) => {
const {activeKey} = this.state;
if(activeKey === 'search'){
this.setState({filter},this.fetchRetrieveData);
}else if(activeKey === 'message'){
this.setState({filter},this.fetchMsgData);
}else if(activeKey === 'record'){
this.setState({filter},this.fetchRecordData);
}else if(activeKey === 'trajectory'){
this.setState({filter},this.fetchTrajectoryData);
const { activeKey } = this.state;
if (activeKey === 'search'){
this.setState({ filter },this.fetchRetrieveData);
} else if (activeKey === 'message'){
this.setState({ filter },this.fetchMsgData);
} else if (activeKey === 'record'){
this.setState({ filter },this.fetchRecordData);
} else if (activeKey === 'trajectory'){
this.setState({ filter },this.fetchTrajectoryData);
}
}
......@@ -146,16 +144,16 @@ class SearchPane extends Component {
onTabClick = (value) =>{
this.pageConfig.current = 0;
if(value === 'search'){
if (value === 'search'){
this.fetchRetrieveData();
}else if(value === 'message'){
} else if (value === 'message'){
this.fetchMsgData();
}else if(value === 'record'){
} else if (value === 'record'){
this.fetchRecordData();
}else if(value === 'trajectory'){
this.fetchTrajectoryData()
} else if (value === 'trajectory'){
this.fetchTrajectoryData();
}
this.setState({ activeKey:value ,filter: []});
this.setState({ activeKey: value ,filter: [] });
}
getPanelHeight = () => {
......@@ -165,14 +163,14 @@ class SearchPane extends Component {
fetchTrajectoryData = () => {
const { filter } = this.state;
recordAction(filter, this.pageConfig.current, this.pageConfig.pageSize).then(d => {
this.setState({trajectoryDataList:d.content,totalCount: d.totalElements});
this.setState({ trajectoryDataList: d.content,totalCount: d.totalElements });
});
}
//步骤
fetchRecordData = () => {
const { filter } = this.state;
exeRecordAction(filter, this.pageConfig.current, this.pageConfig.pageSize).then(d => {
this.setState({recordDataList:d.content,totalCount: d.totalElements});
this.setState({ recordDataList: d.content,totalCount: d.totalElements });
});
}
//消息
......@@ -189,7 +187,7 @@ class SearchPane extends Component {
}
});
msgAction(searchParam, this.pageConfig.current, this.pageConfig.pageSize).then(d => {
this.setState({msgDataList:d.content,totalCount: d.totalElements});
this.setState({ msgDataList: d.content,totalCount: d.totalElements });
});
}
//检索
......@@ -205,7 +203,7 @@ class SearchPane extends Component {
( filter || [] ).forEach((item, i) => {
if (item.name === 'type') {
type = item.value;
this.setState({ retrieveType: type })
this.setState({ retrieveType: type });
} else if (item.name === 'dataLevel') {
dataLevel = item.value;
} else if (item.name === 'nodeState') {
......@@ -222,8 +220,8 @@ class SearchPane extends Component {
searchAction(inputText, dataLevel, orgCode, nodeState, protectObjName, routeName, type, this.pageConfig.current, this.pageConfig.pageSize).then(d => {
this.setState({
dataList: d.content ,
totalCount: d.totalElements,
})
totalCount: d.totalElements
});
});
}
......@@ -239,8 +237,8 @@ class SearchPane extends Component {
onRetrieveRowDoubleClick = (record) => {
// 更新视图数据
let views = new Array();
if(record.position){
record.id = record.id.replace( record.type + '-' ,'' );
if (record.position){
record.id = record.id.replace( `${record.type}-` ,'' );
views.push(record);
let args = {
target: views,
......@@ -248,20 +246,27 @@ class SearchPane extends Component {
};
update3DViewData(args);
this.props.focusPosition(this.toCameraPosition(record.position));
}else{
} else {
message.danger('坐标未绑定!!!');
}
}
toCameraPosition = (item) => {
return { x: item.x , y: item.y + 200 , z: item.z + 200 }
if (item && item.x){
return { x: item.x , y: item.y + 200 , z: item.z + 200 };
} else if (item && item[0]){
return { x: item[0] , y: item[1] + 200 , z: item[2] + 200 };
} else {
return;
}
}
render() {
const { dataList,activeKey,retrieveType,totalCount,msgDataList,recordDataList,trajectoryDataList } = this.state;
return (
<div>
{ this.props.visible && <div className="search-pane-bg"/> }
{ this.props.visible && <div className="search-pane-bg" /> }
{ this.props.visible && <SidePane className="search-pane">
<div className="search-pane-close" onClick={this.props.changeSearchPaneVisible()}>
<Icon icon="close" />
......@@ -276,23 +281,23 @@ class SearchPane extends Component {
<Tab key={item.key} activeKey={item.key} closable={item.closable}>{item.title}</Tab>)
)}
</TabList>
<ParamsHeader paramsOnChange={this.paramsOnChange} activeKey={activeKey}/>
<ParamsHeader paramsOnChange={this.paramsOnChange} activeKey={activeKey} />
<TabPanel activeKey="search">
{/* <div className="search-pane-table"> */}
<AmosGridTable
rowKey="id"
columns={getColumns(this,retrieveType)}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {true}
setPageConfig={this.setPageConfig}
isChecked = {false}
<AmosGridTable
rowKey="id"
columns={getColumns(this,retrieveType)}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable
setPageConfig={this.setPageConfig}
isChecked={false}
// getPanelHeight={this.getPanelHeight}
dataList={dataList}
totals={totalCount}
onRowDoubleClick={this.onRetrieveRowDoubleClick}
getTableDataAction={this.fetchRetrieveData}
/>
dataList={dataList}
totals={totalCount}
onRowDoubleClick={this.onRetrieveRowDoubleClick}
getTableDataAction={this.fetchRetrieveData}
/>
{/* </div> */}
</TabPanel>
<TabPanel activeKey="message">
......@@ -300,9 +305,9 @@ class SearchPane extends Component {
columns={getMsgColumns()}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {true}
isPageable
setPageConfig={this.setPageConfig}
isChecked = {false}
isChecked={false}
dataList={msgDataList}
totals={totalCount}
getTableDataAction={this.fetchMsgData}
......@@ -313,9 +318,9 @@ class SearchPane extends Component {
columns={getRecordColumns()}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {true}
isPageable
setPageConfig={this.setPageConfig}
isChecked = {false}
isChecked={false}
dataList={recordDataList}
totals={totalCount}
getTableDataAction={this.fetchRecordData}
......@@ -326,9 +331,9 @@ class SearchPane extends Component {
columns={getTrajectoryColumns()}
getTableDataAction={()=>{}}
callBack={this.reload}
isPageable = {true}
isPageable
setPageConfig={this.setPageConfig}
isChecked = {false}
isChecked={false}
dataList={trajectoryDataList}
totals={totalCount}
getTableDataAction={this.fetchTrajectoryData}
......
mods/components/3dviewConvertor/view/searchPane/paramsHeader.js
View file @ dbfb0677
......@@ -4,7 +4,7 @@ import { Button, Input, Select, Group } from 'amos-framework';
import { SingleQueryEnum } from 'amos-processor/lib/config/queryEnum';
import { trim } from 'amos-tool';
import { DatePicker } from 'amos-antd';
import moment from "moment";
import moment from 'moment';
import imgStatic from './../../consts/imgStatic';
import {
getImpEquipmentAction,
......@@ -16,9 +16,9 @@ const Option = Select.Option;
const MsgTypeEnum = [{ id: 'protal', name: '巡检' }, { id: 'equiment', name: '设备' }, { id: 'risk', name: '风险' }];
const groupStyle = { display: 'unset', width: '100%' };
const selectStyle = { width: '25%', minWidth: '20%', marginRight:'14px' };
const inputStyle = { width: '30%', minWidth: '20%', height: '28px', marginRight:'14px' };
const datePickerStyle = { width: '30%', minWidth: '20%', height: '28px', marginRight:'14px' };
const selectStyle = { width: '25%', minWidth: '20%', marginRight: '14px' };
const inputStyle = { width: '30%', minWidth: '20%', height: '28px', marginRight: '14px' };
const datePickerStyle = { width: '30%', minWidth: '20%', height: '28px', marginRight: '14px' };
const enterkey = 13;
/**
*
......@@ -45,7 +45,7 @@ class paramsHeader extends Component {
impEquiList: [],
filter: [],
recordFilter: [],
statusList: [],
statusList: []
};
}
......@@ -61,10 +61,10 @@ class paramsHeader extends Component {
msgTextValue: undefined,
recordTextValue: undefined,
filter: [],
recordFilter: [],
})
recordFilter: []
});
}
}
}
onChange = (e) => {
this.setState({ value: e.target.value });
......@@ -74,9 +74,9 @@ class paramsHeader extends Component {
let showRiskLevel = false;
let showImpEquiList = false;
if(value === 'riskSource'){
if (value === 'riskSource'){
showRiskLevel = true;
}else if(value === 'monitorEquipment'){
} else if (value === 'monitorEquipment'){
showImpEquiList = true;
}
this.setState({ showRiskLevel, showImpEquiList });
......@@ -85,8 +85,8 @@ class paramsHeader extends Component {
onPamarmsChange = (name,value) => {
let { filter } = this.state;
if(name === 'time'){
value = value == null ? '' : moment(value).format("YYYY-MM-DD");
if (name === 'time'){
value = value == null ? '' : moment(value).format('YYYY-MM-DD');
}
if (value) {
const flag = filter.some(e => {
......@@ -99,19 +99,19 @@ class paramsHeader extends Component {
} else {
filter = filter.filter(e => e.name !== name);
}
if(name === 'inputText'){
if (name === 'inputText'){
this.setState({ textValue: value,filter });
}else if(name === 'title'){
} else if (name === 'title'){
this.setState({ msgTextValue: value,filter });
}else{
} else {
this.setState({ filter }, this.props.paramsOnChange(filter));
}
}
paramsTypeonChange = (name,value,type,key) => {
let {recordFilter} = this.state;
if(name === 'checkTime'){
value = value == null ? '' : moment(value).format("YYYY-MM-DD");
let { recordFilter } = this.state;
if (name === 'checkTime'){
value = value == null ? '' : moment(value).format('YYYY-MM-DD');
}
if (value) {
const flag = recordFilter.some(e => {
......@@ -125,16 +125,15 @@ class paramsHeader extends Component {
} else {
recordFilter = recordFilter.filter(e => e.name !== name);
}
debugger;
if(name === 'contingencyName'){
this.setState({recordTextValue:value,recordFilter})
}else if(name === 'pointName'){
if(key === 'record'){
this.setState({ recordTextValue:value,recordFilter });
}else{
if (name === 'contingencyName'){
this.setState({ recordTextValue: value,recordFilter });
} else if (name === 'pointName'){
if (key === 'record'){
this.setState({ recordTextValue: value,recordFilter });
} else {
this.setState({ trajectoryTextValue: value,recordFilter });
}
}else{//不为input时直接查询
} else {//不为input时直接查询
this.setState({ recordFilter }, this.props.paramsOnChange(recordFilter));
}
}
......@@ -142,8 +141,8 @@ class paramsHeader extends Component {
//检索
getSearchContent = () => {
const { showRiskLevel, showImpEquiList, impEquiList,filter } = this.state;
let levelStyle = { width: '20%', minWidth: '15%', height: '28px', marginRight:'14px' };
let implStyle = { width: '35%', minWidth: '20%', height: '28px', marginRight:'14px' };
let levelStyle = { width: '20%', minWidth: '15%', height: '28px', marginRight: '14px' };
let implStyle = { width: '35%', minWidth: '20%', height: '28px', marginRight: '14px' };
return (<Group style={groupStyle}>
<Select
key="searchType"
......@@ -160,7 +159,7 @@ class paramsHeader extends Component {
onChange={(e) => this.onPamarmsChange('inputText',e.target.value)}
placeholder="输入关键字"
/>
<img className="params-input-img" src={imgStatic.datapane.searchPane} alt="" onClick={() => this.props.paramsOnChange(filter)}/>
<img className="params-input-img" src={imgStatic.datapane.searchPane} alt="" onClick={() => this.props.paramsOnChange(filter)} />
</div>
{
showRiskLevel &&
......@@ -171,7 +170,7 @@ class paramsHeader extends Component {
renderOption={item => <Option className='modalSelectOption' key={item.key} value={item.key}>{item.label}</Option>}
defaultOption={<Option className='modalSelectOption'>全部</Option>}
onChange={(v) => this.onPamarmsChange('dataLevel',v)}
/>
/>
}
{
showImpEquiList &&
......@@ -182,7 +181,7 @@ class paramsHeader extends Component {
renderOption={item => <Option className='modalSelectOption' key={item.name} value={item.name}>{item.name}</Option>}
defaultOption={<Option className='modalSelectOption'>全部</Option>}
onChange={(v) => this.onPamarmsChange('impEquipment',v)}
/>
/>
}
</Group>);
......@@ -207,7 +206,7 @@ class paramsHeader extends Component {
onChange={(e) => this.onPamarmsChange('title',e.target.value)}
placeholder="输入关键字"
/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={() => this.props.paramsOnChange(filter)}/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={() => this.props.paramsOnChange(filter)} />
</div>
<DatePicker
key="time"
......@@ -216,7 +215,7 @@ class paramsHeader extends Component {
placeholder="时间"
format="YYYY/MM/DD"
onChange={(v) => this.onPamarmsChange('time',v)}
/>
/>
</Group>);
......@@ -230,7 +229,7 @@ class paramsHeader extends Component {
key="recordImpl"
style={selectStyle}
data={impEquiList}
renderOption={item => <Option key={item.id+item.name} value={item.id}>{item.name}</Option>}
renderOption={item => <Option key={item.id + item.name} value={item.id}>{item.name}</Option>}
defaultOption={<Option>重点设备</Option>}
onChange={(v) => this.paramsTypeonChange('equipmentId', v , SingleQueryEnum.EQUAL)}
/>
......@@ -241,7 +240,7 @@ class paramsHeader extends Component {
onChange={(e) => this.paramsTypeonChange('contingencyName', e.target.value, SingleQueryEnum.LIKE,'record')}
placeholder="输入关键字"
/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={()=> this.props.paramsOnChange(recordFilter)}/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={()=> this.props.paramsOnChange(recordFilter)} />
</div>
<DatePicker
key="createTime"
......@@ -250,7 +249,7 @@ class paramsHeader extends Component {
placeholder="时间"
format="YYYY/MM/DD"
onChange={(v) => this.paramsTypeonChange('createTime', v, SingleQueryEnum.EQUAL)}
/>
/>
</Group>);
}
......@@ -273,7 +272,7 @@ class paramsHeader extends Component {
onChange={(e) => this.paramsTypeonChange('pointName', e.target.value, SingleQueryEnum.LIKE)}
placeholder="输入关键字"
/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={()=>this.props.paramsOnChange(recordFilter)}/>
<img className="params-input-img1" src={imgStatic.datapane.searchPane} alt="" onClick={()=>this.props.paramsOnChange(recordFilter)} />
</div>
<DatePicker
key="createTime"
......@@ -282,19 +281,19 @@ class paramsHeader extends Component {
placeholder="时间"
format="YYYY/MM/DD"
onChange={(v) => this.paramsTypeonChange('beginDate', v, SingleQueryEnum.EQUAL)}
/>
/>
</Group>);
}
getContent = () =>{
const { activeKey } = this.props;
if(activeKey === 'search'){
if (activeKey === 'search'){
return this.getSearchContent();
}else if(activeKey === 'message'){
} else if (activeKey === 'message'){
return this.getMessageContent();
}else if(activeKey === 'record'){
} else if (activeKey === 'record'){
return this.getRecordContent();
}else{
} else {
return this.getTrajectoryContent();
}
}
......
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