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

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http'
import { Router, ActivatedRoute } from '@angular/router'
import { CacheTokenService } from '../../service/cache-token.service'//引入服务
import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { NzMessageService } from 'ng-zorro-antd/message';
import { Base64 } from 'js-base64';
import { NzNotificationService } from 'ng-zorro-antd/notification';
import { NzSafeAny } from 'ng-zorro-antd/core/types';
import { SelectedMenu } from 'src/app/service/selectedMenu.service';
import { THIS_EXPR } from '@angular/compiler/src/output/output_ast';

declare var abp: any
@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {

  validateForm!: FormGroup;
  passwordValidateForm!: FormGroup;
  constructor(private http: HttpClient, private router: Router, private route: ActivatedRoute, public token: CacheTokenService, private fb: FormBuilder, private message: NzMessageService, private notificationService: NzNotificationService, private selectedMenu: SelectedMenu) {
    const { password } = MyValidators;
    this.validateForm = this.fb.group({
      userName: [null, [Validators.required]],
      password: [null, [Validators.required, password]],
      remember: [null],
      autologin: [null],
    });
    this.passwordValidateForm = this.fb.group({
      oldpassword: [null, [Validators.required]],
      newpassword: [null, [Validators.required, password]],
      affirmpassword: [null, [Validators.required, password]]
    });
  }

  ngOnInit() {

    //如果本地储存了账号密码信息，那就回显在输入框
    let account = localStorage.getItem('account')
    let password = localStorage.getItem('password')
    if (account && password) {
      this.validateForm.patchValue({
        userName: Base64.decode(localStorage.getItem('account')),
        password: Base64.decode(localStorage.getItem('password'))
      });
      this.remember = true //这一步是回显后让勾选框为选中状态
    }
    //自动登录
    if (localStorage.getItem('isautologin') == 'true') {
      this.submitForm()
      this.autologin = true //这一步是回显后让勾选框为选中状态
    }

  }

  errmsg: string = ''; //错误信息

  //跳转注册页面
  toRegister() {
    this.router.navigate(['/register'])
  }

  //记住密码
  rememberInfo() {
    // 判断用户是否勾选记住密码，如果勾选，在本地储存中储存登录信息
    if (this.remember) {
      localStorage.setItem("account", Base64.encode(this.validateForm.value.userName))
      localStorage.setItem("password", Base64.encode(this.validateForm.value.password))
    }
  }
  //自动登录
  autoLogin() {
    if (this.autologin) {
      localStorage.setItem("isautologin", 'true')
    }
  }

  remember: any//记住密码
  autologin: any//自动登录
  isLoading = false;
  messages
  encryptedAccessToken
  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' },
  ]
  submitForm(): void {

    if (!this.remember) {
      localStorage.removeItem("account")
      localStorage.removeItem("password")
    }
    if (!this.autologin) {
      localStorage.removeItem("isautologin")
    }


    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }
    if (!this.validateForm.valid) {
      this.message.create('error', `请输入账号密码`);
      return
    }
    this.isLoading = true;
    this.http.post('/api/TokenAuth/Authenticate', {
      userNameOrEmailAddress: this.validateForm.value.userName,
      password: this.validateForm.value.password
    }).subscribe(
      (data: any) => {
        sessionStorage.setItem("token", data.result.accessToken);
        sessionStorage.setItem("encryptedAccessToken", data.result.encryptedAccessToken);
        this.http.get('/api/services/app/Session/GetCurrentLoginInformations').subscribe((data: any) => {
          console.log('GetCurrentLoginInformations', data.result)
          if (data.result.user.menus.length == 0 && data.result.user.userName!="admin") {
            this.message.create('error', `当前用户未分配菜单`);
            this.isLoading = false
            return
          }
          sessionStorage.setItem('userdata', JSON.stringify(data.result.user))
          sessionStorage.setItem('userdataOfgasstation', JSON.stringify(data.result.user))
          sessionStorage.setItem('isDefaultPassword', JSON.stringify(data.result.user.isDefaultPassword))
          sessionStorage.setItem('isPasswordExpired', JSON.stringify(data.result.user.isPasswordExpired))
          this.isLoading = false;
          //记住密码
          this.rememberInfo()
          //自动登录
          this.autoLogin()
          if (data.result.user.userName == 'admin') {
            sessionStorage.setItem("isGasStation", 'false');
            this.router.navigate(['/system/organization'])
          } else {
            if (data.result.user.organization.isGasStation) {
              sessionStorage.setItem("isGasStation", 'true');
              let a = sessionStorage.getItem('userdataOfgasstation')
              let menuList = this.returnLastMenus(a, this.menu2)
              let isTrue = menuList.find((item) => {
                return item.name == "今日预警"
              });
              if (isTrue) {
                this.router.navigate(['/todaywarning/petrolStation'])
                sessionStorage.setItem('selectedMenu', '今日预警')
              } else {
                this.router.navigate([menuList[0].url])
                sessionStorage.setItem('selectedMenu', menuList[0].name)
              }
            } else {
              sessionStorage.setItem("isGasStation", 'false');
              let a = sessionStorage.getItem('userdata')
              let menuList = this.returnLastMenus(a, this.menu1)
              let isTrue = menuList.find((item) => {
                return item.name == "首页"
              });
              if (isTrue) {
                this.router.navigate(['/homepage'])
                sessionStorage.setItem('selectedMenu', '首页')
              } else {
                this.router.navigate([menuList[0].url])
                sessionStorage.setItem('selectedMenu', menuList[0].name)
              }
            }
          }
          this.message.create('success', `登录成功`);
        }, err => {
          this.isLoading = false;
        })
      },
      (err) => {
        this.isLoading = false;
        this.message.create('error', err.error.error.details);
      }
    )
  }
  returnLastMenus(data, originalMenus) {
    let userMenu = JSON.parse(data).menus
    let tap = []
    let menuList = []
    for (let index = 0; index < userMenu.length; index++) {
      let a = userMenu[index].name
      tap.push(a)
    }
    for (let index = 0; index < originalMenus.length; index++) {
      for (let k = 0; k < tap.length; k++) {
        if (tap[k] == originalMenus[index].name) {
          menuList.push(originalMenus[index])
        }
      }
    }
    return menuList
  }
  forget() {
    this.message.create('warning', `请联系管理员`);
  }

}
export type MyErrorsOptions = { 'zh-cn': string; en: string } & Record<string, NzSafeAny>;
export type MyValidationErrors = Record<string, MyErrorsOptions>;
export class MyValidators extends Validators {
  static password(control: AbstractControl): MyValidationErrors | null {
    const value = control.value;

    if (isEmptyInputValue(value)) {
      return null;
    }

    return isPassword(value) ? null : { mobile: { 'zh-cn': `长度 12 位以上，包含①大写字母、②小写字母、③数字、④特殊字符四种中的三种组合`, en: `Password phone number is not valid` } };
  }

}
function isEmptyInputValue(value: NzSafeAny): boolean {
  return value == null || value.length === 0;
}
function isPassword(value: string): boolean {
  return typeof value === 'string' && /^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_!@#$%^&*`~()-+=]+$)(?![a-z0-9]+$)(?![a-z\W_!@#$%^&*`~()-+=]+$)(?![0-9\W_!@#$%^&*`~()-+=]+$)[a-zA-Z0-9\W_!@#$%^&*`~()-+=]{12,99}$/.test(value);
}