import {Component, ViewChild, ElementRef} from '@angular/core';
import {HwobsService} from "../../file/hwobs.service";

@Component({
  selector: 'app-nav-menu',
  templateUrl: './nav-menu.component.html',
  styleUrls: ['./nav-menu.component.scss']
})
export class NavMenuComponent {


  @ViewChild('fileInput') fileInput: any;
  isCollapsed = false;


//  头像上传
  isMouseOver: boolean = false;
  ngSize: number | null = null;

  handleMouseEnter() {
    this.isMouseOver = true;
    this.ngSize = 64;
  }

  handleMouseLeave() {
    this.isMouseOver = false;
    this.ngSize = null;
  }

  avatarSrc: string | undefined = "assets/images/page-mine/myAvatar.png";

  openFileSelector() {
    this.fileInput.nativeElement.click();
  }

  file!: File
  fileData: any = ""
  fileList: File[] = []

  upload() {
    let filename = this.file.name
    let appId = "0210490" // 以自己学号作为应用目录
    let dateStr = `${new Date().getFullYear()}${new Date().getMonth() + 1}${new Date().getDate()}`
    let hourStr = `${new Date().getHours()}${new Date().getMinutes() + 1}${new Date().getSeconds()}`
    let key = `storage/web-2023/${appId}/${dateStr}/${hourStr}-${filename}`
    this.hwobs.uploadFile(this.file, key)

  }

  onFileChange(event: any) {
    const file = event.target.files[0];
    if (file && file.type.startsWith('image/')) {
      const reader = new FileReader();
      reader.onload = () => {
        this.avatarSrc = reader.result as string;
      };
      reader.readAsDataURL(file);
      this.fileList = event?.target?.files
      this.file = event?.target?.files?.[0]
      //文件上传
      this.upload()


    } else {
      // Handle invalid file type here
    }
  }

//  华为云obs配置
  constructor(private hwobs: HwobsService
  ) {

  }


}
