import { ViewChild } from '@angular/core';
/*
 * @Author: your name
 * @Date: 2021-12-03 15:31:52
 * @LastEditTime: 2021-12-23 14:33:36
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts
 */
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute } from '@angular/router';
import { STColumn } from '@delon/abc/st';
import { SFComponent, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
import { _HttpClient } from '@delon/theme';
import { AmapPoiPickerComponent, AmapService, ShipperBaseService } from '@shared';
import { NzMessageService } from 'ng-zorro-antd/message';
import { NzModalService } from 'ng-zorro-antd/modal';
import { OrderManagementService } from '../../services/order-management.service';
@Component({
  selector: 'app-supply-management-vehicle-detail-change',
  templateUrl: './vehicle-detail-change.component.html',
  styleUrls: ['./vehicle-detail-change.component.less']
})
export class OrderManagementVehicleDetailChangeComponent implements OnInit {
  validateForm1: FormGroup;
  id = this.route.snapshot.params.id;
  @ViewChild('distannce3', { static: false })
  i: any= {unLoadingPlaceList:[]};
  logColumns: STColumn[] = [
    { title: '款项', index: 'costName' },
    { title: '总费用（元）', index: 'price' },
    { title: '协议金额（元）', index: 'price' },
    { title: '附加费（元）', index: 'surcharge' },
    { title: '附加费率（%）', index: 'paymentMethodRate' },
    { title: '支付时间', index: ' paymentTime' },
    {
      title: '支付状态',
      className: 'text-center',
      index: 'paymentStatus',
      type: 'badge',
      width: '120px',
      badge: {
        '1': { text: '待申请', color: 'warning' },
        '2': { text: '已支付', color: 'success' },
        '3': { text: '已拒绝', color: 'warning' },
        '4': { text: '申请中', color: 'warning' },
      },
    },
  ];
  totalDistance = 0.0; //总里程
  totalTime = 0.0; //路程总时间
  startInfo: any = [];  // 装货信息
  endInfo: any = [];   // 卸货信息
  unloadingTime: any; // 货源单设置回显
  loadingTime: any; // 货源单设置回显
  sf3data: any; // 货源单设置回显
  sf4data: any; // 货源单设置回显
  @ViewChild('sf3', { static: false }) sf3!: SFComponent;
  schema3: SFSchema = {};
  ui3!: SFUISchema;

  @ViewChild('sf4', { static: false }) sf4!: SFComponent;
  schema4: SFSchema = {};
  ui4!: SFUISchema;
  constructor(
    private route: ActivatedRoute,
    private msgSrv: NzMessageService,
    private service: OrderManagementService,
    private modalService: NzModalService,
    private amapService: AmapService,
    public service2: ShipperBaseService,
    fb: FormBuilder, 
  ) {
    this.validateForm1 = fb.group({
      loadingTime: [null, []],
      unloadingTime: [null, []],
    });
  }

  ngOnInit(): void {
    console.log(this.id)
    this.initSF3();
    this.initSF4();
    this.initData()
  }

  initData() {
    this.service.request(this.service.$api_get_getWholeBillDetail, {id: this.id}).subscribe(res => {
      console.log(res)
      if (res) {
        this.i = res;
        res?.unLoadingPlaceList.forEach((element: any) => {
          if(element.type === 1 || element.type === '1') {
            const controlId = this.startInfo.length;
              this.startInfo.push({
                detailedAddress: element.detailedAddress,
                appUserName: element.appUserName,
                contractTelephone: element.contractTelephone,
                latitude: element.latitude,
                longitude: element.longitude,
                province: element.province,
                city: element.city,
                area: element.area,
                type: element.type,
                id: element.id
              })
            this.validateForm1.addControl(`loadAddress${controlId}`, new FormControl(null, Validators.required));
            this.validateForm1.addControl(`loadName${controlId}`, new FormControl(null, Validators.required));
            this.validateForm1.addControl(`loadPhone${controlId}`, new FormControl(null, Validators.required));
          } else if(element.type === 2 || element.type === '2') {
            const controlId = this.endInfo.length;
              this.endInfo.push({
                detailedAddress: element?.detailedAddress,
                appUserName: element?.appUserName,
                contractTelephone: element?.contractTelephone,
                latitude: element.latitude,
                longitude: element.longitude,
                province: element.province,
                city: element.city,
                area: element.area,
                type: element.type,
                id: element.id
              })
            this.validateForm1.addControl(`unloadAddress${controlId}`, new FormControl(null, Validators.required));
            this.validateForm1.addControl(`unloadName${controlId}`, new FormControl(null, Validators.required));
            this.validateForm1.addControl(`unloadPhone${controlId}`, new FormControl(null, Validators.required));
          }
        });
      }
    })
  }

  hand() {
    this.modalService.create({
      nzTitle: '',
      // nzContent: OrderManagementGaodeMapComponent,
      nzWidth: 1200
    });
  }

  goBack() {
    window.history.go(-1);
  }
  // 取消修改
  cancelChange() {
    window.history.go(-1);
  }
  // 保存修改
  save() {
    if(typeof(this.validateForm1.value.unloadingTime) !== 'string' ) {
      var c = new Date(this.validateForm1.value.unloadingTime);  
      this.validateForm1.value.unloadingTime = c.getFullYear() + '-' + this.addPreZero(c.getMonth() + 1) + '-' + this.addPreZero(c.getDate()) + ' ' + this.addPreZero(c.getHours()) + ':' + this.addPreZero(c.getMinutes()) + ':' + this.addPreZero(c.getSeconds())
    }
    if(typeof(this.validateForm1.value.loadingTime) !== 'string' ) {
      var c = new Date(this.validateForm1.value.loadingTime);  
      this.validateForm1.value.loadingTime = c.getFullYear() + '-' + this.addPreZero(c.getMonth() + 1) + '-' + this.addPreZero(c.getDate()) + ' ' + this.addPreZero(c.getHours()) + ':' + this.addPreZero(c.getMinutes()) + ':' + this.addPreZero(c.getSeconds())
    }
  }
  addPreZero(num: any){
    if(num<10){
     return '0'+num;
    } else {
     return num;
    }
   }
  // -------------------装卸货信息处理
  addStartInfo(event: any) {
    if (this.startInfo.length < 5) {
      const controlId = this.startInfo.length;
      this.startInfo.push({
        detailedAddress: '',
        appUserName: '',
        contractTelephone: '',
        latitude: '',
        longitude: '',
        province: '',
        city: '',
        area: '',
        type: 1
      });
      this.validateForm1.addControl(`loadAddress${controlId}`, new FormControl(null, Validators.required));
      this.validateForm1.addControl(`loadName${controlId}`, new FormControl(null, Validators.required));
      this.validateForm1.addControl(`loadPhone${controlId}`, new FormControl(null, Validators.required));
    }
  }
  subStartInfo(event: any, index: number, id?:any) {
    console.log(event, index, id)
    if(id) {
      this.service.request(this.service.$api_delete_Wholedeletebatch,  [id]).subscribe((res) => {
        console.log(res)
      })
    }
    this.startInfo.splice(index, 1);
    this.validateForm1.removeControl(`loadAddress${index}`);
    this.validateForm1.removeControl(`loadName${index}`);
    this.validateForm1.removeControl(`loadPhone${index}`);
  }
  subEndInfo(event: any, index: number, id?:any) {
    if(id) {
      this.service.request(this.service.$api_delete_Wholedeletebatch,  [id]).subscribe((res) => {
        console.log(res)
      })
    }
    console.log(event, index, id)
    this.endInfo.splice(index, 1);
        this.validateForm1.removeControl(`unloadAddress${index}`);
    this.validateForm1.removeControl(`unloadName${index}`);
    this.validateForm1.removeControl(`unloadPhone${index}`);
  }
  addEndInfo(event: any) {
    if (this.addEndInfo.length < 5) {
      const controlId = this.endInfo.length;
      this.endInfo.push({
        detailedAddress: '',
        appUserName: '',
        contractTelephone: '',
        latitude: '',
        longitude: '',
        province: '',
        city: '',
        area: '',
        type: 2
      });
      this.validateForm1.addControl(`unloadAddress${controlId}`, new FormControl(null, Validators.required));
      this.validateForm1.addControl(`unloadName${controlId}`, new FormControl(null, Validators.required));
      this.validateForm1.addControl(`unloadPhone${controlId}`, new FormControl(null, Validators.required));
    }
  }
   // 打开地图
 openMap(type: string, index: number) {
  const modalRef = this.modalService.create({
    nzTitle: '',
    nzContent: AmapPoiPickerComponent,
    nzWidth: 900,
    nzOnOk: item => {
      const poi = item.poi;
      const locList = poi.pois;
      switch (type) {
        case 'start':
          this.startInfo[index].detailedAddress = poi.formattedAddress;
          this.startInfo[index].longitude = locList[0];
          this.startInfo[index].latitude = locList[1];
          this.startInfo[index].province = poi.addressComponent.province;
          this.startInfo[index].city = poi.addressComponent.city;
          this.startInfo[index].area = poi.addressComponent.district;
          this.startInfo[index].address = poi.formattedAddress;
          break;
        case 'end':
          this.endInfo[index].detailedAddress = poi.formattedAddress;
          this.endInfo[index].longitude = locList[0];
          this.endInfo[index].latitude = locList[1];
          this.endInfo[index].province = poi.addressComponent.province;
          this.endInfo[index].city = poi.addressComponent.city;
          this.endInfo[index].area = poi.addressComponent.district;
          this.endInfo[index].address = poi.formattedAddress;
          break;
        default:
          break;
      }

      if (this.startInfo[0]?.area && this.endInfo[0]?.area) {
        this.amapService.drivingCompute([...this.startInfo], [...this.endInfo]).subscribe((res: any) => {
          this.totalDistance = res.distance;
          this.totalTime = res.time;
        });
      }
    }
  });
}

initSF3() {
  this.schema3 = {
    properties: {
      enterpriseInfoId: {
        title: '网络货运人',
        type: 'string',
        ui: {
          placeholder: '请选择',
          widget: 'select',
          asyncData: () => this.service2.getNetworkFreightForwarder(),
          visibleIf: {
            _$expand: (value: boolean) => value,
          },
        }
      },
      goodsName: {
        type: 'string',
        title: '货物名称',
        ui: {
          widget: 'dict-select',
          params: { dictKey: 'GoodsName' },
          placeholder: '请选择'
        }
      },
      qita: {
        type: 'string',
        title: '',
        ui: {
          visibleIf: {
            goodsName: value => value === '3'
          }
        }
      }
    },
    required: ['goodsName', ]
  };
  this.ui3 = {
    '*': {
      spanLabelFixed: 90,
      grid: { span: 12 }
    },
    $enterpriseInfoId: {
      grid: { span: 16, }
    },
    $goodsName: {
      grid: { span: 12 }
    },
    $qita: {
      grid: { span: 12 }
    }
  };
}
initSF4() {
  this.schema4 = {
    properties: {
      weight: {
        type: 'string',
        title: '货物数量',
        ui: {
          widget: 'custom',
          placeholder: '请输入',
          errors: { required: '必填项' }
        }
      },
      volume: {
        type: 'string',
        title: '',
        ui: {
          widget: 'custom',
          placeholder: '请输入'
        }
      },
      number: {
        type: 'string',
        title: '',
        ui: {
          widget: 'custom',
          placeholder: '请输入'
        }
      },
      carmand: {
        type: 'string',
        title: '用车需求',
        ui: {
          widget: 'custom',
          placeholder: '请输入'
        }
      },
      drivers: {
        type: 'string',
        title: '承运司机',
        ui: {
          widget: 'custom',
          placeholder: '请输入'
        }
      },
      weightModel: {
        type: 'string',
        title: '车型车长承重',
        ui: {
          widget: 'custom',
          placeholder: '请输入'
        }
      },
   
    },
    required: ['weight',]
  };
  this.ui4 = {
    '*': {
      spanLabelFixed: 90,
      grid: { span: 24 }
    },
    $weight: {
      grid: { span: 8 }
    },
    $volume: {
      grid: { span: 8 }
    },
    $number: {
      grid: { span: 8 }
    },
    $carmand: {
      grid: { span: 24 }
    },
    $weightModel: {
      grid: { span: 12 }
    },
    $drivers: {
      grid: { span: 12 }
    },
  };
}
}