import React from "react";
import { Button } from 'antd';
import { useStore } from '@/pages/pms/partPlan/MinRatioPlan';
import _ from 'lodash';

interface Props {
  length: number
}
export default function Index({length}: Props) {
  const { bntLoading, getStep2, current, setCurrent, getSummary, submit, summarySupplier, brandId, parts } = useStore();
  // const flag = _.flattenDeep(summarySupplier.map(it => it.parts || [])).length == parts.length;
  const next = _.throttle(() => {
    if (current == 1) {
      getStep2();
    }
    if (current == 2) {
      getSummary();
    }
  }, 1000);

  const prev = _.throttle(() => {
    setCurrent(current - 1);
  }, 1000);

  const onSubmit = _.throttle(() => {
    submit();
  }, 1000);
  return (
    <div style={{ display: "flex", justifyContent: "center" }}>
      {current > 1 && (
        <Button style={{ margin: "0 8px" }} onClick={prev} loading={bntLoading} disabled={!brandId}>
          上一步
        </Button>
      )}
      {current < length && (
        <Button type="primary" onClick={next} loading={bntLoading} disabled={!brandId}>
          下一步
        </Button>
      )}
      {current == length && (
        <Button
          type="primary"
          disabled={!brandId || summarySupplier.length == 0 }
          loading={bntLoading}
          onClick={onSubmit}
        >
          确认并提交
        </Button>
      )}
    </div>
  );
}