@whitesev/pops 2.2.1 → 2.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.amd.js +256 -257
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +256 -257
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +256 -257
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +256 -257
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +256 -257
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +256 -257
- 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/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/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/index.ts +19 -18
- 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
|
{
|
|
@@ -10086,14 +10085,14 @@ System.register('pops', [], (function (exports) {
|
|
|
10086
10085
|
init(details) {
|
|
10087
10086
|
const guid = popsUtils.getRandomGUID();
|
|
10088
10087
|
// 设置当前类型
|
|
10089
|
-
const
|
|
10088
|
+
const popsType = "panel";
|
|
10090
10089
|
let config = PopsPanelConfig();
|
|
10091
10090
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10092
10091
|
config = popsUtils.assign(config, details);
|
|
10093
10092
|
if (details && Array.isArray(details.content)) {
|
|
10094
10093
|
config.content = details.content;
|
|
10095
10094
|
}
|
|
10096
|
-
config = PopsHandler.handleOnly(
|
|
10095
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10097
10096
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
10098
10097
|
PopsHandler.handleInit($shadowRoot, [
|
|
10099
10098
|
{
|
|
@@ -10128,21 +10127,21 @@ System.register('pops', [], (function (exports) {
|
|
|
10128
10127
|
// 先把z-index提取出来
|
|
10129
10128
|
let zIndex = PopsHandler.handleZIndex(config.zIndex);
|
|
10130
10129
|
let maskHTML = PopsElementHandler.getMaskHTML(guid, zIndex);
|
|
10131
|
-
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(
|
|
10132
|
-
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(
|
|
10133
|
-
let animHTML = PopsElementHandler.getAnimHTML(guid,
|
|
10130
|
+
let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(popsType, config);
|
|
10131
|
+
let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(popsType, config);
|
|
10132
|
+
let animHTML = PopsElementHandler.getAnimHTML(guid, popsType, config,
|
|
10134
10133
|
/*html*/ `
|
|
10135
|
-
<div class="pops-title pops-${
|
|
10134
|
+
<div class="pops-title pops-${popsType}-title" style="text-align: ${config.title.position};${headerStyle}">${config.title.html
|
|
10136
10135
|
? 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-${
|
|
10136
|
+
: `<p pops class="pops-${popsType}-title-text" class="pops-${popsType}-title-text" style="${headerPStyle}">${config.title.text}</p>`}${headerBtnHTML}</div>
|
|
10137
|
+
<div class="pops-content pops-${popsType}-content">
|
|
10138
|
+
<aside class="pops-${popsType}-aside">
|
|
10139
|
+
<ul class="pops-${popsType}-aside-top-container"></ul>
|
|
10140
|
+
<ul class="pops-${popsType}-aside-bottom-container"></ul>
|
|
10142
10141
|
</aside>
|
|
10143
|
-
<section class="pops-${
|
|
10144
|
-
<ul class="pops-${
|
|
10145
|
-
<ul class="pops-${
|
|
10142
|
+
<section class="pops-${popsType}-container">
|
|
10143
|
+
<ul class="pops-${popsType}-container-header-ul"></ul>
|
|
10144
|
+
<ul class="pops-${popsType}-container-main-ul"></ul>
|
|
10146
10145
|
</section>
|
|
10147
10146
|
</div>`, "", zIndex);
|
|
10148
10147
|
/**
|
|
@@ -10150,7 +10149,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10150
10149
|
*/
|
|
10151
10150
|
let $anim = PopsElementHandler.parseElement(animHTML);
|
|
10152
10151
|
/* 结构元素 */
|
|
10153
|
-
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim,
|
|
10152
|
+
let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, titleElement: $title, contentElement: $content, contentAsideElement: $contentAside, contentSectionContainerElement: $contentSectionContainer, } = PopsHandler.handleQueryElement($anim, popsType);
|
|
10154
10153
|
if (config.isMobile || popsUtils.isPhone()) {
|
|
10155
10154
|
popsDOMUtils.addClassName($pops, config.mobileClassName);
|
|
10156
10155
|
}
|
|
@@ -10165,7 +10164,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10165
10164
|
/* 遮罩层元素 */
|
|
10166
10165
|
if (config.mask.enable) {
|
|
10167
10166
|
let { maskElement } = PopsHandler.handleMask({
|
|
10168
|
-
type:
|
|
10167
|
+
type: popsType,
|
|
10169
10168
|
guid: guid,
|
|
10170
10169
|
config: config,
|
|
10171
10170
|
animElement: $anim,
|
|
@@ -10175,7 +10174,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10175
10174
|
isCreatedElementList.push($mask);
|
|
10176
10175
|
}
|
|
10177
10176
|
/* 处理返回的配置 */
|
|
10178
|
-
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot,
|
|
10177
|
+
let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask, config);
|
|
10179
10178
|
/* 为顶部右边的关闭按钮添加点击事件 */
|
|
10180
10179
|
PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
|
|
10181
10180
|
/* 创建到页面中 */
|
|
@@ -10201,7 +10200,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10201
10200
|
$contentSectionContainer: $contentSectionContainer,
|
|
10202
10201
|
},
|
|
10203
10202
|
});
|
|
10204
|
-
PopsHandler.handlePush(
|
|
10203
|
+
PopsHandler.handlePush(popsType, {
|
|
10205
10204
|
guid: guid,
|
|
10206
10205
|
animElement: $anim,
|
|
10207
10206
|
popsElement: $pops,
|
|
@@ -10363,11 +10362,11 @@ System.register('pops', [], (function (exports) {
|
|
|
10363
10362
|
init(details) {
|
|
10364
10363
|
const guid = popsUtils.getRandomGUID();
|
|
10365
10364
|
// 设置当前类型
|
|
10366
|
-
const
|
|
10365
|
+
const popsType = "rightClickMenu";
|
|
10367
10366
|
let config = rightClickMenuConfig();
|
|
10368
10367
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10369
10368
|
config = popsUtils.assign(config, details);
|
|
10370
|
-
config = PopsHandler.handleOnly(
|
|
10369
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
10371
10370
|
if (config.target == null) {
|
|
10372
10371
|
throw new Error("config.target 不能为空");
|
|
10373
10372
|
}
|
|
@@ -10416,7 +10415,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10416
10415
|
return;
|
|
10417
10416
|
}
|
|
10418
10417
|
let $click = event.target;
|
|
10419
|
-
if ($click.closest(`.pops-${
|
|
10418
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10420
10419
|
return;
|
|
10421
10420
|
}
|
|
10422
10421
|
if ($click.className &&
|
|
@@ -10435,7 +10434,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10435
10434
|
return;
|
|
10436
10435
|
}
|
|
10437
10436
|
let $click = event.target;
|
|
10438
|
-
if ($click.closest(`.pops-${
|
|
10437
|
+
if ($click.closest(`.pops-${popsType}`)) {
|
|
10439
10438
|
return;
|
|
10440
10439
|
}
|
|
10441
10440
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
@@ -10481,14 +10480,14 @@ System.register('pops', [], (function (exports) {
|
|
|
10481
10480
|
if (config.preventDefault) {
|
|
10482
10481
|
popsDOMUtils.preventEvent(event);
|
|
10483
10482
|
}
|
|
10484
|
-
PopsHandler.handleOnly(
|
|
10483
|
+
PopsHandler.handleOnly(popsType, config);
|
|
10485
10484
|
if (PopsContextMenu.rootElement) {
|
|
10486
10485
|
PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
|
|
10487
10486
|
}
|
|
10488
10487
|
let rootElement = PopsContextMenu.showMenu(event, config.data, selectorTarget);
|
|
10489
10488
|
PopsContextMenu.rootElement = rootElement;
|
|
10490
10489
|
if (config.only) {
|
|
10491
|
-
PopsHandler.handlePush(
|
|
10490
|
+
PopsHandler.handlePush(popsType, {
|
|
10492
10491
|
$shadowRoot: $shadowRoot,
|
|
10493
10492
|
$shadowContainer: $shadowContainer,
|
|
10494
10493
|
guid: guid,
|
|
@@ -10530,12 +10529,12 @@ System.register('pops', [], (function (exports) {
|
|
|
10530
10529
|
});
|
|
10531
10530
|
element.remove();
|
|
10532
10531
|
}
|
|
10533
|
-
if (element.classList.contains(`pops-${
|
|
10532
|
+
if (element.classList.contains(`pops-${popsType}-anim-show`)) {
|
|
10534
10533
|
/* 有动画 */
|
|
10535
10534
|
popsDOMUtils.on(element, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
|
|
10536
10535
|
capture: true,
|
|
10537
10536
|
});
|
|
10538
|
-
element.classList.remove(`pops-${
|
|
10537
|
+
element.classList.remove(`pops-${popsType}-anim-show`);
|
|
10539
10538
|
}
|
|
10540
10539
|
else {
|
|
10541
10540
|
/* 无动画 */
|
|
@@ -10567,7 +10566,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10567
10566
|
*/
|
|
10568
10567
|
getMenuContainerElement(isChildren) {
|
|
10569
10568
|
let $menu = popsDOMUtils.createElement("div", {
|
|
10570
|
-
className: `pops-${
|
|
10569
|
+
className: `pops-${popsType}`,
|
|
10571
10570
|
innerHTML: /*html*/ `
|
|
10572
10571
|
<ul></ul>
|
|
10573
10572
|
`,
|
|
@@ -10581,7 +10580,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10581
10580
|
}
|
|
10582
10581
|
/* 添加动画 */
|
|
10583
10582
|
if (config.isAnimation) {
|
|
10584
|
-
popsDOMUtils.addClassName($menu, `pops-${
|
|
10583
|
+
popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-grid`);
|
|
10585
10584
|
}
|
|
10586
10585
|
return $menu;
|
|
10587
10586
|
},
|
|
@@ -10721,7 +10720,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10721
10720
|
});
|
|
10722
10721
|
/* 过渡动画 */
|
|
10723
10722
|
if (config.isAnimation) {
|
|
10724
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10723
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10725
10724
|
}
|
|
10726
10725
|
return menuElement;
|
|
10727
10726
|
},
|
|
@@ -10761,7 +10760,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10761
10760
|
popsDOMUtils.css(menuElement, { ...offset, display: "" });
|
|
10762
10761
|
/* 过渡动画 */
|
|
10763
10762
|
if (config.isAnimation) {
|
|
10764
|
-
popsDOMUtils.addClassName(menuElement, `pops-${
|
|
10763
|
+
popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
|
|
10765
10764
|
}
|
|
10766
10765
|
return menuElement;
|
|
10767
10766
|
},
|
|
@@ -10782,19 +10781,19 @@ System.register('pops', [], (function (exports) {
|
|
|
10782
10781
|
if (typeof item.icon === "string" && item.icon.trim() !== "") {
|
|
10783
10782
|
let iconSVGHTML = PopsIcon.getIcon(item.icon) ?? item.icon;
|
|
10784
10783
|
let iconElement = popsDOMUtils.parseTextToDOM(
|
|
10785
|
-
/*html*/ `<i class="pops-${
|
|
10784
|
+
/*html*/ `<i class="pops-${popsType}-icon" is-loading="${item.iconIsLoading ?? false}">${iconSVGHTML}</i>`);
|
|
10786
10785
|
menuLiElement.appendChild(iconElement);
|
|
10787
10786
|
}
|
|
10788
10787
|
/* 插入文字 */
|
|
10789
10788
|
menuLiElement.insertAdjacentHTML("beforeend", PopsSafeUtils.getSafeHTML(`<span>${item.text}</span>`));
|
|
10790
10789
|
/* 如果存在子数据，显示 */
|
|
10791
10790
|
if (item.item && Array.isArray(item.item)) {
|
|
10792
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10791
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-item`);
|
|
10793
10792
|
}
|
|
10794
10793
|
/* 鼠标|触摸 移入事件 */
|
|
10795
10794
|
function liElementHoverEvent() {
|
|
10796
10795
|
Array.from(menuULElement.children).forEach((liElement) => {
|
|
10797
|
-
popsDOMUtils.removeClassName(liElement, `pops-${
|
|
10796
|
+
popsDOMUtils.removeClassName(liElement, `pops-${popsType}-is-visited`);
|
|
10798
10797
|
if (!liElement.__menuData__) {
|
|
10799
10798
|
return;
|
|
10800
10799
|
}
|
|
@@ -10819,7 +10818,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10819
10818
|
index--;
|
|
10820
10819
|
}
|
|
10821
10820
|
}
|
|
10822
|
-
popsDOMUtils.addClassName(menuLiElement, `pops-${
|
|
10821
|
+
popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-is-visited`);
|
|
10823
10822
|
if (!item.item) {
|
|
10824
10823
|
return;
|
|
10825
10824
|
}
|
|
@@ -10942,7 +10941,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10942
10941
|
init(details) {
|
|
10943
10942
|
const guid = popsUtils.getRandomGUID();
|
|
10944
10943
|
// 设置当前类型
|
|
10945
|
-
const
|
|
10944
|
+
const popsType = "searchSuggestion";
|
|
10946
10945
|
let config = searchSuggestionConfig();
|
|
10947
10946
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
10948
10947
|
config = popsUtils.assign(config, details);
|
|
@@ -11008,7 +11007,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11008
11007
|
SearchSuggestion.changeHintULElementPosition();
|
|
11009
11008
|
SearchSuggestion.hide();
|
|
11010
11009
|
if (config.isAnimation) {
|
|
11011
|
-
SearchSuggestion.$el.root.classList.add(`pops-${
|
|
11010
|
+
SearchSuggestion.$el.root.classList.add(`pops-${popsType}-animation`);
|
|
11012
11011
|
}
|
|
11013
11012
|
$shadowRoot.appendChild(SearchSuggestion.$el.root);
|
|
11014
11013
|
parentElement.appendChild($shadowContainer);
|
|
@@ -11025,16 +11024,16 @@ System.register('pops', [], (function (exports) {
|
|
|
11025
11024
|
*/
|
|
11026
11025
|
getSearchSelectElement() {
|
|
11027
11026
|
let element = popsDOMUtils.createElement("div", {
|
|
11028
|
-
className: `pops pops-${
|
|
11027
|
+
className: `pops pops-${popsType}-search-suggestion`,
|
|
11029
11028
|
innerHTML: /*html*/ `
|
|
11030
11029
|
<style data-dynamic="true">
|
|
11031
11030
|
${this.getDynamicCSS()}
|
|
11032
11031
|
</style>
|
|
11033
|
-
<ul class="pops-${
|
|
11032
|
+
<ul class="pops-${popsType}-search-suggestion-hint">${config.toSearhNotResultHTML}</ul>
|
|
11034
11033
|
`,
|
|
11035
11034
|
}, {
|
|
11036
11035
|
"data-guid": guid,
|
|
11037
|
-
"type-value":
|
|
11036
|
+
"type-value": popsType,
|
|
11038
11037
|
});
|
|
11039
11038
|
if (config.className !== "" && config.className != null) {
|
|
11040
11039
|
popsDOMUtils.addClassName(element, config.className);
|
|
@@ -11044,24 +11043,24 @@ System.register('pops', [], (function (exports) {
|
|
|
11044
11043
|
/** 动态获取CSS */
|
|
11045
11044
|
getDynamicCSS() {
|
|
11046
11045
|
return /*css*/ `
|
|
11047
|
-
.pops-${
|
|
11046
|
+
.pops-${popsType}-animation{
|
|
11048
11047
|
-moz-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11049
11048
|
-webkit-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11050
11049
|
-o-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11051
11050
|
-ms-animation: searchSelectFalIn 0.5s 1 linear;
|
|
11052
11051
|
}
|
|
11053
|
-
.pops-${
|
|
11052
|
+
.pops-${popsType}-search-suggestion{
|
|
11054
11053
|
--search-suggestion-bg-color: #ffffff;
|
|
11055
11054
|
--search-suggestion-box-shadow-color: rgb(0 0 0 / 20%);
|
|
11056
11055
|
--search-suggestion-item-color: #515a6e;
|
|
11057
11056
|
--search-suggestion-item-none-color: #8e8e8e;
|
|
11058
11057
|
--search-suggestion-item-hover-bg-color: rgba(0, 0, 0, .1);
|
|
11059
11058
|
}
|
|
11060
|
-
.pops-${
|
|
11059
|
+
.pops-${popsType}-search-suggestion{
|
|
11061
11060
|
border: initial;
|
|
11062
11061
|
overflow: initial;
|
|
11063
11062
|
}
|
|
11064
|
-
ul.pops-${
|
|
11063
|
+
ul.pops-${popsType}-search-suggestion-hint{
|
|
11065
11064
|
position: ${config.isAbsolute ? "absolute" : "fixed"};
|
|
11066
11065
|
z-index: ${PopsHandler.handleZIndex(config.zIndex)};
|
|
11067
11066
|
width: 0;
|
|
@@ -11076,14 +11075,14 @@ System.register('pops', [], (function (exports) {
|
|
|
11076
11075
|
box-shadow: 0 1px 6px var(--search-suggestion-box-shadow-color);
|
|
11077
11076
|
}
|
|
11078
11077
|
/* 建议框在上面时 */
|
|
11079
|
-
ul.pops-${
|
|
11078
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse]{
|
|
11080
11079
|
display: flex;
|
|
11081
11080
|
flex-direction: column-reverse;
|
|
11082
11081
|
}
|
|
11083
|
-
ul.pops-${
|
|
11082
|
+
ul.pops-${popsType}-search-suggestion-hint[data-top-reverse] li{
|
|
11084
11083
|
flex-shrink: 0;
|
|
11085
11084
|
}
|
|
11086
|
-
ul.pops-${
|
|
11085
|
+
ul.pops-${popsType}-search-suggestion-hint li{
|
|
11087
11086
|
padding: 7px;
|
|
11088
11087
|
margin: 0;
|
|
11089
11088
|
clear: both;
|
|
@@ -11096,17 +11095,17 @@ System.register('pops', [], (function (exports) {
|
|
|
11096
11095
|
text-overflow: ellipsis;
|
|
11097
11096
|
width: 100%;
|
|
11098
11097
|
}
|
|
11099
|
-
ul.pops-${
|
|
11098
|
+
ul.pops-${popsType}-search-suggestion-hint li[data-none]{
|
|
11100
11099
|
text-align: center;
|
|
11101
11100
|
font-size: 12px;
|
|
11102
11101
|
color: var(--search-suggestion-item-none-color);
|
|
11103
11102
|
}
|
|
11104
|
-
ul.pops-${
|
|
11103
|
+
ul.pops-${popsType}-search-suggestion-hint li:hover{
|
|
11105
11104
|
background-color: var(--search-suggestion-item-hover-bg-color);
|
|
11106
11105
|
}
|
|
11107
11106
|
|
|
11108
11107
|
@media (prefers-color-scheme: dark){
|
|
11109
|
-
.pops-${
|
|
11108
|
+
.pops-${popsType}-search-suggestion{
|
|
11110
11109
|
--search-suggestion-bg-color: #1d1e1f;
|
|
11111
11110
|
--search-suggestion-item-color: #cfd3d4;
|
|
11112
11111
|
--search-suggestion-item-hover-bg-color: rgba(175, 175, 175, .1);
|
|
@@ -11121,7 +11120,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11121
11120
|
*/
|
|
11122
11121
|
getSearchItemLiElement(data, index) {
|
|
11123
11122
|
return popsDOMUtils.createElement("li", {
|
|
11124
|
-
className: `pops-${
|
|
11123
|
+
className: `pops-${popsType}-search-suggestion-hint-item pops-flex-items-center pops-flex-y-center`,
|
|
11125
11124
|
"data-index": index,
|
|
11126
11125
|
"data-value": SearchSuggestion.getItemDataValue(data),
|
|
11127
11126
|
innerHTML: `${config.getItemHTML(data)}${config.deleteIcon.enable ? SearchSuggestion.getDeleteIconHTML() : ""}`,
|
|
@@ -11142,7 +11141,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11142
11141
|
popsDOMUtils.on(liElement, "click", void 0, (event) => {
|
|
11143
11142
|
popsDOMUtils.preventEvent(event);
|
|
11144
11143
|
let $click = event.target;
|
|
11145
|
-
if ($click.closest(`.pops-${
|
|
11144
|
+
if ($click.closest(`.pops-${popsType}-delete-icon`)) {
|
|
11146
11145
|
/* 点击的是删除按钮 */
|
|
11147
11146
|
if (typeof config.deleteIcon.callback === "function") {
|
|
11148
11147
|
config.deleteIcon.callback(event, liElement, liElement["data-value"]);
|
|
@@ -11334,7 +11333,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11334
11333
|
*/
|
|
11335
11334
|
getDeleteIconHTML(size = 16, fill = "#bababa") {
|
|
11336
11335
|
return /*html*/ `
|
|
11337
|
-
<svg class="pops-${
|
|
11336
|
+
<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
11337
|
<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
11338
|
<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
11339
|
</svg>
|
|
@@ -11345,7 +11344,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11345
11344
|
*/
|
|
11346
11345
|
setPromptsInSearch() {
|
|
11347
11346
|
let isSearchingElement = popsDOMUtils.createElement("li", {
|
|
11348
|
-
className: `pops-${
|
|
11347
|
+
className: `pops-${popsType}-search-suggestion-hint-searching-item`,
|
|
11349
11348
|
innerHTML: config.searchingTip,
|
|
11350
11349
|
});
|
|
11351
11350
|
SearchSuggestion.$el.$hintULContainer.appendChild(isSearchingElement);
|
|
@@ -11355,7 +11354,7 @@ System.register('pops', [], (function (exports) {
|
|
|
11355
11354
|
*/
|
|
11356
11355
|
removePromptsInSearch() {
|
|
11357
11356
|
SearchSuggestion.$el.$hintULContainer
|
|
11358
|
-
.querySelector(`li.pops-${
|
|
11357
|
+
.querySelector(`li.pops-${popsType}-search-suggestion-hint-searching-item`)
|
|
11359
11358
|
?.remove();
|
|
11360
11359
|
},
|
|
11361
11360
|
/**
|