From 5f12770a730f5397f2223a1a42d66bd558692f66 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com> Date: Sat, 6 Aug 2022 10:07:08 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8(component):=20update?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package/component/package.json | 2 +- .../component/src/component/table/index.vue | 7 +- .../src/document/zh-CN/components/table.md | 78 +++++++++---------- .../src/document/zh-CN/guide/changelog.md | 12 ++- 4 files changed, 57 insertions(+), 42 deletions(-) diff --git a/package/component/package.json b/package/component/package.json index 4b29ad3d..d52d961f 100644 --- a/package/component/package.json +++ b/package/component/package.json @@ -1,6 +1,6 @@ { "name": "@layui/layui-vue", - "version": "1.3.13", + "version": "1.3.14", "author": "就眠儀式", "license": "MIT", "description": "a component library for Vue 3 base on layui-vue", diff --git a/package/component/src/component/table/index.vue b/package/component/src/component/table/index.vue index 7b3c5127..c53ce2cc 100644 --- a/package/component/src/component/table/index.vue +++ b/package/component/src/component/table/index.vue @@ -24,6 +24,7 @@ import LayDropdown from "../dropdown/index.vue"; import LayPage from "../page/index.vue"; import LayEmpty from "../empty/index.vue"; import TableRow from "./TableRow.vue"; +import { nextTick } from 'vue'; export interface LayTableProps { id?: string; @@ -88,6 +89,7 @@ const allChecked = ref(false); const hasChecked = ref(false); const tableDataSource = ref([...props.dataSource]); const tableColumns = ref([...props.columns]); + const tableColumnKeys = ref( props.columns.map((item: any) => { if (item.hide != true) { @@ -128,6 +130,9 @@ watch( () => props.dataSource, () => { tableDataSource.value = [...props.dataSource]; + nextTick(() => { + getScrollWidth(); + }) }, { deep: true } ); @@ -270,8 +275,8 @@ const sortTable = (e: any, key: string, sort: string) => { } }; -let tableHeader = ref(null); let tableBody = ref(null); +let tableHeader = ref(null); let scrollWidthCell = ref(0); const getScrollWidth = () => { diff --git a/package/document-component/src/document/zh-CN/components/table.md b/package/document-component/src/document/zh-CN/components/table.md index 3c49c509..1fc97bc2 100644 --- a/package/document-component/src/document/zh-CN/components/table.md +++ b/package/document-component/src/document/zh-CN/components/table.md @@ -1277,30 +1277,30 @@ export default { ::: table -| 属性 | 描述 | 类型 | 默认值 | 可选值 | -| -------------------- | ----------------------------- | --------- | ------- | -------------- | -| columns | 列配置 - [更多](#tableColumn) | -- | -- | -- | -| dataSource | 数据源 | -- | -- | -- | -| checkbox | 开启复选框 | `boolean` | `false` | `true` `false` | -| id | 主键 | `string` | -- | -- | -| v-model:selectedKeys | 选中项 (多选) | -- | -- | -- | -| v-model:selectedKey | 选中项 (单选) | -- | -- | -- | -| default-toolbar | 工具栏 | `boolean` | `false` | `true` `false` | -| size | 尺寸 | `string` | `md` | `lg` `md` `sm` | -| children-column-name | 树节点字段 | `string` | `children`| -- | -| indent-size | 树表行级缩进 | `number` | `30` | -- | -| height | 表格高度 | `number` | -- | -- | -| maxHeight | 表格最大高度 | `number` | -- | -- | -| even | 斑马条纹 | `boolean` | `false` | `true` `false` | -| cellStyle | 列样式 function(row, column, rowIndex, columnIndex) | `string` `function` | -- | -- | -| rowStyle | 行样式 function(row, rowIndex) | `string` `function` | -- | -- | -| cellClassName | 列类名称 function(row, column, rowIndex, columnIndex) | `string` `function` | -- | -- | -| rowClassName | 行类名称 function(row, rowIndex) | `string` `function` | -- | -- | -| skin | 风格 | `string` | -- | `line` `row` `nob` | -| expand-index | 展开所在列 | `number` | -- | -- | -| default-expand-all | 默认展开所有列 | `boolean` | `false` | `true` `false` | -| expand-keys | 展开的列 | `array` | `[]` | -- | -| span-method | 合并算法 | `function` | -- | -- | +| 属性 | 描述 | 类型 | 默认值 | 可选值 | +| -------------------- | ----------------------------------------------------- | ------------------- | ---------- | ------------------ | +| columns | 列配置 - [更多](#tableColumn) | -- | -- | -- | +| dataSource | 数据源 | -- | -- | -- | +| checkbox | 开启复选框 | `boolean` | `false` | `true` `false` | +| id | 主键 | `string` | -- | -- | +| v-model:selectedKeys | 选中项 (多选) | -- | -- | -- | +| v-model:selectedKey | 选中项 (单选) | -- | -- | -- | +| default-toolbar | 工具栏 | `boolean` | `false` | `true` `false` | +| size | 尺寸 | `string` | `md` | `lg` `md` `sm` | +| children-column-name | 树节点字段 | `string` | `children` | -- | +| indent-size | 树表行级缩进 | `number` | `30` | -- | +| height | 表格高度 | `number` | -- | -- | +| maxHeight | 表格最大高度 | `number` | -- | -- | +| even | 斑马条纹 | `boolean` | `false` | `true` `false` | +| cellStyle | 列样式 function(row, column, rowIndex, columnIndex) | `string` `function` | -- | -- | +| rowStyle | 行样式 function(row, rowIndex) | `string` `function` | -- | -- | +| cellClassName | 列类名称 function(row, column, rowIndex, columnIndex) | `string` `function` | -- | -- | +| rowClassName | 行类名称 function(row, rowIndex) | `string` `function` | -- | -- | +| skin | 风格 | `string` | -- | `line` `row` `nob` | +| expand-index | 展开所在列 | `number` | -- | -- | +| default-expand-all | 默认展开所有列 | `boolean` | `false` | `true` `false` | +| expand-keys | 展开的列 | `array` | `[]` | -- | +| span-method | 合并算法 | `function` | -- | -- | ::: @@ -1322,9 +1322,9 @@ export default { ::: table -| 插槽 | 描述 | 参数 | +| 插槽 | 描述 | 参数 | | ------- | ------------ | ---- | -| toolbar | 自定义工具栏 | -- | +| toolbar | 自定义工具栏 | -- | ::: @@ -1335,19 +1335,19 @@ export default { ::: table -| 插槽 | 描述 | 类型 | 默认值 | 可选值 | -| --------------- | ------------------------------ | --------- | ------- | ---------------------------- | -| title | 列标题 | -- | -- | -- | -| key | 数据字段 | -- | -- | -- | -| customSlot | 自定义插槽 | -- | -- | -- | -| width | 宽度 | -- | -- | -- | -| minWidth | 最小宽度 | -- | `100px` | -- | -| sort | 排序 | -- | -- | -- | -| titleSlot | 标题插槽 | -- | -- | -- | -| align | 对齐方式 | `string` | `left` | `left` `right` `center` | -| ellipsisTooltip | 当内容过长被隐藏时显示 tooltip | `boolean` | `false` | `true` `false` | -| fixed | 列固定 | `string` | -- | `left` `right` | -| type | 列类型 | `string` | -- | `number` `checkbox` `radio` | +| 插槽 | 描述 | 类型 | 默认值 | 可选值 | +| --------------- | ------------------------------ | --------- | ------- | --------------------------- | +| title | 列标题 | -- | -- | -- | +| key | 数据字段 | -- | -- | -- | +| customSlot | 自定义插槽 | -- | -- | -- | +| width | 宽度 | -- | -- | -- | +| minWidth | 最小宽度 | -- | `100px` | -- | +| sort | 排序 | -- | -- | -- | +| titleSlot | 标题插槽 | -- | -- | -- | +| align | 对齐方式 | `string` | `left` | `left` `right` `center` | +| ellipsisTooltip | 当内容过长被隐藏时显示 tooltip | `boolean` | `false` | `true` `false` | +| fixed | 列固定 | `string` | -- | `left` `right` | +| type | 列类型 | `string` | -- | `number` `checkbox` `radio` | ::: diff --git a/package/document-component/src/document/zh-CN/guide/changelog.md b/package/document-component/src/document/zh-CN/guide/changelog.md index 3ed54a4f..f03a089b 100644 --- a/package/document-component/src/document/zh-CN/guide/changelog.md +++ b/package/document-component/src/document/zh-CN/guide/changelog.md @@ -11,7 +11,17 @@