Browse Source

修复w-grid-toolbar的问题

main
likunming 3 weeks ago
parent
commit
56e2497db1
  1. 58
      io.sc.platform.core.frontend/src/platform/components/grid/ts/function/Operator.ts
  2. 3
      io.sc.platform.core.frontend/src/platform/components/panel/WCardPanel.vue
  3. 18
      io.sc.platform.core.frontend/src/platform/components/toolbar/WToolbar.vue

58
io.sc.platform.core.frontend/src/platform/components/grid/ts/function/Operator.ts

@ -325,36 +325,38 @@ export class Operator extends Base {
}
}, time);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableHeadBgColor', this.table?.color.headBgColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--stickyBgColor', this.table?.color.stickyBgColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBorderColor', this.table?.color.borderColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableColumnTitleHeight', (this.tools?.cm.denseHeader.value ? 28 : 48) + 'px');
let headerPadding = '8px';
if (this.tools?.cm.denseHeader) {
headerPadding = '4px';
}
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableHeaderPadding', headerPadding);
let bodyPadding = '8px';
if (this.tools?.cm.denseBody) {
bodyPadding = '4px';
}
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBodyPadding', bodyPadding);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBodyHeight', (this.tools?.cm.denseBody.value ? 24 : 48) + 'px');
nextTick(() => {
if (this.tools?.cm.denseBody.value && !this.props.hideBottom) {
if (tableElement.getElementsByClassName('q-table__bottom').length > 0) {
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 33 + 'px');
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 24 + 'px');
if (tableElement) {
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableHeadBgColor', this.table?.color.headBgColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--stickyBgColor', this.table?.color.stickyBgColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBorderColor', this.table?.color.borderColor);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableColumnTitleHeight', (this.tools?.cm.denseHeader.value ? 28 : 48) + 'px');
let headerPadding = '8px';
if (this.tools?.cm.denseHeader) {
headerPadding = '4px';
}
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableHeaderPadding', headerPadding);
let bodyPadding = '8px';
if (this.tools?.cm.denseBody) {
bodyPadding = '4px';
}
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBodyPadding', bodyPadding);
tableElement.getElementsByTagName('table')[0].style.setProperty('--tableBodyHeight', (this.tools?.cm.denseBody.value ? 24 : 48) + 'px');
nextTick(() => {
if (this.tools?.cm.denseBody.value && !this.props.hideBottom) {
if (tableElement.getElementsByClassName('q-table__bottom').length > 0) {
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 33 + 'px');
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 24 + 'px');
}
} else if (!this.props.hideBottom && tableElement.getElementsByClassName('q-table__bottom').length > 0) {
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 50 + 'px');
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 40 + 'px');
}
} else if (!this.props.hideBottom && tableElement.getElementsByClassName('q-table__bottom').length > 0) {
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 50 + 'px');
tableElement.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 40 + 'px');
});
if (this.props.title || this.props.toolbarActions.length > 0 || this.props.configButton) {
tableElement.getElementsByClassName('q-table__top')[0].style.setProperty('--tableTopPadding', '8px');
} else {
tableElement.getElementsByClassName('q-table__top')[0].style.setProperty('--tableTopPadding', '0px');
}
});
if (this.props.title || this.props.toolbarActions.length > 0 || this.props.configButton) {
tableElement.getElementsByClassName('q-table__top')[0].style.setProperty('--tableTopPadding', '8px');
} else {
tableElement.getElementsByClassName('q-table__top')[0].style.setProperty('--tableTopPadding', '0px');
}
}
}

3
io.sc.platform.core.frontend/src/platform/components/panel/WCardPanel.vue

@ -6,7 +6,8 @@
<q-item-section>
<q-item-label header :style="headerStyleComputed">
<q-icon v-if="props.icon" :name="props.icon" size="sm" v-bind="props.iconAttrs" />
<span style="margin-left: 5px">{{ label }}</span>
<span v-if="label" style="margin-left: 5px">{{ label }}</span>
<div v-else style="margin-left: 5px"><slot name="label"></slot></div>
</q-item-label>
</q-item-section>
</q-item>

18
io.sc.platform.core.frontend/src/platform/components/toolbar/WToolbar.vue

@ -50,13 +50,17 @@ watch(
*/
const calcButtonWidth = () => {
//
hiddenContainerRef.value.style.display = 'block';
nextTick(() => {
toolbar.setButtonWidth(buttonsRef.value.divRef);
//
hiddenContainerRef.value.style.display = 'none';
buildButtons();
});
if (hiddenContainerRef.value) {
hiddenContainerRef.value.style.display = 'block';
nextTick(() => {
if (buttonsRef.value?.divRef) {
toolbar.setButtonWidth(buttonsRef.value.divRef);
//
hiddenContainerRef.value.style.display = 'none';
buildButtons();
}
});
}
};
//

Loading…
Cancel
Save