import { Col, Form, Input, message, Modal, Row, Select } from 'antd';
import React from 'react';
import { createParameters, editParameters } from '@/services/ParameterConfiguration';

const { TextArea } = Input;

interface userEditPros {
  visible: boolean;
  editCallback: () => void;
  params: any;
}

/**
 * 参数配置编辑页面
 * @param props
 * @constructor
 */
const Edit: React.FC<userEditPros> = (props) => {
  const { params, visible, editCallback } = props;
  const [form] = Form.useForm();

  const onCancel = () => {
    editCallback();
  };

  const onOk = () => {
    form.validateFields().then((values) => {
      if (values) {
        const data = { ...values };
        // 编辑
        if (params) {
          data.record_id = params.record_id;
          editParameters(data)
            .then((res) => {
              if (res.code === 0) {
                message.success('编辑成功');
                editCallback();
              } else {
                message.error(res?.message);
                editCallback();
              }
            })
            .catch((e) => {
              message.error(e?.message);
              editCallback();
            });
        } else {
          // 新增
          createParameters(data)
            .then((res) => {
              if (res.code === 0) {
                message.success('保存成功');
                editCallback();
              } else {
                message.error(res?.message);
                editCallback();
              }
            })
            .catch((e) => {
              message.error(e?.message);
              editCallback();
            });
        }
      }
    });
  };

  const formItemLayout = {
    labelCol: {
      span: 6,
    },
    wrapperCol: {
      span: 16,
    },
  };

  return (
    <Modal
      title={`${params ? '编辑' : '新增'}`}
      open={visible}
      onOk={onOk}
      onCancel={onCancel}
      width={800}
    >
      <Form form={form}>
        <Row>
          <Col span={24}>
            <Form.Item
              {...formItemLayout}
              name="code"
              label="编号"
              rules={[{ required: true, message: '请输入编号' }]}
              initialValue={params?.code}
            >
              <Input placeholder="请输入编号" />
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item
              {...formItemLayout}
              name="name"
              label="名称"
              rules={[{ required: true, message: '请输入名称' }]}
              initialValue={params?.name}
            >
              <Input placeholder="请输入名称" />
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item
              {...formItemLayout}
              name="value"
              label="参数值"
              rules={[{ required: true, message: '请输入参数值' }]}
              initialValue={params?.value}
            >
              <Input placeholder="请输入参数值" />
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item
              {...formItemLayout}
              name="status"
              label="状态"
              rules={[{ required: true, message: '请选择状态' }]}
              initialValue={params?.status}
            >
              <Select placeholder="请选择状态">
                <Select.Option value={1} key={1}>
                  启用
                </Select.Option>
                <Select.Option value={2} key={2}>
                  停用
                </Select.Option>
              </Select>
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item
              {...formItemLayout}
              name="memo"
              label="备注"
              rules={[{ required: false, message: '请输入备注' }]}
              initialValue={params?.memo ? params?.memo : ''}
            >
              <TextArea placeholder="请输入备注" rows={4} />
            </Form.Item>
          </Col>
        </Row>
      </Form>
    </Modal>
  );
};
export default Edit;
