@beisen/ethos/lib/empty-component/index.js

beisencloud pc react components

'use strict';

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

require('./index.scss');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var defaultTranslation = {
	emptyBgText: '这里什么都没有...'
};

var EmptyComponent = function (_Component) {
	(0, _inherits3.default)(EmptyComponent, _Component);

	function EmptyComponent(props) {
		(0, _classCallCheck3.default)(this, EmptyComponent);

		var _this = (0, _possibleConstructorReturn3.default)(this, (EmptyComponent.__proto__ || (0, _getPrototypeOf2.default)(EmptyComponent)).call(this, props));

		_this.translation = (0, _extends3.default)({}, defaultTranslation, props.translation);
		_this.state = {
			ClassName: null,
			ContainerHeight: props.ContainerHeight ? props.ContainerHeight : 150, //外界容器高度
			ContainerWidth: props.ContainerWidth ? props.ContainerWidth : undefined //外界容器宽度
		};
		return _this;
	}
	//取随机数
	// getRandomNum(Min, Max) {
	//      let Range = Max - Min;
	//      let Rand = Math.random();
	//      let num = Min + Math.floor(Rand * Range); 
	//      return num;
	// }

	//拼接需要引用的Class


	(0, _createClass3.default)(EmptyComponent, [{
		key: 'jointClassName',
		value: function jointClassName() {
			//const num = this.getRandomNum(1,5);
			//新需求 都用第二组图片 如果再用随机数在解开注释
			var num = 2;
			var _state = this.state,
			    ContainerHeight = _state.ContainerHeight,
			    ContainerWidth = _state.ContainerWidth;

			if (ContainerHeight > 600) return 'empty_img' + num + '_lg';else if (ContainerHeight <= 600 && ContainerHeight >= 300) return 'empty_img' + num + '_md';else if (ContainerHeight <= 300 && ContainerHeight >= 150) return ContainerWidth >= 175 ? 'empty_img' + num + '_sm' : 'empty_img' + num + '_sm_t';else if (ContainerHeight < 150 && ContainerHeight != 0) return 'empty_img' + num + '_xs';
		}
	}, {
		key: 'render',
		value: function render() {
			var style = {
				"height": this.state.ContainerHeight
			};
			return _react2.default.createElement(
				'div',
				{ className: 'empty-img-container' },
				_react2.default.createElement('div', { className: "empty-con " + this.jointClassName(), style: style, 'data-bg-text': this.translation.emptyBgText })
			);
		}
	}]);
	return EmptyComponent;
}(_react.Component);

module.exports = EmptyComponent;