You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@skywalking.apache.org by wu...@apache.org on 2018/03/07 01:49:20 UTC
[incubator-skywalking-ui] branch master updated: Fix mq trace
request variables type error (#131)
This is an automated email from the ASF dual-hosted git repository.
wusheng pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-skywalking-ui.git
The following commit(s) were added to refs/heads/master by this push:
new e8cd450 Fix mq trace request variables type error (#131)
e8cd450 is described below
commit e8cd4504bb4a94b17e9edfdf64817444f422c438
Author: Gao Hongtao <ha...@gmail.com>
AuthorDate: Wed Mar 7 09:49:18 2018 +0800
Fix mq trace request variables type error (#131)
* Update license file
* Remove unused components
* Fix mq trace issue
---
public/css/iconfont.css | 16 +-
src/common/menu.js | 18 ++
src/common/router.js | 18 ++
src/components/ActiveChart/index.js | 82 --------
src/components/ActiveChart/index.less | 31 ---
src/components/Authorized/Authorized.js | 18 ++
src/components/Authorized/AuthorizedRoute.js | 18 ++
src/components/Authorized/CheckPermissions.js | 23 ++-
src/components/Authorized/CheckPermissions.test.js | 18 ++
src/components/Authorized/PromiseRender.js | 18 ++
src/components/Authorized/Secured.js | 18 ++
src/components/Authorized/index.d.ts | 18 ++
src/components/Authorized/index.js | 18 ++
src/components/AvatarList/demo/simple.md | 20 --
src/components/AvatarList/index.d.ts | 23 ---
src/components/AvatarList/index.en-US.md | 22 --
src/components/AvatarList/index.js | 43 ----
src/components/AvatarList/index.less | 45 -----
src/components/AvatarList/index.zh-CN.md | 23 ---
src/components/Charts/Gauge/index.d.ts | 11 -
src/components/Charts/Gauge/index.js | 167 ---------------
src/components/Charts/MiniProgress/index.d.ts | 13 --
src/components/Charts/MiniProgress/index.js | 30 ---
src/components/Charts/MiniProgress/index.less | 35 ----
src/components/Charts/Radar/index.d.ts | 15 --
src/components/Charts/Radar/index.js | 180 -----------------
src/components/Charts/Radar/index.less | 46 -----
src/components/Charts/TagCloud/index.d.ts | 11 -
src/components/Charts/TagCloud/index.js | 164 ---------------
src/components/Charts/TagCloud/index.less | 7 -
src/components/Charts/TimelineChart/index.d.ts | 17 --
src/components/Charts/TimelineChart/index.js | 123 -----------
src/components/Charts/TimelineChart/index.less | 3 -
src/components/Charts/WaterWave/index.d.ts | 10 -
src/components/Charts/WaterWave/index.js | 197 ------------------
src/components/Charts/WaterWave/index.less | 28 ---
src/components/Charts/demo/bar.md | 26 ---
src/components/Charts/demo/chart-card.md | 65 ------
src/components/Charts/demo/gauge.md | 18 --
src/components/Charts/demo/mini-area.md | 28 ---
src/components/Charts/demo/mini-bar.md | 28 ---
src/components/Charts/demo/mini-pie.md | 16 --
src/components/Charts/demo/mini-progress.md | 12 --
src/components/Charts/demo/mix.md | 83 --------
src/components/Charts/demo/pie.md | 47 -----
src/components/Charts/demo/radar.md | 64 ------
src/components/Charts/demo/tag-cloud.md | 25 ---
src/components/Charts/demo/timeline-chart.md | 27 ---
src/components/Charts/demo/waterwave.md | 20 --
src/components/Charts/index.d.ts | 17 --
src/components/Charts/index.js | 14 +-
src/components/CountDown/demo/simple.md | 24 ---
src/components/CountDown/index.d.ts | 9 -
src/components/CountDown/index.en-US.md | 15 --
src/components/CountDown/index.js | 108 ----------
src/components/CountDown/index.zh-CN.md | 16 --
src/components/EditableItem/index.js | 55 -----
src/components/EditableItem/index.less | 25 ---
src/components/EditableLinkGroup/index.js | 44 ----
src/components/EditableLinkGroup/index.less | 16 --
src/components/Ellipsis/demo/line.md | 20 --
src/components/Ellipsis/demo/number.md | 20 --
src/components/Ellipsis/index.d.ts | 12 --
src/components/Ellipsis/index.js | 224 ---------------------
src/components/Ellipsis/index.less | 24 ---
src/components/Ellipsis/index.md | 18 --
src/components/FooterToolbar/demo/basic.md | 36 ----
src/components/FooterToolbar/index.d.ts | 10 -
src/components/FooterToolbar/index.js | 18 --
src/components/FooterToolbar/index.less | 33 ---
src/components/FooterToolbar/index.md | 21 --
src/components/HeaderSearch/demo/basic.md | 34 ----
src/components/HeaderSearch/index.d.ts | 14 --
src/components/HeaderSearch/index.js | 85 --------
src/components/HeaderSearch/index.less | 32 ---
src/components/HeaderSearch/index.md | 20 --
src/components/Login/LoginItem.js | 104 ----------
src/components/Login/LoginSubmit.js | 15 --
src/components/Login/LoginTab.js | 32 ---
src/components/Login/demo/basic.md | 113 -----------
src/components/Login/index.d.ts | 32 ---
src/components/Login/index.js | 124 ------------
src/components/Login/index.less | 45 -----
src/components/Login/index.md | 51 -----
src/components/Login/map.js | 55 -----
src/components/NumberInfo/demo/basic.md | 22 --
src/components/NumberInfo/index.d.ts | 13 --
src/components/NumberInfo/index.js | 34 ----
src/components/NumberInfo/index.less | 68 -------
src/components/NumberInfo/index.md | 22 --
src/components/PageHeader/demo/image.md | 75 -------
src/components/PageHeader/demo/simple.md | 32 ---
src/components/PageHeader/demo/standard.md | 102 ----------
src/components/PageHeader/demo/structure.md | 68 -------
src/components/PageHeader/index.d.ts | 19 --
src/components/PageHeader/index.js | 194 ------------------
src/components/PageHeader/index.less | 138 -------------
src/components/PageHeader/index.md | 31 ---
src/components/Result/demo/classic.md | 80 --------
src/components/Result/demo/error.md | 39 ----
src/components/Result/demo/structure.md | 20 --
src/components/Result/index.d.ts | 11 -
src/components/Result/index.js | 23 ---
src/components/Result/index.less | 51 -----
src/components/Result/index.md | 20 --
src/components/StandardFormRow/index.js | 26 ---
src/components/StandardFormRow/index.less | 72 -------
src/components/StandardTable/index.js | 120 -----------
src/components/StandardTable/index.less | 13 --
src/components/TagSelect/demo/expandable.md | 31 ---
src/components/TagSelect/demo/simple.md | 25 ---
src/components/TagSelect/index.d.ts | 23 ---
src/components/TagSelect/index.js | 129 ------------
src/components/TagSelect/index.less | 33 ---
src/components/TagSelect/index.md | 29 ---
src/components/TraceTable/index.js | 6 +-
src/components/Trend/demo/basic.md | 17 --
src/components/Trend/index.d.ts | 9 -
src/components/Trend/index.js | 22 --
src/components/Trend/index.less | 30 ---
src/components/Trend/index.md | 21 --
src/e2e/home.e2e.js | 18 ++
src/index.ejs | 16 ++
src/index.js | 18 ++
src/index.less | 17 ++
src/router.js | 18 ++
src/theme.js | 18 ++
tests/run-tests.js | 18 ++
128 files changed, 318 insertions(+), 5014 deletions(-)
diff --git a/public/css/iconfont.css b/public/css/iconfont.css
index 2ca477a..ef9b779 100644
--- a/public/css/iconfont.css
+++ b/public/css/iconfont.css
@@ -1,10 +1,12 @@
-@font-face {font-family: "iconfont";
- src: url('iconfont.eot?t=1516507130714'); /* IE9*/
- src: url('iconfont.eot?t=1516507130714#iefix') format('embedded-opentype'), /* IE6-IE8 */
- url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAyQAAsAAAAAE1QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW7k3TY21hcAAAAYAAAACjAAACGEGg6XVnbHlmAAACJAAAB/cAAAwE8ttzW2hlYWQAAAocAAAALwAAADYQM6XyaGhlYQAACkwAAAAcAAAAJAfeA4tobXR4AAAKaAAAABQAAAAoJ+kAAGxvY2EAAAp8AAAAFgAAABYO5ApgbWF4cAAACpQAAAAeAAAAIAEkAS1uYW1lAAAKtAAAAUUAAAJtPlT+fXBvc3QAAAv8AAAAlAAAALLrxH1JeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sc4gYG [...]
- url('iconfont.ttf?t=1516507130714') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
- url('iconfont.svg?t=1516507130714#iconfont') format('svg'); /* iOS 4.1- */
+@font-face {
+ font-family: "iconfont";
+ src: url('iconfont.eot?t=1516507130714'); /* IE9 */
+ src:
+ url('iconfont.eot?t=1516507130714#iefix') format('embedded-opentype'),
+ url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAyQAAsAAAAAE1QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW7k3TY21hcAAAAYAAAACjAAACGEGg6XVnbHlmAAACJAAAB/cAAAwE8ttzW2hlYWQAAAocAAAALwAAADYQM6XyaGhlYQAACkwAAAAcAAAAJAfeA4tobXR4AAAKaAAAABQAAAAoJ+kAAGxvY2EAAAp8AAAAFgAAABYO5ApgbWF4cAAACpQAAAAeAAAAIAEkAS1uYW1lAAAKtAAAAUUAAAJtPlT+fXBvc3QAAAv8AAAAlAAAALLrxH1JeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sc4g [...]
+ url('iconfont.ttf?t=1516507130714') format('truetype'),
+ url('iconfont.svg?t=1516507130714#iconfont') format('svg'); /* iOS 4.1- */
}
.iconfont {
@@ -51,7 +53,7 @@
.iconfont:before {
display: block;
- font-family: "iconfont" !important;
+ font-family: iconfont, sans-serif !important;
}
.icon-server:before { content: "\ebe2"; }
diff --git a/src/common/menu.js b/src/common/menu.js
index 6df5e05..b3210b2 100644
--- a/src/common/menu.js
+++ b/src/common/menu.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import { isUrl } from '../utils/utils';
const menuData = [{
diff --git a/src/common/router.js b/src/common/router.js
index de25002..96d5981 100644
--- a/src/common/router.js
+++ b/src/common/router.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import { createElement } from 'react';
import dynamic from 'dva/dynamic';
import pathToRegexp from 'path-to-regexp';
diff --git a/src/components/ActiveChart/index.js b/src/components/ActiveChart/index.js
deleted file mode 100644
index d708641..0000000
--- a/src/components/ActiveChart/index.js
+++ /dev/null
@@ -1,82 +0,0 @@
-import React, { Component } from 'react';
-
-import { MiniArea } from '../Charts';
-import NumberInfo from '../NumberInfo';
-
-import styles from './index.less';
-
-function fixedZero(val) {
- return val * 1 < 10 ? `0${val}` : val;
-}
-
-function getActiveData() {
- const activeData = [];
- for (let i = 0; i < 24; i += 1) {
- activeData.push({
- x: `${fixedZero(i)}:00`,
- y: Math.floor(Math.random() * 200) + (i * 50),
- });
- }
- return activeData;
-}
-
-export default class ActiveChart extends Component {
- state = {
- activeData: getActiveData(),
- };
-
- componentDidMount() {
- this.timer = setInterval(() => {
- this.setState({
- activeData: getActiveData(),
- });
- }, 1000);
- }
-
- componentWillUnmount() {
- clearInterval(this.timer);
- }
-
- render() {
- const { activeData = [] } = this.state;
-
- return (
- <div className={styles.activeChart}>
- <NumberInfo subTitle="目标评估" total="有望达到预期" />
- <div style={{ marginTop: 32 }}>
- <MiniArea
- animate={false}
- line
- borderWidth={2}
- height={84}
- scale={{
- y: {
- tickCount: 3,
- },
- }}
- yAxis={{
- tickLine: false,
- label: false,
- title: false,
- line: false,
- }}
- data={activeData}
- />
- </div>
- {activeData && (
- <div className={styles.activeChartGrid}>
- <p>{[...activeData].sort()[activeData.length - 1].y + 200} 亿元</p>
- <p>{[...activeData].sort()[Math.floor(activeData.length / 2)].y} 亿元</p>
- </div>
- )}
- {activeData && (
- <div className={styles.activeChartLegend}>
- <span>00:00</span>
- <span>{activeData[Math.floor(activeData.length / 2)].x}</span>
- <span>{activeData[activeData.length - 1].x}</span>
- </div>
- )}
- </div>
- );
- }
-}
diff --git a/src/components/ActiveChart/index.less b/src/components/ActiveChart/index.less
deleted file mode 100644
index 8ecc323..0000000
--- a/src/components/ActiveChart/index.less
+++ /dev/null
@@ -1,31 +0,0 @@
-.activeChart {
- position: relative;
-}
-.activeChartGrid {
- p {
- position: absolute;
- top: 80px;
- }
- p:last-child {
- top: 115px;
- }
-}
-.activeChartLegend {
- position: relative;
- font-size: 0;
- margin-top: 8px;
- height: 20px;
- line-height: 20px;
- span {
- display: inline-block;
- font-size: 12px;
- text-align: center;
- width: 33.33%;
- }
- span:first-child {
- text-align: left;
- }
- span:last-child {
- text-align: right;
- }
-}
diff --git a/src/components/Authorized/Authorized.js b/src/components/Authorized/Authorized.js
index d9a2a78..ed5b804 100644
--- a/src/components/Authorized/Authorized.js
+++ b/src/components/Authorized/Authorized.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import CheckPermissions from './CheckPermissions';
diff --git a/src/components/Authorized/AuthorizedRoute.js b/src/components/Authorized/AuthorizedRoute.js
index 3d03226..846e2ec 100644
--- a/src/components/Authorized/AuthorizedRoute.js
+++ b/src/components/Authorized/AuthorizedRoute.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import { Route, Redirect } from 'react-router-dom';
import Authorized from './Authorized';
diff --git a/src/components/Authorized/CheckPermissions.js b/src/components/Authorized/CheckPermissions.js
index 0a7dbae..2793b82 100644
--- a/src/components/Authorized/CheckPermissions.js
+++ b/src/components/Authorized/CheckPermissions.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import PromiseRender from './PromiseRender';
import { CURRENT } from './index';
@@ -7,7 +25,6 @@ function isPromise(obj) {
}
/**
- * 通用权限检查方法
* Common check permissions method
* @param { 权限判定 Permission judgment type string |array | Promise | Function } authority
* @param { 你的权限 Your permission description type:string} currentAuthority
@@ -15,12 +32,10 @@ function isPromise(obj) {
* @param { 未通过的组件 no pass components } Exception
*/
const checkPermissions = (authority, currentAuthority, target, Exception) => {
- // 没有判定权限.默认查看所有
// Retirement authority, return target;
if (!authority) {
return target;
}
- // 数组处理
if (Array.isArray(authority)) {
if (authority.indexOf(currentAuthority) >= 0) {
return target;
@@ -28,7 +43,6 @@ const checkPermissions = (authority, currentAuthority, target, Exception) => {
return Exception;
}
- // string 处理
if (typeof authority === 'string') {
if (authority === currentAuthority) {
return target;
@@ -36,7 +50,6 @@ const checkPermissions = (authority, currentAuthority, target, Exception) => {
return Exception;
}
- // Promise 处理
if (isPromise(authority)) {
return () => (
<PromiseRender ok={target} error={Exception} promise={authority} />
diff --git a/src/components/Authorized/CheckPermissions.test.js b/src/components/Authorized/CheckPermissions.test.js
index eda08a7..e846b84 100644
--- a/src/components/Authorized/CheckPermissions.test.js
+++ b/src/components/Authorized/CheckPermissions.test.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import { checkPermissions } from './CheckPermissions.js';
const target = 'ok';
diff --git a/src/components/Authorized/PromiseRender.js b/src/components/Authorized/PromiseRender.js
index 78f762d..e0f0462 100644
--- a/src/components/Authorized/PromiseRender.js
+++ b/src/components/Authorized/PromiseRender.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import { Spin } from 'antd';
diff --git a/src/components/Authorized/Secured.js b/src/components/Authorized/Secured.js
index 1dc6fb1..8307e8c 100644
--- a/src/components/Authorized/Secured.js
+++ b/src/components/Authorized/Secured.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import Exception from '../Exception/index';
import CheckPermissions from './CheckPermissions';
diff --git a/src/components/Authorized/index.d.ts b/src/components/Authorized/index.d.ts
index 4a68fa1..5f5e297 100644
--- a/src/components/Authorized/index.d.ts
+++ b/src/components/Authorized/index.d.ts
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import * as React from 'react';
import { RouteProps } from 'react-router';
diff --git a/src/components/Authorized/index.js b/src/components/Authorized/index.js
index c39de29..d0c0946 100644
--- a/src/components/Authorized/index.js
+++ b/src/components/Authorized/index.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import Authorized from './Authorized';
import AuthorizedRoute from './AuthorizedRoute';
import Secured from './Secured';
diff --git a/src/components/AvatarList/demo/simple.md b/src/components/AvatarList/demo/simple.md
deleted file mode 100644
index e941aea..0000000
--- a/src/components/AvatarList/demo/simple.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-order: 0
-title:
- zh-CN: 基础样例
- en-US: Basic Usage
----
-
-Simplest of usage.
-
-````jsx
-import AvatarList from 'ant-design-pro/lib/AvatarList';
-
-ReactDOM.render(
- <AvatarList size="mini">
- <AvatarList.Item tips="Jake" src="https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png" />
- <AvatarList.Item tips="Andy" src="https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png" />
- <AvatarList.Item tips="Niko" src="https://gw.alipayobjects.com/zos/rmsportal/kZzEzemZyKLKFsojXItE.png" />
- </AvatarList>
-, mountNode);
-````
diff --git a/src/components/AvatarList/index.d.ts b/src/components/AvatarList/index.d.ts
deleted file mode 100644
index 101a70d..0000000
--- a/src/components/AvatarList/index.d.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import * as React from "react";
-export interface AvatarItemProps {
- tips: React.ReactNode;
- src: string;
- style?: React.CSSProperties;
-}
-
-export interface AvatarListProps {
- size?: "large" | "small" | "mini" | "default";
- style?: React.CSSProperties;
- children:
- | React.ReactElement<AvatarItem>
- | Array<React.ReactElement<AvatarItem>>;
-}
-
-declare class AvatarItem extends React.Component<AvatarItemProps, any> {
- constructor(props: AvatarItemProps);
-}
-
-export default class AvatarList extends React.Component<AvatarListProps, any> {
- constructor(props: AvatarListProps);
- static Item: typeof AvatarItem;
-}
diff --git a/src/components/AvatarList/index.en-US.md b/src/components/AvatarList/index.en-US.md
deleted file mode 100644
index 58daaf9..0000000
--- a/src/components/AvatarList/index.en-US.md
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: AvatarList
-order: 1
-cols: 1
----
-
-A list of user's avatar for project or group member list frequently. If a large or small AvatarList is desired, set the `size` property to either `large` or `small` and `mini` respectively. Omit the `size` property for a AvatarList with the default size.
-
-## API
-
-### AvatarList
-
-| Property | Description | Type | Default |
-|----------|------------------------------------------|-------------|-------|
-| size | size of list | `large`、`small` 、`mini`, `default` | `default` |
-
-### AvatarList.Item
-
-| Property | Description | Type | Default |
-|----------|------------------------------------------|-------------|-------|
-| tips | title tips for avatar item | ReactNode\/string | - |
-| src | the address of the image for an image avatar | string | - |
diff --git a/src/components/AvatarList/index.js b/src/components/AvatarList/index.js
deleted file mode 100644
index 08c502f..0000000
--- a/src/components/AvatarList/index.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from 'react';
-import { Tooltip, Avatar } from 'antd';
-import classNames from 'classnames';
-
-import styles from './index.less';
-
-const AvatarList = ({ children, size, ...other }) => {
- const childrenWithProps = React.Children.map(children, child =>
- React.cloneElement(child, {
- size,
- })
- );
-
- return (
- <div {...other} className={styles.avatarList}>
- <ul> {childrenWithProps} </ul>
- </div>
- );
-};
-
-const Item = ({ src, size, tips, onClick = (() => {}) }) => {
- const cls = classNames(styles.avatarItem, {
- [styles.avatarItemLarge]: size === 'large',
- [styles.avatarItemSmall]: size === 'small',
- [styles.avatarItemMini]: size === 'mini',
- });
-
- return (
- <li className={cls} onClick={onClick} >
- {
- tips ? (
- <Tooltip title={tips}>
- <Avatar src={src} size={size} style={{ cursor: 'pointer' }} />
- </Tooltip>
- ) : <Avatar src={src} size={size} />
- }
- </li>
- );
-};
-
-AvatarList.Item = Item;
-
-export default AvatarList;
diff --git a/src/components/AvatarList/index.less b/src/components/AvatarList/index.less
deleted file mode 100644
index 601babd..0000000
--- a/src/components/AvatarList/index.less
+++ /dev/null
@@ -1,45 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.avatarList {
- display: inline-block;
- ul {
- display: inline-block;
- margin-left: 8px;
- font-size: 0;
- }
-}
-
-.avatarItem {
- display: inline-block;
- font-size: @font-size-base;
- margin-left: -8px;
- width: @avatar-size-base;
- height: @avatar-size-base;
- :global {
- .ant-avatar {
- border: 1px solid #fff;
- }
- }
-}
-
-.avatarItemLarge {
- width: @avatar-size-lg;
- height: @avatar-size-lg;
-}
-
-.avatarItemSmall {
- width: @avatar-size-sm;
- height: @avatar-size-sm;
-}
-
-.avatarItemMini {
- width: 20px;
- height: 20px;
- :global {
- .ant-avatar {
- width: 20px;
- height: 20px;
- line-height: 20px;
- }
- }
-}
diff --git a/src/components/AvatarList/index.zh-CN.md b/src/components/AvatarList/index.zh-CN.md
deleted file mode 100644
index c229a5d..0000000
--- a/src/components/AvatarList/index.zh-CN.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: AvatarList
-subtitle: 用户头像列表
-order: 1
-cols: 1
----
-
-一组用户头像,常用在项目/团队成员列表。可通过设置 `size` 属性来指定头像大小。
-
-## API
-
-### AvatarList
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| size | 头像大小 | `large`、`small` 、`mini`, `default` | `default` |
-
-### AvatarList.Item
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| tips | 头像展示文案 | ReactNode\/string | - |
-| src | 头像图片连接 | string | - |
diff --git a/src/components/Charts/Gauge/index.d.ts b/src/components/Charts/Gauge/index.d.ts
deleted file mode 100644
index 218fccf..0000000
--- a/src/components/Charts/Gauge/index.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import * as React from "react";
-export interface GaugeProps {
- title: React.ReactNode;
- color?: string;
- height: number;
- bgColor?: number;
- percent: number;
- style?: React.CSSProperties;
-}
-
-export default class Gauge extends React.Component<GaugeProps, any> {}
diff --git a/src/components/Charts/Gauge/index.js b/src/components/Charts/Gauge/index.js
deleted file mode 100644
index 608b0f2..0000000
--- a/src/components/Charts/Gauge/index.js
+++ /dev/null
@@ -1,167 +0,0 @@
-import React from 'react';
-import { Chart, Geom, Axis, Coord, Guide, Shape } from 'bizcharts';
-import autoHeight from '../autoHeight';
-
-const { Arc, Html, Line } = Guide;
-
-const defaultFormatter = (val) => {
- switch (val) {
- case '2':
- return '差';
- case '4':
- return '中';
- case '6':
- return '良';
- case '8':
- return '优';
- default:
- return '';
- }
-};
-
-Shape.registerShape('point', 'pointer', {
- drawShape(cfg, group) {
- let point = cfg.points[0];
- point = this.parsePoint(point);
- const center = this.parsePoint({
- x: 0,
- y: 0,
- });
- group.addShape('line', {
- attrs: {
- x1: center.x,
- y1: center.y,
- x2: point.x,
- y2: point.y,
- stroke: cfg.color,
- lineWidth: 2,
- lineCap: 'round',
- },
- });
- return group.addShape('circle', {
- attrs: {
- x: center.x,
- y: center.y,
- r: 6,
- stroke: cfg.color,
- lineWidth: 3,
- fill: '#fff',
- },
- });
- },
-});
-
-@autoHeight()
-export default class Gauge extends React.Component {
- render() {
- const {
- title,
- height,
- percent,
- forceFit = true,
- formatter = defaultFormatter,
- color = '#2F9CFF',
- bgColor = '#F0F2F5',
- } = this.props;
- const cols = {
- value: {
- type: 'linear',
- min: 0,
- max: 10,
- tickCount: 6,
- nice: true,
- },
- };
- const data = [{ value: percent / 10 }];
- return (
- <Chart height={height} data={data} scale={cols} padding={[-16, 0, 16, 0]} forceFit={forceFit}>
- <Coord type="polar" startAngle={-1.25 * Math.PI} endAngle={0.25 * Math.PI} radius={0.8} />
- <Axis name="1" line={null} />
- <Axis
- line={null}
- tickLine={null}
- subTickLine={null}
- name="value"
- zIndex={2}
- gird={null}
- label={{
- offset: -12,
- formatter,
- textStyle: {
- fontSize: 12,
- fill: 'rgba(0, 0, 0, 0.65)',
- textAlign: 'center',
- },
- }}
- />
- <Guide>
- <Line
- start={[3, 0.905]}
- end={[3, 0.85]}
- lineStyle={{
- stroke: color,
- lineDash: null,
- lineWidth: 2,
- }}
- />
- <Line
- start={[5, 0.905]}
- end={[5, 0.85]}
- lineStyle={{
- stroke: color,
- lineDash: null,
- lineWidth: 3,
- }}
- />
- <Line
- start={[7, 0.905]}
- end={[7, 0.85]}
- lineStyle={{
- stroke: color,
- lineDash: null,
- lineWidth: 3,
- }}
- />
- <Arc
- zIndex={0}
- start={[0, 0.965]}
- end={[10, 0.965]}
- style={{
- stroke: bgColor,
- lineWidth: 10,
- }}
- />
- <Arc
- zIndex={1}
- start={[0, 0.965]}
- end={[data[0].value, 0.965]}
- style={{
- stroke: color,
- lineWidth: 10,
- }}
- />
- <Html
- position={['50%', '95%']}
- html={() => {
- return `
- <div style="width: 300px;text-align: center;font-size: 12px!important;">
- <p style="font-size: 14px; color: rgba(0,0,0,0.43);margin: 0;">${title}</p>
- <p style="font-size: 24px;color: rgba(0,0,0,0.85);margin: 0;">
- ${data[0].value * 10}%
- </p>
- </div>`;
- }}
- />
- </Guide>
- <Geom
- line={false}
- type="point"
- position="value*1"
- shape="pointer"
- color={color}
- active={false}
- />
- </Chart>
- );
- }
-}
diff --git a/src/components/Charts/MiniProgress/index.d.ts b/src/components/Charts/MiniProgress/index.d.ts
deleted file mode 100644
index 4dde605..0000000
--- a/src/components/Charts/MiniProgress/index.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import * as React from "react";
-export interface MiniProgressProps {
- target: number;
- color?: string;
- strokeWidth?: number;
- percent?: number;
- style?: React.CSSProperties;
-}
-
-export default class MiniProgress extends React.Component<
- MiniProgressProps,
- any
-> {}
diff --git a/src/components/Charts/MiniProgress/index.js b/src/components/Charts/MiniProgress/index.js
deleted file mode 100644
index 08fe9b5..0000000
--- a/src/components/Charts/MiniProgress/index.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import React from 'react';
-import { Tooltip } from 'antd';
-
-import styles from './index.less';
-
-const MiniProgress = ({ target, color = 'rgb(19, 194, 194)', strokeWidth, percent }) => (
- <div className={styles.miniProgress}>
- <Tooltip title={`目标值: ${target}%`}>
- <div
- className={styles.target}
- style={{ left: (target ? `${target}%` : null) }}
- >
- <span style={{ backgroundColor: (color || null) }} />
- <span style={{ backgroundColor: (color || null) }} />
- </div>
- </Tooltip>
- <div className={styles.progressWrap}>
- <div
- className={styles.progress}
- style={{
- backgroundColor: (color || null),
- width: (percent ? `${percent}%` : null),
- height: (strokeWidth || null),
- }}
- />
- </div>
- </div>
-);
-
-export default MiniProgress;
diff --git a/src/components/Charts/MiniProgress/index.less b/src/components/Charts/MiniProgress/index.less
deleted file mode 100644
index 06823be..0000000
--- a/src/components/Charts/MiniProgress/index.less
+++ /dev/null
@@ -1,35 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.miniProgress {
- padding: 5px 0;
- position: relative;
- width: 100%;
- .progressWrap {
- background-color: @background-color-base;
- position: relative;
- }
- .progress {
- transition: all .4s cubic-bezier(.08, .82, .17, 1) 0s;
- border-radius: 1px 0 0 1px;
- background-color: @primary-color;
- width: 0;
- height: 100%;
- }
- .target {
- position: absolute;
- top: 0;
- bottom: 0;
- span {
- border-radius: 100px;
- position: absolute;
- top: 0;
- left: 0;
- height: 4px;
- width: 2px;
- }
- span:last-child {
- top: auto;
- bottom: 0;
- }
- }
-}
diff --git a/src/components/Charts/Radar/index.d.ts b/src/components/Charts/Radar/index.d.ts
deleted file mode 100644
index 772cbf0..0000000
--- a/src/components/Charts/Radar/index.d.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import * as React from "react";
-export interface RadarProps {
- title?: React.ReactNode;
- height: number;
- padding?: [number, number, number, number];
- hasLegend?: boolean;
- data: Array<{
- name: string;
- label: string;
- value: string;
- }>;
- style?: React.CSSProperties;
-}
-
-export default class Radar extends React.Component<RadarProps, any> {}
diff --git a/src/components/Charts/Radar/index.js b/src/components/Charts/Radar/index.js
deleted file mode 100644
index 03aaa70..0000000
--- a/src/components/Charts/Radar/index.js
+++ /dev/null
@@ -1,180 +0,0 @@
-import React, { Component } from 'react';
-import { Chart, Tooltip, Geom, Coord, Axis } from 'bizcharts';
-import { Row, Col } from 'antd';
-import autoHeight from '../autoHeight';
-import styles from './index.less';
-
-/* eslint react/no-danger:0 */
-@autoHeight()
-export default class Radar extends Component {
- state = {
- legendData: [],
- };
-
- componentDidMount() {
- this.getLengendData();
- }
-
- componentWillReceiveProps(nextProps) {
- if (this.props.data !== nextProps.data) {
- this.getLengendData();
- }
- }
-
- getG2Instance = (chart) => {
- this.chart = chart;
- };
-
- // for custom lengend view
- getLengendData = () => {
- if (!this.chart) return;
- const geom = this.chart.getAllGeoms()[0]; // 获取所有的图形
- const items = geom.get('dataArray') || []; // 获取图形对应的
-
- const legendData = items.map((item) => {
- // eslint-disable-next-line
- const origins = item.map(t => t._origin);
- const result = {
- name: origins[0].name,
- color: item[0].color,
- checked: true,
- value: origins.reduce((p, n) => p + n.value, 0),
- };
-
- return result;
- });
-
- this.setState({
- legendData,
- });
- };
-
- handleRef = (n) => {
- this.node = n;
- };
-
- handleLegendClick = (item, i) => {
- const newItem = item;
- newItem.checked = !newItem.checked;
-
- const { legendData } = this.state;
- legendData[i] = newItem;
-
- const filteredLegendData = legendData.filter(l => l.checked).map(l => l.name);
-
- if (this.chart) {
- this.chart.filter('name', val => filteredLegendData.indexOf(val) > -1);
- this.chart.repaint();
- }
-
- this.setState({
- legendData,
- });
- };
-
- render() {
- const defaultColors = [
- '#1890FF',
- '#FACC14',
- '#2FC25B',
- '#8543E0',
- '#F04864',
- '#13C2C2',
- '#fa8c16',
- '#a0d911',
- ];
-
- const {
- data = [],
- height = 0,
- title,
- hasLegend = false,
- forceFit = true,
- tickCount = 4,
- padding = [35, 30, 16, 30],
- animate = true,
- colors = defaultColors,
- } = this.props;
-
- const { legendData } = this.state;
-
- const scale = {
- value: {
- min: 0,
- tickCount,
- },
- };
-
- const chartHeight = height - (hasLegend ? 80 : 22);
-
- return (
- <div className={styles.radar} style={{ height }}>
- <div>
- {title && <h4>{title}</h4>}
- <Chart
- scale={scale}
- height={chartHeight}
- forceFit={forceFit}
- data={data}
- padding={padding}
- animate={animate}
- onGetG2Instance={this.getG2Instance}
- >
- <Tooltip />
- <Coord type="polar" />
- <Axis
- name="label"
- line={null}
- tickLine={null}
- grid={{
- lineStyle: {
- lineDash: null,
- },
- hideFirstLine: false,
- }}
- />
- <Axis
- name="value"
- grid={{
- type: 'polygon',
- lineStyle: {
- lineDash: null,
- },
- }}
- />
- <Geom type="line" position="label*value" color={['name', colors]} size={1} />
- <Geom
- type="point"
- position="label*value"
- color={['name', colors]}
- shape="circle"
- size={3}
- />
- </Chart>
- {hasLegend && (
- <Row className={styles.legend}>
- {legendData.map((item, i) => (
- <Col
- span={24 / legendData.length}
- key={item.name}
- onClick={() => this.handleLegendClick(item, i)}
- >
- <div className={styles.legendItem}>
- <p>
- <span
- className={styles.dot}
- style={{ backgroundColor: !item.checked ? '#aaa' : item.color }}
- />
- <span>{item.name}</span>
- </p>
- <h6>{item.value}</h6>
- </div>
- </Col>
- ))}
- </Row>
- )}
- </div>
- </div>
- );
- }
-}
diff --git a/src/components/Charts/Radar/index.less b/src/components/Charts/Radar/index.less
deleted file mode 100644
index 378db9c..0000000
--- a/src/components/Charts/Radar/index.less
+++ /dev/null
@@ -1,46 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.radar {
- .legend {
- margin-top: 16px;
- .legendItem {
- position: relative;
- text-align: center;
- cursor: pointer;
- color: @text-color-secondary;
- line-height: 22px;
- p {
- margin: 0;
- }
- h6 {
- color: @heading-color;
- padding-left: 16px;
- font-size: 24px;
- line-height: 32px;
- margin-top: 4px;
- margin-bottom: 0;
- }
- &:after {
- background-color: @border-color-split;
- position: absolute;
- top: 8px;
- right: 0;
- height: 40px;
- width: 1px;
- content: '';
- }
- }
- > :last-child .legendItem:after {
- display: none;
- }
- .dot {
- border-radius: 6px;
- display: inline-block;
- margin-right: 6px;
- position: relative;
- top: -1px;
- height: 6px;
- width: 6px;
- }
- }
-}
diff --git a/src/components/Charts/TagCloud/index.d.ts b/src/components/Charts/TagCloud/index.d.ts
deleted file mode 100644
index e2dcc79..0000000
--- a/src/components/Charts/TagCloud/index.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import * as React from "react";
-export interface TagCloudProps {
- data: Array<{
- name: string;
- value: number;
- }>;
- height: number;
- style?: React.CSSProperties;
-}
-
-export default class TagCloud extends React.Component<TagCloudProps, any> {}
diff --git a/src/components/Charts/TagCloud/index.js b/src/components/Charts/TagCloud/index.js
deleted file mode 100644
index 77e63fa..0000000
--- a/src/components/Charts/TagCloud/index.js
+++ /dev/null
@@ -1,164 +0,0 @@
-import React, { Component } from 'react';
-import { Chart, Geom, Coord, Shape } from 'bizcharts';
-import DataSet from '@antv/data-set';
-import Debounce from 'lodash-decorators/debounce';
-import Bind from 'lodash-decorators/bind';
-import classNames from 'classnames';
-import autoHeight from '../autoHeight';
-import styles from './index.less';
-
-/* eslint no-underscore-dangle: 0 */
-/* eslint no-param-reassign: 0 */
-
-const imgUrl = 'https://gw.alipayobjects.com/zos/rmsportal/gWyeGLCdFFRavBGIDzWk.png';
-
-@autoHeight()
-class TagCloud extends Component {
- state = {
- dv: null,
- };
-
- componentDidMount() {
- this.initTagCloud();
- this.renderChart();
- window.addEventListener('resize', this.resize);
- }
-
- componentWillReceiveProps(nextProps) {
- if (JSON.stringify(nextProps.data) !== JSON.stringify(this.props.data)) {
- this.renderChart(nextProps);
- }
- }
-
- componentWillUnmount() {
- this.isUnmount = true;
- window.removeEventListener('resize', this.resize);
- }
-
- resize = () => {
- this.renderChart();
- };
-
- saveRootRef = (node) => {
- this.root = node;
- };
-
- initTagCloud = () => {
- function getTextAttrs(cfg) {
- return Object.assign(
- {},
- {
- fillOpacity: cfg.opacity,
- fontSize: cfg.origin._origin.size,
- rotate: cfg.origin._origin.rotate,
- text: cfg.origin._origin.text,
- textAlign: 'center',
- fontFamily: cfg.origin._origin.font,
- fill: cfg.color,
- textBaseline: 'Alphabetic',
- },
- cfg.style
- );
- }
-
- // 给point注册一个词云的shape
- Shape.registerShape('point', 'cloud', {
- drawShape(cfg, container) {
- const attrs = getTextAttrs(cfg);
- return container.addShape('text', {
- attrs: Object.assign(attrs, {
- x: cfg.x,
- y: cfg.y,
- }),
- });
- },
- });
- };
-
- @Bind()
- @Debounce(500)
- renderChart = (nextProps) => {
- // const colors = ['#1890FF', '#41D9C7', '#2FC25B', '#FACC14', '#9AE65C'];
- const { data, height } = nextProps || this.props;
-
- if (data.length < 1 || !this.root) {
- return;
- }
-
- const h = height * 4;
- const w = this.root.offsetWidth * 4;
-
- const onload = () => {
- const dv = new DataSet.View().source(data);
- const range = dv.range('value');
- const [min, max] = range;
- dv.transform({
- type: 'tag-cloud',
- fields: ['name', 'value'],
- imageMask: this.imageMask,
- font: 'Verdana',
- size: [w, h], // 宽高设置最好根据 imageMask 做调整
- padding: 5,
- timeInterval: 5000, // max execute time
- rotate() {
- return 0;
- },
- fontSize(d) {
- // eslint-disable-next-line
- return Math.pow((d.value - min) / (max - min), 2) * (70 - 20) + 20;
- },
- });
-
- if (this.isUnmount) {
- return;
- }
-
- this.setState({
- dv,
- w,
- h,
- });
- };
-
- if (!this.imageMask) {
- this.imageMask = new Image();
- this.imageMask.crossOrigin = '';
- this.imageMask.src = imgUrl;
-
- this.imageMask.onload = onload;
- } else {
- onload();
- }
- };
-
- render() {
- const { className, height } = this.props;
- const { dv, w, h } = this.state;
-
- return (
- <div
- className={classNames(styles.tagCloud, className)}
- style={{ width: '100%', height }}
- ref={this.saveRootRef}
- >
- {dv && (
- <Chart
- width={w}
- height={h}
- data={dv}
- padding={0}
- scale={{
- x: { nice: false },
- y: { nice: false },
- }}
- >
- <Coord reflect="y" />
- <Geom type="point" position="x*y" color="text" shape="cloud" />
- </Chart>
- )}
- </div>
- );
- }
-}
-
-export default TagCloud;
diff --git a/src/components/Charts/TagCloud/index.less b/src/components/Charts/TagCloud/index.less
deleted file mode 100644
index f5c12ad..0000000
--- a/src/components/Charts/TagCloud/index.less
+++ /dev/null
@@ -1,7 +0,0 @@
-.tagCloud {
- overflow: hidden;
- canvas {
- transform: scale(0.25);
- transform-origin: 0 0;
- }
-}
diff --git a/src/components/Charts/TimelineChart/index.d.ts b/src/components/Charts/TimelineChart/index.d.ts
deleted file mode 100644
index f9241fa..0000000
--- a/src/components/Charts/TimelineChart/index.d.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import * as React from "react";
-export interface TimelineChartProps {
- data: Array<{
- x: string;
- y1: string;
- y2: string;
- }>;
- titleMap: { y1: string; y2: string };
- padding?: [number, number, number, number];
- height?: number;
- style?: React.CSSProperties;
-}
-
-export default class TimelineChart extends React.Component<
- TimelineChartProps,
- any
-> {}
diff --git a/src/components/Charts/TimelineChart/index.js b/src/components/Charts/TimelineChart/index.js
deleted file mode 100644
index 3864983..0000000
--- a/src/components/Charts/TimelineChart/index.js
+++ /dev/null
@@ -1,123 +0,0 @@
-import React from 'react';
-import { Chart, Tooltip, Geom, Legend, Axis } from 'bizcharts';
-import DataSet from '@antv/data-set';
-import Slider from 'bizcharts-plugin-slider';
-import autoHeight from '../autoHeight';
-import styles from './index.less';
-
-@autoHeight()
-export default class TimelineChart extends React.Component {
- render() {
- const {
- title,
- height = 400,
- padding = [60, 20, 40, 40],
- titleMap = {
- y1: 'y1',
- y2: 'y2',
- },
- borderWidth = 2,
- data = [
- {
- x: 0,
- y1: 0,
- y2: 0,
- },
- ],
- } = this.props;
-
- data.sort((a, b) => a.x - b.x);
-
- let max;
- if (data[0] && data[0].y1 && data[0].y2) {
- max = Math.max(
- [...data].sort((a, b) => b.y1 - a.y1)[0].y1,
- [...data].sort((a, b) => b.y2 - a.y2)[0].y2
- );
- }
-
- const ds = new DataSet({
- state: {
- start: data[0].x,
- end: data[data.length - 1].x,
- },
- });
-
- const dv = ds.createView();
- dv
- .source(data)
- .transform({
- type: 'filter',
- callback: (obj) => {
- const date = obj.x;
- return date <= ds.state.end && date >= ds.state.start;
- },
- })
- .transform({
- type: 'map',
- callback(row) {
- const newRow = { ...row };
- newRow[titleMap.y1] = row.y1;
- newRow[titleMap.y2] = row.y2;
- return newRow;
- },
- })
- .transform({
- type: 'fold',
- fields: [titleMap.y1, titleMap.y2], // 展开字段集
- key: 'key', // key字段
- value: 'value', // value字段
- });
-
- const timeScale = {
- type: 'time',
- tickCount: 10,
- mask: 'HH:MM',
- range: [0, 1],
- };
-
- const cols = {
- x: timeScale,
- value: {
- max,
- min: 0,
- },
- };
-
- const SliderGen = () => (
- <Slider
- padding={[0, padding[1] + 20, 0, padding[3]]}
- width="auto"
- height={26}
- xAxis="x"
- yAxis="y1"
- scales={{ x: timeScale }}
- data={data}
- start={ds.state.start}
- end={ds.state.end}
- backgroundChart={{ type: 'line' }}
- onChange={({ startValue, endValue }) => {
- ds.setState('start', startValue);
- ds.setState('end', endValue);
- }}
- />
- );
-
- return (
- <div className={styles.timelineChart} style={{ height: height + 30 }}>
- <div>
- {title && <h4>{title}</h4>}
- <Chart height={height} padding={padding} data={dv} scale={cols} forceFit>
- <Axis name="x" />
- <Tooltip />
- <Legend name="key" position="top" />
- <Geom type="line" position="x*value" size={borderWidth} color="key" />
- </Chart>
- <div style={{ marginRight: -20 }}>
- <SliderGen />
- </div>
- </div>
- </div>
- );
- }
-}
diff --git a/src/components/Charts/TimelineChart/index.less b/src/components/Charts/TimelineChart/index.less
deleted file mode 100644
index 1751975..0000000
--- a/src/components/Charts/TimelineChart/index.less
+++ /dev/null
@@ -1,3 +0,0 @@
-.timelineChart {
- background: #fff;
-}
diff --git a/src/components/Charts/WaterWave/index.d.ts b/src/components/Charts/WaterWave/index.d.ts
deleted file mode 100644
index 309db7b..0000000
--- a/src/components/Charts/WaterWave/index.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import * as React from 'react';
-export interface WaterWaveProps {
- title: React.ReactNode;
- color?: string;
- height: number;
- percent: number;
- style?: React.CSSProperties;
-}
-
-export default class WaterWave extends React.Component<WaterWaveProps, any> {}
diff --git a/src/components/Charts/WaterWave/index.js b/src/components/Charts/WaterWave/index.js
deleted file mode 100644
index 5b463ad..0000000
--- a/src/components/Charts/WaterWave/index.js
+++ /dev/null
@@ -1,197 +0,0 @@
-import React, { PureComponent } from 'react';
-import autoHeight from '../autoHeight';
-import styles from './index.less';
-
-/* eslint no-return-assign: 0 */
-/* eslint no-mixed-operators: 0 */
-// riddle: https://riddle.alibaba-inc.com/riddles/2d9a4b90
-
-@autoHeight()
-export default class WaterWave extends PureComponent {
- state = {
- radio: 1,
- };
-
- componentDidMount() {
- this.renderChart();
- this.resize();
-
- window.addEventListener('resize', this.resize);
- }
-
- componentWillUnmount() {
- cancelAnimationFrame(this.timer);
- if (this.node) {
- this.node.innerHTML = '';
- }
- window.removeEventListener('resize', this.resize);
- }
-
- resize = () => {
- const { height } = this.props;
- const { offsetWidth } = this.root.parentNode;
- this.setState({
- radio: offsetWidth < height ? offsetWidth / height : 1,
- });
- };
-
- renderChart() {
- const { percent, color = '#1890FF' } = this.props;
- const data = percent / 100;
- const self = this;
-
- if (!this.node || !data) {
- return;
- }
-
- const canvas = this.node;
- const ctx = canvas.getContext('2d');
-
- const canvasWidth = canvas.width;
- const canvasHeight = canvas.height;
- const radius = canvasWidth / 2;
- const lineWidth = 2;
- const cR = radius - lineWidth;
-
- ctx.beginPath();
- ctx.lineWidth = lineWidth * 2;
-
- const axisLength = canvasWidth - lineWidth;
- const unit = axisLength / 8;
- const range = 0.2; // 振幅
- let currRange = range;
- const xOffset = lineWidth;
- let sp = 0; // 周期偏移量
- let currData = 0;
- const waveupsp = 0.005; // 水波上涨速度
-
- let arcStack = [];
- const bR = radius - lineWidth;
- const circleOffset = -(Math.PI / 2);
- let circleLock = true;
-
- for (let i = circleOffset; i < circleOffset + 2 * Math.PI; i += 1 / (8 * Math.PI)) {
- arcStack.push([radius + bR * Math.cos(i), radius + bR * Math.sin(i)]);
- }
-
- const cStartPoint = arcStack.shift();
- ctx.strokeStyle = color;
- ctx.moveTo(cStartPoint[0], cStartPoint[1]);
-
- function drawSin() {
- ctx.beginPath();
- ctx.save();
-
- const sinStack = [];
- for (let i = xOffset; i <= xOffset + axisLength; i += 20 / axisLength) {
- const x = sp + (xOffset + i) / unit;
- const y = Math.sin(x) * currRange;
- const dx = i;
- const dy = 2 * cR * (1 - currData) + (radius - cR) - unit * y;
-
- ctx.lineTo(dx, dy);
- sinStack.push([dx, dy]);
- }
-
- const startPoint = sinStack.shift();
-
- ctx.lineTo(xOffset + axisLength, canvasHeight);
- ctx.lineTo(xOffset, canvasHeight);
- ctx.lineTo(startPoint[0], startPoint[1]);
-
- const gradient = ctx.createLinearGradient(0, 0, 0, canvasHeight);
- gradient.addColorStop(0, '#ffffff');
- gradient.addColorStop(1, '#1890FF');
- ctx.fillStyle = gradient;
- ctx.fill();
- ctx.restore();
- }
-
- function render() {
- ctx.clearRect(0, 0, canvasWidth, canvasHeight);
- if (circleLock) {
- if (arcStack.length) {
- const temp = arcStack.shift();
- ctx.lineTo(temp[0], temp[1]);
- ctx.stroke();
- } else {
- circleLock = false;
- ctx.lineTo(cStartPoint[0], cStartPoint[1]);
- ctx.stroke();
- arcStack = null;
-
- ctx.globalCompositeOperation = 'destination-over';
- ctx.beginPath();
- ctx.lineWidth = lineWidth;
- ctx.arc(radius, radius, bR, 0, 2 * Math.PI, 1);
-
- ctx.beginPath();
- ctx.save();
- ctx.arc(radius, radius, radius - 3 * lineWidth, 0, 2 * Math.PI, 1);
-
- ctx.restore();
- ctx.clip();
- ctx.fillStyle = '#1890FF';
- }
- } else {
- if (data >= 0.85) {
- if (currRange > range / 4) {
- const t = range * 0.01;
- currRange -= t;
- }
- } else if (data <= 0.1) {
- if (currRange < range * 1.5) {
- const t = range * 0.01;
- currRange += t;
- }
- } else {
- if (currRange <= range) {
- const t = range * 0.01;
- currRange += t;
- }
- if (currRange >= range) {
- const t = range * 0.01;
- currRange -= t;
- }
- }
- if (data - currData > 0) {
- currData += waveupsp;
- }
- if (data - currData < 0) {
- currData -= waveupsp;
- }
-
- sp += 0.07;
- drawSin();
- }
- self.timer = requestAnimationFrame(render);
- }
-
- render();
- }
-
- render() {
- const { radio } = this.state;
- const { percent, title, height } = this.props;
- return (
- <div
- className={styles.waterWave}
- ref={n => (this.root = n)}
- style={{ transform: `scale(${radio})` }}
- >
- <div style={{ width: height, height, overflow: 'hidden' }}>
- <canvas
- className={styles.waterWaveCanvasWrapper}
- ref={n => (this.node = n)}
- width={height * 2}
- height={height * 2}
- />
- </div>
- <div className={styles.text} style={{ width: height }}>
- {title && <span>{title}</span>}
- <h4>{percent}%</h4>
- </div>
- </div>
- );
- }
-}
diff --git a/src/components/Charts/WaterWave/index.less b/src/components/Charts/WaterWave/index.less
deleted file mode 100644
index d185ca3..0000000
--- a/src/components/Charts/WaterWave/index.less
+++ /dev/null
@@ -1,28 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.waterWave {
- display: inline-block;
- position: relative;
- transform-origin: left;
- .text {
- position: absolute;
- left: 0;
- top: 32px;
- text-align: center;
- width: 100%;
- span {
- color: @text-color-secondary;
- font-size: 14px;
- line-height: 22px;
- }
- h4 {
- color: @heading-color;
- line-height: 32px;
- font-size: 24px;
- }
- }
- .waterWaveCanvasWrapper {
- transform: scale(.5);
- transform-origin: 0 0;
- }
-}
diff --git a/src/components/Charts/demo/bar.md b/src/components/Charts/demo/bar.md
deleted file mode 100644
index 955f44e..0000000
--- a/src/components/Charts/demo/bar.md
+++ /dev/null
@@ -1,26 +0,0 @@
----
-order: 4
-title: 柱状图
----
-
-通过设置 `x`,`y` 属性,可以快速的构建出一个漂亮的柱状图,各种纬度的关系则是通过自定义的数据展现。
-
-````jsx
-import { Bar } from 'ant-design-pro/lib/Charts';
-
-const salesData = [];
-for (let i = 0; i < 12; i += 1) {
- salesData.push({
- x: `${i + 1}月`,
- y: Math.floor(Math.random() * 1000) + 200,
- });
-}
-
-ReactDOM.render(
- <Bar
- height={200}
- title="销售额趋势"
- data={salesData}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/chart-card.md b/src/components/Charts/demo/chart-card.md
deleted file mode 100644
index 5120479..0000000
--- a/src/components/Charts/demo/chart-card.md
+++ /dev/null
@@ -1,65 +0,0 @@
----
-order: 1
-title: 图表卡片
----
-
-用于展示图表的卡片容器,可以方便的配合其它图表套件展示丰富信息。
-
-````jsx
-import { ChartCard, yuan, Field } from 'ant-design-pro/lib/Charts';
-import Trend from 'ant-design-pro/lib/Trend';
-import { Row, Col, Icon, Tooltip } from 'antd';
-import numeral from 'numeral';
-
-ReactDOM.render(
- <Row>
- <Col span={24}>
- <ChartCard
- title="销售额"
- action={<Tooltip title="指标说明"><Icon type="info-circle-o" /></Tooltip>}
- total={yuan(126560)}
- footer={<Field label="日均销售额" value={numeral(12423).format('0,0')} />}
- contentHeight={46}
- >
- <span>
- 周同比
- <Trend flag="up" style={{ marginLeft: 8, color: 'rgba(0,0,0,.85)' }}>12%</Trend>
- </span>
- <span style={{ marginLeft: 16 }}>
- 日环比
- <Trend flag="down" style={{ marginLeft: 8, color: 'rgba(0,0,0,.85)' }}>11%</Trend>
- </span>
- </ChartCard>
- </Col>
- <Col span={24} style={{ marginTop: 24 }}>
- <ChartCard
- title="移动指标"
- avatar={
- <img
- style={{ width: 56, height: 56 }}
- src="https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png"
- alt="indicator"
- />
- }
- action={<Tooltip title="指标说明"><Icon type="info-circle-o" /></Tooltip>}
- total={yuan(126560)}
- footer={<Field label="日均销售额" value={numeral(12423).format('0,0')} />}
- />
- </Col>
- <Col span={24} style={{ marginTop: 24 }}>
- <ChartCard
- title="移动指标"
- avatar={(
- <img
- alt="indicator"
- style={{ width: 56, height: 56 }}
- src="https://gw.alipayobjects.com/zos/rmsportal/dURIMkkrRFpPgTuzkwnB.png"
- />
- )}
- action={<Tooltip title="指标说明"><Icon type="info-circle-o" /></Tooltip>}
- total={yuan(126560)}
- />
- </Col>
- </Row>
-, mountNode);
-````
diff --git a/src/components/Charts/demo/gauge.md b/src/components/Charts/demo/gauge.md
deleted file mode 100644
index f53465d..0000000
--- a/src/components/Charts/demo/gauge.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-order: 7
-title: 仪表盘
----
-
-仪表盘是一种进度展示方式,可以更直观的展示当前的进展情况,通常也可表示占比。
-
-````jsx
-import { Gauge } from 'ant-design-pro/lib/Charts';
-
-ReactDOM.render(
- <Gauge
- title="核销率"
- height={164}
- percent={87}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/mini-area.md b/src/components/Charts/demo/mini-area.md
deleted file mode 100644
index 2b9bfb4..0000000
--- a/src/components/Charts/demo/mini-area.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-order: 2
-col: 2
-title: 迷你区域图
----
-
-````jsx
-import { MiniArea } from 'ant-design-pro/lib/Charts';
-import moment from 'moment';
-
-const visitData = [];
-const beginDay = new Date().getTime();
-for (let i = 0; i < 20; i += 1) {
- visitData.push({
- x: moment(new Date(beginDay + (1000 * 60 * 60 * 24 * i))).format('YYYY-MM-DD'),
- y: Math.floor(Math.random() * 100) + 10,
- });
-}
-
-ReactDOM.render(
- <MiniArea
- line
- color="#cceafe"
- height={45}
- data={visitData}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/mini-bar.md b/src/components/Charts/demo/mini-bar.md
deleted file mode 100644
index fef301b..0000000
--- a/src/components/Charts/demo/mini-bar.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-order: 2
-col: 2
-title: 迷你柱状图
----
-
-迷你柱状图更适合展示简单的区间数据,简洁的表现方式可以很好的减少大数据量的视觉展现压力。
-
-````jsx
-import { MiniBar } from 'ant-design-pro/lib/Charts';
-import moment from 'moment';
-
-const visitData = [];
-const beginDay = new Date().getTime();
-for (let i = 0; i < 20; i += 1) {
- visitData.push({
- x: moment(new Date(beginDay + (1000 * 60 * 60 * 24 * i))).format('YYYY-MM-DD'),
- y: Math.floor(Math.random() * 100) + 10,
- });
-}
-
-ReactDOM.render(
- <MiniBar
- height={45}
- data={visitData}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/mini-pie.md b/src/components/Charts/demo/mini-pie.md
deleted file mode 100644
index 9b1abf0..0000000
--- a/src/components/Charts/demo/mini-pie.md
+++ /dev/null
@@ -1,16 +0,0 @@
----
-order: 6
-title: 迷你饼状图
----
-
-通过简化 `Pie` 属性的设置,可以快速的实现极简的饼状图,可配合 `ChartCard` 组合展
-现更多业务场景。
-
-```jsx
-import { Pie } from 'ant-design-pro/lib/Charts';
-
-ReactDOM.render(
- <Pie percent={28} subTitle="中式快餐" total="28%" height={140} />,
- mountNode
-);
-```
diff --git a/src/components/Charts/demo/mini-progress.md b/src/components/Charts/demo/mini-progress.md
deleted file mode 100644
index 6308a8f..0000000
--- a/src/components/Charts/demo/mini-progress.md
+++ /dev/null
@@ -1,12 +0,0 @@
----
-order: 3
-title: 迷你进度条
----
-
-````jsx
-import { MiniProgress } from 'ant-design-pro/lib/Charts';
-
-ReactDOM.render(
- <MiniProgress percent={78} strokeWidth={8} target={80} />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/mix.md b/src/components/Charts/demo/mix.md
deleted file mode 100644
index 0c158e5..0000000
--- a/src/components/Charts/demo/mix.md
+++ /dev/null
@@ -1,83 +0,0 @@
----
-order: 0
-title: 图表套件组合展示
----
-
-利用 Ant Design Pro 提供的图表套件,可以灵活组合符合设计规范的图表来满足复杂的业务需求。
-
-````jsx
-import { ChartCard, Field, MiniArea, MiniBar, MiniProgress } from 'ant-design-pro/lib/Charts';
-import Trend from 'ant-design-pro/lib/Trend';
-import NumberInfo from 'ant-design-pro/lib/NumberInfo';
-import { Row, Col, Icon, Tooltip } from 'antd';
-import numeral from 'numeral';
-import moment from 'moment';
-
-const visitData = [];
-const beginDay = new Date().getTime();
-for (let i = 0; i < 20; i += 1) {
- visitData.push({
- x: moment(new Date(beginDay + (1000 * 60 * 60 * 24 * i))).format('YYYY-MM-DD'),
- y: Math.floor(Math.random() * 100) + 10,
- });
-}
-
-ReactDOM.render(
- <Row>
- <Col span={24}>
- <ChartCard
- title="搜索用户数量"
- contentHeight={134}
- >
- <NumberInfo
- subTitle={<span>本周访问</span>}
- total={numeral(12321).format('0,0')}
- status="up"
- subTotal={17.1}
- />
- <MiniArea
- line
- height={45}
- data={visitData}
- />
- </ChartCard>
- </Col>
- <Col span={24} style={{ marginTop: 24 }}>
- <ChartCard
- title="访问量"
- action={<Tooltip title="指标说明"><Icon type="info-circle-o" /></Tooltip>}
- total={numeral(8846).format('0,0')}
- footer={<Field label="日访问量" value={numeral(1234).format('0,0')} />}
- contentHeight={46}
- >
- <MiniBar
- height={46}
- data={visitData}
- />
- </ChartCard>
- </Col>
- <Col span={24} style={{ marginTop: 24 }}>
- <ChartCard
- title="线上购物转化率"
- action={<Tooltip title="指标说明"><Icon type="info-circle-o" /></Tooltip>}
- total="78%"
- footer={
- <div>
- <span>
- 周同比
- <Trend flag="up" style={{ marginLeft: 8, color: 'rgba(0,0,0,.85)' }}>12%</Trend>
- </span>
- <span style={{ marginLeft: 16 }}>
- 日环比
- <Trend flag="down" style={{ marginLeft: 8, color: 'rgba(0,0,0,.85)' }}>11%</Trend>
- </span>
- </div>
- }
- contentHeight={46}
- >
- <MiniProgress percent={78} strokeWidth={8} target={80} />
- </ChartCard>
- </Col>
- </Row>
-, mountNode);
-````
diff --git a/src/components/Charts/demo/pie.md b/src/components/Charts/demo/pie.md
deleted file mode 100644
index 2929f2a..0000000
--- a/src/components/Charts/demo/pie.md
+++ /dev/null
@@ -1,47 +0,0 @@
----
-order: 5
-title: 饼状图
----
-
-````jsx
-import { Pie, yuan } from 'ant-design-pro/lib/Charts';
-
-const salesPieData = [
- {
- x: '家用电器',
- y: 4544,
- },
- {
- x: '食用酒水',
- y: 3321,
- },
- {
- x: '个护健康',
- y: 3113,
- },
- {
- x: '服饰箱包',
- y: 2341,
- },
- {
- x: '母婴产品',
- y: 1231,
- },
- {
- x: '其他',
- y: 1231,
- },
-];
-
-ReactDOM.render(
- <Pie
- hasLegend
- title="销售额"
- subTitle="销售额"
- total={yuan(salesPieData.reduce((pre, now) => now.y + pre, 0))}
- data={salesPieData}
- valueFormat={val => yuan(val)}
- height={294}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/radar.md b/src/components/Charts/demo/radar.md
deleted file mode 100644
index 584344a..0000000
--- a/src/components/Charts/demo/radar.md
+++ /dev/null
@@ -1,64 +0,0 @@
----
-order: 7
-title: 雷达图
----
-
-````jsx
-import { Radar, ChartCard } from 'ant-design-pro/lib/Charts';
-
-const radarOriginData = [
- {
- name: '个人',
- ref: 10,
- koubei: 8,
- output: 4,
- contribute: 5,
- hot: 7,
- },
- {
- name: '团队',
- ref: 3,
- koubei: 9,
- output: 6,
- contribute: 3,
- hot: 1,
- },
- {
- name: '部门',
- ref: 4,
- koubei: 1,
- output: 6,
- contribute: 5,
- hot: 7,
- },
-];
-const radarData = [];
-const radarTitleMap = {
- ref: '引用',
- koubei: '口碑',
- output: '产量',
- contribute: '贡献',
- hot: '热度',
-};
-radarOriginData.forEach((item) => {
- Object.keys(item).forEach((key) => {
- if (key !== 'name') {
- radarData.push({
- name: item.name,
- label: radarTitleMap[key],
- value: item[key],
- });
- }
- });
-});
-
-ReactDOM.render(
- <ChartCard title="数据比例">
- <Radar
- hasLegend
- height={286}
- data={radarData}
- />
- </ChartCard>
-, mountNode);
-````
diff --git a/src/components/Charts/demo/tag-cloud.md b/src/components/Charts/demo/tag-cloud.md
deleted file mode 100644
index c66f6fe..0000000
--- a/src/components/Charts/demo/tag-cloud.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-order: 9
-title: 标签云
----
-
-标签云是一套相关的标签以及与此相应的权重展示方式,一般典型的标签云有 30 至 150 个标签,而权重影响使用的字体大小或其他视觉效果。
-
-````jsx
-import { TagCloud } from 'ant-design-pro/lib/Charts';
-
-const tags = [];
-for (let i = 0; i < 50; i += 1) {
- tags.push({
- name: `TagClout-Title-${i}`,
- value: Math.floor((Math.random() * 50)) + 20,
- });
-}
-
-ReactDOM.render(
- <TagCloud
- data={tags}
- height={200}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/timeline-chart.md b/src/components/Charts/demo/timeline-chart.md
deleted file mode 100644
index 60773b5..0000000
--- a/src/components/Charts/demo/timeline-chart.md
+++ /dev/null
@@ -1,27 +0,0 @@
----
-order: 9
-title: 带有时间轴的图表
----
-
-使用 `TimelineChart` 组件可以实现带有时间轴的柱状图展现,而其中的 `x` 属性,则是时间值的指向,默认最多支持同时展现两个指标,分别是 `y1` 和 `y2`。
-
-````jsx
-import { TimelineChart } from 'ant-design-pro/lib/Charts';
-
-const chartData = [];
-for (let i = 0; i < 20; i += 1) {
- chartData.push({
- x: (new Date().getTime()) + (1000 * 60 * 30 * i),
- y1: Math.floor(Math.random() * 100) + 1000,
- y2: Math.floor(Math.random() * 100) + 10,
- });
-}
-
-ReactDOM.render(
- <TimelineChart
- height={200}
- data={chartData}
- titleMap={{ y1: '客流量', y2: '支付笔数' }}
- />
-, mountNode);
-````
diff --git a/src/components/Charts/demo/waterwave.md b/src/components/Charts/demo/waterwave.md
deleted file mode 100644
index 74d290f..0000000
--- a/src/components/Charts/demo/waterwave.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-order: 8
-title: 水波图
----
-
-水波图是一种比例的展示方式,可以更直观的展示关键值的占比。
-
-````jsx
-import { WaterWave } from 'ant-design-pro/lib/Charts';
-
-ReactDOM.render(
- <div style={{ textAlign: 'center' }}>
- <WaterWave
- height={161}
- title="补贴资金剩余"
- percent={34}
- />
- </div>
-, mountNode);
-````
diff --git a/src/components/Charts/index.d.ts b/src/components/Charts/index.d.ts
deleted file mode 100644
index 1ff27af..0000000
--- a/src/components/Charts/index.d.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import * as numeral from 'numeral';
-export { default as ChartCard } from './ChartCard';
-export { default as Bar } from './Bar';
-export { default as Pie } from './Pie';
-export { default as Radar } from './Radar';
-export { default as Gauge } from './Gauge';
-export { default as MiniArea } from './MiniArea';
-export { default as MiniBar } from './MiniBar';
-export { default as MiniProgress } from './MiniProgress';
-export { default as Field } from './Field';
-export { default as WaterWave } from './WaterWave';
-export { default as TagCloud } from './TagCloud';
-export { default as TimelineChart } from './TimelineChart';
-
-declare const yuan: (value: number | string) => string;
-
-export { yuan };
diff --git a/src/components/Charts/index.js b/src/components/Charts/index.js
index 2af3afe..062a784 100644
--- a/src/components/Charts/index.js
+++ b/src/components/Charts/index.js
@@ -4,16 +4,10 @@ import ChartCard from './ChartCard';
import Area from './Area';
import Bar from './Bar';
import Pie from './Pie';
-import Radar from './Radar';
-import Gauge from './Gauge';
import Line from './Line';
import MiniArea from './MiniArea';
import MiniBar from './MiniBar';
-import MiniProgress from './MiniProgress';
import Field from './Field';
-import WaterWave from './WaterWave';
-import TagCloud from './TagCloud';
-import TimelineChart from './TimelineChart';
import StackBar from './StackBar';
import Sankey from './Sankey';
@@ -23,16 +17,10 @@ export {
yuan,
Bar,
Pie,
- Gauge,
- Radar,
+ Field,
MiniBar,
MiniArea,
- MiniProgress,
ChartCard,
- Field,
- WaterWave,
- TagCloud,
- TimelineChart,
Line,
Area,
StackBar,
diff --git a/src/components/CountDown/demo/simple.md b/src/components/CountDown/demo/simple.md
deleted file mode 100644
index e42cbf1..0000000
--- a/src/components/CountDown/demo/simple.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-order: 0
-title:
- zh-CN: 基本
- en-US: Basic
----
-
-## zh-CN
-
-简单的倒计时组件使用。
-
-## en-US
-
-The simplest usage.
-
-````jsx
-import CountDown from 'ant-design-pro/lib/CountDown';
-
-const targetTime = new Date().getTime() + 3900000;
-
-ReactDOM.render(
- <CountDown style={{ fontSize: 20 }} target={targetTime} />
-, mountNode);
-````
diff --git a/src/components/CountDown/index.d.ts b/src/components/CountDown/index.d.ts
deleted file mode 100644
index 3c46ac7..0000000
--- a/src/components/CountDown/index.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import * as React from "react";
-export interface CountDownProps {
- format?: (time: number) => void;
- target: Date | number;
- onEnd?: () => void;
- style?: React.CSSProperties;
-}
-
-export default class CountDown extends React.Component<CountDownProps, any> {}
diff --git a/src/components/CountDown/index.en-US.md b/src/components/CountDown/index.en-US.md
deleted file mode 100644
index 7b45240..0000000
--- a/src/components/CountDown/index.en-US.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: CountDown
-cols: 1
-order: 3
----
-
-Simple CountDown Component.
-
-## API
-
-| Property | Description | Type | Default |
-|----------|------------------------------------------|-------------|-------|
-| format | Formatter of time | Function(time) | |
-| target | Target time | Date | - |
-| onEnd | Countdown to the end callback | funtion | -|
diff --git a/src/components/CountDown/index.js b/src/components/CountDown/index.js
deleted file mode 100644
index e1e85bc..0000000
--- a/src/components/CountDown/index.js
+++ /dev/null
@@ -1,108 +0,0 @@
-import React, { Component } from 'react';
-
-function fixedZero(val) {
- return val * 1 < 10 ? `0${val}` : val;
-}
-
-class CountDown extends Component {
- constructor(props) {
- super(props);
-
- const { lastTime } = this.initTime(props);
-
- this.state = {
- lastTime,
- };
- }
-
- componentDidMount() {
- this.tick();
- }
-
- componentWillReceiveProps(nextProps) {
- if (this.props.target !== nextProps.target) {
- clearTimeout(this.timer);
- const { lastTime } = this.initTime(nextProps);
- this.setState({
- lastTime,
- }, () => {
- this.tick();
- });
- }
- }
-
- componentWillUnmount() {
- clearTimeout(this.timer);
- }
-
- timer = 0;
- interval = 1000;
- initTime = (props) => {
- let lastTime = 0;
- let targetTime = 0;
- try {
- if (Object.prototype.toString.call(props.target) === '[object Date]') {
- targetTime = props.target.getTime();
- } else {
- targetTime = new Date(props.target).getTime();
- }
- } catch (e) {
- throw new Error('invalid target prop', e);
- }
-
- lastTime = targetTime - new Date().getTime();
-
- return {
- lastTime,
- };
- }
- // defaultFormat = time => (
- // <span>{moment(time).format('hh:mm:ss')}</span>
- // );
- defaultFormat = (time) => {
- const hours = 60 * 60 * 1000;
- const minutes = 60 * 1000;
-
- const h = fixedZero(Math.floor(time / hours));
- const m = fixedZero(Math.floor((time - (h * hours)) / minutes));
- const s = fixedZero(Math.floor((time - (h * hours) - (m * minutes)) / 1000));
- return (
- <span>{h}:{m}:{s}</span>
- );
- }
- tick = () => {
- const { onEnd } = this.props;
- let { lastTime } = this.state;
-
- this.timer = setTimeout(() => {
- if (lastTime < this.interval) {
- clearTimeout(this.timer);
- this.setState({
- lastTime: 0,
- }, () => {
- if (onEnd) {
- onEnd();
- }
- });
- } else {
- lastTime -= this.interval;
- this.setState({
- lastTime,
- }, () => {
- this.tick();
- });
- }
- }, this.interval);
- }
-
- render() {
- const { format = this.defaultFormat, ...rest } = this.props;
- const { lastTime } = this.state;
-
- const result = format(lastTime);
-
- return (<span {...rest}>{result}</span>);
- }
-}
-
-export default CountDown;
diff --git a/src/components/CountDown/index.zh-CN.md b/src/components/CountDown/index.zh-CN.md
deleted file mode 100644
index 7e00ba1..0000000
--- a/src/components/CountDown/index.zh-CN.md
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: CountDown
-subtitle: 倒计时
-cols: 1
-order: 3
----
-
-倒计时组件。
-
-## API
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| format | 时间格式化显示 | Function(time) | |
-| target | 目标时间 | Date | - |
-| onEnd | 倒计时结束回调 | funtion | -|
diff --git a/src/components/EditableItem/index.js b/src/components/EditableItem/index.js
deleted file mode 100644
index b0563c1..0000000
--- a/src/components/EditableItem/index.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React, { PureComponent } from 'react';
-import { Input, Icon } from 'antd';
-import styles from './index.less';
-
-export default class EditableItem extends PureComponent {
- state = {
- value: this.props.value,
- editable: false,
- };
- handleChange = (e) => {
- const { value } = e.target;
- this.setState({ value });
- }
- check = () => {
- this.setState({ editable: false });
- if (this.props.onChange) {
- this.props.onChange(this.state.value);
- }
- }
- edit = () => {
- this.setState({ editable: true });
- }
- render() {
- const { value, editable } = this.state;
- return (
- <div className={styles.editableItem}>
- {
- editable ? (
- <div className={styles.wrapper}>
- <Input
- value={value}
- onChange={this.handleChange}
- onPressEnter={this.check}
- />
- <Icon
- type="check"
- className={styles.icon}
- onClick={this.check}
- />
- </div>
- ) : (
- <div className={styles.wrapper}>
- <span>{value || ' '}</span>
- <Icon
- type="edit"
- className={styles.icon}
- onClick={this.edit}
- />
- </div>
- )
- }
- </div>
- );
- }
-}
diff --git a/src/components/EditableItem/index.less b/src/components/EditableItem/index.less
deleted file mode 100644
index 8c06868..0000000
--- a/src/components/EditableItem/index.less
+++ /dev/null
@@ -1,25 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.editableItem {
- line-height: @input-height-base;
- display: table;
- width: 100%;
- margin-top: (@font-size-base * @line-height-base - @input-height-base) / 2;
-
- .wrapper {
- display: table-row;
-
- & > * {
- display: table-cell;
- }
-
- & > *:first-child {
- width: 85%;
- }
-
- .icon {
- cursor: pointer;
- text-align: right;
- }
- }
-}
diff --git a/src/components/EditableLinkGroup/index.js b/src/components/EditableLinkGroup/index.js
deleted file mode 100644
index 97d70fc..0000000
--- a/src/components/EditableLinkGroup/index.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import React, { PureComponent, createElement } from 'react';
-import PropTypes from 'prop-types';
-import { Button } from 'antd';
-import styles from './index.less';
-
-// TODO: 添加逻辑
-
-class EditableLinkGroup extends PureComponent {
- static defaultProps = {
- links: [],
- onAdd: () => {},
- linkElement: 'a',
- };
-
- static propTypes = {
- links: PropTypes.array,
- onAdd: PropTypes.func,
- linkElement: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
- };
-
- render() {
- const { links, linkElement, onAdd } = this.props;
- return (
- <div className={styles.linkGroup}>
- {
- links.map(link => (
- createElement(linkElement, {
- key: `linkGroup-item-${link.id || link.title}`,
- to: link.href,
- href: link.href,
- }, link.title)
- ))
- }
- {
- <Button size="small" type="primary" ghost onClick={onAdd} icon="plus">
- 添加
- </Button>
- }
- </div>
- );
- }
-}
-
-export default EditableLinkGroup;
diff --git a/src/components/EditableLinkGroup/index.less b/src/components/EditableLinkGroup/index.less
deleted file mode 100644
index c3d0b58..0000000
--- a/src/components/EditableLinkGroup/index.less
+++ /dev/null
@@ -1,16 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.linkGroup {
- padding: 20px 0 8px 24px;
- font-size: 0;
- & > a {
- color: @text-color;
- display: inline-block;
- font-size: @font-size-base;
- margin-bottom: 13px;
- width: 25%;
- &:hover {
- color: @primary-color;
- }
- }
-}
diff --git a/src/components/Ellipsis/demo/line.md b/src/components/Ellipsis/demo/line.md
deleted file mode 100644
index 60b804c..0000000
--- a/src/components/Ellipsis/demo/line.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-order: 1
-title: 按照行数省略
----
-
-通过设置 `lines` 属性指定最大行数,如果超过这个行数的文本会自动截取。但是在这种模式下所有 `children` 将会被转换成纯文本。
-
-并且注意在这种模式下,外容器需要有指定的宽度(或设置自身宽度)。
-
-````jsx
-import Ellipsis from 'ant-design-pro/lib/Ellipsis';
-
-const article = <p>There were injuries alleged in three <a href="#cover">cases in 2015</a>, and a fourth incident in September, according to the safety recall report. After meeting with US regulators in October, the firm decided to issue a voluntary recall.</p>;
-
-ReactDOM.render(
- <div style={{ width: 200 }}>
- <Ellipsis tooltip lines={3}>{article}</Ellipsis>
- </div>
-, mountNode);
-````
diff --git a/src/components/Ellipsis/demo/number.md b/src/components/Ellipsis/demo/number.md
deleted file mode 100644
index 9302bb8..0000000
--- a/src/components/Ellipsis/demo/number.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-order: 0
-title: 按照字符数省略
----
-
-通过设置 `length` 属性指定文本最长长度,如果超过这个长度会自动截取。
-
-````jsx
-import Ellipsis from 'ant-design-pro/lib/Ellipsis';
-
-const article = 'There were injuries alleged in three cases in 2015, and a fourth incident in September, according to the safety recall report. After meeting with US regulators in October, the firm decided to issue a voluntary recall.';
-
-ReactDOM.render(
- <div>
- <Ellipsis length={100}>{article}</Ellipsis>
- <h4 style={{ marginTop: 24 }}>Show Tooltip</h4>
- <Ellipsis length={100} tooltip>{article}</Ellipsis>
- </div>
-, mountNode);
-````
diff --git a/src/components/Ellipsis/index.d.ts b/src/components/Ellipsis/index.d.ts
deleted file mode 100644
index 8421b95..0000000
--- a/src/components/Ellipsis/index.d.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import * as React from "react";
-export interface EllipsisProps {
- tooltip?: boolean;
- length?: number;
- lines?: number;
- style?: React.CSSProperties;
-}
-
-export default class Ellipsis extends React.Component<
- EllipsisProps,
- any
-> {}
diff --git a/src/components/Ellipsis/index.js b/src/components/Ellipsis/index.js
deleted file mode 100644
index 351b414..0000000
--- a/src/components/Ellipsis/index.js
+++ /dev/null
@@ -1,224 +0,0 @@
-import React, { Component } from 'react';
-import { Tooltip } from 'antd';
-import classNames from 'classnames';
-import styles from './index.less';
-
-/* eslint react/no-did-mount-set-state: 0 */
-/* eslint no-param-reassign: 0 */
-
-const isSupportLineClamp = document.body.style.webkitLineClamp !== undefined;
-
-const EllipsisText = ({ text, length, tooltip, ...other }) => {
- if (typeof text !== 'string') {
- throw new Error('Ellipsis children must be string.');
- }
- if (text.length <= length || length < 0) {
- return <span {...other}>{text}</span>;
- }
- const tail = '...';
- let displayText;
- if (length - tail.length <= 0) {
- displayText = '';
- } else {
- displayText = text.slice(0, length - tail.length);
- }
-
- if (tooltip) {
- return (
- <Tooltip overlayStyle={{ wordBreak: 'break-all' }} title={text}>
- <span>
- {displayText}
- {tail}
- </span>
- </Tooltip>
- );
- }
-
- return (
- <span {...other}>
- {displayText}
- {tail}
- </span>
- );
-};
-
-export default class Ellipsis extends Component {
- state = {
- text: '',
- targetCount: 0,
- };
-
- componentDidMount() {
- if (this.node) {
- this.computeLine();
- }
- }
-
- componentWillReceiveProps(nextProps) {
- if (this.props.lines !== nextProps.lines) {
- this.computeLine();
- }
- }
-
- computeLine = () => {
- const { lines } = this.props;
- if (lines && !isSupportLineClamp) {
- const text = this.shadowChildren.innerText;
- const lineHeight = parseInt(getComputedStyle(this.root).lineHeight, 10);
- const targetHeight = lines * lineHeight;
- this.content.style.height = `${targetHeight}px`;
- const totalHeight = this.shadowChildren.offsetHeight;
- const shadowNode = this.shadow.firstChild;
-
- if (totalHeight <= targetHeight) {
- this.setState({
- text,
- targetCount: text.length,
- });
- return;
- }
-
- // bisection
- const len = text.length;
- const mid = Math.floor(len / 2);
-
- const count = this.bisection(targetHeight, mid, 0, len, text, shadowNode);
-
- this.setState({
- text,
- targetCount: count,
- });
- }
- };
-
- bisection = (th, m, b, e, text, shadowNode) => {
- const suffix = '...';
- let mid = m;
- let end = e;
- let begin = b;
- shadowNode.innerHTML = text.substring(0, mid) + suffix;
- let sh = shadowNode.offsetHeight;
-
- if (sh <= th) {
- shadowNode.innerHTML = text.substring(0, mid + 1) + suffix;
- sh = shadowNode.offsetHeight;
- if (sh > th) {
- return mid;
- } else {
- begin = mid;
- mid = Math.floor((end - begin) / 2) + begin;
- return this.bisection(th, mid, begin, end, text, shadowNode);
- }
- } else {
- if (mid - 1 < 0) {
- return mid;
- }
- shadowNode.innerHTML = text.substring(0, mid - 1) + suffix;
- sh = shadowNode.offsetHeight;
- if (sh <= th) {
- return mid - 1;
- } else {
- end = mid;
- mid = Math.floor((end - begin) / 2) + begin;
- return this.bisection(th, mid, begin, end, text, shadowNode);
- }
- }
- };
-
- handleRoot = (n) => {
- this.root = n;
- };
-
- handleContent = (n) => {
- this.content = n;
- };
-
- handleNode = (n) => {
- this.node = n;
- };
-
- handleShadow = (n) => {
- this.shadow = n;
- };
-
- handleShadowChildren = (n) => {
- this.shadowChildren = n;
- };
-
- render() {
- const { text, targetCount } = this.state;
- const { children, lines, length, className, tooltip, ...restProps } = this.props;
-
- const cls = classNames(styles.ellipsis, className, {
- [styles.lines]: lines && !isSupportLineClamp,
- [styles.lineClamp]: lines && isSupportLineClamp,
- });
-
- if (!lines && !length) {
- return (
- <span className={cls} {...restProps}>
- {children}
- </span>
- );
- }
-
- // length
- if (!lines) {
- return (
- <EllipsisText
- className={cls}
- length={length}
- text={children || ''}
- tooltip={tooltip}
- {...restProps}
- />
- );
- }
-
- const id = `antd-pro-ellipsis-${`${new Date().getTime()}${Math.floor(Math.random() * 100)}`}`;
-
- // support document.body.style.webkitLineClamp
- if (isSupportLineClamp) {
- const style = `#${id}{-webkit-line-clamp:${lines};-webkit-box-orient: vertical;}`;
- return (
- <div id={id} className={cls} {...restProps}>
- <style>{style}</style>
- {tooltip ? (
- <Tooltip overlayStyle={{ wordBreak: 'break-all' }} title={children}>
- {children}
- </Tooltip>
- ) : (
- children
- )}
- </div>
- );
- }
-
- const childNode = (
- <span ref={this.handleNode}>
- {targetCount > 0 && text.substring(0, targetCount)}
- {targetCount > 0 && targetCount < text.length && '...'}
- </span>
- );
-
- return (
- <div {...restProps} ref={this.handleRoot} className={cls}>
- <div ref={this.handleContent}>
- {tooltip ? (
- <Tooltip overlayStyle={{ wordBreak: 'break-all' }} title={text}>
- {childNode}
- </Tooltip>
- ) : (
- childNode
- )}
- <div className={styles.shadow} ref={this.handleShadowChildren}>
- {children}
- </div>
- <div className={styles.shadow} ref={this.handleShadow}>
- <span>{text}</span>
- </div>
- </div>
- </div>
- );
- }
-}
diff --git a/src/components/Ellipsis/index.less b/src/components/Ellipsis/index.less
deleted file mode 100644
index dd59e3f..0000000
--- a/src/components/Ellipsis/index.less
+++ /dev/null
@@ -1,24 +0,0 @@
-.ellipsis {
- overflow: hidden;
- display: inline-block;
- word-break: break-all;
- width: 100%;
-}
-
-.lines {
- position: relative;
- .shadow {
- display: block;
- position: relative;
- color: transparent;
- opacity: 0;
- z-index: -999;
- }
-}
-
-.lineClamp {
- position: relative;
- overflow: hidden;
- text-overflow: ellipsis;
- display: -webkit-box;
-}
diff --git a/src/components/Ellipsis/index.md b/src/components/Ellipsis/index.md
deleted file mode 100644
index e53cd1c..0000000
--- a/src/components/Ellipsis/index.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title:
- en-US: Ellipsis
- zh-CN: Ellipsis
-subtitle: 文本自动省略号
-cols: 1
-order: 10
----
-
-文本过长自动处理省略号,支持按照文本长度和最大行数两种方式截取。
-
-## API
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-tooltip | 移动到文本展示完整内容的提示 | boolean | -
-length | 在按照长度截取下的文本最大字符数,超过则截取省略 | number | -
-lines | 在按照行数截取下最大的行数,超过则截取省略 | number | `1`
diff --git a/src/components/FooterToolbar/demo/basic.md b/src/components/FooterToolbar/demo/basic.md
deleted file mode 100644
index 6ce15e7..0000000
--- a/src/components/FooterToolbar/demo/basic.md
+++ /dev/null
@@ -1,36 +0,0 @@
----
-order: 0
-title: 演示
-iframe: 400
----
-
-浮动固定页脚。
-
-````jsx
-import FooterToolbar from 'ant-design-pro/lib/FooterToolbar';
-import { Button } from 'antd';
-
-ReactDOM.render(
- <div style={{ background: '#f7f7f7', padding: 24 }}>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <p>页面内容 页面内容 页面内容 页面内容</p>
- <FooterToolbar extra="提示信息">
- <Button>取消</Button>
- <Button type="primary">提交</Button>
- </FooterToolbar>
- </div>
-, mountNode);
-````
diff --git a/src/components/FooterToolbar/index.d.ts b/src/components/FooterToolbar/index.d.ts
deleted file mode 100644
index 637bd4b..0000000
--- a/src/components/FooterToolbar/index.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import * as React from 'react';
-export interface FooterToolbarProps {
- extra: React.ReactNode;
- style?: React.CSSProperties;
-}
-
-export default class FooterToolbar extends React.Component<
- FooterToolbarProps,
- any
-> {}
diff --git a/src/components/FooterToolbar/index.js b/src/components/FooterToolbar/index.js
deleted file mode 100644
index 62527e9..0000000
--- a/src/components/FooterToolbar/index.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React, { Component } from 'react';
-import classNames from 'classnames';
-import styles from './index.less';
-
-export default class FooterToolbar extends Component {
- render() {
- const { children, className, extra, ...restProps } = this.props;
- return (
- <div
- className={classNames(className, styles.toolbar)}
- {...restProps}
- >
- <div className={styles.left}>{extra}</div>
- <div className={styles.right}>{children}</div>
- </div>
- );
- }
-}
diff --git a/src/components/FooterToolbar/index.less b/src/components/FooterToolbar/index.less
deleted file mode 100644
index b6b6399..0000000
--- a/src/components/FooterToolbar/index.less
+++ /dev/null
@@ -1,33 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.toolbar {
- position: fixed;
- width: 100%;
- bottom: 0;
- right: 0;
- height: 56px;
- line-height: 56px;
- box-shadow: 0 -1px 2px rgba(0, 0, 0, .03);
- background: #fff;
- border-top: 1px solid @border-color-split;
- padding: 0 24px;
- z-index: 9;
-
- &:after {
- content: "";
- display: block;
- clear: both;
- }
-
- .left {
- float: left;
- }
-
- .right {
- float: right;
- }
-
- button + button {
- margin-left: 8px;
- }
-}
diff --git a/src/components/FooterToolbar/index.md b/src/components/FooterToolbar/index.md
deleted file mode 100644
index b0bea3d..0000000
--- a/src/components/FooterToolbar/index.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title:
- en-US: FooterToolbar
- zh-CN: FooterToolbar
-subtitle: 底部工具栏
-cols: 1
-order: 6
----
-
-固定在底部的工具栏。
-
-## 何时使用
-
-固定在内容区域的底部,不随滚动条移动,常用于长页面的数据搜集和提交工作。
-
-## API
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-children | 工具栏内容,向右对齐 | ReactNode | -
-extra | 额外信息,向左对齐 | ReactNode | -
diff --git a/src/components/HeaderSearch/demo/basic.md b/src/components/HeaderSearch/demo/basic.md
deleted file mode 100644
index 2139207..0000000
--- a/src/components/HeaderSearch/demo/basic.md
+++ /dev/null
@@ -1,34 +0,0 @@
----
-order: 0
-title: 全局搜索
----
-
-通常放置在导航工具条右侧。(点击搜索图标预览效果)
-
-````jsx
-import HeaderSearch from 'ant-design-pro/lib/HeaderSearch';
-
-ReactDOM.render(
- <div
- style={{
- textAlign: 'right',
- height: '64px',
- lineHeight: '64px',
- boxShadow: '0 1px 4px rgba(0,21,41,.12)',
- padding: '0 32px',
- width: '400px',
- }}
- >
- <HeaderSearch
- placeholder="站内搜索"
- dataSource={['搜索提示一', '搜索提示二', '搜索提示三']}
- onSearch={(value) => {
- console.log('input', value); // eslint-disable-line
- }}
- onPressEnter={(value) => {
- console.log('enter', value); // eslint-disable-line
- }}
- />
- </div>
-, mountNode);
-````
diff --git a/src/components/HeaderSearch/index.d.ts b/src/components/HeaderSearch/index.d.ts
deleted file mode 100644
index 58316df..0000000
--- a/src/components/HeaderSearch/index.d.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import * as React from 'react';
-export interface HeaderSearchProps {
- placeholder?: string;
- dataSource?: Array<string>;
- onSearch?: (value: string) => void;
- onChange?: (value: string) => void;
- onPressEnter?: (value: string) => void;
- style?: React.CSSProperties;
-}
-
-export default class HeaderSearch extends React.Component<
- HeaderSearchProps,
- any
-> {}
diff --git a/src/components/HeaderSearch/index.js b/src/components/HeaderSearch/index.js
deleted file mode 100644
index 85c990e..0000000
--- a/src/components/HeaderSearch/index.js
+++ /dev/null
@@ -1,85 +0,0 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import { Input, Icon, AutoComplete } from 'antd';
-import classNames from 'classnames';
-import styles from './index.less';
-
-export default class HeaderSearch extends PureComponent {
- static defaultProps = {
- defaultActiveFirstOption: false,
- onPressEnter: () => {},
- onSearch: () => {},
- className: '',
- placeholder: '',
- dataSource: [],
- };
- static propTypes = {
- className: PropTypes.string,
- placeholder: PropTypes.string,
- onSearch: PropTypes.func,
- onPressEnter: PropTypes.func,
- defaultActiveFirstOption: PropTypes.bool,
- dataSource: PropTypes.array,
- };
- state = {
- searchMode: false,
- value: '',
- };
- componentWillUnmount() {
- clearTimeout(this.timeout);
- }
- onKeyDown = (e) => {
- if (e.key === 'Enter') {
- this.timeout = setTimeout(() => {
- this.props.onPressEnter(this.state.value); // Fix duplicate onPressEnter
- }, 0);
- }
- }
- onChange = (value) => {
- this.setState({ value });
- if (this.props.onChange) {
- this.props.onChange();
- }
- }
- enterSearchMode = () => {
- this.setState({ searchMode: true }, () => {
- if (this.state.searchMode) {
- this.input.focus();
- }
- });
- }
- leaveSearchMode = () => {
- this.setState({
- searchMode: false,
- value: '',
- });
- }
- render() {
- const { className, placeholder, ...restProps } = this.props;
- const inputClass = classNames(styles.input, {
- [styles.show]: this.state.searchMode,
- });
- return (
- <span
- className={classNames(className, styles.headerSearch)}
- onClick={this.enterSearchMode}
- >
- <Icon type="search" key="Icon" />
- <AutoComplete
- key="AutoComplete"
- {...restProps}
- className={inputClass}
- value={this.state.value}
- onChange={this.onChange}
- >
- <Input
- placeholder={placeholder}
- ref={(node) => { this.input = node; }}
- onKeyDown={this.onKeyDown}
- onBlur={this.leaveSearchMode}
- />
- </AutoComplete>
- </span>
- );
- }
-}
diff --git a/src/components/HeaderSearch/index.less b/src/components/HeaderSearch/index.less
deleted file mode 100644
index 3743308..0000000
--- a/src/components/HeaderSearch/index.less
+++ /dev/null
@@ -1,32 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.headerSearch {
- :global(.anticon-search) {
- cursor: pointer;
- font-size: 16px;
- }
- .input {
- transition: width .3s, margin-left .3s;
- width: 0;
- background: transparent;
- border-radius: 0;
- :global(.ant-select-selection) {
- background: transparent;
- }
- input {
- border: 0;
- padding-left: 0;
- padding-right: 0;
- box-shadow: none !important;
- }
- &,
- &:hover,
- &:focus {
- border-bottom: 1px solid @border-color-base;
- }
- &.show {
- width: 210px;
- margin-left: 8px;
- }
- }
-}
diff --git a/src/components/HeaderSearch/index.md b/src/components/HeaderSearch/index.md
deleted file mode 100644
index 5c8fd70..0000000
--- a/src/components/HeaderSearch/index.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title:
- en-US: HeaderSearch
- zh-CN: HeaderSearch
-subtitle: 顶部搜索框
-cols: 1
-order: 8
----
-
-通常作为全局搜索的入口,放置在导航工具条右侧。
-
-## API
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-placeholder | 占位文字 | string | -
-dataSource | 当前提示内容列表 | string[] | -
-onSearch | 选择某项或按下回车时的回调 | function(value) | -
-onChange | 输入搜索字符的回调 | function(value) | -
-onPressEnter | 按下回车时的回调 | function(value) | -
diff --git a/src/components/Login/LoginItem.js b/src/components/Login/LoginItem.js
deleted file mode 100644
index b7332b2..0000000
--- a/src/components/Login/LoginItem.js
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { Form, Button, Row, Col } from 'antd';
-import omit from 'omit.js';
-import styles from './index.less';
-import map from './map';
-
-const FormItem = Form.Item;
-
-function generator({ defaultProps, defaultRules, type }) {
- return (WrappedComponent) => {
- return class BasicComponent extends Component {
- static contextTypes = {
- form: PropTypes.object,
- updateActive: PropTypes.func,
- };
- constructor(props) {
- super(props);
- this.state = {
- count: 0,
- };
- }
- componentDidMount() {
- if (this.context.updateActive) {
- this.context.updateActive(this.props.name);
- }
- }
- componentWillUnmount() {
- clearInterval(this.interval);
- }
- onGetCaptcha = () => {
- let count = 59;
- this.setState({ count });
- if (this.props.onGetCaptcha) {
- this.props.onGetCaptcha();
- }
- this.interval = setInterval(() => {
- count -= 1;
- this.setState({ count });
- if (count === 0) {
- clearInterval(this.interval);
- }
- }, 1000);
- }
- render() {
- const { getFieldDecorator } = this.context.form;
- const options = {};
- let otherProps = {};
- const { onChange, defaultValue, rules, name, ...restProps } = this.props;
- const { count } = this.state;
- options.rules = rules || defaultRules;
- if (onChange) {
- options.onChange = onChange;
- }
- if (defaultValue) {
- options.initialValue = defaultValue;
- }
- otherProps = restProps || otherProps;
- if (type === 'Captcha') {
- const inputProps = omit(otherProps, ['onGetCaptcha']);
- return (
- <FormItem>
- <Row gutter={8}>
- <Col span={16}>
- {getFieldDecorator(name, options)(
- <WrappedComponent {...defaultProps} {...inputProps} />
- )}
- </Col>
- <Col span={8}>
- <Button
- disabled={count}
- className={styles.getCaptcha}
- size="large"
- onClick={this.onGetCaptcha}
- >
- {count ? `${count} s` : '获取验证码'}
- </Button>
- </Col>
- </Row>
- </FormItem>
- );
- }
- return (
- <FormItem>
- {getFieldDecorator(name, options)(
- <WrappedComponent {...defaultProps} {...otherProps} />
- )}
- </FormItem>
- );
- }
- };
- };
-}
-
-const LoginItem = {};
-Object.keys(map).forEach((item) => {
- LoginItem[item] = generator({
- defaultProps: map[item].props,
- defaultRules: map[item].rules,
- type: item,
- })(map[item].component);
-});
-
-export default LoginItem;
diff --git a/src/components/Login/LoginSubmit.js b/src/components/Login/LoginSubmit.js
deleted file mode 100644
index 8770a97..0000000
--- a/src/components/Login/LoginSubmit.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import React from 'react';
-import classNames from 'classnames';
-import { Button, Form } from 'antd';
-import styles from './index.less';
-
-const FormItem = Form.Item;
-
-export default ({ className, ...rest }) => {
- const clsString = classNames(styles.submit, className);
- return (
- <FormItem>
- <Button size="large" className={clsString} type="primary" htmlType="submit" {...rest} />
- </FormItem>
- );
-};
diff --git a/src/components/Login/LoginTab.js b/src/components/Login/LoginTab.js
deleted file mode 100644
index 750bfe7..0000000
--- a/src/components/Login/LoginTab.js
+++ /dev/null
@@ -1,32 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { Tabs } from 'antd';
-
-const { TabPane } = Tabs;
-
-const generateId = (() => {
- let i = 0;
- return (prefix = '') => {
- i += 1;
- return `${prefix}${i}`;
- };
-})();
-
-export default class LoginTab extends Component {
- static __ANT_PRO_LOGIN_TAB = true;
- static contextTypes = {
- tabUtil: PropTypes.object,
- };
- constructor(props) {
- super(props);
- this.uniqueId = generateId('login-tab-');
- }
- componentWillMount() {
- if (this.context.tabUtil) {
- this.context.tabUtil.addTab(this.uniqueId);
- }
- }
- render() {
- return <TabPane {...this.props} />;
- }
-}
diff --git a/src/components/Login/demo/basic.md b/src/components/Login/demo/basic.md
deleted file mode 100644
index 1fca454..0000000
--- a/src/components/Login/demo/basic.md
+++ /dev/null
@@ -1,113 +0,0 @@
----
-order: 0
-title: Standard Login
----
-
-支持账号密码及手机号登录两种模式。
-
-````jsx
-import Login from 'ant-design-pro/lib/Login';
-import { Alert, Checkbox } from 'antd';
-
-const { Tab, UserName, Password, Mobile, Captcha, Submit } = Login;
-
-class LoginDemo extends React.Component {
- state = {
- notice: '',
- type: 'tab2',
- autoLogin: true,
- }
- onSubmit = (err, values) => {
- console.log('value collected ->', { ...values, autoLogin: this.state.autoLogin });
- if (this.state.type === 'tab1') {
- this.setState({
- notice: '',
- }, () => {
- if (!err && (values.username !== 'admin' || values.password !== '888888')) {
- setTimeout(() => {
- this.setState({
- notice: '账号或密码错误!',
- });
- }, 500);
- }
- });
- }
- }
- onTabChange = (key) => {
- this.setState({
- type: key,
- });
- }
- changeAutoLogin = (e) => {
- this.setState({
- autoLogin: e.target.checked,
- });
- }
- render() {
- return (
- <Login
- defaultActiveKey={this.state.type}
- onTabChange={this.onTabChange}
- onSubmit={this.onSubmit}
- >
- <Tab key="tab1" tab="账号密码登录">
- {
- this.state.notice &&
- <Alert style={{ marginBottom: 24 }} message={this.state.notice} type="error" showIcon closable />
- }
- <UserName name="username" />
- <Password name="password" />
- </Tab>
- <Tab key="tab2" tab="手机号登录">
- <Mobile name="mobile" />
- <Captcha onGetCaptcha={() => console.log('Get captcha!')} name="captcha" />
- </Tab>
- <div>
- <Checkbox checked={this.state.autoLogin} onChange={this.changeAutoLogin}>自动登录</Checkbox>
- <a style={{ float: 'right' }} href="">忘记密码</a>
- </div>
- <Submit>登录</Submit>
- <div>
- 其他登录方式
- <span className="icon icon-alipay" />
- <span className="icon icon-taobao" />
- <span className="icon icon-weibo" />
- <a style={{ float: 'right' }} href="">注册账户</a>
- </div>
- </Login>
- );
- }
-}
-
-ReactDOM.render(<LoginDemo />, mountNode);
-````
-
-<style>
-#scaffold-src-components-Login-demo-basic .icon {
- display: inline-block;
- width: 24px;
- height: 24px;
- background: url('https://gw.alipayobjects.com/zos/rmsportal/itDzjUnkelhQNsycranf.svg');
- margin-left: 16px;
- vertical-align: middle;
- cursor: pointer;
-}
-#scaffold-src-components-Login-demo-basic .icon-alipay {
- background-position: -24px 0;
-}
-#scaffold-src-components-Login-demo-basic .icon-alipay:hover {
- background-position: 0 0;
-}
-#scaffold-src-components-Login-demo-basic .icon-taobao {
- background-position: -24px -24px;
-}
-#scaffold-src-components-Login-demo-basic .icon-taobao:hover {
- background-position: 0 -24px;
-}
-#scaffold-src-components-Login-demo-basic .icon-weibo {
- background-position: -24px -48px;
-}
-#scaffold-src-components-Login-demo-basic .icon-weibo:hover {
- background-position: 0 -48px;
-}
-</style>
diff --git a/src/components/Login/index.d.ts b/src/components/Login/index.d.ts
deleted file mode 100644
index 7984292..0000000
--- a/src/components/Login/index.d.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import * as React from "react";
-import Button from "antd/lib/button";
-export interface LoginProps {
- defaultActiveKey?: string;
- onTabChange?: (key: string) => void;
- style?: React.CSSProperties;
- onSubmit?: (error: any, values: any) => void;
-}
-
-export interface TabProps {
- key?: string;
- tab?: React.ReactNode;
-}
-export class Tab extends React.Component<TabProps, any> {}
-
-export interface LoginItemProps {
- name?: string;
- rules?: any[];
- style?: React.CSSProperties;
- onGetCaptcha?: () => void;
-}
-
-export class LoginItem extends React.Component<LoginItemProps, any> {}
-
-export default class Login extends React.Component<LoginProps, any> {
- static Tab: typeof Tab;
- static UserName: typeof LoginItem;
- static Password: typeof LoginItem;
- static Mobile: typeof LoginItem;
- static Captcha: typeof LoginItem;
- static Submit: typeof Button;
-}
diff --git a/src/components/Login/index.js b/src/components/Login/index.js
deleted file mode 100644
index 58ce029..0000000
--- a/src/components/Login/index.js
+++ /dev/null
@@ -1,124 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { Form, Tabs } from 'antd';
-import classNames from 'classnames';
-import LoginItem from './LoginItem';
-import LoginTab from './LoginTab';
-import LoginSubmit from './LoginSubmit';
-import styles from './index.less';
-
-@Form.create()
-class Login extends Component {
- static defaultProps = {
- className: '',
- defaultActiveKey: '',
- onTabChange: () => {},
- onSubmit: () => {},
- };
- static propTypes = {
- className: PropTypes.string,
- defaultActiveKey: PropTypes.string,
- onTabChange: PropTypes.func,
- onSubmit: PropTypes.func,
- };
- static childContextTypes = {
- tabUtil: PropTypes.object,
- form: PropTypes.object,
- updateActive: PropTypes.func,
- };
- state = {
- type: this.props.defaultActiveKey,
- tabs: [],
- active: {},
- };
- getChildContext() {
- return {
- tabUtil: {
- addTab: (id) => {
- this.setState({
- tabs: [...this.state.tabs, id],
- });
- },
- removeTab: (id) => {
- this.setState({
- tabs: this.state.tabs.filter(currentId => currentId !== id),
- });
- },
- },
- form: this.props.form,
- updateActive: (activeItem) => {
- const { type, active } = this.state;
- if (active[type]) {
- active[type].push(activeItem);
- } else {
- active[type] = [activeItem];
- }
- this.setState({
- active,
- });
- },
- };
- }
- onSwitch = (type) => {
- this.setState({
- type,
- });
- this.props.onTabChange(type);
- }
- handleSubmit = (e) => {
- e.preventDefault();
- const { active, type } = this.state;
- const activeFileds = active[type];
- this.props.form.validateFields(activeFileds, { force: true },
- (err, values) => {
- this.props.onSubmit(err, values);
- }
- );
- }
- render() {
- const { className, children } = this.props;
- const { type, tabs } = this.state;
- const TabChildren = [];
- const otherChildren = [];
- React.Children.forEach(children, (item) => {
- if (!item) {
- return;
- }
- // eslint-disable-next-line
- if (item.type.__ANT_PRO_LOGIN_TAB) {
- TabChildren.push(item);
- } else {
- otherChildren.push(item);
- }
- });
- return (
- <div className={classNames(className, styles.login)}>
- <Form onSubmit={this.handleSubmit}>
- {
- tabs.length ? (
- <div>
- <Tabs
- animated={false}
- className={styles.tabs}
- activeKey={type}
- onChange={this.onSwitch}
- >
- {TabChildren}
- </Tabs>
- {otherChildren}
- </div>
- ) : [...children]
- }
- </Form>
- </div>
- );
- }
-}
-
-Login.Tab = LoginTab;
-Login.Submit = LoginSubmit;
-Object.keys(LoginItem).forEach((item) => {
- Login[item] = LoginItem[item];
-});
-
-export default Login;
diff --git a/src/components/Login/index.less b/src/components/Login/index.less
deleted file mode 100644
index 331ed5a..0000000
--- a/src/components/Login/index.less
+++ /dev/null
@@ -1,45 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.login {
-
- .tabs {
- padding: 0 2px;
- margin: 0 -2px;
- :global {
- .ant-tabs-tab {
- font-size: 16px;
- line-height: 24px;
- }
- .ant-input-affix-wrapper .ant-input:not(:first-child) {
- padding-left: 34px;
- }
- }
- }
-
- :global {
- .ant-tabs .ant-tabs-bar {
- border-bottom: 0;
- margin-bottom: 24px;
- text-align: center;
- }
-
- .ant-form-item {
- margin-bottom: 24px;
- }
- }
-
- .prefixIcon {
- font-size: @font-size-base;
- color: @disabled-color;
- }
-
- .getCaptcha {
- display: block;
- width: 100%;
- }
-
- .submit {
- width: 100%;
- margin-top: 24px;
- }
-}
diff --git a/src/components/Login/index.md b/src/components/Login/index.md
deleted file mode 100644
index a56be08..0000000
--- a/src/components/Login/index.md
+++ /dev/null
@@ -1,51 +0,0 @@
----
-title:
- en-US: Login
- zh-CN: Login
-subtitle: 登录
-cols: 1
-order: 15
----
-
-支持多种登录方式切换,内置了几种常见的登录控件,可以灵活组合,也支持和自定义控件配合使用。
-
-## API
-
-### Login
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-defaultActiveKey | 默认激活 tab 面板的 key | String | -
-onTabChange | 切换页签时的回调 | (key) => void | -
-onSubmit | 点击提交时的回调 | (err, values) => void | -
-
-### Login.Tab
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-key | 对应选项卡的 key | String | -
-tab | 选项卡头显示文字 | ReactNode | -
-
-### Login.UserName
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-name | 控件标记,提交数据中同样以此为 key | String | -
-rules | 校验规则,同 Form getFieldDecorator(id, options) 中 [option.rules 的规则](getFieldDecorator(id, options)) | object[] | -
-
-除上述属性以外,Login.UserName 还支持 antd.Input 的所有属性,并且自带默认的基础配置,包括 `placeholder` `size` `prefix` 等,这些基础配置均可被覆盖。
-
-### Login.Password、Login.Mobile 同 Login.UserName
-
-### Login.Captcha
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-onGetCaptcha | 点击获取校验码的回调 | () => void | -
-
-除上述属性以外,Login.Captcha 支持的属性与 Login.UserName 相同。
-
-### Login.Submit
-
-支持 antd.Button 的所有属性。
-
diff --git a/src/components/Login/map.js b/src/components/Login/map.js
deleted file mode 100644
index 81fd7a2..0000000
--- a/src/components/Login/map.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React from 'react';
-import { Input, Icon } from 'antd';
-import styles from './index.less';
-
-const map = {
- UserName: {
- component: Input,
- props: {
- size: 'large',
- prefix: <Icon type="user" className={styles.prefixIcon} />,
- placeholder: 'admin',
- },
- rules: [{
- required: true, message: '请输入账户名!',
- }],
- },
- Password: {
- component: Input,
- props: {
- size: 'large',
- prefix: <Icon type="lock" className={styles.prefixIcon} />,
- type: 'password',
- placeholder: '888888',
- },
- rules: [{
- required: true, message: '请输入密码!',
- }],
- },
- Mobile: {
- component: Input,
- props: {
- size: 'large',
- prefix: <Icon type="mobile" className={styles.prefixIcon} />,
- placeholder: '手机号',
- },
- rules: [{
- required: true, message: '请输入手机号!',
- }, {
- pattern: /^1\d{10}$/, message: '手机号格式错误!',
- }],
- },
- Captcha: {
- component: Input,
- props: {
- size: 'large',
- prefix: <Icon type="mail" className={styles.prefixIcon} />,
- placeholder: '验证码',
- },
- rules: [{
- required: true, message: '请输入验证码!',
- }],
- },
-};
-
-export default map;
diff --git a/src/components/NumberInfo/demo/basic.md b/src/components/NumberInfo/demo/basic.md
deleted file mode 100644
index a8ce97a..0000000
--- a/src/components/NumberInfo/demo/basic.md
+++ /dev/null
@@ -1,22 +0,0 @@
----
-order: 0
-title: 演示
----
-
-各种数据文案的展现方式。
-
-````jsx
-import NumberInfo from 'ant-design-pro/lib/NumberInfo';
-import numeral from 'numeral';
-
-ReactDOM.render(
- <div>
- <NumberInfo
- subTitle={<span>本周访问</span>}
- total={numeral(12321).format('0,0')}
- status="up"
- subTotal={17.1}
- />
- </div>
-, mountNode);
-````
diff --git a/src/components/NumberInfo/index.d.ts b/src/components/NumberInfo/index.d.ts
deleted file mode 100644
index 2370ec6..0000000
--- a/src/components/NumberInfo/index.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import * as React from 'react';
-export interface NumberInfoProps {
- title?: React.ReactNode | string;
- subTitle?: React.ReactNode | string;
- total?: React.ReactNode | string;
- status?: 'up' | 'down';
- theme?: string;
- gap?: number;
- subTotal?: number;
- style?: React.CSSProperties;
-}
-
-export default class NumberInfo extends React.Component<NumberInfoProps, any> {}
diff --git a/src/components/NumberInfo/index.js b/src/components/NumberInfo/index.js
deleted file mode 100644
index 0b90cbd..0000000
--- a/src/components/NumberInfo/index.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react';
-import { Icon } from 'antd';
-import classNames from 'classnames';
-import styles from './index.less';
-
-export default ({
- theme, title, subTitle, total, subTotal, status, suffix, gap, ...rest
-}) => (
- <div
- className={
- classNames(styles.numberInfo, {
- [styles[`numberInfo${theme}`]]: theme,
- })
- }
- {...rest}
- >
- {title && <div className={styles.numberInfoTitle}>{title}</div>}
- {subTitle && <div className={styles.numberInfoSubTitle}>{subTitle}</div>}
- <div className={styles.numberInfoValue} style={gap ? { marginTop: gap } : null}>
- <span>
- {total}
- {suffix && <em className={styles.suffix}>{suffix}</em>}
- </span>
- {
- (status || subTotal) && (
- <span className={styles.subTotal}>
- {subTotal}
- {status && <Icon type={`caret-${status}`} />}
- </span>
- )
- }
- </div>
- </div>
-);
diff --git a/src/components/NumberInfo/index.less b/src/components/NumberInfo/index.less
deleted file mode 100644
index 1854dd7..0000000
--- a/src/components/NumberInfo/index.less
+++ /dev/null
@@ -1,68 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.numberInfo {
- .suffix {
- color: @text-color;
- font-size: 16px;
- font-style: normal;
- margin-left: 4px;
- }
- .numberInfoTitle {
- color: @text-color;
- font-size: @font-size-lg;
- margin-bottom: 16px;
- transition: all .3s;
- }
- .numberInfoSubTitle {
- color: @text-color-secondary;
- font-size: @font-size-base;
- height: 22px;
- line-height: 22px;
- overflow: hidden;
- text-overflow: ellipsis;
- word-break: break-all;
- white-space: nowrap;
- }
- .numberInfoValue {
- margin-top: 4px;
- font-size: 0;
- overflow: hidden;
- text-overflow: ellipsis;
- word-break: break-all;
- white-space: nowrap;
- & > span {
- color: @heading-color;
- display: inline-block;
- line-height: 32px;
- height: 32px;
- font-size: 24px;
- margin-right: 32px;
- }
- .subTotal {
- color: @text-color-secondary;
- font-size: @font-size-lg;
- vertical-align: top;
- margin-right: 0;
- i {
- font-size: 12px;
- transform: scale(0.82);
- margin-left: 4px;
- }
- :global {
- .anticon-caret-up {
- color: @red-6;
- }
- .anticon-caret-down {
- color: @green-6;
- }
- }
- }
- }
-}
-.numberInfolight {
- .numberInfoValue {
- & > span {
- color: @text-color;
- }
- }
-}
diff --git a/src/components/NumberInfo/index.md b/src/components/NumberInfo/index.md
deleted file mode 100644
index 1116f99..0000000
--- a/src/components/NumberInfo/index.md
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title:
- en-US: NumberInfo
- zh-CN: NumberInfo
-subtitle: 数据文本
-cols: 1
-order: 10
----
-
-常用在数据卡片中,用于突出展示某个业务数据。
-
-## API
-
-参数 | 说明 | 类型 | 默认值
-----|------|-----|------
-title | 标题 | ReactNode\|string | -
-subTitle | 子标题 | ReactNode\|string | -
-total | 总量 | ReactNode\|string | -
-subTotal | 子总量 | ReactNode\|string | -
-status | 增加状态 | 'up \| down' | -
-theme | 状态样式 | string | 'light'
-gap | 设置数字和描述直接的间距(像素) | number | 8
diff --git a/src/components/PageHeader/demo/image.md b/src/components/PageHeader/demo/image.md
deleted file mode 100644
index 511bac5..0000000
--- a/src/components/PageHeader/demo/image.md
+++ /dev/null
@@ -1,75 +0,0 @@
----
-order: 2
-title: With Image
----
-
-带图片的页头。
-
-````jsx
-import PageHeader from 'ant-design-pro/lib/PageHeader';
-
-const content = (
- <div>
- <p>段落示意:蚂蚁金服务设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态,提供跨越设计与开发的体验解决方案。</p>
- <div className="link">
- <a>
- <img alt="" src="https://gw.alipayobjects.com/zos/rmsportal/MjEImQtenlyueSmVEfUD.svg" /> 快速开始
- </a>
- <a>
- <img alt="" src="https://gw.alipayobjects.com/zos/rmsportal/NbuDUAuBlIApFuDvWiND.svg" /> 产品简介
- </a>
- <a>
- <img alt="" src="https://gw.alipayobjects.com/zos/rmsportal/ohOEPSYdDTNnyMbGuyLb.svg" /> 产品文档
- </a>
- </div>
- </div>
-);
-
-const extra = (
- <div className="imgContainer">
- <img style={{ width: '100%' }} alt="" src="https://gw.alipayobjects.com/zos/rmsportal/RzwpdLnhmvDJToTdfDPe.png" />
- </div>
-);
-
-const breadcrumbList = [{
- title: '一级菜单',
- href: '/',
-}, {
- title: '二级菜单',
- href: '/',
-}, {
- title: '三级菜单',
-}];
-
-ReactDOM.render(
- <div>
- <PageHeader
- title="这是一个标题"
- content={content}
- extraContent={extra}
- breadcrumbList={breadcrumbList}
- />
- </div>
-, mountNode);
-````
-
-<style>
-#scaffold-src-components-PageHeader-demo-image .code-box-demo {
- background: #f2f4f5;
-}
-#scaffold-src-components-PageHeader-demo-image .imgContainer {
- margin-top: -60px;
- text-align: center;
- width: 195px;
-}
-#scaffold-src-components-PageHeader-demo-image .link {
- margin-top: 16px;
-}
-#scaffold-src-components-PageHeader-demo-image .link a {
- margin-right: 32px;
-}
-#scaffold-src-components-PageHeader-demo-image .link img {
- vertical-align: middle;
- margin-right: 8px;
-}
-</style>
diff --git a/src/components/PageHeader/demo/simple.md b/src/components/PageHeader/demo/simple.md
deleted file mode 100644
index d0ad1f7..0000000
--- a/src/components/PageHeader/demo/simple.md
+++ /dev/null
@@ -1,32 +0,0 @@
----
-order: 3
-title: Simple
----
-
-简单的页头。
-
-````jsx
-import PageHeader from 'ant-design-pro/lib/PageHeader';
-
-const breadcrumbList = [{
- title: '一级菜单',
- href: '/',
-}, {
- title: '二级菜单',
- href: '/',
-}, {
- title: '三级菜单',
-}];
-
-ReactDOM.render(
- <div>
- <PageHeader title="页面标题" breadcrumbList={breadcrumbList} />
- </div>
-, mountNode);
-````
-
-<style>
-#scaffold-src-components-PageHeader-demo-simple .code-box-demo {
- background: #f2f4f5;
-}
-</style>
diff --git a/src/components/PageHeader/demo/standard.md b/src/components/PageHeader/demo/standard.md
deleted file mode 100644
index 5c59c93..0000000
--- a/src/components/PageHeader/demo/standard.md
+++ /dev/null
@@ -1,102 +0,0 @@
----
-order: 1
-title: Standard
----
-
-标准页头。
-
-````jsx
-import PageHeader from 'ant-design-pro/lib/PageHeader';
-import DescriptionList from 'ant-design-pro/lib/DescriptionList';
-import { Button, Menu, Dropdown, Icon, Row, Col } from 'antd';
-
-const { Description } = DescriptionList;
-const ButtonGroup = Button.Group;
-
-const description = (
- <DescriptionList size="small" col="2">
- <Description term="创建人">曲丽丽</Description>
- <Description term="订购产品">XX 服务</Description>
- <Description term="创建时间">2017-07-07</Description>
- <Description term="关联单据"><a href="">12421</a></Description>
- </DescriptionList>
-);
-
-const menu = (
- <Menu>
- <Menu.Item key="1">选项一</Menu.Item>
- <Menu.Item key="2">选项二</Menu.Item>
- <Menu.Item key="3">选项三</Menu.Item>
- </Menu>
-);
-
-const action = (
- <div>
- <ButtonGroup>
- <Button>操作</Button>
- <Button>操作</Button>
- <Dropdown overlay={menu} placement="bottomRight">
- <Button><Icon type="ellipsis" /></Button>
- </Dropdown>
- </ButtonGroup>
- <Button type="primary">主操作</Button>
- </div>
-);
-
-const extra = (
- <Row>
- <Col sm={24} md={12}>
- <div style={{ color: 'rgba(0, 0, 0, 0.43)' }}>状态</div>
- <div style={{ color: 'rgba(0, 0, 0, 0.85)', fontSize: 20 }}>待审批</div>
- </Col>
- <Col sm={24} md={12}>
- <div style={{ color: 'rgba(0, 0, 0, 0.43)' }}>订单金额</div>
- <div style={{ color: 'rgba(0, 0, 0, 0.85)', fontSize: 20 }}>¥ 568.08</div>
- </Col>
- </Row>
-);
-
-const breadcrumbList = [{
- title: '一级菜单',
- href: '/',
-}, {
- title: '二级菜单',
- href: '/',
-}, {
- title: '三级菜单',
-}];
-
-const tabList = [{
- key: 'detail',
- tab: '详情',
-}, {
- key: 'rule',
- tab: '规则',
-}];
-
-function onTabChange(key) {
- console.log(key);
-}
-
-ReactDOM.render(
- <div>
- <PageHeader
- title="单号:234231029431"
- logo={<img alt="" src="https://gw.alipayobjects.com/zos/rmsportal/nxkuOJlFJuAUhzlMTCEe.png" />}
- action={action}
- content={description}
- extraContent={extra}
- breadcrumbList={breadcrumbList}
- tabList={tabList}
- tabActiveKey="detail"
- onTabChange={onTabChange}
- />
- </div>
-, mountNode);
-````
-
-<style>
-#scaffold-src-components-PageHeader-demo-standard .code-box-demo {
- background: #f2f4f5;
-}
-</style>
diff --git a/src/components/PageHeader/demo/structure.md b/src/components/PageHeader/demo/structure.md
deleted file mode 100644
index 429eed6..0000000
--- a/src/components/PageHeader/demo/structure.md
+++ /dev/null
@@ -1,68 +0,0 @@
----
-order: 0
-title: Structure
----
-
-基本结构,具备响应式布局功能,主要断点为 768px 和 576px,拖动窗口改变大小试试看。
-
-````jsx
-import PageHeader from 'ant-design-pro/lib/PageHeader';
-
-const breadcrumbList = [{
- title: '面包屑',
-}];
-
-const tabList = [{
- key: '1',
- tab: '页签一',
-}, {
- key: '2',
- tab: '页签二',
-}, {
- key: '3',
- tab: '页签三',
-}];
-
-ReactDOM.render(
- <div>
- <PageHeader
- className="tabs"
- title={<div className="title">Title</div>}
- logo={<div className="logo">logo</div>}
- action={<div className="action">action</div>}
- content={<div className="content">content</div>}
- extraContent={<div className="extraContent">extraContent</div>}
- breadcrumbList={breadcrumbList}
- tabList={tabList}
- tabActiveKey="1"
- />
- </div>
-, mountNode);
-````
-
-<style>
-#scaffold-src-components-PageHeader-demo-structure .code-box-demo {
- background: #f2f4f5;
-}
-#scaffold-src-components-PageHeader-demo-structure .logo {
- background: #3ba0e9;
- color: #fff;
- height: 100%;
-}
-#scaffold-src-components-PageHeader-demo-structure .title {
- background: rgba(16, 142, 233, 1);
- color: #fff;
-}
-#scaffold-src-components-PageHeader-demo-structure .action {
- background: #7dbcea;
- color: #fff;
-}
-#scaffold-src-components-PageHeader-demo-structure .content {
- background: #7dbcea;
- color: #fff;
-}
-#scaffold-src-components-PageHeader-demo-structure .extraContent {
- background: #7dbcea;
- color: #fff;
-}
-</style>
diff --git a/src/components/PageHeader/index.d.ts b/src/components/PageHeader/index.d.ts
deleted file mode 100644
index 518f203..0000000
--- a/src/components/PageHeader/index.d.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import * as React from 'react';
-export interface PageHeaderProps {
- title?: React.ReactNode | string;
- logo?: React.ReactNode | string;
- action?: React.ReactNode | string;
- content?: React.ReactNode;
- extraContent?: React.ReactNode;
- routes?: Array<any>;
- params?: any;
- breadcrumbList?: Array<{ title: React.ReactNode; href?: string }>;
- tabList?: Array<{ key: string; tab: React.ReactNode }>;
- tabActiveKey?: string;
- onTabChange?: (key: string) => void;
- tabBarExtraContent?: React.ReactNode;
- linkElement?: React.ReactNode;
- style?: React.CSSProperties;
-}
-
-export default class PageHeader extends React.Component<PageHeaderProps, any> {}
diff --git a/src/components/PageHeader/index.js b/src/components/PageHeader/index.js
deleted file mode 100644
index 7eb6de1..0000000
--- a/src/components/PageHeader/index.js
+++ /dev/null
@@ -1,194 +0,0 @@
-import React, { PureComponent, createElement } from 'react';
-import PropTypes from 'prop-types';
-import pathToRegexp from 'path-to-regexp';
-import { Breadcrumb, Tabs } from 'antd';
-import classNames from 'classnames';
-import styles from './index.less';
-
-
-const { TabPane } = Tabs;
-
-function getBreadcrumb(breadcrumbNameMap, url) {
- let breadcrumb = breadcrumbNameMap[url];
- if (!breadcrumb) {
- Object.keys(breadcrumbNameMap).forEach((item) => {
- if (pathToRegexp(item).test(url)) {
- breadcrumb = breadcrumbNameMap[item];
- }
- });
- }
- return breadcrumb || {};
-}
-
-export default class PageHeader extends PureComponent {
- static contextTypes = {
- routes: PropTypes.array,
- params: PropTypes.object,
- location: PropTypes.object,
- breadcrumbNameMap: PropTypes.object,
- };
- onChange = (key) => {
- if (this.props.onTabChange) {
- this.props.onTabChange(key);
- }
- };
- getBreadcrumbProps = () => {
- return {
- routes: this.props.routes || this.context.routes,
- params: this.props.params || this.context.params,
- routerLocation: this.props.location || this.context.location,
- breadcrumbNameMap: this.props.breadcrumbNameMap || this.context.breadcrumbNameMap,
- };
- };
- // Generated according to props
- conversionFromProps= () => {
- const {
- breadcrumbList, breadcrumbSeparator, linkElement = 'a',
- } = this.props;
- return (
- <Breadcrumb
- className={styles.breadcrumb}
- separator={breadcrumbSeparator}
- >
- {breadcrumbList.map(item => (
- <Breadcrumb.Item key={item.title}>
- {item.href ? (createElement(linkElement, {
- [linkElement === 'a' ? 'href' : 'to']: item.href,
- }, item.title)) : item.title}
- </Breadcrumb.Item>
- ))}
- </Breadcrumb>
- );
- }
- conversionFromLocation = (routerLocation, breadcrumbNameMap) => {
- const { breadcrumbSeparator, linkElement = 'a' } = this.props;
- // Convert the path to an array
- const pathSnippets = routerLocation.pathname.split('/').filter(i => i);
- // Loop data mosaic routing
- const extraBreadcrumbItems = pathSnippets.map((_, index) => {
- const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
- const currentBreadcrumb = getBreadcrumb(breadcrumbNameMap, url);
- const isLinkable = (index !== pathSnippets.length - 1) && currentBreadcrumb.component;
- return currentBreadcrumb.name && !currentBreadcrumb.hideInBreadcrumb ? (
- <Breadcrumb.Item key={url}>
- {createElement(
- isLinkable ? linkElement : 'span',
- { [linkElement === 'a' ? 'href' : 'to']: url },
- currentBreadcrumb.name,
- )}
- </Breadcrumb.Item>
- ) : null;
- });
- // Add home breadcrumbs to your head
- extraBreadcrumbItems.unshift(
- <Breadcrumb.Item key="home">
- {createElement(linkElement, {
- [linkElement === 'a' ? 'href' : 'to']: '/' }, '首页')}
- </Breadcrumb.Item>
- );
- return (
- <Breadcrumb
- className={styles.breadcrumb}
- separator={breadcrumbSeparator}
- >
- {extraBreadcrumbItems}
- </Breadcrumb>
- );
- }
- /**
- * 将参数转化为面包屑
- * Convert parameters into breadcrumbs
- */
- conversionBreadcrumbList = () => {
- const { breadcrumbList, breadcrumbSeparator } = this.props;
- const { routes, params, routerLocation, breadcrumbNameMap } = this.getBreadcrumbProps();
- if (breadcrumbList && breadcrumbList.length) {
- return this.conversionFromProps();
- }
- // 如果传入 routes 和 params 属性
- // If pass routes and params attributes
- if (routes && params) {
- return (
- <Breadcrumb
- className={styles.breadcrumb}
- routes={routes.filter(route => route.breadcrumbName)}
- params={params}
- itemRender={this.itemRender}
- separator={breadcrumbSeparator}
- />
- );
- }
- // 根据 location 生成 面包屑
- // Generate breadcrumbs based on location
- if (location && location.pathname) {
- return this.conversionFromLocation(routerLocation, breadcrumbNameMap);
- }
- return null;
- }
- // 渲染Breadcrumb 子节点
- // Render the Breadcrumb child node
- itemRender = (route, params, routes, paths) => {
- const { linkElement = 'a' } = this.props;
- const last = routes.indexOf(route) === routes.length - 1;
- return (last || !route.component)
- ? <span>{route.breadcrumbName}</span>
- : createElement(linkElement, {
- href: paths.join('/') || '/',
- to: paths.join('/') || '/',
- }, route.breadcrumbName);
- }
-
- render() {
- const {
- title, logo, action, content, extraContent,
- tabList, className, tabActiveKey, tabBarExtraContent,
- } = this.props;
- const clsString = classNames(styles.pageHeader, className);
-
- let tabDefaultValue;
- if (tabActiveKey !== undefined && tabList) {
- tabDefaultValue = tabList.filter(item => item.default)[0] || tabList[0];
- }
- const breadcrumb = this.conversionBreadcrumbList();
- const activeKeyProps = {
- defaultActiveKey: tabDefaultValue && tabDefaultValue.key,
- };
- if (tabActiveKey !== undefined) {
- activeKeyProps.activeKey = tabActiveKey;
- }
-
- return (
- <div className={clsString}>
- {breadcrumb}
- <div className={styles.detail}>
- {logo && <div className={styles.logo}>{logo}</div>}
- <div className={styles.main}>
- <div className={styles.row}>
- {title && <h1 className={styles.title}>{title}</h1>}
- {action && <div className={styles.action}>{action}</div>}
- </div>
- <div className={styles.row}>
- {content && <div className={styles.content}>{content}</div>}
- {extraContent && <div className={styles.extraContent}>{extraContent}</div>}
- </div>
- </div>
- </div>
- {
- tabList &&
- tabList.length && (
- <Tabs
- className={styles.tabs}
- {...activeKeyProps}
- onChange={this.onChange}
- tabBarExtraContent={tabBarExtraContent}
- >
- {
- tabList.map(item => <TabPane tab={item.tab} key={item.key} />)
- }
- </Tabs>
- )
- }
- </div>
- );
- }
-}
diff --git a/src/components/PageHeader/index.less b/src/components/PageHeader/index.less
deleted file mode 100644
index a1e3b2e..0000000
--- a/src/components/PageHeader/index.less
+++ /dev/null
@@ -1,138 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.pageHeader {
- background: @component-background;
- padding: 16px 32px 0 32px;
- border-bottom: @border-width-base @border-style-base @border-color-split;
-
- .detail {
- display: flex;
- }
-
- .row {
- display: flex;
- }
-
- .breadcrumb {
- margin-bottom: 16px;
- }
-
- .tabs {
- margin: 0 0 -17px -8px;
-
- :global {
- .ant-tabs-bar {
- border-bottom: @border-width-base @border-style-base @border-color-split;
- }
- }
- }
-
- .logo {
- flex: 0 1 auto;
- margin-right: 16px;
- padding-top: 1px;
- > img {
- width: 28px;
- height: 28px;
- border-radius: @border-radius-base;
- display: block;
- }
- }
-
- .title {
- font-size: 20px;
- font-weight: 500;
- color: @heading-color;
- }
-
- .action {
- margin-left: 56px;
- min-width: 266px;
-
- :global {
- .ant-btn-group:not(:last-child),
- .ant-btn:not(:last-child) {
- margin-right: 8px;
- }
-
- .ant-btn-group > .ant-btn {
- margin-right: 0;
- }
- }
- }
-
- .title, .action, .content, .extraContent, .main {
- flex: auto;
- }
-
- .title, .action {
- margin-bottom: 16px;
- }
-
- .logo, .content, .extraContent {
- margin-bottom: 16px;
- }
-
- .action, .extraContent {
- text-align: right;
- }
-
- .extraContent {
- margin-left: 88px;
- min-width: 242px;
- }
-}
-
-@media screen and (max-width: @screen-xl) {
- .pageHeader {
- .extraContent {
- margin-left: 44px;
- }
- }
-}
-
-@media screen and (max-width: @screen-lg) {
- .pageHeader {
- .extraContent {
- margin-left: 20px;
- }
- }
-}
-
-@media screen and (max-width: @screen-md) {
- .pageHeader {
- .row {
- display: block;
- }
-
- .action, .extraContent {
- margin-left: 0;
- text-align: left;
- }
- }
-}
-
-@media screen and (max-width: @screen-sm) {
- .pageHeader {
- .detail {
- display: block;
- }
- }
-}
-
-@media screen and (max-width: @screen-xs) {
- .pageHeader {
- .action {
- :global {
- .ant-btn-group, .ant-btn {
- display: block;
- margin-bottom: 8px;
- }
- .ant-btn-group > .ant-btn {
- display: inline-block;
- margin-bottom: 0;
- }
- }
- }
- }
-}
diff --git a/src/components/PageHeader/index.md b/src/components/PageHeader/index.md
deleted file mode 100644
index 334d354..0000000
--- a/src/components/PageHeader/index.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title:
- en-US: PageHeader
- zh-CN: PageHeader
-subtitle: 页头
-cols: 1
-order: 11
----
-
-页头用来声明页面的主题,包含了用户所关注的最重要的信息,使用户可以快速理解当前页面是什么以及它的功能。
-
-## API
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| title | title 区域 | ReactNode | - |
-| logo | logo区域 | ReactNode | - |
-| action | 操作区,位于 title 行的行尾 | ReactNode | - |
-| content | 内容区 | ReactNode | - |
-| extraContent | 额外内容区,位于content的右侧 | ReactNode | - |
-| breadcrumbList | 面包屑数据,配置了此属性时 `routes` `params` `location` `breadcrumbNameMap` 无效 | array<{title: ReactNode, href?: string}> | - |
-| routes | 面包屑相关属性,router 的路由栈信息 | object[] | - |
-| params | 面包屑相关属性,路由的参数 | object | - |
-| location | 面包屑相关属性,当前的路由信息 | object | - |
-| breadcrumbNameMap | 面包屑相关属性,路由的地址-名称映射表 | object | - |
-| tabList | tab 标题列表 | array<{key: string, tab: ReactNode}> | - |
-| tabActiveKey | 当前高亮的 tab 项 | string | - |
-| onTabChange | 切换面板的回调 | (key) => void | - |
-| linkElement | 定义链接的元素,默认为 `a`,可传入 react-router 的 Link | string\|ReactElement | - |
-
-> 面包屑的配置方式有三种,一是直接配置 `breadcrumbList`,二是结合 `react-router@2` `react-router@3`,配置 `routes` 及 `params` 实现,类似 [面包屑 Demo](https://ant.design/components/breadcrumb-cn/#components-breadcrumb-demo-router),三是结合 `react-router@4`,配置 `location` `breadcrumbNameMap`,优先级依次递减,脚手架中使用最后一种。 对于后两种用法,你也可以将 `routes` `params` 及 `location` `breadcrumbNameMap` 放到 context 中,组件会自动获取。
diff --git a/src/components/Result/demo/classic.md b/src/components/Result/demo/classic.md
deleted file mode 100644
index b4ccdcf..0000000
--- a/src/components/Result/demo/classic.md
+++ /dev/null
@@ -1,80 +0,0 @@
----
-order: 1
-title: Classic
----
-
-典型结果页面。
-
-````jsx
-import Result from 'ant-design-pro/lib/Result';
-import { Button, Row, Col, Icon, Steps } from 'antd';
-
-const { Step } = Steps;
-
-const desc1 = (
- <div style={{ fontSize: 14, position: 'relative', left: 38 }}>
- <div style={{ marginTop: 8, marginBottom: 4 }}>
- 曲丽丽
- <Icon type="dingding-o" style={{ marginLeft: 8 }} />
- </div>
- <div style={{ marginTop: 8, marginBottom: 4 }}>2016-12-12 12:32</div>
- </div>
-);
-
-const desc2 = (
- <div style={{ fontSize: 14, position: 'relative', left: 38 }}>
- <div style={{ marginTop: 8, marginBottom: 4 }}>
- 周毛毛
- <Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} />
- </div>
- <div style={{ marginTop: 8, marginBottom: 4 }}><a href="">催一下</a></div>
- </div>
-);
-
-const extra = (
- <div>
- <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: 500, marginBottom: 20 }}>
- 项目名称
- </div>
- <Row style={{ marginBottom: 16 }}>
- <Col xs={24} sm={12} md={12} lg={12} xl={6}>
- <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>项目 ID:</span>
- 23421
- </Col>
- <Col xs={24} sm={12} md={12} lg={12} xl={6}>
- <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>负责人:</span>
- 曲丽丽
- </Col>
- <Col xs={24} sm={24} md={24} lg={24} xl={12}>
- <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>生效时间:</span>
- 2016-12-12 ~ 2017-12-12
- </Col>
- </Row>
- <Steps progressDot current={1}>
- <Step title="创建项目" description={desc1} />
- <Step title="部门初审" description={desc2} />
- <Step title="财务复核" />
- <Step title="完成" />
- </Steps>
- </div>
-);
-
-const actions = (
- <div>
- <Button type="primary">返回列表</Button>
- <Button>查看项目</Button>
- <Button>打 印</Button>
- </div>
-);
-
-ReactDOM.render(
- <Result
- type="success"
- title="提交成功"
- description="提交结果页用于反馈一系列操作任务的处理结果,如果仅是简单操作,使用 Message 全局提示反馈即可。本文字区域可以展示简单的补充说明,如果有类似展示“单据”的需求,下面这个灰色区域可以呈现比较复杂的内容。"
- extra={extra}
- actions={actions}
- style={{ width: '100%' }}
- />
-, mountNode);
-````
diff --git a/src/components/Result/demo/error.md b/src/components/Result/demo/error.md
deleted file mode 100644
index 836bd8c..0000000
--- a/src/components/Result/demo/error.md
+++ /dev/null
@@ -1,39 +0,0 @@
----
-order: 2
-title: Failed
----
-
-提交失败。
-
-````jsx
-import Result from 'ant-design-pro/lib/Result';
-import { Button, Icon } from 'antd';
-
-const extra = (
- <div>
- <div style={{ fontSize: 16, color: 'rgba(0, 0, 0, 0.85)', fontWeight: 500, marginBottom: 16 }}>
- 您提交的内容有如下错误:
- </div>
- <div style={{ marginBottom: 16 }}>
- <Icon style={{ color: '#f5222d', marginRight: 8 }} type="close-circle-o" />您的账户已被冻结
- <a style={{ marginLeft: 16 }}>立即解冻 <Icon type="right" /></a>
- </div>
- <div>
- <Icon style={{ color: '#f5222d', marginRight: 8 }} type="close-circle-o" />您的账户还不具备申请资格
- <a style={{ marginLeft: 16 }}>立即升级 <Icon type="right" /></a>
- </div>
- </div>
-);
-
-const actions = <Button type="primary">返回修改</Button>;
-
-ReactDOM.render(
- <Result
- type="error"
- title="提交失败"
- description="请核对并修改以下信息后,再重新提交。"
- extra={extra}
- actions={actions}
- />
-, mountNode);
-````
diff --git a/src/components/Result/demo/structure.md b/src/components/Result/demo/structure.md
deleted file mode 100644
index 7fcecfd..0000000
--- a/src/components/Result/demo/structure.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-order: 0
-title: Structure
----
-
-结构包含 `处理结果`,`补充信息` 以及 `操作建议` 三个部分,其中 `处理结果` 由 `提示图标`,`标题` 和 `结果描述` 组成。
-
-````jsx
-import Result from 'ant-design-pro/lib/Result';
-
-ReactDOM.render(
- <Result
- type="success"
- title={<div style={{ background: '#7dbcea', color: '#fff' }}>标题</div>}
- description={<div style={{ background: 'rgba(16, 142, 233, 1)', color: '#fff' }}>结果描述</div>}
- extra="其他补充信息,自带灰底效果"
- actions={<div style={{ background: '#3ba0e9', color: '#fff' }}>操作建议,一般放置按钮组</div>}
- />
-, mountNode);
-````
diff --git a/src/components/Result/index.d.ts b/src/components/Result/index.d.ts
deleted file mode 100644
index a316332..0000000
--- a/src/components/Result/index.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import * as React from 'react';
-export interface ResultProps {
- type: 'success' | 'error';
- title: React.ReactNode;
- description?: React.ReactNode;
- extra?: React.ReactNode;
- actions?: React.ReactNode;
- style?: React.CSSProperties;
-}
-
-export default class Result extends React.Component<ResultProps, any> {}
diff --git a/src/components/Result/index.js b/src/components/Result/index.js
deleted file mode 100644
index 389a4ef..0000000
--- a/src/components/Result/index.js
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react';
-import classNames from 'classnames';
-import { Icon } from 'antd';
-import styles from './index.less';
-
-export default function Result({
- className, type, title, description, extra, actions, ...restProps
-}) {
- const iconMap = {
- error: <Icon className={styles.error} type="close-circle" />,
- success: <Icon className={styles.success} type="check-circle" />,
- };
- const clsString = classNames(styles.result, className);
- return (
- <div className={clsString} {...restProps}>
- <div className={styles.icon}>{iconMap[type]}</div>
- <div className={styles.title}>{title}</div>
- {description && <div className={styles.description}>{description}</div>}
- {extra && <div className={styles.extra}>{extra}</div>}
- {actions && <div className={styles.actions}>{actions}</div>}
- </div>
- );
-}
diff --git a/src/components/Result/index.less b/src/components/Result/index.less
deleted file mode 100644
index 9204f0f..0000000
--- a/src/components/Result/index.less
+++ /dev/null
@@ -1,51 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.result {
- text-align: center;
- width: 72%;
- margin: 0 auto;
-
- .icon {
- font-size: 72px;
- line-height: 72px;
- margin-bottom: 24px;
-
- & > .success {
- color: @success-color;
- }
-
- & > .error {
- color: @error-color;
- }
- }
-
- .title {
- font-size: 24px;
- color: @heading-color;
- font-weight: 500;
- line-height: 32px;
- margin-bottom: 16px;
- }
-
- .description {
- font-size: 14px;
- line-height: 22px;
- color: @text-color-secondary;
- margin-bottom: 24px;
- }
-
- .extra {
- background: #fafafa;
- padding: 24px 40px;
- border-radius: @border-radius-sm;
- text-align: left;
- }
-
- .actions {
- margin-top: 32px;
-
- button:not(:last-child) {
- margin-right: 8px;
- }
- }
-}
diff --git a/src/components/Result/index.md b/src/components/Result/index.md
deleted file mode 100644
index dc11206..0000000
--- a/src/components/Result/index.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title:
- en-US: Result
- zh-CN: Result
-subtitle: 处理结果
-cols: 1
-order: 12
----
-
-结果页用于对用户进行的一系列任务处理结果进行反馈。
-
-## API
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| type | 类型,不同类型自带对应的图标 | Enum {'success', 'error'} | - |
-| title | 标题 | ReactNode | - |
-| description | 结果描述 | ReactNode | - |
-| extra | 补充信息,有默认的灰色背景 | ReactNode | - |
-| actions | 操作建议,推荐放置跳转链接,按钮组等 | ReactNode | - |
diff --git a/src/components/StandardFormRow/index.js b/src/components/StandardFormRow/index.js
deleted file mode 100644
index 4ed6d9d..0000000
--- a/src/components/StandardFormRow/index.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react';
-import classNames from 'classnames';
-import styles from './index.less';
-
-export default ({ title, children, last, block, grid, ...rest }) => {
- const cls = classNames(styles.standardFormRow, {
- [styles.standardFormRowBlock]: block,
- [styles.standardFormRowLast]: last,
- [styles.standardFormRowGrid]: grid,
- });
-
- return (
- <div className={cls} {...rest}>
- {
- title && (
- <div className={styles.label}>
- <span>{title}</span>
- </div>
- )
- }
- <div className={styles.content}>
- {children}
- </div>
- </div>
- );
-};
diff --git a/src/components/StandardFormRow/index.less b/src/components/StandardFormRow/index.less
deleted file mode 100644
index d36ac59..0000000
--- a/src/components/StandardFormRow/index.less
+++ /dev/null
@@ -1,72 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.standardFormRow {
- border-bottom: 1px dashed @border-color-split;
- padding-bottom: 16px;
- margin-bottom: 16px;
- display: flex;
- :global {
- .ant-form-item {
- margin-right: 24px;
- }
- .ant-form-item-label label {
- color: @text-color;
- margin-right: 0;
- }
- .ant-form-item-label,
- .ant-form-item-control {
- padding: 0;
- line-height: 32px;
- }
- }
- .label {
- color: @heading-color;
- font-size: @font-size-base;
- margin-right: 24px;
- flex: 0 0 auto;
- text-align: right;
- & > span {
- display: inline-block;
- height: 32px;
- line-height: 32px;
- &:after {
- content: ':';
- }
- }
- }
- .content {
- flex: 1 1 0;
- :global {
- .ant-form-item:last-child {
- margin-right: 0;
- }
- }
- }
-}
-
-.standardFormRowLast {
- border: none;
- padding-bottom: 0;
- margin-bottom: 0;
-}
-
-.standardFormRowBlock {
- :global {
- .ant-form-item,
- div.ant-form-item-control-wrapper {
- display: block;
- }
- }
-}
-
-.standardFormRowGrid {
- :global {
- .ant-form-item,
- div.ant-form-item-control-wrapper {
- display: block;
- }
- .ant-form-item-label {
- float: left;
- }
- }
-}
diff --git a/src/components/StandardTable/index.js b/src/components/StandardTable/index.js
deleted file mode 100644
index 907e828..0000000
--- a/src/components/StandardTable/index.js
+++ /dev/null
@@ -1,120 +0,0 @@
-import React, { PureComponent } from 'react';
-import { Table, Alert } from 'antd';
-import styles from './index.less';
-
-function initTotalList(columns) {
- const totalList = [];
- columns.forEach((column) => {
- if (column.needTotal) {
- totalList.push({ ...column, total: 0 });
- }
- });
- return totalList;
-}
-
-class StandardTable extends PureComponent {
- constructor(props) {
- super(props);
- const { columns } = props;
- const needTotalList = initTotalList(columns);
-
- this.state = {
- selectedRowKeys: [],
- needTotalList,
- };
- }
-
- componentWillReceiveProps(nextProps) {
- // clean state
- if (nextProps.selectedRows.length === 0) {
- const needTotalList = initTotalList(nextProps.columns);
- this.setState({
- selectedRowKeys: [],
- needTotalList,
- });
- }
- }
-
- handleRowSelectChange = (selectedRowKeys, selectedRows) => {
- let needTotalList = [...this.state.needTotalList];
- needTotalList = needTotalList.map((item) => {
- return {
- ...item,
- total: selectedRows.reduce((sum, val) => {
- return sum + parseFloat(val[item.dataIndex], 10);
- }, 0),
- };
- });
-
- if (this.props.onSelectRow) {
- this.props.onSelectRow(selectedRows);
- }
-
- this.setState({ selectedRowKeys, needTotalList });
- }
-
- handleTableChange = (pagination, filters, sorter) => {
- this.props.onChange(pagination, filters, sorter);
- }
-
- cleanSelectedKeys = () => {
- this.handleRowSelectChange([], []);
- }
-
- render() {
- const { selectedRowKeys, needTotalList } = this.state;
- const { data: { list, pagination }, loading, columns } = this.props;
-
- const paginationProps = {
- showSizeChanger: true,
- showQuickJumper: true,
- ...pagination,
- };
-
- const rowSelection = {
- selectedRowKeys,
- onChange: this.handleRowSelectChange,
- getCheckboxProps: record => ({
- disabled: record.disabled,
- }),
- };
-
- return (
- <div className={styles.standardTable}>
- <div className={styles.tableAlert}>
- <Alert
- message={(
- <div>
- 已选择 <a style={{ fontWeight: 600 }}>{selectedRowKeys.length}</a> 项
- {
- needTotalList.map(item => (
- <span style={{ marginLeft: 8 }} key={item.dataIndex}>{item.title}总计
- <span style={{ fontWeight: 600 }}>
- {item.render ? item.render(item.total) : item.total}
- </span>
- </span>
- )
- )
- }
- <a onClick={this.cleanSelectedKeys} style={{ marginLeft: 24 }}>清空</a>
- </div>
- )}
- type="info"
- showIcon
- />
- </div>
- <Table
- loading={loading}
- rowKey={record => record.key}
- rowSelection={rowSelection}
- dataSource={list}
- columns={columns}
- pagination={paginationProps}
- onChange={this.handleTableChange}
- />
- </div>
- );
- }
-}
-
-export default StandardTable;
diff --git a/src/components/StandardTable/index.less b/src/components/StandardTable/index.less
deleted file mode 100644
index 4ced9e7..0000000
--- a/src/components/StandardTable/index.less
+++ /dev/null
@@ -1,13 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.standardTable {
- :global {
- .ant-table-pagination {
- margin-top: 24px;
- }
- }
-
- .tableAlert {
- margin-bottom: 16px;
- }
-}
diff --git a/src/components/TagSelect/demo/expandable.md b/src/components/TagSelect/demo/expandable.md
deleted file mode 100644
index c45a30a..0000000
--- a/src/components/TagSelect/demo/expandable.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-order: 1
-title: 可展开和收起
----
-
-使用 `expandable` 属性,让标签组可以收起,避免过高。
-
-````jsx
-import TagSelect from 'ant-design-pro/lib/TagSelect';
-
-function handleFormSubmit(checkedValue) {
- console.log(checkedValue);
-}
-
-ReactDOM.render(
- <TagSelect onChange={handleFormSubmit} expandable>
- <TagSelect.Option value="cat1">类目一</TagSelect.Option>
- <TagSelect.Option value="cat2">类目二</TagSelect.Option>
- <TagSelect.Option value="cat3">类目三</TagSelect.Option>
- <TagSelect.Option value="cat4">类目四</TagSelect.Option>
- <TagSelect.Option value="cat5">类目五</TagSelect.Option>
- <TagSelect.Option value="cat6">类目六</TagSelect.Option>
- <TagSelect.Option value="cat7">类目七</TagSelect.Option>
- <TagSelect.Option value="cat8">类目八</TagSelect.Option>
- <TagSelect.Option value="cat9">类目九</TagSelect.Option>
- <TagSelect.Option value="cat10">类目十</TagSelect.Option>
- <TagSelect.Option value="cat11">类目十一</TagSelect.Option>
- <TagSelect.Option value="cat12">类目十二</TagSelect.Option>
- </TagSelect>
-, mountNode);
-````
diff --git a/src/components/TagSelect/demo/simple.md b/src/components/TagSelect/demo/simple.md
deleted file mode 100644
index 9e7a13a..0000000
--- a/src/components/TagSelect/demo/simple.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-order: 0
-title: 基础样例
----
-
-结合 `Tag` 的 `TagSelect` 组件,方便的应用于筛选类目的业务场景中。
-
-````jsx
-import TagSelect from 'ant-design-pro/lib/TagSelect';
-
-function handleFormSubmit(checkedValue) {
- console.log(checkedValue);
-}
-
-ReactDOM.render(
- <TagSelect onChange={handleFormSubmit}>
- <TagSelect.Option value="cat1">类目一</TagSelect.Option>
- <TagSelect.Option value="cat2">类目二</TagSelect.Option>
- <TagSelect.Option value="cat3">类目三</TagSelect.Option>
- <TagSelect.Option value="cat4">类目四</TagSelect.Option>
- <TagSelect.Option value="cat5">类目五</TagSelect.Option>
- <TagSelect.Option value="cat6">类目六</TagSelect.Option>
- </TagSelect>
-, mountNode);
-````
diff --git a/src/components/TagSelect/index.d.ts b/src/components/TagSelect/index.d.ts
deleted file mode 100644
index e9decee..0000000
--- a/src/components/TagSelect/index.d.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import * as React from 'react';
-export interface TagSelectProps {
- onChange?: (value: Array<string>) => void;
- expandable?: boolean;
- value?: Array<string>| Array<number>;
- style?: React.CSSProperties;
-}
-export interface TagSelectOptionProps {
- value: string| number;
- style?: React.CSSProperties;
-}
-
-export class TagSelectOption extends React.Component<
- TagSelectOptionProps,
- any
-> {}
-
-export default class TagSelect extends React.Component<TagSelectProps, any> {
- static Option: typeof TagSelectOption;
- children:
- | React.ReactElement<TagSelectOption>
- | Array<React.ReactElement<TagSelectOption>>;
-}
diff --git a/src/components/TagSelect/index.js b/src/components/TagSelect/index.js
deleted file mode 100644
index e0159aa..0000000
--- a/src/components/TagSelect/index.js
+++ /dev/null
@@ -1,129 +0,0 @@
-import React, { Component } from 'react';
-import classNames from 'classnames';
-import { Tag, Icon } from 'antd';
-
-import styles from './index.less';
-
-const { CheckableTag } = Tag;
-
-const TagSelectOption = ({ children, checked, onChange, value }) => (
- <CheckableTag
- checked={checked}
- key={value}
- onChange={state => onChange(value, state)}
- >
- {children}
- </CheckableTag>
-);
-
-TagSelectOption.isTagSelectOption = true;
-
-class TagSelect extends Component {
- state = {
- expand: false,
- value: this.props.value || this.props.defaultValue || [],
- };
- componentWillReceiveProps(nextProps) {
- if ('value' in nextProps && nextProps.value) {
- this.setState({ value: nextProps.value });
- }
- }
-
- onChange = (value) => {
- const { onChange } = this.props;
- if (!('value' in this.props)) {
- this.setState({ value });
- }
- if (onChange) {
- onChange(value);
- }
- }
-
- onSelectAll = (checked) => {
- let checkedTags = [];
- if (checked) {
- checkedTags = this.getAllTags();
- }
- this.onChange(checkedTags);
- }
-
- getAllTags() {
- let { children } = this.props;
- children = React.Children.toArray(children);
- const checkedTags = children
- .filter(child => this.isTagSelectOption(child))
- .map(child => child.props.value);
- return checkedTags || [];
- }
-
- handleTagChange = (value, checked) => {
- const checkedTags = [...this.state.value];
-
- const index = checkedTags.indexOf(value);
- if (checked && index === -1) {
- checkedTags.push(value);
- } else if (!checked && index > -1) {
- checkedTags.splice(index, 1);
- }
- this.onChange(checkedTags);
- }
-
- handleExpand = () => {
- this.setState({
- expand: !this.state.expand,
- });
- }
-
- isTagSelectOption = (node) => {
- return node && node.type && (
- node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption'
- );
- }
-
- render() {
- const { value, expand } = this.state;
- const { children, className, style, expandable } = this.props;
-
- const checkedAll = this.getAllTags().length === value.length;
-
- const cls = classNames(styles.tagSelect, className, {
- [styles.hasExpandTag]: expandable,
- [styles.expanded]: expand,
- });
- return (
- <div className={cls} style={style}>
- <CheckableTag
- checked={checkedAll}
- key="tag-select-__all__"
- onChange={this.onSelectAll}
- >
- 全部
- </CheckableTag>
- {
- value && React.Children.map(children, (child) => {
- if (this.isTagSelectOption(child)) {
- return React.cloneElement(child, {
- key: `tag-select-${child.props.value}`,
- value: child.props.value,
- checked: value.indexOf(child.props.value) > -1,
- onChange: this.handleTagChange,
- });
- }
- return child;
- })
- }
- {
- expandable && (
- <a className={styles.trigger} onClick={this.handleExpand}>
- {expand ? '收起' : '展开'} <Icon type={expand ? 'up' : 'down'} />
- </a>
- )
- }
- </div>
- );
- }
-}
-
-TagSelect.Option = TagSelectOption;
-
-export default TagSelect;
diff --git a/src/components/TagSelect/index.less b/src/components/TagSelect/index.less
deleted file mode 100644
index df2669c..0000000
--- a/src/components/TagSelect/index.less
+++ /dev/null
@@ -1,33 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.tagSelect {
- user-select: none;
- margin-left: -8px;
- position: relative;
- overflow: hidden;
- max-height: 32px;
- line-height: 32px;
- transition: all .3s;
- :global {
- .ant-tag {
- padding: 0 8px;
- margin-right: 24px;
- font-size: @font-size-base;
- }
- }
- &.expanded {
- transition: all .3s;
- max-height: 200px;
- }
- .trigger {
- position: absolute;
- top: 0;
- right: 0;
- i {
- font-size: 12px;
- }
- }
- &.hasExpandTag {
- padding-right: 50px;
- }
-}
diff --git a/src/components/TagSelect/index.md b/src/components/TagSelect/index.md
deleted file mode 100644
index 608219c..0000000
--- a/src/components/TagSelect/index.md
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title:
- en-US: TagSelect
- zh-CN: TagSelect
-subtitle: 标签选择器
-cols: 1
-order: 13
----
-
-可进行多选,带折叠收起和展开更多功能,常用于对列表进行筛选。
-
-## API
-
-### TagSelect
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| value |选中的项 |string[] \| number[] | |
-| defaultValue |默认选中的项 |string[] \| number[] | |
-| onChange | 标签选择的回调函数 | Function(checkedTags) | |
-| expandable | 是否展示 `展开/收起` 按钮 | Boolean | false |
-
-
-### TagSelectOption
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| value | TagSelect的值 | string\| number | - |
-| children | tag的内容 | string \| ReactNode | - |
diff --git a/src/components/TraceTable/index.js b/src/components/TraceTable/index.js
index 8b66c2b..d257527 100644
--- a/src/components/TraceTable/index.js
+++ b/src/components/TraceTable/index.js
@@ -32,7 +32,11 @@ class TraceTable extends PureComponent {
return (
<Collapse
bordered={false}
- onChange={(key) => { if (!spansContainer[key]) { this.props.onExpand(record.key, key); } }}
+ onChange={(key) => {
+ if (key.length > 0 && !spansContainer[key]) {
+ this.props.onExpand(record.key, key[0]);
+ }
+ }}
>
{traceIds.map((k) => {
return (
diff --git a/src/components/Trend/demo/basic.md b/src/components/Trend/demo/basic.md
deleted file mode 100644
index 82afcda..0000000
--- a/src/components/Trend/demo/basic.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-order: 0
-title: 演示
----
-
-在数值背后添加一个小图标来标识涨跌情况。
-
-````jsx
-import Trend from 'ant-design-pro/lib/Trend';
-
-ReactDOM.render(
- <div>
- <Trend flag="up">12%</Trend>
- <Trend flag="down" style={{ marginLeft: 8 }}>11%</Trend>
- </div>
-, mountNode);
-````
diff --git a/src/components/Trend/index.d.ts b/src/components/Trend/index.d.ts
deleted file mode 100644
index bb2b2a2..0000000
--- a/src/components/Trend/index.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import * as React from 'react';
-
-export interface TrendProps {
- colorful?: boolean;
- flag: 'up' | 'down';
- style?: React.CSSProperties;
-}
-
-export default class Trend extends React.Component<TrendProps, any> {}
diff --git a/src/components/Trend/index.js b/src/components/Trend/index.js
deleted file mode 100644
index 2cbaad4..0000000
--- a/src/components/Trend/index.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from 'react';
-import { Icon } from 'antd';
-import classNames from 'classnames';
-import styles from './index.less';
-
-const Trend = ({ colorful = true, flag, children, className, ...rest }) => {
- const classString = classNames(styles.trendItem, {
- [styles.trendItemGrey]: !colorful,
- }, className);
- return (
- <div
- {...rest}
- className={classString}
- title={typeof children === 'string' ? children : ''}
- >
- <span className={styles.value}>{children}</span>
- {flag && <span className={styles[flag]}><Icon type={`caret-${flag}`} /></span>}
- </div>
- );
-};
-
-export default Trend;
diff --git a/src/components/Trend/index.less b/src/components/Trend/index.less
deleted file mode 100644
index 48695c9..0000000
--- a/src/components/Trend/index.less
+++ /dev/null
@@ -1,30 +0,0 @@
-@import "~antd/lib/style/themes/default.less";
-
-.trendItem {
- display: inline-block;
- font-size: @font-size-base;
- line-height: 22px;
-
- .up,
- .down {
- margin-left: 4px;
- position: relative;
- top: 1px;
- i {
- font-size: 12px;
- transform: scale(0.83);
- }
- }
- .up {
- color: @red-6;
- }
- .down {
- color: @green-6;
- top: -1px;
- }
-
- &.trendItemGrey .up,
- &.trendItemGrey .down {
- color: @text-color;
- }
-}
diff --git a/src/components/Trend/index.md b/src/components/Trend/index.md
deleted file mode 100644
index 683ed61..0000000
--- a/src/components/Trend/index.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title:
- en-US: Trend
- zh-CN: Trend
-subtitle: 趋势标记
-cols: 1
-order: 14
----
-
-趋势符号,标记上升和下降趋势。通常用绿色代表“好”,红色代表“不好”,股票涨跌场景除外。
-
-## API
-
-```html
-<Trend flag="up">50%</Trend>
-```
-
-| 参数 | 说明 | 类型 | 默认值 |
-|----------|------------------------------------------|-------------|-------|
-| colorful | 是否彩色标记 | Boolean | true |
-| flag | 上升下降标识:`up|down` | string | - |
diff --git a/src/e2e/home.e2e.js b/src/e2e/home.e2e.js
index 15401f1..125f274 100644
--- a/src/e2e/home.e2e.js
+++ b/src/e2e/home.e2e.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import Nightmare from 'nightmare';
describe('Homepage', () => {
diff --git a/src/index.ejs b/src/index.ejs
index 1f0c7fc..ea9c429 100644
--- a/src/index.ejs
+++ b/src/index.ejs
@@ -1,3 +1,19 @@
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
<!DOCTYPE html>
<html lang="en">
diff --git a/src/index.js b/src/index.js
index 9cc1282..0cee0a3 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import '@babel/polyfill';
import 'url-polyfill';
import dva from 'dva';
diff --git a/src/index.less b/src/index.less
index 5cfe914..618986a 100644
--- a/src/index.less
+++ b/src/index.less
@@ -1,3 +1,20 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
html,
body,
:global(#root) {
diff --git a/src/router.js b/src/router.js
index 0f189f7..3c15d77 100644
--- a/src/router.js
+++ b/src/router.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
import React from 'react';
import { routerRedux, Switch } from 'dva/router';
import { LocaleProvider, Spin } from 'antd';
diff --git a/src/theme.js b/src/theme.js
index 9e12511..c4e9f23 100644
--- a/src/theme.js
+++ b/src/theme.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
// https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
module.exports = {
// 'primary-color': '#10e99b',
diff --git a/tests/run-tests.js b/tests/run-tests.js
index 15c822c..19aee03 100644
--- a/tests/run-tests.js
+++ b/tests/run-tests.js
@@ -1,3 +1,21 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
const { spawn } = require('child_process');
const { kill } = require('cross-port-killer');
--
To stop receiving notification emails like this one, please contact
wusheng@apache.org.