@alipay/ams-checkout 0.0.1703483942-dev.5 → 0.0.1703483942-dev.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
import { ANIMATION_TIME, closeImg, COMPONENT_CLOSE_BLOCK_ID, COMPONENT_CONTAINER_ID, COMPONENT_RETENTION_ID, COMPONENT_SECTION_ID, LOADING_ID, MOCKUP_ID } from "../../constant";
|
|
9
9
|
import { platformEnum } from "../../types";
|
|
10
10
|
import { addSetFontSizeEvent, amsSetSize, getDesignFontSize } from "../../util";
|
|
11
|
-
var componentCss = ".ams-component-container-mobile {\n width: 100%;\n height: 1px;\n position: fixed;\n bottom: -1px;\n left: 0;\n z-index: 1001;\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n}\n.ams-component-container-mobile-animation{\n animation: ams-component-container-slide-in 0.3s ease-in-out;\n}\n\n.ams-component-section-desktop {\n font-size: 0;\n}\n\n.ams-component-container-hidden-mobile {\n width: 100%;\n height: 0px;\n position: fixed;\n bottom: -1px;\n left: 0;\n z-index: 1001;\n background-color: transparent;\n border-radius: 12px 12px 0 0;\n animation: ams-component-container-slide-out 0.26s ease-in forwards;\n overflow: hidden;\n}\n\n.ams-component-section-mobile {\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n font-size: 0;\n}\n\n.ams-component-container-desktop {\n display: block;\n width: 672px;\n position: fixed;\n top: 50%;\n left: 50%;\n z-index: 1001;\n border-radius:
|
|
11
|
+
var componentCss = ".ams-component-container-mobile {\n width: 100%;\n height: 1px;\n position: fixed;\n bottom: -1px;\n left: 0;\n z-index: 1001;\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n}\n.ams-component-container-mobile-animation{\n animation: ams-component-container-slide-in 0.3s ease-in-out;\n}\n\n.ams-component-section-desktop {\n font-size: 0;\n}\n\n.ams-component-container-hidden-mobile {\n width: 100%;\n height: 0px;\n position: fixed;\n bottom: -1px;\n left: 0;\n z-index: 1001;\n background-color: transparent;\n border-radius: 12px 12px 0 0;\n animation: ams-component-container-slide-out 0.26s ease-in forwards;\n overflow: hidden;\n}\n\n.ams-component-section-mobile {\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n font-size: 0;\n}\n\n.ams-component-container-desktop {\n display: block;\n width: 672px;\n position: fixed;\n top: 50%;\n left: 50%;\n z-index: 1001;\n border-radius: 12px;\n overflow: hidden;\n transform-origin: 50% 50%;\n}\n.ams-component-container-desktop-animation{\n animation: ams-component-container-zoom-in 0.3s ease-in-out;\n animation-fill-mode: forwards\n}\n\n@keyframes ams-component-container-zoom-out {\n 0% {\n transform: translate(-50%, -50%) scale(1);\n -webkit-transform: translate(-50%, -50%) scale(1);\n opacity: 1\n }\n \n 100% {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.4);\n -webkit-transform: translate(-50%, -50%) scale(0.4);\n }\n}\n\n@keyframes ams-component-container-zoom-in {\n 0% {\n transform: translate(-50%, -50%) scale(0.4);\n opacity: 0\n }\n\n 80% {\n opacity: 1\n }\n\n 100% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n\n.ams-component-container-hidden-desktop {\n display: block;\n position: fixed;\n top: 50%;\n left: 50%;\n z-index: 1001;\n border-radius: 8px;\n overflow: hidden;\n animation: ams-component-container-zoom-out 0.3s ease-in-out;\n animation-fill-mode: forwards;\n transform-origin: 50% 50%;\n}\n\n.ams-component-loading {\n width: 0.8em;\n height:0.8em;\n background: rgba(0, 0, 0, 0.5);\n border-radius: 8px;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1001;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n.ams-component-loading .line {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.ams-component-loading .line div {\n position: absolute;\n left: 17.67px;\n top: 0;\n width: 5.33px;\n height: 40px;\n}\n\n.ams-component-loading .line div:before,\n.ams-component-loading .line div:after {\n content: '';\n display: block;\n height: 13.33px;\n background: #fcfcfc;\n border-radius: 5.3px;\n}\n.ams-component-loading .line div:after {\n margin-top: 13.33px;\n}\n\n.ams-component-loading .line div:nth-child(2) {\n -webkit-transform: rotate(45deg);\n}\n\n.ams-component-loading .line div:nth-child(3) {\n -webkit-transform: rotate(90deg);\n}\n\n.ams-component-loading .line div:nth-child(4) {\n -webkit-transform: rotate(135deg);\n}\n\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes load {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n.ams-component-loading .line div:nth-child(1):before {\n -webkit-animation: load 1s linear 0s infinite;\n}\n\n.ams-component-loading .line div:nth-child(2):before {\n -webkit-animation: load 1s linear 0.125s infinite;\n}\n\n.ams-component-loading .line div:nth-child(3):before {\n -webkit-animation: load 1s linear 0.25s infinite;\n}\n\n.ams-component-loading .line div:nth-child(4):before {\n -webkit-animation: load 1s linear 0.375s infinite;\n}\n\n.ams-component-loading .line div:nth-child(1):after {\n -webkit-animation: load 1s linear 0.5s infinite;\n}\n\n.ams-component-loading .line div:nth-child(2):after {\n -webkit-animation: load 1s linear 0.675s infinite;\n}\n\n.ams-component-loading .line div:nth-child(3):after {\n -webkit-animation: load 1s linear 0.75s infinite;\n}\n\n.ams-component-loading .line div:nth-child(4):after {\n -webkit-animation: load 1s linear 0.875s infinite;\n}\n\n.ams-component-loading-logo {\n width: 0.44em;\n height: 0.44em;\n -webkit-transform:rotate(360deg);\n transform:rotate(360deg);\n -webkit-transition:-webkit-transform 1s linear;\n transition:transform 1s linear;\n animation: ams-component-loading-logo 1s linear infinite;\n}\n\n.asm-component-close-block-desktop {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 0;\n top: 0;\n cursor: pointer;\n}\n.asm-component-close-block-btn-desktop {\n width: 11px;\n height: 11px;\n object-fit: fill;\n position: absolute;\n right: 18.7px;\n top: 26.7px;\n}\n.asm-component-close-block-hidden {\n width: 0px !important;\n height: 0px !important;\n visibility: hidden;\n}\n.asm-component-close-block-mobile {\n position: absolute;\n width: 0.4em;\n height: 0.4em;\n right: 0;\n top: 0;\n cursor: pointer;\n z-index: 1009;\n}\n\n.asm-component-close-block-btn-mobile {\n width: 0.11em;\n height: 0.11em;\n object-fit: fill;\n position: absolute;\n right: 0.147em;\n top: 0.167em;\n}\n\n\n.ams-component-container-opacity{\n opacity: 1;\n}\n\n.ams-component-container-opacity:after{\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n display: block;\n content: \"\";\n z-index: 1010;\n background-color: rgba(0, 0, 0, 0.35);\n border-radius: 12px 12px 0 0;\n}\n\n#ams-component-retention {\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n transform-origin: 50%;\n height: auto;\n display: none;\n z-index: 1009;\n}\n\n.ams-component-retention-show {\n display: flex !important;\n animation: ams-component-container-zoom-in 0.3s ease-in-out;\n animation-fill-mode: forwards\n}\n\n.ams-component-retention-hidden {\n display: flex !important;\n animation: ams-component-container-zoom-out 0.3s ease-in-out;\n -webkit-animation: ams-component-container-zoom-out 0.3s ease-in-out;\n animation-fill-mode: forwards;\n -webkit-animation-fill-mode: forwards;\n}\n\n.ams-component-retention-mobile {\n width: 294px;\n border-radius: 12px;\n padding: 24px 0;\n background-color: #fff;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n box-sizing: border-box;\n}\n\n.ams-component-retention-desktop {\n width: 544px;\n border-radius: 12px;\n padding: 32px;\n background-color: #fff;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n box-sizing: border-box;\n}\n\n@media screen and (max-width: 300px) {\n .ams-component-retention-mobile {\n transform: translate(-50%, -50%) scale(0.8);\n }\n}\n\n.ams-component-retention-title-mobile {\n width: 100%;\n font-style: normal;\n font-weight: 500;\n font-size: 16px;\n line-height: 24px;\n color: #2A3A52;\n text-align: center;\n padding: 0 16px;\n box-sizing: border-box;\n}\n\n.ams-component-retention-title-desktop {\n text-align: left;\n width: 100%;\n font-style: normal;\n font-weight: 500;\n font-size: 16px;\n line-height: 24px;\n color: #2A3A52;\n}\n\n.ams-component-retention-sub-title-mobile {\n width: 100%;\n font-weight: 400;\n font-size: 14px;\n line-height: 20px;\n color: #7C8CA3;\n margin-top: 8px;\n text-align: center;\n padding: 0 16px;\n box-sizing: border-box;\n}\n\n.ams-component-retention-sub-title-desktop {\n text-align: left;\n font-style: normal;\n font-weight: 400;\n font-size: 14px;\n line-height: 20px;\n color: #7C8CA3;\n margin-top: 10px;\n}\n\n.ams-component-retention-btn-block-mobile {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n margin-top: 24px;\n padding: 0 24px;\n box-sizing: border-box;\n}\n\n.ams-component-retention-btn-block-desktop {\n width: 100%;\n margin-top: 24px;\n}\n\n#ams-component-retention-remain {\n background: #0079FF;\n border-radius: 100px;\n font-style: normal;\n font-weight: 500;\n text-align: center;\n box-sizing: border-box;\n color: #FFFFFF;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.ams-component-retention-remain-mobile {\n width: 100%;\n height: 44px;\n font-size: 16px;\n line-height: 44px;\n padding: 0 6px;\n}\n\n.ams-component-retention-remain-desktop {\n height: 44px;\n font-size: 16px;\n line-height: 44px;\n display: inline-block;\n padding: 0 24px;\n float: right;\n cursor: pointer;\n padding: 0 16px;\n max-width: 225px;\n min-width: 159px;\n}\n\n#ams-component-retention-leave {\n border-radius: 100px;\n border: 1px solid #0079FF;\n font-style: normal;\n font-weight: 500;\n text-align: center;\n box-sizing: border-box;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.ams-component-retention-leave-mobile {\n width: 100%;\n height: 44px;\n font-size: 16px;\n line-height: 44px;\n color: #1677FF;\n margin-top: 12px;\n padding: 0 6px;\n}\n\n.ams-component-retention-leave-desktop {\n height: 44px;\n font-size: 16px;\n line-height: 44px;\n color: #1677FF;\n display: inline-block;\n padding: 0 24px;\n float: right;\n margin-right: 16px;\n cursor: pointer;\n padding: 0 16px;\n max-width: 225px;\n min-width: 144px;\n}\n.".concat(MOCKUP_ID, "-hidden{\nanimation: ").concat(MOCKUP_ID, "-opacity 0.3s ease-in-out;\n animation-fill-mode: forwards\n}\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes ").concat(MOCKUP_ID, "-opacity {\n 0% {\n opacity: 1;\n }\n\n 100% {\n opacity: 0;\n }\n}\n");
|
|
12
12
|
export var componentAddCSS = function componentAddCSS() {
|
|
13
13
|
var style = document.createElement('style');
|
|
14
14
|
style.type = 'text/css';
|
|
@@ -123,6 +123,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
123
123
|
var _this$_renderParams3,
|
|
124
124
|
_this = this;
|
|
125
125
|
var product = (_this$_renderParams3 = this._renderParams) === null || _this$_renderParams3 === void 0 || (_this$_renderParams3 = _this$_renderParams3.paymentSessionMetaData) === null || _this$_renderParams3 === void 0 || (_this$_renderParams3 = _this$_renderParams3.paymentSessionConfig) === null || _this$_renderParams3 === void 0 ? void 0 : _this$_renderParams3.productScene;
|
|
126
|
+
if (componentSignEnum.CASHIER_PAYMENT_APM === this._componentSign) return;
|
|
126
127
|
if (componentSignEnum.CASHIER_PAYMENT_BANK === this._componentSign) {
|
|
127
128
|
this.AMSSDK.logger.logInfo({
|
|
128
129
|
title: 'sdk_event_security_unneeded_scenarios'
|
|
@@ -246,9 +247,6 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
246
247
|
this._merchantAppointParam = renderParams.merchantAppointParam;
|
|
247
248
|
var insertedNode = this._renderDisplayType === renderDisplayTypeEnum.inline ? "#".concat(COMPONENT_CONTAINER_ID) : this._selector;
|
|
248
249
|
this.initLoggerMeta();
|
|
249
|
-
this.AMSSDK.logger.logInfo({
|
|
250
|
-
title: 'sdk_event_createComponent'
|
|
251
|
-
}).send();
|
|
252
250
|
this.initSecurity();
|
|
253
251
|
this._performanceData.push({
|
|
254
252
|
key: 'sdk_create_component',
|
|
@@ -377,14 +375,11 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
377
375
|
return _this5.getDeviceIdAndLog();
|
|
378
376
|
case 8:
|
|
379
377
|
envInfo.deviceId = _context2.sent;
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
// WAP_SUB_TYPE: 'WECHAT_MINI_PROGRAM',
|
|
386
|
-
// };
|
|
387
|
-
// }
|
|
378
|
+
if (window.navigator.userAgent.indexOf('miniProgram') > -1) {
|
|
379
|
+
envInfo.extendInfo = {
|
|
380
|
+
WAP_SUB_TYPE: 'WECHAT_MINI_PROGRAM'
|
|
381
|
+
};
|
|
382
|
+
}
|
|
388
383
|
case 10:
|
|
389
384
|
if (!(componentSignEnum.EASY_PAY_WALLET === _this5._componentSign)) {
|
|
390
385
|
_context2.next = 18;
|
|
@@ -791,8 +786,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
791
786
|
event: 'appEventCallback',
|
|
792
787
|
eventCallbackId: eventContext === null || eventContext === void 0 ? void 0 : eventContext.eventCallbackId,
|
|
793
788
|
data: {
|
|
794
|
-
|
|
795
|
-
userAgent: window.navigator.userAgent + window.location.search
|
|
789
|
+
userAgent: window.navigator.userAgent
|
|
796
790
|
}
|
|
797
791
|
}
|
|
798
792
|
});
|
|
@@ -990,7 +984,6 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
990
984
|
var cashier = document.getElementById(COMPONENT_CONTAINER_ID);
|
|
991
985
|
cashier.style.height = "".concat(data.context.data.height, "px");
|
|
992
986
|
if (this._renderDisplayType === renderDisplayTypeEnum.popup) {
|
|
993
|
-
this.dismissLoadingFunc();
|
|
994
987
|
if (this.platform === 'desktop') {
|
|
995
988
|
cashier.classList.add("".concat(COMPONENT_CONTAINER_ID, "-").concat(this.platform, "-animation"));
|
|
996
989
|
if (data.context.data.width) cashier.style.width = "".concat(data.context.data.width, "px");
|
|
@@ -1018,6 +1011,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1018
1011
|
cashier.style.transition = 'height 0.28s ease-in-out';
|
|
1019
1012
|
}, 500);
|
|
1020
1013
|
}
|
|
1014
|
+
this.dismissLoadingFunc();
|
|
1021
1015
|
}
|
|
1022
1016
|
if (this._renderDisplayType === renderDisplayTypeEnum.inline) {
|
|
1023
1017
|
var _document$getElementB3;
|
|
@@ -1029,7 +1023,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1029
1023
|
}, {
|
|
1030
1024
|
key: "handleRedirect",
|
|
1031
1025
|
value: function handleRedirect(data) {
|
|
1032
|
-
var _data$
|
|
1026
|
+
var _data$isDestroy,
|
|
1033
1027
|
_this7 = this;
|
|
1034
1028
|
var _data = typeof data === 'string' ? {
|
|
1035
1029
|
normalUrl: data
|
|
@@ -1038,13 +1032,11 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1038
1032
|
schemeUrl: (data === null || data === void 0 ? void 0 : data.schemeUrl) || '',
|
|
1039
1033
|
normalUrl: (data === null || data === void 0 ? void 0 : data.normalUrl) || '',
|
|
1040
1034
|
target: data === null || data === void 0 ? void 0 : data.target,
|
|
1041
|
-
|
|
1035
|
+
isDestroy: (_data$isDestroy = data === null || data === void 0 ? void 0 : data.isDestroy) !== null && _data$isDestroy !== void 0 ? _data$isDestroy : true
|
|
1042
1036
|
});
|
|
1043
1037
|
this.AMSSDK.logger.logInfo({
|
|
1044
1038
|
title: 'sdk_event_call_url_start'
|
|
1045
|
-
}, {
|
|
1046
|
-
redirectInfo: JSON.stringify(_data)
|
|
1047
|
-
}).send();
|
|
1039
|
+
}, _objectSpread({}, data)).send();
|
|
1048
1040
|
var successCallback = function successCallback(type, url) {
|
|
1049
1041
|
_this7.dispatchToSDK(EVENT.eventCallback.name, {
|
|
1050
1042
|
code: eventCodeEnum.SDK_CALL_URL_SUCCESS,
|
|
@@ -1085,7 +1077,8 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1085
1077
|
window.location.replace(_data.normalUrl);
|
|
1086
1078
|
return;
|
|
1087
1079
|
}
|
|
1088
|
-
|
|
1080
|
+
// 销毁iframe和全局loading
|
|
1081
|
+
if (_data !== null && _data !== void 0 && _data.isDestroy) this.cleanContainer();
|
|
1089
1082
|
this.AMSSDK._redirect({
|
|
1090
1083
|
applinkUrl: _data === null || _data === void 0 ? void 0 : _data.applinkUrl
|
|
1091
1084
|
}).then(function () {
|
|
@@ -1127,7 +1120,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
|
1127
1120
|
this.dispatchToSDK(EVENT.eventCallback.name, {
|
|
1128
1121
|
code: eventInfo.eventName,
|
|
1129
1122
|
result: {
|
|
1130
|
-
result: eventInfo.eventResult
|
|
1123
|
+
result: eventInfo.eventResult || {}
|
|
1131
1124
|
}
|
|
1132
1125
|
});
|
|
1133
1126
|
}
|