Browse Source

[完善]安信盒子增加临时替换底图功能

非煤矿业企业安全风险监测预警系统
邵佳豪 2 years ago
parent
commit
f17a5978ed
  1. 12
      src/app/system-management/host-config/host-config.component.html
  2. 6
      src/app/system-management/host-config/host-config.component.ts
  3. 5
      src/app/system-management/image-label-anxin/image-label-anxin.component.html
  4. 16
      src/app/system-management/image-label-anxin/image-label-anxin.component.scss
  5. 23
      src/app/system-management/image-label-anxin/image-label-anxin.component.ts

12
src/app/system-management/host-config/host-config.component.html

@ -29,13 +29,15 @@
<td>{{ item.uri }}</td>
<td>{{ item.type | cameraType}}</td>
<td>
<ng-container *ngIf="hostType === '交大'; else elseTemplate">
<span *ngIf="hostType === '交大'">
{{item.dimensionedPoints ? '已标注' : '未标注'}}
</ng-container>
<ng-template #elseTemplate>
</span>
<span *ngIf="hostType === '黄海'">
{{item.dimensionedPointsHuanghai ? '已标注' : '未标注'}}
</ng-template>
</span>
<span *ngIf="hostType === '安信'">
{{item.dimensionedPointsAnxin ? '已标注' : '未标注'}}
</span>
</td>
<td>{{ item.isEnabled ? '已启用' : '已禁用'}}</td>
<td>

6
src/app/system-management/host-config/host-config.component.ts

@ -32,6 +32,7 @@ interface Camera {
dimensionedPoints: string;
dimensionedPointsHuanghai: string;
dimensionedPointsHuanghaiObj: any;
dimensionedPointsAnxin: string;
isEnabled: boolean;
}
@ -1555,10 +1556,13 @@ ${newstr}class-id=0
configJsonToAx() {
let data = {
server: 'http://121.36.37.70:8208',
obs: 'http://121.36.37.70:8906',
userInfo: {
user: '',
password: '',
},
ip: this.hostData.hostIPAddress,
caps: [],
};
console.log(this.listOfData);
@ -1587,6 +1591,8 @@ ${newstr}class-id=0
type: type,
url: item.uri,
name: item.name,
user: item.user,
password: item.password,
};
if (areas.length !== 0) {
obj.areas = areas;

5
src/app/system-management/image-label-anxin/image-label-anxin.component.html

@ -34,6 +34,11 @@
<button nz-button nzType="primary" (click)="save()">保存</button>
<button nz-button nzType="primary" nzDanger nz-popconfirm nzPopconfirmTitle="您确定要清空吗?"
(nzOnConfirm)="clearCanvas()">清空</button>
<div class="changeImg">
<button nz-button nzType="primary">更换底图</button>
<input type="file" class="inputfile" (change)="changeImg($event)">
</div>
<label *ngIf="camerasData" class="rightTitle">原始分辨率: {{camerasData.originalWeight}} ×
{{camerasData.originalHeight}}
</label>

16
src/app/system-management/image-label-anxin/image-label-anxin.component.scss

@ -39,7 +39,8 @@
display: flex;
align-items: center;
}
.colorBlock{
.colorBlock {
display: inline-block;
width: 12px;
height: 12px;
@ -84,3 +85,16 @@
background-color: #1890ff;
color: #fff;
}
.changeImg {
position: relative;
.inputfile {
width: 88px;
height: 32px;
position: absolute;
left: 0;
top: 0;
opacity: 0;
}
}

23
src/app/system-management/image-label-anxin/image-label-anxin.component.ts

@ -513,6 +513,29 @@ export class ImageLabelAnxinComponent implements OnInit {
this.modal.closeAll();
});
}
//更换底图
changeImg(e) {
this.clearCanvas();
let file = e.target.files[0] || null; //获取上传的文件
let fileUrl = URL.createObjectURL(file);
console.log(fileUrl);
var img = new Image();
img.src = fileUrl;
img.onload = () => {
this.canvasWidth = img.width;
this.canvasHeight = img.height;
window.setTimeout(() => {
// 加载图片
this.ctx.drawImage(img, 0, 0, this.canvasWidth, this.canvasHeight);
this.copyCanvas = this.ctx.getImageData(
0,
0,
this.canvasWidth,
this.canvasHeight
);
}, 0);
};
}
}
enum enum_area {

Loading…
Cancel
Save