Browse Source

修复部分问题

main
likunming 3 months ago
parent
commit
b3c168fbb0
  1. 71
      io.sc.platform.core.frontend/src/platform/components/grid/Td.vue
  2. 10
      io.sc.platform.core.frontend/src/platform/components/grid/Tr.vue
  3. 4
      io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue
  4. 3
      io.sc.platform.core.frontend/src/platform/components/grid/css/grid.css
  5. 3
      io.sc.platform.core.frontend/src/platform/components/grid/ts/GridTools.ts
  6. 6
      io.sc.platform.core.frontend/src/platform/components/grid/ts/constant/src/FieldNames.ts
  7. 11
      io.sc.platform.core.frontend/src/platform/components/grid/ts/event/EventManager.ts
  8. 17
      io.sc.platform.core.frontend/src/platform/components/grid/ts/event/src/UpdateTickeds.ts
  9. 13
      io.sc.platform.core.frontend/src/platform/components/grid/ts/function/Operator.ts
  10. 17
      io.sc.platform.core.frontend/src/platform/components/grid/ts/function/RowData.ts
  11. 4
      io.sc.platform.core.frontend/src/platform/components/grid/ts/types/PropsType.ts
  12. 16
      io.sc.platform.core.frontend/src/platform/components/toolbar/WToolbar.vue

71
io.sc.platform.core.frontend/src/platform/components/grid/Td.vue

@ -131,55 +131,34 @@ const generateTdIfComputed = computed(() => {
return true; return true;
}); });
const mergeGroupByFieldContainsIf = (fieldName: string) => {
const mergeGroupByField = tools.cm.mergeGroupByField.value;
if (Array.isArray(mergeGroupByField) && mergeGroupByField.length > 0) {
const index = mergeGroupByField.findIndex((item) => item === fieldName);
if (index > -1) {
return true;
}
}
return false;
};
const sortByContainsIf = (fieldName: string) => {
if (tools.props.sortBy && tools.props.sortBy.length > 0) {
const findResult = tools.props.sortBy.findIndex((item) => {
if (item.startsWith('-') && item.substring(1) === fieldName) {
return true;
}
return item === fieldName;
});
return findResult > -1;
}
return false;
};
const tdClick = () => { const tdClick = () => {
// 退 if (props.scope.row[Constant.FIELD_NAMES.SELECTABLE]) {
const cellSelected = tools.table.store.cellSelected; // 退
if (cellSelected) { const cellSelected = tools.table.store.cellSelected;
if (tools.props.localMode && tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.CELL && tools.props.selectMode === Constant.SELECT_MODE.CELL) { if (cellSelected) {
if (cellSelected.colName !== props.col['name'] || cellSelected.row[rowKey] !== props.scope.row[rowKey]) { if (tools.props.localMode && tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.CELL && tools.props.selectMode === Constant.SELECT_MODE.CELL) {
tools.editFM.exitInlineEdit(); if (cellSelected.colName !== props.col['name'] || cellSelected.row[rowKey] !== props.scope.row[rowKey]) {
} tools.editFM.exitInlineEdit();
} else if ( }
tools.props.localMode && } else if (
tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.ROW && tools.props.localMode &&
tools.props.selectMode === Constant.SELECT_MODE.CELL tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.ROW &&
) { tools.props.selectMode === Constant.SELECT_MODE.CELL
if (cellSelected.row[rowKey] !== props.scope.row[rowKey]) { ) {
tools.editFM.exitInlineEdit(); if (cellSelected.row[rowKey] !== props.scope.row[rowKey]) {
tools.editFM.exitInlineEdit();
}
} }
} }
} if (tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.NONE && tools.props.selectMode === Constant.SELECT_MODE.CELL) {
if (tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.NONE && tools.props.selectMode === Constant.SELECT_MODE.CELL) { tools.table.store.cellSelected = {
tools.table.store.cellSelected = { row: toRaw(props.scope.row),
row: toRaw(props.scope.row), rowKey: props.scope.row[rowKey],
rowKey: props.scope.row[rowKey], primaryKey: props.scope.row[tools.props.primaryKey],
primaryKey: props.scope.row[tools.props.primaryKey], colName: props.col['name'],
colName: props.col['name'], value: props.scope.row[props.col['name']],
value: props.scope.row[props.col['name']], };
}; }
} }
}; };

10
io.sc.platform.core.frontend/src/platform/components/grid/Tr.vue

@ -3,7 +3,7 @@
ref="trRef" ref="trRef"
:props="props.scope" :props="props.scope"
:no-hover="trNoHoverComputed" :no-hover="trNoHoverComputed"
:class="{ selected: trSelectedClassComputed }" :class="{ selected: trSelectedClassComputed, mouseDisabled: !scope.row[Constant.FIELD_NAMES.SELECTABLE] }"
:draggable="draggableComputed" :draggable="draggableComputed"
@click.stop="tools.em.rowClick($event, props.scope.row, props.scope.rowIndex)" @click.stop="tools.em.rowClick($event, props.scope.row, props.scope.rowIndex)"
@dblclick.stop="tools.em.rowDbClick($event, scope.row, scope.rowIndex)" @dblclick.stop="tools.em.rowDbClick($event, scope.row, scope.rowIndex)"
@ -18,6 +18,7 @@
<q-checkbox <q-checkbox
v-model="rowDataComputed[tickedField]" v-model="rowDataComputed[tickedField]"
flat flat
:disable="!props.scope.row[Constant.FIELD_NAMES.SELECTABLE]"
:dense="tools.table.configStore.dense || tools.table.configStore.denseBody || false" :dense="tools.table.configStore.dense || tools.table.configStore.denseBody || false"
@update:model-value="tools.em.updateTicked($event, scope.row)" @update:model-value="tools.em.updateTicked($event, scope.row)"
/> />
@ -94,7 +95,12 @@ const trSelectedClassComputed = computed(() => {
// //
const draggableComputed = computed(() => { const draggableComputed = computed(() => {
return dndMode && !Tools.isEmpty(Constant.DND_MODE.getAll()[dndMode]) && tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.NONE; return (
dndMode &&
!Tools.isEmpty(Constant.DND_MODE.getAll()[dndMode]) &&
tools.table.store.inlineEditStatus === Constant.EDIT_STATUS.NONE &&
props.scope.row[Constant.FIELD_NAMES.SELECTABLE]
);
}); });
// //

4
io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue

@ -1,6 +1,6 @@
<template> <template>
<div v-show="tools.cm.showIf.value" class="w-grid" style="height: 100%"> <div v-show="tools.cm.showIf.value" class="w-grid" style="height: 100%">
<q-resize-observer debounce="500" @resize="tools.opFM.resize" /> <q-resize-observer debounce="500" @resize="tools.opFM.resize('table')" />
<q-table <q-table
ref="tableRef" ref="tableRef"
v-model:pagination="tools.table.store.pagination" v-model:pagination="tools.table.store.pagination"
@ -27,7 +27,7 @@
> >
<!-- 查询表单与按钮工具栏 --> <!-- 查询表单与按钮工具栏 -->
<template #top="scope"> <template #top="scope">
<q-resize-observer debounce="100" @resize="tools.opFM.resize" /> <q-resize-observer debounce="500" @resize="tools.opFM.resize('top')" />
<Top ref="topRef" :scope="scope"> </Top> <Top ref="topRef" :scope="scope"> </Top>
</template> </template>

3
io.sc.platform.core.frontend/src/platform/components/grid/css/grid.css

@ -4,6 +4,9 @@
.w-grid .cellHover:hover { .w-grid .cellHover:hover {
background-color: rgba(0, 0, 0, .03); background-color: rgba(0, 0, 0, .03);
} }
.w-grid .mouseDisabled {
cursor: not-allowed; /* 将鼠标指针变为禁用图标 */
}
.w-grid .q-table__top { .w-grid .q-table__top {
padding: var(--tableTopPadding) var(--tableTopPadding); padding: var(--tableTopPadding) var(--tableTopPadding);
} }

3
io.sc.platform.core.frontend/src/platform/components/grid/ts/GridTools.ts

@ -266,6 +266,9 @@ export class GridTools {
if (Tools.hasOwnProperty(target, Constant.FIELD_NAMES.LAZYLOAD_NO_CHILDREN)) { if (Tools.hasOwnProperty(target, Constant.FIELD_NAMES.LAZYLOAD_NO_CHILDREN)) {
delete target[Constant.FIELD_NAMES.LAZYLOAD_NO_CHILDREN]; delete target[Constant.FIELD_NAMES.LAZYLOAD_NO_CHILDREN];
} }
if (Tools.hasOwnProperty(target, Constant.FIELD_NAMES.SELECTABLE)) {
delete target[Constant.FIELD_NAMES.SELECTABLE];
}
} }
/** /**

6
io.sc.platform.core.frontend/src/platform/components/grid/ts/constant/src/FieldNames.ts

@ -42,6 +42,11 @@ export class FieldNames {
*/ */
public static LAZYLOAD_NO_CHILDREN = '_lazyloadNoChildren'; public static LAZYLOAD_NO_CHILDREN = '_lazyloadNoChildren';
/**
*
*/
public static SELECTABLE = '_selectable';
/** /**
* *
* @param props * @param props
@ -58,6 +63,7 @@ export class FieldNames {
rowOldValue: FieldNames.ROW_OLD_VALUE, rowOldValue: FieldNames.ROW_OLD_VALUE,
rowIndex: FieldNames.ROW_INDEX, rowIndex: FieldNames.ROW_INDEX,
lazyloadNoChildren: FieldNames.LAZYLOAD_NO_CHILDREN, lazyloadNoChildren: FieldNames.LAZYLOAD_NO_CHILDREN,
selectable: FieldNames.SELECTABLE,
}; };
} }
} }

11
io.sc.platform.core.frontend/src/platform/components/grid/ts/event/EventManager.ts

@ -1,5 +1,3 @@
import type { PropsType } from '../types/PropsType';
import { RowClick } from './src/RowClick'; import { RowClick } from './src/RowClick';
import { RowDbClick } from './src/RowDbClick'; import { RowDbClick } from './src/RowDbClick';
import { AfterDragAndDrop } from './src/AfterDragAndDrop'; import { AfterDragAndDrop } from './src/AfterDragAndDrop';
@ -14,6 +12,7 @@ import { AfterRemove } from './src/AfterRemove';
import { AfterEditorOpen } from './src/AfterEditorOpen'; import { AfterEditorOpen } from './src/AfterEditorOpen';
import { GridTools } from '../GridTools'; import { GridTools } from '../GridTools';
import { TableType } from '../types/TableType'; import { TableType } from '../types/TableType';
import { Constant, PropsType } from '../../ts/index';
/** /**
* w-grid * w-grid
@ -54,7 +53,9 @@ export class EventManager {
* @param index * @param index
*/ */
public rowClick(evt: any, row: any, index: number) { public rowClick(evt: any, row: any, index: number) {
this._rowClick.execute(evt, row, index); if (row[Constant.FIELD_NAMES.SELECTABLE]) {
this._rowClick.execute(evt, row, index);
}
} }
/** /**
@ -64,7 +65,9 @@ export class EventManager {
* @param index * @param index
*/ */
public rowDbClick(evt: any, row: any, index: number) { public rowDbClick(evt: any, row: any, index: number) {
this._rowDbClick.execute(evt, row, index); if (row[Constant.FIELD_NAMES.SELECTABLE]) {
this._rowDbClick.execute(evt, row, index);
}
} }
/** /**

17
io.sc.platform.core.frontend/src/platform/components/grid/ts/event/src/UpdateTickeds.ts

@ -17,17 +17,12 @@ export class UpdateTickeds extends Base {
const selectedField = this.props.selectedField; const selectedField = this.props.selectedField;
const tickedField = this.props.tickedField; const tickedField = this.props.tickedField;
if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.NONE) { if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.NONE) {
if (value) { this.table.rows.forEach((item) => {
this.table.rows.forEach((item) => { if (item[Constant.FIELD_NAMES.SELECTABLE]) {
item[tickedField] = true; item[tickedField] = value;
item[selectedField] = true; item[selectedField] = value;
}); }
} else { });
this.table.rows.forEach((item) => {
item[tickedField] = false;
item[selectedField] = false;
});
}
} else if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.ROW || this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.CELL) { } else if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.ROW || this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.CELL) {
this.table.store.headerTicked = null; this.table.store.headerTicked = null;
} else if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.ROWS) { } else if (this.table?.store.inlineEditStatus === Constant.EDIT_STATUS.ROWS) {

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

@ -7,6 +7,8 @@ import { Constant, PropsType, TableType } from '../index';
* w-grid * w-grid
*/ */
export class Operator extends Base { export class Operator extends Base {
private topResizeFlag = false;
constructor(props: PropsType, table: TableType) { constructor(props: PropsType, table: TableType) {
super(props, table); super(props, table);
this.tableFullscreen = this.tableFullscreen.bind(this); this.tableFullscreen = this.tableFullscreen.bind(this);
@ -102,17 +104,16 @@ export class Operator extends Base {
* *
* @returns * @returns
*/ */
resize() { resize(location: string) {
if (!this || !this.table) {
return;
}
const tableElement = this.instance?.getHtmlElement(); const tableElement = this.instance?.getHtmlElement();
if (!tableElement) { if (!tableElement) {
return; return;
} }
this.table.store.resizeFlag = !this.table.store.resizeFlag; this.table.store.resizeFlag = !this.table.store.resizeFlag;
this.table.componentRef.getTopRef()?.handleQueryFormShowField(); if (location === 'top') {
this.table.componentRef.getTopRef()?.handleToolbarActions(); this.table.componentRef.getTopRef()?.handleQueryFormShowField();
this.table.componentRef.getTopRef()?.handleToolbarActions();
}
if (tableElement) { if (tableElement) {
this.table.store.location.yLocation = tableElement.getBoundingClientRect().y; this.table.store.location.yLocation = tableElement.getBoundingClientRect().y;
if (tableElement.getElementsByClassName('noDataTr').length > 0) { if (tableElement.getElementsByClassName('noDataTr').length > 0) {

17
io.sc.platform.core.frontend/src/platform/components/grid/ts/function/RowData.ts

@ -365,6 +365,7 @@ export class RowData extends Base {
rowData[this.props.tickedField] = this.getInitRowTicked(rowData); rowData[this.props.tickedField] = this.getInitRowTicked(rowData);
rowData[this.props.selectedField] = this.getInitRowSelected(rowData); rowData[this.props.selectedField] = this.getInitRowSelected(rowData);
rowData[Constant.FIELD_NAMES.ROW_OLD_VALUE] = {}; rowData[Constant.FIELD_NAMES.ROW_OLD_VALUE] = {};
rowData[Constant.FIELD_NAMES.SELECTABLE] = this.getSelectable(rowData);
this.setOldValue(rowData); this.setOldValue(rowData);
if (this.props.tree) { if (this.props.tree) {
if (this.table.store.expandDatas.length > 0 && this.table.store.expandDatas.includes(rowData[this.props.primaryKey])) { if (this.table.store.expandDatas.length > 0 && this.table.store.expandDatas.includes(rowData[this.props.primaryKey])) {
@ -378,6 +379,22 @@ export class RowData extends Base {
} }
} }
/**
*
* @param rowData
* @returns
*/
private getSelectable(rowData: any): boolean {
let selectable = true;
if (this.props.selectableIf && typeof this.props.selectableIf === 'function') {
const result = this.props.selectableIf({ grid: this.instance, data: rowData });
if (!result) {
selectable = false;
}
}
return selectable;
}
/** /**
* ticked状态 * ticked状态
* @param rowData * @param rowData

4
io.sc.platform.core.frontend/src/platform/components/grid/ts/types/PropsType.ts

@ -207,6 +207,10 @@ export type PropsType = {
* toolbar * toolbar
*/ */
toolbarConfigure: any, toolbarConfigure: any,
/**
*
*/
selectableIf?: Function,
/** /**
* *
*/ */

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

@ -75,8 +75,8 @@
> >
<q-item-section> <q-item-section>
<q-item-label <q-item-label
><q-icon v-if="childrenBtn.icon" :name="getIcon(childrenBtn.icon)" left size="20px"></q-icon> ><q-icon v-if="childrenBtn?.icon" :name="getIcon(childrenBtn?.icon)" left size="20px"></q-icon>
{{ getLabel(childrenBtn.label) }}</q-item-label {{ getLabel(childrenBtn?.label) }}</q-item-label
> >
</q-item-section> </q-item-section>
</q-item> </q-item>
@ -204,7 +204,11 @@ const localFlag = ref(false);
watch( watch(
() => modelValue.value, () => modelValue.value,
(newVal, oldVal) => { (newVal, oldVal) => {
handleButtons(); // handleButtons();
// if (containerRef.value) {
// isActionWidthInitializedRef.value = false;
// onResize(containerRef.value.clientWidth);
// }
}, },
); );
@ -284,11 +288,12 @@ const onResize = (size) => {
if (!isActionWidthInitializedRef.value) { if (!isActionWidthInitializedRef.value) {
const nodes = containerRef.value.getElementsByClassName('class-action-item'); const nodes = containerRef.value.getElementsByClassName('class-action-item');
for (let i = 0; i < buttons_.length; i++) { for (let i = 0; i < buttons_.length; i++) {
buttons_[i].width = nodes[i].clientWidth; if (nodes[i]) {
buttons_[i].width = nodes[i].clientWidth;
}
} }
isActionWidthInitializedRef.value = true; isActionWidthInitializedRef.value = true;
} }
reset(size.width); reset(size.width);
}; };
@ -425,6 +430,7 @@ const buttonClick = async (button) => {
selectedColName: props.grid.getSelectedCell()['colName'], selectedColName: props.grid.getSelectedCell()['colName'],
}; };
if (button.enableIf && !button.enableIf(args)) { if (button.enableIf && !button.enableIf(args)) {
console.warn('[w-toolbar] The function `enableIf` returns false, causing the `click` not to trigger.' + ' button name is `' + button['name'] + '`');
return; return;
} }
let beforeResult = true; let beforeResult = true;

Loading…
Cancel
Save