tntd 1.4.17 → 2.0.0-beta

package/components/QueryListScene/Title.js

@@ -1,14 +0,0 @@
-/**
- * @file Title
- * @author zhangyou
- */
-import React from 'react';
-
-export default ({ title, children }) => (
-    <div className="tnt-querylistscene-title">
-        <span>{title}</span>
-        <span>
-            {children}
-        </span>
-    </div>
-);

package/components/QueryListScene/Toolbar.js

@@ -1,9 +0,0 @@
-import cn from 'classnames';
-
-export default ({ className, children, actions, qslProps, ...rest }) => {
-    return (
-        <div {...rest} className={cn('tnt-querylistscene-toolbar', { [className]: className })}>
-            {children}
-        </div>
-    );
-};

package/components/QueryListScene/createActions.js

@@ -1,70 +0,0 @@
-import EventEmitter from 'eventemitter3';
-import { get, set } from 'lodash';
-
-export default () => {
-    const eventEmitter = new EventEmitter();
-    const data = {
-        dataSource: [],
-        pagination: {},
-        formData: {},
-        submittedFormData: {}
-    };
-
-    return {
-        setData: (key, val) => {
-            set(data, key, val);
-        },
-
-        getFormData: name => get(data, `formData${name ? ('.' + name) : ''}`),
-        getSubmittedFormData: name => get(data, `submittedFormData${name ? ('.' + name) : ''}`),
-        getTableDataSource: () => get(data, 'dataSource'),
-        getPagination: () => get(data, 'pagination'),
-
-        setFormData: (formData, needSearch = true) => {
-            set('formData', formData);
-            eventEmitter.emit('setFormData', formData, needSearch);
-        },
-        resetFormData: (needSearch = false) => {
-            eventEmitter.emit('resetFormData', needSearch);
-        },
-        setTableDataSource: dataSource => {
-            set('dataSource', dataSource);
-            eventEmitter.emit('setTableDataSource', dataSource);
-        },
-        setPagination: pagination => {
-            set('pagination', pagination);
-            eventEmitter.emit('setPagination', pagination);
-        },
-
-        // 重置记忆数据，form、pagination
-        resetMemoryData: () => {
-            data.formData = {};
-            data.pagination = {};
-        },
-
-        search: (params = {}, showLoading = true) => {
-            return new Promise((resolve, reject) => {
-                eventEmitter.emit('search', params, {
-                    callback: resolve,
-                    showLoading
-                });
-            });
-        },
-
-        on: (eventName, callback) => {
-            eventEmitter.on(eventName, callback);
-        },
-
-        emit: (...args) => {
-            eventEmitter.emit(...args);
-        },
-
-        removeListener: (...args) => {
-            eventEmitter.removeListener(...args);
-        },
-
-        off: (...args) => {
-            eventEmitter.removeListener(...args);
-        }
-    };
-};

package/components/QueryListScene/index.js

@@ -1,23 +0,0 @@
-import QueryListScene from './QueryListScene';
-import Title from './Title';
-import Form from './QueryForm';
-import Toolbar from './Toolbar';
-import List from './List';
-import Actions from './createActions';
-import useActions from './useActions';
-import './index.less';
-
-export const QueryForm = Form;
-export const QueryList = List;
-export const createActions = Actions;
-
-QueryListScene.Title = Title;
-QueryListScene.QueryForm = Form;
-QueryListScene.Toolbar = Toolbar;
-QueryListScene.QueryList = List;
-QueryListScene.Field = Form.Field;
-
-QueryListScene.useActions = useActions;
-QueryListScene.createActions = createActions;
-
-export default QueryListScene;

package/components/QueryListScene/index.less

@@ -1,97 +0,0 @@
-.tnt-querylistscene {
-    position: relative;
-    &.large-size {
-        .tnt-querylistscene-title {
-            height: 48px;
-        }
-    }
-
-    &-title {
-        position: sticky;
-        top: 0;
-        height: 40px;
-        background: #FFFFFF;
-        line-height: 40px;
-        padding: 0 20px;
-        z-index: 1;
-    
-        & > span {
-            font-size: 14px;
-            color: #17233D;
-            letter-spacing: 0;
-        }
-    }
-
-    &-toolbar {
-        padding: 12px 16px 12px;
-        background: #fff;
-        box-shadow: 0 0 6px 0 rgba(0,0,0,0.06);
-        border-radius: 4px 4px 0 0;
-
-        & > *:not(:last-child) {
-            margin-right: 12px;
-        }
-    }
-
-    &-content {
-        background: #F1F2F5;
-        padding: 16px 20px;
-    }
-
-    &-list {
-        background: #fff;
-        box-shadow: 0 0 6px 0 rgba(0,0,0,0.06);
-        border-radius: 4px;
-        .hasToolbar & {
-            border-radius: 0 0 4px 4px;
-        }
-
-        .ant-table-pagination.ant-pagination {
-            position: relative;
-            width: 100%;
-            text-align: right;
-            margin-bottom: 0;
-            padding: 12px 16px;
-            background: #fff;
-            margin-top: 0;
-            border-radius: 0 0 4px 4px;
-            box-shadow: 0 -2px 4px rgba(0, 0, 0, .06);
-            z-index: 1;
-            // .ant-pagination-item {
-            //     height: 28px;
-            //     line-height: 28px;
-            //     &:not(.ant-pagination-item-active) {
-            //         border: none;
-            //     }
-            // }
-            .ant-pagination-total-text {
-                float: left;
-            }
-            .ant-pagination-options {
-                text-align: left;
-            }
-            .ant-pagination-prev,
-            .ant-pagination-next,
-            .ant-pagination-jump-prev,
-            .ant-pagination-jump-next {
-                height: 28px;
-                line-height: 28px;
-                .ant-pagination-item-link {
-                    border: none;
-                }
-            }
-        }
-
-        &.paginationSticky {
-            .ant-table-pagination.ant-pagination {
-                position: sticky;
-                bottom: 0;
-            }
-        }
-        &.hasScrollToBottom {
-            .ant-table-pagination.ant-pagination {
-                box-shadow: none;
-            }
-        }
-    }
-}

package/components/QueryListScene/useActions.js

@@ -1,8 +0,0 @@
-import { useRef } from 'react';
-import createActions from './createActions';
-
-export default function useActions() {
-    const actions = useRef(createActions());
-
-    return actions.current;
-};

package/components/Select/DropDownWrap.js

@@ -1,64 +0,0 @@
-import React, { PureComponent } from 'react';
-
-export default class DropDownWrap extends PureComponent {
-    constructor(props) {
-        super(props);
-        const { allHeight, startIndex, endIndex } = props;
-
-        this.state = {
-            allHeight,
-            startIndex,
-            endIndex
-        };
-    }
-
-    componentDidUpdate(prevProps) {
-        if (this.props.allHeight !== prevProps.allHeight) {
-            this.setState({ allHeight: this.props.allHeight });
-        }
-    }
-
-	getItemStyle = i => {
-	    const { itemHeight } = this.props;
-	    return {
-	        position: 'absolute',
-	        top: itemHeight * i,
-	        height: itemHeight,
-	        width: '100%'
-	    };
-	};
-
-	reactList = (allHeight, startIndex, endIndex) =>
-	    this.setState({ allHeight, startIndex, endIndex });
-
-	render() {
-	    const { menu } = this.props;
-	    const { startIndex, endIndex, allHeight } = this.state;
-
-	    // 截取 Select 下拉列表中需要显示的部分
-	    const cloneMenu = React.cloneElement(menu, {
-	        menuItems: menu.props.menuItems
-	            .slice(startIndex, endIndex)
-	            .map((item, i) => {
-	                const realIndex = (startIndex || 0) + Number(i);
-	                const style = this.getItemStyle(realIndex);
-
-	                // 未搜到数据提示高度使用默认高度
-	                if (item.key === 'NOT_FOUND') {
-	                    delete style.height;
-	                }
-	                return React.cloneElement(item, {
-	                    style: { ...item.props.style, ...style }
-	                });
-	            }),
-	        dropdownMenuStyle: {
-	            ...menu.props.dropdownMenuStyle,
-	            height: allHeight,
-	            maxHeight: allHeight,
-	            overflow: 'hidden'
-	        }
-	    });
-
-	    return cloneMenu;
-	}
-}

package/components/Select/README.md

@@ -1,68 +0,0 @@
-## 基于ant3实现高性能虚拟滚动列表
-
-## 安装
-```bash
-npm i tntd 
-```
-
-## 用法
-所有API同ant3 Select
-- 注：新增maxWidth属性，该属性只有在dropdownMatchSelectWidth=false的时候才起作用,由于dropdownMatchSelectWidth=false，下拉宽度需要系统计算，同时渲染多个此组件时，会有性能消耗，故新增此属性，在渲染之前计算好下拉宽的高度，已达到性能提升。这里也提供一个算文本的像素宽度的方法，仅供参考：
-
-```javascript
-// 获取单行文本的像素宽度
-getTextPixelWith = (text, fontStyle = "14px") => {
-    let canvas = document.createElement("canvas"); // 创建 canvas 画布
-    let context = canvas.getContext("2d"); // 获取 canvas 绘图上下文环境
-    context.font = fontStyle; // 设置字体样式，使用前设置好对应的 font 样式才能准确获取文字的像素长度
-    let dimension = context.measureText(text); // 测量文字
-    return dimension.width;
-}
-```
-
-### 代码演示
-```jsx
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { Select } from 'tntd';
-import 'antd/dist/antd.css';
-
-const Option = Select.Option;
-
-const children = [];
-for (let i = 0; i < 10000; i++) {
-	children.push(
-		<Option value={i} key={i}>
-			{`测试${i}`}
-		</Option>
-	);
-}
-
-const Demo = props => {
-    const handleChange = (e) => {
-        console.log(e);
-    }
-
-    return (
-        <Select
-            className="u-width"
-            showSearch
-            optionFilterProp="children"
-            allowClear
-            placeholder="请选择"
-            onChange={handleChange}
-            style={{ width: "200px" }}
-            dropdownMatchSelectWidth={false}
-            defaultValue={500}
-        >
-            {children}
-        </Select>
-    );
-}
-
-ReactDOM.render(
-    <Demo />,
-    document.getElementById('root')
-);
-
-```