[improve]: 移除react-impression包的不必要依赖。

NewDadaFE · Aug 11, 2017 · 80ca442 · 80ca442
1 parent 154d86a
commit 80ca442
Show file tree

Hide file tree

Showing 48 changed files with 673 additions and 662 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,6 +1,3 @@
 module.exports = {
     "extends": "react-impression",
-    rules: {
-        "import/no-extraneous-dependencies": ["error", {"devDependencies": true, "optionalDependencies": true, "peerDependencies": true}]
-    },
 };
diff --git a/gulpfile.js b/gulpfile.js
@@ -95,7 +95,6 @@ gulp.task('edit:package.json', function() {
         delete json.devDependencies;
 
         delete json.dependencies['highlight.js'];
-        delete json.dependencies['perfect-scrollbar'];
         delete json.dependencies['react-router'];
 
         return json;

diff --git a/index.html b/index.html
@@ -1,4 +1,3 @@
-<!DOCTYPE html>
 <html>
 	<head>
 		<meta charset="UTF-8">

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-impression",
-  "version": "1.2.21",
+  "version": "1.3.1",
   "author": "NewDadaFE",
   "description": "UI Components with React.",
   "main": "./dist/scripts/index.js",
@@ -34,7 +34,7 @@
     "perfect-scrollbar": "^0.6.12",
     "prop-types": "^15.5.10",
     "react": "^15.4.1",
-    "react-addons-css-transition-group": "^15.4.1",
+    "react-addons-css-transition-group": "^15.6.0",
     "react-dom": "^15.4.1",
     "react-router": "3.0.5"
   },
@@ -53,7 +53,8 @@
     "babel-preset-react": "^6.5.0",
     "babel-preset-stage-0": "^6.5.0",
     "babel-runtime": "^6.11.6",
-    "eslint-config-react-impression": "^1.1.4",
+    "eslint-config-react-impression": "^1.2.0",
+    "eslint-loader": "^1.9.0",
     "file-loader": "^0.8.5",
     "gulp": "^3.9.1",
     "gulp-autoprefixer": "^3.1.1",

diff --git a/src/scripts/components/Breadcrumb.js b/src/scripts/components/Breadcrumb.js
@@ -12,13 +12,13 @@ const WrapBreadcrumb = ({ routes }) => {
             { routes.map((route, index) => {
                 if(index < length - 1) {
                     return (
-                        <Link key={index} to={`/${route.path}`}>
+                        <Link key={route} to={`/${route.path}`}>
                             {route.path === 'app' ? 'home' : route.path}
                         </Link>
                     );
                 }
 
-                return <span key={index}>{route.path}</span>;
+                return <span key={route}>{route.path}</span>;
             })}
         </Breadcrumb>
     );

diff --git a/src/scripts/components/CommenTable.js b/src/scripts/components/CommenTable.js
@@ -4,9 +4,9 @@ import PropTypes from 'prop-types';
  * React组件
  */
 const CommenTable = ({ data }) => {
-    let rows = data.map((item, index) => {
+    let rows = data.map(item => {
         return (
-            <tr key={index}>
+            <tr key={item}>
                 <td style={{ fontWeight: 'bold' }}>{item[0]}</td>
                 <td>{item[1]}</td>
                 <td>{item[2]}</td>

diff --git a/src/scripts/components/impression/components/Alert.js b/src/scripts/components/impression/components/Alert.js
@@ -1,6 +1,17 @@
 import classnames from 'classnames';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+
+// 获取小图标
+const getAddonByType = type => {
+    switch(type) {
+        case 'danger':
+            return 'fa-exclamation-circle text-danger';
+        default:
+            return 'fa-exclamation-triangle text-warning';
+    }
+};
+
 /**
  * Alert 组件
  */
@@ -22,18 +33,9 @@ export default class Alert extends PureComponent {
         type: 'info',
         btnText: '确定',
     }
-    // 获取小图标
-    getAddonByType(type) {
-        switch(type) {
-            case 'danger':
-                return 'fa-exclamation-circle text-danger';
-            default:
-                return 'fa-exclamation-triangle text-warning';
-        }
-    }
     render() {
         let { type, btnText, onClick, className, children, ...others } = this.props,
-            iconTypeClass = this.getAddonByType(type);
+            iconTypeClass = getAddonByType(type);
 
         return(
             <div className={classnames('alert', className)}>

diff --git a/src/scripts/components/impression/components/ButtonGroup.js b/src/scripts/components/impression/components/ButtonGroup.js
@@ -37,15 +37,15 @@ export default class ButtonGroup extends PureComponent {
             btnGroupSize = size ? `btn-group-${size}` : null;
 
         delete others.activeKey;
-        children = children.map((child, index) => {
+        children = children.map(child => {
             let { eventKey, onClick } = child.props;
 
             return React.cloneElement(child, {
-                key: index,
+                key: child,
                 outline: theme !== 'default' && (!onSelect || activeKey !== eventKey),
                 theme: theme === 'default' && onSelect
                     && activeKey === eventKey ? 'primary' : theme,
-                onClick: onSelect ? (event) => {
+                onClick: onSelect ? event => {
                     this.setState({
                         activeKey: eventKey,
                     });

diff --git a/src/scripts/components/impression/components/Calendar.js b/src/scripts/components/impression/components/Calendar.js
@@ -44,8 +44,6 @@ export default class Calendar extends Component {
         firstDayOfWeek: PropTypes.number,
         // 周几
         weekdays: PropTypes.arrayOf(PropTypes.string),
-        // 月份
-        months: PropTypes.arrayOf(PropTypes.string),
         // 是否显示工具栏
         showToolbar: PropTypes.bool,
         // 是否显示头部
@@ -65,7 +63,6 @@ export default class Calendar extends Component {
         showHeader: true,
         firstDayOfWeek: 1,
         weekdays: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
-        months: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
     }
     /**
      * 获取排序后的星期.
@@ -75,9 +72,9 @@ export default class Calendar extends Component {
         let { firstDayOfWeek, weekdays } = this.props;
 
         return firstDayOfWeek === 0 ?
-        weekdays :
-        [...weekdays.slice(firstDayOfWeek, weekdays.length),
-            ...weekdays.slice(0, firstDayOfWeek)];
+            weekdays :
+            [...weekdays.slice(firstDayOfWeek, weekdays.length),
+                ...weekdays.slice(0, firstDayOfWeek)];
     }
     /**
      * 前一个月.
@@ -220,15 +217,15 @@ export default class Calendar extends Component {
                 }
                 <div className="calendar-body">
                     <div className="calendar-weekgroup">
-                        { weekdays.map((weekday, index) =>
-                            <div key={index} className="calendar-weekgroup-item">{weekday}</div>
+                        { weekdays.map(weekday =>
+                            <div key={weekday} className="calendar-weekgroup-item">{weekday}</div>
                         )}
 
                     </div>
                     <div className="calendar-daygroup">
                         { days.map((day, index) =>
-                            <div
-                                key={index}
+                            (<div
+                                key={`${day.text}-${day.inMonth}`}
                                 onClick={() => onCellClick && onCellClick({
                                     day: day.text,
                                     year: day.date.format(FORMAT.YEAR),
@@ -261,7 +258,7 @@ export default class Calendar extends Component {
                                         isToday: day.isToday,
                                     })}
                                 </div>
-                            </div>
+                            </div>)
                         )}
                     </div>
                 </div>

diff --git a/src/scripts/components/impression/components/Checkbox.js b/src/scripts/components/impression/components/Checkbox.js
@@ -42,15 +42,15 @@ export default class Checkbox extends PureComponent {
     // 渲染
     render() {
         let {
-                value,
-                checked,
-                defaultChecked,
-                disabled,
-                className,
-                onChange,
-                children,
-                ...others
-            } = this.props;
+            value,
+            checked,
+            defaultChecked,
+            disabled,
+            className,
+            onChange,
+            children,
+            ...others
+        } = this.props;
 
         return(
             <label {...others} className={classnames('checkbox', className)}>

diff --git a/src/scripts/components/impression/components/CheckboxGroup.js b/src/scripts/components/impression/components/CheckboxGroup.js
@@ -109,7 +109,7 @@ export default class CheckboxGroup extends PureComponent {
 }
 
 // getValue
-CheckboxGroup.getValue = (ref) => {
+CheckboxGroup.getValue = ref => {
     if(!ref) return undefined;
 
     return ref.getValue();

diff --git a/src/scripts/components/impression/components/Collapse.js b/src/scripts/components/impression/components/Collapse.js
@@ -37,7 +37,7 @@ export default class Collapse extends PureComponent {
             { active } = this.state;
 
         delete others.active;
-        children = React.Children.map(children, (child) => {
+        children = React.Children.map(children, child => {
             if(!child) {
                 return child;
             }

diff --git a/src/scripts/components/impression/components/Confirm.js b/src/scripts/components/impression/components/Confirm.js
@@ -31,7 +31,7 @@ export default class Confirm extends PureComponent {
      * 根据类型获取Icon.
      * @return {[String]} [Icon类型]
      */
-    getAddonByType = (type) => {
+    getAddonByType = type => {
         switch(type) {
             case 'info':
                 return 'fa-question-circle text-primary';

diff --git a/src/scripts/components/impression/components/Content.js b/src/scripts/components/impression/components/Content.js
@@ -29,7 +29,7 @@ export default class Content extends PureComponent {
         transitionName: 'zoom-slide',
         component: 'div',
         transitionEnterTimeout: 1200,
-        transitionLeaveTimeout: 1200,
+        transitionLeaveTimeout: 900,
     }
     render() {
         let {

diff --git a/src/scripts/components/impression/components/DatePicker.js b/src/scripts/components/impression/components/DatePicker.js
@@ -98,10 +98,10 @@ export default class DatePicker extends PureComponent {
         let { firstDayOfWeek, weekdays } = this.props;
 
         return firstDayOfWeek === 0 ? weekdays :
-        [
-            ...weekdays.slice(firstDayOfWeek, weekdays.length),
-            ...weekdays.slice(0, firstDayOfWeek),
-        ];
+            [
+                ...weekdays.slice(firstDayOfWeek, weekdays.length),
+                ...weekdays.slice(0, firstDayOfWeek),
+            ];
     }
     /**
      * 获取日期数据.
@@ -138,8 +138,8 @@ export default class DatePicker extends PureComponent {
             prevMonthMonth = prevMonth.format(FORMAT.MONTH),
             prevMonthDaysLength = prevMonth.daysInMonth(),
             prevMonthMax = (firstDay - firstDayOfWeek) >= 0 ?
-                            (firstDay - firstDayOfWeek) :
-                            (firstDay - firstDayOfWeek + 7);
+                (firstDay - firstDayOfWeek) :
+                (firstDay - firstDayOfWeek + 7);
 
         for (let i = 0; i <= prevMonthMax - 1; i++) {
             let dayFormat = `${prevMonthYear}-${prevMonthMonth}-${prevMonthDaysLength - i}`,
@@ -428,28 +428,27 @@ export default class DatePicker extends PureComponent {
                 { panel === 'day' &&
                     <div className="datepicker-body">
                         <div className="datepicker-weekgroup">
-                            { weekdays.map((day, index) =>
-                                <div key={index} className="datepicker-weekgroup-item">{day}</div>
+                            { weekdays.map(day =>
+                                <div key={day} className="datepicker-weekgroup-item">{day}</div>
                             )}
                         </div>
                         <div className="datepicker-daygroup">
-                            { days.map((
-                                { text, date, checked, isToday, inMonth, disable }, index) =>
+                            { days.map(({ text, date, isToday, inMonth, disable }) =>
+                                (<div
+                                    key={`${text}-${inMonth}`}
+                                    onClick={() => !disable && this.selectDateHandle(date)}
+                                    className="datepicker-daygroup-item">
                                     <div
-                                        key={index}
-                                        onClick={() => !disable && this.selectDateHandle(date)}
-                                        className="datepicker-daygroup-item">
-                                        <div
-                                            className={
+                                        className={
                                             classnames('datepicker-daygroup-item-text', {
                                                 disable,
                                                 now: isToday,
                                                 'text-muted': !inMonth,
                                                 active: date.isSame(checkedDay),
                                             })}>
-                                            {text}
-                                        </div>
+                                        {text}
                                     </div>
+                                </div>)
                             )}
                         </div>
                     </div>
@@ -460,31 +459,31 @@ export default class DatePicker extends PureComponent {
                             className="datepicker-yeargroup"
                             ref="_yeargroup"
                             onScroll={this.scrollYearHandle}>
-                            { years.map((year, index) =>
-                                <div
-                                    key={index}
+                            { years.map(year =>
+                                (<div
+                                    key={year}
                                     onClick={() => this.selectYearHandle(year)}
                                     ref={dom => (Number(year) === Number(currentYear))
                                         && (this._activeYear = dom)}
                                     className={classnames(
                                         'datepicker-yeargroup-item',
                                         { active: Number(year) === Number(currentYear) })}>
                                     {year}
-                                </div>
+                                </div>)
                             )}
                         </div>
                         <div className="datepicker-monthgroup" ref="_monthgroup">
                             { months.map((month, index) =>
-                                <div
-                                    key={index}
+                                (<div
+                                    key={month}
                                     onClick={() => this.selectMonthHandle(index)}
                                     ref={dom => (index === currentMonth - 1)
                                         && (this._activeMonth = dom)}
                                     className={classnames(
                                         'datepicker-monthgroup-item',
                                         { active: index === currentMonth - 1 })}>
                                     {month}
-                                </div>
+                                </div>)
                             )}
                         </div>
                     </div>

diff --git a/src/scripts/components/impression/components/Dropdown.js b/src/scripts/components/impression/components/Dropdown.js
@@ -36,7 +36,7 @@ export default class Dropdown extends PureComponent {
         trigger: 'click',
     }
     // 显示/隐藏菜单
-    toggleOptionsHandle = (flag) => {
+    toggleOptionsHandle = flag => {
         let { active } = this.state;
 
         this.setState({
@@ -58,7 +58,7 @@ export default class Dropdown extends PureComponent {
         let { trigger, className, children, ...others } = this.props,
             { active } = this.state;
 
-        children = React.Children.map(children, (child) => {
+        children = React.Children.map(children, child => {
             if(!child) {
                 return child;
             }

diff --git a/src/scripts/components/impression/components/DropdownMenu.js b/src/scripts/components/impression/components/DropdownMenu.js
@@ -21,7 +21,7 @@ export default class DropdownMenu extends PureComponent {
     render() {
         let { toggleMenu, right, className, children } = this.props;
 
-        children = React.Children.map(children, (child) => {
+        children = React.Children.map(children, child => {
             if(!child) {
                 return child;
             }

diff --git a/src/scripts/components/impression/components/InlineSelect.js b/src/scripts/components/impression/components/InlineSelect.js
@@ -90,7 +90,7 @@ export default class InlineSelect extends PureComponent {
 }
 
 // getValue
-InlineSelect.getValue = (ref) => {
+InlineSelect.getValue = ref => {
     if(!ref) return undefined;
 
     return ref.getValue();