import template from "./Form.html";
import style from "antd/lib/form/style/index.css";

class Form {
    useModules = ["esNgAntd"];

    template = template;

    props = {
        name: String,
        labelCol: Object,
        wrapperCol: Object,
        onFinish: Function,
        form: Object,
    };

    state = {
        formItems: [],
    };

    constructor() {
        esNgAntd.createStyle("ant-form", style);

        this.form = $scope;

        if (this.props.name) {
            let inputs = $element[0].querySelectorAll("input");
            for (let i = 0; i < inputs.length; i++) {
                const element = inputs[i];
                element.id = this.props.name + "_" + element.id;
            }
        }
    }

    resetFields() {
        this.state.formItems.forEach(function (item) {
            if (typeof item.setValue === "function") {
                item.setValue(item.defaultValue || null);
            } else {
                item.value = null;
            }
        });
    }

    submit() {
        this.handleSubmit();
    }

    handleSubmit() {
        let values = {};
        this.state.formItems.forEach(function (item) {
            let name = item.esFormItem && item.esFormItem.name;
            let value = item.value || item.state.value || null;
            values[name] = value;
        });
        this.props.onFinish({
            values: values,
        });
    }
}