diff --git a/build/Table.css b/build/Table.css index e8f0bd3..34b666f 100644 --- a/build/Table.css +++ b/build/Table.css @@ -443,6 +443,8 @@ */ -ms-user-select: none; user-select: none; } + .u-table-thead th .required { + color: #F22C1D; } .u-table-thead th .bee-table-column-sorter { position: relative; margin-left: 4px; @@ -604,6 +606,9 @@ color: #0073E1; } .u-table .u-table-link-underline:hover { text-decoration: underline; } + .u-table .u-table-currency { + display: inline-block; + text-align: right; } .u-table:focus { outline: none; diff --git a/build/Table.js b/build/Table.js index 8493b7d..e46584a 100644 --- a/build/Table.js +++ b/build/Table.js @@ -670,7 +670,9 @@ var Table = function (_Component) { fixed: column.fixed, width: width, dataindex: column.dataIndex, - textAlign: column.textAlign + textAlign: column.textAlign, + titleAlign: column.titleAlign, // 标题水平对齐方式 + required: column.required // 标题是否展示必填标志 }; if (column.onHeadCellClick) { cell.onClick = column.onHeadCellClick; diff --git a/build/TableCell.js b/build/TableCell.js index c3a2608..71d4b0a 100644 --- a/build/TableCell.js +++ b/build/TableCell.js @@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", { value: true }); +var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; + var _react = require('react'); var _react2 = _interopRequireDefault(_react); @@ -16,6 +18,14 @@ var _objectPath = require('object-path'); var _objectPath2 = _interopRequireDefault(_objectPath); +var _i18n = require('./lib/i18n'); + +var _i18n2 = _interopRequireDefault(_i18n); + +var _tool = require('bee-locale/build/tool'); + +var _utils = require('./lib/utils'); + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; } @@ -44,9 +54,8 @@ var TableCell = function (_Component) { var _this = _possibleConstructorReturn(this, _Component.call(this, props)); - _this.renderLinkType = function (data, record) { - var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; - var index = arguments[3]; + _this.renderLinkType = function (data, record, index) { + var config = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {}; var url = config.url, urlIndex = config.urlIndex, linkType = config.linkType, @@ -93,6 +102,57 @@ var TableCell = function (_Component) { return data; }; + _this.renderBoolType = function (data) { + var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + var locale = (0, _tool.getComponentLocale)(_this.props, _this.context, 'Table', function () { + return _i18n2["default"]; + }); + var boolConfig = _extends({ trueText: locale['bool_true'], falseText: locale['bool_false'] }, config); + if (typeof data === 'string') { + if (data === 'false' || data === '0') { + return boolConfig.falseText; + } + } else if (!data) { + return boolConfig.falseText; + } + return boolConfig.trueText; + }; + + _this.renderNumber = function (data) { + var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + var width = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 200; + + console.log(config); + var number = (0, _utils.formatMoney)(data, config.precision, config.thousand); + if (config.makeUp === false && number !== '0') { + number = number.replace(/0*$/, '').replace(/\.$/, ''); + } + var numberWidth = parseInt(width) - 16; // 减去默认的左右padding共计16px + var res = _react2["default"].createElement( + 'span', + { className: 'u-table-currency-number' }, + number + ); + var pre = config.preSymbol ? _react2["default"].createElement( + 'span', + { className: 'u-table-currency-pre' }, + config.preSymbol + ) : null; + var next = config.nextSymbol ? _react2["default"].createElement( + 'span', + { className: 'u-table-currency-next' }, + config.nextSymbol + ) : null; + return _react2["default"].createElement( + 'span', + { className: 'u-table-currency', style: { width: numberWidth } }, + pre, + res, + next + ); + }; + _this.isInvalidRenderCellText = _this.isInvalidRenderCellText.bind(_this); _this.handleClick = _this.handleClick.bind(_this); return _this; @@ -115,6 +175,12 @@ var TableCell = function (_Component) { // 渲染链接类型 + // 渲染布尔类型 + + + // 渲染整数/货币类型 + + TableCell.prototype.render = function render() { var _props2 = this.props, record = _props2.record, @@ -132,7 +198,9 @@ var TableCell = function (_Component) { var dataIndex = column.dataIndex, render = column.render, fieldType = column.fieldType, - linkConfig = column.linkConfig; + linkConfig = column.linkConfig, + fontColor = column.fontColor, + bgColor = column.bgColor; var _column$className = column.className, className = _column$className === undefined ? '' : _column$className; @@ -158,7 +226,36 @@ var TableCell = function (_Component) { switch (column.fieldType) { case 'link': { - text = this.renderLinkType(text, record, column.linkConfig, index); + text = this.renderLinkType(text, record, index, column.linkConfig); + break; + } + case 'bool': + { + text = this.renderBoolType(text, column.boolConfig); + break; + } + case 'currency': + { + var config = { + precision: 2, // 精度值,需要大于0 + thousand: true, // 是否显示千分符号 + makeUp: true, // 末位是否补零 + preSymbol: '', // 前置符号 + nextSymbol: '' // 后置符号 + }; + text = this.renderNumber(text, _extends({}, config, column.currencyConfig), column.width); + break; + } + case 'number': + { + var _config = { + precision: 2, // 精度值,需要大于0 + thousand: true, // 是否显示千分符号 + makeUp: false, // 末位是否补零 + preSymbol: '', // 前置符号 + nextSymbol: '' // 后置符号 + }; + text = this.renderNumber(text, _extends({}, _config, column.numberConfig), column.width); break; } default: @@ -188,7 +285,9 @@ var TableCell = function (_Component) { if (column.fixed && !fixed) { className = className + (' ' + clsPrefix + '-fixed-columns-in-body'); } - if (column.textAlign) { + if (column.contentAlign) { + className = className + (' text-' + column.contentAlign); + } else if (column.textAlign) { className = className + (' text-' + column.textAlign); } if (typeof text == 'string' && bodyDisplayInRow) { @@ -204,8 +303,8 @@ var TableCell = function (_Component) { rowSpan: rowSpan, className: className, onClick: this.handleClick, - title: title - + title: title, + style: { color: fontColor, backgroundColor: bgColor } }, indentText, expandIcon, diff --git a/build/TableHeader.js b/build/TableHeader.js index b34461b..5e265ea 100644 --- a/build/TableHeader.js +++ b/build/TableHeader.js @@ -835,10 +835,14 @@ var TableHeader = function (_Component) { canDotDrag = "th-can-not-drag"; } var thClassName = "" + da.className ? "" + da.className : ''; - if (da.textAlign) { + if (da.titleAlign) { + thClassName += " text-" + da.titleAlign + " "; + } else if (da.textAlign) { thClassName += " text-" + da.textAlign + " "; } + delete da.textAlign; + delete da.titleAlign; var keyTemp = {}; //避免key为undefined // if(da.dataindex && da.key ===undefined ){ @@ -867,6 +871,11 @@ var TableHeader = function (_Component) { "th", _extends({}, da, keyTemp, { className: thClassName, "data-th-fixed": da.fixed, "data-line-key": da.key, "data-line-index": columIndex, "data-th-width": da.width, "data-type": "draggable" }), + da.required ? _react2["default"].createElement( + "span", + { className: "required" }, + "*" + ) : '', da.children, dragborder && columIndex != _rowLeng ? _react2["default"].createElement( "div", diff --git a/build/lib/i18n.js b/build/lib/i18n.js index 824cf0f..2de7502 100644 --- a/build/lib/i18n.js +++ b/build/lib/i18n.js @@ -16,6 +16,8 @@ module.exports = { 'be_equal_to': '等于', 'not_equal_to': '不等于', "no_data": '暂无数据', + "bool_true": "是", + "bool_false": "否", 'en-us': { 'resetSettings': 'reset settings', 'include': 'include', @@ -30,7 +32,9 @@ module.exports = { 'less_than_equal_to': 'less than equal to', 'be_equal_to': 'be equal to', 'not_equal_to': 'not equal to', - "no_data": 'no data' + "no_data": 'no data', + "bool_true": "true", + "bool_false": "false" }, 'zh-tw': { 'resetSettings': '還原設置', @@ -46,6 +50,8 @@ module.exports = { 'less_than_equal to': '小於等於', 'be_equal_to': '等於', 'not_equal_to': '不等於', - "no_data": '暫無數據' + "no_data": '暫無數據', + "bool_true": "是", + "bool_false": "否" } }; \ No newline at end of file diff --git a/build/lib/utils.js b/build/lib/utils.js index ae14f34..6696236 100644 --- a/build/lib/utils.js +++ b/build/lib/utils.js @@ -19,6 +19,7 @@ exports.getMaxColChildrenLength = getMaxColChildrenLength; exports.getColChildrenLength = getColChildrenLength; exports.DicimalFormater = DicimalFormater; exports.checkDicimalInvalid = checkDicimalInvalid; +exports.formatMoney = formatMoney; var _warning = require('warning'); @@ -309,6 +310,22 @@ function checkDicimalInvalid(value, precision) { return result; }; +/** + * 将数值转化为货币类型 + * @param {*} number 数值 + * @param {*} places 精度 + * @param {*} thousand 是否展示千分位 + */ +function formatMoney(number, places, thousand) { + number = number || 0; + places = !isNaN(places = Math.abs(places)) ? places : 2; + var thousandSymbol = thousand ? "," : ''; + var negative = number < 0 ? "-" : ""; + var i = (0, _parseInt2["default"])(number = Math.abs(+number || 0).toFixed(places), 10) + ""; + var j = (j = i.length) > 3 ? j % 3 : 0; + return negative + (j ? i.substr(0, j) + thousandSymbol : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousandSymbol) + (places ? '.' + Math.abs(number - i).toFixed(places).slice(2) : ""); +} + var Event = exports.Event = { addHandler: addHandler, removeHandler: removeHandler,