|
|
@@ -2,93 +2,89 @@
|
|
|
* @Author : yuanrunwei
|
|
|
* @Date : 2021-11-01 18:03:02
|
|
|
* @LastEditors: Please set LastEditors
|
|
|
- * @LastEditTime: 2022-01-07 19:16:35
|
|
|
+ * @LastEditTime: 2022-01-10 19:27:43
|
|
|
* @FilePath : \spfm-market-front\src\pages\main\performance\components\form.vue
|
|
|
-->
|
|
|
<template>
|
|
|
- <el-form :inline="true" :model="object">
|
|
|
- <el-row :gutter="24">
|
|
|
- <el-col
|
|
|
- v-for="({ props, label, type, dictionary }, index) in form"
|
|
|
+ <el-form :inline="true" :model="object">
|
|
|
+ <el-row :gutter="24">
|
|
|
+ <el-col
|
|
|
+ v-for="({ props, label, type, dictionary }, index) in form"
|
|
|
+ :key="index"
|
|
|
+ :span="6"
|
|
|
+ >
|
|
|
+ <el-form-item :label="label">
|
|
|
+ <template v-if="type === 'select'">
|
|
|
+ <el-select
|
|
|
+ v-model="object[props]"
|
|
|
+ :placeholder="label"
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ :label="label"
|
|
|
+ :value="value"
|
|
|
+ v-for="({ label, value }, index) in dictionary"
|
|
|
:key="index"
|
|
|
- :span="6"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="['datetime', 'date', 'month'].includes(type)">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="object[props]"
|
|
|
+ :type="type"
|
|
|
+ :placeholder="label"
|
|
|
>
|
|
|
- <el-form-item :label="label">
|
|
|
- <template v-if="type === 'select'">
|
|
|
- <el-select
|
|
|
- v-model="object[props]"
|
|
|
- :placeholder="label"
|
|
|
- filterable
|
|
|
- clearable
|
|
|
- >
|
|
|
- <el-option
|
|
|
- :label="label"
|
|
|
- :value="value"
|
|
|
- v-for="({ label, value }, index) in dictionary"
|
|
|
- :key="index"
|
|
|
- ></el-option>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <template v-else-if="['datetime','date', 'month'].includes(type)">
|
|
|
- <el-date-picker
|
|
|
- v-model="object[props]"
|
|
|
- :type="type"
|
|
|
- :placeholder="label"
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <el-input
|
|
|
- v-model="object[props]"
|
|
|
- :placeholder="label"
|
|
|
- clearable
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="6">
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="handleSearch"
|
|
|
- >搜索</el-button
|
|
|
- >
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col class="flex-justify-align-end" :span="24">
|
|
|
- <el-button
|
|
|
- v-for="({ label, props }, index) in handle"
|
|
|
- :key="index"
|
|
|
- @click="handleSubmit(props)"
|
|
|
- >
|
|
|
- <i class="el-icon-document-add font-weight-bold" />{{
|
|
|
- label
|
|
|
- }}
|
|
|
- </el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
+ </el-date-picker>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-input
|
|
|
+ v-model="object[props]"
|
|
|
+ :placeholder="label"
|
|
|
+ clearable
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="handleSearch">搜索</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col class="flex-justify-align-end" :span="24">
|
|
|
+ <el-button
|
|
|
+ v-for="({ label, props, unlogo }, index) in handle"
|
|
|
+ :key="index"
|
|
|
+ @click="handleSubmit(props)"
|
|
|
+ >
|
|
|
+ <i v-if="!unlogo" class="el-icon-document-add font-weight-bold" />{{ label }}
|
|
|
+ </el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
</template>
|
|
|
<script>
|
|
|
export default {
|
|
|
- props: {
|
|
|
- form: {
|
|
|
- type: Array,
|
|
|
- default: () => [],
|
|
|
- },
|
|
|
- handle: {
|
|
|
- type: Array,
|
|
|
- default: () => [],
|
|
|
- },
|
|
|
+ props: {
|
|
|
+ form: {
|
|
|
+ type: Array,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ handle: {
|
|
|
+ type: Array,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data: () => ({
|
|
|
+ object: {},
|
|
|
+ }),
|
|
|
+ methods: {
|
|
|
+ handleSearch() {
|
|
|
+ this.$emit("search", this.object);
|
|
|
},
|
|
|
- data: () => ({
|
|
|
- object: {},
|
|
|
- }),
|
|
|
- methods: {
|
|
|
- handleSearch() {
|
|
|
- this.$emit("search", this.object);
|
|
|
- },
|
|
|
- handleSubmit(params) {
|
|
|
- this.$emit(params, this.object);
|
|
|
- },
|
|
|
+ handleSubmit(params) {
|
|
|
+ this.$emit(params, this.object);
|
|
|
},
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
