wangshaoping
/
platform
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

1、表格name为空导致死循环。 

2、打包npm后部分dense失效。
3、表格无数据列头宽度有问题。
4、denseBody的checkbox没有任何间距，不好看。
main
likunming 10 months ago
parent
1e580696cb
commit
e5af20e578
2 changed files with 45 additions and 34 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      io.sc.platform.core.frontend/package.json
  2. 55
      io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue

2
io.sc.platform.core.frontend/package.json
View File

@ -1,6 +1,6 @@
{
"name": "platform-core",
"version": "8.1.195",
"version": "8.1.201",
"description": "前端核心包,用于快速构建前端的脚手架",
"//main": "库的主文件",
"main": "dist/platform-core.js",

55
io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue
View File

@ -87,16 +87,15 @@
<q-tr :props="scope">
<q-th
v-if="selectionComputed === 'multiple' && table.checkboxSelection && !props.tree"
:style="props.tree ? '' : 'padding: 0; width: 50px'"
auto-width
:style="props.tree ? '' : 'padding: 0; min-width: 50px;width: 50px;max-width:50px'"
>
<q-checkbox v-model="table.allTicked" flat :dense="denseHeaderComputed" @update:model-value="allTickedUpdateFun"
/></q-th>
<q-th v-else-if="table.checkboxSelection && !props.tree"></q-th>
<q-th v-else-if="table.checkboxSelection && !props.tree" :style="props.tree ? '' : 'padding: 0; min-width: 50px;width: 50px;max-width:50px'"></q-th>
<template v-for="col in scope.cols" :key="col.name">
<q-th
:props="scope"
:style="col.style + (col.name === '_sortNo_' ? 'padding: 0; width: 50px;' : '')"
:style="col.style + (col.name === '_sortNo_' ? 'padding: 0; min-width: 50px;width: 50px;max-width:50px' : '')"
:class="col.classes"
style="font-weight: bold"
:title="col.title"
@ -457,10 +456,14 @@ const columnChildrenHandler = (item: any, gridColumns: any) => {
});
} else {
columnStyle(item);
gridColumns.push({
...{ align: 'left', label: item.name, field: item.name, sortable: true, hidden: false },
const col = {
...{ align: 'left', label: item.name, field: item.name, name: item.name, sortable: true, hidden: false },
...item,
});
};
if (Tools.isEmpty(col.name)) {
col.name = Tools.uuid();
}
gridColumns.push(col);
}
};
const extractTableColumnsProps = () => {
@ -1102,6 +1105,12 @@ let allColumnMap = new Map();
// 将所有列转换到 map 中
const columnToMap = (column: any) => {
if (Tools.isEmpty(column.name)) {
column.name = Tools.uuid();
}
if (Tools.isEmpty(column.label)) {
column.label = column.name;
}
if (column && column.columns && column.columns.length > 0) {
allColumnMap.set(column.name, column);
moreColumnTitleMap.set(column.name, {
@ -1234,10 +1243,10 @@ const handlerMoreRowColumnTitle = () => {
};
const selectionComputed = computed(() => {
if (attrs.selection && attrs.selection === 'multiple') {
return 'multiple';
} else {
if (attrs.selection && attrs.selection === 'single') {
return 'single';
} else {
return 'multiple';
}
});
@ -1860,7 +1869,7 @@ const stickyHeaderColumn = (time = 500) => {
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableHeadBgColor', tableHeadBgColor);
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--stickyBgColor', stickyBgColor);
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableBorderColor', tableBorderColor);
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableColumnTitleHeight', (denseHeaderComputed.value ? 24 : 48) + 'px');
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableColumnTitleHeight', (denseHeaderComputed.value ? 28 : 48) + 'px');
let headerPadding = '8px';
if (denseHeaderComputed.value) {
headerPadding = '4px';
@ -1872,6 +1881,7 @@ const stickyHeaderColumn = (time = 500) => {
}
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableBodyPadding', bodyPadding);
tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableBodyHeight', (denseBodyComputed.value ? 24 : 48) + 'px');
nextTick(() => {
if (denseBottomComputed.value && (!Tools.hasOwnProperty(attrs, 'hide-bottom') || attrs['hide-bottom'] === false)) {
if (tableRef.value.$el.getElementsByClassName('q-table__bottom').length > 0) {
tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 33 + 'px');
@ -1884,6 +1894,7 @@ const stickyHeaderColumn = (time = 500) => {
tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 50 + 'px');
tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 40 + 'px');
}
});
if (props.title || buttons_.value.length > 0 || props.configButton) {
tableRef.value.$el.getElementsByClassName('q-table__top')[0].style.setProperty('--tableTopPadding', '8px');
} else {
@ -1984,18 +1995,18 @@ const moreColumnTitleTableSelectionStyle = computed(() => {
if (props.tree) {
return 'z-index: 3;position: sticky;left: 0px;';
} else {
return 'z-index: 3;position: sticky;left: 0px;padding: 0; width: 50px;';
return 'z-index: 3;position: sticky;left: 0px;padding: 0; width: 50px;min-width:50px;max-width:50px;';
}
}
return '';
return 'padding: 0; width: 50px;min-width:50px;max-width:50px;';
});
const moreColumnTitleTableSortNoStyle = computed(() => {
if (table.checkboxSelection && table.sortNo && table.stickyNum > 0) {
return 'z-index: 3;position: sticky;left: var(--columnWidth-1-1);width: 50px;';
return 'z-index: 3;position: sticky;left: var(--columnWidth-1-1);width: 50px;min-width:50px;max-width:50px;';
} else if (table.sortNo && table.stickyNum > 0) {
return 'z-index: 3;position: sticky;left: 0px;width: 50px;';
return 'z-index: 3;position: sticky;left: 0px;width: 50px;min-width:50px;max-width:50px;';
}
return '';
return 'width: 50px;min-width:50px;max-width:50px;';
});
const thStickyLastNameComputed = computed(() => {
@ -2446,17 +2457,17 @@ VueTools.expose2Instance(instance);
border-bottom-width: 1px;
}
.w-grid .q-table__control .q-field__control {
min-height: var(--tableBottomButtonHeight);
min-height: var(--tableBottomButtonHeight) !important;
}
.w-grid .q-table__control .q-field__control q-field__append {
height: var(--tableBottomButtonHeight);
height: var(--tableBottomButtonHeight) !important;
}
.w-grid .q-table__control .q-field__control-container .q-field__native {
min-height: var(--tableBottomButtonHeight);
padding: 0;
min-height: var(--tableBottomButtonHeight) !important;
padding: 0 !important;
}
.w-grid .q-table__control .q-field__control .q-field__marginal {
height: var(--tableBottomButtonHeight);
height: var(--tableBottomButtonHeight) !important;
}
.w-grid .q-table__card .q-table__middle {
border-color: rgba(0, 0, 0, 0.12);
@ -2467,7 +2478,7 @@ VueTools.expose2Instance(instance);
}
.sticky-header-column-table thead tr {
height: var(--tableColumnTitleHeight);
height: var(--tableColumnTitleHeight) !important;
}
/** 表格所有th固定、设置默认index、背景设置 */

Write Preview
Loading…
Cancel
Save