Skip to content

Commit afada6f

Browse files
feat: chat
1 parent 26be536 commit afada6f

File tree

2 files changed

+36
-52
lines changed

2 files changed

+36
-52
lines changed

ui/src/components/ai-chat/component/chat-input-operate/index.vue

Lines changed: 25 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -303,7 +303,7 @@ import { t } from '@/locales'
303303
const router = useRouter()
304304
const route = useRoute()
305305
const {
306-
query: { mode, question }
306+
query: { mode, question },
307307
} = route as any
308308
const quickInputRef = ref()
309309
const props = withDefaults(
@@ -321,8 +321,8 @@ const props = withDefaults(
321321
}>(),
322322
{
323323
applicationDetails: () => ({}),
324-
available: true
325-
}
324+
available: true,
325+
},
326326
)
327327
const emit = defineEmits(['update:chatId', 'update:loading', 'update:showUserInput'])
328328
const chartOpenId = ref<string>()
@@ -336,15 +336,15 @@ const chatId_context = computed({
336336
set: (v) => {
337337
chartOpenId.value = v
338338
emit('update:chatId', v)
339-
}
339+
},
340340
})
341341
const localLoading = computed({
342342
get: () => {
343343
return props.loading
344344
},
345345
set: (v) => {
346346
emit('update:loading', v)
347-
}
347+
},
348348
})
349349
350350
const upload = ref()
@@ -418,7 +418,7 @@ const uploadFile = async (file: any, fileList: any) => {
418418
formData.append('file', file.raw, file.name)
419419
//
420420
const extension = file.name.split('.').pop().toUpperCase() // 获取文件后缀名并转为小写
421-
console.log(documentExtensions)
421+
console.log(documentExtensions)
422422
if (imageExtensions.includes(extension)) {
423423
uploadImageList.value.push(file)
424424
} else if (documentExtensions.includes(extension)) {
@@ -447,13 +447,13 @@ console.log(documentExtensions)
447447
props.applicationDetails.id as string,
448448
chatId_context.value as string,
449449
formData,
450-
localLoading
450+
localLoading,
451451
)
452452
.then((response) => {
453453
fileList.splice(0, fileList.length)
454454
uploadImageList.value.forEach((file: any) => {
455455
const f = response.data.filter(
456-
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', '')
456+
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', ''),
457457
)
458458
if (f.length > 0) {
459459
file.url = f[0].url
@@ -462,7 +462,7 @@ console.log(documentExtensions)
462462
})
463463
uploadDocumentList.value.forEach((file: any) => {
464464
const f = response.data.filter(
465-
(f: any) => f.name.replaceAll(' ', '') == file.name.replaceAll(' ', '')
465+
(f: any) => f.name.replaceAll(' ', '') == file.name.replaceAll(' ', ''),
466466
)
467467
if (f.length > 0) {
468468
file.url = f[0].url
@@ -471,7 +471,7 @@ console.log(documentExtensions)
471471
})
472472
uploadAudioList.value.forEach((file: any) => {
473473
const f = response.data.filter(
474-
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', '')
474+
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', ''),
475475
)
476476
if (f.length > 0) {
477477
file.url = f[0].url
@@ -480,7 +480,7 @@ console.log(documentExtensions)
480480
})
481481
uploadVideoList.value.forEach((file: any) => {
482482
const f = response.data.filter(
483-
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', '')
483+
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', ''),
484484
)
485485
if (f.length > 0) {
486486
file.url = f[0].url
@@ -489,7 +489,7 @@ console.log(documentExtensions)
489489
})
490490
uploadOtherList.value.forEach((file: any) => {
491491
const f = response.data.filter(
492-
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', '')
492+
(f: any) => f.name.replaceAll(' ', '') === file.name.replaceAll(' ', ''),
493493
)
494494
if (f.length > 0) {
495495
file.url = f[0].url
@@ -520,7 +520,7 @@ const handlePaste = (event: ClipboardEvent) => {
520520
size: rawFile.size,
521521
raw: rawFile, // 原始文件对象
522522
status: 'ready', // 文件状态
523-
percentage: 0 // 上传进度
523+
percentage: 0, // 上传进度
524524
}
525525
526526
// 手动触发上传逻辑(模拟 on-change 事件)
@@ -544,7 +544,7 @@ const handleDrop = (event: DragEvent) => {
544544
size: rawFile.size,
545545
raw: rawFile,
546546
status: 'ready',
547-
percentage: 0
547+
percentage: 0,
548548
}
549549
uploadFile(elFile, [elFile])
550550
})
@@ -566,7 +566,7 @@ const uploadOtherList = ref<Array<any>>([])
566566
const showDelete = ref('')
567567
568568
const isDisabledChat = computed(
569-
() => !(inputValue.value.trim() && (props.appId || props.applicationDetails?.name))
569+
() => !(inputValue.value.trim() && (props.appId || props.applicationDetails?.name)),
570570
)
571571
// 是否显示移动端语音按钮
572572
const isMicrophone = ref(false)
@@ -605,7 +605,7 @@ class RecorderManage {
605605
const recorder = new Recorder({
606606
type: 'mp3',
607607
bitRate: 128,
608-
sampleRate: 16000
608+
sampleRate: 16000,
609609
})
610610
if (!this.recorder) {
611611
recorder.open(() => {
@@ -625,7 +625,7 @@ class RecorderManage {
625625
const recorder = new Recorder({
626626
type: 'mp3',
627627
bitRate: 128,
628-
sampleRate: 16000
628+
sampleRate: 16000,
629629
})
630630
recorder.open(() => {
631631
this.recorder = recorder
@@ -648,9 +648,9 @@ class RecorderManage {
648648
MsgAlert(t('common.tip'), err, {
649649
confirmButtonText: t('chat.tip.confirm'),
650650
dangerouslyUseHTMLString: true,
651-
customClass: 'record-tip-confirm'
651+
customClass: 'record-tip-confirm',
652652
})
653-
}
653+
},
654654
)
655655
}
656656
}
@@ -666,7 +666,7 @@ class RecorderManage {
666666
MsgAlert(t('common.tip'), err, {
667667
confirmButtonText: t('chat.tip.confirm'),
668668
dangerouslyUseHTMLString: true,
669-
customClass: 'record-tip-confirm'
669+
customClass: 'record-tip-confirm',
670670
})
671671
} else {
672672
MsgAlert(
@@ -678,8 +678,8 @@ class RecorderManage {
678678
{
679679
confirmButtonText: t('chat.tip.confirm'),
680680
dangerouslyUseHTMLString: true,
681-
customClass: 'record-tip-confirm'
682-
}
681+
customClass: 'record-tip-confirm',
682+
},
683683
)
684684
}
685685
}
@@ -775,7 +775,7 @@ function autoSendMessage() {
775775
document_list: uploadDocumentList.value,
776776
audio_list: uploadAudioList.value,
777777
video_list: uploadVideoList.value,
778-
other_list: uploadOtherList.value
778+
other_list: uploadOtherList.value,
779779
})
780780
inputValue.value = ''
781781
uploadImageList.value = []
@@ -794,7 +794,7 @@ function autoSendMessage() {
794794
795795
function sendChatHandle(event?: any) {
796796
const isMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
797-
navigator.userAgent
797+
navigator.userAgent,
798798
)
799799
// 如果是移动端,且按下回车键,不直接发送
800800
if ((isMobile || mode === 'mobile') && event?.key === 'Enter') {
@@ -816,7 +816,7 @@ function sendChatHandle(event?: any) {
816816
}
817817
const insertNewlineAtCursor = (event?: any) => {
818818
const textarea = quickInputRef.value.$el.querySelector(
819-
'.el-textarea__inner'
819+
'.el-textarea__inner',
820820
) as HTMLTextAreaElement
821821
const startPos = textarea.selectionStart
822822
const endPos = textarea.selectionEnd
@@ -887,22 +887,10 @@ onMounted(() => {
887887
<style lang="scss" scoped>
888888
.ai-chat {
889889
&__operate {
890-
background: #f3f7f9;
891890
position: relative;
892891
width: 100%;
893892
box-sizing: border-box;
894893
z-index: 10;
895-
896-
&:before {
897-
background: linear-gradient(0deg, #f3f7f9 0%, rgba(243, 247, 249, 0) 100%);
898-
content: '';
899-
position: absolute;
900-
width: 100%;
901-
top: -16px;
902-
left: 0;
903-
height: 16px;
904-
}
905-
906894
:deep(.operate-textarea) {
907895
box-shadow: 0px 6px 24px 0px rgba(31, 35, 41, 0.08);
908896
background-color: #ffffff;

ui/src/views/chat/pc/index.vue

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
<template>
22
<div
3-
class="chat-pc layout-bg"
3+
class="chat-pc"
44
:class="classObj"
55
v-loading="loading"
66
:style="{
77
'--el-color-primary': applicationDetail?.custom_theme?.theme_color,
88
'--el-color-primary-light-9': hexToRgba(applicationDetail?.custom_theme?.theme_color, 0.1),
99
}"
1010
>
11-
11111111111
1211
<div class="flex">
1312
<div class="chat-pc__left border-r">
14-
<div class="p-24 pb-0">
15-
<div class="flex align-center">
16-
<div class="mr-12 ml-24 flex">
13+
<div class="p-16-24 pb-0">
14+
<div class="flex align-center mb-16">
15+
<div class="flex">
1716
<el-avatar
1817
v-if="isAppIcon(applicationDetail?.icon)"
1918
shape="square"
@@ -92,7 +91,7 @@
9291
</div>
9392
</div>
9493
<div class="chat-pc__right">
95-
<div class="right-header border-b mb-24 p-16-24 flex-between">
94+
<div class="mb-24 p-16-24 flex-between">
9695
<h4 class="ellipsis-1" style="width: 66%">
9796
{{ currentChatName }}
9897
</h4>
@@ -394,6 +393,7 @@ onMounted(() => {
394393
<style lang="scss">
395394
.chat-pc {
396395
overflow: hidden;
396+
background: #eef1f4;
397397
398398
&__header {
399399
background: var(--app-header-bg-color);
@@ -409,31 +409,27 @@ onMounted(() => {
409409
}
410410
411411
&__left {
412-
padding-top: calc(var(--app-header-height) - 8px);
413-
background: #ffffff;
412+
background:
413+
linear-gradient(187.61deg, rgba(235, 241, 255, 0.5) 39.6%, rgba(231, 249, 255, 0.5) 94.3%),
414+
#eef1f4;
415+
414416
width: 280px;
415417
416418
.add-button {
417419
border: 1px solid var(--el-color-primary);
418420
}
419421
420422
.left-height {
421-
height: calc(100vh - var(--app-header-height) - 135px);
423+
height: calc(100vh - var(--app-header-height) - 85px);
422424
}
423425
}
424426
425427
&__right {
426428
width: calc(100% - 280px);
427-
padding-top: calc(var(--app-header-height));
428429
overflow: hidden;
429430
position: relative;
430431
box-sizing: border-box;
431432
432-
.right-header {
433-
background: #ffffff;
434-
box-sizing: border-box;
435-
}
436-
437433
.right-height {
438434
height: calc(100vh - var(--app-header-height) * 2 - 24px);
439435
}

0 commit comments

Comments
 (0)