<template>
    <div class="vt-search-form-example">
        <!--查询表单-->
        <VtSearchForm :searchForm="searchForm" ref="spSearchFormRef" />
    </div>
</template>

<script>
	import VtSearchForm from './../../components/vt-search-form/index';

	export default {
		components: {VtSearchForm},
		data () {
			return {
				searchForm: {
					inputList: [
						{
							id: 1,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 2,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 3,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 4,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 5,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 6,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 7,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 99,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 8,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 9,
							prop: 'serviceName',
							type: 'el-input',
							placeholder: '输入数据名称',
							model: null,
							size: 'mini'
						},
						{
							id: 10,
							type: 'el-select',
							prop: 'enableStatus',
							placeholder: '请选择可用状态',
							model: null,
							size: 'mini',
							options: [],
							optionConfig: {
								label: 'value',
								value: 'key'
							}
						}
					],
					btnList: [
						{
							id: 11,
							type: 'el-button',
							laybel: '查询',
							size: 'mini',
							method: (item) => {
                                console.log('item > ', item);
							}
						},
						{
							id: 12,
							type: 'el-button',
							laybel: '重置',
							size: 'mini',
							method: () => {
								this.$refs.spSearchFormRef.reset();
							}
						}
					]
				}
			}
		}
	};
</script>

<style lang="scss" scoped>
</style>
