搬部分业务无关的抽象组件到front里
This commit is contained in:
parent
a4f863cdea
commit
8c60e5c149
|
|
@ -1,22 +0,0 @@
|
|||
import React from 'react';
|
||||
import './web.module.less';
|
||||
declare type Item = {
|
||||
value: string;
|
||||
icon: React.ReactNode;
|
||||
text: React.ReactNode;
|
||||
count?: number;
|
||||
};
|
||||
declare type TabBarProps = {
|
||||
style?: React.CSSProperties;
|
||||
className?: string;
|
||||
iconClassName?: string;
|
||||
textClassName?: string;
|
||||
children?: React.ReactNode;
|
||||
list: Array<Item>;
|
||||
onChange?: (value: string, event?: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
|
||||
fixed?: boolean;
|
||||
bordered?: boolean;
|
||||
value?: string;
|
||||
};
|
||||
declare const _default: React.MemoExoticComponent<(props: TabBarProps) => JSX.Element>;
|
||||
export default _default;
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var react_1 = require("react");
|
||||
var classnames_1 = tslib_1.__importDefault(require("classnames"));
|
||||
require("./web.module.less");
|
||||
var prefixCls = 'oak';
|
||||
exports.default = (0, react_1.memo)(function (props) {
|
||||
var _a;
|
||||
var style = props.style, className = props.className, list = props.list, onChange = props.onChange, iconClassName = props.iconClassName, textClassName = props.textClassName, _b = props.fixed, fixed = _b === void 0 ? true : _b, _c = props.bordered, bordered = _c === void 0 ? false : _c, _d = props.value, value = _d === void 0 ? '' : _d;
|
||||
var length = list === null || list === void 0 ? void 0 : list.length;
|
||||
return ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: (0, classnames_1.default)("".concat(prefixCls, "-tabBar"), (_a = {},
|
||||
_a["".concat(prefixCls, "-tabBar--fixed")] = fixed,
|
||||
_a["".concat(prefixCls, "-tabBar--bordered")] = bordered,
|
||||
_a)) }, { children: list === null || list === void 0 ? void 0 : list.map(function (ele, index) {
|
||||
var _a;
|
||||
return ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: (0, classnames_1.default)(className, "".concat(prefixCls, "-tabBar-item"), (_a = {},
|
||||
_a["".concat(prefixCls, "-tabBar-item-column-").concat(length)] = length,
|
||||
_a["".concat(prefixCls, "-tabBar-item-checked")] = value === ele.value,
|
||||
_a)), style: style, onClick: onChange
|
||||
? function (event) { return onChange(ele.value, event); }
|
||||
: undefined }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: (0, classnames_1.default)("".concat(prefixCls, "-tabBar-item-icon"), iconClassName) }, { children: typeof ele.icon === 'string' ? ((0, jsx_runtime_1.jsx)("img", { className: (0, classnames_1.default)("".concat(prefixCls, "-tabBar-item-image"), iconClassName), src: ele.icon })) : (ele.icon) })), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: (0, classnames_1.default)("".concat(prefixCls, "-tabBar-item-text"), textClassName) }, { children: ele.text }))] }), index));
|
||||
}) })));
|
||||
});
|
||||
|
|
@ -1,105 +0,0 @@
|
|||
.oak-tabBar {
|
||||
flex-wrap: nowrap;
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
|
||||
height: 48px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
&--fixed {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
&--bordered {
|
||||
::before {
|
||||
border-top: 1px solid #e7e7e7;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
::after {
|
||||
border-bottom: 1px solid #e7e7e7;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
color: #0009;
|
||||
|
||||
::after {
|
||||
border-left: 1px solid #e7e7e7;
|
||||
}
|
||||
|
||||
:first-child::before {
|
||||
border: unset;
|
||||
}
|
||||
|
||||
&-column {
|
||||
&-1 {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
&-2 {
|
||||
flex-basis: 50%;
|
||||
}
|
||||
|
||||
&-3 {
|
||||
flex-basis: 33.33%;
|
||||
}
|
||||
|
||||
&-4 {
|
||||
flex-basis: 25%;
|
||||
}
|
||||
|
||||
&-5 {
|
||||
flex-basis: 20%;
|
||||
}
|
||||
|
||||
&-6 {
|
||||
flex-basis: 16.66%;
|
||||
}
|
||||
|
||||
&-7 {
|
||||
flex-basis: 14.28%;
|
||||
}
|
||||
|
||||
&-8 {
|
||||
flex-basis: 12.5%;
|
||||
}
|
||||
}
|
||||
|
||||
&-checked {
|
||||
color: var(--oak-color-primary);
|
||||
}
|
||||
|
||||
&-image {
|
||||
display: block;
|
||||
height: 24px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&-icon {}
|
||||
|
||||
&-text {
|
||||
font-size: 10px;
|
||||
line-height: 18px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
/// <reference types="react" />
|
||||
declare const _default: (props: import("oak-frontend-base").ReactComponentProps<true, {
|
||||
entity: StringConstructor;
|
||||
projection: ObjectConstructor;
|
||||
multiple: BooleanConstructor;
|
||||
onSelect: FunctionConstructor;
|
||||
}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
||||
export default _default;
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.default = OakComponent({
|
||||
entity: function () {
|
||||
var entity = this.props.entity;
|
||||
return entity;
|
||||
},
|
||||
projection: function () {
|
||||
var projection = this.props.projection;
|
||||
return projection;
|
||||
},
|
||||
formData: function (_a) {
|
||||
var rows = _a.data;
|
||||
return {
|
||||
rows: rows,
|
||||
};
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
projection: Object,
|
||||
multiple: Boolean,
|
||||
onSelect: Function,
|
||||
},
|
||||
methods: {},
|
||||
});
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
export default function Render(props: WebComponentProps<EntityDict, keyof EntityDict, false, {
|
||||
entity: string;
|
||||
rows: EntityDict[keyof EntityDict]['Schema'][];
|
||||
projection: Record<string, any>;
|
||||
onSelect: (rows: EntityDict[keyof EntityDict]['Schema'][]) => void;
|
||||
multiple: boolean;
|
||||
}, {}>): JSX.Element;
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
function Render(props) {
|
||||
var _a = props.data, entity = _a.entity, oakFullpath = _a.oakFullpath, oakLoading = _a.oakLoading, rows = _a.rows, projection = _a.projection, onSelect = _a.onSelect, _b = _a.multiple, multiple = _b === void 0 ? false : _b;
|
||||
var t = props.methods.t;
|
||||
var columns = Object.keys(projection)
|
||||
.filter(function (ele) { return ele !== 'id'; })
|
||||
.map(function (ele) { return ({
|
||||
dataIndex: ele,
|
||||
title: t("".concat(entity, ":attr.").concat(ele)),
|
||||
}); });
|
||||
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Table, { loading: oakLoading, dataSource: rows, rowKey: "id", rowSelection: {
|
||||
type: multiple ? 'checkbox' : 'radio',
|
||||
// onSelect: (record) => {
|
||||
// onSelect(record);
|
||||
// },
|
||||
onChange: function (selectedRowKeys, selectedRows, info) {
|
||||
onSelect(selectedRows);
|
||||
},
|
||||
}, onRow: !multiple ? function (record) {
|
||||
return {
|
||||
onClick: function (event) {
|
||||
onSelect([record]);
|
||||
}, // 点击行
|
||||
};
|
||||
} : undefined, columns: columns }) }));
|
||||
}
|
||||
exports.default = Render;
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
/// <reference types="react" />
|
||||
declare const _default: (props: import("oak-frontend-base").ReactComponentProps<true, {
|
||||
entity: StringConstructor;
|
||||
column: ObjectConstructor;
|
||||
formItem: BooleanConstructor;
|
||||
}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
||||
export default _default;
|
||||
|
|
@ -1,88 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var relation_1 = require("oak-domain/lib/store/relation");
|
||||
var utils_1 = require("../query/utils");
|
||||
exports.default = OakComponent({
|
||||
entity: function () {
|
||||
var entity = this.props.entity;
|
||||
return entity;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
column: Object,
|
||||
formItem: Boolean,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilter: function (name) {
|
||||
if (this.state.oakFullpath) {
|
||||
var filter = this.getFilterByName(name);
|
||||
return filter;
|
||||
}
|
||||
},
|
||||
getRefByAttr: function (entity, field) {
|
||||
if (!this.state.oakFullpath) {
|
||||
return;
|
||||
}
|
||||
var dataSchema = this.features.cache.getSchema();
|
||||
var attrs = field.split('.');
|
||||
var idx = 0;
|
||||
var _entity = entity;
|
||||
var attr;
|
||||
var attrType;
|
||||
var attribute;
|
||||
var entityI18n = entity;
|
||||
var attrI18n;
|
||||
while (idx <= attrs.length - 1) {
|
||||
attr = attrs[idx];
|
||||
attrI18n = attr;
|
||||
var relation = (0, relation_1.judgeRelation)(dataSchema, _entity, attr);
|
||||
if (relation === 1) {
|
||||
var attributes = (0, utils_1.getAttributes)(dataSchema[_entity].attributes);
|
||||
attribute = attributes[attr];
|
||||
attrType = attribute.type;
|
||||
if (attrType === 'ref') {
|
||||
attrI18n = attribute.ref;
|
||||
}
|
||||
}
|
||||
else if (relation === 2) {
|
||||
// entity entityId
|
||||
var ref = attr;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
else if (typeof relation === 'string') {
|
||||
var ref = relation;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
idx++;
|
||||
}
|
||||
return {
|
||||
entity: _entity,
|
||||
attr: attr,
|
||||
attrType: attrType,
|
||||
entityI18n: entityI18n,
|
||||
attrI18n: attrI18n,
|
||||
attribute: attribute,
|
||||
};
|
||||
},
|
||||
getEntityData: function (entity, ids) {
|
||||
var _a;
|
||||
var column = this.props.column;
|
||||
var projection = ((_a = column === null || column === void 0 ? void 0 : column.refProps) === null || _a === void 0 ? void 0 : _a.projection) || { id: 1, name: 1 };
|
||||
var entityData = this.features.cache.get(entity, {
|
||||
data: projection,
|
||||
filter: {
|
||||
id: {
|
||||
$in: ids,
|
||||
},
|
||||
},
|
||||
}, true);
|
||||
return entityData;
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
{
|
||||
"placeholder": {
|
||||
"input": "请输入",
|
||||
"select": "请选择"
|
||||
},
|
||||
"attr": {
|
||||
"id": "编号",
|
||||
"$$createAt$$": "创建时间",
|
||||
"$$updateAt$$": "更新时间",
|
||||
"$$deleteAt$$": "删除时间",
|
||||
"$$seq$$": "序号"
|
||||
},
|
||||
"closed": "关闭",
|
||||
"select": "请选择"
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { ColumnProps } from '../query/column';
|
||||
export default function Render(props: WebComponentProps<EntityDict, keyof EntityDict, false, {
|
||||
entity: keyof EntityDict;
|
||||
column: ColumnProps;
|
||||
onSearch: () => void;
|
||||
formItem: boolean;
|
||||
}, {
|
||||
getNamedFilter: (name: string) => Record<string, any>;
|
||||
getRefByAttr: (entity: keyof EntityDict, attr: string) => {
|
||||
entity: keyof EntityDict;
|
||||
attr: string;
|
||||
attrType: string;
|
||||
entityI18n: keyof EntityDict;
|
||||
attrI18n: string;
|
||||
attribute: Record<string, any>;
|
||||
};
|
||||
getEntityData: (entity: keyof EntityDict, ids: string[]) => EntityDict[keyof EntityDict]['Schema'][];
|
||||
}>): JSX.Element | null;
|
||||
|
|
@ -1,112 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var react_1 = require("react");
|
||||
var antd_1 = require("antd");
|
||||
var icons_1 = require("@ant-design/icons");
|
||||
var utils_1 = require("../query/utils");
|
||||
var entityPicker_1 = tslib_1.__importDefault(require("../entityPicker"));
|
||||
var lodash_1 = require("oak-domain/lib/utils/lodash");
|
||||
var assert_1 = require("oak-domain/lib/utils/assert");
|
||||
function Render(props) {
|
||||
var _a = props.data, onSearch = _a.onSearch, entity = _a.entity, oakFullpath = _a.oakFullpath, _b = _a.formItem, formItem = _b === void 0 ? true : _b, column = _a.column;
|
||||
var _c = props.methods, t = _c.t, refresh = _c.refresh, getNamedFilter = _c.getNamedFilter, removeNamedFilterByName = _c.removeNamedFilterByName, addNamedFilter = _c.addNamedFilter, getRefByAttr = _c.getRefByAttr, setMessage = _c.setMessage, getEntityData = _c.getEntityData;
|
||||
var _d = tslib_1.__read((0, react_1.useState)(false), 2), open = _d[0], setOpen = _d[1];
|
||||
var _e = tslib_1.__read((0, react_1.useState)([]), 2), selectRows = _e[0], setSelectRows = _e[1];
|
||||
var op = column.op, attr = column.attr, label = column.label, _f = column.transformValue, transformValue = _f === void 0 ? function (column, filter) { return (0, lodash_1.get)(filter, (0, utils_1.getOp)(column), ''); } : _f, _g = column.transformFilter, transformFilter = _g === void 0 ? function (column, value) { return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), value); } : _g, placeholder = column.placeholder, refProps = column.refProps;
|
||||
var name = (0, utils_1.getFilterName)(column);
|
||||
var filter = getNamedFilter(name);
|
||||
var params = getRefByAttr(entity, attr);
|
||||
if (!params) {
|
||||
return null;
|
||||
}
|
||||
var _value = transformValue(column, filter);
|
||||
var entity2 = params.entity, attr2 = params.attr, attrType = params.attrType, entityI18n = params.entityI18n, attrI18n = params.attrI18n, attribute = params.attribute;
|
||||
if (attribute.type !== 'ref') {
|
||||
(0, assert_1.assert)(false, "attr\u4E3A".concat(attr, "\uFF0C\u7C7B\u578B\u3010").concat(attribute.type, "\u3011\u4E0D\u662Fref"));
|
||||
return null;
|
||||
}
|
||||
var _label = '';
|
||||
if (label && label.indexOf(':') === -1) {
|
||||
_label = label;
|
||||
}
|
||||
else {
|
||||
_label = t("".concat(entityI18n, ":attr.").concat(attrI18n));
|
||||
}
|
||||
var inputKey = (refProps === null || refProps === void 0 ? void 0 : refProps.inputKey) || 'name';
|
||||
var projection = (refProps === null || refProps === void 0 ? void 0 : refProps.projection) || { id: 1, name: 1 };
|
||||
var modalProps = {};
|
||||
var rows = [];
|
||||
var multiple = !!op && ['$in', '$nin'].includes(op);
|
||||
if (!multiple) {
|
||||
modalProps = {
|
||||
footer: false,
|
||||
};
|
||||
rows = _value
|
||||
? getEntityData(attribute.ref, [_value])
|
||||
: [];
|
||||
}
|
||||
else {
|
||||
rows = _value
|
||||
? getEntityData(attribute.ref, _value)
|
||||
: [];
|
||||
}
|
||||
var _value2;
|
||||
if (rows.length > 0) {
|
||||
_value2 = rows.map(function (ele) { return ele[inputKey]; }).join('、');
|
||||
}
|
||||
var deleteFilter = function (interval) {
|
||||
removeNamedFilterByName(name);
|
||||
};
|
||||
var setFilterAndResetFilter = function (value, getFilter) {
|
||||
if (value === '' ||
|
||||
value === undefined ||
|
||||
value === null ||
|
||||
(value === null || value === void 0 ? void 0 : value.length) === 0) {
|
||||
removeNamedFilterByName(name);
|
||||
return;
|
||||
}
|
||||
var filter2 = typeof getFilter === 'function'
|
||||
? getFilter()
|
||||
: transformFilter(column, value);
|
||||
addNamedFilter({
|
||||
filter: filter2,
|
||||
'#name': name,
|
||||
});
|
||||
};
|
||||
var V = ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.select'), onClick: function () {
|
||||
setOpen(true);
|
||||
},
|
||||
// allowClear
|
||||
// onChange={() => {
|
||||
// deleteFilter();
|
||||
// }}
|
||||
value: _value2, readOnly: true, suffix: _value && ((0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ onClick: function () {
|
||||
deleteFilter();
|
||||
setSelectRows([]);
|
||||
} }, { children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { size: 14 }) }))) }) }));
|
||||
if (formItem) {
|
||||
V = (0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: _label }, { children: V }));
|
||||
}
|
||||
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [V, (0, jsx_runtime_1.jsx)(antd_1.Modal, tslib_1.__assign({ title: t('select'), centered: true, open: open, onOk: function () {
|
||||
if (selectRows.length === 0) {
|
||||
setMessage({
|
||||
type: 'warning',
|
||||
content: t('select'),
|
||||
});
|
||||
return;
|
||||
}
|
||||
var ids = selectRows.map(function (ele) { return ele.id; });
|
||||
setFilterAndResetFilter(ids);
|
||||
setOpen(false);
|
||||
}, cancelText: t('closed'), onCancel: function () { return setOpen(false); }, width: "50%", destroyOnClose: true }, modalProps, { children: (0, jsx_runtime_1.jsx)(entityPicker_1.default, { multiple: multiple, oakAutoUnmount: true, projection: projection, entity: attribute.ref, oakPath: "$foreignKeyFilter-entity/picker-".concat(entity), onSelect: function (rows) {
|
||||
setSelectRows(rows);
|
||||
if (!multiple) {
|
||||
var ids = rows.map(function (ele) { return ele.id; });
|
||||
setFilterAndResetFilter(ids[0]);
|
||||
setOpen(false);
|
||||
}
|
||||
} }) }))] }));
|
||||
}
|
||||
exports.default = Render;
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
/// <reference types="react" />
|
||||
declare const _default: (props: import("oak-frontend-base").ReactComponentProps<true, {
|
||||
entity: StringConstructor;
|
||||
column: ObjectConstructor;
|
||||
}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
||||
export default _default;
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var relation_1 = require("oak-domain/lib/store/relation");
|
||||
var utils_1 = require("./utils");
|
||||
exports.default = OakComponent({
|
||||
entity: function () {
|
||||
var entity = this.props.entity;
|
||||
return entity;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
column: Object,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilter: function (name) {
|
||||
if (this.state.oakFullpath) {
|
||||
var filter = this.getFilterByName(name);
|
||||
return filter;
|
||||
}
|
||||
},
|
||||
getRefByAttr: function (entity, field) {
|
||||
if (!this.state.oakFullpath) {
|
||||
return;
|
||||
}
|
||||
var dataSchema = this.features.cache.getSchema();
|
||||
var attrs = field.split('.');
|
||||
var idx = 0;
|
||||
var _entity = entity;
|
||||
var attr;
|
||||
var attrType;
|
||||
var attribute;
|
||||
var entityI18n = entity;
|
||||
var attrI18n;
|
||||
while (idx <= attrs.length - 1) {
|
||||
attr = attrs[idx];
|
||||
attrI18n = attr;
|
||||
if (attr.startsWith('$text')) {
|
||||
// 全文的话
|
||||
attrType = '$text';
|
||||
}
|
||||
else {
|
||||
var relation = (0, relation_1.judgeRelation)(dataSchema, _entity, attr);
|
||||
if (relation === 1) {
|
||||
var attributes = (0, utils_1.getAttributes)(dataSchema[_entity].attributes);
|
||||
attribute = attributes[attr];
|
||||
attrType = attribute.type;
|
||||
if (attrType === 'ref') {
|
||||
attrI18n = attribute.ref;
|
||||
}
|
||||
}
|
||||
else if (relation === 2) {
|
||||
// entity entityId
|
||||
var ref = attr;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
else if (typeof relation === 'string') {
|
||||
var ref = relation;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
}
|
||||
idx++;
|
||||
}
|
||||
return {
|
||||
entity: _entity,
|
||||
attr: attr,
|
||||
attrType: attrType,
|
||||
entityI18n: entityI18n,
|
||||
attrI18n: attrI18n,
|
||||
attribute: attribute,
|
||||
};
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
{
|
||||
"placeholder": {
|
||||
"input": "请输入",
|
||||
"select": "请选择"
|
||||
},
|
||||
"attr": {
|
||||
"id": "编号",
|
||||
"$$createAt$$": "创建时间",
|
||||
"$$updateAt$$": "更新时间",
|
||||
"$$deleteAt$$": "删除时间",
|
||||
"$$seq$$": "序号",
|
||||
"$text": "全文检索"
|
||||
},
|
||||
"tip": {
|
||||
"yes": "是",
|
||||
"no": "否",
|
||||
"unselected": "未选"
|
||||
},
|
||||
"op": {
|
||||
"$includes": "包含"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
import { ColumnProps, Ops } from './column';
|
||||
export declare function getOp(column: ColumnProps): string;
|
||||
export declare function getOp2(column: ColumnProps, op: Ops): string;
|
||||
export declare function getFilterName(column: ColumnProps): string;
|
||||
export declare function getAttributes(attributes: Record<string, any>): Record<string, any> & {
|
||||
id: {
|
||||
type: string;
|
||||
};
|
||||
$$createAt$$: {
|
||||
type: string;
|
||||
};
|
||||
$$updateAt$$: {
|
||||
type: string;
|
||||
};
|
||||
$$deleteAt$$: {
|
||||
type: string;
|
||||
};
|
||||
$$seq$$: {
|
||||
type: string;
|
||||
};
|
||||
};
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.getAttributes = exports.getFilterName = exports.getOp2 = exports.getOp = void 0;
|
||||
function getOp(column) {
|
||||
return "".concat(column.attr).concat(column.op ? ".".concat(column.op) : '');
|
||||
}
|
||||
exports.getOp = getOp;
|
||||
function getOp2(column, op) {
|
||||
return "".concat(column.attr).concat(column.op || op ? ".".concat(column.op || op) : '');
|
||||
}
|
||||
exports.getOp2 = getOp2;
|
||||
function getFilterName(column) {
|
||||
return column.filterName || getOp(column);
|
||||
}
|
||||
exports.getFilterName = getFilterName;
|
||||
function getAttributes(attributes) {
|
||||
return Object.assign({}, attributes, {
|
||||
id: {
|
||||
type: 'char',
|
||||
},
|
||||
$$createAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$updateAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$deleteAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$seq$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
});
|
||||
}
|
||||
exports.getAttributes = getAttributes;
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { ColumnProps } from './column';
|
||||
export default function Render(props: WebComponentProps<EntityDict, keyof EntityDict, false, {
|
||||
entity: keyof EntityDict;
|
||||
column: ColumnProps;
|
||||
searchValue: string;
|
||||
onSearch: () => void;
|
||||
}, {
|
||||
getNamedFilter: (name: string) => Record<string, any>;
|
||||
getRefByAttr: (entity: keyof EntityDict, attr: string) => {
|
||||
entity: keyof EntityDict;
|
||||
attr: string;
|
||||
attrType: string;
|
||||
entityI18n: keyof EntityDict;
|
||||
attrI18n: string;
|
||||
attribute: Record<string, any>;
|
||||
};
|
||||
}>): JSX.Element | null;
|
||||
|
|
@ -1,279 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
var money_1 = require("oak-domain/lib/utils/money");
|
||||
var Entity_1 = require("oak-domain/lib/types/Entity");
|
||||
var dayjs_1 = tslib_1.__importDefault(require("dayjs"));
|
||||
var weekday_1 = tslib_1.__importDefault(require("dayjs/plugin/weekday"));
|
||||
var localeData_1 = tslib_1.__importDefault(require("dayjs/plugin/localeData"));
|
||||
dayjs_1.default.extend(weekday_1.default);
|
||||
dayjs_1.default.extend(localeData_1.default);
|
||||
var lodash_1 = require("oak-domain/lib/utils/lodash");
|
||||
var assert_1 = require("oak-domain/lib/utils/assert");
|
||||
var utils_1 = require("./utils");
|
||||
var foreignKeyFilter_1 = tslib_1.__importDefault(require("../foreignKeyFilter"));
|
||||
function Render(props) {
|
||||
var _a = props.data, entity = _a.entity, column = _a.column, oakFullpath = _a.oakFullpath;
|
||||
var _b = props.methods, t = _b.t, addNamedFilter = _b.addNamedFilter, removeNamedFilterByName = _b.removeNamedFilterByName, refresh = _b.refresh, getNamedFilter = _b.getNamedFilter, getRefByAttr = _b.getRefByAttr;
|
||||
var name = (0, utils_1.getFilterName)(column);
|
||||
var filter = getNamedFilter(name);
|
||||
var _c = column.type, type = _c === void 0 ? 'text' : _c, op = column.op, attr = column.attr, label = column.label, _d = column.transformValue, transformValue = _d === void 0 ? function (column, filter) { return (0, lodash_1.get)(filter, (0, utils_1.getOp)(column), ''); } : _d, _e = column.transformFilter, transformFilter = _e === void 0 ? function (column, value) { return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), value); } : _e, placeholder = column.placeholder;
|
||||
var params = getRefByAttr(entity, attr);
|
||||
if (!params) {
|
||||
return null;
|
||||
}
|
||||
var entity2 = params.entity, attr2 = params.attr, attrType = params.attrType, entityI18n = params.entityI18n, attrI18n = params.attrI18n, attribute = params.attribute;
|
||||
var _label = '';
|
||||
if (label && label.indexOf(':') === -1) {
|
||||
_label = label;
|
||||
}
|
||||
else if (['$text'].includes(attr2)) {
|
||||
_label = t("attr.".concat(attr2));
|
||||
}
|
||||
else if (Entity_1.initinctiveAttributes.includes(attr2)) {
|
||||
_label = t("attr.".concat(attr2));
|
||||
}
|
||||
else {
|
||||
_label = t("".concat(entityI18n, ":attr.").concat(attrI18n));
|
||||
}
|
||||
var deleteFilter = function (interval) {
|
||||
removeNamedFilterByName(name);
|
||||
};
|
||||
var setFilterAndResetFilter = function (value, getFilter) {
|
||||
if (value === '' ||
|
||||
value === undefined ||
|
||||
value === null ||
|
||||
(value === null || value === void 0 ? void 0 : value.length) === 0) {
|
||||
removeNamedFilterByName(name);
|
||||
return;
|
||||
}
|
||||
var filter2 = typeof getFilter === 'function'
|
||||
? getFilter()
|
||||
: transformFilter(column, value);
|
||||
addNamedFilter({
|
||||
filter: filter2,
|
||||
'#name': name,
|
||||
});
|
||||
};
|
||||
var V;
|
||||
if (attrType === '$text') {
|
||||
var ops = ['$search'];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
var _f = column.transformFilter, transformFilter_1 = _f === void 0 ? function (column, value) {
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp2)(column, '$search'), value);
|
||||
} : _f, _g = column.transformValue, transformValue_1 = _g === void 0 ? function (column, filter) { return (0, lodash_1.get)(filter, (0, utils_1.getOp2)(column, '$search'), ''); } : _g;
|
||||
var _value_1 = transformValue_1(column, filter);
|
||||
return ((0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: _label }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.input'), value: _value_1, onChange: function (e) {
|
||||
var val = e.target.value;
|
||||
setFilterAndResetFilter(val, function () {
|
||||
return transformFilter_1(column, val);
|
||||
});
|
||||
}, allowClear: true, onPressEnter: function () { } }) }) })));
|
||||
}
|
||||
var _value = transformValue(column, filter);
|
||||
switch (attrType) {
|
||||
case 'money': {
|
||||
var ops = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
var moneyVal_1 = _value ? (0, money_1.ToYuan)(_value) : '';
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.input'), value: moneyVal_1, onChange: function (e) {
|
||||
var val = e.target.value;
|
||||
var val2 = /^(-?[1-9]\d*(\.\d*[1-9])?)|(-?0\.\d*[1-9])$/.test(val) ? (0, money_1.ToCent)(Number(val)) : moneyVal_1;
|
||||
setFilterAndResetFilter(val2);
|
||||
}, allowClear: true, onPressEnter: function () { } }));
|
||||
break;
|
||||
}
|
||||
case 'float': {
|
||||
var ops = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.input'), value: _value, onChange: function (e) {
|
||||
var val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}, allowClear: true, onPressEnter: function () { } }));
|
||||
break;
|
||||
}
|
||||
case 'integer':
|
||||
case 'int': {
|
||||
var ops = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.input'), value: _value, onChange: function (e) {
|
||||
var val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}, allowClear: true, onPressEnter: function () { } }));
|
||||
break;
|
||||
}
|
||||
case 'char':
|
||||
case 'varchar': {
|
||||
var ops = [
|
||||
'$eq',
|
||||
'$ne',
|
||||
'$endsWith',
|
||||
'$includes',
|
||||
'$startsWith',
|
||||
];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Input, { placeholder: placeholder || t('placeholder.input'), value: _value, onChange: function (e) {
|
||||
var val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}, allowClear: true, onPressEnter: function () { } }));
|
||||
break;
|
||||
}
|
||||
case 'boolean': {
|
||||
var text2 = void 0;
|
||||
switch (_value) {
|
||||
case true: {
|
||||
text2 = t('tip.yes');
|
||||
break;
|
||||
}
|
||||
case false: {
|
||||
text2 = t('tip.no');
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
text2 = t('tip.unselected');
|
||||
break;
|
||||
}
|
||||
}
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ onClick: function () {
|
||||
var val;
|
||||
if (_value === true) {
|
||||
val = false;
|
||||
}
|
||||
else if (_value === false) {
|
||||
val = '';
|
||||
}
|
||||
else {
|
||||
val = true;
|
||||
}
|
||||
setFilterAndResetFilter(val);
|
||||
} }, { children: text2 })));
|
||||
break;
|
||||
}
|
||||
case 'enum': {
|
||||
var ops = ['$in', '$nin', '$eq', '$ne'];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
var enumeration = attribute === null || attribute === void 0 ? void 0 : attribute.enumeration;
|
||||
var selectProps = column.selectProps;
|
||||
var _h = selectProps || {}, options = _h.options, _j = _h.transformInOption, transformInOption = _j === void 0 ? function (option) { return (typeof option === 'object' ? option.value : option); } : _j, // 根据
|
||||
_k = _h.transformOutOption, // 根据
|
||||
transformOutOption = _k === void 0 ? function (option) { return (typeof option === 'object' ? option.label : option); } : _k;
|
||||
var options2 = options ||
|
||||
(enumeration === null || enumeration === void 0 ? void 0 : enumeration.map(function (ele) { return ({
|
||||
label: t("".concat(entityI18n, ":v.").concat(attrI18n, ".").concat(ele)),
|
||||
value: ele,
|
||||
}); }));
|
||||
if (op && ['$in', '$nin'].includes(op)) {
|
||||
var _l = column.transformValue, transformValue_2 = _l === void 0 ? function (column, filter) {
|
||||
return (0, lodash_1.get)(filter, (0, utils_1.getOp)(column), []);
|
||||
} : _l;
|
||||
var selectValue = transformValue_2(column, filter);
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Select, { mode: "multiple", allowClear: true, placeholder: placeholder || t('placeholder.select'), value: selectValue, onChange: function (value) {
|
||||
setFilterAndResetFilter(value);
|
||||
}, options: (options2 === null || options2 === void 0 ? void 0 : options2.length) > 0 ? options2 : [], onClear: function () {
|
||||
deleteFilter();
|
||||
} }));
|
||||
}
|
||||
else {
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.Select, { allowClear: true, placeholder: placeholder || t('placeholder.select'), value: _value, onChange: function (value) {
|
||||
setFilterAndResetFilter(value);
|
||||
}, options: (options2 === null || options2 === void 0 ? void 0 : options2.length) > 0 ? options2 : [], onClear: function () {
|
||||
deleteFilter();
|
||||
} }));
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'datetime': {
|
||||
var dateProps = column.dateProps;
|
||||
var _m = dateProps || {}, _o = _m.range, range = _o === void 0 ? false : _o, _p = _m.showTime, showTime = _p === void 0 ? false : _p;
|
||||
var unitOfTime_1 = 'day';
|
||||
if (range) {
|
||||
var ops = ['$between'];
|
||||
(0, assert_1.assert)(op, '选择时间范围，算子必须传入');
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
var _q = column.transformValue, transformValue_3 = _q === void 0 ? function (column, filter) {
|
||||
return (0, lodash_1.get)(filter, "".concat((0, utils_1.getOp)(column)), []);
|
||||
} : _q, _r = column.transformFilter, transformFilter_2 = _r === void 0 ? function (column, value) {
|
||||
var startTime = (0, dayjs_1.default)(value[0])
|
||||
.startOf(unitOfTime_1)
|
||||
.valueOf();
|
||||
var endTime = (0, dayjs_1.default)(value[1])
|
||||
.endOf(unitOfTime_1)
|
||||
.valueOf();
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), [startTime, endTime]);
|
||||
} : _r;
|
||||
var dateValues = transformValue_3(column, filter);
|
||||
var _s = tslib_1.__read(dateValues, 2), startTime = _s[0], endTIme = _s[1];
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.DatePicker.RangePicker, { showTime: showTime, value: [
|
||||
startTime ? (0, dayjs_1.default)(startTime) : '',
|
||||
endTIme ? (0, dayjs_1.default)(endTIme) : '',
|
||||
], onChange: function (dates, dateStrings) {
|
||||
setFilterAndResetFilter(dates, function () {
|
||||
return transformFilter_2(column, dates);
|
||||
});
|
||||
} }));
|
||||
}
|
||||
else {
|
||||
var ops = ['$between', '$gt', '$gte', '$lt', '$lte'];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
var _t = column.transformFilter, transformFilter_3 = _t === void 0 ? function (column, value) {
|
||||
var startTime = (0, dayjs_1.default)(value)
|
||||
.startOf(unitOfTime_1)
|
||||
.valueOf();
|
||||
var endTime = (0, dayjs_1.default)(value)
|
||||
.endOf(unitOfTime_1)
|
||||
.valueOf();
|
||||
if (column.op === '$between') {
|
||||
var values2 = [startTime, endTime];
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), values2);
|
||||
}
|
||||
if (column.op === '$gt' || column.op === '$gte') {
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), startTime);
|
||||
}
|
||||
if (column.op === '$lt' || column.op === '$lte') {
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), endTime);
|
||||
}
|
||||
return (0, lodash_1.set)({}, (0, utils_1.getOp)(column), (0, dayjs_1.default)(value).valueOf());
|
||||
} : _t, _u = column.transformValue, transformValue_4 = _u === void 0 ? function (column, filter) {
|
||||
if (column.op === '$between') {
|
||||
return (0, lodash_1.get)(filter, "".concat((0, utils_1.getOp)(column), ".0"), null);
|
||||
}
|
||||
return (0, lodash_1.get)(filter, (0, utils_1.getOp)(column), null);
|
||||
} : _u;
|
||||
var dateValue = transformValue_4(column, filter);
|
||||
V = ((0, jsx_runtime_1.jsx)(antd_1.DatePicker, { format: "YYYY-MM-DD", showTime: showTime, value: dateValue ? (0, dayjs_1.default)(dateValue) : null, onChange: function (date, dateString) {
|
||||
setFilterAndResetFilter(date, function () {
|
||||
return transformFilter_3(column, date);
|
||||
});
|
||||
} }));
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'ref': {
|
||||
var ops = ['$in', '$nin', '$eq', '$ne'];
|
||||
if (op) {
|
||||
(0, assert_1.assert)(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
V = ((0, jsx_runtime_1.jsx)(foreignKeyFilter_1.default, { formItem: false, entity: entity, oakPath: oakFullpath, column: column }));
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
(0, assert_1.assert)(false, "\u7C7B\u578B\u3010".concat(attrType, "\u3011\u6682\u4E0D\u652F\u6301"));
|
||||
break;
|
||||
}
|
||||
}
|
||||
return ((0, jsx_runtime_1.jsx)(antd_1.Form.Item, tslib_1.__assign({ label: _label }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: V }) })));
|
||||
}
|
||||
exports.default = Render;
|
||||
function assertMessage(attr, attrType, op, ops) {
|
||||
return "attr\u4E3A\u3010".concat(attr, "\u3011, \u4F20\u5165\u7684\u7B97\u5B50\u3010").concat(op, "\u3011\u4E0D\u652F\u6301\uFF0C\u7C7B\u578B\u3010").concat(attrType, "\u3011\u53EA\u652F\u6301\u3010").concat(JSON.stringify(ops), "\u3011");
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
/// <reference types="react" />
|
||||
declare const _default: (props: import("oak-frontend-base").ReactComponentProps<true, {
|
||||
entity: StringConstructor;
|
||||
columns: ArrayConstructor;
|
||||
}>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
||||
export default _default;
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.default = OakComponent({
|
||||
entity: function () {
|
||||
var entity = this.props.entity;
|
||||
return entity;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
columns: Array,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilters: function () {
|
||||
if (this.state.oakFullpath) {
|
||||
var namedFilters = this.features.runningTree.getNamedFilters(this.state.oakFullpath);
|
||||
return namedFilters;
|
||||
}
|
||||
return [];
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { ColSpanType, ColumnProps } from '../query/column';
|
||||
declare type Width = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
||||
declare type ColumnMapType = {
|
||||
xxl: ColSpanType;
|
||||
xl: ColSpanType;
|
||||
lg: ColSpanType;
|
||||
md: ColSpanType;
|
||||
sm: ColSpanType;
|
||||
xs: ColSpanType;
|
||||
};
|
||||
export default function Render(props: WebComponentProps<EntityDict, keyof EntityDict, false, {
|
||||
entity: string;
|
||||
columns: Array<ColumnProps>;
|
||||
onSearch: () => void;
|
||||
column?: ColSpanType | ColumnMapType;
|
||||
width: Width;
|
||||
}, {
|
||||
getNamedFilters: () => Record<string, any>[];
|
||||
}>): JSX.Element | null;
|
||||
export {};
|
||||
|
|
@ -1,145 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var react_1 = require("react");
|
||||
var antd_1 = require("antd");
|
||||
var icons_1 = require("@ant-design/icons");
|
||||
var query_1 = tslib_1.__importDefault(require("../query"));
|
||||
var utils_1 = require("../query/utils");
|
||||
var web_module_less_1 = tslib_1.__importDefault(require("./web.module.less"));
|
||||
var DEFAULT_COLUMN_MAP = {
|
||||
xxl: 4,
|
||||
xl: 4,
|
||||
lg: 4,
|
||||
md: 3,
|
||||
sm: 2,
|
||||
xs: 1,
|
||||
};
|
||||
function transformColumns(columns) {
|
||||
return columns.map(function (column, index) {
|
||||
var _filterName = (0, utils_1.getFilterName)(column);
|
||||
return tslib_1.__assign(tslib_1.__assign({}, column), { filterName: _filterName });
|
||||
});
|
||||
}
|
||||
function getColumn(column, width) {
|
||||
if (typeof column === 'number') {
|
||||
return column;
|
||||
}
|
||||
if (typeof column === 'object') {
|
||||
if (column[width] !== undefined) {
|
||||
return column[width] || DEFAULT_COLUMN_MAP[width];
|
||||
}
|
||||
}
|
||||
return 3;
|
||||
}
|
||||
function getSpan(colSpan, column) {
|
||||
return colSpan > column ? column : colSpan;
|
||||
}
|
||||
function Render(props) {
|
||||
var _a = props.data, onSearch = _a.onSearch, columns = _a.columns, _b = _a.column, column = _b === void 0 ? DEFAULT_COLUMN_MAP : _b, width = _a.width, entity = _a.entity, oakFullpath = _a.oakFullpath;
|
||||
var _c = props.methods, t = _c.t, refresh = _c.refresh, getNamedFilters = _c.getNamedFilters, removeNamedFilterByName = _c.removeNamedFilterByName;
|
||||
var _d = tslib_1.__read((0, react_1.useState)(false), 2), open = _d[0], setOpen = _d[1];
|
||||
if (!columns || columns.length === 0) {
|
||||
return null;
|
||||
}
|
||||
var tfColumns = transformColumns(columns);
|
||||
var mergedColumn = getColumn(column, width); // 一行放几个
|
||||
var gridColumn = Math.ceil(24 / mergedColumn); // 24格 计算一个所需几格
|
||||
var totalColSpan = tfColumns.reduce(function (prev, cur, index, arr) {
|
||||
return getSpan(cur.colSpan || 1, mergedColumn) + prev;
|
||||
}, 0); //总共多少份
|
||||
var rows = Math.ceil(totalColSpan / mergedColumn);
|
||||
var showExpandButton = totalColSpan > mergedColumn - 1; //需要显示展开按钮
|
||||
var filters = getNamedFilters() || [];
|
||||
var filterNames = tfColumns.map(function (ele) { return ele.filterName; });
|
||||
var filters2 = filters === null || filters === void 0 ? void 0 : filters.filter(function (ele) {
|
||||
return filterNames.includes(ele['#name']);
|
||||
});
|
||||
var count = (filters2 === null || filters2 === void 0 ? void 0 : filters2.length) || 0; //查询条件个数
|
||||
var items = [];
|
||||
var rowSum = 0;
|
||||
var rowSum2 = 0;
|
||||
var rows2 = 1;
|
||||
var firstItem;
|
||||
var _gridColumn = gridColumn;
|
||||
tfColumns.forEach(function (column, index) {
|
||||
var colSpan = column.colSpan;
|
||||
var colSpan2 = getSpan(colSpan || 1, mergedColumn);
|
||||
var item = ((0, jsx_runtime_1.jsx)(antd_1.Col, tslib_1.__assign({ span: gridColumn * colSpan2 }, { children: (0, jsx_runtime_1.jsx)(query_1.default, { column: column, entity: entity, oakPath: oakFullpath }) })));
|
||||
if (index === 0) {
|
||||
firstItem = item;
|
||||
}
|
||||
if (!open) {
|
||||
if (width !== 'xs') {
|
||||
rowSum += colSpan2;
|
||||
if (mergedColumn === 1) {
|
||||
//一行一个
|
||||
items.push(item);
|
||||
}
|
||||
else if (rowSum <= mergedColumn - 1) {
|
||||
items.push(item);
|
||||
rowSum2 = rowSum;
|
||||
if (totalColSpan === mergedColumn - 1) {
|
||||
_gridColumn = gridColumn * 1;
|
||||
}
|
||||
else if (totalColSpan < mergedColumn) {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum2);
|
||||
}
|
||||
}
|
||||
else {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum2);
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
items.push(item);
|
||||
if (rowSum + colSpan2 > rows2 * mergedColumn &&
|
||||
rowSum < rows2 * mergedColumn) {
|
||||
rowSum += rows2 * mergedColumn - rowSum;
|
||||
rowSum += colSpan2;
|
||||
rows2 += 1;
|
||||
}
|
||||
else if (rowSum + colSpan2 === rows2 * mergedColumn) {
|
||||
rowSum += colSpan2;
|
||||
rows2 += 1;
|
||||
}
|
||||
else {
|
||||
rowSum += colSpan2;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (open) {
|
||||
_gridColumn = 24;
|
||||
if (rowSum >= mergedColumn) {
|
||||
var other = rows * mergedColumn - rowSum;
|
||||
if (other > 0) {
|
||||
_gridColumn = gridColumn * other;
|
||||
}
|
||||
}
|
||||
else {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum);
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (width === 'xs') {
|
||||
items.push(firstItem);
|
||||
}
|
||||
}
|
||||
items.push((0, jsx_runtime_1.jsx)(antd_1.Col, tslib_1.__assign({ span: _gridColumn }, { children: (0, jsx_runtime_1.jsx)(antd_1.Form.Item, { children: (0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ size: 16, className: web_module_less_1.default.actionBox }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Badge, tslib_1.__assign({ count: count }, { children: (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "default", onClick: function () {
|
||||
filterNames.forEach(function (ele) {
|
||||
return removeNamedFilterByName(ele);
|
||||
});
|
||||
refresh();
|
||||
} }, { children: t('common:reset') })) })), (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "primary", onClick: function () {
|
||||
if (typeof onSearch === 'function') {
|
||||
onSearch();
|
||||
return;
|
||||
}
|
||||
refresh();
|
||||
} }, { children: t('common:select') })), showExpandButton && ((0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "link", onClick: function () {
|
||||
setOpen(!open);
|
||||
} }, { children: (0, jsx_runtime_1.jsxs)(antd_1.Space, { children: [open ? t('common:shrink') : t('common:expand'), open ? (0, jsx_runtime_1.jsx)(icons_1.UpOutlined, {}) : (0, jsx_runtime_1.jsx)(icons_1.DownOutlined, {})] }) })))] })) }) })));
|
||||
return ((0, jsx_runtime_1.jsx)(antd_1.Form, { children: (0, jsx_runtime_1.jsx)(antd_1.Row, tslib_1.__assign({ gutter: [16, 16] }, { children: items })) }));
|
||||
}
|
||||
exports.default = Render;
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
/// <reference types="react" />
|
||||
declare const _default: import("react").ComponentType<any>;
|
||||
export default _default;
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.default = OakComponent({
|
||||
entity: function () {
|
||||
var entity = this.props.entity;
|
||||
return entity;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
columns: Array,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilters: function () {
|
||||
if (this.state.oakFullpath) {
|
||||
var namedFilters = this.features.runningTree.getNamedFilters(this.state.oakFullpath);
|
||||
return namedFilters;
|
||||
}
|
||||
return [];
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
declare type Ops = '$gt' | '$lt' | '$gte' | '$lte' | '$eq' | '$ne' | '$startsWith' | '$endsWith' | '$includes' | '$in' | '$nin' | '$between';
|
||||
declare type ColumnProps = {
|
||||
attr: string;
|
||||
label?: string;
|
||||
type: 'text' | 'date' | 'picker' | 'select' | 'boolean';
|
||||
placeholder?: string;
|
||||
op?: Ops;
|
||||
options: Array<{
|
||||
label: string;
|
||||
value: string;
|
||||
}>;
|
||||
transformQuery?: (column: ColumnProps, value: string) => Record<string, any>;
|
||||
transformValue?: (column: ColumnProps, query: Record<string, any>) => string;
|
||||
filterName?: string;
|
||||
};
|
||||
export default function Render(props: WebComponentProps<EntityDict, keyof EntityDict, false, {
|
||||
entity: string;
|
||||
columns: Array<ColumnProps>;
|
||||
searchValue: string;
|
||||
onSearch: () => void;
|
||||
}, {
|
||||
getNamedFilters: () => Record<string, any>[];
|
||||
}>): JSX.Element;
|
||||
export {};
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var jsx_runtime_1 = require("react/jsx-runtime");
|
||||
var antd_1 = require("antd");
|
||||
var icons_1 = require("@ant-design/icons");
|
||||
function getQueryDict(column) {
|
||||
return "".concat(column.attr).concat(column.op ? ".".concat(column.op) : '');
|
||||
}
|
||||
function transformColumns(columns) {
|
||||
return columns.map(function (column, index) {
|
||||
var filterName = column.filterName;
|
||||
var _filterName = filterName || getQueryDict(column);
|
||||
return tslib_1.__assign(tslib_1.__assign({}, column), { filterName: _filterName });
|
||||
});
|
||||
}
|
||||
function Render(props) {
|
||||
var _a = props.data, searchValue = _a.searchValue, onSearch = _a.onSearch, columns = _a.columns;
|
||||
var _b = props.methods, addNamedFilter = _b.addNamedFilter, refresh = _b.refresh, getNamedFilters = _b.getNamedFilters;
|
||||
var filters = getNamedFilters() || [];
|
||||
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(antd_1.Form, { children: [columns.map(function (column) {
|
||||
console.log(column.filterName || getQueryDict(column));
|
||||
return ((0, jsx_runtime_1.jsx)(antd_1.Form.Item, { children: (0, jsx_runtime_1.jsx)(antd_1.Input, { value: searchValue, onChange: function (e) {
|
||||
addNamedFilter({
|
||||
filter: {
|
||||
name: {
|
||||
$includes: e.target.value,
|
||||
},
|
||||
},
|
||||
'#name': column.filterName ||
|
||||
getQueryDict(column),
|
||||
});
|
||||
} }) }));
|
||||
}), (0, jsx_runtime_1.jsx)(ActionView, { columns: columns, filters: filters })] }) }));
|
||||
}
|
||||
exports.default = Render;
|
||||
function ActionView(props) {
|
||||
var columns = props.columns, filters = props.filters;
|
||||
var tfColumns = transformColumns(columns);
|
||||
var filterNames = tfColumns.map(function (ele) { return ele.filterName; });
|
||||
var filters2 = filters === null || filters === void 0 ? void 0 : filters.filter(function (ele) {
|
||||
return filterNames.includes(ele['#name']);
|
||||
});
|
||||
var count = (filters2 === null || filters2 === void 0 ? void 0 : filters2.length) || 0;
|
||||
return ((0, jsx_runtime_1.jsx)(antd_1.Form.Item, { children: (0, jsx_runtime_1.jsxs)(antd_1.Space, tslib_1.__assign({ size: 16 }, { children: [(0, jsx_runtime_1.jsx)(antd_1.Badge, tslib_1.__assign({ count: count }, { children: (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "default" }, { children: "\u91CD\u7F6E" })) })), (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "primary", onClick: function () {
|
||||
// if (typeof onSearch === 'function') {
|
||||
// onSearch();
|
||||
// return;
|
||||
// }
|
||||
// refresh();
|
||||
} }, { children: "\u67E5\u8BE2" })), (0, jsx_runtime_1.jsx)(antd_1.Button, tslib_1.__assign({ type: "link" }, { children: (0, jsx_runtime_1.jsxs)(antd_1.Space, { children: ["\u5C55\u5F00", (0, jsx_runtime_1.jsx)(icons_1.DownOutlined, {})] }) }))] })) }));
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { EntityShape } from 'oak-domain/lib/types/Entity';
|
||||
import { Channel } from '../types/Message';
|
||||
import { Schema as Application } from './Application';
|
||||
import { Schema as MessageSystem } from './MessageSystem';
|
||||
export interface Schema extends EntityShape {
|
||||
channel: Channel;
|
||||
application?: Application;
|
||||
data: Object;
|
||||
messageSystem: MessageSystem;
|
||||
data1: Object;
|
||||
data2: Object;
|
||||
}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
;
|
||||
var IActionDef = {
|
||||
stm: {
|
||||
succeed: ['sending', 'success'],
|
||||
fail: ['sending', 'failure'],
|
||||
},
|
||||
is: 'sending',
|
||||
};
|
||||
var locale = {
|
||||
zh_CN: {
|
||||
attr: {
|
||||
channel: '消息渠道',
|
||||
data: '消息数据',
|
||||
messageSystem: '消息系统连接',
|
||||
data1: '数据1',
|
||||
data2: '数据2',
|
||||
iState: '状态',
|
||||
application: '关联应用',
|
||||
},
|
||||
action: {
|
||||
succeed: '成功',
|
||||
fail: '失败',
|
||||
},
|
||||
v: {
|
||||
iState: {
|
||||
sending: '发送中',
|
||||
success: '发送成功',
|
||||
failure: '发送失败',
|
||||
},
|
||||
channel: {
|
||||
wechatPublic: '公众号',
|
||||
jPush: '极光推送',
|
||||
jim: '极光消息',
|
||||
mp: '小程序',
|
||||
sms: '短信',
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { ActionDef } from "oak-domain/lib/types/Action";
|
||||
import { GenericAction } from "oak-domain/lib/actions/action";
|
||||
export declare type IAction = 'succeed' | 'fail';
|
||||
export declare type IState = 'sending' | 'success' | 'failure';
|
||||
export declare type ParticularAction = IAction;
|
||||
export declare type Action = GenericAction | ParticularAction;
|
||||
export declare const actions: string[];
|
||||
export declare const ActionDefDict: {
|
||||
iState: ActionDef<IAction, IState>;
|
||||
};
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.ActionDefDict = exports.actions = void 0;
|
||||
exports.actions = ["count", "stat", "download", "select", "create", "remove", "update", "succeed", "fail"];
|
||||
var IActionDef = {
|
||||
stm: {
|
||||
succeed: ['sending', 'success'],
|
||||
fail: ['sending', 'failure']
|
||||
},
|
||||
is: 'sending'
|
||||
};
|
||||
exports.ActionDefDict = {
|
||||
iState: IActionDef
|
||||
};
|
||||
|
|
@ -1,139 +0,0 @@
|
|||
import { String, ForeignKey } from "oak-domain/lib/types/DataType";
|
||||
import { Q_DateValue, Q_StringValue, Q_EnumValue, NodeId, MakeFilter, ExprOp, ExpressionKey } from "oak-domain/lib/types/Demand";
|
||||
import { OneOf } from "oak-domain/lib/types/Polyfill";
|
||||
import * as SubQuery from "../_SubQuery";
|
||||
import { FormCreateData, FormUpdateData, DeduceAggregation, Operation as OakOperation, MakeAction as OakMakeAction, EntityShape } from "oak-domain/lib/types/Entity";
|
||||
import { Action, ParticularAction, IState } from "./Action";
|
||||
import * as Message from "../Message/Schema";
|
||||
export declare type OpSchema = EntityShape & {
|
||||
channel: 'wechat' | 'jPush' | 'jim' | 'mp' | 'sms';
|
||||
data: Object;
|
||||
messageId: ForeignKey<"message">;
|
||||
data1: Object;
|
||||
data2: Object;
|
||||
iState?: IState | null;
|
||||
};
|
||||
export declare type OpAttr = keyof OpSchema;
|
||||
export declare type Schema = EntityShape & {
|
||||
channel: 'wechat' | 'jPush' | 'jim' | 'mp' | 'sms';
|
||||
data: Object;
|
||||
messageId: ForeignKey<"message">;
|
||||
data1: Object;
|
||||
data2: Object;
|
||||
iState?: IState | null;
|
||||
message: Message.Schema;
|
||||
} & {
|
||||
[A in ExpressionKey]?: any;
|
||||
};
|
||||
declare type AttrFilter = {
|
||||
id: Q_StringValue | SubQuery.MessageSentIdSubQuery;
|
||||
$$createAt$$: Q_DateValue;
|
||||
$$seq$$: Q_StringValue;
|
||||
$$updateAt$$: Q_DateValue;
|
||||
channel: Q_EnumValue<'wechat' | 'jPush' | 'jim' | 'mp' | 'sms'>;
|
||||
data: Object;
|
||||
messageId: Q_StringValue | SubQuery.MessageIdSubQuery;
|
||||
message: Message.Filter;
|
||||
data1: Object;
|
||||
data2: Object;
|
||||
iState: Q_EnumValue<IState>;
|
||||
};
|
||||
export declare type Filter = MakeFilter<AttrFilter & ExprOp<OpAttr | string>>;
|
||||
export declare type Projection = {
|
||||
"#id"?: NodeId;
|
||||
[k: string]: any;
|
||||
id?: number;
|
||||
$$createAt$$?: number;
|
||||
$$updateAt$$?: number;
|
||||
$$seq$$?: number;
|
||||
channel?: number;
|
||||
data?: number;
|
||||
messageId?: number;
|
||||
message?: Message.Projection;
|
||||
data1?: number;
|
||||
data2?: number;
|
||||
iState?: number;
|
||||
} & Partial<ExprOp<OpAttr | string>>;
|
||||
declare type MessageSentIdProjection = OneOf<{
|
||||
id: number;
|
||||
}>;
|
||||
declare type MessageIdProjection = OneOf<{
|
||||
messageId: number;
|
||||
}>;
|
||||
export declare type SortAttr = {
|
||||
id: number;
|
||||
} | {
|
||||
$$createAt$$: number;
|
||||
} | {
|
||||
$$seq$$: number;
|
||||
} | {
|
||||
$$updateAt$$: number;
|
||||
} | {
|
||||
channel: number;
|
||||
} | {
|
||||
messageId: number;
|
||||
} | {
|
||||
message: Message.SortAttr;
|
||||
} | {
|
||||
iState: number;
|
||||
} | {
|
||||
[k: string]: any;
|
||||
} | OneOf<ExprOp<OpAttr | string>>;
|
||||
export declare type SortNode = {
|
||||
$attr: SortAttr;
|
||||
$direction?: "asc" | "desc";
|
||||
};
|
||||
export declare type Sorter = SortNode[];
|
||||
export declare type SelectOperation<P extends Object = Projection> = Omit<OakOperation<"select", P, Filter, Sorter>, "id">;
|
||||
export declare type Selection<P extends Object = Projection> = Omit<SelectOperation<P>, "action">;
|
||||
export declare type Aggregation = Omit<DeduceAggregation<Projection, Filter, Sorter>, "id">;
|
||||
export declare type CreateOperationData = FormCreateData<Omit<OpSchema, "messageId">> & (({
|
||||
messageId?: never;
|
||||
message: Message.CreateSingleOperation;
|
||||
} | {
|
||||
messageId: String<64>;
|
||||
message?: Message.UpdateOperation;
|
||||
} | {
|
||||
messageId: String<64>;
|
||||
}));
|
||||
export declare type CreateSingleOperation = OakOperation<"create", CreateOperationData>;
|
||||
export declare type CreateMultipleOperation = OakOperation<"create", Array<CreateOperationData>>;
|
||||
export declare type CreateOperation = CreateSingleOperation | CreateMultipleOperation;
|
||||
export declare type UpdateOperationData = FormUpdateData<Omit<OpSchema, "messageId">> & (({
|
||||
message: Message.CreateSingleOperation;
|
||||
messageId?: never;
|
||||
} | {
|
||||
message: Message.UpdateOperation;
|
||||
messageId?: never;
|
||||
} | {
|
||||
message: Message.RemoveOperation;
|
||||
messageId?: never;
|
||||
} | {
|
||||
message?: never;
|
||||
messageId?: String<64> | null;
|
||||
})) & {
|
||||
[k: string]: any;
|
||||
};
|
||||
export declare type UpdateOperation = OakOperation<"update" | ParticularAction | string, UpdateOperationData, Filter, Sorter>;
|
||||
export declare type RemoveOperationData = {} & (({
|
||||
message?: Message.UpdateOperation | Message.RemoveOperation;
|
||||
}));
|
||||
export declare type RemoveOperation = OakOperation<"remove", RemoveOperationData, Filter, Sorter>;
|
||||
export declare type Operation = CreateOperation | UpdateOperation | RemoveOperation;
|
||||
export declare type MessageIdSubQuery = Selection<MessageIdProjection>;
|
||||
export declare type MessageSentIdSubQuery = Selection<MessageSentIdProjection>;
|
||||
export declare type EntityDef = {
|
||||
Schema: Schema;
|
||||
OpSchema: OpSchema;
|
||||
Action: OakMakeAction<Action> | string;
|
||||
Selection: Selection;
|
||||
Aggregation: Aggregation;
|
||||
Operation: Operation;
|
||||
Create: CreateOperation;
|
||||
Update: UpdateOperation;
|
||||
Remove: RemoveOperation;
|
||||
CreateSingle: CreateSingleOperation;
|
||||
CreateMulti: CreateMultipleOperation;
|
||||
ParticularAction: ParticularAction;
|
||||
};
|
||||
export {};
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
import { StorageDesc } from "oak-domain/lib/types/Storage";
|
||||
import { OpSchema } from "./Schema";
|
||||
export declare const desc: StorageDesc<OpSchema>;
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.desc = void 0;
|
||||
var Action_1 = require("./Action");
|
||||
exports.desc = {
|
||||
attributes: {
|
||||
channel: {
|
||||
type: "varchar",
|
||||
params: {
|
||||
length: 24
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: "object"
|
||||
},
|
||||
messageId: {
|
||||
type: "ref",
|
||||
ref: "message"
|
||||
},
|
||||
data1: {
|
||||
type: "object"
|
||||
},
|
||||
data2: {
|
||||
type: "object"
|
||||
},
|
||||
iState: {
|
||||
type: "varchar",
|
||||
params: {
|
||||
length: 24
|
||||
}
|
||||
}
|
||||
},
|
||||
actionType: "crud",
|
||||
actions: Action_1.actions
|
||||
};
|
||||
|
|
@ -1 +0,0 @@
|
|||
{ "attr": { "channel": "消息渠道", "data": "消息数据", "message": "消息", "data1": "数据1", "data2": "数据2", "iState": "状态" }, "action": { "succeed": "成功", "fail": "失败" }, "v": { "iState": { "sending": "发送中", "success": "发送成功", "failure": "发送失败" }, "channel": { "wechat": "公众号", "jPush": "极光推送", "jim": "极光消息", "mp": "小程序", "sms": "短信" } } }
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
|
||||
type Options = {
|
||||
width?: number,
|
||||
height?: number,
|
||||
devicePixelRatio?: number // 像素
|
||||
}
|
||||
|
||||
export declare function init(dom: any, theme?: string | null, options?: Options): any;
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
import { Trigger } from 'oak-domain/lib/types/Trigger';
|
||||
import { EntityDict } from '../general-app-domain/EntityDict';
|
||||
import { RuntimeCxt } from '../types/RuntimeCxt';
|
||||
declare const triggers: Trigger<EntityDict, 'messageSent', RuntimeCxt>[];
|
||||
export default triggers;
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var tslib_1 = require("tslib");
|
||||
var assert_1 = require("oak-domain/lib/utils/assert");
|
||||
function sendMessage(messageSentData, context) {
|
||||
return tslib_1.__awaiter(this, void 0, void 0, function () {
|
||||
return tslib_1.__generator(this, function (_a) {
|
||||
return [2 /*return*/];
|
||||
});
|
||||
});
|
||||
}
|
||||
var triggers = [
|
||||
{
|
||||
name: '当创建messageSent后，业务提交后再进行推送',
|
||||
entity: 'messageSent',
|
||||
action: 'create',
|
||||
when: 'commit',
|
||||
strict: 'makeSure',
|
||||
fn: function (_a, context, params) {
|
||||
var operation = _a.operation;
|
||||
return tslib_1.__awaiter(void 0, void 0, void 0, function () {
|
||||
var data, filter, fn;
|
||||
return tslib_1.__generator(this, function (_b) {
|
||||
switch (_b.label) {
|
||||
case 0:
|
||||
data = operation.data, filter = operation.filter;
|
||||
fn = function (messageSentData) { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
|
||||
return tslib_1.__generator(this, function (_a) {
|
||||
switch (_a.label) {
|
||||
case 0: return [4 /*yield*/, sendMessage(messageSentData, context)];
|
||||
case 1:
|
||||
_a.sent();
|
||||
return [2 /*return*/];
|
||||
}
|
||||
});
|
||||
}); };
|
||||
if (!(data instanceof Array)) return [3 /*break*/, 1];
|
||||
(0, assert_1.assert)('不存在一对多的情况');
|
||||
return [3 /*break*/, 3];
|
||||
case 1: return [4 /*yield*/, fn(data)];
|
||||
case 2:
|
||||
_b.sent();
|
||||
_b.label = 3;
|
||||
case 3: return [2 /*return*/, 0];
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
];
|
||||
exports.default = triggers;
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
import { EntityDict } from '../general-app-domain';
|
||||
export declare const userProjection: EntityDict['user']['Selection']['data'];
|
||||
export declare const tokenProjection: EntityDict['token']['Selection']['data'];
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.tokenProjection = exports.userProjection = void 0;
|
||||
exports.userProjection = {
|
||||
id: 1,
|
||||
nickname: 1,
|
||||
name: 1,
|
||||
userState: 1,
|
||||
idState: 1,
|
||||
gender: 1,
|
||||
birth: 1,
|
||||
extraFile$entity: {
|
||||
$entity: 'extraFile',
|
||||
data: {
|
||||
id: 1,
|
||||
tag1: 1,
|
||||
origin: 1,
|
||||
bucket: 1,
|
||||
objectId: 1,
|
||||
filename: 1,
|
||||
extra1: 1,
|
||||
type: 1,
|
||||
entity: 1,
|
||||
entityId: 1,
|
||||
extension: 1,
|
||||
},
|
||||
filter: {
|
||||
tag1: 'avatar',
|
||||
},
|
||||
indexFrom: 0,
|
||||
count: 1,
|
||||
},
|
||||
mobile$user: {
|
||||
$entity: 'mobile',
|
||||
data: {
|
||||
id: 1,
|
||||
mobile: 1,
|
||||
userId: 1,
|
||||
},
|
||||
},
|
||||
userRole$user: {
|
||||
$entity: 'userRole',
|
||||
data: {
|
||||
id: 1,
|
||||
userId: 1,
|
||||
roleId: 1,
|
||||
},
|
||||
},
|
||||
};
|
||||
exports.tokenProjection = {
|
||||
id: 1,
|
||||
userId: 1,
|
||||
user: exports.userProjection,
|
||||
ableState: 1,
|
||||
playerId: 1,
|
||||
player: {
|
||||
id: 1,
|
||||
userRole$user: {
|
||||
$entity: 'userRole',
|
||||
data: {
|
||||
id: 1,
|
||||
userId: 1,
|
||||
roleId: 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { assert } from 'oak-domain/lib/utils/assert';
|
||||
|
||||
export default OakComponent({
|
||||
entity() {
|
||||
const { entity } = this.props;
|
||||
return entity as keyof EntityDict;
|
||||
},
|
||||
projection() {
|
||||
const { projection } = this.props;
|
||||
return projection;
|
||||
},
|
||||
formData({ data: rows }) {
|
||||
return {
|
||||
rows,
|
||||
};
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
projection: Object,
|
||||
multiple: Boolean,
|
||||
onSelect: Function,
|
||||
},
|
||||
methods: {},
|
||||
});
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,73 +0,0 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { Table } from 'antd';
|
||||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
|
||||
import Style from './web.module.less';
|
||||
|
||||
|
||||
|
||||
export default function Render(
|
||||
props: WebComponentProps<
|
||||
EntityDict,
|
||||
keyof EntityDict,
|
||||
false,
|
||||
{
|
||||
entity: string;
|
||||
rows: EntityDict[keyof EntityDict]['Schema'][];
|
||||
projection: Record<string, any>;
|
||||
onSelect: (rows: EntityDict[keyof EntityDict]['Schema'][]) => void;
|
||||
multiple: boolean;
|
||||
},
|
||||
{}
|
||||
>
|
||||
) {
|
||||
const {
|
||||
entity,
|
||||
oakFullpath,
|
||||
oakLoading,
|
||||
rows,
|
||||
projection,
|
||||
onSelect,
|
||||
multiple = false,
|
||||
} = props.data;
|
||||
const { t } = props.methods;
|
||||
|
||||
const columns = Object.keys(projection)
|
||||
.filter((ele) => ele !== 'id')
|
||||
.map((ele) => ({
|
||||
dataIndex: ele,
|
||||
title: t(`${entity}:attr.${ele}`),
|
||||
}));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Table
|
||||
loading={oakLoading}
|
||||
dataSource={rows}
|
||||
rowKey="id"
|
||||
rowSelection={{
|
||||
type: multiple ? 'checkbox' : 'radio',
|
||||
// onSelect: (record) => {
|
||||
// onSelect(record);
|
||||
// },
|
||||
onChange: (
|
||||
selectedRowKeys,
|
||||
selectedRows,
|
||||
info
|
||||
) => {
|
||||
onSelect(selectedRows);
|
||||
},
|
||||
}}
|
||||
onRow={!multiple ? (record) => {
|
||||
return {
|
||||
onClick: (event) => {
|
||||
onSelect([record]);
|
||||
}, // 点击行
|
||||
};
|
||||
} : undefined}
|
||||
columns={columns}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,97 +0,0 @@
|
|||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { assert } from 'oak-domain/lib/utils/assert';
|
||||
import { judgeRelation } from 'oak-domain/lib/store/relation';
|
||||
import { getAttributes } from '../query/utils';
|
||||
|
||||
export default OakComponent({
|
||||
entity() {
|
||||
const { entity } = this.props;
|
||||
return entity as keyof EntityDict;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
column: Object,
|
||||
formItem: Boolean,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilter(name: string) {
|
||||
if (this.state.oakFullpath) {
|
||||
const filter = this.getFilterByName(name);
|
||||
return filter;
|
||||
}
|
||||
},
|
||||
getRefByAttr(entity: keyof EntityDict, field: string) {
|
||||
if (!this.state.oakFullpath) {
|
||||
return;
|
||||
}
|
||||
const dataSchema = this.features.cache.getSchema();
|
||||
const attrs = field.split('.');
|
||||
|
||||
let idx = 0;
|
||||
let _entity = entity;
|
||||
let attr;
|
||||
let attrType;
|
||||
let attribute;
|
||||
let entityI18n = entity;
|
||||
let attrI18n;
|
||||
while (idx <= attrs.length - 1) {
|
||||
attr = attrs[idx];
|
||||
attrI18n = attr;
|
||||
const relation = judgeRelation(dataSchema, _entity, attr);
|
||||
if (relation === 1) {
|
||||
const attributes = getAttributes(
|
||||
dataSchema[_entity].attributes
|
||||
);
|
||||
attribute = attributes[attr];
|
||||
attrType = attribute.type;
|
||||
if (attrType === 'ref') {
|
||||
attrI18n = attribute.ref;
|
||||
}
|
||||
} else if (relation === 2) {
|
||||
// entity entityId
|
||||
const ref = attr as keyof EntityDict;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
} else if (typeof relation === 'string') {
|
||||
const ref = relation as keyof EntityDict;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
|
||||
idx++;
|
||||
}
|
||||
|
||||
return {
|
||||
entity: _entity,
|
||||
attr,
|
||||
attrType,
|
||||
entityI18n,
|
||||
attrI18n,
|
||||
attribute,
|
||||
};
|
||||
},
|
||||
|
||||
getEntityData(entity: keyof EntityDict, ids: string[]) {
|
||||
const { column } = this.props;
|
||||
const projection = column?.refProps?.projection || { id: 1, name: 1 };
|
||||
|
||||
const entityData = this.features.cache.get(
|
||||
entity,
|
||||
{
|
||||
data: projection,
|
||||
filter: {
|
||||
id: {
|
||||
$in: ids,
|
||||
},
|
||||
},
|
||||
},
|
||||
true
|
||||
);
|
||||
return entityData;
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
|
||||
{
|
||||
"placeholder": {
|
||||
"input": "请输入",
|
||||
"select": "请选择"
|
||||
},
|
||||
"attr": {
|
||||
"id": "编号",
|
||||
"$$createAt$$": "创建时间",
|
||||
"$$updateAt$$": "更新时间",
|
||||
"$$deleteAt$$": "删除时间",
|
||||
"$$seq$$": "序号"
|
||||
},
|
||||
"closed": "关闭",
|
||||
"select": "请选择"
|
||||
}
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,239 +0,0 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { Input, Button, Space, Form, Modal } from 'antd';
|
||||
import { CloseOutlined } from '@ant-design/icons';
|
||||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { ColSpanType, ColumnProps } from '../query/column';
|
||||
import { getFilterName, getOp } from '../query/utils';
|
||||
import EntityPicker from '../entityPicker';
|
||||
|
||||
import { get, set } from 'oak-domain/lib/utils/lodash';
|
||||
import { assert } from 'oak-domain/lib/utils/assert';
|
||||
import Style from './web.module.less';
|
||||
|
||||
|
||||
export default function Render(
|
||||
props: WebComponentProps<
|
||||
EntityDict,
|
||||
keyof EntityDict,
|
||||
false,
|
||||
{
|
||||
entity: keyof EntityDict;
|
||||
column: ColumnProps;
|
||||
onSearch: () => void;
|
||||
formItem: boolean;
|
||||
},
|
||||
{
|
||||
getNamedFilter: (name: string) => Record<string, any>;
|
||||
getRefByAttr: (
|
||||
entity: keyof EntityDict,
|
||||
attr: string
|
||||
) => {
|
||||
entity: keyof EntityDict;
|
||||
attr: string;
|
||||
attrType: string;
|
||||
entityI18n: keyof EntityDict;
|
||||
attrI18n: string;
|
||||
attribute: Record<string, any>;
|
||||
};
|
||||
getEntityData: (
|
||||
entity: keyof EntityDict,
|
||||
ids: string[]
|
||||
) => EntityDict[keyof EntityDict]['Schema'][];
|
||||
}
|
||||
>
|
||||
) {
|
||||
const {
|
||||
onSearch,
|
||||
entity,
|
||||
oakFullpath,
|
||||
formItem = true,
|
||||
column,
|
||||
} = props.data;
|
||||
const {
|
||||
t,
|
||||
refresh,
|
||||
getNamedFilter,
|
||||
removeNamedFilterByName,
|
||||
addNamedFilter,
|
||||
getRefByAttr,
|
||||
setMessage,
|
||||
getEntityData,
|
||||
} = props.methods;
|
||||
const [open, setOpen] = useState(false);
|
||||
const [selectRows, setSelectRows] = useState<
|
||||
EntityDict[keyof EntityDict]['Schema'][]
|
||||
>([]);
|
||||
|
||||
const {
|
||||
op,
|
||||
attr,
|
||||
label,
|
||||
transformValue = (column, filter) => get(filter, getOp(column), ''),
|
||||
transformFilter = (column, value) => set({}, getOp(column), value),
|
||||
placeholder,
|
||||
refProps,
|
||||
} = column;
|
||||
const name = getFilterName(column);
|
||||
const filter = getNamedFilter(name);
|
||||
|
||||
const params = getRefByAttr(entity, attr);
|
||||
if (!params) {
|
||||
return null;
|
||||
}
|
||||
const _value = transformValue(column, filter);
|
||||
const {
|
||||
entity: entity2,
|
||||
attr: attr2,
|
||||
attrType,
|
||||
entityI18n,
|
||||
attrI18n,
|
||||
attribute,
|
||||
} = params;
|
||||
|
||||
if (attribute.type !== 'ref') {
|
||||
assert(false, `attr为${attr}，类型【${attribute.type}】不是ref`);
|
||||
return null;
|
||||
}
|
||||
|
||||
let _label = '';
|
||||
if (label && label.indexOf(':') === -1) {
|
||||
_label = label;
|
||||
} else {
|
||||
_label = t(`${entityI18n}:attr.${attrI18n}`);
|
||||
}
|
||||
|
||||
const inputKey = refProps?.inputKey || 'name';
|
||||
const projection = refProps?.projection || { id: 1, name: 1 };
|
||||
|
||||
let modalProps = {};
|
||||
let rows: EntityDict[keyof EntityDict]['Schema'][] = [];
|
||||
const multiple = !!op && ['$in', '$nin'].includes(op);
|
||||
if (!multiple) {
|
||||
modalProps = {
|
||||
footer: false,
|
||||
};
|
||||
rows = _value
|
||||
? getEntityData(attribute.ref as keyof EntityDict, [_value])
|
||||
: [];
|
||||
} else {
|
||||
rows = _value
|
||||
? getEntityData(
|
||||
attribute.ref as keyof EntityDict,
|
||||
_value as string[]
|
||||
)
|
||||
: [];
|
||||
}
|
||||
let _value2;
|
||||
if (rows.length > 0) {
|
||||
_value2 = rows.map((ele) => (ele as any)[inputKey]).join('、');
|
||||
}
|
||||
|
||||
|
||||
const deleteFilter = (interval?: number) => {
|
||||
removeNamedFilterByName(name);
|
||||
};
|
||||
|
||||
const setFilterAndResetFilter = (
|
||||
value?: string | boolean | Array<any>,
|
||||
getFilter?: () => any
|
||||
) => {
|
||||
if (
|
||||
value === '' ||
|
||||
value === undefined ||
|
||||
value === null ||
|
||||
(value as Array<any>)?.length === 0
|
||||
) {
|
||||
removeNamedFilterByName(name);
|
||||
return;
|
||||
}
|
||||
const filter2: any =
|
||||
typeof getFilter === 'function'
|
||||
? getFilter()
|
||||
: transformFilter(column, value);
|
||||
|
||||
addNamedFilter({
|
||||
filter: filter2,
|
||||
'#name': name,
|
||||
});
|
||||
};
|
||||
|
||||
let V = (
|
||||
<>
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.select')}
|
||||
onClick={() => {
|
||||
setOpen(true);
|
||||
}}
|
||||
// allowClear
|
||||
// onChange={() => {
|
||||
// deleteFilter();
|
||||
// }}
|
||||
value={_value2}
|
||||
readOnly={true}
|
||||
suffix={
|
||||
_value && (
|
||||
<div
|
||||
onClick={() => {
|
||||
deleteFilter();
|
||||
setSelectRows([]);
|
||||
}}
|
||||
>
|
||||
<CloseOutlined size={14} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
|
||||
if (formItem) {
|
||||
V = <Form.Item label={_label}>{V}</Form.Item>;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{V}
|
||||
<Modal
|
||||
title={t('select')}
|
||||
centered
|
||||
open={open}
|
||||
onOk={() => {
|
||||
if (selectRows.length === 0) {
|
||||
setMessage({
|
||||
type: 'warning',
|
||||
content: t('select'),
|
||||
});
|
||||
return;
|
||||
}
|
||||
const ids = selectRows.map((ele) => ele.id);
|
||||
setFilterAndResetFilter(ids);
|
||||
setOpen(false);
|
||||
}}
|
||||
cancelText={t('closed')}
|
||||
onCancel={() => setOpen(false)}
|
||||
width="50%"
|
||||
destroyOnClose={true}
|
||||
{...modalProps}
|
||||
>
|
||||
<EntityPicker
|
||||
multiple={multiple}
|
||||
oakAutoUnmount={true}
|
||||
projection={projection}
|
||||
entity={attribute.ref}
|
||||
oakPath={`$foreignKeyFilter-entity/picker-${entity}`}
|
||||
onSelect={(
|
||||
rows: EntityDict[keyof EntityDict]['Schema'][]
|
||||
) => {
|
||||
setSelectRows(rows);
|
||||
if (!multiple) {
|
||||
const ids = rows.map((ele) => ele.id);
|
||||
setFilterAndResetFilter(ids[0]);
|
||||
setOpen(false);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,68 +0,0 @@
|
|||
import { Dayjs } from 'dayjs'
|
||||
|
||||
export type Ops =
|
||||
| '$gt'
|
||||
| '$lt'
|
||||
| '$gte'
|
||||
| '$lte'
|
||||
| '$eq'
|
||||
| '$ne'
|
||||
| '$startsWith'
|
||||
| '$endsWith'
|
||||
| '$includes'
|
||||
| '$in'
|
||||
| '$nin'
|
||||
| '$between'
|
||||
| '$text'
|
||||
| '$search';
|
||||
|
||||
export type ColSpanType = 1 | 2 | 3 | 4;
|
||||
|
||||
export type ValueType = string | boolean | number | Array<Dayjs> | Dayjs;
|
||||
|
||||
export type ColumnProps = {
|
||||
attr: string;
|
||||
label?: string;
|
||||
type: 'text' | 'date' | 'picker' | 'select' | 'boolean';
|
||||
placeholder?: string;
|
||||
op?: Ops;
|
||||
selectProps?: {
|
||||
options?: Array<{
|
||||
label: string;
|
||||
value: string;
|
||||
}>;
|
||||
transformInOption: (
|
||||
option: string | number | Record<string, any>
|
||||
) => void;
|
||||
transformOutOption: (
|
||||
option: string | number | Record<string, any>
|
||||
) => void;
|
||||
};
|
||||
dateProps?: {
|
||||
range?: boolean;
|
||||
showTime?: boolean;
|
||||
};
|
||||
refProps?: {
|
||||
projection?: Record<string, any>;
|
||||
filter?: Record<string, any>;
|
||||
sorter?: Record<string, any>;
|
||||
router?: {
|
||||
pathname: string;
|
||||
props?: Record<string, any>;
|
||||
state?: Record<string, any>;
|
||||
};
|
||||
component?: React.ReactNode;
|
||||
inputKey?: 'name' | string;
|
||||
};
|
||||
transformFilter?: (
|
||||
column: ColumnProps,
|
||||
value: ValueType
|
||||
) => Record<string, any>;
|
||||
transformValue?: (
|
||||
column: ColumnProps,
|
||||
filter: Record<string, any>
|
||||
) => string;
|
||||
filterName?: string;
|
||||
colSpan?: ColSpanType;
|
||||
placeholder?: string;
|
||||
};
|
||||
|
|
@ -1,84 +0,0 @@
|
|||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { assert } from 'oak-domain/lib/utils/assert';
|
||||
import { judgeRelation } from 'oak-domain/lib/store/relation';
|
||||
import { getAttributes } from './utils';
|
||||
|
||||
export default OakComponent({
|
||||
entity() {
|
||||
const { entity } = this.props;
|
||||
return entity as keyof EntityDict;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
column: Object,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilter(name: string) {
|
||||
if (this.state.oakFullpath) {
|
||||
const filter = this.getFilterByName(name);
|
||||
return filter;
|
||||
}
|
||||
},
|
||||
getRefByAttr(entity: keyof EntityDict, field: string) {
|
||||
if (!this.state.oakFullpath) {
|
||||
return;
|
||||
}
|
||||
const dataSchema = this.features.cache.getSchema();
|
||||
const attrs = field.split('.');
|
||||
|
||||
let idx = 0;
|
||||
let _entity = entity;
|
||||
let attr;
|
||||
let attrType;
|
||||
let attribute;
|
||||
let entityI18n = entity;
|
||||
let attrI18n;
|
||||
while (idx <= attrs.length - 1) {
|
||||
attr = attrs[idx];
|
||||
attrI18n = attr;
|
||||
|
||||
if (attr.startsWith('$text')) {
|
||||
// 全文的话
|
||||
attrType = '$text';
|
||||
} else {
|
||||
const relation = judgeRelation(dataSchema, _entity, attr);
|
||||
if (relation === 1) {
|
||||
const attributes = getAttributes(
|
||||
dataSchema[_entity].attributes
|
||||
);
|
||||
attribute = attributes[attr];
|
||||
attrType = attribute.type;
|
||||
if (attrType === 'ref') {
|
||||
attrI18n = attribute.ref;
|
||||
}
|
||||
} else if (relation === 2) {
|
||||
// entity entityId
|
||||
const ref = attr as keyof EntityDict;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
} else if (typeof relation === 'string') {
|
||||
const ref = relation as keyof EntityDict;
|
||||
_entity = ref;
|
||||
entityI18n = ref;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
idx++;
|
||||
}
|
||||
|
||||
return {
|
||||
entity: _entity,
|
||||
attr,
|
||||
attrType,
|
||||
entityI18n,
|
||||
attrI18n,
|
||||
attribute,
|
||||
};
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
|
||||
{
|
||||
"placeholder": {
|
||||
"input": "请输入",
|
||||
"select": "请选择"
|
||||
},
|
||||
"attr": {
|
||||
"id": "编号",
|
||||
"$$createAt$$": "创建时间",
|
||||
"$$updateAt$$": "更新时间",
|
||||
"$$deleteAt$$": "删除时间",
|
||||
"$$seq$$": "序号",
|
||||
"$text": "全文检索"
|
||||
},
|
||||
"tip": {
|
||||
"yes": "是",
|
||||
"no": "否",
|
||||
"unselected": "未选"
|
||||
},
|
||||
"op": {
|
||||
"$includes": "包含"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
import { ColumnProps, Ops } from './column';
|
||||
|
||||
|
||||
export function getOp(column: ColumnProps) {
|
||||
return `${column.attr}${column.op ? `.${column.op}` : ''}`;
|
||||
}
|
||||
|
||||
export function getOp2(column: ColumnProps, op: Ops) {
|
||||
return `${column.attr}${column.op || op ? `.${column.op || op}` : ''}`;
|
||||
}
|
||||
|
||||
export function getFilterName(column: ColumnProps) {
|
||||
return column.filterName || getOp(column);
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function getAttributes(attributes: Record<string, any>) {
|
||||
return Object.assign({}, attributes, {
|
||||
id: {
|
||||
type: 'char',
|
||||
},
|
||||
$$createAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$updateAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$deleteAt$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
$$seq$$: {
|
||||
type: 'datetime',
|
||||
},
|
||||
});
|
||||
}
|
||||
|
|
@ -1,503 +0,0 @@
|
|||
import React, { useEffect } from 'react';
|
||||
import {
|
||||
Input,
|
||||
Button,
|
||||
Space,
|
||||
Form,
|
||||
Select,
|
||||
DatePicker,
|
||||
InputNumber,
|
||||
} from 'antd';
|
||||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { ToYuan, ToCent } from 'oak-domain/lib/utils/money';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import { initinctiveAttributes } from 'oak-domain/lib/types/Entity';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import weekday from 'dayjs/plugin/weekday';
|
||||
import localeData from 'dayjs/plugin/localeData';
|
||||
import type { DatePickerProps, RangePickerProps } from 'antd/es/date-picker';
|
||||
|
||||
dayjs.extend(weekday);
|
||||
dayjs.extend(localeData);
|
||||
|
||||
import { get, set } from 'oak-domain/lib/utils/lodash'
|
||||
import { assert } from 'oak-domain/lib/utils/assert';
|
||||
|
||||
import { ColumnProps, ColSpanType, Ops, ValueType } from './column';
|
||||
import { getFilterName, getOp, getOp2 } from './utils';
|
||||
import ForeignKeyFilter from '../foreignKeyFilter';
|
||||
|
||||
export default function Render(
|
||||
props: WebComponentProps<
|
||||
EntityDict,
|
||||
keyof EntityDict,
|
||||
false,
|
||||
{
|
||||
entity: keyof EntityDict;
|
||||
column: ColumnProps;
|
||||
searchValue: string;
|
||||
onSearch: () => void;
|
||||
},
|
||||
{
|
||||
getNamedFilter: (name: string) => Record<string, any>;
|
||||
getRefByAttr: (
|
||||
entity: keyof EntityDict,
|
||||
attr: string
|
||||
) => {
|
||||
entity: keyof EntityDict;
|
||||
attr: string;
|
||||
attrType: string;
|
||||
entityI18n: keyof EntityDict;
|
||||
attrI18n: string;
|
||||
attribute: Record<string, any>
|
||||
};
|
||||
}
|
||||
>
|
||||
) {
|
||||
const { entity, column, oakFullpath } = props.data;
|
||||
const {
|
||||
t,
|
||||
addNamedFilter,
|
||||
removeNamedFilterByName,
|
||||
refresh,
|
||||
getNamedFilter,
|
||||
getRefByAttr,
|
||||
} = props.methods;
|
||||
const name = getFilterName(column);
|
||||
const filter = getNamedFilter(name);
|
||||
|
||||
const {
|
||||
type = 'text',
|
||||
op,
|
||||
attr,
|
||||
label,
|
||||
transformValue = (column, filter) => get(filter, getOp(column), ''),
|
||||
transformFilter = (column, value) => set({}, getOp(column), value),
|
||||
placeholder,
|
||||
} = column;
|
||||
const params = getRefByAttr(entity, attr);
|
||||
if (!params) {
|
||||
return null;
|
||||
}
|
||||
const {
|
||||
entity: entity2,
|
||||
attr: attr2,
|
||||
attrType,
|
||||
entityI18n,
|
||||
attrI18n,
|
||||
attribute,
|
||||
} = params;
|
||||
|
||||
let _label = '';
|
||||
if (label && label.indexOf(':') === -1) {
|
||||
_label = label;
|
||||
}
|
||||
else if (['$text'].includes(attr2)) {
|
||||
_label = t(`attr.${attr2}`);
|
||||
} else if (initinctiveAttributes.includes(attr2)) {
|
||||
_label = t(`attr.${attr2}`);
|
||||
} else {
|
||||
_label = t(`${entityI18n}:attr.${attrI18n}`);
|
||||
}
|
||||
|
||||
const deleteFilter = (interval?: number) => {
|
||||
removeNamedFilterByName(name);
|
||||
};
|
||||
|
||||
const setFilterAndResetFilter = (
|
||||
value?: ValueType,
|
||||
getFilter?: () => any
|
||||
) => {
|
||||
if (
|
||||
value === '' ||
|
||||
value === undefined ||
|
||||
value === null ||
|
||||
(value as Array<Dayjs>)?.length === 0
|
||||
) {
|
||||
removeNamedFilterByName(name);
|
||||
return;
|
||||
}
|
||||
const filter2: any =
|
||||
typeof getFilter === 'function'
|
||||
? getFilter()
|
||||
: transformFilter(column, value);
|
||||
|
||||
addNamedFilter({
|
||||
filter: filter2,
|
||||
'#name': name,
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
let V;
|
||||
|
||||
if (attrType === '$text') {
|
||||
const ops: Ops[] = ['$search'];
|
||||
if (op) {
|
||||
assert(ops.includes(op), assertMessage(attr, attrType, op, ops));
|
||||
}
|
||||
const {
|
||||
transformFilter = (column, value) => {
|
||||
return set({}, getOp2(column, '$search'), value);
|
||||
},
|
||||
transformValue = (column, filter) => get(filter, getOp2(column, '$search'), ''),
|
||||
} = column;
|
||||
const _value = transformValue(column, filter);
|
||||
|
||||
return (
|
||||
<Form.Item label={_label}>
|
||||
<>
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.input')}
|
||||
value={_value}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setFilterAndResetFilter(val, () => {
|
||||
return transformFilter(column, val);
|
||||
});
|
||||
}}
|
||||
allowClear
|
||||
onPressEnter={() => {}}
|
||||
/>
|
||||
</>
|
||||
</Form.Item>
|
||||
);
|
||||
}
|
||||
const _value = transformValue(column, filter);
|
||||
|
||||
switch (attrType) {
|
||||
case 'money': {
|
||||
const ops: Ops[] = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
const moneyVal = _value ? ToYuan(_value) : '';
|
||||
V = (
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.input')}
|
||||
value={moneyVal}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
const val2 =
|
||||
/^(-?[1-9]\d*(\.\d*[1-9])?)|(-?0\.\d*[1-9])$/.test(
|
||||
val
|
||||
) ? ToCent(Number(val)) : moneyVal;
|
||||
setFilterAndResetFilter(val2);
|
||||
}}
|
||||
allowClear
|
||||
onPressEnter={() => {}}
|
||||
/>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case 'float': {
|
||||
const ops: Ops[] = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
V = (
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.input')}
|
||||
value={_value}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}}
|
||||
allowClear
|
||||
onPressEnter={() => {}}
|
||||
/>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case 'integer':
|
||||
case 'int': {
|
||||
const ops: Ops[] = ['$eq', '$ne', '$gt', '$gte', '$lt', '$lte'];
|
||||
if (op) {
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
}
|
||||
V = (
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.input')}
|
||||
value={_value}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}}
|
||||
allowClear
|
||||
onPressEnter={() => {}}
|
||||
/>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case 'char':
|
||||
case 'varchar': {
|
||||
const ops: Ops[] = [
|
||||
'$eq',
|
||||
'$ne',
|
||||
'$endsWith',
|
||||
'$includes',
|
||||
'$startsWith',
|
||||
];
|
||||
if (op) {
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
}
|
||||
V = (
|
||||
<Input
|
||||
placeholder={placeholder || t('placeholder.input')}
|
||||
value={_value}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setFilterAndResetFilter(val);
|
||||
}}
|
||||
allowClear
|
||||
onPressEnter={() => {}}
|
||||
/>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case 'boolean': {
|
||||
let text2;
|
||||
switch (_value) {
|
||||
case true: {
|
||||
text2 = t('tip.yes');
|
||||
break;
|
||||
}
|
||||
case false: {
|
||||
text2 = t('tip.no');
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
text2 = t('tip.unselected');
|
||||
break;
|
||||
}
|
||||
}
|
||||
V = (
|
||||
<Button
|
||||
onClick={() => {
|
||||
let val: any;
|
||||
if (_value === true) {
|
||||
val = false;
|
||||
} else if (_value === false) {
|
||||
val = '';
|
||||
} else {
|
||||
val = true;
|
||||
}
|
||||
setFilterAndResetFilter(val);
|
||||
}}
|
||||
>
|
||||
{text2}
|
||||
</Button>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case 'enum': {
|
||||
const ops: Ops[] = ['$in', '$nin', '$eq', '$ne'];
|
||||
if (op) {
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
}
|
||||
|
||||
const enumeration = attribute?.enumeration;
|
||||
const { selectProps } = column;
|
||||
|
||||
const {
|
||||
options,
|
||||
transformInOption = (
|
||||
option: string | number | Record<string, any>
|
||||
) => (typeof option === 'object' ? option.value : option), // 根据
|
||||
transformOutOption = (
|
||||
option: string | number | Record<string, any>
|
||||
) => (typeof option === 'object' ? option.label : option), // 根据
|
||||
} = selectProps || {};
|
||||
|
||||
const options2 =
|
||||
options ||
|
||||
enumeration?.map((ele: string) => ({
|
||||
label: t(`${entityI18n}:v.${attrI18n}.${ele}`),
|
||||
value: ele,
|
||||
}));
|
||||
|
||||
if (op && ['$in', '$nin'].includes(op)) {
|
||||
const {
|
||||
transformValue = (column, filter) =>
|
||||
get(filter, getOp(column), []),
|
||||
} = column;
|
||||
const selectValue = transformValue(column, filter);
|
||||
V = (
|
||||
<Select
|
||||
mode="multiple"
|
||||
allowClear
|
||||
placeholder={placeholder || t('placeholder.select')}
|
||||
value={selectValue}
|
||||
onChange={(value) => {
|
||||
setFilterAndResetFilter(value);
|
||||
}}
|
||||
options={options2?.length > 0 ? options2 : []}
|
||||
onClear={() => {
|
||||
deleteFilter();
|
||||
}}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
V = (
|
||||
<Select
|
||||
allowClear
|
||||
placeholder={placeholder || t('placeholder.select')}
|
||||
value={_value}
|
||||
onChange={(value) => {
|
||||
setFilterAndResetFilter(value);
|
||||
}}
|
||||
options={options2?.length > 0 ? options2 : []}
|
||||
onClear={() => {
|
||||
deleteFilter();
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
case 'datetime': {
|
||||
const { dateProps } = column;
|
||||
const { range = false, showTime = false } = dateProps || {};
|
||||
|
||||
const unitOfTime = 'day';
|
||||
|
||||
if (range) {
|
||||
const ops: Ops[] = ['$between'];
|
||||
assert(op, '选择时间范围，算子必须传入');
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
const {
|
||||
transformValue = (column, filter) => {
|
||||
return get(filter, `${getOp(column)}`, []);
|
||||
},
|
||||
transformFilter = (column, value: Dayjs[]) => {
|
||||
const startTime = dayjs(value[0])
|
||||
.startOf(unitOfTime)
|
||||
.valueOf();
|
||||
const endTime = dayjs(value[1])
|
||||
.endOf(unitOfTime)
|
||||
.valueOf();
|
||||
|
||||
return set({}, getOp(column), [startTime, endTime]);
|
||||
},
|
||||
} = column;
|
||||
const dateValues = transformValue(column, filter);
|
||||
const [startTime, endTIme] = dateValues;
|
||||
V = (
|
||||
<DatePicker.RangePicker
|
||||
showTime={showTime}
|
||||
value={
|
||||
[
|
||||
startTime ? dayjs(startTime) : '',
|
||||
endTIme ? dayjs(endTIme) : '',
|
||||
] as RangePickerProps['value']
|
||||
}
|
||||
onChange={(dates, dateStrings) => {
|
||||
setFilterAndResetFilter(dates as Dayjs[], () => {
|
||||
return transformFilter(
|
||||
column,
|
||||
dates as Dayjs[]
|
||||
);
|
||||
});
|
||||
}}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
const ops: Ops[] = ['$between', '$gt', '$gte', '$lt', '$lte'];
|
||||
if (op) {
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
}
|
||||
const {
|
||||
transformFilter = (column, value: Dayjs) => {
|
||||
const startTime = dayjs(value)
|
||||
.startOf(unitOfTime)
|
||||
.valueOf();
|
||||
const endTime = dayjs(value)
|
||||
.endOf(unitOfTime)
|
||||
.valueOf();
|
||||
if (column.op === '$between') {
|
||||
const values2 = [startTime, endTime];
|
||||
return set({}, getOp(column), values2);
|
||||
}
|
||||
if (column.op === '$gt' || column.op === '$gte') {
|
||||
return set({}, getOp(column), startTime);
|
||||
}
|
||||
if (column.op === '$lt' || column.op === '$lte') {
|
||||
return set({}, getOp(column), endTime);
|
||||
}
|
||||
|
||||
return set({}, getOp(column), dayjs(value).valueOf());
|
||||
},
|
||||
transformValue = (column, filter) => {
|
||||
if (column.op === '$between') {
|
||||
return get(filter, `${getOp(column)}.0`, null);
|
||||
}
|
||||
return get(filter, getOp(column), null);
|
||||
},
|
||||
} = column;
|
||||
const dateValue = transformValue(column, filter);
|
||||
|
||||
V = (
|
||||
<DatePicker
|
||||
format="YYYY-MM-DD"
|
||||
showTime={showTime}
|
||||
value={dateValue ? dayjs(dateValue) : null}
|
||||
onChange={(date, dateString) => {
|
||||
setFilterAndResetFilter(date as Dayjs, () => {
|
||||
return transformFilter(column, date as Dayjs);
|
||||
});
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
case 'ref': {
|
||||
const ops: Ops[] = ['$in', '$nin', '$eq', '$ne'];
|
||||
if (op) {
|
||||
assert(
|
||||
ops.includes(op),
|
||||
assertMessage(attr, attrType, op, ops)
|
||||
);
|
||||
}
|
||||
|
||||
V = (
|
||||
<ForeignKeyFilter
|
||||
formItem={false}
|
||||
entity={entity}
|
||||
oakPath={oakFullpath}
|
||||
column={column}
|
||||
/>
|
||||
);
|
||||
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
assert(false, `类型【${attrType}】暂不支持`);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Form.Item label={_label}>
|
||||
<>{V}</>
|
||||
</Form.Item>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
function assertMessage(attr: string, attrType: string, op: Ops, ops: Ops[]) {
|
||||
return `attr为【${attr}】, 传入的算子【${op}】不支持，类型【${attrType}】只支持【${JSON.stringify(
|
||||
ops
|
||||
)}】`;
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import { EntityDict } from '../../../general-app-domain';
|
||||
|
||||
export default OakComponent({
|
||||
entity() {
|
||||
const { entity } = this.props;
|
||||
return entity as keyof EntityDict;
|
||||
},
|
||||
isList: true,
|
||||
data: {
|
||||
open: false,
|
||||
},
|
||||
properties: {
|
||||
entity: String,
|
||||
columns: Array,
|
||||
},
|
||||
methods: {
|
||||
getNamedFilters() {
|
||||
if (this.state.oakFullpath) {
|
||||
const namedFilters = this.features.runningTree.getNamedFilters(
|
||||
this.state.oakFullpath
|
||||
);
|
||||
return namedFilters;
|
||||
}
|
||||
return [];
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
.actionBox {
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -1,241 +0,0 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { Input, Button, Space, Form, Badge, Row, Col } from 'antd';
|
||||
import { DownOutlined, UpOutlined } from '@ant-design/icons';
|
||||
import { WebComponentProps } from 'oak-frontend-base';
|
||||
import { EntityDict } from '../../../general-app-domain';
|
||||
import Query from '../query';
|
||||
import { ColSpanType, ColumnProps } from '../query/column';
|
||||
import { getFilterName } from '../query/utils';
|
||||
|
||||
import Style from './web.module.less';
|
||||
import { t } from '@wangeditor/editor';
|
||||
|
||||
|
||||
|
||||
type Width = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
||||
|
||||
type ColumnMapType = {
|
||||
xxl: ColSpanType;
|
||||
xl: ColSpanType;
|
||||
lg: ColSpanType;
|
||||
md: ColSpanType;
|
||||
sm: ColSpanType;
|
||||
xs: ColSpanType;
|
||||
};
|
||||
|
||||
const DEFAULT_COLUMN_MAP: ColumnMapType = {
|
||||
xxl: 4,
|
||||
xl: 4,
|
||||
lg: 4,
|
||||
md: 3,
|
||||
sm: 2,
|
||||
xs: 1,
|
||||
};
|
||||
|
||||
|
||||
function transformColumns(columns: ColumnProps[]) {
|
||||
return columns.map((column, index) => {
|
||||
const _filterName = getFilterName(column);
|
||||
|
||||
return {
|
||||
...column,
|
||||
filterName: _filterName,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function getColumn(column: ColSpanType | ColumnMapType, width: Width) {
|
||||
if (typeof column === 'number') {
|
||||
return column;
|
||||
}
|
||||
|
||||
if (typeof column === 'object') {
|
||||
if (column[width] !== undefined) {
|
||||
return column[width] || DEFAULT_COLUMN_MAP[width];
|
||||
}
|
||||
}
|
||||
|
||||
return 3;
|
||||
}
|
||||
|
||||
function getSpan(colSpan: ColSpanType, column: ColSpanType) {
|
||||
return colSpan > column ? column : colSpan;
|
||||
}
|
||||
|
||||
export default function Render(
|
||||
props: WebComponentProps<
|
||||
EntityDict,
|
||||
keyof EntityDict,
|
||||
false,
|
||||
{
|
||||
entity: string;
|
||||
columns: Array<ColumnProps>;
|
||||
onSearch: () => void;
|
||||
column?: ColSpanType | ColumnMapType;
|
||||
width: Width;
|
||||
},
|
||||
{
|
||||
getNamedFilters: () => Record<string, any>[];
|
||||
}
|
||||
>
|
||||
) {
|
||||
const {
|
||||
onSearch,
|
||||
columns,
|
||||
column = DEFAULT_COLUMN_MAP,
|
||||
width,
|
||||
entity,
|
||||
oakFullpath,
|
||||
} = props.data;
|
||||
const { t, refresh, getNamedFilters, removeNamedFilterByName } = props.methods;
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
if (!columns || columns.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const tfColumns = transformColumns(columns);
|
||||
const mergedColumn = getColumn(column, width); // 一行放几个
|
||||
const gridColumn = Math.ceil(24 / mergedColumn); // 24格 计算一个所需几格
|
||||
const totalColSpan = tfColumns.reduce(
|
||||
(prev, cur, index, arr) =>
|
||||
getSpan(cur.colSpan || 1, mergedColumn) + prev,
|
||||
0
|
||||
); //总共多少份
|
||||
const rows = Math.ceil(totalColSpan / mergedColumn);
|
||||
const showExpandButton = totalColSpan > mergedColumn - 1; //需要显示展开按钮
|
||||
const filters = getNamedFilters() || [];
|
||||
const filterNames = tfColumns.map((ele) => ele.filterName);
|
||||
const filters2 = filters?.filter((ele) =>
|
||||
filterNames.includes(ele['#name'])
|
||||
);
|
||||
const count = filters2?.length || 0; //查询条件个数
|
||||
|
||||
const items: any = [];
|
||||
let rowSum = 0;
|
||||
let rowSum2 = 0;
|
||||
let rows2 = 1;
|
||||
let firstItem;
|
||||
let _gridColumn = gridColumn;
|
||||
tfColumns.forEach((column, index) => {
|
||||
const { colSpan } = column;
|
||||
const colSpan2 = getSpan(colSpan || 1, mergedColumn);
|
||||
|
||||
const item = (
|
||||
<Col span={gridColumn * colSpan2}>
|
||||
<Query column={column} entity={entity} oakPath={oakFullpath} />
|
||||
</Col>
|
||||
);
|
||||
|
||||
if (index === 0) {
|
||||
firstItem = item;
|
||||
}
|
||||
if (!open) {
|
||||
if (width !== 'xs') {
|
||||
rowSum += colSpan2;
|
||||
|
||||
if (mergedColumn === 1) {
|
||||
//一行一个
|
||||
items.push(item);
|
||||
} else if (rowSum <= mergedColumn - 1) {
|
||||
items.push(item);
|
||||
rowSum2 = rowSum;
|
||||
|
||||
if (totalColSpan === mergedColumn - 1) {
|
||||
_gridColumn = gridColumn * 1;
|
||||
} else if (totalColSpan < mergedColumn) {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum2);
|
||||
}
|
||||
} else {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum2);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
items.push(item);
|
||||
if (
|
||||
rowSum + colSpan2 > rows2 * mergedColumn &&
|
||||
rowSum < rows2 * mergedColumn
|
||||
) {
|
||||
rowSum += rows2 * mergedColumn - rowSum;
|
||||
rowSum += colSpan2;
|
||||
rows2 += 1;
|
||||
} else if (rowSum + colSpan2 === rows2 * mergedColumn) {
|
||||
rowSum += colSpan2;
|
||||
rows2 += 1;
|
||||
} else {
|
||||
rowSum += colSpan2;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (open) {
|
||||
_gridColumn = 24;
|
||||
if (rowSum >= mergedColumn) {
|
||||
const other = rows * mergedColumn - rowSum;
|
||||
if (other > 0) {
|
||||
_gridColumn = gridColumn * other;
|
||||
}
|
||||
} else {
|
||||
_gridColumn = gridColumn * (mergedColumn - rowSum);
|
||||
}
|
||||
} else {
|
||||
if (width === 'xs') {
|
||||
items.push(firstItem);
|
||||
}
|
||||
}
|
||||
|
||||
items.push(
|
||||
<Col span={_gridColumn}>
|
||||
<Form.Item>
|
||||
<Space size={16} className={Style.actionBox}>
|
||||
<Badge count={count}>
|
||||
<Button
|
||||
type="default"
|
||||
onClick={() => {
|
||||
filterNames.forEach((ele) =>
|
||||
removeNamedFilterByName(ele)
|
||||
);
|
||||
|
||||
refresh();
|
||||
}}
|
||||
>
|
||||
{t('common:reset')}
|
||||
</Button>
|
||||
</Badge>
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
if (typeof onSearch === 'function') {
|
||||
onSearch();
|
||||
return;
|
||||
}
|
||||
refresh();
|
||||
}}
|
||||
>
|
||||
{t('common:select')}
|
||||
</Button>
|
||||
{showExpandButton && (
|
||||
<Button
|
||||
type="link"
|
||||
onClick={() => {
|
||||
setOpen(!open);
|
||||
}}
|
||||
>
|
||||
<Space>
|
||||
{open ? t('common:shrink') : t('common:expand')}
|
||||
|
||||
{open ? <UpOutlined /> : <DownOutlined />}
|
||||
</Space>
|
||||
</Button>
|
||||
)}
|
||||
</Space>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
);
|
||||
|
||||
return (
|
||||
<Form>
|
||||
<Row gutter={[16, 16]}>{items}</Row>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue