@flatbiz/antd
Version:
315 lines (307 loc) • 12.8 kB
JavaScript
/*! @flatjs/forge MIT @flatbiz/antd */
import { hooks } from '@wove/react/hooks';
import { a as _slicedToArray, b as _objectSpread2 } from './_rollupPluginBabelHelpers-BYm17lo8.js';
import { classNames } from '@dimjs/utils/class-names/class-names';
import { useState, createElement, Fragment } from 'react';
import { Tag, Empty, Form } from 'antd';
import { fbaHooks } from './fba-hooks/index.js';
import { jsxs, jsx } from 'react/jsx-runtime';
var Relation = function Relation(props) {
var _props$onTagClick;
var style = {
'--relation-tagline-width': "".concat(props.tagLineWidth || 40, "px"),
'--relation-group-indent-width': "".concat(props.indentWidth || 80, "px"),
'--relation-tag-width': "".concat(props.tagWidth || 26, "px"),
'--relation-line-color': "".concat(props.lineColor || '#fda148')
};
var className = classNames('relation-list', {
'relation-list-only-one': props.onlyOne,
'relation-list-only-no-main-one': props.onlyOne
}, props.className);
var solt1 = props.solt1,
solt2 = props.solt2;
return /*#__PURE__*/jsxs("div", {
className: className,
style: style,
children: [solt1 ? /*#__PURE__*/jsxs("div", {
className: "relation-list-solt1",
children: [/*#__PURE__*/jsx("div", {
className: "relation-list-line"
}), /*#__PURE__*/jsx("div", {
className: "relation-list-label",
children: props.label
}), props.tagName ? /*#__PURE__*/jsx(Tag, {
className: "relation-item-tag",
color: props.tagColor || '#fecd96',
onClick: (_props$onTagClick = props.onTagClick) === null || _props$onTagClick === void 0 ? void 0 : _props$onTagClick.bind(null, props.tagName),
children: props.tagName
}) : null, solt1()]
}) : null, solt2 ? /*#__PURE__*/jsx("div", {
className: "relation-list-solt2",
children: solt2()
}) : null]
});
};
var RelationGroupList = function RelationGroupList(props) {
return /*#__PURE__*/jsx("div", {
className: classNames('relation-group-list', props.className),
children: props.children
});
};
var RelationItem = function RelationItem(props) {
var className = classNames('relation-item', {
'relation-item-line': true,
'relation-item-first': props.isFirst,
'relation-item-last': props.isLast,
'relation-item-only-one': props.onlyOne
});
return /*#__PURE__*/jsx("div", {
className: className,
style: props.style,
children: props.children
});
};
var _deleteLoop = function deleteLoop(data, uid) {
var _data$relationList;
if (data.uid === uid) {
data['_delete'] = true;
}
data === null || data === void 0 || (_data$relationList = data.relationList) === null || _data$relationList === void 0 || _data$relationList.forEach(function (item) {
var _item$customData, _item$children;
if (item.uid === uid || ((_item$customData = item.customData) === null || _item$customData === void 0 ? void 0 : _item$customData.uid) === uid) {
item['_delete'] = true;
if (data.relationList.length === 1) {
data['_delete'] = true;
}
}
(_item$children = item.children) === null || _item$children === void 0 || _item$children.forEach(function (innerItem) {
_deleteLoop(innerItem, uid);
});
});
};
var _filterSurplusData = function filterSurplusData(data) {
data.relationList = data.relationList || [];
data.relationList = data.relationList.filter(function (item) {
return !item['_delete'];
});
data.relationList.forEach(function (item) {
item.children = item.children || [];
item.children = item.children.filter(function (item) {
return !item['_delete'];
});
item.children.forEach(function (innerItem) {
_filterSurplusData(innerItem);
});
});
data.relationList = data.relationList.filter(function (item) {
if (!item.customData && !item.children) {
return false;
}
if (!item.customData && (!item.children || item.children.length === 0)) {
return false;
}
return true;
});
};
var RelationItemRender = function RelationItemRender(props) {
var relationItem = props.relationItem;
var dataSource = props.dataSource;
var index = props.index;
if (relationItem.customData && relationItem.children && relationItem.children.length > 0) {
var _relationItem$childre;
return /*#__PURE__*/jsxs(Fragment, {
children: [/*#__PURE__*/jsx(RelationItem, {
isFirst: index === 0,
isLast: index === dataSource.relationList.length - 1,
onlyOne: props.onlyOne,
children: props.relationItemRender(relationItem.customData, relationItem.extraData)
}), /*#__PURE__*/jsx(RelationGroupList, {
children: (_relationItem$childre = relationItem.children) === null || _relationItem$childre === void 0 ? void 0 : _relationItem$childre.map(function (innerItem) {
return /*#__PURE__*/jsx(_RelationTreeLoop, {
dataSource: innerItem,
relationItemRender: props.relationItemRender,
relationProps: props.relationProps,
onTagClick: props.onTagClick,
className: props.className
}, innerItem.uid);
})
})]
}, relationItem.uid);
}
if (relationItem.children && relationItem.children.length > 0) {
var _relationItem$childre2;
return /*#__PURE__*/jsx("div", {
className: classNames('form-list-no-main-group', {
'form-list-no-main-group': index === 0
}),
children: (_relationItem$childre2 = relationItem.children) === null || _relationItem$childre2 === void 0 ? void 0 : _relationItem$childre2.map(function (innerItem) {
return /*#__PURE__*/jsx(_RelationTreeLoop, {
dataSource: innerItem,
relationItemRender: props.relationItemRender,
className: classNames('form-list-no-main', {
'form-list-no-main-first': index === 0,
'form-list-no-main-last': index === dataSource.relationList.length - 1
}),
relationProps: props.relationProps,
onTagClick: props.onTagClick
}, innerItem.uid);
})
}, relationItem.uid);
}
if (relationItem.customData) {
return /*#__PURE__*/jsx(RelationItem, {
isFirst: index === 0,
isLast: index === dataSource.relationList.length - 1,
onlyOne: props.onlyOne,
children: /*#__PURE__*/jsx(Form, {
component: false,
children: props.relationItemRender(relationItem.customData, relationItem.extraData)
})
}, relationItem.uid);
}
return null;
};
var _RelationTreeLoop = function RelationTreeLoop(props) {
var dataSource = props.dataSource;
var relationList = dataSource.relationList || [];
var lastRelationItem = relationList[relationList.length - 1];
var hasSolt2 = relationList.length > 0 && lastRelationItem.customData && lastRelationItem.children && lastRelationItem.children.length > 0;
var onlyOne = relationList.length == 1;
// const onlyNoMainOne =
// onlyOne && !relationList[0].customData && toArray(relationList[0].children).length === 1;
return /*#__PURE__*/createElement(Relation, _objectSpread2(_objectSpread2({}, props.relationProps), {}, {
tagName: dataSource.tagName,
key: dataSource.uid,
onlyOne: onlyOne,
label: dataSource.label,
className: props.className,
onTagClick: function onTagClick() {
var _props$onTagClick;
(_props$onTagClick = props.onTagClick) === null || _props$onTagClick === void 0 || _props$onTagClick.call(props, dataSource.uid, dataSource.extraData);
},
solt1: function solt1() {
return /*#__PURE__*/jsx(Fragment, {
children: relationList.map(function (relationItem, index) {
var flat = hasSolt2 && index === relationList.length - 1;
return /*#__PURE__*/jsx(RelationItemRender, {
dataSource: props.dataSource,
relationItemRender: props.relationItemRender,
relationProps: props.relationProps,
onTagClick: props.onTagClick,
relationItem: flat ? _objectSpread2(_objectSpread2({}, relationItem), {}, {
children: undefined
}) : relationItem,
index: index,
onlyOne: onlyOne
}, index);
})
});
},
solt2: function solt2() {
// 渲染最后一个relation item的children list数据
if (hasSolt2 && lastRelationItem.children && lastRelationItem.children.length > 0) {
return /*#__PURE__*/jsx(RelationGroupList, {
children: lastRelationItem.children.map(function (innerItem) {
return /*#__PURE__*/jsx(_RelationTreeLoop, {
dataSource: innerItem,
relationItemRender: props.relationItemRender,
relationProps: props.relationProps,
onTagClick: props.onTagClick
}, innerItem.uid);
})
}, lastRelationItem.uid);
}
return null;
}
}));
};
var RelationTree = function RelationTree(props) {
var _useState = useState(),
_useState2 = _slicedToArray(_useState, 2),
dataSource = _useState2[0],
setDataSource = _useState2[1];
fbaHooks.useEffectCustom(function () {
setDataSource(props.dataSource);
}, [props.dataSource]);
var onRelationItemContentChange = hooks.useCallbackRef(function (data, name, value) {
if (data) {
var _props$onChange;
data[name] = value;
(_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, _objectSpread2({}, dataSource));
}
});
var _getTargetRelationList = function getTargetRelationList(relationTreeList, uid) {
for (var index = 0; index < relationTreeList.length; index++) {
var relationTree = relationTreeList[index];
for (var innerIndex = 0; innerIndex < relationTree.relationList.length; innerIndex++) {
var _element$customData;
var element = relationTree.relationList[innerIndex];
if (((_element$customData = element.customData) === null || _element$customData === void 0 ? void 0 : _element$customData.uid) === uid) {
return {
relationTree: relationTree,
index: innerIndex,
element: element
};
} else if (element.children) {
var result = _getTargetRelationList(element.children, uid);
if (result) {
return result;
}
}
}
}
return null;
};
var onAdd = hooks.useCallbackRef(function (data, initialData) {
var _result$relationTree;
if (!dataSource) return;
var result = _getTargetRelationList([dataSource], data.uid);
if ((_result$relationTree = result.relationTree) !== null && _result$relationTree !== void 0 && _result$relationTree.relationList) {
var _result$relationTree2, _props$onChange2;
(_result$relationTree2 = result.relationTree) === null || _result$relationTree2 === void 0 || _result$relationTree2.relationList.splice(result.index + 1, 0, initialData);
(_props$onChange2 = props.onChange) === null || _props$onChange2 === void 0 || _props$onChange2.call(props, dataSource);
}
});
var addChildren = hooks.useCallbackRef(function (data, initialData) {
if (!dataSource) return;
var result = _getTargetRelationList([dataSource], data.uid);
if (result.element) {
var _props$onChange3;
result.element.children = (result.element.children || []).concat(initialData);
(_props$onChange3 = props.onChange) === null || _props$onChange3 === void 0 || _props$onChange3.call(props, dataSource);
}
});
var onRemove = hooks.useCallbackRef(function (uid) {
if (!dataSource) return;
_deleteLoop(dataSource, uid);
if (dataSource['_delete']) {
var _props$onChange4;
(_props$onChange4 = props.onChange) === null || _props$onChange4 === void 0 || _props$onChange4.call(props, undefined);
} else {
var _props$onChange5;
_filterSurplusData(dataSource);
(_props$onChange5 = props.onChange) === null || _props$onChange5 === void 0 || _props$onChange5.call(props, dataSource);
}
});
if (!dataSource) return /*#__PURE__*/jsx(Empty, {
description: "\u6682\u65E0\u6570\u636E"
});
return /*#__PURE__*/jsx("div", {
className: classNames('relation-tree', props.className),
children: /*#__PURE__*/jsx(_RelationTreeLoop, {
dataSource: dataSource,
relationProps: props.relationProps,
onTagClick: props.onTagClick,
relationItemRender: function relationItemRender(data, extraData) {
return props.children(data, {
add: onAdd,
addChildren: addChildren,
remove: onRemove,
onChange: onRelationItemContentChange.bind(null, data)
}, extraData);
}
})
});
};
export { RelationTree as R };
//# sourceMappingURL=relation-tree-DC2_zwoC.js.map