@bigfishtv/cockpit
Version:
320 lines (253 loc) • 9.88 kB
JavaScript
;
exports.__esModule = true;
exports.default = undefined;
var _class, _temp;
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _deepEqual = require('deep-equal');
var _deepEqual2 = _interopRequireDefault(_deepEqual);
var _fixedDataTable = require('fixed-data-table');
var _Hints = require('../../constants/Hints');
var _Hints2 = _interopRequireDefault(_Hints);
var _promptUtils = require('../../utils/promptUtils');
var _tableUtils = require('../../utils/tableUtils');
var _xhrUtils = require('../../api/xhrUtils');
var _ModalHost = require('../modal/ModalHost');
var _RedirectEditModal = require('../modal/RedirectEditModal');
var _RedirectEditModal2 = _interopRequireDefault(_RedirectEditModal);
var _Table = require('../table/Table');
var _Table2 = _interopRequireDefault(_Table);
var _FixedDataTableDateCell = require('../table/cell/FixedDataTableDateCell');
var _FixedDataTableDateCell2 = _interopRequireDefault(_FixedDataTableDateCell);
var _FixedDataTableStatusCell = require('../table/cell/FixedDataTableStatusCell');
var _FixedDataTableStatusCell2 = _interopRequireDefault(_FixedDataTableStatusCell);
var _Spinner = require('../Spinner');
var _Spinner2 = _interopRequireDefault(_Spinner);
var _Hint = require('../Hint');
var _Hint2 = _interopRequireDefault(_Hint);
var _Button = require('../button/Button');
var _Button2 = _interopRequireDefault(_Button);
var _MainContent = require('../container/MainContent');
var _MainContent2 = _interopRequireDefault(_MainContent);
var _Panel = require('../container/panel/Panel');
var _Panel2 = _interopRequireDefault(_Panel);
var _Bulkhead = require('../page/Bulkhead');
var _Bulkhead2 = _interopRequireDefault(_Bulkhead);
var _SearchInput = require('../input/SearchInput');
var _SearchInput2 = _interopRequireDefault(_SearchInput);
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"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var FixedDataTableTitleCell = function FixedDataTableTitleCell(_ref) {
var data = _ref.data,
rowIndex = _ref.rowIndex,
columnKey = _ref.columnKey,
props = _objectWithoutProperties(_ref, ['data', 'rowIndex', 'columnKey']);
return _react2.default.createElement(
_fixedDataTable.Cell,
props,
_react2.default.createElement(
'a',
{ href: '/tank/redirects/edit/' + data[rowIndex]['id'] },
data[rowIndex][columnKey]
)
);
};
var fields = [{
key: 'enabled',
value: ' ',
width: 30,
Cell: _FixedDataTableStatusCell2.default
}, {
key: 'pattern',
width: 350,
Cell: FixedDataTableTitleCell
}, {
key: 'url',
width: 350
}, {
key: 'comment',
width: 350
}, {
key: 'priority',
width: 60,
sortType: 'numeric'
}, {
key: 'modified',
value: 'Last Modified',
width: 130,
Cell: _FixedDataTableDateCell2.default
}, {
key: 'created',
value: 'Date Created',
width: 130,
Cell: _FixedDataTableDateCell2.default
}];
/**
* Redirects index page template
*/
var RedirectsIndex = (_temp = _class = function (_Component) {
_inherits(RedirectsIndex, _Component);
function RedirectsIndex() {
_classCallCheck(this, RedirectsIndex);
var _this = _possibleConstructorReturn(this, _Component.call(this));
_this.handleQueryChange = function (value) {
var query = typeof value == 'string' ? value : value.target.value;
_this.setState({ query: query, selectedIds: [] });
};
_this.handleAdd = function () {
window.location.href = '/tank/redirects/add';
};
_this.handleEdit = function (oldValue) {
var isNew = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
// window.location.href = '/tank/redirects/edit/'+oldValue.id;
_ModalHost.modalHandler.add({
Component: _RedirectEditModal2.default,
props: {
defaultValue: oldValue,
onSave: _this.handleEditSave.bind(_this, oldValue),
onClose: function onClose() {}
}
});
};
_this.handleDelete = function () {
var _this$state = _this.state,
data = _this$state.data,
selectedIds = _this$state.selectedIds;
(0, _promptUtils.showDeletePrompt)({
queryUrl: _this.props.redirectsDeleteUrl,
selectedIds: selectedIds,
data: data.filter(function (item) {
return selectedIds.indexOf(item.id) >= 0;
}),
subject: 'redirect',
callback: function callback(deletedData) {
var deletedIds = deletedData.map(function (item) {
return item.id;
});
var data = _this.state.data.filter(function (item) {
return deletedIds.indexOf(item.id) < 0;
});
_this.setState({ data: data, selectedIds: [] });
}
});
};
_this.state = {
data: [],
selectedIds: [],
currentRedirectId: null,
query: '',
filters: [],
loading: true,
negativeHeight: 276
};
return _this;
}
RedirectsIndex.prototype.componentDidMount = function componentDidMount() {
var _this2 = this;
(0, _xhrUtils.get)({
quietSuccess: true,
url: this.props.redirectsGetUrl,
subject: 'redirects',
callback: function callback(data) {
return _this2.setState({ data: data, loading: false });
},
callbackError: function callbackError(data) {
return _this2.setState({ loading: false });
}
});
};
RedirectsIndex.prototype.getSubmitUrl = function getSubmitUrl(data) {
return data.id ? this.props.redirectsUpdateUrl + '/' + data.id + '.json' : this.props.redirectsAddUrl;
};
RedirectsIndex.prototype.handleEditSave = function handleEditSave(oldRowValue, newRowValue, isNew) {
var _this3 = this;
newRowValue = newRowValue.value;
if (!(0, _deepEqual2.default)(oldRowValue, newRowValue)) {
var tempId = newRowValue.id;
var data = isNew ? [].concat(this.state.data, [newRowValue]) : this.state.data.map(function (item) {
return item.id === newRowValue.id ? newRowValue : item;
});
this.setState({ data: data });
var url = this.getSubmitUrl({ id: isNew ? false : newRowValue.id });
(0, _xhrUtils.post)({
url: url,
data: newRowValue,
subject: 'redirect',
callback: function callback(redirect) {
var data = _this3.state.data.map(function (item) {
return item.id === (isNew ? tempId : oldRowValue.id) ? redirect : item;
});
_this3.setState({ data: data });
}
});
}
};
RedirectsIndex.prototype.render = function render() {
var _this4 = this;
var _state = this.state,
data = _state.data,
query = _state.query,
selectedIds = _state.selectedIds,
negativeHeight = _state.negativeHeight,
loading = _state.loading;
return _react2.default.createElement(
_MainContent2.default,
null,
_react2.default.createElement(_Bulkhead2.default, {
title: 'Redirects',
Toolbar: function Toolbar(props) {
return _react2.default.createElement(_Button2.default, { text: 'New Redirect', onClick: _this4.handleAdd, style: 'primary', size: 'large' });
}
}),
_react2.default.createElement(
'div',
{ className: 'finder' },
_react2.default.createElement(
'div',
{ className: 'finder-content', ref: 'finderContent' },
_react2.default.createElement(
_Panel2.default,
{
title: _react2.default.createElement(_SearchInput2.default, { value: query, onChange: this.handleQueryChange }),
PanelToolbar: function PanelToolbar(props) {
return _react2.default.createElement(_Button2.default, { text: 'Delete', onClick: _this4.handleDelete, style: 'error', disabled: !selectedIds.length });
} },
_react2.default.createElement(_Hint2.default, {
title: _Hints2.default.RedirectsIndex,
onHide: function onHide() {
return _this4.setState({ negativeHeight: negativeHeight - 49 });
}
}),
loading ? _react2.default.createElement(
'div',
{ className: 'loader-center margin-top-xlarge' },
_react2.default.createElement(_Spinner2.default, { spinnerName: 'circle' })
) : _react2.default.createElement(_Table2.default, {
data: (0, _tableUtils.filterDataByQueryWithFields)(data, fields, query),
fields: fields,
selectedIds: selectedIds,
defaultSortField: 'priority',
onSelect: this.handleEdit,
onSelectionChange: function onSelectionChange(selectedIds) {
return _this4.setState({ selectedIds: selectedIds });
},
negativeHeight: negativeHeight
})
)
)
)
);
};
return RedirectsIndex;
}(_react.Component), _class.propTypes = {
redirectsGetUrl: _propTypes2.default.string,
redirectsAddUrl: _propTypes2.default.string,
redirectsUpdateUrl: _propTypes2.default.string,
redirectsDeleteUrl: _propTypes2.default.string
}, _temp);
exports.default = RedirectsIndex;