<template>
  <div>
    <Form :label-width="80" style="width:100%">
      <FormItem label="表单尺寸">
        <RadioGroup
          v-model="config.size"
          type="button"
          button-style="solid">
          <Radio label="large">大</Radio>
          <Radio label="default">中</Radio>
          <Radio label="small">小</Radio>
        </RadioGroup>
      </FormItem>
      <FormItem label="表单对齐">
        <RadioGroup
          v-model="config.labelPosition"
          type="button"
          button-style="solid">
          <Radio label="left">左对齐</Radio>
          <Radio label="right">右对齐</Radio>
          <Radio label="top">顶部对齐</Radio>
        </RadioGroup>
      </FormItem>
      <FormItem label="添加冒号">
        <i-switch v-model="config.labelColon" />
      </FormItem>
      </FormItem>
      <FormItem label="标签宽度">
        <InputNumber
          style="width:100%"
          :max="160"
          :min="0"
          v-model="config.labelWidth"
          placeholder="请输入标签宽度"></InputNumber>
      </FormItem>
      <FormItem label="栅格间隔">
        <InputNumber
          style="width:100%"
          :max="999999999"
          :min="0"
          v-model="config.gutter"
          controls-outside
          placeholder="请输入标签宽度"></InputNumber>
      </FormItem>
    </Form>
  </div>
</template>
<script>
export default {
  name: 'FormProp',
  props: {
    config: Object,
  },
}
</script>
<style lang="scss" scoped>
.ivu-form-item {
  margin-bottom: 16px;
}
</style>