feat: 明细表支持设定列宽,以及单元格事件

This commit is contained in:
gaoyunqi
2024-03-04 18:25:05 +08:00
parent 0d4b4f4d45
commit 09c4b9d0ed

View File

@ -67,7 +67,8 @@
:index="index"
:mainKey="mainKey"
v-bind="getComponentsProps(column.componentProps, column.dataIndex, record, index)"
@change="onFieldChange(record, index)"
@blur="onFieldBlur(column, record, index)"
@change="onFieldChange(column, record, index)"
/>
</template>
</FormItem>
@ -197,10 +198,29 @@
// 注入表单数据
const formModel = inject<any>('formModel', null);
const onFieldChange = (row, rowIndex) => {
console.log('row-->', row, rowIndex);
const onFieldChange = (column, row, rowIndex) => {
const evt = column?.componentProps?.events?.change;
if (evt) {
evt({ column, row, rowIndex, formModel });
}
};
const onFieldBlur = (column, row, rowIndex) => {
const evt = column?.componentProps?.events?.blur;
if (evt) {
evt({ column, row, rowIndex, formModel });
}
};
function setColWidth(columns) {
columns.value.forEach((col: any) => {
// 设置表格的列宽 注意操作这列是没有componentProps
if (col?.componentProps?.colWidth) {
col.width = +col.componentProps.colWidth;
}
});
}
onMounted(() => {
data.value = cloneDeep(props.value);
@ -212,12 +232,7 @@
width: 60
});
}
columns.value.forEach((col: any) => {
// 设置表格的列宽 注意操作这列是没有componentProps
if (col?.componentProps?.colWidth) {
col.width = +col.componentProps.colWidth;
}
});
setColWidth(columns);
columns.value = filterColum(columns.value);
nextTick(() => {
//处理多表头
@ -234,8 +249,8 @@
watch(
() => props.columns,
(val) => {
// console.log('watch props.columns');
columns.value = filterColum(val);
setColWidth(columns);
}
);
@ -524,7 +539,7 @@
}
}
}
console.log('cacheMap', cacheMap);
//console.log('cacheMap', cacheMap);
return col || col?.length ? deepMerge(col, column) : col;
};