diff --git a/package/component/package.json b/package/component/package.json index 61f44a18..03c323b7 100644 --- a/package/component/package.json +++ b/package/component/package.json @@ -1,6 +1,6 @@ { "name": "@layui/layui-vue", - "version": "1.4.1", + "version": "1.4.2", "author": "就眠儀式", "license": "MIT", "description": "a component library for Vue 3 base on layui-vue", diff --git a/package/component/src/component/table/TableRow.vue b/package/component/src/component/table/TableRow.vue index eb6f83d4..44849a0e 100644 --- a/package/component/src/component/table/TableRow.vue +++ b/package/component/src/component/table/TableRow.vue @@ -183,7 +183,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => { props.columns[i].fixed == "left" && props.tableColumnKeys.includes(props.columns[i].key) ) { - left = left + props.columns[i]?.width.replace("px", ""); + left = left + props.columns[i]?.width?.replace("px", ""); } } return { left: `${left}px` } as StyleValue; @@ -195,7 +195,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => { props.columns[i].fixed == "right" && props.tableColumnKeys.includes(props.columns[i].key) ) { - right = right + props.columns[i]?.width.replace("px", ""); + right = right + props.columns[i]?.width?.replace("px", ""); } } return { right: `${right}px` } as StyleValue; diff --git a/package/component/src/component/table/index.vue b/package/component/src/component/table/index.vue index 7fba50cb..905d98c3 100644 --- a/package/component/src/component/table/index.vue +++ b/package/component/src/component/table/index.vue @@ -211,6 +211,10 @@ const findFinalNode = (level: number, columns: any[]) => { if (!tableHeadColumns.value[level]) { tableHeadColumns.value[level] = []; } + // 如果列固定,并且 width 不存在, 设置默认值 + if(column.fixed && !column.width) { + column.type ? column.width = "50px" : column.width = "100px"; + } tableHeadColumns.value[level].push(column); findFinalNode(level + 1, column.children); } else { @@ -219,6 +223,10 @@ const findFinalNode = (level: number, columns: any[]) => { if (!tableHeadColumns.value[level]) { tableHeadColumns.value[level] = []; } + // 如果列固定,并且 width 不存在, 设置默认值 + if(column.fixed && !column.width) { + column.type ? column.width = "50px" : column.width = "100px"; + } tableHeadColumns.value[level].push(column); } }); @@ -323,6 +331,7 @@ const rowContextmenu = (data: any, evt: MouseEvent) => { emit("row-contextmenu", data, evt); }; +// 页面打印 const print = () => { let subOutputRankPrint = document.getElementById(tableId) as HTMLElement; let newContent = subOutputRankPrint.innerHTML; @@ -333,9 +342,7 @@ const print = () => { document.body.innerHTML = oldContent; }; -/** - * excel 导出 - */ +// 报表导出 const exportData = () => { var tableStr = ``; for (let tableHeadColumn of tableHeadColumns.value) { @@ -383,11 +390,12 @@ const exportData = () => { return; }; -//输出base64编码 +// BASE64编码 function base64(s: string) { return window.btoa(unescape(encodeURIComponent(s))); } +// 列排序 const sortTable = (e: any, key: string, sort: string) => { let currentSort = e.target.parentNode.getAttribute("lay-sort"); if (sort === "desc") { @@ -524,7 +532,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => { props.columns[i].fixed == "left" && tableColumnKeys.value.includes(props.columns[i].key) ) { - left = left + props.columns[i]?.width.replace("px", ""); + left = left + props.columns[i]?.width?.replace("px", ""); } } return { left: `${left}px` } as StyleValue; @@ -536,7 +544,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => { props.columns[i].fixed == "right" && tableColumnKeys.value.includes(props.columns[i].key) ) { - right = right + props.columns[i]?.width.replace("px", ""); + right = right + props.columns[i]?.width?.replace("px", ""); } } return { right: `${right}px` } as StyleValue; 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 a5717a57..6e0a57e9 100644 --- a/package/document-component/src/document/zh-CN/components/table.md +++ b/package/document-component/src/document/zh-CN/components/table.md @@ -697,7 +697,8 @@ export default { ::: demo 通过 `columns` 配置 `type:'checkbox'` 开启单选列。 @@ -720,14 +721,23 @@ export default { selectedKeys5.value = ["2"] } + const changeDataSource23 = () => { + dataSource23.value = [ + {id:"1",username:"root", password:"root",sex:"男", age:"18", remark: 'layui - vue(谐音:类 UI) '}, + {id:"2",username:"root", password:"root",sex:"男", age:"18", remark: 'layui - vue(谐音:类 UI) '} + ] + } + const columns23 = [ { + fixed: "left", type: "checkbox", }, { title:"账户", width:"200px", - key:"username" + key:"username", + fixed: "left" },{ title:"密码", width: "300px", @@ -747,20 +757,21 @@ export default { } ] - const dataSource23 = [ + const dataSource23 = ref([ {id:"1",username:"root", password:"root",sex:"男", age:"18", remark: 'layui - vue(谐音:类 UI) '}, {id:"2",username:"root", password:"root",sex:"男", age:"18", remark: 'layui - vue(谐音:类 UI) '}, {id:"3",username:"woow", password:"woow",sex:"男", age:"20", remark: 'layui - vue(谐音:类 UI) '}, {id:"4",username:"woow", password:"woow",sex:"男", age:"20", remark: 'layui - vue(谐音:类 UI) '}, {id:"5",username:"woow", password:"woow",sex:"男", age:"20", remark: 'layui - vue(谐音:类 UI) '} - ] + ]) return { columns23, dataSource23, selectedKeys5, changeSelectedKeys, - getCheckboxProps + getCheckboxProps, + changeDataSource23 } } } 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 39cac29d..94e881af 100644 --- a/package/document-component/src/document/zh-CN/guide/changelog.md +++ b/package/document-component/src/document/zh-CN/guide/changelog.md @@ -12,16 +12,19 @@