|
|
@@ -1,48 +1,50 @@
|
|
|
<template>
|
|
|
<div id="data-table">
|
|
|
- <el-row type="flex" justify="end">
|
|
|
- <el-col v-if="isMobile" :span="20">
|
|
|
- <el-form :model="searchInfo" :inline="true" style="padding: 0.9rem 1.875rem" size="mini" v-if="useFilter">
|
|
|
- <el-form-item v-for="(item, index) in filterList" :key="index">
|
|
|
- <template v-if="item.filter === 'select'">
|
|
|
- <el-select
|
|
|
- v-model="searchInfo[item.model]"
|
|
|
- size="mini"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- :placeholder="`请选择${item.label}`"
|
|
|
- @clear="toClear(item.model)"
|
|
|
- @change="data => filterReturn(data, item)"
|
|
|
- >
|
|
|
- <slot name="options" v-bind="{ item }"></slot>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <template v-else-if="item.filter === 'date'">
|
|
|
- <el-date-picker
|
|
|
- v-model="searchInfo[item.model]"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- format="yyyy-MM-dd"
|
|
|
- type="daterange"
|
|
|
- range-separator="-"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- clearable
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <el-input v-model="searchInfo[item.model]" clearable size="mini" :placeholder="`请输入${item.label}`" @clear="toClear(item.model)"></el-input>
|
|
|
- </template>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" size="mini" @click="filterSearch">查询</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4" style="text-align: right; padding: 0.9rem 0">
|
|
|
- <slot name="btn"></slot>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <slot name="filter">
|
|
|
+ <el-row type="flex" justify="end">
|
|
|
+ <el-col v-if="isMobile" :span="20">
|
|
|
+ <el-form :model="searchInfo" :inline="true" style="padding: 0.9rem 1.875rem" size="mini" v-if="useFilter">
|
|
|
+ <el-form-item v-for="(item, index) in filterList" :key="index">
|
|
|
+ <template v-if="item.filter === 'select'">
|
|
|
+ <el-select
|
|
|
+ v-model="searchInfo[item.model]"
|
|
|
+ size="mini"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ :placeholder="`请选择${item.label}`"
|
|
|
+ @clear="toClear(item.model)"
|
|
|
+ @change="data => filterReturn(data, item)"
|
|
|
+ >
|
|
|
+ <slot name="options" v-bind="{ item }"></slot>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="item.filter === 'date'">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="searchInfo[item.model]"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ format="yyyy-MM-dd"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="-"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-input v-model="searchInfo[item.model]" clearable size="mini" :placeholder="`请输入${item.label}`" @clear="toClear(item.model)"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" size="mini" @click="filterSearch">查询</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" style="text-align: right; padding: 0.9rem 0">
|
|
|
+ <slot name="btn"></slot>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </slot>
|
|
|
|
|
|
<el-table
|
|
|
ref="table"
|
