fmui-base 2.2.11 → 2.2.12

package/README.md

@@ -3,6 +3,7 @@
 ---npm publish
 
 ## 更新日志 
+- 2.2.12：表单UI修改
 - 2.2.11：关联字段编辑方式为编辑时互相冲突问题解决
 - 2.2.10：表单组件样式
 - 2.2.9：统一待办列表样式

package/lib/form/form.js

@@ -3166,15 +3166,17 @@ var PageHome = function (_React$Component) {
             _react2.default.createElement(
               'div',
               { className: 't-FBH', id: t.state.prefixName + "_" + t.state.itemParam.key },
-              _react2.default.createElement(_TextField2.default, {
+              _react2.default.createElement(_TextareaField2.default, {
                 className: 't-W100',
                 required: t.state.itemParam.required,
                 readOnly: t.state.itemParam.readOnly,
                 label: t.state.itemParam.title,
+                minRows: 1,
+                maxRows: 1,
                 placeholder: t.state.itemParam.readOnly ? '' : t.state.itemParam.placeholder,
                 value: t.state.itemParam.value,
                 onChange: function onChange(value) {
-                  t.handleTextChange(t.state.itemParam, value);
+                  t.handleTextAreaChange(t.state.itemParam, value);
                 }
                 // onFocus={(value) => { t.handleTextFocus(t.state.itemParam, value); }}
                 // onBlur={(value) => { t.handleTextBlur(t.state.itemParam, value); }}

package/lib/react_grid/react_grid.js

@@ -621,7 +621,7 @@ var MyGrid = function (_React$Component) {
       var componentContent = _react2.default.createElement(
         'div',
         null,
-        _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+        _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
       );
       var componentHead = '';
       if (item.portletCode === 'banner') {
@@ -773,7 +773,7 @@ var MyGrid = function (_React$Component) {
               ) : _react2.default.createElement(
                 'div',
                 null,
-                _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+                _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
               )
             ),
             _react2.default.createElement(
@@ -823,7 +823,7 @@ var MyGrid = function (_React$Component) {
               ) : _react2.default.createElement(
                 'div',
                 null,
-                _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+                _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
               )
             )
           )
@@ -855,7 +855,7 @@ var MyGrid = function (_React$Component) {
             commonList = _react2.default.createElement(
               'div',
               null,
-              _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+              _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
             );
           }
         }
@@ -886,7 +886,7 @@ var MyGrid = function (_React$Component) {
             colectionList = _react2.default.createElement(
               'div',
               null,
-              _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+              _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
             );
           }
         }
@@ -1118,7 +1118,7 @@ var MyGrid = function (_React$Component) {
                   { className: 'info-more-btn', onClick: t.jumpPage.bind(this, "/channelDetail/" + item.channelId + '/' + item.columnId + '/' + item.columnName) },
                   '\u67E5\u770B\u66F4\u591A'
                 )
-              ) : _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10 t-MT16', src: '../../../fmui/images/home/nodata.png' })
+              ) : _react2.default.createElement('img', { className: 't-PL10 t-PR10 t-MT16', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
             );
           });
         }
@@ -1184,7 +1184,7 @@ var MyGrid = function (_React$Component) {
             gryjContent = _react2.default.createElement(
               'div',
               null,
-              _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+              _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
             );
           }
         }
@@ -1239,7 +1239,7 @@ var MyGrid = function (_React$Component) {
             ggyjContent = _react2.default.createElement(
               'div',
               null,
-              _react2.default.createElement('img', { className: 't-W100 t-PL10 t-PR10', src: '../../../fmui/images/home/nodata.png' })
+              _react2.default.createElement('img', { className: 't-PL10 t-PR10', style: { height: '88px', margin: 'auto', display: 'block' }, src: '../../../fmui/images/home/nodata.png' })
             );
           }
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fmui-base",
-  "version": "2.2.11",
+  "version": "2.2.12",
   "title": "fmui-base",
   "description": "fmui移动端组件",
   "main": "lib/index.js",

package/lib/ScrollList/BottomTip.jsx

@@ -1,25 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-class BottomTip extends React.Component {
-  static displayName = 'BottomTip';
-  static defaultProps = {
-    text: '',
-    icon: null,
-  };
-  static propTypes = {
-    icon: PropTypes.element,
-    text: PropTypes.string,
-  };
-
-  render() {
-    return (
-      <div className="bottom-tip">
-        {this.props.icon}
-        <div className="text">{this.props.text}</div>
-      </div>);
-  }
-}
-
-export default BottomTip;
-

package/lib/ScrollList/EmptyContent.jsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-const EmptyContent = props => (
-  <div key="empty-content" className="empty-content">
-    {props.image ? <div className="icon" style={{ backgroundImage: `url(${props.image})` }} /> : null}
-    {props.text ? <div className="text">{props.text}</div> : null}
-  </div>
-);
-EmptyContent.defaultProps = {
-  image: undefined,
-  text: undefined,
-};
-EmptyContent.propTypes = {
-  image: PropTypes.string,
-  text: PropTypes.string,
-};
-
-export default EmptyContent;

package/lib/ScrollList/Item.jsx

@@ -1,132 +0,0 @@
-import React from 'react';
-import classnames from 'classnames';
-import PropTypes from 'prop-types';
-import Badge from 'saltui/lib/Badge';
-
-class Item extends React.Component {
-  static propTypes = {
-    prefixCls: PropTypes.string,
-    className: PropTypes.string,
-    img: PropTypes.string,
-    avatar: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-    title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-    description: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-    badge: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.number, PropTypes.bool]),
-    badgePosition: PropTypes.string,
-    desMaxLine: PropTypes.number,
-    extra: PropTypes.any,
-    borderType: PropTypes.string,
-    onClick: PropTypes.func,
-  };
-  static defaultProps = {
-    prefixCls: 't-scroll-list-item',
-    desMaxLine: 2,
-    className: undefined,
-    img: undefined,
-    avatar: undefined,
-    title: undefined,
-    description: undefined,
-    badge: undefined,
-    badgePosition: 'followTitle', // indicator/followTitle/titleRight
-    extra: undefined,
-    borderType: '',
-    onClick: () => {},
-  };
-
-  renderImg() {
-    const { img, prefixCls } = this.props;
-    if (typeof img === 'string') {
-      return (<img alt="" className={`${prefixCls}-img`} src={img} />);
-    }
-    return img;
-  }
-
-  renderAvatar() {
-    const { avatar, prefixCls } = this.props;
-    if (typeof avatar === 'string') {
-      return (<img alt="" className={`${prefixCls}-avatar`} src={avatar} />);
-    }
-    return avatar;
-  }
-
-  renderTitle() {
-    const { title, prefixCls, badgePosition } = this.props;
-    if (!title) return null;
-    return (
-      <div className={classnames(`${prefixCls}-title`, {
-        [badgePosition]: true,
-      })}
-      >{title}{badgePosition === 'indicator' ? null : this.renderBadge()}
-      </div>);
-  }
-
-  renderBadge() {
-    const { badge, prefixCls } = this.props;
-    const className = `${prefixCls}-badge`;
-    if (typeof badge === 'string') {
-      return (<Badge text={badge} className={className} />);
-    } else if (typeof badge === 'number') {
-      return (<Badge count={badge} className={className} />);
-    } else if (typeof badge === 'boolean') {
-      return (<Badge dot className={className} />);
-    }
-    return badge;
-  }
-
-  renderDes() {
-    const { description, prefixCls, desMaxLine } = this.props;
-    if (description) {
-      return (
-        <div className={`${prefixCls}-des`}>
-          <div
-            className={`${prefixCls}-des-inner`}
-            style={{
-              WebkitLineClamp: desMaxLine,
-            }}
-          >
-            {description}
-          </div>
-        </div>
-      );
-    }
-    return null;
-  }
-
-  renderExtra() {
-    const { extra, prefixCls } = this.props;
-    if (extra) {
-      return (
-        <div className={`${prefixCls}-extra`}>
-          <div className={`${prefixCls}-extra-inner`}>{extra}</div>
-        </div>
-      );
-    }
-    return null;
-  }
-  render() {
-    const {
-      prefixCls, className, borderType, badgePosition, onClick,
-    } = this.props;
-    return (
-      <div
-        className={classnames({
-          [prefixCls]: true,
-          [className]: !!className,
-          [borderType]: !!borderType,
-        })}
-        onClick={() => { onClick(this.props); }}
-      >
-        {this.renderImg()}
-        {this.renderAvatar()}
-        <div className={`${prefixCls}-content`}>
-          {this.renderTitle()}
-          {this.renderDes()}
-        </div>
-        {badgePosition === 'indicator' ? this.renderBadge() : null}
-        {this.renderExtra()}
-      </div>
-    );
-  }
-}
-
-export default Item;

package/lib/ScrollList/ScrollList.jsx

@@ -1,412 +0,0 @@
-/**
- * ScrollList Component for SaltUI
- * @author xiaohe.wp
- *
- * Copyright 2018-2019, SaltUI Team.
- * All rights reserved.
- */
-import React from 'react';
-import { polyfill } from 'react-lifecycles-compat';
-import PropTypes from 'prop-types';
-import ReactDOM from 'react-dom';
-import NattyFetch from 'natty-fetch';
-import isEmpty from 'lodash/isEmpty';
-import cloneDeep from 'lodash/cloneDeep';
-import assign from 'lodash/assign';
-import classnames from 'classnames';
-import Context from 'saltui/lib/Context';
-import ScrollView from 'saltui/lib/ScrollView';
-import BottomTip from './BottomTip';
-import EmptyContent from './EmptyContent';
-import Item from './Item';
-import TagList from './TagList';
-
-function odd(i) {
-  return !!((i + 1) % 2);
-}
-
-class ScrollList extends React.Component {
-  static displayName = 'ScrollList';
-
-  static propTypes = {
-    prefixCls: PropTypes.string,
-    className: PropTypes.string,
-    listBorderType: PropTypes.string,
-    children: PropTypes.any,
-    scrollLoad: PropTypes.bool,
-    scrollRefresh: PropTypes.bool,
-
-    // 数据是否已就位标识符
-    dataGetted: PropTypes.bool,
-    data: PropTypes.array,
-    // 下拉配置
-    refreshing: PropTypes.bool,
-    pullLoadTip: PropTypes.string,
-    loadDataTip: PropTypes.string,
-    onRefresh: PropTypes.func,
-    // 触底加载配置
-    loading: PropTypes.bool,
-    loadingTip: PropTypes.string,
-    onLoad: PropTypes.func,
-    // 无更多数据提示文案
-    noMore: PropTypes.bool,
-    noMoreDataTip: PropTypes.string,
-    // 加载错误文案
-    hasError: PropTypes.bool,
-    errorTip: PropTypes.string,
-    // 无数据提示文案
-    noDataTip: PropTypes.string,
-    noDataImage: PropTypes.string,
-    //
-    url: PropTypes.string,
-    pageSize: PropTypes.number,
-    beforeFetch: PropTypes.func,
-    processData: PropTypes.func,
-    currentPageKey: PropTypes.string,
-    dataType: PropTypes.oneOf(['json', 'jsonp']),
-    fetchOption: PropTypes.object,
-    fetchDataOnOpen: PropTypes.bool,
-  };
-
-  static defaultProps = {
-    scrollLoad: true, // 是否支持滚动,来自设计器配置
-    scrollRefresh: true,
-    dataGetted: false,
-    data: [],
-    refreshing: false,
-    prefixCls: 't-scroll-list',
-    pullLoadTip: '下拉显示更多',
-    loadDataTip: '释放加载数据',
-    onRefresh: null,
-    loading: false, // 触底加载
-    loadingTip: '加载中...',
-    onLoad: null,
-    beforeFetch: data => data,
-    processData: data => data,
-    currentPageKey: 'currentPage',
-    noMore: false, // 没有更多内容提示
-    noMoreDataTip: '没有更多了',
-    hasError: false,
-    errorTip: '获取数据失败',
-    noDataTip: '暂无数据',
-    noDataImage: 'https://img.alicdn.com/tps/TB1K6mHNpXXXXXiXpXXXXXXXXXX-1000-1000.svg',
-    fetchDataOnOpen: true,
-    className: undefined,
-    listBorderType: 'scroll-list-no-border', // scroll-list-no-border, scroll-list-cut-border, scroll-list-full-border
-    children: undefined,
-    url: undefined,
-    pageSize: undefined,
-    dataType: undefined,
-    fetchOption: undefined,
-  };
-
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      dataGetted: props.dataGetted,
-      data: props.data,
-      hasError: props.hasError,
-      refreshing: props.refreshing,
-      loading: props.loading,
-      noMore: props.noMore,
-      currentPage: 1,
-      fetchData: props.fetchDataOnOpen,
-      prevProps: {
-        dataGetted: props.dataGetted,
-        hasError: props.hasError,
-        refreshing: props.refreshing,
-        loading: props.loading,
-        noMore: props.noMore,
-        data: props.data,
-      },
-    };
-  }
-
-  static getDerivedStateFromProps(props, { prevProps }) {
-    if (!props.url) {
-      const {
-        dataGetted, hasError, refreshing, loading, noMore, data,
-      } = props;
-      const {
-        dataGetted: prevDataGetted,
-        hasError: prevHasError,
-        refreshing: prevRefreshing,
-        loading: prevLoading,
-        noMore: prevNoMore,
-        data: prevData,
-      } = prevProps;
-      const changes = {};
-      if (dataGetted !== prevDataGetted) {
-        changes.dataGetted = dataGetted;
-      }
-      if (hasError !== prevHasError) {
-        changes.hasError = hasError;
-      }
-      if (refreshing !== prevRefreshing) {
-        changes.refreshing = refreshing;
-      }
-      if (loading !== prevLoading) {
-        changes.loading = loading;
-      }
-      if (noMore !== prevNoMore) {
-        changes.noMore = noMore;
-      }
-      if (data !== prevData) {
-        changes.data = data;
-      }
-      changes.prevProps = { ...changes };
-      return changes;
-    }
-    return null;
-  }
-
-  onFetch(refresh, from) {
-    if (this.state.loading) return;
-    this.setState(refresh ? { refreshing: true } : { loading: true });
-
-    this.fetchFrom = this.fetchFrom || from;
-    const pageOption = {
-      pageSize: this.props.pageSize,
-      [this.props.currentPageKey]: refresh ? 1 : this.state.currentPage,
-    };
-    const data = this.props.beforeFetch(cloneDeep(pageOption), this.fetchFrom) || pageOption;
-    this.fetchFrom = '';
-
-    const numKey = data[this.props.currentPageKey];
-    delete data[this.props.currentPageKey];
-    const queryData = JSON.stringify(data);
-    data[this.props.currentPageKey] = numKey;
-    const fetchOption = assign(
-      {
-        url: this.props.url,
-        data,
-        withCredentials: false,
-        header: {  
-          'Authorization': 'Bearer '+getLoginUserInfo().token,  
-          // 其他自定义请求头  
-        }, 
-      },
-      this.props.fetchOption,
-    );
-
-    if (this.props.dataType) {
-      fetchOption.jsonp = this.props.dataType === 'jsonp';
-    } else {
-      fetchOption.jsonp = /\.jsonp/.test(this.props.url);
-    }
-
-    NattyFetch.create(fetchOption)()
-      .then((con) => {
-        const content = cloneDeep(this.props.processData(con));
-        const { state } = this;
-        const nextState = {
-          refreshing: false,
-          loading: false,
-          dataGetted: true,
-          hasError: false,
-        };
-
-        nextState.noMore = content.data.length < this.props.pageSize;
-
-        if (refresh) {
-          nextState.data = content.data;
-          nextState.currentPage = 2;
-          this.scrollTop();
-        } else {
-          if (
-            (state.lastQueryData && queryData !== state.lastQueryData) ||
-            content.currentPage !== state.currentPage
-          ) {
-            nextState.currentPage = 1;
-            nextState.data = [];
-            this.scrollTop();
-          } else {
-            nextState.data = state.data;
-            nextState.currentPage = state.currentPage + 1;
-          }
-          nextState.data = nextState.data.concat(content.data);
-        }
-        nextState.lastQueryData = queryData;
-        nextState.showRefreshing = true;
-        this.setState(nextState, () => {
-          if (refresh) {
-            if (this.scrollViewRef) {
-              this.scrollViewRef.tryEmitScrollEvent();
-            }
-          }
-        });
-      })
-      .catch((error) => {
-        this.setState({
-          refreshing: false,
-          loading: false,
-          dataGetted: true,
-          noMore: false,
-          hasError: true,
-        });
-        console.error(error);
-      });
-  }
-
-  fetchData(from) {
-    this.fetchFrom = from;
-
-    if (this.state.fetchData) {
-      this.scrollTop();
-      if (this.props.url) {
-        this.setState({
-          showRefreshing: false,
-        });
-        this.onFetch(true, from);
-      } else if (this.props.onRefresh) {
-        this.props.onRefresh();
-      }
-    } else {
-      this.setState({
-        fetchData: true,
-        showRefreshing: !this.props.url,
-      });
-    }
-  }
-
-  scrollTop() {
-    /* eslint-disable react/no-find-dom-node */
-    /* TODO: need scrollView support getDomNode method */
-    this.scrollView = this.scrollView || ReactDOM.findDOMNode(this.scrollViewRef);
-    /* eslint-enable react/no-find-dom-node */
-    if (this.scrollView) {
-      this.scrollView.scrollTop = 0;
-    }
-  }
-
-  refreshOptions() {
-    const onRefresh = this.props.url ? this.onFetch.bind(this, true, 'top') : this.props.onRefresh;
-    return {
-      refreshControl: this.props.scrollRefresh,
-      refreshControlOptions: {
-        showRefreshing: this.state.showRefreshing,
-        refreshing: this.state.refreshing,
-        beforePullLoadText: this.props.pullLoadTip,
-        afterPullLoadText: this.props.loadDataTip,
-        refreshingText: this.props.loadingTip,
-        onRefresh,
-      },
-    };
-  }
-
-  infiniteScrollOptions() {
-    const onLoad = this.props.url ? this.onFetch.bind(this, false, 'bottom') : this.props.onLoad;
-    const {
-      fetchData, noMore, hasError, refreshing,
-    } = this.state;
-    return {
-      infiniteScroll: !refreshing && fetchData && !noMore && !hasError && this.props.scrollLoad,
-      infiniteScrollOptions: {
-        loading: this.state.loading,
-        loadingText: this.props.loadingTip,
-        onLoad,
-      },
-    };
-  }
-
-  isEmpty() {
-    return this.state.dataGetted && isEmpty(this.state.data);
-  }
-
-  renderPrevSiblings() {
-    const { children } = this.props;
-    if (!Array.isArray(children)) {
-      return null;
-    }
-    const prevs = children.slice(0, children.length - 1);
-    const prevSiblings = [];
-    prevs.forEach((element, i) => {
-      if (React.isValidElement(element)) {
-        prevSiblings.push(React.cloneElement(element, {
-          /* eslint-disable react/no-array-index-key */
-          key: `prev-sibling-${i}`,
-          /* eslint-enable react/no-array-index-key */
-          index: i,
-        }));
-      }
-    });
-    return prevSiblings;
-  }
-
-  renderList() {
-    const { data } = this.state;
-    const { children } = this.props;
-    const len = data.length;
-    if (!children) {
-      return null;
-    }
-    const lastChild = !Array.isArray(children) ? children : children[children.length - 1];
-    const isLastChildFunc = typeof lastChild === 'function';
-    if (!isLastChildFunc) {
-      return data.map((item, i) =>
-        React.cloneElement(lastChild, {
-          /* eslint-disable react/no-array-index-key */
-          key: `child-${i}`,
-          /* selint-enable react/no-array-index-key */
-          index: i,
-          first: i === 0,
-          last: i === len,
-          odd: odd(i),
-          data: item,
-          ...item,
-        }));
-    }
-    return data.map((item, i) => lastChild(item, i));
-  }
-
-  renderBottomTip() {
-    const noMore = this.state.dataGetted && this.state.noMore;
-    const hasError = this.state.dataGetted && this.state.hasError;
-
-    if (hasError) {
-      return <BottomTip key="bottom-tip" text={this.props.errorTip} />;
-    }
-
-    if (noMore) {
-      return <BottomTip key="bottom-tip" text={this.props.noMoreDataTip} />;
-    }
-
-    return null;
-  }
-
-  render() {
-    if (this.isEmpty()) {
-      return (
-        <div className={classnames(Context.prefixClass('scroll-list'), this.props.className)}>
-          <EmptyContent text={this.props.noDataTip} image={this.props.noDataImage} />
-        </div>
-      );
-    }
-
-    return (
-      <ScrollView
-        ref={(ref) => {
-          this.scrollViewRef = ref;
-        }}
-        className={classnames(this.props.prefixCls, {
-          [this.props.className]: !!this.props.className,
-          [this.props.listBorderType]: !!this.props.listBorderType,
-        })}
-        {...this.refreshOptions()}
-        {...this.infiniteScrollOptions()}
-      >
-        {this.renderPrevSiblings()}
-        {this.renderList()}
-        {this.renderBottomTip()}
-      </ScrollView>
-    );
-  }
-}
-
-ScrollList.Item = Item;
-ScrollList.TagList = TagList;
-
-polyfill(ScrollList);
-
-export default ScrollList;