<script>
export default {
    props: {
        title: String,
        name: String,
        operation: String,
        type: String,
        options: Array
    },
    data () {
        return {
            value: ''
        }
    },
    render () {
        let component = <span>无效的组件</span>
        if (this.type == 'input') {
            component = <el-input vModel={this.value} placeholder={this.title} />
        } else if (this.type == 'date') {
            component = this.operation == 'between' 
                        ? <el-date-picker vModel={this.value} value-format="yyyy-M-d" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
                        : <el-date-picker vModel={this.value} placeholder={this.title} type="date"></el-date-picker>
        } else if (this.type == 'select') {
            const options = this.options instanceof Array ? this.options.map(item => <el-option key={item.value} label={item.label} value={item.value}></el-option>) : []
            console.log(options)
            component = <el-select vModel={this.value} placeholder={this.title}>
                            {options}
                        </el-select>
        }
        return (
            <el-form-item label={this.title}>
                {component}
            </el-form-item>
        )
    },
    methods: {
        reset () {
            this.value = ''
        },
        getData () {
            return {
                name: this.name,
                value: this.value,
                operation: this.operation
            }
        }
    }
}
</script>