You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1239 lines
48 KiB
1239 lines
48 KiB
import { FlatTreeControl } from '@angular/cdk/tree'; |
|
import { HttpClient } from '@angular/common/http'; |
|
import { Inject, Renderer2 } from '@angular/core'; |
|
import { ElementRef } from '@angular/core'; |
|
import { Component, OnInit } from '@angular/core'; |
|
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
|
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
|
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree'; |
|
import { Console } from 'console'; |
|
import { TreeService } from 'src/app/http-interceptors/tree.service'; |
|
import Viewer from 'viewerjs' |
|
declare var CryptoJS |
|
declare var AMap: any; |
|
|
|
@Component({ |
|
selector: 'app-fire-force', |
|
templateUrl: './fire-force.component.html', |
|
styleUrls: ['./fire-force.component.scss'] |
|
}) |
|
export class FireForceComponent implements OnInit { |
|
|
|
constructor(private tree: TreeService, public snackBar: MatSnackBar, private http: HttpClient, private elementRef: ElementRef, public renderer2: Renderer2, public dialog: MatDialog) { } |
|
|
|
isCheckedOfSearchDiv: boolean = true//列表过滤滑块 |
|
slideChange(e) { |
|
this.isCheckedOfSearchDiv = e.checked |
|
} |
|
searchForm: any = { |
|
name: '', |
|
integrityNum: '' |
|
} |
|
listIntegrityNum: any[] = [ |
|
{ id: -1, name: '全部' }, |
|
{ id: 0, name: '<=50%' }, |
|
{ id: 1, name: '50%-60%' }, |
|
{ id: 2, name: '60%-70%' }, |
|
{ id: 3, name: '70%-80%' }, |
|
{ id: 4, name: '80%-90%' }, |
|
{ id: 5, name: '90%-100%' } |
|
] |
|
checkBoxList: any[] = [ |
|
{ id: 0, name: '总队', isChecked: false }, |
|
{ id: 1, name: '支队', isChecked: false }, |
|
{ id: 2, name: '大队', isChecked: false }, |
|
{ id: 3, name: '中队(消防站)', isChecked: false }, |
|
{ id: 4, name: '其他消防队伍', isChecked: false } |
|
] |
|
//勾选力量类型checkbox在地图上显示marker |
|
checkBoxChange() { |
|
let Levels = [] |
|
this.checkBoxList.forEach(item => { |
|
if (item.isChecked) { |
|
Levels.push(item.id) |
|
} |
|
}) |
|
let params: any = { |
|
PageSize: 999999, |
|
Levels: Levels |
|
} |
|
if (Levels.length != 0) {//如果勾选了checkbox |
|
this.http.get('/api/CustomFireForce', { params: params }).subscribe((data: any) => { |
|
this.createMarker(data) |
|
}) |
|
} else { |
|
this.cluster.setData([]) |
|
} |
|
} |
|
//循环渲染出所有力量markers |
|
cluster: any //力量聚合实例 |
|
createMarker(list) { |
|
let markerArrcluster = [] |
|
this.cluster ? this.cluster.setData([]) : null |
|
list.forEach((item) => { |
|
let image |
|
if (item.forceType == 2) { |
|
image = '/assets/fireForcesMarkers/qita.png' |
|
} else if (item.level == 0) { |
|
image = '/assets/fireForcesMarkers/zongdui.png' |
|
} else if (item.level == 1) { |
|
image = '/assets/fireForcesMarkers/zhidui.png' |
|
} else if (item.level == 2) { |
|
image = '/assets/fireForcesMarkers/dadui.png' |
|
} else if (item.level == 3) { |
|
image = '/assets/fireForcesMarkers/zhongdui.png' |
|
} |
|
// 用于点集合的数组 |
|
item.fireForceDetailInfo.location ? |
|
markerArrcluster.push({ |
|
lnglat: [item.fireForceDetailInfo.location.x, item.fireForceDetailInfo.location.y], |
|
image: image, |
|
data: item |
|
}) : null |
|
}) |
|
this.map.plugin(["AMap.MarkerClusterer"], () => { |
|
var gridSize = 60 |
|
var count = markerArrcluster.length; |
|
var _renderClusterMarker = function (context) { |
|
var factor = Math.pow(context.count / count, 1 / 18); |
|
var div = document.createElement('div'); |
|
var Hue = 180 - factor * 180; |
|
var bgColor = 'hsla(' + Hue + ',100%,40%,0.7)'; |
|
var fontColor = 'hsla(' + Hue + ',100%,90%,1)'; |
|
var borderColor = 'hsla(' + Hue + ',100%,40%,1)'; |
|
var shadowColor = 'hsla(' + Hue + ',100%,90%,1)'; |
|
div.style.backgroundColor = bgColor; |
|
var size = Math.round(30 + Math.pow(context.count / count, 1 / 5) * 20); |
|
div.style.width = div.style.height = size + 'px'; |
|
div.style.border = 'solid 1px ' + borderColor; |
|
div.style.borderRadius = size / 2 + 'px'; |
|
div.style.boxShadow = '0 0 5px ' + shadowColor; |
|
div.innerHTML = context.count; |
|
div.style.lineHeight = size + 'px'; |
|
div.style.color = fontColor; |
|
div.style.fontSize = '14px'; |
|
div.style.textAlign = 'center'; |
|
context.marker.setOffset(new AMap.Pixel(-size / 2, -size / 2)); |
|
context.marker.setContent(div) |
|
}; |
|
var _renderMarker = (context) => { |
|
var content = `<img class='clusterImgCollection' src="${context.data[0].image}" alt="">`; |
|
var offset = new AMap.Pixel(-15, -15); |
|
context.marker.setContent(content) |
|
context.marker.setOffset(offset) |
|
} |
|
this.cluster = new AMap.MarkerCluster(this.map, markerArrcluster, { |
|
gridSize: gridSize, // 设置网格像素大小 |
|
renderClusterMarker: _renderClusterMarker, // 自定义聚合点样式 |
|
renderMarker: _renderMarker, // 自定义非聚合点样式 |
|
}); |
|
this.cluster.on('click', (e) => { |
|
if (e.clusterData.length == 1) { |
|
let node = e.clusterData[0].data |
|
// console.log(node) |
|
this.clearData() |
|
this.selectedFireForce = node.fireForceDetailInfo |
|
this.selectedFireForceId = node.fireForceDetailId |
|
if (node.forceType != 0) {//如果是其他消防力量 |
|
this.selectedFireForceLevel = 4 |
|
} else { |
|
this.selectedFireForceLevel = node.level |
|
} |
|
this.FireForceDetailInfo.stationName = node.fireForceDetailInfo.name |
|
|
|
if (node.fireForceDetailId) { |
|
let type |
|
if (node.forceType == 0) { |
|
type = 0 |
|
} else { |
|
type = 1 |
|
} |
|
this.isMasklayer = true |
|
this.http.get(`/api/FireForceDetail/${type}/${node.id}`).subscribe((data: any) => { |
|
this.isMasklayer = false |
|
this.FireForceDetailInfo = data |
|
if (data.location && data.location.x) {//如果已经标注单位坐标 |
|
this.positionLngLat = data.location |
|
} |
|
//相关资料 |
|
data.relevantInfomationData ? this.AttachmentArr = JSON.parse(data.relevantInfomationData) : null |
|
|
|
if (node.forceType == 0 && node.level == 0) { |
|
this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData |
|
this.ZongcontactData = JSON.parse(data.contactData) || this.ZongcontactData |
|
} |
|
if (node.forceType == 0 && node.level == 1) { |
|
this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData |
|
this.ZhicontactData = JSON.parse(data.contactData) || this.ZhicontactData |
|
} |
|
if (node.forceType == 0 && (node.level == 2 || node.level == 3)) { |
|
this.DaZhongpersonCountData = JSON.parse(data.personCountData) || this.DaZhongpersonCountData |
|
this.DaZhongcontactData = JSON.parse(data.contactData) || this.DaZhongcontactData |
|
} |
|
if (node.forceType != 0) { |
|
this.otherpersonCountData = JSON.parse(data.personCountData) || this.otherpersonCountData |
|
this.othercontactData = JSON.parse(data.contactData) || this.otherpersonCountData |
|
} |
|
}) |
|
|
|
} |
|
//寻找管辖单位 |
|
this.allFireForceList.forEach(item => { |
|
if (item.id == node.parentId) { |
|
this.superior.name = item.name |
|
this.superior.code = item.code |
|
} |
|
}) |
|
} |
|
}) |
|
}); |
|
|
|
} |
|
ngOnInit(): void { |
|
this.getAllFireForce() |
|
setTimeout(() => { |
|
this.createMap() |
|
}, 0); |
|
} |
|
//获得所有消防力量 |
|
newdata: any |
|
allFireForceList: any = [] |
|
getAllFireForce() { |
|
let MinIntegrity = 0 |
|
let MaxIntegrity = 1.1 |
|
if (this.searchForm.integrityNum == '0') { |
|
MinIntegrity = 0 |
|
MaxIntegrity = 0.5 |
|
} else if (this.searchForm.integrityNum == '1') { |
|
MinIntegrity = 0.5 |
|
MaxIntegrity = 0.6 |
|
} else if (this.searchForm.integrityNum == '2') { |
|
MinIntegrity = 0.6 |
|
MaxIntegrity = 0.7 |
|
} else if (this.searchForm.integrityNum == '3') { |
|
MinIntegrity = 0.7 |
|
MaxIntegrity = 0.8 |
|
} else if (this.searchForm.integrityNum == '4') { |
|
MinIntegrity = 0.8 |
|
MaxIntegrity = 0.9 |
|
} else if (this.searchForm.integrityNum == '5') { |
|
MinIntegrity = 0.9 |
|
MaxIntegrity = 1.1 |
|
} else if (this.searchForm.integrityNum == '-1') { |
|
MinIntegrity = 0 |
|
MaxIntegrity = 1.1 |
|
} |
|
let params: any = { |
|
Keyword: this.searchForm.name ? this.searchForm.name : '', |
|
MinIntegrity: MinIntegrity, |
|
MaxIntegrity: MaxIntegrity |
|
} |
|
this.http.get('/api/CustomFireForce', { params: params }).subscribe((data: any) => { |
|
this.allFireForceList = data |
|
this.dataSource.data = this.tree.toTree(data) |
|
this.treeControl.expand(this.treeControl.dataNodes[0]); |
|
}) |
|
} |
|
upDateAllFireForce = (): void => { |
|
this.http.get('/api/CustomFireForce').subscribe((data: any) => { |
|
this.newdata = this.tree.toTree(data) |
|
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.newdata; |
|
let newNodes = this.treeControl.dataNodes; |
|
newNodes = newNodes.filter(n => { |
|
return expandNodes.indexOf(n.id) >= 0; |
|
}); |
|
newNodes.forEach(item => { |
|
this.treeControl.expand(item); |
|
}); |
|
}) |
|
} |
|
private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数 |
|
return { |
|
expandable: !!node.children && node.children.length > 0, |
|
name: node.name, |
|
level: level, |
|
id: node.id, |
|
parentId: node.parentId, |
|
enabled: node.enabled, |
|
order: node.order, |
|
children: node.children, |
|
code: node.code, |
|
division: node.division, |
|
fireForceDetailId: node.fireForceDetailId, |
|
forceType: node.forceType, |
|
fireForceDetailInfo: node.fireForceDetailInfo, |
|
contentVerify: node.contentVerify, |
|
}; |
|
} |
|
treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable); |
|
treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children); |
|
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); |
|
hasChild = (_: number, node: any) => node.expandable; |
|
selectedFireForceId: any |
|
selectedFireForceLevel: any |
|
selectedFireForce: any |
|
//选择要显示的消防力量 |
|
superior: any = { //上级单位 |
|
name: '', |
|
code: '' |
|
} |
|
selectTreeNode(node) { |
|
// console.log(node) |
|
this.isGisTopBox = false |
|
if (this.selectedFireForceId != node.id) { |
|
this.clearData() |
|
this.selectedFireForce = node |
|
this.selectedFireForceId = node.id |
|
if (node.forceType != 0) {//如果是其他消防力量 |
|
this.selectedFireForceLevel = 4 |
|
} else { |
|
this.selectedFireForceLevel = node.level |
|
} |
|
this.FireForceDetailInfo.stationName = node.name |
|
if (this.newPositionMarker) { |
|
this.map.remove(this.newPositionMarker); |
|
} |
|
|
|
if (node.fireForceDetailId) { |
|
this.isPost = false//是否走post创建接口 |
|
let type |
|
if (node.forceType == 0) { |
|
type = 0 |
|
} else { |
|
type = 1 |
|
} |
|
this.isMasklayer = true |
|
this.http.get(`/api/FireForceDetail/${type}/${node.id}`).subscribe((data: any) => { |
|
this.isMasklayer = false |
|
this.FireForceDetailInfo = data |
|
// console.log(888,data) |
|
if (data.location && data.location.x) {//如果已经标注单位坐标 |
|
this.positionLngLat = data.location |
|
this.map.setCenter([data.location.x, data.location.y]); |
|
this.newPositionMarker = new AMap.Marker({ |
|
position: [data.location.x, data.location.y], |
|
content: this.newPositionMarkerContent, |
|
offset: new AMap.Pixel(-15, -18) |
|
}) |
|
// 将 markers 添加到地图 |
|
this.map.add(this.newPositionMarker); |
|
} else { |
|
this.map.setCity('株洲市'); |
|
} |
|
//相关资料 |
|
data.relevantInfomationData ? this.AttachmentArr = JSON.parse(data.relevantInfomationData) : null |
|
|
|
if (node.forceType == 0 && node.level == 0) { |
|
this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData |
|
this.ZongcontactData = JSON.parse(data.contactData) || this.ZongcontactData |
|
} |
|
if (node.forceType == 0 && node.level == 1) { |
|
this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData |
|
this.ZhicontactData = JSON.parse(data.contactData) || this.ZhicontactData |
|
} |
|
if (node.forceType == 0 && (node.level == 2 || node.level == 3)) { |
|
this.DaZhongpersonCountData = JSON.parse(data.personCountData) || this.DaZhongpersonCountData |
|
this.DaZhongcontactData = JSON.parse(data.contactData) || this.DaZhongcontactData |
|
} |
|
if (node.forceType != 0) { |
|
this.otherpersonCountData = JSON.parse(data.personCountData) || this.otherpersonCountData |
|
this.othercontactData = JSON.parse(data.contactData) || this.othercontactData |
|
} |
|
}) |
|
} else { |
|
|
|
this.map.setCity('株洲市'); |
|
} |
|
|
|
//寻找管辖单位 |
|
this.allFireForceList.forEach(item => { |
|
if (item.id == node.parentId) { |
|
this.superior.name = item.name |
|
this.superior.code = item.code |
|
} |
|
}) |
|
} |
|
} |
|
//搜索 |
|
isTreeView: boolean = true//决定显示树还是列表 |
|
searchList() { |
|
if (!this.searchForm.name && !this.searchForm.integrityNum) { |
|
this.isTreeView = true |
|
} else { |
|
this.isTreeView = false |
|
} |
|
|
|
this.getAllFireForce() |
|
} |
|
//重置搜索 |
|
reset() { |
|
this.isTreeView = true |
|
this.selectedFireForceLevel = null |
|
this.searchForm = { |
|
name: '', |
|
integrityNum: '' |
|
} |
|
this.getAllFireForce() |
|
} |
|
//js乘法 |
|
accMul(arg1, arg2, fix) { |
|
if (!parseInt(fix) == fix) { |
|
return; |
|
} |
|
var m = 0, s1 = arg1.toString(), s2 = arg2.toString(); |
|
try { m += s1.split(".")[1].length } catch (e) { } |
|
try { m += s2.split(".")[1].length } catch (e) { } |
|
if (m > fix) { |
|
return (Math.round(Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m - fix)) / Math.pow(10, fix)); |
|
} else if (m <= fix) { |
|
return (Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)).toFixed(fix); |
|
} else { |
|
return (arg1 * arg2).toFixed(fix).toString(); |
|
} |
|
} |
|
//完整度颜色 |
|
integrity(width) { |
|
let _this = this |
|
let style: any = {} |
|
style.width = width + '%'; |
|
if (width < 30) { |
|
style.background = '#FF5D4A' |
|
} |
|
if (width >= 30 && width < 60) { |
|
style.background = '#FFDD00' |
|
} |
|
if (width >= 60) { |
|
style.background = '#5CD64E' |
|
} |
|
return style |
|
} |
|
//删除某条消防队 |
|
deleteFireForce(item, e) { |
|
e.stopPropagation() |
|
// console.log(this.dataSource.data) |
|
let isDelete = window.confirm(`确定要删除${item.name}吗`) |
|
if (isDelete) { |
|
// this.http.delete(`/api/CustomFireForce/${item.id}`).subscribe(data => { |
|
// let config = new MatSnackBarConfig(); |
|
// config.verticalPosition = 'top'; |
|
// config.duration = 3000 |
|
// this.snackBar.open('删除成功','确定',config); |
|
// this.upDateAllFireForce() |
|
// if(item.id == this.selectedFireForce.id){ |
|
// this.selectedFireForceLevel = null |
|
// } |
|
// }) |
|
let body = { |
|
title: item.name, |
|
operation: 2,//删除操作方式 |
|
contentType: 13,//消防力量类型 |
|
itemId: item.id, |
|
verifyState: 3, |
|
} |
|
this.http.post('/api/ContentVerifies', body).subscribe((data) => { |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('删除审核提交成功', '确定', config); |
|
item.contentVerify = data |
|
}) |
|
} |
|
} |
|
//当前点击tab页面第几个 |
|
tabIndex: any = 1 |
|
selectedTab(index) { |
|
this.tabIndex = index |
|
} |
|
|
|
//消防力量详情提交信息 |
|
FireForceDetailInfo: any = { |
|
// id:'',//编号 |
|
stationName: '',//队站名称 |
|
isIndependentAlarm: true,//是否独立报警 |
|
phoneNumber: '',//联系电话 |
|
faxNumber: '',//传真 |
|
jurisdictionArea: null,//辖区面积 |
|
remark: '',//备注 |
|
address: '',//地址 |
|
location: { |
|
x: '', |
|
y: '' |
|
}, |
|
personCountData: [],//人员数量自定义 |
|
contactData: [],//联系方式自定义 |
|
dutyForceData: [],//执勤力量自定义 |
|
relevantInfomationData: []//相关资料 |
|
} |
|
//总队支队人员数量 |
|
ZongpersonCountData: any = [ |
|
{ PropertyName: '现役官兵人数', PropertyValue: '' }, |
|
{ PropertyName: '政府专职消防员数', PropertyValue: '' }, |
|
{ PropertyName: '消防文员数', PropertyValue: '' } |
|
] |
|
//总队联系方式 |
|
ZongcontactData: any = [ |
|
{ PropertyName: '总队长名称', PropertyValue: '' }, |
|
{ PropertyName: '总队长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '总队政委名称', PropertyValue: '' }, |
|
{ PropertyName: '总队政委联系方式', PropertyValue: '' } |
|
] |
|
//支队联系方式 |
|
ZhicontactData: any = [ |
|
{ PropertyName: '支队长名称', PropertyValue: '' }, |
|
{ PropertyName: '支队长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '支队政委名称', PropertyValue: '' }, |
|
{ PropertyName: '支队政委联系方式', PropertyValue: '' } |
|
] |
|
//大队中队人员数量 |
|
DaZhongpersonCountData: any = [ |
|
{ PropertyName: '现役人员', PropertyValue: '' }, |
|
{ PropertyName: '政府专职消防员数', PropertyValue: '' }, |
|
{ PropertyName: '每日执勤人数', PropertyValue: '' } |
|
] |
|
//大队中队联系方式 |
|
DaZhongcontactData: any = [ |
|
{ PropertyName: '站长姓名', PropertyValue: '' }, |
|
{ PropertyName: '站长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '指导员姓名', PropertyValue: '' }, |
|
{ PropertyName: '指导员联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副指导员姓名', PropertyValue: '' }, |
|
{ PropertyName: '副指导员联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长一姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长一联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长二姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长二联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长三姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长三联系方式', PropertyValue: '' } |
|
] |
|
//其他消防力量联系方式 |
|
othercontactData: any = [ |
|
{ PropertyName: '队长', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' }, |
|
{ PropertyName: '站长', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' }, |
|
{ PropertyName: '负责人', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' } |
|
] |
|
//其他消防力量人员数量 |
|
otherpersonCountData: any = [ |
|
{ PropertyName: '每日执勤人数', PropertyValue: '' }, |
|
{ PropertyName: '消防队员总人数', PropertyValue: '' }, |
|
{ PropertyName: '执勤车辆数', PropertyValue: '' }, |
|
{ PropertyName: '灭火剂总量', PropertyValue: '' } |
|
] |
|
//清空表单数据 |
|
clearData() { |
|
this.deletedFile = []//清空相关资料已删除缓存 |
|
this.AttachmentArr = []//清空相关资料 |
|
this.positionLngLat = { x: '', y: '' } |
|
this.FireForceDetailInfo = { |
|
// id:'',//编号 |
|
stationName: '',//队站名称 |
|
isIndependentAlarm: null,//是否独立报警 |
|
phoneNumber: '',//联系电话 |
|
faxNumber: '',//传真 |
|
jurisdictionArea: null,//辖区面积 |
|
remark: '',//备注 |
|
address: '',//地址 |
|
location: { |
|
x: '', |
|
y: '' |
|
}, |
|
personCountData: [],//人员数量自定义 |
|
contactData: [],//联系方式自定义 |
|
dutyForceData: [],//执勤力量自定义 |
|
relevantInfomationData: []//相关资料 |
|
} |
|
this.ZongpersonCountData = [ |
|
{ PropertyName: '现役官兵人数', PropertyValue: '' }, |
|
{ PropertyName: '政府专职消防员数', PropertyValue: '' }, |
|
{ PropertyName: '消防文员数', PropertyValue: '' } |
|
] |
|
this.ZongcontactData = [ |
|
{ PropertyName: '总队长名称', PropertyValue: '' }, |
|
{ PropertyName: '总队长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '总队政委名称', PropertyValue: '' }, |
|
{ PropertyName: '总队政委联系方式', PropertyValue: '' } |
|
] |
|
this.ZhicontactData = [ |
|
{ PropertyName: '支队长名称', PropertyValue: '' }, |
|
{ PropertyName: '支队长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '支队政委名称', PropertyValue: '' }, |
|
{ PropertyName: '支队政委联系方式', PropertyValue: '' } |
|
] |
|
this.DaZhongpersonCountData = [ |
|
{ PropertyName: '现役人员', PropertyValue: '' }, |
|
{ PropertyName: '政府专职消防员数', PropertyValue: '' }, |
|
{ PropertyName: '每日执勤人数', PropertyValue: '' } |
|
] |
|
this.DaZhongcontactData = [ |
|
{ PropertyName: '站长姓名', PropertyValue: '' }, |
|
{ PropertyName: '站长联系方式', PropertyValue: '' }, |
|
{ PropertyName: '指导员姓名', PropertyValue: '' }, |
|
{ PropertyName: '指导员联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副指导员姓名', PropertyValue: '' }, |
|
{ PropertyName: '副指导员联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长一姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长一联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长二姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长二联系方式', PropertyValue: '' }, |
|
{ PropertyName: '副站长三姓名', PropertyValue: '' }, |
|
{ PropertyName: '副站长三联系方式', PropertyValue: '' } |
|
] |
|
this.othercontactData = [ |
|
{ PropertyName: '队长', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' }, |
|
{ PropertyName: '站长', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' }, |
|
{ PropertyName: '负责人', PropertyValue: '' }, |
|
{ PropertyName: '联系方式', PropertyValue: '' } |
|
] |
|
this.otherpersonCountData = [ |
|
{ PropertyName: '每日执勤人数', PropertyValue: '' }, |
|
{ PropertyName: '消防队员总人数', PropertyValue: '' }, |
|
{ PropertyName: '执勤车辆数', PropertyValue: '' }, |
|
{ PropertyName: '灭火剂总量', PropertyValue: '' } |
|
] |
|
} |
|
//新增消防力量 |
|
selectedFireForceTypeIndex: any//新增消防力量名称 |
|
addFireForce() { |
|
if (this.selectedFireForceId && this.selectedFireForce.forceType == 0) { |
|
const dialogRef = this.dialog.open(AddFireForce, { |
|
data: {}, |
|
id: 'addWater' |
|
}); |
|
dialogRef.afterClosed().subscribe( |
|
data => { |
|
if (typeof data === 'number' && !isNaN(data)) { |
|
this.isPost = true |
|
this.selectedFireForceTypeIndex = data |
|
this.selectedFireForceLevel = data |
|
// this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null |
|
// this.positionLngLat.x = 0 |
|
// this.positionLngLat.y = 0 |
|
// this.map.setCity('株洲市'); |
|
this.selectedFireForce.contentVerify = null |
|
this.clearData() |
|
} |
|
} |
|
); |
|
} else if (this.selectedFireForceId && this.selectedFireForce.forceType != 0) { |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('该选中机构无法增加其他机构', '确定', config); |
|
} else { |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('请先从左侧列表选择一个组织机构', '确定', config); |
|
} |
|
|
|
} |
|
//保存 |
|
isPost: boolean = false//是否走post创建接口 |
|
newselectedFireForceId: any //创建成功其他消防力量后保存一下创建出来的id |
|
save() { |
|
if (!this.FireForceDetailInfo.stationName) { |
|
alert('名称必填') |
|
return |
|
} |
|
//删除一下数据库的文件 |
|
if (this.deletedFile.length != 0) { |
|
this.deletedFile.forEach(item => { |
|
this.http.delete(`/api/Objects/PlanPlatform/${item.objectName}`).subscribe(data => { |
|
// console.log('删除原文件成功') |
|
}) |
|
}); |
|
} |
|
this.FireForceDetailInfo.jurisdictionArea = Number(this.FireForceDetailInfo.jurisdictionArea) |
|
this.FireForceDetailInfo.relevantInfomationData = JSON.stringify(this.AttachmentArr) |
|
// console.log(1111,this.FireForceDetailInfo) |
|
//如果是总支大中 |
|
this.FireForceDetailInfo.location = { x: '', y: '' } |
|
if (this.atLastPositionLngLat.x) { |
|
this.FireForceDetailInfo.location.x = this.atLastPositionLngLat.x |
|
this.FireForceDetailInfo.location.y = this.atLastPositionLngLat.y |
|
} else { |
|
this.FireForceDetailInfo.location = null |
|
} |
|
if (this.selectedFireForce.forceType == 0 && (this.selectedFireForceLevel == 0 || this.selectedFireForceLevel == 1 || this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3)) {//如果是总队 |
|
let body = this.FireForceDetailInfo |
|
|
|
if (this.selectedFireForceLevel == 0) {//总队 |
|
this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData) |
|
this.FireForceDetailInfo.contactData = JSON.stringify(this.ZongcontactData) |
|
this.FireForceDetailInfo.dutyForceData = null |
|
} |
|
if (this.selectedFireForceLevel == 1) {//支队 |
|
this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData) |
|
this.FireForceDetailInfo.contactData = JSON.stringify(this.ZhicontactData) |
|
this.FireForceDetailInfo.dutyForceData = null |
|
} |
|
if (this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3) {//大队 中队 |
|
this.FireForceDetailInfo.personCountData = JSON.stringify(this.DaZhongpersonCountData) |
|
this.FireForceDetailInfo.contactData = JSON.stringify(this.DaZhongcontactData) |
|
this.FireForceDetailInfo.dutyForceData = null |
|
} |
|
// console.log('body',body) |
|
this.http.put(`/api/FireForceDetail/0/${this.selectedFireForce.id}`, body).subscribe(data => { |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('保存成功', '确定', config); |
|
this.upDateAllFireForce() |
|
}) |
|
} |
|
//如果是其他消防力量 |
|
else { |
|
if (!this.isPost) { |
|
let body = this.FireForceDetailInfo |
|
body.personCountData = JSON.stringify(this.otherpersonCountData) |
|
body.contactData = JSON.stringify(this.othercontactData) |
|
body.dutyForceData = null |
|
let id |
|
if (this.selectedFireForce.forceType == 0) { |
|
id = this.newselectedFireForceId |
|
} else { |
|
id = this.selectedFireForce.id |
|
} |
|
this.http.put(`/api/FireForceDetail/1/${id}`, body).subscribe(data => { |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('保存成功', '确定', config); |
|
this.upDateAllFireForce() |
|
}) |
|
} else { |
|
let forceType |
|
this.selectedFireForceTypeIndex == 4 ? forceType = 1 : null |
|
this.selectedFireForceTypeIndex == 5 ? forceType = 2 : null |
|
this.selectedFireForceTypeIndex == 6 ? forceType = 4 : null |
|
let body = { |
|
organizationId: this.selectedFireForce.id, |
|
name: this.FireForceDetailInfo.stationName, |
|
createTime: new Date(), |
|
forceType: forceType |
|
} |
|
let params = { |
|
organizationId: this.selectedFireForce.id |
|
} |
|
this.http.post('/api/CustomFireForce', body, { params: params }).subscribe((data: any) => { |
|
this.newselectedFireForceId = data.id |
|
this.selectedFireForce = data |
|
let body = this.FireForceDetailInfo |
|
body.personCountData = JSON.stringify(this.otherpersonCountData) |
|
body.contactData = JSON.stringify(this.othercontactData) |
|
body.dutyForceData = null |
|
this.http.put(`/api/FireForceDetail/1/${data.id}`, body).subscribe(data2 => { |
|
this.upDateAllFireForce() |
|
this.selectedFireForceId = data.id |
|
this.isPost = false |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('保存成功', '确定', config); |
|
}) |
|
}) |
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
//提交审核 |
|
submitAudit() { |
|
let isTrue = window.confirm('请确认保存后提交审核，否则将无法审核最新内容，是否继续？') |
|
if (isTrue) { |
|
// console.log('提交审核的消防力量',this.FireForceDetailInfo) |
|
let body = { |
|
title: this.FireForceDetailInfo.stationName, |
|
operation: this.selectedFireForce.contentVerify ? 1 : 0,//操作方式 |
|
contentType: 13,//消防力量类型 |
|
itemId: this.selectedFireForce.id, |
|
verifyState: 3, |
|
} |
|
this.http.post('/api/ContentVerifies', body).subscribe((data) => { |
|
this.selectedFireForce.contentVerify = data |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('提交成功', '确定', config); |
|
}) |
|
} |
|
|
|
} |
|
//撤销审核 |
|
cancelAudit() { |
|
let isTrue = window.confirm('您确认要撤销该审核吗？') |
|
if (isTrue) { |
|
// console.log('撤销审核的消防力量',this.waterData) |
|
this.http.delete(`/api/ContentVerifies/${this.selectedFireForce.contentVerify.id}`).subscribe((data) => { |
|
this.selectedFireForce.contentVerify = null |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('撤销成功', '确定', config); |
|
}) |
|
} |
|
} |
|
close() { |
|
this.selectedFireForceLevel = null |
|
this.selectedFireForceId = null |
|
this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null |
|
this.isGisTopBox = false |
|
} |
|
map: any |
|
placeSearch: any//构造地点查询类 |
|
isMapLabel: boolean = false //是否已经标记坐标 |
|
newPositionMarkerContent: any = |
|
'<div class="custom-content-marker">' + |
|
' <img src="/assets/images/dingwei.png">' + |
|
'</div>' |
|
newPositionMarkerContentBtn: any = |
|
'<div class="custom-content-marker">' + |
|
' <img src="/assets/images/dingwei.png">' + |
|
' <div class="btnbox"><img id="setPositionOk" src="/assets/images/ok.png"><span>|</span><img id="setPositionClose" src="/assets/images/close.png"></div>' + |
|
'</div>' |
|
//创建地图 |
|
newPositionMarker: any//坐标实例 |
|
createMap() { |
|
this.map = new AMap.Map('container', { |
|
zoom: 12 |
|
}) |
|
this.map.setCity('株洲市'); |
|
//输入提示 |
|
var autoOptions = { |
|
input: "tipinput" |
|
}; |
|
AMap.plugin(['AMap.PlaceSearch', 'AMap.AutoComplete'], () => { |
|
let auto = new AMap.AutoComplete(autoOptions); |
|
this.placeSearch = new AMap.PlaceSearch(); //构造地点查询类 |
|
auto.on("select", (e) => { |
|
this.newPositionMarker.setPosition([e.poi.location.lng, e.poi.location.lat]) |
|
this.positionLngLat = { x: e.poi.location.lng, y: e.poi.location.lat } |
|
this.map.setCenter([e.poi.location.lng, e.poi.location.lat]); //设置地图中心点 |
|
});//注册监听，当选中某条记录时会触发 |
|
|
|
}); |
|
} |
|
//点击位置 |
|
isGisTopBox: boolean = false // |
|
searchTitle: any = ''// |
|
|
|
positionLngLat: any = { x: '', y: '' }//临时坐标点 |
|
atLastPositionLngLat: any = { x: '', y: '' }//最终坐标点 |
|
setPosition() { |
|
if (!this.isGisTopBox) { |
|
this.isGisTopBox = true |
|
this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null |
|
let center |
|
if (this.newPositionMarker && this.atLastPositionLngLat.x) {//如果已经标注单位坐标 |
|
center = [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y] |
|
} else if (this.newPositionMarker && !this.atLastPositionLngLat.x && this.FireForceDetailInfo.location && this.FireForceDetailInfo.location.x) { |
|
center = [this.FireForceDetailInfo.location.x, this.FireForceDetailInfo.location.y] |
|
} else { |
|
center = this.map.getCenter(); //获取当前地图中心位置 |
|
} |
|
this.newPositionMarker = new AMap.Marker({ |
|
draggable: true, |
|
position: center, |
|
content: this.newPositionMarkerContentBtn, |
|
offset: new AMap.Pixel(-15, -18) |
|
}); |
|
this.positionLngLat = { x: center.lng || center[0], y: center.lat || center[1] } |
|
this.map.add(this.newPositionMarker); |
|
this.isMapLabel = true |
|
this.newPositionMarker.on('dragend', (e) => { |
|
this.positionLngLat = { x: e.lnglat.lng, y: e.lnglat.lat } |
|
}) |
|
//点击确定 |
|
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'), 'click', (event) => { |
|
this.isGisTopBox = false |
|
this.map.remove(this.newPositionMarker) |
|
this.newPositionMarker = new AMap.Marker({ |
|
position: [this.positionLngLat.x, this.positionLngLat.y], |
|
content: this.newPositionMarkerContent, |
|
offset: new AMap.Pixel(-15, -18) |
|
}); |
|
this.atLastPositionLngLat = JSON.parse(JSON.stringify(this.positionLngLat)) |
|
this.map.add(this.newPositionMarker); |
|
this.positionLngLat = this.atLastPositionLngLat |
|
}) |
|
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'), 'click', (event) => { |
|
this.isGisTopBox = false |
|
this.map.remove(this.newPositionMarker) |
|
if (this.positionLngLat.x && this.positionLngLat.x != 0 && !this.atLastPositionLngLat.x) {//直接取消 |
|
this.map.remove(this.newPositionMarker) |
|
this.positionLngLat = {} |
|
this.atLastPositionLngLat = {} |
|
} else { |
|
this.newPositionMarker = new AMap.Marker({ |
|
position: [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y], |
|
content: this.newPositionMarkerContent, |
|
offset: new AMap.Pixel(-15, -18) |
|
}); |
|
this.map.setCenter([this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]); //设置地图中心点 |
|
this.map.add(this.newPositionMarker); |
|
this.positionLngLat = this.atLastPositionLngLat |
|
} |
|
})//取消 |
|
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'), 'touchstart', (event) => { |
|
this.isGisTopBox = false |
|
this.map.remove(this.newPositionMarker) |
|
this.newPositionMarker = new AMap.Marker({ |
|
position: [this.positionLngLat.x, this.positionLngLat.y], |
|
content: this.newPositionMarkerContent, |
|
offset: new AMap.Pixel(-15, -18) |
|
}); |
|
this.atLastPositionLngLat = JSON.parse(JSON.stringify(this.positionLngLat)) |
|
this.map.add(this.newPositionMarker); |
|
this.positionLngLat = this.atLastPositionLngLat |
|
}) |
|
this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'), 'touchstart', (event) => { |
|
this.isGisTopBox = false |
|
this.map.remove(this.newPositionMarker) |
|
if (this.positionLngLat.x && this.positionLngLat.x != 0 && !this.atLastPositionLngLat.x) {//直接取消 |
|
this.map.remove(this.newPositionMarker) |
|
this.positionLngLat = {} |
|
this.atLastPositionLngLat = {} |
|
} else { |
|
this.newPositionMarker = new AMap.Marker({ |
|
position: [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y], |
|
content: this.newPositionMarkerContent, |
|
offset: new AMap.Pixel(-15, -18) |
|
}); |
|
this.map.setCenter([this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]); //设置地图中心点 |
|
this.map.add(this.newPositionMarker); |
|
this.positionLngLat = this.atLastPositionLngLat |
|
} |
|
})//取消 |
|
} |
|
|
|
} |
|
|
|
|
|
//上传附件 |
|
file: any; //上传的文件 |
|
AttachmentArr: any = []//上传附件地址集合 |
|
uploadId: any//分块上传id |
|
objectName: any |
|
progressBarValue: any = 0//分块上传进度 |
|
isMasklayer: boolean = false//圆圈遮罩层是否打开 |
|
isMasklayerUploading: boolean = false//上传进度条遮罩层是否打开 |
|
isMasklayerDownload: boolean = false//下载进度条遮罩层是否打开 |
|
uploadAttachment(e) { |
|
this.file = e.target.files[0] || null //上传的文件 |
|
let file = e.target.files[0] || null //获取上传的文件 |
|
let fileSize = file.size || null //上传文件的总大小 |
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
|
|
if (file && fileSize <= shardSize) { //上传文件<=5MB时 |
|
this.isMasklayer = true |
|
let formData = new FormData() |
|
formData.append("file", file) |
|
let storageFolderId //要存储到服务器的文件夹id 一般为当前选中单位的id 如果新创建的话就存到public文件夹 |
|
this.selectedFireForce.id ? storageFolderId = this.selectedFireForce.id : storageFolderId = 'public' |
|
this.http.post(`/api/Objects/PlanPlatform/FireForce/${storageFolderId}`, formData).subscribe((data: any) => { |
|
let obj = { |
|
objectName: data.objectName, |
|
fileName: data.fileName, |
|
fileLength: data.fileLength |
|
} |
|
this.AttachmentArr.push(obj) |
|
this.isMasklayer = false |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('上传成功', '确定', config); |
|
}) |
|
} else if (file && fileSize > shardSize) { //上传文件>5MB时,分块上传 |
|
this.isMasklayerUploading = true |
|
let data = { filename: file.name } |
|
let storageFolderId //要存储到服务器的文件夹id 一般为当前选中单位的id 如果新创建的话就存到public文件夹 |
|
this.selectedFireForce.id ? storageFolderId = this.selectedFireForce.id : storageFolderId = 'public' |
|
this.http.post(`/api/NewMultipartUpload/PlanPlatform/FireForce/${storageFolderId}`, {}, { params: data }).subscribe((data: any) => { //初始化分段上传 |
|
this.objectName = data.objectName |
|
this.uploadId = data.uploadId |
|
this.subsectionUploading() |
|
}) |
|
} |
|
} |
|
PartNumberETag: any = []; //每次返回需要保存的信息 |
|
|
|
//开始分段上传 |
|
async subsectionUploading() { |
|
let file = this.file || null //获取上传的文件 |
|
let fileSize = file.size || null //上传文件的总大小 |
|
let shardSize = 5 * 1024 * 1024 //5MB一个分片 |
|
let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段 |
|
for (let i = 0; i < allSlice; i++) { //循环分段上传 |
|
let start = i * shardSize //切割文件开始位置 |
|
let end = Math.min(fileSize, start + shardSize); //切割文件结束位置 |
|
let formData = new FormData() |
|
formData.append("file", file.slice(start, end)) |
|
|
|
//同步写法实现异步调用 |
|
let result = await new Promise((resolve, reject) => { |
|
// await 需要后面返回一个 promise 对象 |
|
this.http.post(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i + 1}`, formData).subscribe((data: any) => { |
|
let msg = { |
|
"partNumber": data.partNumber || null, |
|
"eTag": data.eTag || null |
|
} |
|
resolve(msg) // 调用 promise 内置方法处理成功 |
|
}) |
|
}); |
|
this.PartNumberETag.push(result) |
|
// this.progressBarValue = Number((i/allSlice).toFixed(2))*100 |
|
this.progressBarValue = this.accMul(Number((i / allSlice).toFixed(2)) * 100, 1, 0) |
|
if (this.PartNumberETag.length === allSlice) { |
|
this.progressBarValue = 100 |
|
this.endUploading() |
|
} |
|
}//for循环 |
|
|
|
} |
|
|
|
//完成分块上传 |
|
endUploading() { |
|
let data = this.PartNumberETag |
|
let paramsData = { uploadId: this.uploadId } |
|
this.http.post(`/api/CompleteMultipartUpload/PlanPlatform/${this.objectName}`, data, { params: paramsData }).subscribe(data => { |
|
this.PartNumberETag = [] //清空保存返回的信息 |
|
let obj = { |
|
objectName: this.objectName, |
|
fileName: this.file.name, |
|
fileLength: this.file.size |
|
} |
|
this.AttachmentArr.push(obj) |
|
this.isMasklayerUploading = false//关闭进度条遮罩层 |
|
this.progressBarValue = 0//重置进度数 |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('上传成功', '确定', config); |
|
}) |
|
} |
|
|
|
//取消分块上传 |
|
cancelUploading() { |
|
this.http.delete(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}`).subscribe(data => { |
|
this.progressBarValue = 0; |
|
this.isMasklayerUploading = false |
|
this.PartNumberETag = [] //清空保存返回的信息 |
|
const config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('取消上传成功', '确定', config); |
|
}) |
|
} |
|
|
|
//下载 |
|
download(e) { |
|
this.isMasklayerDownload = true //开启下载进度条 |
|
let file = e //传递过来的文件元数据 |
|
let fileSize = file.fileLength //下载文件的总大小 |
|
let shardSize = 3 * 1024 * 1024 //文件大小是否大于10MB |
|
if (file && fileSize <= shardSize) { //<=3MB时直接下载 |
|
this.progressBarValue = 60 |
|
this.http.get(`/api/Objects/PlanPlatform/${e.objectName}`, { responseType: 'blob' },).subscribe(data => { |
|
let url = window.URL.createObjectURL(new Blob([data])); //createObjectURL创建一个下载Blob的url地址 |
|
let link = document.createElement("a"); |
|
link.style.display = "none"; |
|
link.href = url; |
|
let fileName = e.fileName ? e.fileName : e.objectName.split('/')[e.objectName.split('/').length - 1] |
|
link.setAttribute("download", fileName); |
|
document.body.appendChild(link); |
|
link.click(); |
|
this.isMasklayerDownload = false //关闭下载进度条 |
|
this.progressBarValue = 0 //初始化进度条 |
|
}) |
|
} else if (file && fileSize > shardSize) { //>3MB时分块下载 |
|
this.blockingDownload(e) //分段下载 |
|
} |
|
|
|
} |
|
|
|
//分段下载并合并 |
|
async blockingDownload(e) { |
|
let file = e //传递过来的文件元数据 |
|
let fileSize = file.fileLength //下载文件的总大小 |
|
let shardSize = 3 * 1024 * 1024 //3MB一个分片 |
|
let allSlice = Math.ceil(fileSize / shardSize) //总文件/3MB===共分多少段 |
|
let allFile: any = [] //所有的file分段 |
|
|
|
for (let i = 0; i < allSlice; i++) { |
|
let start = i * shardSize //每次下载文件开始位置 |
|
let end = Math.min(fileSize, start + shardSize - 1); //每次下载文件结束为止 |
|
|
|
let result = await new Promise((result, reject) => { |
|
this.http.get(`/api/Objects/PlanPlatform/${e.objectName}`, { headers: { 'range': `bytes= ${start}-${end}` }, responseType: 'blob' }).subscribe(data => { |
|
result(data) |
|
}) |
|
}) |
|
allFile.push(result) |
|
// this.progressBarValue = Number((i/allSlice).toFixed(2))*100 //文件进度数 |
|
this.progressBarValue = this.accMul(Number((i / allSlice).toFixed(2)) * 100, 1, 0) |
|
if (allFile.length === allSlice) { //合并文件输出给浏览器 |
|
let url = window.URL.createObjectURL(new Blob(allFile)); //createObjectURL创建一个下载Blob的url地址 |
|
let link = document.createElement("a"); |
|
link.style.display = "none"; |
|
link.href = url; |
|
let fileName = e.fileName ? e.fileName : e.objectName.split('/')[e.objectName.split('/').length - 1] |
|
link.setAttribute("download", fileName); |
|
document.body.appendChild(link); |
|
link.click(); |
|
this.isMasklayerDownload = false //关闭下载进度条 |
|
this.progressBarValue = 0 //初始化进度条 |
|
} |
|
|
|
} //for循环结束 |
|
|
|
} |
|
|
|
//删除图片 |
|
deletedFile: any = [] |
|
deleteFile(item, e) { |
|
e.stopPropagation() |
|
let isTrue = window.confirm('确定要删除该文件吗？') |
|
if (isTrue) { |
|
let index |
|
this.AttachmentArr.forEach((element, key) => { |
|
if (element.objectName == item.objectName) { |
|
index = key |
|
} |
|
}); |
|
this.AttachmentArr.splice(index, 1) |
|
this.deletedFile.push(item) |
|
let config = new MatSnackBarConfig(); |
|
config.verticalPosition = 'top'; |
|
config.duration = 3000 |
|
this.snackBar.open('删除成功', '确定', config); |
|
} |
|
} |
|
|
|
//点击文件 |
|
clickFile(item) { |
|
let suffix = item.fileName.split('.')[item.fileName.split('.').length - 1] |
|
if (suffix == 'png' || suffix == 'jpg' || suffix == 'JPG') { |
|
let dom = document.getElementById(`viewerjs`) |
|
let pObjs = dom.childNodes; |
|
let node = document.createElement("img") |
|
node.style.display = "none"; |
|
node.src = "/api/Objects/PlanPlatform/" + item.objectName; |
|
node.id = 'img' |
|
dom.appendChild(node) |
|
setTimeout(() => { |
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
|
hidden: () => { |
|
dom.removeChild(pObjs[0]); |
|
viewer.destroy(); |
|
} |
|
}); |
|
node.click(); |
|
}, 0); |
|
} |
|
if (suffix == 'docx' || suffix == 'doc' || suffix == 'pdf') { |
|
let fetchUrl = item.objectName |
|
let json = { |
|
doc: { |
|
docId: new Date(), |
|
title: item.fileName, |
|
fetchUrl: `http://39.106.78.171:8000/api/Objects/PlanPlatform/` + fetchUrl |
|
}, |
|
user: { |
|
uid: "test", |
|
nickName: "test", |
|
avatar: "", |
|
privilege: [ |
|
'FILE_READ', 'FILE_DOWNLOAD', 'FILE_PRINT' |
|
], |
|
}, |
|
} |
|
var stringjson = JSON.stringify(json) |
|
var wordArray = CryptoJS.enc.Utf8.parse(stringjson); |
|
var base64 = CryptoJS.enc.Base64.stringify(wordArray); |
|
window.open(`http://121.5.10.84:80/apps/editor/openPreview?data=${base64}`) |
|
} |
|
if (suffix == 'mp4') { |
|
const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去 |
|
data: { item: item, type: "video" }, |
|
id: 'videodialog' |
|
}); |
|
dialogRef.afterClosed().subscribe(); |
|
} |
|
} |
|
|
|
//收起展开列表 |
|
isPutDown: boolean = false |
|
putDown() { |
|
this.isPutDown = !this.isPutDown |
|
} |
|
} |
|
|
|
|
|
|
|
//新增消防力量弹出框 |
|
@Component({ |
|
selector: 'addwater', |
|
templateUrl: './addFireForce.html', |
|
styleUrls: ['./fire-force.component.scss'] |
|
}) |
|
export class AddFireForce { |
|
|
|
constructor(private http: HttpClient, public dialogRef: MatDialogRef<AddFireForce>, @Inject(MAT_DIALOG_DATA) public data, public snackBar: MatSnackBar) { } |
|
|
|
|
|
addList: any = [ |
|
{ id: 4, name: '微型消防站' }, |
|
{ id: 5, name: '企业专职消防站' }, |
|
{ id: 6, name: '义务(志愿)消防站' } |
|
] |
|
selectedFireForceTypeIndex: any = 4 |
|
selecteAddType(item, key) { |
|
this.selectedFireForceTypeIndex = item.id |
|
|
|
} |
|
ngOnInit(): void { |
|
|
|
} |
|
|
|
confirm() { |
|
this.dialogRef.close(this.selectedFireForceTypeIndex) |
|
} |
|
|
|
} |
|
|
|
//查看图片大图和视频 |
|
@Component({ |
|
selector: 'viewdetails', |
|
templateUrl: './viewdetails.html', |
|
styleUrls: ['./fire-force.component.scss'] |
|
}) |
|
export class ViewDetails { |
|
// myControl = new FormControl(); |
|
//注入MatDialogRef，可以用来关闭对话框 |
|
//要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌 |
|
constructor(private http: HttpClient, public dialogRef: MatDialogRef<ViewDetails>, @Inject(MAT_DIALOG_DATA) public data) { } |
|
Url: string |
|
onNoClick(): void { |
|
this.dialogRef.close(); |
|
} |
|
ngOnInit(): void { |
|
this.Url = '/api/Objects/PlanPlatform/' + this.data.item.objectName |
|
} |
|
closeDialog() { |
|
this.dialogRef.close(); |
|
} |
|
|
|
}
|
|
|