aidlab/FiDA_Front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: assistant

Browse Source
This commit is contained in:
zhangyahui
2026-03-30 17:11:57 +08:00
parent f9067e335d
commit b3881a871e
5 changed files with 188 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/components/Assistant/component/List.vue
View File

@@ -1,43 +1,103 @@
<template>
<div class="list-wrapper flex flex-col">
<div class="greeting list-item flex">
<div class="thumb">
<img src="@/assets/images/assistant-head.png" class="assistant-head" />
</div>
<div class="list-item-content-text">
{{$t('Assistant.greeting')}}
</div>
</div>
<div
class="list-item flex align-center"
v-for="item in props.messageList"
class="list-item flex"
v-for="(item, index) in props.messageList"
:key="item.id"
:class="item.role"
>
<div class="thumb">
<img
v-show="index > 0"
src="@/assets/images/assistant-head.png"
class="assistant-head"
/>
</div>
<div class="list-item-content-text">{{ item.content }}</div>
</div>
</div>
</template>
<script setup lang="ts">
import { VueMarkdown } from '@crazydos/vue-markdown'
import type { CustomAttrs } from '@crazydos/vue-markdown'
import rehypeRaw from 'rehype-raw'
const customAttrs: CustomAttrs = {
img: {
style: 'max-width: 100%;'
},
a: (node, combinedAttrs) => {
if (typeof node.properties.href === 'string') {
return { target: '_blank', rel: 'noopener noreferrer' }
} else {
return {}
}
},
heading: {
style: {
fontFamily: 'SemiBold',
lineHeight: 2
// fontSize: '1.4rem'
}
},
p: {
style: {
fontSize: '1rem',
lineHeight: 1.5
}
}
}
const props = defineProps<{
messageList: Array<any>
}>()
</script>
<style lang="less" scoped>
.list-wrapper {
row-gap: 1.6rem;
row-gap: 1.2rem;
.list-item {
min-height: 3.86rem;
width: fit-content;
&.user {
width: 26.2rem;
align-self: end;
column-gap: 1rem;
white-space: pre-line;
&.greeting {
color: #d58c4d;
font-family: 'Regular';
}
.thumb {
width: 4rem;
height: 4rem;
.assistant-head {
width: 100%;
height: 100%;
}
}
.list-item-content-text {
min-height: 3.86rem;
width: fit-content;
// &.user {
// width: 26.2rem;
// align-self: end;
// }
font-size: 1.4rem;
font-family: 'Regular';
color: #333;
padding: 1.1rem 1.7rem;
background: linear-gradient(#fffcf4, #fffcf4) padding-box,
linear-gradient(
119.03deg,
rgba(233, 121, 60, 0.3) 1.61%,
rgba(255, 207, 144, 0.3) 101.01%
)
border-box;
border: 1px solid transparent;
border-radius: 0.8rem;
}
font-size: 1.4rem;
font-family: 'Regular';
color: #333;
padding: 1.1rem 1.7rem;
background: linear-gradient(#fffcf4, #fffcf4) padding-box,
linear-gradient(
119.03deg,
rgba(233, 121, 60, 0.3) 1.61%,
rgba(255, 207, 144, 0.3) 101.01%
)
border-box;
border: 1px solid transparent;
border-radius: 3.18rem;
}
}
</style>