🌀(component): 优化 table 子表嵌套
This commit is contained in:
parent
90cdaf037d
commit
43e626cfe6
@ -156,13 +156,13 @@ const renderFixedStyle = (column: any, columnIndex: number) => {
|
||||
return { right: `${right}px` } as StyleValue;
|
||||
}
|
||||
} else {
|
||||
var isLast = true;
|
||||
for (var i = columnIndex + 1; i < props.columns.length; i++) {
|
||||
if (props.columns[i].fixed == undefined) {
|
||||
isLast = false;
|
||||
}
|
||||
var isLast = true;
|
||||
for (var i = columnIndex + 1; i < props.columns.length; i++) {
|
||||
if (props.columns[i].fixed == undefined) {
|
||||
isLast = false;
|
||||
}
|
||||
return isLast ? { "border-right": "none" } as StyleValue : {};
|
||||
}
|
||||
return isLast ? ({ "border-right": "none" } as StyleValue) : {};
|
||||
}
|
||||
return {} as StyleValue;
|
||||
};
|
||||
@ -454,7 +454,9 @@ const renderFixedClassName = (column: any, columnIndex: number) => {
|
||||
</tr>
|
||||
|
||||
<tr class="layui-table-cell-expand" v-if="slot.expand && isExpand">
|
||||
<slot name="expand" :data="data"></slot>
|
||||
<td class="layui-table-cell" :colspan="columns.length">
|
||||
<slot name="expand" :data="data"></slot>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<template v-if="data[childrenColumnName] && isExpand">
|
||||
|
@ -6,7 +6,16 @@ export default {
|
||||
|
||||
<script setup lang="ts">
|
||||
import "./index.less";
|
||||
import { ref, watch, useSlots, withDefaults, onMounted, StyleValue, WritableComputedRef, computed } from "vue";
|
||||
import {
|
||||
ref,
|
||||
watch,
|
||||
useSlots,
|
||||
withDefaults,
|
||||
onMounted,
|
||||
StyleValue,
|
||||
WritableComputedRef,
|
||||
computed,
|
||||
} from "vue";
|
||||
import { v4 as uuidv4 } from "../../utils/guidUtil";
|
||||
import { Recordable } from "../../types";
|
||||
import { LayIcon } from "@layui/icons-vue";
|
||||
@ -322,13 +331,13 @@ const renderFixedStyle = (column: any, columnIndex: number) => {
|
||||
return { right: `${right}px` } as StyleValue;
|
||||
}
|
||||
} else {
|
||||
var isLast = true;
|
||||
for (var i = columnIndex + 1; i < props.columns.length; i++) {
|
||||
if (props.columns[i].fixed == undefined) {
|
||||
isLast = false;
|
||||
}
|
||||
var isLast = true;
|
||||
for (var i = columnIndex + 1; i < props.columns.length; i++) {
|
||||
if (props.columns[i].fixed == undefined) {
|
||||
isLast = false;
|
||||
}
|
||||
return isLast ? { "border-right": "none" } as StyleValue : {};
|
||||
}
|
||||
return isLast ? ({ "border-right": "none" } as StyleValue) : {};
|
||||
}
|
||||
return {} as StyleValue;
|
||||
};
|
||||
@ -458,9 +467,13 @@ const renderTotalRowCell = (column: any) => {
|
||||
:class="[
|
||||
renderFixedClassName(column, columnIndex),
|
||||
column.fixed ? `layui-table-fixed-${column.fixed}` : '',
|
||||
column.type == 'checkbox' ? 'layui-table-cell-checkbox' : '',
|
||||
column.type == 'checkbox'
|
||||
? 'layui-table-cell-checkbox'
|
||||
: '',
|
||||
column.type == 'radio' ? 'layui-table-cell-radio' : '',
|
||||
column.type == 'number' ? 'layui-table-cell-number' : '',
|
||||
column.type == 'number'
|
||||
? 'layui-table-cell-number'
|
||||
: '',
|
||||
]"
|
||||
:style="[
|
||||
{
|
||||
|
@ -13,7 +13,7 @@
|
||||
::: demo 使用 `lay-panel` 标签, 创建面板组件
|
||||
|
||||
<template>
|
||||
<lay-panel><div style="padding: 30px;">面板</div></lay-panel>
|
||||
<lay-panel>面板</lay-panel>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
Loading…
Reference in New Issue
Block a user