vue-element3-search-table/src/views/other/option.js

```bash npm i vue-element3-search-table@latest --save ```

const proxyPrefix = process.env.NODE_ENV === 'development' ? 'api' : ''
export default {
  option: {
    request: {
      url: proxyPrefix + '/health/user/getUserList',
      method: 'get', // 非必填
      paramMap: { // 非必填
        index: 'pageIndex',
        size: 'pageSize'
      },
      paramInit: {}, // 初始值
      page: {
        index: 0, // 选填，若后端index是0开始的得调整
        size: 10 // 非必填
      },
      resultMap: { // 非必填
        total: 'total',
        data: 'pageData'
      }
    },
    formItemSize: '', // medium/mini/small, 默认medium
    labelWidth: 90,
    submitBtn: true, // 搜索按钮，默认true，非必填
    submitText: '查询', // 搜索按钮的文字，默认查询，非必填
    clearBtn: true, // 重置按钮，默认true
    clearSize: 'small', // medium/mini/small, 默认medium
    clearText: '重置', // 重置按钮的文字，默认重置，非必填
    tabs: // 顶部选项卡
      {
        label: '审核状态',
        prop: 'authorityStatus',
        dicUrl: proxyPrefix + '/health/admin/user/getAuthorityCount', // 非必填项
        list: [
          {
            label: '待审核',
            value: 2,
            number: 2 // 显示数量
          },
          {
            label: '已通过',
            value: 1,
            number: '{{pass}}' // 可通过调接口映射
          },
          {
            label: '未通过',
            value: 3
          }
        ]
      },
    buttons: { // 搜索顶部按钮
      placement: 'top',
      isSink: true, // 是否下沉
      size: 'small',
      list: [
        {
          label: '导出',
          value: 'click',
          type: 'primary',
          style: 'plain',
          icon: 'el-icon-delete',
          callback: function () {
            console.log(this)
          }
        },
        {
          label: '编辑',
          value: 'click',
          type: 'success',
          style: 'round',
          icon: 'el-icon-edit',
          callback: function () {
            console.log(this)
          }
        },
        {
          label: '检测',
          value: '',
          type: 'info',
          style: 'plain',
          icon: 'el-icon-check'
        },
        {
          label: '收藏',
          value: '',
          type: 'warning',
          style: 'circle',
          icon: 'el-icon-star-off'
        },
        {
          label: '删除',
          value: '',
          type: 'danger',
          style: 'plain',
          icon: 'el-icon-delete'
        }
      ]
    },
    columns: [
      {
        prop: 'createTime',
        label: '注册日期',
        canSearch: true
      },
      {
        prop: 'id',
        label: '用户id',
        canSearch: true
      },
      {
        prop: 'name',
        label: '昵称',
        canSearch: true
      },
      {
        prop: 'telephone',
        label: '手机号',
        canSearch: true
      },
      {
        prop: 'operation',
        label: '操作',
        width: 80,
        slot: true,
        slotType: 'operation',
        slotArray: [
          {
            label: '方法一',
            value: 'handle'// 监听on-operation方法
          },
          {
            label: '方法二',
            value: 'handle2',
            filter: ({ status }) => { // 显示条件
              return status === 1
            },
            callback: function (callback, row) {
              console.log('这里注意不要使用箭头函数', this)
            }
          }
        ]
      }
    ]
  }
}