@aliretail/react-link-selector
Version:
127 lines (105 loc) • 4.81 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = MicroPage;
var _pagination = _interopRequireDefault(require("@alifd/next/lib/pagination"));
var _checkbox = _interopRequireDefault(require("@alifd/next/lib/checkbox"));
var _search = _interopRequireDefault(require("@alifd/next/lib/search"));
var _react = _interopRequireWildcard(require("react"));
var _reactUniversalRequest = _interopRequireDefault(require("@aliretail/react-universal-request"));
var _api = _interopRequireDefault(require("../api"));
require("./index.scss");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var PAGESIZE = 20;
function MicroPage(props) {
var _useState = (0, _react.useState)([]),
data = _useState[0],
setData = _useState[1];
var _useState2 = (0, _react.useState)(0),
start = _useState2[0],
setStart = _useState2[1];
var _useState3 = (0, _react.useState)(''),
searchKeyword = _useState3[0],
setSearchKeyword = _useState3[1];
var _useState4 = (0, _react.useState)(props.value),
value = _useState4[0],
setValue = _useState4[1];
var _useState5 = (0, _react.useState)(0),
total = _useState5[0],
setTotal = _useState5[1];
var queryData = function queryData() {
(0, _reactUniversalRequest["default"])({
url: _api["default"].microPage,
method: 'POST',
data: {
start: start,
limit: PAGESIZE,
pageName: searchKeyword
}
}).then(function (json) {
setTotal(json.result.totalElements);
setData(json.result.content); // Message.success("保存成功");
});
};
(0, _react.useEffect)(function () {
queryData();
}, []);
/** 检索当前页面组件 */
var search = function search(keyword) {
setSearchKeyword(keyword);
};
var onSelectMicroPage = function onSelectMicroPage(item) {
setValue([item]);
props.onSelect({
type: 'microPage',
result: [item]
});
};
(0, _react.useEffect)(function () {
queryData();
}, [start, searchKeyword]);
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_search["default"], {
style: {
margin: '10px 0'
},
shape: "simple",
onSearch: search,
placeholder: "\u901A\u8FC7\u9875\u9762\u540D\u79F0\u641C\u7D22"
}), /*#__PURE__*/_react["default"].createElement("div", {
className: "micro-page-list"
}, data.map(function (page) {
var selected = value.length && page.id === value[0].id;
return /*#__PURE__*/_react["default"].createElement("div", {
className: "micro-page-item " + (selected ? 'micro-page-item-checked' : ''),
key: page.id,
onClick: function onClick() {
return onSelectMicroPage(page);
}
}, selected ? /*#__PURE__*/_react["default"].createElement(_checkbox["default"], {
className: "checkbox",
checked: true
}) : null, /*#__PURE__*/_react["default"].createElement("div", {
className: "img"
}, /*#__PURE__*/_react["default"].createElement("img", {
src: page.previewUrl
})), /*#__PURE__*/_react["default"].createElement("div", {
className: "title"
}, page.pageName));
})), /*#__PURE__*/_react["default"].createElement(_pagination["default"], {
total: total,
pageSize: PAGESIZE,
hideOnlyOnePage: true,
current: Math.floor(start / PAGESIZE) + 1,
onChange: function onChange(n) {
setStart((n - 1) * PAGESIZE);
},
shape: "arrow-only",
pageShowCount: 5,
style: {
marginTop: '16px',
"float": 'right'
},
showJump: false
}));
}