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.initSelectedItem(this.router);

    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) => {
        console.log('走这里Elma44',event)
        //管理者进入油站页面
        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();
    // }

    this.getWarningSwitch();
  }

  initSelectedItem(event) {
    // console.log(666, event);
    if (event.url.indexOf("/homepage") !== -1) {
      sessionStorage.setItem("selectedMenu", "首页");
      this.selectedItem = "首页";
    } else if (event.url.indexOf("/todaywarning") !== -1) {
      sessionStorage.setItem("selectedMenu", "今日预警");
      this.selectedItem = "今日预警";
    } else if (event.url.indexOf("/records_nav") != -1) {
      this.selectedItem = "预警记录";
    }
  }
  isWarningVoice = true; //预警声音
  isWarningWindow = true; //预警弹窗
  /**
   * 预警开关
   */
  getWarningSwitch() {
    this.http
      .get("/api/services/app/Session/GetCurrentLoginInformations")
      .subscribe((data: any) => {
        let popupConfig = data.result.user.popupConfig;
        if (!popupConfig) {
          this.isWarningVoice = true;
          this.isWarningWindow = true;
          return;
        }
        this.isWarningVoice = JSON.parse(popupConfig).isWarningVoice;
        this.isWarningWindow = JSON.parse(popupConfig).isWarningWindow;
      });
  }

  warningSwitch(type) {
    let body = {
      isWarningVoice:
        type === "voice" ? !this.isWarningVoice : this.isWarningVoice,
      isWarningWindow:
        type === "window" ? !this.isWarningWindow : this.isWarningWindow,
    };
    this.http
      .post("/api/services/app/User/SetPopupConfig", body, {
        params: {
          userId: JSON.parse(sessionStorage.getItem("userdata")).id,
        },
      })
      .subscribe(
        (data) => {
          if (type === "voice") {
            this.isWarningVoice = !this.isWarningVoice;
            this.isWarningVoice
              ? this.message.success("预警声音已开启")
              : this.message.success("预警声音已关闭");
          } else if (type === "window") {
            this.isWarningWindow = !this.isWarningWindow;
            this.isWarningWindow
              ? this.message.success("预警弹窗已开启")
              : this.message.success("预警弹窗已关闭");
          }
        },
        (err) => {
          this.message.error("修改失败");
        }
      );
  }

  ngAfterViewInit() {
    SignalRAspNetCoreHelper.initSignalR();
    abp.event.on("abp.notifications.received", this.reloadPage);
  }


  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 (this.isWarningVoice) {
      // 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);
      // }
      this.Sound();
    }
    if (this.isWarningWindow) {
      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);
    }
  }
  Sound() {
    var mp3Url = "../../../assets/sound/warning.mp3";
    var player = new Audio(mp3Url);
    player.play(); //播放 mp3这个音频对象
  }
  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();
  }
}