Skip to content

R
risk-monitor
提交 37f443d6 authored 作者: 张伊明's avatar 张伊明
浏览文件
操作

修改只能写报样式

上级 552e6293
隐藏空白字符变更
内嵌 并排
正在显示 包含 341 行增加 和 329 行删除
src/views/writtingAsstaint/index.vue
浏览文件 @ 37f443d6
...@@ -31,98 +31,100 @@ ...@@ -31,98 +31,100 @@
</div> </div>
<div class="writting-main"> <div class="writting-main">
<div class="left-box"> <div class="left-box">
<div class="process-box" v-if="isShowProcess"> <div class="left-box-input">
<div class="back" @click="handleBack">{{ "< 返回" }}</div> <div class="process-box" v-if="isShowProcess">
<div class="process-main-box"> <div class="back" @click="handleBack">{{ "< 返回" }}</div>
<div class="steps-box"> <div class="process-main-box">
<div class="steps-header"> <div class="steps-box">
<div class="icon"> <div class="steps-header">
<img src="./assets/images/right-arrow.png" alt="" /> <div class="icon">
<img src="./assets/images/right-arrow.png" alt="" />
</div>
<div class="text">{{ "执行步骤：" }}</div>
</div> </div>
<div class="text">{{ "执行步骤：" }}</div> <div class="steps-content" ref="scrollProcessContainer" v-html="renderedProcess"></div>
</div>
<div class="tool-box">
<div class="tool-header">{{ "工具调用" }}</div>
<div class="tool-main">当前智能体工具：{{ curAgentTool ? curAgentTool : "无" }}</div>
</div> </div>
<div class="steps-content" ref="scrollProcessContainer" v-html="renderedProcess"></div>
</div>
<div class="tool-box">
<div class="tool-header">{{ "工具调用" }}</div>
<div class="tool-main">当前智能体工具：{{ curAgentTool ? curAgentTool : "无" }}</div>
</div> </div>
</div> </div>
</div> <div class="sider" v-else>
<div class="sider" v-else> <div class="sider-box">
<div class="sider-box"> <div class="header">报文主题</div>
<div class="header">报文主题</div> <div class="title-box">
<div class="title-box"> <div class="title">主题名称</div>
<div class="title">主题名称</div> <el-input
<el-input :disabled="true"
:disabled="true" style="width: 476px; height: 32px"
style="width: 476px; height: 32px" class="title-input"
class="title-input" placeholder="输入主题名称，如：大而美法案"
placeholder="输入主题名称，如：大而美法案" v-model="writtingTitle"
v-model="writtingTitle" />
/> </div>
</div> <div class="description-box">
<div class="description-box"> <div class="title">主题描述</div>
<div class="title">主题描述</div> <el-input
<el-input :disabled="true"
:disabled="true" class="description-input"
class="description-input" type="textarea"
type="textarea" style="width: 476px"
style="width: 476px" :rows="8"
:rows="8" placeholder="输入报文主题描述，如：从科技领域方面分析大而美法案通过后对中国可能产生的影响"
placeholder="输入报文主题描述，如：从科技领域方面分析大而美法案通过后对中国可能产生的影响" v-model="descText"
v-model="descText" />
/> </div>
</div> </div>
</div> <div class="sider-box">
<div class="sider-box"> <div class="header">报文模板</div>
<div class="header">报文模板</div> <div class="template-box">
<div class="template-box"> <div
<div class="template"
class="template" :class="{ tempActive: tempActiveIndex === index }"
:class="{ tempActive: tempActiveIndex === index }" v-for="(temp, index) in tempList"
v-for="(temp, index) in tempList" :key="index"
:key="index" @click="handleClickTemp(temp, index)"
@click="handleClickTemp(temp, index)" >
> <div class="header">
<div class="header"> <div class="title">{{ temp.title }}</div>
<div class="title">{{ temp.title }}</div> <div class="icon">
<div class="icon"> <img src="./assets/images/template-icon.png" alt="" />
<img src="./assets/images/template-icon.png" alt="" /> </div>
</div>
<div class="content">{{ temp.desc }}</div>
<div class="active-icon" v-if="tempActiveIndex === index">
<img src="./assets/images/active-icon.png" alt="" />
</div>
<div class="selected-icon" v-if="tempActiveIndex === index">
<img src="./assets/images/selected-icon.png" alt="" />
</div> </div>
</div>
<div class="content">{{ temp.desc }}</div>
<div class="active-icon" v-if="tempActiveIndex === index">
<img src="./assets/images/active-icon.png" alt="" />
</div>
<div class="selected-icon" v-if="tempActiveIndex === index">
<img src="./assets/images/selected-icon.png" alt="" />
</div> </div>
</div> </div>
</div> </div>
</div> <div class="sider-box">
<div class="sider-box"> <div class="header">加载本地文件</div>
<div class="header">加载本地文件</div> <el-upload
<el-upload action=""
action="" :auto-upload="false"
:auto-upload="false" accept=".pdf"
accept=".pdf" limit="1"
limit="1" :on-exceed="handleExceed"
:on-exceed="handleExceed" ref="upload"
ref="upload" :on-change="handleFileChange"
:on-change="handleFileChange" :file-list="uploadFileList"
:file-list="uploadFileList" >
> <el-button class="sider-upload-btn" type="primary">
<el-button class="sider-upload-btn" type="primary"> <el-icon class="sider-upload-btn-text">
<el-icon class="sider-upload-btn-text"> <Upload />
<Upload /> </el-icon>
</el-icon> <span class="sider-upload-btn-text">上传文件</span>
<span class="sider-upload-btn-text">上传文件</span> </el-button>
</el-button> <template #tip>
<template #tip> <div class="sider-upload-btn-tip">支持扩展名：.doc .docx .pdf</div>
<div class="sider-upload-btn-tip">支持扩展名：.doc .docx .pdf</div> </template>
</template> </el-upload>
</el-upload> </div>
</div> </div>
</div> </div>
<div class="submit-area"> <div class="submit-area">
...@@ -266,7 +268,7 @@ const handleGenerate = () => { ...@@ -266,7 +268,7 @@ const handleGenerate = () => {
const curAgentTool = ref("报告整体优化工具"); const curAgentTool = ref("报告整体优化工具");
const getStreamChat = async (search, inputValue) => { const getStreamChat = async (search, inputValue) => {
if (uploadFileList.value.length > 0) { if (curTempTitle.value === "政令") {
const rawFile = uploadFileList.value[0].raw; const rawFile = uploadFileList.value[0].raw;
if (!rawFile) { if (!rawFile) {
ElMessage.error("文件解析失败，请重新选择"); ElMessage.error("文件解析失败，请重新选择");
...@@ -364,7 +366,7 @@ const callSseWithPdf = async selectedFile => { ...@@ -364,7 +366,7 @@ const callSseWithPdf = async selectedFile => {
await callSseWithAi({ await callSseWithAi({
query: writtingTitle.value, query: writtingTitle.value,
desc: descText.value, desc: descText.value,
topic: "政令", topic: curTempTitle.value,
result: jsonData // 传递解析后的对象而非原始字符串 result: jsonData // 传递解析后的对象而非原始字符串
}); });
} }
...@@ -491,6 +493,10 @@ const tabList = ref([ ...@@ -491,6 +493,10 @@ const tabList = ref([
} }
]); ]);
const tempList = ref([ const tempList = ref([
{
title: "法案",
desc: "基于政令内容生成各维度的综合分析报告"
},
{ {
title: "智库", title: "智库",
desc: "基于智库内容生成各维度的综合分析报告" desc: "基于智库内容生成各维度的综合分析报告"
...@@ -633,321 +639,326 @@ onUnmounted(() => { ...@@ -633,321 +639,326 @@ onUnmounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 525px; width: 525px;
padding: 21px 21px 29px 22px; padding-top: 22px;
padding-bottom: 29px;
box-sizing: border-box; box-sizing: border-box;
border-right: 1px solid rgba(234, 236, 238, 1); border-right: 1px solid rgba(234, 236, 238, 1);
border-top: 1px solid rgba(234, 236, 238, 1); border-top: 1px solid rgba(234, 236, 238, 1);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
overflow: scroll;
.process-box { .left-box-input {
display: flex; overflow-y: scroll;
flex-direction: column; overflow-x: hidden;
gap: 20px; padding-inline: 22px;
.process-box {
display: flex;
flex-direction: column;
gap: 20px;
.back { .back {
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
color: var(--color-main-active); color: var(--color-main-active);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
cursor: pointer; cursor: pointer;
} }
.process-main-box { .process-main-box {
width: 476px; width: 476px;
.analysis-box { .analysis-box {
.analysis-header { .analysis-header {
display: flex; display: flex;
.icon {
margin-top: 5px;
width: 20px;
height: 20px;
.icon { img {
margin-top: 5px; width: 100%;
width: 20px; height: 100%;
height: 20px; }
}
img { .text {
width: 100%; height: 30px;
height: 100%; line-height: 30px;
font-family: Microsoft YaHei;
color: #333;
font-size: 20px;
font-weight: 700;
margin-left: 5px;
} }
} }
.text { .analysis-content {
height: 30px; height: 90px;
line-height: 30px; line-height: 30px;
color: #555;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
color: #333; font-size: 16px;
font-size: 20px; font-weight: 400;
font-weight: 700; text-indent: 32px;
margin-left: 5px;
} }
} }
.analysis-content { .steps-box {
height: 90px; .steps-header {
line-height: 30px; display: flex;
color: #555;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
text-indent: 32px;
}
}
.steps-box { .icon {
.steps-header { margin-top: 5px;
display: flex; width: 20px;
height: 20px;
.icon { img {
margin-top: 5px; width: 100%;
width: 20px; height: 100%;
height: 20px; }
}
img { .text {
width: 100%; height: 30px;
height: 100%; line-height: 30px;
font-family: Microsoft YaHei;
color: #333;
font-size: 20px;
font-weight: 700;
margin-left: 5px;
} }
} }
.text { .steps-content {
height: 30px; width: 100%;
line-height: 30px; min-height: 20px;
font-family: Microsoft YaHei; max-height: 480px;
color: #333; overflow-x: hidden;
font-size: 20px; overflow-y: auto;
font-weight: 700;
margin-left: 5px;
} }
} }
.steps-content { .doing-box {
width: 100%; height: 40px;
min-height: 20px; line-height: 40px;
max-height: 480px; color: #555;
overflow-x: hidden; font-family: Microsoft YaHei;
overflow-y: auto; font-size: 16px;
font-weight: 400;
margin-left: 20px;
} }
}
.doing-box {
height: 40px;
line-height: 40px;
color: #555;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
margin-left: 20px;
}
.tool-box { .tool-box {
width: 440px; width: 440px;
height: 160px; height: 160px;
margin: 10px auto; margin: 10px auto;
background: #f6f9fe; background: #f6f9fe;
border-radius: 10px; border-radius: 10px;
.tool-header { .tool-header {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
margin-left: 20px; margin-left: 20px;
color: var(--color-main-active); color: var(--color-main-active);
} }
.tool-main { .tool-main {
height: 110px; height: 110px;
width: 400px; width: 400px;
margin: 0 auto; margin: 0 auto;
background: #fff; background: #fff;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 40px; line-height: 40px;
}
} }
} }
} }
}
.sider {
box-sizing: border-box;
display: flex;
flex-direction: column;
gap: 23px;
.sider-box { .sider {
.header { box-sizing: border-box;
color: rgba(59, 65, 75, 1); display: flex;
font-family: Microsoft YaHei; flex-direction: column;
font-size: 16px; gap: 23px;
font-weight: 700;
line-height: 24px;
}
.template-box { .sider-box {
margin-top: 19px; .header {
height: 260px; color: rgba(59, 65, 75, 1);
display: flex; font-family: Microsoft YaHei;
flex-wrap: wrap; font-size: 16px;
gap: 16px; font-weight: 700;
line-height: 24px;
}
.template { .template-box {
width: 230px; margin-top: 19px;
height: 120px; height: 260px;
box-sizing: border-box; display: flex;
border: 1px solid rgba(234, 236, 238, 1); flex-wrap: wrap;
border-radius: 4px; gap: 16px;
position: relative;
cursor: pointer; .template {
width: 230px;
height: 120px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 4px;
position: relative;
cursor: pointer;
.active-icon {
width: 24px;
height: 24px;
position: absolute;
top: 0;
right: 0;
z-index: 99;
.active-icon { img {
width: 24px; width: 100%;
height: 24px; height: 100%;
position: absolute; }
top: 0;
right: 0;
z-index: 99;
img {
width: 100%;
height: 100%;
} }
}
.selected-icon {
width: 8px;
height: 6px;
position: absolute;
top: -4px;
right: 3px;
z-index: 100;
img { .selected-icon {
width: 8px; width: 8px;
height: 6px; height: 6px;
position: absolute;
top: -4px;
right: 3px;
z-index: 100;
img {
width: 8px;
height: 6px;
}
} }
}
.header { .header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
height: 50px; height: 50px;
.title {
height: 24px;
// color: rgba(59, 65, 75, 1);
color: #333;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 24px;
margin-left: 15px;
margin-top: 16px;
}
.title { .icon {
height: 24px; margin-top: 15px;
// color: rgba(59, 65, 75, 1); margin-right: 16px;
color: #333; width: 30px;
height: 30px;
border-radius: 15px;
background: rgba(231, 243, 255, 1);
img {
width: 17px;
height: 14px;
margin-top: 8px;
margin-left: 7px;
}
}
}
.content {
margin: 0 auto;
width: 200px;
height: 48px;
margin-top: 10px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 400;
line-height: 24px; line-height: 24px;
margin-left: 15px;
margin-top: 16px;
} }
}
.icon { .tempActive {
margin-top: 15px; border: 1px solid rgba(5, 95, 194, 1);
margin-right: 16px; background: rgba(246, 250, 255, 1);
width: 30px;
height: 30px;
border-radius: 15px;
background: rgba(231, 243, 255, 1);
img {
width: 17px;
height: 14px;
margin-top: 8px;
margin-left: 7px;
}
}
} }
}
.content { .title-box {
margin: 0 auto; margin-top: 15px;
width: 200px;
height: 48px; .title {
margin-top: 10px; color: rgba(95, 101, 108, 1);
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
} }
}
.tempActive { .title-input {
border: 1px solid rgba(5, 95, 194, 1); margin-top: 15px;
background: rgba(246, 250, 255, 1); }
} }
}
.title-box { .description-box {
margin-top: 15px; margin-top: 24px;
.title { .title {
color: rgba(95, 101, 108, 1); height: 24px;
font-family: Microsoft YaHei; color: rgba(95, 101, 108, 1);
font-size: 16px; font-family: Microsoft YaHei;
font-weight: 400; font-size: 16px;
line-height: 24px; font-weight: 400;
} line-height: 24px;
}
.title-input { .description-input {
margin-top: 15px; margin-top: 12px;
height: 200px;
}
} }
}
.description-box { .sider-upload-btn {
margin-top: 24px; width: 476px;
height: 36px;
box-sizing: border-box;
border: 1px dashed rgba(234, 236, 238, 1);
border-radius: 6px;
background: rgba(247, 248, 249, 1);
margin-top: 19px;
}
.title { .sider-upload-btn-text {
height: 24px; color: rgba(59, 65, 75, 1);
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-style: Regular;
font-size: 14px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 22px;
letter-spacing: 0px;
text-align: left;
} }
.description-input { .sider-upload-btn-tip {
margin-top: 12px; color: rgba(95, 101, 108, 1);
height: 200px; font-family: Microsoft YaHei;
font-style: Regular;
font-size: 14px;
font-weight: 400;
line-height: 22px;
letter-spacing: 0px;
text-align: left;
margin-top: 8px;
} }
} }
.sider-upload-btn {
width: 476px;
height: 36px;
box-sizing: border-box;
border: 1px dashed rgba(234, 236, 238, 1);
border-radius: 6px;
background: rgba(247, 248, 249, 1);
margin-top: 19px;
}
.sider-upload-btn-text {
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 14px;
font-weight: 400;
line-height: 22px;
letter-spacing: 0px;
text-align: left;
}
.sider-upload-btn-tip {
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-style: Regular;
font-size: 14px;
font-weight: 400;
line-height: 22px;
letter-spacing: 0px;
text-align: left;
margin-top: 8px;
}
} }
} }
...@@ -955,6 +966,7 @@ onUnmounted(() => { ...@@ -955,6 +966,7 @@ onUnmounted(() => {
margin-top: auto; margin-top: auto;
width: 100%; width: 100%;
min-height: 74px; min-height: 74px;
padding-inline: 22px;
.tips { .tips {
height: 22px; height: 22px;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论