提交 62f1620e 编写于 作者: Shine-zwj's avatar Shine-zwj

update:更新表格

上级 db2cd321
{
title: "{{item.caption}}",
columnType: "{{item.columnType}}",
{{#if item.align}}
align: "{{item.align}}",
{{/if}}
{{#neq lastColumn true}}
{{#if item.widthUnit 'PX'}}
width: {{item.width}},
......@@ -18,5 +21,9 @@
{{else}}
dataIndex: "{{lowerCase item.codeName}}",
ellipsis: true,
enableSort: {{item.enableSort}},
{{#if item.aggMode}}
aggMode: "{{item.aggMode}}",
{{/if}}
{{/eq}}
},
{{#eq item.columnType 'GROUPGRIDCOLUMN'}}
{{#each item.psDEGridColumns as | column |}}
{{>(lookup 'SUMMARYCOLUMN') item=column ctrl=ctrl}}
{{/each}}
{{else}}
<a-table-summary-cell>\{{state.dataAgg}}.{{lowerCase item.codeName}}</a-table-summary-cell>
{{/eq}}
{{#*inline "COLUMN"}}{{>@macro/grid-detail/grid-column.hbs}}{{/inline}}
{{#*inline "COLUMNMODEL"}}{{>@macro/grid-detail/grid-column-model.hbs}}{{/inline}}
{{#*inline "SUMMARYCOLUMN"}}{{>@macro/grid-detail/grid-summary-column.hbs}}{{/inline}}
\ No newline at end of file
{{#*inline "COLUMNMODEL"}}{{>@macro/grid-detail/grid-column-model.hbs}}{{/inline}}
\ No newline at end of file
......@@ -90,7 +90,7 @@ export interface GridControlState extends MainControlState {
* @type {IParam}
* @memberof GridControlState
*/
dataAgg: IParam;
dataAgg: IParam[];
/**
* @description 聚合模式
......@@ -99,6 +99,20 @@ export interface GridControlState extends MainControlState {
*/
aggMode: string;
/**
* @description 聚合实体
* @type {string}
* @memberof GridControlState
*/
aggEntity: string,
/**
* @description 聚合数据集
* @type {string}
* @memberof GridControlState
*/
aggDataSet: string,
/**
* @description 分组模式
* @type {string}
......
......@@ -54,21 +54,99 @@ export class GridControl extends MainControl {
}
/**
* @description 获取操作列标识
* @param {IParam} column 表格列集合
* @description 获取指定列类型模型
* @param {IParam[]} columns 表格列集合
* @param {string} columnType 表格列类型
* @return {*} {*}
* @memberof GridControl
*/
public getUAGridColumn(columns: IParam[]): any {
public getGridColumn(columns: IParam[], columnType: string): any {
columns.forEach((column: IParam) => {
if (Object.is(column.columnType, "UAGRIDCOLUMN")) {
return column.dataIndex;
if (Object.is(column.columnType, columnType)) {
return column;
}
if (column.children?.length > 0) {
return this.getUAGridColumn(column.children);
return this.getGridColumn(column.children, columnType);
}
})
}
/**
* @description 自动分组
* @memberof GridControl
*/
public autoGroup() {
const { groupField } = this.controlState;
const dataRef = toRef(this.controlState, 'items');
let autoGroup: string[] = [];
dataRef.value.forEach((item: IParam) => {
if (item.hasOwnProperty(groupField)) {
autoGroup.push(item[groupField]);
}
})
autoGroup = [...new Set(autoGroup)];
if (autoGroup.length > 0) {
const columnsModelRef = toRef(this.controlState, 'columnsModel');
const groupColumn = this.getGridColumn(columnsModelRef.value, 'GROUP');
const gridData: IParam[] = [];
autoGroup.forEach((group: string) => {
const children: IParam[] = [];
dataRef.value.forEach((item: IParam) => {
if (Object.is(group, item[groupField])) {
children.push(item);
}
})
gridData.push({
[groupColumn.dataIndex]: group,
children: deepCopy(children),
})
});
dataRef.value = gridData;
}
}
/**
* @description 代码表分组
* @memberof GridControl
*/
public async codeListGroup() {
const { groupField } = this.controlState;
const dataRef = toRef(this.controlState, 'items');
// TODO 代码表数据
let codeListGroup: IParam[] = [];
if (codeListGroup.length > 0) {
const columnsModelRef = toRef(this.controlState, 'columnsModel');
const groupColumn = this.getGridColumn(columnsModelRef.value, 'GROUP');
const gridData: IParam[] = [];
const otherGroup: IParam[] = [];
codeListGroup.forEach((group: IParam) => {
const children: IParam[] = [];
dataRef.value.forEach((item: IParam) => {
if (Object.is(group.value, item[groupField])) {
children.push(item);
}
});
gridData.push({
[groupColumn.dataIndex]: group.text,
children: deepCopy(children),
})
});
dataRef.value.forEach((item: IParam) => {
const index: number = codeListGroup.findIndex((_item: IParam) => Object.is(item[groupField], _item.value));
if (index < 0) {
otherGroup.push(item);
}
});
if (otherGroup.length > 0) {
gridData.push({
[groupColumn.dataIndex]: "其它",
children: deepCopy(otherGroup),
})
}
dataRef.value = gridData;
}
}
/**
* @description 计算表格行为权限
* @memberof GridControl
......@@ -76,11 +154,11 @@ export class GridControl extends MainControl {
public calcGridAuthState() {
const dataRef = toRef(this.controlState, 'items');
const columnsModelRef = toRef(this.controlState, 'columnsModel');
let uaColumnKey = this.getUAGridColumn(columnsModelRef.value);
if (uaColumnKey) {
let columnModel = this.getGridColumn(columnsModelRef.value, 'UAGRIDCOLUMN');
if (columnModel) {
dataRef.value.forEach((item: IParam) => {
Object.assign(item, {
[uaColumnKey]: this.getActionAuthState(item),
[columnModel.dataIndex]: this.getActionAuthState(item),
})
})
}
......@@ -91,8 +169,99 @@ export class GridControl extends MainControl {
* @memberof GridControl
*/
public handleGridGroup() {
const { groupMode, groupField, groupCodeList } = this.controlState;
const { groupMode, groupField } = this.controlState;
if (groupField) {
if (Object.is(groupMode, "AUTO")) {
this.autoGroup();
} else if (Object.is(groupMode, "CODELIST")) {
this.codeListGroup();
}
}
}
/**
* @description 远程聚合
* @memberof GridControl
*/
public async remoteAgg(): Promise<IParam[]> {
const { aggEntity, aggDataSet } = this.controlState;
const aggData: IParam[] = [];
return aggData;
}
/**
* @description 获取聚合值
* @param {IParam[]} aggData 聚合数据
* @param {string} column 列模型
* @memberof GridControl
*/
public getAggValue(aggData: IParam[], column: IParam): string {
switch (column.aggMode) {
case 'NONE':
return '';
case 'SUM':
let sum: number = 0;
aggData.forEach((item: IParam) => {
sum += Number(item[column.dataIndex] ? item[column.dataIndex] : 0);
})
return 'SUM:' + sum;
case 'AVG':
let sum2: number = 0;
aggData.forEach((item: IParam) => {
sum2 += Number(item[column.dataIndex] ? item[column.dataIndex] : 0);
})
return 'AVG:' + Number(sum2 / (aggData.length)).toFixed(3);
case 'MAX':
let max: number = 0;
aggData.forEach((item: IParam) => {
const value: number = Number(item[column.dataIndex] ? item[column.dataIndex] : 0);
if (value > max) {
max = value;
}
})
return 'MAX:' + max;
case 'MIN':
let min: number = 0;
aggData.forEach((item: IParam) => {
const value: number = Number(item[column.dataIndex] ? item[column.dataIndex] : 0);
if (min > value) {
min = value;
}
})
return 'MIN:' + min;
default:
return '';
}
}
/**
* @description 处理数据聚合
* @memberof GridControl
*/
public async handleDataAgg() {
const { aggMode } = this.controlState;
if (!Object.is(aggMode, 'NONE')) {
const dataAggRef = toRef(this.controlState, 'dataAgg');
let aggData: IParam[];
if (Object.is(aggMode, 'PAGE')) {
const dataRef = toRef(this.controlState, 'items');
aggData = [...dataRef.value];
} else if (Object.is(aggMode, 'ALL')) {
aggData = await this.remoteAgg();
}
const columnsModelRef = toRef(this.controlState, 'columnsModel');
const columnsModel: IParam[] = [];
columnsModelRef.value.forEach((column: IParam) => {
if (!Object.is(column.columnType, 'GROUPGRIDCOLUMN')) {
columnsModel.push(column);
}
});
const dataAgg: string[] = [];
columnsModel.forEach((column: IParam) => {
dataAgg.push(this.getAggValue(aggData, column))
})
dataAggRef.value = [...dataAgg];
}
}
/**
......@@ -137,6 +306,7 @@ export class GridControl extends MainControl {
}
this.calcGridAuthState();
this.handleGridGroup();
this.handleDataAgg();
} catch (error) {
// todo 错误异常处理
}
......
......@@ -28,4 +28,11 @@ export interface MainControlState extends ControlStateBase {
* @memberof MainControlState
*/
controlService: IParam;
/**
* @description UI服务
* @type {IParam}
* @memberof MainControlState
*/
UIService: IParam;
}
\ No newline at end of file
......@@ -4,10 +4,15 @@ export const CtrlConfig = {
controlCodeName: "{{ctrl.codeName}}",
controlName: "{{ctrl.name}}",
items: [],
dataAgg: [],
aggMode: "{{ctrl.aggMode}}",
{{#if (eq ctrl.aggMode 'ALL')}}
aggEntity: "{{ctrl.aggPSAppDataEntity.codeName}}",
aggDataSet: "{{ctrl.aggPSAppDEDataSet.codeName}}",
{{/if}}
{{#if ctrl.enableGroup}}
groupMode: "{{ctrl.groupMode}}",
groupField: "{{ctrl.groupPSAppDEField.codeName}}",
groupField: "{{lowerCase ctrl.groupPSAppDEField.codeName}}",
{{#if ctrl.groupPSCodeList}}
groupCodeList: {
codeListTag: "{{ctrl.groupPSCodeList.codeName}}",
......@@ -37,6 +42,18 @@ export const CtrlConfig = {
pagination: false,
{{/if}}
columnsModel: [
{{#if ctrl.enableGroup}}
{{#if ctrl.groupPSAppDEField}}
{
title: "分组",
columnType: "GROUP",
width: 100,
resizable: true,
ellipsis: true,
dataIndex: "grid_group",
},
{{/if}}
{{/if}}
{{#each ctrl.psDEGridColumns as | column |}}
{{#if @last}}
{{>(lookup 'COLUMNMODEL') item=column lastColumn=true}}
......
......@@ -64,15 +64,6 @@ const handleChange = (pagination: IParam, filters: IParam, sorter: IParam, data:
const { currentDataSource } = data;
console.log(pagination, filters, sorter, currentDataSource);
}
const data = [];
for (let i = 0; i < 100; i++) {
data.push({
key: i,
name: `Edrward ${i}`,
age: 32,
address: `London Park no. ${i}`,
});
}
</script>
<template>
<a-table
......@@ -81,7 +72,7 @@ for (let i = 0; i < 100; i++) {
:showHeader="{{#if ctrl.hideHeader}}false{{else}}true{{/if}}"
:scroll="gridScrollOption"
:sortDirections="['ascend', 'descend']"
:data-source="data"
:data-source="state.items"
:row-selection="rowSelectionOption"
:columns="state.columnsModel"
:pagination="state.pagination"
......@@ -109,9 +100,9 @@ for (let i = 0; i < 100; i++) {
<template #summary>
<a-table-summary-row>
<a-table-summary-cell>数据聚合</a-table-summary-cell>
{{#each ctrl.psDEGridColumns as | column |}}
{{>(lookup 'SUMMARYCOLUMN') item=column ctrl=ctrl}}
{{/each}}
<a-table-summary-cell v-for="(item, index) in state.dataAgg" :key="index">
<span>\{{item}}</span>
</a-table-summary-cell>
</a-table-summary-row>
</template>
{{/neq}}
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册