@whitesev/pops 2.2.0 → 2.2.2
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 +364 -357
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +364 -357
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +364 -357
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +364 -357
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +364 -357
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +364 -357
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/Pops.d.ts +17 -17
- package/dist/types/src/PopsInst.d.ts +8 -0
- package/dist/types/src/components/panel/index.d.ts +2 -1
- package/dist/types/src/components/searchSuggestion/index.d.ts +1 -1
- package/dist/types/src/handler/PopsElementHandler.d.ts +6 -6
- package/dist/types/src/handler/PopsHandler.d.ts +6 -6
- package/dist/types/src/types/button.d.ts +2 -2
- package/dist/types/src/types/components.d.ts +5 -5
- package/dist/types/src/types/event.d.ts +3 -3
- package/dist/types/src/types/{layer.d.ts → inst.d.ts} +7 -5
- package/dist/types/src/types/main.d.ts +36 -58
- package/dist/types/src/utils/PopsInstanceUtils.d.ts +10 -10
- package/package.json +1 -1
- package/src/Pops.ts +2 -2
- package/src/PopsInst.ts +21 -0
- package/src/components/alert/index.ts +16 -16
- package/src/components/confirm/index.ts +16 -15
- package/src/components/drawer/index.ts +16 -15
- package/src/components/folder/index.ts +141 -152
- package/src/components/iframe/index.ts +16 -15
- package/src/components/panel/index.ts +19 -18
- package/src/components/prompt/index.ts +15 -14
- package/src/components/rightClickMenu/index.ts +19 -18
- package/src/components/searchSuggestion/index.ts +21 -20
- package/src/components/tooltip/index.ts +3 -2
- package/src/css/scrollbar.css +9 -5
- package/src/handler/PopsElementHandler.ts +18 -18
- package/src/handler/PopsHandler.ts +38 -32
- package/src/types/button.d.ts +2 -2
- package/src/types/components.d.ts +5 -5
- package/src/types/event.d.ts +3 -3
- package/src/types/{layer.d.ts → inst.d.ts} +7 -5
- package/src/types/main.d.ts +36 -58
- package/src/utils/PopsInstanceUtils.ts +84 -81
- package/dist/types/src/PopsLayer.d.ts +0 -5
- package/src/PopsLayer.ts +0 -18
package/dist/index.amd.js
CHANGED
|
@@ -2340,7 +2340,10 @@ define((function () { 'use strict';
|
|
|
2340
2340
|
}
|
|
2341
2341
|
const popsDOMUtils = new PopsDOMUtils();
|
|
2342
2342
|
|
|
2343
|
-
|
|
2343
|
+
/**
|
|
2344
|
+
* 弹窗实例数据
|
|
2345
|
+
*/
|
|
2346
|
+
const PopsInstData = {
|
|
2344
2347
|
alert: [],
|
|
2345
2348
|
confirm: [],
|
|
2346
2349
|
drawer: [],
|
|
@@ -2358,7 +2361,7 @@ define((function () { 'use strict';
|
|
|
2358
2361
|
|
|
2359
2362
|
var ninePalaceGridPositionCSS = ".pops[position=\"top_left\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tleft: 0;\r\n}\r\n.pops[position=\"top\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tleft: 50%;\r\n\ttransform: translateX(-50%);\r\n}\r\n.pops[position=\"top_right\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tright: 0;\r\n}\r\n.pops[position=\"center_left\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tleft: 0;\r\n\ttransform: translateY(-50%);\r\n}\r\n.pops[position=\"center\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tleft: 50%;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n.pops[position=\"center_right\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tright: 0;\r\n\ttransform: translateY(-50%);\r\n}\r\n.pops[position=\"bottom_left\"] {\r\n\tposition: fixed;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n}\r\n.pops[position=\"bottom\"] {\r\n\tposition: fixed;\r\n\tbottom: 0;\r\n\tleft: 50%;\r\n\ttransform: translate(-50%, 0);\r\n}\r\n.pops[position=\"bottom_right\"] {\r\n\tposition: fixed;\r\n\tright: 0;\r\n\tbottom: 0;\r\n}\r\n";
|
|
2360
2363
|
|
|
2361
|
-
var scrollbarCSS = "/*
|
|
2364
|
+
var scrollbarCSS = "/* ::-webkit-scrollbar 是非标准的css */\r\n/* https://caniuse.com/?search=%20%3A%3A-webkit-scrollbar */\r\n.pops ::-webkit-scrollbar {\r\n\twidth: 6px;\r\n\theight: 0;\r\n}\r\n\r\n/* 滚动条轨道 */\r\n.pops ::-webkit-scrollbar-track {\r\n\twidth: 0;\r\n}\r\n/* 滚动条滑块 */\r\n.pops ::-webkit-scrollbar-thumb {\r\n\tmin-height: 28px;\r\n\tborder-radius: 2em;\r\n\tbackground: rgb(204, 204, 204, var(--pops-bg-opacity, 1));\r\n\tbackground-clip: padding-box;\r\n}\r\n/* 滚动条滑块 */\r\n.pops ::-webkit-scrollbar-thumb:hover {\r\n\tbackground: rgb(178, 178, 178, var(--pops-bg-opacity, 1));\r\n}\r\n";
|
|
2362
2365
|
|
|
2363
2366
|
var buttonCSS = ".pops {\r\n\t--button-font-size: 14px;\r\n\t--button-height: 32px;\r\n\t--button-color: rgb(51, 51, 51);\r\n\t--button-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\r\n\t--button-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\r\n\t--button-margin-top: 0px;\r\n\t--button-margin-bottom: 0px;\r\n\t--button-margin-left: 5px;\r\n\t--button-margin-right: 5px;\r\n\t--button-padding-top: 6px;\r\n\t--button-padding-bottom: 6px;\r\n\t--button-padding-left: 12px;\r\n\t--button-padding-right: 12px;\r\n\t--button-radius: 4px;\r\n\r\n\t--container-title-height: 55px;\r\n\t--container-bottom-btn-height: 55px;\r\n\r\n\t/* default按钮 */\r\n\t--button-default-color: #333333;\r\n\t--button-default-bd-color: #dcdfe6;\r\n\t--button-default-bg-color: #ffffff;\r\n\t--button-default-active-color: #409eff;\r\n\t--button-default-active-bd-color: #409eff;\r\n\t--button-default-active-bg-color: #ecf5ff;\r\n\t--button-default-hover-color: #409eff;\r\n\t--button-default-hover-bd-color: #c6e2ff;\r\n\t--button-default-hover-bg-color: #ecf5ff;\r\n\t--button-default-focus-visible-outline-color: #a0cfff;\r\n\t--button-default-focus-visible-outline: 2px solid\r\n\t\tvar(--button-default-focus-visible-outline-color);\r\n\t--button-default-focus-visible-outline-offset: 1px;\r\n\t--button-default-disabled-color: #a8abb2;\r\n\t--button-default-disabled-bd-color: #ffffff;\r\n\t--button-default-disabled-bg-color: #e4e7ed;\r\n\r\n\t/* primary按钮 */\r\n\t--button-primary-color: #ffffff;\r\n\t--button-primary-bd-color: #409eff;\r\n\t--button-primary-bg-color: #409eff;\r\n\t--button-primary-active-color: #ffffff;\r\n\t--button-primary-active-bd-color: #337ecc;\r\n\t--button-primary-active-bg-color: #337ecc;\r\n\t--button-primary-hover-color: #ffffff;\r\n\t--button-primary-hover-bd-color: #79bbff;\r\n\t--button-primary-hover-bg-color: #79bbff;\r\n\t--button-primary-focus-visible-outline-color: #a0cfff;\r\n\t--button-primary-focus-visible-outline: 2px solid\r\n\t\tvar(--button-primary-focus-visible-outline-color);\r\n\t--button-primary-focus-visible-outline-offset: 1px;\r\n\t--button-primary-disabled-color: #ffffff80;\r\n\t--button-primary-disabled-bd-color: #a0cfff;\r\n\t--button-primary-disabled-bg-color: #a0cfff;\r\n\r\n\t/* success按钮 */\r\n\t--button-success-color: #ffffff;\r\n\t--button-success-bd-color: #4cae4c;\r\n\t--button-success-bg-color: #5cb85c;\r\n\t--button-success-active-color: #ffffff;\r\n\t--button-success-active-bd-color: #529b2e;\r\n\t--button-success-active-bg-color: #529b2e;\r\n\t--button-success-hover-color: #ffffff;\r\n\t--button-success-hover-bd-color: #95d475;\r\n\t--button-success-hover-bg-color: #95d475;\r\n\t--button-success-focus-visible-outline-color: #b3e19d;\r\n\t--button-success-focus-visible-outline: 2px solid\r\n\t\tvar(--button-success-focus-visible-outline-color);\r\n\t--button-success-focus-visible-outline-offset: 1px;\r\n\t--button-success-disabled-color: #ffffff80;\r\n\t--button-success-disabled-bd-color: #b3e19d;\r\n\t--button-success-disabled-bg-color: #b3e19d;\r\n\r\n\t/* info按钮 */\r\n\t--button-info-color: #ffffff;\r\n\t--button-info-bd-color: #909399;\r\n\t--button-info-bg-color: #909399;\r\n\t--button-info-active-color: #ffffff;\r\n\t--button-info-active-bd-color: #73767a;\r\n\t--button-info-active-bg-color: #73767a;\r\n\t--button-info-hover-color: #ffffff;\r\n\t--button-info-hover-bd-color: #b1b3b8;\r\n\t--button-info-hover-bg-color: #b1b3b8;\r\n\t--button-info-focus-visible-outline-color: #c8c9cc;\r\n\t--button-info-focus-visible-outline: 2px solid\r\n\t\tvar(--button-info-focus-visible-outline-color);\r\n\t--button-info-focus-visible-outline-offset: 1px;\r\n\t--button-info-disabled-color: #ffffff80;\r\n\t--button-info-disabled-bd-color: #c8c9cc;\r\n\t--button-info-disabled-bg-color: #c8c9cc;\r\n\r\n\t/* warning按钮 */\r\n\t--button-warning-color: #ffffff;\r\n\t--button-warning-bd-color: #e6a23c;\r\n\t--button-warning-bg-color: #e6a23c;\r\n\t--button-warning-active-color: #ffffff;\r\n\t--button-warning-active-bd-color: #b88230;\r\n\t--button-warning-active-bg-color: #b88230;\r\n\t--button-warning-hover-color: #ffffff80;\r\n\t--button-warning-hover-bd-color: #eebe77;\r\n\t--button-warning-hover-bg-color: #eebe77;\r\n\t--button-warning-focus-visible-outline-color: #f3d19e;\r\n\t--button-warning-focus-visible-outline: 2px solid\r\n\t\tvar(--button-warning-focus-visible-outline-color);\r\n\t--button-warning-focus-visible-outline-offset: 1px;\r\n\t--button-warning-disabled-color: #ffffff80;\r\n\t--button-warning-disabled-bd-color: #f3d19e;\r\n\t--button-warning-disabled-bg-color: #f3d19e;\r\n\r\n\t/* danger按钮 */\r\n\t--button-danger-color: #ffffff;\r\n\t--button-danger-bd-color: #f56c6c;\r\n\t--button-danger-bg-color: #f56c6c;\r\n\t--button-danger-active-color: #ffffff;\r\n\t--button-danger-active-bd-color: #c45656;\r\n\t--button-danger-active-bg-color: #c45656;\r\n\t--button-danger-hover-color: #ffffff;\r\n\t--button-danger-hover-bd-color: #f89898;\r\n\t--button-danger-hover-bg-color: #f89898;\r\n\t--button-danger-focus-visible-outline-color: #fab6b6;\r\n\t--button-danger-focus-visible-outline: 2px solid\r\n\t\tvar(--button-danger-focus-visible-outline-color);\r\n\t--button-danger-focus-visible-outline-offset: 1px;\r\n\t--button-danger-disabled-color: #ffffff80;\r\n\t--button-danger-disabled-bd-color: #fab6b6;\r\n\t--button-danger-disabled-bg-color: #fab6b6;\r\n\r\n\t/* xiaomi-primary按钮 */\r\n\t--button-xiaomi-primary-color: #ffffff;\r\n\t--button-xiaomi-primary-bd-color: #ff5c00;\r\n\t--button-xiaomi-primary-bg-color: #ff5c00;\r\n\t--button-xiaomi-primary-active-color: #ffffff;\r\n\t--button-xiaomi-primary-active-bd-color: #da4f00;\r\n\t--button-xiaomi-primary-active-bg-color: #da4f00;\r\n\t--button-xiaomi-primary-hover-color: #ffffff;\r\n\t--button-xiaomi-primary-hover-bd-color: #ff7e29;\r\n\t--button-xiaomi-primary-hover-bg-color: #ff7e29;\r\n\t--button-xiaomi-primary-focus-visible-outline-color: #ffa061;\r\n\t--button-xiaomi-primary-focus-visible-outline: 2px solid\r\n\t\tvar(--button-xiaomi-primary-focus-visible-outline-color);\r\n\t--button-xiaomi-primary-focus-visible-outline-offset: 1px;\r\n\t--button-xiaomi-primary-disabled-color: #ffffff80;\r\n\t--button-xiaomi-primary-disabled-bd-color: #fad5b6;\r\n\t--button-xiaomi-primary-disabled-bg-color: #fad5b6;\r\n\r\n\t/* violet按钮 */\r\n\t--button-violet-color: #ffffff;\r\n\t--button-violet-bd-color: #626aef;\r\n\t--button-violet-bg-color: #626aef;\r\n\t--button-violet-active-color: #ffffff;\r\n\t--button-violet-active-bd-color: #8188f2;\r\n\t--button-violet-active-bg-color: #8188f2;\r\n\t--button-violet-hover-color: #ffffff;\r\n\t--button-violet-hover-bd-color: #4b50ad;\r\n\t--button-violet-hover-bg-color: #4b50ad;\r\n\t--button-violet-focus-visible-outline-color: #2a598a;\r\n\t--button-violet-focus-visible-outline: 2px solid\r\n\t\tvar(--button-violet-focus-visible-outline-color);\r\n\t--button-violet-focus-visible-outline-offset: 1px;\r\n\t--button-violet-disabled-color: #ffffff80;\r\n\t--button-violet-disabled-bd-color: #3b3f82;\r\n\t--button-violet-disabled-bg-color: #3b3f82;\r\n}\r\n\r\n@media (prefers-color-scheme: dark) {\r\n\t.pops {\r\n\t\t/* default按钮 */\r\n\t\t--button-default-color: #cfd3dc;\r\n\t\t--button-default-bd-color: #4c4d4f;\r\n\t\t--button-default-bg-color: transparent;\r\n\t\t--button-default-active-color: #409eff;\r\n\t\t--button-default-active-bd-color: #409eff;\r\n\t\t--button-default-active-bg-color: #18222c;\r\n\t\t--button-default-hover-color: #409eff;\r\n\t\t--button-default-hover-bd-color: #213d5b;\r\n\t\t--button-default-hover-bg-color: #18222c;\r\n\t\t--button-default-focus-visible-outline-color: #2a598a;\r\n\t\t--button-default-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-default-focus-visible-outline-color);\r\n\t\t--button-default-focus-visible-outline-offset: 1px;\r\n\t\t--button-default-disabled-color: #ffffff80;\r\n\t\t--button-default-disabled-bd-color: #414243;\r\n\t\t--button-default-disabled-bg-color: transparent;\r\n\r\n\t\t/* primary按钮 */\r\n\t\t--button-primary-color: #ffffff;\r\n\t\t--button-primary-bd-color: #409eff;\r\n\t\t--button-primary-bg-color: #409eff;\r\n\t\t--button-primary-active-color: #ffffff;\r\n\t\t--button-primary-active-bd-color: #66b1ff;\r\n\t\t--button-primary-active-bg-color: #66b1ff;\r\n\t\t--button-primary-hover-color: #ffffff;\r\n\t\t--button-primary-hover-bd-color: #3375b9;\r\n\t\t--button-primary-hover-bg-color: #3375b9;\r\n\t\t--button-primary-focus-visible-outline-color: #2a598a;\r\n\t\t--button-primary-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-primary-focus-visible-outline-color);\r\n\t\t--button-primary-focus-visible-outline-offset: 1px;\r\n\t\t--button-primary-disabled-color: #ffffff80;\r\n\t\t--button-primary-disabled-bd-color: #2a598a;\r\n\t\t--button-primary-disabled-bg-color: #2a598a;\r\n\r\n\t\t/* success按钮 */\r\n\t\t--button-success-color: #ffffff;\r\n\t\t--button-success-bd-color: #67c23a;\r\n\t\t--button-success-bg-color: #67c23a;\r\n\t\t--button-success-active-color: #ffffff;\r\n\t\t--button-success-active-bd-color: #85ce61;\r\n\t\t--button-success-active-bg-color: #85ce61;\r\n\t\t--button-success-hover-color: #ffffff;\r\n\t\t--button-success-hover-bd-color: #4e8e2f;\r\n\t\t--button-success-hover-bg-color: #4e8e2f;\r\n\t\t--button-success-focus-visible-outline-color: #3e6b27;\r\n\t\t--button-success-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-success-focus-visible-outline-color);\r\n\t\t--button-success-focus-visible-outline-offset: 1px;\r\n\t\t--button-success-disabled-color: #ffffff80;\r\n\t\t--button-success-disabled-bd-color: #3e6b27;\r\n\t\t--button-success-disabled-bg-color: #3e6b27;\r\n\r\n\t\t/* info按钮 */\r\n\t\t--button-info-color: #ffffff;\r\n\t\t--button-info-bd-color: #909399;\r\n\t\t--button-info-bg-color: #909399;\r\n\t\t--button-info-active-color: #ffffff;\r\n\t\t--button-info-active-bd-color: #a6a9ad;\r\n\t\t--button-info-active-bg-color: #a6a9ad;\r\n\t\t--button-info-hover-color: #ffffff;\r\n\t\t--button-info-hover-bd-color: #6b6d71;\r\n\t\t--button-info-hover-bg-color: #6b6d71;\r\n\t\t--button-info-focus-visible-outline-color: #525457;\r\n\t\t--button-info-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-info-focus-visible-outline-color);\r\n\t\t--button-info-focus-visible-outline-offset: 1px;\r\n\t\t--button-info-disabled-color: #ffffff80;\r\n\t\t--button-info-disabled-bd-color: #525457;\r\n\t\t--button-info-disabled-bg-color: #525457;\r\n\r\n\t\t/* warning按钮 */\r\n\t\t--button-warning-color: #ffffff;\r\n\t\t--button-warning-bd-color: #e6a23c;\r\n\t\t--button-warning-bg-color: #e6a23c;\r\n\t\t--button-warning-active-color: #ffffff;\r\n\t\t--button-warning-active-bd-color: #ebb563;\r\n\t\t--button-warning-active-bg-color: #ebb563;\r\n\t\t--button-warning-hover-color: #ffffff80;\r\n\t\t--button-warning-hover-bd-color: #a77730;\r\n\t\t--button-warning-hover-bg-color: #a77730;\r\n\t\t--button-warning-focus-visible-outline-color: #7d5b28;\r\n\t\t--button-warning-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-warning-focus-visible-outline-color);\r\n\t\t--button-warning-focus-visible-outline-offset: 1px;\r\n\t\t--button-warning-disabled-color: #ffffff80;\r\n\t\t--button-warning-disabled-bd-color: #7d5b28;\r\n\t\t--button-warning-disabled-bg-color: #7d5b28;\r\n\r\n\t\t/* danger按钮 */\r\n\t\t--button-danger-color: #ffffff;\r\n\t\t--button-danger-bd-color: #f56c6c;\r\n\t\t--button-danger-bg-color: #f56c6c;\r\n\t\t--button-danger-active-color: #ffffff;\r\n\t\t--button-danger-active-bd-color: #f78989;\r\n\t\t--button-danger-active-bg-color: #f78989;\r\n\t\t--button-danger-hover-color: #ffffff;\r\n\t\t--button-danger-hover-bd-color: #b25252;\r\n\t\t--button-danger-hover-bg-color: #b25252;\r\n\t\t--button-danger-focus-visible-outline-color: #854040;\r\n\t\t--button-danger-focus-visible-outline: 2px solid\r\n\t\t\tvar(--button-danger-focus-visible-outline-color);\r\n\t\t--button-danger-focus-visible-outline-offset: 1px;\r\n\t\t--button-danger-disabled-color: #ffffff80;\r\n\t\t--button-danger-disabled-bd-color: #854040;\r\n\t\t--button-danger-disabled-bg-color: #854040;\r\n\t}\r\n}\r\n.pops[data-bottom-btn=\"false\"] {\r\n\t--container-bottom-btn-height: 0px;\r\n}\r\n.pops button {\r\n\twhite-space: nowrap;\r\n\tfloat: right;\r\n\tdisplay: inline-block;\r\n\tmargin: var(--button-margin-top) var(--button-margin-right)\r\n\t\tvar(--button-margin-bottom) var(--button-margin-left);\r\n\tpadding: var(--button-padding-top) var(--button-padding-right)\r\n\t\tvar(--button-padding-bottom) var(--button-padding-left);\r\n\toutline: 0;\r\n}\r\n.pops button[data-has-icon=\"false\"] .pops-bottom-icon {\r\n\tdisplay: none;\r\n}\r\n.pops button {\r\n\tborder-radius: var(--button-radius);\r\n\tbox-shadow: none;\r\n\tfont-weight: 400;\r\n\tfont-size: var(--button-font-size);\r\n\tcursor: pointer;\r\n\ttransition: all 0.3s ease-in-out;\r\n}\r\n.pops button {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\theight: var(--button-height);\r\n\tline-height: normal;\r\n\tbox-sizing: border-box;\r\n\tuser-select: none;\r\n\t-webkit-user-select: none;\r\n\t-moz-user-select: none;\r\n\t-ms-user-select: none;\r\n\tborder: 1px solid var(--button-bd-color);\r\n}\r\n.pops button {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:active {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n\toutline: 0;\r\n}\r\n.pops button:hover {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:focus-visible {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:disabled {\r\n\tcursor: not-allowed;\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button.pops-button-large {\r\n\t--button-height: 32px;\r\n\t--button-padding-top: 12px;\r\n\t--button-padding-bottom: 12px;\r\n\t--button-padding-left: 19px;\r\n\t--button-padding-right: 19px;\r\n\t--button-font-size: 14px;\r\n\t--button-border-radius: 4px;\r\n}\r\n\r\n.pops button.pops-button-small {\r\n\t--button-height: 24px;\r\n\t--button-padding-top: 5px;\r\n\t--button-padding-bottom: 5px;\r\n\t--button-padding-left: 11px;\r\n\t--button-padding-right: 11px;\r\n\t--button-font-size: 12px;\r\n\t--button-border-radius: 4px;\r\n}\r\n.pops-panel-button-no-icon .pops-panel-button_inner i {\r\n\tdisplay: none;\r\n}\r\n.pops-panel-button-right-icon {\r\n}\r\n.pops-panel-button-right-icon .pops-panel-button_inner {\r\n\tflex-direction: row-reverse;\r\n}\r\n.pops-panel-button-right-icon .pops-panel-button_inner i {\r\n}\r\n.pops-panel-button .pops-panel-button_inner i:has(svg),\r\n.pops-panel-button-right-icon .pops-panel-button-text {\r\n\tmargin-right: 6px;\r\n}\r\n\r\n.pops button[type=\"default\"] {\r\n\t--button-color: var(--button-default-color);\r\n\t--button-bd-color: var(--button-default-bd-color);\r\n\t--button-bg-color: var(--button-default-bg-color);\r\n}\r\n.pops button[type=\"default\"]:active {\r\n\t--button-color: var(--button-default-active-color);\r\n\t--button-bd-color: var(--button-default-active-bd-color);\r\n\t--button-bg-color: var(--button-default-active-bg-color);\r\n}\r\n.pops button[type=\"default\"]:hover {\r\n\t--button-color: var(--button-default-hover-color);\r\n\t--button-bd-color: var(--button-default-hover-bd-color);\r\n\t--button-bg-color: var(--button-default-hover-bg-color);\r\n}\r\n.pops button[type=\"default\"]:focus-visible {\r\n\toutline: var(--button-default-focus-visible-outline);\r\n\toutline-offset: var(--button-default-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"default\"]:disabled {\r\n\t--button-color: var(--button-default-disabled-color);\r\n\t--button-bd-color: var(--button-default-disabled-bd-color);\r\n\t--button-bg-color: var(--button-default-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"primary\"] {\r\n\t--button-color: var(--button-primary-color);\r\n\t--button-bd-color: var(--button-primary-bd-color);\r\n\t--button-bg-color: var(--button-primary-bg-color);\r\n}\r\n.pops button[type=\"primary\"]:active {\r\n\t--button-color: var(--button-primary-active-color);\r\n\t--button-bd-color: var(--button-primary-active-bd-color);\r\n\t--button-bg-color: var(--button-primary-active-bg-color);\r\n}\r\n.pops button[type=\"primary\"]:hover {\r\n\t--button-color: var(--button-primary-hover-color);\r\n\t--button-bd-color: var(--button-primary-hover-bd-color);\r\n\t--button-bg-color: var(--button-primary-hover-bg-color);\r\n}\r\n.pops button[type=\"primary\"]:focus-visible {\r\n\toutline: var(--button-primary-focus-visible-outline);\r\n\toutline-offset: var(--button-primary-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"primary\"]:disabled {\r\n\t--button-color: var(--button-primary-disabled-color);\r\n\t--button-bd-color: var(--button-primary-disabled-bd-color);\r\n\t--button-bg-color: var(--button-primary-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"success\"] {\r\n\t--button-color: var(--button-success-color);\r\n\t--button-bd-color: var(--button-success-bd-color);\r\n\t--button-bg-color: var(--button-success-bg-color);\r\n}\r\n.pops button[type=\"success\"]:active {\r\n\t--button-color: var(--button-success-active-color);\r\n\t--button-bd-color: var(--button-success-active-bd-color);\r\n\t--button-bg-color: var(--button-success-active-bg-color);\r\n}\r\n.pops button[type=\"success\"]:hover {\r\n\t--button-color: var(--button-success-hover-color);\r\n\t--button-bd-color: var(--button-success-hover-bd-color);\r\n\t--button-bg-color: var(--button-success-hover-bg-color);\r\n}\r\n.pops button[type=\"success\"]:focus-visible {\r\n\toutline: var(--button-success-focus-visible-outline);\r\n\toutline-offset: var(--button-success-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"success\"]:disabled {\r\n\t--button-color: var(--button-success-disabled-color);\r\n\t--button-bd-color: var(--button-success-disabled-bd-color);\r\n\t--button-bg-color: var(--button-success-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"info\"] {\r\n\t--button-color: var(--button-info-color);\r\n\t--button-bd-color: var(--button-info-bd-color);\r\n\t--button-bg-color: var(--button-info-bg-color);\r\n}\r\n.pops button[type=\"info\"]:active {\r\n\t--button-color: var(--button-info-active-color);\r\n\t--button-bd-color: var(--button-info-active-bd-color);\r\n\t--button-bg-color: var(--button-info-active-bg-color);\r\n}\r\n.pops button[type=\"info\"]:hover {\r\n\t--button-color: var(--button-info-hover-color);\r\n\t--button-bd-color: var(--button-info-hover-bd-color);\r\n\t--button-bg-color: var(--button-info-hover-bg-color);\r\n}\r\n.pops button[type=\"info\"]:focus-visible {\r\n\toutline: var(--button-info-focus-visible-outline);\r\n\toutline-offset: var(--button-info-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"info\"]:disabled {\r\n\t--button-color: var(--button-success-disabled-color);\r\n\t--button-bd-color: var(--button-success-disabled-bd-color);\r\n\t--button-bg-color: var(--button-success-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"warning\"] {\r\n\t--button-color: var(--button-warning-color);\r\n\t--button-bd-color: var(--button-warning-bd-color);\r\n\t--button-bg-color: var(--button-warning-bg-color);\r\n}\r\n.pops button[type=\"warning\"]:active {\r\n\t--button-color: var(--button-warning-active-color);\r\n\t--button-bd-color: var(--button-warning-active-bd-color);\r\n\t--button-bg-color: var(--button-warning-active-bg-color);\r\n}\r\n.pops button[type=\"warning\"]:hover {\r\n\t--button-color: var(--button-warning-hover-color);\r\n\t--button-bd-color: var(--button-warning-hover-bd-color);\r\n\t--button-bg-color: var(--button-warning-hover-bg-color);\r\n}\r\n.pops button[type=\"warning\"]:focus-visible {\r\n\toutline: var(--button-warning-focus-visible-outline);\r\n\toutline-offset: var(--button-warning-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"warning\"]:disabled {\r\n\t--button-color: var(--button-success-disabled-color);\r\n\t--button-bd-color: var(--button-success-disabled-bd-color);\r\n\t--button-bg-color: var(--button-success-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"danger\"] {\r\n\t--button-color: var(--button-danger-color);\r\n\t--button-bd-color: var(--button-danger-bd-color);\r\n\t--button-bg-color: var(--button-danger-bg-color);\r\n}\r\n.pops button[type=\"danger\"]:active {\r\n\t--button-color: var(--button-danger-active-color);\r\n\t--button-bd-color: var(--button-danger-active-bd-color);\r\n\t--button-bg-color: var(--button-danger-active-bg-color);\r\n}\r\n.pops button[type=\"danger\"]:hover {\r\n\t--button-color: var(--button-danger-hover-color);\r\n\t--button-bd-color: var(--button-danger-hover-bd-color);\r\n\t--button-bg-color: var(--button-danger-hover-bg-color);\r\n}\r\n.pops button[type=\"danger\"]:focus-visible {\r\n\toutline: var(--button-danger-focus-visible-outline);\r\n\toutline-offset: var(--button-danger-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"danger\"]:disabled {\r\n\t--button-color: var(--button-success-disabled-color);\r\n\t--button-bd-color: var(--button-success-disabled-bd-color);\r\n\t--button-bg-color: var(--button-success-disabled-bg-color);\r\n}\r\n\r\n.pops button[type=\"xiaomi-primary\"] {\r\n\t--button-color: var(--button-xiaomi-primary-color);\r\n\t--button-bd-color: var(--button-xiaomi-primary-bd-color);\r\n\t--button-bg-color: var(--button-xiaomi-primary-bg-color);\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:active {\r\n\t--button-color: var(--button-xiaomi-primary-active-color);\r\n\t--button-bd-color: var(--button-xiaomi-primary-active-bd-color);\r\n\t--button-bg-color: var(--button-xiaomi-primary-active-bg-color);\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:hover {\r\n\t--button-color: var(--button-xiaomi-primary-hover-color);\r\n\t--button-bd-color: var(--button-xiaomi-primary-hover-bd-color);\r\n\t--button-bg-color: var(--button-xiaomi-primary-hover-bg-color);\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:focus-visible {\r\n\toutline: var(--button-xiaomi-primary-focus-visible-outline);\r\n\toutline-offset: var(--button-xiaomi-primary-focus-visible-outline-offset);\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:disabled {\r\n\t--button-color: var(--button-success-disabled-color);\r\n\t--button-bd-color: var(--button-success-disabled-bd-color);\r\n\t--button-bg-color: var(--button-success-disabled-bg-color);\r\n}\r\n";
|
|
2364
2367
|
|
|
@@ -2546,18 +2549,18 @@ define((function () { 'use strict';
|
|
|
2546
2549
|
function isVisibleNode($css) {
|
|
2547
2550
|
return $css.position !== "static" && $css.display !== "none";
|
|
2548
2551
|
}
|
|
2549
|
-
Object.keys(
|
|
2550
|
-
let
|
|
2551
|
-
for (let index = 0; index <
|
|
2552
|
-
const
|
|
2553
|
-
let nodeStyle = window.getComputedStyle(
|
|
2552
|
+
Object.keys(PopsInstData).forEach((instKeyName) => {
|
|
2553
|
+
let instData = PopsInstData[instKeyName];
|
|
2554
|
+
for (let index = 0; index < instData.length; index++) {
|
|
2555
|
+
const inst = instData[index];
|
|
2556
|
+
let nodeStyle = window.getComputedStyle(inst.animElement);
|
|
2554
2557
|
/* 不对position为static和display为none的元素进行获取它们的z-index */
|
|
2555
2558
|
if (isVisibleNode(nodeStyle)) {
|
|
2556
2559
|
let nodeZIndex = parseInt(nodeStyle.zIndex);
|
|
2557
2560
|
if (!isNaN(nodeZIndex)) {
|
|
2558
2561
|
if (nodeZIndex > zIndex) {
|
|
2559
2562
|
zIndex = nodeZIndex;
|
|
2560
|
-
maxZIndexNode =
|
|
2563
|
+
maxZIndexNode = inst.animElement;
|
|
2561
2564
|
}
|
|
2562
2565
|
}
|
|
2563
2566
|
}
|
|
@@ -2583,69 +2586,69 @@ define((function () { 'use strict';
|
|
|
2583
2586
|
},
|
|
2584
2587
|
/**
|
|
2585
2588
|
* 删除配置中对应的对象
|
|
2586
|
-
* @param
|
|
2589
|
+
* @param instConfigList 配置实例列表
|
|
2587
2590
|
* @param guid 唯一标识
|
|
2588
2591
|
* @param isAll 是否全部删除
|
|
2589
2592
|
*/
|
|
2590
|
-
removeInstance(
|
|
2593
|
+
removeInstance(instConfigList, guid, isAll = false) {
|
|
2591
2594
|
/**
|
|
2592
2595
|
* 移除元素实例
|
|
2593
|
-
* @param
|
|
2596
|
+
* @param instCommonConfig
|
|
2594
2597
|
*/
|
|
2595
|
-
function removeItem(
|
|
2596
|
-
if (typeof
|
|
2598
|
+
function removeItem(instCommonConfig) {
|
|
2599
|
+
if (typeof instCommonConfig.beforeRemoveCallBack === "function") {
|
|
2597
2600
|
// 调用移除签的回调
|
|
2598
|
-
|
|
2601
|
+
instCommonConfig.beforeRemoveCallBack(instCommonConfig);
|
|
2599
2602
|
}
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
|
|
2603
|
-
|
|
2603
|
+
instCommonConfig?.animElement?.remove();
|
|
2604
|
+
instCommonConfig?.popsElement?.remove();
|
|
2605
|
+
instCommonConfig?.maskElement?.remove();
|
|
2606
|
+
instCommonConfig?.$shadowContainer?.remove();
|
|
2604
2607
|
}
|
|
2605
|
-
// [
|
|
2606
|
-
|
|
2607
|
-
//
|
|
2608
|
-
|
|
2608
|
+
// [ inst[], inst[],...]
|
|
2609
|
+
instConfigList.forEach((instConfigList) => {
|
|
2610
|
+
// inst[]
|
|
2611
|
+
instConfigList.forEach((instConfigItem, index) => {
|
|
2609
2612
|
// 移除全部或者guid相同
|
|
2610
|
-
if (isAll ||
|
|
2613
|
+
if (isAll || instConfigItem["guid"] === guid) {
|
|
2611
2614
|
// 判断是否有动画
|
|
2612
|
-
let animName =
|
|
2615
|
+
let animName = instConfigItem.animElement.getAttribute("anim");
|
|
2613
2616
|
if (PopsAnimation.hasAnim(animName)) {
|
|
2614
2617
|
let reverseAnimName = animName + "-reverse";
|
|
2615
|
-
|
|
2616
|
-
|
|
2617
|
-
|
|
2618
|
+
instConfigItem.animElement.style.width = "100%";
|
|
2619
|
+
instConfigItem.animElement.style.height = "100%";
|
|
2620
|
+
instConfigItem.animElement.style["animation-name"] =
|
|
2618
2621
|
reverseAnimName;
|
|
2619
|
-
if (PopsAnimation.hasAnim(
|
|
2620
|
-
popsDOMUtils.on(
|
|
2621
|
-
removeItem(
|
|
2622
|
+
if (PopsAnimation.hasAnim(instConfigItem.animElement.style["animation-name"])) {
|
|
2623
|
+
popsDOMUtils.on(instConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), function () {
|
|
2624
|
+
removeItem(instConfigItem);
|
|
2622
2625
|
}, {
|
|
2623
2626
|
capture: true,
|
|
2624
2627
|
});
|
|
2625
2628
|
}
|
|
2626
2629
|
else {
|
|
2627
|
-
removeItem(
|
|
2630
|
+
removeItem(instConfigItem);
|
|
2628
2631
|
}
|
|
2629
2632
|
}
|
|
2630
2633
|
else {
|
|
2631
|
-
removeItem(
|
|
2634
|
+
removeItem(instConfigItem);
|
|
2632
2635
|
}
|
|
2633
|
-
|
|
2636
|
+
instConfigList.splice(index, 1);
|
|
2634
2637
|
}
|
|
2635
2638
|
});
|
|
2636
2639
|
});
|
|
2637
|
-
return
|
|
2640
|
+
return instConfigList;
|
|
2638
2641
|
},
|
|
2639
2642
|
/**
|
|
2640
2643
|
* 隐藏
|
|
2641
2644
|
* @param popsType
|
|
2642
|
-
* @param
|
|
2645
|
+
* @param instConfigList
|
|
2643
2646
|
* @param guid
|
|
2644
2647
|
* @param config
|
|
2645
2648
|
* @param animElement
|
|
2646
2649
|
* @param maskElement
|
|
2647
2650
|
*/
|
|
2648
|
-
hide(popsType,
|
|
2651
|
+
hide(popsType, instConfigList, guid, config, animElement, maskElement) {
|
|
2649
2652
|
return new Promise((resolve) => {
|
|
2650
2653
|
let popsElement = animElement.querySelector(".pops[type-value]");
|
|
2651
2654
|
if (popsType === "drawer") {
|
|
@@ -2665,36 +2668,39 @@ define((function () { 'use strict';
|
|
|
2665
2668
|
}, drawerConfig.closeDelay);
|
|
2666
2669
|
}
|
|
2667
2670
|
else {
|
|
2668
|
-
let
|
|
2669
|
-
if (
|
|
2671
|
+
let fintInst = instConfigList.find((instConfigItem) => instConfigItem.guid === guid);
|
|
2672
|
+
if (fintInst) {
|
|
2670
2673
|
/* 存在动画 */
|
|
2671
|
-
let
|
|
2672
|
-
|
|
2673
|
-
|
|
2674
|
-
|
|
2675
|
-
|
|
2676
|
-
|
|
2674
|
+
let instConfigItem = fintInst;
|
|
2675
|
+
instConfigItem.animElement.style.width = "100%";
|
|
2676
|
+
instConfigItem.animElement.style.height = "100%";
|
|
2677
|
+
// @ts-ignore
|
|
2678
|
+
instConfigItem.animElement.style["animation-name"] =
|
|
2679
|
+
instConfigItem.animElement.getAttribute("anim") + "-reverse";
|
|
2680
|
+
if (PopsAnimation.hasAnim(
|
|
2681
|
+
// @ts-ignore
|
|
2682
|
+
instConfigItem.animElement.style["animation-name"])) {
|
|
2677
2683
|
/**
|
|
2678
2684
|
* 动画结束的回调
|
|
2679
2685
|
*/
|
|
2680
2686
|
function animationendCallBack() {
|
|
2681
|
-
|
|
2682
|
-
if (
|
|
2683
|
-
|
|
2687
|
+
instConfigItem.animElement.style.display = "none";
|
|
2688
|
+
if (instConfigItem.maskElement) {
|
|
2689
|
+
instConfigItem.maskElement.style.display = "none";
|
|
2684
2690
|
}
|
|
2685
|
-
popsDOMUtils.off(
|
|
2691
|
+
popsDOMUtils.off(instConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
2686
2692
|
capture: true,
|
|
2687
2693
|
});
|
|
2688
2694
|
resolve();
|
|
2689
2695
|
}
|
|
2690
|
-
popsDOMUtils.on(
|
|
2696
|
+
popsDOMUtils.on(instConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
2691
2697
|
capture: true,
|
|
2692
2698
|
});
|
|
2693
2699
|
}
|
|
2694
2700
|
else {
|
|
2695
|
-
|
|
2696
|
-
if (
|
|
2697
|
-
|
|
2701
|
+
instConfigItem.animElement.style.display = "none";
|
|
2702
|
+
if (instConfigItem.maskElement) {
|
|
2703
|
+
instConfigItem.maskElement.style.display = "none";
|
|
2698
2704
|
}
|
|
2699
2705
|
resolve();
|
|
2700
2706
|
}
|
|
@@ -2705,13 +2711,13 @@ define((function () { 'use strict';
|
|
|
2705
2711
|
/**
|
|
2706
2712
|
* 显示
|
|
2707
2713
|
* @param popsType
|
|
2708
|
-
* @param
|
|
2714
|
+
* @param instConfigList
|
|
2709
2715
|
* @param guid
|
|
2710
2716
|
* @param config
|
|
2711
2717
|
* @param animElement
|
|
2712
2718
|
* @param maskElement
|
|
2713
2719
|
*/
|
|
2714
|
-
show(popsType,
|
|
2720
|
+
show(popsType, instConfigList, guid, config, animElement, maskElement) {
|
|
2715
2721
|
return new Promise((resolve) => {
|
|
2716
2722
|
let popsElement = animElement.querySelector(".pops[type-value]");
|
|
2717
2723
|
if (popsType === "drawer") {
|
|
@@ -2733,37 +2739,39 @@ define((function () { 'use strict';
|
|
|
2733
2739
|
}, drawerConfig.openDelay ?? 0);
|
|
2734
2740
|
}
|
|
2735
2741
|
else {
|
|
2736
|
-
let
|
|
2737
|
-
if (
|
|
2738
|
-
let
|
|
2739
|
-
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
if (PopsAnimation.hasAnim(
|
|
2742
|
+
let fintInst = instConfigList.find((instConfigItem) => instConfigItem.guid === guid);
|
|
2743
|
+
if (fintInst) {
|
|
2744
|
+
let instConfigItem = fintInst;
|
|
2745
|
+
instConfigItem.animElement.style.width = "";
|
|
2746
|
+
instConfigItem.animElement.style.height = "";
|
|
2747
|
+
// @ts-ignore
|
|
2748
|
+
instConfigItem.animElement.style["animation-name"] = instConfigItem
|
|
2749
|
+
.animElement.getAttribute("anim")
|
|
2750
|
+
.replace("-reverse", "");
|
|
2751
|
+
if (PopsAnimation.hasAnim(
|
|
2752
|
+
// @ts-ignore
|
|
2753
|
+
instConfigItem.animElement.style["animation-name"])) {
|
|
2746
2754
|
/**
|
|
2747
2755
|
* 动画结束的回调
|
|
2748
2756
|
*/
|
|
2749
2757
|
function animationendCallBack() {
|
|
2750
|
-
popsDOMUtils.off(
|
|
2758
|
+
popsDOMUtils.off(instConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
2751
2759
|
capture: true,
|
|
2752
2760
|
});
|
|
2753
2761
|
resolve();
|
|
2754
2762
|
}
|
|
2755
|
-
|
|
2756
|
-
if (
|
|
2757
|
-
|
|
2763
|
+
instConfigItem.animElement.style.display = "";
|
|
2764
|
+
if (instConfigItem.maskElement) {
|
|
2765
|
+
instConfigItem.maskElement.style.display = "";
|
|
2758
2766
|
}
|
|
2759
|
-
popsDOMUtils.on(
|
|
2767
|
+
popsDOMUtils.on(instConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
2760
2768
|
capture: true,
|
|
2761
2769
|
});
|
|
2762
2770
|
}
|
|
2763
2771
|
else {
|
|
2764
|
-
|
|
2765
|
-
if (
|
|
2766
|
-
|
|
2772
|
+
instConfigItem.animElement.style.display = "";
|
|
2773
|
+
if (instConfigItem.maskElement) {
|
|
2774
|
+
instConfigItem.maskElement.style.display = "";
|
|
2767
2775
|
}
|
|
2768
2776
|
resolve();
|
|
2769
2777
|
}
|
|
@@ -2774,12 +2782,12 @@ define((function () { 'use strict';
|
|
|
2774
2782
|
/**
|
|
2775
2783
|
* 关闭
|
|
2776
2784
|
* @param popsType
|
|
2777
|
-
* @param
|
|
2785
|
+
* @param instConfigList
|
|
2778
2786
|
* @param guid
|
|
2779
2787
|
* @param config
|
|
2780
2788
|
* @param animElement
|
|
2781
2789
|
*/
|
|
2782
|
-
close(popsType,
|
|
2790
|
+
close(popsType, instConfigList, guid, config, animElement) {
|
|
2783
2791
|
return new Promise((resolve) => {
|
|
2784
2792
|
let popsElement = animElement.querySelector(".pops[type-value]");
|
|
2785
2793
|
let drawerConfig = config;
|
|
@@ -2795,7 +2803,7 @@ define((function () { 'use strict';
|
|
|
2795
2803
|
return;
|
|
2796
2804
|
}
|
|
2797
2805
|
popsDOMUtils.off(popsElement, popsDOMUtils.getTransitionEndNameList(), void 0, closeCallBack);
|
|
2798
|
-
PopsInstanceUtils.removeInstance([
|
|
2806
|
+
PopsInstanceUtils.removeInstance([instConfigList], guid);
|
|
2799
2807
|
resolve();
|
|
2800
2808
|
}
|
|
2801
2809
|
/* 监听过渡结束 */
|
|
@@ -2827,7 +2835,7 @@ define((function () { 'use strict';
|
|
|
2827
2835
|
}, drawerConfig.closeDelay);
|
|
2828
2836
|
}
|
|
2829
2837
|
else {
|
|
2830
|
-
PopsInstanceUtils.removeInstance([
|
|
2838
|
+
PopsInstanceUtils.removeInstance([instConfigList], guid);
|
|
2831
2839
|
resolve();
|
|
2832
2840
|
}
|
|
2833
2841
|
});
|
|
@@ -3610,15 +3618,15 @@ define((function () { 'use strict';
|
|
|
3610
3618
|
function clickEvent(event) {
|
|
3611
3619
|
popsDOMUtils.preventEvent(event);
|
|
3612
3620
|
// 获取该类型实例存储列表
|
|
3613
|
-
let
|
|
3621
|
+
let targetInst = PopsInstData[details.type];
|
|
3614
3622
|
function originalRun() {
|
|
3615
3623
|
if (details.config.mask.clickEvent.toClose) {
|
|
3616
3624
|
/* 关闭 */
|
|
3617
|
-
return PopsInstanceUtils.close(details.type,
|
|
3625
|
+
return PopsInstanceUtils.close(details.type, targetInst, details.guid, details.config, details.animElement);
|
|
3618
3626
|
}
|
|
3619
3627
|
else if (details.config.mask.clickEvent.toHide) {
|
|
3620
3628
|
/* 隐藏 */
|
|
3621
|
-
return PopsInstanceUtils.hide(details.type,
|
|
3629
|
+
return PopsInstanceUtils.hide(details.type, targetInst, details.guid, details.config, details.animElement, result.maskElement);
|
|
3622
3630
|
}
|
|
3623
3631
|
}
|
|
3624
3632
|
if (typeof details.config.mask.clickCallBack === "function") {
|
|
@@ -3797,13 +3805,13 @@ define((function () { 'use strict';
|
|
|
3797
3805
|
mode: mode,
|
|
3798
3806
|
guid: guid,
|
|
3799
3807
|
close() {
|
|
3800
|
-
return PopsInstanceUtils.close(mode,
|
|
3808
|
+
return PopsInstanceUtils.close(mode, PopsInstData[mode], guid, config, animElement);
|
|
3801
3809
|
},
|
|
3802
3810
|
hide() {
|
|
3803
|
-
return PopsInstanceUtils.hide(mode,
|
|
3811
|
+
return PopsInstanceUtils.hide(mode, PopsInstData[mode], guid, config, animElement, maskElement);
|
|
3804
3812
|
},
|
|
3805
3813
|
show() {
|
|
3806
|
-
return PopsInstanceUtils.show(mode,
|
|
3814
|
+
return PopsInstanceUtils.show(mode, PopsInstData[mode], guid, config, animElement, maskElement);
|
|
3807
3815
|
},
|
|
3808
3816
|
};
|
|
3809
3817
|
},
|
|
@@ -3825,13 +3833,13 @@ define((function () { 'use strict';
|
|
|
3825
3833
|
mode: mode,
|
|
3826
3834
|
guid: guid,
|
|
3827
3835
|
close() {
|
|
3828
|
-
return PopsInstanceUtils.close(mode,
|
|
3836
|
+
return PopsInstanceUtils.close(mode, PopsInstData[mode], guid, config, animElement);
|
|
3829
3837
|
},
|
|
3830
3838
|
hide() {
|
|
3831
|
-
return PopsInstanceUtils.hide(mode,
|
|
3839
|
+
return PopsInstanceUtils.hide(mode, PopsInstData[mode], guid, config, animElement, maskElement);
|
|
3832
3840
|
},
|
|
3833
3841
|
show() {
|
|
3834
|
-
return PopsInstanceUtils.show(mode,
|
|
3842
|
+
return PopsInstanceUtils.show(mode, PopsInstData[mode], guid, config, animElement, maskElement);
|
|
3835
3843
|
},
|
|
3836
3844
|
};
|
|
3837
3845
|
},
|
|
@@ -3940,23 +3948,27 @@ define((function () { 'use strict';
|
|
|
3940
3948
|
*/
|
|
3941
3949
|
handleOnly(type, config) {
|
|
3942
3950
|
if (config.only) {
|
|
3951
|
+
// .loading
|
|
3952
|
+
// .tooltip
|
|
3953
|
+
// .rightClickMenu
|
|
3954
|
+
// 单独处理
|
|
3943
3955
|
if (type === "loading" ||
|
|
3944
3956
|
type === "tooltip" ||
|
|
3945
3957
|
type === "rightClickMenu") {
|
|
3946
|
-
let
|
|
3947
|
-
if (
|
|
3948
|
-
PopsInstanceUtils.removeInstance([
|
|
3958
|
+
let inst = PopsInstData[type];
|
|
3959
|
+
if (inst) {
|
|
3960
|
+
PopsInstanceUtils.removeInstance([inst], "", true);
|
|
3949
3961
|
}
|
|
3950
3962
|
}
|
|
3951
3963
|
else {
|
|
3952
3964
|
PopsInstanceUtils.removeInstance([
|
|
3953
|
-
|
|
3954
|
-
|
|
3955
|
-
|
|
3956
|
-
|
|
3957
|
-
|
|
3958
|
-
|
|
3959
|
-
|
|
3965
|
+
PopsInstData.alert,
|
|
3966
|
+
PopsInstData.confirm,
|
|
3967
|
+
PopsInstData.prompt,
|
|
3968
|
+
PopsInstData.iframe,
|
|
3969
|
+
PopsInstData.drawer,
|
|
3970
|
+
PopsInstData.folder,
|
|
3971
|
+
PopsInstData.panel,
|
|
3960
3972
|
], "", true);
|
|
3961
3973
|
}
|
|
3962
3974
|
}
|
|
@@ -3977,7 +3989,7 @@ define((function () { 'use strict';
|
|
|
3977
3989
|
* @param value
|
|
3978
3990
|
*/
|
|
3979
3991
|
handlePush(type, value) {
|
|
3980
|
-
|
|
3992
|
+
PopsInstData[type].push(value);
|
|
3981
3993
|
},
|
|
3982
3994
|
};
|
|
3983
3995
|
|
|
@@ -4046,11 +4058,11 @@ define((function () { 'use strict';
|
|
|
4046
4058
|
init(details) {
|
|
4047
4059
|
const guid = popsUtils.getRandomGUID();
|
|
4048
4060
|
// 设置当前类型
|
|
4049
|
-
const
|
|
4061
|
+
const popsType = "alert";
|
|
4050
4062
|
let config = PopsAlertConfig();
|
|
4051
4063
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4052
4064
|
config = popsUtils.assign(config, details);
|
|
4053
|
-
config = PopsHandler.handleOnly(
|
|
4065
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4054
4066
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4055
4067
|
PopsHandler.handleInit($shadowRoot, [
|
|
4056
4068
|
{
|
|
@@ -4085,23 +4097,23 @@ define((function () { 'use strict';
|
|
|
4085
4097
|
// 先把z-index提取出来
|
|
4086
4098
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4087
4099
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4088
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4089
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4090
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4091
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4092
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4100
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4101
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4102
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4103
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4104
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4093
4105
|
/*html*/ `
|
|
4094
|
-
<div class="pops-title pops-${
|
|
4106
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4095
4107
|
? config.title.text
|
|
4096
|
-
: `<p pops class="pops-${
|
|
4097
|
-
<div class="pops-content pops-${
|
|
4108
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4109
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
4098
4110
|
? config.content.text
|
|
4099
|
-
: `<p pops class="pops-${
|
|
4111
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4100
4112
|
/**
|
|
4101
4113
|
* 弹窗的主元素，包括动画层
|
|
4102
4114
|
*/
|
|
4103
4115
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4104
|
-
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, btnOkElement, titleElement: $title, } = PopsHandler.handleQueryElement($anim,
|
|
4116
|
+
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, btnOkElement, titleElement: $title, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4105
4117
|
/** 遮罩层元素 */
|
|
4106
4118
|
let $mask = null;
|
|
4107
4119
|
/** 已创建的元素列表 */
|
|
@@ -4109,7 +4121,7 @@ define((function () { 'use strict';
|
|
|
4109
4121
|
/* 遮罩层元素 */
|
|
4110
4122
|
if (config.mask.enable) {
|
|
4111
4123
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4112
|
-
type:
|
|
4124
|
+
type: popsType,
|
|
4113
4125
|
guid: guid,
|
|
4114
4126
|
config: config,
|
|
4115
4127
|
animElement: $anim,
|
|
@@ -4119,7 +4131,7 @@ define((function () { 'use strict';
|
|
|
4119
4131
|
elementList.push($mask);
|
|
4120
4132
|
}
|
|
4121
4133
|
/* 处理返回的配置 */
|
|
4122
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4134
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4123
4135
|
/* 为顶部右边的关闭按钮添加点击事件 */
|
|
4124
4136
|
PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
|
|
4125
4137
|
/* 为底部ok按钮添加点击事件 */
|
|
@@ -4135,7 +4147,7 @@ define((function () { 'use strict';
|
|
|
4135
4147
|
$anim.after($mask);
|
|
4136
4148
|
}
|
|
4137
4149
|
/* 保存 */
|
|
4138
|
-
PopsHandler.handlePush(
|
|
4150
|
+
PopsHandler.handlePush(popsType, {
|
|
4139
4151
|
guid: guid,
|
|
4140
4152
|
animElement: $anim,
|
|
4141
4153
|
popsElement: $pops,
|
|
@@ -4250,11 +4262,11 @@ define((function () { 'use strict';
|
|
|
4250
4262
|
init(details) {
|
|
4251
4263
|
const guid = popsUtils.getRandomGUID();
|
|
4252
4264
|
// 设置当前类型
|
|
4253
|
-
const
|
|
4265
|
+
const popsType = "confirm";
|
|
4254
4266
|
let config = PopsConfirmConfig();
|
|
4255
4267
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4256
4268
|
config = popsUtils.assign(config, details);
|
|
4257
|
-
config = PopsHandler.handleOnly(
|
|
4269
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4258
4270
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4259
4271
|
PopsHandler.handleInit($shadowRoot, [
|
|
4260
4272
|
{
|
|
@@ -4289,23 +4301,23 @@ define((function () { 'use strict';
|
|
|
4289
4301
|
// 先把z-index提取出来
|
|
4290
4302
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4291
4303
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4292
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4293
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4294
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4295
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4296
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4304
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4305
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4306
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4307
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4308
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4297
4309
|
/*html*/ `
|
|
4298
|
-
<div class="pops-title pops-${
|
|
4310
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4299
4311
|
? config.title.text
|
|
4300
|
-
: `<p pops class="pops-${
|
|
4301
|
-
<div class="pops-content pops-${
|
|
4312
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4313
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
4302
4314
|
? config.content.text
|
|
4303
|
-
: `<p pops class="pops-${
|
|
4315
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4304
4316
|
/**
|
|
4305
4317
|
* 弹窗的主元素，包括动画层
|
|
4306
4318
|
*/
|
|
4307
4319
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4308
|
-
let { popsElement: $pops, titleElement: $title, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, } = PopsHandler.handleQueryElement($anim,
|
|
4320
|
+
let { popsElement: $pops, titleElement: $title, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4309
4321
|
/**
|
|
4310
4322
|
* 遮罩层元素
|
|
4311
4323
|
*/
|
|
@@ -4317,7 +4329,7 @@ define((function () { 'use strict';
|
|
|
4317
4329
|
if (config.mask.enable) {
|
|
4318
4330
|
// 启用遮罩层
|
|
4319
4331
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4320
|
-
type:
|
|
4332
|
+
type: popsType,
|
|
4321
4333
|
guid: guid,
|
|
4322
4334
|
config: config,
|
|
4323
4335
|
animElement: $anim,
|
|
@@ -4326,7 +4338,7 @@ define((function () { 'use strict';
|
|
|
4326
4338
|
$mask = _handleMask_.maskElement;
|
|
4327
4339
|
elementList.push($mask);
|
|
4328
4340
|
}
|
|
4329
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4341
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4330
4342
|
PopsHandler.handleClickEvent("close", $btnClose, eventDetails, config.btn.close.callback);
|
|
4331
4343
|
PopsHandler.handleClickEvent("ok", $btnOk, eventDetails, config.btn.ok.callback);
|
|
4332
4344
|
PopsHandler.handleClickEvent("cancel", $btnCancel, eventDetails, config.btn.cancel.callback);
|
|
@@ -4340,7 +4352,7 @@ define((function () { 'use strict';
|
|
|
4340
4352
|
if ($mask != null) {
|
|
4341
4353
|
$anim.after($mask);
|
|
4342
4354
|
}
|
|
4343
|
-
PopsHandler.handlePush(
|
|
4355
|
+
PopsHandler.handlePush(popsType, {
|
|
4344
4356
|
guid: guid,
|
|
4345
4357
|
animElement: $anim,
|
|
4346
4358
|
popsElement: $pops,
|
|
@@ -4459,11 +4471,11 @@ define((function () { 'use strict';
|
|
|
4459
4471
|
init(details) {
|
|
4460
4472
|
const guid = popsUtils.getRandomGUID();
|
|
4461
4473
|
// 设置当前类型
|
|
4462
|
-
const
|
|
4474
|
+
const popsType = "prompt";
|
|
4463
4475
|
let config = PopsPromptConfig();
|
|
4464
4476
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4465
4477
|
config = popsUtils.assign(config, details);
|
|
4466
|
-
config = PopsHandler.handleOnly(
|
|
4478
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4467
4479
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4468
4480
|
PopsHandler.handleInit($shadowRoot, [
|
|
4469
4481
|
{
|
|
@@ -4498,16 +4510,16 @@ define((function () { 'use strict';
|
|
|
4498
4510
|
// 先把z-index提取出来
|
|
4499
4511
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4500
4512
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4501
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4502
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4503
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4504
|
-
let { contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4505
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4513
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4514
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4515
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4516
|
+
let { contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4517
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4506
4518
|
/*html*/ `
|
|
4507
|
-
<div class="pops-title pops-${
|
|
4519
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4508
4520
|
? config.title.text
|
|
4509
|
-
: `<p pops class="pops-${
|
|
4510
|
-
<div class="pops-content pops-${
|
|
4521
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4522
|
+
<div class="pops-content pops-${popsType}-content" style="${contentPStyle}">${config.content.row
|
|
4511
4523
|
? '<textarea name="pops-input-text" pops="" placeholder="' +
|
|
4512
4524
|
config.content.placeholder +
|
|
4513
4525
|
'"></textarea>'
|
|
@@ -4520,7 +4532,7 @@ define((function () { 'use strict';
|
|
|
4520
4532
|
* 弹窗的主元素，包括动画层
|
|
4521
4533
|
*/
|
|
4522
4534
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4523
|
-
let { popsElement: $pops, inputElement: $input, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, titleElement: $title, } = PopsHandler.handleQueryElement($anim,
|
|
4535
|
+
let { popsElement: $pops, inputElement: $input, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, titleElement: $title, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4524
4536
|
/**
|
|
4525
4537
|
* 遮罩层元素
|
|
4526
4538
|
*/
|
|
@@ -4532,7 +4544,7 @@ define((function () { 'use strict';
|
|
|
4532
4544
|
if (config.mask.enable) {
|
|
4533
4545
|
// 启用遮罩层
|
|
4534
4546
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4535
|
-
type:
|
|
4547
|
+
type: popsType,
|
|
4536
4548
|
guid: guid,
|
|
4537
4549
|
config: config,
|
|
4538
4550
|
animElement: $anim,
|
|
@@ -4541,7 +4553,7 @@ define((function () { 'use strict';
|
|
|
4541
4553
|
$mask = _handleMask_.maskElement;
|
|
4542
4554
|
elementList.push($mask);
|
|
4543
4555
|
}
|
|
4544
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4556
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4545
4557
|
/* 输入框赋值初始值 */
|
|
4546
4558
|
$input.value = config.content.text;
|
|
4547
4559
|
PopsHandler.handlePromptClickEvent("close", $input, $btnClose, eventDetails, config.btn.close.callback);
|
|
@@ -4557,7 +4569,7 @@ define((function () { 'use strict';
|
|
|
4557
4569
|
if ($mask != null) {
|
|
4558
4570
|
$anim.after($mask);
|
|
4559
4571
|
}
|
|
4560
|
-
PopsHandler.handlePush(
|
|
4572
|
+
PopsHandler.handlePush(popsType, {
|
|
4561
4573
|
guid: guid,
|
|
4562
4574
|
animElement: $anim,
|
|
4563
4575
|
popsElement: $pops,
|
|
@@ -4752,14 +4764,14 @@ define((function () { 'use strict';
|
|
|
4752
4764
|
init(details) {
|
|
4753
4765
|
const guid = popsUtils.getRandomGUID();
|
|
4754
4766
|
// 设置当前类型
|
|
4755
|
-
const
|
|
4767
|
+
const popsType = "iframe";
|
|
4756
4768
|
let config = PopsIframeConfig();
|
|
4757
4769
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4758
4770
|
config = popsUtils.assign(config, details);
|
|
4759
4771
|
if (config.url == null) {
|
|
4760
4772
|
throw new Error("config.url不能为空");
|
|
4761
4773
|
}
|
|
4762
|
-
config = PopsHandler.handleOnly(
|
|
4774
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4763
4775
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4764
4776
|
PopsHandler.handleInit($shadowRoot, [
|
|
4765
4777
|
{
|
|
@@ -4795,17 +4807,17 @@ define((function () { 'use strict';
|
|
|
4795
4807
|
// 先把z-index提取出来
|
|
4796
4808
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4797
4809
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex, maskExtraStyle);
|
|
4798
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4810
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4799
4811
|
let iframeLoadingHTML = '<div class="pops-loading"></div>';
|
|
4800
4812
|
let titleText = config.title.text.trim() !== "" ? config.title.text : config.url;
|
|
4801
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4802
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4813
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4814
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4803
4815
|
/*html*/ `
|
|
4804
|
-
<div class="pops-title pops-${
|
|
4816
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4805
4817
|
? titleText
|
|
4806
|
-
: `<p pops class="pops-${
|
|
4807
|
-
<div class="pops-content pops-${
|
|
4808
|
-
<div class="pops-${
|
|
4818
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${titleText}</p>`}${headerBtnHTML}</div>
|
|
4819
|
+
<div class="pops-content pops-${popsType}-content">
|
|
4820
|
+
<div class="pops-${popsType}-content-global-loading"></div>
|
|
4809
4821
|
<iframe src="${config.url}" pops ${config.sandbox
|
|
4810
4822
|
? "sandbox='allow-forms allow-same-origin allow-scripts'"
|
|
4811
4823
|
: ""}>
|
|
@@ -4815,7 +4827,7 @@ define((function () { 'use strict';
|
|
|
4815
4827
|
* 弹窗的主元素，包括动画层
|
|
4816
4828
|
*/
|
|
4817
4829
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4818
|
-
let { popsElement: $pops, headerCloseBtnElement, headerControlsElement, titleElement: $title, iframeElement: $iframe, loadingElement, contentLoadingElement: $contentLoading, headerMinBtnElement, headerMaxBtnElement, headerMiseBtnElement, } = PopsHandler.handleQueryElement($anim,
|
|
4830
|
+
let { popsElement: $pops, headerCloseBtnElement, headerControlsElement, titleElement: $title, iframeElement: $iframe, loadingElement, contentLoadingElement: $contentLoading, headerMinBtnElement, headerMaxBtnElement, headerMiseBtnElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4819
4831
|
let $iframeContainer = PopsCore.document.querySelector(".pops-iframe-container");
|
|
4820
4832
|
if (!$iframeContainer) {
|
|
4821
4833
|
$iframeContainer = PopsCore.document.createElement("div");
|
|
@@ -4834,7 +4846,7 @@ define((function () { 'use strict';
|
|
|
4834
4846
|
let elementList = [$anim];
|
|
4835
4847
|
if (config.mask.enable) {
|
|
4836
4848
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4837
|
-
type:
|
|
4849
|
+
type: popsType,
|
|
4838
4850
|
guid: guid,
|
|
4839
4851
|
config: config,
|
|
4840
4852
|
animElement: $anim,
|
|
@@ -4843,7 +4855,7 @@ define((function () { 'use strict';
|
|
|
4843
4855
|
$mask = _handleMask_.maskElement;
|
|
4844
4856
|
elementList.push($mask);
|
|
4845
4857
|
}
|
|
4846
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4858
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4847
4859
|
eventDetails["iframeElement"] = $iframe;
|
|
4848
4860
|
popsDOMUtils.on($anim, popsDOMUtils.getAnimationEndNameList(), function () {
|
|
4849
4861
|
/* 动画加载完毕 */
|
|
@@ -4980,14 +4992,14 @@ define((function () { 'use strict';
|
|
|
4980
4992
|
popsDOMUtils.on(headerCloseBtnElement, "click", (event) => {
|
|
4981
4993
|
event.preventDefault();
|
|
4982
4994
|
event.stopPropagation();
|
|
4983
|
-
PopsInstanceUtils.removeInstance([
|
|
4995
|
+
PopsInstanceUtils.removeInstance([PopsInstData.iframe], guid, false);
|
|
4984
4996
|
if (typeof config?.btn?.close?.callback === "function") {
|
|
4985
4997
|
config.btn.close.callback(eventDetails, event);
|
|
4986
4998
|
}
|
|
4987
4999
|
}, {
|
|
4988
5000
|
capture: true,
|
|
4989
5001
|
});
|
|
4990
|
-
PopsHandler.handlePush(
|
|
5002
|
+
PopsHandler.handlePush(popsType, {
|
|
4991
5003
|
guid: guid,
|
|
4992
5004
|
animElement: $anim,
|
|
4993
5005
|
popsElement: $pops,
|
|
@@ -5091,11 +5103,11 @@ define((function () { 'use strict';
|
|
|
5091
5103
|
init(details) {
|
|
5092
5104
|
const guid = popsUtils.getRandomGUID();
|
|
5093
5105
|
// 设置当前类型
|
|
5094
|
-
const
|
|
5106
|
+
const popsType = "drawer";
|
|
5095
5107
|
let config = PopsDrawerConfig();
|
|
5096
5108
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
5097
5109
|
config = popsUtils.assign(config, details);
|
|
5098
|
-
config = PopsHandler.handleOnly(
|
|
5110
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
5099
5111
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
5100
5112
|
PopsHandler.handleInit($shadowRoot, [
|
|
5101
5113
|
{
|
|
@@ -5130,25 +5142,25 @@ define((function () { 'use strict';
|
|
|
5130
5142
|
// 先把z-index提取出来
|
|
5131
5143
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5132
5144
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5133
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
5134
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
5135
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
5136
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
5137
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
5145
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
5146
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
5147
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
5148
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
5149
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
5138
5150
|
/*html*/ `
|
|
5139
5151
|
${config.title.enable
|
|
5140
|
-
? /*html*/ `<div class="pops-title pops-${
|
|
5152
|
+
? /*html*/ `<div class="pops-title pops-${popsType}-title" style="${headerStyle}">${config.title.html
|
|
5141
5153
|
? config.title.text
|
|
5142
|
-
: /*html*/ `<p pops class="pops-${
|
|
5154
|
+
: /*html*/ `<p pops class="pops-${popsType}-title-text" style="width: 100%;text-align: ${config.title.position};${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>`
|
|
5143
5155
|
: ""}
|
|
5144
|
-
<div class="pops-content pops-${
|
|
5156
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
5145
5157
|
? config.content.text
|
|
5146
|
-
: `<p pops class="pops-${
|
|
5158
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
5147
5159
|
/**
|
|
5148
5160
|
* 弹窗的主元素，包括动画层
|
|
5149
5161
|
*/
|
|
5150
5162
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
5151
|
-
let { popsElement, headerCloseBtnElement, btnCancelElement, btnOkElement, btnOtherElement, } = PopsHandler.handleQueryElement($anim,
|
|
5163
|
+
let { popsElement, headerCloseBtnElement, btnCancelElement, btnOkElement, btnOtherElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
5152
5164
|
let $pops = popsElement;
|
|
5153
5165
|
let $headerCloseBtn = headerCloseBtnElement;
|
|
5154
5166
|
let $btnCancel = btnCancelElement;
|
|
@@ -5164,7 +5176,7 @@ define((function () { 'use strict';
|
|
|
5164
5176
|
let elementList = [$anim];
|
|
5165
5177
|
if (config.mask.enable) {
|
|
5166
5178
|
let _handleMask_ = PopsHandler.handleMask({
|
|
5167
|
-
type:
|
|
5179
|
+
type: popsType,
|
|
5168
5180
|
guid: guid,
|
|
5169
5181
|
config: config,
|
|
5170
5182
|
animElement: $anim,
|
|
@@ -5173,7 +5185,7 @@ define((function () { 'use strict';
|
|
|
5173
5185
|
$mask = _handleMask_.maskElement;
|
|
5174
5186
|
elementList.push($mask);
|
|
5175
5187
|
}
|
|
5176
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
5188
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
5177
5189
|
/* 处理方向 */
|
|
5178
5190
|
$pops.setAttribute("direction", config.direction);
|
|
5179
5191
|
/* 处理border-radius */
|
|
@@ -5261,7 +5273,7 @@ define((function () { 'use strict';
|
|
|
5261
5273
|
if ($mask != null) {
|
|
5262
5274
|
$anim.after($mask);
|
|
5263
5275
|
}
|
|
5264
|
-
PopsHandler.handlePush(
|
|
5276
|
+
PopsHandler.handlePush(popsType, {
|
|
5265
5277
|
guid: guid,
|
|
5266
5278
|
animElement: $anim,
|
|
5267
5279
|
popsElement: $pops,
|
|
@@ -5452,11 +5464,11 @@ define((function () { 'use strict';
|
|
|
5452
5464
|
init(details) {
|
|
5453
5465
|
const guid = popsUtils.getRandomGUID();
|
|
5454
5466
|
// 设置当前类型
|
|
5455
|
-
const
|
|
5467
|
+
const popsType = "folder";
|
|
5456
5468
|
let config = PopsFolderConfig();
|
|
5457
5469
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
5458
5470
|
config = popsUtils.assign(config, details);
|
|
5459
|
-
config = PopsHandler.handleOnly(
|
|
5471
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
5460
5472
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
5461
5473
|
PopsHandler.handleInit($shadowRoot, [
|
|
5462
5474
|
{
|
|
@@ -5536,19 +5548,15 @@ define((function () { 'use strict';
|
|
|
5536
5548
|
/* Android安装包 */
|
|
5537
5549
|
let androidIconList = ["apk", "apkm", "xapk"];
|
|
5538
5550
|
zipIconList.forEach((keyName) => {
|
|
5539
|
-
// @ts-ignore
|
|
5540
5551
|
Folder_ICON[keyName] = Folder_ICON.zip;
|
|
5541
5552
|
});
|
|
5542
5553
|
imageIconList.forEach((keyName) => {
|
|
5543
|
-
// @ts-ignore
|
|
5544
5554
|
Folder_ICON[keyName] = Folder_ICON.png;
|
|
5545
5555
|
});
|
|
5546
5556
|
codeLanguageIconList.forEach((keyName) => {
|
|
5547
|
-
// @ts-ignore
|
|
5548
5557
|
Folder_ICON[keyName] = Folder_ICON.html;
|
|
5549
5558
|
});
|
|
5550
5559
|
androidIconList.forEach((keyName) => {
|
|
5551
|
-
// @ts-ignore
|
|
5552
5560
|
Folder_ICON[keyName] = Folder_ICON.apk;
|
|
5553
5561
|
});
|
|
5554
5562
|
if (details?.folder) {
|
|
@@ -5558,108 +5566,105 @@ define((function () { 'use strict';
|
|
|
5558
5566
|
// 先把z-index提取出来
|
|
5559
5567
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5560
5568
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5561
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
5562
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
5563
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
5564
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
5569
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
5570
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
5571
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
5572
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
5565
5573
|
/*html*/ `
|
|
5566
|
-
<div class="pops-title pops-${
|
|
5574
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
5567
5575
|
? config.title.text
|
|
5568
|
-
: `<p pops class="pops-${
|
|
5569
|
-
<div class="pops-content pops-${
|
|
5576
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
5577
|
+
<div class="pops-content pops-${popsType}-content ${popsUtils.isPhone() ? "pops-mobile-folder-content" : ""}">
|
|
5570
5578
|
<div class="pops-folder-list">
|
|
5571
5579
|
<div class="pops-folder-file-list-breadcrumb">
|
|
5572
|
-
|
|
5573
|
-
|
|
5574
|
-
|
|
5575
|
-
|
|
5576
|
-
|
|
5580
|
+
<div class="pops-folder-file-list-breadcrumb-primary">
|
|
5581
|
+
<span class="pops-folder-file-list-breadcrumb-allFiles cursor-p" title="全部文件">
|
|
5582
|
+
<a>全部文件</a>
|
|
5583
|
+
</span>
|
|
5584
|
+
</div>
|
|
5577
5585
|
</div>
|
|
5578
5586
|
<div class="pops-folder-list-table__header-div">
|
|
5579
|
-
|
|
5580
|
-
|
|
5581
|
-
|
|
5582
|
-
|
|
5583
|
-
|
|
5584
|
-
|
|
5585
|
-
|
|
5586
|
-
|
|
5587
|
-
|
|
5588
|
-
|
|
5589
|
-
|
|
5590
|
-
|
|
5591
|
-
|
|
5592
|
-
|
|
5593
|
-
|
|
5594
|
-
|
|
5595
|
-
|
|
5596
|
-
|
|
5597
|
-
|
|
5598
|
-
|
|
5599
|
-
|
|
5600
|
-
|
|
5601
|
-
|
|
5602
|
-
|
|
5603
|
-
|
|
5604
|
-
|
|
5605
|
-
|
|
5606
|
-
|
|
5607
|
-
|
|
5608
|
-
|
|
5609
|
-
|
|
5610
|
-
|
|
5611
|
-
|
|
5612
|
-
|
|
5613
|
-
|
|
5614
|
-
|
|
5615
|
-
|
|
5616
|
-
|
|
5617
|
-
|
|
5618
|
-
|
|
5619
|
-
|
|
5620
|
-
|
|
5621
|
-
|
|
5622
|
-
|
|
5623
|
-
|
|
5624
|
-
|
|
5625
|
-
|
|
5626
|
-
|
|
5627
|
-
|
|
5628
|
-
|
|
5629
|
-
|
|
5630
|
-
|
|
5631
|
-
|
|
5632
|
-
|
|
5633
|
-
|
|
5634
|
-
|
|
5635
|
-
|
|
5636
|
-
|
|
5637
|
-
|
|
5638
|
-
|
|
5639
|
-
|
|
5640
|
-
|
|
5641
|
-
|
|
5642
|
-
|
|
5643
|
-
|
|
5644
|
-
|
|
5645
|
-
|
|
5646
|
-
|
|
5587
|
+
<table class="pops-folder-list-table__header">
|
|
5588
|
+
<colgroup>
|
|
5589
|
+
<col width="52%">
|
|
5590
|
+
<col width="24%">
|
|
5591
|
+
<col width="16%">
|
|
5592
|
+
</colgroup>
|
|
5593
|
+
<thead>
|
|
5594
|
+
<tr class="pops-folder-list-table__header-row">
|
|
5595
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5596
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5597
|
+
<span>文件名</span>
|
|
5598
|
+
<div class="pops-folder-list-table__sort" data-sort="fileName">
|
|
5599
|
+
<div class="pops-folder-icon-arrow" data-sort="按文件名排序">
|
|
5600
|
+
<svg
|
|
5601
|
+
viewBox="0 0 1024 1024"
|
|
5602
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5603
|
+
<path
|
|
5604
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5605
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5606
|
+
<path
|
|
5607
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5608
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5609
|
+
</svg>
|
|
5610
|
+
</div>
|
|
5611
|
+
</div>
|
|
5612
|
+
</div>
|
|
5613
|
+
</th>
|
|
5614
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5615
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5616
|
+
<span>修改时间</span>
|
|
5617
|
+
<div class="pops-folder-list-table__sort" data-sort="latestTime">
|
|
5618
|
+
<div class="pops-folder-icon-arrow" title="按修改时间排序">
|
|
5619
|
+
<svg
|
|
5620
|
+
viewBox="0 0 1024 1024"
|
|
5621
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5622
|
+
<path
|
|
5623
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5624
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5625
|
+
<path
|
|
5626
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5627
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5628
|
+
</svg>
|
|
5629
|
+
</div>
|
|
5630
|
+
</div>
|
|
5631
|
+
</div>
|
|
5632
|
+
</th>
|
|
5633
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5634
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5635
|
+
<span>大小</span>
|
|
5636
|
+
<div class="pops-folder-list-table__sort" data-sort="fileSize">
|
|
5637
|
+
<div class="pops-folder-icon-arrow" title="按大小排序">
|
|
5638
|
+
<svg
|
|
5639
|
+
viewBox="0 0 1024 1024"
|
|
5640
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5641
|
+
<path
|
|
5642
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5643
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5644
|
+
<path
|
|
5645
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5646
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5647
|
+
</svg>
|
|
5648
|
+
</div>
|
|
5649
|
+
</div>
|
|
5650
|
+
</div>
|
|
5651
|
+
</th>
|
|
5652
|
+
</tr>
|
|
5653
|
+
</thead>
|
|
5654
|
+
</table>
|
|
5647
5655
|
</div>
|
|
5648
5656
|
<div class="pops-folder-list-table__body-div">
|
|
5649
|
-
|
|
5650
|
-
|
|
5651
|
-
|
|
5657
|
+
<table class="pops-folder-list-table__body">
|
|
5658
|
+
<colgroup>
|
|
5659
|
+
${popsUtils.isPhone()
|
|
5652
5660
|
? `<col width="100%">`
|
|
5653
5661
|
: `
|
|
5654
|
-
|
|
5655
|
-
|
|
5656
|
-
|
|
5657
|
-
|
|
5658
|
-
|
|
5659
|
-
|
|
5660
|
-
|
|
5661
|
-
</tbody>
|
|
5662
|
-
</table>
|
|
5662
|
+
<col width="52%">
|
|
5663
|
+
<col width="24%">
|
|
5664
|
+
<col width="16%">`}
|
|
5665
|
+
</colgroup>
|
|
5666
|
+
<tbody></tbody>
|
|
5667
|
+
</table>
|
|
5663
5668
|
</div>
|
|
5664
5669
|
</div>
|
|
5665
5670
|
</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
@@ -5671,7 +5676,7 @@ define((function () { 'use strict';
|
|
|
5671
5676
|
// folderListElement,
|
|
5672
5677
|
// folderListHeaderElement,
|
|
5673
5678
|
// folderListHeaderRowElement,
|
|
5674
|
-
folderListBodyElement, folderFileListBreadcrumbPrimaryElement, headerCloseBtnElement: $btnCloseBtn, btnOkElement, btnCancelElement, btnOtherElement, folderListSortFileNameElement, folderListSortLatestTimeElement, folderListSortFileSizeElement, } = PopsHandler.handleQueryElement($anim,
|
|
5679
|
+
folderListBodyElement, folderFileListBreadcrumbPrimaryElement, headerCloseBtnElement: $btnCloseBtn, btnOkElement, btnCancelElement, btnOtherElement, folderListSortFileNameElement, folderListSortLatestTimeElement, folderListSortFileSizeElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
5675
5680
|
/**
|
|
5676
5681
|
* 遮罩层元素
|
|
5677
5682
|
*/
|
|
@@ -5682,7 +5687,7 @@ define((function () { 'use strict';
|
|
|
5682
5687
|
let elementList = [$anim];
|
|
5683
5688
|
if (config.mask.enable) {
|
|
5684
5689
|
let _handleMask_ = PopsHandler.handleMask({
|
|
5685
|
-
type:
|
|
5690
|
+
type: popsType,
|
|
5686
5691
|
guid: guid,
|
|
5687
5692
|
config: config,
|
|
5688
5693
|
animElement: $anim,
|
|
@@ -5692,7 +5697,7 @@ define((function () { 'use strict';
|
|
|
5692
5697
|
elementList.push($mask);
|
|
5693
5698
|
}
|
|
5694
5699
|
/* 事件 */
|
|
5695
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
5700
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
5696
5701
|
PopsHandler.handleClickEvent("close", $btnCloseBtn, eventDetails, config.btn.close.callback);
|
|
5697
5702
|
PopsHandler.handleClickEvent("ok", btnOkElement, eventDetails, config.btn.ok.callback);
|
|
5698
5703
|
PopsHandler.handleClickEvent("cancel", btnCancelElement, eventDetails, config.btn.cancel.callback);
|
|
@@ -5785,10 +5790,10 @@ define((function () { 'use strict';
|
|
|
5785
5790
|
fileSize: origin_fileSize,
|
|
5786
5791
|
isFolder: isFolder,
|
|
5787
5792
|
};
|
|
5788
|
-
fileNameElement
|
|
5789
|
-
fileTimeElement
|
|
5790
|
-
fileFormatSize
|
|
5791
|
-
folderELement
|
|
5793
|
+
Reflect.set(fileNameElement, "__value__", __value__);
|
|
5794
|
+
Reflect.set(fileTimeElement, "__value__", __value__);
|
|
5795
|
+
Reflect.set(fileFormatSize, "__value__", __value__);
|
|
5796
|
+
Reflect.set(folderELement, "__value__", __value__);
|
|
5792
5797
|
folderELement.appendChild(fileNameElement);
|
|
5793
5798
|
folderELement.appendChild(fileTimeElement);
|
|
5794
5799
|
folderELement.appendChild(fileFormatSize);
|
|
@@ -5855,8 +5860,8 @@ define((function () { 'use strict';
|
|
|
5855
5860
|
fileSize: origin_fileSize,
|
|
5856
5861
|
isFolder: isFolder,
|
|
5857
5862
|
};
|
|
5858
|
-
fileNameElement
|
|
5859
|
-
folderELement
|
|
5863
|
+
Reflect.set(fileNameElement, "__value__", __value__);
|
|
5864
|
+
Reflect.set(folderELement, "__value__", __value__);
|
|
5860
5865
|
folderELement.appendChild(fileNameElement);
|
|
5861
5866
|
return {
|
|
5862
5867
|
folderELement,
|
|
@@ -5866,10 +5871,13 @@ define((function () { 'use strict';
|
|
|
5866
5871
|
/**
|
|
5867
5872
|
* 清空每行的元素
|
|
5868
5873
|
*/
|
|
5869
|
-
function
|
|
5874
|
+
function clearFolderRow() {
|
|
5870
5875
|
PopsSafeUtils.setSafeHTML(folderListBodyElement, "");
|
|
5871
5876
|
}
|
|
5872
|
-
|
|
5877
|
+
/**
|
|
5878
|
+
* 创建顶部导航的箭头图标
|
|
5879
|
+
*/
|
|
5880
|
+
function createHeaderArrowIcon() {
|
|
5873
5881
|
let iconArrowElement = popsDOMUtils.createElement("div", {
|
|
5874
5882
|
className: "iconArrow",
|
|
5875
5883
|
});
|
|
@@ -5877,17 +5885,16 @@ define((function () { 'use strict';
|
|
|
5877
5885
|
}
|
|
5878
5886
|
/**
|
|
5879
5887
|
* 添加顶部导航
|
|
5880
|
-
* @param
|
|
5881
|
-
* @param
|
|
5882
|
-
* @returns
|
|
5888
|
+
* @param folderName 文件夹名
|
|
5889
|
+
* @param folderDataConfig 文件夹配置
|
|
5883
5890
|
*/
|
|
5884
|
-
function
|
|
5891
|
+
function createHeaderFileLinkNavgiation(folderName, folderDataConfig) {
|
|
5885
5892
|
let spanElement = popsDOMUtils.createElement("span", {
|
|
5886
5893
|
className: "pops-folder-file-list-breadcrumb-allFiles cursor-p",
|
|
5887
|
-
innerHTML: `<a>${
|
|
5888
|
-
_config_:
|
|
5894
|
+
innerHTML: `<a>${folderName}</a>`,
|
|
5895
|
+
_config_: folderDataConfig,
|
|
5889
5896
|
}, {
|
|
5890
|
-
title:
|
|
5897
|
+
title: folderName,
|
|
5891
5898
|
});
|
|
5892
5899
|
return spanElement;
|
|
5893
5900
|
}
|
|
@@ -5895,10 +5902,10 @@ define((function () { 'use strict';
|
|
|
5895
5902
|
* 顶部导航的点击事件
|
|
5896
5903
|
* @param event
|
|
5897
5904
|
* @param isTop 是否是全部文件按钮
|
|
5898
|
-
* @param
|
|
5905
|
+
* @param folderDataConfigList 配置
|
|
5899
5906
|
*/
|
|
5900
|
-
function breadcrumbAllFilesElementClickEvent(event, isTop,
|
|
5901
|
-
|
|
5907
|
+
function breadcrumbAllFilesElementClickEvent(event, isTop, folderDataConfigList) {
|
|
5908
|
+
clearFolderRow();
|
|
5902
5909
|
/* 获取当前的导航元素 */
|
|
5903
5910
|
let $click = event.target;
|
|
5904
5911
|
let currentBreadcrumb = $click.closest("span.pops-folder-file-list-breadcrumb-allFiles");
|
|
@@ -5924,16 +5931,16 @@ define((function () { 'use strict';
|
|
|
5924
5931
|
},
|
|
5925
5932
|
addIndexCSS: false,
|
|
5926
5933
|
});
|
|
5927
|
-
addFolderElement(
|
|
5934
|
+
addFolderElement(folderDataConfigList);
|
|
5928
5935
|
loadingMask.close();
|
|
5929
5936
|
}
|
|
5930
5937
|
/**
|
|
5931
5938
|
* 刷新文件列表界面信息
|
|
5932
5939
|
* @param event
|
|
5933
|
-
* @param
|
|
5940
|
+
* @param folderDataConfig
|
|
5934
5941
|
*/
|
|
5935
|
-
async function refreshFolderInfoClickEvent(event,
|
|
5936
|
-
|
|
5942
|
+
async function refreshFolderInfoClickEvent(event, folderDataConfig) {
|
|
5943
|
+
clearFolderRow();
|
|
5937
5944
|
let loadingMask = PopsLoading.init({
|
|
5938
5945
|
parent: $content,
|
|
5939
5946
|
content: {
|
|
@@ -5944,12 +5951,12 @@ define((function () { 'use strict';
|
|
|
5944
5951
|
},
|
|
5945
5952
|
addIndexCSS: false,
|
|
5946
5953
|
});
|
|
5947
|
-
if (typeof
|
|
5948
|
-
let childConfig = await
|
|
5954
|
+
if (typeof folderDataConfig.clickEvent === "function") {
|
|
5955
|
+
let childConfig = await folderDataConfig.clickEvent(event, folderDataConfig);
|
|
5949
5956
|
/* 添加顶部导航的箭头 */
|
|
5950
|
-
folderFileListBreadcrumbPrimaryElement.appendChild(
|
|
5951
|
-
/*
|
|
5952
|
-
let breadcrumbAllFilesElement =
|
|
5957
|
+
folderFileListBreadcrumbPrimaryElement.appendChild(createHeaderArrowIcon());
|
|
5958
|
+
/* 添加顶部导航的链接文字 */
|
|
5959
|
+
let breadcrumbAllFilesElement = createHeaderFileLinkNavgiation(folderDataConfig.fileName, childConfig);
|
|
5953
5960
|
folderFileListBreadcrumbPrimaryElement.appendChild(breadcrumbAllFilesElement);
|
|
5954
5961
|
/* 设置顶部导航点击事件 */
|
|
5955
5962
|
popsDOMUtils.on(breadcrumbAllFilesElement, "click", function (event) {
|
|
@@ -6244,7 +6251,7 @@ define((function () { 'use strict';
|
|
|
6244
6251
|
endCallBack: config.dragEndCallBack,
|
|
6245
6252
|
});
|
|
6246
6253
|
}
|
|
6247
|
-
PopsHandler.handlePush(
|
|
6254
|
+
PopsHandler.handlePush(popsType, {
|
|
6248
6255
|
guid: guid,
|
|
6249
6256
|
animElement: $anim,
|
|
6250
6257
|
popsElement: $pops,
|
|
@@ -7336,14 +7343,14 @@ define((function () { 'use strict';
|
|
|
7336
7343
|
init(details) {
|
|
7337
7344
|
const guid = popsUtils.getRandomGUID();
|
|
7338
7345
|
// 设置当前类型
|
|
7339
|
-
const
|
|
7346
|
+
const popsType = "tooltip";
|
|
7340
7347
|
let config = PopsTooltipConfig();
|
|
7341
7348
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
7342
7349
|
config = popsUtils.assign(config, details);
|
|
7343
7350
|
if (!(config.target instanceof HTMLElement)) {
|
|
7344
7351
|
throw new TypeError("config.target 必须是HTMLElement类型");
|
|
7345
7352
|
}
|
|
7346
|
-
config = PopsHandler.handleOnly(
|
|
7353
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
7347
7354
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
7348
7355
|
PopsHandler.handleInit($shadowRoot, [
|
|
7349
7356
|
{
|
|
@@ -10075,14 +10082,14 @@ define((function () { 'use strict';
|
|
|
10075
10082
|
init(details) {
|
|
10076
10083
|
const guid = popsUtils.getRandomGUID();
|
|
10077
10084
|
// 设置当前类型
|
|
10078
|
-
const
|
|
10085
|
+
const popsType = "panel";
|
|
10079
10086
|
let config = PopsPanelConfig();
|
|
10080
10087
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10081
10088
|
config = popsUtils.assign(config, details);
|
|
10082
10089
|
if (details && Array.isArray(details.content)) {
|
|
10083
10090
|
config.content = details.content;
|
|
10084
10091
|
}
|
|
10085
|
-
config = PopsHandler.handleOnly(
|
|
10092
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10086
10093
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
10087
10094
|
PopsHandler.handleInit($shadowRoot, [
|
|
10088
10095
|
{
|
|
@@ -10117,21 +10124,21 @@ define((function () { 'use strict';
|
|
|
10117
10124
|
// 先把z-index提取出来
|
|
10118
10125
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
10119
10126
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
10120
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
10121
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
10122
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
10127
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
10128
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
10129
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
10123
10130
|
/*html*/ `
|
|
10124
|
-
<div class="pops-title pops-${
|
|
10131
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
10125
10132
|
? config.title.text
|
|
10126
|
-
: `<p pops class="pops-${
|
|
10127
|
-
<div class="pops-content pops-${
|
|
10128
|
-
<aside class="pops-${
|
|
10129
|
-
<ul class="pops-${
|
|
10130
|
-
<ul class="pops-${
|
|
10133
|
+
: `<p pops class="pops-${popsType}-title-text" class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
10134
|
+
<div class="pops-content pops-${popsType}-content">
|
|
10135
|
+
<aside class="pops-${popsType}-aside">
|
|
10136
|
+
<ul class="pops-${popsType}-aside-top-container"></ul>
|
|
10137
|
+
<ul class="pops-${popsType}-aside-bottom-container"></ul>
|
|
10131
10138
|
</aside>
|
|
10132
|
-
<section class="pops-${
|
|
10133
|
-
<ul class="pops-${
|
|
10134
|
-
<ul class="pops-${
|
|
10139
|
+
<section class="pops-${popsType}-container">
|
|
10140
|
+
<ul class="pops-${popsType}-container-header-ul"></ul>
|
|
10141
|
+
<ul class="pops-${popsType}-container-main-ul"></ul>
|
|
10135
10142
|
</section>
|
|
10136
10143
|
</div>`, "", zIndex);
|
|
10137
10144
|
/**
|
|
@@ -10139,7 +10146,7 @@ define((function () { 'use strict';
|
|
|
10139
10146
|
*/
|
|
10140
10147
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
10141
10148
|
/* 结构元素 */
|
|
10142
|
-
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim,
|
|
10149
|
+
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
10143
10150
|
if (config.isMobile || popsUtils.isPhone()) {
|
|
10144
10151
|
popsDOMUtils.addClassName($pops, config.mobileClassName);
|
|
10145
10152
|
}
|
|
@@ -10154,7 +10161,7 @@ define((function () { 'use strict';
|
|
|
10154
10161
|
/* 遮罩层元素 */
|
|
10155
10162
|
if (config.mask.enable) {
|
|
10156
10163
|
let { maskElement } = PopsHandler.handleMask({
|
|
10157
|
-
type:
|
|
10164
|
+
type: popsType,
|
|
10158
10165
|
guid: guid,
|
|
10159
10166
|
config: config,
|
|
10160
10167
|
animElement: $anim,
|
|
@@ -10164,7 +10171,7 @@ define((function () { 'use strict';
|
|
|
10164
10171
|
isCreatedElementList.push($mask);
|
|
10165
10172
|
}
|
|
10166
10173
|
/* 处理返回的配置 */
|
|
10167
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
10174
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
10168
10175
|
/* 为顶部右边的关闭按钮添加点击事件 */
|
|
10169
10176
|
PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
|
|
10170
10177
|
/* 创建到页面中 */
|
|
@@ -10190,7 +10197,7 @@ define((function () { 'use strict';
|
|
|
10190
10197
|
$contentSectionContainer: $contentSectionContainer,
|
|
10191
10198
|
},
|
|
10192
10199
|
});
|
|
10193
|
-
PopsHandler.handlePush(
|
|
10200
|
+
PopsHandler.handlePush(popsType, {
|
|
10194
10201
|
guid: guid,
|
|
10195
10202
|
animElement: $anim,
|
|
10196
10203
|
popsElement: $pops,
|
|
@@ -10352,11 +10359,11 @@ define((function () { 'use strict';
|
|
|
10352
10359
|
init(details) {
|
|
10353
10360
|
const guid = popsUtils.getRandomGUID();
|
|
10354
10361
|
// 设置当前类型
|
|
10355
|
-
const
|
|
10362
|
+
const popsType = "rightClickMenu";
|
|
10356
10363
|
let config = rightClickMenuConfig();
|
|
10357
10364
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10358
10365
|
config = popsUtils.assign(config, details);
|
|
10359
|
-
config = PopsHandler.handleOnly(
|
|
10366
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10360
10367
|
if (config.target == null) {
|
|
10361
10368
|
throw new Error("config.target 不能为空");
|
|
10362
10369
|
}
|
|
@@ -10405,7 +10412,7 @@ define((function () { 'use strict';
|
|
|
10405
10412
|
return;
|
|
10406
10413
|
}
|
|
10407
10414
|
let $click = event.target;
|
|
10408
|
-
if ($click.closest(`.pops-${
|
|
10415
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10409
10416
|
return;
|
|
10410
10417
|
}
|
|
10411
10418
|
if ($click.className &&
|
|
@@ -10424,7 +10431,7 @@ define((function () { 'use strict';
|
|
|
10424
10431
|
return;
|
|
10425
10432
|
}
|
|
10426
10433
|
let $click = event.target;
|
|
10427
|
-
if ($click.closest(`.pops-${
|
|
10434
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10428
10435
|
return;
|
|
10429
10436
|
}
|
|
10430
10437
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
@@ -10470,21 +10477,21 @@ define((function () { 'use strict';
|
|
|
10470
10477
|
if (config.preventDefault) {
|
|
10471
10478
|
popsDOMUtils.preventEvent(event);
|
|
10472
10479
|
}
|
|
10473
|
-
PopsHandler.handleOnly(
|
|
10480
|
+
PopsHandler.handleOnly(popsType, config);
|
|
10474
10481
|
if (PopsContextMenu.rootElement) {
|
|
10475
10482
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
10476
10483
|
}
|
|
10477
10484
|
let rootElement = PopsContextMenu.showMenu(event, config.data, selectorTarget);
|
|
10478
10485
|
PopsContextMenu.rootElement = rootElement;
|
|
10479
10486
|
if (config.only) {
|
|
10480
|
-
PopsHandler.handlePush(
|
|
10487
|
+
PopsHandler.handlePush(popsType, {
|
|
10481
10488
|
$shadowRoot: $shadowRoot,
|
|
10482
10489
|
$shadowContainer: $shadowContainer,
|
|
10483
10490
|
guid: guid,
|
|
10484
10491
|
animElement: rootElement,
|
|
10485
10492
|
popsElement: rootElement,
|
|
10486
|
-
beforeRemoveCallBack(
|
|
10487
|
-
PopsContextMenu.closeAllMenu(
|
|
10493
|
+
beforeRemoveCallBack(instCommonConfig) {
|
|
10494
|
+
PopsContextMenu.closeAllMenu(instCommonConfig.popsElement);
|
|
10488
10495
|
},
|
|
10489
10496
|
});
|
|
10490
10497
|
}
|
|
@@ -10519,12 +10526,12 @@ define((function () { 'use strict';
|
|
|
10519
10526
|
});
|
|
10520
10527
|
element.remove();
|
|
10521
10528
|
}
|
|
10522
|
-
if (element.classList.contains(`pops-${
|
|
10529
|
+
if (element.classList.contains(`pops-${popsType}-anim-show`)) {
|
|
10523
10530
|
/* 有动画 */
|
|
10524
10531
|
popsDOMUtils.on(element, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
|
|
10525
10532
|
capture: true,
|
|
10526
10533
|
});
|
|
10527
|
-
element.classList.remove(`pops-${
|
|
10534
|
+
element.classList.remove(`pops-${popsType}-anim-show`);
|
|
10528
10535
|
}
|
|
10529
10536
|
else {
|
|
10530
10537
|
/* 无动画 */
|
|
@@ -10556,7 +10563,7 @@ define((function () { 'use strict';
|
|
|
10556
10563
|
*/
|
|
10557
10564
|
getMenuContainerElement(isChildren) {
|
|
10558
10565
|
let $menu = popsDOMUtils.createElement("div", {
|
|
10559
|
-
className: `pops-${
|
|
10566
|
+
className: `pops-${popsType}`,
|
|
10560
10567
|
innerHTML: /*html*/ `
|
|
10561
10568
|
<ul></ul>
|
|
10562
10569
|
`,
|
|
@@ -10570,7 +10577,7 @@ define((function () { 'use strict';
|
|
|
10570
10577
|
}
|
|
10571
10578
|
/* 添加动画 */
|
|
10572
10579
|
if (config.isAnimation) {
|
|
10573
|
-
popsDOMUtils.addClassName($menu, `pops-${
|
|
10580
|
+
popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-grid`);
|
|
10574
10581
|
}
|
|
10575
10582
|
return $menu;
|
|
10576
10583
|
},
|
|
@@ -10710,7 +10717,7 @@ define((function () { 'use strict';
|
|
|
10710
10717
|
});
|
|
10711
10718
|
/* 过渡动画 */
|
|
10712
10719
|
if (config.isAnimation) {
|
|
10713
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10720
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10714
10721
|
}
|
|
10715
10722
|
return menuElement;
|
|
10716
10723
|
},
|
|
@@ -10750,7 +10757,7 @@ define((function () { 'use strict';
|
|
|
10750
10757
|
popsDOMUtils.css(menuElement, { ...offset, display: "" });
|
|
10751
10758
|
/* 过渡动画 */
|
|
10752
10759
|
if (config.isAnimation) {
|
|
10753
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10760
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10754
10761
|
}
|
|
10755
10762
|
return menuElement;
|
|
10756
10763
|
},
|
|
@@ -10771,19 +10778,19 @@ define((function () { 'use strict';
|
|
|
10771
10778
|
if (typeof item.icon === "string" && item.icon.trim() !== "") {
|
|
10772
10779
|
let iconSVGHTML = PopsIcon.getIcon(item.icon) ?? item.icon;
|
|
10773
10780
|
let iconElement = popsDOMUtils.parseTextToDOM(
|
|
10774
|
-
/*html*/ `<i class="pops-${
|
|
10781
|
+
/*html*/ `<i class="pops-${popsType}-icon" is-loading="${item.iconIsLoading ?? false}">${iconSVGHTML}</i>`);
|
|
10775
10782
|
menuLiElement.appendChild(iconElement);
|
|
10776
10783
|
}
|
|
10777
10784
|
/* 插入文字 */
|
|
10778
10785
|
menuLiElement.insertAdjacentHTML("beforeend", PopsSafeUtils.getSafeHTML(`<span>${item.text}</span>`));
|
|
10779
10786
|
/* 如果存在子数据，显示 */
|
|
10780
10787
|
if (item.item && Array.isArray(item.item)) {
|
|
10781
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10788
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-item`);
|
|
10782
10789
|
}
|
|
10783
10790
|
/* 鼠标|触摸 移入事件 */
|
|
10784
10791
|
function liElementHoverEvent() {
|
|
10785
10792
|
Array.from(menuULElement.children).forEach((liElement) => {
|
|
10786
|
-
popsDOMUtils.removeClassName(liElement, `pops-${
|
|
10793
|
+
popsDOMUtils.removeClassName(liElement, `pops-${popsType}-is-visited`);
|
|
10787
10794
|
if (!liElement.__menuData__) {
|
|
10788
10795
|
return;
|
|
10789
10796
|
}
|
|
@@ -10808,7 +10815,7 @@ define((function () { 'use strict';
|
|
|
10808
10815
|
index--;
|
|
10809
10816
|
}
|
|
10810
10817
|
}
|
|
10811
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10818
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-is-visited`);
|
|
10812
10819
|
if (!item.item) {
|
|
10813
10820
|
return;
|
|
10814
10821
|
}
|
|
@@ -10931,7 +10938,7 @@ define((function () { 'use strict';
|
|
|
10931
10938
|
init(details) {
|
|
10932
10939
|
const guid = popsUtils.getRandomGUID();
|
|
10933
10940
|
// 设置当前类型
|
|
10934
|
-
const
|
|
10941
|
+
const popsType = "searchSuggestion";
|
|
10935
10942
|
let config = searchSuggestionConfig();
|
|
10936
10943
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10937
10944
|
config = popsUtils.assign(config, details);
|
|
@@ -10997,7 +11004,7 @@ define((function () { 'use strict';
|
|
|
10997
11004
|
SearchSuggestion.changeHintULElementPosition();
|
|
10998
11005
|
SearchSuggestion.hide();
|
|
10999
11006
|
if (config.isAnimation) {
|
|
11000
|
-
SearchSuggestion.$el.root.classList.add(`pops-${
|
|
11007
|
+
SearchSuggestion.$el.root.classList.add(`pops-${popsType}-animation`);
|
|
11001
11008
|
}
|
|
11002
11009
|
$shadowRoot.appendChild(SearchSuggestion.$el.root);
|
|
11003
11010
|
parentElement.appendChild($shadowContainer);
|
|
@@ -11014,16 +11021,16 @@ define((function () { 'use strict';
|
|
|
11014
11021
|
*/
|
|
11015
11022
|
getSearchSelectElement() {
|
|
11016
11023
|
let element = popsDOMUtils.createElement("div", {
|
|
11017
|
-
className: `pops pops-${
|
|
11024
|
+
className: `pops pops-${popsType}-search-suggestion`,
|
|
11018
11025
|
innerHTML: /*html*/ `
|
|
11019
11026
|
<style data-dynamic="true">
|
|
11020
11027
|
${this.getDynamicCSS()}
|
|
11021
11028
|
</style>
|
|
11022
|
-
<ul class="pops-${
|
|
11029
|
+
<ul class="pops-${popsType}-search-suggestion-hint">${config.toSearhNotResultHTML}</ul>
|
|
11023
11030
|
`,
|
|
11024
11031
|
}, {
|
|
11025
11032
|
"data-guid": guid,
|
|
11026
|
-
"type-value":
|
|
11033
|
+
"type-value": popsType,
|
|
11027
11034
|
});
|
|
11028
11035
|
if (config.className !== "" && config.className != null) {
|
|
11029
11036
|
popsDOMUtils.addClassName(element, config.className);
|
|
@@ -11033,24 +11040,24 @@ define((function () { 'use strict';
|
|
|
11033
11040
|
/** 动态获取CSS */
|
|
11034
11041
|
getDynamicCSS() {
|
|
11035
11042
|
return /*css*/ `
|
|
11036
|
-
.pops-${
|
|
11043
|
+
.pops-${popsType}-animation{
|
|
11037
11044
|
-moz-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11038
11045
|
-webkit-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11039
11046
|
-o-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11040
11047
|
-ms-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11041
11048
|
}
|
|
11042
|
-
.pops-${
|
|
11049
|
+
.pops-${popsType}-search-suggestion{
|
|
11043
11050
|
--search-suggestion-bg-color: #ffffff;
|
|
11044
11051
|
--search-suggestion-box-shadow-color: rgb(0 0 0 / 20%);
|
|
11045
11052
|
--search-suggestion-item-color: #515a6e;
|
|
11046
11053
|
--search-suggestion-item-none-color: #8e8e8e;
|
|
11047
11054
|
--search-suggestion-item-hover-bg-color: rgba(0, 0, 0, .1);
|
|
11048
11055
|
}
|
|
11049
|
-
.pops-${
|
|
11056
|
+
.pops-${popsType}-search-suggestion{
|
|
11050
11057
|
border: initial;
|
|
11051
11058
|
overflow: initial;
|
|
11052
11059
|
}
|
|
11053
|
-
ul.pops-${
|
|
11060
|
+
ul.pops-${popsType}-search-suggestion-hint{
|
|
11054
11061
|
position: ${config.isAbsolute ? "absolute" : "fixed"};
|
|
11055
11062
|
z-index: ${PopsHandler.handleZIndex(config.zIndex)};
|
|
11056
11063
|
width: 0;
|
|
@@ -11065,14 +11072,14 @@ define((function () { 'use strict';
|
|
|
11065
11072
|
box-shadow: 0 1px 6px var(--search-suggestion-box-shadow-color);
|
|
11066
11073
|
}
|
|
11067
11074
|
/* 建议框在上面时 */
|
|
11068
|
-
ul.pops-${
|
|
11075
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse]{
|
|
11069
11076
|
display: flex;
|
|
11070
11077
|
flex-direction: column-reverse;
|
|
11071
11078
|
}
|
|
11072
|
-
ul.pops-${
|
|
11079
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse] li{
|
|
11073
11080
|
flex-shrink: 0;
|
|
11074
11081
|
}
|
|
11075
|
-
ul.pops-${
|
|
11082
|
+
ul.pops-${popsType}-search-suggestion-hint li{
|
|
11076
11083
|
padding: 7px;
|
|
11077
11084
|
margin: 0;
|
|
11078
11085
|
clear: both;
|
|
@@ -11085,17 +11092,17 @@ define((function () { 'use strict';
|
|
|
11085
11092
|
text-overflow: ellipsis;
|
|
11086
11093
|
width: 100%;
|
|
11087
11094
|
}
|
|
11088
|
-
ul.pops-${
|
|
11095
|
+
ul.pops-${popsType}-search-suggestion-hint li[data-none]{
|
|
11089
11096
|
text-align: center;
|
|
11090
11097
|
font-size: 12px;
|
|
11091
11098
|
color: var(--search-suggestion-item-none-color);
|
|
11092
11099
|
}
|
|
11093
|
-
ul.pops-${
|
|
11100
|
+
ul.pops-${popsType}-search-suggestion-hint li:hover{
|
|
11094
11101
|
background-color: var(--search-suggestion-item-hover-bg-color);
|
|
11095
11102
|
}
|
|
11096
11103
|
|
|
11097
11104
|
@media (prefers-color-scheme: dark){
|
|
11098
|
-
.pops-${
|
|
11105
|
+
.pops-${popsType}-search-suggestion{
|
|
11099
11106
|
--search-suggestion-bg-color: #1d1e1f;
|
|
11100
11107
|
--search-suggestion-item-color: #cfd3d4;
|
|
11101
11108
|
--search-suggestion-item-hover-bg-color: rgba(175, 175, 175, .1);
|
|
@@ -11110,7 +11117,7 @@ define((function () { 'use strict';
|
|
|
11110
11117
|
*/
|
|
11111
11118
|
getSearchItemLiElement(data, index) {
|
|
11112
11119
|
return popsDOMUtils.createElement("li", {
|
|
11113
|
-
className: `pops-${
|
|
11120
|
+
className: `pops-${popsType}-search-suggestion-hint-item pops-flex-items-center pops-flex-y-center`,
|
|
11114
11121
|
"data-index": index,
|
|
11115
11122
|
"data-value": SearchSuggestion.getItemDataValue(data),
|
|
11116
11123
|
innerHTML: `${config.getItemHTML(data)}${config.deleteIcon.enable ? SearchSuggestion.getDeleteIconHTML() : ""}`,
|
|
@@ -11131,7 +11138,7 @@ define((function () { 'use strict';
|
|
|
11131
11138
|
popsDOMUtils.on(liElement, "click", void 0, (event) => {
|
|
11132
11139
|
popsDOMUtils.preventEvent(event);
|
|
11133
11140
|
let $click = event.target;
|
|
11134
|
-
if ($click.closest(`.pops-${
|
|
11141
|
+
if ($click.closest(`.pops-${popsType}-delete-icon`)) {
|
|
11135
11142
|
/* 点击的是删除按钮 */
|
|
11136
11143
|
if (typeof config.deleteIcon.callback === "function") {
|
|
11137
11144
|
config.deleteIcon.callback(event, liElement, liElement["data-value"]);
|
|
@@ -11323,7 +11330,7 @@ define((function () { 'use strict';
|
|
|
11323
11330
|
*/
|
|
11324
11331
|
getDeleteIconHTML(size = 16, fill = "#bababa") {
|
|
11325
11332
|
return /*html*/ `
|
|
11326
|
-
<svg class="pops-${
|
|
11333
|
+
<svg class="pops-${popsType}-delete-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="${fill}">
|
|
11327
11334
|
<path d="M512 883.2A371.2 371.2 0 1 0 140.8 512 371.2 371.2 0 0 0 512 883.2z m0 64a435.2 435.2 0 1 1 435.2-435.2 435.2 435.2 0 0 1-435.2 435.2z"></path>
|
|
11328
11335
|
<path d="M557.056 512l122.368 122.368a31.744 31.744 0 1 1-45.056 45.056L512 557.056l-122.368 122.368a31.744 31.744 0 1 1-45.056-45.056L466.944 512 344.576 389.632a31.744 31.744 0 1 1 45.056-45.056L512 466.944l122.368-122.368a31.744 31.744 0 1 1 45.056 45.056z"></path>
|
|
11329
11336
|
</svg>
|
|
@@ -11334,7 +11341,7 @@ define((function () { 'use strict';
|
|
|
11334
11341
|
*/
|
|
11335
11342
|
setPromptsInSearch() {
|
|
11336
11343
|
let isSearchingElement = popsDOMUtils.createElement("li", {
|
|
11337
|
-
className: `pops-${
|
|
11344
|
+
className: `pops-${popsType}-search-suggestion-hint-searching-item`,
|
|
11338
11345
|
innerHTML: config.searchingTip,
|
|
11339
11346
|
});
|
|
11340
11347
|
SearchSuggestion.$el.$hintULContainer.appendChild(isSearchingElement);
|
|
@@ -11344,7 +11351,7 @@ define((function () { 'use strict';
|
|
|
11344
11351
|
*/
|
|
11345
11352
|
removePromptsInSearch() {
|
|
11346
11353
|
SearchSuggestion.$el.$hintULContainer
|
|
11347
|
-
.querySelector(`li.pops-${
|
|
11354
|
+
.querySelector(`li.pops-${popsType}-search-suggestion-hint-searching-item`)
|
|
11348
11355
|
?.remove();
|
|
11349
11356
|
},
|
|
11350
11357
|
/**
|
|
@@ -11504,7 +11511,7 @@ define((function () { 'use strict';
|
|
|
11504
11511
|
/** 当前已配置的动画@keyframes名字映射(初始化时生成) */
|
|
11505
11512
|
animation: PopsAnimation.$data,
|
|
11506
11513
|
/** 存储已创建的元素 */
|
|
11507
|
-
|
|
11514
|
+
instData: PopsInstData,
|
|
11508
11515
|
/** 禁止滚动 */
|
|
11509
11516
|
forbiddenScroll: {
|
|
11510
11517
|
event(event) {
|