Sinopec-Anxin/src/app/pages/home/home.component.ts

import { Component, OnInit, ViewChild, TemplateRef, ViewContainerRef } from '@angular/core';
import { Router, NavigationEnd, ActivatedRoute } from '@angular/router';
import { Title } from '@angular/platform-browser'
import { filter } from 'rxjs/operators';
import { NavChangeService } from '../../service/navChange.service';
import { CacheTokenService } from '../../service/cache-token.service' //引入服务
import { CookieService } from 'ngx-cookie-service';
import { NzMessageService } from 'ng-zorro-antd/message';
import { SignalRAspNetCoreHelper } from '../../../shared/helpers/SignalRAspNetCoreHelper';
import { NzNotificationService } from 'ng-zorro-antd/notification';
import { GetOutOfLineDetailsComponent } from '../today-warning/get-out-of-line-details/get-out-of-line-details.component';
import { NzModalService } from 'ng-zorro-antd/modal';
import { HttpClient } from '@angular/common/http';
declare var abp: any

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  @ViewChild('warning', { static: false }) template?: TemplateRef<{}>;
  constructor(private http: HttpClient, private router: Router, private navChangeService: NavChangeService, public token: CacheTokenService,
    private cookieService: CookieService, private message: NzMessageService, private notificationService: NzNotificationService, private modal: NzModalService, private viewContainerRef: ViewContainerRef) { }

  isGasStationNav: boolean
  isGasStation: boolean
  isGasStationBack: boolean
  num

  surname: string
  userName: string
  ngOnInit(): void {

    this.navChangeService.getMessage().subscribe((message: any) => {
      console.log(message);//send a message
      if (message.name == 'oilstation') {
        this.isGasStationNav = true
      }
    });


    if (this.router.url.indexOf('petrolStation') != -1 && sessionStorage.getItem('isGasStation') == 'false') {//控制返回按钮显示
      this.isGasStationBack = true
    } else {
      this.isGasStationBack = false
    }

    // if (this.router.url.indexOf('petrolStation') != -1 && sessionStorage.getItem('isGasStation') == 'true') {
    //   this.isGasStation = true
    // } else {
    //   this.isGasStation = false
    // }

    if (sessionStorage.getItem('isGasStation') == 'true') {
      this.isGasStation = true
      this.isGasStationNav = true
    } else {
      this.isGasStation = false
      this.isGasStationNav = false
    }

    this.router.events.pipe(
      filter(event => event instanceof NavigationEnd)
    ).subscribe((event: any) => {
      if (event.url.indexOf('petrolStation') != -1 && sessionStorage.getItem('isGasStation') == 'false') {//控制返回按钮显示
        this.isGasStationBack = true
      } else {
        this.isGasStationBack = false
      }
    });

    setInterval(() => {
      this.getTime()
    }, 1000);
    this.isGasStation = JSON.parse(sessionStorage.getItem('isGasStation'))
    if (this.isGasStation) {
      this.surname = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).name
      this.userName = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).userName
    } else {
      this.surname = JSON.parse(sessionStorage.getItem('userdata')).name
      this.userName = JSON.parse(sessionStorage.getItem('userdata')).userName
    }


  }

  reloadPage = (userNotification) => {
    console.log('abp.notifications.received收到通知', userNotification);
    this.receiptOfNotification(userNotification)
  };

  ngAfterViewInit() {
    SignalRAspNetCoreHelper.initSignalR();
    abp.event.on('abp.notifications.received', this.reloadPage);
  }
  messageId = []
  receiptOfNotification(userNotification) {
    let obj = {
      id: userNotification.notification.entityId,
      messageId: this.notificationService.template(this.template!, { nzPlacement: 'bottomRight', nzClass: 'receiptOfNotification', nzDuration: 0, nzData: userNotification }).messageId
    }
    this.messageId.push(obj)
  }
  isVisible = false

  modalData
  look(item) {
    if (item.notification.data.properties.EventSystemName == '灭火器维护' || item.notification.data.properties.EventSystemName == '证照预警') {
      this.message.create('warning', `证照或者器材即将临期，请联系加油站处理！`);
    } else {
      let params = {
        id: item.notification.entityId
      }
      this.http.get('/api/services/app/ViolateRecord/Get', {
        params: params
      }).subscribe((data: any) => {
        const modal = this.modal.create({
          nzContent: GetOutOfLineDetailsComponent,
          nzViewContainerRef: this.viewContainerRef,
          nzWidth: 1200,
          nzBodyStyle: {
            'border': '1px solid #6d9cc7',
            'border-radius': '0px',
            'padding': '0px',
            'box-shadow': '0 0 8px 0 #fff',
            'background': '#000D21',
          },
          nzComponentParams: {
            data: data.result
          },
          nzFooter: null,
          nzOnOk: async () => {

          }
        });
        const instance = modal.getContentComponent();
        this.messageId.forEach((element) => {
          if (element.id == item.notification.entityId) {
            this.notificationService.remove(element.messageId)
          }
        })
        this.readMess(item.notification.id)
      })

    }

  }

  //标记为已读
  readMess(id) {
    let body = {
      id: id
    }
    this.http.post('/api/services/app/Notification/Read', body).subscribe((data: any) => {
      console.log('标记已读成功')
    })
  }
  close(item) {
    // console.log(item)
    this.messageId.forEach((element) => {
      if (element.id == item.notification.entityId) {
        this.notificationService.remove(element.messageId)
      }
    })
  }


  ngOnDestroy() {
    console.log('退出')
    abp.event.off('abp.notifications.received', this.reloadPage);
    abp.signalr.disconnect()
  }

  //获得时间
  time: string
  getTime() {
    let myDate = new Date();
    let y = myDate.getFullYear();
    let M = myDate.getMonth() + 1;     //获取当前月份(0-11,0代表1月)
    let d = myDate.getDate();        //获取当前日(1-31)
    let h = myDate.getHours();       //获取当前小时数(0-23)
    let m = myDate.getMinutes();     //获取当前分钟数(0-59)
    let s = myDate.getSeconds();     //获取当前秒数(0-59)

    //检查是否小于10
    M = check(M);
    d = check(d);
    h = check(h);
    m = check(m);
    s = check(s);
    let timestr = y + "-" + M + "-" + d + "       " + h + ":" + m + ":" + s;
    this.time = timestr;
    //时间数字小于10，则在之前加个“0”补位。
    function check(i) {
      let num = (i < 10) ? ("0" + i) : i;
      return num;
    }
  }

  //退出系统
  signOut() {
    this.message.create('success', `退出成功`);
    this.token.delete()
    sessionStorage.clear()
    // window.localStorage.clear()

    localStorage.removeItem("isautologin")
    this.cookieService.set("token", '', new Date(new Date().getTime() + 1), '/');
    this.cookieService.set("refreshToken", '', new Date(new Date().getTime() + 1), '/');
    this.router.navigate(['/login'])
  }

  navChange(router) {
    this.router.navigate([router])
  }

  goback() {
    this.router.navigate(['/plan'])
    this.isGasStationNav = false
  }


  //全屏
  isfullscreen: boolean = false;
  fullscreenToggle() {
    const docElmWithBrowsersFullScreenFunctions = document.documentElement as HTMLElement & {
      mozRequestFullScreen(): Promise<void>;
      webkitRequestFullscreen(): Promise<void>;
      msRequestFullscreen(): Promise<void>;
    };

    if (docElmWithBrowsersFullScreenFunctions.requestFullscreen) {
      docElmWithBrowsersFullScreenFunctions.requestFullscreen();
    } else if (docElmWithBrowsersFullScreenFunctions.mozRequestFullScreen) { /* Firefox */
      docElmWithBrowsersFullScreenFunctions.mozRequestFullScreen();
    } else if (docElmWithBrowsersFullScreenFunctions.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
      docElmWithBrowsersFullScreenFunctions.webkitRequestFullscreen();
    } else if (docElmWithBrowsersFullScreenFunctions.msRequestFullscreen) { /* IE/Edge */
      docElmWithBrowsersFullScreenFunctions.msRequestFullscreen();
    }

    this.isfullscreen = true;

  }
  closefullscreen() {
    const docWithBrowsersExitFunctions = document as Document & {
      mozCancelFullScreen(): Promise<void>;
      webkitExitFullscreen(): Promise<void>;
      msExitFullscreen(): Promise<void>;
    };
    if (docWithBrowsersExitFunctions.exitFullscreen) {
      docWithBrowsersExitFunctions.exitFullscreen();
    } else if (docWithBrowsersExitFunctions.mozCancelFullScreen) { /* Firefox */
      docWithBrowsersExitFunctions.mozCancelFullScreen();
    } else if (docWithBrowsersExitFunctions.webkitExitFullscreen) { /* Chrome, Safari and Opera */
      docWithBrowsersExitFunctions.webkitExitFullscreen();
    } else if (docWithBrowsersExitFunctions.msExitFullscreen) { /* IE/Edge */
      docWithBrowsersExitFunctions.msExitFullscreen();
    }
    this.isfullscreen = false;
  }
}