ze-react-component-library
Version:
ZeroETP React Component Library
1,297 lines (1,100 loc) • 44.5 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.getCurrentShowFilter = exports.getCurrentFilterState = exports.filterIcon = void 0;
require("antd/lib/popover/style");
var _popover = _interopRequireDefault(require("antd/lib/popover"));
require("antd/lib/button/style");
var _button = _interopRequireDefault(require("antd/lib/button"));
require("antd/lib/tooltip/style");
var _tooltip = _interopRequireDefault(require("antd/lib/tooltip"));
require("antd/lib/space/style");
var _space = _interopRequireDefault(require("antd/lib/space"));
require("antd/lib/empty/style");
var _empty = _interopRequireDefault(require("antd/lib/empty"));
require("antd/lib/checkbox/style");
var _checkbox = _interopRequireDefault(require("antd/lib/checkbox"));
require("antd/lib/result/style");
var _result = _interopRequireDefault(require("antd/lib/result"));
var _react = _interopRequireWildcard(require("react"));
var _s2React = require("@antv/s2-react");
var _s2 = require("@antv/s2");
require("lodash.combinations");
var _lodash2 = _interopRequireWildcard(require("lodash"));
var _deepmerge = _interopRequireDefault(require("deepmerge"));
var _hooks = require("@umijs/hooks");
var _util = require("../util");
var _request = require("../request");
var _icons = require("@ant-design/icons");
require("@antv/s2-react/dist/style.min.css");
var _util2 = require("./util");
var _excelExporter = _interopRequireDefault(require("./excelExporter"));
require("./ZESheet.less");
var _useLocale = _interopRequireDefault(require("../hooks/useLocale"));
var _RowColumnHoverTooltipInteraction = _interopRequireDefault(require("./RowColumnHoverTooltipInteraction"));
var _useCurrency = require("../hooks/useCurrency");
var _useFrontConfig = require("../hooks/useFrontConfig");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var __extends = void 0 && (void 0).__extends || function () {
var _extendStatics = function extendStatics(d, b) {
_extendStatics = Object.setPrototypeOf || {
__proto__: []
} instanceof Array && function (d, b) {
d.__proto__ = b;
} || function (d, b) {
for (var p in b) {
if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];
}
};
return _extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
_extendStatics(d, b);
function __() {
this.constructor = d;
}
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
}();
var __assign = void 0 && (void 0).__assign || function () {
__assign = Object.assign || function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
}
return t;
};
return __assign.apply(this, arguments);
};
var __spreadArray = void 0 && (void 0).__spreadArray || function (to, from) {
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) {
to[j] = from[i];
}
return to;
};
var iconColor = "#A0A9BC";
var plusPng = '<svg t="1710829941790" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4230" width="200" height="200"><path d="M85.312 85.312v853.376h853.376V85.312H85.312zM0 0h1024v1024H0V0z m554.624 213.312v256h256v85.376h-256v256H469.312v-256h-256V469.376h256v-256h85.312z" p-id="4231"></path></svg>';
var filterIcon = '<svg t="1633848048963" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="85936" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M0 0h1024L724.676923 488.369231V1024l-425.353846-141.784615v-393.846154L0 0z m196.923077 102.4l204.8 354.461538v362.338462l228.430769 63.015385V456.861538l212.676923-354.461538H196.923077z" opacity=".4" p-id="85937"></path></svg>';
exports.filterIcon = filterIcon;
var CustomRowCell =
/** @class */
function (_super) {
__extends(CustomRowCell, _super);
function CustomRowCell() {
return _super !== null && _super.apply(this, arguments) || this;
}
CustomRowCell.prototype.getTextPosition = function () {
var _a, _b, _c, _d;
if (this.meta.children.length < 2) {
return {
x: this.meta.x + 8,
y: this.meta.y + this.meta.height / 2 - (((_b = (_a = this.theme.rowCell) === null || _a === void 0 ? void 0 : _a.text) === null || _b === void 0 ? void 0 : _b.fontSize) || 12) / 2
};
}
var maxY = (_c = this.meta.children[this.meta.children.length - 1]) === null || _c === void 0 ? void 0 : _c.y;
var minY = (_d = this.meta.children[0]) === null || _d === void 0 ? void 0 : _d.y;
var scrollY = this.headerConfig.scrollY; // 滚动时吸附在顶部
if (scrollY > minY && scrollY < maxY) {
return {
x: this.meta.x + 8,
y: scrollY + 8
};
}
return {
x: this.meta.x + 8,
y: this.meta.y + 8
};
};
return CustomRowCell;
}(_s2.RowCell);
/**
*
* @param fieldName
* @param filterParams
* @returns
*/
var getCurrentFilterState = function getCurrentFilterState(fieldName, filterParams) {
var _a;
var filtered = (_a = filterParams === null || filterParams === void 0 ? void 0 : filterParams.find(function (d) {
return d.filterKey === fieldName;
})) === null || _a === void 0 ? void 0 : _a.filtered;
return filtered;
};
exports.getCurrentFilterState = getCurrentFilterState;
var getCurrentShowFilter = function getCurrentShowFilter(fieldName, filterParams) {
var _a;
var showFilter = (_a = filterParams === null || filterParams === void 0 ? void 0 : filterParams.find(function (d) {
return d.filterKey === fieldName;
})) === null || _a === void 0 ? void 0 : _a.showFilter;
return showFilter;
};
exports.getCurrentShowFilter = getCurrentShowFilter;
var getNodeChildrenLen = function getNodeChildrenLen(nodes) {
var len = 0;
var count = function count(ns) {
ns.forEach(function (n) {
if (n.children.length > 0) {
count(n.children);
} else {
len = len + 1;
}
});
};
count(nodes);
return len;
};
var CustomTableColCell =
/** @class */
function (_super) {
__extends(CustomTableColCell, _super);
function CustomTableColCell(meta, spreadsheet, headerConfig, callback) {
var _this = _super.call(this, meta, spreadsheet, headerConfig) || this;
_this.onIconClick = callback;
return _this;
}
CustomTableColCell.prototype.drawTextShape = function () {
_super.prototype.drawTextShape.call(this);
var _a = this.meta,
x = _a.x,
y = _a.y,
cellWidth = _a.width,
cellHeight = _a.height;
var style = this.getStyle();
var iconSize = (0, _lodash2.get)(style, "icon.size");
var iconMargin = (0, _lodash2.get)(style, "icon.margin");
var iconX = x + cellWidth - iconSize - (iconMargin === null || iconMargin === void 0 ? void 0 : iconMargin.right);
var iconY = y + cellHeight / 2 - iconSize / 2;
var showFilter = getCurrentShowFilter(this.meta.value, this.spreadsheet.dataCfg.filterParams);
if (showFilter) {
this.renderFilterIcon({
x: iconX,
y: iconY,
width: iconSize,
height: iconSize
});
}
};
CustomTableColCell.prototype.renderFilterIcon = function (position) {
/**
* 有值说明有加filter
*/
var _this = this;
var isFiltered = getCurrentFilterState(this.meta.value, this.spreadsheet.dataCfg.filterParams);
position.x = position.x + 12;
var x = position.x,
y = position.y,
width = position.width,
height = position.height;
var icon = new _s2.GuiIcon({
name: "Filter",
x: x,
y: y,
width: width,
height: height,
fill: isFiltered ? "blue" : iconColor
});
this.add(icon);
icon.on("click", function () {
var _a;
(_a = _this.onIconClick) === null || _a === void 0 ? void 0 : _a.call(_this, {
meta: _this.meta,
position: position
});
});
};
return CustomTableColCell;
}(_s2.ColCell);
var CustomTableCornelCell =
/** @class */
function (_super) {
__extends(CustomTableCornelCell, _super);
function CustomTableCornelCell(meta, spreadsheet, headerConfig, callback) {
var _this = _super.call(this, meta, spreadsheet, headerConfig) || this;
_this.onIconClick = callback;
return _this;
}
CustomTableCornelCell.prototype.drawTextShape = function () {
var _a;
_super.prototype.drawTextShape.call(this);
var showFilter = (_a = this.spreadsheet.dataCfg.filterParams) === null || _a === void 0 ? void 0 : _a.map(function (d) {
return d.filterKey;
}).includes(this.meta.field);
if (showFilter) {
var _b = this.meta,
x = _b.x,
y = _b.y,
cellWidth = _b.width,
cellHeight = _b.height;
var style = this.getStyle();
var iconSize = (0, _lodash2.get)(style, "icon.size");
var iconMargin = (0, _lodash2.get)(style, "icon.margin");
var iconX = x + cellWidth - iconSize - (iconMargin === null || iconMargin === void 0 ? void 0 : iconMargin.right);
var iconY = y + cellHeight / 2 - iconSize / 2;
var showFilter_1 = getCurrentShowFilter(this.meta.value, this.spreadsheet.dataCfg.filterParams);
if (showFilter_1) {
this.renderFilterIcon({
x: iconX,
y: iconY,
width: iconSize,
height: iconSize
});
}
}
};
CustomTableCornelCell.prototype.renderFilterIcon = function (position) {
var _this = this;
var isFiltered = getCurrentFilterState(this.meta.value, this.spreadsheet.dataCfg.filterParams);
var x = position.x,
y = position.y,
width = position.width,
height = position.height;
var icon = new _s2.GuiIcon({
name: "Filter",
x: x,
y: y,
width: width,
height: height,
fill: isFiltered ? "blue" : "rgb(67, 72, 91)"
});
this.add(icon);
icon.on("click", function () {
var _a;
(_a = _this.onIconClick) === null || _a === void 0 ? void 0 : _a.call(_this, {
meta: _this.meta,
position: position
});
});
};
return CustomTableCornelCell;
}(_s2.CornerCell);
var ZESheet = function ZESheet(_a) {
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
var logicform = _a.logicform,
setLogicform = _a.setLogicform,
result = _a.result,
sheetType = _a.sheetType,
entityTooltipCardProps = _a.entityTooltipCardProps,
_s2DataConfig = _a.s2DataConfig,
_o = _a.s2Options,
s2OptionsSrc = _o === void 0 ? {} : _o,
_p = _a.showExport,
showExport = _p === void 0 ? true : _p,
xlsx = _a.xlsx,
_q = _a.style,
style = _q === void 0 ? {} : _q,
_r = _a.showInterval,
showInterval = _r === void 0 ? false : _r,
_s = _a.showSwitcher,
showSwitcher = _s === void 0 ? true : _s,
onChange = _a.onChange,
_onRow = _a.onRow,
height = _a.height,
title = _a.title,
_t = _a.showGoToDetail,
showGoToDetail = _t === void 0 ? false : _t,
_u = _a.showRefDetail,
showRefDetail = _u === void 0 ? false : _u;
var showSubTotals = (_c = (_b = (0, _useFrontConfig.useEChartsSetting)()) === null || _b === void 0 ? void 0 : _b.sheet) === null || _c === void 0 ? void 0 : _c.showSubTotals;
var t = (0, _useLocale.default)().t;
var getCurrencySymbol = (0, _useCurrency.useCurrencyFromContext)().getCurrencySymbol;
var filterDataRef = (0, _react.useRef)({});
var _w = (0, _react.useState)(),
filterNode = _w[0],
setFilterNode = _w[1];
var _x = (0, _react.useState)(false),
filterOpen = _x[0],
setFilterOpen = _x[1];
var _y = (0, _react.useState)(),
filterParams = _y[0],
setFilterParams = _y[1];
var _z = (0, _react.useState)({}),
percentageConfig = _z[0],
setPercentageConfig = _z[1];
var _0 = (0, _react.useState)(_s2DataConfig),
s2DataConfig = _0[0],
setS2DataConfig = _0[1];
var percentageInGroupKeys = Object.entries(percentageConfig).filter(function (_a) {
var k = _a[0],
v = _a[1];
return v;
}).map(function (m) {
return m[0];
}); // 加上一点default的设置
// 此处类型用any，不用ZESheetProps["s2Options"]，因为s2Options.totals.row里面的属性是readonly，很奇怪
var s2Options = (0, _deepmerge.default)({
totals: {
row: {
showGrandTotals: true,
showSubTotals: true,
label: t("sheet.total"),
subLabel: t("sheet.subtotal")
}
},
conditions: {
interval: []
},
interaction: {
enableCopy: true,
customInteractions: [{
key: "RowColumnHoverTooltipInteraction",
interaction: _RowColumnHoverTooltipInteraction.default
}]
}
}, s2OptionsSrc);
var onRow = function onRow(record) {
_onRow === null || _onRow === void 0 ? void 0 : _onRow(record); // 下钻后重置传入的配置，因为logicform发生了改变，之前的配置是针对最初logicform的
setS2DataConfig({});
};
var s2Ref = (0, _react.useRef)();
var adaptiveRef = (0, _react.useRef)();
var _1 = (0, _react.useState)(),
switcherFields = _1[0],
setSwitcherFields = _1[1];
var _2 = (0, _react.useState)({}),
expandFields = _2[0],
setExpandFields = _2[1]; // 初始表格数据，用来生成初始配置
var data = (0, _hooks.useRequest)(function () {
if (result) {
return new Promise(function (resolve) {
return resolve(result);
});
}
if (!logicform) {
return Promise.resolve(null);
}
return (0, _request.requestLogicform)(logicform);
}, {
refreshDeps: [JSON.stringify(logicform), result]
}).data;
var originFields = (0, _react.useMemo)(function () {
return __assign(__assign({}, (0, _util2.getDefaultS2ConfigFields)(data).fields), (s2DataConfig === null || s2DataConfig === void 0 ? void 0 : s2DataConfig.fields) || {});
}, [data, s2DataConfig]);
var fields = (0, _react.useMemo)(function () {
return __assign(__assign({}, originFields), {
rows: switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.rows.items.filter(function (d) {
return d.checked !== false;
}).map(function (d) {
return d.id;
}),
columns: switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.columns.items.filter(function (d) {
return d.checked !== false;
}).map(function (d) {
return d.id;
}),
values: switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.values.items.filter(function (d) {
return d.checked !== false;
}).map(function (d) {
if (percentageInGroupKeys.includes(d.id)) {
return [d.id, d.id + "(\u7EC4\u5185)"];
}
return d.id;
}).flat()
}); // originFields， expandFields变化，switcherFields一定会跟着变化
}, [switcherFields, percentageConfig]);
var dataCfg = __assign(__assign({
data: []
}, s2DataConfig), {
fields: fields
}); // total && sub total
var _totalAndSubTotalData = (0, _hooks.useRequest)(function () {
var _a, _b;
if (!data || !data.logicform.groupby) {
return Promise.resolve([]);
} // limit, having因为筛选很难控制，所以都不要了
if (data.logicform.having || data.logicform.limit) {
return Promise.resolve([]);
} // 对data.logicform.groupby做一个优化。如果groupby中已经有一个a，那么a_b不需要进入小计
// 如果groupby中已经有一个a_ID，那么a_b不需要进入小计
var filteredGroupby = data.logicform._noRelationGroupby || data.logicform.groupby;
var combinations = _lodash2.default.flatMap(filteredGroupby, function (_v, i, a) {
return _lodash2.default.combinations(a, i + 1);
}).filter(function (a) {
return a.length < filteredGroupby.length;
});
var preds = data.logicform.preds.filter(function (p) {
return p.operator;
});
var logicforms = []; // 给query加上groupby的$exists
var existsForGroupbyItem = {};
(data.logicform.groupby || []).forEach(function (gi) {
existsForGroupbyItem[gi._id] = {
$exists: true
};
});
var lfQuery = __assign(__assign({}, existsForGroupbyItem), ((_a = data === null || data === void 0 ? void 0 : data.logicform) === null || _a === void 0 ? void 0 : _a.query) || {});
if (!data.logicform.limitBy) {
if (((_b = data.logicform.groupby) === null || _b === void 0 ? void 0 : _b.length) === 2) {
// Subtotal - 小计只在2个的时候出
logicforms.push.apply(logicforms, combinations.map(function (groupby) {
return __assign(__assign({}, data.logicform), {
groupby: groupby,
preds: preds,
query: lfQuery,
limit: undefined,
limitBy: undefined,
skip: undefined,
having: undefined,
_noRelationGroupby: undefined
});
}));
} // Total
logicforms.push(__assign(__assign({}, data.logicform), {
groupby: undefined,
preds: preds,
query: lfQuery,
limit: undefined,
limitBy: undefined,
skip: undefined,
having: undefined,
_noRelationGroupby: undefined
}));
}
return Promise.all(logicforms.map(function (lf) {
return (0, _request.requestLogicform)(lf);
}));
}, {
formatResult: function formatResult(res) {
var result = [];
for (var _i = 0, res_1 = res; _i < res_1.length; _i++) {
var resItem = res_1[_i];
result = __spreadArray(__spreadArray([], result), resItem.result);
}
return result;
},
refreshDeps: [data]
}).data;
if (data === null || data === void 0 ? void 0 : data.result) {
if (!Array.isArray(data.result)) {
return /*#__PURE__*/_react.default.createElement(_result.default, {
title: "\u6B64\u7EC4\u4EF6\u4EC5\u652F\u6301\u6570\u7EC4"
});
}
var meta = ["rows", "columns", "values"].reduce(function (p, r) {
return p.concat(dataCfg.fields[r] || []);
}, []).map(function (d) {
var _a;
var property = (0, _util.findProperty)(__assign(__assign({}, data.schema), {
properties: __spreadArray(__spreadArray(__spreadArray([], data.schema.properties), data.columnProperties), percentageInGroupKeys.map(function (k) {
var p = data.columnProperties.find(function (f) {
return f.name === k;
}) || {};
return __assign(__assign({}, p), {
name: k + "(\u7EC4\u5185)"
});
}))
}), d, "_");
var metaOfProps = (_a = dataCfg.meta) === null || _a === void 0 ? void 0 : _a.find(function (f) {
return f.field === d;
});
var defaultFormatter = function defaultFormatter(v) {
if (["null", ""].includes(v)) {
return "-";
}
if ((property === null || property === void 0 ? void 0 : property.primal_type) === "boolean") {
return t(v);
}
if (property) {
var currencySymbol = (getCurrencySymbol === null || getCurrencySymbol === void 0 ? void 0 : getCurrencySymbol(property)) || "";
return currencySymbol + (0, _util.formatWithProperty)(property, v);
}
return v;
};
if (metaOfProps) {
return __assign(__assign({}, metaOfProps), {
formatter: metaOfProps.formatter || defaultFormatter
});
}
return {
field: d,
name: (property === null || property === void 0 ? void 0 : property.unit) ? d + "(" + property.unit + ")" : undefined,
formatter: defaultFormatter
};
}); // meta
dataCfg.meta = meta; // interval
if (showInterval) {
s2Options.conditions = {
interval: data.columnProperties.filter(function (p) {
return p.primal_type === "number";
}).map(function (p) {
return {
field: p.name,
mapping: function mapping() {
return {
fill: "#80BFFF"
};
}
};
})
};
} // Total & Subtotal
if (!data.logicform.limitBy && ((_d = dataCfg.fields.rows) === null || _d === void 0 ? void 0 : _d.length) > 0) {
if ((0, _util.enableShowSubTotalsSetting)(data === null || data === void 0 ? void 0 : data.logicform)) {
s2Options.totals.row.showSubTotals = showSubTotals !== null && showSubTotals !== void 0 ? showSubTotals : true;
s2Options.totals.row.subTotalsDimensions = data.logicform.groupby.slice(0, data.logicform.groupby.length - 1).map(function (g) {
return g.name;
});
} else {
s2Options.totals.row.showSubTotals = false;
}
} else {
s2Options.totals.row.showGrandTotals = false;
s2Options.totals.row.showSubTotals = false;
}
}
var onFilterIconClick = function onFilterIconClick(node) {
// console.log(node);
setFilterNode(node);
setTimeout(function () {
setFilterOpen(true);
}, 100);
};
var getLatestFilterParams = function getLatestFilterParams() {
return Object.entries(filterDataRef.current).map(function (_a) {
var _b;
var k = _a[0],
v = _a[1];
var value = ((_b = filterParams === null || filterParams === void 0 ? void 0 : filterParams.find(function (f) {
return f.filterKey === k;
})) === null || _b === void 0 ? void 0 : _b.filteredValues) || v.data;
return {
showFilter: v.data.length > 0,
filterKey: k,
filteredValues: value,
allValues: v.data,
filtered: value.length !== v.data.length
};
});
};
var renderFilterPopContent = function renderFilterPopContent() {
var _a, _b, _c;
var filterKey = filterNode === null || filterNode === void 0 ? void 0 : filterNode.meta.value;
var checkOptions = (_c = (_b = (_a = filterDataRef.current) === null || _a === void 0 ? void 0 : _a[filterKey]) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.map(function (d) {
return {
label: d,
value: d
};
});
var params = getLatestFilterParams();
var value = params.find(function (f) {
return f.filterKey === filterKey;
});
return /*#__PURE__*/_react.default.createElement("div", {
style: {
maxWidth: 300,
maxHeight: "50vh",
overflowY: "auto"
}
}, /*#__PURE__*/_react.default.createElement(_checkbox.default, {
indeterminate: (value === null || value === void 0 ? void 0 : value.filteredValues.length) > 0 && (value === null || value === void 0 ? void 0 : value.filteredValues.length) < (value === null || value === void 0 ? void 0 : value.allValues.length),
onChange: function onChange(e) {
setFilterParams(params.map(function (m) {
if (m.filterKey === filterKey) {
return {
filterKey: filterKey,
filteredValues: e.target.checked ? value.allValues : []
};
}
return m;
}));
},
checked: (value === null || value === void 0 ? void 0 : value.filteredValues.length) > 0
}, "\u5168\u9009"), /*#__PURE__*/_react.default.createElement(_checkbox.default.Group, {
options: checkOptions,
value: value === null || value === void 0 ? void 0 : value.filteredValues,
onChange: function onChange(v) {
setFilterParams(params.map(function (m) {
if (m.filterKey === filterKey) {
return {
filterKey: filterKey,
filteredValues: v
};
}
return m;
}));
},
style: {
display: "flex",
flexDirection: "column"
}
}));
};
var defaultOptions = {
hierarchyType: "grid",
tooltip: {
content: function content(cell, options) {
var _a;
return (0, _util2.renderTooltipContent)(cell, options, __assign(__assign({}, data === null || data === void 0 ? void 0 : data.schema), {
properties: __spreadArray(__spreadArray([], (_a = data === null || data === void 0 ? void 0 : data.schema) === null || _a === void 0 ? void 0 : _a.properties), data === null || data === void 0 ? void 0 : data.columnProperties)
}), logicform, setLogicform, entityTooltipCardProps, showGoToDetail, showRefDetail, {
percentageConfig: percentageConfig,
setPercentageConfig: setPercentageConfig
});
}
},
showDefaultHeaderActionIcon: true,
headerActionIcons: [{
iconNames: ["ExpandFields"],
belongsCell: "cornerCell",
displayCondition: function displayCondition(meta) {
return (data === null || data === void 0 ? void 0 : data.columnProperties.map(function (d) {
return d.name;
}).includes(meta.value)) && (0, _util2.getObjectExpandProperties)(meta.value, data).length > 0;
},
action: function action(props) {
var _a;
var meta = props.meta,
event = props.event;
var showProperties = (0, _util2.getObjectExpandProperties)(meta.value, data);
meta.spreadsheet.tooltip.show({
position: {
x: event.clientX,
y: event.clientY
},
content: /*#__PURE__*/_react.default.createElement("div", {
style: {
padding: 12,
maxHeight: "50vh",
overflowY: "auto"
}
}, /*#__PURE__*/_react.default.createElement("p", null, "\u52FE\u9009\u9700\u8981\u5C55\u793A\u7684\u5176\u5B83\u5C5E\u6027"), showProperties.length > 0 ? /*#__PURE__*/_react.default.createElement(_checkbox.default.Group, {
style: {
display: "flex",
flexDirection: "column"
},
defaultValue: (_a = expandFields[meta.value]) !== null && _a !== void 0 ? _a : [],
onChange: function onChange(v) {
setExpandFields(function (pre) {
var _a;
return __assign(__assign({}, pre), (_a = {}, _a[meta.value] = v, _a));
});
}
}, showProperties.map(function (d) {
return /*#__PURE__*/_react.default.createElement(_checkbox.default, {
key: d.name,
value: meta.value + "_" + d.name
}, d.name);
})) : /*#__PURE__*/_react.default.createElement(_empty.default, null))
});
}
}],
customSVGIcons: [{
name: "ExpandFields",
svg: plusPng
}, {
name: "Filter",
svg: filterIcon
}],
rowCell: function rowCell(node, s2, headConfig) {
return new CustomRowCell(node, s2, headConfig);
},
cornerCell: function cornerCell(item, spreadsheet, headerConfig) {
return new CustomTableCornelCell(item, spreadsheet, headerConfig, onFilterIconClick);
},
colCell: function colCell(item, spreadsheet, headerConfig) {
spreadsheet.setTheme({
colCell: {
icon: {
margin: {
top: 0,
left: 4,
right: 16,
bottom: 0
}
}
}
});
return new CustomTableColCell(item, spreadsheet, headerConfig, onFilterIconClick);
}
}; // 配置Header
var sheetComponentHeader = {
extra: /*#__PURE__*/_react.default.createElement(_space.default, null, showExport && xlsx && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
title: "\u5BFC\u51FAExcel"
}, /*#__PURE__*/_react.default.createElement(_button.default, {
type: "link",
size: "small",
style: {
padding: 0
},
onClick: function onClick() {
var _a, _b, _c, _d;
if (s2Ref.current) {
// 生成单元格合并信息
var mergeInfo_1 = [];
var rowNodes = s2Ref.current.getRowNodes();
var colNodes = s2Ref.current.getColumnNodes();
var rowsCount_1 = (_b = (_a = s2Ref.current.dataCfg.fields.rows) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0;
var colsCount_1 = (_d = (_c = s2Ref.current.dataCfg.fields.columns) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0;
rowNodes.forEach(function (d, i) {
var childrenLen = getNodeChildrenLen(d.children);
if (childrenLen > 0) {
var leafNode = d.getHeadLeafChild();
var start = {
r: leafNode.rowIndex + (colsCount_1 === 0 ? 1 : rowsCount_1),
c: d.level
};
mergeInfo_1.push({
s: start,
e: {
r: start.r + childrenLen - 1,
c: start.c
}
});
} else if (d.isTotals && !d.isSubTotals) {
var start = {
r: d.rowIndex + (colsCount_1 === 0 ? 1 : rowsCount_1),
c: d.colIndex + 1
};
mergeInfo_1.push({
s: start,
e: {
r: start.r,
c: start.c + rowsCount_1 - 1
}
});
}
});
colNodes.forEach(function (d, i) {
var childrenLen = getNodeChildrenLen(d.children);
if (childrenLen > 1) {
var leafNode = d.getHeadLeafChild();
var start = {
r: d.level,
c: leafNode.colIndex + 1
};
mergeInfo_1.push({
s: start,
e: {
r: start.r,
c: start.c + childrenLen - 1
}
});
} else if (d.isTotals && !d.isSubTotals) {
var start = {
r: d.rowIndex + 1,
c: d.colIndex + 1
};
mergeInfo_1.push({
s: start,
e: {
r: start.r + colsCount_1 - 1,
c: start.c
}
});
}
}); // console.log(mergeInfo);
var text = (0, _s2.copyData)(s2Ref.current, "\t");
var formattedText = (0, _s2.copyData)(s2Ref.current, "\t", true);
(0, _excelExporter.default)(text, formattedText, title, xlsx, mergeInfo_1);
}
}
}, /*#__PURE__*/_react.default.createElement(_icons.DownloadOutlined, null))), showSwitcher && /*#__PURE__*/_react.default.createElement(_s2React.Switcher, {
popover: {
placement: "leftTop"
},
rows: {
selectable: true,
items: ((_e = switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.rows) === null || _e === void 0 ? void 0 : _e.items) || []
},
columns: {
selectable: true,
items: ((_f = switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.columns) === null || _f === void 0 ? void 0 : _f.items) || []
},
values: {
selectable: true,
// selectable: true, // 这个啊，如果把这个更新到data config里面去了。那么状态的同步也很麻烦。除非把selectable也给同步了
items: (switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.values.items) || []
},
onSubmit: function onSubmit(result) {
setSwitcherFields({
rows: result.rows,
columns: result.columns,
values: result.values
});
}
}))
};
if (!showSwitcher && !showExport) {
// header啥组件都没有，那么header不要了
sheetComponentHeader = null;
} // 总计 & 小计
if (dataCfg.data) {
if (data === null || data === void 0 ? void 0 : data.result) {
var totalAndSubTotalData_1 = _totalAndSubTotalData === null || _totalAndSubTotalData === void 0 ? void 0 : _totalAndSubTotalData.map(function (d) {
var dd = __assign({}, d);
percentageInGroupKeys.forEach(function (k) {
dd[k + "(\u7EC4\u5185)"] = 1;
});
return dd;
});
var arr = (_g = data.result) === null || _g === void 0 ? void 0 : _g.map(function (d) {
var dd = __assign({}, d);
percentageInGroupKeys.forEach(function (k) {
var _a, _b, _c, _d, _e;
var baseName = (_b = (_a = data.columnProperties.find(function (p) {
return p.name === k;
}) //@ts-ignore
) === null || _a === void 0 ? void 0 : _a.baseProperty) === null || _b === void 0 ? void 0 : _b.name;
var name = (_c = data.logicform.preds.find(function (f) {
return f.pred === baseName && f.operator === "$sum";
})) === null || _c === void 0 ? void 0 : _c.name;
if (name && ((_d = data.logicform.groupby) === null || _d === void 0 ? void 0 : _d.length) === 2) {
var sum = (_e = totalAndSubTotalData_1.find(function (t) {
var _a, _b;
var match = true;
var g = dataCfg.fields.rows[0];
if (dataCfg.fields.columns.length > 0) {
g = dataCfg.fields.columns[0];
}
if (_typeof(t[g]) === "object" && _typeof(d[g]) === "object") {
match = match && ((_a = t[g]) === null || _a === void 0 ? void 0 : _a._id) === ((_b = d[g]) === null || _b === void 0 ? void 0 : _b._id);
} else {
match = match && t[g] === d[g];
}
return match;
})) === null || _e === void 0 ? void 0 : _e[name];
if (typeof sum === "number") {
dd[k + "(\u7EC4\u5185)"] = d[name] / sum;
}
}
});
return dd;
});
dataCfg.data = __spreadArray([], (0, _util.formatResultName)(__assign(__assign({}, data), {
result: __spreadArray(__spreadArray([], (_h = totalAndSubTotalData_1 || []) === null || _h === void 0 ? void 0 : _h.map(function (m) {
return __assign(__assign({}, m), {
isTotal: true
});
})), arr)
}), '_', Object.entries(expandFields).reduce(function (p, c) {
return __spreadArray(__spreadArray([], p), c[1]);
}, []))); // 根据fields的配置，找出需要显示的维度，把不需要显示的维度的数据给过滤掉
var hideItems_1 = __spreadArray(__spreadArray([], ((_j = switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.rows) === null || _j === void 0 ? void 0 : _j.hideItems) || []), ((_k = switcherFields === null || switcherFields === void 0 ? void 0 : switcherFields.columns) === null || _k === void 0 ? void 0 : _k.hideItems) || []).map(function (h) {
return h.id;
});
dataCfg.data = dataCfg.data.filter(function (i) {
return hideItems_1.every(function (h) {
return !(h in i);
});
} // 每一个hide的维度，都不能在dataItem里面
);
filterDataRef.current = {};
(_l = dataCfg.meta) === null || _l === void 0 ? void 0 : _l.forEach(function (d) {
filterDataRef.current[d.field] = {
data: []
};
});
dataCfg.data = dataCfg.data.map(function (flatted) {
dataCfg.meta.forEach(function (f) {
var _a, _b, _c;
var v = (_a = flatted[f.field]) !== null && _a !== void 0 ? _a : "空值";
if (!((_b = filterDataRef.current[f.field]) === null || _b === void 0 ? void 0 : _b.data.includes(v))) {
(_c = filterDataRef.current[f.field]) === null || _c === void 0 ? void 0 : _c.data.push(v);
}
});
return flatted;
});
var filterParams_1 = getLatestFilterParams();
dataCfg.data = dataCfg.data.filter(function (f) {
if (f) {
if (f.isTotal && !(filterParams_1 === null || filterParams_1 === void 0 ? void 0 : filterParams_1.some(function (s) {
return s.filtered;
}))) {
return true;
}
var match_1 = true;
filterParams_1.filter(function (f) {
return f.showFilter;
}).forEach(function (e) {
var _a;
match_1 = match_1 && e.filteredValues.includes((_a = f[e.filterKey]) !== null && _a !== void 0 ? _a : "空值");
});
return match_1;
}
return false;
});
dataCfg.filterParams = filterParams_1;
} // 如果没数据，那么不显示
if (!_totalAndSubTotalData || _totalAndSubTotalData.length === 0) {
s2Options.totals.row.showGrandTotals = false;
s2Options.totals.row.showSubTotals = false;
}
} // valueInCols配置
if (dataCfg === null || dataCfg === void 0 ? void 0 : dataCfg.fields) {
if (!dataCfg.fields.rows || dataCfg.fields.rows.length === 0) {
dataCfg.fields.valueInCols = false;
} else {
dataCfg.fields.valueInCols = true;
if (data) {
var noRelationGroupby_1 = data.logicform._noRelationGroupby || data.logicform.groupby;
var filteredGroupby = noRelationGroupby_1.slice(1).map(function (i) {
// 要找上一层
var index = noRelationGroupby_1.findIndex(function (groupbyItem) {
return groupbyItem.name === i.name;
});
return noRelationGroupby_1[index - 1].name;
});
s2Options.totals.row.subTotalsDimensions = filteredGroupby; // 会通过行列转换切换的
if (fields.rows.length === 2) {
s2Options.totals.row.subTotalsDimensions = [fields.rows[0]];
}
}
}
}
var offsetHeight = 0;
var getPopPosition = function getPopPosition() {
var _a, _b, _c;
var _d = (filterNode === null || filterNode === void 0 ? void 0 : filterNode.position) || {},
x = _d.x,
y = _d.y;
var _e = (filterNode === null || filterNode === void 0 ? void 0 : filterNode.meta) || {},
cornerType = _e.cornerType,
belongsCell = _e.belongsCell;
var _f = ((_b = (_a = adaptiveRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(".antv-s2-container")) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect()) || {},
containerX = _f.x,
containerY = _f.y;
var top = containerY + y,
left = 0;
if (cornerType) {
left = containerX + x;
} else {
// @ts-ignore
left = containerX + x + ((_c = belongsCell === null || belongsCell === void 0 ? void 0 : belongsCell.headerConfig) === null || _c === void 0 ? void 0 : _c.cornerWidth);
}
return {
top: top,
left: left
};
};
(0, _react.useEffect)(function () {
var _a, _b, _c;
setSwitcherFields({
rows: {
items: ((_a = originFields === null || originFields === void 0 ? void 0 : originFields.rows) === null || _a === void 0 ? void 0 : _a.map(function (d) {
if (d in expandFields) {
return __spreadArray([d], expandFields[d]);
}
return d;
}).flat().map(function (f) {
return {
id: f
};
})) || [],
hideItems: []
},
columns: {
items: ((_b = originFields === null || originFields === void 0 ? void 0 : originFields.columns) === null || _b === void 0 ? void 0 : _b.map(function (d) {
return {
id: d
};
})) || [],
hideItems: []
},
values: {
items: ((_c = originFields === null || originFields === void 0 ? void 0 : originFields.values) === null || _c === void 0 ? void 0 : _c.map(function (d) {
return {
id: d
};
})) || [],
hideItems: []
}
});
}, [originFields, expandFields]);
(0, _react.useEffect)(function () {
onChange === null || onChange === void 0 ? void 0 : onChange(dataCfg);
}, [JSON.stringify(dataCfg)]);
return /*#__PURE__*/_react.default.createElement("div", {
className: "ze-sheet",
style: __assign({
height: height !== null && height !== void 0 ? height : "100%"
}, style)
}, /*#__PURE__*/_react.default.createElement("div", {
style: {
height: "calc(100% - " + offsetHeight + "px)"
},
ref: adaptiveRef
}, /*#__PURE__*/_react.default.createElement(_s2React.SheetComponent, {
adaptive: {
width: true,
height: true,
getContainer: function getContainer() {
return adaptiveRef.current;
}
},
dataCfg: dataCfg,
options: __assign(__assign({}, defaultOptions), s2Options),
themeCfg: {
theme: {
cornerCell: {
icon: {
size: 16,
fill: iconColor
},
text: {
textAlign: "left"
}
},
colCell: {
icon: {
size: 16,
fill: iconColor
}
}
}
},
sheetType: sheetType,
header: sheetComponentHeader,
ref: s2Ref,
onRowCellClick: function onRowCellClick(_a) {
var rowCell = _a.target;
var _b = rowCell.getMeta(),
isTotals = _b.isTotals,
value = _b.value,
query = _b.query,
field = _b.field,
spreadsheet = _b.spreadsheet;
if (isTotals) {
return;
}
var rowData = spreadsheet.dataCfg.data.find(function (d) {
return d[field] === value;
});
if (rowData) {
onRow === null || onRow === void 0 ? void 0 : onRow(rowData["@rawData"]);
} else {
onRow === null || onRow === void 0 ? void 0 : onRow(__assign({
_id: value
}, query));
}
},
onDataCellClick: function onDataCellClick(_a) {
var dataCell = _a.target;
var rowData = dataCell.getMeta().data;
onRow === null || onRow === void 0 ? void 0 : onRow(rowData["@rawData"]);
}
})), /*#__PURE__*/_react.default.createElement(_popover.default, {
open: filterOpen,
content: renderFilterPopContent(),
placement: "bottom",
key: (_m = filterNode === null || filterNode === void 0 ? void 0 : filterNode.meta) === null || _m === void 0 ? void 0 : _m.field,
onOpenChange: setFilterOpen,
trigger: ["click"]
}, filterNode && /*#__PURE__*/_react.default.createElement("div", {
style: __assign({
width: 10,
height: 10,
background: "red",
position: "fixed",
opacity: 0,
pointerEvents: "none"
}, getPopPosition())
})));
};
var _default = ZESheet;
exports.default = _default;