|
|
|
|
@ -7,8 +7,10 @@
|
|
|
|
|
* @LastEditTime: 2021-06-17 10:01:26 |
|
|
|
|
*/ |
|
|
|
|
import { HttpClient } from '@angular/common/http'; |
|
|
|
|
import { Component, OnInit } from '@angular/core'; |
|
|
|
|
import { Component, Inject, OnInit, Renderer2, ViewChild, Input } from '@angular/core'; |
|
|
|
|
import { ActivatedRoute } from '@angular/router'; |
|
|
|
|
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
|
|
|
|
import { MatSnackBar } from '@angular/material/snack-bar'; |
|
|
|
|
|
|
|
|
|
@Component({ |
|
|
|
|
selector: 'app-create-plan-online-five', |
|
|
|
|
@ -17,7 +19,7 @@ import { ActivatedRoute } from '@angular/router';
|
|
|
|
|
}) |
|
|
|
|
export class CreatePlanOnlineFiveComponent implements OnInit { |
|
|
|
|
|
|
|
|
|
constructor(private http: HttpClient, private route: ActivatedRoute) { } |
|
|
|
|
constructor(private http: HttpClient, private route: ActivatedRoute, public snackBar: MatSnackBar, public dialog: MatDialog) { } |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
planName: string //预案名称
|
|
|
|
|
@ -47,13 +49,55 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
|
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
selectedItem: string = '封面' |
|
|
|
|
clickTitleItem(item) { |
|
|
|
|
item == '封面' ? this.selectedItem = '封面' : this.selectedItem = item.groupName |
|
|
|
|
if (this.selectedItem == '重点图示') { |
|
|
|
|
this.getAllBuildings() |
|
|
|
|
this.getSitePlan() |
|
|
|
|
this.getRealPicture() |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//获取实景图
|
|
|
|
|
allRealPicture |
|
|
|
|
getRealPicture() { |
|
|
|
|
let companyId = this.unitId |
|
|
|
|
this.http.get('/api/RealityImageGroups', { |
|
|
|
|
params: { |
|
|
|
|
companyId: '5e9964caa760a059e84512e9' |
|
|
|
|
} |
|
|
|
|
}).subscribe((data: any) => { |
|
|
|
|
this.allRealPicture = data |
|
|
|
|
this.getAllRealPicture().then(()=>{ |
|
|
|
|
console.log('实景图', this.allRealPicture) |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
async getAllRealPicture() { |
|
|
|
|
for (let index = 0; index < this.allRealPicture.length; index++) { |
|
|
|
|
const element = this.allRealPicture[index]; |
|
|
|
|
let data = { |
|
|
|
|
groupId: element.id, |
|
|
|
|
pageSize: '999', |
|
|
|
|
} |
|
|
|
|
await new Promise((resolve, reject) => { |
|
|
|
|
this.http.get('/api/RealityImages', { params: data }).subscribe((data: any) => { |
|
|
|
|
element.realityImages = data.items |
|
|
|
|
element.realityImages.forEach(item => { //每张图片设置选中状态为false
|
|
|
|
|
item.newImageUrl = `/api/Objects/PlanPlatform/${item.imageUrl}?x-oss-process=image/resize,m_fill,h_100,w_100` //处理图片URL地址
|
|
|
|
|
item.nameStart = item.name.substring(0, item.name.lastIndexOf(".")); //图片名称前缀
|
|
|
|
|
item.nameEnd = item.name.substring(item.name.lastIndexOf("."), item.name.length); //图片名称后缀
|
|
|
|
|
resolve(data) |
|
|
|
|
}); |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
planTemplateData: any |
|
|
|
|
//获得模板信息
|
|
|
|
|
getTemplateData() { |
|
|
|
|
@ -74,57 +118,100 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//重点图示增加分组
|
|
|
|
|
addkeyImgItem() { |
|
|
|
|
this.planTemplateData.forEach(element => { |
|
|
|
|
if (element.groupName == '重点图示') { |
|
|
|
|
element.attribute.push({ name: '', imgArr: [] }) |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
addkeyImgItem(item) { |
|
|
|
|
item.attribute.push({ name: '', imgArr: [] }) |
|
|
|
|
} |
|
|
|
|
//通过左侧实景图增加分组
|
|
|
|
|
addkeyImgItemLeft(i){ |
|
|
|
|
console.log(i) |
|
|
|
|
} |
|
|
|
|
//重点图示删除指定分组
|
|
|
|
|
deleteItem(key) { |
|
|
|
|
deleteItem(item, key) { |
|
|
|
|
let isDelete = window.confirm('确定要删除该分组吗?分组下上传的图片将一同被删除!') |
|
|
|
|
if (isDelete) { |
|
|
|
|
this.planTemplateData.forEach(element => { |
|
|
|
|
if (element.groupName == '重点图示') { |
|
|
|
|
element.attribute.splice(key, 1) |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
item.attribute.splice(key, 1) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
//重点图示删除指定分组里面的图片
|
|
|
|
|
deleteImgItem(imgArr, imgkey) { |
|
|
|
|
let isDelete = window.confirm('确定要删除该图片吗?') |
|
|
|
|
if (isDelete) { |
|
|
|
|
imgArr.splice(imgkey, 1) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//重点图示上传图片
|
|
|
|
|
file: any |
|
|
|
|
filechange(e) { |
|
|
|
|
this.file = e.target.files[0] || null //上传的文件
|
|
|
|
|
filechange(e, i) { |
|
|
|
|
let file = e.target.files[0] || null //获取上传的文件
|
|
|
|
|
let fileSize = file.size || null //上传文件的总大小
|
|
|
|
|
let maxSize = 5 * 1024 * 1024 //5MB一个分片
|
|
|
|
|
let tenSize = 100 * 1024 * 1024 //100MB限制
|
|
|
|
|
if (file && fileSize <= maxSize) { //上传文件<=5MB时
|
|
|
|
|
let upload = this.uploadFile(this.route.snapshot.queryParams.companyId, this.route.snapshot.queryParams.companyId, file) |
|
|
|
|
upload.then(res => { |
|
|
|
|
console.log('小于5M', res) |
|
|
|
|
//图片地址 /api/Objects/PlanPlatform/res.objectName
|
|
|
|
|
let upload = this.uploadFile(this.route.snapshot.queryParams.companyId, this.route.snapshot.queryParams.planId, file) |
|
|
|
|
upload.then((res: any) => { |
|
|
|
|
i.imgArr.push('/api/Objects/PlanPlatform/' + res.objectName) |
|
|
|
|
}) |
|
|
|
|
} else { //上传文件>5MB时
|
|
|
|
|
let upload = this.sectionUpload(this.route.snapshot.queryParams.companyId, this.route.snapshot.queryParams.companyId, file) |
|
|
|
|
let upload = this.sectionUpload(this.route.snapshot.queryParams.companyId, this.route.snapshot.queryParams.planId, file) |
|
|
|
|
upload.then(res => { |
|
|
|
|
// this.renovateBaseMap('/api/Objects/PlanPlatform/' + res, item)
|
|
|
|
|
console.log('大于5M', res) |
|
|
|
|
i.imgArr.push('/api/Objects/PlanPlatform/' + res) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
// else {
|
|
|
|
|
// const config = new MatSnackBarConfig();
|
|
|
|
|
// config.verticalPosition = 'top';
|
|
|
|
|
// config.duration = 3000
|
|
|
|
|
// this.snackBar.open('上传底图需小于100MB', '确定', config);
|
|
|
|
|
// }
|
|
|
|
|
} |
|
|
|
|
//单位相关数据
|
|
|
|
|
unitId: any = this.route.snapshot.queryParams.companyId |
|
|
|
|
//获得所有的建筑物
|
|
|
|
|
allBuildings: any |
|
|
|
|
getAllBuildings() { |
|
|
|
|
this.http.get("/api/Buildings", { |
|
|
|
|
params: { |
|
|
|
|
companyId: this.unitId |
|
|
|
|
} |
|
|
|
|
}).subscribe((data: any) => { |
|
|
|
|
data.forEach((item, index) => { |
|
|
|
|
let params = { buildingId: item.id } |
|
|
|
|
item.plandata = [] |
|
|
|
|
this.http.get('/api/BuildingAreas', { params }).subscribe(data => { |
|
|
|
|
item.plandata = data |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
this.allBuildings = data |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//获取总平面图
|
|
|
|
|
sitePlanItems: any |
|
|
|
|
getSitePlan() { |
|
|
|
|
let params = { companyId: this.unitId } |
|
|
|
|
this.http.get('/api/SitePlans', { params: params }).subscribe(data => { |
|
|
|
|
this.sitePlanItems = data |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//打开采集工具
|
|
|
|
|
openPlan(item, index) { |
|
|
|
|
sessionStorage.setItem("gisplan", 'look') |
|
|
|
|
sessionStorage.setItem("companyId", this.unitId) |
|
|
|
|
let data = { select: item, key: index, allBuildings: this.allBuildings } |
|
|
|
|
let width = Math.round(document.body.clientWidth * 0.8) + 'px' |
|
|
|
|
let height = Math.round(document.body.clientHeight * 0.9) + 'px' |
|
|
|
|
// console.log('宽度',width)
|
|
|
|
|
let dialogRef = this.dialog.open(OpenPlanToolDialog, {//调用open方法打开对话框并且携带参数过去
|
|
|
|
|
id: 'openPlanToolDialog', |
|
|
|
|
data, |
|
|
|
|
width: width, |
|
|
|
|
height: height |
|
|
|
|
}); |
|
|
|
|
dialogRef.afterClosed().subscribe((data) => { }); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//input key值，一个字符焦点消失问题
|
|
|
|
|
trackByFn(index) { |
|
|
|
|
return index |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//正常上传
|
|
|
|
|
async uploadFile(companyId: string, planId: string, file) { |
|
|
|
|
let formData = new FormData() |
|
|
|
|
formData.append("file", file) |
|
|
|
|
@ -134,11 +221,6 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
|
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//input key值，一个字符焦点消失问题
|
|
|
|
|
trackByFn(index){ |
|
|
|
|
return index |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//分段上传
|
|
|
|
|
sectionUpload(companyId: string, planId: string, file) { |
|
|
|
|
let data = { filename: file.name } |
|
|
|
|
@ -193,3 +275,44 @@ export interface buildingTypes {
|
|
|
|
|
id: string, |
|
|
|
|
name: string, |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//查看预案
|
|
|
|
|
@Component({ |
|
|
|
|
selector: 'lookPlan-dialog', |
|
|
|
|
templateUrl: './openPlanTool.html', |
|
|
|
|
styleUrls: ['./openPlanTool.scss'] |
|
|
|
|
}) |
|
|
|
|
export class OpenPlanToolDialog { |
|
|
|
|
|
|
|
|
|
constructor(public http: HttpClient, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<OpenPlanToolDialog>, |
|
|
|
|
@Inject(MAT_DIALOG_DATA) public data, private render2: Renderer2, public dialog: MatDialog, private route: ActivatedRoute) { } |
|
|
|
|
|
|
|
|
|
@ViewChild('plan') plan: any //子组件
|
|
|
|
|
|
|
|
|
|
ngOnInit() { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
ngAfterViewInit(): void { |
|
|
|
|
this.noticePlan() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//通知 子组件 传递参数
|
|
|
|
|
noticePlan() { |
|
|
|
|
let parameter = { //查询 节点 对应 建筑/楼层 index,id
|
|
|
|
|
buildingIndex: this.data.key, //总平面图/建筑 index
|
|
|
|
|
storeyId: this.data.select.id |
|
|
|
|
} |
|
|
|
|
this.http.get("/api/Buildings", { params: { companyId: this.route.snapshot.queryParams.companyId } }).subscribe((data: any) => { |
|
|
|
|
this.plan.allBuildings = data |
|
|
|
|
this.plan.seekPanelPoint(parameter) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//关闭弹窗
|
|
|
|
|
closeDiv() { |
|
|
|
|
this.dialogRef.close() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
