@gmfe/react 2.14.17 → 2.14.19-beta.0

package/src/component/nprogress/style.less

@@ -1,39 +1,39 @@
-.gm-nprogress {
-  transition: all 200ms ease;
-  height: 2px;
-  background: @brand-primary;
-  width: 100%;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 9999;
-}
-
-.gm-nprogress-loading {
-  animation: gm-nprogress-loading 1s linear;
-  animation-fill-mode: forwards;
-}
-
-.gm-nprogress-completed {
-  transform: translateX(0);
-  visibility: hidden;
-}
-
-@keyframes gm-nprogress-loading {
-  0% {
-    transform: translateX(-100%);
-  }
-
-  20% {
-    transform: translateX(-50%);
-  }
-
-  50% {
-    transform: translateX(-20%);
-  }
-
-  100% {
-    transform: translateX(-10%);
-  }
-}
+.gm-nprogress {
+  transition: all 200ms ease;
+  height: 2px;
+  background: @brand-primary;
+  width: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 9999;
+}
+
+.gm-nprogress-loading {
+  animation: gm-nprogress-loading 1s linear;
+  animation-fill-mode: forwards;
+}
+
+.gm-nprogress-completed {
+  transform: translateX(0);
+  visibility: hidden;
+}
+
+@keyframes gm-nprogress-loading {
+  0% {
+    transform: translateX(-100%);
+  }
+
+  20% {
+    transform: translateX(-50%);
+  }
+
+  50% {
+    transform: translateX(-20%);
+  }
+
+  100% {
+    transform: translateX(-10%);
+  }
+}

package/src/component/pagination/base.js

@@ -1,67 +1,67 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import Flex from '../flex'
-import classNames from 'classnames'
-import Left from './left'
-import Page from './page'
-import Right from './right'
-import PagePeek from './page_peek'
-
-const PaginationBase = props => {
-  const {
-    data,
-    onChange,
-    showCount,
-    _peekInfo,
-    className,
-    limitData,
-    ...rest
-  } = props
-
-  return (
-    <Flex
-      {...rest}
-      alignCenter
-      className={classNames('gm-pagination', className)}
-    >
-      <Left
-        data={data}
-        limitData={limitData}
-        onChange={onChange}
-        showCount={showCount}
-      />
-      {_peekInfo ? (
-        <PagePeek data={data} _peekInfo={_peekInfo} onChange={onChange} />
-      ) : (
-        <Page data={data} onChange={onChange} />
-      )}
-      {showCount && <Right data={data} onChange={onChange} />}
-    </Flex>
-  )
-}
-
-PaginationBase.propTypes = {
-  /** 非传统意义上的 分页信息。 仅此组件需要的数据而已。count 仅当前有多少条数据，非传统意义上的一共多少条数据，注意是当前。 */
-  data: PropTypes.shape({
-    count: PropTypes.number.isRequired,
-    offset: PropTypes.number.isRequired,
-    limit: PropTypes.number.isRequired
-  }),
-  /** 提供 {offset, limit} */
-  onChange: PropTypes.func.isRequired,
-  /** 此 count 非 data.count。此只是用来控制不显示总数 */
-  showCount: PropTypes.bool,
-  className: PropTypes.string,
-  style: PropTypes.object,
-  /** 私有 */
-  _peekInfo: PropTypes.shape({
-    more: PropTypes.bool,
-    peek: PropTypes.number
-  }),
-  /**
-   *自定义分页，默认
-   */
-  limitData: PropTypes.array
-}
-
-export default PaginationBase
+import React from 'react'
+import PropTypes from 'prop-types'
+import Flex from '../flex'
+import classNames from 'classnames'
+import Left from './left'
+import Page from './page'
+import Right from './right'
+import PagePeek from './page_peek'
+
+const PaginationBase = props => {
+  const {
+    data,
+    onChange,
+    showCount,
+    _peekInfo,
+    className,
+    limitData,
+    ...rest
+  } = props
+
+  return (
+    <Flex
+      {...rest}
+      alignCenter
+      className={classNames('gm-pagination', className)}
+    >
+      <Left
+        data={data}
+        limitData={limitData}
+        onChange={onChange}
+        showCount={showCount}
+      />
+      {_peekInfo ? (
+        <PagePeek data={data} _peekInfo={_peekInfo} onChange={onChange} />
+      ) : (
+        <Page data={data} onChange={onChange} />
+      )}
+      {showCount && <Right data={data} onChange={onChange} />}
+    </Flex>
+  )
+}
+
+PaginationBase.propTypes = {
+  /** 非传统意义上的 分页信息。 仅此组件需要的数据而已。count 仅当前有多少条数据，非传统意义上的一共多少条数据，注意是当前。 */
+  data: PropTypes.shape({
+    count: PropTypes.number.isRequired,
+    offset: PropTypes.number.isRequired,
+    limit: PropTypes.number.isRequired
+  }),
+  /** 提供 {offset, limit} */
+  onChange: PropTypes.func.isRequired,
+  /** 此 count 非 data.count。此只是用来控制不显示总数 */
+  showCount: PropTypes.bool,
+  className: PropTypes.string,
+  style: PropTypes.object,
+  /** 私有 */
+  _peekInfo: PropTypes.shape({
+    more: PropTypes.bool,
+    peek: PropTypes.number
+  }),
+  /**
+   *自定义分页，默认
+   */
+  limitData: PropTypes.array
+}
+
+export default PaginationBase

package/src/component/pagination/left.js

@@ -1,65 +1,65 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Select } from '../select'
-import Flex from '../flex'
-
-const defaultLimitData = [
-  { value: 10, text: 10 },
-  { value: 20, text: 20 },
-  { value: 50, text: 50 }
-]
-
-const Limit = ({ value, onChange, limitData }) => {
-  return (
-    <Select
-      data={limitData}
-      value={value}
-      onChange={onChange}
-      style={{ width: '70px' }}
-    />
-  )
-}
-
-Limit.propTypes = {
-  value: PropTypes.any.isRequired,
-  onChange: PropTypes.func.isRequired,
-  limitData: PropTypes.array
-}
-Limit.defaultProps = {
-  limitData: defaultLimitData
-}
-
-const Left = ({ data, onChange, showCount, limitData }) => {
-  const handleChangeLimit = limit => {
-    // 回到第一页
-    onChange({
-      offset: 0,
-      limit
-    })
-  }
-
-  return (
-    <Flex alignCenter>
-      {showCount && <span>共{data.count}条记录,&nbsp;</span>}
-      <span>每页&nbsp;</span>
-      <Limit
-        value={data.limit}
-        limitData={limitData}
-        onChange={handleChangeLimit}
-      />
-      <span>&nbsp;条</span>
-    </Flex>
-  )
-}
-
-Left.propTypes = {
-  data: PropTypes.object,
-  onChange: PropTypes.func.isRequired,
-  showCount: PropTypes.bool,
-  limitData: PropTypes.array
-}
-Left.defaultProps = {
-  limitData: defaultLimitData
-}
-
-export default Left
+import React from 'react'
+import PropTypes from 'prop-types'
+import { Select } from '../select'
+import Flex from '../flex'
+
+const defaultLimitData = [
+  { value: 10, text: 10 },
+  { value: 20, text: 20 },
+  { value: 50, text: 50 }
+]
+
+const Limit = ({ value, onChange, limitData }) => {
+  return (
+    <Select
+      data={limitData}
+      value={value}
+      onChange={onChange}
+      style={{ width: '70px' }}
+    />
+  )
+}
+
+Limit.propTypes = {
+  value: PropTypes.any.isRequired,
+  onChange: PropTypes.func.isRequired,
+  limitData: PropTypes.array
+}
+Limit.defaultProps = {
+  limitData: defaultLimitData
+}
+
+const Left = ({ data, onChange, showCount, limitData }) => {
+  const handleChangeLimit = limit => {
+    // 回到第一页
+    onChange({
+      offset: 0,
+      limit
+    })
+  }
+
+  return (
+    <Flex alignCenter>
+      {showCount && <span>共{data.count}条记录,&nbsp;</span>}
+      <span>每页&nbsp;</span>
+      <Limit
+        value={data.limit}
+        limitData={limitData}
+        onChange={handleChangeLimit}
+      />
+      <span>&nbsp;条</span>
+    </Flex>
+  )
+}
+
+Left.propTypes = {
+  data: PropTypes.object,
+  onChange: PropTypes.func.isRequired,
+  showCount: PropTypes.bool,
+  limitData: PropTypes.array
+}
+Left.defaultProps = {
+  limitData: defaultLimitData
+}
+
+export default Left

package/src/component/pagination/page.js

@@ -1,120 +1,120 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import SVGLeftSmall from '../../../svg/left-small.svg'
-import SVGRightSmall from '../../../svg/right-small.svg'
-import Flex from '../flex'
-import classNames from 'classnames'
-import { getIndex } from './util'
-
-function getInfo(data) {
-  const index = getIndex(data)
-  const all = Math.ceil(data.count / data.limit)
-
-  const diff = 2
-  let pages = []
-
-  let begin = Math.max(index - diff, 1)
-
-  let end = Math.min(index + diff, all)
-
-  if (all > diff * 2 + 1) {
-    if (begin === 1) {
-      end = diff * 2 + 1
-    } else if (end === all) {
-      begin = Math.max(end - 2 * diff, 1)
-    }
-  }
-
-  for (let i = begin; i <= end; i++) {
-    pages.push(i)
-  }
-
-  // 如果总数为0，还是要给个页码1
-  if (data.count === 0) {
-    pages = [1]
-  }
-
-  return {
-    index,
-    all,
-    begin,
-    end,
-    pages
-  }
-}
-
-const Page = props => {
-  const { data, onChange } = props
-  const { index, all, begin, end, pages } = getInfo(data)
-
-  const handlePage = _index => {
-    // 不处理
-    if (index === _index || _index < 1 || _index > all) {
-      return
-    }
-
-    onChange({
-      offset: (_index - 1) * data.limit,
-      limit: data.limit
-    })
-  }
-
-  return (
-    <Flex alignCenter className='gm-pagination-page'>
-      <div
-        className={classNames('gm-pagination-page-item', {
-          disabled: index === 1
-        })}
-        onClick={() => handlePage(index - 1)}
-      >
-        <SVGLeftSmall />
-      </div>
-
-      {begin >= 2 && (
-        <div className='gm-pagination-page-item' onClick={() => handlePage(1)}>
-          1
-        </div>
-      )}
-      {begin >= 3 && <span className='gm-pagination-page-text'>···</span>}
-
-      {pages.map((page, i) => (
-        <div
-          key={i}
-          className={classNames('gm-pagination-page-item', {
-            active: index === page
-          })}
-          onClick={() => handlePage(page)}
-        >
-          {page}
-        </div>
-      ))}
-
-      {end <= all - 2 && <span className='gm-pagination-page-text'>···</span>}
-      {end <= all - 1 && (
-        <div
-          className='gm-pagination-page-item'
-          onClick={() => handlePage(all)}
-        >
-          {all}
-        </div>
-      )}
-
-      <div
-        className={classNames('gm-pagination-page-item', {
-          disabled: index === all || all === 0
-        })}
-        onClick={() => handlePage(index + 1)}
-      >
-        <SVGRightSmall />
-      </div>
-    </Flex>
-  )
-}
-
-Page.propTypes = {
-  data: PropTypes.object,
-  /* 提供 {index, limit} */
-  onChange: PropTypes.func.isRequired
-}
-
-export default Page
+import React from 'react'
+import PropTypes from 'prop-types'
+import SVGLeftSmall from '../../../svg/left-small.svg'
+import SVGRightSmall from '../../../svg/right-small.svg'
+import Flex from '../flex'
+import classNames from 'classnames'
+import { getIndex } from './util'
+
+function getInfo(data) {
+  const index = getIndex(data)
+  const all = Math.ceil(data.count / data.limit)
+
+  const diff = 2
+  let pages = []
+
+  let begin = Math.max(index - diff, 1)
+
+  let end = Math.min(index + diff, all)
+
+  if (all > diff * 2 + 1) {
+    if (begin === 1) {
+      end = diff * 2 + 1
+    } else if (end === all) {
+      begin = Math.max(end - 2 * diff, 1)
+    }
+  }
+
+  for (let i = begin; i <= end; i++) {
+    pages.push(i)
+  }
+
+  // 如果总数为0，还是要给个页码1
+  if (data.count === 0) {
+    pages = [1]
+  }
+
+  return {
+    index,
+    all,
+    begin,
+    end,
+    pages
+  }
+}
+
+const Page = props => {
+  const { data, onChange } = props
+  const { index, all, begin, end, pages } = getInfo(data)
+
+  const handlePage = _index => {
+    // 不处理
+    if (index === _index || _index < 1 || _index > all) {
+      return
+    }
+
+    onChange({
+      offset: (_index - 1) * data.limit,
+      limit: data.limit
+    })
+  }
+
+  return (
+    <Flex alignCenter className='gm-pagination-page'>
+      <div
+        className={classNames('gm-pagination-page-item', {
+          disabled: index === 1
+        })}
+        onClick={() => handlePage(index - 1)}
+      >
+        <SVGLeftSmall />
+      </div>
+
+      {begin >= 2 && (
+        <div className='gm-pagination-page-item' onClick={() => handlePage(1)}>
+          1
+        </div>
+      )}
+      {begin >= 3 && <span className='gm-pagination-page-text'>···</span>}
+
+      {pages.map((page, i) => (
+        <div
+          key={i}
+          className={classNames('gm-pagination-page-item', {
+            active: index === page
+          })}
+          onClick={() => handlePage(page)}
+        >
+          {page}
+        </div>
+      ))}
+
+      {end <= all - 2 && <span className='gm-pagination-page-text'>···</span>}
+      {end <= all - 1 && (
+        <div
+          className='gm-pagination-page-item'
+          onClick={() => handlePage(all)}
+        >
+          {all}
+        </div>
+      )}
+
+      <div
+        className={classNames('gm-pagination-page-item', {
+          disabled: index === all || all === 0
+        })}
+        onClick={() => handlePage(index + 1)}
+      >
+        <SVGRightSmall />
+      </div>
+    </Flex>
+  )
+}
+
+Page.propTypes = {
+  data: PropTypes.object,
+  /* 提供 {index, limit} */
+  onChange: PropTypes.func.isRequired
+}
+
+export default Page