el-table，el-form在vue中封装组件化，含操作按钮和插槽

el-table，el-form在vue中封装组件化，含操作按钮和插槽

做管理系统的时候很多页面都是表格和表单的渲染，为此以elementui为工具封装了两个组件以供复用

Search筛选框

<template>
  <div class="search-panel">
    <el-form v-model="searchData" inline>
      <el-form-item v-for="(item,index) in searchList" :key="index" :label="item.label" :prop="item.prop" :label-width="item.labelWidth">
        <el-input v-if="item.type=='input'" v-model="searchData.name" :placeholder="item.placeholder"></el-input>
        <el-date-picker v-if="item.type=='daterange'"
          :style="item.style"
          v-model="searchData.startToEnd"
          type="daterange" 
          range-separator="~" 
          start-placeholder="开始日期" 
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd">
        </el-date-picker>
        <el-date-picker v-if="item.type=='month'"
          @change="item.method"
          v-model="searchData.date"
          type="month"
          placeholder="选择月份"
          value-format="yyyy-MM"
        >
        </el-date-picker>
        <el-button v-if="item.type=='button'" :type="item.buttonType" @click="item.method">{
   {
   item.buttonName}}</el-button>
        <el-select v-if="item.type=='select'" v-model="searchData.status" :placeholder="item.placeholder">
          <el-option
            v-for="val in item.statusOptions"
            :key="val.value"
            :label="val.label"
            :value="val.value">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
   
  name: "Search",
  props: {
   
    searchData: {
   
      type