@yeeyoon/library 3.7.5 → 3.7.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/lib/components/InfoCard/index.jsx +64 -40
  2. package/lib/components/InfoCard/index.less +49 -34
  3. package/lib/components/InfoCard/service.js +8 -0
  4. package/package.json +1 -1
package/lib/components/InfoCard/index.jsx CHANGED
@@ -4,7 +4,7 @@ import styles from './index.less';
4
4
  import { LineChart, Line, Tooltip, XAxis } from 'recharts';
5
5
  import PropTypes from 'prop-types';
6
6
  import { QuestionCircleOutlined } from '@ant-design/icons';
7
- import { queryOidcUserCardData } from './service';
7
+ import { queryOidcUserCardData, fetchUserInfo } from './service';
8
8
 
9
9
  const defaultHeadUrl =
10
10
  'https://pro-yeeyoon-fm.oss-cn-zhangjiakou.aliyuncs.com/oidc/user_avatar3.png';
@@ -13,6 +13,7 @@ function InfoCart(props) {
13
13
  const reg = /^(\d{3})\d*(\d{4})$/;
14
14
  const [cardData, setCardData] = useState({});
15
15
  const [chartData, setChartData] = useState([]);
16
+ const [tenantList, setTenantList] = useState([]);
16
17
  const [projectData] = useState([
17
18
  {
18
19
  title: '贡献数据',
@@ -50,6 +51,7 @@ function InfoCart(props) {
50
51
  };
51
52
  useEffect(() => {
52
53
  getCardData();
54
+ getUserInfo();
53
55
  }, [baseMsg.userId, baseMsg.id]);
54
56
  const getCardData = async () => {
55
57
  const resp = await queryOidcUserCardData({
@@ -71,6 +73,21 @@ function InfoCart(props) {
71
73
  }
72
74
  }
73
75
  };
76
+ const getUserInfo = async () => {
77
+ const resp = await fetchUserInfo({
78
+ id: baseMsg.userId || baseMsg?.id,
79
+ });
80
+ const { success, data } = resp;
81
+ if (success) {
82
+ if (data.tenants.length > 0) {
83
+ setTenantList(
84
+ data.tenants.map((item) => {
85
+ return item.name;
86
+ })
87
+ );
88
+ }
89
+ }
90
+ };
74
91
  return (
75
92
  <div className={styles['info-cart-content']} {...rest}>
76
93
  <div className={styles['info-cart-base']}>
@@ -88,46 +105,53 @@ function InfoCart(props) {
88
105
  </span>
89
106
  </div>
90
107
  </div>
91
- <div className={styles['info-cart-project']}>
92
- <p>{cardData.application_name}</p>
93
- <div className={styles['info-cart-data']}>
94
- {projectData &&
95
- projectData.map((item, index) => (
96
- <div className={styles['info-cart-data-item']} key={index}>
97
- <span className={styles['info-cart-data-item-title']}>
98
- {item.title}
99
- {item.tips && (
100
- <AntdTooltip title={item.tips}>
101
- <QuestionCircleOutlined
102
- style={{ fontSize: '14px', marginLeft: '4px' }}
103
- />
104
- </AntdTooltip>
105
- )}
106
- </span>
107
- <b style={{ color: '#5e5873', fontSize: '16px' }}>
108
- {cardData[item.number] || 0}
109
- </b>
110
- <span style={{ color: '#6E6B7B', fontSize: '12px' }}>
111
- {item.updateTitle}
112
- {cardData[item.updateNumber] || 0}
113
- </span>
114
- </div>
115
- ))}
108
+ <div className={styles['info-cart-bottom']}>
109
+ <div className={styles['info-cart-project']}>
110
+ <p>{cardData.application_name}</p>
111
+ <div className={styles['info-cart-data']}>
112
+ {projectData &&
113
+ projectData.map((item, index) => (
114
+ <div className={styles['info-cart-data-item']} key={index}>
115
+ <span className={styles['info-cart-data-item-title']}>
116
+ {item.title}
117
+ {item.tips && (
118
+ <AntdTooltip title={item.tips}>
119
+ <QuestionCircleOutlined
120
+ style={{ fontSize: '14px', marginLeft: '4px' }}
121
+ />
122
+ </AntdTooltip>
123
+ )}
124
+ </span>
125
+ <b style={{ color: '#5e5873', fontSize: '16px' }}>
126
+ {cardData[item.number] || 0}
127
+ </b>
128
+ <span style={{ color: '#6E6B7B', fontSize: '12px' }}>
129
+ {item.updateTitle}
130
+ {cardData[item.updateNumber] || 0}
131
+ </span>
132
+ </div>
133
+ ))}
134
+ </div>
135
+ </div>
136
+ <div className={styles['info-cart-form']}>
137
+ <p>贡献数据（最近30天）</p>
138
+ <LineChart width={288} height={70} data={chartData}>
139
+ <Line
140
+ type="monotone"
141
+ dataKey="贡献数据数"
142
+ stroke="#7367F0"
143
+ strokeWidth="2"
144
+ dot={false}
145
+ />
146
+ <Tooltip cursor={false} />
147
+ <XAxis dataKey="name" style={{ display: 'none' }} />
148
+ </LineChart>
149
+ </div>
150
+ <div className={styles['info-cart-company']}>
151
+ <h4>所属公司</h4>
152
+ {tenantList.length > 0 &&
153
+ tenantList.map((item, index) => <p key={index}>{item}</p>)}
116
154
  </div>
117
- </div>
118
- <div className={styles['info-cart-form']}>
119
- <p>贡献数据（最近30天）</p>
120
- <LineChart width={288} height={70} data={chartData}>
121
- <Line
122
- type="monotone"
123
- dataKey="贡献数据数"
124
- stroke="#7367F0"
125
- strokeWidth="2"
126
- dot={false}
127
- />
128
- <Tooltip cursor={false} />
129
- <XAxis dataKey="name" style={{ display: 'none' }} />
130
- </LineChart>
131
155
  </div>
132
156
  </div>
133
157
  );
package/lib/components/InfoCard/index.less CHANGED
@@ -4,8 +4,7 @@
4
4
  .info-cart-base {
5
5
  display: flex;
6
6
  width: 320px;
7
- padding-bottom: 20px;
8
- border-bottom: 1px solid #eeeeee;
7
+ padding: 5px 0 23px 0;
9
8
  .info-cart-np {
10
9
  display: flex;
11
10
  flex-direction: column;
@@ -16,44 +15,60 @@
16
15
  }
17
16
  }
18
17
  }
19
- .info-cart-project {
20
- margin-top: 20px;
21
- p {
22
- margin-bottom: 24px;
23
- color: #5e5873;
24
- font-size: 16px;
25
- }
26
- .info-cart-data {
27
- display: flex;
28
- &-item {
18
+ .info-cart-bottom {
19
+ background-color: #f4f4f4;
20
+ height: 400px;
21
+ overflow-x: scroll;
22
+ padding: 0 20px;
23
+ margin: 0 -20px -20px -20px;
24
+ .info-cart-project {
25
+ margin-top: 20px;
26
+ p {
27
+ margin-bottom: 24px;
28
+ color: #5e5873;
29
+ font-size: 16px;
30
+ }
31
+ .info-cart-data {
29
32
  display: flex;
30
- flex-direction: column;
31
- align-items: center;
32
- justify-content: center;
33
- width: 96px;
34
- margin-right: 16px;
35
- &-title {
36
- color: #5e5873;
33
+ &-item {
34
+ display: flex;
35
+ flex-direction: column;
36
+ align-items: center;
37
+ justify-content: center;
38
+ width: 96px;
39
+ margin-right: 16px;
40
+ &-title {
41
+ color: #5e5873;
42
+ }
43
+ b {
44
+ margin: 14px 0 6px 0;
45
+ }
37
46
  }
38
- b {
39
- margin: 14px 0 6px 0;
47
+ :last-child {
48
+ margin-right: 0;
40
49
  }
41
50
  }
42
- :last-child {
43
- margin-right: 0;
51
+ }
52
+ .info-cart-form {
53
+ width: 320px;
54
+ height: 126px;
55
+ margin-top: 24px;
56
+ border-radius: 4px;
57
+ p {
58
+ margin-bottom: 16px;
59
+ color: #6e6b7b;
44
60
  }
45
61
  }
46
- }
47
- .info-cart-form {
48
- width: 320px;
49
- height: 126px;
50
- margin-top: 24px;
51
- padding: 16px;
52
- background: #f9f9f9;
53
- border-radius: 4px;
54
- p {
55
- margin-bottom: 16px;
56
- color: #6e6b7b;
62
+ .info-cart-company {
63
+ border-top: 1px dashed #BABFC7;
64
+ color: #5E5873;
65
+ padding-top: 24px;
66
+ h4 {
67
+ margin-bottom: 15px;
68
+ font-size: 14px;
69
+ }
70
+
57
71
  }
58
72
  }
73
+
59
74
  }
package/lib/components/InfoCard/service.js CHANGED
@@ -8,3 +8,11 @@ export async function queryOidcUserCardData(params) {
8
8
  method: 'post',
9
9
  });
10
10
  }
11
+ // 获取用户信息
12
+ export async function fetchUserInfo(params) {
13
+ return request('/findOidcUser', {
14
+ prefix: `${API_IAM}/api/oidc/v1/oidcuser`,
15
+ method: 'post',
16
+ data: params,
17
+ });
18
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yeeyoon/library",
3
- "version": "3.7.5",
3
+ "version": "3.7.6",
4
4
  "description": "宜云前端组件库和通用服务",
5
5
  "main": "index.js",
6
6
  "repository": {