bbq/src/app/shared/components/insurance-table/insurance-table.component.ts

import { debounceTime } from 'rxjs/operators';
import { Subject } from 'rxjs';
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit, ViewChild } from '@angular/core';
import { BaseService } from '@shared';
import { SFComponent, SFSchema, SFUISchema } from '@delon/form';

@Component({
  selector: 'app-insurance-table',
  templateUrl: './insurance-table.component.html',
  styleUrls: ['./insurance-table.component.less']
})
export class InsuranceTableComponent implements OnInit {
  data: any[] = [];
  headers: any[] = [];
  sfdata: any; // 货源单设置回显

  @ViewChild('sf', { static: false }) sf!: SFComponent;
  schema: SFSchema = {};
  ui!: SFUISchema;

  formatterDollar = (value: number): string => `${value}`;
  minInsurancePrice: number = 0;
  changeSub = new Subject<string>();
  constructor(public service: BaseService, private cdr: ChangeDetectorRef) {}

  ngOnInit(): void {
    this.loadData();
    this.initSF()
    this.changeEndKmAction();
    this.minInsurancePrice = 1000
  }

  loadData() {
    this.service.request('/api/mdc/cuc/insuranceConfig/list').subscribe(res => {
      if (res) {
        console.log(res);
        this.data = res;
        this.cdr.detectChanges();
      }
    });
    this.service.request('/api/mdc/pbc/sysConfigItem/findItemValueByItemKeys', [
      "insurance.config.minInsurancePrice"
     ]).subscribe(res => {
      if (res) {
        console.log(res);
        this.minInsurancePrice = Number(res[0].itemValue)
      }
    });
  }
  initSF() {
    this.schema = {
      properties: {
        freightPrice: {
          type: 'string',
          title: '单票投保最低保费',
          ui: {
            widget: 'custom',
            placeholder: '请输入',
            errors: { required: '请填写' }
          }
        },
      },
      required: ['freightPrice']
    };
    this.ui = {
      '*': {
        spanLabelFixed: 160,
        grid: { span: 24 }
      },
      $freightPrice: {
        grid: { span: 8 }
      },
    };
  }
  /**
   * 修改结束车长
   * @param event 车长
   * @param i 下标
   */
  changeEndLength(event: any, i: number) {
    if (event <= this.headers[i].startLength) {
      this.headers[i].endLength = this.headers[i].startLength + 1;
      this.changeNextStartLength(event, i + 1);
      return;
    }
    this.headers[i].endLength = event;
    this.changeNextStartLength(event, i + 1);
  }

  /**
   * 修改结束公里数
   * @param event 车长
   * @param i 下标
   */
  changeEndKm(event: any, i: number) {
    // console.log(this.debounce4(event, i));
    // console.log(this.data[i].startKm);
    // console.log(event);
    // console.log(i);
    if (event) {
      console.log(event);

      this.changeSub.next(`${event},${i}`);
    }
  }
  changeEndKmAction() {
    this.changeSub.pipe(debounceTime(500)).subscribe((res: string) => {
      if (res) {
        const paras = res.split(',');
        const num = Number(paras[0]);
        const i = Number(paras[1]);

        if (num <= this.data[i].startKm) {
          this.data[i].endKm = null;
          setTimeout(() => {
            this.data[i].endKm = this.data[i].startKm + 1 ;
          }, 0);
          this.changeNextStartKm(this.data[i].startKm + 1, i + 1);
          return;
        }
        this.data[i].endKm = num;
        this.changeNextStartKm(num, i + 1);
      }
    });
  }

  add() {
    console.log(this.data);

    const tem = this.data[this.data?.length - 1];
    if (tem && tem.endKm) {
      this.data.push({
        endKm: '',
        startKm: tem.endKm
      });
      this.data = [...this.data];
    } else {
      this.service.msgSrv.warning('请填写完整公里数');
    }
  }

  deleteRow(index: number) {
    console.log(index);
    var newArr = this.data.concat();
    newArr.splice(this.data.length-1,1)
    // this.data = this.data.pop()
    console.log(newArr);
    this.data = [...newArr];
  }

  save() {
    if(!this.minInsurancePrice) {
        this.service.msgSrv.error('必填项为空！')
        return
    }
    let params= {
      minInsurancePrice: this.minInsurancePrice,
      insuranceConfigDTOS: this.data
    }
    console.log(params);
    this.service.request('/api/mdc/cuc/insuranceConfig/saveBatch', params).subscribe(res => {
      if (res) {
        console.log(res);
        this.service.msgSrv.success('修改成功');
        this.loadData();
      }
    });
  }

  /**
   * 遍历同步后置位车长
   * @param event  车长
   * @param i 下标
   */
  private changeNextStartLength(event: number, i: number) {
    if (this.headers[i]) {
      this.headers[i].startLength = event;
      if (this.headers[i].endLength <= event) {
        this.headers[i].endLength = this.headers[i].startLength + 0.5;
        this.changeNextStartLength(event + 0.5, i + 1);
      }
    }
  }

  /**
   * 遍历同步后置位公里数
   * @param event  车长
   * @param i 下标
   */
  private changeNextStartKm(event: number, i: number) {
    if (this.data[i]) {
      this.data[i].startKm = event;
      if (this.data[i].endKm <= event) {
        this.data[i].endKm = this.data[i].startKm + 1;
        this.changeNextStartKm(event + 1, i + 1);
      }
    }
  }
}