import { Component, OnInit, ViewChild, ElementRef, ViewContainerRef } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { TreeService } from 'src/app/service/tree.service'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown'; import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree'; import { Router } from '@angular/router'; import { NavChangeService } from 'src/app/service/navChange.service'; import { fromEvent } from 'rxjs'; import { debounceTime } from 'rxjs/operators'; import 'linqjs'; import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component'; import { NzModalService } from 'ng-zorro-antd/modal'; import { NzMessageService } from 'ng-zorro-antd/message'; @Component({ selector: 'app-file-license-list', templateUrl: './file-license-list.component.html', styleUrls: ['./file-license-list.component.scss'] }) export class FileLicenseListComponent implements OnInit { validateForm!: FormGroup; constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router, private message: NzMessageService) { } tableScrollHeight async ngOnInit(): Promise { 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 - 10) + 'px' }); this.validateForm = this.fb.group({ organization: [null], name: [null] }); this.tableSpin = true await this.getAllOrganization() this.getStationLicenses() } //获取所有组织机构 nodes: any = [] async getAllOrganization() { let OrganizationUnitId = JSON.parse(sessionStorage.getItem('userdata')).organization.id let params = { OrganizationUnitId: OrganizationUnitId, IsContainsChildren: "true" } await new Promise((resolve, reject) => { this.http.get('/api/services/app/Organization/GetAll', { params: params }).subscribe((data: any) => { data.result.items.forEach(element => { if (element.id == OrganizationUnitId) { element.parentId = null } element.key = element.id element.title = element.displayName }); this.nodes = [...this.toTree.toTree(data.result.items)] this.validateForm.patchValue({ organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id, }); resolve(data) }) }) } ngAfterViewInit(): void { fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件 if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { if (this.totalCount > this.list.length) { console.log('需要加载数据了', event) this.SkipCount = String(Number(this.SkipCount) + 50) await this.getStationLicenses() } } }); } submitForm(): void { for (const i in this.validateForm.controls) { this.validateForm.controls[i].markAsDirty(); this.validateForm.controls[i].updateValueAndValidity(); } this.list = [] this.SkipCount = '0' this.getStationLicenses() } resetForm(e: MouseEvent): void { e.preventDefault(); this.validateForm.reset(); for (const key in this.validateForm.controls) { this.validateForm.controls[key].markAsPristine(); this.validateForm.controls[key].updateValueAndValidity(); } this.validateForm.patchValue({ organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id, }); this.list = [] this.SkipCount = '0' this.getStationLicenses() } tableSpin: boolean totalCount: any //总数 //获取点击组织机构的所有加油站 SkipCount: string = '0' MaxResultCount: string = '100' orId list: any = [] async getStationLicenses() { let params = { StationName: this.validateForm.value.name, OrganizationUnitId: this.validateForm.value.organization, IsContainsChildren: 'true', SkipCount: this.SkipCount, MaxResultCount: this.MaxResultCount, // Sorting: ' BuildingBasicInfo.Id asc' } this.tableSpin = true await new Promise((resolve, reject) => { this.http.get('/api/services/app/StationFileLicense/GetStationLicenses', { params: params }).subscribe((data: any) => { this.totalCount = data.result.totalCount let arr = [] data.result.data.forEach(element => { let keyArr = Object.keys(element); let valueArr = Object.values(element); let newElement = (keyArr as any).zip(valueArr, (a, b) => { return { name: a, value: b } }); //修改排头 let newArr = [] for (let index = 0; index < newElement.length; index++) { const item = newElement[index]; if (item.name == '省公司') { newArr[0] = item newElement.splice(index--, 1) } if (item.name == '区域') { newArr[1] = item newElement.splice(index--, 1) } if (item.name == '油站名称') { newArr[2] = item newElement.splice(index--, 1) } } let atLastArr = newArr.concat(newElement); arr.push(atLastArr) }); setTimeout(() => { let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 10) + 'px' }, 0); this.list = this.list.concat(arr); this.list = [...this.list] console.log('证照表格', this.list) this.tableSpin = false resolve(data) }) }) } //父组件调用子组件方法 public onChildMethod() { this.getStationLicenses() } exportExcel() { // console.log(this.validateForm) const httpOptions = { responseType: 'blob' as 'json', params: { OrganizationUnitId: this.validateForm.value.organization } }; this.http.get(`/api/services/app/StationFileLicense/ExportStationLicenses`, httpOptions).subscribe((data: any) => { // console.log('导出成功') // 文件名中有中文 则对文件名进行转码 const link = document.createElement('a'); const blob = new Blob([data], { type: 'application/vnd.ms-excel' }); link.setAttribute('href', window.URL.createObjectURL(blob)); link.setAttribute('download', '资产类证照' + '.xls'); link.style.visibility = 'hidden'; document.body.appendChild(link); link.click(); document.body.removeChild(link); this.message.create('success', `导出成功`); }, err => { this.message.create('error', `导出失败`); }) } }