+
edit
add
library_books
diff --git a/src/app/ui/collection-tools/collection-tools.component.scss b/src/app/ui/collection-tools/collection-tools.component.scss
index 8b34d62..19402a6 100644
--- a/src/app/ui/collection-tools/collection-tools.component.scss
+++ b/src/app/ui/collection-tools/collection-tools.component.scss
@@ -4,7 +4,7 @@
}
.content {
width: 100%;
- height: 93%;
+ height: 100%;
overflow: hidden;
box-sizing: border-box;
padding: 1px;
diff --git a/src/app/ui/collection-tools/collection-tools.component.ts b/src/app/ui/collection-tools/collection-tools.component.ts
index d51b0c7..7bf0762 100644
--- a/src/app/ui/collection-tools/collection-tools.component.ts
+++ b/src/app/ui/collection-tools/collection-tools.component.ts
@@ -587,6 +587,13 @@ export class CollectionToolsComponent implements OnInit {
this.gallery.update()
}, 0);
+ //将上传的input框显示出来
+ this.isImgNumCss = true;
+ //清除图片缓存
+ if((document.getElementById('inputimg'))){
+ (document.getElementById('inputimg')).value = null //清空input框缓存
+ }
+
this.canvasData.isChange = true
}
}
@@ -649,7 +656,7 @@ export class CollectionToolsComponent implements OnInit {
let that = this
window.setTimeout(()=>{
document.getElementById("functionalDomainContent").oncontextmenu = function (event) {
- that.canvas.cancelPaint()
+ // that.canvas.cancelPaint()
that.selectImageIndex = -1
event.preventDefault();
};
@@ -736,268 +743,275 @@ export class CollectionToolsComponent implements OnInit {
//保存平面图
saveNum :any = []
saveSite(){
- console.log(this.beforeOneCheckedBuilding)
- this.saveNum = []
- let SitePlanData = JSON.parse(JSON.stringify(this.canvasData.originaleveryStoreyData));
- SitePlanData.data = JSON.stringify(SitePlanData.data)
- let CompanyData = JSON.parse(JSON.stringify(this.canvasData.originalcompanyBuildingData));
- CompanyData.data = JSON.stringify(CompanyData.data)
-
- let object = this.canvasData.originalcompanyBuildingData.data
- let adjoinArr = [] //毗邻数组
-
- if(this.pattern){//如果是基本信息编辑模式
- for (const key in object) {
- if (object[key].Name == "毗邻") {//如果是相同楼层，则筛选出毗邻
-
- object[key].PropertyInfos.forEach(element => {
- if(element.PropertyName == "方向"){
- adjoinArr.push(element.PropertyValue)
- }
- });
+ if (this.selectingSitePlan && this.selectingSitePlan.id) {
+ this.saveNum = []
+ let SitePlanData = JSON.parse(JSON.stringify(this.canvasData.originaleveryStoreyData));
+ SitePlanData.data = JSON.stringify(SitePlanData.data)
+ let CompanyData = JSON.parse(JSON.stringify(this.canvasData.originalcompanyBuildingData));
+ CompanyData.data = JSON.stringify(CompanyData.data)
+
+ let object = this.canvasData.originalcompanyBuildingData.data
+ let adjoinArr = [] //毗邻数组
+
+ if(this.pattern){//如果是基本信息编辑模式
+ for (const key in object) {
+ if (object[key].Name == "毗邻") {//如果是相同楼层，则筛选出毗邻
+
+ object[key].PropertyInfos.forEach(element => {
+ if(element.PropertyName == "方向"){
+ adjoinArr.push(element.PropertyValue)
+ }
+ });
+ }
}
- }
-
- if((new Set(adjoinArr)).size != adjoinArr.length){
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.snackBar.open('保存失败，毗邻存在相同方向','确定',config);
- return false
- }else{
- //如果是单位 总平面图
- if(this.checkedBuildingIndex==-1){
- //保存平面图数据
- this.http.post("/api/SitePlanData",SitePlanData,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+
+ if((new Set(adjoinArr)).size != adjoinArr.length){
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存失败，毗邻存在相同方向','确定',config);
+ return false
+ }else{
+ //如果是单位 总平面图
+ if(this.checkedBuildingIndex==-1){
+ //保存平面图数据
+ this.http.post("/api/SitePlanData",SitePlanData,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('平面图数据保存失败','确定',config);
- })
-
- //保存建筑数据
- this.http.post("/api/CompanyData",CompanyData,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('平面图数据保存失败','确定',config);
+ })
+
+ //保存建筑数据
+ this.http.post("/api/CompanyData",CompanyData,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('单位数据保存失败','确定',config);
- })
-
- //批量保存单位毗邻
- let CompanyAdjoins = this.canvasData.getCompanyAdjoinInfo()
- this.http.post("/api/CompanyAdjoins/Batch",CompanyAdjoins,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('单位数据保存失败','确定',config);
+ })
+
+ //批量保存单位毗邻
+ let CompanyAdjoins = this.canvasData.getCompanyAdjoinInfo()
+ this.http.post("/api/CompanyAdjoins/Batch",CompanyAdjoins,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('单位毗邻保存失败','确定',config);
- })
-
- //批量保存单位重点部位
- let CompanyImportantLocations = this.canvasData.getCompanyImportantLocations()
- this.http.post("/api/CompanyImportantLocations/Batch",CompanyImportantLocations,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('单位毗邻保存失败','确定',config);
+ })
+
+ //批量保存单位重点部位
+ let CompanyImportantLocations = this.canvasData.getCompanyImportantLocations()
+ this.http.post("/api/CompanyImportantLocations/Batch",CompanyImportantLocations,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('单位重点部位保存失败','确定',config);
- })
-
- //批量保存单位消防设施素材
- let CompanyFacilityAssets = this.canvasData.getAllCompanyFacilityAssetInfo()
- this.http.post("/api/CompanyFacilityAssets/Batch",CompanyFacilityAssets,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('单位重点部位保存失败','确定',config);
+ })
+
+ //批量保存单位消防设施素材
+ let CompanyFacilityAssets = this.canvasData.getAllCompanyFacilityAssetInfo()
+ this.http.post("/api/CompanyFacilityAssets/Batch",CompanyFacilityAssets,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('单位消防设施素材保存失败','确定',config);
- })
-
- }else{ //如果是建筑
-
- //建筑平面图数据
- this.http.post("/api/BuildingAreaData",SitePlanData,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('单位消防设施素材保存失败','确定',config);
+ })
+
+ }else{ //如果是建筑
+
+ //建筑平面图数据
+ this.http.post("/api/BuildingAreaData",SitePlanData,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('平面图数据保存失败','确定',config);
- })
-
- //建筑数据
- this.http.post("/api/BuildingData",CompanyData,{
- params:{
- companyId:this.params.companyId
- }
- }).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('平面图数据保存失败','确定',config);
+ })
+
+ //建筑数据
+ this.http.post("/api/BuildingData",CompanyData,{
+ params:{
+ companyId:this.params.companyId
+ }
+ }).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('单位数据保存失败','确定',config);
- })
-
- //批量保存建筑毗邻
- let buildingAdjoins = this.canvasData.getBuildingAdjoinInfo()
- this.http.post(`/api/BuildingAdjoins/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingAdjoins).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('单位数据保存失败','确定',config);
+ })
+
+ //批量保存建筑毗邻
+ let buildingAdjoins = this.canvasData.getBuildingAdjoinInfo()
+ this.http.post(`/api/BuildingAdjoins/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingAdjoins).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('建筑毗邻保存失败','确定',config);
- })
-
- //批量保存建筑重点部位
- let buildingImportantLocations = this.canvasData.getBuildingImportantLocations()
- this.http.post(`/api/BuildingImportantLocations/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingImportantLocations).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('建筑毗邻保存失败','确定',config);
+ })
+
+ //批量保存建筑重点部位
+ let buildingImportantLocations = this.canvasData.getBuildingImportantLocations()
+ this.http.post(`/api/BuildingImportantLocations/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingImportantLocations).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('建筑重点部位保存失败','确定',config);
- })
-
- //批量保存建筑消防设施素材
- let buildingFacilityAssets = this.canvasData.getAllBuildingFacilityAssetInfo()
- this.http.post(`/api/BuildingFacilityAssets/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingFacilityAssets).subscribe(data => {
- this.saveNum.push("1")
- if(this.saveNum.length == 5){
- this.canvasData.isChange = false
+ this.canvasData.isChange = true
+ this.snackBar.open('建筑重点部位保存失败','确定',config);
+ })
+
+ //批量保存建筑消防设施素材
+ let buildingFacilityAssets = this.canvasData.getAllBuildingFacilityAssetInfo()
+ this.http.post(`/api/BuildingFacilityAssets/Batch?companyId=${this.params.companyId}&buildingId=${this.canvasData.selectStorey.buildingId}`,buildingFacilityAssets).subscribe(data => {
+ this.saveNum.push("1")
+ if(this.saveNum.length == 5){
+ this.canvasData.isChange = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ }
+ },err=>{
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('保存成功','确定',config);
- }
- },err=>{
- let config = new MatSnackBarConfig();
- config.verticalPosition = 'top';
- config.duration = 3000
- this.canvasData.isChange = true
- this.snackBar.open('建筑消防设施素材保存失败','确定',config);
- })
-
+ this.canvasData.isChange = true
+ this.snackBar.open('建筑消防设施素材保存失败','确定',config);
+ })
+
+ }
}
+ }else{//如果是想定作业编辑模式
+ const dialogRef = this.dialog.open(saveOneDialog, {
+ data: {allDisposalNode: this.canvasData.allDisposalNode,
+ selectedBuildingData:this.beforeOneCheckedBuilding,
+ selectedSiteData:this.selectingSitePlan,
+ siteOrbuilding:this.checkedBuildingIndex,
+ disasterId: this.allFirePlan[0].id || ''
+ }
+ });
+
+ dialogRef.afterClosed().subscribe(result => {
+ console.log('The dialog was closed');
+ });
}
- }else{//如果是想定作业编辑模式
- const dialogRef = this.dialog.open(saveOneDialog, {
- data: {allDisposalNode: this.canvasData.allDisposalNode,
- selectedBuildingData:this.beforeOneCheckedBuilding,
- selectedSiteData:this.selectingSitePlan,
- siteOrbuilding:this.checkedBuildingIndex,
- disasterId: this.allFirePlan[0].id || ''
- }
- });
-
- dialogRef.afterClosed().subscribe(result => {
- console.log('The dialog was closed');
- });
+
+ } else { //if
+ const config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('暂无楼层数据','确定',config);
}
}
@@ -1046,14 +1060,40 @@ export class CollectionToolsComponent implements OnInit {
//选择建筑
checkedBuilding(item,index){
if (this.checkedBuildingIndex!=index) {
- this.beforeOneCheckedBuilding = item
- this.checkedBuildingIndex = index
- if (index==-1) { //总平面图数据
- this.getSitePlan()
- } else { //建筑楼层/区域数据
- this.getBuildingSitePlan(item)
- }
- }
+
+ if (this.canvasData.isChange) { //true 数据被改动
+ let isTrue = confirm('是否保存当前编辑数据')
+ if (isTrue) { //先保存数据 在切换
+ let isSuccess = this.saveSite()//true的时候 先保存数据
+ if (isSuccess != false) {
+ this.beforeOneCheckedBuilding = item
+ this.checkedBuildingIndex = index
+ if (index==-1) { //总平面图数据
+ this.getSitePlan()
+ } else { //建筑楼层/区域数据
+ this.getBuildingSitePlan(item)
+ }
+ }
+ } else {
+ this.beforeOneCheckedBuilding = item
+ this.checkedBuildingIndex = index
+ if (index==-1) { //总平面图数据
+ this.getSitePlan()
+ } else { //建筑楼层/区域数据
+ this.getBuildingSitePlan(item)
+ }
+ }
+ } else { //flase 数据未被改动
+ this.beforeOneCheckedBuilding = item
+ this.checkedBuildingIndex = index
+ if (index==-1) { //总平面图数据
+ this.getSitePlan()
+ } else { //建筑楼层/区域数据
+ this.getBuildingSitePlan(item)
+ }
+ } //if
+
+ } //if
}
//编辑建筑
@@ -1219,8 +1259,23 @@ export class CollectionToolsComponent implements OnInit {
}
+ const nodes = this.treeControl.dataNodes;
+ const expandNodes = [];
+ nodes.forEach((item) => {
+ if(item.expandable && this.treeControl.isExpanded(item)){
+ expandNodes.push(item.id);
+ }
+ });
+
this.dataSource.data = [...this.dataSource.data]
- this.treeControl.expandAll()
+
+ let newNodes = this.treeControl.dataNodes;
+ newNodes = newNodes.filter(n => {
+ return expandNodes.indexOf(n.id) >= 0;
+ });
+ newNodes.forEach(item => {
+ this.treeControl.expand(item);
+ });
//canvas上的素材显隐
let iconVisibleArr:any = []
@@ -1468,8 +1523,11 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.selectStorey = item //服务中 存一份数据
if (this.checkedBuildingIndex==-1) { //总平面图时
this.getSitePlanStorey(item) //获取 平面图 楼层数据
+ this.getSitePlanCompanyData()
} else { //楼层/区域时
this.getBuildingStorey(item) //获取 建筑 楼层数据
+ let params = { buildingId: this.beforeOneCheckedBuilding.id }
+ this.getBuildingData(params)
}
}
@@ -1644,6 +1702,7 @@ export class CollectionToolsComponent implements OnInit {
this.selectingSitePlan = this.sitePlanData[0] || {}
this.canvasData.selectStorey = this.sitePlanData[0] || {} //服务中 存一份数据
this.selectSitePlanIndex = 0
+ this.canvasData.isChange = false
if (isCompany===-1) {
this.http.post("/api/CompanyData",newData).subscribe(data => {})
this.getSitePlanStorey(this.selectingSitePlan) //获取 平面图 楼层数据
@@ -1791,7 +1850,7 @@ export class CollectionToolsComponent implements OnInit {
});
this.allLibrary = data
this.selectImageIndex = -1
- this.canvas.cancelPaint()
+ // this.canvas.cancelPaint()
})
}
diff --git a/src/app/ui/unittype/unittype.component.html b/src/app/ui/unittype/unittype.component.html
index 5926469..8800c1d 100644
--- a/src/app/ui/unittype/unittype.component.html
+++ b/src/app/ui/unittype/unittype.component.html
@@ -1,55 +1,57 @@
-
diff --git a/src/app/working-area/model/PropertyInfo.ts b/src/app/working-area/model/PropertyInfo.ts
new file mode 100644
index 0000000..4ae2c6a
--- /dev/null
+++ b/src/app/working-area/model/PropertyInfo.ts
@@ -0,0 +1,62 @@
+/**
+ * 属性
+ */
+export class PropertyInfo {
+ constructor(instanceData: any) {
+ this.Tag = instanceData.tag;
+ this.Order = instanceData.order;
+ this.Enabled = instanceData.enabled;
+ this.Visible = instanceData.visible;
+ this.Required = instanceData.required;
+ this.RuleName = instanceData.ruleName;
+ this.RuleValue = instanceData.ruleValue;
+ this.PhysicalUnit = instanceData.physicalUnit;
+ this.PropertyName = instanceData.propertyName;
+ this.PropertyType = instanceData.propertyType;
+ this.PropertyValue = instanceData.propertyValue;
+ }
+ /**
+ * 标记位,用于扩展
+ */
+ public Tag: string;
+ /**
+ * 属性排序
+ */
+ public Order: number;
+ /**
+ * 是否启用
+ */
+ public Enabled: boolean;
+ /**
+ * 是否可见
+ */
+ public Visible: boolean;
+ /**
+ * 必填
+ */
+ public Required: boolean;
+ /**
+ * 验证规则名称
+ */
+ public RuleName: string;
+ /**
+ * 验证规则值
+ */
+ public RuleValue: string;
+ /**
+ * 物理单位
+ */
+ public PhysicalUnit: string;
+ /**
+ * 属性名称
+ */
+ public PropertyName: string;
+ /**
+ * 属性类型
+ */
+ public PropertyType: number;
+ /**
+ * 属性值
+ */
+ public PropertyValue: string;
+}
diff --git a/src/app/working-area/model/axArrowConnector.ts b/src/app/working-area/model/axArrowConnector.ts
new file mode 100644
index 0000000..8b72b39
--- /dev/null
+++ b/src/app/working-area/model/axArrowConnector.ts
@@ -0,0 +1,405 @@
+import { WorkingAreaComponent } from '../working-area.component';
+import * as PIXI from 'pixi.js';
+import { AxShape } from './axShape';
+import { Sprite } from 'pixi.js';
+
+/**
+ * 连接箭头
+ */
+export class AxArrowConnector extends AxShape {
+
+ pointTexture: PIXI.Texture = PIXI.Texture.from('assets/images/handle-main.png')
+ pointSprites: Array = new Array();
+ line: PIXI.Graphics;
+ text: PIXI.Text;
+ style = new PIXI.TextStyle({
+ fontFamily: 'Arial',
+ fontSize: 18,
+ fontStyle: 'normal',
+ fontWeight: 'bold',
+ fill: ['#000000'],
+ stroke: '#ffffff',
+ strokeThickness: 3,
+ dropShadow: true,
+ dropShadowColor: '#000000',
+ dropShadowBlur: 3,
+ dropShadowAngle: Math.PI / 6,
+ dropShadowDistance: 1,
+ wordWrap: false,
+ wordWrapWidth: 100,
+ });
+ pts: PIXI.Point[];
+
+ markerStart = true;// 是否绘制起始箭头
+ markerEnd = true;// 是否绘制结束箭头
+ constructor(assetData: any, workingArea: WorkingAreaComponent,markerStart: boolean,markerEnd:boolean) {
+ super(assetData, workingArea);
+
+ this.markerStart = markerStart;
+ this.markerEnd = markerEnd;
+
+ this.name = assetData.Id;
+ this.text = new PIXI.Text(this.assetData.Name
+ + '\r\n'
+ + this.assetData.PropertyInfos?.find((item: { PropertyName: string; }) =>
+ item.PropertyName === '名称/编号')?.PropertyValue, this.style);
+ this.line = new PIXI.Graphics();
+ this.addChild(this.text);
+ this.addChild(this.line);
+ this.workingArea.backgroundImage.addChild(this);
+ this.refresh();
+ this.drawPoints();
+ this.sortableChildren = true;
+ this.text.zIndex = this.children.length;
+ }
+
+ public drawPoints() {
+ this.assetData.MultiPoint.forEach(element => {
+ var point = new Sprite(this.pointTexture);
+ point.position = element;
+ point.anchor.set(0.5);
+ this.pointSprites.push(point);
+ this.addChild(point);
+ });
+ this.pointSprites.forEach((value, index, array) => {
+ value.interactive = true;
+ value.on('mousedown', event => {
+ event.stopPropagation();
+ if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
+ event.currentTarget.data = event.data;
+ event.currentTarget.alpha = 0.5;
+ event.currentTarget.dragging = true;
+ }
+ })
+ .on('mouseup', event => {
+ if (event.currentTarget.dragging) {
+ event.currentTarget.alpha = 1;
+ event.currentTarget.dragging = false;
+ event.currentTarget.data = null;
+ }
+ })
+ .on('mouseupoutside', event => {
+ if (event.currentTarget.dragging) {
+ event.currentTarget.alpha = 1;
+ event.currentTarget.dragging = false;
+ event.currentTarget.data = null;
+ }
+ })
+ .on('mousemove', event => {
+ if (event.currentTarget.dragging) {
+ const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent);
+ event.currentTarget.x = newPosition.x;
+ event.currentTarget.y = newPosition.y;
+
+ this.assetData.MultiPoint[index].x = newPosition.x;
+ this.assetData.MultiPoint[index].y = newPosition.y;
+ this.workingArea.canvasData.isChange = true;
+ this.refresh();
+ }
+ })
+ .on('rightclick', event => {
+ });
+ })
+ this.setPointsVisible(false);
+ }
+
+ /**
+ * 设置点显示状态
+ * @param b true/false
+ */
+ public setPointsVisible(b:boolean) {
+ this.pointSprites.forEach(item => {
+ item.visible = b;
+ })
+ }
+ /**
+ * 刷新形状
+ */
+ public refresh(): void {
+ const c = this.line;
+ const pts = this.assetData.MultiPoint;
+ if (pts.length < 2) {
+ return;
+ }
+ this.text.position = pts[0];
+ this.text.anchor.set(0.5, 1);
+ this.text.text = this.assetData.Name
+ + '\r\n'
+ + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue;
+ const strokeWidth = 1;
+ const startWidth = 30 + strokeWidth;
+ const endWidth = 30 + strokeWidth;
+ const edgeWidth = this.assetData.Thickness === 0 ? 10 : this.assetData.Thickness; // 宽度
+ const openEnded = false;
+
+ const spacing = (openEnded) ? 0 : 0 + strokeWidth / 2;
+ const startSize = 30 + strokeWidth;
+ const endSize = 30 + strokeWidth;
+ const isRounded = true;
+ const lineColor = 0x000000;
+ const fillColor: number = this.assetData.Color.substring(0, 7).replace('#', '0x');;
+
+ const pe = pts[pts.length - 1];
+
+ let i0 = 1;
+
+ while (i0 < pts.length - 1 && pts[i0].x === pts[0].x && pts[i0].y === pts[0].y) {
+ i0++;
+ }
+
+ const dx = pts[i0].x - pts[0].x;
+ const dy = pts[i0].y - pts[0].y;
+ const dist = Math.sqrt(dx * dx + dy * dy);
+
+ if (dist === 0) {
+ return;
+ }
+ let nx = dx / dist;
+ let nx1 = nx;
+ let nx2 = nx;
+ let ny = dy / dist;
+ let ny2 = ny;
+ let ny1 = ny;
+ let orthx = edgeWidth * ny;
+ let orthy = -edgeWidth * nx;
+
+ const fns = [];
+
+ // if (isRounded) {
+ // // c.setLineJoin('round');
+ // c.lineTextureStyle({ join: PIXI.LINE_JOIN.ROUND });
+ // } else if (pts.length > 2) {
+ // // Only mitre if there are waypoints
+ // // c.setMiterLimit(1.42);
+ // c.lineTextureStyle({ miterLimit: 1.42 });
+ // }
+ // c.lineStyle(1, 0x000000, 1);
+ c.clear();
+ c.lineTextureStyle({ width: 1, color: lineColor, join: PIXI.LINE_JOIN.ROUND });
+
+ const startNx = nx;
+ const startNy = ny;
+ if (!openEnded) {
+ c.beginFill(fillColor);
+ }
+ if (this.markerStart && !openEnded) {
+ this.paintMarker(c, pts[0].x, pts[0].y, nx, ny, startSize, startWidth, edgeWidth, spacing, true);
+ } else {
+ const outStartX = pts[0].x + orthx / 2 + spacing * nx;
+ const outStartY = pts[0].y + orthy / 2 + spacing * ny;
+ const inEndX = pts[0].x - orthx / 2 + spacing * nx;
+ const inEndY = pts[0].y - orthy / 2 + spacing * ny;
+
+ if (openEnded) {
+ c.moveTo(outStartX, outStartY);
+ fns.push( () => {
+ c.lineTo(inEndX, inEndY);
+ });
+ } else {
+ c.moveTo(inEndX, inEndY);
+ c.lineTo(outStartX, outStartY);
+ }
+ }
+ let dx1 = 0;
+ let dy1 = 0;
+ let dist1 = 0;
+
+ for (let i = 0; i < pts.length - 2; i++) {
+ const pos = this.relativeCcw(pts[i].x, pts[i].y, pts[i + 1].x, pts[i + 1].y, pts[i + 2].x, pts[i + 2].y);
+
+ dx1 = pts[i + 2].x - pts[i + 1].x;
+ dy1 = pts[i + 2].y - pts[i + 1].y;
+
+ dist1 = Math.sqrt(dx1 * dx1 + dy1 * dy1);
+
+ if (dist1 !== 0) {
+ nx1 = dx1 / dist1;
+ ny1 = dy1 / dist1;
+
+ const tmp1 = nx * nx1 + ny * ny1;
+ const tmp = Math.max(Math.sqrt((tmp1 + 1) / 2), 0.04);
+
+ nx2 = (nx + nx1);
+ ny2 = (ny + ny1);
+
+ const dist2 = Math.sqrt(nx2 * nx2 + ny2 * ny2);
+
+ if (dist2 !== 0) {
+ nx2 = nx2 / dist2;
+ ny2 = ny2 / dist2;
+
+ const strokeWidthFactor = Math.max(tmp, Math.min(1 / 200 + 0.04, 0.35));
+ const angleFactor = (pos !== 0 && isRounded) ? Math.max(0.1, strokeWidthFactor) : Math.max(tmp, 0.06);
+
+ const outX = pts[i + 1].x + ny2 * edgeWidth / 2 / angleFactor;
+ const outY = pts[i + 1].y - nx2 * edgeWidth / 2 / angleFactor;
+ const inX = pts[i + 1].x - ny2 * edgeWidth / 2 / angleFactor;
+ const inY = pts[i + 1].y + nx2 * edgeWidth / 2 / angleFactor;
+
+ if (pos === 0 || !isRounded) {
+ c.lineTo(outX, outY);
+
+ ((x, y) => {
+ fns.push(() => {
+ c.lineTo(x, y);
+ });
+ })(inX, inY);
+ } else if (pos === -1) {
+ const c1x = inX + ny * edgeWidth;
+ const c1y = inY - nx * edgeWidth;
+ const c2x = inX + ny1 * edgeWidth;
+ const c2y = inY - nx1 * edgeWidth;
+ c.lineTo(c1x, c1y);
+ if (isRounded) {
+ c.quadraticCurveTo(outX, outY, c2x, c2y); // 圆角
+ } else {
+ c.lineTo(outX, outY);
+ }
+ ((x, y) => {
+ fns.push(() => {
+ c.lineTo(x, y);
+ });
+ })(inX, inY);
+ } else {
+ c.lineTo(outX, outY);
+
+ ((x, y) => {
+ const c1x = outX - ny * edgeWidth;
+ const c1y = outY + nx * edgeWidth;
+ const c2x = outX - ny1 * edgeWidth;
+ const c2y = outY + nx1 * edgeWidth;
+
+ fns.push(() => {
+ if (isRounded) {
+ c.quadraticCurveTo(x, y, c1x, c1y);
+ } else {
+ c.lineTo(x, y);
+ }
+ });
+ fns.push(() => {
+ c.lineTo(c2x, c2y);
+ });
+ })(inX, inY);
+ }
+
+ nx = nx1;
+ ny = ny1;
+ }
+ }
+ }
+ orthx = edgeWidth * ny1;
+ orthy = - edgeWidth * nx1;
+
+ if (this.markerEnd && !openEnded) {
+ this.paintMarker(c, pe.x, pe.y, -nx, -ny, endSize, endWidth, edgeWidth, spacing, false);
+ } else {
+ c.lineTo(pe.x - spacing * nx1 + orthx / 2, pe.y - spacing * ny1 + orthy / 2);
+
+ const inStartX = pe.x - spacing * nx1 - orthx / 2;
+ const inStartY = pe.y - spacing * ny1 - orthy / 2;
+
+ if (!openEnded) {
+ c.lineTo(inStartX, inStartY);
+ } else {
+ c.moveTo(inStartX, inStartY);
+
+ fns.splice(0, 0, () => {
+ c.moveTo(inStartX, inStartY);
+ });
+ }
+ }
+
+ for (let i = fns.length - 1; i >= 0; i--) {
+ fns[i]();
+ }
+
+ if (openEnded)
+ {
+ c.closePath();
+ }
+ else
+ {
+ c.closePath();
+ c.endFill();
+ }
+
+ // c.setShadow(false);
+
+ // c.setMiterLimit(4);
+
+ // if (isRounded)
+ // {
+ // c.setLineJoin('flat');
+ // }
+
+ // if (pts.length > 2)
+ // {
+ // c.setMiterLimit(4);
+ // if (markerStart && !openEnded)
+ // {
+ // c.begin();
+ // this.paintMarker(c, pts[0].x, pts[0].y, startNx, startNy, startSize, startWidth, edgeWidth, spacing, true);
+ // c.stroke();
+ // c.end();
+ // }
+
+ // if (markerEnd && !openEnded)
+ // {
+ // c.begin();
+ // this.paintMarker(c, pe.x, pe.y, -nx, -ny, endSize, endWidth, edgeWidth, spacing, true);
+ // c.stroke();
+ // c.end();
+ // }
+ // }
+ }
+ paintMarker(c: PIXI.Graphics, ptX: number, ptY: number, nx: number, ny: number,
+ size: number, arrowWidth: number, edgeWidth: number, spacing: number, initialMove: boolean) {
+ const widthArrowRatio = edgeWidth / arrowWidth;
+ const orthx = edgeWidth * ny / 2;
+ const orthy = -edgeWidth * nx / 2;
+
+ const spaceX = (spacing + size) * nx;
+ const spaceY = (spacing + size) * ny;
+
+ if (initialMove) {
+ c.moveTo(ptX - orthx + spaceX, ptY - orthy + spaceY);
+ } else {
+ c.lineTo(ptX - orthx + spaceX, ptY - orthy + spaceY);
+ }
+ c.lineTo(ptX - orthx / widthArrowRatio + spaceX, ptY - orthy / widthArrowRatio + spaceY);
+ c.lineTo(ptX + spacing * nx, ptY + spacing * ny);
+ c.lineTo(ptX + orthx / widthArrowRatio + spaceX, ptY + orthy / widthArrowRatio + spaceY);
+ c.lineTo(ptX + orthx + spaceX, ptY + orthy + spaceY);
+ }
+ relativeCcw(x1: number, y1: number, x2: number, y2: number, px: number, py: number) {
+ x2 -= x1;
+ y2 -= y1;
+ px -= x1;
+ py -= y1;
+ let ccw = px * y2 - py * x2;
+
+ if (ccw === 0.0) {
+ ccw = px * x2 + py * y2;
+
+ if (ccw > 0.0) {
+ px -= x2;
+ py -= y2;
+ ccw = px * x2 + py * y2;
+
+ if (ccw < 0.0) {
+ ccw = 0.0;
+ }
+ }
+ }
+ return (ccw < 0.0) ? -1 : ((ccw > 0.0) ? 1 : 0);
+ }
+
+ redraw(): void{
+ this.pointSprites.forEach(item => {
+ item.destroy();
+ })
+ this.pointSprites.splice(0, this.pointSprites.length);
+ this.refresh();
+ this.drawPoints();
+ }
+}
diff --git a/src/app/working-area/model/axImageShape.ts b/src/app/working-area/model/axImageShape.ts
new file mode 100644
index 0000000..67466be
--- /dev/null
+++ b/src/app/working-area/model/axImageShape.ts
@@ -0,0 +1,443 @@
+import { WorkingAreaComponent } from '../working-area.component';
+import * as ObjectID from 'bson-objectid';
+import { GameMode } from './gameMode';
+import { PaintMode } from './paintModel';
+import * as PIXI from 'pixi.js';
+import { PropertyInfo } from './PropertyInfo';
+import { AxShape } from './axShape';
+import { Sprite } from 'pixi.js';
+import { AxArrowConnector } from './axArrowConnector';
+
+/**
+ * 安信图片形状
+ * AxImageShape
+ */
+export class AxImageShape extends AxShape {
+ style = new PIXI.TextStyle({
+ fontFamily: 'Arial',
+ fontSize: 18,
+ fontStyle: 'normal',
+ fontWeight: 'bold',
+ fill: ['#000000'],
+ stroke: '#ffffff',
+ strokeThickness: 3,
+ dropShadow: true,
+ dropShadowColor: '#000000',
+ dropShadowBlur: 3,
+ dropShadowAngle: Math.PI / 6,
+ dropShadowDistance: 1,
+ wordWrap: false,
+ wordWrapWidth: 100,
+ });
+
+ text = new PIXI.Text(this.assetData.Name
+ + '\r\n'
+ + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
+
+ /**
+ * 选中圆点
+ */
+
+ image: PIXI.Sprite;
+ selectionBox = new PIXI.Graphics();
+ connectPointTexture = PIXI.Texture.from('assets/images/handle-secondary.png');
+ connectPoint: Sprite;
+ // 可移动的
+
+ // 可选中的
+
+ // up: PIXI.Sprite;
+ // down: PIXI.Sprite;
+ // left: PIXI.Sprite;
+ // right: PIXI.Sprite;
+ // upLeft: PIXI.Sprite;
+ // upRight: PIXI.Sprite;
+ // downLeft: PIXI.Sprite;
+ // downRight: PIXI.Sprite;
+ constructor(assetData: any, workingArea: WorkingAreaComponent) {
+ super(assetData, workingArea);
+ this.x = this.assetData.Point.x;
+ this.y = this.assetData.Point.y;
+ this.name = this.assetData.Id;
+ this.image = PIXI.Sprite.from(this.assetData.ImageUrl);
+ this.image.angle = this.assetData.Angle;
+
+ this.image.x = 0;
+ this.image.y = 0;
+ this.image.width = this.assetData.Width;
+ this.image.height = this.assetData.Height;
+ this.image.alpha = 1;
+ this.image.anchor.set(0.5);
+ // this.image.interactive = true;
+ // this.image.buttonMode = true;
+ // this.image
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // this.workingArea.selection.selectOne(this);
+ // // this.paintingPipeline(this.x, this.y);
+ // // 如果链接对象不为空,禁止移动
+ // if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
+ // event.currentTarget.parent.data = event.data;
+ // event.currentTarget.parent.alpha = 0.5;
+ // event.currentTarget.parent.dragging = true;
+ // }
+ // })
+ // .on('mouseup', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mouseupoutside', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mousemove', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // // // 如果拖动过程中发现父对象不是背景图
+ // // if (this.parent !== this.workingArea.backgroundImage) {
+ // // this.setParent(this.workingArea.backgroundImage);
+ // // if (this.assetData.FixedSize) {
+ // // const scale = 1 / this.workingArea.backgroundImage.scale.x;
+ // // this.scale.set(scale);
+ // // }
+ // // }
+ // const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
+ // event.currentTarget.parent.x = newPosition.x;
+ // event.currentTarget.parent.y = newPosition.y;
+ // this.assetData.Point = new PIXI.Point(this.x, this.y);
+ // this.workingArea.canvasData.isChange = true;
+ // }
+ // })
+ // .on('rightclick', event => {
+
+ // })
+ // .on('mouseover', event => {
+ // event.stopPropagation();
+ // if (this.workingArea.previewImage !== null
+ // && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ // this.workingArea.previewImage.visible = false;
+ // }
+ // // if (this.assetData.CanConnect) {
+ // // this.setSelectionBox(true, this.image);
+ // // }
+ // })
+ // .on('mouseout', event => {
+ // event.stopPropagation();
+ // if (this.workingArea.previewImage !== null
+ // && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ // this.workingArea.previewImage.visible = true;
+ // }
+ // // if (this.assetData.CanConnect) {
+ // // this.setSelectionBox(false);
+ // // }
+ // });
+ this.text.x = this.image.x;
+ this.text.y = this.image.y - this.image.height / 2;
+ this.text.anchor.set(0.5, 1);
+
+ if (this.assetData.GameMode === 2) {
+ this.text.visible = false;
+ }
+ this.addChild(this.text);
+ this.addChild(this.image);
+ this.addChild(this.selectionBox);
+
+ if (this.assetData.CanConnect) {
+ // connectPoint
+ this.connectPoint = new PIXI.Sprite(this.connectPointTexture);
+ this.connectPoint.anchor.set(0.5);
+ this.connectPoint.x = this.image.x;
+ this.connectPoint.y = this.image.y;
+ this.addChild(this.connectPoint);
+ this.connectPoint.interactive = true;
+ this.connectPoint
+ .on('mousedown', event => {
+ event.stopPropagation();
+ this.paintingPipeline(this.x, this.y);
+ })
+ .on('mouseover', event => {
+ this.setSelectionBox(true, this.connectPoint);
+ })
+ .on('mouseout', event => {
+ this.setSelectionBox(false);
+ });
+ // // up
+ // this.up = new PIXI.Sprite(this.selectedPointTexture);
+ // this.up.anchor.set(0.5);
+ // this.up.x = this.image.x;
+ // this.up.y = this.image.y - (this.image.height / 2);
+ // this.addChild(this.up);
+ // this.up.interactive = true;
+ // this.up
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.up.x, this.up.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.up);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // down
+ // this.down = new PIXI.Sprite(this.selectedPointTexture);
+ // this.down.anchor.set(0.5);
+ // this.down.x = this.image.x;
+ // this.down.y = this.image.y + (this.image.height / 2);
+ // this.addChild(this.down);
+ // this.down.interactive = true;
+ // this.down
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.down.x, this.down.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.down);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // left
+ // this.left = new PIXI.Sprite(this.selectedPointTexture);
+ // this.left.anchor.set(0.5);
+ // this.left.x = this.image.x - (this.image.width / 2);
+ // this.left.y = this.image.y;
+ // this.addChild(this.left);
+ // this.left.interactive = true;
+ // this.left
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.left.x, this.left.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.left);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // right
+ // this.right = new PIXI.Sprite(this.selectedPointTexture);
+ // this.right.anchor.set(0.5);
+ // this.right.x = this.image.x + (this.image.width / 2);
+ // this.right.y = this.image.y;
+ // this.addChild(this.right);
+ // this.right.interactive = true;
+ // this.right
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.right.x, this.right.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.right);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // up-left
+ // this.upLeft = new PIXI.Sprite(this.selectedPointTexture);
+ // this.upLeft.anchor.set(0.5);
+ // this.upLeft.x = this.image.x - (this.image.width / 2);
+ // this.upLeft.y = this.image.y - (this.image.height / 2);
+ // this.addChild(this.upLeft);
+ // this.upLeft.interactive = true;
+ // this.upLeft
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.upLeft.x, this.upLeft.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.upLeft);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // up-right
+ // this.upRight = new PIXI.Sprite(this.selectedPointTexture);
+ // this.upRight.anchor.set(0.5);
+ // this.upRight.x = this.image.x + (this.image.width / 2);
+ // this.upRight.y = this.image.y - (this.image.height / 2);
+ // this.addChild(this.upRight);
+ // this.upRight.interactive = true;
+ // this.upRight
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.upRight.x, this.upRight.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.upRight);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+
+ // // down-left
+ // this.downLeft = new PIXI.Sprite(this.selectedPointTexture);
+ // this.downLeft.anchor.set(0.5);
+ // this.downLeft.x = this.image.x - (this.image.width / 2);
+ // this.downLeft.y = this.image.y + (this.image.height / 2);
+ // this.addChild(this.downLeft);
+ // this.downLeft.interactive = true;
+ // this.downLeft
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.downLeft.x, this.downLeft.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.downLeft);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+ // // down-right
+ // this.downRight = new PIXI.Sprite(this.selectedPointTexture);
+ // this.downRight.anchor.set(0.5);
+ // this.downRight.x = this.image.x + (this.image.width / 2);
+ // this.downRight.y = this.image.y + (this.image.height / 2);
+ // this.addChild(this.downRight);
+ // this.downRight.interactive = true;
+ // this.downRight
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // const pt = this.toGlobal(new PIXI.Point(this.downRight.x, this.downRight.y));
+ // const pt2 = this.workingArea.backgroundImage.toLocal(pt);
+ // this.paintingPipeline(pt2.x, pt2.y);
+ // })
+ // .on('mouseover', event => {
+ // this.setSelectionBox(true, this.downRight);
+ // })
+ // .on('mouseout', event => {
+ // this.setSelectionBox(false);
+ // });
+
+ this.showConnectionPoint(false);
+ }
+ }
+ // 设置选择框
+ public setSelectionBox(b: boolean, sprite?: PIXI.Sprite) {
+ if (b) {
+ this.selectionBox.lineStyle(2, 0x00EB00, 1);
+ this.selectionBox.position = sprite.position;
+ this.selectionBox.drawRect(- sprite.width / 2, - sprite.height / 2, sprite.width, sprite.height);
+ // const p0 = new PIXI.Point(- sprite.width / 2, - sprite.height / 2);
+ // const pe = new PIXI.Point(sprite.width / 2, sprite.height / 2);
+ // const pw = new PIXI.Point(p0.x + sprite.width, p0.y);
+ // const ph = new PIXI.Point(p0.x, p0.y + sprite.height);
+ // this.drawDashedLine(this.selectionBox, p0, pw, 0x1234ff);
+ // this.drawDashedLine(this.selectionBox, p0, ph, 0x1234ff);
+ // this.drawDashedLine(this.selectionBox, pe, pw, 0x1234ff);
+ // this.drawDashedLine(this.selectionBox, pe, ph, 0x1234ff);
+ } else {
+ this.selectionBox.clear();
+ }
+ }
+ // 设置名称
+ public setNameVisible(value: boolean, mode: GameMode) {
+ if (this.assetData.GameMode === mode) {
+ this.text.visible = value;
+ }
+ }
+ // 显示连接点
+ public showConnectionPoint(b: boolean) {
+ this.connectPoint.visible = b;
+ // this.up.visible = b;
+ // this.down.visible = b;
+ // this.left.visible = b;
+ // this.right.visible = b;
+ // this.upLeft.visible = b;
+ // this.downLeft.visible = b;
+ // this.upRight.visible = b;
+ // this.downRight.visible = b;
+ }
+ paintingPipeline(x: number, y: number) {
+ if (this.assetData.CanConnect) {
+ if (this.workingArea.getPaintMode() === PaintMode.Pipeline) {
+ if (this.workingArea.paintingShape === null) {
+ this.workingArea.previewLineSegment.visible = true;
+ this.workingArea.currentClickPoint.position =
+ new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
+ this.workingArea.paintPoints.push(new PIXI.Point(x, y));
+ const json = JSON.parse(JSON.stringify(this.workingArea.canvasData.selectTemplateData.propertyInfos));
+ const list = [];
+ json.forEach(element => {
+ const property = new PropertyInfo(element);
+ list.push(property);
+ });
+ const tempData = {
+ TemplateId: this.workingArea.canvasData.selectTemplateData.id,
+ CanConnect: this.workingArea.canvasData.selectTemplateData.canConnect,
+ Pipelines: new Array(),
+ FloorId: this.workingArea.canvasData.selectStorey.id,
+ Angle: this.workingArea.canvasData.selectTemplateData.angle,
+ Color: this.workingArea.canvasData.selectTemplateData.color,
+ Enabled: this.workingArea.canvasData.selectTemplateData.enabled,
+ FillMode: this.workingArea.canvasData.selectTemplateData.fillMode,
+ FireElementId: this.workingArea.canvasData.selectTemplateData.fireElementId,
+ FixedSize: this.workingArea.canvasData.selectTemplateData.fixedSize,
+ Height : 32,
+ Width : 32,
+ Id: ObjectID.default.generate(),
+ ImageUrl: this.workingArea.canvasData.selectTemplateData.imageUrl,
+ InteractiveMode: this.workingArea.canvasData.selectTemplateData.interactiveMode,
+ MultiPoint : JSON.parse(JSON.stringify(this.workingArea.paintPoints)),
+ Point: new PIXI.Point(0, 0),
+ Name : this.workingArea.canvasData.selectTemplateData.name,
+ PropertyInfos: list,
+ Border : this.workingArea.canvasData.selectTemplateData.border,
+ DrawMode : this.workingArea.canvasData.selectTemplateData.drawMode,
+ Thickness : this.workingArea.canvasData.selectTemplateData.thickness,
+ IsFromBuilding : this.workingArea.canvasData.selectTemplateData.isFromBuilding,
+ GameMode: this.workingArea.canvasData.gameMode,
+ LinkedObjects: new Array(this.assetData.Id),
+ };
+ this.workingArea.paintingShape = new AxArrowConnector(tempData, this.workingArea,false,true);
+ this.assetData.Pipelines.push(this.workingArea.paintingShape.assetData.Id);
+ this.workingArea.emit('createIcon', this.workingArea.paintingShape);
+ } else {
+ this.workingArea.previewLineSegment.visible = false;
+ this.workingArea.currentClickPoint.position =
+ new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
+ this.workingArea.paintPoints.push(new PIXI.Point(x, y));
+ this.workingArea.paintingShape.assetData.MultiPoint =
+ JSON.parse(JSON.stringify(this.workingArea.paintPoints));
+ this.workingArea.paintingShape.assetData.LinkedObjects.push(this.assetData.Id);
+ this.assetData.Pipelines.push(this.workingArea.paintingShape.assetData.Id);
+ this.workingArea.paintingShape.redraw();
+ this.workingArea.initPipelineData();
+ }
+ }
+ }
+ }
+ // 刷新
+ public refresh() {
+ if (this.assetData.CanConnect) {
+
+ }
+ this.image.width = this.assetData.Width;
+ this.image.height = this.assetData.Height;
+ this.image.angle = this.assetData.Angle;
+ this.text.text = this.assetData.Name
+ + '\r\n'
+ + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue;
+ this.text.x = this.image.x;
+ this.text.y = this.image.y - this.image.height / 2;
+ }
+}
diff --git a/src/app/working-area/model/axPreviewImageShape.ts b/src/app/working-area/model/axPreviewImageShape.ts
new file mode 100644
index 0000000..623b2d7
--- /dev/null
+++ b/src/app/working-area/model/axPreviewImageShape.ts
@@ -0,0 +1,27 @@
+import { Sprite, Texture } from 'pixi.js';
+import { WorkingAreaComponent } from '../working-area.component';
+import { AxShape } from './axShape';
+
+export class AxPreviewImageShape extends AxShape {
+ image: Sprite = null;
+ /**
+ *
+ */
+ constructor(workingArea: WorkingAreaComponent) {
+ super(null, workingArea);
+ this.image = new Sprite();
+ this.image.width = 32;
+ this.image.height = 32;
+ this.image.anchor.set(0.5);
+ this.interactive = false;
+ this.scale.set(1 / this.workingArea.backgroundImage.scale.x);
+ this.addChild(this.image);
+ }
+ /**
+ * 重新设置图片地址
+ * @param url 图片路径
+ */
+ setImageUrl(url: string) {
+ this.image.texture = Texture.from(url);
+ }
+}
diff --git a/src/app/working-area/model/axShape.ts b/src/app/working-area/model/axShape.ts
new file mode 100644
index 0000000..9ff01a6
--- /dev/null
+++ b/src/app/working-area/model/axShape.ts
@@ -0,0 +1,80 @@
+import { Constructor } from '@angular/material/core/common-behaviors/constructor';
+import * as PIXI from 'pixi.js';
+import { Point, Rectangle, Graphics, Container } from 'pixi.js';
+import { WorkingAreaComponent } from '../working-area.component';
+
+/**
+ * 安信形状
+ */
+export class AxShape extends Container {
+ assetData: any;
+ workingArea: WorkingAreaComponent;
+ // 可以被移动的
+ moveable = true;
+ // 可以被选中的
+ selectable = true;
+
+ constructor(assetData: any, workingArea: WorkingAreaComponent) {
+ super();
+ this.assetData = assetData;
+ this.workingArea = workingArea;
+ this.workingArea.backgroundImage.addChild(this);
+ this.interactive = true;
+ this.buttonMode = true;
+ this.on('mousedown', event => {
+ console.log(this.assetData);
+ event.stopPropagation();
+ if (this.selectable) {
+ this.workingArea.selection.selectOne(this);
+ }
+ if (this.moveable) {
+ event.currentTarget.data = event.data;
+ event.currentTarget.alpha = 0.5;
+ event.currentTarget.dragging = true;
+
+ event.currentTarget.dragPoint = event.data.getLocalPosition(event.currentTarget.parent);
+ event.currentTarget.dragPoint.x -= event.currentTarget.x;
+ event.currentTarget.dragPoint.y -= event.currentTarget.y;
+ }
+ })
+ .on('mouseup', event => {
+ if (event.currentTarget.dragging) {
+ event.currentTarget.alpha = 1;
+ event.currentTarget.dragging = false;
+ event.currentTarget.data = null;
+ }
+ })
+ .on('mouseupoutside', event => {
+ if (event.currentTarget.dragging) {
+ event.currentTarget.alpha = 1;
+ event.currentTarget.dragging = false;
+ event.currentTarget.data = null;
+ }
+ })
+ .on('mousemove', event => {
+ if (event.currentTarget.dragging) {
+ const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent);
+ event.currentTarget.x = newPosition.x - event.currentTarget.dragPoint.x;
+ event.currentTarget.y = newPosition.y - event.currentTarget.dragPoint.y;
+ this.assetData.Point = new PIXI.Point(this.x, this.y);
+ this.workingArea.canvasData.isChange = true;
+ }
+ })
+ .on('rightclick', event => {
+
+ })
+ .on('mouseover', event => {
+ event.stopPropagation();
+ })
+ .on('mouseout', event => {
+ event.stopPropagation();
+ });
+ }
+ redraw(): void {
+
+ }
+
+ refresh(): void{
+
+ }
+}
diff --git a/src/app/working-area/model/legend.ts b/src/app/working-area/model/legend.ts
new file mode 100644
index 0000000..e7592db
--- /dev/null
+++ b/src/app/working-area/model/legend.ts
@@ -0,0 +1,68 @@
+import { Graphics, Sprite, Text } from "pixi.js";
+import { WorkingAreaComponent } from "../working-area.component";
+import { AxArrowConnector } from "./axArrowConnector";
+import { AxImageShape } from "./axImageShape";
+import { AxShape } from "./axShape";
+import { MultipointIcon } from "./multipointIcon";
+import { PolygonIcon } from "./polygonIcon";
+
+
+export class Legend extends AxShape{
+ background: Graphics = null;
+ data:Map = new Map()
+ /**
+ *
+ */
+ constructor(workingArea: WorkingAreaComponent) {
+ super(null, workingArea);
+ this.draw();
+ }
+
+ getData() {
+ this.workingArea.backgroundImage.children.forEach(item => {
+ if (item instanceof AxImageShape|| item instanceof AxArrowConnector || item instanceof PolygonIcon || item instanceof MultipointIcon) {
+ if (!this.data.has(item.assetData.Name)) {
+ this.data[item.assetData.Name] = item.assetData.ImageUrl;
+ }
+ }
+ })
+ }
+
+ draw() {
+ this.getData();
+ this.background = new Graphics();
+ this.background.lineStyle(1, 0xff0000);
+ this.background.beginFill(0xffffff);
+ this.background.drawRect(0, 0, 200, 300);
+ this.background.endFill();
+ this.background.x = -(this.parent.width/2/ this.parent.scale.x);
+ this.background.y = -(this.parent.height/2/ this.parent.scale.x);
+ this.addChild(this.background);
+ var showName: Text = new Text('图例');
+ showName.x = 0;
+ showName.y = 0;
+ this.background.addChild(showName);
+ var showDescrption: Text = new Text('说明')
+ showDescrption.x = 100;
+ showDescrption.y = 0;
+ this.background.addChild(showDescrption);
+ let index = 1;
+ this.data.forEach((value, key) => {
+ var image: Sprite = Sprite.from(value);
+ image.width = 32;
+ image.height = 32;
+ image.x = 0;
+ image.y = index * 32;
+ this.background.addChild(image);
+ var description = new Text(key);
+ description.x = 100;
+ description.y = index * 32;
+ this.background.addChild(description);
+ index++;
+ })
+ }
+ redraw() {
+ this.background.destroy();
+ this.draw();
+ }
+}
\ No newline at end of file
diff --git a/src/app/working-area/model/multipointIcon.ts b/src/app/working-area/model/multipointIcon.ts
index d5467a7..e60b148 100644
--- a/src/app/working-area/model/multipointIcon.ts
+++ b/src/app/working-area/model/multipointIcon.ts
@@ -1,11 +1,12 @@
import { WorkingAreaComponent } from '../working-area.component';
import { GameMode } from './gameMode';
import * as PIXI from 'pixi.js';
+import { AxShape } from './axShape';
/**
* 多点连线
*/
-export class MultipointIcon extends PIXI.Container {
+export class MultipointIcon extends AxShape {
public pointsData: PIXI.Point[];
public pointsGraphics: PIXI.Graphics[] = [];
public iconsTilingSprite: PIXI.TilingSprite[] = [];
@@ -34,8 +35,8 @@ export class MultipointIcon extends PIXI.Container {
* @param texture 图片素材
* @param points 点集合
*/
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
+ constructor(assetData: any,workingArea: WorkingAreaComponent) {
+ super(assetData,workingArea);
this.name = this.assetData.Id;
this.pointsData = this.assetData.MultiPoint;
this.x = this.assetData.Point.x;
@@ -56,7 +57,7 @@ export class MultipointIcon extends PIXI.Container {
icon.x = pointA.x;
icon.y = pointA.y;
icon.angle = angle;
- icon.height = this.assetData.Thickness === 0 ? 32 : this.assetData.Thickness;
+ // icon.height = this.assetData.Thickness === 0 ? 32 : this.assetData.Thickness;
this.iconsTilingSprite.push(icon);
this.addChild(icon);
if (i === 0) {
@@ -165,9 +166,6 @@ export class MultipointIcon extends PIXI.Container {
}
})
.on('rightclick', event => {
- })
- .on('mouseover', event => {
-
});
});
// // 缩放
@@ -176,49 +174,50 @@ export class MultipointIcon extends PIXI.Container {
// this.text.scale.set(scale);
// });
// 添加选中事件
- this.iconsTilingSprite.forEach((item, index, array) => {
- item.interactive = true;
- item.on('mousedown', event => {
- event.stopPropagation();
- this.workingArea.selection.selectOne(this);
- if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
- event.currentTarget.parent.data = event.data;
- event.currentTarget.parent.alpha = 0.5;
- event.currentTarget.parent.dragging = true;
-
- event.currentTarget.parent.dragPoint = event.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.dragPoint.x -= event.currentTarget.parent.x;
- event.currentTarget.parent.dragPoint.y -= event.currentTarget.parent.y;
- }
- })
- .on('mouseup', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mouseupoutside', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mousemove', event => {
- if (event.currentTarget.parent.dragging) {
- const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.x = newPosition.x - event.currentTarget.parent.dragPoint.x;
- event.currentTarget.parent.y = newPosition.y - event.currentTarget.parent.dragPoint.y;
-
- this.assetData.Point = new PIXI.Point(this.x, this.y);
- this.workingArea.canvasData.isChange = true;
- }
- })
- .on('rightclick', event => {
-
- });
- });
+ // this.iconsTilingSprite.forEach((item, index, array) => {
+ // item.interactive = true;
+ // item.buttonMode = true;
+ // item.on('mousedown', event => {
+ // event.stopPropagation();
+ // this.workingArea.selection.selectOne(this);
+ // if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
+ // event.currentTarget.parent.data = event.data;
+ // event.currentTarget.parent.alpha = 0.5;
+ // event.currentTarget.parent.dragging = true;
+
+ // event.currentTarget.parent.dragPoint = event.data.getLocalPosition(event.currentTarget.parent.parent);
+ // event.currentTarget.parent.dragPoint.x -= event.currentTarget.parent.x;
+ // event.currentTarget.parent.dragPoint.y -= event.currentTarget.parent.y;
+ // }
+ // })
+ // .on('mouseup', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mouseupoutside', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mousemove', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
+ // event.currentTarget.parent.x = newPosition.x - event.currentTarget.parent.dragPoint.x;
+ // event.currentTarget.parent.y = newPosition.y - event.currentTarget.parent.dragPoint.y;
+
+ // this.assetData.Point = new PIXI.Point(this.x, this.y);
+ // this.workingArea.canvasData.isChange = true;
+ // }
+ // })
+ // .on('rightclick', event => {
+
+ // });
+ // });
}
/**
* 设置点显示状态
@@ -237,12 +236,12 @@ export class MultipointIcon extends PIXI.Container {
}
// 刷新数据
public refresh() {
- console.log(this.assetData);
- this.iconsTilingSprite.forEach(element => {
- element.height = this.assetData.Thickness === 0 ? 32 : this.assetData.Thickness;
- });
+ // console.log(this.assetData);
+ // this.iconsTilingSprite.forEach(element => {
+ // element.height = this.assetData.Thickness === 0 ? 32 : this.assetData.Thickness;
+ // });
this.text.text = this.assetData.Name
+ '\r\n'
+ this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue;
}
-}
\ No newline at end of file
+}
diff --git a/src/app/working-area/model/paintModel.ts b/src/app/working-area/model/paintModel.ts
index 034dd7b..39a06ce 100644
--- a/src/app/working-area/model/paintModel.ts
+++ b/src/app/working-area/model/paintModel.ts
@@ -2,11 +2,32 @@
* 绘制模式
*/
export enum PaintMode {
+ /**
+ * 单点图标
+ */
singlePointIcon,
+ /**
+ * 线段图标
+ */
lineIcon,
+ /**
+ * 自定义多边形
+ */
polygonIcon,
- endPaint,
+ /**
+ * 水带多边形
+ */
Pipeline,
+ /**
+ * 结束绘制
+ */
+ endPaint,
+ /**
+ * 暂无
+ */
Arrows,
- Car
+ /**
+ * 暂无
+ */
+ Car,
}
diff --git a/src/app/working-area/model/pipeline.ts b/src/app/working-area/model/pipeline.ts
deleted file mode 100644
index b85f6ac..0000000
--- a/src/app/working-area/model/pipeline.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import { WorkingAreaComponent } from '../working-area.component';
-import * as PIXI from 'pixi.js';
-
-/**
- * 管线
- */
-export class Pipeline extends PIXI.Container {
- public line: PIXI.Graphics = new PIXI.Graphics();
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
- this.name = this.assetData.Id;
- this.x = this.assetData.Point.x;
- this.y = this.assetData.Point.y;
- this.workingArea.backgroundImage.addChild(this);
- this.addChild(this.line);
- // 画线图标
- this.refresh();
- this.interactive = true;
- this.on('mousedown', event => {
- console.log(this.assetData);
- event.stopPropagation();
- this.workingArea.selection.selectOne(this);
- });
- }
- /**
- * 刷新
- */
- public refresh() {
- this.line.clear();
- this.line.lineStyle(5, 0x0000ff, 1);
- for (let i = 0, count = this.assetData.MultiPoint.length; i < count; i++) {
- const pointA = this.assetData.MultiPoint[i];
- if (i === 0) {
- this.line.moveTo(pointA.x, pointA.y);
- } else {
- this.line.lineTo(pointA.x, pointA.y);
- if (i === count - 1) {
- const pointB = this.assetData.MultiPoint[i - 1];
- const angle = Math.atan2((pointA.y - pointB.y), (pointA.x - pointB.x)) * (180 / Math.PI) + 90;
- this.line.beginFill(0x0000ff);
- this.line.drawStar(pointA.x, pointA.y, 3, 5, 0, (Math.PI / 180 * angle));
- } else {
- this.line.drawCircle(pointA.x, pointA.y, 5);
- }
- }
- }
- this.line.endFill();
- // if (this.assetData.MultiPoint.length >= 2) {
- // const pointA = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 2];
- // const pointB = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 1];
- // const angle = Math.atan2((pointB.y - pointA.y), (pointB.x - pointA.x)) * (180 / Math.PI) + 90;
- // this.beginFill(0x0000ff);
- // this.drawStar(pointB.x, pointB.y, 3, 5, 0, (Math.PI / 180 * angle));
- // this.endFill();
- // }
- }
-}
\ No newline at end of file
diff --git a/src/app/working-area/model/polygonIcon.ts b/src/app/working-area/model/polygonIcon.ts
index 3c604df..20a4a5d 100644
--- a/src/app/working-area/model/polygonIcon.ts
+++ b/src/app/working-area/model/polygonIcon.ts
@@ -1,11 +1,13 @@
import { WorkingAreaComponent } from '../working-area.component';
import { GameMode } from './gameMode';
import * as PIXI from 'pixi.js';
+import { PaintMode } from './paintModel';
+import { AxShape } from './axShape';
/**
* 多边形
*/
-export class PolygonIcon extends PIXI.Container {
+export class PolygonIcon extends AxShape {
public pointsData: PIXI.Point[];
public pointsGraphics: PIXI.Graphics[] = [];
public polygonGraphics: PIXI.Graphics = new PIXI.Graphics();
@@ -34,8 +36,8 @@ export class PolygonIcon extends PIXI.Container {
*
* @param points 点集合
*/
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
+ constructor(assetData: any,workingArea: WorkingAreaComponent) {
+ super(assetData,workingArea);
this.name = this.assetData.Id;
this.x = this.assetData.Point.x;
this.y = this.assetData.Point.y;
@@ -76,6 +78,7 @@ export class PolygonIcon extends PIXI.Container {
// 添加圆点事件
this.pointsGraphics.forEach((item, index, array) => {
item.interactive = true;
+ item.buttonMode = true;
item.zIndex = 1;
item.on('mousedown', event => {
event.stopPropagation();
@@ -123,56 +126,79 @@ export class PolygonIcon extends PIXI.Container {
}
})
.on('rightclick', event => {
- });
- });
- // 添加选中事件
- this.polygonGraphics.interactive = true;
- this.polygonGraphics
- .on('mousedown', event => {
+ }) .on('mouseover', event => {
event.stopPropagation();
- this.workingArea.selection.selectOne(this);
- if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
- event.currentTarget.parent.data = event.data;
- event.currentTarget.parent.alpha = 0.5;
- event.currentTarget.parent.dragging = true;
-
- event.currentTarget.parent.dragPoint = event.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.dragPoint.x -= event.currentTarget.parent.x;
- event.currentTarget.parent.dragPoint.y -= event.currentTarget.parent.y;
- }
- })
- .on('mouseup', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mouseupoutside', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
+ if (this.workingArea.previewImage !== null
+ && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ this.workingArea.previewImage.visible = false;
}
})
- .on('mousemove', event => {
- if (event.currentTarget.parent.dragging) {
- const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.x = newPosition.x - event.currentTarget.parent.dragPoint.x;
- event.currentTarget.parent.y = newPosition.y - event.currentTarget.parent.dragPoint.y;
-
- this.assetData.Point = new PIXI.Point(this.x, this.y);
- this.workingArea.canvasData.isChange = true;
+ .on('mouseout', event => {
+ event.stopPropagation();
+ if (this.workingArea.previewImage !== null
+ && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ this.workingArea.previewImage.visible = true;
}
- })
- .on('rightclick', event => {
- // this.workingArea.selection.deselectAll();
});
- // // 缩放
- // this.workingArea.on('backgroundScale', data => {
- // const scale = 1 / data;
- // this.text.scale.set(scale);
- // });
+ });
+ // // 添加选中事件
+ // this.polygonGraphics.interactive = true;
+ // this.polygonGraphics.buttonMode = true;
+ // this.polygonGraphics
+ // .on('mousedown', event => {
+ // event.stopPropagation();
+ // this.workingArea.selection.selectOne(this);
+ // if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
+ // event.currentTarget.parent.data = event.data;
+ // event.currentTarget.parent.alpha = 0.5;
+ // event.currentTarget.parent.dragging = true;
+
+ // event.currentTarget.parent.dragPoint = event.data.getLocalPosition(event.currentTarget.parent.parent);
+ // event.currentTarget.parent.dragPoint.x -= event.currentTarget.parent.x;
+ // event.currentTarget.parent.dragPoint.y -= event.currentTarget.parent.y;
+ // }
+ // })
+ // .on('mouseup', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mouseupoutside', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // event.currentTarget.parent.alpha = 1;
+ // event.currentTarget.parent.dragging = false;
+ // event.currentTarget.parent.data = null;
+ // }
+ // })
+ // .on('mousemove', event => {
+ // if (event.currentTarget.parent.dragging) {
+ // const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
+ // event.currentTarget.parent.x = newPosition.x - event.currentTarget.parent.dragPoint.x;
+ // event.currentTarget.parent.y = newPosition.y - event.currentTarget.parent.dragPoint.y;
+
+ // this.assetData.Point = new PIXI.Point(this.x, this.y);
+ // this.workingArea.canvasData.isChange = true;
+ // }
+ // })
+ // .on('rightclick', event => {
+ // // this.workingArea.selection.deselectAll();
+ // })
+ // .on('mouseover', event => {
+ // event.stopPropagation();
+ // if (this.workingArea.previewImage !== null
+ // && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ // this.workingArea.previewImage.visible = false;
+ // }
+ // })
+ // .on('mouseout', event => {
+ // event.stopPropagation();
+ // if (this.workingArea.previewImage !== null
+ // && this.workingArea.getPaintMode() === PaintMode.singlePointIcon) {
+ // this.workingArea.previewImage.visible = true;
+ // }
+ // });
}
/**
* 设置点显示状态
@@ -241,4 +267,4 @@ export class PolygonIcon extends PIXI.Container {
this.polygonGraphics.drawPolygon(this.getPoints());
this.polygonGraphics.endFill();
}
-}
\ No newline at end of file
+}
diff --git a/src/app/working-area/model/putCarArea.ts b/src/app/working-area/model/putCarArea.ts
index 7544d04..25480b2 100644
--- a/src/app/working-area/model/putCarArea.ts
+++ b/src/app/working-area/model/putCarArea.ts
@@ -1,59 +1,59 @@
-import { OldFilmFilter } from 'pixi-filters';
-import { WorkingAreaComponent } from '../working-area.component';
-import { PaintMode } from './paintModel';
-import { SinglePointIcon } from './singlePointIcon';
-import * as PIXI from 'pixi.js';
+// import { OldFilmFilter } from 'pixi-filters';
+// import { WorkingAreaComponent } from '../working-area.component';
+// import { PaintMode } from './paintModel';
+// import { SinglePointIcon } from './axImageShape';
+// import * as PIXI from 'pixi.js';
-/**
- * 汽车放置区域
- */
-export class PutCarArea extends PIXI.Container {
- public polygonGraphics: PIXI.Graphics = new PIXI.Graphics();
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
- this.name = this.assetData.Id;
- this.x = this.assetData.Point.x;
- this.y = this.assetData.Point.y;
- this.workingArea.backgroundImage.addChild(this);
- this.sortableChildren = true;
+// /**
+// * 汽车放置区域
+// */
+// export class PutCarArea extends PIXI.Container {
+// public polygonGraphics: PIXI.Graphics = new PIXI.Graphics();
+// constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
+// super();
+// this.name = this.assetData.Id;
+// this.x = this.assetData.Point.x;
+// this.y = this.assetData.Point.y;
+// this.workingArea.backgroundImage.addChild(this);
+// this.sortableChildren = true;
- // 填充多边形
+// // 填充多边形
- const color: number = this.assetData.Color.substring(0, 7).replace('#', '0x');
- const angle: number = parseInt(this.assetData.Color.substring(7), 16) / 255;
- this.polygonGraphics.beginFill(color, angle);
- this.polygonGraphics.drawPolygon(this.assetData.MultiPoint);
- this.polygonGraphics.endFill();
- this.addChild(this.polygonGraphics);
- // 添加选中事件
- this.polygonGraphics.interactive = true;
- this.polygonGraphics
- .on('pointerdown', (event) => {
- if (this.workingArea.getPaintMode() === PaintMode.Car) {
- this.workingArea.selectCar.Point =
- new PIXI.Point(this.workingArea.previewSinglePointIcon.x, this.workingArea.previewSinglePointIcon.y);
- this.workingArea.selectCar.Angle = this.assetData.Direction;
- const car = new SinglePointIcon(this.workingArea.selectCar, this.workingArea);
- this.workingArea.setPaintMode(PaintMode.endPaint);
- }
- })
- .on('pointerup', (event) => {
+// const color: number = this.assetData.Color.substring(0, 7).replace('#', '0x');
+// const angle: number = parseInt(this.assetData.Color.substring(7), 16) / 255;
+// this.polygonGraphics.beginFill(color, angle);
+// this.polygonGraphics.drawPolygon(this.assetData.MultiPoint);
+// this.polygonGraphics.endFill();
+// this.addChild(this.polygonGraphics);
+// // 添加选中事件
+// this.polygonGraphics.interactive = true;
+// this.polygonGraphics
+// .on('pointerdown', (event) => {
+// if (this.workingArea.getPaintMode() === PaintMode.Car) {
+// this.workingArea.selectCar.Point =
+// new PIXI.Point(this.workingArea.previewSinglePointIcon.x, this.workingArea.previewSinglePointIcon.y);
+// this.workingArea.selectCar.Angle = this.assetData.Direction;
+// const car = new SinglePointIcon(this.workingArea.selectCar, this.workingArea);
+// this.workingArea.setPaintMode(PaintMode.endPaint);
+// }
+// })
+// .on('pointerup', (event) => {
- })
- .on('pointerupoutside', (event) => {
+// })
+// .on('pointerupoutside', (event) => {
- })
- .on('pointerover', (event) => {
- this.workingArea.previewSinglePointIcon.filters = null;
- this.workingArea.previewSinglePointIcon.zIndex = this.zIndex + 1;
- // 设置车辆方向
- this.workingArea.previewSinglePointIcon.angle = this.assetData.Direction;
- console.log(this.assetData.Name);
- })
- .on('pointerout', (event) => {
- this.workingArea.previewSinglePointIcon.filters = [
- new OldFilmFilter()
- ];
- });
- }
-}
\ No newline at end of file
+// })
+// .on('pointerover', (event) => {
+// this.workingArea.previewSinglePointIcon.filters = null;
+// this.workingArea.previewSinglePointIcon.zIndex = this.zIndex + 1;
+// // 设置车辆方向
+// this.workingArea.previewSinglePointIcon.angle = this.assetData.Direction;
+// console.log(this.assetData.Name);
+// })
+// .on('pointerout', (event) => {
+// this.workingArea.previewSinglePointIcon.filters = [
+// new OldFilmFilter()
+// ];
+// });
+// }
+// }
diff --git a/src/app/working-area/model/singlePointIcon.ts b/src/app/working-area/model/singlePointIcon.ts
deleted file mode 100644
index f60c9bd..0000000
--- a/src/app/working-area/model/singlePointIcon.ts
+++ /dev/null
@@ -1,249 +0,0 @@
-import { WorkingAreaComponent } from '../working-area.component';
-import * as ObjectID from 'bson-objectid';
-import { GameMode } from './gameMode';
-import { Pipeline } from './pipeline';
-import { PaintMode } from './paintModel';
-import * as PIXI from 'pixi.js';
-import { throwMatDialogContentAlreadyAttachedError } from '@angular/material/dialog';
-
-/**
- * 单点图标
- */
-export class SinglePointIcon extends PIXI.Container {
- style = new PIXI.TextStyle({
- fontFamily: 'Arial',
- fontSize: 18,
- fontStyle: 'normal',
- fontWeight: 'bold',
- fill: ['#000000'],
- stroke: '#ffffff',
- strokeThickness: 3,
- dropShadow: true,
- dropShadowColor: '#000000',
- dropShadowBlur: 3,
- dropShadowAngle: Math.PI / 6,
- dropShadowDistance: 1,
- wordWrap: false,
- wordWrapWidth: 100,
- });
-
- public text = new PIXI.Text(this.assetData.Name
- + '\r\n'
- + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
-
- /**
- * 选中圆点
- */
- public selectedPointTexture = PIXI.Texture.from('assets/images/handle-main.png');
- private image = PIXI.Sprite.from(this.assetData.ImageUrl);
- public graphics = new PIXI.Graphics();
- public connectionPoint = new PIXI.Graphics();
-
- // 显示连接点
- public showConnectionPoint = false;
-
- constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
- super();
- this.workingArea.backgroundImage.addChild(this);
- this.x = this.assetData.Point.x;
- this.y = this.assetData.Point.y;
- this.name = this.assetData.Id;
-
- this.image.angle = this.assetData.Angle;
-
- this.image.x = 0;
- this.image.y = 0;
- this.image.width = this.assetData.Width;
- this.image.height = this.assetData.Height;
-
- this.image.alpha = 1;
- this.image.anchor.set(0.5);
- this.image.interactive = true;
- this.image
- .on('mousedown', event => {
- event.stopPropagation();
- this.workingArea.selection.selectOne(this);
- if (this.assetData.CanConnection && this.parent === this.workingArea.backgroundImage) {
- if (this.workingArea.getPaintMode() === PaintMode.Pipeline) {
- if (this.workingArea.paintingPipeline === null) {
- this.workingArea.previewLineSegment.visible = true;
- this.workingArea.currentClickPoint.position =
- new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
- this.workingArea.paintPoints.push(new PIXI.Point(this.position.x, this.position.y));
- const tempData = {
- Id: ObjectID.default.generate(),
- MultiPoint: JSON.parse(JSON.stringify(this.workingArea.paintPoints)),
- Point: new PIXI.Point(0, 0),
- Name: '管线',
- LinkedObjects: [],
- };
- this.workingArea.paintingPipeline = new Pipeline(tempData, this.workingArea);
- this.workingArea.paintingPipeline.assetData.LinkedObjects.push(this);
- this.assetData.Pipelines.push(this.workingArea.paintingPipeline);
- } else {
- this.workingArea.previewLineSegment.visible = false;
- this.workingArea.currentClickPoint.position =
- new PIXI.Point(this.workingArea.circleShadow.x, this.workingArea.circleShadow.y);
- this.workingArea.paintPoints.push(new PIXI.Point(this.position.x, this.position.y));
- this.workingArea.paintingPipeline.assetData.MultiPoint =
- JSON.parse(JSON.stringify(this.workingArea.paintPoints));
- this.workingArea.paintingPipeline.assetData.LinkedObjects.push(this);
- this.assetData.Pipelines.push(this.workingArea.paintingPipeline);
- this.workingArea.paintingPipeline.refresh();
- this.workingArea.paintingPipelineFinish();
- }
- }
- }
- // 如果链接对象不为空,禁止移动
- if (this.workingArea.allowEdit && this.assetData.GameMode === this.workingArea.canvasData.gameMode) {
- event.currentTarget.parent.data = event.data;
- event.currentTarget.parent.alpha = 0.5;
- event.currentTarget.parent.dragging = true;
- }
- })
- .on('mouseup', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mouseupoutside', event => {
- if (event.currentTarget.parent.dragging) {
- event.currentTarget.parent.alpha = 1;
- event.currentTarget.parent.dragging = false;
- event.currentTarget.parent.data = null;
- }
- })
- .on('mousemove', event => {
- if (event.currentTarget.parent.dragging) {
- // 如果拖动过程中发现父对象不是背景图
- if (this.parent !== this.workingArea.backgroundImage) {
- this.setParent(this.workingArea.backgroundImage);
- if (this.assetData.FixedSize) {
- const scale = 1 / this.workingArea.backgroundImage.scale.x;
- this.scale.set(scale);
- }
- }
- const newPosition = event.currentTarget.parent.data.getLocalPosition(event.currentTarget.parent.parent);
- event.currentTarget.parent.x = newPosition.x;
- event.currentTarget.parent.y = newPosition.y;
- this.assetData.Point = new PIXI.Point(this.x, this.y);
- this.workingArea.canvasData.isChange = true;
- }
- })
- .on('rightclick', event => {
-
- })
- .on('mouseover', event => {
- // this.connectionPoint.visible = true;
- this.setSelectionBox(true);
- })
- .on('mouseout', event => {
- // this.connectionPoint.visible = false;
- this.setSelectionBox(false);
- });
- this.text.x = this.image.x;
- this.text.y = this.image.y - this.image.height / 2;
- this.text.anchor.set(0.5, 1);
-
- if (this.assetData.GameMode === 2) {
- this.text.visible = false;
- }
-
- this.connectionPoint.beginFill();
- this.connectionPoint.drawCircle(0, 0, 5);
- this.connectionPoint.endFill();
- this.connectionPoint.visible = true;
- this.connectionPoint.interactive = true;
- this.connectionPoint
- .on('mouseover', event => {
- console.log('b');
- this.graphics.lineStyle(2, 0x00EB00, 1);
- this.graphics.drawRect(- this.connectionPoint.width / 2, - this.connectionPoint.width / 2,
- this.connectionPoint.width, this.connectionPoint.width);
- })
- .on('mouseout', event => {
- this.graphics.clear();
- });
- this.addChild(this.text);
- this.addChild(this.image);
- this.addChild(this.graphics);
- // this.addChild(this.connectionPoint);
-
- // // up
- // const up = new PIXI.Sprite(this.selectedPointTexture);
- // up.anchor.set(0.5);
- // up.x = this.image.x;
- // up.y = this.image.y - (this.image.height / 2);
- // this.addChild(up);
- // // up-left
- // const upLeft = new PIXI.Sprite(this.selectedPointTexture);
- // upLeft.anchor.set(0.5);
- // upLeft.x = this.image.x - (this.image.width / 2);
- // upLeft.y = this.image.y - (this.image.height / 2);
- // this.addChild(upLeft);
- // // up-right
- // const upRight = new PIXI.Sprite(this.selectedPointTexture);
- // upRight.anchor.set(0.5);
- // upRight.x = this.image.x + (this.image.width / 2);
- // upRight.y = this.image.y - (this.image.height / 2);
- // this.addChild(upRight);
- // // down
- // const down = new PIXI.Sprite(this.selectedPointTexture);
- // down.anchor.set(0.5);
- // down.x = this.image.x;
- // down.y = this.image.y + (this.image.height / 2);
- // this.addChild(down);
- // // down-left
- // const downLeft = new PIXI.Sprite(this.selectedPointTexture);
- // downLeft.anchor.set(0.5);
- // downLeft.x = this.image.x - (this.image.width / 2);
- // downLeft.y = this.image.y + (this.image.height / 2);
- // this.addChild(downLeft);
- // // down-right
- // const downRight = new PIXI.Sprite(this.selectedPointTexture);
- // downRight.anchor.set(0.5);
- // downRight.x = this.image.x + (this.image.width / 2);
- // downRight.y = this.image.y + (this.image.height / 2);
- // this.addChild(downRight);
- // // left
- // const left = new PIXI.Sprite(this.selectedPointTexture);
- // left.anchor.set(0.5);
- // left.x = this.image.x - (this.image.width / 2);
- // left.y = this.image.y;
- // this.addChild(left);
- // // right
- // const right = new PIXI.Sprite(this.selectedPointTexture);
- // right.anchor.set(0.5);
- // right.x = this.image.x + (this.image.width / 2);
- // right.y = this.image.y;
- // this.addChild(right);
- }
- // 设置选择框
- public setSelectionBox(b: boolean) {
- if (b) {
- this.graphics.lineStyle(2, 0x00EB00, 1);
- this.graphics.drawRect(- this.image.width / 2, - this.image.height / 2, this.image.width, this.image.height);
- } else {
- this.graphics.clear();
- }
- }
- // 设置名称
- public setNameVisible(value: boolean, mode: GameMode) {
- if (this.assetData.GameMode === mode) {
- this.text.visible = value;
- }
- }
- // 刷新
- public refresh() {
- this.image.width = this.assetData.Width;
- this.image.height = this.assetData.Height;
- this.image.angle = this.assetData.Angle;
- this.text.text = this.assetData.Name
- + '\r\n'
- + this.assetData.PropertyInfos?.find(item => item.PropertyName === '名称/编号')?.PropertyValue;
- this.text.x = this.image.x;
- this.text.y = this.image.y - this.image.height / 2;
- }
-}
diff --git a/src/app/working-area/working-area.component.ts b/src/app/working-area/working-area.component.ts
index 6a68e12..0718adf 100644
--- a/src/app/working-area/working-area.component.ts
+++ b/src/app/working-area/working-area.component.ts
@@ -2,18 +2,20 @@ import { Component, OnInit, ElementRef, ViewChild, AfterViewInit, Input } from '
import * as PIXI from 'pixi.js';
import { EventEmitter } from 'events';
import { EventManager } from '@angular/platform-browser';
-import { OutlineFilter, OldFilmFilter } from 'pixi-filters';
-import { CanvasShareDataService, DisposalNodeData, FloorNodeData } from '../canvas-share-data.service';
+import { OutlineFilter } from 'pixi-filters';
+import { AssetData, CanvasShareDataService, DisposalNodeData, FloorNodeData } from '../canvas-share-data.service';
import * as ObjectID from 'bson-objectid';
import { Charm } from './charm';
-import { SinglePointIcon } from './model/singlePointIcon';
+import { AxImageShape } from './model/axImageShape';
import { GameMode } from './model/gameMode';
import { MultipointIcon } from './model/multipointIcon';
import { PolygonIcon } from './model/polygonIcon';
-import { PutCarArea } from './model/putCarArea';
-import { Arrows } from './model/arrows';
-import { Pipeline } from './model/pipeline';
import { PaintMode } from './model/paintModel';
+import { AxShape } from './model/axShape';
+import { PropertyInfo } from './model/PropertyInfo';
+import { AxPreviewImageShape } from './model/axPreviewImageShape';
+import { AxArrowConnector } from './model/axArrowConnector';
+import { Legend } from './model/legend';
@Component({
@@ -47,11 +49,11 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 背景图
*/
- public backgroundImage: PIXI.Sprite;
+ public backgroundImage: PIXI.Sprite = null;
/**
- * 预览单点图标
+ * 绘制图片形状时预览状态的图片
*/
- public previewSinglePointIcon = new PIXI.Sprite();
+ public previewImage: AxPreviewImageShape = null;
/**
* 预览线段
*/
@@ -67,7 +69,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 绘画模式
*/
- private paintMode: PaintMode;
+ private paintMode: PaintMode = PaintMode.endPaint;
/**
* 选择器
*/
@@ -80,18 +82,14 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* 绘制点集合
*/
public paintPoints: PIXI.Point[] = [];
- /**
- * 绘制中的管线
- */
- public paintingPipeline: Pipeline = null;
- /**
- * 绘制中的箭头
- */
- public paintingArrows: Arrows = null;
/**
* 绘制中的多点图标
*/
public paintingIcon: MultipointIcon;
+ /**
+ * 绘制中的图形
+ */
+ public paintingShape: AxShape = null;
/**
* 绘制中的连线
*/
@@ -152,19 +150,33 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.visible = false;
this.rectToolGraphics.clear();
}
+ // 按Del键删除选中的图标
if (event.keyCode === 46) {
this.selection.objects.forEach(item => {
- // 删除 选中的数据
- if (item.assetData?.IsFromBuilding) {
- delete this.canvasData.originalcompanyBuildingData?.data[item.assetData.Id];
- } else {
- delete this.canvasData.originaleveryStoreyData?.data[item.assetData.Id];
- }
- // 删除选中的图标
- this.backgroundImage.removeChild(this.backgroundImage.getChildByName(item.assetData.Id));
- // 标记
- this.canvasData.isChange = true;
+ if (this.allowEdit
+ && this.canvasData.gameMode === item.assetData.GameMode) {
+ switch (this.canvasData.gameMode) {
+ case 0:
+ // 删除楼层数据
+ delete this.canvasData.originaleveryStoreyData.data[item.assetData.Id];
+ // 删除建筑数据
+ delete this.canvasData.originalcompanyBuildingData.data[item.assetData.Id];
+ // 取消渲染
+ this.backgroundImage.removeChild(this.backgroundImage.getChildByName(item.assetData.Id));
+ // 数据更改
+ this.canvasData.isChange = true;
+ break;
+ case 1:
+ delete this.canvasData.selectPanelPoint.Data.DefinedIncrement[item.assetData.Id];
+ delete this.canvasData.selectPanelPoint.Data.Increment[item.assetData.Id];
+ delete this.canvasData.selectPanelPoint.Data.Stock[item.assetData.Id];
+ this.backgroundImage.removeChild(this.backgroundImage.getChildByName(item.assetData.Id));
+ this.canvasData.isChange = true;
+ break;
+ }
+ }
});
+ this.selection.deselectAll();
this.emit('deleteIcon');
}
});
@@ -175,7 +187,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
ngAfterViewInit(): void {
this.createCanvas();
window.onresize = () => {
- this.resizeCanvas();
+ this.resetCanvas();
};
}
/**
@@ -261,11 +273,18 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.app.ticker.add((delta) => {
this.animator.update();
this.mousePosition = this.app.renderer.plugins.interaction.mouse.global;
- if (this.backgroundImage !== undefined) {
- this.previewSinglePointIcon.position = this.backgroundImage.toLocal(this.mousePosition);
+ // 预览图片
+ if (this.previewImage !== null) {
+ this.previewImage.position = this.backgroundImage.toLocal(this.mousePosition);
+ }
+
+ if (this.backgroundImage !== null) {
this.circleShadow.position = this.backgroundImage.toLocal(this.mousePosition);
this.refreshPreviewLineSegment(this.currentClickPoint.position, this.circleShadow.position);
}
+ /**
+ * 显示框选
+ */
if (this.rectToolGraphics.visible === true) {
const init = this.initialScreenMousePos;
@@ -274,23 +293,38 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.clear();
this.rectToolGraphics.lineStyle(2, 0x00ff00, 1);
this.rectToolGraphics.beginFill(0xccccf2, 0.25);
- this.rectToolGraphics.drawRect(init.x, init.y, final.x - init.x, final.y - init.y);
+ if (final.x > init.x && final.y > init.y) {
+ this.rectToolGraphics.drawRect(init.x, init.y, final.x - init.x, final.y - init.y);
+ } else if (final.x > init.x && final.y < init.y) {
+ this.rectToolGraphics.drawRect(init.x, final.y, final.x - init.x, init.y - final.y);
+ } else if (final.x < init.x && final.y > init.y) {
+ this.rectToolGraphics.drawRect(final.x, init.y, init.x - final.x, final.y - init.y);
+ } else if (final.x < init.x && final.y < init.y) {
+ this.rectToolGraphics.drawRect(final.x, final.y, init.x - final.x, init.y - final.y);
+ }
this.rectToolGraphics.endFill();
- this.rectToolGraphics.closePath();
- }
- if (this.paintingArrows !== null) {
- this.paintingArrows.assetData.pointB = new PIXI.Point(this.circleShadow.position.x, this.circleShadow.position.y);
- this.paintingArrows.refresh();
}
});
-
+ /**
+ * 选中事件
+ */
this.on('select', obj => {
- this.moveIconToScreenCenter(obj);
if (this.allowEdit) {
- if (obj instanceof MultipointIcon) {
- obj.setPointVisiable(true);
+ if (obj instanceof AxArrowConnector) {
+ obj.setPointsVisible(true);
+ }
+ else if (obj instanceof MultipointIcon) {
+ if (obj.assetData.GameMode === this.canvasData.gameMode) {
+ obj.setPointVisiable(true);
+ } else {
+ obj.filters = [this.outlineFilterGreen];
+ }
} else if (obj instanceof PolygonIcon) {
- obj.setPointVisiable(true);
+ if (obj.assetData.GameMode === this.canvasData.gameMode) {
+ obj.setPointVisiable(true);
+ } else {
+ obj.filters = [this.outlineFilterGreen];
+ }
} else {
obj.filters = [this.outlineFilterGreen];
}
@@ -298,11 +332,18 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
obj.filters = [this.outlineFilterGreen];
}
});
+ /**
+ * 取消选中事件
+ */
this.on('deselect', obj => {
if (this.allowEdit) {
- if (obj instanceof MultipointIcon) {
+ if (obj instanceof AxArrowConnector) {
+ obj.setPointsVisible(false);
+ }
+ else if (obj instanceof MultipointIcon) {
obj.setPointVisiable(false);
} else if (obj instanceof PolygonIcon) {
+ obj.filters = [];
obj.setPointVisiable(false);
} else {
obj.filters = [];
@@ -311,10 +352,12 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
obj.filters = [];
}
});
+ /**
+ * 根据背景缩放事件
+ */
this.on('backgroundScale', scale => {
- this.previewSinglePointIcon.scale.set(1 / this.backgroundImage.scale.x);
- this.backgroundImage.children.forEach(item => {
- if (item instanceof SinglePointIcon) {
+ this.backgroundImage?.children.forEach(item => {
+ if (item instanceof AxImageShape) {
if (item.assetData.FixedSize) {
const data = 1 / scale;
item.scale.set(data);
@@ -328,18 +371,32 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
} else if (item instanceof PolygonIcon) {
const data = 1 / scale;
item.text.scale.set(data);
+ item.pointsGraphics.forEach(point => {
+ point.scale.set(data);
+ });
+ } else if (item instanceof AxPreviewImageShape) {
+ const data = 1 / scale;
+ item.scale.set(data);
+ }else if (item instanceof AxArrowConnector) {
+ const data = 1 / scale;
+ item.text.scale.set(data);
+ item.pointSprites.forEach(point => {
+ point.scale.set(data);
+ });
}
});
+
});
+ /**
+ * 创建图标事件
+ */
this.on('createIcon', obj => {
if (obj.assetData.GameMode === GameMode.BasicInformation) {
- if (obj.assetData.IsFromBuilding) {
- this.canvasData.originalcompanyBuildingData.data[obj.assetData.Id] = obj.assetData;
- } else {
- this.canvasData.originaleveryStoreyData.data[obj.assetData.Id] = obj.assetData;
- }
+ // 添加楼层数据
+ this.canvasData.originaleveryStoreyData.data[obj.assetData.Id] = obj.assetData;
+ // 添加建筑数据
+ this.canvasData.originalcompanyBuildingData.data[obj.assetData.Id] = obj.assetData;
} else {
- // console.log();
if (this.canvasData.selectPanelPoint.Data === undefined
|| this.canvasData.selectPanelPoint.Data === null) {
this.canvasData.selectPanelPoint.Data = new FloorNodeData();
@@ -352,7 +409,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 重置画布
*/
- public resizeCanvas() {
+ public resetCanvas() {
this.app.renderer.resize(this.content.nativeElement.clientWidth, this.content.nativeElement.clientHeight);
}
/**
@@ -362,7 +419,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
*/
public setNameVisible(value: boolean, mode: GameMode): void {
this.backgroundImage?.children.forEach(item => {
- if (item instanceof SinglePointIcon) {
+ if (item instanceof AxImageShape) {
item.setNameVisible(value, mode);
} else if (item instanceof MultipointIcon) {
item.setNameVisible(value, mode);
@@ -377,12 +434,15 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
*/
public refreshIcon(id: string): void {
const icon = this.backgroundImage.children.find(item => item.name === id);
- if (icon instanceof SinglePointIcon) {
+ console.log(icon);
+ if (icon instanceof AxImageShape) {
icon.refresh();
} else if (icon instanceof MultipointIcon) {
icon.refresh();
} else if (icon instanceof PolygonIcon) {
icon.refresh();
+ } else if (icon instanceof AxArrowConnector) {
+ icon.redraw();
}
}
/**
@@ -391,8 +451,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
*/
public setIconScale(value: number): void {
this.backgroundImage.children.forEach(item => {
- if (item instanceof SinglePointIcon) {
- item.scale.set(value);
+ if (item instanceof AxImageShape) {
+ console.log(item.image.scale);
+ item.image.scale.set(value);
} else if (item instanceof MultipointIcon) {
} else if (item instanceof PolygonIcon) {
@@ -414,51 +475,54 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
});
}
/**
- * 刷新
+ * 刷新工作区
*/
public async refresh() {
- this.resizeCanvas();
+ this.setPaintMode(PaintMode.endPaint);
+ this.resetCanvas();
this.destroyBackgroundImage();
- await this.createBackgroundImage(this.canvasData.selectStorey.imageUrl);
-
- // this.refreshBackgroundImage();
- this.versionChecking();
-
+ if (!this.canvasData.selectStorey.imageUrl) {
+ return;
+ }
+ await this.createBackgroundImage(this.canvasData.selectStorey.imageUrl);
+ this.createFloorShape();
+ if (this.canvasData.gameMode === GameMode.Assignment) {
+ this.createWorkNode();
+ }
+ this.emit('backgroundScale', this.backgroundImage.scale.x);
+ }
+ /**
+ * 创建楼层图形
+ */
+ private createFloorShape() {
const floorData = this.canvasData.originaleveryStoreyData.data;
- const buildingData = this.canvasData.originalcompanyBuildingData.data;
- const floor = this.canvasData.selectStorey;
-
- // // key=>属性名 data[key]=>属性值
Object.keys(floorData).forEach((key) => {
switch (floorData[key].InteractiveMode) {
- case 0:
- const singleIcon = new SinglePointIcon(floorData[key], this);
+ case 0:
+ const singleIcon = new AxImageShape(floorData[key], this);
+ singleIcon.moveable = this.allowEdit && this.canvasData.gameMode === singleIcon.assetData.GameMode;
break;
- case 1:
+ case 1:
const icon = new MultipointIcon(floorData[key], this);
break;
- case 2:
+ case 2:
const polygonIcon = new PolygonIcon(floorData[key], this);
break;
+ case 3:
+ if (floorData[key].Name === '水带') {
+ const distance = new AxArrowConnector(floorData[key], this,false,true);
+ } else if(floorData[key].Name === '距离'){
+ const distance = new AxArrowConnector(floorData[key], this,true,true);
+ }else if(floorData[key].Name === '普通墙' || floorData[key].Name === '承重墙'){
+ const wall = new AxArrowConnector(floorData[key], this,false,false);
+ }
+ break;
}
});
- Object.keys(buildingData).forEach((key) => {
- if (buildingData[key].FloorId === floor.id) {
- switch (buildingData[key].InteractiveMode) {
- case 0:
- const singleIcon = new SinglePointIcon(buildingData[key], this);
- break;
- case 1:
- const icon = new MultipointIcon(buildingData[key], this);
- break;
- case 2:
- const polygonIcon = new PolygonIcon(buildingData[key], this);
- break;
- }
- }
- });
+ }
+ private createWorkNode() {
// 加载处置节点数据
const nodeData = this.canvasData.selectPanelPoint.Data;
if (nodeData !== undefined && nodeData !== null) {
@@ -466,19 +530,22 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
Object.keys(nodeData[key]).forEach((tempKey) => {
switch (nodeData[key][tempKey].InteractiveMode) {
case 0:
- const singleIcon = new SinglePointIcon(nodeData[key][tempKey], this);
- break;
- case 1:
- const icon = new MultipointIcon(nodeData[key][tempKey], this);
+ const singleIcon = new AxImageShape(nodeData[key][tempKey], this);
+ singleIcon.moveable = this.allowEdit && this.canvasData.gameMode === singleIcon.assetData.GameMode;
break;
- case 2:
+ case 1:
+ const icon = new MultipointIcon(nodeData[key][tempKey], this);
+ break;
+ case 2:
const polygonIcon = new PolygonIcon(nodeData[key][tempKey], this);
break;
+ case 3:
+ const pipeline = new AxArrowConnector(nodeData[key][tempKey], this,false,true);
+ break;
}
});
});
}
- this.emit('backgroundScale', this.backgroundImage.scale.x);
}
/**
*
@@ -490,45 +557,44 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.backgroundImage.getChildByName(item).visible = b;
});
}
- /**
- * 版本检查
- */
- public versionChecking(): void {
- const floorData = this.canvasData.originaleveryStoreyData;
- const buildingData = this.canvasData.originalcompanyBuildingData;
- const nodeData = this.canvasData.selectPanelPoint;
- if (floorData.version && floorData.version === '1.0') {
- floorData.version = '2.0';
- Object.keys(floorData.data).forEach(item => {
- floorData.data[item].Point.y *= -1;
- floorData.data[item].MultiPoint?.forEach(element => {
- element.y *= -1;
- });
- });
- }
- if (buildingData.version && buildingData.version === '1.0') {
- buildingData.version = '2.0';
- Object.keys(buildingData.data).forEach(item => {
- buildingData.data[item].Point.y *= -1;
- buildingData.data[item].MultiPoint?.forEach(element => {
- element.y *= -1;
- });
- });
- }
- console.log(nodeData.Version);
- if (nodeData.Version && nodeData.Version === '1.0') {
- nodeData.Version = '2.0';
- console.log(this.canvasData.selectPanelPoint.Version);
- Object.keys(nodeData.Data).forEach((key) => {
- Object.keys(nodeData.Data[key]).forEach((tempKey) => {
- nodeData.Data[key][tempKey].Point.y *= -1;
- nodeData.Data[key][tempKey].MultiPoint?.forEach(element => {
- element.y *= -1;
- });
- });
- });
- }
- }
+ // /**
+ // * 版本检查
+ // */
+ // public versionChecking(): void {
+ // const floorData = this.canvasData.originaleveryStoreyData;
+ // const buildingData = this.canvasData.originalcompanyBuildingData;
+ // const nodeData = this.canvasData.selectPanelPoint;
+ // if (floorData.version && floorData.version === '1.0') {
+ // floorData.version = '2.0';
+ // Object.keys(floorData.data).forEach(item => {
+ // floorData.data[item].Point.y *= -1;
+ // floorData.data[item].MultiPoint?.forEach(element => {
+ // element.y *= -1;
+ // });
+ // });
+ // }
+ // if (buildingData.version && buildingData.version === '1.0') {
+ // buildingData.version = '2.0';
+ // Object.keys(buildingData.data).forEach(item => {
+ // buildingData.data[item].Point.y *= -1;
+ // buildingData.data[item].MultiPoint?.forEach(element => {
+ // element.y *= -1;
+ // });
+ // });
+ // }
+ // if (nodeData.Version && nodeData.Version === '1.0') {
+ // nodeData.Version = '2.0';
+ // console.log(this.canvasData.selectPanelPoint.Version);
+ // Object.keys(nodeData.Data).forEach((key) => {
+ // Object.keys(nodeData.Data[key]).forEach((tempKey) => {
+ // nodeData.Data[key][tempKey].Point.y *= -1;
+ // nodeData.Data[key][tempKey].MultiPoint?.forEach(element => {
+ // element.y *= -1;
+ // });
+ // });
+ // });
+ // }
+ // }
/**
* 创建确认绘制结束按钮
*/
@@ -559,7 +625,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.backgroundImage.y = this.app.view.height / 2;
this.backgroundImage.interactive = true;
this.backgroundImage.name = 'background';
-
+ this.backgroundImage.angle = this.canvasData.selectStorey.imageAngle;
// const left = this.init.element.nativeElement.querySelector('.functionalDomainLeft').clientWidth;
// const right = this.init.element.nativeElement.querySelector('.functionalDomainRight').clientWidth;
const imageWidth = this.backgroundImage.texture.width;
@@ -594,8 +660,11 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const property = new PropertyInfo(element);
list.push(property);
});
- const assetData = {
+
+ const assetData = {
TemplateId: this.canvasData.selectTemplateData.id,
+ CanConnect: this.canvasData.selectTemplateData.canConnect,
+ Pipelines: new Array(),
FloorId: this.canvasData.selectStorey.id,
Angle: this.canvasData.selectTemplateData.angle,
Color: this.canvasData.selectTemplateData.color,
@@ -609,7 +678,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
ImageUrl: this.canvasData.selectTemplateData.imageUrl,
InteractiveMode: this.canvasData.selectTemplateData.interactiveMode,
MultiPoint : null,
- Point: new PIXI.Point(this.previewSinglePointIcon.x, this.previewSinglePointIcon.y),
+ Point: new PIXI.Point(this.previewImage.x, this.previewImage.y),
Name : this.canvasData.selectTemplateData.name,
PropertyInfos: list,
Border : this.canvasData.selectTemplateData.border,
@@ -618,7 +687,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
IsFromBuilding : this.canvasData.selectTemplateData.isFromBuilding,
GameMode : this.canvasData.gameMode
};
- const singleIcon = new SinglePointIcon(assetData, this);
+ const singleIcon = new AxImageShape(assetData, this);
this.emit('createIcon', singleIcon);
this.emit('backgroundScale', this.backgroundImage.scale.x);
break;
@@ -703,33 +772,64 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
// this.paintingIcon = new PolygonIcon(this.paintPoints, this);
break;
case PaintMode.Pipeline:
- if (this.paintingPipeline !== null) {
+ if (this.canvasData.selectTemplateData.name === '水带') {
+ if (this.paintingShape !== null) {
+ this.currentClickPoint.position = new PIXI.Point(this.circleShadow.x, this.circleShadow.y);
+ this.paintPoints.push(new PIXI.Point(this.circleShadow.x, this.circleShadow.y));
+ this.paintingShape.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
+ this.paintingShape.refresh();
+ }
+ } else {
+ this.previewLineSegment.visible = true;
+ this.enterPaintEndButton.position = this.circleShadow.position;
+ this.enterPaintEndButton.visible = true;
this.currentClickPoint.position = new PIXI.Point(this.circleShadow.x, this.circleShadow.y);
this.paintPoints.push(new PIXI.Point(this.circleShadow.x, this.circleShadow.y));
- this.paintingPipeline.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
- this.paintingPipeline.refresh();
- }
- // this.emit('backgroundScale', this.backgroundImage.scale.x);
- break;
- case PaintMode.Arrows:
- if (this.paintingArrows === null) {
- const data = {
- Id: ObjectID.default.generate(),
- name: 'string',
- point: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
- pointA: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
- pointB: new PIXI.Point(this.circleShadow.x, this.circleShadow.y),
- source: 'assets/images/进攻方向.png',
- };
- this.paintingArrows = new Arrows(data, this);
- } else {
- this.paintingArrows.ready = true;
- this.paintingArrows = null;
- this.paintMode = PaintMode.endPaint;
+ if (this.paintPoints.length < 2) {
+ return;
+ }
+ if (this.paintingShape === null) {
+ const jsonObject = JSON.parse(JSON.stringify(this.canvasData.selectTemplateData.propertyInfos));
+ const propertyList = [];
+ jsonObject.forEach(element => {
+ const property = new PropertyInfo(element);
+ propertyList.push(property);
+ });
+ const assetData2 = {
+ TemplateId: this.canvasData.selectTemplateData.id,
+ FloorId: this.canvasData.selectStorey.id,
+ Angle: this.canvasData.selectTemplateData.angle,
+ Color: this.canvasData.selectTemplateData.color,
+ Enabled: this.canvasData.selectTemplateData.enabled,
+ FillMode: this.canvasData.selectTemplateData.fillMode,
+ FireElementId: this.canvasData.selectTemplateData.fireElementId,
+ FixedSize: this.canvasData.selectTemplateData.fixedSize,
+ Height: 32,
+ Width: 32,
+ Id: ObjectID.default.generate(),
+ ImageUrl: this.canvasData.selectTemplateData.imageUrl,
+ InteractiveMode: this.canvasData.selectTemplateData.interactiveMode,
+ MultiPoint: JSON.parse(JSON.stringify(this.paintPoints)),
+ Point: new PIXI.Point(0, 0),
+ Name: this.canvasData.selectTemplateData.name,
+ PropertyInfos: propertyList,
+ Border: this.canvasData.selectTemplateData.border,
+ DrawMode: this.canvasData.selectTemplateData.drawMode,
+ Thickness: this.canvasData.selectTemplateData.thickness,
+ IsFromBuilding: this.canvasData.selectTemplateData.isFromBuilding,
+ GameMode: this.canvasData.gameMode
+ };
+ if (this.canvasData.selectTemplateData.name === '距离') {
+ this.paintingShape = new AxArrowConnector(assetData2, this,true,true);
+ } else if (this.canvasData.selectTemplateData.name === '普通墙' || this.canvasData.selectTemplateData.name === '承重墙') {
+ this.paintingShape = new AxArrowConnector(assetData2, this,false,false);
+ }
+ } else {
+ this.paintingShape.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
+ this.paintingShape.redraw();
+ }
}
- break;
- case PaintMode.Car:
- // console.log('创建车辆');
+ this.emit('backgroundScale', this.backgroundImage.scale.x);
break;
}
} else if (!event.currentTarget.dragging && this.selection.isMultiselection === true) {
@@ -746,11 +846,15 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
if (this.rectToolGraphics.visible === true) {
this.backgroundImage.children.forEach(item => {
- if (item instanceof SinglePointIcon
+ if ( item instanceof AxImageShape
|| item instanceof MultipointIcon
- || item instanceof PolygonIcon) {
- if (this.rectToolGraphics.getLocalBounds().contains(item.x, item.y)) {
- this.selection.select(item);
+ || item instanceof PolygonIcon
+ || item instanceof AxArrowConnector) {
+ // 判断2个矩形是否相交
+ const rect1 = this.rectToolGraphics.getBounds();
+ const rect2 = item.getBounds();
+ if (this.isOverlap(rect1, rect2)) {
+ this.selection.select(item);
}
}
});
@@ -774,25 +878,45 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.finalScreenMousePos = this.backgroundImage.toLocal(this.mousePosition);
}
}
- }).on('rightclick', event => {
+ })
+ .on('rightclick', event => {
event.stopPropagation();
- this.cancelPaint();
this.selection.deselectAll();
+ this.setPaintMode(PaintMode.endPaint);
})
.on('pointerover', (event) => {
- this.previewSinglePointIcon.filters = [new OldFilmFilter()];
+ if (this.previewImage !== null
+ && this.paintMode === PaintMode.singlePointIcon) {
+ this.previewImage.visible = true;
+ }
})
.on('pointerout', (event) => {
- this.previewSinglePointIcon.filters = null;
+ if (this.previewImage !== null
+ && this.paintMode === PaintMode.singlePointIcon) {
+ this.previewImage.visible = false;
+ }
});
this.app.stage.addChild(this.backgroundImage);
- this.createPreviewSinglePointIcon();
+ this.createPreviewImage();
this.createPreviewLineSegment();
this.createCircleShadow();
this.createEnterPaintEndButton();
this.backgroundImage.addChild(this.paintingLine);
}
+ public isOverlap(rect1, rect2):boolean {
+ const l1 = { x: rect1.x, y: rect1.y }
+ const r1 = { x: rect1.x + rect1.width, y: rect1.y + rect1.height }
+ const l2 = { x: rect2.x, y: rect2.y }
+ const r2 = { x: rect2.x + rect2.width, y: rect2.y + rect2.height }
+ if (
+ l1.x > r2.x ||
+ l2.x > r1.x ||
+ l1.y > r2.y ||
+ l2.y > r1.y
+ ) return false
+ return true
+ }
/**
* 刷新背景图
@@ -801,9 +925,10 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
if (!this.canvasData.selectStorey.imageUrl) {
this.backgroundImage.visible = false;
} else {
- this.backgroundImage.texture = PIXI.Texture.from(this.canvasData.selectStorey.imageUrl);
- this.backgroundImage.angle = this.canvasData.selectStorey.imageAngle;
- this.backgroundImage.visible = true;
+ // this.backgroundImage.texture = PIXI.Texture.from(this.canvasData.selectStorey.imageUrl);
+ // this.backgroundImage.angle = this.canvasData.selectStorey.imageAngle;
+ // this.backgroundImage.visible = true;
+ this.refresh();
}
}
/**
@@ -817,8 +942,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* @param scale 缩放系数
*/
public setBackgroundScale(scale: number): void {
- this.backgroundImage.scale.set(scale);
- this.emit('backgroundScale', this.backgroundImage.scale.x);
+ this.backgroundImage?.scale.set(scale);
+ this.emit('backgroundScale', this.backgroundImage?.scale.x);
}
/**
* 设置背景图角度
@@ -830,22 +955,18 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 创建预览单点图标
*/
- private createPreviewSinglePointIcon(): void {
- this.previewSinglePointIcon = PIXI.Sprite.from('assets/images/noImg.png');
- this.previewSinglePointIcon.width = 32;
- this.previewSinglePointIcon.height = 32;
- this.previewSinglePointIcon.alpha = 1;
- this.previewSinglePointIcon.anchor.set(0.5);
- this.previewSinglePointIcon.visible = false;
- this.backgroundImage.addChild(this.previewSinglePointIcon);
- }
- /**
- * 改变预览单点图标
- * @param uri 图片地址
- */
- private changePreviewSinglePointIcon(uri: string): void {
- this.previewSinglePointIcon.texture = PIXI.Texture.from(uri);
- this.previewSinglePointIcon.visible = true;
+ private createPreviewImage(): void {
+ // if (this.previewSinglePointIcon === null) {
+ // this.previewSinglePointIcon = PIXI.Sprite.from(this.canvasData.selectTemplateData.imageUrl);
+ // this.previewSinglePointIcon.width = this.canvasData.selectTemplateData.width;
+ // this.previewSinglePointIcon.height = this.canvasData.selectTemplateData.height;
+ // this.previewSinglePointIcon.anchor.set(0.5);
+ // this.previewSinglePointIcon.interactive = false;
+ // this.backgroundImage.addChild(this.previewSinglePointIcon);
+ // this.previewSinglePointIcon.scale.set(1 / this.backgroundImage.scale.x);
+ // }
+ this.previewImage = new AxPreviewImageShape(this);
+ this.previewImage.visible = false;
}
/**
* 创建预览线段
@@ -865,7 +986,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
*/
private refreshPreviewLineSegment(pointA: PIXI.Point, pointB: PIXI.Point) {
this.previewLineSegment.clear();
- this.previewLineSegment.lineStyle(1, 0xffd900, 1);
+ this.previewLineSegment.lineStyle(5, 0x00ff00, 1);
this.previewLineSegment.moveTo(pointA.x, pointA.y);
this.previewLineSegment.lineTo(pointB.x, pointB.y );
}
@@ -880,73 +1001,46 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.circleShadow.visible = false;
this.backgroundImage.addChild(this.circleShadow);
}
+ showConnectionPoint(b: boolean) {
+ this.backgroundImage?.children.forEach(item => {
+ if (item instanceof AxImageShape) {
+ if (item.assetData.CanConnect) {
+ item.showConnectionPoint(b);
+ }
+ }
+ });
+ }
/**
* 开始绘制
*/
public beginPaint() {
- switch (this.canvasData.selectTemplateData.interactiveMode) {
- case 0:
- this.beginPaintSinglePointIcon();
- break;
- case 1:
- this.beginPaintLineIcon();
- break;
- case 2:
- this.beginPaintPolygonIcon();
- break;
- }
- }
- /**
- * 开始绘画单点图标
- */
- private beginPaintSinglePointIcon(): void {
- this.cancelPaint();
- this.paintMode = PaintMode.singlePointIcon;
- this.changePreviewSinglePointIcon(this.canvasData.selectTemplateData.imageUrl);
- }
- /**
- * 开始绘画多边形
- */
- private beginPaintPolygonIcon(): void {
- this.cancelPaint();
- this.paintMode = PaintMode.polygonIcon;
- this.circleShadow.visible = true;
- }
- /**
- * 开始绘制多点图标
- */
- private beginPaintLineIcon(): void {
- this.cancelPaint();
- this.paintMode = PaintMode.lineIcon;
- this.previewSinglePointIcon.texture = PIXI.Texture.from(this.canvasData.selectTemplateData.imageUrl);
- this.circleShadow.visible = true;
+ this.selection.deselectAll();
+ this.setPaintMode(PaintMode.endPaint);
+ this.setPaintMode(this.canvasData.selectTemplateData.interactiveMode);
}
/**
- * 开始绘制管线
+ * 初始化管线数据
*/
- public beginPaintPipeline(): void {
- this.paintMode = PaintMode.Pipeline;
- }
- public paintingPipelineFinish(): void {
- if (this.paintMode === PaintMode.Pipeline) {
- this.paintMode = PaintMode.endPaint;
- this.paintPoints.splice(0, this.paintPoints.length);
- this.paintingPipeline = null;
- }
+ public initPipelineData(): void {
+ this.paintPoints = [];
+ this.paintingShape = null;
}
public beginPaintingArrows(): void {
this.paintMode = PaintMode.Arrows;
}
-
-
/**
- * 取消绘画
+ * 设置绘制状态
+ * @param mode 状态
*/
- public cancelPaint(): void {
+ public setPaintMode(mode: PaintMode) {
+ if (this.paintMode === mode) {
+ return;
+ }
+ this.paintMode = mode;
switch (this.paintMode) {
case PaintMode.singlePointIcon:
- this.previewSinglePointIcon.visible = false;
- this.paintMode = PaintMode.endPaint;
+ this.previewImage.visible = true;
+ this.previewImage.setImageUrl(this.canvasData.selectTemplateData.imageUrl);
break;
case PaintMode.lineIcon:
this.circleShadow.visible = false;
@@ -955,7 +1049,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
if (this.paintingIcon !== null) {
this.backgroundImage.removeChild(this.paintingIcon);
}
- this.paintMode = PaintMode.endPaint;
+ this.previewImage.setImageUrl(this.canvasData.selectTemplateData.imageUrl);
+ this.circleShadow.visible = true;
break;
case PaintMode.polygonIcon:
this.circleShadow.visible = false;
@@ -963,29 +1058,39 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.paintingIcon = null;
this.paintPoints.splice(0, this.paintPoints.length);
this.paintingLine.clear();
- this.paintMode = PaintMode.endPaint;
+ this.circleShadow.visible = true;
+ break;
+ case PaintMode.Pipeline:
+ if (this.canvasData.selectTemplateData.name==='水带') {
+ this.showConnectionPoint(true);
+ } else {
+
+ }
break;
- }
- }
- /**
- * 设置绘制状态
- * @param mode 状态
- */
- public setPaintMode(mode: PaintMode) {
- this.reset();
- this.paintMode = mode;
- switch (mode) {
case PaintMode.endPaint:
- this.selectCar = null;
- this.backgroundImage.children.forEach(item => {
- if (item instanceof PutCarArea) {
- if (item.assetData.Type.indexOf(this.selectCar?.Type) !== -1) {
- item.visible = true;
- } else {
- item.visible = false;
- }
- }
- });
+ this.showConnectionPoint(false);
+ if (this.previewImage !== null) {
+ this.previewImage.visible = false;
+ }
+ // 重置组件状态
+ if ( this.paintingIcon !== undefined
+ && this.paintingIcon !== null) {
+ this.backgroundImage.removeChild(this.paintingIcon);
+ }
+
+ // if (this.paintingShape !== undefined
+ // && this.paintingShape !== null) {
+ // this.backgroundImage.removeChild(this.paintingShape);
+ // }
+ if (this.paintingShape !== null) {
+ this.backgroundImage.removeChild(this.paintingShape);
+ this.paintingShape = null;
+ }
+ this.enterPaintEndButton.visible = false;
+ this.paintingLine.clear();
+ this.resetData();
+ break;
+ default:
break;
}
}
@@ -998,10 +1103,11 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 重置
*/
- public reset() {
- this.previewSinglePointIcon.filters = null;
- this.previewSinglePointIcon.visible = false;
- this.previewSinglePointIcon.angle = 0;
+ public resetData() {
+ this.initPipelineData();
+ //
+ this.circleShadow.visible = false;
+ this.previewLineSegment.visible = false;
}
/**
* 确认绘制
@@ -1009,7 +1115,10 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
private enterPaint(): void {
this.previewLineSegment.visible = false;
this.enterPaintEndButton.visible = false;
+ console.log(this.paintMode);
switch (this.paintMode) {
+ case PaintMode.singlePointIcon:
+ break;
case PaintMode.lineIcon:
if (this.paintPoints.length >= 2) {
this.emit('createIcon', this.paintingIcon);
@@ -1053,6 +1162,12 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.emit('createIcon', polygonIcon);
}
break;
+ case PaintMode.Pipeline:
+ if (this.canvasData.selectTemplateData.name !== '水带') {
+ this.emit('createIcon', this.paintingShape);
+ this.paintingShape = null;
+ }
+ break;
}
this.paintPoints.splice(0, this.paintPoints.length);
this.emit('backgroundScale', this.backgroundImage.scale.x);
@@ -1079,14 +1194,14 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
newData.BuildingId = buildingId;
newData.FloorId = floorId;
newData.Point = new PIXI.Point(item.Point.x + 5, item.Point.y + 5);
- if (newData.IsFromBuilding) {
- this.canvasData.originalcompanyBuildingData.data[newData.Id] = newData;
- } else {
+ // if (newData.IsFromBuilding) {
+ // this.canvasData.originalcompanyBuildingData.data[newData.Id] = newData;
+ // } else {
this.canvasData.originaleveryStoreyData.data[newData.Id] = newData;
- }
+ // }
switch (item.InteractiveMode) {
case PaintMode.singlePointIcon:
- const singleIcon = new SinglePointIcon(newData, this);
+ const singleIcon = new AxImageShape(newData, this);
break;
case PaintMode.lineIcon:
const lineIcon = new MultipointIcon(newData, this);
@@ -1094,9 +1209,17 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
case PaintMode.polygonIcon:
const polygonIcon = new PolygonIcon(newData, this);
break;
+ case PaintMode.Pipeline:
+ if (item.Name === '距离') {
+ const wall = new AxArrowConnector(newData, this,true,true);
+ } else if (item.Name === '普通墙' || item.Name === '承重墙') {
+ const wall = new AxArrowConnector(newData, this,false,false);
+ }
+ break;
}
this.selection.select(this.backgroundImage.getChildByName(newData.Id));
});
+ this.emit('backgroundScale', this.backgroundImage.scale.x);
}
}
@@ -1179,68 +1302,7 @@ export class Selection {
}
}
-/**
- * 属性
- */
-export class PropertyInfo {
- constructor(instanceData: any) {
- this.Tag = instanceData.tag;
- this.Order = instanceData.order;
- this.Enabled = instanceData.enabled;
- this.Visible = instanceData.visible;
- this.Required = instanceData.required;
- this.RuleName = instanceData.ruleName;
- this.RuleValue = instanceData.ruleValue;
- this.PhysicalUnit = instanceData.physicalUnit;
- this.PropertyName = instanceData.propertyName;
- this.PropertyType = instanceData.propertyType;
- this.PropertyValue = instanceData.propertyValue;
- }
- /**
- * 标记位,用于扩展
- */
- public Tag: string;
- /**
- * 属性排序
- */
- public Order: number;
- /**
- * 是否启用
- */
- public Enabled: boolean;
- /**
- * 是否可见
- */
- public Visible: boolean;
- /**
- * 必填
- */
- public Required: boolean;
- /**
- * 验证规则名称
- */
- public RuleName: string;
- /**
- * 验证规则值
- */
- public RuleValue: string;
- /**
- * 物理单位
- */
- public PhysicalUnit: string;
- /**
- * 属性名称
- */
- public PropertyName: string;
- /**
- * 属性类型
- */
- public PropertyType: number;
- /**
- * 属性值
- */
- public PropertyValue: string;
-}
+
/**
* 车辆类型
*/
diff --git a/src/assets/images/h130.png b/src/assets/images/h130.png
new file mode 100644
index 0000000..384b005
Binary files /dev/null and b/src/assets/images/h130.png differ
' +
''
//初始化地图
+ searchTitle:any//搜索内容
+ placeSearch:any//地址搜索类
+ search(){
+ this.placeSearch.search(this.searchTitle, (status, result) => {
+ // 搜索成功时，result即是对应的匹配数据
+ if(result.info == "OK"){
+ this.newPositionMarker.setPosition([result.poiList.pois[0].location.lng,result.poiList.pois[0].location.lat])
+ this.markerPosition2 = {x: result.poiList.pois[0].location.lng, y: result.poiList.pois[0].location.lat}
+ this.map.setCenter([result.poiList.pois[0].location.lng,result.poiList.pois[0].location.lat]); //设置地图中心点
+ }else{
+ alert('查询不到输入地址信息')
+ }
+
+ })
+
+ }
labelGis(){
this.map = new AMap.Map('container', {
zoom:12
})
+
+
this.map.on('complete', () => {
this.isGisTopBox = true
});
+ //输入提示
+ var autoOptions = {
+ input: "tipinput"
+ };
+ AMap.plugin(['AMap.PlaceSearch','AMap.AutoComplete'], ()=>{
+ var auto = new AMap.AutoComplete(autoOptions);
+ this.placeSearch = new AMap.PlaceSearch(); //构造地点查询类
+ auto.on("select", (e)=>{
+ console.log(e)
+ console.log( this.newPositionMarker)
+ this.newPositionMarker.setPosition([e.poi.location.lng,e.poi.location.lat])
+ this.markerPosition2 = {x: e.poi.location.lng, y: e.poi.location.lat}
+ this.map.setCenter([e.poi.location.lng,e.poi.location.lat]); //设置地图中心点
+ });//注册监听，当选中某条记录时会触发
+
+ });
+
if(this.isMapLabel){//如果已经标注单位坐标
console.log('已标注单位位置')
this.map.setCenter([this.unitinfo.location.x,this.unitinfo.location.y]);
@@ -143,9 +179,15 @@ export class BasicinfoComponent implements OnInit {
this.map.setCity('上海市');
}
}
+
+
+ markerPosition2
//点击位置按钮
setPosition(){
+
+
this.isGisTopBox = false
+ this.isGisTopBoxTwo = true
if(this.isMapLabel){//如果已经标注单位坐标
console.log('已标注单位位置')
@@ -165,36 +207,38 @@ export class BasicinfoComponent implements OnInit {
this.map.add(this.newPositionMarker);
- let markerPosition
if(this.markerPosition.x && this.markerPosition.x != 0){
- markerPosition = {x: this.markerPosition.x,y: this.markerPosition.y}
+ this.markerPosition2 = {x: this.markerPosition.x,y: this.markerPosition.y}
}else{
- markerPosition = {x: this.map.getCenter().lng,y: this.map.getCenter().lat} //获取当前地图中心位置
+ this.markerPosition2 = {x: this.map.getCenter().lng,y: this.map.getCenter().lat} //获取当前地图中心位置
}
this.newPositionMarker.on('dragend', (e)=>{
- markerPosition = {x: e.lnglat.lng, y: e.lnglat.lat}
+ this.markerPosition2 = {x: e.lnglat.lng, y: e.lnglat.lat}
})
//点击确定
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'),'click',(event)=>{
this.map.clearMap();
this.isGisTopBox = true
+ this.isGisTopBoxTwo = false
this.newPositionMarker = new AMap.Marker({
- position: [markerPosition.x,markerPosition.y],
+ position: [this.markerPosition2.x,this.markerPosition2.y],
content: this.newPositionMarkerContent,
offset: new AMap.Pixel(-15, -18)
});
- this.markerPosition = markerPosition
+ this.markerPosition = this.markerPosition2
this.map.add(this.newPositionMarker);
})
//点击取消
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'),'click',(event)=>{
this.isGisTopBox = true
+ this.isGisTopBoxTwo = false
this.map.clearMap();
this.newPositionMarker = new AMap.Marker({
position: [this.markerPosition.x,this.markerPosition.y],
content: this.newPositionMarkerContent,
offset: new AMap.Pixel(-15, -18)
});
+ this.map.setCenter([this.markerPosition.x,this.markerPosition.y]); //设置地图中心点
this.map.add(this.newPositionMarker);
})
@@ -219,19 +263,20 @@ export class BasicinfoComponent implements OnInit {
});
this.map.add(this.newPositionMarker);
- let markerPosition
+ // let markerPosition
if(this.markerPosition.x && this.markerPosition.x != 0){
- markerPosition = {x: this.markerPosition.x,y: this.markerPosition.y}
+ this.markerPosition2 = {x: this.markerPosition.x,y: this.markerPosition.y}
}else{
- markerPosition = {x: this.map.getCenter().lng,y: this.map.getCenter().lat} //获取当前地图中心位置
+ this.markerPosition2 = {x: this.map.getCenter().lng,y: this.map.getCenter().lat} //获取当前地图中心位置
}
this.newPositionMarker.on('dragend', (e)=>{
- markerPosition = {x: e.lnglat.lng, y: e.lnglat.lat}
+ this.markerPosition2 = {x: e.lnglat.lng, y: e.lnglat.lat}
})
//点击确定
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'),'click',(event)=>{
this.isGisTopBox = true
- this.markerPosition = markerPosition
+ this.isGisTopBoxTwo = false
+ this.markerPosition = this.markerPosition2
this.map.clearMap();
this.newPositionMarker = new AMap.Marker({
position: [this.markerPosition.x,this.markerPosition.y],
@@ -243,19 +288,19 @@ export class BasicinfoComponent implements OnInit {
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'),'click',(event)=>{
this.map.clearMap();
this.isGisTopBox = true
+ this.isGisTopBoxTwo = false
if(this.markerPosition.x && this.markerPosition.x != 0){//说明之前标过点
this.newPositionMarker = new AMap.Marker({
position: [this.markerPosition.x,this.markerPosition.y],
content: this.newPositionMarkerContent,
offset: new AMap.Pixel(-15, -18)
});
+ this.map.setCenter([this.markerPosition.x,this.markerPosition.y]); //设置地图中心点
this.map.add(this.newPositionMarker);
}
})//取消
}
-
-
}
//获得所有单位类型
@@ -278,7 +323,9 @@ export class BasicinfoComponent implements OnInit {
}else{//未标注
_this.isMapLabel = false
}
+
this.labelGis()
+
})
}
)
@@ -422,7 +469,7 @@ export class BasicinfoComponent implements OnInit {
data[0].buildtype = n.name
data[0].tongyong = true
data[0].index = x.index
- if(data[0].buildtype == "石油化工类"){
+ if(data[0].buildtype.indexOf('化工') != -1 || data[0].buildtype.indexOf('储罐') != -1){
data[0].tongyong = false
data[0].isshiyou = true
this.deviceinfodata = data[0].buildingBasicGroups[1].propertyInfos //存储装置信息的初始数据，需要转换成datasource形式
@@ -584,7 +631,7 @@ export class BasicinfoComponent implements OnInit {
data[0].tongyong = true
data[0].index = index
- if(data[0].buildtype == "石油化工类"){
+ if(data[0].buildtype.indexOf('化工') != -1 || data[0].buildtype.indexOf('储罐') != -1){
data[0].tongyong = false
data[0].isshiyou = true
let noemptydeviceArr = data[0].buildingBasicGroups[1].propertyInfos
@@ -843,7 +890,7 @@ export class BasicinfoComponent implements OnInit {
data[0].username = n.name
data[0].tongyong = true
data[0].index = this.houses.length //////////////////
- if(data[0].buildtype == "石油化工类"){
+ if(data[0].buildtype.indexOf('化工') != -1 || data[0].buildtype.indexOf('储罐') != -1){
data[0].tongyong = false
data[0].isshiyou = true //如果是石油化工则启用石油化工的模板
this.deviceinfodata = data[0].buildingBasicGroups[1].propertyInfos //存储装置信息表格的初始数据，需要转换成datasource形式
@@ -1172,7 +1219,7 @@ export class BasicinfoComponent implements OnInit {
if(invalid){
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
- config.duration = 3000
+ config.duration = 3000
this.snackBar.open('请填写必填项','确定',config);
}else{
sessionStorage.setItem('buildingTypeId',value.unittype)
@@ -1423,7 +1470,7 @@ export class BasicinfoComponent implements OnInit {
}
- if(item.buildtype != "石油化工类" && item.buildtype != "地铁类"){
+ if(item.buildtype.indexOf('化工') == -1 && item.buildtype != "地铁类" && item.buildtype.indexOf('储罐') == -1){
// console.log(this.houses[key])
// console.log(value)
this.houses[key].buildingBasicGroups[0].propertyInfos.forEach(item => {
@@ -1475,7 +1522,7 @@ export class BasicinfoComponent implements OnInit {
})
}
}
- if(item.buildtype == "石油化工类"){
+ if(item.buildtype.indexOf('化工') != -1 || item.buildtype.indexOf('储罐') != -1){
// console.log(888,item)
let bodyObj = _.cloneDeep(item)
delete bodyObj.name
diff --git a/src/app/key-unit/key-unit-management/key-unit-management.component.html b/src/app/key-unit/key-unit-management/key-unit-management.component.html
index f821dd9..9b78ece 100644
--- a/src/app/key-unit/key-unit-management/key-unit-management.component.html
+++ b/src/app/key-unit/key-unit-management/key-unit-management.component.html
@@ -15,7 +15,7 @@
+ 
diff --git a/src/app/ui/collection-tools-plan/collection-tools.component.scss b/src/app/ui/collection-tools-plan/collection-tools.component.scss
index 06f15a5..1ec5d7d 100644
--- a/src/app/ui/collection-tools-plan/collection-tools.component.scss
+++ b/src/app/ui/collection-tools-plan/collection-tools.component.scss
@@ -4,7 +4,7 @@
}
.content {
width: 100%;
- height: 93%;
+ height: 100%;
overflow: hidden;
box-sizing: border-box;
padding: 1px;
diff --git a/src/app/ui/collection-tools-plan/collection-tools.component.ts b/src/app/ui/collection-tools-plan/collection-tools.component.ts
index 9234ef4..9147fb5 100644
--- a/src/app/ui/collection-tools-plan/collection-tools.component.ts
+++ b/src/app/ui/collection-tools-plan/collection-tools.component.ts
@@ -149,10 +149,6 @@ export class CollectionToolsPlanComponent implements OnInit {
}
pattern:boolean = true//默认为基本信息编辑
-
- yyy(){
- console.log(this.canvasData.selectPanelPoint)
- }
//基本信息编辑模式
baseInfo(){
if (!this.pattern) {
@@ -223,14 +219,11 @@ export class CollectionToolsPlanComponent implements OnInit {
targetNodeData.forEach(i => {
idArr.push(i.id)
})
- console.log(6666666666666,event);
if(this.pos == 0 && event.node.origin.children.length == 1){
- console.log("移入,没有兄弟")
let key = event.dragNode.key
orders[key] = 0
parentId = event.node.key
}else{
- console.log("移入,多个兄弟")
let array = []
targetNodeData.forEach(item => {
if(item.id != event.dragNode.key){ //将拖动项先移除掉
@@ -238,13 +231,10 @@ export class CollectionToolsPlanComponent implements OnInit {
}
})
if(event.dragNode.isEnd[event.dragNode.isEnd.length - 1]){ //如果移入到最后一个
- console.log("最后")
array.push(event.dragNode.origin)
}else if(event.dragNode.isStart[event.dragNode.isStart.length - 1]){//如果移入到第一个
- console.log("第一")
array.unshift(event.dragNode.origin)
}else{//如果移入中间位置
- console.log("中间")
array.splice(event.node.origin.order, 0, event.dragNode.origin)
}
array.forEach((item,key) => {
@@ -580,6 +570,13 @@ export class CollectionToolsPlanComponent implements OnInit {
this.gallery.update()
}, 0);
+ //将上传的input框显示出来
+ this.isImgNumCss = true;
+ //清除图片缓存
+ if((