@whitesev/pops 1.5.2 → 1.5.4
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 +178 -83
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +178 -83
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +178 -83
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +178 -83
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +178 -83
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +178 -83
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/components/rightClickMenu/indexType.d.ts +1 -1
- package/dist/types/src/components/searchSuggestion/indexType.d.ts +1 -1
- package/dist/types/src/components/tooltip/indexType.d.ts +1 -1
- package/dist/types/src/handler/PopsElementHandler.d.ts +2 -1
- package/dist/types/src/handler/PopsHandler.d.ts +5 -0
- package/dist/types/src/types/components.d.ts +1 -1
- package/package.json +3 -2
- package/src/Pops.ts +1 -1
- package/src/components/alert/index.ts +6 -3
- package/src/components/confirm/index.ts +6 -3
- package/src/components/drawer/index.ts +6 -3
- package/src/components/folder/index.ts +79 -40
- package/src/components/iframe/index.ts +12 -8
- package/src/components/loading/index.ts +8 -3
- package/src/components/panel/index.ts +8 -3
- package/src/components/prompt/index.ts +7 -4
- package/src/components/rightClickMenu/index.ts +15 -3
- package/src/components/rightClickMenu/indexType.ts +1 -1
- package/src/components/searchSuggestion/index.ts +1 -1
- package/src/components/searchSuggestion/indexType.ts +1 -1
- package/src/components/tooltip/index.ts +3 -1
- package/src/components/tooltip/indexType.ts +1 -1
- package/src/handler/PopsElementHandler.ts +24 -18
- package/src/handler/PopsHandler.ts +27 -4
- package/src/types/components.d.ts +1 -1
- package/src/utils/PopsUtils.ts +8 -4
package/dist/index.esm.js
CHANGED
|
@@ -1522,17 +1522,21 @@ class PopsUtils {
|
|
|
1522
1522
|
else {
|
|
1523
1523
|
for (const targetKeyName in target) {
|
|
1524
1524
|
if (targetKeyName in source) {
|
|
1525
|
+
// @ts-ignore
|
|
1525
1526
|
let targetValue = target[targetKeyName];
|
|
1527
|
+
// @ts-ignore
|
|
1526
1528
|
let sourceValue = source[targetKeyName];
|
|
1527
1529
|
if (typeof sourceValue === "object" &&
|
|
1528
1530
|
sourceValue != null &&
|
|
1529
1531
|
!UtilsContext.isDOM(sourceValue) &&
|
|
1530
1532
|
Object.keys(sourceValue).length) {
|
|
1531
1533
|
/* 源端的值是object类型,且不是元素节点 */
|
|
1534
|
+
// @ts-ignore
|
|
1532
1535
|
target[targetKeyName] = UtilsContext.assign(targetValue, sourceValue, isAdd);
|
|
1533
1536
|
continue;
|
|
1534
1537
|
}
|
|
1535
1538
|
/* 直接赋值 */
|
|
1539
|
+
// @ts-ignore
|
|
1536
1540
|
target[targetKeyName] = sourceValue;
|
|
1537
1541
|
}
|
|
1538
1542
|
}
|
|
@@ -3550,6 +3554,9 @@ const PopsElementHandler = {
|
|
|
3550
3554
|
*/
|
|
3551
3555
|
getMaskHTML(guid, zIndex = 101, style = "") {
|
|
3552
3556
|
zIndex = zIndex - 100;
|
|
3557
|
+
if (style.startsWith(";")) {
|
|
3558
|
+
style = style.replace(";", "");
|
|
3559
|
+
}
|
|
3553
3560
|
return `<div class="pops-mask" data-guid="${guid}" style="z-index:${zIndex};${style}"></div>`;
|
|
3554
3561
|
},
|
|
3555
3562
|
/**
|
|
@@ -3559,15 +3566,16 @@ const PopsElementHandler = {
|
|
|
3559
3566
|
* @param config
|
|
3560
3567
|
* @param html
|
|
3561
3568
|
* @param bottomBtnHTML
|
|
3569
|
+
* @param zIndex
|
|
3562
3570
|
*/
|
|
3563
|
-
getAnimHTML(guid, type, config, html = "", bottomBtnHTML = "") {
|
|
3571
|
+
getAnimHTML(guid, type, config, html = "", bottomBtnHTML = "", zIndex) {
|
|
3564
3572
|
let __config = config;
|
|
3565
3573
|
let popsAnimStyle = "";
|
|
3566
3574
|
let popsStyle = "";
|
|
3567
3575
|
let popsPosition = __config.position || "";
|
|
3568
3576
|
if (config.zIndex != null) {
|
|
3569
|
-
popsAnimStyle += `z-index: ${
|
|
3570
|
-
popsStyle += `z-index: ${
|
|
3577
|
+
popsAnimStyle += `z-index: ${zIndex};`;
|
|
3578
|
+
popsStyle += `z-index: ${zIndex};`;
|
|
3571
3579
|
}
|
|
3572
3580
|
if (__config.width != null) {
|
|
3573
3581
|
popsStyle += `width: ${__config.width};`;
|
|
@@ -3576,24 +3584,25 @@ const PopsElementHandler = {
|
|
|
3576
3584
|
popsStyle += `height: ${__config.height};`;
|
|
3577
3585
|
}
|
|
3578
3586
|
let hasBottomBtn = bottomBtnHTML.trim() === "" ? false : true;
|
|
3579
|
-
return
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
|
|
3587
|
+
return /*html*/ `
|
|
3588
|
+
<div
|
|
3589
|
+
class="pops-anim"
|
|
3590
|
+
anim="${__config.animation || ""}"
|
|
3591
|
+
style="${popsAnimStyle};"
|
|
3592
|
+
data-guid="${guid}">
|
|
3584
3593
|
${config.style != null
|
|
3585
3594
|
? `<style tyle="text/css">${config.style}</style>`
|
|
3586
3595
|
: ""}
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
|
|
3590
|
-
|
|
3591
|
-
|
|
3592
|
-
|
|
3593
|
-
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
|
|
3596
|
+
<div
|
|
3597
|
+
class="pops ${config.class || ""}"
|
|
3598
|
+
data-bottom-btn="${hasBottomBtn}"
|
|
3599
|
+
type-value="${type}"
|
|
3600
|
+
style="${popsStyle}"
|
|
3601
|
+
position="${popsPosition}"
|
|
3602
|
+
data-guid="${guid}">
|
|
3603
|
+
${html}
|
|
3604
|
+
</div>
|
|
3605
|
+
</div>`;
|
|
3597
3606
|
},
|
|
3598
3607
|
/**
|
|
3599
3608
|
* 获取顶部按钮层HTML
|
|
@@ -4203,6 +4212,18 @@ const PopsHandler = {
|
|
|
4203
4212
|
capture: true,
|
|
4204
4213
|
});
|
|
4205
4214
|
},
|
|
4215
|
+
/**
|
|
4216
|
+
* 把配置的z-index配置转为数字
|
|
4217
|
+
* @param zIndex
|
|
4218
|
+
*/
|
|
4219
|
+
handleZIndex(zIndex) {
|
|
4220
|
+
if (typeof zIndex === "function") {
|
|
4221
|
+
return zIndex();
|
|
4222
|
+
}
|
|
4223
|
+
else {
|
|
4224
|
+
return zIndex;
|
|
4225
|
+
}
|
|
4226
|
+
},
|
|
4206
4227
|
/**
|
|
4207
4228
|
* 处理config.only
|
|
4208
4229
|
* @param type 当前弹窗类型
|
|
@@ -4228,8 +4249,19 @@ const PopsHandler = {
|
|
|
4228
4249
|
}
|
|
4229
4250
|
}
|
|
4230
4251
|
else {
|
|
4231
|
-
|
|
4232
|
-
|
|
4252
|
+
// 对配置进行处理
|
|
4253
|
+
// 选择配置的z-index和已有的pops实例的最大z-index值
|
|
4254
|
+
if (typeof config.zIndex === "function") {
|
|
4255
|
+
let originZIndexFn = config.zIndex;
|
|
4256
|
+
config.zIndex = () => {
|
|
4257
|
+
const { zIndex: maxZIndex } = PopsInstanceUtils.getPopsMaxZIndex(PopsHandler.handleZIndex(originZIndexFn) + 100);
|
|
4258
|
+
return maxZIndex;
|
|
4259
|
+
};
|
|
4260
|
+
}
|
|
4261
|
+
else {
|
|
4262
|
+
const { zIndex: maxZIndex } = PopsInstanceUtils.getPopsMaxZIndex(PopsHandler.handleZIndex(config.zIndex) + 100);
|
|
4263
|
+
config.zIndex = maxZIndex;
|
|
4264
|
+
}
|
|
4233
4265
|
}
|
|
4234
4266
|
return config;
|
|
4235
4267
|
},
|
|
@@ -4317,12 +4349,15 @@ class PopsAlert {
|
|
|
4317
4349
|
// 设置当前类型
|
|
4318
4350
|
const PopsType = "alert";
|
|
4319
4351
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
4320
|
-
|
|
4352
|
+
// 先把z-index提取出来
|
|
4353
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4354
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4321
4355
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
4322
4356
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
4323
4357
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
4324
4358
|
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
4325
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4359
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4360
|
+
/*html*/ `
|
|
4326
4361
|
<div
|
|
4327
4362
|
class="pops-alert-title"
|
|
4328
4363
|
style="text-align: ${config.title.position};
|
|
@@ -4337,7 +4372,7 @@ class PopsAlert {
|
|
|
4337
4372
|
? config.content.text
|
|
4338
4373
|
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}
|
|
4339
4374
|
</div>
|
|
4340
|
-
${bottomBtnHTML}`, bottomBtnHTML);
|
|
4375
|
+
${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4341
4376
|
/**
|
|
4342
4377
|
* 弹窗的主元素,包括动画层
|
|
4343
4378
|
*/
|
|
@@ -4499,12 +4534,15 @@ class PopsConfirm {
|
|
|
4499
4534
|
// 设置当前类型
|
|
4500
4535
|
const PopsType = "confirm";
|
|
4501
4536
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
4502
|
-
|
|
4537
|
+
// 先把z-index提取出来
|
|
4538
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4539
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4503
4540
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
4504
4541
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
4505
4542
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
4506
4543
|
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
4507
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4544
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4545
|
+
/*html*/ `
|
|
4508
4546
|
<div class="pops-confirm-title" style="text-align: ${config.title.position};${headerStyle}">
|
|
4509
4547
|
${config.title.html
|
|
4510
4548
|
? config.title.text
|
|
@@ -4518,7 +4556,7 @@ class PopsConfirm {
|
|
|
4518
4556
|
|
|
4519
4557
|
</div>
|
|
4520
4558
|
${bottomBtnHTML}
|
|
4521
|
-
`, bottomBtnHTML);
|
|
4559
|
+
`, bottomBtnHTML, zIndex);
|
|
4522
4560
|
/**
|
|
4523
4561
|
* 弹窗的主元素,包括动画层
|
|
4524
4562
|
*/
|
|
@@ -4687,12 +4725,15 @@ class PopsPrompt {
|
|
|
4687
4725
|
let guid = popsUtils.getRandomGUID();
|
|
4688
4726
|
const PopsType = "prompt";
|
|
4689
4727
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
4690
|
-
|
|
4728
|
+
// 先把z-index提取出来
|
|
4729
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4730
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4691
4731
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
4692
4732
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
4693
4733
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
4694
4734
|
let { contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
4695
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4735
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4736
|
+
/*html*/ `
|
|
4696
4737
|
<div class="pops-prompt-title" style="text-align: ${config.title.position};${headerStyle}">
|
|
4697
4738
|
${config.title.html
|
|
4698
4739
|
? config.title.text
|
|
@@ -4710,8 +4751,8 @@ class PopsPrompt {
|
|
|
4710
4751
|
(config.content.password ? "password" : "text") +
|
|
4711
4752
|
'">'}
|
|
4712
4753
|
</div>
|
|
4713
|
-
|
|
4714
|
-
`, bottomBtnHTML);
|
|
4754
|
+
${bottomBtnHTML}
|
|
4755
|
+
`, bottomBtnHTML, zIndex);
|
|
4715
4756
|
/**
|
|
4716
4757
|
* 弹窗的主元素,包括动画层
|
|
4717
4758
|
*/
|
|
@@ -4808,9 +4849,12 @@ class PopsLoading {
|
|
|
4808
4849
|
let guid = popsUtils.getRandomGUID();
|
|
4809
4850
|
const PopsType = "loading";
|
|
4810
4851
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
4811
|
-
|
|
4852
|
+
// 先把z-index提取出来
|
|
4853
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4854
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4812
4855
|
let { contentPStyle } = PopsElementHandler.getContentStyle("loading", config);
|
|
4813
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4856
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4857
|
+
/*html*/ `
|
|
4814
4858
|
<div class="pops-loading-content">
|
|
4815
4859
|
${config.addIndexCSS
|
|
4816
4860
|
? `
|
|
@@ -4825,7 +4869,7 @@ class PopsLoading {
|
|
|
4825
4869
|
${config.style != null ? `<style>${config.style}</style>` : ""}
|
|
4826
4870
|
<p pops style="${contentPStyle}">${config.content.text}</p>
|
|
4827
4871
|
</div>
|
|
4828
|
-
`, "");
|
|
4872
|
+
`, "", zIndex);
|
|
4829
4873
|
/**
|
|
4830
4874
|
* 弹窗的主元素,包括动画层
|
|
4831
4875
|
*/
|
|
@@ -4941,12 +4985,15 @@ class PopsIframe {
|
|
|
4941
4985
|
let maskExtraStyle = config.animation != null && config.animation != ""
|
|
4942
4986
|
? "position:absolute;"
|
|
4943
4987
|
: "";
|
|
4944
|
-
|
|
4988
|
+
// 先把z-index提取出来
|
|
4989
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4990
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex, maskExtraStyle);
|
|
4945
4991
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
4946
4992
|
let iframeLoadingHTML = '<div class="pops-loading"></div>';
|
|
4947
4993
|
let titleText = config.title.text.trim() !== "" ? config.title.text : config.url;
|
|
4948
4994
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
4949
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4995
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4996
|
+
/*html*/ `
|
|
4950
4997
|
<div
|
|
4951
4998
|
class="pops-iframe-title"
|
|
4952
4999
|
style="text-align: ${config.title.position};${headerStyle}"
|
|
@@ -4967,7 +5014,7 @@ class PopsIframe {
|
|
|
4967
5014
|
</iframe>
|
|
4968
5015
|
</div>
|
|
4969
5016
|
${config.loading.enable ? iframeLoadingHTML : ""}
|
|
4970
|
-
`, "");
|
|
5017
|
+
`, "", zIndex);
|
|
4971
5018
|
/**
|
|
4972
5019
|
* 弹窗的主元素,包括动画层
|
|
4973
5020
|
*/
|
|
@@ -5199,7 +5246,7 @@ class PopsTooltip {
|
|
|
5199
5246
|
popsDOMUtils.addClassName(_toolTipElement_, config.className);
|
|
5200
5247
|
}
|
|
5201
5248
|
_toolTipElement_.setAttribute("data-guid", guid);
|
|
5202
|
-
_toolTipElement_.style.zIndex = config.zIndex.toString();
|
|
5249
|
+
_toolTipElement_.style.zIndex = PopsHandler.handleZIndex(config.zIndex).toString();
|
|
5203
5250
|
_toolTipElement_.innerHTML = `<div style="text-align: center;">${getContent()}</div>`;
|
|
5204
5251
|
/* 箭头元素 */
|
|
5205
5252
|
let _toolTipArrowHTML_ = '<div class="pops-tip-arrow"></div>';
|
|
@@ -5516,12 +5563,15 @@ class PopsDrawer {
|
|
|
5516
5563
|
let guid = popsUtils.getRandomGUID();
|
|
5517
5564
|
const PopsType = "drawer";
|
|
5518
5565
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
5519
|
-
|
|
5566
|
+
// 先把z-index提取出来
|
|
5567
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5568
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5520
5569
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
5521
5570
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
5522
5571
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
5523
5572
|
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
5524
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
5573
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
5574
|
+
/*html*/ `
|
|
5525
5575
|
${config.title.enable
|
|
5526
5576
|
? `
|
|
5527
5577
|
<div class="pops-${PopsType}-title" style="${headerStyle}">
|
|
@@ -5545,7 +5595,7 @@ class PopsDrawer {
|
|
|
5545
5595
|
</div>
|
|
5546
5596
|
|
|
5547
5597
|
${bottomBtnHTML}
|
|
5548
|
-
`, bottomBtnHTML);
|
|
5598
|
+
`, bottomBtnHTML, zIndex);
|
|
5549
5599
|
/**
|
|
5550
5600
|
* 弹窗的主元素,包括动画层
|
|
5551
5601
|
*/
|
|
@@ -5903,7 +5953,9 @@ class PopsFolder {
|
|
|
5903
5953
|
let guid = popsUtils.getRandomGUID();
|
|
5904
5954
|
const PopsType = "folder";
|
|
5905
5955
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
5906
|
-
|
|
5956
|
+
// 先把z-index提取出来
|
|
5957
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5958
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5907
5959
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
5908
5960
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
5909
5961
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
@@ -6014,7 +6066,7 @@ class PopsFolder {
|
|
|
6014
6066
|
</div>
|
|
6015
6067
|
</div>
|
|
6016
6068
|
${bottomBtnHTML}
|
|
6017
|
-
`, bottomBtnHTML);
|
|
6069
|
+
`, bottomBtnHTML, zIndex);
|
|
6018
6070
|
/**
|
|
6019
6071
|
* 弹窗的主元素,包括动画层
|
|
6020
6072
|
*/
|
|
@@ -6065,8 +6117,9 @@ class PopsFolder {
|
|
|
6065
6117
|
* @param fileName
|
|
6066
6118
|
* @param latestTime
|
|
6067
6119
|
* @param [fileSize="-"]
|
|
6120
|
+
* @param isFolder
|
|
6068
6121
|
*/
|
|
6069
|
-
function createFolderRowElement(fileName, latestTime = "-", fileSize = "-") {
|
|
6122
|
+
function createFolderRowElement(fileName, latestTime = "-", fileSize = "-", isFolder = false) {
|
|
6070
6123
|
let origin_fileName = fileName;
|
|
6071
6124
|
let origin_latestTime = latestTime;
|
|
6072
6125
|
let origin_fileSize = fileSize;
|
|
@@ -6076,7 +6129,7 @@ class PopsFolder {
|
|
|
6076
6129
|
let fileFormatSize = popsDOMUtils.createElement("td");
|
|
6077
6130
|
let fileType = "";
|
|
6078
6131
|
let fileIcon = Folder_ICON.folder;
|
|
6079
|
-
if (
|
|
6132
|
+
if (isFolder) {
|
|
6080
6133
|
/* 文件夹 */
|
|
6081
6134
|
latestTime = "";
|
|
6082
6135
|
fileSize = "";
|
|
@@ -6131,6 +6184,7 @@ class PopsFolder {
|
|
|
6131
6184
|
fileName: origin_fileName,
|
|
6132
6185
|
latestTime: origin_latestTime,
|
|
6133
6186
|
fileSize: origin_fileSize,
|
|
6187
|
+
isFolder: isFolder,
|
|
6134
6188
|
};
|
|
6135
6189
|
fileNameElement["__value__"] = __value__;
|
|
6136
6190
|
fileTimeElement["__value__"] = __value__;
|
|
@@ -6149,7 +6203,7 @@ class PopsFolder {
|
|
|
6149
6203
|
/**
|
|
6150
6204
|
* 创建移动端文件夹元素
|
|
6151
6205
|
*/
|
|
6152
|
-
function createMobileFolderRowElement(fileName, latestTime = "-", fileSize = "-") {
|
|
6206
|
+
function createMobileFolderRowElement(fileName, latestTime = "-", fileSize = "-", isFolder = false) {
|
|
6153
6207
|
let origin_fileName = fileName;
|
|
6154
6208
|
let origin_latestTime = latestTime;
|
|
6155
6209
|
let origin_fileSize = fileSize;
|
|
@@ -6157,7 +6211,7 @@ class PopsFolder {
|
|
|
6157
6211
|
let fileNameElement = popsDOMUtils.createElement("td");
|
|
6158
6212
|
let fileType = "";
|
|
6159
6213
|
let fileIcon = Folder_ICON.folder;
|
|
6160
|
-
if (
|
|
6214
|
+
if (isFolder) {
|
|
6161
6215
|
/* 文件夹 */
|
|
6162
6216
|
latestTime = "";
|
|
6163
6217
|
fileSize = "";
|
|
@@ -6201,6 +6255,7 @@ class PopsFolder {
|
|
|
6201
6255
|
fileName: origin_fileName,
|
|
6202
6256
|
latestTime: origin_latestTime,
|
|
6203
6257
|
fileSize: origin_fileSize,
|
|
6258
|
+
isFolder: isFolder,
|
|
6204
6259
|
};
|
|
6205
6260
|
fileNameElement["__value__"] = __value__;
|
|
6206
6261
|
folderELement["__value__"] = __value__;
|
|
@@ -6374,30 +6429,24 @@ class PopsFolder {
|
|
|
6374
6429
|
}
|
|
6375
6430
|
/**
|
|
6376
6431
|
* 对配置进行排序
|
|
6377
|
-
* @param
|
|
6432
|
+
* @param folderDataConfigList
|
|
6378
6433
|
* @param sortName 比较的属性,默认fileName
|
|
6379
6434
|
* @param isDesc 是否降序,默认false(升序)
|
|
6380
6435
|
*/
|
|
6381
|
-
function sortFolderConfig(
|
|
6382
|
-
|
|
6383
|
-
|
|
6384
|
-
|
|
6385
|
-
|
|
6386
|
-
|
|
6387
|
-
|
|
6388
|
-
|
|
6389
|
-
|
|
6390
|
-
|
|
6391
|
-
|
|
6392
|
-
|
|
6393
|
-
|
|
6394
|
-
|
|
6395
|
-
else if (sortName === "latestTime") {
|
|
6396
|
-
/* 文件时间 */
|
|
6397
|
-
beforeVal = new Date(beforeVal).getTime();
|
|
6398
|
-
afterVal = new Date(afterVal).getTime();
|
|
6399
|
-
}
|
|
6400
|
-
if (typeof beforeVal === "string" && typeof afterVal === "string") {
|
|
6436
|
+
function sortFolderConfig(folderDataConfigList, sortName = "fileName", isDesc = false) {
|
|
6437
|
+
console.log(folderDataConfigList, sortName, isDesc);
|
|
6438
|
+
if (sortName === "fileName") {
|
|
6439
|
+
// 如果是以文件名排序,文件夹优先放前面
|
|
6440
|
+
let onlyFolderDataConfigList = folderDataConfigList.filter((value) => {
|
|
6441
|
+
return value.isFolder;
|
|
6442
|
+
});
|
|
6443
|
+
let onlyFileDataConfigList = folderDataConfigList.filter((value) => {
|
|
6444
|
+
return !value.isFolder;
|
|
6445
|
+
});
|
|
6446
|
+
// 文件夹排序
|
|
6447
|
+
onlyFolderDataConfigList.sort((leftConfig, rightConfig) => {
|
|
6448
|
+
let beforeVal = leftConfig[sortName].toString();
|
|
6449
|
+
let afterVal = rightConfig[sortName].toString();
|
|
6401
6450
|
let compareVal = beforeVal.localeCompare(afterVal);
|
|
6402
6451
|
if (isDesc) {
|
|
6403
6452
|
/* 降序 */
|
|
@@ -6409,8 +6458,46 @@ class PopsFolder {
|
|
|
6409
6458
|
}
|
|
6410
6459
|
}
|
|
6411
6460
|
return compareVal;
|
|
6461
|
+
});
|
|
6462
|
+
// 文件名排序
|
|
6463
|
+
onlyFileDataConfigList.sort((leftConfig, rightConfig) => {
|
|
6464
|
+
let beforeVal = leftConfig[sortName].toString();
|
|
6465
|
+
let afterVal = rightConfig[sortName].toString();
|
|
6466
|
+
let compareVal = beforeVal.localeCompare(afterVal);
|
|
6467
|
+
if (isDesc) {
|
|
6468
|
+
/* 降序 */
|
|
6469
|
+
if (compareVal > 0) {
|
|
6470
|
+
compareVal = -1;
|
|
6471
|
+
}
|
|
6472
|
+
else if (compareVal < 0) {
|
|
6473
|
+
compareVal = 1;
|
|
6474
|
+
}
|
|
6475
|
+
}
|
|
6476
|
+
return compareVal;
|
|
6477
|
+
});
|
|
6478
|
+
if (isDesc) {
|
|
6479
|
+
// 降序,文件夹在下面
|
|
6480
|
+
return [...onlyFileDataConfigList, ...onlyFolderDataConfigList];
|
|
6412
6481
|
}
|
|
6413
6482
|
else {
|
|
6483
|
+
// 升序,文件夹在上面
|
|
6484
|
+
return [...onlyFolderDataConfigList, ...onlyFileDataConfigList];
|
|
6485
|
+
}
|
|
6486
|
+
}
|
|
6487
|
+
else {
|
|
6488
|
+
folderDataConfigList.sort((beforeConfig, afterConfig) => {
|
|
6489
|
+
let beforeVal = beforeConfig[sortName];
|
|
6490
|
+
let afterVal = afterConfig[sortName];
|
|
6491
|
+
if (sortName === "fileSize") {
|
|
6492
|
+
/* 文件大小,进行Float转换 */
|
|
6493
|
+
beforeVal = parseFloat(beforeVal.toString());
|
|
6494
|
+
afterVal = parseFloat(afterVal.toString());
|
|
6495
|
+
}
|
|
6496
|
+
else if (sortName === "latestTime") {
|
|
6497
|
+
/* 文件时间 */
|
|
6498
|
+
beforeVal = new Date(beforeVal).getTime();
|
|
6499
|
+
afterVal = new Date(afterVal).getTime();
|
|
6500
|
+
}
|
|
6414
6501
|
if (beforeVal > afterVal) {
|
|
6415
6502
|
if (isDesc) {
|
|
6416
6503
|
/* 降序 */
|
|
@@ -6432,9 +6519,9 @@ class PopsFolder {
|
|
|
6432
6519
|
else {
|
|
6433
6520
|
return 0;
|
|
6434
6521
|
}
|
|
6435
|
-
}
|
|
6436
|
-
|
|
6437
|
-
|
|
6522
|
+
});
|
|
6523
|
+
return folderDataConfigList;
|
|
6524
|
+
}
|
|
6438
6525
|
}
|
|
6439
6526
|
/**
|
|
6440
6527
|
* 添加元素
|
|
@@ -6445,8 +6532,8 @@ class PopsFolder {
|
|
|
6445
6532
|
_config_.forEach((item) => {
|
|
6446
6533
|
if (item["isFolder"]) {
|
|
6447
6534
|
let { folderELement, fileNameElement } = pops.isPhone()
|
|
6448
|
-
? createMobileFolderRowElement(item["fileName"])
|
|
6449
|
-
: createFolderRowElement(item["fileName"]);
|
|
6535
|
+
? createMobileFolderRowElement(item["fileName"], "", "", true)
|
|
6536
|
+
: createFolderRowElement(item["fileName"], "", "", true);
|
|
6450
6537
|
popsDOMUtils.on(fileNameElement, "click", (event) => {
|
|
6451
6538
|
refreshFolderInfoClickEvent(event, item);
|
|
6452
6539
|
});
|
|
@@ -6454,8 +6541,8 @@ class PopsFolder {
|
|
|
6454
6541
|
}
|
|
6455
6542
|
else {
|
|
6456
6543
|
let { folderELement, fileNameElement } = pops.isPhone()
|
|
6457
|
-
? createMobileFolderRowElement(item["fileName"], item
|
|
6458
|
-
: createFolderRowElement(item["fileName"], item
|
|
6544
|
+
? createMobileFolderRowElement(item["fileName"], item.latestTime, item.fileSize, false)
|
|
6545
|
+
: createFolderRowElement(item["fileName"], item.latestTime, item.fileSize, false);
|
|
6459
6546
|
setFileClickEvent(fileNameElement, item);
|
|
6460
6547
|
folderListBodyElement.appendChild(folderELement);
|
|
6461
6548
|
}
|
|
@@ -6492,7 +6579,6 @@ class PopsFolder {
|
|
|
6492
6579
|
* @param {PointerEvent} target
|
|
6493
6580
|
* @param {HTMLElement} event
|
|
6494
6581
|
* @param {string} sortName
|
|
6495
|
-
* @returns
|
|
6496
6582
|
*/
|
|
6497
6583
|
function arrowSortClickEvent(target, event, sortName) {
|
|
6498
6584
|
if (!event["notChangeSortRule"]) {
|
|
@@ -6971,10 +7057,13 @@ class PopsPanel {
|
|
|
6971
7057
|
let guid = popsUtils.getRandomGUID();
|
|
6972
7058
|
const PopsType = "panel";
|
|
6973
7059
|
config = PopsHandler.handleOnly(PopsType, config);
|
|
6974
|
-
|
|
7060
|
+
// 先把z-index提取出来
|
|
7061
|
+
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
7062
|
+
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
6975
7063
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
6976
7064
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
6977
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
7065
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
7066
|
+
/*html*/ `
|
|
6978
7067
|
<div
|
|
6979
7068
|
class="pops-${PopsType}-title"
|
|
6980
7069
|
style="text-align: ${config.title.position};
|
|
@@ -6992,7 +7081,7 @@ class PopsPanel {
|
|
|
6992
7081
|
<ul class="pops-panel-container-header-ul"></ul>
|
|
6993
7082
|
<ul></ul>
|
|
6994
7083
|
</section>
|
|
6995
|
-
</div>`, "");
|
|
7084
|
+
</div>`, "", zIndex);
|
|
6996
7085
|
/**
|
|
6997
7086
|
* 弹窗的主元素,包括动画层
|
|
6998
7087
|
*/
|
|
@@ -9083,7 +9172,7 @@ class PopsRightClickMenu {
|
|
|
9083
9172
|
* @param isChildren 是否是rightClickMenu的某一项的子菜单
|
|
9084
9173
|
*/
|
|
9085
9174
|
getMenuContainerElement(zIndex, isChildren) {
|
|
9086
|
-
let menuElement = popsUtils.parseTextToDOM(`
|
|
9175
|
+
let menuElement = popsUtils.parseTextToDOM(/*html*/ `
|
|
9087
9176
|
<div class="pops-${PopsType}" ${isChildren ? 'is-children="true"' : ""}>
|
|
9088
9177
|
<style type="text/css" data-from="pops-${PopsType}">
|
|
9089
9178
|
.pops-${PopsType} *{
|
|
@@ -9171,6 +9260,12 @@ class PopsRightClickMenu {
|
|
|
9171
9260
|
}
|
|
9172
9261
|
return menuElement;
|
|
9173
9262
|
},
|
|
9263
|
+
/**
|
|
9264
|
+
* 动态获取配的z-index
|
|
9265
|
+
*/
|
|
9266
|
+
getMenuZIndex() {
|
|
9267
|
+
return PopsHandler.handleZIndex(config.zIndex);
|
|
9268
|
+
},
|
|
9174
9269
|
/**
|
|
9175
9270
|
* 获取left、top偏移
|
|
9176
9271
|
* @param menuElement 菜单元素
|
|
@@ -9205,7 +9300,7 @@ class PopsRightClickMenu {
|
|
|
9205
9300
|
* @param _config_
|
|
9206
9301
|
*/
|
|
9207
9302
|
showMenu(menuEvent, _config_) {
|
|
9208
|
-
let menuElement = this.getMenuContainerElement(
|
|
9303
|
+
let menuElement = this.getMenuContainerElement(this.getMenuZIndex(), false);
|
|
9209
9304
|
menuElement["__menuData__"] = {
|
|
9210
9305
|
child: [],
|
|
9211
9306
|
};
|
|
@@ -9243,7 +9338,7 @@ class PopsRightClickMenu {
|
|
|
9243
9338
|
* @param targetLiElement 父li项元素
|
|
9244
9339
|
*/
|
|
9245
9340
|
showClildMenu(menuEvent, posInfo, _config_, rootElement, targetLiElement) {
|
|
9246
|
-
let menuElement = this.getMenuContainerElement(
|
|
9341
|
+
let menuElement = this.getMenuContainerElement(this.getMenuZIndex(), true);
|
|
9247
9342
|
menuElement["__menuData__"] = {
|
|
9248
9343
|
parent: targetLiElement,
|
|
9249
9344
|
root: rootElement,
|
|
@@ -9509,7 +9604,7 @@ class PopsSearchSuggestion {
|
|
|
9509
9604
|
}
|
|
9510
9605
|
ul.pops-${PopsType}-search-suggestion-hint{
|
|
9511
9606
|
position: ${config.isAbsolute ? "absolute" : "fixed"};
|
|
9512
|
-
z-index: ${config.zIndex};
|
|
9607
|
+
z-index: ${PopsHandler.handleZIndex(config.zIndex)};
|
|
9513
9608
|
width: 0;
|
|
9514
9609
|
left: 0;
|
|
9515
9610
|
max-height: ${config.maxHeight};
|
|
@@ -9946,7 +10041,7 @@ class Pops {
|
|
|
9946
10041
|
/** 配置 */
|
|
9947
10042
|
config = {
|
|
9948
10043
|
/** 版本号 */
|
|
9949
|
-
version: "2024.
|
|
10044
|
+
version: "2024.9.10",
|
|
9950
10045
|
cssText: {
|
|
9951
10046
|
/** 主CSS */
|
|
9952
10047
|
index: indexCSS,
|