@whitesev/pops 1.7.2 → 1.7.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.amd.js +95 -1403
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +95 -1403
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +95 -1403
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +95 -1403
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +95 -1403
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +95 -1403
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/GlobalConfig.d.ts +20 -0
- package/dist/types/src/Pops.d.ts +18 -1
- package/dist/types/src/utils/PopsUtils.d.ts +2 -1
- package/package.json +2 -1
- package/src/GlobalConfig.ts +60 -0
- package/src/Pops.ts +6 -1
- package/src/components/alert/index.ts +2 -0
- package/src/components/confirm/index.ts +2 -0
- package/src/components/drawer/index.ts +2 -0
- package/src/components/folder/index.ts +3 -1
- package/src/components/iframe/index.ts +2 -0
- package/src/components/loading/index.ts +2 -0
- package/src/components/panel/PanelHandleContentDetails.ts +1 -1
- package/src/components/panel/index.ts +2 -0
- package/src/components/prompt/index.ts +2 -0
- package/src/components/rightClickMenu/index.ts +2 -0
- package/src/components/searchSuggestion/index.ts +2 -0
- package/src/components/tooltip/index.ts +2 -0
- package/src/css/index.css +8 -0
- package/src/utils/PopsInstanceUtils.ts +109 -119
- package/src/utils/PopsUtils.ts +5 -2
- package/dist/types/src/utils/AnyTouch.d.ts +0 -17
- package/src/utils/AnyTouch.js +0 -1394
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
type EnterReturnType<T> = null | T | (() => T);
|
|
2
|
+
type GlobalConfigOption = {
|
|
3
|
+
style?: EnterReturnType<string>;
|
|
4
|
+
zIndex?: EnterReturnType<number> | EnterReturnType<string>;
|
|
5
|
+
};
|
|
6
|
+
export declare const GlobalConfig: {
|
|
7
|
+
config: GlobalConfigOption;
|
|
8
|
+
/**
|
|
9
|
+
* 为所有弹窗设置全局属性
|
|
10
|
+
*/
|
|
11
|
+
setGlobalConfig(config: GlobalConfigOption): void;
|
|
12
|
+
/**
|
|
13
|
+
* 获取全局配置
|
|
14
|
+
*/
|
|
15
|
+
getGlobalConfig(): {
|
|
16
|
+
style?: string | undefined;
|
|
17
|
+
zIndex?: string | number | undefined;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
export {};
|
package/dist/types/src/Pops.d.ts
CHANGED
|
@@ -79,7 +79,7 @@ declare class Pops {
|
|
|
79
79
|
formatTime(text?: string | number | Date, formatType?: string): string;
|
|
80
80
|
formatTime(text?: string | number | Date, formatType?: "yyyy-MM-dd HH:mm:ss" | "yyyy/MM/dd HH:mm:ss" | "yyyy_MM_dd_HH_mm_ss" | "yyyy\u5E74MM\u6708dd\u65E5 HH\u65F6mm\u5206ss\u79D2" | "yyyy\u5E74MM\u6708dd\u65E5 hh:mm:ss" | "yyyy\u5E74MM\u6708dd\u65E5 HH:mm:ss" | "yyyy-MM-dd" | "yyyyMMdd" | "HH:mm:ss"): string;
|
|
81
81
|
formatByteToSize<T extends boolean>(byteSize: number | string, addType?: T | undefined): T extends true ? string : number;
|
|
82
|
-
AnyTouch: () => any;
|
|
82
|
+
AnyTouch: () => typeof import("any-touch").default;
|
|
83
83
|
};
|
|
84
84
|
/** pops使用的DOM工具类 */
|
|
85
85
|
DOMUtils: {
|
|
@@ -231,6 +231,23 @@ declare class Pops {
|
|
|
231
231
|
* @param userAgent
|
|
232
232
|
*/
|
|
233
233
|
isPhone(userAgent?: string): boolean;
|
|
234
|
+
/**
|
|
235
|
+
* 为所有弹窗设置全局属性
|
|
236
|
+
*/
|
|
237
|
+
GlobalConfig: {
|
|
238
|
+
config: {
|
|
239
|
+
style?: string | (() => string) | null;
|
|
240
|
+
zIndex?: (number | (() => number) | null) | (string | (() => string) | null);
|
|
241
|
+
};
|
|
242
|
+
setGlobalConfig(config: {
|
|
243
|
+
style?: string | (() => string) | null;
|
|
244
|
+
zIndex?: (number | (() => number) | null) | (string | (() => string) | null);
|
|
245
|
+
}): void;
|
|
246
|
+
getGlobalConfig(): {
|
|
247
|
+
style?: string | undefined;
|
|
248
|
+
zIndex?: string | number | undefined;
|
|
249
|
+
};
|
|
250
|
+
};
|
|
234
251
|
/**
|
|
235
252
|
* 普通信息框
|
|
236
253
|
* @param details 配置
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import AnyTouch from "any-touch";
|
|
1
2
|
declare class PopsUtils {
|
|
2
3
|
/**
|
|
3
4
|
* 判断是否是window,例如window、self、globalThis
|
|
@@ -117,7 +118,7 @@ declare class PopsUtils {
|
|
|
117
118
|
* > 793.27
|
|
118
119
|
**/
|
|
119
120
|
formatByteToSize<T extends boolean>(byteSize: number | string, addType?: T): T extends true ? string : number;
|
|
120
|
-
AnyTouch: () =>
|
|
121
|
+
AnyTouch: () => typeof AnyTouch;
|
|
121
122
|
}
|
|
122
123
|
declare const popsUtils: PopsUtils;
|
|
123
124
|
export { popsUtils };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@whitesev/pops",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.4",
|
|
4
4
|
"description": "弹窗库",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.esm.js",
|
|
@@ -37,6 +37,7 @@
|
|
|
37
37
|
"@rollup/plugin-commonjs": "^25.0.8",
|
|
38
38
|
"@rollup/plugin-node-resolve": "^15.2.3",
|
|
39
39
|
"@rollup/plugin-typescript": "^11.1.6",
|
|
40
|
+
"any-touch": "^2.2.0",
|
|
40
41
|
"rollup-plugin-clear": "^2.0.7",
|
|
41
42
|
"tslib": "^2.6.2"
|
|
42
43
|
},
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
type EnterReturnType<T> = null | T | (() => T);
|
|
2
|
+
|
|
3
|
+
type GlobalConfigOption = {
|
|
4
|
+
style?: EnterReturnType<string>;
|
|
5
|
+
zIndex?: EnterReturnType<number> | EnterReturnType<string>;
|
|
6
|
+
};
|
|
7
|
+
|
|
8
|
+
type ResultGlobalConfigOption<T> = T extends null | undefined
|
|
9
|
+
? never
|
|
10
|
+
: T extends (...args: any) => infer R
|
|
11
|
+
? R
|
|
12
|
+
: T;
|
|
13
|
+
export const GlobalConfig = {
|
|
14
|
+
config: {} as GlobalConfigOption,
|
|
15
|
+
/**
|
|
16
|
+
* 为所有弹窗设置全局属性
|
|
17
|
+
*/
|
|
18
|
+
setGlobalConfig(config: GlobalConfigOption) {
|
|
19
|
+
Reflect.ownKeys(config).forEach((keyName) => {
|
|
20
|
+
Reflect.set(GlobalConfig.config, keyName, Reflect.get(config, keyName));
|
|
21
|
+
});
|
|
22
|
+
},
|
|
23
|
+
/**
|
|
24
|
+
* 获取全局配置
|
|
25
|
+
*/
|
|
26
|
+
getGlobalConfig() {
|
|
27
|
+
let result: {
|
|
28
|
+
[P in keyof GlobalConfigOption]: ResultGlobalConfigOption<
|
|
29
|
+
GlobalConfigOption[P]
|
|
30
|
+
>;
|
|
31
|
+
} = {};
|
|
32
|
+
let style =
|
|
33
|
+
GlobalConfig.config.style == null
|
|
34
|
+
? ""
|
|
35
|
+
: typeof GlobalConfig.config.style === "function"
|
|
36
|
+
? GlobalConfig.config.style()
|
|
37
|
+
: GlobalConfig.config.style;
|
|
38
|
+
|
|
39
|
+
if (typeof style === "string") {
|
|
40
|
+
result.style = style;
|
|
41
|
+
}
|
|
42
|
+
let zIndex =
|
|
43
|
+
GlobalConfig.config.zIndex == null
|
|
44
|
+
? ""
|
|
45
|
+
: typeof GlobalConfig.config.zIndex === "function"
|
|
46
|
+
? GlobalConfig.config.zIndex()
|
|
47
|
+
: GlobalConfig.config.zIndex;
|
|
48
|
+
if (typeof zIndex === "string") {
|
|
49
|
+
let newIndex = (zIndex = parseInt(zIndex));
|
|
50
|
+
if (!isNaN(newIndex)) {
|
|
51
|
+
result.zIndex = newIndex;
|
|
52
|
+
}
|
|
53
|
+
} else {
|
|
54
|
+
if (!isNaN(zIndex)) {
|
|
55
|
+
result.zIndex = zIndex;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
return result;
|
|
59
|
+
},
|
|
60
|
+
};
|
package/src/Pops.ts
CHANGED
|
@@ -77,12 +77,13 @@ import type {
|
|
|
77
77
|
import { PopsSearchSuggestion } from "./components/searchSuggestion";
|
|
78
78
|
import { PopsMathFloatUtils } from "./utils/PopsMathUtils";
|
|
79
79
|
import { PanelHandleContentDetails } from "./components/panel/PanelHandleContentDetails";
|
|
80
|
+
import { GlobalConfig } from "./GlobalConfig";
|
|
80
81
|
|
|
81
82
|
class Pops {
|
|
82
83
|
/** 配置 */
|
|
83
84
|
config = {
|
|
84
85
|
/** 版本号 */
|
|
85
|
-
version: "2024.10.
|
|
86
|
+
version: "2024.10.19",
|
|
86
87
|
cssText: {
|
|
87
88
|
/** 主CSS */
|
|
88
89
|
index: indexCSS,
|
|
@@ -230,6 +231,10 @@ class Pops {
|
|
|
230
231
|
isPhone(userAgent = PopsCore.globalThis.navigator.userAgent): boolean {
|
|
231
232
|
return Boolean(/(iPhone|iPad|iPod|iOS|Android)/i.test(userAgent));
|
|
232
233
|
}
|
|
234
|
+
/**
|
|
235
|
+
* 为所有弹窗设置全局属性
|
|
236
|
+
*/
|
|
237
|
+
GlobalConfig = GlobalConfig;
|
|
233
238
|
/**
|
|
234
239
|
* 普通信息框
|
|
235
240
|
* @param details 配置
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -22,6 +23,7 @@ export class PopsAlert {
|
|
|
22
23
|
]);
|
|
23
24
|
|
|
24
25
|
let config: Required<PopsAlertDetails> = PopsAlertConfig();
|
|
26
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
25
27
|
config = popsUtils.assign(config, details);
|
|
26
28
|
let guid = popsUtils.getRandomGUID();
|
|
27
29
|
// 设置当前类型
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -20,6 +21,7 @@ export class PopsConfirm {
|
|
|
20
21
|
pops.config.cssText.confirmCSS,
|
|
21
22
|
]);
|
|
22
23
|
let config: Required<PopsConfirmDetails> = PopsConfirmConfig();
|
|
24
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
23
25
|
config = popsUtils.assign(config, details);
|
|
24
26
|
let guid = popsUtils.getRandomGUID();
|
|
25
27
|
// 设置当前类型
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -20,6 +21,7 @@ export class PopsDrawer {
|
|
|
20
21
|
]);
|
|
21
22
|
|
|
22
23
|
let config: Required<PopsDrawerDetails> = PopsDrawerConfig();
|
|
24
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
23
25
|
config = popsUtils.assign(config, details);
|
|
24
26
|
let guid = popsUtils.getRandomGUID();
|
|
25
27
|
const PopsType = "drawer";
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -22,6 +23,8 @@ export class PopsFolder {
|
|
|
22
23
|
]);
|
|
23
24
|
|
|
24
25
|
let config: Required<PopsFolderDetails> = PopsFolderConfig();
|
|
26
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
27
|
+
config = popsUtils.assign(config, details);
|
|
25
28
|
|
|
26
29
|
/* 办公几件套 */
|
|
27
30
|
(Folder_ICON as any).docx = Folder_ICON.doc;
|
|
@@ -82,7 +85,6 @@ export class PopsFolder {
|
|
|
82
85
|
(Folder_ICON as any)[keyName] = Folder_ICON.apk;
|
|
83
86
|
});
|
|
84
87
|
|
|
85
|
-
config = popsUtils.assign(config, details);
|
|
86
88
|
if (details?.folder) {
|
|
87
89
|
config.folder = details.folder;
|
|
88
90
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -21,6 +22,7 @@ export class PopsIframe {
|
|
|
21
22
|
]);
|
|
22
23
|
|
|
23
24
|
let config: Required<PopsIframeDetails> = PopsIframeConfig();
|
|
25
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
24
26
|
config = popsUtils.assign(config, details);
|
|
25
27
|
if (config.url == null) {
|
|
26
28
|
throw "config.url不能为空";
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -9,6 +10,7 @@ import type { PopsLoadingDetails } from "./indexType";
|
|
|
9
10
|
export class PopsLoading {
|
|
10
11
|
constructor(details: PopsLoadingDetails) {
|
|
11
12
|
let config: Required<PopsLoadingDetails> = PopsLoadingConfig();
|
|
13
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
12
14
|
config = popsUtils.assign(config, details);
|
|
13
15
|
let guid = popsUtils.getRandomGUID();
|
|
14
16
|
const PopsType = "loading";
|
|
@@ -7,6 +7,7 @@ import { popsUtils } from "../../utils/PopsUtils";
|
|
|
7
7
|
import type { PopsPanelDetails } from "./indexType";
|
|
8
8
|
import { PopsPanelConfig } from "./config";
|
|
9
9
|
import { PanelHandleContentDetails } from "./PanelHandleContentDetails";
|
|
10
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
10
11
|
|
|
11
12
|
export class PopsPanel {
|
|
12
13
|
constructor(details: PopsPanelDetails) {
|
|
@@ -22,6 +23,7 @@ export class PopsPanel {
|
|
|
22
23
|
]);
|
|
23
24
|
|
|
24
25
|
let config: Required<PopsPanelDetails> = PopsPanelConfig();
|
|
26
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
25
27
|
config = popsUtils.assign(config, details);
|
|
26
28
|
if (details && Array.isArray(details.content)) {
|
|
27
29
|
config.content = details.content;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsElementHandler } from "../../handler/PopsElementHandler";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
@@ -20,6 +21,7 @@ export class PopsPrompt {
|
|
|
20
21
|
pops.config.cssText.promptCSS,
|
|
21
22
|
]);
|
|
22
23
|
let config: Required<PopsPromptDetails> = PopsPromptConfig();
|
|
24
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
23
25
|
config = popsUtils.assign(config, details);
|
|
24
26
|
let guid = popsUtils.getRandomGUID();
|
|
25
27
|
const PopsType = "prompt";
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { OriginPrototype } from "../../Core";
|
|
2
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
2
3
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
3
4
|
import { pops } from "../../Pops";
|
|
4
5
|
import type { PopsIcon } from "../../types/icon";
|
|
@@ -22,6 +23,7 @@ export class PopsRightClickMenu {
|
|
|
22
23
|
|
|
23
24
|
let config: Required<PopsRightClickMenuDetails> =
|
|
24
25
|
PopsRightClickMenuConfig();
|
|
26
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
25
27
|
config = popsUtils.assign(config, details);
|
|
26
28
|
if (config.target == null) {
|
|
27
29
|
throw "config.target 不能为空";
|
|
@@ -4,6 +4,7 @@ import { popsDOMUtils } from "../../utils/PopsDOMUtils";
|
|
|
4
4
|
import { popsUtils } from "../../utils/PopsUtils";
|
|
5
5
|
import type { PopsSearchSuggestionDetails } from "./indexType";
|
|
6
6
|
import { searchSuggestionConfig as PopsSearchSuggestionConfig } from "./config";
|
|
7
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
7
8
|
|
|
8
9
|
export class PopsSearchSuggestion {
|
|
9
10
|
constructor(details: PopsSearchSuggestionDetails) {
|
|
@@ -16,6 +17,7 @@ export class PopsSearchSuggestion {
|
|
|
16
17
|
|
|
17
18
|
let config: Required<PopsSearchSuggestionDetails> =
|
|
18
19
|
PopsSearchSuggestionConfig();
|
|
20
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
19
21
|
config = popsUtils.assign(config, details);
|
|
20
22
|
if (config.target == null) {
|
|
21
23
|
throw new TypeError("config.target 不能为空");
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { GlobalConfig } from "../../GlobalConfig";
|
|
1
2
|
import { PopsHandler } from "../../handler/PopsHandler";
|
|
2
3
|
import { pops } from "../../Pops";
|
|
3
4
|
import { popsDOMUtils } from "../../utils/PopsDOMUtils";
|
|
@@ -16,6 +17,7 @@ export class PopsTooltip {
|
|
|
16
17
|
]);
|
|
17
18
|
|
|
18
19
|
let config: Required<PopsToolTipDetails> = PopsTooltipConfig();
|
|
20
|
+
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
19
21
|
config = popsUtils.assign(config, details);
|
|
20
22
|
if (!(config.target instanceof HTMLElement)) {
|
|
21
23
|
throw "config.target 必须是HTMLElement类型";
|
package/src/css/index.css
CHANGED
|
@@ -133,3 +133,11 @@ button.pops-header-control i:hover {
|
|
|
133
133
|
.pops[type-value] .pops-header-controls {
|
|
134
134
|
display: flex;
|
|
135
135
|
}
|
|
136
|
+
|
|
137
|
+
/* 标题禁止选中文字 */
|
|
138
|
+
.pops [class^="pops"][class*="-title"] p[pops] {
|
|
139
|
+
-webkit-user-select: none;
|
|
140
|
+
-moz-user-select: none;
|
|
141
|
+
-ms-user-select: none;
|
|
142
|
+
user-select: none;
|
|
143
|
+
}
|
|
@@ -519,7 +519,7 @@ export const PopsInstanceUtils = {
|
|
|
519
519
|
let clickElementTopOffset = 0;
|
|
520
520
|
let AnyTouch = popsUtils.AnyTouch();
|
|
521
521
|
let anyTouchElement = new AnyTouch(options.dragElement, {
|
|
522
|
-
|
|
522
|
+
preventDefault(event: Event) {
|
|
523
523
|
if (typeof options.preventEvent === "function") {
|
|
524
524
|
return options.preventEvent(event as any);
|
|
525
525
|
} else {
|
|
@@ -606,133 +606,123 @@ export const PopsInstanceUtils = {
|
|
|
606
606
|
|
|
607
607
|
let resumeMoveElementStyle: Function | null = null;
|
|
608
608
|
|
|
609
|
-
anyTouchElement.on(
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
// clickElementTopOffset = parseInt(event.nativeEvent.offsetY);
|
|
631
|
-
//} else {
|
|
632
|
-
// clickElementTopOffset = parseInt(event.getOffset().y);
|
|
633
|
-
//}
|
|
634
|
-
resumeMoveElementStyle = changeMoveElementStyle(moveElement);
|
|
635
|
-
}
|
|
609
|
+
anyTouchElement.on("pan", function (event) {
|
|
610
|
+
if (!isMove) {
|
|
611
|
+
isMove = true;
|
|
612
|
+
let rect = options.dragElement.getBoundingClientRect();
|
|
613
|
+
clickElementLeftOffset = event.x - rect.left;
|
|
614
|
+
clickElementTopOffset = event.y - rect.top;
|
|
615
|
+
transformInfo = getTransform(moveElement);
|
|
616
|
+
transformLeft = transformInfo.transformLeft;
|
|
617
|
+
transformTop = transformInfo.transformTop;
|
|
618
|
+
//if (event.nativeEvent.offsetX) {
|
|
619
|
+
// clickElementLeftOffset = parseInt(event.nativeEvent.offsetX);
|
|
620
|
+
//} else {
|
|
621
|
+
// clickElementLeftOffset = parseInt(event.getOffset().x);
|
|
622
|
+
//}
|
|
623
|
+
//if (event.nativeEvent.offsetY) {
|
|
624
|
+
// clickElementTopOffset = parseInt(event.nativeEvent.offsetY);
|
|
625
|
+
//} else {
|
|
626
|
+
// clickElementTopOffset = parseInt(event.getOffset().y);
|
|
627
|
+
//}
|
|
628
|
+
resumeMoveElementStyle = changeMoveElementStyle(moveElement);
|
|
629
|
+
}
|
|
636
630
|
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
if (
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
currentMoveLeftOffset = maxLeftOffset;
|
|
662
|
-
}
|
|
663
|
-
if (currentMoveTopOffset > maxTopOffset) {
|
|
664
|
-
/* 不允许超过容器的最大高度 */
|
|
665
|
-
currentMoveTopOffset = maxTopOffset;
|
|
666
|
-
}
|
|
667
|
-
if (
|
|
668
|
-
currentMoveLeftOffset - options.extraDistance * 2 <
|
|
669
|
-
minLeftOffset + transformLeft
|
|
670
|
-
) {
|
|
671
|
-
/* 不允许left偏移小于容器最小值 */
|
|
672
|
-
currentMoveLeftOffset = minLeftOffset + transformLeft;
|
|
673
|
-
/* 最左边 +额外距离 */
|
|
674
|
-
currentMoveLeftOffset += options.extraDistance;
|
|
675
|
-
} else {
|
|
676
|
-
/* 最右边 -额外距离 */
|
|
677
|
-
currentMoveLeftOffset -= options.extraDistance;
|
|
678
|
-
}
|
|
679
|
-
if (
|
|
680
|
-
currentMoveTopOffset - options.extraDistance * 2 <
|
|
681
|
-
minTopOffset + transformTop
|
|
682
|
-
) {
|
|
683
|
-
/* 不允许top偏移小于容器最小值 */
|
|
684
|
-
currentMoveTopOffset = minTopOffset + transformTop;
|
|
685
|
-
/* 最上面 +额外距离 */
|
|
686
|
-
currentMoveTopOffset += options.extraDistance;
|
|
687
|
-
} else {
|
|
688
|
-
/* 最下面 -额外距离 */
|
|
689
|
-
currentMoveTopOffset -= options.extraDistance;
|
|
690
|
-
}
|
|
631
|
+
/** 当前移动的left偏移 */
|
|
632
|
+
let currentMoveLeftOffset =
|
|
633
|
+
event.x - clickElementLeftOffset + transformLeft;
|
|
634
|
+
/** 当前移动的top偏移 */
|
|
635
|
+
let currentMoveTopOffset = event.y - clickElementTopOffset + transformTop;
|
|
636
|
+
/* 拖拽移动 */
|
|
637
|
+
if (event.phase === "move") {
|
|
638
|
+
if (options.limit) {
|
|
639
|
+
/* 限制在容器内移动 */
|
|
640
|
+
/* left偏移最大值 */
|
|
641
|
+
let maxLeftOffset =
|
|
642
|
+
getContainerWidthOrHeight(options.container!).width -
|
|
643
|
+
popsDOMUtils.width(moveElement) +
|
|
644
|
+
transformLeft;
|
|
645
|
+
let { left: minLeftOffset, top: minTopOffset } =
|
|
646
|
+
getContainerTopOrLeft(options.container!);
|
|
647
|
+
/* top偏移的最大值 */
|
|
648
|
+
let maxTopOffset =
|
|
649
|
+
getContainerWidthOrHeight(options.container!).height -
|
|
650
|
+
popsDOMUtils.height(moveElement) +
|
|
651
|
+
transformTop;
|
|
652
|
+
if (currentMoveLeftOffset > maxLeftOffset) {
|
|
653
|
+
/* 不允许超过容器的最大宽度 */
|
|
654
|
+
currentMoveLeftOffset = maxLeftOffset;
|
|
691
655
|
}
|
|
692
|
-
if (
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
currentMoveLeftOffset,
|
|
696
|
-
currentMoveTopOffset
|
|
697
|
-
);
|
|
656
|
+
if (currentMoveTopOffset > maxTopOffset) {
|
|
657
|
+
/* 不允许超过容器的最大高度 */
|
|
658
|
+
currentMoveTopOffset = maxTopOffset;
|
|
698
659
|
}
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
resumeMoveElementStyle();
|
|
711
|
-
resumeMoveElementStyle = null;
|
|
660
|
+
if (
|
|
661
|
+
currentMoveLeftOffset - options.extraDistance * 2 <
|
|
662
|
+
minLeftOffset + transformLeft
|
|
663
|
+
) {
|
|
664
|
+
/* 不允许left偏移小于容器最小值 */
|
|
665
|
+
currentMoveLeftOffset = minLeftOffset + transformLeft;
|
|
666
|
+
/* 最左边 +额外距离 */
|
|
667
|
+
currentMoveLeftOffset += options.extraDistance;
|
|
668
|
+
} else {
|
|
669
|
+
/* 最右边 -额外距离 */
|
|
670
|
+
currentMoveLeftOffset -= options.extraDistance;
|
|
712
671
|
}
|
|
713
|
-
if (
|
|
714
|
-
options.
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
672
|
+
if (
|
|
673
|
+
currentMoveTopOffset - options.extraDistance * 2 <
|
|
674
|
+
minTopOffset + transformTop
|
|
675
|
+
) {
|
|
676
|
+
/* 不允许top偏移小于容器最小值 */
|
|
677
|
+
currentMoveTopOffset = minTopOffset + transformTop;
|
|
678
|
+
/* 最上面 +额外距离 */
|
|
679
|
+
currentMoveTopOffset += options.extraDistance;
|
|
680
|
+
} else {
|
|
681
|
+
/* 最下面 -额外距离 */
|
|
682
|
+
currentMoveTopOffset -= options.extraDistance;
|
|
719
683
|
}
|
|
720
684
|
}
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
event: PointerEvent & {
|
|
728
|
-
changedPoints: any[];
|
|
685
|
+
if (typeof options.moveCallBack === "function") {
|
|
686
|
+
options.moveCallBack(
|
|
687
|
+
moveElement,
|
|
688
|
+
currentMoveLeftOffset,
|
|
689
|
+
currentMoveTopOffset
|
|
690
|
+
);
|
|
729
691
|
}
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
692
|
+
|
|
693
|
+
popsDOMUtils.css(moveElement, {
|
|
694
|
+
left: currentMoveLeftOffset + "px",
|
|
695
|
+
top: currentMoveTopOffset + "px",
|
|
733
696
|
});
|
|
734
697
|
}
|
|
735
|
-
|
|
698
|
+
|
|
699
|
+
/* 停止拖拽 */
|
|
700
|
+
if (event.phase === "end") {
|
|
701
|
+
isMove = false;
|
|
702
|
+
if (typeof resumeMoveElementStyle === "function") {
|
|
703
|
+
resumeMoveElementStyle();
|
|
704
|
+
resumeMoveElementStyle = null;
|
|
705
|
+
}
|
|
706
|
+
if (typeof options.endCallBack === "function") {
|
|
707
|
+
options.endCallBack(
|
|
708
|
+
moveElement,
|
|
709
|
+
currentMoveLeftOffset,
|
|
710
|
+
currentMoveTopOffset
|
|
711
|
+
);
|
|
712
|
+
}
|
|
713
|
+
}
|
|
714
|
+
});
|
|
715
|
+
/* 因为会覆盖上面的点击事件,主动触发一下 */
|
|
716
|
+
anyTouchElement.on(["tap"], function (event) {
|
|
717
|
+
event.changedPoints.forEach((item) => {
|
|
718
|
+
popsDOMUtils.trigger(
|
|
719
|
+
item.target! as HTMLElement,
|
|
720
|
+
"click",
|
|
721
|
+
void 0,
|
|
722
|
+
true
|
|
723
|
+
);
|
|
724
|
+
});
|
|
725
|
+
});
|
|
736
726
|
},
|
|
737
727
|
/**
|
|
738
728
|
* 排序数组
|
package/src/utils/PopsUtils.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { PopsCore } from "../Core";
|
|
2
2
|
import type { PopsUtilsOwnObject } from "../types/main";
|
|
3
3
|
import { popsDOMUtils } from "./PopsDOMUtils";
|
|
4
|
-
import
|
|
4
|
+
import AnyTouch from "any-touch";
|
|
5
5
|
|
|
6
6
|
class PopsUtils {
|
|
7
7
|
/**
|
|
@@ -370,13 +370,16 @@ class PopsUtils {
|
|
|
370
370
|
break;
|
|
371
371
|
}
|
|
372
372
|
}
|
|
373
|
+
new Date();
|
|
373
374
|
result = result.toFixed(2) as any;
|
|
374
375
|
result = addType
|
|
375
376
|
? result + resultType.toString()
|
|
376
377
|
: (parseFloat(result.toString()) as any);
|
|
377
378
|
return result;
|
|
378
379
|
}
|
|
379
|
-
AnyTouch
|
|
380
|
+
AnyTouch = () => {
|
|
381
|
+
return AnyTouch;
|
|
382
|
+
};
|
|
380
383
|
}
|
|
381
384
|
|
|
382
385
|
const popsUtils = new PopsUtils();
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
export function AnyTouch(): {
|
|
2
|
-
(el: any, options: any): this;
|
|
3
|
-
STATE_POSSIBLE: number;
|
|
4
|
-
STATE_START: number;
|
|
5
|
-
STATE_MOVE: number;
|
|
6
|
-
STATE_END: number;
|
|
7
|
-
STATE_CANCELLED: number;
|
|
8
|
-
STATE_FAILED: number;
|
|
9
|
-
STATE_RECOGNIZED: number;
|
|
10
|
-
tap: (at: any, options: any) => any;
|
|
11
|
-
pan: (at: any, options: any) => any;
|
|
12
|
-
swipe: (at: any, options: any) => any;
|
|
13
|
-
press: (at: any, options: any) => any;
|
|
14
|
-
rotate: (at: any, options: any) => any;
|
|
15
|
-
pinch: (at: any, options: any) => any;
|
|
16
|
-
doubletap: (at: any) => any;
|
|
17
|
-
};
|