@choerodon/master
Version:
A package of Master for Choerodon platform.
654 lines (553 loc) • 24.4 kB
JavaScript
import "choerodon-ui/pro/lib/message/style";
import _message from "choerodon-ui/pro/lib/message";
import "choerodon-ui/pro/lib/text-field/style";
import _TextField from "choerodon-ui/pro/lib/text-field";
import "choerodon-ui/lib/icon/style";
import _Icon from "choerodon-ui/lib/icon";
import "choerodon-ui/lib/tooltip/style";
import _Tooltip from "choerodon-ui/lib/tooltip";
import "choerodon-ui/lib/button/style";
import _Button from "choerodon-ui/lib/button";
import "choerodon-ui/pro/lib/modal/style";
import _Modal from "choerodon-ui/pro/lib/modal";
import "choerodon-ui/pro/lib/select/style";
import _Select from "choerodon-ui/pro/lib/select";
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
import React, { useContext, useEffect, useRef, useCallback, Fragment } from 'react';
import queryString from 'query-string';
import { observer } from 'mobx-react-lite';
import { prompt, historyPushMenu } from "../../../../../utils";
import Store from "./stores";
import List from "./List";
import findFirstLeafMenu from "../../../util/findFirstLeafMenu";
import FormView from "./FormView";
import { axios } from "../../../../../index";
import { Content, Page } from "../../../../../components/c7n-page";
import { Permission } from "../../../../../components/permission";
import "./style/index.less";
var Option = _Select.Option;
var modalKey = _Modal.key();
var createModalKey = _Modal.key();
var modalStyle = {
width: '3.8rem'
};
var iconStyle = {
fontSize: '16px',
marginLeft: '.11rem'
};
var ListView = observer(function () {
var context = useContext(Store);
var cancelCreate = useRef(false);
var dataSet = context.dataSet,
showType = context.showType,
toggleShowType = context.toggleShowType,
isNotRecent = context.isNotRecent,
toggleRecent = context.toggleRecent,
setAuto = context.setAuto,
HeaderStore = context.HeaderStore,
MenuStore = context.MenuStore,
history = context.history,
AppState = context.AppState,
projectStore = context.projectStore,
formatMessage = context.intl.formatMessage;
var recents = HeaderStore.getRecentItem;
var getCanCreate = projectStore.getCanCreate;
var checkRecentIsEmpty = useCallback(function (_ref) {
var ds = _ref.dataSet;
if (!ds.find(function (r) {
return recents.find(function (v) {
return v.id === r.get('id');
});
})) {
toggleRecent('all');
} else {
toggleRecent('recent');
}
}, [dataSet]);
function filterRecent(record, type) {
if (type === 'all') {
return true;
}
if (type === 'recent') {
return !!recents.find(function (v) {
return v.id === record.get('id');
});
}
return record.get('createdBy') === AppState.getUserId;
}
function realData(type) {
return dataSet.filter(function (r) {
return filterRecent(r, type);
});
}
useEffect(function () {
dataSet.addEventListener('load', checkRecentIsEmpty);
}, []);
function handleCreate() {
return _handleCreate.apply(this, arguments);
}
function _handleCreate() {
_handleCreate = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
var organizationId, current, _current$toData, category, code, name, imageUrl, data, res;
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
organizationId = AppState.currentMenuType.organizationId;
current = dataSet.current;
_context.next = 4;
return current.validate();
case 4:
_context.t0 = _context.sent;
if (!(_context.t0 === true)) {
_context.next = 19;
break;
}
_current$toData = current.toData(), category = _current$toData.category, code = _current$toData.code, name = _current$toData.name, imageUrl = _current$toData.imageUrl;
data = {
name: name,
code: code,
category: category,
imageUrl: imageUrl
};
_context.next = 10;
return axios.post("/iam/choerodon/v1/organizations/".concat(organizationId, "/projects"), data);
case 10:
res = _context.sent;
if (!res.failed) {
_context.next = 14;
break;
}
prompt(res.message);
return _context.abrupt("return", false);
case 14:
prompt('创建成功');
HeaderStore.setRecentItem(res);
dataSet.query();
projectStore.checkCreate(organizationId);
return _context.abrupt("return", true);
case 19:
case "end":
return _context.stop();
}
}
}, _callee);
}));
return _handleCreate.apply(this, arguments);
}
function handleOkEdit() {
return _handleOkEdit.apply(this, arguments);
}
function _handleOkEdit() {
_handleOkEdit = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
return regeneratorRuntime.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
if (!(dataSet.current.status === 'add')) {
_context2.next = 5;
break;
}
_context2.next = 3;
return handleCreate();
case 3:
_context2.t0 = _context2.sent;
return _context2.abrupt("return", _context2.t0 === true);
case 5:
_context2.prev = 5;
_context2.next = 8;
return dataSet.submit();
case 8:
_context2.t1 = _context2.sent;
if (!(_context2.t1 !== false)) {
_context2.next = 13;
break;
}
dataSet.query();
_context2.next = 14;
break;
case 13:
return _context2.abrupt("return", false);
case 14:
_context2.next = 19;
break;
case 16:
_context2.prev = 16;
_context2.t2 = _context2["catch"](5);
return _context2.abrupt("return", false);
case 19:
case "end":
return _context2.stop();
}
}
}, _callee2, null, [[5, 16]]);
}));
return _handleOkEdit.apply(this, arguments);
}
function handleCancel() {
var current = dataSet.current;
current.reset();
}
function handleCancelCreate() {
cancelCreate.current = true;
}
function handleRomove() {
if (!cancelCreate.current) {
return;
}
var current = dataSet.current;
if (current.status === 'add') {
dataSet.remove(current);
} else {
current.reset();
}
cancelCreate.current = false;
}
function handleCreateProject() {
dataSet.create();
_Modal.open({
key: createModalKey,
drawer: true,
title: '创建项目',
className: 'c7n-projects-modal-create-project',
children: /*#__PURE__*/React.createElement(FormView, {
context: context
}),
onOk: handleOkEdit,
onCancel: handleCancelCreate,
afterClose: handleRomove,
style: modalStyle
});
}
function handleEditProject() {
_Modal.open({
key: modalKey,
drawer: true,
title: '项目设置',
children: /*#__PURE__*/React.createElement(FormView, {
context: context
}),
onOk: handleOkEdit,
onCancel: handleCancel,
style: modalStyle
});
}
function handleEnabledProject() {
return _handleEnabledProject.apply(this, arguments);
}
function _handleEnabledProject() {
_handleEnabledProject = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
var current, _current$toData2, id, organizationId, enabled, name, category, categories, isSubProject, okProps, ModalContent, result;
return regeneratorRuntime.wrap(function _callee5$(_context5) {
while (1) {
switch (_context5.prev = _context5.next) {
case 0:
current = dataSet.current;
_context5.prev = 1;
_current$toData2 = current.toData(), id = _current$toData2.id, organizationId = _current$toData2.organizationId, enabled = _current$toData2.enabled, name = _current$toData2.name, category = _current$toData2.category, categories = _current$toData2.categories;
isSubProject = categories.some(function (c) {
return c.code === 'PROGRAM_PROJECT';
});
okProps = {
disabled: true,
color: 'red',
style: {
width: '100%',
border: '1px solid rgba(27,31,35,.2)',
height: 36,
marginTop: -26
}
};
ModalContent = function ModalContent(_ref2) {
var modal = _ref2.modal;
var extraMessage;
if (category === 'PROGRAM') {
extraMessage = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-enable-tips"
}, "\u8B66\u544A\uFF1A\u9879\u76EE\u7FA4\u505C\u7528\u540E\uFF0CART\u5C06\u81EA\u52A8\u505C\u6B62\uFF0C\u5B50\u9879\u76EE\u548C\u9879\u76EE\u7FA4\u7684\u5173\u8054\u4E5F\u5C06\u81EA\u52A8\u505C\u7528\uFF0C\u5B50\u9879\u76EE\u7684\u8FED\u4EE3\u8282\u594F\u3001\u8FED\u4EE3\u89C4\u5212\u4E0D\u518D\u53D7\u5230ART\u7684\u7EDF\u4E00\u7BA1\u7406\u3002ART\u4E0B\u8FDB\u884C\u4E2D\u7684PI\u5C06\u76F4\u63A5\u5B8C\u6210\uFF0C\u672A\u5B8C\u6210\u7684PI\u5C06\u4F1A\u5220\u9664\uFF0C\u672A\u5B8C\u6210\u7684\u7279\u6027\u5C06\u4F1A\u79FB\u52A8\u81F3\u5F85\u529E\u3002\u5B50\u9879\u76EE\u8FDB\u884C\u4E2D\u7684\u8FED\u4EE3\u4F1A\u76F4\u63A5\u5B8C\u6210\uFF0C\u672A\u5F00\u59CB\u7684\u51B2\u523A\u5C06\u4F1A\u5220\u9664\uFF0C\u672A\u5B8C\u6210\u7684\u95EE\u9898\u5C06\u4F1A\u79FB\u52A8\u81F3\u5F85\u529E\u3002\u8BF7\u8C28\u614E\u64CD\u4F5C\uFF01"), /*#__PURE__*/React.createElement("div", {
style: {
marginTop: 10
}
}, "\u8BF7\u8F93\u5165", ' ', /*#__PURE__*/React.createElement("span", {
style: {
fontWeight: 600
}
}, name), ' ', "\u6765\u786E\u8BA4\u505C\u7528\u3002"), /*#__PURE__*/React.createElement(_TextField, {
style: {
width: '100%',
marginTop: 10
},
autoFocus: true,
onInput: function onInput(e) {
modal.update({
okProps: _objectSpread(_objectSpread({}, okProps), {}, {
disabled: e.target.value !== name
})
});
}
}));
} else if (isSubProject) {
extraMessage = /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-enable-tips"
}, "\u8B66\u544A\uFF1A\u5B50\u9879\u76EE\u505C\u7528\u540E\uFF0C\u4E0E\u9879\u76EE\u7FA4\u76F8\u5173\u7684\u51B2\u523A\u5C06\u53D1\u751F\u53D8\u52A8\uFF0C\u8FDB\u884C\u4E2D\u7684\u51B2\u523A\u4F1A\u76F4\u63A5\u5B8C\u6210\uFF0C\u672A\u5F00\u59CB\u7684\u51B2\u523A\u5C06\u4F1A\u5220\u9664\uFF0C\u672A\u5B8C\u6210\u7684\u95EE\u9898\u5C06\u4F1A\u79FB\u52A8\u81F3\u5F85\u529E\u3002\u8BF7\u8C28\u614E\u64CD\u4F5C\uFF01");
}
var content = /*#__PURE__*/React.createElement("div", {
style: {
marginTop: -10
}
}, category === 'PROGRAM' && /*#__PURE__*/React.createElement("p", {
style: {
marginBottom: 14,
background: '#fffbdd',
padding: '15px 26px',
border: '1px solid rgba(27,31,35,.15)',
width: 'calc(100% + 49px)',
marginLeft: -25
}
}, "\u8BF7\u4ED4\u7EC6\u9605\u8BFB\u4E0B\u5217\u4E8B\u9879\uFF01"), /*#__PURE__*/React.createElement("span", null, "\u786E\u5B9A\u8981\u505C\u7528\u9879\u76EE\u201C", name, "\u201D\u5417\uFF1F\u505C\u7528\u540E\uFF0C\u60A8\u548C\u9879\u76EE\u4E0B\u5176\u4ED6\u6210\u5458\u5C06\u65E0\u6CD5\u8FDB\u5165\u6B64\u9879\u76EE\u3002"), extraMessage);
return content;
};
if (!enabled) {
_context5.next = 10;
break;
}
if (category === 'PROGRAM') {
_Modal.open({
title: '停用项目',
children: /*#__PURE__*/React.createElement(ModalContent, null),
onOk: function () {
var _onOk = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
var result;
return regeneratorRuntime.wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.prev = 0;
_context3.next = 3;
return axios.put("/iam/choerodon/v1/organizations/".concat(organizationId, "/projects/").concat(id, "/disable"));
case 3:
result = _context3.sent;
if (!result.failed) {
_context3.next = 6;
break;
}
throw result.message;
case 6:
dataSet.query();
_context3.next = 13;
break;
case 9:
_context3.prev = 9;
_context3.t0 = _context3["catch"](0);
_message.error(_context3.t0);
return _context3.abrupt("return", false);
case 13:
case "end":
return _context3.stop();
}
}
}, _callee3, null, [[0, 9]]);
}));
function onOk() {
return _onOk.apply(this, arguments);
}
return onOk;
}(),
okProps: okProps,
okText: '我已经知道后果，停用此项目',
closable: true,
footer: function footer(okBtn) {
return okBtn;
}
});
} else {
_Modal.open({
title: '停用项目',
children: /*#__PURE__*/React.createElement(ModalContent, null),
onOk: function () {
var _onOk2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
var result;
return regeneratorRuntime.wrap(function _callee4$(_context4) {
while (1) {
switch (_context4.prev = _context4.next) {
case 0:
_context4.prev = 0;
_context4.next = 3;
return axios.put("/iam/choerodon/v1/organizations/".concat(organizationId, "/projects/").concat(id, "/disable"));
case 3:
result = _context4.sent;
if (!result.failed) {
_context4.next = 6;
break;
}
throw result.message;
case 6:
dataSet.query();
_context4.next = 13;
break;
case 9:
_context4.prev = 9;
_context4.t0 = _context4["catch"](0);
_message.error(_context4.t0);
return _context4.abrupt("return", false);
case 13:
case "end":
return _context4.stop();
}
}
}, _callee4, null, [[0, 9]]);
}));
function onOk() {
return _onOk2.apply(this, arguments);
}
return onOk;
}()
});
}
_context5.next = 22;
break;
case 10:
_context5.prev = 10;
_context5.next = 13;
return axios.put("/iam/choerodon/v1/organizations/".concat(organizationId, "/projects/").concat(id, "/enable"));
case 13:
result = _context5.sent;
if (!result.failed) {
_context5.next = 16;
break;
}
throw result.message;
case 16:
_context5.next = 22;
break;
case 18:
_context5.prev = 18;
_context5.t0 = _context5["catch"](10);
_message.error(_context5.t0);
return _context5.abrupt("return", false);
case 22:
dataSet.query();
_context5.next = 28;
break;
case 25:
_context5.prev = 25;
_context5.t1 = _context5["catch"](1);
return _context5.abrupt("return", false);
case 28:
case "end":
return _context5.stop();
}
}
}, _callee5, null, [[1, 25], [10, 18]]);
}));
return _handleEnabledProject.apply(this, arguments);
}
function handleChangeRecent(value) {
setAuto(false);
toggleRecent(value);
}
function handleClickProject(record) {
var _record$toData = record.toData(),
id = _record$toData.id,
name = _record$toData.name,
organizationId = _record$toData.organizationId,
category = _record$toData.category;
var type = 'project';
HeaderStore.setRecentItem(record.toData());
MenuStore.loadMenuData({
type: type,
id: id
}, false).then(function (menus) {
var route = '';
var path;
var domain;
if (menus.length) {
var _findFirstLeafMenu = findFirstLeafMenu(menus[0]),
menuRoute = _findFirstLeafMenu.route,
menuDomain = _findFirstLeafMenu.domain;
route = menuRoute;
domain = menuDomain;
} // if (route) {
path = "".concat(route, "?type=").concat(type, "&id=").concat(id, "&name=").concat(encodeURIComponent(name)).concat(category ? "&category=".concat(category) : '');
if (String(organizationId)) {
path += "&organizationId=".concat(organizationId);
} // }
if (path) {
historyPushMenu(history, path, domain);
}
});
}
function renderHeader() {
var _queryString$parse = queryString.parse(history.location.search),
organizationId = _queryString$parse.organizationId;
var org = (HeaderStore.getOrgData || []).find(function (v) {
return String(v.id) === organizationId;
}) || {
name: ''
};
return /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-header"
}, /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-title"
}, "".concat(org.name, "\u4E2D\u7684\u9879\u76EE")), /*#__PURE__*/React.createElement(Permission, {
service: ['choerodon.code.organization.project.ps.create']
}, /*#__PURE__*/React.createElement(_Tooltip, {
title: getCanCreate ? '' : '项目数量已达上限，无法创建更多项目',
placement: "bottom"
}, /*#__PURE__*/React.createElement(_Button, {
type: "primary",
funcType: "raised",
disabled: !getCanCreate,
onClick: handleCreateProject
}, "\u521B\u5EFA\u9879\u76EE"))));
}
function renderTool() {
return /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-tool"
}, /*#__PURE__*/React.createElement(_Select, {
labelLayout: "float",
label: "\u9879\u76EE",
clearButton: false,
value: isNotRecent,
onChange: handleChangeRecent,
style: {
width: 260
}
}, (realData('recent').length > 0 || dataSet.queryDataSet.length > 0) && /*#__PURE__*/React.createElement(Option, {
key: "recent",
value: "recent"
}, "\u6700\u8FD1\u4F7F\u7528"), /*#__PURE__*/React.createElement(Option, {
key: "all",
value: "all"
}, "\u5168\u90E8\u9879\u76EE"), (realData('mine').length > 0 || dataSet.queryDataSet.length > 0) && /*#__PURE__*/React.createElement(Option, {
key: "mine",
value: "mine"
}, "\u6211\u521B\u5EFA\u7684")), /*#__PURE__*/React.createElement("div", {
className: "c7n-projects-tool-icon-group"
}, /*#__PURE__*/React.createElement(_Icon, {
type: "dashboard",
style: iconStyle,
className: showType === 'block' ? 'active' : null,
onClick: function onClick() {
return toggleShowType('block');
}
}), /*#__PURE__*/React.createElement(_Icon, {
type: "format_list_bulleted",
style: iconStyle,
className: showType === 'table' ? 'active' : null,
onClick: function onClick() {
return toggleShowType('table');
}
})));
}
return /*#__PURE__*/React.createElement(Page, null, renderHeader(), /*#__PURE__*/React.createElement(Content, null, renderTool(), /*#__PURE__*/React.createElement(List, {
handleClickProject: handleClickProject,
handleEditProject: handleEditProject,
handleEnabledProject: handleEnabledProject
})));
});
export default ListView;