+
+
+
+ 列表过滤
+
+
+ 重置
+ 新增
+
+
+
+
+
+ 关键字:
+
+
+
+
+ 完整度:
+
+
+ 请选择
+ {{item.name}}
+
+
+
+ search 搜索
+
+
+
+
+
+ 消防队
+ 完整度
+
+
+
+
+ {{item.name}}
+
+
+ {{accMul(item.integrityScore.toFixed(3),100,1)}}%
+
+
+
+
highlight_off
+
+
+
+
+
+
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 请等待...
+
+
+ 上传中...({{progressBarValue}}%)
+ 取消上传
+
+
+ 下载中...({{progressBarValue}}%)
+
+
+
+
+
+
+ attach_file
+ 上传附件
+
+
+
+
+
+
save 保存
+
open_in_browser 提交审核
+
+
+
+
+
+
+
+
highlight_off
+
+
{{item.fileName}}
+
查看
+
下载
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/data-collection/linkage-forces/linkage-forces.component.scss b/src/app/data-collection/linkage-forces/linkage-forces.component.scss
index ef03c8d..9fbcf0f 100644
--- a/src/app/data-collection/linkage-forces/linkage-forces.component.scss
+++ b/src/app/data-collection/linkage-forces/linkage-forces.component.scss
@@ -5,14 +5,532 @@
display: flex;
box-sizing: border-box;
padding: 10px;
+ font-size: 16px;
+ font-family: Source Han Sans CN;
+ font-weight: 400;
+ color: #000000;
}
.listbox{
width: 400px;
height: 100%;
background-color: #fff;
+ display: flex;
+ flex-direction: column;
+ .topbox{
+ max-height: 200px;
+ box-sizing: border-box;
+ padding: 10px 22px 22px;
+ .add{
+ height: 36px;
+ line-height: 36px;
+ display: flex;
+ justify-content: space-between;
+ }
+ .searchbox{
+ .inputbox{
+ width: 100%;
+ height: 36px;
+ font-size: 14px;
+ line-height: 36px;
+ margin: 10px 0;
+ display: flex;
+ span{
+ margin-right: 5px;
+ }
+ select,input{
+ flex: 1;
+ background-color: #F2F4F6;
+ border: 0;
+ border-radius: 5px;
+ box-sizing: border-box;
+ padding:0 8px;
+
+ }
+ .gray{
+ color: gray;
+ }
+ // input::-moz-placeholder {
+ // color: rgba(90, 83, 83, 0.89);
+ // opacity: 1;
+ // }
+ // input:-ms-input-placeholder {
+ // color: rgba(90, 83, 83, 0.89);;
+ // }
+ // input::-webkit-input-placeholder {
+ // color: rgba(90, 83, 83, 0.89);;
+ // }
+ }
+ }
+ }
+ .contantbox{
+ flex: 1;
+ overflow-y: auto;
+ display: flex;
+ flex-direction: column;
+ .title{
+ display: flex;
+ justify-content: space-between;
+ width: 100%;
+ box-sizing: border-box;
+ padding: 0 33px 0 22px;
+ height: 36px;
+ line-height: 36px;
+ span{
+ font-size: 14px;
+ font-weight: 500;
+ }
+ }
+ .linkageForceList{
+ flex: 1;
+ overflow-y: auto;
+ li{
+ cursor: pointer;
+ width: 100%;
+ height: 36px;
+ line-height: 36px;
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ div{
+ float: left;
+ box-sizing: border-box;
+ }
+ .name{
+ text-align: left;
+ width: 60%;
+ padding-left: 22px;
+ white-space:nowrap;
+ overflow:hidden;
+ text-overflow:ellipsis;
+ }
+ .integrity{
+ height: 58%;
+ width: 32%;
+ position: relative;
+ background-color: #F2F4F6;
+ .integrityNum{
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ color: black;
+ font-size: 13px;
+ cursor: default;
+ }
+ .integrityColorDiv{
+ height: 100%;
+ }
+ }
+ .deletebtn{
+ flex: 1;
+ text-align: center;
+ mat-icon{
+ width: 20px;
+ height: 20px;
+ cursor: pointer;
+ font-size: 20px;
+ vertical-align: text-top;
+ color: rgba(49, 46, 46, 0.144);
+ }
+ mat-icon:hover{
+ color: #000;
+ }
+ }
+ }
+ li:hover{
+ background-color: #b3d3ee;
+ }
+ .selectedLi{
+ background-color: #b3d3ee;
+ }
+ }
+ .paginator{
+ height: 56px;
+ width: 100%;
+ }
+ }
}
.mapbox{
flex: 1;
margin-left: 10px;
background-color: #fff;
+ display: flex;
+ overflow: hidden;
+ flex-direction: column;
+ .mapcheckbox,.swiper-container{
+ width: 100%;
+ height: 50px;
+ .swiper-wrapper{
+ flex: 1;
+ display: flex;
+ height: 50px;
+ line-height: 50px;
+ }
+ mat-checkbox{
+ font-size: 15px;
+ span{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ img{
+ margin-right: 3px;
+ }
+ }
+
+ }
+ mat-checkbox:nth-child(1){
+ margin-left: 20px;
+ }
+
+ }
+ #map{
+ flex: 1;
+ position: relative;
+ #container{
+ width: 100%;
+ height: 100%;
+ }
+ .gistopbox{
+ position: absolute;
+ box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
+ border-radius: 5px;
+ top: 3px;
+ width: 30%;
+ height:40px;
+ background: #FFFFFF;
+ display: flex;
+ align-items: center;
+ cursor: default;;
+ .inputBox{
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ box-sizing: border-box;
+ font-size: 14px;
+ .positionInput{
+ border: 0;
+ border-radius: 6px;
+ width: 80%;
+ height: 28px;
+ background: #F2F2F2;
+ margin-left: 8px;
+ box-sizing: border-box;
+ padding-left: 10px;
+ }
+ }
+
+ }
+ .hidden{
+ opacity: 0;
+ z-index: -1;
+ }
+ .show{
+ opacity: 1;
+ z-index: 1;
+ }
+ }
+ .detailsbox{
+ width: 100%;
+ height:500px;
+ position: relative;
+ .tabsbox{
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ overflow-x: auto;
+ line-height: 40px;
+ display: flex;
+ justify-content: space-between;
+ font-size: 15px;
+ .tabs{
+ div{
+ float: left;
+ width: 120px;
+ text-align: center;
+ cursor: pointer;
+ color: #000000;
+ opacity: 0.4;
+ border-right: 1px solid #F2F4F6;
+ }
+ .selectedBtn{
+ background-color: #2196F3;
+ color: #fff;
+ opacity: 1;
+ }
+ }
+ .btnbox{
+ display: flex;
+ align-items: center;
+ .uploadAttachment{
+ display: inline-block;
+ margin-right: 20px;
+ width: 120px;
+ text-align: center;
+ height: 28px;
+ line-height: 28px;
+ position: relative;
+ button{
+ width: 100%;
+ height: 28px;
+ line-height: 28px;
+ mat-icon{
+ transform: rotate(25deg);
+ font-size: 20px;
+ width: 20px;
+ height: 20px;
+ }
+ }
+ .a-upload{
+ display: inline-block;
+ position: absolute;
+ left: 0;
+ top: 0;
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+ opacity: 0;
+ input{
+ width: 100%;
+ height: 100%;
+ cursor: pointer;
+ }
+ }
+ }
+ span{
+ display: inline-block;
+ cursor: pointer;
+ color: #2196F3;
+ mat-icon{
+ vertical-align: text-top;
+ font-size: 20px;
+ width: 20px;
+ height: 20px;
+ }
+ }
+ span:hover{
+ text-decoration: underline;
+ }
+ .submitAudit{
+ margin: 0 30px;
+ }
+
+ }
+ }
+ .contant{
+ width: 100%;
+ height:460px;
+ overflow-y: auto;
+ p{
+ color: #2196F3;
+ background-color: #F2F4F6;
+ height: 33px;
+ line-height: 33px;
+ box-sizing: border-box;
+ padding-left: 20px;
+ font-size: 15px;
+ }
+ span{
+ font-size: 15px;
+ }
+ input,select{
+ height: 30px;
+ line-height: 30px;
+ box-sizing: border-box;
+ padding: 0 12px;
+ width: 60%;
+ margin-left: 5px;
+ border: 1px solid #EBEBEB;
+ border-radius: 5px;
+ }
+ textarea{
+ width: 89%;
+ margin-left: 5px;
+ height: 85%;
+ border: 1px solid #EBEBEB;
+ border-radius: 5px;
+ }
+ .longinput{
+ width: 74%;
+ }
+ .unitDiv{
+ width: 60%;
+ position: relative;
+ input,select{
+ width: 100%;
+ box-sizing: border-box;
+ padding-right: 50px;
+ }
+ .unit{
+ position: absolute;
+ right: 13px;
+ top: 4px;
+ color: #000000;
+ opacity: 0.4;
+ }
+ }
+ .smallwidth{
+ width: 30%;
+ }
+ // 相关资料
+ .fileDivBox{
+ position: relative;
+ float: left;
+ border: 1px solid #EBEBEB;
+ width: 160px;
+ height: 162px;
+ box-sizing: border-box;
+ padding: 16px 16px 0;
+ display: flex;
+ flex-direction: column;
+ margin: 12px;
+ align-items: center;
+ cursor: pointer;
+ .imgbox{
+ width: 134px;
+ height: 110px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ .thumbnailImg{
+ width: 134px;
+ height: 110px;
+ }
+ }
+
+ span{
+ width: 100%;
+ text-align: center;
+ margin-top: 5px;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: gray;
+ font-size: 14px;
+ }
+ .deleteFile{
+ position: absolute;
+ right: 0;
+ top: 0;
+ width: 18px;
+ height: 18px;
+ font-size: 18px;
+ display: none;
+ }
+ .btn{
+ position: absolute;
+ height: 30px;
+ line-height: 30px;
+ font-size: 14px;
+ display: none;
+ }
+ .btn1{
+ top: 37px;
+ }
+ .btn2{
+ top: 78px;
+ }
+ }
+ .fileDivBox:hover{
+ border: 1px solid #000;
+ .deleteFile{
+ display: block;
+
+ }
+ .deleteFile:hover{
+ color: red;
+ }
+ .btn{
+ display: block;
+ }
+ }
+ }
+ .masklayer{
+ position: absolute;
+ left: 0;
+ top: 0;
+ z-index: 2000;
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,0.2);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ span{
+ font-size: 14px;
+ margin-top: 5px;
+ }
+ .progressbar{
+ width: 15%;
+ }
+ .cancelbtn{
+ height: 32px;
+ line-height: 32px;
+ font-size: 14px;
+ margin-top: 12px;
+ }
+ }
+ }
+}
+
+
+.addLinkageForceBox{
+ width: 530px;
+ height: 262px;
+ display: flex;
+ flex-direction: column;
+ .topbox{
+ width: 100%;
+ height: 40px;
+ line-height: 40px;
+ background-color: #2196F3;
+ text-align: center;
+ color: #FFFFFF;
+ font-size: 15px;
+ }
+ .contant{
+ flex: 1;
+ box-sizing: border-box;
+ padding:20px 30px;
+
+ div{
+ width:86px;
+ margin: 3px;
+ height: 36px;
+ float: left;
+ line-height: 36px;
+ text-align: center;
+ background-color: #F2F4F6;
+ font-size: 14px;
+ cursor: pointer;
+ border: 1px solid #fff;
+ border-radius: 4px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ img{
+ margin-right: 3px;
+ }
+ }
+ .selectedDiv{
+ background-color: #fff;
+ border: 1px solid #2196F3;
+ }
+ }
+ .btnbox{
+ width: 100%;
+ height: 50px;
+ box-sizing: border-box;
+ padding: 0px 30px;
+ display: flex;
+ align-items: flex-start;;
+ justify-content: center;
+ button{
+ width: 80px;
+ height: 36px;
+ line-height: 36px;
+ margin: 0 20px;
+ }
+ }
}
\ No newline at end of file
diff --git a/src/app/data-collection/linkage-forces/linkage-forces.component.ts b/src/app/data-collection/linkage-forces/linkage-forces.component.ts
index cbddc20..919b746 100644
--- a/src/app/data-collection/linkage-forces/linkage-forces.component.ts
+++ b/src/app/data-collection/linkage-forces/linkage-forces.component.ts
@@ -1,5 +1,16 @@
+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 { NzTreeNode } from 'ng-zorro-antd/tree';
+import { TreeService } from 'src/app/http-interceptors/tree.service';
+import Viewer from 'viewerjs'
+import Swiper from 'swiper';
+declare var AMap: any;
@Component({
selector: 'app-linkage-forces',
templateUrl: './linkage-forces.component.html',
@@ -7,9 +18,754 @@ import { Component, OnInit } from '@angular/core';
})
export class LinkageForcesComponent implements OnInit {
- constructor() { }
+ 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:'安监',imgUrl:'/assets/linkageForces/安监.png'},
+ {id:1,name:'电力局',imgUrl:'/assets/linkageForces/电力局.png'},
+ {id:2,name:'公安',imgUrl:'/assets/linkageForces/公安.png'},
+ {id:3,name:'海事',imgUrl:'/assets/linkageForces/海事.png'},
+ {id:4,name:'环保局',imgUrl:'/assets/linkageForces/环保局.png'},
+ {id:5,name:'交通',imgUrl:'/assets/linkageForces/交通.png'},
+ {id:6,name:'民政',imgUrl:'/assets/linkageForces/民政.png'},
+ {id:7,name:'气象局',imgUrl:'/assets/linkageForces/气象局.png'},
+ {id:8,name:'燃气局',imgUrl:'/assets/linkageForces/燃气局.png'},
+ {id:9,name:'市政',imgUrl:'/assets/linkageForces/市政.png'},
+ {id:10,name:'水利',imgUrl:'/assets/linkageForces/水利.png'},
+ {id:11,name:'通信',imgUrl:'/assets/linkageForces/通信.png'},
+ {id:12,name:'医疗',imgUrl:'/assets/linkageForces/医疗.png'},
+ {id:13,name:'应急管理',imgUrl:'/assets/linkageForces/应急管理.png'},
+ {id:14,name:'住建',imgUrl:'/assets/linkageForces/住建.png'}
+ ]
+ ngOnInit(): void {
+ this.getAllFireForce()
+ window.onload = () => {
+ var mySwiper = new Swiper('.swiper-container', {
+ slidesPerView: 10,//每页显示的个数
+ slidesPerGroup: 3,//点击一次需要跳多少次
+ // 如果需要前进后退按钮
+ navigation: {
+ nextEl: '.swiper-button-next',
+ prevEl: '.swiper-button-prev',
+ },
+ })
+ }
+ setTimeout(() => {
+
+ this.createMap()
+ }, 0);
+ }
+ //获得所有联动力量
+ allLinkageForceObj:any//获得的所有联动力量
+ dataLength:any //获取的数据一共多少条
+ PageNumber:any = 1 //当前第几页
+ 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,
+ PageSize : 15,
+ PageNumber : this.PageNumber,
+ }
+ this.http.get('/api/LinkageForces',{params:params}).subscribe((data:any) => {
+ console.log('所有消防力量列表',data)
+ this.dataLength = data.totalCount
+ this.allLinkageForceObj = data
+ })
+ }
+
+
+ //选择要显示的联动力量
+ selectedLinkageForce(item){
+ this.isGisTopBox = false
+ if(this.LinkageForceDetailInfo.id != item.id){
+ this.clearData()
+ this.LinkageForceDetailInfo = item
+ item.location?this.positionLngLat = item.location:null
+ this.AttachmentArr = JSON.parse(item.relevantInfomationData)
+ if(this.newPositionMarker){
+ this.map.remove(this.newPositionMarker);
+ }
+ console.log('当前点击的li',item)
+ if(item.location && item.location.x){//如果已经标注单位坐标
+ console.log('开始标注')
+
+ this.map.setCenter([item.location.x,item.location.y]);
+ this.newPositionMarker = new AMap.Marker({
+ position: [item.location.x,item.location.y],
+ content: this.newPositionMarkerContent,
+ offset: new AMap.Pixel(-15, -18)
+ })
+ // 将 markers 添加到地图
+ this.map.add(this.newPositionMarker);
+ }
+ }
+ }
+ //搜索
+ searchList(){
+ this.getAllFireForce()
+ }
+ //重置搜索
+ reset(){
+ this.searchForm = {
+ name:'',
+ integrityNum:''
+ }
+ this.getAllFireForce()
+ }
+ //分页事件
+ chagePage(e){
+ this.PageNumber = e.pageIndex+1
+ 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
+ }
+ //删除某条联动力量
+ deleteLinkageForc(item,e){
+ e.stopPropagation()
+ let isDelete = window.confirm(`确定要删除${item.name}吗`)
+ if(isDelete){
+ this.http.delete(`/api/LinkageForces/${item.id}`).subscribe(data => {
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('删除成功','确定',config);
+ if(item.id == this.LinkageForceDetailInfo.id){
+ this.LinkageForceDetailInfo.linkageForceType = null
+ }
+ this.getAllFireForce()
+ })
+ }
+ }
+ //当前点击tab页面第几个
+ tabIndex:any = 1
+ selectedTab(index){
+ this.tabIndex = index
+ }
+
+ //联动力量详情提交信息
+ LinkageForceDetailInfo:any = {
+ // id:'',//编号
+ linkageForceType:'',
+ name:'',//名称
+ phoneNumber:'',//联系电话
+ faxNumber:'',//传真
+ remark:'',//备注
+ administrativeRegion:'',//行政区
+ address:'',//地址
+ location:{
+ x:'',
+ y:''
+ },
+ contactName:'',//联系人姓名
+ contactTitle:'',//联系人职务
+ contactPhone:'',//联系人电话
+ serviceContent:'',//服务内容
+ resourceRemark:'',//资源说明
+ relevantInfomationData:[]//相关资料
+ }
+
+ //清空表单数据
+ clearData(){
+ this.deletedFile = []//清空相关资料已删除缓存
+ this.AttachmentArr = []//清空相关资料
+ this.positionLngLat = {x:'',y:''}
+ this.atLastPositionLngLat = {x:'',y:''}
+ this.LinkageForceDetailInfo = {
+ // id:'',//编号
+ linkageForceType:'',
+ name:'',//名称
+ phoneNumber:'',//联系电话
+ faxNumber:'',//传真
+ remark:'',//备注
+ administrativeRegion:'',//行政区
+ address:'',//地址
+ location:{
+ x:'',
+ y:''
+ },
+ contactName:'',//联系人姓名
+ contactTitle:'',//联系人职务
+ contactPhone:'',//联系人电话
+ serviceContent:'',//服务内容
+ resourceRemark:'',//资源说明
+ relevantInfomationData:[]//相关资料
+ }
+ }
+ //新增联动力量
+ selectedFireForceTypeIndex:any//新增消防力量名称
+ addLinkageForce(){
+ const dialogRef = this.dialog.open(AddLinkageForce, {
+ data: {},
+ id:'addLinkageForce'
+ });
+ dialogRef.afterClosed().subscribe(
+ data=>{
+ if(typeof data === 'number' && !isNaN(data)){
+ this.clearData()
+ console.log('清空了',this.LinkageForceDetailInfo)
+ this.LinkageForceDetailInfo.linkageForceType = data
+ this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null
+ this.map.setCity('上海市');
+
+ }
+ }
+ )
+ }
+ //保存
+ save(){
+ if(!this.LinkageForceDetailInfo.name){
+ alert('名称必填')
+ return
+ }
+ this.isMasklayer = true
+ //删除一下数据库的文件
+ if(this.deletedFile.length != 0){
+ this.deletedFile.forEach(item => {
+ this.http.delete(`/api/Objects/PlanPlatform/${item.objectName}`).subscribe(data=>{
+ console.log('删除原文件成功')
+ })
+ });
+ }
+
+ this.LinkageForceDetailInfo.location = {x:'',y:''}
+ this.LinkageForceDetailInfo.RelevantInfomationData = JSON.stringify(this.AttachmentArr)
+ if(this.atLastPositionLngLat.x){
+ this.LinkageForceDetailInfo.location.x = this.atLastPositionLngLat.x
+ this.LinkageForceDetailInfo.location.y = this.atLastPositionLngLat.y
+ }else{
+ this.LinkageForceDetailInfo.location = null
+ }
+ this.LinkageForceDetailInfo.relevantInfomationData = JSON.stringify(this.LinkageForceDetailInfo.relevantInfomationData)
+ let body = this.LinkageForceDetailInfo
+ if(this.LinkageForceDetailInfo.id){
+ this.http.put(`/api/LinkageForces/${this.LinkageForceDetailInfo.id}`,body).subscribe((data:any) =>{
+ console.log('修改成功',data)
+ this.isMasklayer = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('修改成功','确定',config);
+ // this.LinkageForceDetailInfo.id = data.id
+ this.getAllFireForce()
+
+ })
+ }else{
+ this.http.post('/api/LinkageForces',body).subscribe((data:any) =>{
+ console.log('创建成功',data)
+ this.isMasklayer = false
+ let config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('保存成功','确定',config);
+ this.LinkageForceDetailInfo = data
+ this.getAllFireForce()
+ })
+ }
+
+
+ }
+
+ map:any
+ placeSearch:any//构造地点查询类
+ isMapLabel:boolean = false //是否已经标记坐标
+ newPositionMarkerContent:any =
+ '
' +
+ '
' +
+ '
'
+ newPositionMarkerContentBtn:any =
+ '
'
+ //创建地图
+ 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]); //设置地图中心点
+ });//注册监听，当选中某条记录时会触发
+
+ });
+
+ if(this.isMapLabel){//如果已经标注单位坐标
+ console.log('已标注单位位置')
+ // this.map.setCenter([this.unitinfo.location.x,this.unitinfo.location.y]);
+ // this.oldPositionMarker = new AMap.Marker({
+ // position: [this.unitinfo.location.x,this.unitinfo.location.y],
+ // content: this.newPositionMarkerContent,
+ // offset: new AMap.Pixel(-15, -18)
+ // })
+ // // 将 markers 添加到地图
+ // this.map.add(this.oldPositionMarker);
+ }else{
+ console.log('未标注单位位置')
+ // this.map.setCity('上海市');
+ }
+ }
+ //点击位置
+ 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
+ console.log(789,this.atLastPositionLngLat)
+ if(this.newPositionMarker && this.atLastPositionLngLat.x){//如果已经标注单位坐标
+ console.log(1)
+ center = [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]
+ }else if(this.newPositionMarker && !this.atLastPositionLngLat.x && this.LinkageForceDetailInfo.location && this.LinkageForceDetailInfo.location.x){
+ console.log(2)
+ center = [this.LinkageForceDetailInfo.location.x, this.LinkageForceDetailInfo.location.y]
+ }else{
+ console.log(3)
+ 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
+ }
+ })//取消
+ }
+
+ }
+
+
+
+
+ //上传附件
+ file:any; //上传的文件
+ AttachmentArr:any = []//上传附件地址集合
+ uploadId:any//分块上传id
+ objectName:any
+ progressBarValue:any = 0//分块上传进度
+ isMasklayer:boolean = false//圆圈遮罩层是否打开
+ isMasklayerUploading:boolean = false//上传进度条遮罩层是否打开
+ isMasklayerDownload:boolean = false//下载进度条遮罩层是否打开
+ uploadAttachment(e){
+ console.log('选择的文件',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
+ console.log('file',this.file)
+ let formData = new FormData()
+ formData.append("file",file)
+ //this.selectedFireForce.id 选择的组织机构的id
+ this.http.post(`/api/Objects/PlanPlatform/LinkageForce/${this.LinkageForceDetailInfo.id}`,formData).subscribe((data:any)=>{
+ // this.objectName = data.objectName
+ let obj = {
+ objectName:data.objectName,
+ fileName:data.fileName,
+ fileLength:data.fileLength
+ }
+ this.AttachmentArr.push(obj)
+ this.isMasklayer = false
+ console.log('上传成功',data)
+ 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}
+ this.http.post(`/api/NewMultipartUpload/PlanPlatform/LinkageForce/${this.LinkageForceDetailInfo.id}`,{},{params:data}).subscribe((data:any)=>{ //初始化分段上传
+ console.log('初始化分块上传成功',data)
+ 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
{
+ 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){
+ console.log(this.AttachmentArr)
+ 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){
+ console.log(item)
+ let suffix = item.fileName.split('.')[item.fileName.split('.').length-1]
+ if(suffix == 'png' || suffix == 'jpg' || suffix == 'JPG'){
+ console.log('这是图片')
+ 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 config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('暂不支持查看','确定',config);
+ }
+ if(suffix == 'mp4'){
+ const dialogRef = this.dialog.open(ViewDetails2, {//调用open方法打开对话框并且携带参数过去
+ data: {item:item,type:"video"},
+ id:'videodialog2'
+ });
+ dialogRef.afterClosed().subscribe();
+ }
+ }
+
+}
+
+
+
+
+//新增联动力量弹出框
+@Component({
+ selector: 'AddLinkageForce',
+ templateUrl: './addLinkageForce.html',
+ styleUrls: ['./linkage-forces.component.scss']
+})
+export class AddLinkageForce {
+
+ constructor(private http: HttpClient,public dialogRef: MatDialogRef,@Inject(MAT_DIALOG_DATA) public data,public snackBar: MatSnackBar) {}
+
+
+ addList:any = [
+ {id:0,name:'安监',imgUrl:'/assets/linkageForces/安监.png'},
+ {id:1,name:'电力局',imgUrl:'/assets/linkageForces/电力局.png'},
+ {id:2,name:'公安',imgUrl:'/assets/linkageForces/公安.png'},
+ {id:3,name:'海事',imgUrl:'/assets/linkageForces/海事.png'},
+ {id:4,name:'环保局',imgUrl:'/assets/linkageForces/环保局.png'},
+ {id:5,name:'交通',imgUrl:'/assets/linkageForces/交通.png'},
+ {id:6,name:'民政',imgUrl:'/assets/linkageForces/民政.png'},
+ {id:7,name:'气象局',imgUrl:'/assets/linkageForces/气象局.png'},
+ {id:8,name:'燃气局',imgUrl:'/assets/linkageForces/燃气局.png'},
+ {id:9,name:'市政',imgUrl:'/assets/linkageForces/市政.png'},
+ {id:10,name:'水利',imgUrl:'/assets/linkageForces/水利.png'},
+ {id:11,name:'通信',imgUrl:'/assets/linkageForces/通信.png'},
+ {id:12,name:'医疗',imgUrl:'/assets/linkageForces/医疗.png'},
+ {id:13,name:'应急管理',imgUrl:'/assets/linkageForces/应急管理.png'},
+ {id:14,name:'住建',imgUrl:'/assets/linkageForces/住建.png'}
+ ]
+ selectedFireForceTypeIndex:any = 0
+ selecteAddType(item,key){
+ this.selectedFireForceTypeIndex = item.id
+
+ }
ngOnInit(): void {
+
+ }
+
+ confirm(){
+ this.dialogRef.close(this.selectedFireForceTypeIndex)
}
}
+
+//查看图片大图和视频
+@Component({
+ selector: 'viewdetails',
+ templateUrl: './viewdetails.html',
+ styleUrls: ['./linkage-forces.component.scss']
+})
+export class ViewDetails2 {
+ // myControl = new FormControl();
+ //注入MatDialogRef，可以用来关闭对话框
+ //要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌
+ constructor(private http: HttpClient,public dialogRef: MatDialogRef,@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();
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/data-collection/linkage-forces/viewdetails.html b/src/app/data-collection/linkage-forces/viewdetails.html
new file mode 100644
index 0000000..6d917bb
--- /dev/null
+++ b/src/app/data-collection/linkage-forces/viewdetails.html
@@ -0,0 +1 @@
+
+ 
+ 
+ 
+ 
' +
+ '
|