theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🐛(component): table 边框不对其的问题

Browse Source
This commit is contained in:
就眠儀式 2022-07-11 09:26:44 +08:00
parent dec00677f4
commit 6a7a429c13
2 changed files with 26 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
package/component/src/component/table/TableRow.vue
View File

@ -124,22 +124,22 @@ const renderRowClassName = (data: any, index: number) => {
const childrenIndentSize = props.currentIndentSize + props.indentSize; const childrenIndentSize = props.currentIndentSize + props.indentSize;
const renderFixedStyle = (column: any, columnIndex: number) => { const renderFixedStyle = (column: any, columnIndex: number) => {
if(column.fixed) { if (column.fixed) {
if(column.fixed == 'left') { if (column.fixed == "left") {
var left = 0; var left = 0;
for(var i = 0;i< columnIndex;i ++) { for (var i = 0; i < columnIndex; i++) {
left = left + props.columns[i]?.width.replace("px",""); left = left + props.columns[i]?.width.replace("px", "");
} }
return `left:${left}px`; return `left:${left}px`;
} else { } else {
var right = 0; var right = 0;
for(var i = columnIndex + 1;i< props.columns.length;i ++) { for (var i = columnIndex + 1; i < props.columns.length; i++) {
right = right + props.columns[i]?.width.replace("px",""); right = right + props.columns[i]?.width.replace("px", "");
} }
return `right:${right}px`; return `right:${right}px`;
} }
} }
} };
</script> </script>
<template> <template>
@ -174,7 +174,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => {
textAlign: column.align, textAlign: column.align,
whiteSpace: column.ellipsisTooltip ? 'nowrap' : 'normal', whiteSpace: column.ellipsisTooltip ? 'nowrap' : 'normal',
}, },
renderFixedStyle(column,columnIndex), renderFixedStyle(column, columnIndex),
renderCellStyle(data, column, index, columnIndex), renderCellStyle(data, column, index, columnIndex),
]" ]"
:class="[ :class="[
@ -228,7 +228,7 @@ const renderFixedStyle = (column: any, columnIndex: number) => {
textAlign: column.align, textAlign: column.align,
whiteSpace: column.ellipsisTooltip ? 'nowrap' : 'normal', whiteSpace: column.ellipsisTooltip ? 'nowrap' : 'normal',
}, },
renderFixedStyle(column,columnIndex), renderFixedStyle(column, columnIndex),
renderCellStyle(data, column, index, columnIndex), renderCellStyle(data, column, index, columnIndex),
]" ]"
:class="[ :class="[

28
package/component/src/component/table/index.vue
View File

@ -251,22 +251,22 @@ props.dataSource.map((value: any) => {
}); });
const renderFixedStyle = (column: any, columnIndex: number) => { const renderFixedStyle = (column: any, columnIndex: number) => {
if(column.fixed) { if (column.fixed) {
if(column.fixed == 'left') { if (column.fixed == "left") {
var left = 0; var left = 0;
for(var i = 0;i< columnIndex;i ++) { for (var i = 0; i < columnIndex; i++) {
left = left + props.columns[i]?.width.replace("px",""); left = left + props.columns[i]?.width.replace("px", "");
} }
return `left:${left}px`; return `left:${left}px`;
} else { } else {
var right = 0; var right = 0;
for(var i = columnIndex + 1;i< props.columns.length;i ++) { for (var i = columnIndex + 1; i < props.columns.length; i++) {
right = right + props.columns[i]?.width.replace("px",""); right = right + props.columns[i]?.width.replace("px", "");
} }
return `right:${right}px`; return `right:${right}px`;
} }
} }
} };
</script> </script>
<template> <template>
@ -344,16 +344,22 @@ const renderFixedStyle = (column: any, columnIndex: number) => {
/> />
</div> </div>
</th> </th>
<template v-for="(column, columnIndex) in columns" :key="column"> <template
v-for="(column, columnIndex) in columns"
:key="column"
>
<th <th
v-if="tableColumnKeys.includes(column.key)" v-if="tableColumnKeys.includes(column.key)"
class="layui-table-cell" class="layui-table-cell"
:class="[ :class="[
column.fixed ? `layui-table-fixed-${column.fixed}` : '', column.fixed ? `layui-table-fixed-${column.fixed}` : '',
]" ]"
:style="[{ :style="[
textAlign: column.align, {
},renderFixedStyle(column,columnIndex)]" textAlign: column.align,
},
renderFixedStyle(column, columnIndex),
]"
> >
<span> <span>
<template v-if="column.titleSlot"> <template v-if="column.titleSlot">