ts-glitter 13.8.0 → 13.8.3
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/lowcode/Entry.js +1 -1
- package/lowcode/Entry.ts +1 -1
- package/lowcode/cms-plugin/ai-message.js +230 -155
- package/lowcode/cms-plugin/ai-message.ts +401 -309
- package/lowcode/dialog/image-preview.js +7 -5
- package/lowcode/dialog/image-preview.ts +16 -8
- package/lowcode/glitterBundle/module/html-generate.js +28 -0
- package/lowcode/glitterBundle/module/html-generate.ts +67 -29
- package/lowcode/glitterBundle/plugins/editor-elem.js +24 -18
- package/lowcode/glitterBundle/plugins/editor-elem.ts +30 -25
- package/lowcode/jspage/editor.js +30 -32
- package/lowcode/jspage/editor.ts +563 -541
- package/lowcode/jspage/function-page/setting_editor.ts +2 -1
- package/lowcode/jspage/main.js +1 -3
- package/lowcode/jspage/main.ts +1 -4
- package/lowcode/official_view_component/official/component.js +2 -2
- package/lowcode/official_view_component/official/component.ts +2 -2
- package/package.json +1 -1
- package/src/api-public/controllers/ai-chat.js +4 -1
- package/src/api-public/controllers/ai-chat.js.map +1 -1
- package/src/api-public/controllers/ai-chat.ts +4 -2
- package/src/api-public/services/ai-robot.d.ts +16 -0
- package/src/api-public/services/ai-robot.js +119 -23
- package/src/api-public/services/ai-robot.js.map +1 -1
- package/src/api-public/services/ai-robot.ts +145 -51
- package/src/api-public/services/chat.js +5 -2
- package/src/api-public/services/chat.js.map +1 -1
- package/src/api-public/services/chat.ts +4 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
1
|
+
import {GVC} from '../glitterBundle/GVController.js';
|
|
2
|
+
import {ApiUser} from '../glitter-base/route/user.js';
|
|
3
|
+
import {Chat} from '../glitter-base/route/chat.js';
|
|
4
|
+
import {BgWidget} from '../backend-manager/bg-widget.js';
|
|
5
|
+
import {AiChat} from '../glitter-base/route/ai-chat.js';
|
|
6
|
+
import {ShareDialog} from '../glitterBundle/dialog/ShareDialog.js';
|
|
7
7
|
import {AiPointsApi} from "../glitter-base/route/ai-points-api.js";
|
|
8
8
|
|
|
9
9
|
export class AiMessage {
|
|
@@ -28,9 +28,19 @@ export class AiMessage {
|
|
|
28
28
|
|
|
29
29
|
public static id = `dsmdklweew3`;
|
|
30
30
|
|
|
31
|
-
public static toggle: (visible: boolean) => void = (visible) => {
|
|
31
|
+
public static toggle: (visible: boolean, option?: { key: string, label: string }[]) => void = (visible) => {
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
public static ai_support: { key: string, label: string }[] = []
|
|
32
35
|
|
|
33
|
-
public static aiRobot(cf: {
|
|
36
|
+
public static aiRobot(cf: {
|
|
37
|
+
gvc: GVC;
|
|
38
|
+
userID: string;
|
|
39
|
+
toUser?: string;
|
|
40
|
+
viewType?: string;
|
|
41
|
+
open?: boolean;
|
|
42
|
+
type?: 'preview' | 'def'
|
|
43
|
+
}) {
|
|
34
44
|
const gvc = cf.gvc;
|
|
35
45
|
const html = String.raw;
|
|
36
46
|
cf.userID = `${cf.userID}`;
|
|
@@ -39,8 +49,31 @@ export class AiMessage {
|
|
|
39
49
|
visible: false,
|
|
40
50
|
id: gvc.glitter.getUUID(),
|
|
41
51
|
};
|
|
52
|
+
|
|
42
53
|
return gvc.bindView(() => {
|
|
43
|
-
AiMessage.toggle = (vis) => {
|
|
54
|
+
AiMessage.toggle = (vis, option?: { key: string, label: string }[]) => {
|
|
55
|
+
if (!option) {
|
|
56
|
+
AiMessage.ai_support = [
|
|
57
|
+
{
|
|
58
|
+
key: 'writer',
|
|
59
|
+
label: '文案寫手',
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
key: 'order_analysis',
|
|
63
|
+
label: '訂單分析',
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
key: 'design',
|
|
67
|
+
label: '圖片生成',
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
key: 'operation_guide',
|
|
71
|
+
label: '操作引導',
|
|
72
|
+
}
|
|
73
|
+
]
|
|
74
|
+
} else {
|
|
75
|
+
AiMessage.ai_support = option!
|
|
76
|
+
}
|
|
44
77
|
vm.visible = vis;
|
|
45
78
|
$(document.querySelector('.ai-left')!).addClass(`scroll-out`);
|
|
46
79
|
setTimeout(() => {
|
|
@@ -55,32 +88,34 @@ export class AiMessage {
|
|
|
55
88
|
}
|
|
56
89
|
return new Promise(async (resolve, reject) => {
|
|
57
90
|
resolve(
|
|
58
|
-
html
|
|
59
|
-
class="position-fixed start-0 top-0 vw-100 vh-100"
|
|
60
|
-
style="background: rgba(0,0,0,0.5);z-index:999;"
|
|
61
|
-
onclick="${gvc.event(() => {
|
|
62
|
-
AiMessage.toggle(false);
|
|
63
|
-
})}"
|
|
64
|
-
>
|
|
91
|
+
html`
|
|
65
92
|
<div
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
event.stopPropagation();
|
|
70
|
-
})}"
|
|
71
|
-
>
|
|
72
|
-
${AiMessage.detail({
|
|
73
|
-
gvc: gvc,
|
|
74
|
-
user_id: cf.userID,
|
|
75
|
-
containerHeight: ($('body').height() as any) + 10 + 'px',
|
|
76
|
-
document: document,
|
|
77
|
-
goBack: () => {},
|
|
78
|
-
close: () => {
|
|
93
|
+
class="position-fixed start-0 top-0 vw-100 vh-100"
|
|
94
|
+
style="background: rgba(0,0,0,0.5);z-index:999;"
|
|
95
|
+
onclick="${gvc.event(() => {
|
|
79
96
|
AiMessage.toggle(false);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
97
|
+
})}"
|
|
98
|
+
>
|
|
99
|
+
<div
|
|
100
|
+
class="position-fixed vh-100 top-0 scroll-in bg-white ai-left"
|
|
101
|
+
style="top:0px;width: 500px;height: 100vh;max-width: 100vw;"
|
|
102
|
+
onclick="${gvc.event((e, event) => {
|
|
103
|
+
event.stopPropagation();
|
|
104
|
+
})}"
|
|
105
|
+
>
|
|
106
|
+
${AiMessage.detail({
|
|
107
|
+
gvc: gvc,
|
|
108
|
+
user_id: cf.userID,
|
|
109
|
+
containerHeight: ($('body').height() as any) + 10 + 'px',
|
|
110
|
+
document: document,
|
|
111
|
+
goBack: () => {
|
|
112
|
+
},
|
|
113
|
+
close: () => {
|
|
114
|
+
AiMessage.toggle(false);
|
|
115
|
+
},
|
|
116
|
+
})}
|
|
117
|
+
</div>
|
|
118
|
+
</div>`
|
|
84
119
|
);
|
|
85
120
|
});
|
|
86
121
|
},
|
|
@@ -88,12 +123,21 @@ export class AiMessage {
|
|
|
88
123
|
elem: 'div',
|
|
89
124
|
style: `z-index:99999;bottom:0px;left:0px;`,
|
|
90
125
|
},
|
|
91
|
-
onCreate: async () => {
|
|
126
|
+
onCreate: async () => {
|
|
127
|
+
},
|
|
92
128
|
};
|
|
93
129
|
});
|
|
94
130
|
}
|
|
95
131
|
|
|
96
|
-
public static detail(cf: {
|
|
132
|
+
public static detail(cf: {
|
|
133
|
+
gvc: GVC;
|
|
134
|
+
user_id: string;
|
|
135
|
+
containerHeight: string;
|
|
136
|
+
document: any;
|
|
137
|
+
goBack: () => void;
|
|
138
|
+
close?: () => void;
|
|
139
|
+
hideBar?: boolean
|
|
140
|
+
}) {
|
|
97
141
|
const gvc = cf.gvc;
|
|
98
142
|
const document = cf.document;
|
|
99
143
|
const css = String.raw;
|
|
@@ -101,9 +145,11 @@ export class AiMessage {
|
|
|
101
145
|
|
|
102
146
|
return gvc.bindView(() => {
|
|
103
147
|
const id = gvc.glitter.getUUID();
|
|
148
|
+
|
|
104
149
|
function refresh() {
|
|
105
150
|
gvc.notifyDataChange(id);
|
|
106
151
|
}
|
|
152
|
+
|
|
107
153
|
return {
|
|
108
154
|
bind: id,
|
|
109
155
|
view: () => {
|
|
@@ -175,78 +221,71 @@ export class AiMessage {
|
|
|
175
221
|
}
|
|
176
222
|
|
|
177
223
|
resolve(
|
|
178
|
-
html
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
<
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
224
|
+
html`
|
|
225
|
+
<div
|
|
226
|
+
class="navbar d-flex align-items-center justify-content-between w-100 p-3 ${AiMessage.config.hideBar ? `d-none` : ``}"
|
|
227
|
+
style="background: ${AiMessage.config.color};"
|
|
228
|
+
>
|
|
229
|
+
<div class="d-flex align-items-center pe-3 w-100"
|
|
230
|
+
style="gap:10px;display: flex;align-items: center;">
|
|
231
|
+
<img
|
|
232
|
+
src="https://d3jnmi1tfjgtti.cloudfront.net/file/234285319/size1440_s*px$_sas0s9s0s1sesas0_1697354801736-Glitterlogo.png"
|
|
233
|
+
class="rounded-circle border"
|
|
234
|
+
style="background: white;border-radius: 50%;width: 40px;height: 40px;"
|
|
235
|
+
width="40"
|
|
236
|
+
alt="Albert Flores"
|
|
237
|
+
/>
|
|
238
|
+
<div class="d-flex flex-column px-1 text-white">
|
|
239
|
+
<h6 class="mb-0 text-white d-flex">AI 智能助手</h6>
|
|
240
|
+
${gvc.bindView(() => {
|
|
241
|
+
return {
|
|
242
|
+
bind: 'ai_points_count',
|
|
243
|
+
view: () => {
|
|
244
|
+
return new Promise(async (resolve, reject) => {
|
|
245
|
+
resolve(`剩餘『<span class="fw-bold mx-1">${parseInt(((await AiPointsApi.getSum({})).response.sum), 10).toLocaleString()}</span>』 AI Points`)
|
|
246
|
+
})
|
|
247
|
+
},
|
|
248
|
+
divCreate: {
|
|
249
|
+
class: `fw-500 d-flex`,
|
|
250
|
+
style: `font-size:13px;`
|
|
251
|
+
}
|
|
202
252
|
}
|
|
203
|
-
}
|
|
204
|
-
|
|
253
|
+
})}
|
|
254
|
+
</div>
|
|
255
|
+
<div class="flex-fill" style="flex: 1;"></div>
|
|
256
|
+
<i
|
|
257
|
+
class="fa-regular fa-circle-xmark text-white fs-3 ${cf.close ? `` : `d-none`}"
|
|
258
|
+
onclick="${gvc.event(() => {
|
|
259
|
+
cf.close && cf.close();
|
|
260
|
+
})}"
|
|
261
|
+
></i>
|
|
205
262
|
</div>
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
cf.close && cf.close();
|
|
211
|
-
})}"
|
|
212
|
-
></i>
|
|
213
|
-
</div>
|
|
214
|
-
</div>` +
|
|
215
|
-
html`<div class="d-flex align-items-center p-2 shadow border-bottom" style="gap:10px;">
|
|
263
|
+
</div>` +
|
|
264
|
+
html`
|
|
265
|
+
<div class="d-flex align-items-center p-2 shadow border-bottom"
|
|
266
|
+
style="gap:10px;">
|
|
216
267
|
${(() => {
|
|
217
|
-
const list =
|
|
218
|
-
{
|
|
219
|
-
key: 'writer',
|
|
220
|
-
label: '文案寫手',
|
|
221
|
-
},
|
|
222
|
-
{
|
|
223
|
-
key: 'order_analysis',
|
|
224
|
-
label: '訂單分析',
|
|
225
|
-
},
|
|
226
|
-
{
|
|
227
|
-
key: 'operation_guide',
|
|
228
|
-
label: '操作引導',
|
|
229
|
-
},
|
|
230
|
-
];
|
|
268
|
+
const list = AiMessage.ai_support;
|
|
231
269
|
return list
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
270
|
+
.map((dd) => {
|
|
271
|
+
if (AiMessage.vm.select_bt === dd.key) {
|
|
272
|
+
return html`
|
|
273
|
+
<div class="d-flex align-items-center justify-content-center fw-bold px-2 py-2 fw-500 select-label-ai-message fs-6">
|
|
274
|
+
${dd.label}
|
|
275
|
+
</div>`;
|
|
276
|
+
} else {
|
|
277
|
+
return html`
|
|
278
|
+
<div class="d-flex align-items-center justify-content-center fw-bold px-2 py-2 fw-500 select-btn-ai-message fs-6"
|
|
279
|
+
onclick="${gvc.event(() => {
|
|
280
|
+
AiMessage.vm.select_bt = dd.key as any;
|
|
281
|
+
refresh();
|
|
282
|
+
})}"
|
|
283
|
+
>
|
|
284
|
+
${dd.label}
|
|
285
|
+
</div>`;
|
|
286
|
+
}
|
|
287
|
+
})
|
|
288
|
+
.join('');
|
|
250
289
|
})()}
|
|
251
290
|
</div>`
|
|
252
291
|
);
|
|
@@ -285,7 +324,7 @@ export class AiMessage {
|
|
|
285
324
|
chat_id: [cf.user_id, AiMessage.vm.select_bt].sort().join('-'),
|
|
286
325
|
user_id: cf.user_id,
|
|
287
326
|
}).then(async (res) => {
|
|
288
|
-
await AiChat.sync_data({
|
|
327
|
+
await AiChat.sync_data({type: AiMessage.vm.select_bt});
|
|
289
328
|
vm.data = res.response.data.reverse();
|
|
290
329
|
vm.last_read = res.response.lastRead;
|
|
291
330
|
vm.loading = false;
|
|
@@ -325,57 +364,75 @@ export class AiMessage {
|
|
|
325
364
|
}
|
|
326
365
|
|
|
327
366
|
function add_line(dd: any, index: number) {
|
|
367
|
+
dd.message.text = dd.message.text || ''
|
|
328
368
|
if (dd.user_id == 'manager') {
|
|
329
369
|
dd.user_data = AiMessage.config;
|
|
330
370
|
}
|
|
331
371
|
const replacedString = markdownToHTML(dd.message.text);
|
|
332
|
-
|
|
372
|
+
const width = (document.body.clientWidth < 768)? document.body.clientWidth - 120:348
|
|
333
373
|
if (cf.user_id !== dd.user_id) {
|
|
334
|
-
return html`
|
|
335
|
-
<
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
<div
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
374
|
+
return html`
|
|
375
|
+
<div class="mt-auto d-flex align-items-start ${vm.data[index + 1] && vm.data[index + 1].user_id === dd.user_id ? `mb-1` : `mb-3`}">
|
|
376
|
+
<img
|
|
377
|
+
src="https://d3jnmi1tfjgtti.cloudfront.net/file/234285319/size1440_s*px$_sas0s9s0s1sesas0_1697354801736-Glitterlogo.png"
|
|
378
|
+
class="rounded-circle border"
|
|
379
|
+
width="40"
|
|
380
|
+
style="background: white;border-radius: 50%;width: 40px;height: 40px;"
|
|
381
|
+
/>
|
|
382
|
+
<div class="ps-2 ms-1" style="max-width: ${width}px;">
|
|
383
|
+
<div
|
|
384
|
+
class="p-3 mb-1"
|
|
385
|
+
style="background:#eeeef1;border-top-right-radius: .5rem; border-bottom-right-radius: .5rem; border-bottom-left-radius: .5rem;white-space: normal;"
|
|
386
|
+
>
|
|
387
|
+
${replacedString}
|
|
388
|
+
${dd.message.image ? `<img style="cursor: pointer;width:${width - 40}px;height: ${width - 40}px;"
|
|
389
|
+
src="${dd.message.image}"
|
|
390
|
+
alt="image"
|
|
391
|
+
onclick="${gvc.event(() => {
|
|
392
|
+
gvc.glitter.openDiaLog(new URL('./dialog/image-preview.js', gvc.glitter.root_path).href, 'preview', dd.message.image)
|
|
393
|
+
})}">` : ``}
|
|
394
|
+
<div class="w-100 d-flex align-items-center justify-content-end text-muted fs-sm mt-2 ${!(dd.message.usage) ? `d-none` : ``}"
|
|
395
|
+
style="letter-spacing: 1.2px;">
|
|
396
|
+
${dd.message.usage ? `消耗『${dd.message.usage.toLocaleString()}』點 AI Points` : ``}
|
|
397
|
+
</div>
|
|
398
|
+
</div>
|
|
399
|
+
<div class="fs-sm d-flex text-muted time-tt ${vm.data[index + 1] && vm.data[index + 1].user_id === dd.user_id ? `d-none` : ``}">
|
|
400
|
+
${gvc.glitter.ut.dateFormat(new Date(dd.created_time), 'MM-dd hh:mm')}
|
|
401
|
+
</div>
|
|
351
402
|
</div>
|
|
352
|
-
</div
|
|
353
|
-
</div>`;
|
|
403
|
+
</div>`;
|
|
354
404
|
} else {
|
|
355
|
-
return html`
|
|
356
|
-
<div class="
|
|
357
|
-
<div
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
<
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
405
|
+
return html`
|
|
406
|
+
<div class="d-flex align-items-start justify-content-end ${vm.data[index + 1] && vm.data[index + 1].user_id === dd.user_id ? `mb-1` : `mb-3`}">
|
|
407
|
+
<div class="pe-2 me-1" style="max-width: ${width}px;">
|
|
408
|
+
<div
|
|
409
|
+
class=" text-light p-3 mb-1"
|
|
410
|
+
style="background:#575757;border-top-left-radius: .5rem; border-bottom-right-radius: .5rem; border-bottom-left-radius: .5rem;white-space: normal;"
|
|
411
|
+
>
|
|
412
|
+
${replacedString}
|
|
413
|
+
${dd.message.image ? `<img style="cursor: pointer;width:${width - 40}px;height: ${width - 40}px;"
|
|
414
|
+
src="${dd.message.image}"
|
|
415
|
+
alt="image"
|
|
416
|
+
onclick="${gvc.event(() => {
|
|
417
|
+
gvc.glitter.openDiaLog(new URL('./dialog/image-preview.js', gvc.glitter.root_path).href, 'preview', dd.message.image)
|
|
418
|
+
})}">` : ``}
|
|
419
|
+
</div>
|
|
420
|
+
<div
|
|
421
|
+
class="fw-500 d-flex justify-content-end align-items-center time-tt fs-sm text-muted ${vm.data[index + 1] &&
|
|
422
|
+
vm.data[index + 1].user_id === dd.user_id
|
|
423
|
+
? `d-none`
|
|
424
|
+
: ``}"
|
|
425
|
+
style="gap:5px;"
|
|
426
|
+
>
|
|
427
|
+
<span> ${gvc.glitter.ut.dateFormat(new Date(dd.created_time), 'MM/dd hh:mm')}</span>
|
|
428
|
+
${vm.last_read.find((d2: any) => {
|
|
429
|
+
return d2.user_id !== cf.user_id && new Date(d2.last_read).getTime() >= new Date(dd.created_time).getTime();
|
|
430
|
+
})
|
|
431
|
+
? `已讀`
|
|
432
|
+
: ``}
|
|
433
|
+
</div>
|
|
376
434
|
</div>
|
|
377
|
-
</div
|
|
378
|
-
</div>`;
|
|
435
|
+
</div>`;
|
|
379
436
|
}
|
|
380
437
|
}
|
|
381
438
|
|
|
@@ -458,12 +515,13 @@ export class AiMessage {
|
|
|
458
515
|
bind: viewId,
|
|
459
516
|
view: () => {
|
|
460
517
|
if (vm.loading) {
|
|
461
|
-
return html
|
|
462
|
-
<div class="
|
|
463
|
-
<
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
518
|
+
return html`
|
|
519
|
+
<div class="d-flex align-items-center justify-content-center w-100 flex-column pt-3">
|
|
520
|
+
<div class="spinner-border" role="status">
|
|
521
|
+
<span class="sr-only"></span>
|
|
522
|
+
</div>
|
|
523
|
+
<span class="mt-2">AI 就位中...</span>
|
|
524
|
+
</div>`;
|
|
467
525
|
}
|
|
468
526
|
return html`
|
|
469
527
|
${gvc.bindView(() => {
|
|
@@ -473,49 +531,53 @@ export class AiMessage {
|
|
|
473
531
|
return html`
|
|
474
532
|
<div class="my-auto flex-fill"></div>
|
|
475
533
|
${add_line(
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
534
|
+
{
|
|
535
|
+
user_id: 'robot',
|
|
536
|
+
message: {
|
|
537
|
+
text: [
|
|
538
|
+
{
|
|
539
|
+
key: 'writer',
|
|
540
|
+
text: '您好！我是AI文案寫手，專門協助您撰寫任何文案。',
|
|
541
|
+
},
|
|
542
|
+
{
|
|
543
|
+
key: 'order_analysis',
|
|
544
|
+
text: `您好！我是AI資料分析師，能為您查詢與分析訂單資料，並提供可行的建議。`,
|
|
545
|
+
},
|
|
546
|
+
{
|
|
547
|
+
key: 'operation_guide',
|
|
548
|
+
text: '您好！我是AI後台引導員，能協助你使用平台，如果有任何不了解的地方請直接詢問我。',
|
|
549
|
+
},
|
|
550
|
+
{
|
|
551
|
+
key: 'design',
|
|
552
|
+
text: '您好！我是AI設計師，能協助你生成任何行銷或商品圖面。',
|
|
553
|
+
}
|
|
554
|
+
].find((dd) => {
|
|
555
|
+
return dd.key === AiMessage.vm.select_bt;
|
|
556
|
+
})?.text,
|
|
557
|
+
},
|
|
558
|
+
created_time: new Date().toISOString(),
|
|
495
559
|
},
|
|
496
|
-
|
|
497
|
-
},
|
|
498
|
-
-1
|
|
560
|
+
-1
|
|
499
561
|
)}
|
|
500
562
|
${vm.data
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
563
|
+
.map((dd: any, index: number) => {
|
|
564
|
+
return add_line(dd, index);
|
|
565
|
+
})
|
|
566
|
+
.join('')}
|
|
505
567
|
`;
|
|
506
568
|
},
|
|
507
569
|
divCreate: {
|
|
508
570
|
class: `chatContainer p-3 d-flex flex-column position-relative`,
|
|
509
|
-
style: `overflow-y: auto;height: calc(${cf.containerHeight} - ${240+(parseInt(gvc.glitter.share.top_inset,10)+parseInt(gvc.glitter.share.bottom_inset,10))}px);background: white;padding-top:60px;`,
|
|
571
|
+
style: `overflow-y: auto;height: calc(${cf.containerHeight} - ${240 + (parseInt(gvc.glitter.share.top_inset, 10) + parseInt(gvc.glitter.share.bottom_inset, 10))}px);background: white;padding-top:60px;`,
|
|
510
572
|
},
|
|
511
573
|
onCreate: () => {
|
|
512
574
|
vm.close = false;
|
|
513
575
|
// 取得要監聽的元素
|
|
514
576
|
let targetElement = document.querySelector('.chatContainer')!;
|
|
515
577
|
if (vm.lastScroll === -1) {
|
|
516
|
-
setTimeout(()=>{
|
|
578
|
+
setTimeout(() => {
|
|
517
579
|
document.querySelector('.chatContainer')!.scrollTop = document.querySelector('.chatContainer')!.scrollHeight;
|
|
518
|
-
},100)
|
|
580
|
+
}, 100)
|
|
519
581
|
} else {
|
|
520
582
|
if (vm.prefixScroll) {
|
|
521
583
|
vm.lastScroll = targetElement.scrollHeight - vm.prefixScroll + vm.lastScroll;
|
|
@@ -553,15 +615,19 @@ export class AiMessage {
|
|
|
553
615
|
bind: 'footer-ai',
|
|
554
616
|
view: () => {
|
|
555
617
|
if (vm.ai_loading) {
|
|
556
|
-
return html`
|
|
557
|
-
<div class="
|
|
558
|
-
<div class="
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
618
|
+
return html`
|
|
619
|
+
<div class="d-flex align-items-center justify-content-center ai-waiting flex-fill mx-2">
|
|
620
|
+
<div class="w-100 py-2 bt_ffb40_stroke d-flex align-items-center justify-content-center"
|
|
621
|
+
style="gap: 8px;">
|
|
622
|
+
<div class="spinner-border"
|
|
623
|
+
style="width:20px;height: 20px;"></div>
|
|
624
|
+
AI 解答中
|
|
625
|
+
</div>
|
|
626
|
+
</div>`;
|
|
562
627
|
} else {
|
|
563
628
|
return html`
|
|
564
|
-
<div class="d-flex px-2"
|
|
629
|
+
<div class="d-flex px-2"
|
|
630
|
+
style="overflow-x: auto;gap:5px;">
|
|
565
631
|
${[
|
|
566
632
|
{
|
|
567
633
|
key: 'writer',
|
|
@@ -594,50 +660,61 @@ export class AiMessage {
|
|
|
594
660
|
'如何設定網站佈景主題？',
|
|
595
661
|
],
|
|
596
662
|
},
|
|
663
|
+
{
|
|
664
|
+
key: 'design',
|
|
665
|
+
data: ['家具電商平台宣傳圖，現代極簡主義，背景保持乾淨整潔',
|
|
666
|
+
'服飾店宣傳圖，模特背著名牌包，腳穿高跟鞋']
|
|
667
|
+
}
|
|
597
668
|
]
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
669
|
+
.find((dd) => {
|
|
670
|
+
return dd.key === AiMessage.vm.select_bt;
|
|
671
|
+
})
|
|
672
|
+
?.data.map((dd) => {
|
|
673
|
+
return html`
|
|
674
|
+
<div
|
|
675
|
+
class="insignia insignia-secondary bgf6"
|
|
676
|
+
style="white-space: nowrap;cursor: pointer;"
|
|
677
|
+
onclick="${gvc.event(() => {
|
|
678
|
+
vm.ai_loading = true;
|
|
679
|
+
gvc.notifyDataChange('footer-ai');
|
|
680
|
+
Chat.postMessage({
|
|
681
|
+
chat_id: [cf.user_id, AiMessage.vm.select_bt].sort().join('-'),
|
|
682
|
+
user_id: cf.user_id,
|
|
683
|
+
message: {
|
|
684
|
+
text: dd,
|
|
685
|
+
attachment: '',
|
|
686
|
+
},
|
|
687
|
+
}).then(() => {
|
|
688
|
+
vm.message = '';
|
|
689
|
+
});
|
|
690
|
+
})}"
|
|
691
|
+
>
|
|
692
|
+
${dd}
|
|
693
|
+
</div>`;
|
|
694
|
+
})
|
|
695
|
+
.join('')}
|
|
624
696
|
</div>
|
|
625
|
-
<div class="px-2 d-flex align-items-center w-100 border-0 px-2"
|
|
697
|
+
<div class="px-2 d-flex align-items-center w-100 border-0 px-2"
|
|
698
|
+
style="background: white;border-radius: 0px;">
|
|
626
699
|
${BgWidget.customButton({
|
|
627
|
-
button: {
|
|
628
|
-
|
|
629
|
-
|
|
700
|
+
button: {
|
|
701
|
+
color: 'snow',
|
|
702
|
+
size: 'sm',
|
|
703
|
+
style: 'min-height: 40px;'
|
|
704
|
+
},
|
|
705
|
+
icon: {name: 'fa-regular fa-broom-wide text-dark'},
|
|
706
|
+
text: {name: '重置'},
|
|
630
707
|
event: gvc.event(() => {
|
|
631
708
|
const dialog = new ShareDialog(gvc.glitter);
|
|
632
709
|
dialog.warningMessage({
|
|
633
710
|
text: '重置對話將會刪除之前的提問，<br />使AI重新閱讀上下文，請問是否要重置？',
|
|
634
711
|
callback: (response) => {
|
|
635
712
|
if (response) {
|
|
636
|
-
dialog.dataLoading({
|
|
713
|
+
dialog.dataLoading({visible: true});
|
|
637
714
|
AiChat.reset({
|
|
638
715
|
type: AiMessage.vm.select_bt,
|
|
639
716
|
}).then(() => {
|
|
640
|
-
dialog.dataLoading({
|
|
717
|
+
dialog.dataLoading({visible: false});
|
|
641
718
|
refresh();
|
|
642
719
|
});
|
|
643
720
|
}
|
|
@@ -646,67 +723,69 @@ export class AiMessage {
|
|
|
646
723
|
}),
|
|
647
724
|
})}
|
|
648
725
|
${[
|
|
649
|
-
html
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
divCreate: {
|
|
657
|
-
elem: `textArea`,
|
|
658
|
-
style: `max-height:100px;white-space: pre-wrap; word-wrap: break-word;height:40px;`,
|
|
659
|
-
class: `form-control`,
|
|
660
|
-
option: [
|
|
661
|
-
{
|
|
662
|
-
key: 'placeholder',
|
|
663
|
-
value: '輸入訊息內容',
|
|
664
|
-
},
|
|
665
|
-
{
|
|
666
|
-
key: 'onchange',
|
|
667
|
-
value: gvc.event((e) => {
|
|
668
|
-
vm.message = e.value;
|
|
669
|
-
}),
|
|
670
|
-
},
|
|
671
|
-
],
|
|
672
|
-
},
|
|
673
|
-
onCreate: () => {
|
|
674
|
-
const input = gvc.getBindViewElem(textAreaId).get(0);
|
|
675
|
-
input.addEventListener('input', function () {
|
|
676
|
-
input.style.height = 'auto'; // 重置高度
|
|
677
|
-
input.style.height = input.scrollHeight + 'px'; // 设置为内容高度
|
|
678
|
-
});
|
|
679
|
-
},
|
|
680
|
-
};
|
|
681
|
-
})}
|
|
682
|
-
</div>`,
|
|
683
|
-
html` <button
|
|
684
|
-
type="button"
|
|
685
|
-
class="btn btn-icon btn-lg d-sm-inline-flex ms-1 send-action"
|
|
686
|
-
style="height: 36px;background: ${AiMessage.config.color};"
|
|
687
|
-
onclick="${gvc.event(() => {
|
|
688
|
-
if (vm.message) {
|
|
689
|
-
vm.ai_loading = true;
|
|
690
|
-
gvc.notifyDataChange('footer-ai');
|
|
691
|
-
Chat.postMessage({
|
|
692
|
-
chat_id: [cf.user_id, AiMessage.vm.select_bt].sort().join('-'),
|
|
693
|
-
user_id: cf.user_id,
|
|
694
|
-
message: {
|
|
695
|
-
text: vm.message,
|
|
696
|
-
attachment: '',
|
|
726
|
+
html`
|
|
727
|
+
<div class="position-relative w-100 mx-2">
|
|
728
|
+
${gvc.bindView(() => {
|
|
729
|
+
return {
|
|
730
|
+
bind: textAreaId,
|
|
731
|
+
view: () => {
|
|
732
|
+
return vm.message ?? '';
|
|
697
733
|
},
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
734
|
+
divCreate: {
|
|
735
|
+
elem: `textArea`,
|
|
736
|
+
style: `max-height:100px;white-space: pre-wrap; word-wrap: break-word;height:40px;`,
|
|
737
|
+
class: `form-control`,
|
|
738
|
+
option: [
|
|
739
|
+
{
|
|
740
|
+
key: 'placeholder',
|
|
741
|
+
value: '輸入訊息內容',
|
|
742
|
+
},
|
|
743
|
+
{
|
|
744
|
+
key: 'onchange',
|
|
745
|
+
value: gvc.event((e) => {
|
|
746
|
+
vm.message = e.value;
|
|
747
|
+
}),
|
|
748
|
+
},
|
|
749
|
+
],
|
|
750
|
+
},
|
|
751
|
+
onCreate: () => {
|
|
752
|
+
const input = gvc.getBindViewElem(textAreaId).get(0);
|
|
753
|
+
input.addEventListener('input', function () {
|
|
754
|
+
input.style.height = 'auto'; // 重置高度
|
|
755
|
+
input.style.height = input.scrollHeight + 'px'; // 设置为内容高度
|
|
756
|
+
});
|
|
757
|
+
},
|
|
758
|
+
};
|
|
759
|
+
})}
|
|
760
|
+
</div>`,
|
|
761
|
+
html`
|
|
762
|
+
<button
|
|
763
|
+
type="button"
|
|
764
|
+
class="btn btn-icon btn-lg d-sm-inline-flex ms-1 send-action"
|
|
765
|
+
style="height: 36px;background: ${AiMessage.config.color};"
|
|
766
|
+
onclick="${gvc.event(() => {
|
|
767
|
+
if (vm.message) {
|
|
768
|
+
vm.ai_loading = true;
|
|
769
|
+
gvc.notifyDataChange('footer-ai');
|
|
770
|
+
Chat.postMessage({
|
|
771
|
+
chat_id: [cf.user_id, AiMessage.vm.select_bt].sort().join('-'),
|
|
772
|
+
user_id: cf.user_id,
|
|
773
|
+
message: {
|
|
774
|
+
text: vm.message,
|
|
775
|
+
attachment: '',
|
|
776
|
+
},
|
|
777
|
+
}).then(() => {
|
|
778
|
+
vm.message = '';
|
|
779
|
+
});
|
|
780
|
+
const textArea = gvc.getBindViewElem(textAreaId).get(0);
|
|
781
|
+
textArea.value = '';
|
|
782
|
+
textArea.focus();
|
|
783
|
+
} else {
|
|
784
|
+
}
|
|
785
|
+
})}"
|
|
786
|
+
>
|
|
787
|
+
<i class="fa-regular fa-paper-plane-top"></i>
|
|
788
|
+
</button>`,
|
|
710
789
|
].join('')}
|
|
711
790
|
</div>
|
|
712
791
|
`;
|
|
@@ -715,15 +794,17 @@ export class AiMessage {
|
|
|
715
794
|
},
|
|
716
795
|
divCreate: {
|
|
717
796
|
class: `d-flex flex-column w-100 position-fixed bottom-0 position-lg-absolute py-2 border-top bg-white`,
|
|
718
|
-
style: `gap:8px;${(parseInt(gvc.glitter.share.bottom_inset,10)) ? `padding-bottom:${parseInt(gvc.glitter.share.bottom_inset,10) + 10}px !important
|
|
797
|
+
style: `gap:8px;${(parseInt(gvc.glitter.share.bottom_inset, 10)) ? `padding-bottom:${parseInt(gvc.glitter.share.bottom_inset, 10) + 10}px !important;` : ``}`,
|
|
798
|
+
},
|
|
799
|
+
onCreate: () => {
|
|
719
800
|
},
|
|
720
|
-
onCreate: () => {},
|
|
721
801
|
};
|
|
722
802
|
})}
|
|
723
803
|
`;
|
|
724
804
|
},
|
|
725
805
|
divCreate: {},
|
|
726
|
-
onCreate: () => {
|
|
806
|
+
onCreate: () => {
|
|
807
|
+
},
|
|
727
808
|
onDestroy: () => {
|
|
728
809
|
vm.close = true;
|
|
729
810
|
socket.close();
|
|
@@ -747,15 +828,20 @@ export class AiMessage {
|
|
|
747
828
|
view: () => {
|
|
748
829
|
return html`
|
|
749
830
|
<div class=" card rounded-3">
|
|
750
|
-
<div class="p-3 rounded-top"
|
|
751
|
-
|
|
752
|
-
<
|
|
831
|
+
<div class="p-3 rounded-top"
|
|
832
|
+
style="width: 100%;white-space: normal;background: ${AiMessage.config.color};">
|
|
833
|
+
<div class="text-white fw-bold" style=" font-size: 20px;">
|
|
834
|
+
${AiMessage.config.title ?? ''}
|
|
835
|
+
</div>
|
|
836
|
+
<p class=" text-white mt-2 mb-4"
|
|
837
|
+
style=" font-size: 16px;line-height: 22px;font-weight: 300;">
|
|
838
|
+
${(AiMessage.config.content ?? '').replace(/\n/g, `<br>`)}</p>
|
|
753
839
|
<button
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
840
|
+
class="btn w-100 rounded"
|
|
841
|
+
style=" background-color: rgba(0, 0, 0, 0.2);"
|
|
842
|
+
onclick="${gvc.event(() => {
|
|
843
|
+
goToChat('');
|
|
844
|
+
})}"
|
|
759
845
|
>
|
|
760
846
|
返回聊天
|
|
761
847
|
</button>
|
|
@@ -771,28 +857,34 @@ export class AiMessage {
|
|
|
771
857
|
const returnHtml: any = [];
|
|
772
858
|
const robot = (await ApiUser.getPublicConfig('robot_auto_reply', 'manager')).response.value.question;
|
|
773
859
|
if (robot.length > 0) {
|
|
774
|
-
returnHtml.push(html`
|
|
775
|
-
<div class="
|
|
776
|
-
|
|
860
|
+
returnHtml.push(html`
|
|
861
|
+
<div class=" fw-bold"
|
|
862
|
+
style=" height: 60px;display: flex;align-items: center;justify-content: center;font-size: 16px;">
|
|
863
|
+
<div class="" style="color: black;">即時解答</div>
|
|
864
|
+
</div>`);
|
|
777
865
|
}
|
|
778
866
|
robot.map((dd: any) => {
|
|
779
|
-
returnHtml.push(html
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
867
|
+
returnHtml.push(html`
|
|
868
|
+
<div
|
|
869
|
+
class="rounded-3 w-100 d-flex px-3 btn-white-primary py-2 fw-500"
|
|
870
|
+
style=" "
|
|
871
|
+
onclick="${gvc.event(() => {
|
|
872
|
+
goToChat(dd.ask);
|
|
873
|
+
})}"
|
|
874
|
+
>
|
|
875
|
+
<div style="white-space: normal;" class="flex-fill">${dd.ask}</div>
|
|
876
|
+
<i class="fa-solid fa-paper-plane-top" style="font-size:18px;"
|
|
877
|
+
aria-hidden="true"></i>
|
|
878
|
+
</div>`);
|
|
789
879
|
});
|
|
790
880
|
|
|
791
881
|
resolve(
|
|
792
|
-
|
|
793
|
-
html`
|
|
794
|
-
|
|
795
|
-
|
|
882
|
+
returnHtml.join('') &&
|
|
883
|
+
html`
|
|
884
|
+
<div class="px-3 pb-3"
|
|
885
|
+
style=" display: flex;flex-direction: column;align-items: center;justify-content: center;gap:10px;font-size: 16px;">
|
|
886
|
+
${returnHtml.join('')}
|
|
887
|
+
</div>`
|
|
796
888
|
);
|
|
797
889
|
});
|
|
798
890
|
},
|