68 lines
1.9 KiB
Vue
68 lines
1.9 KiB
Vue
<template>
|
|
<a-form layout="inline" :model="form" ref="queryForm">
|
|
<a-row :gutter="48">
|
|
<a-col :md="6" :sm="24" v-for="(item, index) in list" :key="index">
|
|
<a-form-item :label="item.placeholder">
|
|
<!-- input -->
|
|
<a-input v-if="item.type === 'input'" v-model="form[item.key]" :type="item.type || 'text'" :placeholder="item.placeholder || '请输入'"/>
|
|
|
|
<!-- select-common -->
|
|
<a-select v-if="item.type === 'select'" v-model="form[item.key]" placeholder="请选择">
|
|
<a-select-option v-for="(j, k) in item.options" :key="`${index}-${k}`" :value="j.id">{{ j.name }}</a-select-option>
|
|
</a-select>
|
|
|
|
<!-- select-dictionary -->
|
|
<a-select v-if="item.type === 'select-dic'" v-model="form[item.key]" placeholder="请选择">
|
|
<a-select-option v-for="(j, k) in item.options" :key="`${index}-${k}`" :value="j.value">{{ j.name }}</a-select-option>
|
|
</a-select>
|
|
|
|
<!-- date -->
|
|
<a-date-picker
|
|
v-if="item.type === 'date'"
|
|
v-model="form[item.key]"
|
|
style="width: 100%"
|
|
:format="item.format"
|
|
:valueFormat="item.format"
|
|
:placeholder="item.placeholder || '请输入日期'"/>
|
|
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :md="6" :sm="24">
|
|
<a-button type="primary" @click="handleQuery">查询</a-button>
|
|
<a-button @click="resetQuery">重置</a-button>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
form: {
|
|
type: Object,
|
|
required: true,
|
|
default: () => ({})
|
|
},
|
|
list: {
|
|
type: Array,
|
|
required: true,
|
|
default: () => []
|
|
}
|
|
},
|
|
data () {
|
|
return {}
|
|
},
|
|
methods: {
|
|
handleQuery () {
|
|
this.$emit('search')
|
|
},
|
|
resetQuery () {
|
|
this.$emit('reset')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
</style>
|