import { Component, OnInit, ViewChild, Inject } from '@angular/core';
import {HttpClient} from '@angular/common/http'
import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import { KeySiteImgs2 } from './keysiteimgs.component'
import { ActivatedRoute } from '@angular/router';



@Component({
  selector: 'app-key-site-look',
  templateUrl: './key-site.component.html',
  styleUrls: ['./key-site.component.scss']
})
export class KeySiteLookComponent implements OnInit {

  constructor(public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,private route:ActivatedRoute,) { }

  displayedColumns: string[] = ['mainname', 'position', 'construction', 'nature', 'danger', 'img'];

  ngOnInit(): void {
    this.getCompanyPostion()
    this.getCompanyTips()
    this.getAllBuilding()
  }
  unitId:any = '5e9964caa760a059e84512e9'

  allCompanyPosition:any = []; //所有单位重点部位
  companyTips:any; //所有单位重点提示
  companyInput:any; //单位重点提示数据
  allBuilding:any = []; //所有建筑 + 建筑重点部位 + 建筑重点提示

  //获取单位重点部位
  getCompanyPostion () {
    let id = {companyId:this.unitId}
    this.http.get('/api/CompanyImportantLocations',{params:id}).subscribe(data=>{
      this.allCompanyPosition = data
      this.allCompanyPosition.forEach(element => {
        if(element.imageUrls[0]!=undefined){
          element.imageUrls[0]+= '?x-oss-process=image/resize,m_fill,h_140,w_120'
        }
       
      });
    })
    
  }

  //获取单位重点提示
  getCompanyTips () {
    let id = {companyId:this.unitId}
    this.http.get('/api/CompanyImportantTips',{params:id}).subscribe((data:any)=>{
      if (data) {
        this.companyTips = data
        this.companyInput = data.details}
    })
  }

  //获取所有建筑
  getAllBuilding () {
    let id = {companyId:this.unitId}
    this.http.get('/api/Buildings',{params:id}).subscribe((data:any)=>{
      if (data.length) {
        this.allBuilding = data
        this.allBuilding.forEach(element => {
          element.position = [] //建筑重点部位
          element.tips = null //建筑重点提示
          element.companyInput = null })  //建筑重点提示数据
        this.getAllBuildingPositon()
        this.getAllBuildingTips()
      }
    })
  }

  //获取所有建筑重点部位
  getAllBuildingPositon () {
    this.allBuilding.forEach(element => {
      let id = {buildingId:element.id}
      this.http.get('/api/BuildingImportantLocations',{params:id}).subscribe(data=>{
        element.position = data
        element.position.forEach(element => {
          if(element.imageUrls[0]!=undefined){
            element.imageUrls[0]+= '?x-oss-process=image/resize,m_fill,h_140,w_120'
          }
        });
      })
    });
  }

  //获取所有建筑重点提示
  getAllBuildingTips () {
    this.allBuilding.forEach(element => {
      let id = {buildingId:element.id}
      this.http.get('/api/BuildingImportantTips',{params:id}).subscribe((data:any)=>{
        if (data) {
          element.tips = data
          element.companyInput = data.details}
      })
    });
  }

  //保存单位重点提示
  Preservation () {
    if (this.companyTips) { //编辑单位重点提示
      let data = {
        companyId: this.companyTips.companyId,
        id: this.companyTips.id,
        details: this.companyInput}
      this.http.put(`/api/CompanyImportantTips/${this.companyTips.id}`,data).subscribe(data=>{
        this.getCompanyTips()
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('数据修改成功','确定',config);
      })
    } else { //新增单位重点提示
      let data = {
        companyId: this.unitId,
        id : "",
        details: this.companyInput || ""}
      this.http.post('/api/CompanyImportantTips',data).subscribe(data=>{
        this.getCompanyTips()
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('数据修改成功','确定',config);
      })
    }
  }

  //保存建筑重点提示
  PreservationBuilding (e) {
    if (e.tips) { //编辑建筑重点提示
      let data = {
        buildingId: e.id,
        id: e.tips.id,
        details: e.companyInput}
      this.http.put(`/api/BuildingImportantTips/${e.tips.id}`,data).subscribe(data=>{
        this.toUpdate(e)
      })
    } else { //新增重点单位提示
      let data = {
        buildingId: e.id,
        details: e.companyInput || ""}
      this.http.post('/api/BuildingImportantTips',data).subscribe(data=>{
        this.toUpdate(e)
      })
    }
  }

  //查看图片
  seeImg (e) {
    if(e.length>0){
      var index=e[0].lastIndexOf("\?");
      if(index!=-1){
        e[0]=e[0].substring(0,index)
      }
      
    }
    if (e.length) {
      let data = e
      const dialogRef = this.dialog.open(KeySiteImgs2, {//调用open方法打开对话框并且携带参数过去
        width: '1600px',
        height:'900px',data});
      dialogRef.afterClosed().subscribe();
    } else {
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('暂无图片数据','确定',config);
    }
    this.getCompanyPostion()
    this.getAllBuildingPositon()
  }

  //封装方法获取更新当前tab页重点提示
  toUpdate (e) {
    let id = {buildingId:e.id}
    this.http.get('/api/BuildingImportantTips',{params:id}).subscribe((data:any)=>{
      if (data) {
        this.allBuilding.forEach(element => {
          if (element.id === e.id) {
            element.tips = data
            element.companyInput = data.details}
        });
      } // if
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('数据修改成功','确定',config);
    })
  }



}