bbq/src/app/routes/supply-management/model/import-supply/import-supply.component.ts

/*
 * @Description  : 
 * @Version      : 1.0
 * @Author       : Shiming
 * @Date         : 2022-03-01 15:13:03
 * @LastEditors  : Shiming
 * @LastEditTime : 2022-03-01 16:18:58
 * @FilePath     : \\tms-obc-web\\src\\app\\routes\\supply-management\\model\\import-supply\\import-supply.component.ts
 * Copyright (C) 2022 huzhenhong. All rights reserved.
 */
import { Component, OnInit, ViewChild } from '@angular/core';
import { STColumn } from '@delon/abc/st';
import { SFComponent, SFSchema, SFSchemaEnum, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
import { _HttpClient } from '@delon/theme';
import { NzMessageService } from 'ng-zorro-antd/message';
import { NzModalRef } from 'ng-zorro-antd/modal';
import { NzUploadChangeParam, NzUploadFile } from 'ng-zorro-antd/upload';
import { Observable, Observer, of } from 'rxjs';
import { map } from 'rxjs/operators';
import { SupplyManagementService } from '../../services/supply-management.service';

@Component({
  selector: 'app-supply-management-import-supply',
  templateUrl: './import-supply.component.html',
})
export class SupplyManagementImportSupplyComponent implements OnInit {
  record: any = {};
  files: any;
  status: boolean = true
  files2: any;
  schema: SFSchema = {};
  ui: SFUISchema = {};
  @ViewChild('sf', { static: false }) sf!: SFComponent;
  constructor(
    private modal: NzModalRef,
    private msgSrv: NzMessageService,
    public service: SupplyManagementService
  ) { }

  ngOnInit(): void {
    this.initSF();
    console.log(this.record)
  }

  initSF() {
    this.schema = {
      properties: {
        shipperAppUserId: {
          title: '货主',
          type: 'string',
          maxLength: 30,
          ui: {
            widget: 'select',
            // serverSearch: true,
            searchDebounceTime: 300,
            searchLoadingText: '搜索中...',
            onSearch: (q: any) => {
              console.log(q === ' ')
              let str =q.replace(/^\s+|\s+$/g,"");
              if (str) {
                return this.service
                  .request(this.service.$api_enterpriceList, { enterpriseName: str })
                  .pipe(map(res => (res as any[]).map(i => ({ label: i.enterpriseName, value: i.id } as SFSchemaEnum))))
                  .toPromise();
              } else {
                return of([]);
              }
            },
            change: (q: any) => {
              let str =q.replace(/^\s+|\s+$/g,"");
              if (str) {
                this.getRegionCode(str);
              }
            }
          } as SFSelectWidgetSchema
        },
        resourceCode: {
          type: 'string',
          title: '网络货运人',
          ui: {
            widget: 'text'
          },
          default: '确认货主后带出'
        },
        enterpriseProjectId: {
          type: 'string',
          title: '项目',
          ui: {
            widget: 'select',
            placeholder: '请选择'
          } as SFSelectWidgetSchema
        },
        resourceCode2: {
          type: 'string',
          title: '导入货源信息',
          ui: {
            widget: 'custom'
          }
        },
      },
      required: ['shipperAppUserId', 'enterpriseProjectId','resourceCode2',],
    };
    this.ui = {
      '*': {
        grid: { span: 20 },
      },
      '$resourceCode2': {
        spanLabelFixed: 130,
        grid: { span: 20 },
      },
      '$resourceCode': {
        spanLabelFixed: 130,
        grid: { span: 20 },
      },
    };
  }
  getRegionCode(regionCode: any) {
    console.log(regionCode);
    return this.service
      .request(this.service.$api_get_enterprise_project, { id: regionCode })
      .pipe(
        map(res =>
          res.map((item: any) => ({
            label: item.projectName,
            value: item.id
          }))
        )
      )
      .subscribe(res => {
        this.sf.getProperty('/enterpriseProjectId')!.schema.enum = res;
        this.sf.getProperty('/enterpriseProjectId')!.widget.reset(res);
      });
  }
  save(): void {
    console.log(this.files)
    // this.service.request(this.service.$api_update_price, { id, freightType, freightPrice, resourceCode, rule, resourceId }).subscribe(res => {
    //   if (res) {
    //     this.msgSrv.success('保存成功');
    //     this.modal.close(true);
    //   }
    // });
  }

  close(): void {
    this.modal.destroy();
  }
  handleChange(info: NzUploadChangeParam): void {
    switch (info.file.status) {
      case 'uploading':
        break;
      case 'done':
        let fileList = [...info.fileList];
        // 2. Read from response and show file link
        fileList = fileList.map((file: any) => {
          if (file.response) {
            file.url = file.response.data.fullFilePath;
          }
          return file;
        });
        this.files2 = fileList[0].name
        break;
      case 'error':
        this.service.msgSrv.error('网络错误');
        break;
    }
  }
  beforeUpload = (file: NzUploadFile, _fileList: NzUploadFile[]) => {
    return new Observable((observer: Observer<boolean>) => {
      const isJpgOrPng = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
      if (!isJpgOrPng) {
        this.service.msgSrv.error('仅支持XLX / XLSX文件格式');
        observer.complete();
        return;
      }
      // tslint:disable-next-line: no-non-null-assertion
      const isLt2M = file.size! / 1024 / 1024 < 3;
      if (!isLt2M) {
        this.service.msgSrv.warning('图片大小超过3兆!');
        observer.complete();
        return;
      }
      observer.next(isJpgOrPng && isLt2M);
      observer.complete();
    });
  };
  downFile() {
    this.service.request(this.service.$api_exportGoodsResourceOperateTemplate).subscribe((res: any)=> {
      console.log(res)
      if(res) {
        this.status = false
      }
    })
    // window.location.href('')
  }
}