Skip to content

Commit b6f1ca8

Browse files
daskyrklaojunhujiahao-hjh
authored
Feature/new theme released 🎉 (#2443)
* feat: update layout * feat: update header style * feat: update sidebar style and save fold state * feat: update header style * feat: update layout custom logic * feat: update theme color * feat: update skeleton * feat: always highlight nav icon when under route * feat: update sidebar style * feat: update msp overview page style * feat: trigger switch app when click platform entry * feat: default fix sidebar * fix: layout style * feat: update platform icon * fix: fix new theme load-more-selector style (#2429) * fix: sidebar icon * feat: update breadcrumb style * fix: sidebar fix flag * fix: add missing i18n * feat: update message center style * fix: header height * fix: selected sidebar menu icon color * feat: update layout * feat: remove useless dice-layout class * feat: remove useless nusi class * feat: move message center * fix: breadcrumb order * feat: update sidebar icon * feat: update nav avatar size * fix: fix menus open error * feat: new announcement * fix: missing key * fix: announcement style * feat: hover highlight dropdown select icon color * fix: fix i18n * fix: fix menu styles * fix: admin platform icon * fix: remove deleted icon * fix: sidebar z-index * fix: revert org in breadcrumb * fix: sidebar menu height * fix: clear active platform when leave * fix: page name * fix: fix overlay background color * fix: fix app selector width * fix: fix workbench messageList styles * fix: nav item icon default color * fix: toggle sidebar btn is covered * chore: no default export * fix: three level menu indent * fix: three level menu indent * feat: update tooltip background color * feat: add top bar container when need * fix: nav icon * feat: update layout and add main scroll tip * fix: update personal workbench page title * fix: update cluster overview style * feat: adjust nav order * fix: update middleware dashboard style * fix: workbench welcome text * feat: update global nav background color * Chore: merge master to new theme branch (#2442) * Feature/project release management (#2431) * feat(common): add common components listSelect * feat(dop): project release management * feat: code optimization * feat: add listSelect unit test case * fix: code optimization * fix(dop): project release management bug (#2441) Co-authored-by: hujiahao-hjh <[email protected]> * feat: update welcome style * feat: update cluster overview style * feat: add some flex util class * fix: nav item style * feat: update icon * fix: project and app selector style * feat: update toggle btn color * fix: update i18n * feat: update project and app selector * feat: update styles * fix: styles * fix: remove wrapper * feat: add animation to erda logo * fix: add login user login at * fix: missing import * fix: update avatar bg color * fix: fix msp head menu * feat: update tab radius * fix: fix tooltip inner link style * fix: update style * feat: remove useless style * fix: style * fix: fix issue protocol import Co-authored-by: zxj <[email protected]> Co-authored-by: hujiahao-hjh <[email protected]>
1 parent d69364f commit b6f1ca8

File tree

166 files changed

+1864
-2005
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

166 files changed

+1864
-2005
lines changed

docs/introduction_en.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ The main code of the entire project, the directory structure is as follows:
7272
-locales: internationalized files under the module
7373
-types: Type definition under the module
7474
-components: common components under the module that can be reused for other modules
75-
-org-home: personal dashboard
75+
-org-home: Personal workbench
7676
-static: static files
7777
-styles: global style, color wheel
7878
-user: user module

locales/en.json

+3-5
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66
"API description document protocol": "API description document protocol",
77
"API gateway": "API gateway",
88
"API logo": "API logo",
9-
"API management platform": "API management platform",
109
"API market": "API market",
1110
"API name": "API name",
1211
"API path": "API path",
@@ -18,7 +17,6 @@
1817
"Alibaba Cloud": "Alibaba Cloud",
1918
"All members of the organization can view": "all members of the current company can view",
2019
"App": "App",
21-
"App Center": "App Center",
2220
"Approve": "Approve",
2321
"April": "April",
2422
"Are you sure to leave?": "Are you sure to leave?",
@@ -51,7 +49,6 @@
5149
"DingTalk address": "DingTalk address",
5250
"Dubai": "Dubai",
5351
"East China {num}": "East China {num}",
54-
"Enter the keyword query": "Enter the keyword query",
5552
"Europe & America": "Europe & America",
5653
"Fast data": "Fast data",
5754
"February": "February",
@@ -105,7 +102,7 @@
105102
"Outbox username": "Outbox username",
106103
"Overview": "Overview",
107104
"Permanently delete {deleteItem}. Please pay special attention to it.": "Permanently delete {deleteItem}. Please pay special attention to it.",
108-
"Personal dashboard": "Personal dashboard",
105+
"Personal workbench": "Personal workbench",
109106
"Pipeline": "Pipeline",
110107
"Please enter a valid DingTalk address.": "Please enter a valid DingTalk address.",
111108
"Please enter a valid version number, such as x.y.z.": "please enter a valid version number,such as x.y.z",
@@ -169,7 +166,7 @@
169166
"Virginia": "Virginia",
170167
"Voice Template ID": "Voice Template ID",
171168
"Wed": "Wed",
172-
"Welcome to the personal workbench": "Welcome to the personal workbench",
169+
"Welcome to your personal workbench": "Welcome to your personal workbench",
173170
"Welcome!": "Welcome!",
174171
"You can use ClientID and ClientSecret below to access API instance after approval.": "You can use ClientID and ClientSecret below to access API instance after approval.",
175172
"You do not have enough permissions": "You do not have enough permissions",
@@ -584,6 +581,7 @@
584581
"merge": "merge",
585582
"merged at": "merged at",
586583
"message": "message",
584+
"message center": "message center",
587585
"meters": "meters",
588586
"microService": "microService",
589587
"middleware chart": "middleware chart",

locales/zh.json

+4-6
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66
"API description document protocol": "API 描述文档协议",
77
"API gateway": "API 网关",
88
"API logo": "API 图标",
9-
"API management platform": "API 管理平台",
109
"API market": "API 集市",
1110
"API name": "API 名称",
1211
"API path": "API 路径",
@@ -18,7 +17,6 @@
1817
"Alibaba Cloud": "阿里云",
1918
"All members of the organization can view": "当前组织下所有成员都可以查看",
2019
"App": "应用",
21-
"App Center": "应用中心",
2220
"Approve": "审批",
2321
"April": "4月",
2422
"Are you sure to leave?": "确定离开",
@@ -51,7 +49,6 @@
5149
"DingTalk address": "钉钉地址",
5250
"Dubai": "迪拜",
5351
"East China {num}": "华东{num}",
54-
"Enter the keyword query": "输入关键字查询",
5552
"Europe & America": "欧洲与美洲",
5653
"Fast data": "快数据平台",
5754
"February": "2月",
@@ -105,7 +102,7 @@
105102
"Outbox username": "发件箱用户名",
106103
"Overview": "总览",
107104
"Permanently delete {deleteItem}. Please pay special attention to it.": "永久删除{deleteItem},请谨慎操作",
108-
"Personal dashboard": "个人仪表盘",
105+
"Personal workbench": "个人工作台",
109106
"Pipeline": "流水线",
110107
"Please enter a valid DingTalk address.": "请输入正确钉钉地址",
111108
"Please enter a valid version number, such as x.y.z.": "请输入有效的版本号, 如:x.y.z",
@@ -169,7 +166,7 @@
169166
"Virginia": "弗利尼亚",
170167
"Voice Template ID": "语音模板 ID",
171168
"Wed": "",
172-
"Welcome to the personal workbench": "欢迎进入个人工作台",
169+
"Welcome to your personal workbench": "欢迎进入个人工作台",
173170
"Welcome!": "欢迎!",
174171
"You can use ClientID and ClientSecret below to access API instance after approval.": "待审批通过后, 您可以使用以下的 ClientID 和 ClientSecret 访问 API 实例。",
175172
"You do not have enough permissions": "您的权限不足",
@@ -291,7 +288,7 @@
291288
"cannot contain special characters": "不能包含特殊字符",
292289
"cannot exceed 40 characters": "不能超过40个字符",
293290
"capacity type": "容量型",
294-
"cellphone": "手机号",
291+
"cellphone": "手机",
295292
"certificate": "证书",
296293
"change account permissions": "更改账号权限",
297294
"channel name": "渠道名称",
@@ -584,6 +581,7 @@
584581
"merge": "合并",
585582
"merged at": "合并于",
586583
"message": "消息",
584+
"message center": "消息中心",
587585
"meters": "",
588586
"microService": "微服务",
589587
"middleware chart": "中间件图表",

modules/market/src/pages/download.scss

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
$primary: #6a549e !default;
1+
$color-primary: #6a549e !default;
22

33
@media screen and (max-height: 700px) {
44
.download-page {
@@ -188,8 +188,8 @@ $primary: #6a549e !default;
188188
cursor: pointer;
189189

190190
&.active {
191-
color: $primary;
192-
border: 1px solid $primary;
191+
color: $color-primary;
192+
border: 1px solid $color-primary;
193193
}
194194
}
195195
}

modules/market/src/styles/_resources.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// color
2-
$color-primary: #6a549e !default;
3-
$primary: $color-primary;
2+
$color-primary: #302647 100% !default;
3+
$color-primary: $color-primary;
44

55
// variable
66
$sider-width: 48px;

shell/app/common/components/base-list/index.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
padding: 12px 16px;
44
border-radius: 2px;
55
background-color: $white;
6-
border-bottom: 1px solid $border-color;
6+
border-bottom: 1px solid $color-border;
77
background-position: 100% 0;
88
background-repeat: no-repeat;
99

@@ -112,7 +112,7 @@
112112
.erda-list-operations {
113113
.ant-dropdown-menu {
114114
width: 200px;
115-
background-color: rgba($color-default, 0.96);
115+
background-color: $color-default;
116116
}
117117

118118
.ant-dropdown-menu-item,

shell/app/common/components/base-list/index.spec.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ declare namespace ERDA_LIST {
2121
EmptyHolder: React.FC;
2222
defaultLogo?: string;
2323
defaultBgImg?: string;
24+
columnsInfoWidth?: Obj<number>;
2425
}
2526

2627
interface ItemProps {

shell/app/common/components/base-list/index.tsx

+18-2
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,30 @@ import ListItem from 'app/common/components/base-list/list-item';
1919
import './index.scss';
2020

2121
const List = (props: ERDA_LIST.Props) => {
22-
const { dataSource, isLoadMore, onLoadMore, pagination, getKey, EmptyHolder, defaultLogo, defaultBgImg } = props;
22+
const {
23+
dataSource,
24+
isLoadMore,
25+
onLoadMore,
26+
pagination,
27+
getKey,
28+
EmptyHolder,
29+
defaultLogo,
30+
defaultBgImg,
31+
columnsInfoWidth,
32+
} = props;
2333
return (
2434
<div className="erda-base-list">
2535
{dataSource.length ? (
2636
<>
2737
{dataSource.map((item: ERDA_LIST.ListData, idx: number) => {
2838
return (
29-
<ListItem defaultLogo={defaultLogo} defaultBgImg={defaultBgImg} key={getKey(item, idx)} data={item} />
39+
<ListItem
40+
defaultLogo={defaultLogo}
41+
defaultBgImg={defaultBgImg}
42+
key={getKey(item, idx)}
43+
data={item}
44+
columnsInfoWidth={columnsInfoWidth}
45+
/>
3046
);
3147
})}
3248
{pagination &&

shell/app/common/components/base-list/list-item.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -186,16 +186,16 @@ const ListItem = (props: ERDA_LIST.ItemProps) => {
186186
</div>
187187
) : null}
188188
{columnsInfo.state ? (
189-
<div className="ml-8" style={{ width: columnsInfoWidth?.state }}>
189+
<div className="ml-6" style={{ width: columnsInfoWidth?.state || 80 }}>
190190
<Badge showDot={false} {...columnsInfo.state} />
191191
</div>
192192
) : null}
193193
{columnsInfo.users ? (
194-
<div className="ml-8 flex items-center" style={{ width: columnsInfoWidth?.users }}>
194+
<div className="ml-6 flex items-center" style={{ width: columnsInfoWidth?.users || 80 }}>
195195
{columnsInfo.users.map((item) => {
196196
const curUser = userMap[item] || {};
197197
return (
198-
<div key={item}>
198+
<div key={item} className="truncate">
199199
<Avatar src={curUser?.avatar} size="small">
200200
{curUser?.nick ? getAvatarChars(curUser.nick) : i18n.t('none')}
201201
</Avatar>
@@ -208,7 +208,7 @@ const ListItem = (props: ERDA_LIST.ItemProps) => {
208208
</div>
209209
) : null}
210210
{columnsInfo.text ? (
211-
<div className="ml-8 flex items-center" style={{ width: columnsInfoWidth?.text }}>
211+
<div className="ml-6 flex items-center" style={{ width: columnsInfoWidth?.text || 80 }}>
212212
{columnsInfo.text.map((item, idx) => {
213213
return (
214214
<Tooltip title={item.tip} key={idx}>

shell/app/common/components/contractive-filter/index.scss

+3-3
Original file line numberDiff line numberDiff line change
@@ -157,11 +157,11 @@
157157
}
158158

159159
&.checked-item {
160-
color: $primary;
160+
color: $color-primary;
161161
}
162162

163163
&:hover {
164-
color: $primary;
164+
color: $color-primary;
165165
background-color: $color-click-bg;
166166

167167
.option-item-delete {
@@ -187,7 +187,7 @@
187187
padding: 6px 10px;
188188
color: $color-text-desc;
189189
&:hover {
190-
color: $primary;
190+
color: $color-primary;
191191
}
192192

193193
.expand-icon {

shell/app/common/components/dropdown-select-new/index.scss

+11-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
.erda-dropdown-select-menu {
22
&.ant-dropdown-menu {
3-
background-color: rgba($color-default, 0.96);
3+
background-color: $color-default;
44
color: $white;
55
}
66
.ant-dropdown-menu-item {
@@ -95,4 +95,14 @@
9595
color: $color-default;
9696
}
9797
}
98+
99+
.icon {
100+
color: $color-text-icon;
101+
}
102+
103+
&:hover {
104+
.icon {
105+
color: $color-default;
106+
}
107+
}
98108
}

shell/app/common/components/dropdown-select-new/index.tsx

+17-12
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,12 @@ import i18n from 'i18n';
1919
import { useUpdateEffect } from 'react-use';
2020
import './index.scss';
2121

22+
type Size = 'small' | 'middle' | 'big';
2223
export interface DropdownSelectNewProps {
2324
options: Option[];
2425
title?: string;
25-
size?: 'small' | 'middle' | 'big';
26+
optionSize?: Size;
27+
size?: Size;
2628
showFilter?: boolean;
2729
mode?: 'simple' | 'normal';
2830
required?: boolean;
@@ -51,6 +53,7 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
5153
title,
5254
trigger,
5355
showFilter,
56+
optionSize = 'middle',
5457
size = 'middle',
5558
mode = 'normal',
5659
required,
@@ -66,6 +69,7 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
6669
const [active, setActive] = React.useState(false);
6770
const [value, setValue] = React.useState(pValue);
6871

72+
const contentRef = React.useRef<HTMLDivElement>(null);
6973
useUpdateEffect(() => {
7074
if (pValue !== value) {
7175
setValue(pValue);
@@ -75,12 +79,9 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
7579
React.useEffect(() => {
7680
// 控制点击外部关闭 dropdown
7781
const handleCloseDropdown = (e: MouseEvent) => {
78-
const dropdowns = Array.from(document.querySelectorAll('.erda-dropdown-select'));
79-
const dropdownButton = document.querySelector('.erda-dropdown-select-content');
8082
const node = e.target as Node;
81-
const inner = dropdowns.some((wrap) => wrap.contains(node));
82-
83-
if (!inner && node !== dropdownButton) {
83+
const inner = contentRef.current?.contains(node);
84+
if (!inner && node !== contentRef.current) {
8485
setActive(false);
8586
}
8687
};
@@ -119,9 +120,11 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
119120
const isGroup = item.children?.length;
120121

121122
if (isGroup) {
122-
return <GroupOpt onClickItem={onClickItem} key={item.key} value={value} option={item} size={size} />;
123+
return <GroupOpt onClickItem={onClickItem} key={item.key} value={value} option={item} size={optionSize} />;
123124
} else {
124-
return <Item key={item.key} onClickItem={onClickItem} option={item} size={size} className={className} />;
125+
return (
126+
<Item key={item.key} onClickItem={onClickItem} option={item} size={optionSize} className={className} />
127+
);
125128
}
126129
})}
127130
</Menu.Item>
@@ -144,6 +147,7 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
144147
{...restProps}
145148
>
146149
<div
150+
ref={contentRef}
147151
className="inline-flex items-center cursor-pointer erda-dropdown-select-content"
148152
style={{ maxWidth: width }}
149153
onClick={() => mode === 'simple' && setActive(!active)}
@@ -166,7 +170,7 @@ const DropdownSelect = (props: DropdownSelectNewProps) => {
166170
) : (
167171
<div>{i18n.t('please select')}</div>
168172
)}
169-
{mode === 'simple' ? <ErdaIcon type="caret-down" className="ml-0.5" size="18" /> : null}
173+
{mode === 'simple' ? <ErdaIcon type="caret-down" className="icon" size="14" /> : null}
170174
</div>
171175
</Dropdown>
172176
);
@@ -178,6 +182,7 @@ interface ItemProps extends Omit<DropdownSelectNewProps, 'options'> {
178182
option: Option;
179183
value?: string;
180184
switcher?: JSX.Element;
185+
size?: Size;
181186
onClickItem?: (op: Option) => void;
182187
}
183188

@@ -196,9 +201,9 @@ const Item = (props: ItemProps) => {
196201
>
197202
<div className="flex items-center flex-1 overflow-hidden">
198203
{icon ? (
199-
<ErdaIcon type={icon} className="option-img" size={iconSizeMap[size]} />
204+
<ErdaIcon type={icon} className={`option-img ${onlyIcon ? 'mr-0' : ''}`} size={iconSizeMap[size]} />
200205
) : imgURL ? (
201-
<img src={imgURL} className="option-img" />
206+
<img src={imgURL} className={`option-img ${onlyIcon ? 'mr-0' : ''}`} />
202207
) : null}
203208
{onlyIcon ? null : (
204209
<div className="flex-1 overflow-hidden">
@@ -217,7 +222,7 @@ const Item = (props: ItemProps) => {
217222

218223
interface IGroupOptProps {
219224
value: string;
220-
size?: string;
225+
size?: Size;
221226
option: Option;
222227
onClickItem?: (op: Option) => void;
223228
}

shell/app/common/components/edit-list/index.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
min-height: 38px;
1717
padding: 2px 10px;
1818
line-height: 34px;
19-
border-bottom: 1px solid $border-color;
19+
border-bottom: 1px solid $color-border;
2020

2121
textarea.edit-list-item-textarea {
2222
height: 30px;

0 commit comments

Comments
 (0)