diff --git a/public/js/admin_bundle.js b/public/js/admin_bundle.js index 2761d5e..0bf8249 100644 --- a/public/js/admin_bundle.js +++ b/public/js/admin_bundle.js @@ -87810,7 +87810,7 @@ var ListItem = function ListItem(_ref) { return _react2.default.createElement( _semanticUiReact.Table.Row, - null, + { style: { color: (0, _tools.padding)(data.timestamp, 13, 1, '0') < Date.now() - 60000 ? '#f00' : 'inherit' } }, _react2.default.createElement( _semanticUiReact.Table.Cell, null, @@ -93764,6 +93764,8 @@ var _semanticUiReact = __webpack_require__(8); var _actions = __webpack_require__(20); +var _tools = __webpack_require__(147); + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -93787,7 +93789,10 @@ var LocStatusWloc = function (_React$Component) { } return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = LocStatusWloc.__proto__ || Object.getPrototypeOf(LocStatusWloc)).call.apply(_ref, [this].concat(args))), _this), _this.state = { - loc: [] + loc: [], + ui: { + colLoading: false + } }, _this.tick = null, _this.runTick = function () { _this.getStatus(); }, _this.getLocList = function () { @@ -93804,6 +93809,10 @@ var LocStatusWloc = function (_React$Component) { _this.setState({ loc: json.data.record || [] }, function () { + _this.setState({ + ui: { + colLoading: true + } }, function () {}); _this.getStatus(); _this.tick = setInterval(_this.runTick, 5000); }); @@ -93813,6 +93822,7 @@ var LocStatusWloc = function (_React$Component) { toggleLoading = _this$props2.toggleLoading, showDialog = _this$props2.showDialog; + fetch('/api/wristband/getstatus', (0, _actions.getRequest)()).then(function (response) { return response.json(); }).then(function (json) { @@ -93833,7 +93843,10 @@ var LocStatusWloc = function (_React$Component) { } _this.setState({ - loc: locs + loc: locs, + ui: { + colLoading: false + } }); }); }, _temp), _possibleConstructorReturn(_this, _ret); @@ -93852,6 +93865,7 @@ var LocStatusWloc = function (_React$Component) { }, { key: 'render', value: function render() { + var _this2 = this; return _react2.default.createElement( _semanticUiReact.Container, @@ -93866,16 +93880,17 @@ var LocStatusWloc = function (_React$Component) { _react2.default.createElement(_semanticUiReact.Header, { as: 'h5', content: t.name }), _react2.default.createElement( _semanticUiReact.Segment, - { style: { height: '400px', overflow: 'auto' } }, + { style: { height: '400px', overflow: 'auto' }, loading: _this2.state.ui.colLoading }, _react2.default.createElement( _semanticUiReact.List, null, t.list ? t.list.map(function (tt, idx) { + var isExpire = (0, _tools.padding)(tt.timestamp, 13, 1, '0') < Date.now() - 60000 ? true : false; return _react2.default.createElement( _semanticUiReact.List.Item, { key: idx }, - tt.name ? _react2.default.createElement(_semanticUiReact.Label, { basic: true, color: 'blue', size: 'tiny', content: tt.name }) : null, - _react2.default.createElement(_semanticUiReact.Label, { basic: true, color: 'teal', size: 'tiny', content: tt.mac }) + tt.name ? _react2.default.createElement(_semanticUiReact.Label, { basic: true, color: isExpire ? 'red' : 'blue', size: 'tiny', content: tt.name }) : null, + _react2.default.createElement(_semanticUiReact.Label, { basic: true, color: isExpire ? 'red' : 'teal', size: 'tiny', content: tt.mac }) ); }) : null ) diff --git a/src/components/AdminPage/Wristband/LocStatus/ListItem.js b/src/components/AdminPage/Wristband/LocStatus/ListItem.js index 65b8b00..5744dd9 100644 --- a/src/components/AdminPage/Wristband/LocStatus/ListItem.js +++ b/src/components/AdminPage/Wristband/LocStatus/ListItem.js @@ -1,11 +1,11 @@ import React from 'react'; import {Table} from 'semantic-ui-react'; -import {convertTime} from '../../../../tools'; +import {convertTime, padding} from '../../../../tools'; const ListItem = ({i18n, data}) => { return ( - + {data.wristband} {data.name} {data.locname} diff --git a/src/components/AdminPage/Wristband/LocStatusWloc/index.js b/src/components/AdminPage/Wristband/LocStatusWloc/index.js index afdd749..756e0af 100644 --- a/src/components/AdminPage/Wristband/LocStatusWloc/index.js +++ b/src/components/AdminPage/Wristband/LocStatusWloc/index.js @@ -1,10 +1,14 @@ import React from 'react'; import {Grid, Header, Container, Segment, List, Label} from 'semantic-ui-react'; import {getRequest} from '../../../../actions'; +import {padding} from '../../../../tools' class LocStatusWloc extends React.Component { state = { - loc: [] + loc: [], + ui: { + colLoading: false + } } tick = null @@ -30,6 +34,10 @@ class LocStatusWloc extends React.Component { this.setState({ loc: json.data.record || [] }, ()=>{ + this.setState({ + ui:{ + colLoading: true + }}, ()=>{}) this.getStatus(); this.tick = setInterval(this.runTick, 5000); }) @@ -38,6 +46,7 @@ class LocStatusWloc extends React.Component { getStatus = () => { let {toggleLoading, showDialog} = this.props; + fetch('/api/wristband/getstatus', getRequest()) .then(response=>response.json()) .then(json => { @@ -58,7 +67,10 @@ class LocStatusWloc extends React.Component { } this.setState({ - loc: locs + loc: locs, + ui:{ + colLoading: false + } }) }) } @@ -72,20 +84,21 @@ class LocStatusWloc extends React.Component { this.state.loc.map((t,idx) => (
- + { t.list ? - t.list.map((tt, idx) => ( - + t.list.map((tt, idx) => { + let isExpire = padding(tt.timestamp, 13, 1, '0') < (Date.now() - 60000) ? true : false; + return ( { tt.name ? ( - - )) + ) + }) : null }