@51yzone/pc-components
Version:
An enterprise-class UI design language and React-based implementation
257 lines (215 loc) • 9.69 kB
JavaScript
"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;