app-base-web/src/pages/config/CfgEmail/CfgEmailEdit.js

web development common base package.

import React from 'react';
import { Form, Row, Col, Button, Input, message } from 'antd';
import api from '../../../library/util-axios';

// 配置管理-邮箱服务器配置
const title = "邮箱服务器配置";
const url = "CfgEmail/";
export default class FormEdit extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            ...props.values
        };
        this.formRef = React.createRef();
    }
    onSave = (values) => {
        let me = this;
        values.id = this.state.id;
        api.post(url + "save", values).then(function (rs) {
            if (rs.success) {
                message.info(rs.msg);
                me.props.onSave(values);
            } else { message.error(rs.msg); }
        });
    }
    render() {
        return (
            <Form ref={this.formRef} className="form-edit" layout="vertical" onFinish={this.onSave}>
                <div className="form-title">
                    <i> {title} - {this.state.id ? "编辑" : "录入"}</i>
                    {this.state.id ? <span><Button className="btn-return" onClick={this.props.onEditReturn}><i className="iconfont icon-return"></i>返回</Button></span> : ""}
                </div>
                <div className="form-content" style={{ height: this.props.height }}>
                    <Row>
                        <Col xs={12}>
                            <Form.Item
                                name="name"
                                label="邮箱名称"
                                initialValue={this.state.name}
                            >
                                <Input />
                            </Form.Item>
                        </Col>
                        <Col xs={12}>
                            <Form.Item
                                name="password"
                                label="邮箱密码"
                                initialValue={this.state.password}
                            >
                                <Input />
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row>
                        <Col xs={12}>
                            <Form.Item
                                name="ip"
                                label="邮箱服务器地址"
                                initialValue={this.state.ip}
                            >
                                <Input />
                            </Form.Item>
                        </Col>
                    </Row>
                </div>
                <div className="form-toolbar">
                    <Button className="btn-cancel" onClick={this.props.onCancel}><i className="iconfont icon-cancel"></i>取消</Button>
                    <Button className="btn-submit" htmlType="submit"><i className="iconfont icon-sumit"></i>提交</Button>
                </div>
            </Form>
        );
    }
}