@whitesev/pops 1.8.8 → 1.8.9
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.
- package/dist/index.amd.js +48 -37
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +48 -37
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +48 -37
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +48 -37
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +48 -37
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +48 -37
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/Pops.d.ts +2 -2
- package/dist/types/src/components/tooltip/index.d.ts +11 -11
- package/dist/types/src/components/tooltip/indexType.d.ts +6 -0
- package/dist/types/src/utils/PopsDOMUtils.d.ts +3 -3
- package/package.json +1 -1
- package/src/Pops.ts +1 -1
- package/src/components/panel/PanelHandleContentDetails.ts +1 -1
- package/src/components/tooltip/config.ts +1 -1
- package/src/components/tooltip/index.css +6 -1
- package/src/components/tooltip/index.ts +48 -35
- package/src/components/tooltip/indexType.ts +6 -0
- package/src/utils/PopsDOMUtils.ts +9 -5
package/dist/index.system.js
CHANGED
|
@@ -966,13 +966,17 @@ System.register('pops', [], (function (exports) {
|
|
|
966
966
|
}
|
|
967
967
|
/**
|
|
968
968
|
* 实现jQuery中的$().offset();
|
|
969
|
-
* @param
|
|
970
|
-
* @
|
|
969
|
+
* @param element
|
|
970
|
+
* @param calcScroll 计算滚动距离
|
|
971
971
|
*/
|
|
972
|
-
offset(element) {
|
|
972
|
+
offset(element, calcScroll = true) {
|
|
973
973
|
let rect = element.getBoundingClientRect();
|
|
974
974
|
let win = element.ownerDocument.defaultView;
|
|
975
|
-
let resultRect = new DOMRect(
|
|
975
|
+
let resultRect = new DOMRect(calcScroll
|
|
976
|
+
? parseFloat((rect.left + (win?.pageXOffset || 0)).toString())
|
|
977
|
+
: rect.left, calcScroll
|
|
978
|
+
? parseFloat((rect.top + (win?.pageYOffset || 0)).toString())
|
|
979
|
+
: rect.top, rect.width, rect.height);
|
|
976
980
|
return resultRect;
|
|
977
981
|
}
|
|
978
982
|
width(element, isShow = false, parent) {
|
|
@@ -2283,7 +2287,7 @@ System.register('pops', [], (function (exports) {
|
|
|
2283
2287
|
|
|
2284
2288
|
var iframeCSS = ".pops[type-value=\"iframe\"] {\r\n\t--container-title-height: 55px;\r\n\ttransition: width 0.35s ease, height 0.35s ease;\r\n}\r\n.pops[type-value] .pops-iframe-title {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tjustify-content: space-between;\r\n}\r\n.pops[type-value=\"iframe\"] .pops-iframe-title {\r\n\twidth: calc(100% - 0px);\r\n\theight: var(--container-title-height);\r\n\tborder-bottom: 1px solid rgb(229, 229, 229, var(--pops-bd-opacity));\r\n}\r\n.pops[type-value=\"iframe\"] .pops-iframe-title p[pops] {\r\n\twidth: 100%;\r\n\toverflow: hidden;\r\n\tcolor: rgb(51, 51, 51);\r\n\ttext-indent: 15px;\r\n\ttext-overflow: ellipsis;\r\n\twhite-space: nowrap;\r\n\tfont-weight: 500;\r\n\tline-height: normal;\r\n\talign-content: center;\r\n}\r\n.pops[type-value=\"iframe\"] .pops-iframe-content {\r\n\twidth: 100%;\r\n\t/*height: calc(100% - var(--container-title-height));*/\r\n\tflex: 1;\r\n\toverflow: hidden;\r\n\tword-break: break-word;\r\n}\r\n.pops[type-value=\"iframe\"] .pops-iframe-content p[pops] {\r\n\tpadding: 5px 10px;\r\n\tcolor: #333;\r\n\ttext-indent: 15px;\r\n}\r\n.pops-loading {\r\n\tposition: absolute;\r\n\ttop: 40px;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n\tz-index: 5;\r\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n}\r\n.pops-loading:before {\r\n\tposition: absolute;\r\n\ttop: 50%;\r\n\tleft: 50%;\r\n\tz-index: 3;\r\n\tdisplay: block;\r\n\tmargin: -20px 0 0 -20px;\r\n\tpadding: 20px;\r\n\tborder: 4px solid rgb(221, 221, 221, var(--pops-bd-opacity));\r\n\tborder-radius: 50%;\r\n\tcontent: \"\";\r\n\tborder-top-color: transparent;\r\n\tanimation: pops-anim-wait-rotate 1.2s linear infinite;\r\n}\r\n.pops[type-value=\"iframe\"].pops[type-module=\"min\"] {\r\n\tbottom: 0;\r\n\tmax-width: 200px;\r\n\tmax-height: 53px;\r\n\tposition: unset;\r\n}\r\n.pops[type-value=\"iframe\"].pops[type-module=\"min\"]\r\n\t.pops-header-control[type=\"min\"] {\r\n\tdisplay: none;\r\n}\r\n.pops[type-value=\"iframe\"].pops-iframe-unset-top {\r\n\ttop: unset !important;\r\n}\r\n.pops[type-value=\"iframe\"].pops-iframe-unset-left {\r\n\tleft: unset !important;\r\n}\r\n.pops[type-value=\"iframe\"].pops-iframe-unset-transform {\r\n\ttransform: none !important;\r\n}\r\n.pops[type-value=\"iframe\"].pops-iframe-unset-transition {\r\n\ttransition: none !important;\r\n}\r\n.pops[type-value=\"iframe\"].pops[type-module=\"max\"] {\r\n\twidth: 100% !important;\r\n\theight: 100% !important;\r\n}\r\n.pops[type-value=\"iframe\"] iframe[pops] {\r\n\twidth: calc(100% - 4px);\r\n\theight: calc(100% - 4px);\r\n\tborder: 0;\r\n}\r\n.pops-iframe-content-global-loading {\r\n\tposition: absolute;\r\n\ttop: 0;\r\n\tleft: 0;\r\n\tz-index: 999999;\r\n\twidth: 0;\r\n\theight: 4px;\r\n\tbackground: linear-gradient(to right, #4995dd, #fff, rgb(202 224 246));\r\n\tanimation: iframeLoadingChange 2s forwards;\r\n}\r\n\r\n.pops-anim:has(.pops[type-value=\"iframe\"].pops[type-module=\"min\"]) {\r\n\tposition: unset;\r\n}\r\n";
|
|
2285
2289
|
|
|
2286
|
-
var tooltipCSS = ".pops-tip {\r\n\t--tooltip-color: #4e4e4e;\r\n\t--tooltip-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n\t--tooltip-bd-radius: 2px;\r\n\t--tooltip-font-size: 14px;\r\n\t--tooltip-padding-top: 13px;\r\n\t--tooltip-padding-right: 13px;\r\n\t--tooltip-padding-bottom: 13px;\r\n\t--tooltip-padding-left: 13px;\r\n\r\n\t--tooltip-arrow--after-color: rgb(78, 78, 78);\r\n\t--tooltip-arrow--after-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n\t--tooltip-arrow--after-width: 12px;\r\n\t--tooltip-arrow--after-height: 12px;\r\n\r\n\
|
|
2290
|
+
var tooltipCSS = ".pops-tip {\r\n\t--tooltip-color: #4e4e4e;\r\n\t--tooltip-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n\t--tooltip-bd-radius: 2px;\r\n\t--tooltip-font-size: 14px;\r\n\t--tooltip-padding-top: 13px;\r\n\t--tooltip-padding-right: 13px;\r\n\t--tooltip-padding-bottom: 13px;\r\n\t--tooltip-padding-left: 13px;\r\n\r\n\t--tooltip-arrow--after-color: rgb(78, 78, 78);\r\n\t--tooltip-arrow--after-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n\t--tooltip-arrow--after-width: 12px;\r\n\t--tooltip-arrow--after-height: 12px;\r\n\r\n\tpadding: var(--tooltip-padding-top) var(--tooltip-padding-right)\r\n\t\tvar(--tooltip-padding-bottom) var(--tooltip-padding-left);\r\n\tmax-width: 400px;\r\n\tmax-height: 300px;\r\n\tborder-radius: var(--tooltip-bd-radius);\r\n\tbackground-color: var(--tooltip-bg-color);\r\n\tbox-shadow: 0 1.5px 4px rgba(0, 0, 0, 0.24), 0 1.5px 6px rgba(0, 0, 0, 0.12);\r\n\tcolor: var(--tooltip-color);\r\n\tfont-size: var(--tooltip-font-size);\r\n}\r\n.pops-tip[data-position=\"absolute\"] {\r\n\tposition: absolute;\r\n}\r\n.pops-tip[data-position=\"fixed\"] {\r\n\tposition: fixed;\r\n}\r\n/* github的样式 */\r\n.pops-tip.github-tooltip {\r\n\t--tooltip-bg-opacity: 1;\r\n\t--tooltip-color: rgb(255, 255, 255);\r\n\t--tooltip-bg-color: rgb(36, 41, 47, var(--tooltip-bg-opacity));\r\n\t--tooltip-bd-radius: 6px;\r\n\t--tooltip-padding-top: 6px;\r\n\t--tooltip-padding-right: 8px;\r\n\t--tooltip-padding-bottom: 6px;\r\n\t--tooltip-padding-left: 8px;\r\n\r\n\t--tooltip-arrow--after-color: rgb(255, 255, 255);\r\n\t--tooltip-arrow--after-bg-color: rgb(36, 41, 47, var(--tooltip-bg-opacity));\r\n\t--tooltip-arrow--after-width: 8px;\r\n\t--tooltip-arrow--after-height: 8px;\r\n}\r\n.pops-tip .pops-tip-arrow {\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\toverflow: hidden;\r\n\twidth: 100%;\r\n\theight: 12.5px;\r\n\ttransform: translateX(-50%);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow::after {\r\n\tposition: absolute;\r\n\ttop: 0;\r\n\tleft: 50%;\r\n\twidth: var(--tooltip-arrow--after-width);\r\n\theight: var(--tooltip-arrow--after-height);\r\n\tbackground: var(--tooltip-arrow--after-bg-color);\r\n\tcolor: var(--tooltip-arrow--after-color);\r\n\tbox-shadow: 0 1px 7px rgba(0, 0, 0, 0.24), 0 1px 7px rgba(0, 0, 0, 0.12);\r\n\tcontent: \"\";\r\n\ttransform: translateX(-50%) translateY(-50%) rotate(45deg);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"bottom\"] {\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\toverflow: hidden;\r\n\twidth: 100%;\r\n\theight: 12.5px;\r\n\ttransform: translateX(-50%);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"bottom\"]:after {\r\n\tposition: absolute;\r\n\ttop: 0;\r\n\tleft: 50%;\r\n\twidth: var(--tooltip-arrow--after-width);\r\n\theight: var(--tooltip-arrow--after-height);\r\n\tbackground: var(--tooltip-arrow--after-bg-color);\r\n\tbox-shadow: 0 1px 7px rgba(0, 0, 0, 0.24), 0 1px 7px rgba(0, 0, 0, 0.12);\r\n\tcontent: \"\";\r\n\ttransform: translateX(-50%) translateY(-50%) rotate(45deg);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"left\"] {\r\n\ttop: 50%;\r\n\tleft: -12.5px;\r\n\twidth: 12.5px;\r\n\theight: 50px;\r\n\ttransform: translateY(-50%);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"left\"]:after {\r\n\tposition: absolute;\r\n\ttop: 50%;\r\n\tleft: 100%;\r\n\tcontent: \"\";\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"right\"] {\r\n\ttop: 50%;\r\n\tright: -12.5px;\r\n\tleft: auto;\r\n\twidth: 12.5px;\r\n\theight: 50px;\r\n\ttransform: translateY(-50%);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"right\"]:after {\r\n\tposition: absolute;\r\n\ttop: 50%;\r\n\tleft: 0;\r\n\tcontent: \"\";\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"top\"] {\r\n\ttop: -12.5px;\r\n\tleft: 50%;\r\n\ttransform: translateX(-50%);\r\n}\r\n\r\n.pops-tip .pops-tip-arrow[data-position=\"top\"]:after {\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\tcontent: \"\";\r\n}\r\n\r\n.pops-tip[data-motion] {\r\n\t-webkit-animation-duration: 0.25s;\r\n\tanimation-duration: 0.25s;\r\n\t-webkit-animation-fill-mode: forwards;\r\n\tanimation-fill-mode: forwards;\r\n}\r\n.pops-tip[data-motion=\"fadeOutRight\"] {\r\n\t-webkit-animation-name: pops-motion-fadeOutRight;\r\n\tanimation-name: pops-motion-fadeOutRight;\r\n}\r\n.pops-tip[data-motion=\"fadeInTop\"] {\r\n\t-webkit-animation-name: pops-motion-fadeInTop;\r\n\tanimation-name: pops-motion-fadeInTop;\r\n\tanimation-timing-function: cubic-bezier(0.49, 0.49, 0.13, 1.3);\r\n}\r\n.pops-tip[data-motion=\"fadeOutTop\"] {\r\n\t-webkit-animation-name: pops-motion-fadeOutTop;\r\n\tanimation-name: pops-motion-fadeOutTop;\r\n\tanimation-timing-function: cubic-bezier(0.32, 0.37, 0.06, 0.87);\r\n}\r\n.pops-tip[data-motion=\"fadeInBottom\"] {\r\n\t-webkit-animation-name: pops-motion-fadeInBottom;\r\n\tanimation-name: pops-motion-fadeInBottom;\r\n}\r\n.pops-tip[data-motion=\"fadeOutBottom\"] {\r\n\t-webkit-animation-name: pops-motion-fadeOutBottom;\r\n\tanimation-name: pops-motion-fadeOutBottom;\r\n}\r\n.pops-tip[data-motion=\"fadeInLeft\"] {\r\n\t-webkit-animation-name: pops-motion-fadeInLeft;\r\n\tanimation-name: pops-motion-fadeInLeft;\r\n}\r\n.pops-tip[data-motion=\"fadeOutLeft\"] {\r\n\t-webkit-animation-name: pops-motion-fadeOutLeft;\r\n\tanimation-name: pops-motion-fadeOutLeft;\r\n}\r\n.pops-tip[data-motion=\"fadeInRight\"] {\r\n\t-webkit-animation-name: pops-motion-fadeInRight;\r\n\tanimation-name: pops-motion-fadeInRight;\r\n}\r\n";
|
|
2287
2291
|
|
|
2288
2292
|
var drawerCSS = ".pops[type-value=\"drawer\"] {\r\n\tposition: fixed;\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tbox-shadow: 0px 16px 48px 16px rgba(0, 0, 0, 0.08),\r\n\t\t0px 12px 32px rgba(0, 0, 0, 0.12), 0px 8px 16px -8px rgba(0, 0, 0, 0.16);\r\n\toverflow: hidden;\r\n\ttransition: all 0.3s;\r\n}\r\n.pops[type-value] .pops-drawer-title {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tjustify-content: space-between;\r\n}\r\n.pops[type-value] .pops-drawer-title p[pops] {\r\n\tline-height: normal;\r\n\talign-content: center;\r\n}\r\n\r\n.pops-drawer-content {\r\n\tflex: 1;\r\n\toverflow: auto;\r\n}\r\n.pops[type-value=\"drawer\"] .pops-drawer-btn {\r\n\tpadding-top: 10px;\r\n\tpadding-bottom: 10px;\r\n}\r\n.pops[type-value=\"drawer\"][direction=\"top\"] {\r\n\twidth: 100%;\r\n\tleft: 0;\r\n\tright: 0;\r\n\ttop: 0;\r\n}\r\n.pops[type-value=\"drawer\"][direction=\"bottom\"] {\r\n\twidth: 100%;\r\n\tleft: 0;\r\n\tright: 0;\r\n\tbottom: 0;\r\n}\r\n.pops[type-value=\"drawer\"][direction=\"left\"] {\r\n\theight: 100%;\r\n\ttop: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n}\r\n.pops[type-value=\"drawer\"][direction=\"right\"] {\r\n\theight: 100%;\r\n\ttop: 0;\r\n\tbottom: 0;\r\n\tright: 0;\r\n}\r\n";
|
|
2289
2293
|
|
|
@@ -6632,6 +6636,7 @@ System.register('pops', [], (function (exports) {
|
|
|
6632
6636
|
zIndex: () => {
|
|
6633
6637
|
return PopsInstanceUtils.getPopsMaxZIndex().zIndex;
|
|
6634
6638
|
},
|
|
6639
|
+
isFixed: true,
|
|
6635
6640
|
className: "github-tooltip",
|
|
6636
6641
|
only: false,
|
|
6637
6642
|
eventOption: {
|
|
@@ -6651,7 +6656,6 @@ System.register('pops', [], (function (exports) {
|
|
|
6651
6656
|
}
|
|
6652
6657
|
},
|
|
6653
6658
|
alwaysShow: false,
|
|
6654
|
-
// only: false,
|
|
6655
6659
|
position: "top",
|
|
6656
6660
|
arrowDistance: 10,
|
|
6657
6661
|
});
|
|
@@ -9431,6 +9435,7 @@ System.register('pops', [], (function (exports) {
|
|
|
9431
9435
|
content: "默认文字",
|
|
9432
9436
|
position: "top",
|
|
9433
9437
|
className: "",
|
|
9438
|
+
isFixed: false,
|
|
9434
9439
|
alwaysShow: false,
|
|
9435
9440
|
triggerShowEventName: "mouseenter touchstart",
|
|
9436
9441
|
triggerCloseEventName: "mouseleave touchend",
|
|
@@ -9496,6 +9501,9 @@ System.register('pops', [], (function (exports) {
|
|
|
9496
9501
|
<div class="pops-tip-content" style="text-align: center;"></div>
|
|
9497
9502
|
<div class="pops-tip-arrow"></div>
|
|
9498
9503
|
`,
|
|
9504
|
+
}, {
|
|
9505
|
+
"data-position": this.$data.config.isFixed ? "fixed" : "absolute",
|
|
9506
|
+
"data-guid": this.$data.guid,
|
|
9499
9507
|
});
|
|
9500
9508
|
/** 内容 */
|
|
9501
9509
|
let $toolTipContent = $toolTipContainer.querySelector(".pops-tip-content");
|
|
@@ -9506,8 +9514,6 @@ System.register('pops', [], (function (exports) {
|
|
|
9506
9514
|
this.$data.config.className.trim() !== "") {
|
|
9507
9515
|
popsDOMUtils.addClassName($toolTipContainer, this.$data.config.className);
|
|
9508
9516
|
}
|
|
9509
|
-
// 添加attr
|
|
9510
|
-
$toolTipContainer.setAttribute("data-guid", this.$data.guid);
|
|
9511
9517
|
// 添加z-index
|
|
9512
9518
|
$toolTipContainer.style.zIndex = PopsHandler.handleZIndex(this.$data.config.zIndex).toString();
|
|
9513
9519
|
if (this.$data.config.style != null) {
|
|
@@ -9563,12 +9569,17 @@ System.register('pops', [], (function (exports) {
|
|
|
9563
9569
|
* @param otherDistance 其它位置的偏移
|
|
9564
9570
|
*/
|
|
9565
9571
|
getPosition(targetElement, arrowDistance, otherDistance) {
|
|
9566
|
-
let
|
|
9567
|
-
|
|
9568
|
-
let
|
|
9569
|
-
//
|
|
9570
|
-
let
|
|
9571
|
-
//
|
|
9572
|
+
let offsetInfo = popsDOMUtils.offset(targetElement, !this.$data.config.isFixed);
|
|
9573
|
+
// 目标 宽
|
|
9574
|
+
let targetElement_width = offsetInfo.width;
|
|
9575
|
+
// 目标 高
|
|
9576
|
+
let targetElement_height = offsetInfo.height;
|
|
9577
|
+
// 目标 顶部距离
|
|
9578
|
+
let targetElement_top = offsetInfo.top;
|
|
9579
|
+
// let targetElement_bottom = offsetInfo.bottom;
|
|
9580
|
+
// 目标 左边距离
|
|
9581
|
+
let targetElement_left = offsetInfo.left;
|
|
9582
|
+
// let targetElement_right = offsetInfo.right;
|
|
9572
9583
|
let toolTipElement_width = popsDOMUtils.outerWidth(this.$el.$toolTip);
|
|
9573
9584
|
let toolTipElement_height = popsDOMUtils.outerHeight(this.$el.$toolTip);
|
|
9574
9585
|
/* 目标元素的x轴的中间位置 */
|
|
@@ -9624,21 +9635,21 @@ System.register('pops', [], (function (exports) {
|
|
|
9624
9635
|
*/
|
|
9625
9636
|
onEvent() {
|
|
9626
9637
|
// 监听动画结束事件
|
|
9627
|
-
this.
|
|
9638
|
+
this.onToolTipAnimationFinishEvent();
|
|
9628
9639
|
this.onShowEvent();
|
|
9629
9640
|
this.onCloseEvent();
|
|
9630
|
-
this.
|
|
9631
|
-
this.
|
|
9641
|
+
this.onToolTipMouseEnterEvent();
|
|
9642
|
+
this.onToolTipMouseLeaveEvent();
|
|
9632
9643
|
}
|
|
9633
9644
|
/**
|
|
9634
9645
|
* 取消事件绑定
|
|
9635
9646
|
*/
|
|
9636
9647
|
offEvent() {
|
|
9637
|
-
this.
|
|
9648
|
+
this.offToolTipAnimationFinishEvent();
|
|
9638
9649
|
this.offShowEvent();
|
|
9639
9650
|
this.offCloseEvent();
|
|
9640
|
-
this.
|
|
9641
|
-
this.
|
|
9651
|
+
this.offToolTipMouseEnterEvent();
|
|
9652
|
+
this.offToolTipMouseLeaveEvent();
|
|
9642
9653
|
}
|
|
9643
9654
|
/**
|
|
9644
9655
|
* 添加关闭的timeId
|
|
@@ -9794,7 +9805,7 @@ System.register('pops', [], (function (exports) {
|
|
|
9794
9805
|
/**
|
|
9795
9806
|
* 动画结束事件
|
|
9796
9807
|
*/
|
|
9797
|
-
|
|
9808
|
+
toolTipAnimationFinishEvent() {
|
|
9798
9809
|
if (!this.$el.$toolTip) {
|
|
9799
9810
|
return;
|
|
9800
9811
|
}
|
|
@@ -9804,21 +9815,21 @@ System.register('pops', [], (function (exports) {
|
|
|
9804
9815
|
this.destory();
|
|
9805
9816
|
}
|
|
9806
9817
|
/**
|
|
9807
|
-
*
|
|
9818
|
+
* 监听tooltip的动画结束
|
|
9808
9819
|
*/
|
|
9809
|
-
|
|
9810
|
-
popsDOMUtils.on(this.$el.$toolTip, popsDOMUtils.getAnimationEndNameList(), this.
|
|
9820
|
+
onToolTipAnimationFinishEvent() {
|
|
9821
|
+
popsDOMUtils.on(this.$el.$toolTip, popsDOMUtils.getAnimationEndNameList(), this.toolTipAnimationFinishEvent.bind(this));
|
|
9811
9822
|
}
|
|
9812
9823
|
/**
|
|
9813
|
-
*
|
|
9824
|
+
* 取消tooltip监听动画结束
|
|
9814
9825
|
*/
|
|
9815
|
-
|
|
9816
|
-
popsDOMUtils.off(this.$el.$toolTip, popsDOMUtils.getAnimationEndNameList(), this.
|
|
9826
|
+
offToolTipAnimationFinishEvent() {
|
|
9827
|
+
popsDOMUtils.off(this.$el.$toolTip, popsDOMUtils.getAnimationEndNameList(), this.toolTipAnimationFinishEvent.bind(this));
|
|
9817
9828
|
}
|
|
9818
9829
|
/**
|
|
9819
9830
|
* 鼠标|触摸进入事件
|
|
9820
9831
|
*/
|
|
9821
|
-
|
|
9832
|
+
toolTipMouseEnterEvent() {
|
|
9822
9833
|
this.$el.$toolTip.style.animationPlayState = "paused";
|
|
9823
9834
|
// if (parseInt(getComputedStyle(toolTipElement)) > 0.5) {
|
|
9824
9835
|
// toolTipElement.style.animationPlayState = "paused";
|
|
@@ -9827,34 +9838,34 @@ System.register('pops', [], (function (exports) {
|
|
|
9827
9838
|
/**
|
|
9828
9839
|
* 监听鼠标|触摸事件
|
|
9829
9840
|
*/
|
|
9830
|
-
|
|
9841
|
+
onToolTipMouseEnterEvent() {
|
|
9831
9842
|
this.clearCloseTimeoutId("MouseEvent");
|
|
9832
9843
|
this.clearCloseTimeoutId("TouchEvent");
|
|
9833
|
-
popsDOMUtils.on(this.$el.$toolTip, "mouseenter touchstart", this.
|
|
9844
|
+
popsDOMUtils.on(this.$el.$toolTip, "mouseenter touchstart", this.toolTipMouseEnterEvent.bind(this), this.$data.config.eventOption);
|
|
9834
9845
|
}
|
|
9835
9846
|
/**
|
|
9836
9847
|
* 取消监听鼠标|触摸事件
|
|
9837
9848
|
*/
|
|
9838
|
-
|
|
9839
|
-
popsDOMUtils.off(this.$el.$toolTip, "mouseenter touchstart", this.
|
|
9849
|
+
offToolTipMouseEnterEvent() {
|
|
9850
|
+
popsDOMUtils.off(this.$el.$toolTip, "mouseenter touchstart", this.toolTipMouseEnterEvent.bind(this), this.$data.config.eventOption);
|
|
9840
9851
|
}
|
|
9841
9852
|
/**
|
|
9842
9853
|
* 鼠标|触摸离开事件
|
|
9843
9854
|
*/
|
|
9844
|
-
|
|
9855
|
+
toolTipMouseLeaveEvent() {
|
|
9845
9856
|
this.$el.$toolTip.style.animationPlayState = "running";
|
|
9846
9857
|
}
|
|
9847
9858
|
/**
|
|
9848
9859
|
* 监听鼠标|触摸离开事件
|
|
9849
9860
|
*/
|
|
9850
|
-
|
|
9851
|
-
popsDOMUtils.on(this.$el.$toolTip, "mouseleave touchend", this.
|
|
9861
|
+
onToolTipMouseLeaveEvent() {
|
|
9862
|
+
popsDOMUtils.on(this.$el.$toolTip, "mouseleave touchend", this.toolTipMouseLeaveEvent.bind(this), this.$data.config.eventOption);
|
|
9852
9863
|
}
|
|
9853
9864
|
/**
|
|
9854
9865
|
* 取消监听鼠标|触摸离开事件
|
|
9855
9866
|
*/
|
|
9856
|
-
|
|
9857
|
-
popsDOMUtils.off(this.$el.$toolTip, "mouseleave touchend", this.
|
|
9867
|
+
offToolTipMouseLeaveEvent() {
|
|
9868
|
+
popsDOMUtils.off(this.$el.$toolTip, "mouseleave touchend", this.toolTipMouseLeaveEvent.bind(this), this.$data.config.eventOption);
|
|
9858
9869
|
}
|
|
9859
9870
|
}
|
|
9860
9871
|
class PopsTooltip {
|