import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { STColumn, STComponent } from '@delon/abc/st';
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
import { ModalHelper, _HttpClient } from '@delon/theme';
import { NzMessageService } from 'ng-zorro-antd/message';
import { VehicleService } from '../../../services/vehicle.service';
import { VehicleComponentsListEditComponent } from '../edit/edit.component';
import { VehicleImgViewComponent } from '../img-view/img-view.component';
import { apiConf } from '@conf/api.conf';
import { NzModalService } from 'ng-zorro-antd/modal';
import { ImageViewComponent } from 'src/app/shared/components/imagelist';

@Component({
  selector: 'app-supplier-components-list-view',
  templateUrl: './detail.component.html',
  styleUrls: ['./detail.component.less'],
})
export class VehicleComponentsListDetailComponent implements OnInit {
  i: any;
  url = `/rule?_allow_anonymous=true`;
  @ViewChild('st', { static: false }) st!: STComponent;
  isShow = false;
  isVisible = false;
  isEdit = false;
  modalTitle = '有效期';
  modalName = '';
  ui!: SFUISchema;
  columns!: STColumn[];
  uploadURl = apiConf.waterFileUpload;
  schema!: SFSchema;
  @ViewChild('sf', { static: false }) sf!: SFComponent;
  schema1!: SFSchema;
  @ViewChild('sf1', { static: false }) sf1!: SFComponent;
  validData: any = ['suppliersType'];
  suppliersData: any = {};
  disabledUpload = false;
  detailData: any = this.getDetailList();
  tempalateData :any;

  constructor(
    private http: _HttpClient,
    private modal: ModalHelper,
    public service: VehicleService,
    private route: ActivatedRoute,
    private modalHelper: ModalHelper,
    private msgSrv: NzMessageService,
    private nzModalService: NzModalService
  ) {}

  ngOnInit() {
    this.getDetailList();
    this.initSF();
    this.initSF1();
    this.initST();
  }
    /**
   * 查询参数
   */
     get reqParams() {
      return { id: this.route.snapshot?.params?.id };
    }
  /**
   * 初始化查询表单
   */
  initSF() {
    this.schema = {
      properties: {
        _$expand: { type: 'boolean', ui: { hidden: true } },
        effectiveDate: {
          title: '有效期',
          type: 'string',
          ui: {
            widget: 'date',
            format: 'yyyy-MM-dd 00:00:00',
            // hidden: this.modalName === 'effectiveDate' ? false : true,
          } as SFDateWidgetSchema,
        },
      },
      required: ['effectiveDate'],
    };
    this.ui = { '*': { spanLabelFixed: 120, grid: { span: 24 } } };
  }
  initST() {
    this.columns =[
      { title: '认证司机', index: 'name', width: 300, className: 'text-center' },
      { title: '司机手机号', index: 'mobile', width: 300, className: 'text-center' },
      { title: '是否挂靠', render: 'isSelf', width: 300, className: 'text-center' },
      { title: '录入人员', index: 'totalPrice', width: 300, className: 'text-center' },
      {
        title: '车主申明/挂靠协议',
        fixed: 'right',
        width: '200px',
        className: 'text-left',
        buttons: [
          {
            text: '查看协议',
            click: (_record) => this.viewEvaluate(_record),
          },
          {
            text: '上传协议',
            click: (_record) => this.updateEvaluate(_record),
          },
        ],
      },
    ]
  }
  initSF1() {
    this.schema1 = {
      properties: {
        _$expand: { type: 'boolean', ui: { hidden: true } },
        suppliersType: {
          type: 'string',
          title: '类型',
          enum: [
            { label: '非外部供应商', value: 0 },
            { label: '外部供应商', value: 1 },
          ],
          default: '',
          ui: {
            widget: 'select',
            change: (args: any) => {
              console.log(args, 'args');
              this.suppliersData.suppliersType = args;
              if (args === 1) {
                this.validData = ['suppliersType', 'externalSuppliersId'];
              } else {
                this.validData = ['suppliersType'];
                this.suppliersData.externalSuppliersId = '';
              }
              this.initSF1();
            },
          },
        },
        externalSuppliersId: {
          title: '外部供应商id',
          type: 'string',
          default: '',
          ui: {
            visibleIf: { suppliersType: (value: any) => value === 1 },
          },
        },
      },
      required: this.validData,
    };
  }
  // 获取录单员 
  getDetailList() {
   console.log( this.route.snapshot?.params?.id)
    const params = {
      id: this.route.snapshot?.params?.id
    };
   this.service.request(`${this.service.$api_get_operate_get}`, params).subscribe((res) => {
      console.log(res)
      this.detailData = res;
      this.tempalateData = res;
    })
  }

  goBack() {
    window.history.go(-1);
  }
 

  handleCancel(name: any) {

  }

  /**
  *查看评价
  */
  viewEvaluate(item: any) {
    this.modal.createStatic(VehicleImgViewComponent, { i: { imgUrl: item } }).subscribe(() => {
      // this.st.reload();
    });
  }
  /**
  *查看评价
  */
  updateEvaluate(item: any) {
    this.modal.createStatic(VehicleComponentsListEditComponent, { i: { item }, infoData: item }).subscribe(() => {
      // this.st.reload();
      // this.getInfo();
    });
  }
  handleOK() {
    
  }
  ratify() {
    this.isEdit = true;
  }
  changeUpload({ file, fileList, type }: any, key: string) {
    console.log({ file, fileList, type });
    if (type === 'success') {
      this.detailData[key] = file.response.data.fullFileWatermarkPath;
    }
  }
  deleteImg(key: string) {
    this.nzModalService.warning({
      nzTitle: '是否确认删除该图片',
      nzOnOk: () => {
        this.disabledUpload = true;
        this.detailData[key] = '';
        setTimeout(() => {
          this.disabledUpload = false;
        }, 100);
      }
    });
  }
  showImg(url: any) {
    const params = {
      imgList: [url],
      index: 0
    };
    this.nzModalService.create({ nzContent: ImageViewComponent, nzComponentParams: { params } });
  }

  reset() {
    this.detailData = { ...this.tempalateData };
    this.isEdit = false;
  }

  save() {
    this.isEdit = false;
  }
  private initData() {
    return {
      carNo: '',
      carNoColor: '',
      carModel: '',
      carLength: '',
      archivesNo: '',
      driverLicenseSigningOrg: '',
      carDistinguishCode: '',
      carLoad: '',
      curbWeight: '',
      roadTransportNo: '',
      roadTransportLicenceNo: '',
      carOwner: '',
      isTrailer: null,
      useNature: null,
      driverLicenseRegisterTime: null,
      driverLicenseGetTime: null,
      driverLicenseEndTime: null,
      roadTransportStartTime: null,
      roadTransportEndTime: null,
      carFrontPhotoWatermark: ''
    };
  }
}
