import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import {
  SFComponent,
  SFNumberWidgetSchema,
  SFSchema,
  SFSelectWidgetSchema,
  SFTextareaWidgetSchema,
  SFUISchema
} from '@delon/form';
import { _HttpClient } from '@delon/theme';
import { AmapPoiPickerComponent } from '@shared';
import { NzModalService } from 'ng-zorro-antd/modal';
import { PublishGoodsChooseFamifiarComponent } from '../choose-famifiar/choose-famifiar.component';
import { SupplyManagementService } from '../../services/supply-management.service';
@Component({
  selector: 'app-publish-goods-onecar-publish',
  templateUrl: './onecar-publish.component.html',
  styleUrls: ['./onecar-publish.component.less']
})
export class  SupplyManagementOnecarPublishComponent implements OnInit {
  validateForm1: FormGroup;
  newTempchecked = false; //是否存入新模板
  sf1data: any; // 货源单设置回显
  sf3data: any; // 货源单设置回显
  sf4data: any; // 货源单设置回显
  sf5data: any; // 货源单设置回显
  sf6data: any; // 货源单设置回显
  sf7data: any; // 货源单设置回显
  creatTime: any; // 货源单设置回显
  modifyTime: any; // 货源单设置回显
  totalFees: any; // 总数信息
  id = this.route.snapshot.params.id;
  // // 单位
  unit1 = '吨';
  unit2 = '方';
  unit3 = '保价费金额';
  startInfo: any = [];
  endInfo: any = [];
  dataList: any;
  constructor(private http: _HttpClient, fb: FormBuilder, private router: Router, private route: ActivatedRoute, private modalService: NzModalService, public service: SupplyManagementService) {
    this.validateForm1 = fb.group({
      createTime: [null, []],
      modifyTime: [null, []],
    });
  }
  @ViewChild('sf1', { static: false }) sf1!: SFComponent;
  schema1: SFSchema = {};
  ui1!: SFUISchema;

  @ViewChild('sf2', { static: false }) sf2!: SFComponent;
  schema2: SFSchema = {};
  ui2!: SFUISchema;

  @ViewChild('sf3', { static: false }) sf3!: SFComponent;
  schema3: SFSchema = {};
  ui3!: SFUISchema;

  @ViewChild('sf4', { static: false }) sf4!: SFComponent;
  schema4: SFSchema = {};
  ui4!: SFUISchema;

  @ViewChild('sf5', { static: false }) sf5!: SFComponent;
  schema5: SFSchema = {};
  ui5!: SFUISchema;

  @ViewChild('sf6', { static: false }) sf6!: SFComponent;
  schema6: SFSchema = {};
  ui6!: SFUISchema;

  @ViewChild('sf7', { static: false }) sf7!: SFComponent;
  schema7: SFSchema = {};
  ui7!: SFUISchema;
  ngOnInit(): void {
    this.initSF1();
    // this.initSF2();
    this.initSF3();
    this.initSF4();
    this.initSF5();
    this.initSF6();
    this.initSF7();
    this.initdata();
    console.log( this.route.snapshot?.queryParams)
  }

  initSF1() {
    this.schema1 = {
      properties: {
        // shipperAppUserName: {
        //   type: 'string',
        //   title: '货主',
        //   maxLength: 30,
        //   ui: {
        //     placeholder: '请输入'
        //   }
        // },
        enterpriseProjectName: {
          type: 'string',
          title: '项目',
          enum: [
            { label: '项目1', value: '1' },
            { label: '项目2', value: '2' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择',
            allowClear: true
            // asyncData: () =>
            //   this.service.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        },
        enterpriseInfoName: {
          type: 'string',
          title: '网络货运人',
          ui: {
            widget: 'text'
          },
        },
        externalResourceCode: {
          type: 'string',
          title: '外部货源号',
          maxLength: 30,
          ui: {
            placeholder: '请输入'
          }
        },
        dispatchId: {
          type: 'string',
          title: '调度员',
          enum: [
            { label: '调度员1', value: '1' },
            { label: '调度员2', value: '2' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择',
            allowClear: true
            // asyncData: () =>
            //   this.service.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        }
      }
    };
    this.ui1 = {
      '*': {
        spanLabelFixed: 120,
        grid: { span: 8 }
      }
    };
  }

  // initSF2() {
  //   this.schema2 = {
  //     properties: {
  //       name1: {
  //         type: 'string',
  //         title: '发货模板',
  //         ui: {
  //           widget: 'custom',
  //           placeholder: '请输入'
  //         }
  //       }
  //     }
  //   };
  //   this.ui2 = {
  //     '*': {
  //       spanLabelFixed: 90,
  //       grid: { span: 12 }
  //     }
  //   };
  // }
  initSF3() {
    this.schema3 = {
      properties: {
        goodsNameId: {
          type: 'string',
          title: '货物名称',
          enum: [
            { label: '真实货物', value: '1' },
            { label: '远程货物', value: '2' },
            { label: '其他', value: '3' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择'
            // asyncData: () =>
            //   this.categoryService.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        },
        qita: {
          type: 'string',
          title: '',
          ui: {
            visibleIf: {
              goodsNameId: value => value === '3'
            }
          }
        }
      }
    };
    this.ui3 = {
      '*': {
        spanLabelFixed: 90,
        grid: { span: 12 }
      },
      $goodsNameId: {
        grid: { span: 12 }
      },
      $qita: {
        grid: { span: 12 }
      }
    };
  }
  initSF4() {
    this.schema4 = {
      properties: {
        weight: {
          type: 'string',
          title: '重量/体积',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        },
        volume: {
          type: 'string',
          title: '',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        },
        vehicleDemand: {
          type: 'string',
          title: '用车需求',
          enum: [
            { label: '1', value: '1' },
            { label: '2', value: '2' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择车型'
            // asyncData: () =>
            //   this.categoryService.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        },
        name6: {
          type: 'string',
          title: '',
          enum: [
            { label: '1', value: '1' },
            { label: '2', value: '2' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择车长'
            // asyncData: () =>
            //   this.categoryService.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        }
      }
    };
    this.ui4 = {
      '*': {
        spanLabelFixed: 90,
        grid: { span: 24 }
      },
      $weight: {
        grid: { span: 12 }
      },
      $volume: {
        grid: { span: 12 }
      },
      $vehicleDemand: {
        grid: { span: 12 }
      },
      $name6: {
        grid: { span: 12 }
      }
    };
  }

  initSF5() {
    this.schema5 = {
      properties: {
        goodsValue: {
          type: 'string',
          title: '货物价值',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        }
      }
    };
    this.ui5 = {
      '*': {
        spanLabelFixed: 90,
        grid: { span: 24 }
      }
    };
  }

  initSF6() {
    this.schema6 = {
      properties: {
        stateReceipt: {
          type: 'string',
          title: '是否回单',
          enum: [
            { label: '是', value: '1' },
            { label: '否', value: '2' }
          ],
          ui: {
            widget: 'select',
            placeholder: '请选择'
            // asyncData: () =>
            //   this.categoryService.loadChildData2('0', '2').pipe(
            //     map((data: any) => {
            //       return data.map((m: any) => {
            //         return { label: m.name, value: m.id };
            //       });
            //     }),
            //   ),
            // change: (i) => this.updateCategory(i, '/categoryId2'),
          } as SFSelectWidgetSchema
        },
        remarks: {
          type: 'string',
          title: '备注',
          ui: {
            widget: 'textarea',
            placeholder: '请输入',
            autosize: { minRows: 3, maxRows: 3 }
          } as SFTextareaWidgetSchema
        }
      }
    };
    this.ui6 = {
      '*': {
        spanLabelFixed: 90,
        grid: { span: 24 }
      }
    };
  }
  changeValue() {
    this.totalFees = this.sf7?.value?.appendFee + this.sf7?.value?.oilCardPay + this.sf7?.value?.prePay +this.sf7?.value?.receiptPay + this.sf7?.value?.toPay
  }
  initSF7() {
    this.schema7 = {
      properties: {
        prePay: { type: 'number', title: '预付', default: 0, ui: { prefix: '￥', change: ()=> {
          this.changeValue();
        } } as SFNumberWidgetSchema },
        toPay: { type: 'number', title: '到付', default: 0, ui: { prefix: '￥',change: ()=> {
          this.changeValue();
        } } as SFNumberWidgetSchema },
        oilCardPay: { type: 'number', title: '油卡', default: 0, ui: { prefix: '￥',change: ()=> {
          this.changeValue();
        } } as SFNumberWidgetSchema },
        receiptPay: { type: 'number', title: '回单付', default: 0, ui: { prefix: '￥',change: ()=> {
          this.changeValue();
        } } as SFNumberWidgetSchema },
        oilCardPay2: {
          type: 'string',
          title: '小计',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        },
        appendFee: {
          type: 'string',
          title: '附加费',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        },
        totalFee: {
          type: 'string',
          title: '总费用',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        },
        name8: {
          type: 'string',
          title: '到货后',
          ui: {
            widget: 'custom',
            placeholder: '请输入'
          }
        }
      }
    };
    this.ui7 = {
      '*': {
        spanLabelFixed: 90,
        grid: { span: 24 }
      }
    };
  }

  addStartInfo(event: any) {
    this.startInfo.push({
      detailedAddress: '',
      appUserName: '',
      contractTelephone: '',
      type: 1
    });
  }
  subStartInfo(event: any, index: number) {
    this.startInfo.splice(index, 1);
  }

  addEndInfo(event: any) {
    this.endInfo.push({
      detailedAddress: '',
      appUserName: '',
      contractTelephone: '',
      type: 2
    });
  }
  subEndInfo(event: any, index: number) {
    this.endInfo.splice(index, 1);
  }

  //指派熟车
  chooseFamifiar() {
    this.modalService.create({
      nzTitle: '指派熟车',
      nzContent: PublishGoodsChooseFamifiarComponent,
      nzWidth: 1300
    });
  }
  submit(): void {
    Object.keys(this.validateForm1.controls).forEach(key => {
      this.validateForm1.controls[key].markAsDirty();
      this.validateForm1.controls[key].updateValueAndValidity();
    });
    console.log(this.validateForm1);

    if(typeof(this.validateForm1.value.modifyTime) !== 'string' ) {
      var c = new Date(this.validateForm1.value.modifyTime);  
      this.validateForm1.value.modifyTime = c.getFullYear() + '-' + (c.getMonth() + 1) + '-' + c.getDate() + ' ' + c.getHours() + ':' + c.getMinutes() + ':' + c.getSeconds()
    }
    if(typeof(this.validateForm1.value.createTime) !== 'string' ) {
      var c = new Date(this.validateForm1.value.createTime);  
      this.validateForm1.value.createTime = c.getFullYear() + '-' + (c.getMonth() + 1) + '-' + c.getDate() + ' ' + c.getHours() + ':' + c.getMinutes() + ':' + c.getSeconds()
    }
    console.log(typeof(this.validateForm1.value.createTime) === 'string')
    if (this.validateForm1.invalid) {
      return;
    }
    console.log({...this.sf4.value, ...this.sf3.value})
    this.startInfo.createTime = this.validateForm1.value.createTime
    this.startInfo.modifyTime = this.validateForm1.value.modifyTime
    const params = {
      ...this.sf1.value,
      ...this.sf5.value,
      shippingInformationDTO: {
        ...this.sf7.value
      },
      unLoadingPlaceList: [...this.startInfo, ...this.endInfo,], 
      goodsInfoList: [
        {...this.sf4.value, ...this.sf3.value}
      ]
    }
    console.log(params)
    console.log(this.startInfo)
    console.log(this.endInfo)
    console.log(this.validateForm1.value)
    console.log(this.sf3.value)
    console.log(this.sf4.value)
    console.log(this.sf5.value)
    console.log(this.sf6.value)
    console.log(this.sf7.value)
   this.service.request(this.service.$api_set_saveAnotherWholeOrder, params).subscribe((res: any) => {
     console.log(res)
   })
  }

  openMap(type: string, index: number) {
    const modalRef = this.modalService.create({
      nzTitle: '',
      nzContent: AmapPoiPickerComponent,
      nzWidth: 900,
      nzOnOk: item => {
        const poi = item.poi;
        console.log(item)
        const locList = poi.location.toString().split(',');
        switch (type) {
          case 'start':
            this.startInfo[index].detailedAddress = poi.district + poi.name;
            this.startInfo[index].longitude = locList[0];
            this.startInfo[index].latitude = locList[1];
            break;
          case 'end':
            this.endInfo[index].detailedAddress = poi.district + poi.name;
            this.endInfo[index].longitude = locList[0];
            this.endInfo[index].latitude = locList[1];
            break;
          default:
            break;
        }
      }
    });
  }
  goBack() {
    window.history.go(-1);
  }
  // 初始化信息
  initdata() {
    console.log(this.id)
    this.service.request(`${this.service.$api_get_getCompleteVehicleDetail}`, {id:this.id}).subscribe((res) => {
      console.log(res)
      // this.dataList = res;
      this.sf1data = {
        // shipperAppUserName: res?.shipperAppUserName || '',
        enterpriseProjectName: res?.enterpriseProjectName  || '',
        enterpriseInfoName: res?.enterpriseInfoName  || '',
        externalResourceCode: res?.externalResourceCode  || '',
        dispatchId: res?.dispatchId  || '',
      }
      res.unLoadingPlaceList.forEach((element: any) => {
        if(element.type === 1) {
          if(this.id) {
            this.startInfo.push({
              detailedAddress: element.detailedAddress,
              appUserName: element.appUserName,
              contractTelephone: element.contractTelephone,
              type: element.type
            })
          } else {
            this.startInfo.push({
              detailedAddress: element.detailedAddress,
              appUserName: element.appUserName,
              contractTelephone: element.contractTelephone,
              type: element.type,
              id: element.id
            })
          }
          if(element.createTime) {
            this.creatTime = element?.createTime
            this.modifyTime = element?.modifyTime
          }
        } else if(element.type === 2) {
          this.endInfo.push({
            detailedAddress: element?.detailedAddress,
            appUserName: element?.appUserName,
            contractTelephone: element?.contractTelephone,
            type: element.type
          })
        }
      });
      this.sf3data = {
        goodsNameId: res?.goodsInfoList[0]?.goodsNameId || '',
      }
      this.sf4data = {
        weight:  res?.goodsInfoList[0]?.weight   || '',
        volume:  res?.goodsInfoList[0]?.volume   || '',
        vehicleDemand:  res?.goodsInfoList[0]?.vehicleDemand   || '',
      }
      this.sf5data = {
        goodsValue: res?.goodsValue || '',
      }
      this.sf6data = {
        stateReceipt: res?.supplementaryInformationVO?.stateReceipt || '',
        remarks: res?.supplementaryInformationVO?.remarks || '',
      }
      console.log('99999')
      console.log(res?.shippingInformationVO)
      this.sf7data = {
        prePay: res?.shippingInformationVO?.prePay || '',
        toPay: res?.shippingInformationVO?.toPay || '',
        oilCardPay: res?.shippingInformationVO?.oilCardPay || '',
        receiptPay: res?.shippingInformationVO?.receiptPay || '',
        oilCardPay2: res?.shippingInformationVO?.oilCardPay || '',
        appendFee: res?.shippingInformationVO?.appendFee || '',
        name8: res?.shippingInformationVO?.appendFee || '',
      }
      this.totalFees = res?.shippingInformationVO?.totalFee || '0';
      // <p>预付：{{dataList?.shippingInformationVO?.prePay | currency: '￥' }}</p>
      // <p>油卡：{{dataList?.shippingInformationVO?.oilCardPay | currency: '￥'}}</p>
      // <p>到付：{{dataList?.shippingInformationVO?.toPay | currency: '￥'}}</p>
      // <p>回单付：{{dataList?.shippingInformationVO?.receiptPay | currency: '￥'}}</p>
      // <p>保险费：{{dataList?.shippingInformationVO?.insuranceFee | currency: '￥'}}</p>
      // <p>附加费保险费：{{dataList?.shippingInformationVO?.appendFee | currency: '￥'}}</p> totalFee
      console.log(this.sf1.value)
      console.log(this.startInfo)
      console.log(this.endInfo)
      console.log(this.validateForm1.value)
      console.log(this.sf3.value)
      console.log(this.sf4.value)
      console.log(this.sf5.value)
      console.log(this.sf6.value)
 
    })
  }
  asds(i: any) {
    console.log(i)
  }
  // const data = 
}