{"size": 1965, "ext": "js", "max_stars_repo_path": "src/renderer/components/admin/overige/BezorgtijdenForm.js", "max_stars_repo_name": "Chengma999/hisight-desktop", "max_stars_repo_stars_event_min_datetime": "2022-02-13T22:05:51.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-26T13:16:12.000Z", "max_issues_repo_path": "src/renderer/components/admin/overige/BezorgtijdenForm.js", "max_issues_repo_name": "Chengma999/hisight-desktop", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/renderer/components/admin/overige/BezorgtijdenForm.js", "max_forks_repo_name": "Chengma999/hisight-desktop", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 25.5194805195, "max_line_length": 75, "alphanum_fraction": 0.4987277354}
import React from "react";
import { Form, Input, Select, Button } from "antd";
const restaurant_id = localStorage.getItem('restaurant_id');
import moment from "moment";
const { Option } = Select;

const arr = [];
const a = 8;
const n = 23.75;
const index = (n - a) / 0.25;
for (let i = 0; i < index + 1; i++) {
  arr.push(a + i * 0.25);
}

const BezorgtijdenForm = ({ bezorgtijden, updateBezorgtijden }) => {
  const { begin, end } = bezorgtijden;
  const [form] = Form.useForm();
  const onFinish = async (values) => {
    values.restaurant_id = restaurant_id;
    updateBezorgtijden(values);
  };
  const optionsArr = arr.map((time) => {
    const label = moment(
      (Math.floor(time) * 100 + (time - Math.floor(time)) * 60).toString(),
      "hmm"
    ).format("HH:mm");
    return <Option value={time}>{label}</Option>;
  });
  form.setFieldsValue({ begin, end });

  return (
    <div>
      <Form name="basic" form={form} onFinish={onFinish}>
        <Form.Item
          name="begin"
          rules={[
            {
              required: true,
              message: "Vul beginbezorgtijd in!",
            },
          ]}
        >
          <Select>{optionsArr}</Select>
        </Form.Item>
        <Form.Item
          name="end"
          rules={[
            {
              required: true,
              message: "Vul eindbezorgtijd in!",
            },
            ({ getFieldValue }) => ({
              validator(rule, value) {
                if (!value || getFieldValue("begin") < value) {
                  return Promise.resolve();
                }

                return Promise.reject(
                  "Eindtijd moet later zijn dan begintijd!"
                );
              },
            }),
          ]}
        >
          <Select>{optionsArr}</Select>
        </Form.Item>

        <Button type="primary" htmlType="submit">
          Submit
        </Button>
      </Form>
    </div>
  );
};

export default BezorgtijdenForm;
