对于语言方面组件是默认使用 英语 因为 element-plus 默认是使用英语，不引用中文包的主要原因是避免增大体积。 组件内部语言跟随 element-plus。 部分 提示文字 语言，组件内部也支持 中、英 文，如果你需要支持更多语言或者更改组件内部 的语言，可以在 use(PowerfulTable, { local: 您的语言变量 }) 替换。也可以参考我们提供的 demo 实现。

此插件已 el-plus-powerful-table 作为基础，进行重构。部分功能将领先 el-plus-powerful-table 基础版本。 el-plus-powerful-table 的 ts 版本

vue3.0 的 element-plus 二次开发表格组件

• 以下【内部组件】为该文件夹中 packages/components/src 下的组件

• 3.0.0 版本
• • 删除 component-event 事件
• • _TYPE 类型的 key 改为枚举

• 修复部分已知bug
• 升级 element-plus 依赖

• 调整 data 支持 function 类型为 ({row: Row, index: number, props: [当前data的父级配置项]}) => _TYPE[type]。正常使用 type = 'href' 时 data 自主推断不受影响，type 为函数时参照下面示例

{
  prop: 'price',
  type: (row: Lists) => (row.brand == 'Audi' ? 'input' : 'text'),
  data: setData<'input', Lists>(({ row }) => {
    return {
      slot: 'append',
      symbol: (row.price as number) > 150 ? '万' : '萬',
      style: { width: '100%' },
      property: {
        placeholder: '售价',
      },
    }
  }),
},

• 修复 type = undefined | text 时，仅传递 line 不传递 develop 时 line 失效
• 调整 type 支持 function 类型为 (row: Row, index: number) => keyof _TYPE | undefined。正常使用 type = 'href' 时 data 自主推断不受影响

// 1. 在实际应用中type为函数时无法准确推断data类型，此时可以使用  as unknown as 'href' 推断类型
{
  type: ((row: Lists) =>
    row.brand == 'Audi' ? 'href' : undefined) as unknown as 'href',
  prop: 'href',
  text: '型号：',
  // data 推断除类型为 SetDataType<"href", Lists> | SetDataType<keyof _TYPE<any>, Lists> | undefined
  data: {

  }
}
// 2. 或者使用 setData 函数收窄类型
{
  type: (row: Lists) => (row.brand == 'Audi' ? 'href' : undefined),
  prop: 'href',
  text: '型号：',
  data: setData<'href', Lists>({
    text: (row: any) => row.name,
  }),
}

• 调整即使 scope.row[prop.prop] 没有值时，但是 filters 存在，不进行空渲染

• 修复 tag 类型时，值不为 string | array 时解析出错

• 强制绑定内部自定义的 css
• 修复更新依赖后导致的类型错误

• 需要支持 responseKey 为空的情况
• 取消对 scss 的强制依赖

• 修复 btn-plus 组件中 btn-left 和 btn-right 样式问题

• 修复类型

• 更改类型，在声明 header 时，props 下属性 data 属性在不使用 setData 函数时同样可以获得智能提示。已使用 setData 不受影响

const header = [{
  label: '性别',
  props: {
    type: 'text',
    prop: 'gender',
    data: { // 该类型会被推断为 (SetDataType<"input", Lists> & SetDataType<T, Lists>) | undefined
      develop: true,
      // 输入 l 时会提示 line 属性
    },
  }
}]

• 修复类型错误

• 修复已知 bug
• 修复类型错误
• 捆绑样式，全局引入情况下无需单独引入样式文件

• 修复已知 bug

• 修改暴露的 resetList、getListData 函数支持传递参数
• 修复已知 bug

• 修复 header 配置项中 props 下属性 filters 的情况下，当前的相应的数据存在值的情况则不会被 filters 过滤

const list = [{status: 0},{status: 1}]
const header = [{
  label: '性别',
  props: {
    prop:'status',
    filters: [
      {
        text: '男',
        value: 1
      },
      {
        text: '女',
        value: 0
      }
    ],
  }
}]
// [修复]：第二条数据的 status 将不会进行过滤的情况

• 修复 type = text 时 0 不会显示

• 类型补充提示

• PowerfulTableHeaderProps 下 render 函数类型支持返回 JSX.Element

• "image" | "text" | "switch" | "video" | "input" | "iconfont" | "tag" | "rate" | "textarea" 类型中 data 属性下新增 on 可选属性

• 更改 PowerfulTableExpose 类型为只读
• • PowerfulTableExpose 类型下添加 props、injectProps
• • 修复 PowerfulTableExpose 类型下 headerLists 类型 为 ComputedRef<PowerfulTableHeader<Row>[]> 但是实际类型为 PowerfulTableHeader<Row>[]。更改后类型为 PowerfulTableHeader<Row>[]

• 更改 list-request.responseKey 属性默认值 'data.data.result' 为 'data.result'
• 更改 list-request.listsKey 属性默认值 'lists' 为 'rows'

• BtnList 补充 click 属性
• 组件销毁前清除监听事件

• 新增 type = 'btn' 时，添加 click 属性，需要注意的事，存在 click 属性时将不会触发 beforeClick 属性
• 优化了内部组件 button 文件中的 class 由原来的 class={item.text ? '' : 'no-margin'} 改成空。
• 新增全局组件注入 emptyElement
• 新增全局组件注入 listRequest，以及在 Props 属性上添加。
• 组件添加暴露数据，类型为 PowerfulTableExpose

• 解决切换批量操作点击确定后选择的批量操作类型永远是第一个 bug
• component-event 自定义事件参数返回更改， 由原来的 { componentName: string, eventType: string } 改为 { componentName: string, eventType: string, index: number, prop: PowerfulTableHeaderProps<any>[] | PowerfulTableHeaderProps<any>, row: any }

• 解决没有类型提示 bug

• 取消将 @element-plus/icons 添加到 es 和 lib

• 删除 btnConfig.Config 以及 InjectProps 中 btnSlot 参数
• 修复 btn-left 以及 btn-right 插槽无效 bug

• 修复鼠标悬浮组件没有类型提示 bug

• 修复 treeProps 为 undefined 问题
• 修复类型为 tag 时，数据为 undefined 报错
• type = 'text' data 中的 customFilterFun 属性值更改为 formatting
• PowerfulTableHeaderProps 类型上新增属性 customFilter 自定义过滤

• 修改自定义过滤头部渲染逻辑

• 修复未全局安装 element-plus 时引发组件不能使用 bug
• 删除内部组件 input 的 onClick 事件， 因为和 onFocus 重合
• 删除内部组件 rate 的 onClick 事件，因为 ElRate 上不存在 onClick

• 修复 lib | es 文件夹内 .d.ts 文件中引入的 typings 文件路径找不到

• 更改打包配置

• btn-plus 文件重构（vue 改成 tsx)
• • btnConfig 新增属性 btnRightList 类型为 BtnList[]
• • 类型 BtnList 新增属性 tip beforeClick property

• 删除 btn-plus 组件中 BtnConfig.BtnList 的 type icon showTip tipContent

• 删除 内部组件 data 部分属性（由于提供的属性不完整和 element-plus 存在差异，全部提供则感觉有点冗余，推荐使用 property 属性。内部组件只会保存部分默认值，但是可以通过 property 传参替换）

• • image 删除 lazy zIndex style fit 。保留部分默认值 fit = 'cover'，lazy, preview-teleported = true（el-image 中 lazy preview-teleported 默认 false）
• • input 删除 type placeholder disabled rows。保留部分默认值 rows = 3
• • href 删除 type placeholder rows disabled。 保留部分默认值 type = 'primary'，underline = false
• • rate 删除 max colors iconClass allowHalf showText showScore texts property。 保留部分默认值 disabled = false
• • switch 删除 activeColor inactiveColor inactiveText activeText activeValue inactiveValue disabled isConfirmTip confirmTip beforeFunction 保留部分默认值 inactiveValue = '0'，activeValue = '1'
• • tag 删除 closable type effect hit 保留部分默认值 type = ''
• • video 删除 poster loop 保留部分默认值 controls = true，loop = false
• • button 删除 icon disabled type emit isTooltip isConfirmTip confirmTip 保留部分默认值 type = 'primary'。添加 beforeClick tipProperty 属性

• 内部组件 property 支持函数类型

• componentProps 属性更改为 property

• type 类型为 video 新增 property 扩展属性

• BtnConfig.BtnList 新增 property 扩展属性

• 内部组件新增自定义事件，详情看 type == 'XX'（XX 为某个类型）, 内部组件传递到 powerful-table 组件由 component-event 抛出

• type = 'text' data 中的 customFilterFun 属性值更改

• 修改 组件 InjectProps 类型中 local 的类型。注入的 local 属性现在主要是用于 替换或者扩展组件内部提示文字

• 优化 button 在表格中样式

• 修改 selectable 默认不允许勾选问题

• header 表格头部数据属性中 filters 更改为 defaultFilter. hidden 更改为 defaultShow

• props 单元格数据 filter 更改为 filters

• 删除 组件 props 中的 local

• 使用vite进行构建

• • 构建库模式优化，生成es、cjs两种模式

• element-plus 版本更新到 2.0+

  2.0.7 20220328

• 新增 props property

• • ElTable 属性

• type 为 btn、image、input、rate、switch、tag 的 data 中新增 componentProp 扩展参数

• href 类型更改为 link

• • link 的 data 中新增属性 icon
• • link 的 data 中 text 没有值时将显示 prop 数据在页面上

• input 类型新增 type 同 el-input type

• 修复 rate 类型中 locale 警告

• 优化 link 的 data 中 target 属性类型固定

• 修复 Failed to resolve component: PTBtnPlus 警告

• 新增支持内置组件导出PT开头：例如:PTImage，PTButton
• • 主要用于 powerful-table-draggable 组件的引用
• switch、btn 类型新增属性
• • isConfirmTip 是否开启点击时确认框提示
• • isConfirmTip 确认框提示文字
• 优化 el-pagination small属性随组件或全局 size 属性更改
• 解决鼠标悬浮在组件上没有类型

• 新增表格顶部按钮功能
• • 新增配置项 传送门
• • 新增插槽 btn-left btn-right
• header 新增属性
• • isShowOrFilterColumn 是否开启过滤或者显示隐藏列的开关
• • selectable 行是否可以选中
• prop 新增属性
• • filtersType 过滤类型
• • filterItem 指定过滤项

• 解决数据选中 bug
• 优化部分样式问题
• 优化 props 类型从数组 改为 数组或者对象均可
• 按钮配置优化
• • 可配置二维数组
• • 删除 emit
• • 新增 isTooltip 是否显示提示
• • 新增 params，isMore 属性。params 自定义传入数据，将会在点击按钮时返回。例如：

{
  {
    ;('update')
  }
}

// index.vue
;<powerfulTable v-on:btnClick="handleOperate"></powerfulTable>

// row 当前行数据 params 自定义传入的数据 index 当前行的下标
const handleOperate = ({ row, params, index }) => ({})

{
  ;[
    {
      type: 'btn',
      prop: 'btn',
      data: [
        {
          tip: '编辑',
          type: 'info',
          icon: markRaw(Edit),
          text: '编辑',
          // showBtn: false,
          // isTooltip: true,
          params: {
            emit: 'update',
          },
        },
        [
          {
            tip: '更多',
            isMore: true,
            type: 'success',
            icon: markRaw(Edit),
          },
          {
            tip: '编辑',
            type: 'text',
            icon: markRaw(Edit),
            params: 'update',
          },
          {
            tip: '更多a',
            isMore: true, // 这个将不会被引用到
            type: 'success',
            icon: markRaw(Edit),
          },
          {
            tip: '删除',
            type: 'text',
            icon: markRaw(Delete),
            params: 'remove',
          },
        ],
        {
          tip: '删除',
          type: 'danger',
          icon: markRaw(Delete),
          showBtn: (e: any) => {
            return true
          },
          params: {
            emit: 'remove',
          },
        },
      ],
    },
  ]
}

• 删除 child 字段
• 新增全局组件注入 locale 和 size

• 参考 vue 规范 (Angular)

• feat 添加新功能

• fix 修复问题/BUG

• style 代码风格相关，不影响运行结果

• perf 优化/性能提升

• refactor 重构

• revert 撤消 编辑

• test 测试相关

• docs 文档/注释

• chore 依赖更新/脚手架配置修改等

• workflow 工作流程改进

• ci 持续集成

• types 类型定义文件更改

• wip 开发中