@whitesev/pops 2.0.1 → 2.0.3
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 +86 -218
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +86 -218
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +86 -218
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +86 -218
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +86 -218
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +86 -218
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/handler/PopsElementHandler.d.ts +4 -4
- package/package.json +1 -1
- package/src/Pops.ts +1 -1
- package/src/components/alert/index.ts +13 -20
- package/src/components/confirm/index.ts +10 -20
- package/src/components/drawer/index.ts +11 -26
- package/src/components/folder/index.ts +11 -20
- package/src/components/iframe/index.ts +14 -23
- package/src/components/loading/index.ts +7 -9
- package/src/components/panel/PanelHandleContentDetails.ts +20 -37
- package/src/components/panel/index.ts +7 -11
- package/src/components/prompt/index.ts +16 -23
- package/src/components/rightClickMenu/index.ts +9 -7
- package/src/components/searchSuggestion/index.ts +8 -13
- package/src/handler/PopsElementHandler.ts +33 -72
package/dist/index.cjs.js
CHANGED
|
@@ -2471,7 +2471,7 @@ const PopsElementHandler = {
|
|
|
2471
2471
|
if (style.startsWith(";")) {
|
|
2472
2472
|
style = style.replace(";", "");
|
|
2473
2473
|
}
|
|
2474
|
-
return `<div class="pops-mask" data-guid="${guid}" style="z-index:${zIndex};${style}"></div>`;
|
|
2474
|
+
return /*html*/ `<div class="pops-mask" data-guid="${guid}" style="z-index:${zIndex};${style}"></div>`;
|
|
2475
2475
|
},
|
|
2476
2476
|
/**
|
|
2477
2477
|
* 获取动画层HTML
|
|
@@ -2499,23 +2499,10 @@ const PopsElementHandler = {
|
|
|
2499
2499
|
}
|
|
2500
2500
|
let hasBottomBtn = bottomBtnHTML.trim() === "" ? false : true;
|
|
2501
2501
|
return /*html*/ `
|
|
2502
|
-
<div
|
|
2503
|
-
class="pops-anim"
|
|
2504
|
-
anim="${__config.animation || ""}"
|
|
2505
|
-
style="${popsAnimStyle}"
|
|
2506
|
-
data-guid="${guid}">
|
|
2507
|
-
${config.style != null
|
|
2502
|
+
<div class="pops-anim" anim="${__config.animation || ""}" style="${popsAnimStyle}" data-guid="${guid}">${config.style != null
|
|
2508
2503
|
? `<style tyle="text/css">${config.style}</style>`
|
|
2509
2504
|
: ""}
|
|
2510
|
-
<div
|
|
2511
|
-
class="pops ${config.class || ""}"
|
|
2512
|
-
data-bottom-btn="${hasBottomBtn}"
|
|
2513
|
-
type-value="${type}"
|
|
2514
|
-
style="${popsStyle}"
|
|
2515
|
-
position="${popsPosition}"
|
|
2516
|
-
data-guid="${guid}">
|
|
2517
|
-
${html}
|
|
2518
|
-
</div>
|
|
2505
|
+
<div class="pops ${config.class || ""}" data-bottom-btn="${hasBottomBtn}" type-value="${type}" style="${popsStyle}" position="${popsPosition}" data-guid="${guid}">${html}</div>
|
|
2519
2506
|
</div>`;
|
|
2520
2507
|
},
|
|
2521
2508
|
/**
|
|
@@ -2540,22 +2527,20 @@ const PopsElementHandler = {
|
|
|
2540
2527
|
let topRightButtonHTML = "";
|
|
2541
2528
|
__config_iframe.topRightButton.split("|").forEach((item) => {
|
|
2542
2529
|
item = item.toLowerCase();
|
|
2543
|
-
topRightButtonHTML += `
|
|
2530
|
+
topRightButtonHTML += /*html*/ `
|
|
2544
2531
|
<button class="pops-header-control" type="${item}">
|
|
2545
2532
|
<i class="pops-icon">${pops.config.iconSVG[item]}</i>
|
|
2546
2533
|
</button>`;
|
|
2547
2534
|
});
|
|
2548
|
-
resultHTML = `
|
|
2549
|
-
<div class="pops-header-controls" data-margin
|
|
2550
|
-
${topRightButtonHTML}
|
|
2551
|
-
</div>`;
|
|
2535
|
+
resultHTML = /*html*/ `
|
|
2536
|
+
<div class="pops-header-controls" data-margin>${topRightButtonHTML}</div>`;
|
|
2552
2537
|
}
|
|
2553
2538
|
else {
|
|
2554
2539
|
if (__config_confirm.btn?.close?.enable) {
|
|
2555
|
-
closeHTML = `
|
|
2540
|
+
closeHTML = /*html*/ `
|
|
2556
2541
|
<div class="pops-header-controls">
|
|
2557
2542
|
<button class="pops-header-control" type="close" data-header>
|
|
2558
|
-
|
|
2543
|
+
<i class="pops-icon">${pops.config.iconSVG["close"]}</i>
|
|
2559
2544
|
</button>
|
|
2560
2545
|
</div>`;
|
|
2561
2546
|
}
|
|
@@ -2612,20 +2597,15 @@ const PopsElementHandler = {
|
|
|
2612
2597
|
iconHTML = okIcon;
|
|
2613
2598
|
}
|
|
2614
2599
|
iconHTML = iconHTML || "";
|
|
2615
|
-
okIconHTML =
|
|
2616
|
-
<i class="pops-bottom-icon" is-loading="${config.btn.ok.iconIsLoading}">
|
|
2617
|
-
${iconHTML}
|
|
2618
|
-
</i>`;
|
|
2600
|
+
okIconHTML = /*html*/ `<i class="pops-bottom-icon" is-loading="${config.btn.ok.iconIsLoading}">${iconHTML}</i>`;
|
|
2619
2601
|
}
|
|
2620
|
-
okHTML = `
|
|
2602
|
+
okHTML = /*html*/ `
|
|
2621
2603
|
<button
|
|
2622
2604
|
class="pops-${type}-btn-ok ${okButtonSizeClassName}"
|
|
2623
2605
|
type="${__config_confirm.btn.ok?.type}"
|
|
2624
2606
|
data-has-icon="${(__config_confirm.btn.ok.icon || "") !== ""}"
|
|
2625
2607
|
data-rightIcon="${__config_confirm.btn.ok?.rightIcon}"
|
|
2626
|
-
>
|
|
2627
|
-
${okIconHTML}
|
|
2628
|
-
<span>${config.btn.ok.text}</span>
|
|
2608
|
+
>${okIconHTML}<span>${config.btn.ok.text}</span>
|
|
2629
2609
|
</button>`;
|
|
2630
2610
|
}
|
|
2631
2611
|
if (__config_confirm.btn?.cancel?.enable) {
|
|
@@ -2651,20 +2631,15 @@ const PopsElementHandler = {
|
|
|
2651
2631
|
iconHTML = cancelIcon;
|
|
2652
2632
|
}
|
|
2653
2633
|
iconHTML = iconHTML || "";
|
|
2654
|
-
cancelIconHTML =
|
|
2655
|
-
<i class="pops-bottom-icon" is-loading="${__config_confirm.btn.cancel.iconIsLoading}">
|
|
2656
|
-
${iconHTML}
|
|
2657
|
-
</i>`;
|
|
2634
|
+
cancelIconHTML = /*html*/ `<i class="pops-bottom-icon" is-loading="${__config_confirm.btn.cancel.iconIsLoading}">${iconHTML}</i>`;
|
|
2658
2635
|
}
|
|
2659
|
-
cancelHTML = `
|
|
2636
|
+
cancelHTML = /*html*/ `
|
|
2660
2637
|
<button
|
|
2661
2638
|
class="pops-${type}-btn-cancel ${cancelButtonSizeClassName}"
|
|
2662
2639
|
type="${__config_confirm.btn.cancel.type}"
|
|
2663
2640
|
data-has-icon="${(__config_confirm.btn.cancel.icon || "") !== ""}"
|
|
2664
2641
|
data-rightIcon="${__config_confirm.btn.cancel.rightIcon}"
|
|
2665
|
-
>
|
|
2666
|
-
${cancelIconHTML}
|
|
2667
|
-
<span>${__config_confirm.btn.cancel.text}</span>
|
|
2642
|
+
>${cancelIconHTML}<span>${__config_confirm.btn.cancel.text}</span>
|
|
2668
2643
|
</button>`;
|
|
2669
2644
|
}
|
|
2670
2645
|
if (__config_confirm.btn?.other?.enable) {
|
|
@@ -2687,20 +2662,15 @@ const PopsElementHandler = {
|
|
|
2687
2662
|
iconHTML = pops.config.iconSVG[otherIcon];
|
|
2688
2663
|
}
|
|
2689
2664
|
iconHTML = iconHTML || "";
|
|
2690
|
-
otherIconHTML =
|
|
2691
|
-
<i class="pops-bottom-icon" is-loading="${__config_confirm.btn.other.iconIsLoading}">
|
|
2692
|
-
${iconHTML}
|
|
2693
|
-
</i>`;
|
|
2665
|
+
otherIconHTML = /*html*/ `<i class="pops-bottom-icon" is-loading="${__config_confirm.btn.other.iconIsLoading}">${iconHTML}</i>`;
|
|
2694
2666
|
}
|
|
2695
|
-
ohterHTML = `
|
|
2667
|
+
ohterHTML = /*html*/ `
|
|
2696
2668
|
<button
|
|
2697
2669
|
class="pops-${type}-btn-other ${otherButtonSizeClassName}"
|
|
2698
2670
|
type="${__config_confirm.btn.other.type}"
|
|
2699
2671
|
data-has-icon="${(__config_confirm.btn.other.icon || "") !== ""}"
|
|
2700
2672
|
data-rightIcon="${__config_confirm.btn.other.rightIcon}"
|
|
2701
|
-
>
|
|
2702
|
-
${otherIconHTML}
|
|
2703
|
-
<span>${__config_confirm.btn.other.text}</span>
|
|
2673
|
+
>${otherIconHTML}<span>${__config_confirm.btn.other.text}</span>
|
|
2704
2674
|
</button>`;
|
|
2705
2675
|
}
|
|
2706
2676
|
if (__config_confirm.btn.merge) {
|
|
@@ -2711,33 +2681,22 @@ const PopsElementHandler = {
|
|
|
2711
2681
|
else {
|
|
2712
2682
|
flexStyle += "flex-direction: row;";
|
|
2713
2683
|
}
|
|
2714
|
-
resultHTML = `
|
|
2715
|
-
<div class="pops-${type}-btn" style="${btnStyle}"
|
|
2716
|
-
${ohterHTML}
|
|
2717
|
-
<div
|
|
2684
|
+
resultHTML = /*html*/ `
|
|
2685
|
+
<div class="pops-${type}-btn" style="${btnStyle}">${ohterHTML}<div
|
|
2718
2686
|
class="pops-${type}-btn-merge"
|
|
2719
|
-
style="${flexStyle}">
|
|
2720
|
-
${okHTML}
|
|
2721
|
-
${cancelHTML}
|
|
2722
|
-
</div>
|
|
2687
|
+
style="${flexStyle}">${okHTML}${cancelHTML}</div>
|
|
2723
2688
|
</div>
|
|
2724
2689
|
`;
|
|
2725
2690
|
}
|
|
2726
2691
|
else {
|
|
2727
|
-
resultHTML =
|
|
2728
|
-
<div class="pops-${type}-btn" style="${btnStyle}">
|
|
2729
|
-
${okHTML}
|
|
2730
|
-
${cancelHTML}
|
|
2731
|
-
${ohterHTML}
|
|
2732
|
-
</div>
|
|
2733
|
-
`;
|
|
2692
|
+
resultHTML = /*html*/ `<div class="pops-${type}-btn" style="${btnStyle}">${okHTML}${cancelHTML}${ohterHTML}</div>`;
|
|
2734
2693
|
}
|
|
2735
2694
|
return resultHTML;
|
|
2736
2695
|
},
|
|
2737
2696
|
/**
|
|
2738
2697
|
* 获取标题style
|
|
2739
|
-
* @param type
|
|
2740
|
-
* @param config
|
|
2698
|
+
* @param type 弹窗类型
|
|
2699
|
+
* @param config 弹窗配置
|
|
2741
2700
|
*/
|
|
2742
2701
|
getHeaderStyle(type, config) {
|
|
2743
2702
|
return {
|
|
@@ -2747,8 +2706,8 @@ const PopsElementHandler = {
|
|
|
2747
2706
|
},
|
|
2748
2707
|
/**
|
|
2749
2708
|
* 获取内容style
|
|
2750
|
-
* @param type
|
|
2751
|
-
* @param config
|
|
2709
|
+
* @param type 弹窗类型
|
|
2710
|
+
* @param config 弹窗配置
|
|
2752
2711
|
*/
|
|
2753
2712
|
getContentStyle(type, config) {
|
|
2754
2713
|
return {
|
|
@@ -3292,21 +3251,12 @@ class PopsAlert {
|
|
|
3292
3251
|
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
3293
3252
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
3294
3253
|
/*html*/ `
|
|
3295
|
-
<div
|
|
3296
|
-
class="pops-alert-title"
|
|
3297
|
-
style="text-align: ${config.title.position};
|
|
3298
|
-
${headerStyle}">
|
|
3299
|
-
${config.title.html
|
|
3254
|
+
<div class="pops-alert-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
3300
3255
|
? config.title.text
|
|
3301
|
-
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}
|
|
3302
|
-
|
|
3303
|
-
</div>
|
|
3304
|
-
<div class="pops-alert-content" style="${contentStyle}">
|
|
3305
|
-
${config.content.html
|
|
3256
|
+
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
3257
|
+
<div class="pops-alert-content" style="${contentStyle}">${config.content.html
|
|
3306
3258
|
? config.content.text
|
|
3307
|
-
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}
|
|
3308
|
-
</div>
|
|
3309
|
-
${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
3259
|
+
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
3310
3260
|
/**
|
|
3311
3261
|
* 弹窗的主元素,包括动画层
|
|
3312
3262
|
*/
|
|
@@ -3483,22 +3433,12 @@ class PopsConfirm {
|
|
|
3483
3433
|
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
3484
3434
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
3485
3435
|
/*html*/ `
|
|
3486
|
-
<div class="pops-confirm-title" style="text-align: ${config.title.position};${headerStyle}"
|
|
3487
|
-
${config.title.html
|
|
3436
|
+
<div class="pops-confirm-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
3488
3437
|
? config.title.text
|
|
3489
|
-
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}
|
|
3490
|
-
|
|
3491
|
-
</div>
|
|
3492
|
-
<div class="pops-confirm-content" style="${contentStyle}">
|
|
3493
|
-
${config.content.html
|
|
3438
|
+
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
3439
|
+
<div class="pops-confirm-content" style="${contentStyle}">${config.content.html
|
|
3494
3440
|
? config.content.text
|
|
3495
|
-
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}
|
|
3496
|
-
|
|
3497
|
-
</div>
|
|
3498
|
-
|
|
3499
|
-
|
|
3500
|
-
${bottomBtnHTML}
|
|
3501
|
-
`, bottomBtnHTML, zIndex);
|
|
3441
|
+
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
3502
3442
|
/**
|
|
3503
3443
|
* 弹窗的主元素,包括动画层
|
|
3504
3444
|
*/
|
|
@@ -3680,14 +3620,10 @@ class PopsPrompt {
|
|
|
3680
3620
|
let { contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
|
|
3681
3621
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
3682
3622
|
/*html*/ `
|
|
3683
|
-
<div class="pops-prompt-title" style="text-align: ${config.title.position};${headerStyle}"
|
|
3684
|
-
${config.title.html
|
|
3623
|
+
<div class="pops-prompt-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
3685
3624
|
? config.title.text
|
|
3686
|
-
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}
|
|
3687
|
-
${
|
|
3688
|
-
</div>
|
|
3689
|
-
<div class="pops-prompt-content" style="${contentPStyle}">
|
|
3690
|
-
${config.content.row
|
|
3625
|
+
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
3626
|
+
<div class="pops-prompt-content" style="${contentPStyle}">${config.content.row
|
|
3691
3627
|
? '<textarea pops="" placeholder="' +
|
|
3692
3628
|
config.content.placeholder +
|
|
3693
3629
|
'"></textarea>'
|
|
@@ -3695,10 +3631,7 @@ class PopsPrompt {
|
|
|
3695
3631
|
config.content.placeholder +
|
|
3696
3632
|
'" type="' +
|
|
3697
3633
|
(config.content.password ? "password" : "text") +
|
|
3698
|
-
'">'}
|
|
3699
|
-
</div>
|
|
3700
|
-
${bottomBtnHTML}
|
|
3701
|
-
`, bottomBtnHTML, zIndex);
|
|
3634
|
+
'">'}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
3702
3635
|
/**
|
|
3703
3636
|
* 弹窗的主元素,包括动画层
|
|
3704
3637
|
*/
|
|
@@ -3811,9 +3744,8 @@ class PopsLoading {
|
|
|
3811
3744
|
let { contentPStyle } = PopsElementHandler.getContentStyle("loading", config);
|
|
3812
3745
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
3813
3746
|
/*html*/ `
|
|
3814
|
-
<div class="pops-loading-content"
|
|
3815
|
-
|
|
3816
|
-
? `
|
|
3747
|
+
<div class="pops-loading-content">${config.addIndexCSS
|
|
3748
|
+
? /*html*/ `
|
|
3817
3749
|
<style data-model-name="index">${pops.config.cssText.index}</style>
|
|
3818
3750
|
<style data-model-name="anim">${pops.config.cssText.anim}</style>
|
|
3819
3751
|
<style data-model-name="common">${pops.config.cssText.common}</style>
|
|
@@ -3823,9 +3755,8 @@ class PopsLoading {
|
|
|
3823
3755
|
${pops.config.cssText.loadingCSS}
|
|
3824
3756
|
</style>
|
|
3825
3757
|
${config.style != null ? `<style>${config.style}</style>` : ""}
|
|
3826
|
-
|
|
3827
|
-
</div
|
|
3828
|
-
`, "", zIndex);
|
|
3758
|
+
<p pops style="${contentPStyle}">${config.content.text}</p>
|
|
3759
|
+
</div>`, "", zIndex);
|
|
3829
3760
|
/**
|
|
3830
3761
|
* 弹窗的主元素,包括动画层
|
|
3831
3762
|
*/
|
|
@@ -3959,27 +3890,16 @@ class PopsIframe {
|
|
|
3959
3890
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
3960
3891
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
3961
3892
|
/*html*/ `
|
|
3962
|
-
<div
|
|
3963
|
-
class="pops-iframe-title"
|
|
3964
|
-
style="text-align: ${config.title.position};${headerStyle}"
|
|
3965
|
-
>
|
|
3966
|
-
${config.title.html
|
|
3893
|
+
<div class="pops-iframe-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
3967
3894
|
? titleText
|
|
3968
|
-
: `<p pops style="${headerPStyle}">${titleText}</p>`}
|
|
3969
|
-
|
|
3970
|
-
</div>
|
|
3971
|
-
<div class="pops-iframe-content">
|
|
3895
|
+
: `<p pops style="${headerPStyle}">${titleText}</p>`}${headerBtnHTML}</div>
|
|
3896
|
+
<div class="pops-iframe-content">
|
|
3972
3897
|
<div class="pops-iframe-content-global-loading"></div>
|
|
3973
|
-
<iframe
|
|
3974
|
-
src="${config.url}"
|
|
3975
|
-
pops
|
|
3976
|
-
${config.sandbox
|
|
3898
|
+
<iframe src="${config.url}" pops ${config.sandbox
|
|
3977
3899
|
? "sandbox='allow-forms allow-same-origin allow-scripts'"
|
|
3978
3900
|
: ""}>
|
|
3979
3901
|
</iframe>
|
|
3980
|
-
|
|
3981
|
-
${config.loading.enable ? iframeLoadingHTML : ""}
|
|
3982
|
-
`, "", zIndex);
|
|
3902
|
+
</div>${config.loading.enable ? iframeLoadingHTML : ""}`, "", zIndex);
|
|
3983
3903
|
/**
|
|
3984
3904
|
* 弹窗的主元素,包括动画层
|
|
3985
3905
|
*/
|
|
@@ -4285,29 +4205,14 @@ class PopsDrawer {
|
|
|
4285
4205
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4286
4206
|
/*html*/ `
|
|
4287
4207
|
${config.title.enable
|
|
4288
|
-
? `
|
|
4289
|
-
<div class="pops-${PopsType}-title" style="${headerStyle}"
|
|
4290
|
-
${config.title.html
|
|
4208
|
+
? /*html*/ `
|
|
4209
|
+
<div class="pops-${PopsType}-title" style="${headerStyle}">${config.title.html
|
|
4291
4210
|
? config.title.text
|
|
4292
|
-
: `<p
|
|
4293
|
-
pops
|
|
4294
|
-
style="
|
|
4295
|
-
width: 100%;
|
|
4296
|
-
text-align: ${config.title.position};
|
|
4297
|
-
${headerPStyle}">${config.title.text}</p>`}
|
|
4298
|
-
${headerBtnHTML}
|
|
4299
|
-
</div>
|
|
4300
|
-
`
|
|
4211
|
+
: /*html*/ `<p pops style="width: 100%;text-align: ${config.title.position};${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>`
|
|
4301
4212
|
: ""}
|
|
4302
|
-
|
|
4303
|
-
<div class="pops-${PopsType}-content" style="${contentStyle}">
|
|
4304
|
-
${config.content.html
|
|
4213
|
+
<div class="pops-${PopsType}-content" style="${contentStyle}">${config.content.html
|
|
4305
4214
|
? config.content.text
|
|
4306
|
-
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}
|
|
4307
|
-
</div>
|
|
4308
|
-
|
|
4309
|
-
${bottomBtnHTML}
|
|
4310
|
-
`, bottomBtnHTML, zIndex);
|
|
4215
|
+
: `<p pops style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4311
4216
|
/**
|
|
4312
4217
|
* 弹窗的主元素,包括动画层
|
|
4313
4218
|
*/
|
|
@@ -4689,14 +4594,12 @@ class PopsFolder {
|
|
|
4689
4594
|
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
|
|
4690
4595
|
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
|
|
4691
4596
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
4692
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4693
|
-
|
|
4694
|
-
|
|
4597
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
4598
|
+
/*html*/ `
|
|
4599
|
+
<div class="pops-folder-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4695
4600
|
? config.title.text
|
|
4696
|
-
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}
|
|
4697
|
-
|
|
4698
|
-
</div>
|
|
4699
|
-
<div class="pops-folder-content ${pops.isPhone() ? "pops-mobile-folder-content" : ""}">
|
|
4601
|
+
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4602
|
+
<div class="pops-folder-content ${pops.isPhone() ? "pops-mobile-folder-content" : ""}">
|
|
4700
4603
|
<div class="pops-folder-list">
|
|
4701
4604
|
<div class="pops-folder-file-list-breadcrumb">
|
|
4702
4605
|
<div class="pops-folder-file-list-breadcrumb-primary">
|
|
@@ -4708,7 +4611,6 @@ class PopsFolder {
|
|
|
4708
4611
|
<div class="pops-folder-list-table__header-div">
|
|
4709
4612
|
<table class="pops-folder-list-table__header">
|
|
4710
4613
|
<colgroup>
|
|
4711
|
-
<!-- <col width="8%"> --!>
|
|
4712
4614
|
<col width="52%">
|
|
4713
4615
|
<col width="24%">
|
|
4714
4616
|
<col width="16%">
|
|
@@ -4779,7 +4681,6 @@ class PopsFolder {
|
|
|
4779
4681
|
<div class="pops-folder-list-table__body-div">
|
|
4780
4682
|
<table class="pops-folder-list-table__body">
|
|
4781
4683
|
<colgroup>
|
|
4782
|
-
<!-- <col width="8%"> --!>
|
|
4783
4684
|
${pops.isPhone()
|
|
4784
4685
|
? `<col width="100%">`
|
|
4785
4686
|
: `
|
|
@@ -4794,9 +4695,7 @@ class PopsFolder {
|
|
|
4794
4695
|
</table>
|
|
4795
4696
|
</div>
|
|
4796
4697
|
</div>
|
|
4797
|
-
</div
|
|
4798
|
-
${bottomBtnHTML}
|
|
4799
|
-
`, bottomBtnHTML, zIndex);
|
|
4698
|
+
</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4800
4699
|
/**
|
|
4801
4700
|
* 弹窗的主元素,包括动画层
|
|
4802
4701
|
*/
|
|
@@ -4977,9 +4876,7 @@ class PopsFolder {
|
|
|
4977
4876
|
<div class="pops-folder-list-file-name pops-mobile-folder-list-file-name cursor-p">
|
|
4978
4877
|
<img src="${fileIcon}" alt="${fileType}" class="pops-folder-list-file-icon u-file-icon u-file-icon--list">
|
|
4979
4878
|
<div>
|
|
4980
|
-
<a title="${fileName}" class="pops-folder-list-file-name-title-text inline-block-v-middle text-ellip list-name-text">
|
|
4981
|
-
${fileName}
|
|
4982
|
-
</a>
|
|
4879
|
+
<a title="${fileName}" class="pops-folder-list-file-name-title-text inline-block-v-middle text-ellip list-name-text">${fileName}</a>
|
|
4983
4880
|
<span>${latestTime} ${fileSize}</span>
|
|
4984
4881
|
</div>
|
|
4985
4882
|
</div>
|
|
@@ -6055,7 +5952,12 @@ const PanelHandleContentDetails = () => {
|
|
|
6055
5952
|
return;
|
|
6056
5953
|
}
|
|
6057
5954
|
Object.keys(props).forEach((propName) => {
|
|
6058
|
-
|
|
5955
|
+
let value = props[propName];
|
|
5956
|
+
if (propName === "innerHTML") {
|
|
5957
|
+
PopsSafeUtils.setSafeHTML(element, value);
|
|
5958
|
+
return;
|
|
5959
|
+
}
|
|
5960
|
+
Reflect.set(element, propName, value);
|
|
6059
5961
|
});
|
|
6060
5962
|
},
|
|
6061
5963
|
/**
|
|
@@ -6117,9 +6019,7 @@ const PanelHandleContentDetails = () => {
|
|
|
6117
6019
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
6118
6020
|
/*html*/ `
|
|
6119
6021
|
<div class="pops-panel-item-left-text">
|
|
6120
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6121
|
-
${leftDescriptionText}
|
|
6122
|
-
</div>
|
|
6022
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
6123
6023
|
<div class="pops-panel-switch">
|
|
6124
6024
|
<input class="pops-panel-switch__input" type="checkbox">
|
|
6125
6025
|
<span class="pops-panel-switch__core">
|
|
@@ -6219,9 +6119,7 @@ const PanelHandleContentDetails = () => {
|
|
|
6219
6119
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
6220
6120
|
/*html*/ `
|
|
6221
6121
|
<div class="pops-panel-item-left-text">
|
|
6222
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6223
|
-
${leftDescriptionText}
|
|
6224
|
-
</div>
|
|
6122
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
6225
6123
|
<div class="pops-panel-slider">
|
|
6226
6124
|
<input type="range" min="${formConfig.min}" max="${formConfig.max}">
|
|
6227
6125
|
</div>
|
|
@@ -6284,9 +6182,7 @@ const PanelHandleContentDetails = () => {
|
|
|
6284
6182
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
6285
6183
|
/*html*/ `
|
|
6286
6184
|
<div class="pops-panel-item-left-text" style="flex: 1;">
|
|
6287
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6288
|
-
${leftDescriptionText}
|
|
6289
|
-
</div>
|
|
6185
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
6290
6186
|
<div class="pops-slider pops-slider-width">
|
|
6291
6187
|
<div class="pops-slider__runway">
|
|
6292
6188
|
<div class="pops-slider__bar" style="width: 0%; left: 0%"></div>
|
|
@@ -6847,9 +6743,7 @@ const PanelHandleContentDetails = () => {
|
|
|
6847
6743
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
6848
6744
|
/*html*/ `
|
|
6849
6745
|
<div class="pops-panel-item-left-text">
|
|
6850
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6851
|
-
${leftDescriptionText}
|
|
6852
|
-
</div>
|
|
6746
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
6853
6747
|
<div class="pops-panel-input pops-user-select-none">
|
|
6854
6748
|
<input type="${inputType}" placeholder="${formConfig.placeholder}">
|
|
6855
6749
|
</div>
|
|
@@ -7044,12 +6938,9 @@ const PanelHandleContentDetails = () => {
|
|
|
7044
6938
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
7045
6939
|
/*html*/ `
|
|
7046
6940
|
<div class="pops-panel-item-left-text">
|
|
7047
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7048
|
-
${leftDescriptionText}
|
|
7049
|
-
</div>
|
|
6941
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
7050
6942
|
<div class="pops-panel-textarea">
|
|
7051
|
-
<textarea placeholder="${formConfig.placeholder ?? ""}">
|
|
7052
|
-
</textarea>
|
|
6943
|
+
<textarea placeholder="${formConfig.placeholder ?? ""}"></textarea>
|
|
7053
6944
|
</div>
|
|
7054
6945
|
`);
|
|
7055
6946
|
const PopsPanelTextArea = {
|
|
@@ -7119,9 +7010,7 @@ const PanelHandleContentDetails = () => {
|
|
|
7119
7010
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
7120
7011
|
/*html*/ `
|
|
7121
7012
|
<div class="pops-panel-item-left-text">
|
|
7122
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7123
|
-
${leftDescriptionText}
|
|
7124
|
-
</div>
|
|
7013
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
7125
7014
|
<div class="pops-panel-select pops-user-select-none">
|
|
7126
7015
|
<select></select>
|
|
7127
7016
|
</div>
|
|
@@ -7315,9 +7204,7 @@ const PanelHandleContentDetails = () => {
|
|
|
7315
7204
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
7316
7205
|
/*html*/ `
|
|
7317
7206
|
<div class="pops-panel-item-left-text">
|
|
7318
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7319
|
-
${leftDescriptionText}
|
|
7320
|
-
</div>
|
|
7207
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
7321
7208
|
<div class="pops-panel-select-multiple">
|
|
7322
7209
|
<div class="el-select__wrapper">
|
|
7323
7210
|
<div class="el-select__selection">
|
|
@@ -7610,9 +7497,7 @@ const PanelHandleContentDetails = () => {
|
|
|
7610
7497
|
function createSelectItemElement(dataInfo) {
|
|
7611
7498
|
let $item = popsDOMUtils.createElement("li", {
|
|
7612
7499
|
className: "select-item",
|
|
7613
|
-
innerHTML: /*html*/
|
|
7614
|
-
<span>${dataInfo.text}</span>
|
|
7615
|
-
`,
|
|
7500
|
+
innerHTML: /*html*/ `<span>${dataInfo.text}</span>`,
|
|
7616
7501
|
});
|
|
7617
7502
|
Reflect.set($item, "data-info", dataInfo);
|
|
7618
7503
|
return $item;
|
|
@@ -7874,9 +7759,7 @@ const PanelHandleContentDetails = () => {
|
|
|
7874
7759
|
PopsSafeUtils.setSafeHTML(liElement,
|
|
7875
7760
|
/*html*/ `
|
|
7876
7761
|
<div class="pops-panel-item-left-text">
|
|
7877
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7878
|
-
${leftDescriptionText}
|
|
7879
|
-
</div>
|
|
7762
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
7880
7763
|
<div class="pops-panel-button">
|
|
7881
7764
|
<button class="pops-panel-button_inner">
|
|
7882
7765
|
<i class="pops-bottom-icon"></i>
|
|
@@ -8041,13 +7924,8 @@ const PanelHandleContentDetails = () => {
|
|
|
8041
7924
|
PopsSafeUtils.setSafeHTML($li,
|
|
8042
7925
|
/*html*/ `
|
|
8043
7926
|
<div class="pops-panel-item-left-text">
|
|
8044
|
-
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
8045
|
-
|
|
8046
|
-
</div>
|
|
8047
|
-
<div class="pops-panel-deepMenu">
|
|
8048
|
-
${rightText}
|
|
8049
|
-
${arrowRightIconHTML}
|
|
8050
|
-
</div>
|
|
7927
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
7928
|
+
<div class="pops-panel-deepMenu">${rightText}${arrowRightIconHTML}</div>
|
|
8051
7929
|
`);
|
|
8052
7930
|
const PopsPanelDeepMenu = {
|
|
8053
7931
|
[Symbol.toStringTag]: "PopsPanelDeepMenu",
|
|
@@ -8430,15 +8308,9 @@ class PopsPanel {
|
|
|
8430
8308
|
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
|
|
8431
8309
|
let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config,
|
|
8432
8310
|
/*html*/ `
|
|
8433
|
-
<div
|
|
8434
|
-
class="pops-${PopsType}-title"
|
|
8435
|
-
style="text-align: ${config.title.position};
|
|
8436
|
-
${headerStyle}">
|
|
8437
|
-
${config.title.html
|
|
8311
|
+
<div class="pops-${PopsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
8438
8312
|
? config.title.text
|
|
8439
|
-
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}
|
|
8440
|
-
${headerBtnHTML}
|
|
8441
|
-
</div>
|
|
8313
|
+
: `<p pops style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
8442
8314
|
<div class="pops-${PopsType}-content">
|
|
8443
8315
|
<aside class="pops-${PopsType}-aside">
|
|
8444
8316
|
<ul></ul>
|
|
@@ -8983,7 +8855,8 @@ class PopsRightClickMenu {
|
|
|
8983
8855
|
/* 判断有无图标,有就添加进去 */
|
|
8984
8856
|
if (typeof item.icon === "string" && item.icon.trim() !== "") {
|
|
8985
8857
|
let iconSVGHTML = pops.config.iconSVG[item.icon] ?? item.icon;
|
|
8986
|
-
let iconElement = popsUtils.parseTextToDOM(
|
|
8858
|
+
let iconElement = popsUtils.parseTextToDOM(
|
|
8859
|
+
/*html*/ `<i class="pops-${PopsType}-icon" is-loading="${item.iconIsLoading}">${iconSVGHTML}</i>`);
|
|
8987
8860
|
menuLiElement.appendChild(iconElement);
|
|
8988
8861
|
}
|
|
8989
8862
|
/* 插入文字 */
|
|
@@ -9000,7 +8873,9 @@ class PopsRightClickMenu {
|
|
|
9000
8873
|
return;
|
|
9001
8874
|
}
|
|
9002
8875
|
function removeElement(element) {
|
|
9003
|
-
element
|
|
8876
|
+
element
|
|
8877
|
+
.querySelectorAll("ul li")
|
|
8878
|
+
.forEach((ele) => {
|
|
9004
8879
|
if (ele?.__menuData__?.child) {
|
|
9005
8880
|
removeElement(ele.__menuData__.child);
|
|
9006
8881
|
}
|
|
@@ -9217,9 +9092,7 @@ class PopsSearchSuggestion {
|
|
|
9217
9092
|
<style data-dynamic="true">
|
|
9218
9093
|
${this.getDynamicCSS()}
|
|
9219
9094
|
</style>
|
|
9220
|
-
<ul class="pops-${PopsType}-search-suggestion-hint">
|
|
9221
|
-
${config.toSearhNotResultHTML}
|
|
9222
|
-
</ul>
|
|
9095
|
+
<ul class="pops-${PopsType}-search-suggestion-hint">${config.toSearhNotResultHTML}</ul>
|
|
9223
9096
|
`,
|
|
9224
9097
|
}, {
|
|
9225
9098
|
"data-guid": guid,
|
|
@@ -9298,12 +9171,7 @@ class PopsSearchSuggestion {
|
|
|
9298
9171
|
className: `pops-${PopsType}-search-suggestion-hint-item pops-flex-items-center pops-flex-y-center`,
|
|
9299
9172
|
"data-index": index,
|
|
9300
9173
|
"data-value": SearchSuggestion.getItemDataValue(data),
|
|
9301
|
-
innerHTML:
|
|
9302
|
-
${config.getItemHTML(data)}
|
|
9303
|
-
${config.deleteIcon.enable
|
|
9304
|
-
? SearchSuggestion.getDeleteIconHTML()
|
|
9305
|
-
: ""}
|
|
9306
|
-
`,
|
|
9174
|
+
innerHTML: `${config.getItemHTML(data)}${config.deleteIcon.enable ? SearchSuggestion.getDeleteIconHTML() : ""}`,
|
|
9307
9175
|
});
|
|
9308
9176
|
},
|
|
9309
9177
|
/**
|
|
@@ -10186,7 +10054,7 @@ class Pops {
|
|
|
10186
10054
|
/** 配置 */
|
|
10187
10055
|
config = {
|
|
10188
10056
|
/** 版本号 */
|
|
10189
|
-
version: "2025.
|
|
10057
|
+
version: "2025.5.1",
|
|
10190
10058
|
cssText: {
|
|
10191
10059
|
/** 主CSS */
|
|
10192
10060
|
index: indexCSS,
|