shaojiahao
/
AX.Angular9DataCollection
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

Merge branch 'develop' of http://39.106.78.171:3000/shaojiahao/AX.Angular9DataCollection into develop

develop
陈鹏飞 4 years ago
parent
1478a807db fd078d3584
commit
7c4ff1238e
4 changed files with 122 additions and 29 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 18
      src/app/ui/collection-tools/collection-tools.component.html
  2. 7
      src/app/ui/collection-tools/collection-tools.component.scss
  3. 32
      src/app/ui/collection-tools/collection-tools.component.ts
  4. 94
      src/app/working-area/working-area.component.ts

18
src/app/ui/collection-tools/collection-tools.component.html
Unescape View File

@ -165,11 +165,11 @@
<div class="assetsproperty" style="user-select: none" *ngIf="isShowProperty && !isShowAttribute">
<h3 style="text-align: center;font-weight: 900;">{{assetName}}</h3>
<div *ngIf="canvasAssetObj.FixedSize">
<div>
<p>宽度(像素)</p>
<input type="text" class="biginput" [(ngModel)]="assetWidth" (input)="assetWidthIunput()" [disabled]="!isEditPattern">
<input type="text" class="biginput" [(ngModel)]="assetWidth" (input)="assetWidthIunput()" [disabled]="!isEditPattern || canvasAssetObj.FillMode != 1">
<p>高度(像素)</p>
<input type="text" class="biginput" [(ngModel)]="assetHeight" (input)="assetHeightIunput()" [disabled]="!isEditPattern">
<input type="text" class="biginput" [(ngModel)]="assetHeight" (input)="assetHeightIunput()" [disabled]="!isEditPattern || canvasAssetObj.FillMode != 1">
<p>角度</p>
<div style="width: 100%;display: flex;vertical-align: top;height: 22px;">
<input type="number" class="smallinput" [(ngModel)]="sliderValue"
@ -304,8 +304,10 @@
<mat-tree-node [ngClass]="{'isLookPattern': !node.isLookPattern && !isEditPattern}" *matTreeNodeDef="let node;" matTreeNodePadding cdkTreeNodePaddingIndent='26' (click)="clickTreeNode(node)" >
<button mat-icon-button disabled></button>
{{node.name}}
<span *ngIf="node.isTemplate">({{node.children.length}})</span>
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}">
{{node.name}}
</span>
<span *ngIf="node.isTemplate">({{node.children.length}})</span>
<span class="isLookCss" (click)="clickLookItem(node)"><mat-icon [ngClass]="{'icongray': node.isLook == false}">visibility</mat-icon></span>
</mat-tree-node>
@ -318,8 +320,10 @@
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
{{node.name}}
<span *ngIf="node.isTemplate && node.isNewElement">({{node.children.length}})</span>
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}">
{{node.name}}
</span>
<span *ngIf="node.isTemplate && node.isNewElement">({{node.children.length}})</span>
<span class="isLookCss" (click)="clickLookItem(node)"><mat-icon [ngClass]="{'icongray': node.isLook == false}">visibility</mat-icon></span>
</mat-tree-node>

7
src/app/ui/collection-tools/collection-tools.component.scss
Unescape View File

@ -301,4 +301,11 @@ div:focus {
}
.isLookPattern{
display: none;
}
.treeText{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
width: 65px;
}

32
src/app/ui/collection-tools/collection-tools.component.ts
Unescape View File

@ -196,6 +196,7 @@ export class CollectionToolsComponent implements OnInit {
})
this.canvasAssetObj.PropertyInfos[index].PropertyValue = e.target.value
this.canvasData.isChange = true
this.canvas.refresh()
}
//动态属性素材布尔值框改变radio
@ -241,7 +242,6 @@ export class CollectionToolsComponent implements OnInit {
dialogRef.afterClosed().subscribe(data=>{ });
}
//上传素材图片
selectFile(e){
let imgFile = e.target.files[0] || null //上传的文件
@ -391,6 +391,7 @@ export class CollectionToolsComponent implements OnInit {
ngAfterViewInit(): void {
// 监听canvas组件选中素材事件
this.canvas.on("select",obj=>{
console.log(obj.assetData)
//选中素材属性注入函数
this.setAssetsProperty(obj.assetData)
})
@ -486,10 +487,11 @@ export class CollectionToolsComponent implements OnInit {
}else{
//如果是单位 总平面图
if(this.checkedBuildingIndex==-1){
//保存平面图数据
this.http.post("/api/CompanyAccount/SitePlanData",SitePlanData).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -503,10 +505,11 @@ export class CollectionToolsComponent implements OnInit {
this.snackBar.open('平面图数据保存失败','确定',config);
})
//保存建筑数据
this.http.post("/api/CompanyAccount/CompanyData",CompanyData).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -523,9 +526,9 @@ export class CollectionToolsComponent implements OnInit {
//批量保存单位毗邻
let CompanyAdjoins = this.canvasData.getCompanyAdjoinInfo()
this.http.post("/api/CompanyAccount/CompanyAdjoins/Batch",CompanyAdjoins).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -538,12 +541,13 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.isChange = true
this.snackBar.open('单位毗邻保存失败','确定',config);
})
//批量保存单位重点部位
let CompanyImportantLocations = this.canvasData.getCompanyImportantLocations()
this.http.post("/api/CompanyAccount/CompanyImportantLocations/Batch",CompanyImportantLocations).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -556,12 +560,13 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.isChange = true
this.snackBar.open('单位重点部位保存失败','确定',config);
})
//批量保存单位消防设施素材
let CompanyFacilityAssets = this.canvasData.getAllCompanyFacilityAssetInfo()
this.http.post("/api/CompanyAccount/CompanyFacilityAssets/Batch",CompanyFacilityAssets).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -574,12 +579,14 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.isChange = true
this.snackBar.open('单位消防设施素材保存失败','确定',config);
})
}else{ //如果是建筑
//建筑平面图数据
this.http.post("/api/CompanyAccount/BuildingAreaData",SitePlanData).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -593,10 +600,11 @@ export class CollectionToolsComponent implements OnInit {
this.snackBar.open('平面图数据保存失败','确定',config);
})
//建筑数据
this.http.post("/api/CompanyAccount/BuildingData",CompanyData).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -613,9 +621,9 @@ export class CollectionToolsComponent implements OnInit {
//批量保存建筑毗邻
let buildingAdjoins = this.canvasData.getBuildingAdjoinInfo()
this.http.post(`/api/CompanyAccount/BuildingAdjoins/Batch?buildingId=${this.canvasData.selectStorey.buildingId}`,buildingAdjoins).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -628,12 +636,13 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.isChange = true
this.snackBar.open('建筑毗邻保存失败','确定',config);
})
//批量保存建筑重点部位
let buildingImportantLocations = this.canvasData.getBuildingImportantLocations()
this.http.post(`/api/CompanyAccount/BuildingImportantLocations/Batch?buildingId=${this.canvasData.selectStorey.buildingId}`,buildingImportantLocations).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
@ -646,12 +655,13 @@ export class CollectionToolsComponent implements OnInit {
this.canvasData.isChange = true
this.snackBar.open('建筑重点部位保存失败','确定',config);
})
//批量保存建筑消防设施素材
let buildingFacilityAssets = this.canvasData.getAllBuildingFacilityAssetInfo()
this.http.post(`/api/CompanyAccount/BuildingFacilityAssets/Batch?buildingId=${this.canvasData.selectStorey.buildingId}`,buildingFacilityAssets).subscribe(data => {
this.canvasData.isChange = false
this.saveNum.push("1")
if(this.saveNum.length == 5){
this.canvasData.isChange = false
let config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000

94
src/app/working-area/working-area.component.ts
Unescape View File

@ -140,6 +140,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
if (delta > 0) {
if (this.backgroundImage.scale.x >= 32) {
this.backgroundImage.scale.x = 32;
this.backgroundImage.scale.y = 32;
this.emit('mouseWheel', this.backgroundImage.scale.x);
return;
}
this.backgroundImage.pivot.set(pivot.x, pivot.y);
@ -151,7 +153,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.backgroundImage.position.y += delY;
} else if (delta < 0) {
if (this.backgroundImage.scale.x <= 0.1) {
this.backgroundImage.scale.x = 0.1;
this.backgroundImage.scale.y = 0.1;
this.emit('mouseWheel', this.backgroundImage.scale.x);
return;
}
this.backgroundImage.pivot.set(pivot.x, pivot.y);
@ -162,6 +166,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.backgroundImage.position.x += delX;
this.backgroundImage.position.y += delY;
}
this.emit('mouseWheel', this.backgroundImage.scale.x);
}
/**
* 创建画布
@ -564,6 +569,13 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
public destroyBackgroundImage(): void {
this.app.stage.removeChild(this.backgroundImage);
}
/**
* 设置背景图缩放
* @param scale 缩放系数
*/
public setBackgroundScale(scale: number): void {
this.backgroundImage.scale.set(scale);
}
/**
* 设置背景图角度
* @param imageAngle 角度值
@ -810,9 +822,27 @@ enum PaintMode {
* 单点图标
*/
export class SinglePointIcon extends PIXI.Container {
private text = new PIXI.Text(this.assetData.Name, {
fontFamily: 'Arial', fontSize: 18, fill: 0xffffff, align: 'center'
style = new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 18,
fontStyle: 'normal',
fontWeight: 'bold',
fill: ['#000000'],
stroke: '#00ff99',
strokeThickness: 3,
dropShadow: true,
dropShadowColor: '#000000',
dropShadowBlur: 3,
dropShadowAngle: Math.PI / 6,
dropShadowDistance: 1,
wordWrap: false,
wordWrapWidth: 100,
});
private text = new PIXI.Text(this.assetData.Name
+ '\r\n'
+ this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
constructor(public assetData: any, private workingArea: WorkingAreaComponent) {
super();
this.workingArea.backgroundImage.addChild(this);
@ -820,8 +850,8 @@ export class SinglePointIcon extends PIXI.Container {
this.y = this.assetData.Point.y;
this.name = this.assetData.Id;
const singlePointIcon = PIXI.Sprite.from(this.assetData.ImageUrl);
singlePointIcon.x = 0; // this.assetData.Point.x;
singlePointIcon.y = 0; // this.assetData.Point.y;
singlePointIcon.x = 0;
singlePointIcon.y = 0;
singlePointIcon.width = this.assetData.Width;
singlePointIcon.height = this.assetData.Height;
@ -831,7 +861,7 @@ export class SinglePointIcon extends PIXI.Container {
singlePointIcon
.on('mousedown', event => {
event.stopPropagation();
console.log(this.assetData);
event.currentTarget.parent.data = event.data;
event.currentTarget.parent.alpha = 0.5;
event.currentTarget.parent.dragging = true;
@ -867,9 +897,17 @@ export class SinglePointIcon extends PIXI.Container {
});
this.workingArea.on('mouseWheel', data => {
if (this.assetData.FixedSize) {
const scale = 1 / data;
console.log(scale);
this.scale.set(scale);
}
});
this.text.x = singlePointIcon.x;
this.text.y = singlePointIcon.y - 32;
this.text.anchor.set(0.5);
this.text.y = singlePointIcon.y - singlePointIcon.height / 2;
this.text.anchor.set(0.5, 1);
this.addChild(this.text);
this.addChild(singlePointIcon);
@ -888,9 +926,26 @@ export class MultipointIcon extends PIXI.Container {
public pointsData: PIXI.Point[];
public pointsGraphics: PIXI.Graphics[] = [];
public iconsTilingSprite: PIXI.TilingSprite[] = [];
private text = new PIXI.Text(this.assetData.Name, {
fontFamily: 'Arial', fontSize: 18, fill: 0xffffff, align: 'center'
style = new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 18,
fontStyle: 'normal',
fontWeight: 'bold',
fill: ['#000000'],
stroke: '#00ff99',
strokeThickness: 3,
dropShadow: true,
dropShadowColor: '#000000',
dropShadowBlur: 3,
dropShadowAngle: Math.PI / 6,
dropShadowDistance: 1,
wordWrap: false,
wordWrapWidth: 100,
});
private text = new PIXI.Text(this.assetData.Name
+ '\r\n'
+ this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
/**
*
* @param texture 图片素材
@ -1088,9 +1143,26 @@ export class PolygonIcon extends PIXI.Container {
public pointsGraphics: PIXI.Graphics[] = [];
public polygonGraphics: PIXI.Graphics = new PIXI.Graphics();
public polygonLineGraphics: PIXI.Graphics = new PIXI.Graphics();
private text = new PIXI.Text(this.assetData.Name, {
fontFamily: 'Arial', fontSize: 18, fill: 0xffffff, align: 'center'
style = new PIXI.TextStyle({
fontFamily: 'Arial',
fontSize: 18,
fontStyle: 'normal',
fontWeight: 'bold',
fill: ['#000000'],
stroke: '#00ff99',
strokeThickness: 3,
dropShadow: true,
dropShadowColor: '#000000',
dropShadowBlur: 3,
dropShadowAngle: Math.PI / 6,
dropShadowDistance: 1,
wordWrap: false,
wordWrapWidth: 100,
});
private text = new PIXI.Text(this.assetData.Name
+ '\r\n'
+ this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style);
/**
*
* @param points 点集合

Write Preview
Loading…
Cancel
Save