xctc-utils 1.6.68 → 1.6.70
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/canvas/index.js +202 -216
- package/dist/crypto/index.js +20 -16
- package/dist/event/changed.js +13 -13
- package/dist/event/drop.js +6 -6
- package/dist/event/index.js +5 -5
- package/dist/event/mouse-down.js +6 -6
- package/dist/event/mouse-move.js +6 -6
- package/dist/event/mouse-up.js +8 -8
- package/dist/event/mouse-wheel.js +2 -2
- package/dist/format/index.js +1 -1
- package/dist/handle/create.js +84 -60
- package/dist/handle/index.js +9 -9
- package/dist/handle/query.js +22 -22
- package/dist/handle/register.js +3 -3
- package/dist/handle/update.js +17 -17
- package/dist/iframe/index.js +30 -30
- package/dist/index.js +29 -24
- package/dist/is/has.js +2 -2
- package/dist/is/index.js +4 -4
- package/dist/modal/index.js +32 -23
- package/dist/params/index.js +59 -59
- package/dist/storage/index.js +4 -4
- package/dist/test.js +3 -3
- package/dist/time/index.js +32 -32
- package/dist/update/index.d.ts +1 -0
- package/dist/update/index.js +48 -0
- package/dist/utils.js +29 -29
- package/dist/weixin/index.d.ts +1 -0
- package/dist/weixin/index.js +109 -106
- package/package.json +3 -2
- package/tsconfig.json +1 -1
package/dist/crypto/index.js
CHANGED
|
@@ -1,16 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
2
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
6
|
exports.decrypt = exports.encrypt = exports.cryptojs = exports.loadCryptoJs = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
const utils_1 = require("../utils");
|
|
8
|
+
const utils_2 = require("../utils");
|
|
9
|
+
const crypto_js_1 = __importDefault(require("crypto-js"));
|
|
10
|
+
let cryptoUrl = "https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js";
|
|
11
|
+
let cryptoJsSource = crypto_js_1.default;
|
|
12
|
+
const loadCryptoJs = (url, callback) => {
|
|
13
|
+
const win = window;
|
|
10
14
|
if (url) {
|
|
11
15
|
cryptoUrl = url;
|
|
12
16
|
}
|
|
13
|
-
(0, utils_2.loadScript)(cryptoUrl,
|
|
17
|
+
(0, utils_2.loadScript)(cryptoUrl, () => {
|
|
14
18
|
cryptoJsSource = (win === null || win === void 0 ? void 0 : win.CryptoJS) || "";
|
|
15
19
|
if (typeof callback === "function") {
|
|
16
20
|
callback();
|
|
@@ -19,7 +23,7 @@ var loadCryptoJs = function (url, callback) {
|
|
|
19
23
|
};
|
|
20
24
|
exports.loadCryptoJs = loadCryptoJs;
|
|
21
25
|
function formatVal(val) {
|
|
22
|
-
|
|
26
|
+
let key = "5uMz4R8r0926DkC8";
|
|
23
27
|
if (val)
|
|
24
28
|
key = val;
|
|
25
29
|
return cryptoJsSource.enc.Utf8.parse(key);
|
|
@@ -36,12 +40,12 @@ function encrypt(word, key, iv) {
|
|
|
36
40
|
}
|
|
37
41
|
// key //十六位十六进制数作为密钥
|
|
38
42
|
// iv 十六位十六进制数作为密钥偏移量
|
|
39
|
-
|
|
43
|
+
const src = cryptoJsSource.enc.Utf8.parse(word);
|
|
40
44
|
key = formatVal(key);
|
|
41
45
|
iv = formatVal(iv);
|
|
42
|
-
|
|
46
|
+
let encryptedData = "";
|
|
43
47
|
try {
|
|
44
|
-
|
|
48
|
+
const encrypted = cryptoJsSource.AES.encrypt(src, key, { iv, mode: cryptoJsSource.mode.CBC, padding: cryptoJsSource.pad.Pkcs7 });
|
|
45
49
|
encryptedData = encrypted.ciphertext.toString().toUpperCase();
|
|
46
50
|
}
|
|
47
51
|
catch (error) {
|
|
@@ -59,12 +63,12 @@ function decrypt(word, key, iv) {
|
|
|
59
63
|
}
|
|
60
64
|
key = formatVal(key);
|
|
61
65
|
iv = formatVal(iv);
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
66
|
+
const encryptedHexStr = cryptoJsSource.enc.Hex.parse(word);
|
|
67
|
+
const src = cryptoJsSource.enc.Base64.stringify(encryptedHexStr);
|
|
68
|
+
let decryptedData = "";
|
|
65
69
|
try {
|
|
66
|
-
|
|
67
|
-
|
|
70
|
+
const decrypt = cryptoJsSource.AES.decrypt(src, key, { iv, mode: cryptoJsSource.mode.CBC, padding: cryptoJsSource.pad.Pkcs7 });
|
|
71
|
+
const decryptedStr = decrypt.toString(cryptoJsSource.enc.Utf8);
|
|
68
72
|
decryptedData = decryptedStr.toString();
|
|
69
73
|
}
|
|
70
74
|
catch (error) {
|
package/dist/event/changed.js
CHANGED
|
@@ -2,18 +2,18 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.xx = exports.ResetElementSizeFn = exports.PreviousStepFn = void 0;
|
|
4
4
|
function PreviousStepFn() {
|
|
5
|
-
|
|
5
|
+
const _ = this;
|
|
6
6
|
if (!_.canvasDataSource) {
|
|
7
7
|
return;
|
|
8
8
|
}
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
const list = _.canvasCreateElementsDataSource;
|
|
10
|
+
const len = list.length;
|
|
11
11
|
if (len) {
|
|
12
|
-
|
|
13
|
-
if (
|
|
14
|
-
_.canvasDataSource.remove(
|
|
12
|
+
const targetElement = list[len - 1];
|
|
13
|
+
if (targetElement) {
|
|
14
|
+
_.canvasDataSource.remove(targetElement);
|
|
15
15
|
_.canvasCreateElementsDataSource.splice(len - 1, 1);
|
|
16
|
-
|
|
16
|
+
const index = _.canvasCreateTargetElementsDataSource.findIndex((citem) => citem.id == targetElement.id);
|
|
17
17
|
if (index >= 0) {
|
|
18
18
|
_.canvasCreateTargetElementsDataSource.splice(index, 1);
|
|
19
19
|
}
|
|
@@ -24,15 +24,15 @@ function PreviousStepFn() {
|
|
|
24
24
|
exports.PreviousStepFn = PreviousStepFn;
|
|
25
25
|
function ResetElementSizeFn() {
|
|
26
26
|
var _a;
|
|
27
|
-
|
|
27
|
+
const _ = this;
|
|
28
28
|
if (!_.canvasDataSource) {
|
|
29
29
|
return;
|
|
30
30
|
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
const { actions = "" } = _.canvasConfig;
|
|
32
|
+
const backgroundImage = ((_a = _.canvasDataSource) === null || _a === void 0 ? void 0 : _a.backgroundImage) || "";
|
|
33
|
+
const zoomValue = (actions === null || actions === void 0 ? void 0 : actions.zoom) || 1;
|
|
34
|
+
let scaleX = (backgroundImage === null || backgroundImage === void 0 ? void 0 : backgroundImage.scaleX) || 1;
|
|
35
|
+
let scaleY = (backgroundImage === null || backgroundImage === void 0 ? void 0 : backgroundImage.scaleY) || 1;
|
|
36
36
|
if (zoomValue != 1) {
|
|
37
37
|
// _.canvasDataSource.zoom = zoomValue
|
|
38
38
|
scaleX = scaleX * zoomValue;
|
package/dist/event/drop.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.DragCreateElementDataFn = exports.RegisterMouseDropEventFn = void 0;
|
|
4
|
-
|
|
4
|
+
const is_1 = require("../is");
|
|
5
5
|
function RegisterMouseDropEventFn(options) {
|
|
6
6
|
if (!(0, is_1.isObject)(options)) {
|
|
7
7
|
return;
|
|
8
8
|
}
|
|
9
9
|
console.log("registerMouseDropEventFn");
|
|
10
|
-
|
|
10
|
+
const _ = this;
|
|
11
11
|
// 画布元素距离浏览器左侧和顶部的距离
|
|
12
|
-
|
|
12
|
+
let offset = {
|
|
13
13
|
left: _.canvasDataSource.getSelectionElement().getBoundingClientRect().left,
|
|
14
14
|
top: _.canvasDataSource.getSelectionElement().getBoundingClientRect().top
|
|
15
15
|
};
|
|
16
16
|
// 鼠标坐标转换成画布的坐标(未经过缩放和平移的坐标)
|
|
17
|
-
|
|
17
|
+
let point = {
|
|
18
18
|
x: options.e.x - offset.left,
|
|
19
19
|
y: options.e.y - offset.top,
|
|
20
20
|
};
|
|
21
21
|
// 转换后的坐标,restorePointerVpt 不受视窗变换的影响
|
|
22
|
-
|
|
22
|
+
let pointerVpt = _.canvasDataSource.restorePointerVpt(point);
|
|
23
23
|
//创建元素
|
|
24
24
|
_.mousePointerDataSource = pointerVpt;
|
|
25
25
|
_.createDragElementFn();
|
|
@@ -32,7 +32,7 @@ function DragCreateElementDataFn(data) {
|
|
|
32
32
|
if (!(0, is_1.isObject)(data)) {
|
|
33
33
|
return;
|
|
34
34
|
}
|
|
35
|
-
|
|
35
|
+
const _ = this;
|
|
36
36
|
if (!_.canvasDataSource) {
|
|
37
37
|
return;
|
|
38
38
|
}
|
package/dist/event/index.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.checkMouseInElement = void 0;
|
|
4
|
-
|
|
4
|
+
const win = window || {};
|
|
5
5
|
function checkMouseInElement(element) {
|
|
6
6
|
return function (event) {
|
|
7
7
|
// 获取鼠标相对于文档的位置
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
const mouseX = event === null || event === void 0 ? void 0 : event.clientX;
|
|
9
|
+
const mouseY = event === null || event === void 0 ? void 0 : event.clientY;
|
|
10
10
|
// 获取目标元素的位置和尺寸
|
|
11
|
-
|
|
11
|
+
const rect = element === null || element === void 0 ? void 0 : element.getBoundingClientRect();
|
|
12
12
|
// 判断鼠标是否在元素内
|
|
13
|
-
|
|
13
|
+
const isInElement = (mouseX >= (rect === null || rect === void 0 ? void 0 : rect.left) &&
|
|
14
14
|
mouseX <= (rect === null || rect === void 0 ? void 0 : rect.right) &&
|
|
15
15
|
mouseY >= (rect === null || rect === void 0 ? void 0 : rect.top) &&
|
|
16
16
|
mouseY <= (rect === null || rect === void 0 ? void 0 : rect.bottom));
|
package/dist/event/mouse-down.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.RegisterMouseDownEventFn = void 0;
|
|
4
|
-
|
|
4
|
+
const is_1 = require("../is");
|
|
5
5
|
function RegisterMouseDownEventFn(options) {
|
|
6
6
|
if (!(0, is_1.isObject)(options)) {
|
|
7
7
|
return;
|
|
8
8
|
}
|
|
9
|
-
|
|
9
|
+
const _ = this;
|
|
10
10
|
_.mouseCanvasInRangeStatus = true;
|
|
11
11
|
_.mouseWheelPointerDataSource = options;
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
const event = options.e;
|
|
13
|
+
const activeTarget = options.target || options.activeTarget;
|
|
14
14
|
console.log("activeTarget==", activeTarget);
|
|
15
15
|
_.mouseDragStatus = false;
|
|
16
16
|
_.mouseWheelStatus = false;
|
|
@@ -39,7 +39,7 @@ function RegisterMouseDownEventFn(options) {
|
|
|
39
39
|
if (_.canvasSelectionStatus) {
|
|
40
40
|
console.log("自定义绘制选择框选状态--开始绘制");
|
|
41
41
|
_.createSelectionStatus = 1;
|
|
42
|
-
|
|
42
|
+
let pointer = _.canvasDataSource.getPointer(options.e);
|
|
43
43
|
_.mousePointerDataSource = { x: pointer.x, y: pointer.y };
|
|
44
44
|
_.createSelectionRectFn(options);
|
|
45
45
|
return;
|
|
@@ -72,7 +72,7 @@ function RegisterMouseDownEventFn(options) {
|
|
|
72
72
|
}
|
|
73
73
|
else {
|
|
74
74
|
if (!_.canvasDragStatus) {
|
|
75
|
-
setTimeout(
|
|
75
|
+
setTimeout(() => {
|
|
76
76
|
_.canvasDragStatus = true;
|
|
77
77
|
}, 0);
|
|
78
78
|
}
|
package/dist/event/mouse-move.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.RegisterMouseMoveEventFn = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
const is_1 = require("../is");
|
|
5
|
+
const win = window || {};
|
|
6
6
|
function RegisterMouseMoveEventFn(options) {
|
|
7
7
|
if (!(0, is_1.isObject)(options)) {
|
|
8
8
|
return;
|
|
9
9
|
}
|
|
10
|
-
|
|
10
|
+
const _ = this;
|
|
11
11
|
// 监听鼠标是否在画布范围内移动
|
|
12
12
|
var pointer = _.canvasDataSource.getPointer(options.e);
|
|
13
13
|
var inRange = pointer.x >= 0 && pointer.x <= _.canvasDataSource.width &&
|
|
@@ -18,7 +18,7 @@ function RegisterMouseMoveEventFn(options) {
|
|
|
18
18
|
// console.log("鼠标不在画布内,终止行为" );
|
|
19
19
|
return;
|
|
20
20
|
}
|
|
21
|
-
|
|
21
|
+
const activeTarget = options.target || options.activeTarget;
|
|
22
22
|
_.mouseDragStatus = true;
|
|
23
23
|
_.mouseWheelStatus = true;
|
|
24
24
|
_.mouseWheelPointerDataSource = options;
|
|
@@ -27,8 +27,8 @@ function RegisterMouseMoveEventFn(options) {
|
|
|
27
27
|
return;
|
|
28
28
|
}
|
|
29
29
|
if (_.dragLastPosDataSource.open) {
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
const evt = options.e;
|
|
31
|
+
const vpt = _.canvasDataSource.viewportTransform;
|
|
32
32
|
vpt[4] += evt.clientX - _.dragLastPosDataSource.lastPosX;
|
|
33
33
|
vpt[5] += evt.clientY - _.dragLastPosDataSource.lastPosY;
|
|
34
34
|
_.canvasDataSource.requestRenderAll(); // 异步更新画板,提升性能
|
package/dist/event/mouse-up.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.RegisterMouseUpEventFn = void 0;
|
|
4
|
-
|
|
4
|
+
const is_1 = require("../is");
|
|
5
5
|
function RegisterMouseUpEventFn(options) {
|
|
6
6
|
if (!(0, is_1.isObject)(options)) {
|
|
7
7
|
return;
|
|
8
8
|
}
|
|
9
|
-
|
|
9
|
+
const _ = this;
|
|
10
10
|
// 鼠标不在画布内,终止行为
|
|
11
11
|
if (!_.mouseCanvasInRangeStatus) {
|
|
12
12
|
return;
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
const activeTarget = options.target || options.activeTarget;
|
|
15
|
+
const { activeTargetElementBackFn, activeTargetSelectionRectBackFn } = _.callBackEventConfig || {};
|
|
16
16
|
_.mouseWheelPointerDataSource = options;
|
|
17
17
|
console.log("activeTarget==", activeTarget);
|
|
18
18
|
console.log("_.canvasDataSource==", _.canvasDataSource);
|
|
19
|
-
setTimeout(
|
|
19
|
+
setTimeout(() => {
|
|
20
20
|
_.mouseWheelStatus = false;
|
|
21
21
|
}, 0);
|
|
22
22
|
if (_.mouseRightClickStatus) {
|
|
@@ -31,7 +31,7 @@ function RegisterMouseUpEventFn(options) {
|
|
|
31
31
|
activeTargetElementBackFn(activeTarget);
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
|
-
setTimeout(
|
|
34
|
+
setTimeout(() => {
|
|
35
35
|
_.mouseClickTargetObjectStatus = 3;
|
|
36
36
|
}, 0);
|
|
37
37
|
return;
|
|
@@ -43,7 +43,7 @@ function RegisterMouseUpEventFn(options) {
|
|
|
43
43
|
activeTargetSelectionRectBackFn(activeTarget);
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
|
-
setTimeout(
|
|
46
|
+
setTimeout(() => {
|
|
47
47
|
_.mouseClickTargetObjectStatus = 3;
|
|
48
48
|
}, 0);
|
|
49
49
|
return;
|
|
@@ -60,7 +60,7 @@ function RegisterMouseUpEventFn(options) {
|
|
|
60
60
|
return;
|
|
61
61
|
}
|
|
62
62
|
// _.canvasDataSource.selection = true;
|
|
63
|
-
setTimeout(
|
|
63
|
+
setTimeout(() => {
|
|
64
64
|
_.mouseDragStatus = false;
|
|
65
65
|
}, 0);
|
|
66
66
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.RegisterMouseWheelEventFn = void 0;
|
|
4
|
-
|
|
4
|
+
const is_1 = require("../is");
|
|
5
5
|
function RegisterMouseWheelEventFn(options) {
|
|
6
6
|
var _a;
|
|
7
7
|
if (!(0, is_1.isObject)(options)) {
|
|
8
8
|
return;
|
|
9
9
|
}
|
|
10
|
-
|
|
10
|
+
const _ = this;
|
|
11
11
|
_.mouseWheelPointerDataSource = options;
|
|
12
12
|
if (!_.canvasDataSource) {
|
|
13
13
|
return;
|
package/dist/format/index.js
CHANGED
package/dist/handle/create.js
CHANGED
|
@@ -1,35 +1,28 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
3
|
exports.CreateElementFn = exports.CreateRightClickMenuFn = exports.CreateAllSelectionRectFn = exports.CreateSelectionRectFn = exports.CreateCanvasImageElementFn = exports.CreateCanvasSvgElementFn = exports.InitElement2CanvasFn = exports.CreateDragElementFn = void 0;
|
|
15
|
-
|
|
16
|
-
|
|
4
|
+
const utils_1 = require("../utils");
|
|
5
|
+
const is_1 = require("../is");
|
|
17
6
|
function CreateDragElementFn() {
|
|
18
7
|
var _a, _b, _c, _d, _e;
|
|
19
|
-
|
|
8
|
+
const _ = this;
|
|
20
9
|
if (!_.canvasDataSource) {
|
|
21
10
|
return;
|
|
22
11
|
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
12
|
+
const type = ((_a = _.dragElementDataSource) === null || _a === void 0 ? void 0 : _a.renderType) || "image";
|
|
13
|
+
const top = (_b = _.mousePointerDataSource) === null || _b === void 0 ? void 0 : _b.y;
|
|
14
|
+
const left = ((_c = _.mousePointerDataSource) === null || _c === void 0 ? void 0 : _c.x) - (((_d = _.dragElementDataSource) === null || _d === void 0 ? void 0 : _d.width) / 2);
|
|
26
15
|
// 同一个对象是否允许多次创建 createMode = multiple 允许 传其他或不传不允许
|
|
27
16
|
_.targetObjectDataSource = _.dragElementDataSource;
|
|
28
17
|
if (!((_e = _.targetObjectDataSource) === null || _e === void 0 ? void 0 : _e.id)) {
|
|
29
18
|
console.error("拖入画布的元素没有唯一标识id字段,不能创建!");
|
|
30
19
|
return;
|
|
31
20
|
}
|
|
32
|
-
|
|
21
|
+
const item = {
|
|
22
|
+
..._.dragElementDataSource,
|
|
23
|
+
top: top,
|
|
24
|
+
left: left,
|
|
25
|
+
};
|
|
33
26
|
// 拖拽数据类型为SVG图片对象
|
|
34
27
|
if (type == "svg") {
|
|
35
28
|
_.createCanvasSvgElementFn(item);
|
|
@@ -43,16 +36,16 @@ function InitElement2CanvasFn(list) {
|
|
|
43
36
|
if (!(0, is_1.isArray)(list)) {
|
|
44
37
|
return;
|
|
45
38
|
}
|
|
46
|
-
|
|
39
|
+
const _ = this;
|
|
47
40
|
_.defaultCreateDataListStatus = false;
|
|
48
41
|
if (!_.canvasDataSource) {
|
|
49
42
|
return;
|
|
50
43
|
}
|
|
51
44
|
if (list === null || list === void 0 ? void 0 : list.length) {
|
|
52
45
|
_.defaultCreateDataList = list;
|
|
53
|
-
list.forEach(
|
|
46
|
+
list.forEach((item, index) => {
|
|
54
47
|
if (item.hasOwnProperty("left") && item.hasOwnProperty("top")) {
|
|
55
|
-
|
|
48
|
+
const type = (item === null || item === void 0 ? void 0 : item.renderType) || "image";
|
|
56
49
|
if (type == "svg") {
|
|
57
50
|
_.createCanvasSvgElementFn(item, index);
|
|
58
51
|
}
|
|
@@ -69,17 +62,22 @@ function CreateCanvasSvgElementFn(item, index) {
|
|
|
69
62
|
if (!(0, is_1.isObject)(item)) {
|
|
70
63
|
return;
|
|
71
64
|
}
|
|
72
|
-
|
|
65
|
+
const _ = this;
|
|
73
66
|
if (!_.canvasDataSource) {
|
|
74
67
|
return;
|
|
75
68
|
}
|
|
76
|
-
|
|
77
|
-
_.fabricSource.loadSVGFromURL(item === null || item === void 0 ? void 0 : item.address,
|
|
69
|
+
const { createDragElementBackFn } = _.callBackEventConfig || {};
|
|
70
|
+
_.fabricSource.loadSVGFromURL(item === null || item === void 0 ? void 0 : item.address, (objects) => {
|
|
78
71
|
var svgObject = (objects === null || objects === void 0 ? void 0 : objects.length) ? objects[0] : "";
|
|
79
72
|
if (!svgObject) {
|
|
80
73
|
return;
|
|
81
74
|
}
|
|
82
|
-
svgObject.set(
|
|
75
|
+
svgObject.set({
|
|
76
|
+
evented: true,
|
|
77
|
+
originX: 'left',
|
|
78
|
+
originY: 'top',
|
|
79
|
+
...item
|
|
80
|
+
});
|
|
83
81
|
_.canvasDataSource.add(svgObject);
|
|
84
82
|
_.canvasDataSource.requestRenderAll();
|
|
85
83
|
_.mousePointerDataSource = null;
|
|
@@ -89,7 +87,7 @@ function CreateCanvasSvgElementFn(item, index) {
|
|
|
89
87
|
if (createDragElementBackFn instanceof Function) {
|
|
90
88
|
createDragElementBackFn(_.dragElementDataSource);
|
|
91
89
|
}
|
|
92
|
-
setTimeout(
|
|
90
|
+
setTimeout(() => {
|
|
93
91
|
_.mouseDragStatus = false;
|
|
94
92
|
}, 0);
|
|
95
93
|
});
|
|
@@ -100,20 +98,27 @@ function CreateCanvasImageElementFn(item, index) {
|
|
|
100
98
|
if (!(0, is_1.isObject)(item)) {
|
|
101
99
|
return;
|
|
102
100
|
}
|
|
103
|
-
|
|
101
|
+
const _ = this;
|
|
104
102
|
if (!_.canvasDataSource) {
|
|
105
103
|
return;
|
|
106
104
|
}
|
|
107
|
-
|
|
108
|
-
_.fabricSource.Image.fromURL((_a = _.dragElementDataSource) === null || _a === void 0 ? void 0 : _a.address,
|
|
109
|
-
img.set(
|
|
105
|
+
const { createDragElementBackFn } = _.callBackEventConfig || {};
|
|
106
|
+
_.fabricSource.Image.fromURL((_a = _.dragElementDataSource) === null || _a === void 0 ? void 0 : _a.address, (img) => {
|
|
107
|
+
img.set({
|
|
108
|
+
// hasBorders: false, //不显示选中时的边
|
|
109
|
+
// // hasControls: false, //不显示选中时的9个方块
|
|
110
|
+
// ..._.dragElementDataSource,
|
|
111
|
+
// top:top,
|
|
112
|
+
// left:left,
|
|
113
|
+
...item,
|
|
114
|
+
});
|
|
110
115
|
_.canvasDataSource.add(img);
|
|
111
116
|
_.canvasCreateElementsDataSource.push(img);
|
|
112
117
|
_.canvasCreateTargetElementsDataSource.push(img);
|
|
113
118
|
_.mousePointerDataSource = null;
|
|
114
119
|
_.canvasDataSource.requestRenderAll();
|
|
115
120
|
_.getCreateElementStatusFn(index);
|
|
116
|
-
setTimeout(
|
|
121
|
+
setTimeout(() => {
|
|
117
122
|
_.mouseDragStatus = false;
|
|
118
123
|
}, 0);
|
|
119
124
|
if (createDragElementBackFn instanceof Function) {
|
|
@@ -128,7 +133,7 @@ function CreateCanvasImageElementFn(item, index) {
|
|
|
128
133
|
exports.CreateCanvasImageElementFn = CreateCanvasImageElementFn;
|
|
129
134
|
function CreateSelectionRectFn() {
|
|
130
135
|
var _a, _b;
|
|
131
|
-
|
|
136
|
+
const _ = this;
|
|
132
137
|
if (!_.canvasDataSource) {
|
|
133
138
|
return;
|
|
134
139
|
}
|
|
@@ -153,14 +158,14 @@ function CreateSelectionRectFn() {
|
|
|
153
158
|
}
|
|
154
159
|
exports.CreateSelectionRectFn = CreateSelectionRectFn;
|
|
155
160
|
function CreateAllSelectionRectFn() {
|
|
156
|
-
|
|
161
|
+
const _ = this;
|
|
157
162
|
if (!_.canvasDataSource) {
|
|
158
163
|
return;
|
|
159
164
|
}
|
|
160
|
-
|
|
165
|
+
const container = (0, utils_1.getDomFn)("canvasContainer");
|
|
161
166
|
// console.log("xxx---",_.canvasDataSource.getWidth());
|
|
162
|
-
|
|
163
|
-
|
|
167
|
+
const containerWidth = container.offsetWidth;
|
|
168
|
+
const containerHeight = container.offsetWidth;
|
|
164
169
|
_.createSelectionRectDataSource = new _.fabricSource.Rect({
|
|
165
170
|
left: 0,
|
|
166
171
|
top: 0,
|
|
@@ -188,31 +193,40 @@ function CreateRightClickMenuFn(options) {
|
|
|
188
193
|
if (!(0, is_1.isObject)(options)) {
|
|
189
194
|
return;
|
|
190
195
|
}
|
|
191
|
-
|
|
196
|
+
const _ = this;
|
|
192
197
|
if (!_.canvasDataSource) {
|
|
193
198
|
return;
|
|
194
199
|
}
|
|
195
|
-
|
|
196
|
-
|
|
200
|
+
const { rightButtonsDataSource } = _.canvasHandleConfig || {};
|
|
201
|
+
const { rightButtonMenuClickBackFn } = _.callBackEventConfig || {};
|
|
197
202
|
if (!(rightButtonsDataSource === null || rightButtonsDataSource === void 0 ? void 0 : rightButtonsDataSource.length)) {
|
|
198
203
|
return;
|
|
199
204
|
}
|
|
200
|
-
|
|
201
|
-
|
|
205
|
+
const canvasContainer = (0, utils_1.getDomFn)("canvasContainer");
|
|
206
|
+
const oldMenuBox = (0, utils_1.getDomFn)("menuBox");
|
|
202
207
|
if (canvasContainer && oldMenuBox) {
|
|
203
208
|
canvasContainer === null || canvasContainer === void 0 ? void 0 : canvasContainer.removeChild(oldMenuBox);
|
|
204
209
|
}
|
|
205
|
-
|
|
210
|
+
const menuBox = _.createElementFn("menuBox", "div");
|
|
206
211
|
if (rightButtonsDataSource === null || rightButtonsDataSource === void 0 ? void 0 : rightButtonsDataSource.length) {
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
+
const ulBox = _.createElementFn("ulBox", "ul");
|
|
213
|
+
ulBox.style = `
|
|
214
|
+
list-style-type: none;
|
|
215
|
+
padding:0px;
|
|
216
|
+
margin:0px;
|
|
217
|
+
`;
|
|
218
|
+
const liStype = `
|
|
219
|
+
padding:8px 12px;
|
|
220
|
+
cursor: pointer;
|
|
221
|
+
border-radius:4px;
|
|
222
|
+
font-size:16px;
|
|
223
|
+
`;
|
|
224
|
+
rightButtonsDataSource.forEach((item, index) => {
|
|
225
|
+
const liItem = _.createElementFn("li", `liBox${index + 1}`, index);
|
|
212
226
|
liItem.innerHTML = (item === null || item === void 0 ? void 0 : item.label) || "请传入label值";
|
|
213
|
-
liItem.style =
|
|
227
|
+
liItem.style = liStype;
|
|
214
228
|
liItem.className = "right-menu-button";
|
|
215
|
-
liItem.addEventListener("click",
|
|
229
|
+
liItem.addEventListener("click", (event) => {
|
|
216
230
|
// 点击右键菜单回调函数
|
|
217
231
|
console.log("rightButtonMenuClickBackFn==", rightButtonMenuClickBackFn);
|
|
218
232
|
event.preventDefault();
|
|
@@ -224,7 +238,7 @@ function CreateRightClickMenuFn(options) {
|
|
|
224
238
|
_.hiddenRightClickMenuFn();
|
|
225
239
|
});
|
|
226
240
|
liItem.addEventListener('mousemove', function () {
|
|
227
|
-
|
|
241
|
+
const lists = document.getElementsByClassName("right-menu-button");
|
|
228
242
|
for (var i = 0; i < lists.length; i++) {
|
|
229
243
|
var element = lists[i];
|
|
230
244
|
element.style.backgroundColor = "#fff";
|
|
@@ -234,19 +248,19 @@ function CreateRightClickMenuFn(options) {
|
|
|
234
248
|
liItem.style.color = '#fff';
|
|
235
249
|
liItem.style.fontWeight = "bold";
|
|
236
250
|
});
|
|
237
|
-
|
|
251
|
+
ulBox.appendChild(liItem);
|
|
238
252
|
});
|
|
239
|
-
menuBox.appendChild(
|
|
253
|
+
menuBox.appendChild(ulBox);
|
|
240
254
|
}
|
|
241
255
|
if (menuBox) {
|
|
242
256
|
menuBox.id = "menuBox";
|
|
243
257
|
// 显示菜单,设置右键菜单位置
|
|
244
258
|
// 获取菜单组件的宽高
|
|
245
|
-
|
|
246
|
-
|
|
259
|
+
const menuWidth = menuBox.offsetWidth;
|
|
260
|
+
const menuHeight = menuBox.offsetHeight;
|
|
247
261
|
// 当前鼠标位置
|
|
248
|
-
|
|
249
|
-
|
|
262
|
+
let pointX = options.pointer.x;
|
|
263
|
+
let pointY = options.pointer.y;
|
|
250
264
|
// 计算菜单出现的位置
|
|
251
265
|
// 如果鼠标靠近画布右侧,菜单就出现在鼠标指针左侧
|
|
252
266
|
if (_.canvasDataSource.width - pointX <= menuWidth) {
|
|
@@ -257,7 +271,17 @@ function CreateRightClickMenuFn(options) {
|
|
|
257
271
|
pointY -= menuHeight;
|
|
258
272
|
}
|
|
259
273
|
// 将菜单展示出来
|
|
260
|
-
menuBox.style =
|
|
274
|
+
menuBox.style = `
|
|
275
|
+
visibility: visible;
|
|
276
|
+
left: ${pointX}px;
|
|
277
|
+
top: ${pointY}px;
|
|
278
|
+
z-index: 10000000;
|
|
279
|
+
padding:16px 12px;
|
|
280
|
+
border-radius:4px;
|
|
281
|
+
background-color:#fff;
|
|
282
|
+
position: absolute;
|
|
283
|
+
box-shadow: h-shadow v-shadow blur spread color inset;
|
|
284
|
+
`;
|
|
261
285
|
if (canvasContainer) {
|
|
262
286
|
canvasContainer.appendChild(menuBox);
|
|
263
287
|
_.isRightClick = true;
|
|
@@ -273,14 +297,14 @@ function CreateElementFn(domVal, id, index) {
|
|
|
273
297
|
if (!(0, is_1.isString)(id)) {
|
|
274
298
|
return;
|
|
275
299
|
}
|
|
276
|
-
|
|
277
|
-
|
|
300
|
+
const _ = this;
|
|
301
|
+
const element = (0, utils_1.getDomFn)(id);
|
|
278
302
|
if (element) {
|
|
279
303
|
return;
|
|
280
304
|
}
|
|
281
305
|
else {
|
|
282
306
|
if (domVal) {
|
|
283
|
-
|
|
307
|
+
const dom = document.createElement(domVal);
|
|
284
308
|
dom.id = id;
|
|
285
309
|
if (typeof index == "undefined") {
|
|
286
310
|
index = 0;
|