qqsl-agent 0.0.2 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/images/floating/arrow-down.png +0 -0
- package/assets/images/floating/history-menu.png +0 -0
- package/assets/images/floating/new-chat.png +0 -0
- package/assets/styles/index.css +6 -1
- package/chat/chat-input/chat-input.component.d.ts +18 -4
- package/chat/chat-sidebar/chat-sidebar.component.d.ts +2 -1
- package/chat/chat.module.d.ts +21 -17
- package/chat/floating-chat/floating-chat.component.d.ts +43 -0
- package/chat/models/knowledge-list.model.d.ts +15 -0
- package/chat/models/send-message.model.d.ts +15 -6
- package/chat/public-api.d.ts +1 -0
- package/esm2020/chat/chat-input/chat-input.component.mjs +92 -19
- package/esm2020/chat/chat-messages/chat-messages.component.mjs +3 -3
- package/esm2020/chat/chat-sidebar/chat-sidebar.component.mjs +8 -5
- package/esm2020/chat/chat.component.mjs +3 -3
- package/esm2020/chat/chat.module.mjs +19 -4
- package/esm2020/chat/floating-chat/floating-chat.component.mjs +228 -0
- package/esm2020/chat/models/knowledge-list.model.mjs +1 -1
- package/esm2020/chat/models/send-message.model.mjs +1 -1
- package/esm2020/chat/public-api.mjs +2 -1
- package/fesm2015/qqsl-agent-chat.mjs +432 -127
- package/fesm2015/qqsl-agent-chat.mjs.map +1 -1
- package/fesm2020/qqsl-agent-chat.mjs +432 -127
- package/fesm2020/qqsl-agent-chat.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -16,11 +16,15 @@ import * as i3 from 'ng-zorro-antd/popover';
|
|
|
16
16
|
import { NzPopoverModule } from 'ng-zorro-antd/popover';
|
|
17
17
|
import * as i4 from 'ng-zorro-antd/radio';
|
|
18
18
|
import { NzRadioModule } from 'ng-zorro-antd/radio';
|
|
19
|
-
import * as i5 from 'ng-zorro-antd/
|
|
20
|
-
import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
|
|
21
|
-
import * as i6 from 'ng-zorro-antd/icon';
|
|
19
|
+
import * as i5 from 'ng-zorro-antd/icon';
|
|
22
20
|
import { NzIconModule } from 'ng-zorro-antd/icon';
|
|
23
|
-
import * as
|
|
21
|
+
import * as i6 from 'ng-zorro-antd/steps';
|
|
22
|
+
import { NzStepsModule } from 'ng-zorro-antd/steps';
|
|
23
|
+
import * as i7 from 'ng-zorro-antd/select';
|
|
24
|
+
import { NzSelectModule } from 'ng-zorro-antd/select';
|
|
25
|
+
import * as i8 from 'ng-zorro-antd/tree-select';
|
|
26
|
+
import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
|
|
27
|
+
import * as i9 from '@angular/forms';
|
|
24
28
|
import { FormsModule } from '@angular/forms';
|
|
25
29
|
import { NzMessageService } from 'ng-zorro-antd/message';
|
|
26
30
|
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
@@ -33,6 +37,7 @@ import { NzButtonModule } from 'ng-zorro-antd/button';
|
|
|
33
37
|
import { NzListModule } from 'ng-zorro-antd/list';
|
|
34
38
|
import { NzSliderModule } from 'ng-zorro-antd/slider';
|
|
35
39
|
import { NzLayoutModule } from 'ng-zorro-antd/layout';
|
|
40
|
+
import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
|
|
36
41
|
import { NzPaginationModule } from 'ng-zorro-antd/pagination';
|
|
37
42
|
|
|
38
43
|
// markdown-stream.service.ts
|
|
@@ -368,47 +373,207 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
368
373
|
}]
|
|
369
374
|
}] });
|
|
370
375
|
|
|
376
|
+
class HttpService {
|
|
377
|
+
constructor() {
|
|
378
|
+
this.http = inject(HttpClient);
|
|
379
|
+
this.storeService = inject(StoreService);
|
|
380
|
+
this.BASE_URL = '/api'; // 或者完整域名
|
|
381
|
+
}
|
|
382
|
+
/**
|
|
383
|
+
* 统一获取 Headers
|
|
384
|
+
*/
|
|
385
|
+
getHeaders() {
|
|
386
|
+
return new HttpHeaders({
|
|
387
|
+
'Content-Type': 'application/json',
|
|
388
|
+
Authorization: `${this.storeService.getToken()}`,
|
|
389
|
+
});
|
|
390
|
+
}
|
|
391
|
+
/**
|
|
392
|
+
* GET 请求
|
|
393
|
+
*/
|
|
394
|
+
get(url, params) {
|
|
395
|
+
return this.http.get(this.formatUrl(url), {
|
|
396
|
+
headers: this.getHeaders(),
|
|
397
|
+
params: this.resolveParams(params),
|
|
398
|
+
});
|
|
399
|
+
}
|
|
400
|
+
/**
|
|
401
|
+
* POST 请求
|
|
402
|
+
*/
|
|
403
|
+
post(url, body) {
|
|
404
|
+
return this.http.post(this.formatUrl(url), body, {
|
|
405
|
+
headers: this.getHeaders(),
|
|
406
|
+
});
|
|
407
|
+
}
|
|
408
|
+
/**
|
|
409
|
+
* PUT 请求
|
|
410
|
+
*/
|
|
411
|
+
put(url, body) {
|
|
412
|
+
return this.http.put(this.formatUrl(url), body, {
|
|
413
|
+
headers: this.getHeaders(),
|
|
414
|
+
});
|
|
415
|
+
}
|
|
416
|
+
/**
|
|
417
|
+
* DELETE 请求
|
|
418
|
+
* 兼容支持:既支持 URL 参数,也支持 Body
|
|
419
|
+
*/
|
|
420
|
+
delete(url, params, body) {
|
|
421
|
+
return this.http.request('DELETE', this.formatUrl(url), {
|
|
422
|
+
headers: this.getHeaders(),
|
|
423
|
+
params: this.resolveParams(params),
|
|
424
|
+
body: body, // HttpClient 的 delete() 方法默认不支持 body,需用 request() 通用方法
|
|
425
|
+
});
|
|
426
|
+
}
|
|
427
|
+
// ================= 私有辅助方法 =================
|
|
428
|
+
/**
|
|
429
|
+
* 统一处理 URL
|
|
430
|
+
* 比如自动拼接 BaseUrl,或者处理斜杠
|
|
431
|
+
*/
|
|
432
|
+
formatUrl(url) {
|
|
433
|
+
if (url.startsWith('http'))
|
|
434
|
+
return url;
|
|
435
|
+
// 确保拼接顺滑
|
|
436
|
+
const baseUrl = this.storeService.getBaseUrl();
|
|
437
|
+
const cleanBase = baseUrl.replace(/\/$/, '');
|
|
438
|
+
const cleanUrl = url.startsWith('/') ? url : `/${url}`;
|
|
439
|
+
return `${cleanBase}${cleanUrl}`;
|
|
440
|
+
}
|
|
441
|
+
/**
|
|
442
|
+
* 统一清洗参数
|
|
443
|
+
* 过滤掉 null 和 undefined,防止传给后端 "null" 字符串
|
|
444
|
+
*/
|
|
445
|
+
resolveParams(params) {
|
|
446
|
+
let httpParams = new HttpParams();
|
|
447
|
+
if (params) {
|
|
448
|
+
Object.keys(params).forEach(key => {
|
|
449
|
+
const value = params[key];
|
|
450
|
+
if (value !== null && value !== undefined) {
|
|
451
|
+
if (Array.isArray(value)) {
|
|
452
|
+
// 支持数组参数 ids: [1, 2] => ids=1&ids=2
|
|
453
|
+
value.forEach(val => (httpParams = httpParams.append(key, val)));
|
|
454
|
+
}
|
|
455
|
+
else {
|
|
456
|
+
httpParams = httpParams.set(key, value);
|
|
457
|
+
}
|
|
458
|
+
}
|
|
459
|
+
});
|
|
460
|
+
}
|
|
461
|
+
return httpParams;
|
|
462
|
+
}
|
|
463
|
+
}
|
|
464
|
+
HttpService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
465
|
+
HttpService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, providedIn: 'root' });
|
|
466
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, decorators: [{
|
|
467
|
+
type: Injectable,
|
|
468
|
+
args: [{
|
|
469
|
+
providedIn: 'root',
|
|
470
|
+
}]
|
|
471
|
+
}] });
|
|
472
|
+
|
|
371
473
|
// chat-input.component.ts
|
|
372
474
|
class ChatInputComponent {
|
|
373
475
|
constructor() {
|
|
374
476
|
this.messages = [];
|
|
477
|
+
this.mode = 'full';
|
|
375
478
|
this.sendMessage = new EventEmitter();
|
|
376
479
|
this.messageChange = new EventEmitter();
|
|
377
480
|
this.enter = new EventEmitter();
|
|
378
481
|
this.paste = new EventEmitter();
|
|
379
|
-
this.httpService = inject(HttpService
|
|
482
|
+
this.httpService = inject(HttpService);
|
|
380
483
|
this.storeService = inject(StoreService);
|
|
381
484
|
this.sseService = inject(SseService);
|
|
382
485
|
this.isEmpty = true;
|
|
383
486
|
this.currentModel = null;
|
|
384
487
|
this.currentKnowledge = [];
|
|
385
488
|
this.modelList = [];
|
|
386
|
-
this.knowledgeList = [];
|
|
387
489
|
this.modelPopoverVisible = false;
|
|
388
490
|
this.knowledgePopoverVisible = false;
|
|
389
491
|
this.deepThink = true;
|
|
492
|
+
this.knowledgeStepIndex = 0;
|
|
493
|
+
this.typesData = [];
|
|
494
|
+
this.categoriesData = [];
|
|
495
|
+
this.tagsData = [];
|
|
496
|
+
this.selectedTypes = [];
|
|
497
|
+
this.selectedCategories = [];
|
|
498
|
+
this.selectedTags = [];
|
|
390
499
|
}
|
|
391
500
|
ngOnInit() {
|
|
392
501
|
this.getModelList();
|
|
393
|
-
this.
|
|
502
|
+
this.loadTypes();
|
|
394
503
|
}
|
|
395
504
|
// 可供交互的模型
|
|
396
505
|
getModelList() {
|
|
397
|
-
this.httpService.get(`${this.storeService.getBaseUrl()}/api/ChatModel/models`).subscribe(
|
|
506
|
+
this.httpService.get(`${this.storeService.getBaseUrl()}/api/ChatModel/models`).subscribe(res => {
|
|
398
507
|
this.modelList = res;
|
|
399
508
|
if (res.length) {
|
|
400
509
|
this.currentModel = res[0];
|
|
401
510
|
}
|
|
402
511
|
});
|
|
403
512
|
}
|
|
404
|
-
|
|
405
|
-
|
|
513
|
+
onTypeChange(types) {
|
|
514
|
+
this.selectedTypes = types;
|
|
515
|
+
this.loadCategories(types);
|
|
516
|
+
this.selectedCategories = [];
|
|
517
|
+
this.selectedTags = [];
|
|
518
|
+
this.tagsData = [];
|
|
519
|
+
this.knowledgeStepIndex = types.length ? 1 : 0;
|
|
520
|
+
}
|
|
521
|
+
onCategoryChange(categories) {
|
|
522
|
+
this.selectedCategories = categories;
|
|
523
|
+
this.loadTags(categories);
|
|
524
|
+
this.selectedTags = [];
|
|
525
|
+
this.knowledgeStepIndex = categories.length ? 2 : 1;
|
|
526
|
+
}
|
|
527
|
+
onTagChange(tags) {
|
|
528
|
+
this.knowledgeStepIndex = tags.length ? 2 : 1;
|
|
529
|
+
}
|
|
530
|
+
// 获取分类
|
|
531
|
+
loadTypes() {
|
|
406
532
|
this.httpService
|
|
407
|
-
.get(`${this.storeService.getBaseUrl()}/api/ChatModel/
|
|
408
|
-
.subscribe(
|
|
409
|
-
this.
|
|
533
|
+
.get(`${this.storeService.getBaseUrl()}/api/ChatModel/knowledgeTypes`)
|
|
534
|
+
.subscribe(res => {
|
|
535
|
+
this.typesData = res;
|
|
410
536
|
});
|
|
411
537
|
}
|
|
538
|
+
// 获取目录
|
|
539
|
+
loadCategories(types) {
|
|
540
|
+
this.httpService
|
|
541
|
+
.post(`${this.storeService.getBaseUrl()}/api/ChatModel/knowledge/catalogs`, {
|
|
542
|
+
types: this.selectedTypes,
|
|
543
|
+
})
|
|
544
|
+
.subscribe(res => {
|
|
545
|
+
this.categoriesData = this.convertToTree(res);
|
|
546
|
+
});
|
|
547
|
+
}
|
|
548
|
+
loadTags(categories) {
|
|
549
|
+
this.httpService
|
|
550
|
+
.post(`${this.storeService.getBaseUrl()}/api/ChatModel/knowledge/tags`, {
|
|
551
|
+
catalog: categories,
|
|
552
|
+
})
|
|
553
|
+
.subscribe(res => {
|
|
554
|
+
this.tagsData = res;
|
|
555
|
+
});
|
|
556
|
+
}
|
|
557
|
+
convertToTree(data) {
|
|
558
|
+
if (Array.isArray(data)) {
|
|
559
|
+
return data.map(item => convertNode(item));
|
|
560
|
+
}
|
|
561
|
+
function convertNode(node) {
|
|
562
|
+
let result = {
|
|
563
|
+
title: node.name || '',
|
|
564
|
+
value: node.iCode,
|
|
565
|
+
key: node.iCode,
|
|
566
|
+
};
|
|
567
|
+
if (node.children && node.children.length > 0) {
|
|
568
|
+
result.children = node.children.map((child) => convertNode(child));
|
|
569
|
+
}
|
|
570
|
+
else {
|
|
571
|
+
result.children = [];
|
|
572
|
+
}
|
|
573
|
+
return result;
|
|
574
|
+
}
|
|
575
|
+
return convertNode(data); // 如果是单个对象
|
|
576
|
+
}
|
|
412
577
|
modelVisibleChange(value) {
|
|
413
578
|
this.modelPopoverVisible = value;
|
|
414
579
|
}
|
|
@@ -462,8 +627,11 @@ class ChatInputComponent {
|
|
|
462
627
|
model: (_b = (_a = this.currentModel) === null || _a === void 0 ? void 0 : _a.iCode) !== null && _b !== void 0 ? _b : '',
|
|
463
628
|
think: this.deepThink,
|
|
464
629
|
question: msg.question,
|
|
465
|
-
|
|
466
|
-
|
|
630
|
+
parameter: {
|
|
631
|
+
type: this.selectedTypes,
|
|
632
|
+
catalogs: this.selectedCategories,
|
|
633
|
+
tags: this.selectedTags,
|
|
634
|
+
},
|
|
467
635
|
};
|
|
468
636
|
this.sendMessage.emit({ message, isRegenerate: true });
|
|
469
637
|
}
|
|
@@ -480,18 +648,21 @@ class ChatInputComponent {
|
|
|
480
648
|
model: (_b = (_a = this.currentModel) === null || _a === void 0 ? void 0 : _a.iCode) !== null && _b !== void 0 ? _b : '',
|
|
481
649
|
think: this.deepThink,
|
|
482
650
|
question: text,
|
|
483
|
-
|
|
484
|
-
|
|
651
|
+
parameter: {
|
|
652
|
+
type: this.selectedTypes,
|
|
653
|
+
catalogs: this.selectedCategories,
|
|
654
|
+
tags: this.selectedTags,
|
|
655
|
+
},
|
|
485
656
|
};
|
|
486
657
|
this.clearInput();
|
|
487
658
|
this.sendMessage.emit({ message, isRegenerate: false });
|
|
488
659
|
}
|
|
489
660
|
}
|
|
490
661
|
ChatInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChatInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
491
|
-
ChatInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatInputComponent, selector: "ngx-chat-input", inputs: { messages: "messages" }, outputs: { sendMessage: "sendMessage", messageChange: "messageChange", enter: "enter", paste: "paste" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editorRef"], descendants: true }, { propertyName: "chatInputWrapper", first: true, predicate: ["chatInputWrapper"], descendants: true }], ngImport: i0, template: "<!-- \u65B0\u804A\u5929\u4F4D\u4E8E\u5C4F\u5E55\u4E2D\u95F4\uFF0C\u53D1\u9001\u6D88\u606F\u4E4B\u540E\u4F4D\u4E8E\u5E95\u90E8 -->\n<div class=\"chat-input-wrapper\" #chatInputWrapper [class.center]=\"!messages.length\">\n <div class=\"new-chat-title\" *ngIf=\"!messages.length\">\n <img src=\"/assets/images/logo.png\" />\n <span>\u4F60\u597D\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u5230\u4F60\uFF1F\u5F00\u59CB\u5BF9\u8BDD\u5427</span>\n </div>\n <div class=\"chat-input\">\n <div\n #editorRef\n class=\"input-creative-editor\"\n contenteditable=\"true\"\n spellcheck=\"false\"\n data-placeholder=\"\u8BF7\u8F93\u5165\u5E76\u53D1\u9001\u6D88\u606F\"\n [attr.data-empty]=\"isEmpty\"\n (input)=\"handleInput()\"\n (keydown.enter)=\"handleEnter($event)\"\n (paste)=\"handlePaste($event)\"\n ></div>\n <div class=\"input-bottom\">\n <div class=\"input-tools\">\n <div class=\"select-tool\" [ngClass]=\"{ 'select-tool-active': deepThink }\" (click)=\"toggleDeepThink()\">\n <svg\n t=\"1764131026949\"\n style=\"width: 14px; height: 14px\"\n class=\"icon\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n p-id=\"5012\"\n width=\"64\"\n height=\"64\"\n >\n <path\n d=\"M903.36 512a795.52 795.52 0 0 1 65.536 136.704c48 132.16 39.616 230.528-25.024 295.168-64.64 64.64-163.008 72.96-295.168 24.96A795.52 795.52 0 0 1 512 903.424a795.52 795.52 0 0 1-136.704 65.536c-132.096 48-230.528 39.616-295.168-25.024-64.64-64.64-72.96-163.008-24.96-295.104 16.64-46.016 38.528-91.52 65.536-136.768A795.52 795.52 0 0 1 55.04 375.232C7.04 243.2 15.36 144.768 80 80.128 144.768 15.488 243.2 7.168 375.296 55.04c46.016 16.64 91.584 38.528 136.768 65.536A795.52 795.52 0 0 1 648.768 55.104c132.096-48 230.464-39.616 295.104 25.024 64.64 64.64 72.96 163.008 25.024 295.104A795.52 795.52 0 0 1 903.36 512z m-53.12-79.424c15.168-28.736 27.968-57.536 38.464-86.4 35.584-98.112 33.92-166.656-5.12-205.696-39.04-39.04-107.648-40.768-205.696-5.12a685.44 685.44 0 0 0-86.4 38.4 1240.96 1240.96 0 0 1 138.432 120.32 1240.832 1240.832 0 0 1 120.32 138.496zM432.576 173.824a685.44 685.44 0 0 0-86.4-38.528c-98.112-35.584-166.656-33.92-205.696 5.12-39.04 39.04-40.768 107.648-5.12 205.696 10.432 28.928 23.296 57.728 38.4 86.4a1240.896 1240.896 0 0 1 120.32-138.432 1240.832 1240.832 0 0 1 138.496-120.32zM173.824 591.488a685.44 685.44 0 0 0-38.464 86.4c-35.648 98.048-33.92 166.592 5.12 205.632 39.04 39.04 107.584 40.768 205.696 5.12a685.44 685.44 0 0 0 86.4-38.4 1240.768 1240.768 0 0 1-138.496-120.32 1240.96 1240.96 0 0 1-120.256-138.432z m495.744 78.08A1112.064 1112.064 0 0 0 802.048 512a1112.064 1112.064 0 0 0-132.48-157.568A1112.128 1112.128 0 0 0 512 221.952a1112.128 1112.128 0 0 0-157.504 132.48A1112.064 1112.064 0 0 0 222.016 512a1112.192 1112.192 0 0 0 132.416 157.568A1112.064 1112.064 0 0 0 512 802.048a1112.128 1112.128 0 0 0 157.568-132.48z m-78.08 180.608c28.672 15.168 57.472 28.032 86.4 38.464 98.048 35.648 166.592 33.92 205.632-5.12 39.04-39.04 40.768-107.584 5.12-205.696a685.504 685.504 0 0 0-38.4-86.4 1240.832 1240.832 0 0 1-120.32 138.496 1240.96 1240.96 0 0 1-138.432 120.32zM585.088 512a73.152 73.152 0 1 1-146.24 0 73.152 73.152 0 0 1 146.304 0z\"\n fill=\"currentColor\"\n p-id=\"5013\"\n ></path>\n </svg>\n \u6DF1\u5EA6\u601D\u8003\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"modelListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/toggle-model.png\" style=\"width: 12px; height: 12px\" />\n {{ currentModel ? currentModel?.name : '\u9009\u62E9\u6A21\u578B' }}\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"knowledgeListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"knowledgePopoverVisible\"\n (nzPopoverVisibleChange)=\"knowledgeVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/relate.png\" style=\"width: 14px; height: 8px\" />\n \u5173\u8054\u77E5\u8BC6\u5E93\n </div>\n </div>\n <img class=\"send\" src=\"/assets/images/input/send.png\" (click)=\"send()\" [hidden]=\"sseService.loading$ | async\" />\n <div class=\"send-loading\" *ngIf=\"sseService.loading$ | async\">\n <div class=\"send-loading-inner\">\n <svg viewBox=\"0 0 36 36\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" data-icon=\"spin\">\n <defs>\n <linearGradient x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"100%\" id=\"linearGradient-1\">\n <stop stop-color=\"currentColor\" stop-opacity=\"0\" offset=\"0%\"></stop>\n <stop stop-color=\"currentColor\" stop-opacity=\"0.50\" offset=\"39.9430698%\"></stop>\n <stop stop-color=\"currentColor\" offset=\"100%\"></stop>\n </linearGradient>\n </defs>\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <rect fill-opacity=\"0.01\" fill=\"none\" x=\"0\" y=\"0\" width=\"36\" height=\"36\"></rect>\n <path\n d=\"M34,18 C34,9.163444 26.836556,2 18,2 C11.6597233,2 6.18078805,5.68784135 3.59122325,11.0354951\"\n stroke=\"url(#linearGradient-1)\"\n stroke-width=\"4\"\n stroke-linecap=\"round\"\n ></path>\n </g>\n </svg>\n </div>\n </div>\n <!-- <img class=\"send\" src=\"/assets/images/input/send-gray.png\" /> -->\n </div>\n </div>\n <div class=\"chat-input-backdrop\"></div>\n</div>\n\n<ng-template #modelListContent>\n <div style=\"width: 200px\">\n <div class=\"select-title\">\n \u5207\u6362\u6A21\u578B\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-radio-group [(ngModel)]=\"currentModel\">\n <label\n nz-radio\n [nzValue]=\"item\"\n [style.margin-top.px]=\"i === 0 ? 0 : 10\"\n *ngFor=\"let item of modelList; let i = index\"\n >\n {{ item.name }}\n </label>\n </nz-radio-group>\n </div>\n </div>\n</ng-template>\n\n<ng-template #knowledgeListContent>\n <div style=\"width: 150px\">\n <div class=\"select-title\">\n \u5173\u8054\u77E5\u8BC6\u5E93\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"knowledgeVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-checkbox-wrapper style=\"width: 100%\" (nzOnChange)=\"knowledgeSelectChange($event)\">\n <div *ngFor=\"let item of knowledgeList\">\n <label nz-checkbox [nzValue]=\"item.iCode\">{{ item.name }}</label>\n </div>\n </nz-checkbox-wrapper>\n </div>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";.chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;max-width:800px;min-width:350px;margin:0 auto;padding-bottom:40px}.chat-input-wrapper.center{bottom:50%;transform:translateY(50%)}.new-chat-title{display:flex;align-items:center;justify-content:center;padding-bottom:40px;text-align:center;font-weight:500;font-size:24px;color:#000}.new-chat-title img{width:40px;height:32px;margin-right:12px;margin-top:-6px}.chat-input{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:20px 18px;margin:0 auto;background:#FFFFFF;box-shadow:0 2px 8px #0000001a;border-radius:20px;border:1px solid #D9DADB;z-index:30}.chat-input .input-creative-editor{min-height:60px;max-height:300px;overflow-y:auto;outline:none;box-shadow:none;border:none}.chat-input .input-creative-editor[data-empty=true]:before{content:attr(data-placeholder);color:#9a9b9b}.chat-input .input-bottom{padding-top:16px;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none}.chat-input .input-bottom .input-tools{display:flex;align-items:center;gap:10px}.chat-input .input-bottom .select-tool{display:flex;align-items:center;justify-content:center;height:36px;padding:0 12px;gap:12px;background:#FFFFFF;border-radius:12px;border:1px solid #DBDCE0;cursor:pointer}.chat-input .input-bottom .select-tool-active{border-color:#b7c8fe;color:#3964fe;background:#edf3fe}.chat-input .input-bottom .send{width:32px;height:32px}::ng-deep .params-select-popover .ant-popover-inner{border-radius:10px}::ng-deep .params-select-popover .select-title{display:flex;align-items:center;justify-content:center;position:relative}::ng-deep .params-select-popover .select-title i{position:absolute;right:0;top:3px;cursor:pointer}::ng-deep .params-select-popover .select-content{max-height:200px;padding:16px 0;overflow-y:auto}.chat-input-backdrop{position:absolute;bottom:0;left:0;width:100%;height:100px;z-index:10;background-image:linear-gradient(to bottom,hsl(0,0%,99%),hsla(0,0%,99%,.8))}.send-loading{min-width:34px;height:34px;border-radius:50%;margin-top:auto;display:flex;flex-shrink:0;align-items:center;flex-direction:column;justify-content:center;cursor:not-allowed;white-space:nowrap;color:#fff;background:#3964fe;transition:background .2s;opacity:.4}.send-loading-inner{width:16px;height:16px}.send-loading svg{will-change:transform;animation:.6s linear infinite send-loading}@keyframes send-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "directive", type: i3.NzPopoverDirective, selector: "[nz-popover]", inputs: ["nzPopoverArrowPointAtCenter", "nzPopoverTitle", "nzPopoverContent", "nz-popover", "nzPopoverTrigger", "nzPopoverPlacement", "nzPopoverOrigin", "nzPopoverVisible", "nzPopoverMouseEnterDelay", "nzPopoverMouseLeaveDelay", "nzPopoverOverlayClassName", "nzPopoverOverlayStyle", "nzPopoverBackdrop"], outputs: ["nzPopoverVisibleChange"], exportAs: ["nzPopover"] }, { kind: "component", type: i4.NzRadioComponent, selector: "[nz-radio],[nz-radio-button]", inputs: ["nzValue", "nzDisabled", "nzAutoFocus"], exportAs: ["nzRadio"] }, { kind: "component", type: i4.NzRadioGroupComponent, selector: "nz-radio-group", inputs: ["nzDisabled", "nzButtonStyle", "nzSize", "nzName"], exportAs: ["nzRadioGroup"] }, { kind: "component", type: i5.NzCheckboxComponent, selector: "[nz-checkbox]", inputs: ["nzValue", "nzAutoFocus", "nzDisabled", "nzIndeterminate", "nzChecked", "nzId"], outputs: ["nzCheckedChange"], exportAs: ["nzCheckbox"] }, { kind: "component", type: i5.NzCheckboxWrapperComponent, selector: "nz-checkbox-wrapper", outputs: ["nzOnChange"], exportAs: ["nzCheckboxWrapper"] }, { kind: "directive", type: i6.NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
|
|
662
|
+
ChatInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatInputComponent, selector: "ngx-chat-input", inputs: { messages: "messages", mode: "mode" }, outputs: { sendMessage: "sendMessage", messageChange: "messageChange", enter: "enter", paste: "paste" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editorRef"], descendants: true }, { propertyName: "chatInputWrapper", first: true, predicate: ["chatInputWrapper"], descendants: true }], ngImport: i0, template: "<!-- \u65B0\u804A\u5929\u4F4D\u4E8E\u5C4F\u5E55\u4E2D\u95F4\uFF0C\u53D1\u9001\u6D88\u606F\u4E4B\u540E\u4F4D\u4E8E\u5E95\u90E8 -->\n<div\n class=\"chat-input-wrapper\"\n #chatInputWrapper\n [class.center]=\"!messages.length\"\n [ngStyle]=\"{ 'padding-bottom': mode === 'full' ? '40px' : '10px' }\"\n>\n <div class=\"new-chat-title\" *ngIf=\"!messages.length\">\n <img src=\"/assets/images/logo.png\" />\n <span>\u4F60\u597D\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u5230\u4F60\uFF1F\u5F00\u59CB\u5BF9\u8BDD\u5427</span>\n </div>\n <div class=\"chat-input\">\n <div\n #editorRef\n class=\"input-creative-editor\"\n contenteditable=\"true\"\n spellcheck=\"false\"\n data-placeholder=\"\u8BF7\u8F93\u5165\u5E76\u53D1\u9001\u6D88\u606F\"\n [attr.data-empty]=\"isEmpty\"\n (input)=\"handleInput()\"\n (keydown.enter)=\"handleEnter($event)\"\n (paste)=\"handlePaste($event)\"\n ></div>\n <div class=\"input-bottom\">\n <div class=\"input-tools\">\n <div class=\"select-tool\" [ngClass]=\"{ 'select-tool-active': deepThink }\" (click)=\"toggleDeepThink()\">\n <svg\n t=\"1764131026949\"\n style=\"width: 14px; height: 14px\"\n class=\"icon\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n p-id=\"5012\"\n width=\"64\"\n height=\"64\"\n >\n <path\n d=\"M903.36 512a795.52 795.52 0 0 1 65.536 136.704c48 132.16 39.616 230.528-25.024 295.168-64.64 64.64-163.008 72.96-295.168 24.96A795.52 795.52 0 0 1 512 903.424a795.52 795.52 0 0 1-136.704 65.536c-132.096 48-230.528 39.616-295.168-25.024-64.64-64.64-72.96-163.008-24.96-295.104 16.64-46.016 38.528-91.52 65.536-136.768A795.52 795.52 0 0 1 55.04 375.232C7.04 243.2 15.36 144.768 80 80.128 144.768 15.488 243.2 7.168 375.296 55.04c46.016 16.64 91.584 38.528 136.768 65.536A795.52 795.52 0 0 1 648.768 55.104c132.096-48 230.464-39.616 295.104 25.024 64.64 64.64 72.96 163.008 25.024 295.104A795.52 795.52 0 0 1 903.36 512z m-53.12-79.424c15.168-28.736 27.968-57.536 38.464-86.4 35.584-98.112 33.92-166.656-5.12-205.696-39.04-39.04-107.648-40.768-205.696-5.12a685.44 685.44 0 0 0-86.4 38.4 1240.96 1240.96 0 0 1 138.432 120.32 1240.832 1240.832 0 0 1 120.32 138.496zM432.576 173.824a685.44 685.44 0 0 0-86.4-38.528c-98.112-35.584-166.656-33.92-205.696 5.12-39.04 39.04-40.768 107.648-5.12 205.696 10.432 28.928 23.296 57.728 38.4 86.4a1240.896 1240.896 0 0 1 120.32-138.432 1240.832 1240.832 0 0 1 138.496-120.32zM173.824 591.488a685.44 685.44 0 0 0-38.464 86.4c-35.648 98.048-33.92 166.592 5.12 205.632 39.04 39.04 107.584 40.768 205.696 5.12a685.44 685.44 0 0 0 86.4-38.4 1240.768 1240.768 0 0 1-138.496-120.32 1240.96 1240.96 0 0 1-120.256-138.432z m495.744 78.08A1112.064 1112.064 0 0 0 802.048 512a1112.064 1112.064 0 0 0-132.48-157.568A1112.128 1112.128 0 0 0 512 221.952a1112.128 1112.128 0 0 0-157.504 132.48A1112.064 1112.064 0 0 0 222.016 512a1112.192 1112.192 0 0 0 132.416 157.568A1112.064 1112.064 0 0 0 512 802.048a1112.128 1112.128 0 0 0 157.568-132.48z m-78.08 180.608c28.672 15.168 57.472 28.032 86.4 38.464 98.048 35.648 166.592 33.92 205.632-5.12 39.04-39.04 40.768-107.584 5.12-205.696a685.504 685.504 0 0 0-38.4-86.4 1240.832 1240.832 0 0 1-120.32 138.496 1240.96 1240.96 0 0 1-138.432 120.32zM585.088 512a73.152 73.152 0 1 1-146.24 0 73.152 73.152 0 0 1 146.304 0z\"\n fill=\"currentColor\"\n p-id=\"5013\"\n ></path>\n </svg>\n \u6DF1\u5EA6\u601D\u8003\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"modelListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/toggle-model.png\" style=\"width: 12px; height: 12px\" />\n {{ currentModel ? currentModel?.name : '\u9009\u62E9\u6A21\u578B' }}\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"knowledgeListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"knowledgePopoverVisible\"\n (nzPopoverVisibleChange)=\"knowledgeVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/relate.png\" style=\"width: 14px; height: 8px\" />\n \u5173\u8054\u77E5\u8BC6\u5E93\n </div>\n </div>\n <img class=\"send\" src=\"/assets/images/input/send.png\" (click)=\"send()\" [hidden]=\"sseService.loading$ | async\" />\n <div class=\"send-loading\" *ngIf=\"sseService.loading$ | async\">\n <div class=\"send-loading-inner\">\n <svg viewBox=\"0 0 36 36\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" data-icon=\"spin\">\n <defs>\n <linearGradient x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"100%\" id=\"linearGradient-1\">\n <stop stop-color=\"currentColor\" stop-opacity=\"0\" offset=\"0%\"></stop>\n <stop stop-color=\"currentColor\" stop-opacity=\"0.50\" offset=\"39.9430698%\"></stop>\n <stop stop-color=\"currentColor\" offset=\"100%\"></stop>\n </linearGradient>\n </defs>\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <rect fill-opacity=\"0.01\" fill=\"none\" x=\"0\" y=\"0\" width=\"36\" height=\"36\"></rect>\n <path\n d=\"M34,18 C34,9.163444 26.836556,2 18,2 C11.6597233,2 6.18078805,5.68784135 3.59122325,11.0354951\"\n stroke=\"url(#linearGradient-1)\"\n stroke-width=\"4\"\n stroke-linecap=\"round\"\n ></path>\n </g>\n </svg>\n </div>\n </div>\n <!-- <img class=\"send\" src=\"/assets/images/input/send-gray.png\" /> -->\n </div>\n </div>\n <div class=\"chat-input-backdrop\"></div>\n</div>\n\n<ng-template #modelListContent>\n <div style=\"width: 200px\">\n <div class=\"select-title\">\n \u5207\u6362\u6A21\u578B\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-radio-group [(ngModel)]=\"currentModel\">\n <label\n nz-radio\n [nzValue]=\"item\"\n [style.margin-top.px]=\"i === 0 ? 0 : 10\"\n *ngFor=\"let item of modelList; let i = index\"\n >\n {{ item.name }}\n </label>\n </nz-radio-group>\n </div>\n </div>\n</ng-template>\n\n<ng-template #knowledgeListContent>\n <div style=\"width: 250px\">\n <div class=\"select-title\">\n \u5173\u8054\u77E5\u8BC6\u5E93\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"knowledgeVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-steps [nzCurrent]=\"knowledgeStepIndex\" nzProgressDot nzDirection=\"vertical\" nzSize=\"small\">\n <nz-step nzTitle=\"\u9009\u62E9\u5206\u7C7B\" [nzDescription]=\"typeSelectTpl\">\n <ng-template #typeSelectTpl>\n <nz-select\n [(ngModel)]=\"selectedTypes\"\n nzMode=\"multiple\"\n style=\"width: 100%\"\n (ngModelChange)=\"onTypeChange($event)\"\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u5206\u7C7B\"\n >\n <nz-option [nzValue]=\"item.type\" [nzLabel]=\"item.typeC\" *ngFor=\"let item of typesData\"></nz-option>\n </nz-select>\n </ng-template>\n </nz-step>\n <nz-step nzTitle=\"\u641C\u7D22\u9009\u62E9\u76EE\u5F55\" [nzDescription]=\"categorySelectTpl\">\n <ng-template #categorySelectTpl>\n <nz-tree-select\n style=\"width: 100%\"\n [(ngModel)]=\"selectedCategories\"\n [nzNodes]=\"categoriesData\"\n (ngModelChange)=\"onCategoryChange($event)\"\n nzCheckStrictly\n nzShowSearch\n nzCheckable\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u76EE\u5F55\"\n ></nz-tree-select>\n </ng-template>\n </nz-step>\n <nz-step nzTitle=\"\u9009\u62E9\u6807\u7B7E\" [nzDescription]=\"tagSelectTpl\">\n <ng-template #tagSelectTpl>\n <nz-select\n [(ngModel)]=\"selectedTags\"\n nzMode=\"multiple\"\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u6807\u7B7E\"\n style=\"width: 100%\"\n (ngModelChange)=\"onTagChange($event)\"\n >\n <nz-option-group [nzLabel]=\"item.name\" *ngFor=\"let item of tagsData\">\n <nz-option\n [nzValue]=\"child.iCode\"\n [nzLabel]=\"child.name\"\n *ngFor=\"let child of item.children\"\n ></nz-option>\n </nz-option-group>\n </nz-select>\n </ng-template>\n </nz-step>\n </nz-steps>\n </div>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:host{width:100%;container-type:inline-size;container-name:chat-container}.chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;max-width:800px;min-width:350px;margin:0 auto;padding-bottom:40px}@container chat-container (max-width: 1000px){.chat-input-wrapper{max-width:90%}}.chat-input-wrapper.center{bottom:50%;transform:translateY(50%)}.new-chat-title{display:flex;align-items:center;justify-content:center;padding-bottom:40px;text-align:center;font-weight:500;font-size:24px;color:#000}.new-chat-title img{width:40px;height:32px;margin-right:12px;margin-top:-6px}.chat-input{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:20px 18px;margin:0 auto;background:#FFFFFF;box-shadow:0 2px 8px #0000001a;border-radius:20px;border:1px solid #D9DADB;z-index:30}.chat-input .input-creative-editor{min-height:60px;max-height:300px;overflow-y:auto;outline:none;box-shadow:none;border:none}.chat-input .input-creative-editor[data-empty=true]:before{content:attr(data-placeholder);color:#9a9b9b}.chat-input .input-bottom{padding-top:16px;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none}.chat-input .input-bottom .input-tools{display:flex;align-items:center;gap:10px}.chat-input .input-bottom .select-tool{display:flex;align-items:center;justify-content:center;height:36px;padding:0 12px;gap:12px;background:#FFFFFF;border-radius:12px;border:1px solid #DBDCE0;cursor:pointer}.chat-input .input-bottom .select-tool-active{border-color:#b7c8fe;color:#3964fe;background:#edf3fe}.chat-input .input-bottom .send{width:32px;height:32px}::ng-deep .params-select-popover .ant-popover-inner{border-radius:10px}::ng-deep .params-select-popover .select-title{display:flex;align-items:center;justify-content:center;position:relative}::ng-deep .params-select-popover .select-title i{position:absolute;right:0;top:3px;cursor:pointer}::ng-deep .params-select-popover .select-content{max-height:400px;padding:16px 0 16px 1px;overflow-y:auto}.chat-input-backdrop{position:absolute;bottom:0;left:0;width:100%;height:100px;z-index:10;background-image:linear-gradient(to bottom,hsl(0,0%,99%),hsla(0,0%,99%,.8))}.send-loading{min-width:34px;height:34px;border-radius:50%;margin-top:auto;display:flex;flex-shrink:0;align-items:center;flex-direction:column;justify-content:center;cursor:not-allowed;white-space:nowrap;color:#fff;background:#3964fe;transition:background .2s;opacity:.4}.send-loading-inner{width:16px;height:16px}.send-loading svg{will-change:transform;animation:.6s linear infinite send-loading}@keyframes send-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "directive", type: i3.NzPopoverDirective, selector: "[nz-popover]", inputs: ["nzPopoverArrowPointAtCenter", "nzPopoverTitle", "nzPopoverContent", "nz-popover", "nzPopoverTrigger", "nzPopoverPlacement", "nzPopoverOrigin", "nzPopoverVisible", "nzPopoverMouseEnterDelay", "nzPopoverMouseLeaveDelay", "nzPopoverOverlayClassName", "nzPopoverOverlayStyle", "nzPopoverBackdrop"], outputs: ["nzPopoverVisibleChange"], exportAs: ["nzPopover"] }, { kind: "component", type: i4.NzRadioComponent, selector: "[nz-radio],[nz-radio-button]", inputs: ["nzValue", "nzDisabled", "nzAutoFocus"], exportAs: ["nzRadio"] }, { kind: "component", type: i4.NzRadioGroupComponent, selector: "nz-radio-group", inputs: ["nzDisabled", "nzButtonStyle", "nzSize", "nzName"], exportAs: ["nzRadioGroup"] }, { kind: "directive", type: i5.NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: i6.NzStepsComponent, selector: "nz-steps", inputs: ["nzCurrent", "nzDirection", "nzLabelPlacement", "nzType", "nzSize", "nzStartIndex", "nzStatus", "nzProgressDot"], outputs: ["nzIndexChange"], exportAs: ["nzSteps"] }, { kind: "component", type: i6.NzStepComponent, selector: "nz-step", inputs: ["nzTitle", "nzSubtitle", "nzDescription", "nzDisabled", "nzPercentage", "nzSize", "nzStatus", "nzIcon"], exportAs: ["nzStep"] }, { kind: "component", type: i7.NzOptionComponent, selector: "nz-option", inputs: ["nzLabel", "nzValue", "nzDisabled", "nzHide", "nzCustomContent"], exportAs: ["nzOption"] }, { kind: "component", type: i7.NzSelectComponent, selector: "nz-select", inputs: ["nzId", "nzSize", "nzStatus", "nzOptionHeightPx", "nzOptionOverflowSize", "nzDropdownClassName", "nzDropdownMatchSelectWidth", "nzDropdownStyle", "nzNotFoundContent", "nzPlaceHolder", "nzPlacement", "nzMaxTagCount", "nzDropdownRender", "nzCustomTemplate", "nzSuffixIcon", "nzClearIcon", "nzRemoveIcon", "nzMenuItemSelectedIcon", "nzTokenSeparators", "nzMaxTagPlaceholder", "nzMaxMultipleCount", "nzMode", "nzFilterOption", "compareWith", "nzAllowClear", "nzBorderless", "nzShowSearch", "nzLoading", "nzAutoFocus", "nzAutoClearSearchValue", "nzServerSearch", "nzDisabled", "nzOpen", "nzSelectOnTab", "nzBackdrop", "nzOptions", "nzShowArrow"], outputs: ["nzOnSearch", "nzScrollToBottom", "nzOpenChange", "nzBlur", "nzFocus"], exportAs: ["nzSelect"] }, { kind: "component", type: i7.NzOptionGroupComponent, selector: "nz-option-group", inputs: ["nzLabel"], exportAs: ["nzOptionGroup"] }, { kind: "component", type: i8.NzTreeSelectComponent, selector: "nz-tree-select", inputs: ["nzId", "nzAllowClear", "nzShowExpand", "nzShowLine", "nzDropdownMatchSelectWidth", "nzCheckable", "nzHideUnMatched", "nzShowIcon", "nzShowSearch", "nzDisabled", "nzAsyncData", "nzMultiple", "nzDefaultExpandAll", "nzCheckStrictly", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzExpandedIcon", "nzNotFoundContent", "nzNodes", "nzOpen", "nzSize", "nzPlaceHolder", "nzDropdownStyle", "nzDropdownClassName", "nzBackdrop", "nzStatus", "nzPlacement", "nzExpandedKeys", "nzDisplayWith", "nzMaxTagCount", "nzMaxTagPlaceholder", "nzTreeTemplate"], outputs: ["nzOpenChange", "nzCleared", "nzRemoved", "nzExpandChange", "nzTreeClick", "nzTreeCheckBoxChange"], exportAs: ["nzTreeSelect"] }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
|
|
492
663
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChatInputComponent, decorators: [{
|
|
493
664
|
type: Component,
|
|
494
|
-
args: [{ selector: 'ngx-chat-input', template: "<!-- \u65B0\u804A\u5929\u4F4D\u4E8E\u5C4F\u5E55\u4E2D\u95F4\uFF0C\u53D1\u9001\u6D88\u606F\u4E4B\u540E\u4F4D\u4E8E\u5E95\u90E8 -->\n<div class=\"chat-input-wrapper\" #chatInputWrapper [class.center]=\"!messages.length\">\n <div class=\"new-chat-title\" *ngIf=\"!messages.length\">\n <img src=\"/assets/images/logo.png\" />\n <span>\u4F60\u597D\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u5230\u4F60\uFF1F\u5F00\u59CB\u5BF9\u8BDD\u5427</span>\n </div>\n <div class=\"chat-input\">\n <div\n #editorRef\n class=\"input-creative-editor\"\n contenteditable=\"true\"\n spellcheck=\"false\"\n data-placeholder=\"\u8BF7\u8F93\u5165\u5E76\u53D1\u9001\u6D88\u606F\"\n [attr.data-empty]=\"isEmpty\"\n (input)=\"handleInput()\"\n (keydown.enter)=\"handleEnter($event)\"\n (paste)=\"handlePaste($event)\"\n ></div>\n <div class=\"input-bottom\">\n <div class=\"input-tools\">\n <div class=\"select-tool\" [ngClass]=\"{ 'select-tool-active': deepThink }\" (click)=\"toggleDeepThink()\">\n <svg\n t=\"1764131026949\"\n style=\"width: 14px; height: 14px\"\n class=\"icon\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n p-id=\"5012\"\n width=\"64\"\n height=\"64\"\n >\n <path\n d=\"M903.36 512a795.52 795.52 0 0 1 65.536 136.704c48 132.16 39.616 230.528-25.024 295.168-64.64 64.64-163.008 72.96-295.168 24.96A795.52 795.52 0 0 1 512 903.424a795.52 795.52 0 0 1-136.704 65.536c-132.096 48-230.528 39.616-295.168-25.024-64.64-64.64-72.96-163.008-24.96-295.104 16.64-46.016 38.528-91.52 65.536-136.768A795.52 795.52 0 0 1 55.04 375.232C7.04 243.2 15.36 144.768 80 80.128 144.768 15.488 243.2 7.168 375.296 55.04c46.016 16.64 91.584 38.528 136.768 65.536A795.52 795.52 0 0 1 648.768 55.104c132.096-48 230.464-39.616 295.104 25.024 64.64 64.64 72.96 163.008 25.024 295.104A795.52 795.52 0 0 1 903.36 512z m-53.12-79.424c15.168-28.736 27.968-57.536 38.464-86.4 35.584-98.112 33.92-166.656-5.12-205.696-39.04-39.04-107.648-40.768-205.696-5.12a685.44 685.44 0 0 0-86.4 38.4 1240.96 1240.96 0 0 1 138.432 120.32 1240.832 1240.832 0 0 1 120.32 138.496zM432.576 173.824a685.44 685.44 0 0 0-86.4-38.528c-98.112-35.584-166.656-33.92-205.696 5.12-39.04 39.04-40.768 107.648-5.12 205.696 10.432 28.928 23.296 57.728 38.4 86.4a1240.896 1240.896 0 0 1 120.32-138.432 1240.832 1240.832 0 0 1 138.496-120.32zM173.824 591.488a685.44 685.44 0 0 0-38.464 86.4c-35.648 98.048-33.92 166.592 5.12 205.632 39.04 39.04 107.584 40.768 205.696 5.12a685.44 685.44 0 0 0 86.4-38.4 1240.768 1240.768 0 0 1-138.496-120.32 1240.96 1240.96 0 0 1-120.256-138.432z m495.744 78.08A1112.064 1112.064 0 0 0 802.048 512a1112.064 1112.064 0 0 0-132.48-157.568A1112.128 1112.128 0 0 0 512 221.952a1112.128 1112.128 0 0 0-157.504 132.48A1112.064 1112.064 0 0 0 222.016 512a1112.192 1112.192 0 0 0 132.416 157.568A1112.064 1112.064 0 0 0 512 802.048a1112.128 1112.128 0 0 0 157.568-132.48z m-78.08 180.608c28.672 15.168 57.472 28.032 86.4 38.464 98.048 35.648 166.592 33.92 205.632-5.12 39.04-39.04 40.768-107.584 5.12-205.696a685.504 685.504 0 0 0-38.4-86.4 1240.832 1240.832 0 0 1-120.32 138.496 1240.96 1240.96 0 0 1-138.432 120.32zM585.088 512a73.152 73.152 0 1 1-146.24 0 73.152 73.152 0 0 1 146.304 0z\"\n fill=\"currentColor\"\n p-id=\"5013\"\n ></path>\n </svg>\n \u6DF1\u5EA6\u601D\u8003\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"modelListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/toggle-model.png\" style=\"width: 12px; height: 12px\" />\n {{ currentModel ? currentModel?.name : '\u9009\u62E9\u6A21\u578B' }}\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"knowledgeListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"knowledgePopoverVisible\"\n (nzPopoverVisibleChange)=\"knowledgeVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/relate.png\" style=\"width: 14px; height: 8px\" />\n \u5173\u8054\u77E5\u8BC6\u5E93\n </div>\n </div>\n <img class=\"send\" src=\"/assets/images/input/send.png\" (click)=\"send()\" [hidden]=\"sseService.loading$ | async\" />\n <div class=\"send-loading\" *ngIf=\"sseService.loading$ | async\">\n <div class=\"send-loading-inner\">\n <svg viewBox=\"0 0 36 36\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" data-icon=\"spin\">\n <defs>\n <linearGradient x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"100%\" id=\"linearGradient-1\">\n <stop stop-color=\"currentColor\" stop-opacity=\"0\" offset=\"0%\"></stop>\n <stop stop-color=\"currentColor\" stop-opacity=\"0.50\" offset=\"39.9430698%\"></stop>\n <stop stop-color=\"currentColor\" offset=\"100%\"></stop>\n </linearGradient>\n </defs>\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <rect fill-opacity=\"0.01\" fill=\"none\" x=\"0\" y=\"0\" width=\"36\" height=\"36\"></rect>\n <path\n d=\"M34,18 C34,9.163444 26.836556,2 18,2 C11.6597233,2 6.18078805,5.68784135 3.59122325,11.0354951\"\n stroke=\"url(#linearGradient-1)\"\n stroke-width=\"4\"\n stroke-linecap=\"round\"\n ></path>\n </g>\n </svg>\n </div>\n </div>\n <!-- <img class=\"send\" src=\"/assets/images/input/send-gray.png\" /> -->\n </div>\n </div>\n <div class=\"chat-input-backdrop\"></div>\n</div>\n\n<ng-template #modelListContent>\n <div style=\"width: 200px\">\n <div class=\"select-title\">\n \u5207\u6362\u6A21\u578B\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-radio-group [(ngModel)]=\"currentModel\">\n <label\n nz-radio\n [nzValue]=\"item\"\n [style.margin-top.px]=\"i === 0 ? 0 : 10\"\n *ngFor=\"let item of modelList; let i = index\"\n >\n {{ item.name }}\n </label>\n </nz-radio-group>\n </div>\n </div>\n</ng-template>\n\n<ng-template #knowledgeListContent>\n <div style=\"width: 150px\">\n <div class=\"select-title\">\n \u5173\u8054\u77E5\u8BC6\u5E93\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"knowledgeVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-checkbox-wrapper style=\"width: 100%\" (nzOnChange)=\"knowledgeSelectChange($event)\">\n <div *ngFor=\"let item of knowledgeList\">\n <label nz-checkbox [nzValue]=\"item.iCode\">{{ item.name }}</label>\n </div>\n </nz-checkbox-wrapper>\n </div>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";.chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;max-width:800px;min-width:350px;margin:0 auto;padding-bottom:40px}.chat-input-wrapper.center{bottom:50%;transform:translateY(50%)}.new-chat-title{display:flex;align-items:center;justify-content:center;padding-bottom:40px;text-align:center;font-weight:500;font-size:24px;color:#000}.new-chat-title img{width:40px;height:32px;margin-right:12px;margin-top:-6px}.chat-input{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:20px 18px;margin:0 auto;background:#FFFFFF;box-shadow:0 2px 8px #0000001a;border-radius:20px;border:1px solid #D9DADB;z-index:30}.chat-input .input-creative-editor{min-height:60px;max-height:300px;overflow-y:auto;outline:none;box-shadow:none;border:none}.chat-input .input-creative-editor[data-empty=true]:before{content:attr(data-placeholder);color:#9a9b9b}.chat-input .input-bottom{padding-top:16px;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none}.chat-input .input-bottom .input-tools{display:flex;align-items:center;gap:10px}.chat-input .input-bottom .select-tool{display:flex;align-items:center;justify-content:center;height:36px;padding:0 12px;gap:12px;background:#FFFFFF;border-radius:12px;border:1px solid #DBDCE0;cursor:pointer}.chat-input .input-bottom .select-tool-active{border-color:#b7c8fe;color:#3964fe;background:#edf3fe}.chat-input .input-bottom .send{width:32px;height:32px}::ng-deep .params-select-popover .ant-popover-inner{border-radius:10px}::ng-deep .params-select-popover .select-title{display:flex;align-items:center;justify-content:center;position:relative}::ng-deep .params-select-popover .select-title i{position:absolute;right:0;top:3px;cursor:pointer}::ng-deep .params-select-popover .select-content{max-height:200px;padding:16px 0;overflow-y:auto}.chat-input-backdrop{position:absolute;bottom:0;left:0;width:100%;height:100px;z-index:10;background-image:linear-gradient(to bottom,hsl(0,0%,99%),hsla(0,0%,99%,.8))}.send-loading{min-width:34px;height:34px;border-radius:50%;margin-top:auto;display:flex;flex-shrink:0;align-items:center;flex-direction:column;justify-content:center;cursor:not-allowed;white-space:nowrap;color:#fff;background:#3964fe;transition:background .2s;opacity:.4}.send-loading-inner{width:16px;height:16px}.send-loading svg{will-change:transform;animation:.6s linear infinite send-loading}@keyframes send-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
665
|
+
args: [{ selector: 'ngx-chat-input', template: "<!-- \u65B0\u804A\u5929\u4F4D\u4E8E\u5C4F\u5E55\u4E2D\u95F4\uFF0C\u53D1\u9001\u6D88\u606F\u4E4B\u540E\u4F4D\u4E8E\u5E95\u90E8 -->\n<div\n class=\"chat-input-wrapper\"\n #chatInputWrapper\n [class.center]=\"!messages.length\"\n [ngStyle]=\"{ 'padding-bottom': mode === 'full' ? '40px' : '10px' }\"\n>\n <div class=\"new-chat-title\" *ngIf=\"!messages.length\">\n <img src=\"/assets/images/logo.png\" />\n <span>\u4F60\u597D\uFF0C\u6709\u4EC0\u4E48\u53EF\u4EE5\u5E2E\u5230\u4F60\uFF1F\u5F00\u59CB\u5BF9\u8BDD\u5427</span>\n </div>\n <div class=\"chat-input\">\n <div\n #editorRef\n class=\"input-creative-editor\"\n contenteditable=\"true\"\n spellcheck=\"false\"\n data-placeholder=\"\u8BF7\u8F93\u5165\u5E76\u53D1\u9001\u6D88\u606F\"\n [attr.data-empty]=\"isEmpty\"\n (input)=\"handleInput()\"\n (keydown.enter)=\"handleEnter($event)\"\n (paste)=\"handlePaste($event)\"\n ></div>\n <div class=\"input-bottom\">\n <div class=\"input-tools\">\n <div class=\"select-tool\" [ngClass]=\"{ 'select-tool-active': deepThink }\" (click)=\"toggleDeepThink()\">\n <svg\n t=\"1764131026949\"\n style=\"width: 14px; height: 14px\"\n class=\"icon\"\n viewBox=\"0 0 1024 1024\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n p-id=\"5012\"\n width=\"64\"\n height=\"64\"\n >\n <path\n d=\"M903.36 512a795.52 795.52 0 0 1 65.536 136.704c48 132.16 39.616 230.528-25.024 295.168-64.64 64.64-163.008 72.96-295.168 24.96A795.52 795.52 0 0 1 512 903.424a795.52 795.52 0 0 1-136.704 65.536c-132.096 48-230.528 39.616-295.168-25.024-64.64-64.64-72.96-163.008-24.96-295.104 16.64-46.016 38.528-91.52 65.536-136.768A795.52 795.52 0 0 1 55.04 375.232C7.04 243.2 15.36 144.768 80 80.128 144.768 15.488 243.2 7.168 375.296 55.04c46.016 16.64 91.584 38.528 136.768 65.536A795.52 795.52 0 0 1 648.768 55.104c132.096-48 230.464-39.616 295.104 25.024 64.64 64.64 72.96 163.008 25.024 295.104A795.52 795.52 0 0 1 903.36 512z m-53.12-79.424c15.168-28.736 27.968-57.536 38.464-86.4 35.584-98.112 33.92-166.656-5.12-205.696-39.04-39.04-107.648-40.768-205.696-5.12a685.44 685.44 0 0 0-86.4 38.4 1240.96 1240.96 0 0 1 138.432 120.32 1240.832 1240.832 0 0 1 120.32 138.496zM432.576 173.824a685.44 685.44 0 0 0-86.4-38.528c-98.112-35.584-166.656-33.92-205.696 5.12-39.04 39.04-40.768 107.648-5.12 205.696 10.432 28.928 23.296 57.728 38.4 86.4a1240.896 1240.896 0 0 1 120.32-138.432 1240.832 1240.832 0 0 1 138.496-120.32zM173.824 591.488a685.44 685.44 0 0 0-38.464 86.4c-35.648 98.048-33.92 166.592 5.12 205.632 39.04 39.04 107.584 40.768 205.696 5.12a685.44 685.44 0 0 0 86.4-38.4 1240.768 1240.768 0 0 1-138.496-120.32 1240.96 1240.96 0 0 1-120.256-138.432z m495.744 78.08A1112.064 1112.064 0 0 0 802.048 512a1112.064 1112.064 0 0 0-132.48-157.568A1112.128 1112.128 0 0 0 512 221.952a1112.128 1112.128 0 0 0-157.504 132.48A1112.064 1112.064 0 0 0 222.016 512a1112.192 1112.192 0 0 0 132.416 157.568A1112.064 1112.064 0 0 0 512 802.048a1112.128 1112.128 0 0 0 157.568-132.48z m-78.08 180.608c28.672 15.168 57.472 28.032 86.4 38.464 98.048 35.648 166.592 33.92 205.632-5.12 39.04-39.04 40.768-107.584 5.12-205.696a685.504 685.504 0 0 0-38.4-86.4 1240.832 1240.832 0 0 1-120.32 138.496 1240.96 1240.96 0 0 1-138.432 120.32zM585.088 512a73.152 73.152 0 1 1-146.24 0 73.152 73.152 0 0 1 146.304 0z\"\n fill=\"currentColor\"\n p-id=\"5013\"\n ></path>\n </svg>\n \u6DF1\u5EA6\u601D\u8003\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"modelListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/toggle-model.png\" style=\"width: 12px; height: 12px\" />\n {{ currentModel ? currentModel?.name : '\u9009\u62E9\u6A21\u578B' }}\n </div>\n <div\n class=\"select-tool\"\n nz-popover\n [nzPopoverContent]=\"knowledgeListContent\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n [nzPopoverVisible]=\"knowledgePopoverVisible\"\n (nzPopoverVisibleChange)=\"knowledgeVisibleChange($event)\"\n >\n <img src=\"/assets/images/input/relate.png\" style=\"width: 14px; height: 8px\" />\n \u5173\u8054\u77E5\u8BC6\u5E93\n </div>\n </div>\n <img class=\"send\" src=\"/assets/images/input/send.png\" (click)=\"send()\" [hidden]=\"sseService.loading$ | async\" />\n <div class=\"send-loading\" *ngIf=\"sseService.loading$ | async\">\n <div class=\"send-loading-inner\">\n <svg viewBox=\"0 0 36 36\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" data-icon=\"spin\">\n <defs>\n <linearGradient x1=\"0%\" y1=\"100%\" x2=\"100%\" y2=\"100%\" id=\"linearGradient-1\">\n <stop stop-color=\"currentColor\" stop-opacity=\"0\" offset=\"0%\"></stop>\n <stop stop-color=\"currentColor\" stop-opacity=\"0.50\" offset=\"39.9430698%\"></stop>\n <stop stop-color=\"currentColor\" offset=\"100%\"></stop>\n </linearGradient>\n </defs>\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <rect fill-opacity=\"0.01\" fill=\"none\" x=\"0\" y=\"0\" width=\"36\" height=\"36\"></rect>\n <path\n d=\"M34,18 C34,9.163444 26.836556,2 18,2 C11.6597233,2 6.18078805,5.68784135 3.59122325,11.0354951\"\n stroke=\"url(#linearGradient-1)\"\n stroke-width=\"4\"\n stroke-linecap=\"round\"\n ></path>\n </g>\n </svg>\n </div>\n </div>\n <!-- <img class=\"send\" src=\"/assets/images/input/send-gray.png\" /> -->\n </div>\n </div>\n <div class=\"chat-input-backdrop\"></div>\n</div>\n\n<ng-template #modelListContent>\n <div style=\"width: 200px\">\n <div class=\"select-title\">\n \u5207\u6362\u6A21\u578B\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-radio-group [(ngModel)]=\"currentModel\">\n <label\n nz-radio\n [nzValue]=\"item\"\n [style.margin-top.px]=\"i === 0 ? 0 : 10\"\n *ngFor=\"let item of modelList; let i = index\"\n >\n {{ item.name }}\n </label>\n </nz-radio-group>\n </div>\n </div>\n</ng-template>\n\n<ng-template #knowledgeListContent>\n <div style=\"width: 250px\">\n <div class=\"select-title\">\n \u5173\u8054\u77E5\u8BC6\u5E93\n <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"knowledgeVisibleChange(false)\"></i>\n </div>\n <div class=\"select-content\">\n <nz-steps [nzCurrent]=\"knowledgeStepIndex\" nzProgressDot nzDirection=\"vertical\" nzSize=\"small\">\n <nz-step nzTitle=\"\u9009\u62E9\u5206\u7C7B\" [nzDescription]=\"typeSelectTpl\">\n <ng-template #typeSelectTpl>\n <nz-select\n [(ngModel)]=\"selectedTypes\"\n nzMode=\"multiple\"\n style=\"width: 100%\"\n (ngModelChange)=\"onTypeChange($event)\"\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u5206\u7C7B\"\n >\n <nz-option [nzValue]=\"item.type\" [nzLabel]=\"item.typeC\" *ngFor=\"let item of typesData\"></nz-option>\n </nz-select>\n </ng-template>\n </nz-step>\n <nz-step nzTitle=\"\u641C\u7D22\u9009\u62E9\u76EE\u5F55\" [nzDescription]=\"categorySelectTpl\">\n <ng-template #categorySelectTpl>\n <nz-tree-select\n style=\"width: 100%\"\n [(ngModel)]=\"selectedCategories\"\n [nzNodes]=\"categoriesData\"\n (ngModelChange)=\"onCategoryChange($event)\"\n nzCheckStrictly\n nzShowSearch\n nzCheckable\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u76EE\u5F55\"\n ></nz-tree-select>\n </ng-template>\n </nz-step>\n <nz-step nzTitle=\"\u9009\u62E9\u6807\u7B7E\" [nzDescription]=\"tagSelectTpl\">\n <ng-template #tagSelectTpl>\n <nz-select\n [(ngModel)]=\"selectedTags\"\n nzMode=\"multiple\"\n nzPlaceHolder=\"\u8BF7\u9009\u62E9\u6807\u7B7E\"\n style=\"width: 100%\"\n (ngModelChange)=\"onTagChange($event)\"\n >\n <nz-option-group [nzLabel]=\"item.name\" *ngFor=\"let item of tagsData\">\n <nz-option\n [nzValue]=\"child.iCode\"\n [nzLabel]=\"child.name\"\n *ngFor=\"let child of item.children\"\n ></nz-option>\n </nz-option-group>\n </nz-select>\n </ng-template>\n </nz-step>\n </nz-steps>\n </div>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:host{width:100%;container-type:inline-size;container-name:chat-container}.chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;max-width:800px;min-width:350px;margin:0 auto;padding-bottom:40px}@container chat-container (max-width: 1000px){.chat-input-wrapper{max-width:90%}}.chat-input-wrapper.center{bottom:50%;transform:translateY(50%)}.new-chat-title{display:flex;align-items:center;justify-content:center;padding-bottom:40px;text-align:center;font-weight:500;font-size:24px;color:#000}.new-chat-title img{width:40px;height:32px;margin-right:12px;margin-top:-6px}.chat-input{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:20px 18px;margin:0 auto;background:#FFFFFF;box-shadow:0 2px 8px #0000001a;border-radius:20px;border:1px solid #D9DADB;z-index:30}.chat-input .input-creative-editor{min-height:60px;max-height:300px;overflow-y:auto;outline:none;box-shadow:none;border:none}.chat-input .input-creative-editor[data-empty=true]:before{content:attr(data-placeholder);color:#9a9b9b}.chat-input .input-bottom{padding-top:16px;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none}.chat-input .input-bottom .input-tools{display:flex;align-items:center;gap:10px}.chat-input .input-bottom .select-tool{display:flex;align-items:center;justify-content:center;height:36px;padding:0 12px;gap:12px;background:#FFFFFF;border-radius:12px;border:1px solid #DBDCE0;cursor:pointer}.chat-input .input-bottom .select-tool-active{border-color:#b7c8fe;color:#3964fe;background:#edf3fe}.chat-input .input-bottom .send{width:32px;height:32px}::ng-deep .params-select-popover .ant-popover-inner{border-radius:10px}::ng-deep .params-select-popover .select-title{display:flex;align-items:center;justify-content:center;position:relative}::ng-deep .params-select-popover .select-title i{position:absolute;right:0;top:3px;cursor:pointer}::ng-deep .params-select-popover .select-content{max-height:400px;padding:16px 0 16px 1px;overflow-y:auto}.chat-input-backdrop{position:absolute;bottom:0;left:0;width:100%;height:100px;z-index:10;background-image:linear-gradient(to bottom,hsl(0,0%,99%),hsla(0,0%,99%,.8))}.send-loading{min-width:34px;height:34px;border-radius:50%;margin-top:auto;display:flex;flex-shrink:0;align-items:center;flex-direction:column;justify-content:center;cursor:not-allowed;white-space:nowrap;color:#fff;background:#3964fe;transition:background .2s;opacity:.4}.send-loading-inner{width:16px;height:16px}.send-loading svg{will-change:transform;animation:.6s linear infinite send-loading}@keyframes send-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
495
666
|
}], propDecorators: { editor: [{
|
|
496
667
|
type: ViewChild,
|
|
497
668
|
args: ['editorRef']
|
|
@@ -500,6 +671,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
500
671
|
args: ['chatInputWrapper']
|
|
501
672
|
}], messages: [{
|
|
502
673
|
type: Input
|
|
674
|
+
}], mode: [{
|
|
675
|
+
type: Input
|
|
503
676
|
}], sendMessage: [{
|
|
504
677
|
type: Output
|
|
505
678
|
}], messageChange: [{
|
|
@@ -708,7 +881,7 @@ class ChatMessagesComponent {
|
|
|
708
881
|
}
|
|
709
882
|
}
|
|
710
883
|
ChatMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChatMessagesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
711
|
-
ChatMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatMessagesComponent, selector: "ngx-chat-messages", inputs: { messages: "messages" }, outputs: { regenerateAnswer: "regenerateAnswer" }, viewQueries: [{ propertyName: "messagesContainer", first: true, predicate: ["messagesContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<!-- chat-messages.component.html -->\n<script src=\"chat-messages.component.ts\"></script>\n<div class=\"messages-container\" #messagesContainer>\n <div class=\"message-list\" [style.--input-height.px]=\"inputHeight\">\n <div class=\"question message-wrapper\" *ngFor=\"let msg of messages; let i = index\">\n <!-- Q -->\n <div class=\"bubble-wrapper user-msg\">\n <div class=\"message-bubble\">\n <div class=\"message-content message-human\">\n {{ msg.question }}\n </div>\n </div>\n </div>\n <!-- A -->\n <div class=\"bubble-wrapper ai-msg\" *ngIf=\"msg.answers[msg.answerIndex]\">\n <div\n class=\"bubble-loading\"\n *ngIf=\"!msg.answers[msg.answerIndex].think && !msg.answers[msg.answerIndex].content\"\n >\n <div class=\"bubble-loading-dot\" *ngFor=\"let item of [1, 2, 3]\"></div>\n </div>\n <div class=\"message-bubble\">\n <!-- \u601D\u8003 -->\n <div class=\"message-think\" *ngIf=\"msg.answers[msg.answerIndex].think\">\n <div\n class=\"message-think-header\"\n (click)=\"msg.answers[msg.answerIndex].thinkExpand = !msg.answers[msg.answerIndex].thinkExpand\"\n >\n <div class=\"message-think-header-title\">\n <img src=\"/assets/images/card/think-finish.png\" />\n {{ msg.answers[msg.answerIndex].content ? '\u5DF2\u5B8C\u6210\u601D\u8003' : '\u6B63\u5728\u601D\u8003\u4E2D...' }}\n </div>\n <div class=\"arrow-icon\" [class.rotated]=\"msg.answers[msg.answerIndex].thinkExpand\">\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"6 9 12 15 18 9\"></polyline>\n </svg>\n </div>\n </div>\n <div\n class=\"message-content message-assistant message-markdown\"\n [@expandCollapse]=\"msg.answers[msg.answerIndex].thinkExpand ? 'expanded' : 'collapsed'\"\n [innerHTML]=\"msg.answers[msg.answerIndex].think | markdown\"\n [hidden]=\"!msg.answers[msg.answerIndex].thinkExpand\"\n ></div>\n </div>\n <!-- \u56DE\u7B54 -->\n <div\n class=\"message-content message-assistant message-markdown\"\n [innerHTML]=\"msg.answers[msg.answerIndex].content | markdown\"\n ></div>\n <!-- \u56DE\u7B54\u5DE5\u5177\u680F -->\n <div class=\"assistant-tools\" *ngIf=\"msg.answers[msg.answerIndex].content\">\n <ngx-simple-pagination\n [current]=\"msg.answerIndex + 1\"\n [total]=\"msg.answers.length\"\n (pageChange)=\"onPageChange($event, msg)\"\n *ngIf=\"msg.answers.length > 1\"\n ></ngx-simple-pagination>\n <img\n src=\"assets/images/card/copy.png\"\n alt=\"\u590D\u5236\"\n (click)=\"copyContent(msg.answers[msg.answerIndex].content)\"\n />\n <img\n src=\"assets/images/card/refresh.png\"\n alt=\"\u91CD\u65B0\u751F\u6210\"\n (click)=\"regenerate(msg)\"\n *ngIf=\"i === messages.length - 1\"\n />\n </div>\n </div>\n </div>\n </div>\n\n <!-- <div style=\"padding-bottom: 160px\"></div> -->\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}.messages-container{width:100%;height:100%;overflow-y:auto;scrollbar-gutter:stable both-edges}.message-list{height:auto;padding-top:16px;padding-bottom:var(--input-height, 210px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:16px}.message-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;margin-bottom:16px;max-width:800px;min-width:350px}.bubble-wrapper{width:100%;display:flex;flex-direction:column;justify-content:center}.bubble-wrapper.user-msg{align-items:end}.bubble-wrapper.ai-msg{align-items:start}.bubble-loading{display:flex;align-items:center;justify-content:flex-start;height:24px;margin-top:4px;margin-bottom:16px}.bubble-loading-dot{width:6px;height:6px;border-radius:50%;margin-right:6px;background-color:#bbb;animation:.9s linear infinite loading-dot}.bubble-loading-dot:first-child{animation-delay:0s}.bubble-loading-dot:nth-child(2){animation-delay:.1s}.bubble-loading-dot:nth-child(3){animation-delay:.2s}@keyframes loading-dot{0%,to{opacity:.3}33%,66%{opacity:1}}.message-bubble{width:100%;display:flex;align-items:flex-end;flex-direction:column;gap:8px}.message-bubble .message-content.message-human{padding:8px 16px;margin-left:auto;border-radius:12px;background:#E4EDFD;color:#004ad3}.message-bubble .message-content.message-assistant{padding:0;width:100%;background:#fff}.message-bubble .message-markdown{background:#fff}.message-bubble .message-think{width:100%;padding:12px;background:#FFFFFF;border-radius:10px;border:1px solid #D9DADB;font-size:14px}.message-bubble .message-think-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#000;font-size:16px}.message-bubble .message-think-header-title{display:flex;align-items:center;gap:10px}.message-bubble .message-think-header-title img{width:14px;height:14px}.message-bubble .message-think .message-content{padding-top:12px;color:#61666b}.message-bubble .arrow-icon{transition:transform .3s ease}.message-bubble .arrow-icon.rotated{transform:rotate(0)}.message-bubble .arrow-icon:not(.rotated){transform:rotate(-90deg)}.assistant-tools{width:100%;display:flex;align-items:center;gap:24px}.assistant-tools img{width:14px;height:14px;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SimplePaginationComponent, selector: "ngx-simple-pagination", inputs: ["current", "total"], outputs: ["pageChange"] }, { kind: "pipe", type: MarkdownPipe, name: "markdown" }], animations: [
|
|
884
|
+
ChatMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatMessagesComponent, selector: "ngx-chat-messages", inputs: { messages: "messages" }, outputs: { regenerateAnswer: "regenerateAnswer" }, viewQueries: [{ propertyName: "messagesContainer", first: true, predicate: ["messagesContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<!-- chat-messages.component.html -->\n<script src=\"chat-messages.component.ts\"></script>\n<div class=\"messages-container\" #messagesContainer>\n <div class=\"message-list\" [style.--input-height.px]=\"inputHeight\">\n <div class=\"question message-wrapper\" *ngFor=\"let msg of messages; let i = index\">\n <!-- Q -->\n <div class=\"bubble-wrapper user-msg\">\n <div class=\"message-bubble\">\n <div class=\"message-content message-human\">\n {{ msg.question }}\n </div>\n </div>\n </div>\n <!-- A -->\n <div class=\"bubble-wrapper ai-msg\" *ngIf=\"msg.answers[msg.answerIndex]\">\n <div\n class=\"bubble-loading\"\n *ngIf=\"!msg.answers[msg.answerIndex].think && !msg.answers[msg.answerIndex].content\"\n >\n <div class=\"bubble-loading-dot\" *ngFor=\"let item of [1, 2, 3]\"></div>\n </div>\n <div class=\"message-bubble\">\n <!-- \u601D\u8003 -->\n <div class=\"message-think\" *ngIf=\"msg.answers[msg.answerIndex].think\">\n <div\n class=\"message-think-header\"\n (click)=\"msg.answers[msg.answerIndex].thinkExpand = !msg.answers[msg.answerIndex].thinkExpand\"\n >\n <div class=\"message-think-header-title\">\n <img src=\"/assets/images/card/think-finish.png\" />\n {{ msg.answers[msg.answerIndex].content ? '\u5DF2\u5B8C\u6210\u601D\u8003' : '\u6B63\u5728\u601D\u8003\u4E2D...' }}\n </div>\n <div class=\"arrow-icon\" [class.rotated]=\"msg.answers[msg.answerIndex].thinkExpand\">\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"6 9 12 15 18 9\"></polyline>\n </svg>\n </div>\n </div>\n <div\n class=\"message-content message-assistant message-markdown\"\n [@expandCollapse]=\"msg.answers[msg.answerIndex].thinkExpand ? 'expanded' : 'collapsed'\"\n [innerHTML]=\"msg.answers[msg.answerIndex].think | markdown\"\n [hidden]=\"!msg.answers[msg.answerIndex].thinkExpand\"\n ></div>\n </div>\n <!-- \u56DE\u7B54 -->\n <div\n class=\"message-content message-assistant message-markdown\"\n [innerHTML]=\"msg.answers[msg.answerIndex].content | markdown\"\n ></div>\n <!-- \u56DE\u7B54\u5DE5\u5177\u680F -->\n <div class=\"assistant-tools\" *ngIf=\"msg.answers[msg.answerIndex].content\">\n <ngx-simple-pagination\n [current]=\"msg.answerIndex + 1\"\n [total]=\"msg.answers.length\"\n (pageChange)=\"onPageChange($event, msg)\"\n *ngIf=\"msg.answers.length > 1\"\n ></ngx-simple-pagination>\n <img\n src=\"assets/images/card/copy.png\"\n alt=\"\u590D\u5236\"\n (click)=\"copyContent(msg.answers[msg.answerIndex].content)\"\n />\n <img\n src=\"assets/images/card/refresh.png\"\n alt=\"\u91CD\u65B0\u751F\u6210\"\n (click)=\"regenerate(msg)\"\n *ngIf=\"i === messages.length - 1\"\n />\n </div>\n </div>\n </div>\n </div>\n\n <!-- <div style=\"padding-bottom: 160px\"></div> -->\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}.messages-container{width:100%;height:100%;overflow-y:auto;scrollbar-gutter:stable both-edges;container-type:inline-size;container-name:chat-container}.message-list{height:auto;padding-top:16px;padding-bottom:var(--input-height, 210px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:16px}.message-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;margin-bottom:16px;max-width:800px;min-width:350px}@container chat-container (max-width: 1000px){.message-wrapper{max-width:90%}}.bubble-wrapper{width:100%;display:flex;flex-direction:column;justify-content:center}.bubble-wrapper.user-msg{align-items:end}.bubble-wrapper.ai-msg{align-items:start}.bubble-loading{display:flex;align-items:center;justify-content:flex-start;height:24px;margin-top:4px;margin-bottom:16px}.bubble-loading-dot{width:6px;height:6px;border-radius:50%;margin-right:6px;background-color:#bbb;animation:.9s linear infinite loading-dot}.bubble-loading-dot:first-child{animation-delay:0s}.bubble-loading-dot:nth-child(2){animation-delay:.1s}.bubble-loading-dot:nth-child(3){animation-delay:.2s}@keyframes loading-dot{0%,to{opacity:.3}33%,66%{opacity:1}}.message-bubble{width:100%;display:flex;align-items:flex-end;flex-direction:column;gap:8px}.message-bubble .message-content.message-human{padding:8px 16px;margin-left:auto;border-radius:12px;background:#E4EDFD;color:#004ad3}.message-bubble .message-content.message-assistant{padding:0;width:100%;background:#fff}.message-bubble .message-markdown{background:#fff}.message-bubble .message-think{width:100%;padding:12px;background:#FFFFFF;border-radius:10px;border:1px solid #D9DADB;font-size:14px}.message-bubble .message-think-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#000;font-size:16px}.message-bubble .message-think-header-title{display:flex;align-items:center;gap:10px}.message-bubble .message-think-header-title img{width:14px;height:14px}.message-bubble .message-think .message-content{padding-top:12px;color:#61666b}.message-bubble .arrow-icon{transition:transform .3s ease}.message-bubble .arrow-icon.rotated{transform:rotate(0)}.message-bubble .arrow-icon:not(.rotated){transform:rotate(-90deg)}.assistant-tools{width:100%;display:flex;align-items:center;gap:24px}.assistant-tools img{width:14px;height:14px;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SimplePaginationComponent, selector: "ngx-simple-pagination", inputs: ["current", "total"], outputs: ["pageChange"] }, { kind: "pipe", type: MarkdownPipe, name: "markdown" }], animations: [
|
|
712
885
|
trigger('expandCollapse', [
|
|
713
886
|
state('collapsed', style({ height: '0px', opacity: 0 })),
|
|
714
887
|
state('expanded', style({ height: '*', opacity: 1 })),
|
|
@@ -723,7 +896,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
723
896
|
state('expanded', style({ height: '*', opacity: 1 })),
|
|
724
897
|
transition('expanded <=> collapsed', animate('300ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
|
|
725
898
|
]),
|
|
726
|
-
], template: "<!-- chat-messages.component.html -->\n<script src=\"chat-messages.component.ts\"></script>\n<div class=\"messages-container\" #messagesContainer>\n <div class=\"message-list\" [style.--input-height.px]=\"inputHeight\">\n <div class=\"question message-wrapper\" *ngFor=\"let msg of messages; let i = index\">\n <!-- Q -->\n <div class=\"bubble-wrapper user-msg\">\n <div class=\"message-bubble\">\n <div class=\"message-content message-human\">\n {{ msg.question }}\n </div>\n </div>\n </div>\n <!-- A -->\n <div class=\"bubble-wrapper ai-msg\" *ngIf=\"msg.answers[msg.answerIndex]\">\n <div\n class=\"bubble-loading\"\n *ngIf=\"!msg.answers[msg.answerIndex].think && !msg.answers[msg.answerIndex].content\"\n >\n <div class=\"bubble-loading-dot\" *ngFor=\"let item of [1, 2, 3]\"></div>\n </div>\n <div class=\"message-bubble\">\n <!-- \u601D\u8003 -->\n <div class=\"message-think\" *ngIf=\"msg.answers[msg.answerIndex].think\">\n <div\n class=\"message-think-header\"\n (click)=\"msg.answers[msg.answerIndex].thinkExpand = !msg.answers[msg.answerIndex].thinkExpand\"\n >\n <div class=\"message-think-header-title\">\n <img src=\"/assets/images/card/think-finish.png\" />\n {{ msg.answers[msg.answerIndex].content ? '\u5DF2\u5B8C\u6210\u601D\u8003' : '\u6B63\u5728\u601D\u8003\u4E2D...' }}\n </div>\n <div class=\"arrow-icon\" [class.rotated]=\"msg.answers[msg.answerIndex].thinkExpand\">\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"6 9 12 15 18 9\"></polyline>\n </svg>\n </div>\n </div>\n <div\n class=\"message-content message-assistant message-markdown\"\n [@expandCollapse]=\"msg.answers[msg.answerIndex].thinkExpand ? 'expanded' : 'collapsed'\"\n [innerHTML]=\"msg.answers[msg.answerIndex].think | markdown\"\n [hidden]=\"!msg.answers[msg.answerIndex].thinkExpand\"\n ></div>\n </div>\n <!-- \u56DE\u7B54 -->\n <div\n class=\"message-content message-assistant message-markdown\"\n [innerHTML]=\"msg.answers[msg.answerIndex].content | markdown\"\n ></div>\n <!-- \u56DE\u7B54\u5DE5\u5177\u680F -->\n <div class=\"assistant-tools\" *ngIf=\"msg.answers[msg.answerIndex].content\">\n <ngx-simple-pagination\n [current]=\"msg.answerIndex + 1\"\n [total]=\"msg.answers.length\"\n (pageChange)=\"onPageChange($event, msg)\"\n *ngIf=\"msg.answers.length > 1\"\n ></ngx-simple-pagination>\n <img\n src=\"assets/images/card/copy.png\"\n alt=\"\u590D\u5236\"\n (click)=\"copyContent(msg.answers[msg.answerIndex].content)\"\n />\n <img\n src=\"assets/images/card/refresh.png\"\n alt=\"\u91CD\u65B0\u751F\u6210\"\n (click)=\"regenerate(msg)\"\n *ngIf=\"i === messages.length - 1\"\n />\n </div>\n </div>\n </div>\n </div>\n\n <!-- <div style=\"padding-bottom: 160px\"></div> -->\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}.messages-container{width:100%;height:100%;overflow-y:auto;scrollbar-gutter:stable both-edges}.message-list{height:auto;padding-top:16px;padding-bottom:var(--input-height, 210px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:16px}.message-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;margin-bottom:16px;max-width:800px;min-width:350px}.bubble-wrapper{width:100%;display:flex;flex-direction:column;justify-content:center}.bubble-wrapper.user-msg{align-items:end}.bubble-wrapper.ai-msg{align-items:start}.bubble-loading{display:flex;align-items:center;justify-content:flex-start;height:24px;margin-top:4px;margin-bottom:16px}.bubble-loading-dot{width:6px;height:6px;border-radius:50%;margin-right:6px;background-color:#bbb;animation:.9s linear infinite loading-dot}.bubble-loading-dot:first-child{animation-delay:0s}.bubble-loading-dot:nth-child(2){animation-delay:.1s}.bubble-loading-dot:nth-child(3){animation-delay:.2s}@keyframes loading-dot{0%,to{opacity:.3}33%,66%{opacity:1}}.message-bubble{width:100%;display:flex;align-items:flex-end;flex-direction:column;gap:8px}.message-bubble .message-content.message-human{padding:8px 16px;margin-left:auto;border-radius:12px;background:#E4EDFD;color:#004ad3}.message-bubble .message-content.message-assistant{padding:0;width:100%;background:#fff}.message-bubble .message-markdown{background:#fff}.message-bubble .message-think{width:100%;padding:12px;background:#FFFFFF;border-radius:10px;border:1px solid #D9DADB;font-size:14px}.message-bubble .message-think-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#000;font-size:16px}.message-bubble .message-think-header-title{display:flex;align-items:center;gap:10px}.message-bubble .message-think-header-title img{width:14px;height:14px}.message-bubble .message-think .message-content{padding-top:12px;color:#61666b}.message-bubble .arrow-icon{transition:transform .3s ease}.message-bubble .arrow-icon.rotated{transform:rotate(0)}.message-bubble .arrow-icon:not(.rotated){transform:rotate(-90deg)}.assistant-tools{width:100%;display:flex;align-items:center;gap:24px}.assistant-tools img{width:14px;height:14px;cursor:pointer}\n"] }]
|
|
899
|
+
], template: "<!-- chat-messages.component.html -->\n<script src=\"chat-messages.component.ts\"></script>\n<div class=\"messages-container\" #messagesContainer>\n <div class=\"message-list\" [style.--input-height.px]=\"inputHeight\">\n <div class=\"question message-wrapper\" *ngFor=\"let msg of messages; let i = index\">\n <!-- Q -->\n <div class=\"bubble-wrapper user-msg\">\n <div class=\"message-bubble\">\n <div class=\"message-content message-human\">\n {{ msg.question }}\n </div>\n </div>\n </div>\n <!-- A -->\n <div class=\"bubble-wrapper ai-msg\" *ngIf=\"msg.answers[msg.answerIndex]\">\n <div\n class=\"bubble-loading\"\n *ngIf=\"!msg.answers[msg.answerIndex].think && !msg.answers[msg.answerIndex].content\"\n >\n <div class=\"bubble-loading-dot\" *ngFor=\"let item of [1, 2, 3]\"></div>\n </div>\n <div class=\"message-bubble\">\n <!-- \u601D\u8003 -->\n <div class=\"message-think\" *ngIf=\"msg.answers[msg.answerIndex].think\">\n <div\n class=\"message-think-header\"\n (click)=\"msg.answers[msg.answerIndex].thinkExpand = !msg.answers[msg.answerIndex].thinkExpand\"\n >\n <div class=\"message-think-header-title\">\n <img src=\"/assets/images/card/think-finish.png\" />\n {{ msg.answers[msg.answerIndex].content ? '\u5DF2\u5B8C\u6210\u601D\u8003' : '\u6B63\u5728\u601D\u8003\u4E2D...' }}\n </div>\n <div class=\"arrow-icon\" [class.rotated]=\"msg.answers[msg.answerIndex].thinkExpand\">\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n <polyline points=\"6 9 12 15 18 9\"></polyline>\n </svg>\n </div>\n </div>\n <div\n class=\"message-content message-assistant message-markdown\"\n [@expandCollapse]=\"msg.answers[msg.answerIndex].thinkExpand ? 'expanded' : 'collapsed'\"\n [innerHTML]=\"msg.answers[msg.answerIndex].think | markdown\"\n [hidden]=\"!msg.answers[msg.answerIndex].thinkExpand\"\n ></div>\n </div>\n <!-- \u56DE\u7B54 -->\n <div\n class=\"message-content message-assistant message-markdown\"\n [innerHTML]=\"msg.answers[msg.answerIndex].content | markdown\"\n ></div>\n <!-- \u56DE\u7B54\u5DE5\u5177\u680F -->\n <div class=\"assistant-tools\" *ngIf=\"msg.answers[msg.answerIndex].content\">\n <ngx-simple-pagination\n [current]=\"msg.answerIndex + 1\"\n [total]=\"msg.answers.length\"\n (pageChange)=\"onPageChange($event, msg)\"\n *ngIf=\"msg.answers.length > 1\"\n ></ngx-simple-pagination>\n <img\n src=\"assets/images/card/copy.png\"\n alt=\"\u590D\u5236\"\n (click)=\"copyContent(msg.answers[msg.answerIndex].content)\"\n />\n <img\n src=\"assets/images/card/refresh.png\"\n alt=\"\u91CD\u65B0\u751F\u6210\"\n (click)=\"regenerate(msg)\"\n *ngIf=\"i === messages.length - 1\"\n />\n </div>\n </div>\n </div>\n </div>\n\n <!-- <div style=\"padding-bottom: 160px\"></div> -->\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}.messages-container{width:100%;height:100%;overflow-y:auto;scrollbar-gutter:stable both-edges;container-type:inline-size;container-name:chat-container}.message-list{height:auto;padding-top:16px;padding-bottom:var(--input-height, 210px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:16px}.message-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;margin-bottom:16px;max-width:800px;min-width:350px}@container chat-container (max-width: 1000px){.message-wrapper{max-width:90%}}.bubble-wrapper{width:100%;display:flex;flex-direction:column;justify-content:center}.bubble-wrapper.user-msg{align-items:end}.bubble-wrapper.ai-msg{align-items:start}.bubble-loading{display:flex;align-items:center;justify-content:flex-start;height:24px;margin-top:4px;margin-bottom:16px}.bubble-loading-dot{width:6px;height:6px;border-radius:50%;margin-right:6px;background-color:#bbb;animation:.9s linear infinite loading-dot}.bubble-loading-dot:first-child{animation-delay:0s}.bubble-loading-dot:nth-child(2){animation-delay:.1s}.bubble-loading-dot:nth-child(3){animation-delay:.2s}@keyframes loading-dot{0%,to{opacity:.3}33%,66%{opacity:1}}.message-bubble{width:100%;display:flex;align-items:flex-end;flex-direction:column;gap:8px}.message-bubble .message-content.message-human{padding:8px 16px;margin-left:auto;border-radius:12px;background:#E4EDFD;color:#004ad3}.message-bubble .message-content.message-assistant{padding:0;width:100%;background:#fff}.message-bubble .message-markdown{background:#fff}.message-bubble .message-think{width:100%;padding:12px;background:#FFFFFF;border-radius:10px;border:1px solid #D9DADB;font-size:14px}.message-bubble .message-think-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#000;font-size:16px}.message-bubble .message-think-header-title{display:flex;align-items:center;gap:10px}.message-bubble .message-think-header-title img{width:14px;height:14px}.message-bubble .message-think .message-content{padding-top:12px;color:#61666b}.message-bubble .arrow-icon{transition:transform .3s ease}.message-bubble .arrow-icon.rotated{transform:rotate(0)}.message-bubble .arrow-icon:not(.rotated){transform:rotate(-90deg)}.assistant-tools{width:100%;display:flex;align-items:center;gap:24px}.assistant-tools img{width:14px;height:14px;cursor:pointer}\n"] }]
|
|
727
900
|
}], propDecorators: { messages: [{
|
|
728
901
|
type: Input
|
|
729
902
|
}], messagesContainer: [{
|
|
@@ -733,103 +906,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
733
906
|
type: Output
|
|
734
907
|
}] } });
|
|
735
908
|
|
|
736
|
-
class HttpService {
|
|
737
|
-
constructor() {
|
|
738
|
-
this.http = inject(HttpClient);
|
|
739
|
-
this.storeService = inject(StoreService);
|
|
740
|
-
this.BASE_URL = '/api'; // 或者完整域名
|
|
741
|
-
}
|
|
742
|
-
/**
|
|
743
|
-
* 统一获取 Headers
|
|
744
|
-
*/
|
|
745
|
-
getHeaders() {
|
|
746
|
-
return new HttpHeaders({
|
|
747
|
-
'Content-Type': 'application/json',
|
|
748
|
-
Authorization: `${this.storeService.getToken()}`,
|
|
749
|
-
});
|
|
750
|
-
}
|
|
751
|
-
/**
|
|
752
|
-
* GET 请求
|
|
753
|
-
*/
|
|
754
|
-
get(url, params) {
|
|
755
|
-
return this.http.get(this.formatUrl(url), {
|
|
756
|
-
headers: this.getHeaders(),
|
|
757
|
-
params: this.resolveParams(params),
|
|
758
|
-
});
|
|
759
|
-
}
|
|
760
|
-
/**
|
|
761
|
-
* POST 请求
|
|
762
|
-
*/
|
|
763
|
-
post(url, body) {
|
|
764
|
-
return this.http.post(this.formatUrl(url), body, {
|
|
765
|
-
headers: this.getHeaders(),
|
|
766
|
-
});
|
|
767
|
-
}
|
|
768
|
-
/**
|
|
769
|
-
* PUT 请求
|
|
770
|
-
*/
|
|
771
|
-
put(url, body) {
|
|
772
|
-
return this.http.put(this.formatUrl(url), body, {
|
|
773
|
-
headers: this.getHeaders(),
|
|
774
|
-
});
|
|
775
|
-
}
|
|
776
|
-
/**
|
|
777
|
-
* DELETE 请求
|
|
778
|
-
* 兼容支持:既支持 URL 参数,也支持 Body
|
|
779
|
-
*/
|
|
780
|
-
delete(url, params, body) {
|
|
781
|
-
return this.http.request('DELETE', this.formatUrl(url), {
|
|
782
|
-
headers: this.getHeaders(),
|
|
783
|
-
params: this.resolveParams(params),
|
|
784
|
-
body: body, // HttpClient 的 delete() 方法默认不支持 body,需用 request() 通用方法
|
|
785
|
-
});
|
|
786
|
-
}
|
|
787
|
-
// ================= 私有辅助方法 =================
|
|
788
|
-
/**
|
|
789
|
-
* 统一处理 URL
|
|
790
|
-
* 比如自动拼接 BaseUrl,或者处理斜杠
|
|
791
|
-
*/
|
|
792
|
-
formatUrl(url) {
|
|
793
|
-
if (url.startsWith('http'))
|
|
794
|
-
return url;
|
|
795
|
-
// 确保拼接顺滑
|
|
796
|
-
const baseUrl = this.storeService.getBaseUrl();
|
|
797
|
-
const cleanBase = baseUrl.replace(/\/$/, '');
|
|
798
|
-
const cleanUrl = url.startsWith('/') ? url : `/${url}`;
|
|
799
|
-
return `${cleanBase}${cleanUrl}`;
|
|
800
|
-
}
|
|
801
|
-
/**
|
|
802
|
-
* 统一清洗参数
|
|
803
|
-
* 过滤掉 null 和 undefined,防止传给后端 "null" 字符串
|
|
804
|
-
*/
|
|
805
|
-
resolveParams(params) {
|
|
806
|
-
let httpParams = new HttpParams();
|
|
807
|
-
if (params) {
|
|
808
|
-
Object.keys(params).forEach(key => {
|
|
809
|
-
const value = params[key];
|
|
810
|
-
if (value !== null && value !== undefined) {
|
|
811
|
-
if (Array.isArray(value)) {
|
|
812
|
-
// 支持数组参数 ids: [1, 2] => ids=1&ids=2
|
|
813
|
-
value.forEach(val => (httpParams = httpParams.append(key, val)));
|
|
814
|
-
}
|
|
815
|
-
else {
|
|
816
|
-
httpParams = httpParams.set(key, value);
|
|
817
|
-
}
|
|
818
|
-
}
|
|
819
|
-
});
|
|
820
|
-
}
|
|
821
|
-
return httpParams;
|
|
822
|
-
}
|
|
823
|
-
}
|
|
824
|
-
HttpService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
825
|
-
HttpService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, providedIn: 'root' });
|
|
826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HttpService, decorators: [{
|
|
827
|
-
type: Injectable,
|
|
828
|
-
args: [{
|
|
829
|
-
providedIn: 'root',
|
|
830
|
-
}]
|
|
831
|
-
}] });
|
|
832
|
-
|
|
833
909
|
class HistoryGroupComponent {
|
|
834
910
|
constructor() {
|
|
835
911
|
this.select = new EventEmitter();
|
|
@@ -949,6 +1025,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
949
1025
|
// chat-sidebar.component.ts
|
|
950
1026
|
class ChatSidebarComponent {
|
|
951
1027
|
constructor() {
|
|
1028
|
+
this.mode = 'full';
|
|
952
1029
|
this.http = inject(HttpService$1);
|
|
953
1030
|
this.storeService = inject(StoreService);
|
|
954
1031
|
this.isCollapsed = false;
|
|
@@ -1033,7 +1110,7 @@ class ChatSidebarComponent {
|
|
|
1033
1110
|
}
|
|
1034
1111
|
}
|
|
1035
1112
|
ChatSidebarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChatSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1036
|
-
ChatSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatSidebarComponent, selector: "ngx-chat-sidebar", viewQueries: [{ propertyName: "historyGroupRef", first: true, predicate: ["historyGroupRef"], descendants: true }], ngImport: i0, template: "<div class=\"sidebar\" [class.collapsed]=\"isCollapsed\">\n <div class=\"sidebar-inner\">\n <div class=\"sidebar-header\">\n <div class=\"logo-area\">\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <span class=\"app-name\">\u9752\u6E05\u6C34\u5229</span>\n </div>\n <button class=\"toggle-btn\" (click)=\"toggleSidebar()\">\n <img src=\"assets/images/sidebar/collapse.png\" />\n </button>\n </div>\n\n <div class=\"sidebar-content\">\n <button class=\"new-chat-btn\" (click)=\"openNewChat()\">\n <img src=\"assets/images/sidebar/new-chat.png\" />\n \u5F00\u542F\u65B0\u5BF9\u8BDD\n </button>\n\n <div class=\"divider\"></div>\n\n <div class=\"section-title\">\n <img src=\"assets/images/sidebar/history-chat.png\" />\n <span>\u5386\u53F2\u5BF9\u8BDD</span>\n </div>\n\n <div class=\"history-list-scroll\" *ngIf=\"historyGroups.length\">\n <history-group\n #historyGroupRef\n *ngFor=\"let group of historyGroups\"\n [group]=\"group\"\n (select)=\"selectConversation($event)\"\n (refresh)=\"refresh($event)\"\n >\n </history-group>\n </div>\n\n <div class=\"history-empty\" *ngIf=\"!historyGroups.length\">\u6682\u65E0\u5386\u53F2\u5BF9\u8BDD</div>\n </div>\n </div>\n</div>\n\n<div
|
|
1113
|
+
ChatSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChatSidebarComponent, selector: "ngx-chat-sidebar", inputs: { mode: "mode" }, viewQueries: [{ propertyName: "historyGroupRef", first: true, predicate: ["historyGroupRef"], descendants: true }], ngImport: i0, template: "<div class=\"sidebar\" [class.collapsed]=\"isCollapsed\" [class.floating]=\"mode === 'card'\">\n <div class=\"sidebar-inner\">\n <div class=\"sidebar-header\" *ngIf=\"mode === 'full'\">\n <div class=\"logo-area\">\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <span class=\"app-name\">\u9752\u6E05\u6C34\u5229</span>\n </div>\n <button class=\"toggle-btn\" (click)=\"toggleSidebar()\">\n <img src=\"assets/images/sidebar/collapse.png\" />\n </button>\n </div>\n\n <div class=\"sidebar-content\">\n <button class=\"new-chat-btn\" (click)=\"openNewChat()\" *ngIf=\"mode === 'full'\">\n <img src=\"assets/images/sidebar/new-chat.png\" />\n \u5F00\u542F\u65B0\u5BF9\u8BDD\n </button>\n\n <div class=\"divider\" *ngIf=\"mode === 'full'\"></div>\n\n <div class=\"section-title\">\n <img src=\"assets/images/sidebar/history-chat.png\" />\n <span>\u5386\u53F2\u5BF9\u8BDD</span>\n </div>\n\n <div class=\"history-list-scroll\" *ngIf=\"historyGroups.length\">\n <history-group\n #historyGroupRef\n *ngFor=\"let group of historyGroups\"\n [group]=\"group\"\n (select)=\"selectConversation($event)\"\n (refresh)=\"refresh($event)\"\n >\n </history-group>\n </div>\n\n <div class=\"history-empty\" *ngIf=\"!historyGroups.length\">\u6682\u65E0\u5386\u53F2\u5BF9\u8BDD</div>\n </div>\n </div>\n</div>\n\n<div\n class=\"logo-actions\"\n [@logoActionsAnimation]=\"isCollapsed ? 'leave' : 'enter'\"\n *ngIf=\"isCollapsed && mode === 'full'\"\n>\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <div class=\"left-top-bar\">\n <img src=\"assets/images/sidebar/expand.png\" (click)=\"toggleSidebar()\" />\n <img src=\"assets/images/sidebar/new-chat.png\" (click)=\"openNewChat()\" />\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{position:relative;display:block;height:100%}.sidebar{width:280px;height:100%;background-color:#f3f4f6;border-right:1px solid #e0e0e0;display:flex;flex-direction:column;transition:width .4s cubic-bezier(.25,.8,.25,1),border .4s;overflow:hidden;box-sizing:border-box}.sidebar.floating{background-color:#fff;border-right:none;height:600px}.sidebar.floating .sidebar-inner{padding:0!important}.sidebar.collapsed{width:0;padding:0;border-right:0 solid transparent}.sidebar-inner{width:280px;height:100%;display:flex;flex-direction:column;padding:16px;box-sizing:border-box}.sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;height:32px}.logo-area{display:flex;align-items:center;gap:8px;white-space:nowrap}.logo-img{width:28px;height:28px;object-fit:contain}.app-name{font-weight:600;font-size:16px;color:#000}.toggle-btn{background:none;border:none;cursor:pointer;color:#666;padding:4px;border-radius:4px}.toggle-btn img{width:16px;height:15px}.toggle-btn:hover{background-color:#0000000d}.sidebar-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.new-chat-btn{width:100%;background-color:#fff;border:1px solid #e0e0e0;border-radius:20px;padding:10px;color:#333;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 5px #00000008;transition:all .2s;white-space:nowrap}.new-chat-btn img{width:16px;height:16px}.new-chat-btn:hover{box-shadow:0 4px 8px #00000014;border-color:#d0d0d0}.divider{height:1px;background-color:#e0e0e0;margin:20px 0}.section-title{display:flex;align-items:center;gap:8px;font-weight:600;color:#333;margin-bottom:10px;white-space:nowrap}.section-title img{width:16px;height:16px}.history-list-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding-right:4px}.history-empty{flex:1;display:flex;align-items:center;justify-content:center}.logo-actions{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:8px;z-index:99}.logo-actions .logo-img{width:40px;height:32px}.logo-actions .left-top-bar{flex-shrink:0;width:75px;height:40px;display:flex;align-items:center;justify-content:center;gap:19px;background:#FFFFFF;box-shadow:0 2px 4px #0000001a;border-radius:20px;border:1px solid #EEEEEE}.logo-actions .left-top-bar img{width:16px;height:16px;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: HistoryGroupComponent, selector: "history-group", inputs: ["group"], outputs: ["select", "refresh"] }], animations: [
|
|
1037
1114
|
trigger('logoActionsAnimation', [
|
|
1038
1115
|
transition(':enter', [
|
|
1039
1116
|
style({ opacity: 0, transform: 'translateX(20px)' }),
|
|
@@ -1052,8 +1129,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1052
1129
|
]),
|
|
1053
1130
|
transition(':leave', [animate('0ms ease-in', style({ opacity: 0, transform: 'translateX(20px)' }))]),
|
|
1054
1131
|
]),
|
|
1055
|
-
], template: "<div class=\"sidebar\" [class.collapsed]=\"isCollapsed\">\n <div class=\"sidebar-inner\">\n <div class=\"sidebar-header\">\n <div class=\"logo-area\">\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <span class=\"app-name\">\u9752\u6E05\u6C34\u5229</span>\n </div>\n <button class=\"toggle-btn\" (click)=\"toggleSidebar()\">\n <img src=\"assets/images/sidebar/collapse.png\" />\n </button>\n </div>\n\n <div class=\"sidebar-content\">\n <button class=\"new-chat-btn\" (click)=\"openNewChat()\">\n <img src=\"assets/images/sidebar/new-chat.png\" />\n \u5F00\u542F\u65B0\u5BF9\u8BDD\n </button>\n\n <div class=\"divider\"></div>\n\n <div class=\"section-title\">\n <img src=\"assets/images/sidebar/history-chat.png\" />\n <span>\u5386\u53F2\u5BF9\u8BDD</span>\n </div>\n\n <div class=\"history-list-scroll\" *ngIf=\"historyGroups.length\">\n <history-group\n #historyGroupRef\n *ngFor=\"let group of historyGroups\"\n [group]=\"group\"\n (select)=\"selectConversation($event)\"\n (refresh)=\"refresh($event)\"\n >\n </history-group>\n </div>\n\n <div class=\"history-empty\" *ngIf=\"!historyGroups.length\">\u6682\u65E0\u5386\u53F2\u5BF9\u8BDD</div>\n </div>\n </div>\n</div>\n\n<div
|
|
1056
|
-
}], propDecorators: {
|
|
1132
|
+
], template: "<div class=\"sidebar\" [class.collapsed]=\"isCollapsed\" [class.floating]=\"mode === 'card'\">\n <div class=\"sidebar-inner\">\n <div class=\"sidebar-header\" *ngIf=\"mode === 'full'\">\n <div class=\"logo-area\">\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <span class=\"app-name\">\u9752\u6E05\u6C34\u5229</span>\n </div>\n <button class=\"toggle-btn\" (click)=\"toggleSidebar()\">\n <img src=\"assets/images/sidebar/collapse.png\" />\n </button>\n </div>\n\n <div class=\"sidebar-content\">\n <button class=\"new-chat-btn\" (click)=\"openNewChat()\" *ngIf=\"mode === 'full'\">\n <img src=\"assets/images/sidebar/new-chat.png\" />\n \u5F00\u542F\u65B0\u5BF9\u8BDD\n </button>\n\n <div class=\"divider\" *ngIf=\"mode === 'full'\"></div>\n\n <div class=\"section-title\">\n <img src=\"assets/images/sidebar/history-chat.png\" />\n <span>\u5386\u53F2\u5BF9\u8BDD</span>\n </div>\n\n <div class=\"history-list-scroll\" *ngIf=\"historyGroups.length\">\n <history-group\n #historyGroupRef\n *ngFor=\"let group of historyGroups\"\n [group]=\"group\"\n (select)=\"selectConversation($event)\"\n (refresh)=\"refresh($event)\"\n >\n </history-group>\n </div>\n\n <div class=\"history-empty\" *ngIf=\"!historyGroups.length\">\u6682\u65E0\u5386\u53F2\u5BF9\u8BDD</div>\n </div>\n </div>\n</div>\n\n<div\n class=\"logo-actions\"\n [@logoActionsAnimation]=\"isCollapsed ? 'leave' : 'enter'\"\n *ngIf=\"isCollapsed && mode === 'full'\"\n>\n <img src=\"assets/images/logo.png\" alt=\"Logo\" class=\"logo-img\" />\n <div class=\"left-top-bar\">\n <img src=\"assets/images/sidebar/expand.png\" (click)=\"toggleSidebar()\" />\n <img src=\"assets/images/sidebar/new-chat.png\" (click)=\"openNewChat()\" />\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{position:relative;display:block;height:100%}.sidebar{width:280px;height:100%;background-color:#f3f4f6;border-right:1px solid #e0e0e0;display:flex;flex-direction:column;transition:width .4s cubic-bezier(.25,.8,.25,1),border .4s;overflow:hidden;box-sizing:border-box}.sidebar.floating{background-color:#fff;border-right:none;height:600px}.sidebar.floating .sidebar-inner{padding:0!important}.sidebar.collapsed{width:0;padding:0;border-right:0 solid transparent}.sidebar-inner{width:280px;height:100%;display:flex;flex-direction:column;padding:16px;box-sizing:border-box}.sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;height:32px}.logo-area{display:flex;align-items:center;gap:8px;white-space:nowrap}.logo-img{width:28px;height:28px;object-fit:contain}.app-name{font-weight:600;font-size:16px;color:#000}.toggle-btn{background:none;border:none;cursor:pointer;color:#666;padding:4px;border-radius:4px}.toggle-btn img{width:16px;height:15px}.toggle-btn:hover{background-color:#0000000d}.sidebar-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.new-chat-btn{width:100%;background-color:#fff;border:1px solid #e0e0e0;border-radius:20px;padding:10px;color:#333;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 5px #00000008;transition:all .2s;white-space:nowrap}.new-chat-btn img{width:16px;height:16px}.new-chat-btn:hover{box-shadow:0 4px 8px #00000014;border-color:#d0d0d0}.divider{height:1px;background-color:#e0e0e0;margin:20px 0}.section-title{display:flex;align-items:center;gap:8px;font-weight:600;color:#333;margin-bottom:10px;white-space:nowrap}.section-title img{width:16px;height:16px}.history-list-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding-right:4px}.history-empty{flex:1;display:flex;align-items:center;justify-content:center}.logo-actions{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:8px;z-index:99}.logo-actions .logo-img{width:40px;height:32px}.logo-actions .left-top-bar{flex-shrink:0;width:75px;height:40px;display:flex;align-items:center;justify-content:center;gap:19px;background:#FFFFFF;box-shadow:0 2px 4px #0000001a;border-radius:20px;border:1px solid #EEEEEE}.logo-actions .left-top-bar img{width:16px;height:16px;cursor:pointer}\n"] }]
|
|
1133
|
+
}], propDecorators: { mode: [{
|
|
1134
|
+
type: Input
|
|
1135
|
+
}], historyGroupRef: [{
|
|
1057
1136
|
type: ViewChild,
|
|
1058
1137
|
args: ['historyGroupRef']
|
|
1059
1138
|
}] } });
|
|
@@ -1167,10 +1246,10 @@ class NgxAgentChatComponent {
|
|
|
1167
1246
|
}
|
|
1168
1247
|
}
|
|
1169
1248
|
NgxAgentChatComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NgxAgentChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1170
|
-
NgxAgentChatComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NgxAgentChatComponent, selector: "ngx-agent-chat", inputs: { baseUrl: "baseUrl", token: "token" }, viewQueries: [{ propertyName: "chatSidebarRef", first: true, predicate: ["chatSidebarRef"], descendants: true }, { propertyName: "chatMessagesRef", first: true, predicate: ["chatMessagesRef"], descendants: true }, { propertyName: "chatInputRef", first: true, predicate: ["chatInputRef"], descendants: true }], ngImport: i0, template: "<div class=\"qq-agent\">\n
|
|
1249
|
+
NgxAgentChatComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NgxAgentChatComponent, selector: "ngx-agent-chat", inputs: { baseUrl: "baseUrl", token: "token" }, viewQueries: [{ propertyName: "chatSidebarRef", first: true, predicate: ["chatSidebarRef"], descendants: true }, { propertyName: "chatMessagesRef", first: true, predicate: ["chatMessagesRef"], descendants: true }, { propertyName: "chatInputRef", first: true, predicate: ["chatInputRef"], descendants: true }], ngImport: i0, template: "<div class=\"qq-agent\">\n <!-- \u5DE6\u4FA7\u8FB9\u680F -->\n <ngx-chat-sidebar #chatSidebarRef></ngx-chat-sidebar>\n\n <!-- \u53F3\u4FA7\u4E3B\u5185\u5BB9 -->\n <div class=\"agent-main\">\n <ngx-chat-messages\n #chatMessagesRef\n [messages]=\"messages\"\n (regenerateAnswer)=\"regenerateAnswer($event)\"\n ></ngx-chat-messages>\n <ngx-chat-input #chatInputRef [messages]=\"messages\" (sendMessage)=\"onSendMessage($event)\"></ngx-chat-input>\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}:host ::ng-deep ::-webkit-scrollbar{width:6px}:host ::ng-deep ::-webkit-scrollbar-track{background:transparent}:host ::ng-deep ::-webkit-scrollbar-thumb{background:#d1d1d1;border-radius:8px}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:#b0b0b0}.qq-agent{width:100%;height:100%;display:flex;overflow:hidden}.qq-agent .agent-left{width:280px;height:100%;background:#F3F4F6}.qq-agent .agent-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center}\n"], dependencies: [{ kind: "component", type: ChatInputComponent, selector: "ngx-chat-input", inputs: ["messages", "mode"], outputs: ["sendMessage", "messageChange", "enter", "paste"] }, { kind: "component", type: ChatMessagesComponent, selector: "ngx-chat-messages", inputs: ["messages"], outputs: ["regenerateAnswer"] }, { kind: "component", type: ChatSidebarComponent, selector: "ngx-chat-sidebar", inputs: ["mode"] }] });
|
|
1171
1250
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NgxAgentChatComponent, decorators: [{
|
|
1172
1251
|
type: Component,
|
|
1173
|
-
args: [{ selector: 'ngx-agent-chat', template: "<div class=\"qq-agent\">\n
|
|
1252
|
+
args: [{ selector: 'ngx-agent-chat', template: "<div class=\"qq-agent\">\n <!-- \u5DE6\u4FA7\u8FB9\u680F -->\n <ngx-chat-sidebar #chatSidebarRef></ngx-chat-sidebar>\n\n <!-- \u53F3\u4FA7\u4E3B\u5185\u5BB9 -->\n <div class=\"agent-main\">\n <ngx-chat-messages\n #chatMessagesRef\n [messages]=\"messages\"\n (regenerateAnswer)=\"regenerateAnswer($event)\"\n ></ngx-chat-messages>\n <ngx-chat-input #chatInputRef [messages]=\"messages\" (sendMessage)=\"onSendMessage($event)\"></ngx-chat-input>\n </div>\n</div>\n", styles: [":host{width:100%;height:100%}:host ::ng-deep ::-webkit-scrollbar{width:6px}:host ::ng-deep ::-webkit-scrollbar-track{background:transparent}:host ::ng-deep ::-webkit-scrollbar-thumb{background:#d1d1d1;border-radius:8px}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:#b0b0b0}.qq-agent{width:100%;height:100%;display:flex;overflow:hidden}.qq-agent .agent-left{width:280px;height:100%;background:#F3F4F6}.qq-agent .agent-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center}\n"] }]
|
|
1174
1253
|
}], propDecorators: { baseUrl: [{
|
|
1175
1254
|
type: Input
|
|
1176
1255
|
}], token: [{
|
|
@@ -1186,6 +1265,221 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1186
1265
|
args: ['chatInputRef']
|
|
1187
1266
|
}] } });
|
|
1188
1267
|
|
|
1268
|
+
class FloatingChatComponent {
|
|
1269
|
+
constructor() {
|
|
1270
|
+
// 状态变量,用于控制组件的显示和动画
|
|
1271
|
+
this.isExpanded = false;
|
|
1272
|
+
// 标题
|
|
1273
|
+
this.title = 'AI-青清水利';
|
|
1274
|
+
/**
|
|
1275
|
+
* 接口baseUrl配置
|
|
1276
|
+
*/
|
|
1277
|
+
this.baseUrl = 'http://39.102.56.254:8082';
|
|
1278
|
+
this.token = '';
|
|
1279
|
+
this.md = inject(MarkdownStreamService);
|
|
1280
|
+
this.httpService = inject(HttpService$1);
|
|
1281
|
+
this.sseService = inject(SseService);
|
|
1282
|
+
this.storeService = inject(StoreService);
|
|
1283
|
+
this.sanitizer = inject(DomSanitizer);
|
|
1284
|
+
this.ngZone = inject(NgZone);
|
|
1285
|
+
this.messages = []; // 消息数组
|
|
1286
|
+
// 历史对话
|
|
1287
|
+
this.modelPopoverVisible = false;
|
|
1288
|
+
}
|
|
1289
|
+
/**
|
|
1290
|
+
* 切换聊天框的展开/收起状态
|
|
1291
|
+
*/
|
|
1292
|
+
toggleChatBox() {
|
|
1293
|
+
this.isExpanded = !this.isExpanded;
|
|
1294
|
+
}
|
|
1295
|
+
ngOnInit() {
|
|
1296
|
+
this.storeService.setToken(this.token);
|
|
1297
|
+
this.storeService.setBaseUrl(this.baseUrl);
|
|
1298
|
+
this.sseService.conversationICode$.subscribe(iCodeObj => {
|
|
1299
|
+
if (iCodeObj) {
|
|
1300
|
+
const currentMsg = this.messages[this.messages.length - 1];
|
|
1301
|
+
currentMsg.iCode = iCodeObj.question;
|
|
1302
|
+
currentMsg.answers[currentMsg.answerIndex].iCode = iCodeObj.answer;
|
|
1303
|
+
}
|
|
1304
|
+
});
|
|
1305
|
+
this.sseService.thinking$.subscribe(text => {
|
|
1306
|
+
if (this.messages.length > 0) {
|
|
1307
|
+
const currentMsg = this.messages[this.messages.length - 1];
|
|
1308
|
+
currentMsg.answers[currentMsg.answerIndex].think = text;
|
|
1309
|
+
}
|
|
1310
|
+
});
|
|
1311
|
+
this.sseService.currentMessage$.subscribe(text => {
|
|
1312
|
+
if (this.messages.length > 0) {
|
|
1313
|
+
const currentMsg = this.messages[this.messages.length - 1];
|
|
1314
|
+
currentMsg.answers[currentMsg.answerIndex].content = text;
|
|
1315
|
+
}
|
|
1316
|
+
});
|
|
1317
|
+
this.storeService.currentConversation$.subscribe(conversation => {
|
|
1318
|
+
if (!conversation) {
|
|
1319
|
+
this.messages = [];
|
|
1320
|
+
return;
|
|
1321
|
+
}
|
|
1322
|
+
this.httpService
|
|
1323
|
+
.get(`${this.storeService.getBaseUrl()}/api/ChatModel/conversation/questions`, { iCode: conversation === null || conversation === void 0 ? void 0 : conversation.iCode })
|
|
1324
|
+
.subscribe((res) => {
|
|
1325
|
+
this.messages = res.map(item => {
|
|
1326
|
+
item.answerIndex = 0;
|
|
1327
|
+
item.answers.forEach(answer => {
|
|
1328
|
+
answer.thinkExpand = true;
|
|
1329
|
+
});
|
|
1330
|
+
return item;
|
|
1331
|
+
});
|
|
1332
|
+
});
|
|
1333
|
+
});
|
|
1334
|
+
}
|
|
1335
|
+
ngAfterViewInit() {
|
|
1336
|
+
this.resizeObserver = new ResizeObserver(entries => {
|
|
1337
|
+
for (let entry of entries) {
|
|
1338
|
+
const newHeight = entry.contentRect.height;
|
|
1339
|
+
this.ngZone.run(() => {
|
|
1340
|
+
this.chatMessagesRef.inputHeight = newHeight + 60;
|
|
1341
|
+
});
|
|
1342
|
+
}
|
|
1343
|
+
});
|
|
1344
|
+
// 开始监听输入框元素
|
|
1345
|
+
this.resizeObserver.observe(this.chatInputRef.chatInputWrapper.nativeElement);
|
|
1346
|
+
}
|
|
1347
|
+
modelVisibleChange(value) {
|
|
1348
|
+
this.modelPopoverVisible = value;
|
|
1349
|
+
}
|
|
1350
|
+
// 打开新对话
|
|
1351
|
+
openNewChat() {
|
|
1352
|
+
this.storeService.setCurrentConversation(null);
|
|
1353
|
+
}
|
|
1354
|
+
// 重新生成回答(仅最新的回答允许重新生成)
|
|
1355
|
+
regenerateAnswer(msg) {
|
|
1356
|
+
this.chatInputRef.regenerateSend(msg);
|
|
1357
|
+
}
|
|
1358
|
+
// 发起提问请求
|
|
1359
|
+
onSendMessage(event) {
|
|
1360
|
+
if (!event.isRegenerate) {
|
|
1361
|
+
// 推入一个新问答,iCode在流接收到补上
|
|
1362
|
+
const qa = {
|
|
1363
|
+
iCode: '',
|
|
1364
|
+
question: event.message.question,
|
|
1365
|
+
answers: [
|
|
1366
|
+
{
|
|
1367
|
+
iCode: '',
|
|
1368
|
+
think: '',
|
|
1369
|
+
content: '',
|
|
1370
|
+
thinkExpand: true,
|
|
1371
|
+
},
|
|
1372
|
+
],
|
|
1373
|
+
answerIndex: 0,
|
|
1374
|
+
};
|
|
1375
|
+
this.messages.push(qa);
|
|
1376
|
+
}
|
|
1377
|
+
else {
|
|
1378
|
+
const latestMessage = this.messages[this.messages.length - 1];
|
|
1379
|
+
latestMessage.answers.push({
|
|
1380
|
+
iCode: '',
|
|
1381
|
+
think: '',
|
|
1382
|
+
content: '',
|
|
1383
|
+
thinkExpand: true,
|
|
1384
|
+
});
|
|
1385
|
+
latestMessage.answerIndex = latestMessage.answers.length - 1;
|
|
1386
|
+
}
|
|
1387
|
+
this.sseService.streamChat(event.message).then(res => {
|
|
1388
|
+
// 开启新对话,刷新左侧历史对话
|
|
1389
|
+
if (!event.message.conversation) {
|
|
1390
|
+
this.chatSidebarRef.getHistory(true);
|
|
1391
|
+
}
|
|
1392
|
+
});
|
|
1393
|
+
}
|
|
1394
|
+
}
|
|
1395
|
+
FloatingChatComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FloatingChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1396
|
+
FloatingChatComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FloatingChatComponent, selector: "ngx-agent-floating-chat", inputs: { title: "title", baseUrl: "baseUrl", token: "token" }, viewQueries: [{ propertyName: "chatSidebarRef", first: true, predicate: ["chatSidebarRef"], descendants: true }, { propertyName: "chatMessagesRef", first: true, predicate: ["chatMessagesRef"], descendants: true }, { propertyName: "chatInputRef", first: true, predicate: ["chatInputRef"], descendants: true }], ngImport: i0, template: "<div class=\"floating-chat-container\">\n <div class=\"chat-box\" [@chatBoxState]=\"isExpanded ? 'expanded' : 'collapsed'\">\n <header class=\"chat-header\">\n <div class=\"header-content\">\n <span\n class=\"icon menu-icon\"\n nz-popover\n [nzPopoverContent]=\"historyTpl\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n nzPopoverPlacement=\"rightTop\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/floating/history-menu.png\" style=\"width: 16px\" />\n </span>\n <h3 class=\"chat-title\">{{ title }}</h3>\n <img src=\"/assets/images/floating/new-chat.png\" style=\"width: 20px; cursor: pointer\" (click)=\"openNewChat()\" />\n </div>\n </header>\n\n <div class=\"chat-main\">\n <ngx-chat-messages\n #chatMessagesRef\n [messages]=\"messages\"\n (regenerateAnswer)=\"regenerateAnswer($event)\"\n ></ngx-chat-messages>\n <ngx-chat-input\n #chatInputRef\n [messages]=\"messages\"\n mode=\"card\"\n (sendMessage)=\"onSendMessage($event)\"\n ></ngx-chat-input>\n </div>\n </div>\n\n <button class=\"toggle-button\" (click)=\"toggleChatBox()\">\n <span class=\"button-icon\" [@buttonIconState]=\"isExpanded ? 'expanded' : 'collapsed'\">\n <img src=\"/assets/images/logo.png\" style=\"width: 36px\" *ngIf=\"!isExpanded\" />\n <img src=\"/assets/images/floating/arrow-down.png\" style=\"width: 24px\" *ngIf=\"isExpanded\" />\n </span>\n </button>\n</div>\n\n<!-- \u5386\u53F2\u5BF9\u8BDD -->\n<ng-template #historyTpl>\n <div style=\"width: 100%; max-height: 600px\">\n <!-- <div class=\"select-title\"> -->\n <!-- <div class=\"section-title\"> -->\n <!-- <img src=\"assets/images/sidebar/history-chat.png\" /> -->\n <!-- <span>\u5386\u53F2\u5BF9\u8BDD</span> -->\n <!-- </div> -->\n <!-- <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i> -->\n <!-- </div> -->\n <ngx-chat-sidebar #chatSidebarRef mode=\"card\"></ngx-chat-sidebar>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:host ::ng-deep ::-webkit-scrollbar{width:6px}:host ::ng-deep ::-webkit-scrollbar-track{background:transparent}:host ::ng-deep ::-webkit-scrollbar-thumb{background:#d1d1d1;border-radius:8px}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:#b0b0b0}.floating-chat-container{position:fixed;bottom:20px;right:20px;z-index:1000;display:flex;flex-direction:column;align-items:flex-end}.chat-box{width:660px;height:820px;background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;margin-bottom:10px;overflow:hidden;display:flex;flex-direction:column}.chat-header{background-color:#fff;color:#fff;padding:12px 15px;border-top-left-radius:8px;border-top-right-radius:8px}.header-content{display:flex;justify-content:space-between;align-items:center}.chat-title{margin:0;font-size:16px;font-weight:500;flex-grow:1;text-align:center}.icon{font-size:18px;cursor:pointer}.chat-main{flex-grow:1;display:flex;flex-direction:column;overflow-y:auto;background-color:#fff}.welcome-message{text-align:center;padding-top:50px}.chat-icon{color:#409eff;margin-bottom:10px}.chat-icon svg{fill:#409eff}.welcome-text{color:#333;font-size:14px}.chat-footer{border-top:1px solid #eee;padding:10px 15px;background-color:#fff}.input-area-placeholder{display:flex;align-items:center;border:1px solid #ddd;border-radius:20px;margin-bottom:8px;overflow:hidden}.input-area-placeholder input{flex-grow:1;border:none;padding:8px 12px;outline:none;background-color:#fff;cursor:default}.input-area-placeholder .send-btn{background:none;border:none;padding:6px 10px;cursor:default;color:#bbb}.input-area-placeholder .send-btn svg{fill:#bbb}.bottom-controls{display:flex;justify-content:space-between;font-size:12px;color:#888}.control-item{cursor:default}.send-btn-placeholder{color:#409eff;font-weight:700;font-size:14px}.toggle-button{width:50px;height:50px;border-radius:50%;background-color:#fff;border:none;box-shadow:0 4px 8px #00000026;cursor:pointer;display:flex;justify-content:center;align-items:center;outline:none;color:#2157ff;order:2}.button-icon{display:block}.button-icon svg{fill:#fff}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NzPopoverDirective, selector: "[nz-popover]", inputs: ["nzPopoverArrowPointAtCenter", "nzPopoverTitle", "nzPopoverContent", "nz-popover", "nzPopoverTrigger", "nzPopoverPlacement", "nzPopoverOrigin", "nzPopoverVisible", "nzPopoverMouseEnterDelay", "nzPopoverMouseLeaveDelay", "nzPopoverOverlayClassName", "nzPopoverOverlayStyle", "nzPopoverBackdrop"], outputs: ["nzPopoverVisibleChange"], exportAs: ["nzPopover"] }, { kind: "component", type: ChatInputComponent, selector: "ngx-chat-input", inputs: ["messages", "mode"], outputs: ["sendMessage", "messageChange", "enter", "paste"] }, { kind: "component", type: ChatMessagesComponent, selector: "ngx-chat-messages", inputs: ["messages"], outputs: ["regenerateAnswer"] }, { kind: "component", type: ChatSidebarComponent, selector: "ngx-chat-sidebar", inputs: ["mode"] }], animations: [
|
|
1397
|
+
// 定义容器的展开/收起动画
|
|
1398
|
+
trigger('chatBoxState', [
|
|
1399
|
+
state('collapsed', style({
|
|
1400
|
+
opacity: 0,
|
|
1401
|
+
transform: 'scale(0.8) translateY(20px)',
|
|
1402
|
+
display: 'none',
|
|
1403
|
+
// visibility: 'hidden',
|
|
1404
|
+
width: '660px',
|
|
1405
|
+
height: '820px', // 保持高度一致,但不可见
|
|
1406
|
+
})),
|
|
1407
|
+
state('expanded', style({
|
|
1408
|
+
opacity: 1,
|
|
1409
|
+
transform: 'scale(1) translateY(0)',
|
|
1410
|
+
display: 'flex',
|
|
1411
|
+
// visibility: 'visible',
|
|
1412
|
+
width: '660px',
|
|
1413
|
+
height: '820px',
|
|
1414
|
+
})),
|
|
1415
|
+
transition('collapsed <=> expanded', [
|
|
1416
|
+
animate('300ms cubic-bezier(0.4, 0.0, 0.2, 1)'), // 贝塞尔曲线提供更自然的动画
|
|
1417
|
+
]),
|
|
1418
|
+
]),
|
|
1419
|
+
// 定义悬浮按钮的旋转动画
|
|
1420
|
+
trigger('buttonIconState', [
|
|
1421
|
+
state('collapsed', style({
|
|
1422
|
+
transform: 'rotate(0deg)',
|
|
1423
|
+
})),
|
|
1424
|
+
state('expanded', style({
|
|
1425
|
+
transform: 'rotate(0deg)', // 展开时,X图标旋转45度
|
|
1426
|
+
})),
|
|
1427
|
+
transition('collapsed <=> expanded', [animate('300ms cubic-bezier(0.4, 0.0, 0.2, 1)')]),
|
|
1428
|
+
]),
|
|
1429
|
+
] });
|
|
1430
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FloatingChatComponent, decorators: [{
|
|
1431
|
+
type: Component,
|
|
1432
|
+
args: [{ selector: 'ngx-agent-floating-chat', animations: [
|
|
1433
|
+
// 定义容器的展开/收起动画
|
|
1434
|
+
trigger('chatBoxState', [
|
|
1435
|
+
state('collapsed', style({
|
|
1436
|
+
opacity: 0,
|
|
1437
|
+
transform: 'scale(0.8) translateY(20px)',
|
|
1438
|
+
display: 'none',
|
|
1439
|
+
// visibility: 'hidden',
|
|
1440
|
+
width: '660px',
|
|
1441
|
+
height: '820px', // 保持高度一致,但不可见
|
|
1442
|
+
})),
|
|
1443
|
+
state('expanded', style({
|
|
1444
|
+
opacity: 1,
|
|
1445
|
+
transform: 'scale(1) translateY(0)',
|
|
1446
|
+
display: 'flex',
|
|
1447
|
+
// visibility: 'visible',
|
|
1448
|
+
width: '660px',
|
|
1449
|
+
height: '820px',
|
|
1450
|
+
})),
|
|
1451
|
+
transition('collapsed <=> expanded', [
|
|
1452
|
+
animate('300ms cubic-bezier(0.4, 0.0, 0.2, 1)'), // 贝塞尔曲线提供更自然的动画
|
|
1453
|
+
]),
|
|
1454
|
+
]),
|
|
1455
|
+
// 定义悬浮按钮的旋转动画
|
|
1456
|
+
trigger('buttonIconState', [
|
|
1457
|
+
state('collapsed', style({
|
|
1458
|
+
transform: 'rotate(0deg)',
|
|
1459
|
+
})),
|
|
1460
|
+
state('expanded', style({
|
|
1461
|
+
transform: 'rotate(0deg)', // 展开时,X图标旋转45度
|
|
1462
|
+
})),
|
|
1463
|
+
transition('collapsed <=> expanded', [animate('300ms cubic-bezier(0.4, 0.0, 0.2, 1)')]),
|
|
1464
|
+
]),
|
|
1465
|
+
], template: "<div class=\"floating-chat-container\">\n <div class=\"chat-box\" [@chatBoxState]=\"isExpanded ? 'expanded' : 'collapsed'\">\n <header class=\"chat-header\">\n <div class=\"header-content\">\n <span\n class=\"icon menu-icon\"\n nz-popover\n [nzPopoverContent]=\"historyTpl\"\n nzPopoverTrigger=\"click\"\n nzPopoverOverlayClassName=\"params-select-popover\"\n nzPopoverPlacement=\"rightTop\"\n [nzPopoverVisible]=\"modelPopoverVisible\"\n (nzPopoverVisibleChange)=\"modelVisibleChange($event)\"\n >\n <img src=\"/assets/images/floating/history-menu.png\" style=\"width: 16px\" />\n </span>\n <h3 class=\"chat-title\">{{ title }}</h3>\n <img src=\"/assets/images/floating/new-chat.png\" style=\"width: 20px; cursor: pointer\" (click)=\"openNewChat()\" />\n </div>\n </header>\n\n <div class=\"chat-main\">\n <ngx-chat-messages\n #chatMessagesRef\n [messages]=\"messages\"\n (regenerateAnswer)=\"regenerateAnswer($event)\"\n ></ngx-chat-messages>\n <ngx-chat-input\n #chatInputRef\n [messages]=\"messages\"\n mode=\"card\"\n (sendMessage)=\"onSendMessage($event)\"\n ></ngx-chat-input>\n </div>\n </div>\n\n <button class=\"toggle-button\" (click)=\"toggleChatBox()\">\n <span class=\"button-icon\" [@buttonIconState]=\"isExpanded ? 'expanded' : 'collapsed'\">\n <img src=\"/assets/images/logo.png\" style=\"width: 36px\" *ngIf=\"!isExpanded\" />\n <img src=\"/assets/images/floating/arrow-down.png\" style=\"width: 24px\" *ngIf=\"isExpanded\" />\n </span>\n </button>\n</div>\n\n<!-- \u5386\u53F2\u5BF9\u8BDD -->\n<ng-template #historyTpl>\n <div style=\"width: 100%; max-height: 600px\">\n <!-- <div class=\"select-title\"> -->\n <!-- <div class=\"section-title\"> -->\n <!-- <img src=\"assets/images/sidebar/history-chat.png\" /> -->\n <!-- <span>\u5386\u53F2\u5BF9\u8BDD</span> -->\n <!-- </div> -->\n <!-- <i nz-icon nzType=\"close\" style=\"color: #999\" (click)=\"modelVisibleChange(false)\"></i> -->\n <!-- </div> -->\n <ngx-chat-sidebar #chatSidebarRef mode=\"card\"></ngx-chat-sidebar>\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:host ::ng-deep ::-webkit-scrollbar{width:6px}:host ::ng-deep ::-webkit-scrollbar-track{background:transparent}:host ::ng-deep ::-webkit-scrollbar-thumb{background:#d1d1d1;border-radius:8px}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:#b0b0b0}.floating-chat-container{position:fixed;bottom:20px;right:20px;z-index:1000;display:flex;flex-direction:column;align-items:flex-end}.chat-box{width:660px;height:820px;background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;margin-bottom:10px;overflow:hidden;display:flex;flex-direction:column}.chat-header{background-color:#fff;color:#fff;padding:12px 15px;border-top-left-radius:8px;border-top-right-radius:8px}.header-content{display:flex;justify-content:space-between;align-items:center}.chat-title{margin:0;font-size:16px;font-weight:500;flex-grow:1;text-align:center}.icon{font-size:18px;cursor:pointer}.chat-main{flex-grow:1;display:flex;flex-direction:column;overflow-y:auto;background-color:#fff}.welcome-message{text-align:center;padding-top:50px}.chat-icon{color:#409eff;margin-bottom:10px}.chat-icon svg{fill:#409eff}.welcome-text{color:#333;font-size:14px}.chat-footer{border-top:1px solid #eee;padding:10px 15px;background-color:#fff}.input-area-placeholder{display:flex;align-items:center;border:1px solid #ddd;border-radius:20px;margin-bottom:8px;overflow:hidden}.input-area-placeholder input{flex-grow:1;border:none;padding:8px 12px;outline:none;background-color:#fff;cursor:default}.input-area-placeholder .send-btn{background:none;border:none;padding:6px 10px;cursor:default;color:#bbb}.input-area-placeholder .send-btn svg{fill:#bbb}.bottom-controls{display:flex;justify-content:space-between;font-size:12px;color:#888}.control-item{cursor:default}.send-btn-placeholder{color:#409eff;font-weight:700;font-size:14px}.toggle-button{width:50px;height:50px;border-radius:50%;background-color:#fff;border:none;box-shadow:0 4px 8px #00000026;cursor:pointer;display:flex;justify-content:center;align-items:center;outline:none;color:#2157ff;order:2}.button-icon{display:block}.button-icon svg{fill:#fff}\n"] }]
|
|
1466
|
+
}], propDecorators: { title: [{
|
|
1467
|
+
type: Input
|
|
1468
|
+
}], baseUrl: [{
|
|
1469
|
+
type: Input
|
|
1470
|
+
}], token: [{
|
|
1471
|
+
type: Input
|
|
1472
|
+
}], chatSidebarRef: [{
|
|
1473
|
+
type: ViewChild,
|
|
1474
|
+
args: ['chatSidebarRef']
|
|
1475
|
+
}], chatMessagesRef: [{
|
|
1476
|
+
type: ViewChild,
|
|
1477
|
+
args: ['chatMessagesRef']
|
|
1478
|
+
}], chatInputRef: [{
|
|
1479
|
+
type: ViewChild,
|
|
1480
|
+
args: ['chatInputRef']
|
|
1481
|
+
}] } });
|
|
1482
|
+
|
|
1189
1483
|
class AgentChatModule {
|
|
1190
1484
|
}
|
|
1191
1485
|
AgentChatModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AgentChatModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
@@ -1194,7 +1488,8 @@ AgentChatModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
|
|
|
1194
1488
|
ChatMessagesComponent,
|
|
1195
1489
|
ChatSidebarComponent,
|
|
1196
1490
|
SimplePaginationComponent,
|
|
1197
|
-
HistoryGroupComponent
|
|
1491
|
+
HistoryGroupComponent,
|
|
1492
|
+
FloatingChatComponent], imports: [CommonModule,
|
|
1198
1493
|
NzAvatarModule,
|
|
1199
1494
|
NzSpinModule,
|
|
1200
1495
|
NzTagModule,
|
|
@@ -1208,8 +1503,11 @@ AgentChatModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
|
|
|
1208
1503
|
NzCheckboxModule,
|
|
1209
1504
|
NzIconModule,
|
|
1210
1505
|
NzPaginationModule,
|
|
1506
|
+
NzStepsModule,
|
|
1507
|
+
NzSelectModule,
|
|
1508
|
+
NzTreeSelectModule,
|
|
1211
1509
|
FormsModule,
|
|
1212
|
-
MarkdownPipe], exports: [NgxAgentChatComponent] });
|
|
1510
|
+
MarkdownPipe], exports: [NgxAgentChatComponent, FloatingChatComponent, FloatingChatComponent] });
|
|
1213
1511
|
AgentChatModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AgentChatModule, providers: [NzMessageService], imports: [CommonModule,
|
|
1214
1512
|
NzAvatarModule,
|
|
1215
1513
|
NzSpinModule,
|
|
@@ -1224,6 +1522,9 @@ AgentChatModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
1224
1522
|
NzCheckboxModule,
|
|
1225
1523
|
NzIconModule,
|
|
1226
1524
|
NzPaginationModule,
|
|
1525
|
+
NzStepsModule,
|
|
1526
|
+
NzSelectModule,
|
|
1527
|
+
NzTreeSelectModule,
|
|
1227
1528
|
FormsModule] });
|
|
1228
1529
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AgentChatModule, decorators: [{
|
|
1229
1530
|
type: NgModule,
|
|
@@ -1235,6 +1536,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1235
1536
|
ChatSidebarComponent,
|
|
1236
1537
|
SimplePaginationComponent,
|
|
1237
1538
|
HistoryGroupComponent,
|
|
1539
|
+
FloatingChatComponent,
|
|
1238
1540
|
],
|
|
1239
1541
|
imports: [
|
|
1240
1542
|
CommonModule,
|
|
@@ -1251,11 +1553,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1251
1553
|
NzCheckboxModule,
|
|
1252
1554
|
NzIconModule,
|
|
1253
1555
|
NzPaginationModule,
|
|
1556
|
+
NzStepsModule,
|
|
1557
|
+
NzSelectModule,
|
|
1558
|
+
NzTreeSelectModule,
|
|
1254
1559
|
FormsModule,
|
|
1255
1560
|
MarkdownPipe,
|
|
1256
1561
|
],
|
|
1257
1562
|
providers: [NzMessageService],
|
|
1258
|
-
exports: [NgxAgentChatComponent],
|
|
1563
|
+
exports: [NgxAgentChatComponent, FloatingChatComponent, FloatingChatComponent],
|
|
1259
1564
|
}]
|
|
1260
1565
|
}] });
|
|
1261
1566
|
|
|
@@ -1263,5 +1568,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1263
1568
|
* Generated bundle index. Do not edit.
|
|
1264
1569
|
*/
|
|
1265
1570
|
|
|
1266
|
-
export { AgentChatModule, NgxAgentChatComponent };
|
|
1571
|
+
export { AgentChatModule, FloatingChatComponent, NgxAgentChatComponent };
|
|
1267
1572
|
//# sourceMappingURL=qqsl-agent-chat.mjs.map
|