project-admin/src/pages/dictionary/line/components/Form.jsx

import React from "react";
import { Button, Form, Input, Select } from "antd";
import useBool from "@/utils/hooks/useBool";
import { postTdLine, putTdLine } from "@/service/tdLine";
import { formItemLayout, tailFormItemLayout } from "@/utils/form";

export default (props) => {
  const { row, list, parentId, onChange } = props;

  const [submiting, startSubmit, cancelSubmit] = useBool();
  const [form] = Form.useForm();

  const onFinish = (values) => {
    startSubmit();

    if (row?.lineId) {
      // 修改
      putTdLine(row?.lineId, values)
        .then((res) => {
          cancelSubmit();
          onChange(res);
        })
        .catch(() => {
          cancelSubmit();
        });
    } else {
      // 新增
      postTdLine(values)
        .then((res) => {
          cancelSubmit();
          onChange(res);
        })
        .catch(() => {
          cancelSubmit();
        });
    }
  };

  React.useEffect(() => {
    form.resetFields();
    if (row) {
      form.setFieldsValue(row);
    }
    form.setFieldValue("parentId", parentId);
  }, [row, parentId]);

  return (
    <Form
      form={form}
      {...formItemLayout}
      style={{ maxWidth: "800px" }}
      onFinish={onFinish}
    >
      <Form.Item
        name="lineName"
        label="条线名称"
        rules={[{ required: true, message: "请填写条线名称" }]}
        getValueFromEvent={(e) => e.target.value.replace(/(^\s*)|(\s*$)/g, "")}
      >
        <Input />
      </Form.Item>
      {/* <Form.Item
        name="orgCode"
        label="机构号"
        rules={[{ required: true, message: "请填写机构号" }]}
        getValueFromEvent={(e) => e.target.value.replace(/(^\s*)|(\s*$)/g, "")}
      >
        <Input />
      </Form.Item> */}
      <Form.Item name="parentId" label="上级单位">
        <Select disabled={true}>
          {(list || []).map((x) => (
            <Select.Option key={x.lineId}>{x.lineName}</Select.Option>
          ))}
        </Select>
      </Form.Item>

      <Form.Item name="status" label="状态">
        <Select style={{ width: "100%" }} placeholder="请选择状态">
          <Select.Option value={0}>不正常</Select.Option>
          <Select.Option value={1}>正常</Select.Option>
        </Select>
      </Form.Item>

      {/* <Form.Item name="isSeven" label="7天全班">
        <Select style={{ width: "100%" }} placeholder="请选择">
          <Select.Option value={0}>否</Select.Option>
          <Select.Option value={1}>是</Select.Option>
        </Select>
      </Form.Item> */}

      <Form.Item {...tailFormItemLayout}>
        <Button loading={submiting} type="primary" htmlType="submit">
          保存
        </Button>
      </Form.Item>
    </Form>
  );
};