feat: agent页面 reprot 按钮

This commit is contained in:
2026-03-17 14:16:14 +08:00
parent 38635a6952
commit 0bd313c107
4 changed files with 97 additions and 4 deletions

View File

@@ -35,8 +35,36 @@
</div>
<div class="operate flex align-center space-between">
<div class="left flex align-center">
<div class="attach flex flex-center" @click="triggerFileUpload">
<img src="@/assets/icons/attach.svg" alt="" />
<div class="agent-operate flex flex-center">
<el-popover
placement="top-end"
trigger="click"
popper-class="agent-plus-popover"
>
<template #reference>
<SvgIcon name="plus" color="#0D0D0D" size="16" />
</template>
<template #default>
<div class="agent-modal flex flex-col">
<div class="file flex align-center" @click="triggerFileUpload">
<img src="@/assets/icons/attach.svg" class="file-icon" />
<span>Upload files</span>
</div>
<div class="gap"></div>
<div class="report flex align-center" @click="toogltReportTag">
<SvgIcon color="#5A5A5A" name="light" size="11" />
<span>Trending report</span>
</div>
</div>
</template>
</el-popover>
</div>
<div
class="attach flex flex-center"
@click="triggerFileUpload"
v-if="!isAgentMode"
>
<img src="@/assets/icons/attach.svg" />
</div>
<input
ref="fileInputRef"
@@ -186,7 +214,7 @@
class="report-btn flex space-between align-center"
@click="toogltReportTag"
>
<SvgIcon class="light-icon" name="light" size="16" />
<SvgIcon class="light-icon" color="#FFDB56" name="light" size="16" />
<span>{{ $t('Input.trendingReport') }}</span>
</div>
<Preview v-model="showPreview" :url="previewUrl" />
@@ -656,6 +684,7 @@
const payload = {
text: inputValue.value.trim(),
images: imageUrlList,
useReport: reportTags.value.length > 0,
tempImages: uploadedImages.value
}
emits('send', payload)
@@ -941,6 +970,15 @@
.left {
column-gap: 2rem;
}
.agent-operate {
width: 3.2rem;
height: 3.2rem;
cursor: pointer;
border-radius: 50%;
&:hover {
background-color: #f0f0f0;
}
}
.attach {
width: 4rem;
height: 4rem;
@@ -1320,4 +1358,53 @@
height: 1.2rem;
}
}
.agent-plus-popover {
display: flex;
justify-content: flex-start;
background: transparent !important;
box-shadow: none !important;
border: none !important;
padding: 0 !important;
margin-bottom: -1rem;
pointer-events: none;
.el-popper__arrow:before {
display: none;
}
.agent-modal {
// width: 14.6rem;
// height: 8.5rem;
row-gap: 1.2rem;
font-family: 'Medium';
font-weight: 500;
font-size: 1.3rem;
color: #222;
background-color: #fff;
border: 1px solid #d9d9d9;
box-shadow: 0px 6.53px 32.63px 0px #0000000d;
border-radius: 1rem;
padding: 1.2rem 1.4rem;
.c-svg {
width: initial;
width: 1rem;
height: 1.3rem;
}
.file,
.report {
line-height: 1.8rem;
column-gap: 1rem;
cursor: pointer;
}
.file {
.file-icon {
width: 1.1rem;
height: 1.3rem;
}
}
.gap {
height: 0.05rem;
background-color: #d4d4d4;
}
}
}
</style>