add table 行内编辑
This commit is contained in:
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -57,6 +57,8 @@ const props = withDefaults(defineProps<TableRowProps>(), {
|
||||
|
||||
const tableExpandAll = ref(props.defaultExpandAll);
|
||||
|
||||
const editIndex:any = ref({})
|
||||
|
||||
const tableExpandKeys: WritableComputedRef<Recordable[]> = computed({
|
||||
get() {
|
||||
return [...props.expandKeys];
|
||||
@@ -564,6 +566,7 @@ const radioProps = props.getRadioProps(props.data, props.index);
|
||||
renderCellClassName(data, column, index, columnIndex),
|
||||
column.fixed ? `layui-table-fixed-${column.fixed}` : '',
|
||||
]"
|
||||
@click="editIndex[columnIndex] = true"
|
||||
>
|
||||
<div
|
||||
style="display: flex"
|
||||
@@ -603,8 +606,13 @@ const radioProps = props.getRadioProps(props.data, props.index);
|
||||
>
|
||||
{{ data[column.key] }}
|
||||
</lay-tooltip>
|
||||
|
||||
<span v-else> {{ data[column.key] }} </span>
|
||||
<template v-else>
|
||||
<template v-if="column.edit">
|
||||
<span v-if="!editIndex[columnIndex]"> {{ data[column.key] }} </span>
|
||||
<lay-input :autofocus="true" v-model="data[column.key]" v-else @keyup.enter = "editIndex[columnIndex] = false" @blur="editIndex[columnIndex] = false"></lay-input>
|
||||
</template>
|
||||
<span v-else> {{ data[column.key] }} </span>
|
||||
</template>
|
||||
</div>
|
||||
</td>
|
||||
</template>
|
||||
@@ -674,3 +682,10 @@ const radioProps = props.getRadioProps(props.data, props.index);
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.layui-table-cell :deep(.layui-input input){
|
||||
padding-left: 0;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user