@whitesev/pops 2.2.1 → 2.2.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 +275 -263
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +275 -263
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +275 -263
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +275 -263
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +275 -263
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +275 -263
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/Pops.d.ts +1 -1
- package/dist/types/src/components/panel/index.d.ts +2 -1
- package/dist/types/src/components/panel/types/components-input.d.ts +9 -1
- package/dist/types/src/components/panel/types/components-select.d.ts +6 -1
- package/dist/types/src/components/panel/types/components-switch.d.ts +6 -1
- package/dist/types/src/components/panel/types/components-textarea.d.ts +8 -2
- 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 +3 -3
- package/dist/types/src/types/components.d.ts +5 -5
- package/dist/types/src/types/main.d.ts +34 -31
- package/package.json +1 -1
- package/src/Pops.ts +1 -1
- package/src/components/alert/index.ts +15 -15
- 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 +14 -13
- package/src/components/panel/handlerComponents.ts +25 -6
- package/src/components/panel/index.ts +19 -18
- package/src/components/panel/types/components-input.ts +9 -1
- package/src/components/panel/types/components-select.ts +6 -1
- package/src/components/panel/types/components-switch.ts +6 -1
- package/src/components/panel/types/components-textarea.ts +8 -2
- package/src/components/prompt/index.ts +15 -14
- package/src/components/rightClickMenu/index.ts +17 -16
- package/src/components/searchSuggestion/index.ts +21 -20
- package/src/components/tooltip/index.ts +3 -2
- package/src/handler/PopsElementHandler.ts +18 -18
- package/src/handler/PopsHandler.ts +13 -7
- package/src/types/components.d.ts +5 -5
- package/src/types/main.d.ts +34 -31
package/dist/index.system.js
CHANGED
|
@@ -3951,6 +3951,10 @@ System.register('pops', [], (function (exports) {
|
|
|
3951
3951
|
*/
|
|
3952
3952
|
handleOnly(type, config) {
|
|
3953
3953
|
if (config.only) {
|
|
3954
|
+
// .loading
|
|
3955
|
+
// .tooltip
|
|
3956
|
+
// .rightClickMenu
|
|
3957
|
+
// 单独处理
|
|
3954
3958
|
if (type === "loading" ||
|
|
3955
3959
|
type === "tooltip" ||
|
|
3956
3960
|
type === "rightClickMenu") {
|
|
@@ -4057,11 +4061,11 @@ System.register('pops', [], (function (exports) {
|
|
|
4057
4061
|
init(details) {
|
|
4058
4062
|
const guid = popsUtils.getRandomGUID();
|
|
4059
4063
|
// 设置当前类型
|
|
4060
|
-
const
|
|
4064
|
+
const popsType = "alert";
|
|
4061
4065
|
let config = PopsAlertConfig();
|
|
4062
4066
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4063
4067
|
config = popsUtils.assign(config, details);
|
|
4064
|
-
config = PopsHandler.handleOnly(
|
|
4068
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4065
4069
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4066
4070
|
PopsHandler.handleInit($shadowRoot, [
|
|
4067
4071
|
{
|
|
@@ -4096,23 +4100,23 @@ System.register('pops', [], (function (exports) {
|
|
|
4096
4100
|
// 先把z-index提取出来
|
|
4097
4101
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4098
4102
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4099
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4100
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4101
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4102
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4103
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4103
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4104
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4105
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4106
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4107
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4104
4108
|
/*html*/ `
|
|
4105
|
-
<div class="pops-title pops-${
|
|
4109
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4106
4110
|
? config.title.text
|
|
4107
|
-
: `<p pops class="pops-${
|
|
4108
|
-
<div class="pops-content pops-${
|
|
4111
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4112
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
4109
4113
|
? config.content.text
|
|
4110
|
-
: `<p pops class="pops-${
|
|
4114
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4111
4115
|
/**
|
|
4112
4116
|
* 弹窗的主元素，包括动画层
|
|
4113
4117
|
*/
|
|
4114
4118
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4115
|
-
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, btnOkElement, titleElement: $title, } = PopsHandler.handleQueryElement($anim,
|
|
4119
|
+
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, btnOkElement, titleElement: $title, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4116
4120
|
/** 遮罩层元素 */
|
|
4117
4121
|
let $mask = null;
|
|
4118
4122
|
/** 已创建的元素列表 */
|
|
@@ -4120,7 +4124,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4120
4124
|
/* 遮罩层元素 */
|
|
4121
4125
|
if (config.mask.enable) {
|
|
4122
4126
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4123
|
-
type:
|
|
4127
|
+
type: popsType,
|
|
4124
4128
|
guid: guid,
|
|
4125
4129
|
config: config,
|
|
4126
4130
|
animElement: $anim,
|
|
@@ -4130,7 +4134,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4130
4134
|
elementList.push($mask);
|
|
4131
4135
|
}
|
|
4132
4136
|
/* 处理返回的配置 */
|
|
4133
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4137
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4134
4138
|
/* 为顶部右边的关闭按钮添加点击事件 */
|
|
4135
4139
|
PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
|
|
4136
4140
|
/* 为底部ok按钮添加点击事件 */
|
|
@@ -4146,7 +4150,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4146
4150
|
$anim.after($mask);
|
|
4147
4151
|
}
|
|
4148
4152
|
/* 保存 */
|
|
4149
|
-
PopsHandler.handlePush(
|
|
4153
|
+
PopsHandler.handlePush(popsType, {
|
|
4150
4154
|
guid: guid,
|
|
4151
4155
|
animElement: $anim,
|
|
4152
4156
|
popsElement: $pops,
|
|
@@ -4261,11 +4265,11 @@ System.register('pops', [], (function (exports) {
|
|
|
4261
4265
|
init(details) {
|
|
4262
4266
|
const guid = popsUtils.getRandomGUID();
|
|
4263
4267
|
// 设置当前类型
|
|
4264
|
-
const
|
|
4268
|
+
const popsType = "confirm";
|
|
4265
4269
|
let config = PopsConfirmConfig();
|
|
4266
4270
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4267
4271
|
config = popsUtils.assign(config, details);
|
|
4268
|
-
config = PopsHandler.handleOnly(
|
|
4272
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4269
4273
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4270
4274
|
PopsHandler.handleInit($shadowRoot, [
|
|
4271
4275
|
{
|
|
@@ -4300,23 +4304,23 @@ System.register('pops', [], (function (exports) {
|
|
|
4300
4304
|
// 先把z-index提取出来
|
|
4301
4305
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4302
4306
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4303
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4304
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4305
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4306
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4307
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4307
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4308
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4309
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4310
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4311
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4308
4312
|
/*html*/ `
|
|
4309
|
-
<div class="pops-title pops-${
|
|
4313
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4310
4314
|
? config.title.text
|
|
4311
|
-
: `<p pops class="pops-${
|
|
4312
|
-
<div class="pops-content pops-${
|
|
4315
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4316
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
4313
4317
|
? config.content.text
|
|
4314
|
-
: `<p pops class="pops-${
|
|
4318
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
4315
4319
|
/**
|
|
4316
4320
|
* 弹窗的主元素，包括动画层
|
|
4317
4321
|
*/
|
|
4318
4322
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4319
|
-
let { popsElement: $pops, titleElement: $title, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, } = PopsHandler.handleQueryElement($anim,
|
|
4323
|
+
let { popsElement: $pops, titleElement: $title, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4320
4324
|
/**
|
|
4321
4325
|
* 遮罩层元素
|
|
4322
4326
|
*/
|
|
@@ -4328,7 +4332,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4328
4332
|
if (config.mask.enable) {
|
|
4329
4333
|
// 启用遮罩层
|
|
4330
4334
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4331
|
-
type:
|
|
4335
|
+
type: popsType,
|
|
4332
4336
|
guid: guid,
|
|
4333
4337
|
config: config,
|
|
4334
4338
|
animElement: $anim,
|
|
@@ -4337,7 +4341,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4337
4341
|
$mask = _handleMask_.maskElement;
|
|
4338
4342
|
elementList.push($mask);
|
|
4339
4343
|
}
|
|
4340
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4344
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4341
4345
|
PopsHandler.handleClickEvent("close", $btnClose, eventDetails, config.btn.close.callback);
|
|
4342
4346
|
PopsHandler.handleClickEvent("ok", $btnOk, eventDetails, config.btn.ok.callback);
|
|
4343
4347
|
PopsHandler.handleClickEvent("cancel", $btnCancel, eventDetails, config.btn.cancel.callback);
|
|
@@ -4351,7 +4355,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4351
4355
|
if ($mask != null) {
|
|
4352
4356
|
$anim.after($mask);
|
|
4353
4357
|
}
|
|
4354
|
-
PopsHandler.handlePush(
|
|
4358
|
+
PopsHandler.handlePush(popsType, {
|
|
4355
4359
|
guid: guid,
|
|
4356
4360
|
animElement: $anim,
|
|
4357
4361
|
popsElement: $pops,
|
|
@@ -4470,11 +4474,11 @@ System.register('pops', [], (function (exports) {
|
|
|
4470
4474
|
init(details) {
|
|
4471
4475
|
const guid = popsUtils.getRandomGUID();
|
|
4472
4476
|
// 设置当前类型
|
|
4473
|
-
const
|
|
4477
|
+
const popsType = "prompt";
|
|
4474
4478
|
let config = PopsPromptConfig();
|
|
4475
4479
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4476
4480
|
config = popsUtils.assign(config, details);
|
|
4477
|
-
config = PopsHandler.handleOnly(
|
|
4481
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4478
4482
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4479
4483
|
PopsHandler.handleInit($shadowRoot, [
|
|
4480
4484
|
{
|
|
@@ -4509,16 +4513,16 @@ System.register('pops', [], (function (exports) {
|
|
|
4509
4513
|
// 先把z-index提取出来
|
|
4510
4514
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4511
4515
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
4512
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4513
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
4514
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4515
|
-
let { contentPStyle } = PopsElementHandler.getContentStyle(
|
|
4516
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4516
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4517
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
4518
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4519
|
+
let { contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
4520
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4517
4521
|
/*html*/ `
|
|
4518
|
-
<div class="pops-title pops-${
|
|
4522
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4519
4523
|
? config.title.text
|
|
4520
|
-
: `<p pops class="pops-${
|
|
4521
|
-
<div class="pops-content pops-${
|
|
4524
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
4525
|
+
<div class="pops-content pops-${popsType}-content" style="${contentPStyle}">${config.content.row
|
|
4522
4526
|
? '<textarea name="pops-input-text" pops="" placeholder="' +
|
|
4523
4527
|
config.content.placeholder +
|
|
4524
4528
|
'"></textarea>'
|
|
@@ -4531,7 +4535,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4531
4535
|
* 弹窗的主元素，包括动画层
|
|
4532
4536
|
*/
|
|
4533
4537
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4534
|
-
let { popsElement: $pops, inputElement: $input, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, titleElement: $title, } = PopsHandler.handleQueryElement($anim,
|
|
4538
|
+
let { popsElement: $pops, inputElement: $input, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, titleElement: $title, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4535
4539
|
/**
|
|
4536
4540
|
* 遮罩层元素
|
|
4537
4541
|
*/
|
|
@@ -4543,7 +4547,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4543
4547
|
if (config.mask.enable) {
|
|
4544
4548
|
// 启用遮罩层
|
|
4545
4549
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4546
|
-
type:
|
|
4550
|
+
type: popsType,
|
|
4547
4551
|
guid: guid,
|
|
4548
4552
|
config: config,
|
|
4549
4553
|
animElement: $anim,
|
|
@@ -4552,7 +4556,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4552
4556
|
$mask = _handleMask_.maskElement;
|
|
4553
4557
|
elementList.push($mask);
|
|
4554
4558
|
}
|
|
4555
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4559
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4556
4560
|
/* 输入框赋值初始值 */
|
|
4557
4561
|
$input.value = config.content.text;
|
|
4558
4562
|
PopsHandler.handlePromptClickEvent("close", $input, $btnClose, eventDetails, config.btn.close.callback);
|
|
@@ -4568,7 +4572,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4568
4572
|
if ($mask != null) {
|
|
4569
4573
|
$anim.after($mask);
|
|
4570
4574
|
}
|
|
4571
|
-
PopsHandler.handlePush(
|
|
4575
|
+
PopsHandler.handlePush(popsType, {
|
|
4572
4576
|
guid: guid,
|
|
4573
4577
|
animElement: $anim,
|
|
4574
4578
|
popsElement: $pops,
|
|
@@ -4763,14 +4767,14 @@ System.register('pops', [], (function (exports) {
|
|
|
4763
4767
|
init(details) {
|
|
4764
4768
|
const guid = popsUtils.getRandomGUID();
|
|
4765
4769
|
// 设置当前类型
|
|
4766
|
-
const
|
|
4770
|
+
const popsType = "iframe";
|
|
4767
4771
|
let config = PopsIframeConfig();
|
|
4768
4772
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4769
4773
|
config = popsUtils.assign(config, details);
|
|
4770
4774
|
if (config.url == null) {
|
|
4771
4775
|
throw new Error("config.url不能为空");
|
|
4772
4776
|
}
|
|
4773
|
-
config = PopsHandler.handleOnly(
|
|
4777
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4774
4778
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4775
4779
|
PopsHandler.handleInit($shadowRoot, [
|
|
4776
4780
|
{
|
|
@@ -4806,17 +4810,17 @@ System.register('pops', [], (function (exports) {
|
|
|
4806
4810
|
// 先把z-index提取出来
|
|
4807
4811
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
4808
4812
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex, maskExtraStyle);
|
|
4809
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
4813
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
4810
4814
|
let iframeLoadingHTML = '<div class="pops-loading"></div>';
|
|
4811
4815
|
let titleText = config.title.text.trim() !== "" ? config.title.text : config.url;
|
|
4812
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
4813
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
4816
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
4817
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
4814
4818
|
/*html*/ `
|
|
4815
|
-
<div class="pops-title pops-${
|
|
4819
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
4816
4820
|
? titleText
|
|
4817
|
-
: `<p pops class="pops-${
|
|
4818
|
-
<div class="pops-content pops-${
|
|
4819
|
-
<div class="pops-${
|
|
4821
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${titleText}</p>`}${headerBtnHTML}</div>
|
|
4822
|
+
<div class="pops-content pops-${popsType}-content">
|
|
4823
|
+
<div class="pops-${popsType}-content-global-loading"></div>
|
|
4820
4824
|
<iframe src="${config.url}" pops ${config.sandbox
|
|
4821
4825
|
? "sandbox='allow-forms allow-same-origin allow-scripts'"
|
|
4822
4826
|
: ""}>
|
|
@@ -4826,7 +4830,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4826
4830
|
* 弹窗的主元素，包括动画层
|
|
4827
4831
|
*/
|
|
4828
4832
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
4829
|
-
let { popsElement: $pops, headerCloseBtnElement, headerControlsElement, titleElement: $title, iframeElement: $iframe, loadingElement, contentLoadingElement: $contentLoading, headerMinBtnElement, headerMaxBtnElement, headerMiseBtnElement, } = PopsHandler.handleQueryElement($anim,
|
|
4833
|
+
let { popsElement: $pops, headerCloseBtnElement, headerControlsElement, titleElement: $title, iframeElement: $iframe, loadingElement, contentLoadingElement: $contentLoading, headerMinBtnElement, headerMaxBtnElement, headerMiseBtnElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4830
4834
|
let $iframeContainer = PopsCore.document.querySelector(".pops-iframe-container");
|
|
4831
4835
|
if (!$iframeContainer) {
|
|
4832
4836
|
$iframeContainer = PopsCore.document.createElement("div");
|
|
@@ -4845,7 +4849,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4845
4849
|
let elementList = [$anim];
|
|
4846
4850
|
if (config.mask.enable) {
|
|
4847
4851
|
let _handleMask_ = PopsHandler.handleMask({
|
|
4848
|
-
type:
|
|
4852
|
+
type: popsType,
|
|
4849
4853
|
guid: guid,
|
|
4850
4854
|
config: config,
|
|
4851
4855
|
animElement: $anim,
|
|
@@ -4854,7 +4858,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4854
4858
|
$mask = _handleMask_.maskElement;
|
|
4855
4859
|
elementList.push($mask);
|
|
4856
4860
|
}
|
|
4857
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
4861
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
4858
4862
|
eventDetails["iframeElement"] = $iframe;
|
|
4859
4863
|
popsDOMUtils.on($anim, popsDOMUtils.getAnimationEndNameList(), function () {
|
|
4860
4864
|
/* 动画加载完毕 */
|
|
@@ -4998,7 +5002,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4998
5002
|
}, {
|
|
4999
5003
|
capture: true,
|
|
5000
5004
|
});
|
|
5001
|
-
PopsHandler.handlePush(
|
|
5005
|
+
PopsHandler.handlePush(popsType, {
|
|
5002
5006
|
guid: guid,
|
|
5003
5007
|
animElement: $anim,
|
|
5004
5008
|
popsElement: $pops,
|
|
@@ -5102,11 +5106,11 @@ System.register('pops', [], (function (exports) {
|
|
|
5102
5106
|
init(details) {
|
|
5103
5107
|
const guid = popsUtils.getRandomGUID();
|
|
5104
5108
|
// 设置当前类型
|
|
5105
|
-
const
|
|
5109
|
+
const popsType = "drawer";
|
|
5106
5110
|
let config = PopsDrawerConfig();
|
|
5107
5111
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
5108
5112
|
config = popsUtils.assign(config, details);
|
|
5109
|
-
config = PopsHandler.handleOnly(
|
|
5113
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
5110
5114
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
5111
5115
|
PopsHandler.handleInit($shadowRoot, [
|
|
5112
5116
|
{
|
|
@@ -5141,25 +5145,25 @@ System.register('pops', [], (function (exports) {
|
|
|
5141
5145
|
// 先把z-index提取出来
|
|
5142
5146
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5143
5147
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5144
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
5145
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
5146
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
5147
|
-
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(
|
|
5148
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
5148
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
5149
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
5150
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
5151
|
+
let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(popsType, config);
|
|
5152
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
5149
5153
|
/*html*/ `
|
|
5150
5154
|
${config.title.enable
|
|
5151
|
-
? /*html*/ `<div class="pops-title pops-${
|
|
5155
|
+
? /*html*/ `<div class="pops-title pops-${popsType}-title" style="${headerStyle}">${config.title.html
|
|
5152
5156
|
? config.title.text
|
|
5153
|
-
: /*html*/ `<p pops class="pops-${
|
|
5157
|
+
: /*html*/ `<p pops class="pops-${popsType}-title-text" style="width: 100%;text-align: ${config.title.position};${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>`
|
|
5154
5158
|
: ""}
|
|
5155
|
-
<div class="pops-content pops-${
|
|
5159
|
+
<div class="pops-content pops-${popsType}-content" style="${contentStyle}">${config.content.html
|
|
5156
5160
|
? config.content.text
|
|
5157
|
-
: `<p pops class="pops-${
|
|
5161
|
+
: `<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>`}</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
5158
5162
|
/**
|
|
5159
5163
|
* 弹窗的主元素，包括动画层
|
|
5160
5164
|
*/
|
|
5161
5165
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
5162
|
-
let { popsElement, headerCloseBtnElement, btnCancelElement, btnOkElement, btnOtherElement, } = PopsHandler.handleQueryElement($anim,
|
|
5166
|
+
let { popsElement, headerCloseBtnElement, btnCancelElement, btnOkElement, btnOtherElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
5163
5167
|
let $pops = popsElement;
|
|
5164
5168
|
let $headerCloseBtn = headerCloseBtnElement;
|
|
5165
5169
|
let $btnCancel = btnCancelElement;
|
|
@@ -5175,7 +5179,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5175
5179
|
let elementList = [$anim];
|
|
5176
5180
|
if (config.mask.enable) {
|
|
5177
5181
|
let _handleMask_ = PopsHandler.handleMask({
|
|
5178
|
-
type:
|
|
5182
|
+
type: popsType,
|
|
5179
5183
|
guid: guid,
|
|
5180
5184
|
config: config,
|
|
5181
5185
|
animElement: $anim,
|
|
@@ -5184,7 +5188,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5184
5188
|
$mask = _handleMask_.maskElement;
|
|
5185
5189
|
elementList.push($mask);
|
|
5186
5190
|
}
|
|
5187
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
5191
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
5188
5192
|
/* 处理方向 */
|
|
5189
5193
|
$pops.setAttribute("direction", config.direction);
|
|
5190
5194
|
/* 处理border-radius */
|
|
@@ -5272,7 +5276,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5272
5276
|
if ($mask != null) {
|
|
5273
5277
|
$anim.after($mask);
|
|
5274
5278
|
}
|
|
5275
|
-
PopsHandler.handlePush(
|
|
5279
|
+
PopsHandler.handlePush(popsType, {
|
|
5276
5280
|
guid: guid,
|
|
5277
5281
|
animElement: $anim,
|
|
5278
5282
|
popsElement: $pops,
|
|
@@ -5463,11 +5467,11 @@ System.register('pops', [], (function (exports) {
|
|
|
5463
5467
|
init(details) {
|
|
5464
5468
|
const guid = popsUtils.getRandomGUID();
|
|
5465
5469
|
// 设置当前类型
|
|
5466
|
-
const
|
|
5470
|
+
const popsType = "folder";
|
|
5467
5471
|
let config = PopsFolderConfig();
|
|
5468
5472
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
5469
5473
|
config = popsUtils.assign(config, details);
|
|
5470
|
-
config = PopsHandler.handleOnly(
|
|
5474
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
5471
5475
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
5472
5476
|
PopsHandler.handleInit($shadowRoot, [
|
|
5473
5477
|
{
|
|
@@ -5547,19 +5551,15 @@ System.register('pops', [], (function (exports) {
|
|
|
5547
5551
|
/* Android安装包 */
|
|
5548
5552
|
let androidIconList = ["apk", "apkm", "xapk"];
|
|
5549
5553
|
zipIconList.forEach((keyName) => {
|
|
5550
|
-
// @ts-ignore
|
|
5551
5554
|
Folder_ICON[keyName] = Folder_ICON.zip;
|
|
5552
5555
|
});
|
|
5553
5556
|
imageIconList.forEach((keyName) => {
|
|
5554
|
-
// @ts-ignore
|
|
5555
5557
|
Folder_ICON[keyName] = Folder_ICON.png;
|
|
5556
5558
|
});
|
|
5557
5559
|
codeLanguageIconList.forEach((keyName) => {
|
|
5558
|
-
// @ts-ignore
|
|
5559
5560
|
Folder_ICON[keyName] = Folder_ICON.html;
|
|
5560
5561
|
});
|
|
5561
5562
|
androidIconList.forEach((keyName) => {
|
|
5562
|
-
// @ts-ignore
|
|
5563
5563
|
Folder_ICON[keyName] = Folder_ICON.apk;
|
|
5564
5564
|
});
|
|
5565
5565
|
if (details?.folder) {
|
|
@@ -5569,108 +5569,105 @@ System.register('pops', [], (function (exports) {
|
|
|
5569
5569
|
// 先把z-index提取出来
|
|
5570
5570
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
5571
5571
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
5572
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
5573
|
-
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(
|
|
5574
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
5575
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
5572
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
5573
|
+
let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(popsType, config);
|
|
5574
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
5575
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
5576
5576
|
/*html*/ `
|
|
5577
|
-
<div class="pops-title pops-${
|
|
5577
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
5578
5578
|
? config.title.text
|
|
5579
|
-
: `<p pops class="pops-${
|
|
5580
|
-
<div class="pops-content pops-${
|
|
5579
|
+
: `<p pops class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
5580
|
+
<div class="pops-content pops-${popsType}-content ${popsUtils.isPhone() ? "pops-mobile-folder-content" : ""}">
|
|
5581
5581
|
<div class="pops-folder-list">
|
|
5582
5582
|
<div class="pops-folder-file-list-breadcrumb">
|
|
5583
|
-
|
|
5584
|
-
|
|
5585
|
-
|
|
5586
|
-
|
|
5587
|
-
|
|
5583
|
+
<div class="pops-folder-file-list-breadcrumb-primary">
|
|
5584
|
+
<span class="pops-folder-file-list-breadcrumb-allFiles cursor-p" title="全部文件">
|
|
5585
|
+
<a>全部文件</a>
|
|
5586
|
+
</span>
|
|
5587
|
+
</div>
|
|
5588
5588
|
</div>
|
|
5589
5589
|
<div class="pops-folder-list-table__header-div">
|
|
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
|
-
|
|
5647
|
-
|
|
5648
|
-
|
|
5649
|
-
|
|
5650
|
-
|
|
5651
|
-
|
|
5652
|
-
|
|
5653
|
-
|
|
5654
|
-
|
|
5655
|
-
|
|
5656
|
-
|
|
5657
|
-
|
|
5590
|
+
<table class="pops-folder-list-table__header">
|
|
5591
|
+
<colgroup>
|
|
5592
|
+
<col width="52%">
|
|
5593
|
+
<col width="24%">
|
|
5594
|
+
<col width="16%">
|
|
5595
|
+
</colgroup>
|
|
5596
|
+
<thead>
|
|
5597
|
+
<tr class="pops-folder-list-table__header-row">
|
|
5598
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5599
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5600
|
+
<span>文件名</span>
|
|
5601
|
+
<div class="pops-folder-list-table__sort" data-sort="fileName">
|
|
5602
|
+
<div class="pops-folder-icon-arrow" data-sort="按文件名排序">
|
|
5603
|
+
<svg
|
|
5604
|
+
viewBox="0 0 1024 1024"
|
|
5605
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5606
|
+
<path
|
|
5607
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5608
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5609
|
+
<path
|
|
5610
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5611
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5612
|
+
</svg>
|
|
5613
|
+
</div>
|
|
5614
|
+
</div>
|
|
5615
|
+
</div>
|
|
5616
|
+
</th>
|
|
5617
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5618
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5619
|
+
<span>修改时间</span>
|
|
5620
|
+
<div class="pops-folder-list-table__sort" data-sort="latestTime">
|
|
5621
|
+
<div class="pops-folder-icon-arrow" title="按修改时间排序">
|
|
5622
|
+
<svg
|
|
5623
|
+
viewBox="0 0 1024 1024"
|
|
5624
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5625
|
+
<path
|
|
5626
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5627
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5628
|
+
<path
|
|
5629
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5630
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5631
|
+
</svg>
|
|
5632
|
+
</div>
|
|
5633
|
+
</div>
|
|
5634
|
+
</div>
|
|
5635
|
+
</th>
|
|
5636
|
+
<th class="pops-folder-list-table__header-th cursor-p">
|
|
5637
|
+
<div class="text-ellip content flex-a-i-center">
|
|
5638
|
+
<span>大小</span>
|
|
5639
|
+
<div class="pops-folder-list-table__sort" data-sort="fileSize">
|
|
5640
|
+
<div class="pops-folder-icon-arrow" title="按大小排序">
|
|
5641
|
+
<svg
|
|
5642
|
+
viewBox="0 0 1024 1024"
|
|
5643
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
5644
|
+
<path
|
|
5645
|
+
d="M509.624392 5.882457 57.127707 458.379143 962.121078 458.379143Z"
|
|
5646
|
+
class="pops-folder-icon-arrow-up"></path>
|
|
5647
|
+
<path
|
|
5648
|
+
d="M509.624392 1024 962.121078 571.503314 57.127707 571.503314Z"
|
|
5649
|
+
class="pops-folder-icon-arrow-down"></path>
|
|
5650
|
+
</svg>
|
|
5651
|
+
</div>
|
|
5652
|
+
</div>
|
|
5653
|
+
</div>
|
|
5654
|
+
</th>
|
|
5655
|
+
</tr>
|
|
5656
|
+
</thead>
|
|
5657
|
+
</table>
|
|
5658
5658
|
</div>
|
|
5659
5659
|
<div class="pops-folder-list-table__body-div">
|
|
5660
|
-
|
|
5661
|
-
|
|
5662
|
-
|
|
5660
|
+
<table class="pops-folder-list-table__body">
|
|
5661
|
+
<colgroup>
|
|
5662
|
+
${popsUtils.isPhone()
|
|
5663
5663
|
? `<col width="100%">`
|
|
5664
5664
|
: `
|
|
5665
|
-
|
|
5666
|
-
|
|
5667
|
-
|
|
5668
|
-
|
|
5669
|
-
|
|
5670
|
-
|
|
5671
|
-
|
|
5672
|
-
</tbody>
|
|
5673
|
-
</table>
|
|
5665
|
+
<col width="52%">
|
|
5666
|
+
<col width="24%">
|
|
5667
|
+
<col width="16%">`}
|
|
5668
|
+
</colgroup>
|
|
5669
|
+
<tbody></tbody>
|
|
5670
|
+
</table>
|
|
5674
5671
|
</div>
|
|
5675
5672
|
</div>
|
|
5676
5673
|
</div>${bottomBtnHTML}`, bottomBtnHTML, zIndex);
|
|
@@ -5682,7 +5679,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5682
5679
|
// folderListElement,
|
|
5683
5680
|
// folderListHeaderElement,
|
|
5684
5681
|
// folderListHeaderRowElement,
|
|
5685
|
-
folderListBodyElement, folderFileListBreadcrumbPrimaryElement, headerCloseBtnElement: $btnCloseBtn, btnOkElement, btnCancelElement, btnOtherElement, folderListSortFileNameElement, folderListSortLatestTimeElement, folderListSortFileSizeElement, } = PopsHandler.handleQueryElement($anim,
|
|
5682
|
+
folderListBodyElement, folderFileListBreadcrumbPrimaryElement, headerCloseBtnElement: $btnCloseBtn, btnOkElement, btnCancelElement, btnOtherElement, folderListSortFileNameElement, folderListSortLatestTimeElement, folderListSortFileSizeElement, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
5686
5683
|
/**
|
|
5687
5684
|
* 遮罩层元素
|
|
5688
5685
|
*/
|
|
@@ -5693,7 +5690,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5693
5690
|
let elementList = [$anim];
|
|
5694
5691
|
if (config.mask.enable) {
|
|
5695
5692
|
let _handleMask_ = PopsHandler.handleMask({
|
|
5696
|
-
type:
|
|
5693
|
+
type: popsType,
|
|
5697
5694
|
guid: guid,
|
|
5698
5695
|
config: config,
|
|
5699
5696
|
animElement: $anim,
|
|
@@ -5703,7 +5700,7 @@ System.register('pops', [], (function (exports) {
|
|
|
5703
5700
|
elementList.push($mask);
|
|
5704
5701
|
}
|
|
5705
5702
|
/* 事件 */
|
|
5706
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
5703
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
5707
5704
|
PopsHandler.handleClickEvent("close", $btnCloseBtn, eventDetails, config.btn.close.callback);
|
|
5708
5705
|
PopsHandler.handleClickEvent("ok", btnOkElement, eventDetails, config.btn.ok.callback);
|
|
5709
5706
|
PopsHandler.handleClickEvent("cancel", btnCancelElement, eventDetails, config.btn.cancel.callback);
|
|
@@ -5796,10 +5793,10 @@ System.register('pops', [], (function (exports) {
|
|
|
5796
5793
|
fileSize: origin_fileSize,
|
|
5797
5794
|
isFolder: isFolder,
|
|
5798
5795
|
};
|
|
5799
|
-
fileNameElement
|
|
5800
|
-
fileTimeElement
|
|
5801
|
-
fileFormatSize
|
|
5802
|
-
folderELement
|
|
5796
|
+
Reflect.set(fileNameElement, "__value__", __value__);
|
|
5797
|
+
Reflect.set(fileTimeElement, "__value__", __value__);
|
|
5798
|
+
Reflect.set(fileFormatSize, "__value__", __value__);
|
|
5799
|
+
Reflect.set(folderELement, "__value__", __value__);
|
|
5803
5800
|
folderELement.appendChild(fileNameElement);
|
|
5804
5801
|
folderELement.appendChild(fileTimeElement);
|
|
5805
5802
|
folderELement.appendChild(fileFormatSize);
|
|
@@ -5866,8 +5863,8 @@ System.register('pops', [], (function (exports) {
|
|
|
5866
5863
|
fileSize: origin_fileSize,
|
|
5867
5864
|
isFolder: isFolder,
|
|
5868
5865
|
};
|
|
5869
|
-
fileNameElement
|
|
5870
|
-
folderELement
|
|
5866
|
+
Reflect.set(fileNameElement, "__value__", __value__);
|
|
5867
|
+
Reflect.set(folderELement, "__value__", __value__);
|
|
5871
5868
|
folderELement.appendChild(fileNameElement);
|
|
5872
5869
|
return {
|
|
5873
5870
|
folderELement,
|
|
@@ -5877,10 +5874,13 @@ System.register('pops', [], (function (exports) {
|
|
|
5877
5874
|
/**
|
|
5878
5875
|
* 清空每行的元素
|
|
5879
5876
|
*/
|
|
5880
|
-
function
|
|
5877
|
+
function clearFolderRow() {
|
|
5881
5878
|
PopsSafeUtils.setSafeHTML(folderListBodyElement, "");
|
|
5882
5879
|
}
|
|
5883
|
-
|
|
5880
|
+
/**
|
|
5881
|
+
* 创建顶部导航的箭头图标
|
|
5882
|
+
*/
|
|
5883
|
+
function createHeaderArrowIcon() {
|
|
5884
5884
|
let iconArrowElement = popsDOMUtils.createElement("div", {
|
|
5885
5885
|
className: "iconArrow",
|
|
5886
5886
|
});
|
|
@@ -5888,17 +5888,16 @@ System.register('pops', [], (function (exports) {
|
|
|
5888
5888
|
}
|
|
5889
5889
|
/**
|
|
5890
5890
|
* 添加顶部导航
|
|
5891
|
-
* @param
|
|
5892
|
-
* @param
|
|
5893
|
-
* @returns
|
|
5891
|
+
* @param folderName 文件夹名
|
|
5892
|
+
* @param folderDataConfig 文件夹配置
|
|
5894
5893
|
*/
|
|
5895
|
-
function
|
|
5894
|
+
function createHeaderFileLinkNavgiation(folderName, folderDataConfig) {
|
|
5896
5895
|
let spanElement = popsDOMUtils.createElement("span", {
|
|
5897
5896
|
className: "pops-folder-file-list-breadcrumb-allFiles cursor-p",
|
|
5898
|
-
innerHTML: `<a>${
|
|
5899
|
-
_config_:
|
|
5897
|
+
innerHTML: `<a>${folderName}</a>`,
|
|
5898
|
+
_config_: folderDataConfig,
|
|
5900
5899
|
}, {
|
|
5901
|
-
title:
|
|
5900
|
+
title: folderName,
|
|
5902
5901
|
});
|
|
5903
5902
|
return spanElement;
|
|
5904
5903
|
}
|
|
@@ -5906,10 +5905,10 @@ System.register('pops', [], (function (exports) {
|
|
|
5906
5905
|
* 顶部导航的点击事件
|
|
5907
5906
|
* @param event
|
|
5908
5907
|
* @param isTop 是否是全部文件按钮
|
|
5909
|
-
* @param
|
|
5908
|
+
* @param folderDataConfigList 配置
|
|
5910
5909
|
*/
|
|
5911
|
-
function breadcrumbAllFilesElementClickEvent(event, isTop,
|
|
5912
|
-
|
|
5910
|
+
function breadcrumbAllFilesElementClickEvent(event, isTop, folderDataConfigList) {
|
|
5911
|
+
clearFolderRow();
|
|
5913
5912
|
/* 获取当前的导航元素 */
|
|
5914
5913
|
let $click = event.target;
|
|
5915
5914
|
let currentBreadcrumb = $click.closest("span.pops-folder-file-list-breadcrumb-allFiles");
|
|
@@ -5935,16 +5934,16 @@ System.register('pops', [], (function (exports) {
|
|
|
5935
5934
|
},
|
|
5936
5935
|
addIndexCSS: false,
|
|
5937
5936
|
});
|
|
5938
|
-
addFolderElement(
|
|
5937
|
+
addFolderElement(folderDataConfigList);
|
|
5939
5938
|
loadingMask.close();
|
|
5940
5939
|
}
|
|
5941
5940
|
/**
|
|
5942
5941
|
* 刷新文件列表界面信息
|
|
5943
5942
|
* @param event
|
|
5944
|
-
* @param
|
|
5943
|
+
* @param folderDataConfig
|
|
5945
5944
|
*/
|
|
5946
|
-
async function refreshFolderInfoClickEvent(event,
|
|
5947
|
-
|
|
5945
|
+
async function refreshFolderInfoClickEvent(event, folderDataConfig) {
|
|
5946
|
+
clearFolderRow();
|
|
5948
5947
|
let loadingMask = PopsLoading.init({
|
|
5949
5948
|
parent: $content,
|
|
5950
5949
|
content: {
|
|
@@ -5955,12 +5954,12 @@ System.register('pops', [], (function (exports) {
|
|
|
5955
5954
|
},
|
|
5956
5955
|
addIndexCSS: false,
|
|
5957
5956
|
});
|
|
5958
|
-
if (typeof
|
|
5959
|
-
let childConfig = await
|
|
5957
|
+
if (typeof folderDataConfig.clickEvent === "function") {
|
|
5958
|
+
let childConfig = await folderDataConfig.clickEvent(event, folderDataConfig);
|
|
5960
5959
|
/* 添加顶部导航的箭头 */
|
|
5961
|
-
folderFileListBreadcrumbPrimaryElement.appendChild(
|
|
5962
|
-
/*
|
|
5963
|
-
let breadcrumbAllFilesElement =
|
|
5960
|
+
folderFileListBreadcrumbPrimaryElement.appendChild(createHeaderArrowIcon());
|
|
5961
|
+
/* 添加顶部导航的链接文字 */
|
|
5962
|
+
let breadcrumbAllFilesElement = createHeaderFileLinkNavgiation(folderDataConfig.fileName, childConfig);
|
|
5964
5963
|
folderFileListBreadcrumbPrimaryElement.appendChild(breadcrumbAllFilesElement);
|
|
5965
5964
|
/* 设置顶部导航点击事件 */
|
|
5966
5965
|
popsDOMUtils.on(breadcrumbAllFilesElement, "click", function (event) {
|
|
@@ -6255,7 +6254,7 @@ System.register('pops', [], (function (exports) {
|
|
|
6255
6254
|
endCallBack: config.dragEndCallBack,
|
|
6256
6255
|
});
|
|
6257
6256
|
}
|
|
6258
|
-
PopsHandler.handlePush(
|
|
6257
|
+
PopsHandler.handlePush(popsType, {
|
|
6259
6258
|
guid: guid,
|
|
6260
6259
|
animElement: $anim,
|
|
6261
6260
|
popsElement: $pops,
|
|
@@ -7347,14 +7346,14 @@ System.register('pops', [], (function (exports) {
|
|
|
7347
7346
|
init(details) {
|
|
7348
7347
|
const guid = popsUtils.getRandomGUID();
|
|
7349
7348
|
// 设置当前类型
|
|
7350
|
-
const
|
|
7349
|
+
const popsType = "tooltip";
|
|
7351
7350
|
let config = PopsTooltipConfig();
|
|
7352
7351
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
7353
7352
|
config = popsUtils.assign(config, details);
|
|
7354
7353
|
if (!(config.target instanceof HTMLElement)) {
|
|
7355
7354
|
throw new TypeError("config.target 必须是HTMLElement类型");
|
|
7356
7355
|
}
|
|
7357
|
-
config = PopsHandler.handleOnly(
|
|
7356
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
7358
7357
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
7359
7358
|
PopsHandler.handleInit($shadowRoot, [
|
|
7360
7359
|
{
|
|
@@ -7661,7 +7660,10 @@ System.register('pops', [], (function (exports) {
|
|
|
7661
7660
|
},
|
|
7662
7661
|
init() {
|
|
7663
7662
|
this.setStatus(this.$data.value);
|
|
7664
|
-
|
|
7663
|
+
let disabled = typeof formConfig.disabled === "function"
|
|
7664
|
+
? formConfig.disabled()
|
|
7665
|
+
: formConfig.disabled;
|
|
7666
|
+
if (disabled) {
|
|
7665
7667
|
this.disable();
|
|
7666
7668
|
}
|
|
7667
7669
|
this.setClickEvent();
|
|
@@ -8398,7 +8400,7 @@ System.register('pops', [], (function (exports) {
|
|
|
8398
8400
|
<div class="pops-panel-item-left-text">
|
|
8399
8401
|
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>${leftDescriptionText}</div>
|
|
8400
8402
|
<div class="pops-panel-input pops-user-select-none">
|
|
8401
|
-
<input type="${inputType}" placeholder="${formConfig.placeholder}">
|
|
8403
|
+
<input type="${inputType}" placeholder="${formConfig.placeholder ?? ""}">
|
|
8402
8404
|
</div>
|
|
8403
8405
|
`);
|
|
8404
8406
|
const PopsPanelInput = {
|
|
@@ -8430,7 +8432,11 @@ System.register('pops', [], (function (exports) {
|
|
|
8430
8432
|
}
|
|
8431
8433
|
}
|
|
8432
8434
|
this.setInputChangeEvent();
|
|
8433
|
-
|
|
8435
|
+
// 是否禁用复选框
|
|
8436
|
+
let disabled = typeof formConfig.disabled === "function"
|
|
8437
|
+
? formConfig.disabled()
|
|
8438
|
+
: formConfig.disabled;
|
|
8439
|
+
if (disabled) {
|
|
8434
8440
|
this.disable();
|
|
8435
8441
|
}
|
|
8436
8442
|
if (typeof formConfig.handlerCallBack === "function") {
|
|
@@ -8608,7 +8614,10 @@ System.register('pops', [], (function (exports) {
|
|
|
8608
8614
|
init() {
|
|
8609
8615
|
this.setValue(this.$data.value);
|
|
8610
8616
|
this.setChangeEvent();
|
|
8611
|
-
|
|
8617
|
+
let disabled = typeof formConfig.disabled === "function"
|
|
8618
|
+
? formConfig.disabled()
|
|
8619
|
+
: formConfig.disabled;
|
|
8620
|
+
if (disabled) {
|
|
8612
8621
|
this.disable();
|
|
8613
8622
|
}
|
|
8614
8623
|
},
|
|
@@ -8687,7 +8696,10 @@ System.register('pops', [], (function (exports) {
|
|
|
8687
8696
|
this.initOption();
|
|
8688
8697
|
this.setChangeEvent();
|
|
8689
8698
|
this.setClickEvent();
|
|
8690
|
-
|
|
8699
|
+
let disabled = typeof formConfig.disabled === "function"
|
|
8700
|
+
? formConfig.disabled()
|
|
8701
|
+
: formConfig.disabled;
|
|
8702
|
+
if (disabled) {
|
|
8691
8703
|
this.disable();
|
|
8692
8704
|
}
|
|
8693
8705
|
},
|
|
@@ -10086,14 +10098,14 @@ System.register('pops', [], (function (exports) {
|
|
|
10086
10098
|
init(details) {
|
|
10087
10099
|
const guid = popsUtils.getRandomGUID();
|
|
10088
10100
|
// 设置当前类型
|
|
10089
|
-
const
|
|
10101
|
+
const popsType = "panel";
|
|
10090
10102
|
let config = PopsPanelConfig();
|
|
10091
10103
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10092
10104
|
config = popsUtils.assign(config, details);
|
|
10093
10105
|
if (details && Array.isArray(details.content)) {
|
|
10094
10106
|
config.content = details.content;
|
|
10095
10107
|
}
|
|
10096
|
-
config = PopsHandler.handleOnly(
|
|
10108
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10097
10109
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
10098
10110
|
PopsHandler.handleInit($shadowRoot, [
|
|
10099
10111
|
{
|
|
@@ -10128,21 +10140,21 @@ System.register('pops', [], (function (exports) {
|
|
|
10128
10140
|
// 先把z-index提取出来
|
|
10129
10141
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
10130
10142
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
10131
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
10132
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
10133
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
10143
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
10144
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
10145
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
10134
10146
|
/*html*/ `
|
|
10135
|
-
<div class="pops-title pops-${
|
|
10147
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
10136
10148
|
? config.title.text
|
|
10137
|
-
: `<p pops class="pops-${
|
|
10138
|
-
<div class="pops-content pops-${
|
|
10139
|
-
<aside class="pops-${
|
|
10140
|
-
<ul class="pops-${
|
|
10141
|
-
<ul class="pops-${
|
|
10149
|
+
: `<p pops class="pops-${popsType}-title-text" class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
10150
|
+
<div class="pops-content pops-${popsType}-content">
|
|
10151
|
+
<aside class="pops-${popsType}-aside">
|
|
10152
|
+
<ul class="pops-${popsType}-aside-top-container"></ul>
|
|
10153
|
+
<ul class="pops-${popsType}-aside-bottom-container"></ul>
|
|
10142
10154
|
</aside>
|
|
10143
|
-
<section class="pops-${
|
|
10144
|
-
<ul class="pops-${
|
|
10145
|
-
<ul class="pops-${
|
|
10155
|
+
<section class="pops-${popsType}-container">
|
|
10156
|
+
<ul class="pops-${popsType}-container-header-ul"></ul>
|
|
10157
|
+
<ul class="pops-${popsType}-container-main-ul"></ul>
|
|
10146
10158
|
</section>
|
|
10147
10159
|
</div>`, "", zIndex);
|
|
10148
10160
|
/**
|
|
@@ -10150,7 +10162,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10150
10162
|
*/
|
|
10151
10163
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
10152
10164
|
/* 结构元素 */
|
|
10153
|
-
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim,
|
|
10165
|
+
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
10154
10166
|
if (config.isMobile || popsUtils.isPhone()) {
|
|
10155
10167
|
popsDOMUtils.addClassName($pops, config.mobileClassName);
|
|
10156
10168
|
}
|
|
@@ -10165,7 +10177,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10165
10177
|
/* 遮罩层元素 */
|
|
10166
10178
|
if (config.mask.enable) {
|
|
10167
10179
|
let { maskElement } = PopsHandler.handleMask({
|
|
10168
|
-
type:
|
|
10180
|
+
type: popsType,
|
|
10169
10181
|
guid: guid,
|
|
10170
10182
|
config: config,
|
|
10171
10183
|
animElement: $anim,
|
|
@@ -10175,7 +10187,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10175
10187
|
isCreatedElementList.push($mask);
|
|
10176
10188
|
}
|
|
10177
10189
|
/* 处理返回的配置 */
|
|
10178
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
10190
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
10179
10191
|
/* 为顶部右边的关闭按钮添加点击事件 */
|
|
10180
10192
|
PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
|
|
10181
10193
|
/* 创建到页面中 */
|
|
@@ -10201,7 +10213,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10201
10213
|
$contentSectionContainer: $contentSectionContainer,
|
|
10202
10214
|
},
|
|
10203
10215
|
});
|
|
10204
|
-
PopsHandler.handlePush(
|
|
10216
|
+
PopsHandler.handlePush(popsType, {
|
|
10205
10217
|
guid: guid,
|
|
10206
10218
|
animElement: $anim,
|
|
10207
10219
|
popsElement: $pops,
|
|
@@ -10363,11 +10375,11 @@ System.register('pops', [], (function (exports) {
|
|
|
10363
10375
|
init(details) {
|
|
10364
10376
|
const guid = popsUtils.getRandomGUID();
|
|
10365
10377
|
// 设置当前类型
|
|
10366
|
-
const
|
|
10378
|
+
const popsType = "rightClickMenu";
|
|
10367
10379
|
let config = rightClickMenuConfig();
|
|
10368
10380
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10369
10381
|
config = popsUtils.assign(config, details);
|
|
10370
|
-
config = PopsHandler.handleOnly(
|
|
10382
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10371
10383
|
if (config.target == null) {
|
|
10372
10384
|
throw new Error("config.target 不能为空");
|
|
10373
10385
|
}
|
|
@@ -10416,7 +10428,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10416
10428
|
return;
|
|
10417
10429
|
}
|
|
10418
10430
|
let $click = event.target;
|
|
10419
|
-
if ($click.closest(`.pops-${
|
|
10431
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10420
10432
|
return;
|
|
10421
10433
|
}
|
|
10422
10434
|
if ($click.className &&
|
|
@@ -10435,7 +10447,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10435
10447
|
return;
|
|
10436
10448
|
}
|
|
10437
10449
|
let $click = event.target;
|
|
10438
|
-
if ($click.closest(`.pops-${
|
|
10450
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10439
10451
|
return;
|
|
10440
10452
|
}
|
|
10441
10453
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
@@ -10481,14 +10493,14 @@ System.register('pops', [], (function (exports) {
|
|
|
10481
10493
|
if (config.preventDefault) {
|
|
10482
10494
|
popsDOMUtils.preventEvent(event);
|
|
10483
10495
|
}
|
|
10484
|
-
PopsHandler.handleOnly(
|
|
10496
|
+
PopsHandler.handleOnly(popsType, config);
|
|
10485
10497
|
if (PopsContextMenu.rootElement) {
|
|
10486
10498
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
10487
10499
|
}
|
|
10488
10500
|
let rootElement = PopsContextMenu.showMenu(event, config.data, selectorTarget);
|
|
10489
10501
|
PopsContextMenu.rootElement = rootElement;
|
|
10490
10502
|
if (config.only) {
|
|
10491
|
-
PopsHandler.handlePush(
|
|
10503
|
+
PopsHandler.handlePush(popsType, {
|
|
10492
10504
|
$shadowRoot: $shadowRoot,
|
|
10493
10505
|
$shadowContainer: $shadowContainer,
|
|
10494
10506
|
guid: guid,
|
|
@@ -10530,12 +10542,12 @@ System.register('pops', [], (function (exports) {
|
|
|
10530
10542
|
});
|
|
10531
10543
|
element.remove();
|
|
10532
10544
|
}
|
|
10533
|
-
if (element.classList.contains(`pops-${
|
|
10545
|
+
if (element.classList.contains(`pops-${popsType}-anim-show`)) {
|
|
10534
10546
|
/* 有动画 */
|
|
10535
10547
|
popsDOMUtils.on(element, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
|
|
10536
10548
|
capture: true,
|
|
10537
10549
|
});
|
|
10538
|
-
element.classList.remove(`pops-${
|
|
10550
|
+
element.classList.remove(`pops-${popsType}-anim-show`);
|
|
10539
10551
|
}
|
|
10540
10552
|
else {
|
|
10541
10553
|
/* 无动画 */
|
|
@@ -10567,7 +10579,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10567
10579
|
*/
|
|
10568
10580
|
getMenuContainerElement(isChildren) {
|
|
10569
10581
|
let $menu = popsDOMUtils.createElement("div", {
|
|
10570
|
-
className: `pops-${
|
|
10582
|
+
className: `pops-${popsType}`,
|
|
10571
10583
|
innerHTML: /*html*/ `
|
|
10572
10584
|
<ul></ul>
|
|
10573
10585
|
`,
|
|
@@ -10581,7 +10593,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10581
10593
|
}
|
|
10582
10594
|
/* 添加动画 */
|
|
10583
10595
|
if (config.isAnimation) {
|
|
10584
|
-
popsDOMUtils.addClassName($menu, `pops-${
|
|
10596
|
+
popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-grid`);
|
|
10585
10597
|
}
|
|
10586
10598
|
return $menu;
|
|
10587
10599
|
},
|
|
@@ -10721,7 +10733,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10721
10733
|
});
|
|
10722
10734
|
/* 过渡动画 */
|
|
10723
10735
|
if (config.isAnimation) {
|
|
10724
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10736
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10725
10737
|
}
|
|
10726
10738
|
return menuElement;
|
|
10727
10739
|
},
|
|
@@ -10761,7 +10773,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10761
10773
|
popsDOMUtils.css(menuElement, { ...offset, display: "" });
|
|
10762
10774
|
/* 过渡动画 */
|
|
10763
10775
|
if (config.isAnimation) {
|
|
10764
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10776
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10765
10777
|
}
|
|
10766
10778
|
return menuElement;
|
|
10767
10779
|
},
|
|
@@ -10782,19 +10794,19 @@ System.register('pops', [], (function (exports) {
|
|
|
10782
10794
|
if (typeof item.icon === "string" && item.icon.trim() !== "") {
|
|
10783
10795
|
let iconSVGHTML = PopsIcon.getIcon(item.icon) ?? item.icon;
|
|
10784
10796
|
let iconElement = popsDOMUtils.parseTextToDOM(
|
|
10785
|
-
/*html*/ `<i class="pops-${
|
|
10797
|
+
/*html*/ `<i class="pops-${popsType}-icon" is-loading="${item.iconIsLoading ?? false}">${iconSVGHTML}</i>`);
|
|
10786
10798
|
menuLiElement.appendChild(iconElement);
|
|
10787
10799
|
}
|
|
10788
10800
|
/* 插入文字 */
|
|
10789
10801
|
menuLiElement.insertAdjacentHTML("beforeend", PopsSafeUtils.getSafeHTML(`<span>${item.text}</span>`));
|
|
10790
10802
|
/* 如果存在子数据，显示 */
|
|
10791
10803
|
if (item.item && Array.isArray(item.item)) {
|
|
10792
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10804
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-item`);
|
|
10793
10805
|
}
|
|
10794
10806
|
/* 鼠标|触摸 移入事件 */
|
|
10795
10807
|
function liElementHoverEvent() {
|
|
10796
10808
|
Array.from(menuULElement.children).forEach((liElement) => {
|
|
10797
|
-
popsDOMUtils.removeClassName(liElement, `pops-${
|
|
10809
|
+
popsDOMUtils.removeClassName(liElement, `pops-${popsType}-is-visited`);
|
|
10798
10810
|
if (!liElement.__menuData__) {
|
|
10799
10811
|
return;
|
|
10800
10812
|
}
|
|
@@ -10819,7 +10831,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10819
10831
|
index--;
|
|
10820
10832
|
}
|
|
10821
10833
|
}
|
|
10822
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10834
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-is-visited`);
|
|
10823
10835
|
if (!item.item) {
|
|
10824
10836
|
return;
|
|
10825
10837
|
}
|
|
@@ -10942,7 +10954,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10942
10954
|
init(details) {
|
|
10943
10955
|
const guid = popsUtils.getRandomGUID();
|
|
10944
10956
|
// 设置当前类型
|
|
10945
|
-
const
|
|
10957
|
+
const popsType = "searchSuggestion";
|
|
10946
10958
|
let config = searchSuggestionConfig();
|
|
10947
10959
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10948
10960
|
config = popsUtils.assign(config, details);
|
|
@@ -11008,7 +11020,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11008
11020
|
SearchSuggestion.changeHintULElementPosition();
|
|
11009
11021
|
SearchSuggestion.hide();
|
|
11010
11022
|
if (config.isAnimation) {
|
|
11011
|
-
SearchSuggestion.$el.root.classList.add(`pops-${
|
|
11023
|
+
SearchSuggestion.$el.root.classList.add(`pops-${popsType}-animation`);
|
|
11012
11024
|
}
|
|
11013
11025
|
$shadowRoot.appendChild(SearchSuggestion.$el.root);
|
|
11014
11026
|
parentElement.appendChild($shadowContainer);
|
|
@@ -11025,16 +11037,16 @@ System.register('pops', [], (function (exports) {
|
|
|
11025
11037
|
*/
|
|
11026
11038
|
getSearchSelectElement() {
|
|
11027
11039
|
let element = popsDOMUtils.createElement("div", {
|
|
11028
|
-
className: `pops pops-${
|
|
11040
|
+
className: `pops pops-${popsType}-search-suggestion`,
|
|
11029
11041
|
innerHTML: /*html*/ `
|
|
11030
11042
|
<style data-dynamic="true">
|
|
11031
11043
|
${this.getDynamicCSS()}
|
|
11032
11044
|
</style>
|
|
11033
|
-
<ul class="pops-${
|
|
11045
|
+
<ul class="pops-${popsType}-search-suggestion-hint">${config.toSearhNotResultHTML}</ul>
|
|
11034
11046
|
`,
|
|
11035
11047
|
}, {
|
|
11036
11048
|
"data-guid": guid,
|
|
11037
|
-
"type-value":
|
|
11049
|
+
"type-value": popsType,
|
|
11038
11050
|
});
|
|
11039
11051
|
if (config.className !== "" && config.className != null) {
|
|
11040
11052
|
popsDOMUtils.addClassName(element, config.className);
|
|
@@ -11044,24 +11056,24 @@ System.register('pops', [], (function (exports) {
|
|
|
11044
11056
|
/** 动态获取CSS */
|
|
11045
11057
|
getDynamicCSS() {
|
|
11046
11058
|
return /*css*/ `
|
|
11047
|
-
.pops-${
|
|
11059
|
+
.pops-${popsType}-animation{
|
|
11048
11060
|
-moz-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11049
11061
|
-webkit-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11050
11062
|
-o-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11051
11063
|
-ms-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11052
11064
|
}
|
|
11053
|
-
.pops-${
|
|
11065
|
+
.pops-${popsType}-search-suggestion{
|
|
11054
11066
|
--search-suggestion-bg-color: #ffffff;
|
|
11055
11067
|
--search-suggestion-box-shadow-color: rgb(0 0 0 / 20%);
|
|
11056
11068
|
--search-suggestion-item-color: #515a6e;
|
|
11057
11069
|
--search-suggestion-item-none-color: #8e8e8e;
|
|
11058
11070
|
--search-suggestion-item-hover-bg-color: rgba(0, 0, 0, .1);
|
|
11059
11071
|
}
|
|
11060
|
-
.pops-${
|
|
11072
|
+
.pops-${popsType}-search-suggestion{
|
|
11061
11073
|
border: initial;
|
|
11062
11074
|
overflow: initial;
|
|
11063
11075
|
}
|
|
11064
|
-
ul.pops-${
|
|
11076
|
+
ul.pops-${popsType}-search-suggestion-hint{
|
|
11065
11077
|
position: ${config.isAbsolute ? "absolute" : "fixed"};
|
|
11066
11078
|
z-index: ${PopsHandler.handleZIndex(config.zIndex)};
|
|
11067
11079
|
width: 0;
|
|
@@ -11076,14 +11088,14 @@ System.register('pops', [], (function (exports) {
|
|
|
11076
11088
|
box-shadow: 0 1px 6px var(--search-suggestion-box-shadow-color);
|
|
11077
11089
|
}
|
|
11078
11090
|
/* 建议框在上面时 */
|
|
11079
|
-
ul.pops-${
|
|
11091
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse]{
|
|
11080
11092
|
display: flex;
|
|
11081
11093
|
flex-direction: column-reverse;
|
|
11082
11094
|
}
|
|
11083
|
-
ul.pops-${
|
|
11095
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse] li{
|
|
11084
11096
|
flex-shrink: 0;
|
|
11085
11097
|
}
|
|
11086
|
-
ul.pops-${
|
|
11098
|
+
ul.pops-${popsType}-search-suggestion-hint li{
|
|
11087
11099
|
padding: 7px;
|
|
11088
11100
|
margin: 0;
|
|
11089
11101
|
clear: both;
|
|
@@ -11096,17 +11108,17 @@ System.register('pops', [], (function (exports) {
|
|
|
11096
11108
|
text-overflow: ellipsis;
|
|
11097
11109
|
width: 100%;
|
|
11098
11110
|
}
|
|
11099
|
-
ul.pops-${
|
|
11111
|
+
ul.pops-${popsType}-search-suggestion-hint li[data-none]{
|
|
11100
11112
|
text-align: center;
|
|
11101
11113
|
font-size: 12px;
|
|
11102
11114
|
color: var(--search-suggestion-item-none-color);
|
|
11103
11115
|
}
|
|
11104
|
-
ul.pops-${
|
|
11116
|
+
ul.pops-${popsType}-search-suggestion-hint li:hover{
|
|
11105
11117
|
background-color: var(--search-suggestion-item-hover-bg-color);
|
|
11106
11118
|
}
|
|
11107
11119
|
|
|
11108
11120
|
@media (prefers-color-scheme: dark){
|
|
11109
|
-
.pops-${
|
|
11121
|
+
.pops-${popsType}-search-suggestion{
|
|
11110
11122
|
--search-suggestion-bg-color: #1d1e1f;
|
|
11111
11123
|
--search-suggestion-item-color: #cfd3d4;
|
|
11112
11124
|
--search-suggestion-item-hover-bg-color: rgba(175, 175, 175, .1);
|
|
@@ -11121,7 +11133,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11121
11133
|
*/
|
|
11122
11134
|
getSearchItemLiElement(data, index) {
|
|
11123
11135
|
return popsDOMUtils.createElement("li", {
|
|
11124
|
-
className: `pops-${
|
|
11136
|
+
className: `pops-${popsType}-search-suggestion-hint-item pops-flex-items-center pops-flex-y-center`,
|
|
11125
11137
|
"data-index": index,
|
|
11126
11138
|
"data-value": SearchSuggestion.getItemDataValue(data),
|
|
11127
11139
|
innerHTML: `${config.getItemHTML(data)}${config.deleteIcon.enable ? SearchSuggestion.getDeleteIconHTML() : ""}`,
|
|
@@ -11142,7 +11154,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11142
11154
|
popsDOMUtils.on(liElement, "click", void 0, (event) => {
|
|
11143
11155
|
popsDOMUtils.preventEvent(event);
|
|
11144
11156
|
let $click = event.target;
|
|
11145
|
-
if ($click.closest(`.pops-${
|
|
11157
|
+
if ($click.closest(`.pops-${popsType}-delete-icon`)) {
|
|
11146
11158
|
/* 点击的是删除按钮 */
|
|
11147
11159
|
if (typeof config.deleteIcon.callback === "function") {
|
|
11148
11160
|
config.deleteIcon.callback(event, liElement, liElement["data-value"]);
|
|
@@ -11334,7 +11346,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11334
11346
|
*/
|
|
11335
11347
|
getDeleteIconHTML(size = 16, fill = "#bababa") {
|
|
11336
11348
|
return /*html*/ `
|
|
11337
|
-
<svg class="pops-${
|
|
11349
|
+
<svg class="pops-${popsType}-delete-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="${fill}">
|
|
11338
11350
|
<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>
|
|
11339
11351
|
<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>
|
|
11340
11352
|
</svg>
|
|
@@ -11345,7 +11357,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11345
11357
|
*/
|
|
11346
11358
|
setPromptsInSearch() {
|
|
11347
11359
|
let isSearchingElement = popsDOMUtils.createElement("li", {
|
|
11348
|
-
className: `pops-${
|
|
11360
|
+
className: `pops-${popsType}-search-suggestion-hint-searching-item`,
|
|
11349
11361
|
innerHTML: config.searchingTip,
|
|
11350
11362
|
});
|
|
11351
11363
|
SearchSuggestion.$el.$hintULContainer.appendChild(isSearchingElement);
|
|
@@ -11355,7 +11367,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11355
11367
|
*/
|
|
11356
11368
|
removePromptsInSearch() {
|
|
11357
11369
|
SearchSuggestion.$el.$hintULContainer
|
|
11358
|
-
.querySelector(`li.pops-${
|
|
11370
|
+
.querySelector(`li.pops-${popsType}-search-suggestion-hint-searching-item`)
|
|
11359
11371
|
?.remove();
|
|
11360
11372
|
},
|
|
11361
11373
|
/**
|
|
@@ -11508,7 +11520,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11508
11520
|
/** 配置 */
|
|
11509
11521
|
config = {
|
|
11510
11522
|
/** 版本号 */
|
|
11511
|
-
version: "2025.7.
|
|
11523
|
+
version: "2025.7.15",
|
|
11512
11524
|
cssText: PopsCSS,
|
|
11513
11525
|
/** icon图标的svg代码 */
|
|
11514
11526
|
iconSVG: PopsIcon.$data,
|