邵佳豪 3 years ago
parent
commit
29aa7c9ddf
  1. 29
      src/app/babylon/controller/event-manager/events/event-loading-change.ts
  2. 3
      src/app/babylon/controller/mode-manager.ts
  3. 4
      src/app/babylon/model/data/institution/facility/property-data/out/property-data-pl.ts
  4. 11
      src/app/babylon/model/info/mark/mark-plan-info.ts
  5. 1
      src/app/babylon/model/info/model/model-info-facility.ts
  6. 3
      src/app/babylon/tool/babylon-tool.ts
  7. 3
      src/app/babylon/tool/load-tool.ts
  8. 25
      src/app/babylon/tool/speaking-tool.ts
  9. 2
      src/app/babylon/view/building-window/building-window.ts
  10. 2
      src/app/babylon/view/facilityinfoinscene-window/facilityinfo-ui-item.ts
  11. 11
      src/app/babylon/view/mark-window/mark-window.ts
  12. 57
      src/app/pages/left-domain/left-domain.component.html
  13. 3
      src/app/pages/left-domain/left-domain.component.scss
  14. 91
      src/app/pages/left-domain/left-domain.component.ts
  15. 29
      src/app/pages/plan/plan.component.html
  16. 8
      src/app/pages/plan/plan.component.scss
  17. 165
      src/app/pages/plan/plan.component.ts
  18. 10
      src/app/pages/plan/publicPop.scss
  19. 1
      src/app/service/objects.service.ts
  20. 9
      tsconfig.json

29
src/app/babylon/controller/event-manager/events/event-loading-change.ts

@ -0,0 +1,29 @@
import { Event_Base } from "../event-base";
import { EventManager } from "../event-manager";
/**
* loading遮罩
*/
export class Event_LoadingChange extends Event_Base {
/**
* loading中
*/
static isLoading: boolean = false;
/**
* loading条
*/
showLoading: boolean;
/**
*
* @param showLoading loading条
*/
static dispatch(showLoading: boolean) {
let eventData = new Event_LoadingChange();
eventData.showLoading = showLoading;
EventManager.dispatch<Event_LoadingChange>(Event_LoadingChange, eventData);
Event_LoadingChange.isLoading = showLoading;
}
}

3
src/app/babylon/controller/mode-manager.ts

@ -23,7 +23,7 @@ export class ModeManager {
/**
*
*/
public static s_isMakeMode = false;
public static s_isMakeMode = true;
/**
*
@ -53,6 +53,7 @@ export class ModeManager {
/**
*
*
*/
static get currentMode(): ModeType {
return ModeManager.s_currentMode;

4
src/app/babylon/model/data/institution/facility/property-data/out/property-data-pl.ts

@ -16,7 +16,8 @@ export class tableRow {
export class PropertyData_PL extends PropertyData_Base {
direction: number = 0; //毗邻所属方向 0,1,2,3 --- 东南西北
info: string = "";
textDirection: string = "";//用户手输的方向
info: string = ""; //用户输入的内容
tableData: tableData[] = [];
constructor(key: string, direction: number, info: string, tableData: tableData[]) {
super(key, FacilityType.PL);
@ -27,6 +28,7 @@ export class PropertyData_PL extends PropertyData_Base {
clone(key: string) {
let result = new PropertyData_PL(key, this.direction, this.info, this.tableData);
result.textDirection = this.textDirection;
return result;
}

11
src/app/babylon/model/info/mark/mark-plan-info.ts

@ -1,5 +1,6 @@
import { TsTool } from "src/app/babylon/tool/ts-tool";
import { MarkWindow } from "src/app/babylon/view/mark-window/mark-window";
import { MarkTagPos, MarkType } from "../../data/mark/mark-data";
import { MarkNodeData, MarkPlanData } from "../../data/mark/mark-plan-data";
import { ModelInfo_mark } from "./model-info-mark";
@ -99,6 +100,16 @@ export class MarkNodeInfo {
return this.currentMarkDataIndex;
}
/**
*
*/
readDescribe() {
if (this.nodeData != null) {
MarkWindow.instance.readDescribe(this.nodeData.describe);
}
}
/**

1
src/app/babylon/model/info/model/model-info-facility.ts

@ -4,7 +4,6 @@ import { ConfigManager } from "src/app/babylon/controller/config-manager";
import { SceneManager } from "src/app/babylon/controller/scene-manager";
import { UIManager } from "src/app/babylon/controller/ui-manager";
import { BabylonUIStyleTool } from "src/app/babylon/tool/babylon-ui-style-tool";
import { SpeakingTool } from "src/app/babylon/tool/speaking-tool";
import { TsTool } from "src/app/babylon/tool/ts-tool";
import { FacilityWindow } from "src/app/babylon/view/facility-window/facility-window";
import { FacilityInfoInSceneWindow } from "src/app/babylon/view/facilityinfoinscene-window/facilityinfoinscene-window";

3
src/app/babylon/tool/babylon-tool.ts

@ -10,11 +10,9 @@ import {
ISceneLoaderPluginAsync,
ISceneLoaderProgressEvent,
Mesh,
MeshBuilder,
NodeMaterial,
PBRMaterial,
QuadraticEase,
Quaternion,
Scene,
SceneLoader,
Skeleton,
@ -22,7 +20,6 @@ import {
} from '@babylonjs/core';
import {
AdvancedDynamicTexture,
Button,
Container,
Control,

3
src/app/babylon/tool/load-tool.ts

@ -1,4 +1,5 @@
import { PlanComponent } from "src/app/pages/plan/plan.component";
import { Event_LoadingChange } from "../controller/event-manager/events/event-loading-change";
/**
*
@ -52,6 +53,7 @@ export class LoadTool {
static onStart() {
// console.log("开始加载");
PlanComponent.instance.showLoading(true);
Event_LoadingChange.dispatch(true);
}
/**
@ -60,6 +62,7 @@ export class LoadTool {
static onEnd() {
// console.log("结束加载");
PlanComponent.instance.showLoading(false);
Event_LoadingChange.dispatch(false);
}
}

25
src/app/babylon/tool/speaking-tool.ts

@ -1,3 +1,5 @@
import { EventManager } from "../controller/event-manager/event-manager";
import { Event_LoadingChange } from "../controller/event-manager/events/event-loading-change";
/**
*
@ -10,9 +12,25 @@ export class SpeakingTool {
if (SpeakingTool.instance == null) {
SpeakingTool.instance = new SpeakingTool();
}
EventManager.addListener<Event_LoadingChange>(Event_LoadingChange, (eventInfo) => {
SpeakingTool.instance.onChangeLoading(eventInfo);
});
return SpeakingTool.instance;
}
/**
* loading状态改变时
* @param eventInfo
*/
onChangeLoading(eventInfo: Event_LoadingChange) {
if (eventInfo.showLoading) {
this.pause();
}
else {
this.resume();
}
}
/**
*
@ -34,6 +52,10 @@ export class SpeakingTool {
speakMsg.pitch = 1.5;
window.speechSynthesis.speak(speakMsg);
if (Event_LoadingChange.isLoading) {
this.pause();
}
return speakMsg;
}
}
@ -74,3 +96,6 @@ export class SpeakingTool {
}
}

2
src/app/babylon/view/building-window/building-window.ts

@ -1,5 +1,5 @@
import { AbstractMesh, GizmoManager, Material, Mesh, PBRMaterial, Texture } from "@babylonjs/core";
import { AbstractMesh, Material, Mesh, PBRMaterial, Texture } from "@babylonjs/core";
import { PlanComponent } from "src/app/pages/plan/plan.component";
import { ConfigManager } from "../../controller/config-manager";
import { DataManager } from "../../controller/data-manager";

2
src/app/babylon/view/facilityinfoinscene-window/facilityinfo-ui-item.ts

@ -87,6 +87,7 @@ export class FacilityInfoUIItem {
}
onSelect(select: boolean) {
this.isSelect = select;
this.modelInfo.setSelectEnable(select);
if (select) {
@ -112,6 +113,7 @@ export class FacilityInfoUIItem {
*/
lookAt() {
if (!this.canLookAt()) {
return;
}

11
src/app/babylon/view/mark-window/mark-window.ts

@ -7,9 +7,9 @@ import { DataManager } from "../../controller/data-manager";
import { EventManager } from "../../controller/event-manager/event-manager";
import { Event_GetAllMarkPlanData } from "../../controller/event-manager/events/event-get-markplandata-success";
import { Event_KeyboardInput } from "../../controller/event-manager/events/event-keyboard-input";
import { Event_LoadingChange } from "../../controller/event-manager/events/event-loading-change";
import { Event_MarkInfoChange, MarkInfoChangeType } from "../../controller/event-manager/events/event-mark-info-change";
import { InputController } from "../../controller/inputController";
import { ModeManager } from "../../controller/mode-manager";
import { SceneManager } from "../../controller/scene-manager";
import { BuildingStatus } from "../../controller/status/building-status";
import { IndoorStatus } from "../../controller/status/indoor-status";
@ -237,7 +237,7 @@ export class MarkWindow extends UIBase {
* @param markPlanId idID
* @param nodeId idid
*/
saveToOldNode(markPlanId: number, nodeId: number) {
saveToOldNode(markPlanId: number, nodeId: number, newName?: string) {
let markPlaneData = DataManager.allMarkPlanData.getMarkPlanById(markPlanId);
if (markPlaneData == null) {
console.error("没找到标绘方案:" + markPlanId)
@ -248,7 +248,10 @@ export class MarkWindow extends UIBase {
let copyNodeData = classToClass(this.currentMarkNodeDataCopy);//覆盖数据
copyNodeData.id = oldNodeData.id;
copyNodeData.index = oldNodeData.index;
copyNodeData.name = oldNodeData.name;
if (newName != null) {
copyNodeData.name = newName;
}
// copyNodeData.name = oldNodeData.name;
markPlaneData.setNodeData(nodeId, copyNodeData);//覆盖数据
this.saveAllMarkPlanData();
@ -261,7 +264,7 @@ export class MarkWindow extends UIBase {
*/
createNewNodeAndSave(markPlanId: number, name: string) {
let newNode = this.createMarkNodeData(markPlanId, name);
this.saveToOldNode(markPlanId, newNode.id);
this.saveToOldNode(markPlanId, newNode.id, name);
}

57
src/app/pages/left-domain/left-domain.component.html

@ -2,17 +2,46 @@
<div class="childCenter">
<!-- 基本信息 -->
<div class="publicBox baseInfo" *ngIf="beforeFence === 0">
<div class="publicBox baseInfo" *ngIf="beforeFence === 0 && baseInfo">
<div class="interval">
<p class="title">北京市第十九加油站<button class="titleBotton">自营</button></p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">北京市朝阳区朝外大街关东店33号</p>
<p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">山东省淄博市</p>
<p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">2020.7.26开业</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">4车道</p>
<p class="title">{{baseInfo.stationName || '暂无数据'}}<button class="titleBotton">{{baseInfo.stationType == 0? '自营' : '加盟'}}</button></p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">{{baseInfo.locationName || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">{{baseInfo.openTime | date:"yyyy/MM/dd HH:mm:ss" || '0:00:00'}} 开业</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.laneCount || '0'}} 车道</p>
</div>
<div class="interval">
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.policeStation">
<p class="title">辖区派出所</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.policeStation.distance || '0公里'}}</p>
</div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.hospital">
<p class="title">辖区医院</p>
<p class="text"><img src="../../../assets/images/baseInfo/hospital.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.hospital.distance || '0公里'}}</p>
</div>
<div class="interval" *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.fireBrigade">
<p class="title">辖区消防队</p>
<p class="text"><img src="../../../assets/images/baseInfo/police.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.name || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.address || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/phone.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.contactInformation || '暂无数据'}}</p>
<p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">{{baseInfo.govUnitDetail.fireBrigade.distance || '0公里'}}</p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.businessLicenseImage">
<p class="title">营业执照</p>
<p class="textImage"><img src="../../../assets/images/upload.png"></p>
<p class="textImage"><img [src]="baseInfo.businessLicenseImage"></p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.dangerousChemicalLicenseImage">
<p class="title">危险化学品经营许可证</p>
<p class="textImage"><img [src]="baseInfo.dangerousChemicalLicenseImage"></p>
</div>
<div class="interval baseInfoImg" *ngIf="baseInfo.gasSellLicenseImage">
<p class="title">成品油零售经营许可证</p>
<p class="textImage"><img [src]="baseInfo.gasSellLicenseImage"></p>
</div>
</div>
<!-- 基本信息 -->
@ -97,10 +126,10 @@
<div class="positionRightTop" *ngIf="selectFacilityId === item.getID()"></div><div class="positionRightBottom" *ngIf="selectFacilityId === item.getID()"></div>
<!-- 选中样式 -->
<p class="title"><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().name"></p>
<div class="propertyImage">
<div class="propertyImage" id="pipelineViewer{{item.getID()}}">
<p class="imgTitle" style="margin-top: 0px;">设计图纸</p>
<img src="../../../assets/images/upload.png">
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode"><input type="file"><i nz-icon nzType="plus" nzTheme="outline"></i></a>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img">
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
</div>
</div>
</div>
@ -128,10 +157,10 @@
<p><input type="text" class="tableInput" [disabled]="!editMode" [(ngModel)]="item.getPropertyData().VRUPumpType"></p>
</div>
</div>
<div class="propertyImage">
<div class="propertyImage" id="orvrViewer{{item.getID()}}">
<p class="imgTitle">设计图纸</p>
<img src="../../../assets/images/upload.png">
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode"><input type="file"><i nz-icon nzType="plus" nzTheme="outline"></i></a>
<img [hidden]="!item.getPropertyData().img" [src]="item.getPropertyData().img" [attr.data-original]="item.getPropertyData().img">
<a href="javascript:;" class="bottomPlanUpload uploadImgBox" *ngIf="editMode"><input type="file" accept="image/*" (change)='uploadLeftDomainImg($event, item)'><i nz-icon nzType="plus" nzTheme="outline"></i></a>
</div>
</div>
</div>

3
src/app/pages/left-domain/left-domain.component.scss

@ -45,7 +45,8 @@
}
.baseInfo{ //基本信息
.interval{ margin-top: 10px; border-bottom: 1px solid rgb(197, 226, 245); } //分隔div
.interval{ margin-top: 10px; border-bottom: 1px solid rgb(107, 117, 122); } //分隔div
.baseInfoImg{ border: none; }
p{ height: 20px; line-height: 20px; }
.titleBotton{ background: #2399FF; border-radius: 3px; height: 20px; line-height: 20px; font-size: 12px; margin-left: 5px; padding: 0 5px; border: none; outline: none; }
.text{ font-size: 14px; margin-bottom: 15px; }

91
src/app/pages/left-domain/left-domain.component.ts

@ -1,4 +1,4 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
import { FacilityInfoInSceneWindow } from 'src/app/babylon/view/facilityinfoinscene-window/facilityinfoinscene-window';
import { PlanComponent } from '../plan/plan.component';
@ -11,6 +11,11 @@ import { AllMarkPlanData, MarkNodeData, MarkPlanData } from 'src/app/babylon/mod
import { MarkWindow } from 'src/app/babylon/view/mark-window/mark-window';
import { NzMessageService } from 'ng-zorro-antd/message';
import { ModeManager, ModeType } from 'src/app/babylon/controller/mode-manager';
import { DataManager } from 'src/app/babylon/controller/data-manager';
import { ServeManager } from 'src/app/babylon/controller/serve-manager';
import { ObjectsService } from 'src/app/service/objects.service';
import Viewer from 'viewerjs';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-left-domain',
@ -19,15 +24,10 @@ import { ModeManager, ModeType } from 'src/app/babylon/controller/mode-manager';
})
export class LeftDomainComponent implements OnInit {
constructor(private message: NzMessageService) { }
constructor(private message: NzMessageService, private element: ElementRef, private http: HttpClient) { }
ngOnInit(): void {
let editMode = sessionStorage.getItem('isGasStation')
if (editMode == 'false') {
this.editMode = true
} else {
this.editMode = false
}
this.editMode = PlanComponent.instance.editMode
this.initComponent()
}
@ -35,6 +35,7 @@ export class LeftDomainComponent implements OnInit {
beforeFence: number; //当前选中功能栏
FacilityList: FacilityInfoUIItem[] = []; //统计设备 list
selectFacilityId: string = null; //选中设备 ID
baseInfo: any; //基本信息
//初始化组件
initComponent(type?: number) {
@ -49,13 +50,22 @@ export class LeftDomainComponent implements OnInit {
//处理 设备data
handleFacility() {
if (this.beforeFence === 0) { //基本信息
if (!this.baseInfo) {
let params = { organizationUnitId: PlanComponent.instance.companyData.id }
this.http.get('/api/services/app/GasStation/Get', { params: params }).subscribe((data: any)=>{
data.result.govUnitDetail? data.result.govUnitDetail = JSON.parse(data.result.govUnitDetail) : null
this.baseInfo = data.result
})
}
return
}
if (this.beforeFence === 7) { //应急预案
MarkWindow.instance ? this.allMarkPlanData = MarkWindow.instance.allMarkPlanData : null
EventManager.addListener(Event_GetAllMarkPlanData, (data: Event_GetAllMarkPlanData) => {
this.allMarkPlanData = data.data
PlanComponent.instance.allMarkPlanData = this.allMarkPlanData
})
PlanComponent.instance.allMarkPlanData = this.allMarkPlanData
this.selectPlanId = null
this.selectNodeId = null
if (MarkWindow.instance) {
this.allMarkPlanData = MarkWindow.instance.allMarkPlanData
}
return
}
let list: FacilityInfoUIItem[] = []
@ -76,6 +86,15 @@ export class LeftDomainComponent implements OnInit {
this.selectFacilityId = null
if (this.beforeFence === 3) { //消防设施
this.handleTreeData(this.FacilityList)
} else if (this.beforeFence === 5 || this.beforeFence === 6) { //初始化 Viewer
let id: string = this.beforeFence === 5? "pipelineViewer" : "orvrViewer"
this.FacilityList.forEach(item=>{
if (item.getPropertyData() && item.getPropertyData().img) {
window.setTimeout(() => {
new Viewer(this.element.nativeElement.querySelector(`#${id}${item.getID()}`), { url: 'data-original' });
}, 0)
}
})
}
}
@ -90,6 +109,36 @@ export class LeftDomainComponent implements OnInit {
}
}
//上传设备 图片
uploadLeftDomainImg(e, item: FacilityInfoUIItem) {
if (e.target.files.length) {
let maxSize = 30 * 1024 * 1024 //限制30MB
let file = e.target.files[0]
if (file.size > maxSize) { //超出限制
this.message.info("上传资源需小于30MB");
return
}
PlanComponent.instance.isShowLoading = true //打开遮罩
let institutionKey = sessionStorage.getItem('unitId') || "ceshi"; //单位id
let buildingKey = PlanComponent.instance.buildingUIItems.find(item => { return item.getBuildingID() == PlanComponent.instance.beforeOneBuildingID })
let url = DataManager.getResPath_facilityProperty(institutionKey, buildingKey.getBuildingID(), item.getType(), item.getID(), null)
ServeManager.instance.openFileSelect(file, url, (name: string, path: string) => { //上传
item.getPropertyData().img = ObjectsService.getFullPath(path + name)
if (this.beforeFence === 5) {
window.setTimeout(() => {
new Viewer(this.element.nativeElement.querySelector(`#pipelineViewer${item.getID()}`), { url: 'data-original' });
}, 0)
} else if (this.beforeFence === 6) {
window.setTimeout(() => {
new Viewer(this.element.nativeElement.querySelector(`#orvrViewer${item.getID()}`), { url: 'data-original' });
}, 0)
}
PlanComponent.instance.isShowLoading = false //关闭遮罩
this.message.info("上传成功!");
})
}
}
@ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;
treeData: NzTreeNodeOptions[] = []; //tree data
@ -210,31 +259,33 @@ export class LeftDomainComponent implements OnInit {
//选中 数据节点
selectNode(item: MarkPlanData, e: MarkNodeData, index: number) {
if (this.selectPlanId != item.id || this.selectNodeId != e.id) { //选中
this.selectPlanId = item.id
this.selectNodeId = e.id
PlanComponent.instance.beforeEmergencyPlan = item
PlanComponent.instance.beforePlanNode = e
if (PlanComponent.instance.progressList.length != item.nodes.length) {
PlanComponent.instance.updateProgressList()
}
this.updateFatherData(index) //更新/初始化父组件 数据
this.selectPlanId = item.id
this.selectNodeId = e.id
PlanComponent.instance.initViewer()
MarkWindow.instance.selectMarkNode(item.id, e.id)
PlanComponent.instance.beforeEmergencyPlan = item
PlanComponent.instance.beforePlanNode = MarkWindow.instance.currentMarkNodeInfo.nodeData
} else if (this.selectPlanId === item.id && this.selectNodeId === e.id) { //取消选中
this.selectPlanId = null
this.selectNodeId = null
PlanComponent.instance.beforeEmergencyPlan = new MarkPlanData(-99, "请选择节点")
PlanComponent.instance.beforePlanNode = new MarkNodeData(-99, "请选择节点")
this.updateFatherData(index) //更新/初始化父组件 数据
this.selectPlanId = null
this.selectNodeId = null
MarkWindow.instance.selectMarkNode(null, null)
}
}
//更新/初始化父组件 数据
updateFatherData(index) {
PlanComponent.instance.updateTimer? window.clearTimeout(PlanComponent.instance.updateTimer) : null //清除定时器
PlanComponent.instance.progressList.forEach((item,key)=>{ key >= index? PlanComponent.instance.progressList[key] = 0 : PlanComponent.instance.progressList[key] = 100 })
PlanComponent.instance.nzCurrent = index
PlanComponent.instance.isSuspend = true //暂停
PlanComponent.instance.updateTimer? window.clearTimeout(PlanComponent.instance.updateTimer) : null //清除定时器
}
saveDisposalDialog: boolean = false; //整体保存预案 弹窗

29
src/app/pages/plan/plan.component.html

@ -7,10 +7,7 @@
</button>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu class="dropDown">
<li nz-menu-item><label nz-checkbox>毗邻</label></li>
<li nz-menu-item><label nz-checkbox>区域</label></li>
<li nz-menu-item><label nz-checkbox>图片</label></li>
<li nz-menu-item><label nz-checkbox>点位</label></li>
<li nz-menu-item *ngFor="let item of baseInfoMarks"><label nz-checkbox [(ngModel)]="item.isShow" [nzDisabled]="selectFence != 0" (ngModelChange)="toggleBaseInfoMark($event, item)">{{item.markerName}}</label></li>
</ul>
</nz-dropdown-menu>
<div class="rightFence">
@ -26,7 +23,7 @@
<canvas id="center"></canvas>
<!-- 左侧子组件 -->
<div class="leftChildComponent" *ngIf="editMode && isShowChildComponent && selectFence != 4" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }" [ngClass]="{'publicMoveUp': selectFence === 7}">
<div class="leftChildComponent" *ngIf="isShowChildComponent && selectFence != 4" [ngStyle]="{ 'left': isShowLeftBuilding && editMode && userMode? '15%' : null }" [ngClass]="{'publicMoveUp': selectFence === 7}">
<div class="leftChildHeader">
<div><i nz-icon nzType="star" nzTheme="outline"></i></div>
<div>{{allFence[selectFence]}}<i nz-icon nzType="plus-circle" nzTheme="outline" *ngIf="selectFence === 7 && editMode" (click)="noticeChildComponent(true)"></i><i nz-icon nzType="save" nzTheme="outline" *ngIf="selectFence === 7 && editMode" (click)="noticeChildComponent(false)"></i></div>
@ -62,12 +59,12 @@
<div class="natureHeader"><i nz-icon nzType="close-circle" nzTheme="outline" title="关闭" (click)="isShowNature = false;"></i></div>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().info != undefined">
<div class="natureTitle">详情</div>
<div><textarea [(ngModel)]="beforeOnePropertyData.getPropertyData().info"></textarea></div>
<div><textarea [(ngModel)]="beforeOnePropertyData.getPropertyData().info" [disabled]="!editMode"></textarea></div>
</div>
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().img != undefined">
<div class="natureContent" *ngIf="beforeOnePropertyData.getPropertyData().img != undefined" id="propertyImg">
<div class="natureTitle">图片</div>
<div class="natureImg" *ngIf="beforeOnePropertyData.getPropertyData().img"><img [src]="beforeOnePropertyData.getPropertyData().img"></div>
<div><a href="javascript:;" class="bottomPlanUpload natureUpload"><input type="file"><i nz-icon nzType="plus" nzTheme="outline"></i></a></div>
<div class="natureImg" *ngIf="beforeOnePropertyData.getPropertyData().img"><img [src]="beforeOnePropertyData.getPropertyData().img" [attr.data-original]="beforeOnePropertyData.getPropertyData().img"></div>
<div *ngIf="editMode"><a href="javascript:;" class="bottomPlanUpload natureUpload"><input type="file" accept="image/*" (change)='uploadPropertyImg($event)'><i nz-icon nzType="plus" nzTheme="outline"></i></a></div>
</div>
</div>
<div class="nature natureLook" *ngIf="isShowNature && (selectFence === 1 || selectFence === 2) && beforeOnePropertyData" [ngStyle]="{'top': naturePosition.top,'right': naturePosition.right}">
@ -146,8 +143,16 @@
<p><input type="text" [(ngModel)]="beforePlanNode.name" [disabled]="!editMode"></p>
<textarea [(ngModel)]="beforePlanNode.describe" [disabled]="!editMode"></textarea>
</div>
<div class="planHeaderImg"><a href="javascript:;" class="bottomPlanUpload"><input type="file"><img src="../../../assets/images/uploadImg.png"></a></div>
<div class="planHeaderVideo"><a href="javascript:;" class="bottomPlanUpload" style="width: 100px;"><input type="file"><img src="../../../assets/images/uploadVideo.png"></a></div>
<div class="planHeaderImg" id="planNodeImg">
<img class="imgSrc" [src]="beforePlanNode.texture" [hidden]="!beforePlanNode.texture" [attr.data-original]="beforePlanNode.texture">
<a href="javascript:;" class="imgAndVideoUpload uploadImage" *ngIf="editMode && beforePlanNode.texture"><input type="file" accept="image/*" (change)='uploadImgVideo($event, false)'><i nz-icon nzType="border-inner" nzTheme="outline"></i></a>
<a href="javascript:;" class="bottomPlanUpload" *ngIf="editMode && !beforePlanNode.texture"><input type="file" accept="image/*" (change)='uploadImgVideo($event, false)'><img src="../../../assets/images/uploadImg.png"></a>
</div>
<div class="planHeaderVideo">
<video [src]="beforePlanNode.video" [hidden]="!beforePlanNode.video" (click)="openVideo(beforePlanNode.video)"></video>
<a href="javascript:;" class="imgAndVideoUpload uploadVideo" *ngIf="editMode && beforePlanNode.video"><input type="file" accept="video/*" (change)='uploadImgVideo($event, true)'><i nz-icon nzType="border-inner" nzTheme="outline"></i></a>
<a href="javascript:;" class="bottomPlanUpload" style="width: 100px;" *ngIf="editMode && !beforePlanNode.video"><input type="file" accept="video/*" (change)='uploadImgVideo($event, true)'><img src="../../../assets/images/uploadVideo.png"></a>
</div>
</div>
<div style="height: 5px;"></div>
<div class="pulicPlanDiv bottomPlanCenter">
@ -235,7 +240,7 @@
<!-- 应急预案设备任务弹窗 -->
<!-- 全景图/视频弹窗 -->
<nz-modal nzClassName="videoDialog" [(nzVisible)]="videoDialogType.url" nzFooter="null" (nzOnCancel)="videoDialogType.url = null;" nzWidth="90%">
<video [src]="videoDialogType.url" style="width: 100%; height: 100%;" [hidden]="!videoDialogType.isVideo"></video>
<video [src]="videoDialogType.url" controls="controls" autoplay style="width: 100%; height: 100%;" [hidden]="!videoDialogType.isVideo"></video>
<canvas id="panorama" [hidden]="videoDialogType.isVideo"></canvas>
</nz-modal>
<!-- 全景图/视频弹窗 -->

8
src/app/pages/plan/plan.component.scss

@ -195,7 +195,7 @@
margin-bottom: 5px;
.natureTitle{ margin-bottom: 5px; height: 20px; line-height: 20px; }
textarea{ width: 100%; height: 75px; background: rgba(145, 204, 255, 0.41); border: 1px solid #91CCFF; padding: 0; resize: none; outline: none; }
.natureImg{ margin-bottom: 5px; img{ width: auto; height: auto; max-width: 100%; } }
.natureImg{ margin-bottom: 5px; img{ width: auto; height: auto; max-height: 120px; } }
.natureUpload{ margin: 0; text-align: center; width: 50px; height: 50px; line-height: 50px; }
}
}
@ -335,8 +335,10 @@
input{ border: none; outline: none; background-color: transparent; width: 100%; height: 100%; }
textarea{ width: 100%; height: 50px; background: rgba(145, 204, 255, 0.41); border: 1px solid #91CCFF; padding: 0; resize: none; outline: none; }
}
.planHeaderImg{ width: 100px; height: 100%; text-align: center; }
.planHeaderVideo{ width: 120px; height: 100%; text-align: center; }
.planHeaderImg{ width: 140px; height: 100%; text-align: center; line-height: 80px; .imgSrc{ width: 100px; height: auto; max-height: 100%; } }
.uploadImage{ width: 20px; height: 20px; line-height: 20px; float: right; margin-top: 30px; }
.planHeaderVideo{ width: 180px; height: 100%; text-align: center; line-height: 80px; video{ width: 120px; height: auto; max-height: 100%; } }
.uploadVideo{ width: 30px; height: 30px; line-height: 30px; float: right; margin-top: 25px; }
}
.bottomPlanCenter{
height: 35px;

165
src/app/pages/plan/plan.component.ts

@ -1,4 +1,5 @@
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import Viewer from 'viewerjs';
import { Game } from 'src/app/babylon/game';
import { LoginSatus } from 'src/app/babylon/controller/status/login-status';
import { StatusManager } from 'src/app/babylon/controller/status/status-manager';
@ -23,6 +24,11 @@ import { AllMarkData } from 'src/app/babylon/model/data/mark/all-mark-data';
import { MarkData, MarkTask } from 'src/app/babylon/model/data/mark/mark-data';
import { MarkWindow } from 'src/app/babylon/view/mark-window/mark-window';
import { AllMarkPlanData, MarkNodeData, MarkPlanData } from 'src/app/babylon/model/data/mark/mark-plan-data';
import { DataManager, ResType } from 'src/app/babylon/controller/data-manager';
import { EventManager as babylonEventManager } from 'src/app/babylon/controller/event-manager/event-manager';
import { Event_GetAllMarkPlanData } from 'src/app/babylon/controller/event-manager/events/event-get-markplandata-success';
import { FacilityInfoInSceneWindow } from 'src/app/babylon/view/facilityinfoinscene-window/facilityinfoinscene-window';
import { FacilityType } from 'src/app/babylon/model/data/model-data/model-data-facility';
@ -41,13 +47,16 @@ export class PlanComponent implements OnInit {
public canvas: HTMLCanvasElement; //canvas 实例
public editMode: boolean = true; //编辑/查看 模式
public userMode: boolean = ModeManager.s_isMakeMode; //是否为 内部权限
public bucketName: string = ObjectsService.getFullPath("文件路径"); //当前桶名
public isShowLoading: boolean = true; //显隐 loading加载条
public companyData: any; //当前加油站 信息
ngOnInit(): void {
PlanComponent.instance = this;
ServeManager.Init(this.buildingBISrv, this.objectsSrv);
this.canvas = this.element.nativeElement.querySelector('#center') as HTMLCanvasElement;
this.game.init(this.canvas);
this.companyData = (JSON.parse(sessionStorage.getItem('userdataOfgasstation'))).organization || {}
let editMode = sessionStorage.getItem('isGasStation')
if (editMode == 'false') {
this.editMode = true
@ -70,9 +79,9 @@ export class PlanComponent implements OnInit {
ngAfterViewInit(): void {
let simpleData: InsitutionDataSimple = new InsitutionDataSimple();
simpleData.id = 1; //来自选中的单位的信息 ,测试:1
simpleData.key = "ceshi"; //正式: id.tostring(),测试:"ceshi"
simpleData.name = "测试"; //来自选中的单位的信息 ,测试:"测试"
simpleData.id = 1; //来自选中的单位的信息 ,测试:1
simpleData.key = "ceshi"; //正式: id.tostring(),测试:"ceshi"
simpleData.name = this.companyData.displayName || "测试"; //来自选中的单位的信息 ,测试:"测试"
let has3dData = true;//是否有三维数据,来自选中单位的信息
let loginStatus = StatusManager.getStatus<LoginSatus>(LoginSatus);
@ -85,8 +94,8 @@ export class PlanComponent implements OnInit {
{
let isAdd = confirm('没有单位' + simpleData.key + ',是否进行初始化?')
if (isAdd) {
let name = simpleData.key;
let id = 2;// 单位id
let name = simpleData.name;
let id = simpleData.id;// 单位id
loginStatus.createInsitution(simpleData.key, name, id);
}
}
@ -117,6 +126,7 @@ export class PlanComponent implements OnInit {
modelInit(InsList) { }
allFence: string[] = ["基本信息", "加油机", "油罐设备", "消防设施", "安全疏散", "输油管线", "油气回收", "应急预案"]; //头部 功能栏
baseInfoMarks: baseInfoMark[] = [new baseInfoMark("毗邻"), new baseInfoMark("区域"), new baseInfoMark("图片"), new baseInfoMark("点位")] //基本信息 设备筛选list
selectFence: number = -1; //选中 头部功能栏
isShowChildComponent: boolean = false; //是否 显示左侧子组件
@ViewChild('leftDomain') leftDomain: LeftDomainComponent; //子组件引用
@ -133,10 +143,24 @@ export class PlanComponent implements OnInit {
if (this.selectFence === 7) { //初始化 应急预案模块
this.initializePlan()
}
this.isShowChildComponent && this.leftDomain && type != 4 ? this.leftDomain.initComponent(type) : null; //手动初始化子组件
this.selectFence = type
this.isShowChildComponent = true
buildingWindow.changeJYZInfoModel(fenceType, true)
if (type === 7) { //初始化 应急预案 data
this.isShowChildComponent && this.leftDomain? this.leftDomain.initComponent(type) : null; //手动初始化子组件
this.selectFence = type
this.editMode? this.isShowChildComponent = true : this.isShowChildComponent = false
buildingWindow.changeJYZInfoModel(fenceType, true)
MarkWindow.instance ? this.allMarkPlanData = MarkWindow.instance.allMarkPlanData : null;
babylonEventManager.addListener(Event_GetAllMarkPlanData, (data: Event_GetAllMarkPlanData) => {
this.allMarkPlanData = MarkWindow.instance.allMarkPlanData
this.isShowChildComponent && this.leftDomain? this.leftDomain.allMarkPlanData = MarkWindow.instance.allMarkPlanData : null
})
this.isShowChildComponent && this.leftDomain? this.leftDomain.allMarkPlanData = MarkWindow.instance.allMarkPlanData : null
} else {
this.isShowChildComponent && this.leftDomain && type != 4 ? this.leftDomain.initComponent(type) : null; //手动初始化子组件
this.selectFence = type
this.isShowChildComponent = true
buildingWindow.changeJYZInfoModel(fenceType, true)
if (type === 0) { this.baseInfoMarks.forEach(item=>{ item.isShow = true }) } //初始化基本信息 设备显隐
}
} else { //取消选中
this.selectFence = -1
this.isShowChildComponent = false
@ -170,6 +194,21 @@ export class PlanComponent implements OnInit {
return fenceType
}
//基本信息 设备筛选显隐
toggleBaseInfoMark(event, item: baseInfoMark) {
let type
if (item.markerName === "毗邻") {
type = FacilityType.PL
} else if (item.markerName === "区域") {
type = FacilityType.QY
} else if (item.markerName === "图片") {
type = FacilityType.TPBZ
} else if (item.markerName === "点位") {
type = FacilityType.DWBZ
}
FacilityInfoInSceneWindow.instance.showFacilityByType(type, event)
}
//子组件 创建预案/保存
noticeChildComponent(type: boolean) {
if (this.isShowChildComponent && this.leftDomain) {
@ -321,6 +360,7 @@ export class PlanComponent implements OnInit {
isShowNature: boolean = false; //显隐设备 属性栏
beforeOnePropertyData: FacilityInfoUIItem = null; //当前选择 设备
propertyImg: Viewer; //设备图标Viewer 实例
naturePosition: naturePosition = new naturePosition(); //设备栏 定位位置
//选中 设备
@ -331,6 +371,36 @@ export class PlanComponent implements OnInit {
if (this.isShowChildComponent && this.leftDomain) {
this.leftDomain.selectFacilityId = e.getID()
}
if (this.selectFence === 0 && this.beforeOnePropertyData.getPropertyData() && this.beforeOnePropertyData.getPropertyData().img) { //img
window.setTimeout(() => {
this.propertyImg = new Viewer(this.element.nativeElement.querySelector('#propertyImg'), { url: 'data-original' });
}, 0)
}
}
//上传设备 图片
uploadPropertyImg(e) {
if (e.target.files.length) {
let maxSize = 30 * 1024 * 1024 //限制30MB
let file = e.target.files[0]
if (file.size > maxSize) { //超出限制
this.message.info("上传资源需小于30MB");
return
}
this.isShowLoading = true //打开遮罩
let institutionKey = sessionStorage.getItem('unitId') || "ceshi"; //单位id
let buildingKey = this.buildingUIItems.find(item => { return item.getBuildingID() == this.beforeOneBuildingID })
let facility = this.beforeOnePropertyData
let url = DataManager.getResPath_facilityProperty(institutionKey, buildingKey.getBuildingID(), facility.getType(), facility.getID(), null)
ServeManager.instance.openFileSelect(file, url, (name: string, path: string) => { //上传
this.beforeOnePropertyData.getPropertyData().img = ObjectsService.getFullPath(path + name)
window.setTimeout(() => {
this.propertyImg = new Viewer(this.element.nativeElement.querySelector('#propertyImg'), { url: 'data-original' });
}, 0)
this.isShowLoading = false //关闭遮罩
this.message.info("上传成功!");
})
}
}
allMarkPlanData: AllMarkPlanData; //处置预案节点 数据
@ -354,10 +424,11 @@ export class PlanComponent implements OnInit {
publicToggleNode() {
return new Promise((resolve, reject) => {
this.beforePlanNode = this.beforeEmergencyPlan.nodes[this.nzCurrent]
this.isShowChildComponent && this.leftDomain ? this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id : null
this.isShowChildComponent && this.leftDomain ? this.leftDomain.selectNodeId = this.beforePlanNode.id : null
this.isShowChildComponent && this.leftDomain? this.leftDomain.selectPlanId = this.beforeEmergencyPlan.id : null
this.isShowChildComponent && this.leftDomain? this.leftDomain.selectNodeId = this.beforePlanNode.id : null
MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id, false, true)
this.beforePlanNode = MarkWindow.instance.currentMarkNodeInfo.nodeData
this.initViewer()
this.updateProgress() //更新进度条
resolve(true)
})
@ -365,17 +436,15 @@ export class PlanComponent implements OnInit {
//选中 底部一级节点 开启自动播放
selectChildNode(item: MarkPlanData) {
if (this.isShowChildComponent && this.leftDomain) {
if (item.nodes.length) {
this.updateTimer ? window.clearTimeout(this.updateTimer) : null //清除定时器
this.nzCurrent = 0
this.beforeEmergencyPlan = item
this.updateProgressList().then(res => {
this.publicToggleNode()
})
} else {
this.message.info('暂无数据节点');
}
if (item.nodes.length) {
this.updateTimer ? window.clearTimeout(this.updateTimer) : null //清除定时器
this.nzCurrent = 0
this.beforeEmergencyPlan = item
this.updateProgressList().then(res => {
this.publicToggleNode()
})
} else {
this.message.info('暂无数据节点');
}
}
@ -461,6 +530,7 @@ export class PlanComponent implements OnInit {
} else { //开启
this.updateTimer ? window.clearTimeout(this.updateTimer) : null //清除定时器
this.progressList.forEach((item, index) => { index > this.nzCurrent ? this.progressList[index] = 0 : null })
if (this.progressList[this.nzCurrent] === 0) { MarkWindow.instance.selectMarkNode(this.beforeEmergencyPlan.id, this.beforePlanNode.id, false, true) }
this.updateProgress()
}
}
@ -543,6 +613,49 @@ export class PlanComponent implements OnInit {
}
videoDialogType: videoDialog = new videoDialog(true, null); //全景图/视频 弹窗
planNodeImg: Viewer; //应急预案图片Viewer 实例
//初始化 Viewer图片
initViewer() {
if (this.beforePlanNode.texture) {
window.setTimeout(() => {
this.planNodeImg = new Viewer(this.element.nativeElement.querySelector('#planNodeImg'), { url: 'data-original' });
}, 0)
}
}
//上传 图片/视频
uploadImgVideo(e, isVideo: boolean) {
if (e.target.files.length) {
let maxSize = 30 * 1024 * 1024 //限制30MB
let file = e.target.files[0]
if (file.size > maxSize) { //超出限制
this.message.info("上传资源需小于30MB");
return
}
this.isShowLoading = true //打开遮罩
let institutionKey = sessionStorage.getItem('unitId') || "ceshi"; //单位id
let resType = isVideo? ResType.Video : ResType.Texture
let key = `${(new Date()).getMonth() + 1}-${(new Date()).getDate()}-${(new Date()).getHours()}`
let url = DataManager.getResPath_mark(institutionKey, resType, key) //url
ServeManager.instance.openFileSelect(file, url, (name: string, path: string) => { //上传
if (!isVideo) { //img
this.beforePlanNode.texture = ObjectsService.getFullPath(path + name)
this.initViewer()
} else { //video
this.beforePlanNode.video = ObjectsService.getFullPath(path + name)
}
this.isShowLoading = false //关闭遮罩
this.message.info("上传成功!");
})
}
}
//打开视频弹窗
openVideo(src: string) {
this.videoDialogType.isVideo = true
this.videoDialogType.url = src
}
selectRightTopFast: number = 0; //当前选择功能 快捷栏
selectAdsorb: boolean = false; //吸附状态
@ -693,3 +806,11 @@ export class modelBuilding {
name: string = "";
modelType: BuildingType = BuildingType.Normal;
}
//基本信息 设备筛选
export class baseInfoMark{
markerName: string;
isShow: boolean = true;
constructor(markerName: string) {
this.markerName = markerName
}
}

10
src/app/pages/plan/publicPop.scss

@ -26,7 +26,15 @@
overflow: hidden;
display: inline-block;
}
.uploadBackGround input,.bottomPlanUpload input {
.imgAndVideoUpload{
position: relative;
cursor: pointer;
background: rgba(145, 204, 255, 0.41);
border: 1px dashed #91CCFF;
overflow: hidden;
display: inline-block;
}
.uploadBackGround input,.bottomPlanUpload input,.imgAndVideoUpload input {
position: absolute;
width: 100%;
height: 100%;

1
src/app/service/objects.service.ts

@ -68,6 +68,7 @@ export class ObjectsService {
*
*/
getBucketName() {
return this.obsRootByEnv.get(ObjectsService.currentEnvironmentType);
}

9
tsconfig.json

@ -31,8 +31,9 @@
"strictInjectionParameters": true,
"enableIvy": false
},
// "include": [
// "src/**/*.d.ts",
// "typings.d.ts"
// ]
"include": [
"src/**/*.d.ts",
"src/**/*.ts",
"typings.d.ts"
]
}

Loading…
Cancel
Save