UNPKG

@51yzone/pc-components

Version:

An enterprise-class UI design language and React-based implementation

257 lines (215 loc) 9.69 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); var _typeof = require("@babel/runtime/helpers/typeof"); Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = void 0; var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator")); require("antd/lib/col/style"); var _col = _interopRequireDefault(require("antd/lib/col")); require("antd/lib/row/style"); var _row = _interopRequireDefault(require("antd/lib/row")); require("antd/lib/checkbox/style"); var _checkbox = _interopRequireDefault(require("antd/lib/checkbox")); var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); var _react = _interopRequireWildcard(require("react")); var _antd = require("@formily/antd"); var _icons = require("@ant-design/icons"); var _classnames = _interopRequireDefault(require("classnames")); var _mobileLogin = _interopRequireDefault(require("./mobile-login")); var _accountLogin = _interopRequireDefault(require("./account-login")); var _forgetPwd = _interopRequireDefault(require("./forget-pwd")); 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 __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); }; /** * 关键字:登录 * 新增人:徐友万 * 完善中 */ // 渲染其他登录方式 var renderOtherLogins = function renderOtherLogins(item) { var prefixCls = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'yz-login'; if (item.type === 'alipay') { return /*#__PURE__*/_react["default"].createElement(_icons.AlipayCircleOutlined, { key: item.type, onClick: item.onClick, className: "".concat(prefixCls, "__icon-outlined ").concat(prefixCls, "__icon-other") }); } return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null); }; var Login = function Login(props) { var type = props.type, _props$initCountDown = props.initCountDown, initCountDown = _props$initCountDown === void 0 ? 60 : _props$initCountDown, codeImgUrl = props.codeImgUrl, _props$otherLogins = props.otherLogins, otherLogins = _props$otherLogins === void 0 ? [] : _props$otherLogins, autoLoginVisible = props.autoLoginVisible, forgetVisible = props.forgetVisible, prefixIconVisible = props.prefixIconVisible, labelVisible = props.labelVisible, size = props.size, visibilityToggle = props.visibilityToggle, onSubmit = props.onSubmit, getCode = props.getCode, verifyCode = props.verifyCode, pwdChange = props.pwdChange, onAfterLogin = props.onAfterLogin, prefixCls = props.prefixCls, className = props.className, style = props.style; var actions = (0, _antd.createFormActions)(); // 验证码图片 var _useState = (0, _react.useState)({ visible: window.sessionStorage.getItem('codeImgVisible') === 'show', url: "".concat(codeImgUrl, "?").concat(new Date().getTime()) }), _useState2 = (0, _slicedToArray2["default"])(_useState, 2), codeImg = _useState2[0], setCodeImg = _useState2[1]; // 忘记密码弹框是否可见 var _useState3 = (0, _react.useState)(false), _useState4 = (0, _slicedToArray2["default"])(_useState3, 2), forgetModalVisible = _useState4[0], setForgetModalVisible = _useState4[1]; // 表单提交 var handleSubmit = function handleSubmit(values) { return __awaiter(void 0, void 0, void 0, /*#__PURE__*/_regenerator["default"].mark(function _callee() { return _regenerator["default"].wrap(function _callee$(_context) { while (1) { switch (_context.prev = _context.next) { case 0: _context.prev = 0; _context.next = 3; return onSubmit(values); case 3: window.sessionStorage.setItem('codeImgVisible', 'hide'); if (onAfterLogin) { onAfterLogin(); } _context.next = 11; break; case 7: _context.prev = 7; _context.t0 = _context["catch"](0); setCodeImg({ visible: true, url: "".concat(codeImgUrl, "?").concat(new Date().getTime()) }); window.sessionStorage.setItem('codeImgVisible', 'show'); case 11: case "end": return _context.stop(); } } }, _callee, null, [[0, 7]]); })); }; return /*#__PURE__*/_react["default"].createElement("div", { className: (0, _classnames["default"])(className, "".concat(prefixCls, "-wrapper")), style: style }, /*#__PURE__*/_react["default"].createElement(_antd.Form, { actions: actions, onSubmit: handleSubmit, labelAlign: "left", labelCol: { span: 5 } }, type === 'mobile' ? /*#__PURE__*/_react["default"].createElement(_mobileLogin["default"], { actions: actions, getCode: getCode, initCountDown: initCountDown, labelVisible: labelVisible, prefixIconVisible: prefixIconVisible, size: size, prefixCls: prefixCls }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null), type === 'account' ? /*#__PURE__*/_react["default"].createElement(_accountLogin["default"], { codeImgVisible: codeImg.visible, codeImgUrl: codeImg.url, labelVisible: labelVisible, prefixIconVisible: prefixIconVisible, size: size, visibilityToggle: visibilityToggle }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null), autoLoginVisible || forgetVisible ? /*#__PURE__*/_react["default"].createElement("div", { className: "".concat(prefixCls, "__footer") }, /*#__PURE__*/_react["default"].createElement("div", null, autoLoginVisible && /*#__PURE__*/_react["default"].createElement(_checkbox["default"], { onChange: function onChange() {} }, "\u81EA\u52A8\u767B\u5F55")), forgetVisible && /*#__PURE__*/_react["default"].createElement("div", { onClick: function onClick() { return setForgetModalVisible(true); }, className: "".concat(prefixCls, "__footer-forget") }, "\u5FD8\u8BB0\u5BC6\u7801")) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null), /*#__PURE__*/_react["default"].createElement(_antd.FormButtonGroup, { style: { marginBottom: 24 }, span: 24 }, /*#__PURE__*/_react["default"].createElement(_antd.Submit, { block: true, size: size }, "\u767B\u5F55")), otherLogins.length ? /*#__PURE__*/_react["default"].createElement(_row["default"], { style: { marginBottom: 24 } }, /*#__PURE__*/_react["default"].createElement(_col["default"], { span: 6 }, /*#__PURE__*/_react["default"].createElement("span", null, "\u5176\u4ED6\u767B\u5F55\u65B9\u5F0F")), /*#__PURE__*/_react["default"].createElement(_col["default"], { span: 18 }, otherLogins.map(function (item) { return renderOtherLogins(item, prefixCls); }))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null)), forgetVisible && /*#__PURE__*/_react["default"].createElement(_forgetPwd["default"], { visible: forgetModalVisible, prefixIconVisible: prefixIconVisible, size: size, initCountDown: initCountDown, getCode: getCode, verifyCode: verifyCode, pwdChange: pwdChange, onCancel: function onCancel() { return setForgetModalVisible(false); } })); }; Login.defaultProps = { type: 'account', initCountDown: 60, codeImgUrl: '', otherLogins: [], autoLoginVisible: false, forgetVisible: false, prefixIconVisible: true, labelVisible: false, size: 'large', visibilityToggle: false, prefixCls: 'yz-login', className: '', style: {} }; var _default = Login; exports["default"] = _default;