This commit is contained in:
李建国 2025-04-20 21:16:56 +08:00
commit ec4c9a3639
5 changed files with 103 additions and 15 deletions

2
.env
View File

@ -1,2 +1,2 @@
VITE_APP_BASE_API=http://160.202.224.52:31002
VITE_APP_ENV=default
VITE_APP_ENV=default

View File

@ -1,2 +1,2 @@
VITE_APP_BASE_API=http://api.production.com
VITE_APP_BASE_API=http://160.202.224.52:31002
VITE_APP_ENV=production

View File

@ -7,7 +7,7 @@
"dev": "vite --mode development",
"dev:test": "vite --mode test",
"build": "vite build",
"build:test": "vite build --mode test",
"build:dev": "vite build --mode development",
"build:prod": "vite build --mode production",
"preview": "vite preview"
},

View File

@ -1,10 +1,17 @@
<template>
<el-dialog
v-model="dialogVisible"
width="500px"
:width="isMobile ? '90%' : '500px'"
:close-on-click-modal="true"
destroy-on-close
class="customer-background-dialog"
:fullscreen="isMobile"
>
<template #header>
<div class="dialog-header">
<h3 class="dialog-title">客户信息</h3>
</div>
</template>
<div class="background-info-content" v-if="currentMode">
<div v-html="formattedBackground"></div>
</div>
@ -20,7 +27,7 @@
</template>
<script setup>
import { computed } from 'vue'
import { computed, ref, onMounted, onUnmounted } from 'vue'
import { useChatStore } from '@/store/chat'
import { marked } from 'marked'
@ -34,6 +41,20 @@ const props = defineProps({
const emit = defineEmits(['update:modelValue'])
const chatStore = useChatStore()
const isMobile = ref(false)
const checkMobile = () => {
isMobile.value = window.innerWidth <= 768
}
onMounted(() => {
checkMobile()
window.addEventListener('resize', checkMobile)
})
onUnmounted(() => {
window.removeEventListener('resize', checkMobile)
})
const dialogVisible = computed({
get: () => props.modelValue,
@ -67,44 +88,92 @@ const handleClose = () => {
</script>
<style lang="scss" scoped>
.customer-background-dialog {
:deep(.el-dialog) {
@media screen and (max-width: 768px) {
margin: 0 !important;
max-width: 100% !important;
border-radius: 0;
.el-dialog__header {
margin: 0;
padding: 16px;
border-bottom: 1px solid #eee;
}
.el-dialog__body {
padding: 16px;
max-height: calc(100vh - 120px);
overflow-y: auto;
}
.el-dialog__footer {
padding: 12px 16px;
border-top: 1px solid #eee;
}
}
}
}
.dialog-header {
.dialog-title {
font-size: 18px;
font-weight: 500;
color: #333;
margin: 0;
}
}
.background-info-content {
padding: 0 20px;
padding: 0;
:deep(h1) {
font-size: 20px;
font-weight: 600;
margin-bottom: 16px;
margin: 0 0 16px 0;
color: #333;
}
:deep(h2) {
font-size: 18px;
font-weight: 600;
margin: 24px 0 16px;
margin: 20px 0 12px 0;
color: #333;
}
:deep(h3) {
font-size: 16px;
font-weight: 600;
margin: 20px 0 12px;
margin: 16px 0 8px 0;
color: #333;
}
:deep(p) {
margin-bottom: 12px;
margin: 0 0 12px 0;
line-height: 1.6;
color: #666;
&:last-child {
margin-bottom: 0;
}
}
:deep(ul), :deep(ol) {
margin-bottom: 12px;
margin: 0 0 12px 0;
padding-left: 20px;
li {
margin-bottom: 8px;
line-height: 1.6;
color: #666;
&:last-child {
margin-bottom: 0;
}
}
&:last-child {
margin-bottom: 0;
}
}
@ -123,6 +192,26 @@ const handleClose = () => {
.dialog-footer {
display: flex;
justify-content: flex-end;
margin-top: 20px;
margin-top: 0;
}
@media screen and (max-width: 768px) {
.background-info-content {
:deep(h1) {
font-size: 18px;
}
:deep(h2) {
font-size: 16px;
}
:deep(h3) {
font-size: 15px;
}
:deep(p), :deep(ul), :deep(ol) {
font-size: 14px;
}
}
}
</style>

View File

@ -20,7 +20,7 @@
<HistoryButton v-if="settingsStore.sidebarCollapsed" :icon-only="false" class="title-history-btn" />
</div>
<div class="actions">
<el-tooltip content="删除会话" placement="bottom">
<el-tooltip content="删除会话" placement="bottom" v-if="chatStore.conversationId">
<el-button
class="action-btn delete-btn"
:icon="Delete"
@ -38,13 +38,12 @@
>
</el-button>
</el-tooltip>
<el-tooltip :content="hasBackground ? '客户背景' : '暂无客户背景信息'" placement="bottom">
<el-tooltip :content="hasBackground ? '客户背景' : '暂无客户背景信息'" placement="bottom" v-if="hasBackground">
<el-button
class="action-btn"
:icon="User"
@click="showUserInfo = true"
text
:disabled="!hasBackground"
>
</el-button>
</el-tooltip>