sculp-js 1.13.3-beta.0 → 1.13.6
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/cjs/_virtual/_commonjsHelpers.js +3 -3
- package/dist/cjs/array.js +36 -46
- package/dist/cjs/async.js +41 -43
- package/dist/cjs/base64.js +77 -66
- package/dist/cjs/clipboard.js +54 -53
- package/dist/cjs/cloneDeep.js +90 -91
- package/dist/cjs/cookie.js +27 -30
- package/dist/cjs/date.js +101 -98
- package/dist/cjs/dom.js +114 -121
- package/dist/cjs/download.js +77 -78
- package/dist/cjs/easing.js +29 -32
- package/dist/cjs/file.js +147 -152
- package/dist/cjs/func.js +64 -78
- package/dist/cjs/index.js +1 -3
- package/dist/cjs/math.js +32 -38
- package/dist/cjs/node_modules/bezier-easing/src/index.js +35 -23
- package/dist/cjs/number.js +58 -61
- package/dist/cjs/object.js +112 -126
- package/dist/cjs/path.js +39 -43
- package/dist/cjs/qs.js +34 -41
- package/dist/cjs/random.js +31 -34
- package/dist/cjs/string.js +62 -63
- package/dist/cjs/tooltip.js +66 -69
- package/dist/cjs/tree.js +265 -263
- package/dist/cjs/type.js +42 -46
- package/dist/cjs/unique.js +39 -42
- package/dist/cjs/url.js +47 -48
- package/dist/cjs/validator.js +38 -38
- package/dist/cjs/variable.js +27 -21
- package/dist/cjs/watermark.js +78 -67
- package/dist/esm/array.js +36 -46
- package/dist/esm/async.js +41 -43
- package/dist/esm/base64.js +77 -66
- package/dist/esm/clipboard.js +55 -54
- package/dist/esm/cloneDeep.js +90 -91
- package/dist/esm/cookie.js +27 -30
- package/dist/esm/date.js +101 -98
- package/dist/esm/dom.js +114 -121
- package/dist/esm/download.js +78 -79
- package/dist/esm/easing.js +29 -32
- package/dist/esm/file.js +147 -152
- package/dist/esm/func.js +64 -78
- package/dist/esm/index.js +96 -8
- package/dist/esm/math.js +32 -38
- package/dist/esm/number.js +58 -61
- package/dist/esm/object.js +124 -127
- package/dist/esm/path.js +39 -43
- package/dist/esm/qs.js +34 -41
- package/dist/esm/random.js +31 -34
- package/dist/esm/string.js +74 -64
- package/dist/esm/tooltip.js +66 -69
- package/dist/esm/tree.js +265 -263
- package/dist/esm/type.js +68 -47
- package/dist/esm/unique.js +39 -42
- package/dist/esm/url.js +47 -48
- package/dist/esm/validator.js +56 -39
- package/dist/esm/variable.js +27 -21
- package/dist/esm/watermark.js +79 -68
- package/dist/types/array.d.ts +0 -1
- package/dist/types/async.d.ts +0 -1
- package/dist/types/base64.d.ts +0 -1
- package/dist/types/clipboard.d.ts +0 -1
- package/dist/types/cloneDeep.d.ts +0 -1
- package/dist/types/cookie.d.ts +0 -1
- package/dist/types/date.d.ts +0 -1
- package/dist/types/dom.d.ts +0 -1
- package/dist/types/download.d.ts +0 -1
- package/dist/types/easing.d.ts +0 -1
- package/dist/types/file.d.ts +0 -1
- package/dist/types/func.d.ts +0 -1
- package/dist/types/index.d.ts +0 -1
- package/dist/types/math.d.ts +0 -1
- package/dist/types/number.d.ts +0 -1
- package/dist/types/object.d.ts +0 -1
- package/dist/types/path.d.ts +0 -1
- package/dist/types/qs.d.ts +0 -1
- package/dist/types/random.d.ts +0 -1
- package/dist/types/string.d.ts +0 -1
- package/dist/types/tooltip.d.ts +0 -1
- package/dist/types/tree.d.ts +2 -2
- package/dist/types/type.d.ts +0 -1
- package/dist/types/unique.d.ts +0 -1
- package/dist/types/url.d.ts +0 -1
- package/dist/types/validator.d.ts +0 -1
- package/dist/types/variable.d.ts +0 -1
- package/dist/types/watermark.d.ts +0 -1
- package/dist/umd/index.min.js +2 -2
- package/package.json +12 -6
- package/dist/types/array.d.ts.map +0 -1
- package/dist/types/async.d.ts.map +0 -1
- package/dist/types/base64.d.ts.map +0 -1
- package/dist/types/clipboard.d.ts.map +0 -1
- package/dist/types/cloneDeep.d.ts.map +0 -1
- package/dist/types/cookie.d.ts.map +0 -1
- package/dist/types/core-index.d.ts +0 -17
- package/dist/types/core-index.d.ts.map +0 -1
- package/dist/types/date.d.ts.map +0 -1
- package/dist/types/dom.d.ts.map +0 -1
- package/dist/types/download.d.ts.map +0 -1
- package/dist/types/easing.d.ts.map +0 -1
- package/dist/types/file.d.ts.map +0 -1
- package/dist/types/func.d.ts.map +0 -1
- package/dist/types/index.d.ts.map +0 -1
- package/dist/types/index.js +0 -3278
- package/dist/types/math.d.ts.map +0 -1
- package/dist/types/number.d.ts.map +0 -1
- package/dist/types/object.d.ts.map +0 -1
- package/dist/types/path.d.ts.map +0 -1
- package/dist/types/qs.d.ts.map +0 -1
- package/dist/types/random.d.ts.map +0 -1
- package/dist/types/string.d.ts.map +0 -1
- package/dist/types/tooltip.d.ts.map +0 -1
- package/dist/types/tree.d.ts.map +0 -1
- package/dist/types/type.d.ts.map +0 -1
- package/dist/types/unique.d.ts.map +0 -1
- package/dist/types/url.d.ts.map +0 -1
- package/dist/types/validator.d.ts.map +0 -1
- package/dist/types/variable.d.ts.map +0 -1
- package/dist/types/watermark.d.ts.map +0 -1
package/dist/cjs/qs.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* sculp-js v1.13.
|
|
2
|
+
* sculp-js v1.13.6
|
|
3
3
|
* (c) 2023-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -15,30 +15,26 @@ var type = require('./type.js');
|
|
|
15
15
|
* @returns {Params}
|
|
16
16
|
*/
|
|
17
17
|
function qsParse(queryString) {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
}
|
|
25
|
-
if (type.isArray(result[key])) {
|
|
26
|
-
continue;
|
|
27
|
-
}
|
|
28
|
-
result[key] = params.getAll(key);
|
|
18
|
+
const params = new URLSearchParams(queryString);
|
|
19
|
+
const result = {};
|
|
20
|
+
for (const [key, val] of params.entries()) {
|
|
21
|
+
if (type.isUndefined(result[key])) {
|
|
22
|
+
result[key] = val;
|
|
23
|
+
continue;
|
|
29
24
|
}
|
|
30
|
-
|
|
25
|
+
if (type.isArray(result[key])) {
|
|
26
|
+
continue;
|
|
27
|
+
}
|
|
28
|
+
result[key] = params.getAll(key);
|
|
29
|
+
}
|
|
30
|
+
return result;
|
|
31
31
|
}
|
|
32
|
-
const defaultReplacer =
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
return val ? 'true' : 'false';
|
|
39
|
-
if (type.isDate(val))
|
|
40
|
-
return val.toISOString();
|
|
41
|
-
return null;
|
|
32
|
+
const defaultReplacer = val => {
|
|
33
|
+
if (type.isString(val)) return val;
|
|
34
|
+
if (type.isNumber(val)) return String(val);
|
|
35
|
+
if (type.isBoolean(val)) return val ? 'true' : 'false';
|
|
36
|
+
if (type.isDate(val)) return val.toISOString();
|
|
37
|
+
return null;
|
|
42
38
|
};
|
|
43
39
|
/**
|
|
44
40
|
* 字符化查询对象,内部使用的是浏览器内置的 URLSearchParams 进行处理
|
|
@@ -47,24 +43,21 @@ const defaultReplacer = (val) => {
|
|
|
47
43
|
* @returns {string}
|
|
48
44
|
*/
|
|
49
45
|
function qsStringify(query, replacer = defaultReplacer) {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
return params.toString();
|
|
46
|
+
const params = new URLSearchParams();
|
|
47
|
+
object.objectEach(query, (val, key) => {
|
|
48
|
+
if (type.isArray(val)) {
|
|
49
|
+
val.forEach(i => {
|
|
50
|
+
const replaced = replacer(i);
|
|
51
|
+
if (replaced === null) return;
|
|
52
|
+
params.append(key.toString(), replaced);
|
|
53
|
+
});
|
|
54
|
+
} else {
|
|
55
|
+
const replaced = replacer(val);
|
|
56
|
+
if (replaced === null) return;
|
|
57
|
+
params.set(key.toString(), replaced);
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
return params.toString();
|
|
68
61
|
}
|
|
69
62
|
|
|
70
63
|
exports.qsParse = qsParse;
|
package/dist/cjs/random.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* sculp-js v1.13.
|
|
2
|
+
* sculp-js v1.13.6
|
|
3
3
|
* (c) 2023-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -24,46 +24,43 @@ const STRING_POOL = `${string.STRING_ARABIC_NUMERALS}${string.STRING_UPPERCASE_A
|
|
|
24
24
|
* @returns {string}
|
|
25
25
|
*/
|
|
26
26
|
const randomString = (length, pool) => {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
result += _pool[index];
|
|
48
|
-
}
|
|
49
|
-
return result;
|
|
27
|
+
let _length = 0;
|
|
28
|
+
let _pool = STRING_POOL;
|
|
29
|
+
if (type.isString(pool)) {
|
|
30
|
+
_length = length;
|
|
31
|
+
_pool = pool;
|
|
32
|
+
} else if (type.isNumber(length)) {
|
|
33
|
+
_length = length;
|
|
34
|
+
} else if (type.isString(length)) {
|
|
35
|
+
_pool = length;
|
|
36
|
+
}
|
|
37
|
+
let times = Math.max(_length, 1);
|
|
38
|
+
let result = '';
|
|
39
|
+
const min = 0;
|
|
40
|
+
const max = _pool.length - 1;
|
|
41
|
+
if (max < 2) throw new Error('字符串池长度不能少于 2');
|
|
42
|
+
while (times--) {
|
|
43
|
+
const index = randomNumber(min, max);
|
|
44
|
+
result += _pool[index];
|
|
45
|
+
}
|
|
46
|
+
return result;
|
|
50
47
|
};
|
|
51
48
|
/**
|
|
52
49
|
* 优先浏览器原生能力获取 UUID v4
|
|
53
50
|
* @returns {string}
|
|
54
51
|
*/
|
|
55
52
|
function randomUuid() {
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}
|
|
64
|
-
return str;
|
|
53
|
+
if (typeof URL === 'undefined' || !URL.createObjectURL || typeof Blob === 'undefined') {
|
|
54
|
+
const hex = '0123456789abcdef';
|
|
55
|
+
const model = 'xxxxxxxx-xxxx-4xxx-xxxx-xxxxxxxxxxxx';
|
|
56
|
+
let str = '';
|
|
57
|
+
for (let i = 0; i < model.length; i++) {
|
|
58
|
+
const rnd = randomNumber(0, 15);
|
|
59
|
+
str += model[i] == '-' || model[i] == '4' ? model[i] : hex[rnd];
|
|
65
60
|
}
|
|
66
|
-
return
|
|
61
|
+
return str;
|
|
62
|
+
}
|
|
63
|
+
return /[^/]+$/.exec(URL.createObjectURL(new Blob()).slice())[0];
|
|
67
64
|
}
|
|
68
65
|
|
|
69
66
|
exports.STRING_POOL = STRING_POOL;
|
package/dist/cjs/string.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* sculp-js v1.13.
|
|
2
|
+
* sculp-js v1.13.6
|
|
3
3
|
* (c) 2023-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -13,12 +13,12 @@
|
|
|
13
13
|
* @returns {string}
|
|
14
14
|
*/
|
|
15
15
|
function stringCamelCase(string, bigger) {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
16
|
+
let string2 = string;
|
|
17
|
+
if (bigger) {
|
|
18
|
+
string2 = string.replace(/^./, origin => origin.toUpperCase());
|
|
19
|
+
}
|
|
20
|
+
const HUMP_RE = /[\s_-](.)/g;
|
|
21
|
+
return string2.replace(HUMP_RE, (orign, char) => char.toUpperCase());
|
|
22
22
|
}
|
|
23
23
|
/**
|
|
24
24
|
* 将字符串转换为连字格式
|
|
@@ -27,8 +27,8 @@ function stringCamelCase(string, bigger) {
|
|
|
27
27
|
* @returns {string}
|
|
28
28
|
*/
|
|
29
29
|
function stringKebabCase(string, separator = '-') {
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
const string2 = string.replace(/^./, origin => origin.toLowerCase());
|
|
31
|
+
return string2.replace(/[A-Z]/g, origin => `${separator}${origin.toLowerCase()}`);
|
|
32
32
|
}
|
|
33
33
|
const STRING_ARABIC_NUMERALS = '0123456789';
|
|
34
34
|
const STRING_LOWERCASE_ALPHA = 'abcdefghijklmnopqrstuvwxyz';
|
|
@@ -46,36 +46,37 @@ const placeholderRE = /%[%sdo]/g;
|
|
|
46
46
|
* @returns {string}
|
|
47
47
|
*/
|
|
48
48
|
function stringFormat(string, ...args) {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
49
|
+
let index = 0;
|
|
50
|
+
const result = string.replace(placeholderRE, origin => {
|
|
51
|
+
const arg = args[index++];
|
|
52
|
+
switch (origin) {
|
|
53
|
+
case '%%':
|
|
54
|
+
index--;
|
|
55
|
+
return '%';
|
|
56
|
+
default:
|
|
57
|
+
case '%s':
|
|
58
|
+
return String(arg);
|
|
59
|
+
case '%d':
|
|
60
|
+
return String(Number(arg));
|
|
61
|
+
case '%o':
|
|
62
|
+
return JSON.stringify(arg);
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
return [result, ...args.splice(index).map(String)].join(' ');
|
|
66
66
|
}
|
|
67
67
|
const ev = (expression, data) => {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
}
|
|
68
|
+
try {
|
|
69
|
+
// eslint-disable-next-line @typescript-eslint/no-implied-eval,@typescript-eslint/no-unsafe-return
|
|
70
|
+
return new Function(
|
|
71
|
+
'with(arguments[0]){' +
|
|
72
|
+
/****/ `if(arguments[0].${expression} === undefined)throw "";` +
|
|
73
|
+
/****/
|
|
74
|
+
/****/ `return String(arguments[0].${expression})` +
|
|
75
|
+
'}'
|
|
76
|
+
)(data);
|
|
77
|
+
} catch (err) {
|
|
78
|
+
throw new SyntaxError(`无法执行表达式:${expression}`);
|
|
79
|
+
}
|
|
79
80
|
};
|
|
80
81
|
const templateRE = /\${(.*?)}/g;
|
|
81
82
|
/**
|
|
@@ -90,7 +91,7 @@ const templateRE = /\${(.*?)}/g;
|
|
|
90
91
|
* @returns {string}
|
|
91
92
|
*/
|
|
92
93
|
const stringAssign = (template, data) => {
|
|
93
|
-
|
|
94
|
+
return template.replace(templateRE, (origin, expression) => ev(expression, data));
|
|
94
95
|
};
|
|
95
96
|
/**
|
|
96
97
|
* 字符串编码 HTML
|
|
@@ -102,18 +103,18 @@ const stringAssign = (template, data) => {
|
|
|
102
103
|
* @param {string} html
|
|
103
104
|
* @returns {string}
|
|
104
105
|
*/
|
|
105
|
-
const stringEscapeHtml =
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
106
|
+
const stringEscapeHtml = html => {
|
|
107
|
+
const htmlCharRE = /[&<>"]/g;
|
|
108
|
+
const htmlCharReplacements = {
|
|
109
|
+
'&': '&',
|
|
110
|
+
'<': '<',
|
|
111
|
+
'>': '>',
|
|
112
|
+
'"': '"'
|
|
113
|
+
};
|
|
114
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
115
|
+
// @ts-ignore
|
|
116
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
|
|
117
|
+
return html.replace(htmlCharRE, $0 => htmlCharReplacements[$0]);
|
|
117
118
|
};
|
|
118
119
|
/**
|
|
119
120
|
* 字符串填充
|
|
@@ -128,19 +129,17 @@ const stringFill = (length, value = ' ') => new Array(length).fill(value).join('
|
|
|
128
129
|
* @returns {Record<string, string | string[]>}
|
|
129
130
|
*/
|
|
130
131
|
function parseQueryParams(searchStr = location.search) {
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
});
|
|
143
|
-
return queryObj;
|
|
132
|
+
const queryObj = {};
|
|
133
|
+
Array.from(searchStr.matchAll(/[&?]?([^=&]+)=?([^=&]*)/g)).forEach((item, i) => {
|
|
134
|
+
if (!queryObj[item[1]]) {
|
|
135
|
+
queryObj[item[1]] = item[2];
|
|
136
|
+
} else if (typeof queryObj[item[1]] === 'string') {
|
|
137
|
+
queryObj[item[1]] = [queryObj[item[1]], item[2]];
|
|
138
|
+
} else {
|
|
139
|
+
queryObj[item[1]].push(item[2]);
|
|
140
|
+
}
|
|
141
|
+
});
|
|
142
|
+
return queryObj;
|
|
144
143
|
}
|
|
145
144
|
|
|
146
145
|
exports.STRING_ARABIC_NUMERALS = STRING_ARABIC_NUMERALS;
|
package/dist/cjs/tooltip.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* sculp-js v1.13.
|
|
2
|
+
* sculp-js v1.13.6
|
|
3
3
|
* (c) 2023-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -26,19 +26,19 @@ var type = require('./type.js');
|
|
|
26
26
|
* @returns {*}
|
|
27
27
|
*/
|
|
28
28
|
function handleMouseEnter({ rootContainer = '#root', title, event, bgColor = '#000', color = '#fff' }) {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
29
|
+
try {
|
|
30
|
+
const $rootEl = type.isString(rootContainer) ? document.querySelector(rootContainer) : rootContainer;
|
|
31
|
+
if (!$rootEl) {
|
|
32
|
+
throw new Error(`${rootContainer} is not valid Html Element or element selector`);
|
|
33
|
+
}
|
|
34
|
+
let $customTitle = null;
|
|
35
|
+
const styleId = 'style-tooltip-inner1494304949567';
|
|
36
|
+
// 动态创建class样式,并加入到head中
|
|
37
|
+
if (!document.querySelector(`#${styleId}`)) {
|
|
38
|
+
const tooltipWrapperClass = document.createElement('style');
|
|
39
|
+
tooltipWrapperClass.type = 'text/css';
|
|
40
|
+
tooltipWrapperClass.id = styleId;
|
|
41
|
+
tooltipWrapperClass.innerHTML = `
|
|
42
42
|
.tooltip-inner1494304949567 {
|
|
43
43
|
max-width: 250px;
|
|
44
44
|
padding: 3px 8px;
|
|
@@ -49,30 +49,28 @@ function handleMouseEnter({ rootContainer = '#root', title, event, bgColor = '#0
|
|
|
49
49
|
background-color: ${bgColor};
|
|
50
50
|
}
|
|
51
51
|
`;
|
|
52
|
-
|
|
53
|
-
}
|
|
54
|
-
$customTitle = document.querySelector('#customTitle1494304949567');
|
|
55
|
-
if ($customTitle) {
|
|
56
|
-
mouseenter($customTitle, title, event);
|
|
57
|
-
}
|
|
58
|
-
else {
|
|
59
|
-
const $contentContainer = document.createElement('div');
|
|
60
|
-
$contentContainer.id = 'customTitle1494304949567';
|
|
61
|
-
$contentContainer.style.cssText = 'z-index: 99999999; visibility: hidden; position: absolute;';
|
|
62
|
-
$contentContainer.innerHTML =
|
|
63
|
-
'<div class="tooltip-inner1494304949567" style="word-wrap: break-word; max-width: 44px;">皮肤</div>';
|
|
64
|
-
$rootEl.appendChild($contentContainer);
|
|
65
|
-
$customTitle = document.querySelector('#customTitle1494304949567');
|
|
66
|
-
if (title) {
|
|
67
|
-
//判断div显示的内容是否为空
|
|
68
|
-
mouseenter($customTitle, title, event);
|
|
69
|
-
$customTitle.style.visibility = 'visible';
|
|
70
|
-
}
|
|
71
|
-
}
|
|
52
|
+
document.querySelector('head').appendChild(tooltipWrapperClass);
|
|
72
53
|
}
|
|
73
|
-
|
|
74
|
-
|
|
54
|
+
$customTitle = document.querySelector('#customTitle1494304949567');
|
|
55
|
+
if ($customTitle) {
|
|
56
|
+
mouseenter($customTitle, title, event);
|
|
57
|
+
} else {
|
|
58
|
+
const $contentContainer = document.createElement('div');
|
|
59
|
+
$contentContainer.id = 'customTitle1494304949567';
|
|
60
|
+
$contentContainer.style.cssText = 'z-index: 99999999; visibility: hidden; position: absolute;';
|
|
61
|
+
$contentContainer.innerHTML =
|
|
62
|
+
'<div class="tooltip-inner1494304949567" style="word-wrap: break-word; max-width: 44px;">皮肤</div>';
|
|
63
|
+
$rootEl.appendChild($contentContainer);
|
|
64
|
+
$customTitle = document.querySelector('#customTitle1494304949567');
|
|
65
|
+
if (title) {
|
|
66
|
+
//判断div显示的内容是否为空
|
|
67
|
+
mouseenter($customTitle, title, event);
|
|
68
|
+
$customTitle.style.visibility = 'visible';
|
|
69
|
+
}
|
|
75
70
|
}
|
|
71
|
+
} catch (e) {
|
|
72
|
+
console.error(e.message);
|
|
73
|
+
}
|
|
76
74
|
}
|
|
77
75
|
/**
|
|
78
76
|
* 提示文案dom渲染的处理函数
|
|
@@ -82,32 +80,31 @@ function handleMouseEnter({ rootContainer = '#root', title, event, bgColor = '#0
|
|
|
82
80
|
* @returns {*}
|
|
83
81
|
*/
|
|
84
82
|
function mouseenter($customTitle, title, e) {
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}
|
|
83
|
+
let diffValueX = 200 + 50; //默认设置弹出div的宽度为250px
|
|
84
|
+
let x = 13;
|
|
85
|
+
const y = 23;
|
|
86
|
+
const $contentEle = $customTitle.children[0];
|
|
87
|
+
if (dom.getStrWidthPx(title, 12) < 180 + 50) {
|
|
88
|
+
//【弹出div自适应字符串宽度】若显示的字符串占用宽度小于180,则设置弹出div的宽度为“符串占用宽度”+20
|
|
89
|
+
$contentEle.style.maxWidth = dom.getStrWidthPx(title, 12) + 20 + 50 + 'px';
|
|
90
|
+
diffValueX = e.clientX + (dom.getStrWidthPx(title, 12) + 50) - document.body.offsetWidth;
|
|
91
|
+
} else {
|
|
92
|
+
$contentEle.style.maxWidth = '250px';
|
|
93
|
+
diffValueX = e.clientX + 230 - document.body.offsetWidth; //计算div水平方向显示的内容超出屏幕多少宽度
|
|
94
|
+
}
|
|
95
|
+
$contentEle.innerHTML = title; //html方法可解析内容中换行标签,text方法不能
|
|
96
|
+
if (diffValueX > 0) {
|
|
97
|
+
//水平方向超出可见区域时
|
|
98
|
+
x -= diffValueX;
|
|
99
|
+
}
|
|
100
|
+
$customTitle.style.top = e.clientY + y + 'px';
|
|
101
|
+
$customTitle.style.left = e.clientX + x + 'px';
|
|
102
|
+
$customTitle.style.maxWidth = '250px';
|
|
103
|
+
const diffValueY = $customTitle.getBoundingClientRect().top + $contentEle.offsetHeight - document.body.offsetHeight;
|
|
104
|
+
if (diffValueY > 0) {
|
|
105
|
+
//垂直方向超出可见区域时
|
|
106
|
+
$customTitle.style.top = e.clientY - diffValueY + 'px';
|
|
107
|
+
}
|
|
111
108
|
}
|
|
112
109
|
/**
|
|
113
110
|
* 移除提示文案dom的事件句柄
|
|
@@ -115,13 +112,13 @@ function mouseenter($customTitle, title, e) {
|
|
|
115
112
|
* @returns {*}
|
|
116
113
|
*/
|
|
117
114
|
function handleMouseLeave(rootContainer = '#root') {
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
115
|
+
const rootEl = type.isString(rootContainer) ? document.querySelector(rootContainer) : rootContainer;
|
|
116
|
+
let titleEl = document.querySelector('#customTitle1494304949567');
|
|
117
|
+
if (rootEl && titleEl) {
|
|
118
|
+
rootEl.removeChild(titleEl);
|
|
119
|
+
// @ts-ignore
|
|
120
|
+
titleEl = null;
|
|
121
|
+
}
|
|
125
122
|
}
|
|
126
123
|
const tooltipEvent = { handleMouseEnter, handleMouseLeave };
|
|
127
124
|
|