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

import { Component, OnInit, ViewChild, TemplateRef, ViewContainerRef } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { filter } from 'rxjs/operators';
import { NavChangeService } from '../../service/navChange.service';
import { CacheTokenService } from '../../service/cache-token.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';
import { ChangePasswordComponent, MyValidators } from '../change-password/change-password.component';
import { listRefreshService } from '../../service/listRefresh.service';
declare var abp: any
import * as moment from 'moment';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { DisposeequipmentComponent } from '../records/warning-statistics-list/disposeequipment/disposeequipment.component';
import { SelectedMenu } from 'src/app/service/selectedMenu.service';
import { Location } from "@angular/common";
import { SystemModelComponent } from './system-model/system-model.component';
import { PatternService } from 'src/app/service/pattern.service';
@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  @ViewChild('warning', { static: false }) template?: TemplateRef<{}>;
  passwordValidateForm!: FormGroup;
  constructor(private listRefreshService: listRefreshService, private http: HttpClient, private router: Router, private navChangeService: NavChangeService, public token: CacheTokenService,
    private message: NzMessageService, private notificationService: NzNotificationService, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private fb: FormBuilder, private selectedMenu: SelectedMenu, private location: Location, private patternService: PatternService) {
    const { password } = MyValidators;

    this.passwordValidateForm = this.fb.group({
      oldpassword: [null, [Validators.required]],
      newpassword: [null, [Validators.required, password]],
      affirmpassword: [null, [Validators.required, password]]

    });
  }

  isGasStationNav: boolean
  isGasStation: boolean
  isGasStationBack: boolean
  num

  surname: string
  userName: string


  //菜单
  menu1 = [
    { name: '首页', url: '/homepage' },
    { name: '数字油站', url: '/plan' },
    { name: '今日预警', url: '/todaywarning' },
    { name: '预警记录', url: '/records_nav' },
    { name: '证照管理', url: '/audit' },
  ]
  menu2 = [
    { name: '数字油站', url: '/plan/petrolStation' },
    { name: '今日预警', url: '/todaywarning/petrolStation' },
    { name: '预警记录', url: '/records_nav/petrolStation' },
    { name: '证照管理', url: '/license/petrolStation' },
  ]
  menu3 = [
    { name: '组织机构管理', url: '/system/organization' },
    { name: '用户管理', url: '/system/user' },
    { name: '角色管理', url: '/system/role' },
    { name: '分析主机管理', url: '/system/host' },
    { name: '推送管理', url: '/system/push' },
    { name: '经营类证照管理', url: '/system/updateOfLicense' },
    { name: '资产类证照管理', url: '/system/fileOfLicense' },
    { name: '菜单管理', url: '/system/menu' },
  ]
  xitongguanli = false
  userMenu = []
  tap = []
  menuList1 = []
  menuList2 = []
  selectedItem
  routerChange(item) {
    if (JSON.parse(sessionStorage.getItem('isGasStation'))) {
      let a = JSON.parse(sessionStorage.getItem("3dSceneData"))
      if (!a.hasBuildingInfo && item.url == "/plan/petrolStation") {
        this.message.info("当前油站未开通!");
        return
      }
    }

    if (item.name == this.selectedItem) {
      return
    }
    sessionStorage.setItem('selectedMenu', item.name)
    this.selectedItem = item.name
    this.router.navigate([item.url])
  }
  isProd: boolean
  ngOnInit(): void {
    this.isProd = this.patternService.isProd
    this.location.subscribe(event => {

      if (event.url == "/homepage") {
        sessionStorage.setItem('selectedMenu', "首页")
        this.selectedItem = "首页"
      } else if (event.url == "/plan" || event.url == "/plan/petrolStation") {
        sessionStorage.setItem('selectedMenu', "数字油站")
        this.selectedItem = "数字油站"
      } else if (event.url == "/todaywarning" || event.url == "/todaywarning/petrolStation") {
        sessionStorage.setItem('selectedMenu', "今日预警")
        this.selectedItem = "今日预警"
      } else if (event.url.indexOf("/records_nav") != -1) {
        if (event.url == "/records_nav") {
          this.router.navigate(['/records_nav/all'])
        } else if (event.url == "/records_nav/petrolStation") {

          this.router.navigate(['/records_nav/petrolStation/all'])

        }
        sessionStorage.setItem('selectedMenu', "预警记录")
        this.selectedItem = "预警记录"
      } else if (event.url == "/license" || event.url == "/license/petrolStation") {
        sessionStorage.setItem('selectedMenu', "证照管理")
        this.selectedItem = "证照管理"
      }

    });

    let a = sessionStorage.getItem('userdata')
    this.userMenu = JSON.parse(a).menus
    for (let index = 0; index < this.userMenu.length; index++) {
      let a = this.userMenu[index].name
      this.tap.push(a)

    }
    if (sessionStorage.getItem('selectedMenu')) {
      this.selectedItem = sessionStorage.getItem('selectedMenu')
    }

    this.isGasStation = JSON.parse(sessionStorage.getItem('isGasStation'))
    //初始化登陆 如果是油站用户
    if (this.isGasStation) {
      this.isGasStationNav = true
      for (let index = 0; index < this.menu2.length; index++) {
        for (let k = 0; k < this.tap.length; k++) {
          if (this.tap[k] == this.menu2[index].name) {
            this.menuList1.push(this.menu2[index])

          }
        }
      }
    } else {//初始化登陆 如果是管理者用户
      this.isGasStationNav = false
      this.isGasStationBack = false
      for (let index = 0; index < this.menu1.length; index++) {
        for (let k = 0; k < this.tap.length; k++) {
          if (this.tap[k] == this.menu1[index].name) {
            this.menuList1.push(this.menu1[index])
          }
        }
      }
      for (let index = 0; index < this.tap.length; index++) {
        if (this.tap[index] == "系统管理") {
          this.xitongguanli = true
        }

      }
    }

    this.router.events.pipe(
      filter(event => event instanceof NavigationEnd)
    ).subscribe((event: any) => {
      //管理者进入油站页面
      if (event.url.indexOf('petrolStation') != -1 && !this.isGasStation) {//控制返回按钮显示
        this.isGasStationNav = true
        this.isGasStationBack = true
      }
      //管理者进入非油站页面
      if (event.url.indexOf('petrolStation') == -1 && !this.isGasStation) {//控制返回按钮显示
        this.isGasStationNav = false
        this.isGasStationBack = false
      }
      //油站人员进入管理页面
      if (event.url.indexOf('petrolStation') == -1 && this.isGasStation) {//控制返回按钮显示
        this.isGasStationNav = false
        this.isGasStationBack = false
      }
      //油站人员进入油站
      if (event.url.indexOf('petrolStation') != -1 && this.isGasStation) {//控制返回按钮显示
        this.isGasStationNav = true
        this.isGasStationBack = false
      }
    });

    setInterval(() => {
      this.getTime()
    }, 1000);

    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
    }


    if ((sessionStorage.getItem('isDefaultPassword') == 'true' || sessionStorage.getItem('isPasswordExpired') == 'true') && JSON.parse(sessionStorage.getItem('userdata')).userName != 'admin') {
      this.changePasswordPopup()
    }

  }

  ngAfterViewInit() {
    SignalRAspNetCoreHelper.initSignalR();
    abp.event.on('abp.notifications.received', this.reloadPage);
  }
  //初次登陆修改密码弹窗
  isVisible = false
  isConfirmLoading = false
  changePasswordPopup() {
    this.isVisible = true
  }
  handleOk(): void {
    console.log(this.passwordValidateForm)
    if (this.passwordValidateForm.invalid) {
      this.message.create('warning', `输入格式不正确`);
    } else {
      if (this.passwordValidateForm.value.newpassword != this.passwordValidateForm.value.affirmpassword) {
        this.message.create('warning', '两次密码输入不一致！');
      } else if (this.passwordValidateForm.value.newpassword == this.passwordValidateForm.value.oldpassword) {
        this.message.create('warning', '旧密码和新密码不能相同！');
      } else {
        this.isConfirmLoading = true;
        let body = {
          currentPassword: this.passwordValidateForm.value.oldpassword,
          newPassword: this.passwordValidateForm.value.newpassword
        }
        this.http.post('/api/services/app/User/ChangePassword', body).subscribe(data => {
          this.message.create('success', '修改成功！');
          this.isConfirmLoading = false;
          this.isVisible = false;
          //清除sessionStorage
          sessionStorage.removeItem('isDefaultPassword')
          sessionStorage.removeItem('isPasswordExpired')
        }, err => {
          this.message.create('warning', err.error.error.message);
          this.isConfirmLoading = false;
        })
      }
    }
  }



  reloadPage = (userNotification) => {
    console.log('abp.notifications.received收到通知', userNotification);
    if (this.router.url.indexOf('todaywarning') != -1 || this.router.url.indexOf('homepage') != -1) {
      let obj = {
        type: 'add',
        data: userNotification
      }
      this.listRefreshService.sendMessage(obj);//发布一条消息
    }
    this.receiptOfNotification(userNotification)
  };


  //右下角消息弹窗
  messageId = []
  receiptOfNotification(userNotification) {
    if (!window.speechSynthesis) {
      this.message.create('warning', `该游览器不支持语音播报`);
    } else {
      let speakMsg = new SpeechSynthesisUtterance('请注意,收到一条新的预警信息,请及时处理!');
      speakMsg.lang = "zh-CN";
      speakMsg.rate = 1;
      speakMsg.pitch = 1.5;
      window.speechSynthesis.speak(speakMsg);
    }
    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)
  }

  modalData
  look(item) {
    console.log('推送信息', item)
    let params = {
      id: item.notification.entityId
    }
    this.http.get('/api/services/app/ViolateRecord/Get', {
      params: params
    }).subscribe((data: any) => {
      console.log('推送信息后获取信息', data)
      setTimeout(() => {
        let copydata = data.result
        if (copydata.violation.violationType == '设备监测') {
          copydata.violatedItemSnapshotObj = JSON.parse(copydata.violatedItemSnapshot)
          const modal = this.modal.create({
            nzContent: DisposeequipmentComponent,
            nzViewContainerRef: this.viewContainerRef,
            nzWidth: 380,
            nzBodyStyle: {
              'border': '1px solid #91CCFF',
              'border-radius': '0px',
              'padding': '7px',
              'box-shadow': '0 0 8px 0 #fff',
              'background-image': 'linear-gradient(#003665, #000f25)'
            },
            nzComponentParams: {
              data: copydata
            },
            nzFooter: null,
            nzClosable: false,
            nzOnOk: async () => {
              if (instance.isScrap) {
                await new Promise(resolve => {
                  let body = {
                    id: copydata.violatedItemSnapshotObj.id,
                    isScrapped: true,
                    organizationUnitId: copydata.violatedItemSnapshotObj.organizationUnitId,
                    name: instance.copydata2.violatedItemSnapshotObj.name,
                    storageLocation: instance.copydata2.violatedItemSnapshotObj.storageLocation,
                    productionDate: moment(instance.copydata2.violatedItemSnapshotObj.productionDate).format('yyyy-MM-DD'),
                    maintenanceDate: moment(instance.copydata2.violatedItemSnapshotObj.maintenanceDate).format('yyyy-MM-DD'),
                    validityEndTime: moment(instance.copydata2.violatedItemSnapshotObj.validityEndTime).format('yyyy-MM-DD')
                  }
                  this.http.put('/api/services/app/FireEquipment/Update', body).subscribe((data: any) => {
                    let body = {
                      id: copydata.id,
                      handleRecord: '报废成功！'
                    }
                    this.http.post('/api/services/app/ViolateRecord/HandleViolateRecord', body).subscribe(data => {
                      resolve(data)
                      this.message.create('success', '报废成功！');
                      copydata.handleTime = new Date()
                      if (this.router.url.indexOf('todaywarning') != -1) {
                        let obj = {
                          type: 'updatehandleTime',
                          data: copydata.id
                        }
                        this.listRefreshService.sendMessage(obj);//发布一条消息
                      }
                      return true
                    })
                  })
                })

              } else {
                if (instance.validateForm.valid) {
                  await new Promise(resolve => {
                    let body = {
                      id: copydata.violatedItemSnapshotObj.id,
                      name: instance.validateForm.value.name,
                      storageLocation: instance.validateForm.value.storageLocation,
                      productionDate: moment(instance.validateForm.value.productionDate).format('yyyy-MM-DD'),
                      maintenanceDate: moment(instance.validateForm.value.maintenanceDate).format('yyyy-MM-DD'),
                      validityEndTime: moment(instance.validateForm.value.validityEndTime).format('yyyy-MM-DD'),
                      organizationUnitId: copydata.violatedItemSnapshotObj.organizationUnitId
                    }
                    this.http.put('/api/services/app/FireEquipment/Update', body).subscribe((data: any) => {
                      let body = {
                        id: copydata.id,
                        handleRecord: '维保成功！'
                      }
                      this.http.post('/api/services/app/ViolateRecord/HandleViolateRecord', body).subscribe(data => {
                        resolve(data)
                        this.message.create('success', '维保成功！');
                        copydata.handleTime = new Date()
                        if (this.router.url.indexOf('todaywarning') != -1) {
                          let obj = {
                            type: 'updatehandleTime',
                            data: copydata.id
                          }
                          this.listRefreshService.sendMessage(obj);//发布一条消息
                        }
                        return true
                      })
                    })
                  })
                } else {
                  this.message.create('warning', '请填写完整！');
                  return false
                }
              }
            }
          });
          const instance = modal.getContentComponent();
        } else {
          const modal = this.modal.create({
            nzContent: GetOutOfLineDetailsComponent,
            nzWrapClassName: "vertical-center-modal",
            nzViewContainerRef: this.viewContainerRef,
            nzWidth: (document.documentElement.clientHeight < 650 || document.documentElement.clientWidth < 1400) ? 1000 : 1200,
            nzClosable: false,
            nzClassName: 'modelnobg',
            nzBodyStyle: {
              'border-radius': '0px',
              'padding': '0px',
            },
            nzComponentParams: {
              data: copydata
            },
            nzFooter: null
          });
          const instance = modal.getContentComponent();
        }
      }, 0);


      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) {
    this.messageId.forEach((element) => {
      if (element.id == item.notification.entityId) {
        this.notificationService.remove(element.messageId)
      }
    })
  }

  //处置
  updateState(item, type) {
    let body = {
      id: item.notification.entityId,
      operation: type
    }
    this.http.put('/api/services/app/StationValidityLicenseNotificationRecord/UpdateState', body).subscribe(data => {
      this.messageId.forEach((element) => {
        if (element.id == item.notification.entityId) {
          this.notificationService.remove(element.messageId)
        }
      })
      this.message.create('success', '操作成功');
    }, err => {
      this.message.create('error', '操作失败');
    })
  }

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

  //获得时间
  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()
    localStorage.removeItem("isautologin")
    this.router.navigate(['/login'])
  }

  navChange(router) {
    if (router == '/oliStationInfo') {
      this.router.navigate([router], { queryParams: { 'id': JSON.parse(sessionStorage.getItem('userdata')).organization.id } })
    } else {
      this.router.navigate([router])
    }
  }
  navChange2() {
    for (let index = 0; index < this.menu3.length; index++) {
      for (let k = 0; k < this.tap.length; k++) {
        if (this.tap[k] == this.menu3[index].name) {
          this.menuList2.push(this.menu3[index])
        }
      }
    }
    if (this.menuList2.length == 0) {
      this.message.create('warning', '未分配系统管理菜单');
      return
    } else {
      window.open(this.menuList2[0].url)
    }
  }
  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;
  }


  //修改密码
  changePassword() {
    const modal: any = this.modal.create({
      nzTitle: '修改密码',
      nzContent: ChangePasswordComponent,
      nzViewContainerRef: this.viewContainerRef,
      nzWidth: 288,
      nzComponentParams: {},
      nzOnOk: async () => {
        if (instance.validateForm.valid) {
          let word = JSON.parse(JSON.stringify(instance.validateForm.value.newpassword)).toLowerCase()
          if (instance.validateForm.value.newpassword != instance.validateForm.value.affirmpassword) {
            this.message.create('warning', '两次密码输入不一致！');
            return false
          } if (word.indexOf('sino') != -1 || word.indexOf('zhonghua') != -1) {
            this.message.create('warning', '口令禁止包含 sinochem、sino、zhonghua (含大小写变体) 等中国中化相关字符');
            return false
          } else {
            await new Promise((resolve, reject) => {
              let body = {
                currentPassword: instance.validateForm.value.oldpassword,
                newPassword: instance.validateForm.value.newpassword
              }
              this.http.post('/api/services/app/User/ChangePassword', body).subscribe(data => {
                resolve(data)
                this.message.create('success', '修改成功！');
                return true
              }, err => {
                this.message.create('warning', err.error.error.message);
                modal.config.nzOkLoading = false
                return false
              })
            })
          }

        } else {
          this.message.create('warning', '请填写完整！');
          return false
        }
      }
    });
    const instance = modal.getContentComponent();
    modal.afterOpen.subscribe(() => console.log('[afterOpen] emitted!'));
    // Return a result when closed
    modal.afterClose.subscribe(result => console.log('[afterClose] The result is:', result));
  }

}