<template>
  <el-form ref="form" :model="model" class="zee-form" v-bind="$attrs">
    <slot v-if="$slots.row" name="row"></slot>
    <el-row v-else v-bind="row">
      <slot></slot>
    </el-row>
  </el-form>
</template>

<script>
export default {
  name: 'Form',
  props: {
    value: Object,
    model: Object,
    row: {
      type: Object,
      default() {
        return {};
      },
    },
    span: [Number, String],
    itemComponent: String,
  },
  provide() {
    return {
      zForm: this,
    };
  },
  methods: {
    validate(callback) {
      return this.$refs.form.validate(callback);
    },
    validateField(props, callback) {
      return this.$refs.form.validateField(props, callback);
    },
    resetFields() {
      this.$refs.form.resetFields();
    },
    clearValidate(props) {
      return this.$refs.form.clearValidate(props);
    },
  },
};
</script>
