import { HttpClient } from '@angular/common/http';
import { Component, ElementRef, OnInit, ViewContainerRef } from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd/message';
import { NzModalService } from 'ng-zorro-antd/modal';
import { Observable, fromEvent } from 'rxjs';
import { debounceTime } from 'rxjs/operators';
import { DetailsFileCategoryComponent } from '../../license/file-category/details-file-category/details-file-category.component';
import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component';
import { AuditDetailsInformTimeComponent } from '../audit-inform-time/audit-details-inform-time/audit-details-inform-time.component';
import { GasBaseInfoComponent } from '../gas-base-info/gas-base-info.component';
import { AuditDisposeComponent } from './audit-dispose/audit-dispose.component';

@Component({
  selector: 'app-audit-ing',
  templateUrl: './audit-ing.component.html',
  styleUrls: ['./audit-ing.component.scss']
})
export class AuditIngComponent implements OnInit {

  constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private http: HttpClient, private message: NzMessageService, private element: ElementRef) { }
  tableSpin = false

  tableScrollHeight
  ngOnInit(): void {
    this.tableScrollHeight = '100px'
    // 页面监听
    fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => {
      let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight
      this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px'
    });
    this.getStationList()
  }

  ngAfterViewInit(): void {
    fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe((event: any) => { //监听 DOM 滚动事件
      if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) {
        if (this.totalCount > this.list.length) {
          this.SkipCount = String(Number(this.SkipCount) + 50)
          this.getStationList()
        }
      }
    });
  }

  list = []
  totalCount;//列表总数
  SkipCount: string = '0';
  MaxResultCount: string = '100';
  //获取当前油站档案类证照
  getStationList() {
    this.tableSpin = true
    let data = JSON.parse(sessionStorage.getItem('userdata'));
    let params = {
      OrganizationUnitId: data.organization.id || "",
      IsContainsChildren: "true",
      AuditStatuses: "1",
      SkipCount: this.SkipCount,
      MaxResultCount: this.MaxResultCount,
    }
    this.http.get(`/api/services/app/ContentAuditLog/GetAuditting`, { params }).subscribe((info: any) => {
      info.result.items.forEach(element => {
        element.itemData = JSON.parse(element.itemData)
      });
      this.list = this.list.concat(info.result.items);
      this.list = [...this.list]
      this.totalCount = info.result.totalCount
      this.tableSpin = false
      setTimeout(() => {
        let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight
        this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px'
      }, 0);

      console.log(this.list)
    })
  }



  dispose(item) {
    // if (item.auditStatus != 1) {
    //   return
    // }
    this.getData(item).then(res => {
      item.getData = res
      const modal = this.modal.create({
        nzContent: AuditDisposeComponent,
        nzViewContainerRef: this.viewContainerRef,
        nzWidth: item.auditType == 0 ? 700 : 600,
        nzBodyStyle: {
          'border': '1px solid #91CCFF',
          'border-radius': '0px',
          'padding': '7px',
          'box-shadow': '0 0 8px 0 #fff',
          'background-image': 'linear-gradient(#003665, #000f25)'
        },
        nzStyle: {
          'top': '50px',
        },
        nzComponentParams: {
          data: item
        },
        nzFooter: null,
        nzClosable: false,
        nzOnOk: async () => {
          await new Promise(resolve => {
            let url
            if (item.auditType == 0) {
              url = '/api/services/app/GasStation/Audit'
            } else if (item.auditType == 1) {
              url = '/api/services/app/OrganizationValidityLicenseRule/Audit'
            } else if (item.auditType == 2) {
              url = '/api/services/app/StationValidityLicense/Audit'
            } else if (item.auditType) {
              url = '/api/services/app/StationFileLicense/Audit'
            }
            let params = {
              id: item.auditType == 0 ? item.gasStation.id : item.getData.id,
              remark: instance.textarea
            }
            let body = instance.isPass ? 2 : 3;
            this.http.post(url, body, { params }).subscribe(data => {
              resolve(data);
              this.list = []
              this.SkipCount = '0'
              this.getStationList();
              this.message.create('success', '审核完成！');
              return true
            })
          })
        }
      });
      const instance = modal.getContentComponent();
      modal.afterClose.subscribe(result => { });
    })
  }

  details(item) {
    let component
    if (item.auditType == 0) {
      component = GasBaseInfoComponent
    } else if (item.auditType == 1) {
      component = AuditDetailsInformTimeComponent
    } else if (item.auditType == 2) {
      component = DetailsUpdateCategoryComponent
    } else if (item.auditType) {
      component = DetailsFileCategoryComponent
    }
    this.getData(item).then(res => {
      item.getData = res
      const modal = this.modal.create({
        nzContent: component,
        nzViewContainerRef: this.viewContainerRef,
        nzWidth: item.auditType == 0 ? 700 : 450,
        nzBodyStyle: {
          'border': '1px solid #91CCFF',
          'border-radius': '0px',
          'padding': '7px',
          'box-shadow': '0 0 8px 0 #fff',
          'background-image': 'linear-gradient(#003665, #000f25)'
        },
        nzStyle: {
          'top': '50px',
        },
        nzComponentParams: {
          data: item.getData
        },
        nzFooter: null,
        nzClosable: false,
      });
    })
  }

  //获取证照类data
  getData(item) {
    let url
    if (item.auditType == 0) { //油站基本信息
      return new Promise((resolve, reject) => {
        let organization = { organizationId: item.organizationId }
        resolve(organization)
      })
    } else if (item.auditType == 1) {
      url = '/api/services/app/OrganizationValidityLicenseRule/Get'
    } else if (item.auditType == 2) {
      url = '/api/services/app/StationValidityLicense/Get'
    } else if (item.auditType) {
      url = '/api/services/app/StationFileLicense/Get'
    }
    return new Promise((resolve, reject) => {
      let params = { id: item.itemId }
      this.http.get(url, { params }).subscribe((data: any) => {
        resolve(data.result)
      })
    })
  }

}