|
|
|
import { Component, OnInit, Inject, ViewChild,ElementRef,Renderer2 } from '@angular/core';
|
|
|
|
import { HttpClient, HttpHeaders } from '@angular/common/http';
|
|
|
|
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
|
|
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
|
|
|
|
import {leftFunctionalDomainComponent,editPlaneFigureComponent} from './leftFunctionalDomain'
|
|
|
|
import Swiper from 'swiper';
|
|
|
|
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
|
|
|
|
import {FlatTreeControl} from '@angular/cdk/tree';
|
|
|
|
import {WorkingAreaComponent} from '../../working-area/working-area.component'
|
|
|
|
import {CanvasShareDataService} from '../../canvas-share-data.service' //引入服务
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-collection-tools',
|
|
|
|
templateUrl: './collection-tools.component.html',
|
|
|
|
styleUrls: ['./collection-tools.component.scss']
|
|
|
|
})
|
|
|
|
export class CollectionToolsComponent implements OnInit {
|
|
|
|
|
|
|
|
@ViewChild('canvas') canvas:WorkingAreaComponent; //父组件中获得子组件的引用
|
|
|
|
|
|
|
|
constructor(private http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private element: ElementRef,public canvasData: CanvasShareDataService) { }
|
|
|
|
// tree配置
|
|
|
|
private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数
|
|
|
|
return {
|
|
|
|
expandable: !!node.children && node.children.length > 0,
|
|
|
|
name: node.name || node.Name,
|
|
|
|
level: level,
|
|
|
|
id: node.id || node.Id,
|
|
|
|
children:node.children,
|
|
|
|
isTemplate:node.isTemplate,
|
|
|
|
isNewElement:node.isNewElement,
|
|
|
|
isLook:node.isLook,
|
|
|
|
node:node
|
|
|
|
};
|
|
|
|
}
|
|
|
|
treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable);
|
|
|
|
|
|
|
|
treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children);
|
|
|
|
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
|
|
|
|
hasChild = (_: number, node: any) => node.expandable;
|
|
|
|
|
|
|
|
|
|
|
|
selected = 'option1' //图标大小选择框
|
|
|
|
basicInfo:boolean = true //基本信息名称显隐
|
|
|
|
wantToWork:boolean = true //想定作业名称显隐
|
|
|
|
allBuildings //该单位所有建筑
|
|
|
|
beforeOneCheckedBuilding:any = {name:"总平面图"}; //当前点击选择的建筑
|
|
|
|
checkedBuildingIndex:number = -1 //当前点击选择的建筑index
|
|
|
|
isEditPat:boolean = true //当前是否是编辑模式
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
proObject = {
|
|
|
|
"Id": "6856647621407145995",
|
|
|
|
"Name": "实景照片",
|
|
|
|
"Angle": 104.0,
|
|
|
|
"Color": "#FFFFFFFF",
|
|
|
|
"Point": {
|
|
|
|
"x": -45.2675133,
|
|
|
|
"y": 26.3694324
|
|
|
|
},
|
|
|
|
"Width": 66,
|
|
|
|
"Border": {
|
|
|
|
"w": 0.0,
|
|
|
|
"x": 0.0,
|
|
|
|
"y": 0.0,
|
|
|
|
"z": 0.0
|
|
|
|
},
|
|
|
|
"Height": 66,
|
|
|
|
"Enabled": true,
|
|
|
|
"FloorId": "5e902b399f45957cf4387616",
|
|
|
|
"DrawMode": 0,
|
|
|
|
"FillMode": 1,
|
|
|
|
"GameMode": 0,
|
|
|
|
"ImageUrl": "/api/Objects/PlanPlatform/5e7c13e9bb3cf106508afafc.png",
|
|
|
|
"CompanyId": null,
|
|
|
|
"FixedSize": true,
|
|
|
|
"FloorName": null,
|
|
|
|
"Thickness": 0,
|
|
|
|
"BuildingId": null,
|
|
|
|
"MultiPoint": null,
|
|
|
|
"TemplateId": "5e7c13ef61550e2754d461c8",
|
|
|
|
"FireElementId": "5e796f040814180f1c1ecaf5",
|
|
|
|
"PropertyInfos": [{
|
|
|
|
"Tag": "",
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": true,
|
|
|
|
"Visible": true,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": "",
|
|
|
|
"RuleValue": "",
|
|
|
|
"PhysicalUnit": "",
|
|
|
|
"PropertyName": "单行文本",
|
|
|
|
"PropertyType": 0,
|
|
|
|
"PropertyValue": "99999"
|
|
|
|
},{
|
|
|
|
"Tag": "",
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": true,
|
|
|
|
"Visible": true,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": "",
|
|
|
|
"RuleValue": "",
|
|
|
|
"PhysicalUnit": "",
|
|
|
|
"PropertyName": "多行文本",
|
|
|
|
"PropertyType": 1,
|
|
|
|
"PropertyValue": "99999"
|
|
|
|
},{
|
|
|
|
"Tag": "",
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": true,
|
|
|
|
"Visible": true,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": "",
|
|
|
|
"RuleValue": "",
|
|
|
|
"PhysicalUnit": "",
|
|
|
|
"PropertyName": "数值",
|
|
|
|
"PropertyType": 2,
|
|
|
|
"PropertyValue": "666"
|
|
|
|
}, {
|
|
|
|
"Tag": "",
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": true,
|
|
|
|
"Visible": true,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": "",
|
|
|
|
"RuleValue": "",
|
|
|
|
"PhysicalUnit": "张",
|
|
|
|
"PropertyName": "布尔值",
|
|
|
|
"PropertyType": 6,
|
|
|
|
"PropertyValue": "1"
|
|
|
|
}, {
|
|
|
|
"Tag": "",
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": true,
|
|
|
|
"Visible": true,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": "",
|
|
|
|
"RuleValue": "",
|
|
|
|
"PhysicalUnit": "张",
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 4,
|
|
|
|
"PropertyValue": "5"
|
|
|
|
}, {
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 3,
|
|
|
|
"PropertyValue": "/api/Objects/WebPlan2D/5e8ed394aaca5f7c102530ad/5f27b4c15ba53b1bc0ae312e.png"
|
|
|
|
}, {
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 3,
|
|
|
|
"PropertyValue": "/api/Objects/PlanPlatform/5e7c0ff1bb3cf106508afaed.png"
|
|
|
|
}, {
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 3,
|
|
|
|
"PropertyValue": "/api/Objects/PlanPlatform/5e7abccbefc8471c94ff19ff.png"
|
|
|
|
}, {
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 3,
|
|
|
|
"PropertyValue": "/api/Objects/PlanPlatform/5e7d68e5e72823213c55e4cf.png"
|
|
|
|
},{
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "方向",
|
|
|
|
"PropertyType": 5,
|
|
|
|
"PropertyValue": "4"
|
|
|
|
},{
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "供给区域",
|
|
|
|
"PropertyType": 7,
|
|
|
|
"PropertyValue": "4"
|
|
|
|
},{
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "供给类型",
|
|
|
|
"PropertyType": 8,
|
|
|
|
"PropertyValue": "4"
|
|
|
|
}],
|
|
|
|
"IsFromBuilding": false,
|
|
|
|
"InteractiveMode": 0
|
|
|
|
}
|
|
|
|
assetName:String//素材名称
|
|
|
|
assetWidth:number//素材宽度
|
|
|
|
assetHeight:number//素材高度
|
|
|
|
sliderValue:number = 0//滑竿的值
|
|
|
|
isHighLight:boolean = false//是否高亮选择框
|
|
|
|
PropertyInfos = [] //去除图片链接真正用于循环的内容
|
|
|
|
imagesArrNum //素材属性图片数量上限
|
|
|
|
imagesArr = [] //属性中的图片链接集合
|
|
|
|
clickedIndex //点击图片时的索引值
|
|
|
|
|
|
|
|
//传入素材对象,设置右侧属性栏内容
|
|
|
|
canvasAssetObj //传入的素材属性对象
|
|
|
|
isImgNumCss = false //控制上传文件input显隐
|
|
|
|
mySwiper:any //轮播图实例
|
|
|
|
setAssetsProperty(obj){
|
|
|
|
this.isShowAttribute = false
|
|
|
|
let _this = this
|
|
|
|
this.imagesArr = []
|
|
|
|
this.imagesArrNum = ""
|
|
|
|
|
|
|
|
this.canvasAssetObj = obj //将选中素材对象存到本地变量
|
|
|
|
|
|
|
|
this.assetName = obj.Name
|
|
|
|
this.assetWidth = obj.Width
|
|
|
|
this.assetHeight = obj.Height
|
|
|
|
this.sliderValue = obj.Angle
|
|
|
|
|
|
|
|
this.PropertyInfos = obj.PropertyInfos
|
|
|
|
|
|
|
|
this.PropertyInfos.forEach(item => {
|
|
|
|
if(item.PropertyType == 3){ //如果是图片链接类型
|
|
|
|
this.imagesArr.push(item)
|
|
|
|
}
|
|
|
|
if(item.PropertyType == 4){//图片数值上线
|
|
|
|
this.imagesArrNum = item.PropertyValue
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
//如果存在图片则加载轮播图
|
|
|
|
if(this.imagesArr.length){
|
|
|
|
setTimeout(() => {
|
|
|
|
this.mySwiper = new Swiper('.swiper-container',{
|
|
|
|
loop: false,
|
|
|
|
// grabCursor: true,
|
|
|
|
// 如果需要前进后退按钮
|
|
|
|
navigation: {
|
|
|
|
nextEl: '.swiper-button-next',
|
|
|
|
prevEl: '.swiper-button-prev',
|
|
|
|
},
|
|
|
|
on:{
|
|
|
|
click: function(){
|
|
|
|
_this.clickedIndex = this.clickedIndex
|
|
|
|
},
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}, 0);
|
|
|
|
}
|
|
|
|
//判断此时图片数量是否达到上限
|
|
|
|
if(this.imagesArr.length < this.imagesArrNum){//如果不超出
|
|
|
|
this.isImgNumCss = true
|
|
|
|
}else{
|
|
|
|
this.isImgNumCss = false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
//右侧div边框宽度调节
|
|
|
|
rightDivMouseDown(e){
|
|
|
|
document.onmousemove = (ev) => {
|
|
|
|
let bodyWidth = document.body.clientWidth //网页宽度
|
|
|
|
let maxWidth = bodyWidth - 240 - this.element.nativeElement.querySelector('#leftDiv').clientWidth //最大宽度
|
|
|
|
if(bodyWidth - ev.clientX >= maxWidth){
|
|
|
|
this.element.nativeElement.querySelector('#rightDiv').style.width = maxWidth + 'px'
|
|
|
|
}else{
|
|
|
|
this.element.nativeElement.querySelector('#rightDiv').style.width = bodyWidth - ev.clientX + 'px';
|
|
|
|
}
|
|
|
|
}
|
|
|
|
document.onmouseup = () => {
|
|
|
|
document.onmousemove = null;
|
|
|
|
document.onmouseup = null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//消防要素div边框高度调节
|
|
|
|
firecategoriesDivMouseDown(e){
|
|
|
|
document.onmousemove = (ev) => {
|
|
|
|
let bodyHeight = document.body.clientHeight //网页宽度
|
|
|
|
let maxHeight = this.element.nativeElement.querySelector('#rightDiv').clientHeight - 35 //最大宽度
|
|
|
|
if(bodyHeight - ev.clientY >= maxHeight){
|
|
|
|
this.element.nativeElement.querySelector('#firecategories').style.height = maxHeight+ 'px'
|
|
|
|
this.element.nativeElement.querySelector('#property').style.height = 35+ 'px'
|
|
|
|
}else{
|
|
|
|
this.element.nativeElement.querySelector('#firecategories').style.height = (bodyHeight - ev.clientY) + 'px' ;
|
|
|
|
this.element.nativeElement.querySelector('#property').style.height = (this.element.nativeElement.querySelector('#rightDiv').clientHeight - this.element.nativeElement.querySelector('#firecategories').clientHeight) + 'px'
|
|
|
|
}
|
|
|
|
}
|
|
|
|
document.onmouseup = () => {
|
|
|
|
document.onmousemove = null;
|
|
|
|
document.onmouseup = null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//素材宽度输入框改变
|
|
|
|
assetWidthIunput(){
|
|
|
|
this.canvasAssetObj.Width = this.assetWidth
|
|
|
|
// 需要将this.canvasAssetObj替换到serves服务对应对象中 ↓↓↓↓↓↓↓
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//素材高度输入框改变
|
|
|
|
assetHeightIunput(){
|
|
|
|
this.canvasAssetObj.Height = this.assetHeight
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//素材角度输入框改变
|
|
|
|
assetAngleIunput(){
|
|
|
|
this.canvasAssetObj.Angle = this.sliderValue
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//素材是否高亮改变----->本地操作行为
|
|
|
|
assetHighLightIunput(){
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//动态属性素材input框值改变
|
|
|
|
assetInputChange(i,e){
|
|
|
|
let index = this.canvasAssetObj.PropertyInfos.findIndex((item)=>{
|
|
|
|
return i.PropertyName == item.PropertyName
|
|
|
|
})
|
|
|
|
this.canvasAssetObj.PropertyInfos[index].PropertyValue = e.target.value
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//动态属性素材布尔值框改变radio
|
|
|
|
assetRadioChange(i,boolean){
|
|
|
|
let index = this.canvasAssetObj.PropertyInfos.findIndex((item)=>{
|
|
|
|
return i.PropertyName == item.PropertyName
|
|
|
|
})
|
|
|
|
this.canvasAssetObj.PropertyInfos[index].PropertyValue = boolean
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//查看图片详情
|
|
|
|
lookImg(){
|
|
|
|
const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去
|
|
|
|
data: {imagesArr:this.imagesArr,index:this.clickedIndex}
|
|
|
|
});
|
|
|
|
dialogRef.afterClosed().subscribe(data=>{ });
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//上传素材图片
|
|
|
|
selectFile(e){
|
|
|
|
let imgFile = e.target.files[0] || null //上传的文件
|
|
|
|
this.startUploading(imgFile)
|
|
|
|
}
|
|
|
|
|
|
|
|
objectName:any //上传对象名
|
|
|
|
startUploading (imgFile) {
|
|
|
|
let _this = this
|
|
|
|
let file = imgFile || null //获取上传的文件
|
|
|
|
let fileSize = file.size || null //上传文件的总大小
|
|
|
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片
|
|
|
|
let companyId = sessionStorage.getItem("companyId")
|
|
|
|
if (file && fileSize <= shardSize) { //上传文件<=5MB时
|
|
|
|
let formData = new FormData()
|
|
|
|
formData.append("file",file)
|
|
|
|
this.http.post(`api/Objects/WebPlan2D/${companyId}`,formData).subscribe((data:any)=>{
|
|
|
|
this.objectName = data.objectName
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('上传成功','确定',config)
|
|
|
|
|
|
|
|
//在原始素材对象和需要循环图片的对象中分别push最新上传的图片
|
|
|
|
let imgObj = {
|
|
|
|
"Tag": null,
|
|
|
|
"Order": 0,
|
|
|
|
"Enabled": false,
|
|
|
|
"Visible": false,
|
|
|
|
"Required": false,
|
|
|
|
"RuleName": null,
|
|
|
|
"RuleValue": null,
|
|
|
|
"PhysicalUnit": null,
|
|
|
|
"PropertyName": "图片",
|
|
|
|
"PropertyType": 3,
|
|
|
|
"PropertyValue": "/api/Objects/WebPlan2D/" + this.objectName
|
|
|
|
}
|
|
|
|
|
|
|
|
this.imagesArr.push(imgObj)
|
|
|
|
this.canvasAssetObj.PropertyInfos.push(imgObj)
|
|
|
|
setTimeout(() => {
|
|
|
|
this.mySwiper = new Swiper('.swiper-container',{
|
|
|
|
loop: false,
|
|
|
|
// grabCursor: true,
|
|
|
|
// 如果需要前进后退按钮
|
|
|
|
navigation: {
|
|
|
|
nextEl: '.swiper-button-next',
|
|
|
|
prevEl: '.swiper-button-prev',
|
|
|
|
},
|
|
|
|
on:{
|
|
|
|
click: function(){
|
|
|
|
_this.clickedIndex = this.clickedIndex
|
|
|
|
},
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
// this.mySwiper.update()
|
|
|
|
this.mySwiper.slideTo(this.imagesArr.length - 1)
|
|
|
|
|
|
|
|
}, 0);
|
|
|
|
|
|
|
|
//判断上传素材属性图片是否超出数量 超出数量则隐藏input框
|
|
|
|
if(this.imagesArr.length < this.imagesArrNum){//不超出input才会显示
|
|
|
|
this.isImgNumCss = true
|
|
|
|
}else{
|
|
|
|
this.isImgNumCss = false
|
|
|
|
}
|
|
|
|
//此处需要把 this.canvasAssetObj这个传入对象 返回给canvas 或者在源数据中替换掉↓↓↓↓↓↓↓↓↓↓
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
} else if (file && fileSize>shardSize) { //上传文件>5MB时,分块上传
|
|
|
|
let config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('上传图片文件不允许大于5mb','确定',config);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//不能上传图片提示
|
|
|
|
imgNumBeyond(){
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('图片数量已达上限','确定',config);
|
|
|
|
}
|
|
|
|
|
|
|
|
//删除素材属性图片
|
|
|
|
deleteImg(){
|
|
|
|
if(this.imagesArr.length == 0){
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('没有可删除的图片,请先上传','确定',config)
|
|
|
|
}else{
|
|
|
|
// 在素材原始对象中将删除的图片去掉
|
|
|
|
this.canvasAssetObj.PropertyInfos = [...this.canvasAssetObj.PropertyInfos.filter((item)=>{
|
|
|
|
return item.PropertyValue != this.imagesArr[this.mySwiper.activeIndex].PropertyValue
|
|
|
|
})]
|
|
|
|
//在图片循环数组中将图片去掉
|
|
|
|
this.imagesArr.splice(this.mySwiper.activeIndex, 1);
|
|
|
|
//更新swiper视图
|
|
|
|
setTimeout(() => {
|
|
|
|
this.mySwiper.update();
|
|
|
|
}, 0);
|
|
|
|
//此处需要把 this.canvasAssetObj这个传入对象 返回给canvas ↓↓↓↓↓↓↓↓↓↓
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//动态属性方向select选择框
|
|
|
|
direction(i,e){
|
|
|
|
let index = this.canvasAssetObj.PropertyInfos.findIndex((item)=>{
|
|
|
|
return i.PropertyName == item.PropertyName
|
|
|
|
})
|
|
|
|
this.canvasAssetObj.PropertyInfos[index].PropertyValue = e.target.value
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//动态属性供给区域select选择框
|
|
|
|
supplyArea(i,e){
|
|
|
|
let index = this.canvasAssetObj.PropertyInfos.findIndex((item)=>{
|
|
|
|
return i.PropertyName == item.PropertyName
|
|
|
|
})
|
|
|
|
this.canvasAssetObj.PropertyInfos[index].PropertyValue = e.target.value
|
|
|
|
}
|
|
|
|
|
|
|
|
//动态属性供给类型select选择框
|
|
|
|
supplyType(i,e){
|
|
|
|
let index = this.canvasAssetObj.PropertyInfos.findIndex((item)=>{
|
|
|
|
return i.PropertyName == item.PropertyName
|
|
|
|
})
|
|
|
|
this.canvasAssetObj.PropertyInfos[index].PropertyValue = e.target.value
|
|
|
|
}
|
|
|
|
|
|
|
|
ngOnInit(): void {
|
|
|
|
|
|
|
|
this.getAllLibrary()
|
|
|
|
this.getSitePlan()
|
|
|
|
this.getAllBuildings()
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
|
|
// console.log(1,this.canvasData.selectStorey)
|
|
|
|
// console.log(2,this.canvasData.originalcompanyBuildingData)
|
|
|
|
// console.log(3,this.canvasData.originaleveryStoreyData)
|
|
|
|
}, 3000);
|
|
|
|
|
|
|
|
// this.setAssetsProperty(this.proObject) //测试
|
|
|
|
}
|
|
|
|
|
|
|
|
ngAfterViewInit(): void {
|
|
|
|
// 监听canvas组件选中素材事件
|
|
|
|
this.canvas.on("select",obj=>{
|
|
|
|
console.log(99999999999,obj)
|
|
|
|
})
|
|
|
|
// 监听canvas组件取消选中素材事件
|
|
|
|
this.canvas.on("deselect ",obj=>{
|
|
|
|
console.log(99999999999,obj)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
//点击基本信息名称
|
|
|
|
basicInfoClick(){
|
|
|
|
this.basicInfo = !this.basicInfo
|
|
|
|
}
|
|
|
|
|
|
|
|
//点击想定作业名称
|
|
|
|
wantToWorkClick(){
|
|
|
|
this.wantToWork = !this.wantToWork
|
|
|
|
}
|
|
|
|
|
|
|
|
//进入编辑模式
|
|
|
|
editpat(){
|
|
|
|
this.isEditPat = true
|
|
|
|
let config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('进入编辑模式','确定',config);
|
|
|
|
}
|
|
|
|
|
|
|
|
//进入查看模式
|
|
|
|
lookpat(){
|
|
|
|
this.isEditPat = false
|
|
|
|
let config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('进入查看模式','确定',config);
|
|
|
|
}
|
|
|
|
|
|
|
|
//保存平面图
|
|
|
|
saveSite(){
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//获得所有的建筑物
|
|
|
|
getAllBuildings(){
|
|
|
|
this.http.get("/api/CompanyAccount/Buildings").subscribe(data=>{
|
|
|
|
this.allBuildings = data
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//创建建筑
|
|
|
|
createBuilding(){
|
|
|
|
let data = this.allBuildings
|
|
|
|
let dialogRef = this.dialog.open(CreateBuilding,{data});
|
|
|
|
dialogRef.afterClosed().subscribe(data=>{
|
|
|
|
if (data == "创建成功") {
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('创建成功','确定',config);
|
|
|
|
this.getAllBuildings()
|
|
|
|
}else if (data == "创建失败") {
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('创建失败','确定',config);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
//选择建筑
|
|
|
|
checkedBuilding(item,index){
|
|
|
|
if (this.checkedBuildingIndex!=index) {
|
|
|
|
this.beforeOneCheckedBuilding = item
|
|
|
|
this.checkedBuildingIndex = index
|
|
|
|
if (index==-1) { //总平面图数据
|
|
|
|
this.getSitePlan()
|
|
|
|
} else { //建筑楼层/区域数据
|
|
|
|
this.getBuildingSitePlan(item)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//编辑建筑
|
|
|
|
editBuilding(e,item){
|
|
|
|
e.stopPropagation();
|
|
|
|
let dialogRef = this.dialog.open(EditBuilding,{data: {item:item}});
|
|
|
|
dialogRef.afterClosed().subscribe(data=>{
|
|
|
|
if (data == "修改成功") {
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('修改成功','确定',config);
|
|
|
|
this.getAllBuildings()
|
|
|
|
}else if (data == "修改失败") {
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('修改失败','确定',config);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
//删除建筑
|
|
|
|
deleteBuilding(e,item){
|
|
|
|
e.stopPropagation();
|
|
|
|
if(confirm("是否删除该建筑") == true){
|
|
|
|
this.http.delete(`/api/CompanyAccount/Buildings/${item.id}`).subscribe(data=>{
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('删除成功','确定',config);
|
|
|
|
this.http.get("/api/CompanyAccount/Buildings").subscribe(data=>{
|
|
|
|
this.allBuildings = data
|
|
|
|
this.beforeOneCheckedBuilding = {name:"总平面图"}
|
|
|
|
this.checkedBuildingIndex = -1
|
|
|
|
this.getSitePlan()
|
|
|
|
})
|
|
|
|
},err=>{
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('删除失败','确定',config);
|
|
|
|
this.getAllBuildings()
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
storeyData //将建筑素材和当前楼层素材合二为一
|
|
|
|
|
|
|
|
//处理 tree 数据结构
|
|
|
|
handleTreeData (storeyData) {
|
|
|
|
this.storeyData = storeyData
|
|
|
|
|
|
|
|
let data = this.allFireElements //所有消防要素
|
|
|
|
let treeData = [] //tree型 处理完成后的数据
|
|
|
|
data.forEach(element => {
|
|
|
|
element.isTemplate = true //添加模板标识
|
|
|
|
element.isLook = true //添加是否可见标识
|
|
|
|
element.children = []
|
|
|
|
if(storeyData){
|
|
|
|
for(let key in storeyData.data){
|
|
|
|
if(element.id == storeyData.data[key].FireElementId){
|
|
|
|
storeyData.data[key].isTemplate = false
|
|
|
|
storeyData.data[key].isLook = true
|
|
|
|
element.isNewElement = true
|
|
|
|
element.children.push(storeyData.data[key])
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
data.forEach(item => { if (item.parentId == element.id) {element.children.push(item)} });
|
|
|
|
});
|
|
|
|
data.forEach(element => {
|
|
|
|
if (!element.parentId) { treeData.push(element) }
|
|
|
|
});
|
|
|
|
this.dataSource.data = treeData
|
|
|
|
this.treeControl.expandAll()
|
|
|
|
}
|
|
|
|
|
|
|
|
//点击树节点
|
|
|
|
clickTreeNode(node){
|
|
|
|
if(node.node.Point){
|
|
|
|
this.setAssetsProperty(node.node)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//点击数节点的显示隐藏icon
|
|
|
|
clickLookItem(node){
|
|
|
|
|
|
|
|
//修改素材islook属性
|
|
|
|
for(let key in this.storeyData.data){
|
|
|
|
if(key == node.id){
|
|
|
|
this.storeyData.data[key].isLook = !this.storeyData.data[key].isLook
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.allFireElements.forEach(item=>{
|
|
|
|
if(item.id == node.id){
|
|
|
|
item.isLook = !item.isLook
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
function updateChildrenIsLook(node, childHandleCb) {
|
|
|
|
if(node.children && node.children.length != 0){
|
|
|
|
node.children.forEach(item => {
|
|
|
|
item.isLook = !item.isLook
|
|
|
|
if (childHandleCb) {
|
|
|
|
childHandleCb(item)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
updateChildrenIsLook(node, (child) => {
|
|
|
|
updateChildrenIsLook(child, null)
|
|
|
|
})
|
|
|
|
|
|
|
|
this.dataSource.data = [...this.dataSource.data]
|
|
|
|
this.treeControl.expandAll()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//封装 刷新 tree 数据
|
|
|
|
renovateTreeData () {
|
|
|
|
this.canvas.refresh()
|
|
|
|
this.canvasData.isChange = false //服务中 数据是否改动 改为false
|
|
|
|
this.isShowAttribute = true //属性栏展示 默认数据
|
|
|
|
|
|
|
|
let beforeOneId = this.selectingSitePlan.id || '' //当前 选中 平面图 楼层/区域 id
|
|
|
|
let companyBuildingData = JSON.parse(JSON.stringify( this.canvasData.originalcompanyBuildingData || {} )) // 当前 单位/建筑 数据
|
|
|
|
let storeyData = JSON.parse(JSON.stringify( this.canvasData.originaleveryStoreyData || {} )) //当前 楼层 数据
|
|
|
|
|
|
|
|
for(let key in companyBuildingData.data){
|
|
|
|
if (companyBuildingData.data[key].FloorId === beforeOneId) { //处理 单位/建筑 数据是否归于当前楼层下
|
|
|
|
storeyData.data[key] = companyBuildingData.data[key]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.handleTreeData(storeyData) //处理tree数据结构
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//陈鹏飞↓↓↓
|
|
|
|
//陈鹏飞↓↓↓
|
|
|
|
//陈鹏飞↓↓↓
|
|
|
|
allFireElements:any = []; //当前 单位/建筑 下的消防要素
|
|
|
|
isShowAttribute:boolean = true; //属性栏 是否显示 默认数据
|
|
|
|
|
|
|
|
toggleExpandPanel:boolean = false; //可展开面板展开或关闭
|
|
|
|
togglePlane:boolean = true; //可展开面板平面图 显隐
|
|
|
|
toggleMaterialBank:boolean = false; //可展开面板素材库 显隐
|
|
|
|
//可展开面板展开或关闭
|
|
|
|
toggle () {
|
|
|
|
this.toggleExpandPanel = !this.toggleExpandPanel
|
|
|
|
}
|
|
|
|
//可展开面板 平面图 展开或关闭
|
|
|
|
togglePlanarGraph () {
|
|
|
|
this.togglePlane = !this.togglePlane
|
|
|
|
}
|
|
|
|
//可展开面板 素材库 展开或关闭
|
|
|
|
toggleMaterial () {
|
|
|
|
this.toggleMaterialBank = !this.toggleMaterialBank
|
|
|
|
}
|
|
|
|
|
|
|
|
sitePlanData:any = []; //总平面图 楼层/区域 数据
|
|
|
|
selectingSitePlan:any; //选中的 平面图 楼层/区域
|
|
|
|
selectSitePlanIndex:number; //选中的 平面图 楼层/区域 index
|
|
|
|
|
|
|
|
//获取总平面图
|
|
|
|
getSitePlan () {
|
|
|
|
this.getFireElements(sessionStorage.getItem('buildingTypeId')) //获取单位下 消防要素
|
|
|
|
this.getSitePlanCompanyData() //获取 单位 数据
|
|
|
|
this.http.get('/api/CompanyAccount/SitePlans').subscribe(data=>{
|
|
|
|
this.sitePlanData = data
|
|
|
|
this.selectingSitePlan = this.sitePlanData[0] || {}
|
|
|
|
this.canvasData.selectStorey = this.sitePlanData[0] || {} //服务中 存一份数据
|
|
|
|
this.selectSitePlanIndex = 0
|
|
|
|
|
|
|
|
this.getSitePlanStorey(this.selectingSitePlan) //获取 平面图 楼层数据
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//获取建筑 楼层/区域
|
|
|
|
getBuildingSitePlan (item) {
|
|
|
|
let params = {
|
|
|
|
buildingId: item.id
|
|
|
|
}
|
|
|
|
this.getFireElements(item.buildingTypes[0].id || '') //获取建筑下 消防要素
|
|
|
|
this.getBuildingData(params) //获取 建筑 数据
|
|
|
|
this.http.get('/api/CompanyAccount/BuildingAreas',{params}).subscribe(data=>{
|
|
|
|
this.sitePlanData = data
|
|
|
|
this.selectingSitePlan = this.sitePlanData[0] || {}
|
|
|
|
this.canvasData.selectStorey = this.sitePlanData[0] || {} //服务中 存一份数据
|
|
|
|
this.selectSitePlanIndex = 0
|
|
|
|
|
|
|
|
this.getBuildingStorey(this.selectingSitePlan) //获取 建筑 楼层数据
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//根据单位类型获得所有的消防要素
|
|
|
|
getFireElements (e) {
|
|
|
|
let params = {ids:e}
|
|
|
|
this.http.get('/api/Companies/FireElements',{params}).subscribe((data:any)=>{
|
|
|
|
this.allFireElements = data //所有消防要素
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//获取 单位 数据
|
|
|
|
getSitePlanCompanyData () {
|
|
|
|
this.http.get('/api/CompanyAccount/CompanyData').subscribe((data:any)=>{
|
|
|
|
this.canvasData.originalcompanyBuildingData = data || {} // 单位原数据
|
|
|
|
this.canvasData.originalcompanyBuildingData.data? this.canvasData.originalcompanyBuildingData.data = JSON.parse(this.canvasData.originalcompanyBuildingData.data) : this.canvasData.originalcompanyBuildingData.data = {}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//获取 平面图 楼层数据
|
|
|
|
getSitePlanStorey (e) {
|
|
|
|
let params = {sitePlanId: e.id}
|
|
|
|
this.http.get(`/api/CompanyAccount/SitePlanData`,{params}).subscribe((data:any)=>{
|
|
|
|
this.canvasData.originaleveryStoreyData = data || {} // 楼层原数据
|
|
|
|
this.canvasData.originaleveryStoreyData.data? this.canvasData.originaleveryStoreyData.data = JSON.parse(this.canvasData.originaleveryStoreyData.data) : this.canvasData.originaleveryStoreyData.data = {}
|
|
|
|
this.renovateTreeData()
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//获取 建筑 数据
|
|
|
|
getBuildingData (e) {
|
|
|
|
this.http.get(`/api/CompanyAccount/BuildingData`,{params:e}).subscribe((data:any)=>{
|
|
|
|
this.canvasData.originalcompanyBuildingData = data || {} // 建筑原数据
|
|
|
|
this.canvasData.originalcompanyBuildingData.data? this.canvasData.originalcompanyBuildingData.data = JSON.parse(this.canvasData.originalcompanyBuildingData.data) : this.canvasData.originalcompanyBuildingData.data = {}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//获取 建筑 楼层数据
|
|
|
|
getBuildingStorey (e) {
|
|
|
|
let params = {buildingAreaId: e.id}
|
|
|
|
this.http.get(`/api/CompanyAccount/BuildingAreaData`,{params}).subscribe((data:any)=>{
|
|
|
|
this.canvasData.originaleveryStoreyData = data || {} // 楼层原数据
|
|
|
|
this.canvasData.originaleveryStoreyData.data? this.canvasData.originaleveryStoreyData.data = JSON.parse(this.canvasData.originaleveryStoreyData.data) : this.canvasData.originaleveryStoreyData.data = {}
|
|
|
|
this.renovateTreeData()
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//点击选中 平面图 楼层/区域 时
|
|
|
|
selectSitePlan (item,index) {
|
|
|
|
if (this.selectSitePlanIndex != index) {
|
|
|
|
this.selectingSitePlan = item
|
|
|
|
this.selectSitePlanIndex = index
|
|
|
|
this.canvasData.selectStorey = item //服务中 存一份数据
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图时
|
|
|
|
this.getSitePlanStorey(item) //获取 平面图 楼层数据
|
|
|
|
} else { //楼层/区域时
|
|
|
|
this.getBuildingStorey(item) //获取 建筑 楼层数据
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//新增平面图 楼层/区域
|
|
|
|
foundPanel (e) {
|
|
|
|
e.stopPropagation()
|
|
|
|
let data = {
|
|
|
|
isBuilding: this.checkedBuildingIndex==-1? false:true,
|
|
|
|
Panel: this.beforeOneCheckedBuilding,
|
|
|
|
order: this.sitePlanData.length? this.sitePlanData[this.sitePlanData.length-1].order+1:0,
|
|
|
|
}
|
|
|
|
let dialogRef = this.dialog.open(leftFunctionalDomainComponent,{data});
|
|
|
|
dialogRef.afterClosed().subscribe(data=>{
|
|
|
|
if (data =='总平面图') {
|
|
|
|
this.renovateSitePlan()
|
|
|
|
} else if (data =='建筑') {
|
|
|
|
this.renovateBuilding()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//编辑平面图 楼层/区域
|
|
|
|
editPlaneData (e) {
|
|
|
|
let data = {
|
|
|
|
isBuilding: this.checkedBuildingIndex==-1? false:true,
|
|
|
|
Panel: this.beforeOneCheckedBuilding,
|
|
|
|
buildingData: e,
|
|
|
|
}
|
|
|
|
let dialogRef = this.dialog.open(editPlaneFigureComponent,{data});
|
|
|
|
dialogRef.afterClosed().subscribe(data=>{
|
|
|
|
if (data =='总平面图') {
|
|
|
|
this.renovateSitePlan()
|
|
|
|
} else if (data =='建筑') {
|
|
|
|
this.renovateBuilding()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//平面图 楼层/区域 上移
|
|
|
|
moveUp (item,index) {
|
|
|
|
if (index != 0) {
|
|
|
|
let replaceIndex = this.sitePlanData[index].order
|
|
|
|
this.sitePlanData[index].order = this.sitePlanData[index-1].order
|
|
|
|
this.sitePlanData[index-1].order = replaceIndex
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${this.sitePlanData[index-1].id}`,this.sitePlanData[index-1]).subscribe(data=>{
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${this.sitePlanData[index].id}`,this.sitePlanData[index]).subscribe(data=>{
|
|
|
|
this.selectSitePlanIndex = this.selectSitePlanIndex-1
|
|
|
|
this.renovateSitePlan()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${this.sitePlanData[index-1].id}`,this.sitePlanData[index-1]).subscribe(data=>{
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${this.sitePlanData[index].id}`,this.sitePlanData[index]).subscribe(data=>{
|
|
|
|
this.selectSitePlanIndex = this.selectSitePlanIndex-1
|
|
|
|
this.renovateBuilding()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
} //if index
|
|
|
|
}
|
|
|
|
|
|
|
|
//平面图 楼层/区域 下移
|
|
|
|
moveDown (item,index) {
|
|
|
|
if (index != this.sitePlanData.length-1) {
|
|
|
|
let replaceIndex = this.sitePlanData[index].order
|
|
|
|
this.sitePlanData[index].order = this.sitePlanData[index+1].order
|
|
|
|
this.sitePlanData[index+1].order = replaceIndex
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${this.sitePlanData[index+1].id}`,this.sitePlanData[index+1]).subscribe(data=>{
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${this.sitePlanData[index].id}`,this.sitePlanData[index]).subscribe(data=>{
|
|
|
|
this.selectSitePlanIndex = this.selectSitePlanIndex+1
|
|
|
|
this.renovateSitePlan()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${this.sitePlanData[index+1].id}`,this.sitePlanData[index+1]).subscribe(data=>{
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${this.sitePlanData[index].id}`,this.sitePlanData[index]).subscribe(data=>{
|
|
|
|
this.selectSitePlanIndex = this.selectSitePlanIndex+1
|
|
|
|
this.renovateBuilding()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
} //if index
|
|
|
|
}
|
|
|
|
|
|
|
|
//旋转底图
|
|
|
|
revolveImg (item) {
|
|
|
|
item.imageAngle==270? item.imageAngle = 0 : item.imageAngle = item.imageAngle+90
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${item.id}`,item).subscribe(data=>{
|
|
|
|
this.renovateSitePlan()
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${item.id}`,item).subscribe(data=>{
|
|
|
|
this.renovateBuilding()
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//删除 平面图 楼层/区域
|
|
|
|
deletePlaneData (item) {
|
|
|
|
let isDelete = confirm('您确定要删除吗')
|
|
|
|
if (isDelete) {
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图
|
|
|
|
this.http.delete(`/api/CompanyAccount/SitePlans/${item.id}`).subscribe(data=>{
|
|
|
|
this.getSitePlan()
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
this.http.delete(`/api/CompanyAccount/BuildingAreas/${item.id}`).subscribe(data=>{
|
|
|
|
this.getBuildingSitePlan(this.beforeOneCheckedBuilding)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//复制图层 平面图 楼层/区域
|
|
|
|
duplicateLayer (item) {
|
|
|
|
if (this.checkedBuildingIndex==-1) { //总平面图
|
|
|
|
item.id = ""
|
|
|
|
item.modifiedTime = new Date()
|
|
|
|
item.name = item.name + '(副本)'
|
|
|
|
item.order = this.sitePlanData[this.sitePlanData.length-1].order+1
|
|
|
|
this.http.post('/api/CompanyAccount/SitePlans',item).subscribe((data:any)=>{
|
|
|
|
let newData = {
|
|
|
|
version: this.canvasData.originaleveryStoreyData.version || "2.0",
|
|
|
|
id: "",
|
|
|
|
data: this.canvasData.originaleveryStoreyData.data || null,
|
|
|
|
sitePlanId: data.id
|
|
|
|
}
|
|
|
|
this.http.post('/api/CompanyAccount/SitePlanData',newData).subscribe(data=>{
|
|
|
|
this.renovateSitePlan()
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
item.id = ""
|
|
|
|
item.modifiedTime = new Date()
|
|
|
|
item.name = item.name + '(副本)'
|
|
|
|
item.order = this.sitePlanData[this.sitePlanData.length-1].order+1
|
|
|
|
this.http.post('/api/CompanyAccount/BuildingAreas',item).subscribe((data:any)=>{
|
|
|
|
let newData = {
|
|
|
|
version: this.canvasData.originaleveryStoreyData.version || "2.0",
|
|
|
|
id: "",
|
|
|
|
data: this.canvasData.originaleveryStoreyData.data || null,
|
|
|
|
buildingAreaId: data.id
|
|
|
|
}
|
|
|
|
this.http.post('/api/CompanyAccount/BuildingAreaData',newData).subscribe(data=>{
|
|
|
|
this.renovateBuilding()
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//平面图 楼层/区域 替换底图
|
|
|
|
replaceBaseMap (e,item) {
|
|
|
|
e.stopPropagation();
|
|
|
|
let file = e.target.files[0] || null //获取上传的文件
|
|
|
|
let fileSize = file.size || null //上传文件的总大小
|
|
|
|
let maxSize = 5 * 1024 * 1024 //5MB一个分片
|
|
|
|
|
|
|
|
if (file && fileSize<=maxSize) { //上传文件<=5MB时
|
|
|
|
let formData = new FormData()
|
|
|
|
formData.append("file",file)
|
|
|
|
this.http.post(`/api/Objects/WebPlan2D/${sessionStorage.getItem('companyId')}`,formData).subscribe((data:any)=>{
|
|
|
|
this.renovateBaseMap(data.objectName,item)
|
|
|
|
})
|
|
|
|
} else {
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('上传底图需小于5MB','确定',config);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//封装 替换底图 function
|
|
|
|
renovateBaseMap (e,item) {
|
|
|
|
item.imageUrl = '/api/Objects/WebPlan2D/' + e
|
|
|
|
if (this.checkedBuildingIndex ==-1) { //总平面图
|
|
|
|
this.http.put(`/api/CompanyAccount/SitePlans/${item.id}`,item).subscribe(data=>{
|
|
|
|
this.renovateSitePlan()
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('上传底图成功','确定',config);
|
|
|
|
})
|
|
|
|
} else { //楼层/区域
|
|
|
|
this.http.put(`/api/CompanyAccount/BuildingAreas/${item.id}`,item).subscribe(data=>{
|
|
|
|
this.renovateBuilding()
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('上传底图成功','确定',config);
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//封装 统一刷新 左侧菜单栏数据
|
|
|
|
// renovateLeftMenu () {
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
//封装 刷新总平面图 数据
|
|
|
|
renovateSitePlan () {
|
|
|
|
this.http.get('/api/CompanyAccount/SitePlans').subscribe(data=>{
|
|
|
|
this.sitePlanData = data
|
|
|
|
this.selectingSitePlan = this.sitePlanData[this.selectSitePlanIndex]
|
|
|
|
this.canvasData.selectStorey = this.sitePlanData[this.selectSitePlanIndex] //服务中 存一份数据
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('数据更新成功','确定',config);
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//封装 刷新 楼层/区域 数据
|
|
|
|
renovateBuilding () {
|
|
|
|
let params = {
|
|
|
|
buildingId: this.beforeOneCheckedBuilding.id
|
|
|
|
}
|
|
|
|
this.http.get('/api/CompanyAccount/BuildingAreas',{params}).subscribe(data=>{
|
|
|
|
this.sitePlanData = data
|
|
|
|
this.selectingSitePlan = this.sitePlanData[this.selectSitePlanIndex]
|
|
|
|
this.canvasData.selectStorey = this.sitePlanData[this.selectSitePlanIndex] //服务中 存一份数据
|
|
|
|
const config = new MatSnackBarConfig();
|
|
|
|
config.verticalPosition = 'top';
|
|
|
|
config.duration = 3000
|
|
|
|
this.snackBar.open('数据更新成功','确定',config);
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
allLibrary:any = []; //所有素材库 + 素材
|
|
|
|
selectLibrary:any; //选中的素材库
|
|
|
|
selectImage:any; //选中的素材库图片
|
|
|
|
selectImageIndex:number; //选中的素材库图片index
|
|
|
|
|
|
|
|
//获取素材库
|
|
|
|
getAllLibrary () {
|
|
|
|
this.http.get('/api/AssetLibraries?tag=input').subscribe((data:any)=>{
|
|
|
|
data.forEach(element => {
|
|
|
|
element.images = []
|
|
|
|
});
|
|
|
|
this.allLibrary = data
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//素材库展开面板展开时
|
|
|
|
opened (e) {
|
|
|
|
if (!e.images.length) { //当前素材库没加载素材时
|
|
|
|
this.http.get(`/api/Assets?libraryId=${e.id}`).subscribe((data:any)=>{
|
|
|
|
e.images = data
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//点击选中素材库图片时
|
|
|
|
selectImg (item,items,index) {
|
|
|
|
this.selectLibrary = item.name
|
|
|
|
this.selectImage = items
|
|
|
|
this.selectImageIndex = index
|
|
|
|
this.canvasData.selectTemplateData = items
|
|
|
|
this.canvas.beginPaint()
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//创建建筑
|
|
|
|
@Component({
|
|
|
|
selector: 'app-createBuilding',
|
|
|
|
templateUrl: './createBuilding.html',
|
|
|
|
styleUrls: ['./collection-tools.component.scss']
|
|
|
|
})
|
|
|
|
export class CreateBuilding {
|
|
|
|
|
|
|
|
constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef<CreateBuilding>,@Inject(MAT_DIALOG_DATA) public data) { }
|
|
|
|
|
|
|
|
allBuildingType:any//所有的建筑类型
|
|
|
|
selected:any; //选中的建筑
|
|
|
|
ngOnInit(): void {
|
|
|
|
this.getAllBuildingType()
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getAllBuildingType(){
|
|
|
|
this.http.get("/api/BuildingTypes/Simple").subscribe(data=>{
|
|
|
|
this.allBuildingType = data
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//创建建筑功能分区
|
|
|
|
onSubmit (e) {
|
|
|
|
let companyId = sessionStorage.getItem("companyId")
|
|
|
|
let lastBuildingOrder = this.data.length != 0 ? this.data[this.data.length - 1].order + 1 : 0
|
|
|
|
let data =
|
|
|
|
{
|
|
|
|
id: "",
|
|
|
|
name: e.propertyName,
|
|
|
|
order: lastBuildingOrder ,
|
|
|
|
enabled: true,
|
|
|
|
companyId: companyId,
|
|
|
|
buildingTypes: [
|
|
|
|
{
|
|
|
|
id: e.buildingId,
|
|
|
|
name: ""
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
this.http.post("/api/CompanyAccount/Buildings",data).subscribe(data=>{
|
|
|
|
this.dialogRef.close("创建成功");
|
|
|
|
},err=>{
|
|
|
|
this.dialogRef.close("创建失败");
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//编辑建筑
|
|
|
|
@Component({
|
|
|
|
selector: 'app-editBuilding',
|
|
|
|
templateUrl: './editBuilding.html',
|
|
|
|
styleUrls: ['./collection-tools.component.scss']
|
|
|
|
})
|
|
|
|
export class EditBuilding {
|
|
|
|
|
|
|
|
constructor(private http:HttpClient,public dialog: MatDialog,public dialogRef: MatDialogRef<EditBuilding>,@Inject(MAT_DIALOG_DATA) public data) { }
|
|
|
|
|
|
|
|
defaultName:String = this.data.item.name//默认建筑名称
|
|
|
|
defaultBuildingType:String = this.data.item.buildingTypes[0].id//默认建筑类型
|
|
|
|
allBuildingType:any//所有的建筑类型
|
|
|
|
|
|
|
|
ngOnInit(): void {
|
|
|
|
this.getAllBuildingType()
|
|
|
|
}
|
|
|
|
|
|
|
|
getAllBuildingType(){
|
|
|
|
this.http.get("/api/BuildingTypes/Simple").subscribe(data=>{
|
|
|
|
this.allBuildingType = data
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//编辑建筑信息
|
|
|
|
onSubmit (e) {
|
|
|
|
let companyId = sessionStorage.getItem("companyId")
|
|
|
|
let data =
|
|
|
|
{
|
|
|
|
id: this.data.item.id,
|
|
|
|
name: e.propertyName,
|
|
|
|
order: this.data.item.order,
|
|
|
|
enabled: true,
|
|
|
|
companyId: companyId,
|
|
|
|
buildingTypes: [
|
|
|
|
{
|
|
|
|
id: e.buildingId,
|
|
|
|
name: ""
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
this.http.put(`/api/CompanyAccount/Buildings/${this.data.item.id}`,data).subscribe(data=>{
|
|
|
|
this.dialogRef.close("修改成功");
|
|
|
|
},err=>{
|
|
|
|
this.dialogRef.close("修改失败");
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//查看图片大图
|
|
|
|
@Component({
|
|
|
|
selector: 'viewdetails',
|
|
|
|
templateUrl: './viewdetails.html',
|
|
|
|
styleUrls: ['./collection-tools.component.scss']
|
|
|
|
})
|
|
|
|
export class ViewDetails {
|
|
|
|
// myControl = new FormControl();
|
|
|
|
//注入MatDialogRef,可以用来关闭对话框
|
|
|
|
//要访问对话框组件中的数据,必须使用MAT_DIALOG_DATA注入令牌
|
|
|
|
constructor(private http: HttpClient,public dialogRef: MatDialogRef<ViewDetails>,@Inject(MAT_DIALOG_DATA) public data) {}
|
|
|
|
imagesArr = this.data.imagesArr
|
|
|
|
onNoClick(): void {
|
|
|
|
this.dialogRef.close();
|
|
|
|
}
|
|
|
|
ngOnInit(): void {
|
|
|
|
setTimeout(() => {
|
|
|
|
var mySwiper = new Swiper('.swiper-container',{
|
|
|
|
loop: false,
|
|
|
|
initialSlide :this.data.index,//默认索引
|
|
|
|
// 如果需要前进后退按钮
|
|
|
|
navigation: {
|
|
|
|
nextEl: '.swiper-button-next',
|
|
|
|
prevEl: '.swiper-button-prev',
|
|
|
|
}
|
|
|
|
//其他设置
|
|
|
|
});
|
|
|
|
}, 0);
|
|
|
|
}
|
|
|
|
closeDialog(){
|
|
|
|
this.dialogRef.close();
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|