ming-demo1
Version:
mdf metaui web
883 lines (795 loc) • 27.6 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _redux = require("redux");
var _reactRedux = require("react-redux");
var _basic = require("../../../../basic");
var _baseui = require("@mdf/baseui");
var _sortableList = _interopRequireDefault(require("./sortableList"));
var _SvgIcon = _interopRequireDefault(require("@mdf/metaui-web/lib/components/common/SvgIcon"));
var _tree = require("../../../../../redux/tree");
var _util = require("@mdf/cube/lib/helpers/util");
var TreeNode = _baseui.Tree.TreeNode;
var Option = _baseui.Select.Option;
var SearchTreeControl = function (_React$Component) {
(0, _inherits2["default"])(SearchTreeControl, _React$Component);
function SearchTreeControl(props) {
var _this;
(0, _classCallCheck2["default"])(this, SearchTreeControl);
_this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(SearchTreeControl).call(this, props));
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onCheck", function (checkedKeys) {
var dataSource = _this.selectDataSource;
_this.props.setCheckedKeys(checkedKeys);
var checkedItem = [];
dataSource.forEach(function (ele, index) {
if (ele.code && checkedKeys.indexOf(ele.code) > -1) {
if (ele.haveChildren == true) return;
checkedItem.push(ele);
}
});
_this.props.changeRightContent(checkedItem);
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSearchClick", function (e) {
_this.flag = true;
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleTreeClick", function (e) {
_this.flag = true;
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function (e) {
if (_this.flag) {
_this.flag = false;
return;
}
});
var filterProps = ['name'];
_this.state = {
multiple: _this.props.multiple || false,
checkable: _this.props.checkable || false,
keyField: _this.props.keyField || 'key',
titleField: _this.props.titleField || 'title',
childrenField: 'children',
autoExpandParent: false,
selectedKeys: [],
dataSource: [],
optionData: [],
renderFlag: true,
selectKey: '',
filterProps: filterProps,
searchValue: '',
currentSelect: ''
};
_this.selectDataSource = [];
return _this;
}
(0, _createClass2["default"])(SearchTreeControl, [{
key: "componentDidMount",
value: function componentDidMount() {
var states = {
dataSource: this.props.dataSource,
optionData: this.props.dataSource
};
this.setState(states);
this.getSelectData(this.props.dataSource);
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
if (nextProps.bShowModal == false || nextProps.isAuto == true) {
this.setState({
searchValue: ''
});
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {}
}, {
key: "onSelect",
value: function onSelect(selectedKeys, e) {
var dataSource = this.selectDataSource;
this.props.setCheckedKeys(selectedKeys);
var checkedItem = [];
dataSource.forEach(function (ele, index) {
if (ele.code && selectedKeys[0] == ele.code && !ele.haveChildren && ele.name) {
checkedItem.push(ele);
}
if (ele.parent && selectedKeys[0] == ele.parent && !ele.haveChildren && ele.name) {
checkedItem.push(ele);
}
if (ele.parent) {
dataSource.forEach(function (val) {
if (val.code == ele.parent) {
if (val.parent && val.parent == selectedKeys[0] && ele.name) {
checkedItem.push(ele);
}
}
});
}
});
this.props.changeRightContent(checkedItem);
}
}, {
key: "onExpand",
value: function onExpand(expandedKeys, e) {
if (e) {
this.props.setExpandedKeys(expandedKeys);
this.setState({
autoExpandParent: false
});
} else {
this.props.setExpandedKeys(expandedKeys);
this.setState({
autoExpandParent: true
});
}
}
}, {
key: "searchSelect",
value: function searchSelect(value, option) {
var selectData = this.state.selectData;
var expandedKeys = this.props.expandedKeys;
var currentData = selectData.find(function (item) {
return item.code == value;
});
var newExpandedKeys = [].concat(expandedKeys);
if (currentData && currentData.parent) {
var expandedKey = currentData.parent.toString();
if (newExpandedKeys.indexOf(expandedKey) === -1) newExpandedKeys.push(expandedKey);
}
this.setState({
currentSelect: value
});
this.onExpand(newExpandedKeys);
this.onSelect([value]);
}
}, {
key: "fetch",
value: function fetch(value, callback) {
var dataSource = this.selectDataSource;
var filterProps = this.state.filterProps;
var data = [];
dataSource.forEach(function (ele) {
filterProps.forEach(function (field) {
if (ele[field] && ele[field].indexOf(value) < 0) return;
data.push(ele);
});
});
callback(data);
}
}, {
key: "getSelectData",
value: function getSelectData(data, parent) {
data.forEach(function (ele) {
var item = {
parent: parent
};
for (var attr in ele) {
if (attr === 'children') {
item['haveChildren'] = true;
}
;
item[attr] = ele[attr];
}
this.selectDataSource.push(item);
if (ele.children) {
this.getSelectData(ele.children, ele.code);
}
}, this);
}
}, {
key: "onSearch",
value: function onSearch(value) {
var _this2 = this;
this.setState({
searchValue: value
});
this.fetch(value, function (selectData) {
return _this2.setState({
selectData: selectData
});
});
}
}, {
key: "getSearchOptions",
value: function getSearchOptions() {
var searchValue = this.state.searchValue;
if (searchValue == '') return;
var selectData = this.state.selectData;
var options = [];
selectData.forEach(function (ele) {
if (ele.name) {
options.push(_react["default"].createElement(Option, {
key: ele.code
}, ele.name));
}
}, this);
return options;
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var loop = function loop(data) {
return data.map(function (item) {
if (item.name) {
if (item.children) {
return _react["default"].createElement(TreeNode, {
data: item,
name: item.code,
title: item.name,
key: item.code,
disabled: _this3.props.isAuto,
className: _this3.state.currentSelect == item.code ? 'selectdata' : ''
}, loop(item.children));
}
return _react["default"].createElement(TreeNode, {
data: item,
name: item.code,
title: item.name,
key: item.code,
disabled: _this3.props.isAuto,
className: _this3.state.currentSelect == item.code ? 'selectdata' : ''
});
}
});
};
var treeNodes = loop(this.state.dataSource);
var treeProps = {
expandedKeys: this.props.expandedKeys,
selectedKeys: this.state.selectedKeys,
checkedKeys: this.props.checkedKeys,
autoExpandParent: this.state.autoExpandParent
};
var options = this.getSearchOptions();
return _react["default"].createElement("div", {
onClick: this.handleClick,
className: "bg-white border-r",
style: {
width: '265px',
height: '315px'
}
}, _react["default"].createElement("div", {
onClick: this.handleSearchClick,
className: "search-tree-2"
}, _react["default"].createElement(_baseui.Select, {
placeholder: "\u8BF7\u8F93\u5165\u5173\u952E\u5B57",
className: "comfunselect",
mode: "combobox",
value: this.state.searchValue,
notFoundContent: "\u554A\u54E6\uFF01\u6CA1\u6B64\u8282\u70B9\u54E6\uFF01",
onSelect: function onSelect(value, option) {
return _this3.searchSelect(value, option);
},
onSearch: function onSearch(value) {
return _this3.onSearch(value);
},
disabled: this.props.isAuto,
defaultActiveFirstOption: false,
showArrow: false,
filterOption: false,
onChange: this.handleChange,
dropdownMatchSelectWidth: false
}, options), _react["default"].createElement(_baseui.Button, {
icon: "search",
style: {
left: '220px',
top: '12px'
},
disabled: this.props.isAuto ? true : false
})), _react["default"].createElement("div", {
ref: "scrolltree",
onClick: this.handleTreeClick,
className: "search-tree-3",
style: {
height: '265px',
width: '100%',
overflow: 'auto'
}
}, _react["default"].createElement(_baseui.Tree, (0, _extends2["default"])({
key: treeNodes.length,
onExpand: function onExpand(expandedKeys, e) {
return _this3.onExpand(expandedKeys, e);
},
onSelect: function onSelect(selectedKeys, e) {
return _this3.onSelect(selectedKeys, e);
},
onCheck: this.onCheck,
checkable: true
}, treeProps), treeNodes)));
}
}]);
return SearchTreeControl;
}(_react["default"].Component);
;
var echartCommonFunctions = function (_Component) {
(0, _inherits2["default"])(echartCommonFunctions, _Component);
function echartCommonFunctions(props) {
var _this4;
(0, _classCallCheck2["default"])(this, echartCommonFunctions);
_this4 = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(echartCommonFunctions).call(this, props));
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this4), "setExpandedKeys", function (expandedKeys) {
_this4.setState({
expandedKeys: expandedKeys
});
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this4), "setCheckedKeys", function (checkedKeys) {
_this4.setState({
checkedKeys: checkedKeys
});
});
_this4.state = {
dataSource: [],
isAuto: true,
title: props.title || '常用功能',
style: _this4.props.style || {},
bShowModal: false,
searchTreeData: [],
items: [1, 2, 3, 4, 5, 6],
rightContentItems: [],
expandedKeys: [],
checkedKeys: []
};
return _this4;
}
(0, _createClass2["default"])(echartCommonFunctions, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this5 = this;
var proxy = cb.rest.DynamicProxy.create({
getCommon: {
url: 'commonfuctions/list',
method: 'GET'
}
});
proxy.getCommon(function (err, result) {
if (result) _this5.setState({
dataSource: result
});
});
}
}, {
key: "getIsSysCommFuncs",
value: function () {
var _getIsSysCommFuncs = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee() {
var config, json, rightContentItems, checkedKeys;
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
config = {
url: 'commonfuctions/isSysCommFuncs',
method: 'POST'
};
_context.next = 3;
return (0, _util.proxy)(config);
case 3:
json = _context.sent;
if (!(json.code !== 200)) {
_context.next = 7;
break;
}
cb.utils.alert('获取数据失败！' + json.message, 'error');
return _context.abrupt("return");
case 7:
this.setState({
isAuto: json.data
});
if (json.data == true) {
this.setState({
rightContentItems: [],
checkedKeys: []
});
} else {
rightContentItems = this.state.dataSource;
checkedKeys = [];
rightContentItems.forEach(function (ele) {
checkedKeys.push(ele.code);
});
this.setState({
rightContentItems: rightContentItems,
checkedKeys: checkedKeys
});
}
case 9:
case "end":
return _context.stop();
}
}
}, _callee, this);
}));
function getIsSysCommFuncs() {
return _getIsSysCommFuncs.apply(this, arguments);
}
return getIsSysCommFuncs;
}()
}, {
key: "getCommomFunctions",
value: function () {
var _getCommomFunctions = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee2() {
var config, json, checkedKeys, rightContentItems;
return _regenerator["default"].wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
config = {
url: 'commonfuctions/list',
method: 'GET'
};
_context2.next = 3;
return (0, _util.proxy)(config);
case 3:
json = _context2.sent;
if (!(json.code !== 200)) {
_context2.next = 7;
break;
}
cb.utils.alert('获取常用功能列表失败！' + json.message, 'error');
return _context2.abrupt("return");
case 7:
checkedKeys = [];
rightContentItems = [];
json.data.forEach(function (ele) {
checkedKeys.push(ele.code);
rightContentItems.push(ele);
});
this.setState({
dataSource: json.data
});
case 11:
case "end":
return _context2.stop();
}
}
}, _callee2, this);
}));
function getCommomFunctions() {
return _getCommomFunctions.apply(this, arguments);
}
return getCommomFunctions;
}()
}, {
key: "onSave",
value: function () {
var _onSave = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee3(bSystem, commonFuncList) {
var params, config, json;
return _regenerator["default"].wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
if (bSystem == true) {
params = {
bSystem: bSystem
};
} else {
params = {
bSystem: bSystem,
commonFuncList: commonFuncList
};
}
config = {
url: 'commonfuctions/setCommonFuncs',
method: 'POST',
params: params
};
_context3.next = 4;
return (0, _util.proxy)(config);
case 4:
json = _context3.sent;
if (!(json.code !== 200)) {
_context3.next = 8;
break;
}
cb.utils.alert('保存失败！' + json.message, 'error');
return _context3.abrupt("return");
case 8:
cb.utils.alert('保存成功！', 'success');
this.setState({
bShowModal: false
});
this.getCommomFunctions();
case 11:
case "end":
return _context3.stop();
}
}
}, _callee3, this);
}));
function onSave(_x, _x2) {
return _onSave.apply(this, arguments);
}
return onSave;
}()
}, {
key: "handleClick",
value: function handleClick(menuCode) {
var execHandler = this.props.execHandler;
execHandler(menuCode);
}
}, {
key: "getControl",
value: function getControl() {
var _this6 = this;
var dataSource = this.state.dataSource;
if (!dataSource.length) return null;
var items = [];
dataSource.forEach(function (item, index) {
var extraProps = {};
if (index === 0) extraProps.color = 'red';
items.push(_react["default"].createElement(_basic.Col, {
span: 6
}, _react["default"].createElement(_baseui.Tag, (0, _extends2["default"])({}, extraProps, {
onClick: function onClick() {
return _this6.handleClick(item.code);
}
}), item.name)));
});
return _react["default"].createElement(_basic.Row, null, items);
}
}, {
key: "handleOk",
value: function handleOk() {
var _this$state = this.state,
isAuto = _this$state.isAuto,
rightContentItems = _this$state.rightContentItems;
if (rightContentItems.length > 16) {
cb.utils.alert('最多选择16项菜单！', 'error');
return;
}
var commonFuncList = [];
rightContentItems.forEach(function (ele, index) {
commonFuncList.push({
code: ele.code,
iOrder: index + 1
});
});
if (isAuto == false && commonFuncList.length == 0) {
cb.utils.alert('请选择菜单！', 'error');
return;
}
this.onSave(isAuto, commonFuncList);
}
}, {
key: "handleCancel",
value: function handleCancel() {
this.setState({
bShowModal: false,
rightContentItems: [],
expandedKeys: []
});
}
}, {
key: "renderTreeNodes",
value: function renderTreeNodes(treeData) {
var _this7 = this;
return treeData.map(function (item) {
var children = item.children,
name = item.name,
code = item.code;
if (children) return _react["default"].createElement(TreeNode, {
title: name,
key: code
}, _this7.renderTreeNodes(children || []));
return _react["default"].createElement(TreeNode, {
title: name,
key: code,
isLeaf: true
});
});
}
}, {
key: "editAuto",
value: function editAuto(val) {
this.setState({
isAuto: val,
rightContentItems: [],
checkedKeys: []
});
}
}, {
key: "deleteItem",
value: function deleteItem(val) {
var rightContentItems = this.state.rightContentItems;
rightContentItems.splice(rightContentItems.indexOf(val), 1);
var checked = [];
rightContentItems.forEach(function (ele) {
checked.push(ele.code);
});
this.setState({
rightContentItems: rightContentItems,
checkedKeys: checked
});
}
}, {
key: "changeRightContent",
value: function changeRightContent(items) {
this.setState({
rightContentItems: items
});
}
}, {
key: "onRightContentDrag",
value: function onRightContentDrag(items) {
var rightContentItems = this.state.rightContentItems;
var afterDragItems = [];
items.forEach(function (ele, index) {
rightContentItems.forEach(function (val) {
if (val.code == ele) {
afterDragItems.push(val);
}
});
});
this.setState({
rightContentItems: afterDragItems
});
}
}, {
key: "getInnerRender",
value: function getInnerRender() {
var _this8 = this;
var _this$state2 = this.state,
isAuto = _this$state2.isAuto,
rightContentItems = _this$state2.rightContentItems,
expandedKeys = _this$state2.expandedKeys,
checkedKeys = _this$state2.checkedKeys,
bShowModal = _this$state2.bShowModal;
var treeData = this.props.tree.TreeData;
var leftContentRender = _react["default"].createElement(SearchTreeControl, {
dataSource: treeData,
changeRightContent: function changeRightContent(checkedItem) {
return _this8.changeRightContent(checkedItem);
},
expandedKeys: expandedKeys,
setExpandedKeys: this.setExpandedKeys,
checkedKeys: checkedKeys,
setCheckedKeys: this.setCheckedKeys,
isAuto: isAuto,
bShowModal: bShowModal
});
return _react["default"].createElement("div", null, _react["default"].createElement(_basic.Row, {
colCount: 12,
className: "crosstype"
}, _react["default"].createElement(_basic.Col, {
span: 5,
className: "crosscheckbox"
}, _react["default"].createElement(_baseui.Checkbox, {
checked: isAuto,
onChange: function onChange(e) {
return _this8.editAuto(e.target.checked);
}
}, "\u6839\u636E\u4F7F\u7528\u9891\u7387\u81EA\u52A8\u8BBE\u7F6E\u5E38\u7528\u529F\u80FD")), _react["default"].createElement(_basic.Col, {
span: 7
})), _react["default"].createElement(_basic.Row, {
colCount: 12
}, _react["default"].createElement(_basic.Col, {
span: 5,
className: "crossadddata"
}, _react["default"].createElement("div", null, _react["default"].createElement(_basic.Row, {
className: "crossaddnamemargin"
}, "\u9009\u62E9\u9700\u8981\u6DFB\u52A0\u81F3\u5E38\u7528\u529F\u80FD\u7684\u83DC\u5355"), _react["default"].createElement("div", {
className: "crossselectborder"
}, _react["default"].createElement(_basic.Row, {
className: "searchtree"
}, leftContentRender)))), _react["default"].createElement(_basic.Col, {
span: 2,
className: "crossbtncount"
}, _react["default"].createElement(_baseui.Button, {
className: "icon-right-disabled",
style: {
visibility: "hidden"
}
}), _react["default"].createElement(_baseui.Button, {
className: "icon-left-disabled",
style: {
visibility: "hidden"
}
})), _react["default"].createElement(_basic.Col, {
span: 5,
className: "selecteddata"
}, _react["default"].createElement("div", null, _react["default"].createElement(_basic.Row, {
className: "crossaddnamemargin"
}, "\u5DF2\u9009\u83DC\u5355", _react["default"].createElement("span", null, "\uFF08\u6700\u591A\u663E\u793A16\u9879\uFF09")), _react["default"].createElement("div", {
className: "crossselectborder",
style: {
overflow: 'auto'
}
}, _react["default"].createElement("div", null, _react["default"].createElement(_sortableList["default"], {
items: rightContentItems,
closeDisabled: isAuto,
onChange: function onChange(items) {
_this8.onRightContentDrag(items);
},
onDelete: function onDelete(val) {
_this8.deleteItem(val);
}
})))), _react["default"].createElement(_basic.Row, {
className: "selectattention"
}, "\u6309\u60A8\u559C\u6B22\u7684\u987A\u5E8F\u62D6\u653E\u83DC\u5355"))));
}
}, {
key: "getModalRender",
value: function getModalRender() {
var _this9 = this;
var content;
var card;
card = this.getInnerRender();
content = _react["default"].createElement(_baseui.Modal, {
className: "crossGroupingModal commonfunctions",
title: "\u5E38\u7528\u529F\u80FD\u8BBE\u7F6E",
onOk: function onOk(e) {
return _this9.handleOk(e);
},
onCancel: function onCancel(e) {
return _this9.handleCancel(e);
},
visible: this.state.bShowModal
}, card);
return content;
}
}, {
key: "showModal",
value: function showModal() {
this.getIsSysCommFuncs();
this.setState({
bShowModal: true
});
}
}, {
key: "render",
value: function render() {
var _this10 = this;
var settingCard = this.getModalRender();
var control = this.getControl();
var button = _react["default"].createElement(_baseui.Icon, {
type: "changyonggongnengshezhi",
style: {
cursor: "pointer"
},
onClick: function onClick() {
return _this10.showModal();
}
});
return _react["default"].createElement("div", {
className: "home-panel-5 home-panel-6"
}, _react["default"].createElement(_baseui.Card, {
title: this.state.title,
bordered: false,
style: this.state.style,
extra: button
}, control), _react["default"].createElement("div", {
className: "groupCondition"
}, settingCard));
}
}]);
return echartCommonFunctions;
}(_react.Component);
function mapStateToProps(state) {
return {
tree: state.tree.toJS()
};
}
function mapDispatchToProps(dispatch) {
return {
execHandler: (0, _redux.bindActionCreators)(_tree.execHandler, dispatch)
};
}
var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(echartCommonFunctions);
exports["default"] = _default;
//# sourceMappingURL=echartCommonFunctions.js.map