@ibiz-template/vue3-components 0.7.41-alpha.45 → 0.7.41-alpha.47
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/ibiz-markdown-editor-DlU-04L2.js +1 -0
- package/dist/{index-DgqTP4Vw.js → index-B0XiEslO.js} +1 -1
- package/dist/{index-Dr0VM8iS.js → index-B6kaPJDO.js} +1 -1
- package/dist/index-BniHS_Fs.js +11 -0
- package/dist/index.min.css +1 -1
- package/dist/index.system.min.js +1 -1
- package/dist/{wang-editor-homqxACE.js → wang-editor-Bx-SzrX-.js} +1 -1
- package/dist/{xlsx-util-C5MBICNN.js → xlsx-util-DgYbktap.js} +1 -1
- package/es/common/button-list/button-list.css +1 -1
- package/es/control/drbar/drbar.controller.mjs +6 -1
- package/es/control/drbar/drbar.mjs +5 -5
- package/es/control/drtab/drtab-control.util.mjs +1 -1
- package/es/control/drtab/drtab.controller.mjs +6 -1
- package/es/control/drtab/drtab.mjs +5 -5
- package/es/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.mjs +14 -3
- package/es/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.mjs +2 -2
- package/es/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.state.mjs +6 -0
- package/es/editor/code/monaco-editor/monaco-editor.mjs +2 -2
- package/es/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.mjs +10 -6
- package/es/index.mjs +1 -0
- package/es/locale/en/index.mjs +13 -0
- package/es/locale/zh-CN/index.mjs +13 -0
- package/es/node_modules/.pnpm/modern-screenshot@4.6.7/node_modules/modern-screenshot/dist/index.mjs +1652 -0
- package/es/util/ai-chat-util/ai-chat-util.mjs +57 -23
- package/es/util/app-util/app-util.mjs +2 -4
- package/es/util/index.mjs +1 -0
- package/es/util/inline-ai-util/inline-ai-textarea/inline-ai-textarea.hook.mjs +3 -3
- package/es/util/screen-shot-util/screen-shot/components/index.mjs +3 -0
- package/es/util/screen-shot-util/screen-shot/components/screen-shot/screen-shot.css +1 -0
- package/es/util/screen-shot-util/screen-shot/components/screen-shot/screen-shot.mjs +113 -0
- package/es/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.css +1 -0
- package/es/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.mjs +105 -0
- package/es/util/screen-shot-util/screen-shot/constant/index.mjs +172 -0
- package/es/util/screen-shot-util/screen-shot/controller/index.mjs +3 -0
- package/es/util/screen-shot-util/screen-shot/controller/screen-shot.controller.mjs +366 -0
- package/es/util/screen-shot-util/screen-shot/controller/screen-shot.store.mjs +51 -0
- package/es/util/screen-shot-util/screen-shot/icon/icon.mjs +90 -0
- package/es/util/screen-shot-util/screen-shot/icon/index.mjs +3 -0
- package/es/util/screen-shot-util/screen-shot/index.mjs +4 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-arrow.mjs +109 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-circle.mjs +25 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-mosaic.mjs +54 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-pencil.mjs +15 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-rectangle.mjs +12 -0
- package/es/util/screen-shot-util/screen-shot/module/draw-text.mjs +12 -0
- package/es/util/screen-shot-util/screen-shot/module/index.mjs +8 -0
- package/es/util/screen-shot-util/screen-shot/type/index.mjs +16 -0
- package/es/util/screen-shot-util/screen-shot/util/index.mjs +8 -0
- package/es/util/screen-shot-util/screen-shot-util.mjs +67 -0
- package/es/view-engine/edit-view.engine.mjs +6 -1
- package/es/view-engine/opt-view.engine.mjs +6 -1
- package/es/web-app/main.mjs +2 -0
- package/lib/common/button-list/button-list.css +1 -1
- package/lib/control/drbar/drbar.cjs +4 -4
- package/lib/control/drbar/drbar.controller.cjs +6 -1
- package/lib/control/drtab/drtab-control.util.cjs +1 -1
- package/lib/control/drtab/drtab.cjs +4 -4
- package/lib/control/drtab/drtab.controller.cjs +6 -1
- package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.cjs +2 -2
- package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.cjs +14 -3
- package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.state.cjs +6 -0
- package/lib/editor/code/monaco-editor/monaco-editor.cjs +2 -2
- package/lib/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.cjs +10 -6
- package/lib/index.cjs +2 -0
- package/lib/locale/en/index.cjs +13 -0
- package/lib/locale/zh-CN/index.cjs +13 -0
- package/lib/node_modules/.pnpm/modern-screenshot@4.6.7/node_modules/modern-screenshot/dist/index.cjs +1667 -0
- package/lib/util/ai-chat-util/ai-chat-util.cjs +57 -23
- package/lib/util/app-util/app-util.cjs +2 -4
- package/lib/util/index.cjs +2 -0
- package/lib/util/inline-ai-util/inline-ai-textarea/inline-ai-textarea.hook.cjs +3 -3
- package/lib/util/screen-shot-util/screen-shot/components/index.cjs +7 -0
- package/lib/util/screen-shot-util/screen-shot/components/screen-shot/screen-shot.cjs +115 -0
- package/lib/util/screen-shot-util/screen-shot/components/screen-shot/screen-shot.css +1 -0
- package/lib/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.cjs +107 -0
- package/lib/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.css +1 -0
- package/lib/util/screen-shot-util/screen-shot/constant/index.cjs +174 -0
- package/lib/util/screen-shot-util/screen-shot/controller/index.cjs +7 -0
- package/lib/util/screen-shot-util/screen-shot/controller/screen-shot.controller.cjs +368 -0
- package/lib/util/screen-shot-util/screen-shot/controller/screen-shot.store.cjs +53 -0
- package/lib/util/screen-shot-util/screen-shot/icon/icon.cjs +100 -0
- package/lib/util/screen-shot-util/screen-shot/icon/index.cjs +15 -0
- package/lib/util/screen-shot-util/screen-shot/index.cjs +8 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-arrow.cjs +111 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-circle.cjs +27 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-mosaic.cjs +56 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-pencil.cjs +18 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-rectangle.cjs +14 -0
- package/lib/util/screen-shot-util/screen-shot/module/draw-text.cjs +14 -0
- package/lib/util/screen-shot-util/screen-shot/module/index.cjs +18 -0
- package/lib/util/screen-shot-util/screen-shot/type/index.cjs +18 -0
- package/lib/util/screen-shot-util/screen-shot/util/index.cjs +10 -0
- package/lib/util/screen-shot-util/screen-shot-util.cjs +69 -0
- package/lib/view-engine/edit-view.engine.cjs +6 -1
- package/lib/view-engine/opt-view.engine.cjs +6 -1
- package/lib/web-app/main.cjs +2 -0
- package/package.json +6 -5
- package/dist/ibiz-markdown-editor-C7wR017-.js +0 -1
- package/dist/index-yLzheFmH.js +0 -11
|
@@ -73,6 +73,11 @@ class AIChatUtil {
|
|
|
73
73
|
if (editorParams.srfmode) {
|
|
74
74
|
chatOptions.srfMode = editorParams.srfmode;
|
|
75
75
|
}
|
|
76
|
+
let enableAIAgentChange = ibiz.config.common.enableAIAgentChange;
|
|
77
|
+
if (editorParams.srfenableaiagentchange) {
|
|
78
|
+
enableAIAgentChange = editorParams.srfenableaiagentchange === "true";
|
|
79
|
+
}
|
|
80
|
+
chatOptions.enableAIAgentChange = enableAIAgentChange;
|
|
76
81
|
if (editorParams.srfaiagent) {
|
|
77
82
|
chatOptions.activeAIAgentID = editorParams.srfaiagent;
|
|
78
83
|
}
|
|
@@ -98,6 +103,7 @@ class AIChatUtil {
|
|
|
98
103
|
chatOptions.sessionid = sessionid;
|
|
99
104
|
let id = "";
|
|
100
105
|
let abortController;
|
|
106
|
+
let asyncacitonid = "";
|
|
101
107
|
const { chatInstance, view, ctrl } = args;
|
|
102
108
|
chatOptions.history = async (ctx, param, other) => {
|
|
103
109
|
const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
|
|
@@ -171,6 +177,7 @@ class AIChatUtil {
|
|
|
171
177
|
await deService.aiChatSse(
|
|
172
178
|
(msg) => {
|
|
173
179
|
if (msg.actionstate === 20 && msg.actionresult) {
|
|
180
|
+
asyncacitonid = msg.asyncacitonid;
|
|
174
181
|
aiChat.addMessage({
|
|
175
182
|
messageid: id,
|
|
176
183
|
state: msg.actionstate,
|
|
@@ -220,8 +227,23 @@ class AIChatUtil {
|
|
|
220
227
|
return true;
|
|
221
228
|
}
|
|
222
229
|
};
|
|
223
|
-
chatOptions.abortQuestion = async (aiChat) => {
|
|
230
|
+
chatOptions.abortQuestion = async (aiChat, ctx, param, other) => {
|
|
224
231
|
abortController == null ? void 0 : abortController.abort();
|
|
232
|
+
if (asyncacitonid) {
|
|
233
|
+
const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
|
|
234
|
+
const abortRequestData = { asyncacitonid };
|
|
235
|
+
if (other.sessionid) {
|
|
236
|
+
Object.assign(abortRequestData, {
|
|
237
|
+
sessionid: other.sessionid
|
|
238
|
+
});
|
|
239
|
+
}
|
|
240
|
+
const result = await deService.aiChatCancel(
|
|
241
|
+
ctx,
|
|
242
|
+
param,
|
|
243
|
+
abortRequestData
|
|
244
|
+
);
|
|
245
|
+
asyncacitonid = "";
|
|
246
|
+
}
|
|
225
247
|
await aiChat.stopMessage({
|
|
226
248
|
messageid: id,
|
|
227
249
|
state: 30,
|
|
@@ -349,6 +371,16 @@ class AIChatUtil {
|
|
|
349
371
|
} else {
|
|
350
372
|
topicOptions.captionMode = ibiz.config.common.aiChatTopicCaptionMode;
|
|
351
373
|
}
|
|
374
|
+
topicOptions.hideTopicSidebar = false;
|
|
375
|
+
if (params.hasOwnProperty("hidetopicsidebar")) {
|
|
376
|
+
topicOptions.hideTopicSidebar = params.hidetopicsidebar === "true";
|
|
377
|
+
delete params.hidetopicsidebar;
|
|
378
|
+
}
|
|
379
|
+
topicOptions.disableStorage = false;
|
|
380
|
+
if (params.hasOwnProperty("disabletopicstorage")) {
|
|
381
|
+
topicOptions.disableStorage = params.disabletopicstorage === "true";
|
|
382
|
+
delete params.disabletopicstorage;
|
|
383
|
+
}
|
|
352
384
|
topicOptions.beforeDelete = async (...args2) => {
|
|
353
385
|
const isBatchRemove = args2[4];
|
|
354
386
|
const result = await ibiz.confirm.warning({
|
|
@@ -407,6 +439,12 @@ class AIChatUtil {
|
|
|
407
439
|
chatOptions.activeAIAgentID = params.srfaiagent;
|
|
408
440
|
delete params.srfaiagent;
|
|
409
441
|
}
|
|
442
|
+
let enableAIAgentChange = ibiz.config.common.enableAIAgentChange;
|
|
443
|
+
if (params.hasOwnProperty("srfenableaiagentchange")) {
|
|
444
|
+
enableAIAgentChange = params.srfenableaiagentchange === "true";
|
|
445
|
+
delete params.srfenableaiagentchange;
|
|
446
|
+
}
|
|
447
|
+
chatOptions.enableAIAgentChange = enableAIAgentChange;
|
|
410
448
|
const aiAgentlist = await this.getAIAgentList(context, params);
|
|
411
449
|
chatOptions.aiAgentlist = aiAgentlist;
|
|
412
450
|
if (deACMode) {
|
|
@@ -423,6 +461,7 @@ class AIChatUtil {
|
|
|
423
461
|
}
|
|
424
462
|
let id = "";
|
|
425
463
|
let abortController;
|
|
464
|
+
let asyncacitonid = "";
|
|
426
465
|
const { chatInstance, view, ctrl } = args;
|
|
427
466
|
chatOptions.history = async (ctx, param, other) => {
|
|
428
467
|
const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
|
|
@@ -496,6 +535,7 @@ class AIChatUtil {
|
|
|
496
535
|
await deService.aiChatSse(
|
|
497
536
|
(msg) => {
|
|
498
537
|
if (msg.actionstate === 20 && msg.actionresult) {
|
|
538
|
+
asyncacitonid = msg.asyncacitonid;
|
|
499
539
|
aiChat.addMessage({
|
|
500
540
|
messageid: id,
|
|
501
541
|
state: msg.actionstate,
|
|
@@ -545,8 +585,23 @@ class AIChatUtil {
|
|
|
545
585
|
return true;
|
|
546
586
|
}
|
|
547
587
|
};
|
|
548
|
-
chatOptions.abortQuestion = async (aiChat) => {
|
|
588
|
+
chatOptions.abortQuestion = async (aiChat, ctx, param, other) => {
|
|
549
589
|
abortController == null ? void 0 : abortController.abort();
|
|
590
|
+
if (asyncacitonid) {
|
|
591
|
+
const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
|
|
592
|
+
const abortRequestData = { asyncacitonid };
|
|
593
|
+
if (other.sessionid) {
|
|
594
|
+
Object.assign(abortRequestData, {
|
|
595
|
+
sessionid: other.sessionid
|
|
596
|
+
});
|
|
597
|
+
}
|
|
598
|
+
const result = await deService.aiChatCancel(
|
|
599
|
+
ctx,
|
|
600
|
+
param,
|
|
601
|
+
abortRequestData
|
|
602
|
+
);
|
|
603
|
+
asyncacitonid = "";
|
|
604
|
+
}
|
|
550
605
|
await aiChat.stopMessage({
|
|
551
606
|
messageid: id,
|
|
552
607
|
state: 30,
|
|
@@ -856,27 +911,6 @@ class AIChatUtil {
|
|
|
856
911
|
};
|
|
857
912
|
return resourceOptions;
|
|
858
913
|
}
|
|
859
|
-
/**
|
|
860
|
-
* 获取AI聊天模式
|
|
861
|
-
* @param type 场景类型:UIACTION:界面行为;EDITOR:编辑器
|
|
862
|
-
* @param context
|
|
863
|
-
* @param params
|
|
864
|
-
* @param editorParams
|
|
865
|
-
*/
|
|
866
|
-
getAIChatMode(type, context, params, editorParams) {
|
|
867
|
-
switch (type) {
|
|
868
|
-
case "UIACTION":
|
|
869
|
-
if (params.srfenabletempmode && params.srfenabletempmode === "true") {
|
|
870
|
-
delete params.srfenabletempmode;
|
|
871
|
-
return "DEFAULT";
|
|
872
|
-
}
|
|
873
|
-
return "TOPIC";
|
|
874
|
-
case "EDITOR":
|
|
875
|
-
return "DEFAULT";
|
|
876
|
-
default:
|
|
877
|
-
return "DEFAULT";
|
|
878
|
-
}
|
|
879
|
-
}
|
|
880
914
|
}
|
|
881
915
|
|
|
882
916
|
exports.AIChatUtil = AIChatUtil;
|
|
@@ -208,7 +208,6 @@ class AppUtil {
|
|
|
208
208
|
if (!deACMode)
|
|
209
209
|
return Promise.resolve([]);
|
|
210
210
|
const chatInstance = await ibiz.aiChatUtil.getAIChat();
|
|
211
|
-
const messages = [];
|
|
212
211
|
const appDataEntityName = runtime.calcDeCodeNameById(appDataEntityId);
|
|
213
212
|
let topicId = "".concat(appDataEntityId, "@").concat(appDEACModeId, "@");
|
|
214
213
|
topicId += context[appDataEntityName] ? context[appDataEntityName] : "default";
|
|
@@ -224,14 +223,13 @@ class AppUtil {
|
|
|
224
223
|
deACMode,
|
|
225
224
|
{ chatInstance, view, ctrl }
|
|
226
225
|
);
|
|
227
|
-
const chatMode = ibiz.aiChatUtil.getAIChatMode("UIACTION", context, params);
|
|
228
226
|
const resourceOptions = await ibiz.aiChatUtil.getAIResourceOptions(
|
|
229
227
|
context,
|
|
230
228
|
params
|
|
231
229
|
);
|
|
232
230
|
return new Promise((resolve) => {
|
|
233
231
|
chatInstance.create({
|
|
234
|
-
mode:
|
|
232
|
+
mode: "TOPIC",
|
|
235
233
|
resourceOptions,
|
|
236
234
|
containerOptions: {
|
|
237
235
|
zIndex: containerZIndex,
|
|
@@ -255,7 +253,7 @@ class AppUtil {
|
|
|
255
253
|
// 扩展参数
|
|
256
254
|
...chatOptions,
|
|
257
255
|
// 关闭回调
|
|
258
|
-
closed: () => {
|
|
256
|
+
closed: (context2, params2, messages) => {
|
|
259
257
|
resolve(messages);
|
|
260
258
|
}
|
|
261
259
|
}
|
package/lib/util/index.cjs
CHANGED
|
@@ -18,6 +18,7 @@ var buttonUtil = require('./button-util/button-util.cjs');
|
|
|
18
18
|
var icon = require('./icon/icon.cjs');
|
|
19
19
|
var inlineAiUtil = require('./inline-ai-util/inline-ai-util.cjs');
|
|
20
20
|
var aiChatUtil = require('./ai-chat-util/ai-chat-util.cjs');
|
|
21
|
+
var screenShotUtil = require('./screen-shot-util/screen-shot-util.cjs');
|
|
21
22
|
|
|
22
23
|
"use strict";
|
|
23
24
|
|
|
@@ -40,3 +41,4 @@ exports.ArrowLeftBold = icon.ArrowLeftBold;
|
|
|
40
41
|
exports.ArrowRightBold = icon.ArrowRightBold;
|
|
41
42
|
exports.InLineAIUtil = inlineAiUtil.InLineAIUtil;
|
|
42
43
|
exports.AIChatUtil = aiChatUtil.AIChatUtil;
|
|
44
|
+
exports.ScreenShotUtil = screenShotUtil.ScreenShotUtil;
|
|
@@ -27,7 +27,7 @@ const computedInLineAIParams = (props) => {
|
|
|
27
27
|
};
|
|
28
28
|
};
|
|
29
29
|
const useInLineAIContainerClick = (props, message, isLoading) => {
|
|
30
|
-
const
|
|
30
|
+
const handMousedown = async (evt) => {
|
|
31
31
|
const target = evt.target;
|
|
32
32
|
if (!target.closest(".ibiz-inline-ai-textarea-container") && !target.closest(".ibiz-inline-ai-alert")) {
|
|
33
33
|
if (isLoading.value) {
|
|
@@ -50,10 +50,10 @@ const useInLineAIContainerClick = (props, message, isLoading) => {
|
|
|
50
50
|
}
|
|
51
51
|
};
|
|
52
52
|
vue.onMounted(() => {
|
|
53
|
-
document.addEventListener("
|
|
53
|
+
document.addEventListener("mousedown", handMousedown, true);
|
|
54
54
|
});
|
|
55
55
|
vue.onUnmounted(() => {
|
|
56
|
-
document.removeEventListener("
|
|
56
|
+
document.removeEventListener("mousedown", handMousedown, true);
|
|
57
57
|
});
|
|
58
58
|
};
|
|
59
59
|
const useAI = (props, opts) => {
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var vue = require('vue');
|
|
4
|
+
var vue3Util = require('@ibiz-template/vue3-util');
|
|
5
|
+
require('../../controller/index.cjs');
|
|
6
|
+
var index = require('../../type/index.cjs');
|
|
7
|
+
var screenShotToolbar = require('../screen-shot-toolbar/screen-shot-toolbar.cjs');
|
|
8
|
+
require('./screen-shot.css');
|
|
9
|
+
var screenShot_controller = require('../../controller/screen-shot.controller.cjs');
|
|
10
|
+
|
|
11
|
+
"use strict";
|
|
12
|
+
const ScreenShot = /* @__PURE__ */ vue.defineComponent({
|
|
13
|
+
name: "IBizScreenShot",
|
|
14
|
+
props: {
|
|
15
|
+
/**
|
|
16
|
+
* 生成Canvas的画布元素
|
|
17
|
+
*/
|
|
18
|
+
element: {
|
|
19
|
+
type: Object,
|
|
20
|
+
required: true
|
|
21
|
+
},
|
|
22
|
+
/**
|
|
23
|
+
* dom中的滚动容器
|
|
24
|
+
*/
|
|
25
|
+
container: {
|
|
26
|
+
type: Object
|
|
27
|
+
},
|
|
28
|
+
/**
|
|
29
|
+
* 滚动项类名,用于排除不在滚动容器的项绘制
|
|
30
|
+
*/
|
|
31
|
+
itemClassName: {
|
|
32
|
+
type: String
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
emits: {
|
|
36
|
+
complete: (_base64) => true,
|
|
37
|
+
cancel: () => true
|
|
38
|
+
},
|
|
39
|
+
setup(props, {
|
|
40
|
+
emit
|
|
41
|
+
}) {
|
|
42
|
+
const ns = vue3Util.useNamespace("screen-shot");
|
|
43
|
+
const c = new screenShot_controller.ScreenShotController();
|
|
44
|
+
const {
|
|
45
|
+
isLoading,
|
|
46
|
+
history,
|
|
47
|
+
textStatus,
|
|
48
|
+
toolbarStatus,
|
|
49
|
+
canvasElement,
|
|
50
|
+
textInputElement
|
|
51
|
+
} = c.store;
|
|
52
|
+
const handleToolBarClick = (type, opt) => {
|
|
53
|
+
c.onToolClick(type, opt);
|
|
54
|
+
if (type === index.ToolbarItemType.AI)
|
|
55
|
+
emit("complete", canvasElement.value.toDataURL("png"));
|
|
56
|
+
};
|
|
57
|
+
vue.onMounted(() => {
|
|
58
|
+
c.domToCanvas(props.element, {
|
|
59
|
+
container: props.container,
|
|
60
|
+
itemClassName: props.itemClassName
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
return {
|
|
64
|
+
c,
|
|
65
|
+
ns,
|
|
66
|
+
history,
|
|
67
|
+
isLoading,
|
|
68
|
+
textStatus,
|
|
69
|
+
toolbarStatus,
|
|
70
|
+
canvasElement,
|
|
71
|
+
textInputElement,
|
|
72
|
+
handleToolBarClick
|
|
73
|
+
};
|
|
74
|
+
},
|
|
75
|
+
render() {
|
|
76
|
+
return vue.createVNode("div", {
|
|
77
|
+
"class": this.ns.b(),
|
|
78
|
+
"id": "screenShotContainer",
|
|
79
|
+
"onMouseup": () => this.c.mouseUpEvent()
|
|
80
|
+
}, [this.isLoading && vue.createVNode("div", {
|
|
81
|
+
"class": "el-loading-mask"
|
|
82
|
+
}, [vue.createVNode("div", {
|
|
83
|
+
"class": "el-loading-spinner"
|
|
84
|
+
}, [vue.createVNode("svg", {
|
|
85
|
+
"class": "circular",
|
|
86
|
+
"viewBox": "0 0 50 50"
|
|
87
|
+
}, [vue.createVNode("circle", {
|
|
88
|
+
"class": "path",
|
|
89
|
+
"cx": "25",
|
|
90
|
+
"cy": "25",
|
|
91
|
+
"r": "20",
|
|
92
|
+
"fill": "none"
|
|
93
|
+
}, null)]), vue.createVNode("p", {
|
|
94
|
+
"class": "el-loading-text"
|
|
95
|
+
}, [ibiz.i18n.t("util.screenShotUtil.prepareCanvas")])])]), this.toolbarStatus && vue.createVNode(screenShotToolbar.ScreenShotToolbar, {
|
|
96
|
+
"history": this.history,
|
|
97
|
+
"class": this.ns.e("toolber"),
|
|
98
|
+
"onItemClick": this.handleToolBarClick
|
|
99
|
+
}, null), vue.createVNode("canvas", {
|
|
100
|
+
"ref": "canvasElement",
|
|
101
|
+
"id": "canvasContainer",
|
|
102
|
+
"class": this.ns.e("canvas"),
|
|
103
|
+
"onMousedown": (evt) => this.c.mouseDownEvent(evt),
|
|
104
|
+
"onMousemove": (evt) => this.c.mouseMoveEvent(evt)
|
|
105
|
+
}, null), vue.createVNode("div", {
|
|
106
|
+
"ref": "textInputElement",
|
|
107
|
+
"id": "textInputContainer",
|
|
108
|
+
"spellcheck": false,
|
|
109
|
+
"contenteditable": true,
|
|
110
|
+
"class": [this.ns.e("text"), this.ns.is("show", this.textStatus)]
|
|
111
|
+
}, null)]);
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
exports.ScreenShot = ScreenShot;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ibiz-screen-shot{--ibiz-screen-shot-mask-color-bg:rgba(122, 122, 122, 0.8);--ibiz-screen-shot-color-border:var(--ibiz-color-border);--ibiz-screen-shot-color-disabled:var(--ibiz-color-disabled-text);--ibiz-screen-shot-toolbar-color-0:var(--ibiz-color-text-3);--ibiz-screen-shot-toolbar-color-1:var(--ibiz-color-text-1);--ibiz-screen-shot-toolbar-color-bg:var(--ibiz-color-bg-2);--ibiz-screen-shot-toolbar-color-active:var(--ibiz-color-primary);position:fixed;top:0;left:0;z-index:999999;width:100%;height:100%;background-color:var(--ibiz-screen-shot-mask-color-bg)}.ibiz-screen-shot__toolber{position:absolute;top:40px;left:50%;z-index:1;transform:translateX(-50%)}.ibiz-screen-shot__canvas{position:absolute}.ibiz-screen-shot__text{position:absolute;top:0;left:0;z-index:1;box-sizing:border-box;display:none;min-width:20px;min-height:20px;padding:0;margin:0;font-weight:700;border:none;outline:0}.ibiz-screen-shot__text.is-show{display:block}
|
package/lib/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.cjs
ADDED
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var vue = require('vue');
|
|
4
|
+
var ElementPlus = require('element-plus');
|
|
5
|
+
var vue3Util = require('@ibiz-template/vue3-util');
|
|
6
|
+
var index = require('../../type/index.cjs');
|
|
7
|
+
var index$1 = require('../../constant/index.cjs');
|
|
8
|
+
require('./screen-shot-toolbar.css');
|
|
9
|
+
|
|
10
|
+
"use strict";
|
|
11
|
+
const ScreenShotToolbar = /* @__PURE__ */ vue.defineComponent({
|
|
12
|
+
name: "IBizScreenShotToolbar",
|
|
13
|
+
props: {
|
|
14
|
+
history: {
|
|
15
|
+
type: Array,
|
|
16
|
+
required: true
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
emits: {
|
|
20
|
+
itemClick: (_type, _opt) => true
|
|
21
|
+
},
|
|
22
|
+
setup(_props, {
|
|
23
|
+
emit
|
|
24
|
+
}) {
|
|
25
|
+
const ns = vue3Util.useNamespace("screen-shot-toolbar");
|
|
26
|
+
const items = vue.reactive(index$1.getDefaultToolbarItems());
|
|
27
|
+
const activeItem = vue.ref(null);
|
|
28
|
+
const onChange = () => {
|
|
29
|
+
const {
|
|
30
|
+
type,
|
|
31
|
+
color,
|
|
32
|
+
size
|
|
33
|
+
} = activeItem.value || {};
|
|
34
|
+
if (!type)
|
|
35
|
+
return;
|
|
36
|
+
emit("itemClick", type, {
|
|
37
|
+
size,
|
|
38
|
+
color
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
const handleSizeClick = (size) => {
|
|
42
|
+
if (activeItem.value)
|
|
43
|
+
activeItem.value.size = size;
|
|
44
|
+
onChange();
|
|
45
|
+
};
|
|
46
|
+
const handleColorChange = (color) => {
|
|
47
|
+
if (activeItem.value)
|
|
48
|
+
activeItem.value.color = color;
|
|
49
|
+
onChange();
|
|
50
|
+
};
|
|
51
|
+
const handleItemClick = (item) => {
|
|
52
|
+
activeItem.value = item;
|
|
53
|
+
onChange();
|
|
54
|
+
};
|
|
55
|
+
const stopPropagation = (e) => {
|
|
56
|
+
e.stopPropagation();
|
|
57
|
+
e.preventDefault();
|
|
58
|
+
};
|
|
59
|
+
return {
|
|
60
|
+
ns,
|
|
61
|
+
items,
|
|
62
|
+
activeItem,
|
|
63
|
+
stopPropagation,
|
|
64
|
+
handleItemClick,
|
|
65
|
+
handleSizeClick,
|
|
66
|
+
handleColorChange
|
|
67
|
+
};
|
|
68
|
+
},
|
|
69
|
+
render() {
|
|
70
|
+
var _a, _b;
|
|
71
|
+
return vue.createVNode("div", {
|
|
72
|
+
"class": this.ns.b(),
|
|
73
|
+
"onClick": this.stopPropagation
|
|
74
|
+
}, [vue.createVNode("div", {
|
|
75
|
+
"class": this.ns.e("content"),
|
|
76
|
+
"onMouseup": this.stopPropagation
|
|
77
|
+
}, [this.items.map((item) => {
|
|
78
|
+
var _a2;
|
|
79
|
+
return vue.createVNode("div", {
|
|
80
|
+
"class": [this.ns.e("item"), this.ns.em("item", item.type), this.ns.is("active", item.type !== index.ToolbarItemType.DRAWDOWN && item.type === ((_a2 = this.activeItem) == null ? void 0 : _a2.type)), this.ns.is("disabled", item.type === index.ToolbarItemType.DRAWDOWN && !this.history.length)],
|
|
81
|
+
"onClick": () => this.handleItemClick(item)
|
|
82
|
+
}, [vue.createVNode("div", {
|
|
83
|
+
"class": this.ns.em("item", "icon"),
|
|
84
|
+
"title": item.text
|
|
85
|
+
}, [item.icon])]);
|
|
86
|
+
})]), ((_a = this.activeItem) == null ? void 0 : _a.size) || ((_b = this.activeItem) == null ? void 0 : _b.color) ? vue.createVNode("div", {
|
|
87
|
+
"class": this.ns.e("item-options")
|
|
88
|
+
}, [vue.createVNode("div", {
|
|
89
|
+
"class": this.ns.em("item-options", "content")
|
|
90
|
+
}, [this.activeItem.sizeOpts ? vue.createVNode("div", {
|
|
91
|
+
"class": this.ns.e("size")
|
|
92
|
+
}, [this.activeItem.sizeOpts.map((item) => vue.createVNode("div", {
|
|
93
|
+
"class": [this.ns.em("size", "item"), this.ns.em("size", item.type), this.ns.is("active", item.value === this.activeItem.size)],
|
|
94
|
+
"title": item.text,
|
|
95
|
+
"onClick": () => this.handleSizeClick(item.value)
|
|
96
|
+
}, null))]) : null, this.activeItem.color ? vue.createVNode("div", {
|
|
97
|
+
"class": this.ns.e("color-picker")
|
|
98
|
+
}, [vue.createVNode(ElementPlus.ElColorPicker, {
|
|
99
|
+
"teleported": false,
|
|
100
|
+
"modelValue": this.activeItem.color,
|
|
101
|
+
"onUpdate:modelValue": ($event) => this.activeItem.color = $event,
|
|
102
|
+
"onChange": this.handleColorChange
|
|
103
|
+
}, null)]) : null])]) : null]);
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
|
|
107
|
+
exports.ScreenShotToolbar = ScreenShotToolbar;
|
package/lib/util/screen-shot-util/screen-shot/components/screen-shot-toolbar/screen-shot-toolbar.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ibiz-screen-shot-toolbar__item{display:flex;align-items:center;justify-content:center;cursor:pointer}.ibiz-screen-shot-toolbar__item--icon{display:flex;align-items:center;justify-content:center}.ibiz-screen-shot-toolbar__item--icon svg{width:1em;height:1em;fill:var(--ibiz-color-text-1)}.ibiz-screen-shot-toolbar__item--divider{width:1px;height:14px;padding:0;pointer-events:none;background:var(--ibiz-color-text-2)}.ibiz-screen-shot-toolbar__item.is-active svg{fill:var(--ibiz-screen-shot-toolbar-color-active)}.ibiz-screen-shot-toolbar__item.is-disabled{pointer-events:none}.ibiz-screen-shot-toolbar__item.is-disabled svg{fill:var(--ibiz-screen-shot-color-disabled)}.ibiz-screen-shot-toolbar__content{display:flex;gap:20px;align-items:center;height:40px;padding:8px 12px;overflow:hidden;font-size:20px;background-color:var(--ibiz-screen-shot-toolbar-color-bg);border:1px solid var(--ibiz-screen-shot-color-border);border-radius:2px}.ibiz-screen-shot-toolbar__item-options{position:relative;height:40px;margin-top:4px}.ibiz-screen-shot-toolbar__item-options--content{position:absolute;display:flex;gap:4px;align-items:center;width:auto;height:40px;padding:4px;background-color:var(--ibiz-screen-shot-toolbar-color-bg);border:1px solid var(--ibiz-screen-shot-color-border);border-radius:2px}.ibiz-screen-shot-toolbar__size{display:flex;align-items:center;height:100%}.ibiz-screen-shot-toolbar__size--item{display:flex;align-items:center;height:100%;padding:0 8px;cursor:pointer}.ibiz-screen-shot-toolbar__size--item::before{display:block;content:"";background-color:var(--ibiz-screen-shot-toolbar-color-0);border-radius:50%}.ibiz-screen-shot-toolbar__size--item.is-active::before{background-color:var(--ibiz-screen-shot-toolbar-color-1)}.ibiz-screen-shot-toolbar__size--small::before{width:4px;height:4px}.ibiz-screen-shot-toolbar__size--medium::before{width:12px;height:12px}.ibiz-screen-shot-toolbar__size--big::before{width:20px;height:20px}.ibiz-screen-shot-toolbar__color-picker .el-button.is-text{display:none}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
require('../icon/index.cjs');
|
|
4
|
+
var index = require('../type/index.cjs');
|
|
5
|
+
var icon = require('../icon/icon.cjs');
|
|
6
|
+
|
|
7
|
+
"use strict";
|
|
8
|
+
function getDefaultToolbarItems() {
|
|
9
|
+
return [
|
|
10
|
+
{
|
|
11
|
+
icon: icon.BrushIcon,
|
|
12
|
+
type: index.ToolbarItemType.BRUSH,
|
|
13
|
+
text: ibiz.i18n.t("util.screenShotUtil.brush"),
|
|
14
|
+
sizeOpts: [
|
|
15
|
+
{
|
|
16
|
+
value: 2,
|
|
17
|
+
type: "small",
|
|
18
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
value: 4,
|
|
22
|
+
type: "medium",
|
|
23
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
value: 8,
|
|
27
|
+
type: "big",
|
|
28
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
29
|
+
}
|
|
30
|
+
],
|
|
31
|
+
size: 2,
|
|
32
|
+
color: "#F53340"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
icon: icon.RectIcon,
|
|
36
|
+
type: index.ToolbarItemType.RECT,
|
|
37
|
+
text: ibiz.i18n.t("util.screenShotUtil.rect"),
|
|
38
|
+
sizeOpts: [
|
|
39
|
+
{
|
|
40
|
+
value: 2,
|
|
41
|
+
type: "small",
|
|
42
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
value: 4,
|
|
46
|
+
type: "medium",
|
|
47
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
value: 8,
|
|
51
|
+
type: "big",
|
|
52
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
53
|
+
}
|
|
54
|
+
],
|
|
55
|
+
size: 2,
|
|
56
|
+
color: "#F53340"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
icon: icon.CircleIcon,
|
|
60
|
+
type: index.ToolbarItemType.CIRCLE,
|
|
61
|
+
text: ibiz.i18n.t("util.screenShotUtil.circle"),
|
|
62
|
+
sizeOpts: [
|
|
63
|
+
{
|
|
64
|
+
value: 2,
|
|
65
|
+
type: "small",
|
|
66
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
67
|
+
},
|
|
68
|
+
{
|
|
69
|
+
value: 4,
|
|
70
|
+
type: "medium",
|
|
71
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
value: 8,
|
|
75
|
+
type: "big",
|
|
76
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
77
|
+
}
|
|
78
|
+
],
|
|
79
|
+
size: 2,
|
|
80
|
+
color: "#F53340"
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
icon: icon.MosaicIcon,
|
|
84
|
+
type: index.ToolbarItemType.MOSAIC,
|
|
85
|
+
text: ibiz.i18n.t("util.screenShotUtil.mosaic"),
|
|
86
|
+
sizeOpts: [
|
|
87
|
+
{
|
|
88
|
+
value: 10,
|
|
89
|
+
type: "small",
|
|
90
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
91
|
+
},
|
|
92
|
+
{
|
|
93
|
+
value: 15,
|
|
94
|
+
type: "medium",
|
|
95
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
value: 20,
|
|
99
|
+
type: "big",
|
|
100
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
101
|
+
}
|
|
102
|
+
],
|
|
103
|
+
size: 10
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
// 文本注释 - 文字标注
|
|
107
|
+
icon: icon.TextIcon,
|
|
108
|
+
type: index.ToolbarItemType.TEXT,
|
|
109
|
+
text: ibiz.i18n.t("util.screenShotUtil.text"),
|
|
110
|
+
sizeOpts: [
|
|
111
|
+
{
|
|
112
|
+
value: 14,
|
|
113
|
+
type: "small",
|
|
114
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
115
|
+
},
|
|
116
|
+
{
|
|
117
|
+
value: 18,
|
|
118
|
+
type: "medium",
|
|
119
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
value: 24,
|
|
123
|
+
type: "big",
|
|
124
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
125
|
+
}
|
|
126
|
+
],
|
|
127
|
+
size: 16,
|
|
128
|
+
color: "#F53340"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
// 箭头工具 - 箭头标注
|
|
132
|
+
icon: icon.ArrowIcon,
|
|
133
|
+
type: index.ToolbarItemType.ARROW,
|
|
134
|
+
text: ibiz.i18n.t("util.screenShotUtil.arrow"),
|
|
135
|
+
sizeOpts: [
|
|
136
|
+
{
|
|
137
|
+
value: 2,
|
|
138
|
+
type: "small",
|
|
139
|
+
text: ibiz.i18n.t("util.screenShotUtil.small")
|
|
140
|
+
},
|
|
141
|
+
{
|
|
142
|
+
value: 4,
|
|
143
|
+
type: "medium",
|
|
144
|
+
text: ibiz.i18n.t("util.screenShotUtil.medium")
|
|
145
|
+
},
|
|
146
|
+
{
|
|
147
|
+
value: 8,
|
|
148
|
+
type: "big",
|
|
149
|
+
text: ibiz.i18n.t("util.screenShotUtil.big")
|
|
150
|
+
}
|
|
151
|
+
],
|
|
152
|
+
size: 2,
|
|
153
|
+
color: "#F53340"
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
// 分割项 - 视觉分隔线(无交互)
|
|
157
|
+
type: index.ToolbarItemType.DIVIDER
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
// 回撤
|
|
161
|
+
icon: icon.DrawdownIcon,
|
|
162
|
+
type: index.ToolbarItemType.DRAWDOWN,
|
|
163
|
+
text: ibiz.i18n.t("util.screenShotUtil.drawdown")
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
// AI助手 - AI分析/标注
|
|
167
|
+
icon: icon.AIIcon,
|
|
168
|
+
type: index.ToolbarItemType.AI,
|
|
169
|
+
text: "AI"
|
|
170
|
+
}
|
|
171
|
+
];
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
exports.getDefaultToolbarItems = getDefaultToolbarItems;
|