@giteeteam/apps-team-components 1.2.2 → 1.2.3-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -28
- package/dist/components/common/PriceTag.js +18 -18
- package/dist/components/common/overflow-tooltip/style/index.js +13 -13
- package/dist/components/common/style/global.js +2 -2
- package/dist/components/common/user-field/style/index.js +21 -21
- package/dist/components/fields/bind-workspace/style/index.js +3 -3
- package/dist/components/fields/hyper-link/style/index.js +14 -14
- package/dist/components/fields/long-text/style/index.js +5 -5
- package/dist/components/fields/priority/style/index.js +50 -50
- package/dist/components/fields/status/SelectTransition.js +105 -5
- package/dist/components/fields/status/TransitionButton.d.ts +5 -21
- package/dist/components/fields/status/TransitionButton.js +8 -99
- package/dist/components/fields/status/style/index.js +323 -323
- package/dist/components/fields/tag/style/index.js +5 -5
- package/dist/components/fields/team/style/index.js +2 -2
- package/dist/components/fields/user/style/index.js +8 -8
- package/dist/components/table-components/style/index.js +5 -5
- package/dist/icons/svg/DottedCircle.svg +7 -7
- package/dist/icons/svg/HollowCircle.svg +6 -6
- package/dist/icons/svg/Workflow.svg +12 -12
- package/dist/lib/contexts/workflowConfig.d.ts +2 -0
- package/dist/lib/workflow.d.ts +1 -0
- package/dist/lib/workflow.js +104 -19
- package/package.json +69 -69
package/README.md
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
# @giteeteam/apps-team-components
|
|
2
|
-
|
|
3
|
-
- gitee team components
|
|
4
|
-
|
|
5
|
-
## 注意
|
|
6
|
-
插件使用需要加上speedy:false,防止切换应用时css会丢失
|
|
7
|
-
|
|
8
|
-
```jsx
|
|
9
|
-
import { LibraryProvider } from "@giteeteam/apps-team-components";
|
|
10
|
-
|
|
11
|
-
const Demo = ({children}) => {
|
|
12
|
-
return (
|
|
13
|
-
<LibraryProvider emotionCacheOptions={{ key: "appKey", speedy: false }}>
|
|
14
|
-
{children}
|
|
15
|
-
</LibraryProvider>
|
|
16
|
-
)
|
|
17
|
-
}
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
## TODO
|
|
21
|
-
- SimpleOverflowTooltip 统一为 BaseOverflowToolTip 导出
|
|
22
|
-
- 去除 BaseOverflowToolTip 的 maxline
|
|
23
|
-
|
|
24
|
-
# 1.1.x版本
|
|
25
|
-
- team最低版本为4.16.0
|
|
26
|
-
|
|
27
|
-
# 1.2.x版本
|
|
28
|
-
- team最低版本为4.21.0
|
|
1
|
+
# @giteeteam/apps-team-components
|
|
2
|
+
|
|
3
|
+
- gitee team components
|
|
4
|
+
|
|
5
|
+
## 注意
|
|
6
|
+
插件使用需要加上speedy:false,防止切换应用时css会丢失
|
|
7
|
+
|
|
8
|
+
```jsx
|
|
9
|
+
import { LibraryProvider } from "@giteeteam/apps-team-components";
|
|
10
|
+
|
|
11
|
+
const Demo = ({children}) => {
|
|
12
|
+
return (
|
|
13
|
+
<LibraryProvider emotionCacheOptions={{ key: "appKey", speedy: false }}>
|
|
14
|
+
{children}
|
|
15
|
+
</LibraryProvider>
|
|
16
|
+
)
|
|
17
|
+
}
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## TODO
|
|
21
|
+
- SimpleOverflowTooltip 统一为 BaseOverflowToolTip 导出
|
|
22
|
+
- 去除 BaseOverflowToolTip 的 maxline
|
|
23
|
+
|
|
24
|
+
# 1.1.x版本
|
|
25
|
+
- team最低版本为4.16.0
|
|
26
|
+
|
|
27
|
+
# 1.2.x版本
|
|
28
|
+
- team最低版本为4.21.0
|
|
@@ -3,26 +3,26 @@ import { useMemo } from 'react';
|
|
|
3
3
|
import { ClassNames } from '@emotion/react';
|
|
4
4
|
import { i18n } from '../../lib/i18n';
|
|
5
5
|
import SimpleOverflowToolTip from './overflow-tooltip/SimpleOverflowToolTip';
|
|
6
|
-
export const containerStyle = `
|
|
7
|
-
display: inline-flex;
|
|
8
|
-
align-items: center;
|
|
9
|
-
max-width: 100%;
|
|
6
|
+
export const containerStyle = `
|
|
7
|
+
display: inline-flex;
|
|
8
|
+
align-items: center;
|
|
9
|
+
max-width: 100%;
|
|
10
10
|
`;
|
|
11
|
-
export const textStyle = `
|
|
12
|
-
flex: 1;
|
|
13
|
-
width: 0;
|
|
11
|
+
export const textStyle = `
|
|
12
|
+
flex: 1;
|
|
13
|
+
width: 0;
|
|
14
14
|
`;
|
|
15
|
-
export const tagStyle = `
|
|
16
|
-
height: 18px;
|
|
17
|
-
padding: 0 4px;
|
|
18
|
-
margin-left: 8px;
|
|
19
|
-
font-size: 12px;
|
|
20
|
-
font-weight: 500;
|
|
21
|
-
line-height: 18px;
|
|
22
|
-
color: #fff;
|
|
23
|
-
background: linear-gradient(230deg, #66dbff 0%, #3683ff 100%);
|
|
24
|
-
border-radius: 5px 0;
|
|
25
|
-
white-space: nowrap;
|
|
15
|
+
export const tagStyle = `
|
|
16
|
+
height: 18px;
|
|
17
|
+
padding: 0 4px;
|
|
18
|
+
margin-left: 8px;
|
|
19
|
+
font-size: 12px;
|
|
20
|
+
font-weight: 500;
|
|
21
|
+
line-height: 18px;
|
|
22
|
+
color: #fff;
|
|
23
|
+
background: linear-gradient(230deg, #66dbff 0%, #3683ff 100%);
|
|
24
|
+
border-radius: 5px 0;
|
|
25
|
+
white-space: nowrap;
|
|
26
26
|
`;
|
|
27
27
|
export const PriceTag = ({ text, className, edition, expired }) => {
|
|
28
28
|
const isTagVisible = useMemo(() => {
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
export const tooltipOverflowStyle = `
|
|
2
|
-
display: -webkit-box;
|
|
3
|
-
overflow: hidden;
|
|
4
|
-
text-overflow: ellipsis;
|
|
5
|
-
word-break: break-all;
|
|
6
|
-
white-space: pre-line !important;
|
|
7
|
-
-webkit-box-orient: vertical;
|
|
1
|
+
export const tooltipOverflowStyle = `
|
|
2
|
+
display: -webkit-box;
|
|
3
|
+
overflow: hidden;
|
|
4
|
+
text-overflow: ellipsis;
|
|
5
|
+
word-break: break-all;
|
|
6
|
+
white-space: pre-line !important;
|
|
7
|
+
-webkit-box-orient: vertical;
|
|
8
8
|
`;
|
|
9
|
-
export const simpleTooltipStyle = `
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
text-overflow: ellipsis;
|
|
12
|
-
white-space: nowrap;
|
|
9
|
+
export const simpleTooltipStyle = `
|
|
10
|
+
overflow: hidden;
|
|
11
|
+
text-overflow: ellipsis;
|
|
12
|
+
white-space: nowrap;
|
|
13
13
|
`;
|
|
14
14
|
export const getTooltipMaxlineStyle = (n) => {
|
|
15
|
-
return `
|
|
16
|
-
-webkit-line-clamp: ${n};
|
|
15
|
+
return `
|
|
16
|
+
-webkit-line-clamp: ${n};
|
|
17
17
|
`;
|
|
18
18
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export const fieldValueOverlayStyle = `
|
|
2
|
-
width: 100%;
|
|
1
|
+
export const fieldValueOverlayStyle = `
|
|
2
|
+
width: 100%;
|
|
3
3
|
`;
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
const avatarSize = '20px';
|
|
2
|
-
export const avatarItemStyle = `
|
|
3
|
-
flex-shrink: 0;
|
|
2
|
+
export const avatarItemStyle = `
|
|
3
|
+
flex-shrink: 0;
|
|
4
4
|
`;
|
|
5
|
-
export const avatarStyle = `
|
|
6
|
-
display: inline-block;
|
|
7
|
-
width: ${avatarSize};
|
|
8
|
-
height: ${avatarSize};
|
|
9
|
-
margin-right: 3px;
|
|
10
|
-
vertical-align: middle;
|
|
11
|
-
background: #fff center/contain no-repeat;
|
|
12
|
-
border-radius: 50%;
|
|
5
|
+
export const avatarStyle = `
|
|
6
|
+
display: inline-block;
|
|
7
|
+
width: ${avatarSize};
|
|
8
|
+
height: ${avatarSize};
|
|
9
|
+
margin-right: 3px;
|
|
10
|
+
vertical-align: middle;
|
|
11
|
+
background: #fff center/contain no-repeat;
|
|
12
|
+
border-radius: 50%;
|
|
13
13
|
`;
|
|
14
|
-
export const defaultAvatarStyle = `
|
|
15
|
-
display: inline-flex;
|
|
16
|
-
align-items: center;
|
|
17
|
-
justify-content: center;
|
|
18
|
-
width: ${avatarSize};
|
|
19
|
-
height: ${avatarSize};
|
|
20
|
-
margin-right: 6px;
|
|
21
|
-
font-size: 12px;
|
|
22
|
-
color: #fff;
|
|
23
|
-
background: #5243aa;
|
|
24
|
-
border-radius: 50%;
|
|
14
|
+
export const defaultAvatarStyle = `
|
|
15
|
+
display: inline-flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
justify-content: center;
|
|
18
|
+
width: ${avatarSize};
|
|
19
|
+
height: ${avatarSize};
|
|
20
|
+
margin-right: 6px;
|
|
21
|
+
font-size: 12px;
|
|
22
|
+
color: #fff;
|
|
23
|
+
background: #5243aa;
|
|
24
|
+
border-radius: 50%;
|
|
25
25
|
`;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export const pointerStyle = `
|
|
2
|
-
color: #0c62ff;
|
|
3
|
-
cursor: pointer;
|
|
1
|
+
export const pointerStyle = `
|
|
2
|
+
color: #0c62ff;
|
|
3
|
+
cursor: pointer;
|
|
4
4
|
`;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { blue6 } from '../../../../style/common';
|
|
2
|
-
export const hyperLinkListStyle = `
|
|
3
|
-
display: flex;
|
|
4
|
-
width: 100%;
|
|
2
|
+
export const hyperLinkListStyle = `
|
|
3
|
+
display: flex;
|
|
4
|
+
width: 100%;
|
|
5
5
|
`;
|
|
6
|
-
export const hyperLinkItemStyle = `
|
|
7
|
-
${hyperLinkListStyle} & {
|
|
8
|
-
overflow: hidden;
|
|
9
|
-
color: @blue-6;
|
|
10
|
-
text-overflow: ellipsis;
|
|
11
|
-
white-space: nowrap;
|
|
12
|
-
-webkit-line-clamp: 1;
|
|
13
|
-
}
|
|
6
|
+
export const hyperLinkItemStyle = `
|
|
7
|
+
${hyperLinkListStyle} & {
|
|
8
|
+
overflow: hidden;
|
|
9
|
+
color: @blue-6;
|
|
10
|
+
text-overflow: ellipsis;
|
|
11
|
+
white-space: nowrap;
|
|
12
|
+
-webkit-line-clamp: 1;
|
|
13
|
+
}
|
|
14
14
|
`;
|
|
15
|
-
export const hyperLinkTipItem = `
|
|
16
|
-
display: block;
|
|
17
|
-
color: ${blue6};
|
|
15
|
+
export const hyperLinkTipItem = `
|
|
16
|
+
display: block;
|
|
17
|
+
color: ${blue6};
|
|
18
18
|
`;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export const whiteSpacePreStyle = `
|
|
2
|
-
padding-top: 5px;
|
|
3
|
-
padding-bottom: 5px;
|
|
4
|
-
word-break: break-all;
|
|
5
|
-
white-space: pre-wrap;
|
|
1
|
+
export const whiteSpacePreStyle = `
|
|
2
|
+
padding-top: 5px;
|
|
3
|
+
padding-bottom: 5px;
|
|
4
|
+
word-break: break-all;
|
|
5
|
+
white-space: pre-wrap;
|
|
6
6
|
`;
|
|
@@ -1,58 +1,58 @@
|
|
|
1
1
|
import { fieldLabelColor } from '../../../../style/common';
|
|
2
|
-
export const cellBoxStyle = (antPrefix) => `
|
|
3
|
-
display: flex;
|
|
4
|
-
align-items: center;
|
|
5
|
-
line-height: unset;
|
|
6
|
-
|
|
7
|
-
.${antPrefix}-dropdown-menu-title-content {
|
|
8
|
-
display: flex;
|
|
9
|
-
align-items: center;
|
|
10
|
-
max-width: 150px;
|
|
11
|
-
|
|
12
|
-
.anticon {
|
|
13
|
-
flex-shrink: 0;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
& > span {
|
|
17
|
-
white-space: pre-line;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
2
|
+
export const cellBoxStyle = (antPrefix) => `
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
line-height: unset;
|
|
6
|
+
|
|
7
|
+
.${antPrefix}-dropdown-menu-title-content {
|
|
8
|
+
display: flex;
|
|
9
|
+
align-items: center;
|
|
10
|
+
max-width: 150px;
|
|
11
|
+
|
|
12
|
+
.anticon {
|
|
13
|
+
flex-shrink: 0;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
& > span {
|
|
17
|
+
white-space: pre-line;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
20
|
`;
|
|
21
|
-
export const headerCellStyle = `
|
|
22
|
-
max-width: 120px;
|
|
23
|
-
height: 24px;
|
|
24
|
-
padding: 0 8px;
|
|
25
|
-
font-size: 12px;
|
|
26
|
-
font-weight: 600;
|
|
27
|
-
line-height: 24px;
|
|
28
|
-
color: #213053;
|
|
29
|
-
text-align: center;
|
|
30
|
-
background-color: #f5f6f8;
|
|
31
|
-
border-radius: 4px;
|
|
21
|
+
export const headerCellStyle = `
|
|
22
|
+
max-width: 120px;
|
|
23
|
+
height: 24px;
|
|
24
|
+
padding: 0 8px;
|
|
25
|
+
font-size: 12px;
|
|
26
|
+
font-weight: 600;
|
|
27
|
+
line-height: 24px;
|
|
28
|
+
color: #213053;
|
|
29
|
+
text-align: center;
|
|
30
|
+
background-color: #f5f6f8;
|
|
31
|
+
border-radius: 4px;
|
|
32
32
|
`;
|
|
33
|
-
export const emptyTextStyle = `
|
|
34
|
-
display: flex;
|
|
35
|
-
align-items: center;
|
|
36
|
-
width: 100%;
|
|
37
|
-
height: 100%;
|
|
33
|
+
export const emptyTextStyle = `
|
|
34
|
+
display: flex;
|
|
35
|
+
align-items: center;
|
|
36
|
+
width: 100%;
|
|
37
|
+
height: 100%;
|
|
38
38
|
`;
|
|
39
|
-
export const colorIconStyle = `
|
|
40
|
-
margin-right: 5px;
|
|
41
|
-
font-size: 12px;
|
|
39
|
+
export const colorIconStyle = `
|
|
40
|
+
margin-right: 5px;
|
|
41
|
+
font-size: 12px;
|
|
42
42
|
`;
|
|
43
|
-
export const emptyStyle = `
|
|
44
|
-
color: ${fieldLabelColor};
|
|
43
|
+
export const emptyStyle = `
|
|
44
|
+
color: ${fieldLabelColor};
|
|
45
45
|
`;
|
|
46
|
-
export const emptyIconStyle = `
|
|
47
|
-
margin-right: 5px;
|
|
48
|
-
font-size: 12px!important;
|
|
49
|
-
width: 12px!important;
|
|
50
|
-
margin-left: 0!important;
|
|
46
|
+
export const emptyIconStyle = `
|
|
47
|
+
margin-right: 5px;
|
|
48
|
+
font-size: 12px!important;
|
|
49
|
+
width: 12px!important;
|
|
50
|
+
margin-left: 0!important;
|
|
51
51
|
`;
|
|
52
|
-
export const downIconStyle = `
|
|
53
|
-
margin-left: 2px;
|
|
54
|
-
|
|
55
|
-
svg {
|
|
56
|
-
vertical-align: inherit;
|
|
57
|
-
}
|
|
52
|
+
export const downIconStyle = `
|
|
53
|
+
margin-left: 2px;
|
|
54
|
+
|
|
55
|
+
svg {
|
|
56
|
+
vertical-align: inherit;
|
|
57
|
+
}
|
|
58
58
|
`;
|
|
@@ -1,15 +1,115 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
2
|
-
import { memo } from 'react';
|
|
2
|
+
import { memo, useCallback, useEffect, useState } from 'react';
|
|
3
3
|
import { ClassNames } from '@emotion/react';
|
|
4
4
|
import { Spin } from 'antd';
|
|
5
|
+
import useWorkflowConfig from '../../../lib/hooks/useWorkflowConfig';
|
|
5
6
|
import { i18n } from '../../../lib/i18n';
|
|
7
|
+
import { checkFlowHandler } from '../../../lib/workflow';
|
|
6
8
|
import { flowNextStyle, flowWrapperStyle, noPermissionStyle, spinStyle } from './style';
|
|
7
9
|
import TransitionButton from './TransitionButton';
|
|
8
10
|
import View from './View';
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
11
|
+
const ApprovalStatus = {
|
|
12
|
+
approved: 'approved',
|
|
13
|
+
rejected: 'rejected',
|
|
14
|
+
};
|
|
15
|
+
const CheckInStatus = {
|
|
16
|
+
closed: 'closed',
|
|
17
|
+
pending: 'pending',
|
|
18
|
+
};
|
|
19
|
+
const SelectTransition = ({ fetching, flowing, tasks, itemId, itemData, currentUser, setPopoverVisible, name, objectId, workflowData, approval, checkIn, handleTransition, readonly, flowHandlerActive, }) => {
|
|
20
|
+
const [transitionList, setTransitionList] = useState([]);
|
|
21
|
+
const [checkResultList, setCheckResultList] = useState([]);
|
|
22
|
+
const [init, setInit] = useState(false);
|
|
23
|
+
const { postCheckTransitions, hideDisabledStatusTransition } = useWorkflowConfig();
|
|
24
|
+
const checkApproval = useCallback(({ text }) => {
|
|
25
|
+
var _a;
|
|
26
|
+
if (!approval.requireApproval)
|
|
27
|
+
return [true];
|
|
28
|
+
const approvedTransitions = approval.transition.approved.map(approved => approved.label);
|
|
29
|
+
const rejectedTransitions = approval.transition.rejected.map(rejected => rejected.label);
|
|
30
|
+
const unrestrictedTransitions = ((_a = approval.transition.unrestricted) === null || _a === void 0 ? void 0 : _a.map(unrestricted => unrestricted.label)) || [];
|
|
31
|
+
if ((ApprovalStatus.approved === approval.approvalStatus && approvedTransitions.includes(text)) ||
|
|
32
|
+
(ApprovalStatus.rejected === approval.approvalStatus && rejectedTransitions.includes(text))) {
|
|
33
|
+
return [true];
|
|
34
|
+
}
|
|
35
|
+
if (![ApprovalStatus.approved, ApprovalStatus.rejected].includes(approval.approvalStatus) &&
|
|
36
|
+
(unrestrictedTransitions === null || unrestrictedTransitions === void 0 ? void 0 : unrestrictedTransitions.includes(text))) {
|
|
37
|
+
if (!approval.startApproval) {
|
|
38
|
+
return [true];
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
return [false, i18n.t('pages.fields.view.unrestrictedStatus')];
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
return [false, i18n.t('pages.fields.view.approvalStatus')];
|
|
45
|
+
}, [approval]);
|
|
46
|
+
const validateCheckIn = useCallback(() => {
|
|
47
|
+
if (!checkIn.requireCheckIn)
|
|
48
|
+
return true;
|
|
49
|
+
if (checkIn.checkInStatus !== CheckInStatus.pending) {
|
|
50
|
+
return true;
|
|
51
|
+
}
|
|
52
|
+
return false;
|
|
53
|
+
}, [checkIn]);
|
|
54
|
+
const checkOneTransition = useCallback(({ text, conditionCheck }) => {
|
|
55
|
+
const [checkApprovalResult, checkApprovalMessage] = checkApproval({ text });
|
|
56
|
+
if (!checkApprovalResult) {
|
|
57
|
+
return {
|
|
58
|
+
result: false,
|
|
59
|
+
message: checkApprovalMessage,
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
if (!validateCheckIn()) {
|
|
63
|
+
return {
|
|
64
|
+
result: false,
|
|
65
|
+
message: i18n.t('pages.fields.view.checkInStatus'),
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
const checkResult = checkFlowHandler(itemData, { userId: currentUser.id }, flowHandlerActive);
|
|
69
|
+
if (checkResult && !checkResult.result) {
|
|
70
|
+
return checkResult;
|
|
71
|
+
}
|
|
72
|
+
if (!(conditionCheck === null || conditionCheck === void 0 ? void 0 : conditionCheck.result) && conditionCheck) {
|
|
73
|
+
if (hideDisabledStatusTransition === 'enabled') {
|
|
74
|
+
return { result: false, isHide: true };
|
|
75
|
+
}
|
|
76
|
+
return conditionCheck;
|
|
77
|
+
}
|
|
78
|
+
return { result: true };
|
|
79
|
+
}, [checkApproval, currentUser, flowHandlerActive, hideDisabledStatusTransition, validateCheckIn, itemData]);
|
|
80
|
+
useEffect(() => {
|
|
81
|
+
if (!init && workflowData.objectId && tasks.length && postCheckTransitions && itemId) {
|
|
82
|
+
setInit(true);
|
|
83
|
+
postCheckTransitions(tasks.map(_transition => ({
|
|
84
|
+
transitionId: _transition.id,
|
|
85
|
+
itemId,
|
|
86
|
+
workflowId: workflowData.objectId,
|
|
87
|
+
}))).then(_checkResultList => {
|
|
88
|
+
setCheckResultList(_checkResultList);
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
}, [init, itemId, workflowData, postCheckTransitions, tasks, itemData]);
|
|
92
|
+
useEffect(() => {
|
|
93
|
+
const _transitionList = [];
|
|
94
|
+
if (checkResultList.length === 0)
|
|
95
|
+
return;
|
|
96
|
+
tasks.forEach(task => {
|
|
97
|
+
var _a;
|
|
98
|
+
const conditionCheck = (_a = checkResultList.find(checkResult => checkResult.transitionId === task.id)) === null || _a === void 0 ? void 0 : _a.result;
|
|
99
|
+
const allResult = checkOneTransition({ text: task.name, conditionCheck });
|
|
100
|
+
_transitionList.push({
|
|
101
|
+
data: task,
|
|
102
|
+
checkResult: allResult,
|
|
103
|
+
});
|
|
104
|
+
});
|
|
105
|
+
setTransitionList(_transitionList);
|
|
106
|
+
}, [checkResultList, checkOneTransition, itemData, tasks]);
|
|
107
|
+
return (_jsx(ClassNames, { children: ({ cx, css }) => (_jsxs(_Fragment, { children: [fetching ? (_jsx(Spin, { css: css(spinStyle) })) : transitionList.length ? (_jsx("div", { className: cx(css(flowNextStyle), `flow-next-global`), children: _jsx("div", { className: cx(css(flowWrapperStyle)), children: transitionList
|
|
108
|
+
.filter(_task => { var _a; return !((_a = _task === null || _task === void 0 ? void 0 : _task.checkResult) === null || _a === void 0 ? void 0 : _a.isHide); })
|
|
109
|
+
.map(_task => {
|
|
110
|
+
var _a, _b, _c;
|
|
111
|
+
const { data: task, checkResult } = _task;
|
|
112
|
+
return (_jsx(TransitionButton, { loading: flowing, text: task.name, scriptValidator: (_a = task.parameters) === null || _a === void 0 ? void 0 : _a.scriptValidator, screenId: (_c = (_b = task.parameters) === null || _b === void 0 ? void 0 : _b.screen) === null || _c === void 0 ? void 0 : _c.key, target: task.target, handleTransition: handleTransition, readonly: readonly, conditionCheck: checkResult }, task.id));
|
|
13
113
|
}) }) })) : (_jsx("span", { onClick: () => {
|
|
14
114
|
setPopoverVisible(false);
|
|
15
115
|
}, css: css(noPermissionStyle), children: i18n.t('pages.fields.view.noWorkflowOrAuth') })), _jsx(View, { workflowData: workflowData, hiddenPopover: () => setPopoverVisible(false), name: name, objectId: objectId })] })) }));
|
|
@@ -1,35 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import { ApprovalData, CheckInData, ConditionType, ListItemType, NodeItemProps } from '../../../lib/types/workflow';
|
|
2
|
+
import { NodeItemProps } from '../../../lib/types/workflow';
|
|
4
3
|
interface FlowButtonProps {
|
|
5
|
-
itemId: string;
|
|
6
4
|
loading: boolean;
|
|
7
5
|
text: string;
|
|
8
6
|
screenId: string;
|
|
9
|
-
item: ItemResultProps;
|
|
10
|
-
workspace: string;
|
|
11
|
-
authRoles: ListItemType[] | undefined;
|
|
12
|
-
authUsers: ListItemType[] | undefined;
|
|
13
|
-
authGroups: ListItemType[] | undefined;
|
|
14
|
-
authUserFields: ListItemType[] | undefined;
|
|
15
|
-
authWorkSpaceRoles: ListItemType[] | undefined;
|
|
16
|
-
creatorAuth: boolean | undefined;
|
|
17
7
|
scriptValidator: string;
|
|
18
|
-
userId: string;
|
|
19
|
-
roleIds: string[];
|
|
20
|
-
groupIds: string[];
|
|
21
|
-
workspaceRoleIds: string[];
|
|
22
|
-
currentTaskId: string;
|
|
23
|
-
conditions?: ConditionType[];
|
|
24
|
-
approval: ApprovalData;
|
|
25
|
-
checkIn: CheckInData;
|
|
26
8
|
handleTransition: (updateTask: string, screenId: string, script: string) => void;
|
|
27
9
|
target: NodeItemProps & {
|
|
28
10
|
type?: string;
|
|
29
11
|
};
|
|
30
|
-
hiddenPopover?: () => void;
|
|
31
12
|
readonly?: boolean;
|
|
32
|
-
|
|
13
|
+
conditionCheck?: {
|
|
14
|
+
result: boolean;
|
|
15
|
+
message: string;
|
|
16
|
+
};
|
|
33
17
|
}
|
|
34
18
|
declare const _default: React.NamedExoticComponent<FlowButtonProps>;
|
|
35
19
|
export default _default;
|
|
@@ -1,112 +1,21 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
2
|
-
import { memo,
|
|
2
|
+
import { memo, useMemo } from 'react';
|
|
3
3
|
import { ClassNames, css } from '@emotion/react';
|
|
4
4
|
import { Tooltip } from 'antd';
|
|
5
5
|
import { WorkFlowStatusColor } from '../../../lib/global';
|
|
6
6
|
import { i18n } from '../../../lib/i18n';
|
|
7
|
-
import { checkTransition } from '../../../lib/workflow';
|
|
8
7
|
import BaseOverflowTooltip from '../../common/overflow-tooltip/BaseOverflowTooltip';
|
|
9
8
|
import { flowBtnStyle, flowStateStyle, iconStyle, notAllowedStyle, pointerStyle, stateBoxStyle, tipLineStyle, tooltipStyle, } from './style';
|
|
10
|
-
const
|
|
11
|
-
approved: 'approved',
|
|
12
|
-
rejected: 'rejected',
|
|
13
|
-
};
|
|
14
|
-
const CheckInStatus = {
|
|
15
|
-
closed: 'closed',
|
|
16
|
-
pending: 'pending',
|
|
17
|
-
};
|
|
18
|
-
const FlowButton = ({ loading, screenId, text, item, userId, roleIds, groupIds, workspaceRoleIds, authRoles, authUsers, authGroups, creatorAuth, authUserFields, authWorkSpaceRoles, scriptValidator, approval, checkIn, conditions = [], handleTransition, target, readonly, flowHandlerActive, }) => {
|
|
19
|
-
const [isCheck, setIsCheck] = useState(true);
|
|
20
|
-
const [tip, setTip] = useState('');
|
|
21
|
-
const checkApproval = useCallback(() => {
|
|
22
|
-
var _a;
|
|
23
|
-
if (!approval.requireApproval)
|
|
24
|
-
return true;
|
|
25
|
-
const approvedTransitions = approval.transition.approved.map(approved => approved.label);
|
|
26
|
-
const rejectedTransitions = approval.transition.rejected.map(rejected => rejected.label);
|
|
27
|
-
const unrestrictedTransitions = ((_a = approval.transition.unrestricted) === null || _a === void 0 ? void 0 : _a.map(unrestricted => unrestricted.label)) || [];
|
|
28
|
-
if ((ApprovalStatus.approved === approval.approvalStatus && approvedTransitions.includes(text)) ||
|
|
29
|
-
(ApprovalStatus.rejected === approval.approvalStatus && rejectedTransitions.includes(text))) {
|
|
30
|
-
return true;
|
|
31
|
-
}
|
|
32
|
-
if (![ApprovalStatus.approved, ApprovalStatus.rejected].includes(approval.approvalStatus) &&
|
|
33
|
-
(unrestrictedTransitions === null || unrestrictedTransitions === void 0 ? void 0 : unrestrictedTransitions.includes(text))) {
|
|
34
|
-
if (!approval.startApproval) {
|
|
35
|
-
return true;
|
|
36
|
-
}
|
|
37
|
-
else {
|
|
38
|
-
setTip(i18n.t('pages.fields.view.unrestrictedStatus'));
|
|
39
|
-
return false;
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
setTip(i18n.t('pages.fields.view.approvalStatus'));
|
|
43
|
-
return false;
|
|
44
|
-
}, [approval, text]);
|
|
45
|
-
const validateCheckIn = useCallback(() => {
|
|
46
|
-
if (!checkIn.requireCheckIn)
|
|
47
|
-
return true;
|
|
48
|
-
if (checkIn.checkInStatus !== CheckInStatus.pending) {
|
|
49
|
-
return true;
|
|
50
|
-
}
|
|
51
|
-
return false;
|
|
52
|
-
}, [checkIn]);
|
|
53
|
-
const checkAuth = useCallback(async () => {
|
|
54
|
-
setIsCheck(true);
|
|
55
|
-
if (!checkApproval()) {
|
|
56
|
-
setIsCheck(false);
|
|
57
|
-
return;
|
|
58
|
-
}
|
|
59
|
-
if (!validateCheckIn()) {
|
|
60
|
-
setTip(i18n.t('pages.fields.view.checkInStatus'));
|
|
61
|
-
setIsCheck(false);
|
|
62
|
-
return;
|
|
63
|
-
}
|
|
64
|
-
const transition = {
|
|
65
|
-
parameters: {
|
|
66
|
-
fieldType: conditions,
|
|
67
|
-
permissionType: {
|
|
68
|
-
users: authUsers,
|
|
69
|
-
roles: authRoles,
|
|
70
|
-
groups: authGroups,
|
|
71
|
-
workspaceRoles: authWorkSpaceRoles,
|
|
72
|
-
customFields: authUserFields,
|
|
73
|
-
creatorAuth,
|
|
74
|
-
},
|
|
75
|
-
},
|
|
76
|
-
};
|
|
77
|
-
const checkResult = checkTransition(item, transition, { userId, roleIds, groupIds, workspaceRoleIds }, flowHandlerActive);
|
|
78
|
-
if (!checkResult.result) {
|
|
79
|
-
setTip(checkResult.message);
|
|
80
|
-
setIsCheck(false);
|
|
81
|
-
}
|
|
82
|
-
}, [
|
|
83
|
-
checkApproval,
|
|
84
|
-
validateCheckIn,
|
|
85
|
-
conditions,
|
|
86
|
-
authUsers,
|
|
87
|
-
authRoles,
|
|
88
|
-
authGroups,
|
|
89
|
-
authWorkSpaceRoles,
|
|
90
|
-
authUserFields,
|
|
91
|
-
creatorAuth,
|
|
92
|
-
item,
|
|
93
|
-
userId,
|
|
94
|
-
roleIds,
|
|
95
|
-
groupIds,
|
|
96
|
-
workspaceRoleIds,
|
|
97
|
-
flowHandlerActive,
|
|
98
|
-
]);
|
|
99
|
-
useEffect(() => {
|
|
100
|
-
checkAuth();
|
|
101
|
-
}, [checkAuth]);
|
|
9
|
+
const FlowButton = ({ loading, screenId, text, scriptValidator, handleTransition, target, readonly, conditionCheck, }) => {
|
|
102
10
|
const tipContent = useMemo(() => {
|
|
11
|
+
const _tip = conditionCheck.message;
|
|
103
12
|
if (readonly)
|
|
104
13
|
return i18n.t('pages.fields.view.readonlyStatus');
|
|
105
|
-
if (!
|
|
14
|
+
if (!_tip)
|
|
106
15
|
return '';
|
|
107
|
-
const contents =
|
|
16
|
+
const contents = _tip.split('--');
|
|
108
17
|
return (_jsx("div", { children: contents.map((text, index) => (_jsx("p", { css: css(tipLineStyle), children: text }, String(index)))) }));
|
|
109
|
-
}, [
|
|
18
|
+
}, [readonly, conditionCheck]);
|
|
110
19
|
const OverflowText = ({ text, target }) => {
|
|
111
20
|
var _a, _b;
|
|
112
21
|
return (_jsxs(_Fragment, { children: [_jsx(BaseOverflowTooltip, { css: css(tooltipStyle), title: text, children: text }), _jsx("span", { css: css(iconStyle), children: " \u2192 " }), _jsx("div", { css: css(stateBoxStyle), children: _jsx(BaseOverflowTooltip, { css: css(flowStateStyle), style: {
|
|
@@ -115,11 +24,11 @@ const FlowButton = ({ loading, screenId, text, item, userId, roleIds, groupIds,
|
|
|
115
24
|
}, title: target.name, children: target.name }) })] }));
|
|
116
25
|
};
|
|
117
26
|
return (_jsx(ClassNames, { children: ({ cx, css }) => {
|
|
118
|
-
return
|
|
27
|
+
return conditionCheck ? ((conditionCheck === null || conditionCheck === void 0 ? void 0 : conditionCheck.result) && !readonly ? (_jsx("div", { className: cx(css(flowBtnStyle), loading ? css(notAllowedStyle) : css(pointerStyle)), onClick: () => {
|
|
119
28
|
if (!loading) {
|
|
120
29
|
handleTransition(text, screenId, scriptValidator);
|
|
121
30
|
}
|
|
122
|
-
}, children: _jsx(OverflowText, { text: text, target: target }) })) : (_jsx(Tooltip, { title: tipContent, placement: "right", children: _jsx("div", { className: cx(css(flowBtnStyle), css(notAllowedStyle)), children: _jsx(OverflowText, { text: text, target: target }) }) }));
|
|
31
|
+
}, children: _jsx(OverflowText, { text: text, target: target }) })) : (_jsx(Tooltip, { title: tipContent, placement: "right", children: _jsx("div", { className: cx(css(flowBtnStyle), css(notAllowedStyle)), children: _jsx(OverflowText, { text: text, target: target }) }) }))) : null;
|
|
123
32
|
} }));
|
|
124
33
|
};
|
|
125
34
|
export default memo(FlowButton);
|