tj

src/stores/writtingAsstaintStore.js

@@ -74,6 +74,9 @@ export const useWrittingAsstaintStore = defineStore('writtingAsstaint', {
         headerTabType:'translate',
         // 底部
         bottomProgressNum:0, //文档解析 假进度
+        resultWriteData:null, //文档分析结束之后 写报使用
+        // 写报
+        isWriteStart:false,// 写报以进行中
     }),
 
     getters: {
@@ -156,14 +159,14 @@ export const useWrittingAsstaintStore = defineStore('writtingAsstaint', {
         async handleHeaderTab(type){
             this.headerTabType=type
         },
+        // 智能写报
         async generateWrite(){
-            console.log(3)
-
+            this.isWriteStart=true
             await this.fetchReportData({
                 query: this.writtingTitle,
                 desc: this.descText,
                 topic: this.curTempTitle,
-                result: this.clauseTranslationMessages[this.clauseTranslationMessages.length-1]
+                result: this.resultWriteData
             });
         },
 
@@ -389,9 +392,10 @@ export const useWrittingAsstaintStore = defineStore('writtingAsstaint', {
                                             result: jsonData
                                         }
                                     )
-                                    // 假进度完成
-                                    this.bottomProgressNum=100
+                                    
+                                    this.bottomProgressNum=100 // 假进度完成
                                     this.tabList[2].active=true //有结果之后放开写报按钮
+                                    this.resultWriteData=jsonData //给写报使用
                                     // await this.fetchReportData({
                                         // query: this.writtingTitle,
                                         // desc: this.descText,
@@ -434,7 +438,6 @@ export const useWrittingAsstaintStore = defineStore('writtingAsstaint', {
 
         // ========== AI 生成报文 SSE（更新报文内容 + 执行步骤） ==========
         async fetchReportData(params) {
-            console.log(7)
 
             if (this.abortController) this.abortController.abort();
             this.abortController = new AbortController();
@@ -497,6 +500,7 @@ export const useWrittingAsstaintStore = defineStore('writtingAsstaint', {
                     openWhenHidden: true,
                     onopen: (res) => {
                         console.log('流式回答开始', res);
+                        
                     },
                     onmessage: (res) => {
                         if (!res.data) return;

src/views/writtingAsstaint/components/WrittingBottom.vue

@@ -15,36 +15,36 @@
                 </div>
             </div>
         </div>
-
-        
-
-        <div class="notParsed" v-else >
-            <div class="parsedItem" v-if="store.bottomProgressNum<100">
-                <div class="analysis" @click="onAnalysisClick()">
-                    <img src="@/assets/icons/aiBox/ai-logo.png" alt="">
-                    <span class="text-tip-1">文档解析</span>
-                </div>
-                <div class="progress">
-                    <img src="../assets/images/tips-icon.png" alt="">
-                    <span class="text-tip-2">内容由AI生成，无法确保真实准确，仅供参考</span>
-                </div>
+        <div class="parsed" v-else-if="store.isShowSteps&&store.bottomProgressNum>=100">
+            <div class="analysis" v-if="store.isWriteStart"  @click="store.resetGenerateState">
+                <div class="icon"></div>
+                <span class="text-tip-2-bold">停止</span>
             </div>
 
-            <div class="parsedItem" v-else-if="store.bottomProgressNum>=100">
-                <div class="analysis" @click="onWriteClick()">
+            <div class="notAnalysis" v-else  @click="onWriteClick()" >
                 <img src="@/assets/icons/aiBox/ai-logo.png" alt="">
                 <span class="text-tip-1">智能写报</span>
             </div>
+
             <div class="progress">
                 <div class="login">
-                        <el-progress  type="circle" :percentage="50" :width="24" :height="24" style="margin-right: 15px;" :show-text="false" color="rgb(5, 95, 194)"/>
-                        <span class="text-tip-2-bold">智能写报中</span>
+                    <el-progress  type="circle" :percentage="store.bottomProgressNum" :width="24" :height="24" style="margin-right: 15px;" :show-text="false" color="rgb(5, 95, 194)"/>
+                    <span class="text-tip-2-bold">文档翻译中</span>
                 </div>
                 <div class="text-tip-2" >
                     <div ref="processContainerRef" v-html="renderedProcess"></div>
                 </div>
             </div>
         </div>
+        <div class="parsed" v-else >
+            <div class="notAnalysis" @click="onAnalysisClick()">
+                <img src="@/assets/icons/aiBox/ai-logo.png" alt="">
+                <span class="text-tip-1">文档解析</span>
+            </div>
+            <div class="notProgress">
+                <img src="../assets/images/tips-icon.png" alt="">
+                <span class="text-tip-2">内容由AI生成，无法确保真实准确，仅供参考</span>
+            </div>
         </div>
 	</div>
 </template>
@@ -91,17 +91,12 @@ defineExpose({
     background: #fff;
     box-shadow: 0px 0px 3px 0px #d2d2d2;
     position: relative;
-    .notParsed{
+    .parsed{
         display: flex;
         justify-content: space-between;
         align-items: center;
         height: 64px;
-        .parsedItem{
-            display: flex;
-            justify-content: space-between;
-            width: 100%;
-        }
-        .analysis{
+        .notAnalysis{
             margin-left: 22px;
             display: flex;
             justify-content: center;
@@ -118,7 +113,7 @@ defineExpose({
                 margin-right: 12px;
             }
         }
-        .progress{
+        .notProgress{
             background-color: #fff;
             display: flex;
             justify-content: center;
@@ -131,12 +126,6 @@ defineExpose({
                 margin-right: 8px;
             }
         }
-    }
-    .parsed{
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        height: 64px;
 
         .analysis{
             border: 1px solid var(--color-primary-100);
@@ -171,7 +160,6 @@ defineExpose({
                 margin-right: 10px;
                 display: flex;
             }
-            
         }
     }
     

src/views/writtingAsstaint/components/WrittingHeader.vue

@@ -36,8 +36,10 @@ import { useWrittingAsstaintStore } from "@/stores/writtingAsstaintStore";
 // 子组件直接获取Pinia Store（核心优化）
 const store = useWrittingAsstaintStore();
 
-const onTabListClick= async (type,active)=>{
+const onTabListClick= (type,active)=>{
+    console.log(0)
     if(!active) return
+    console.log(1)
     store.handleHeaderTab(type)
 }
 // 查找

src/views/writtingAsstaint/components/WrittingMessage.vue

 <template>
 	<div >
         <!-- 右侧子组件：绑定ref -->
-		<writtingMainBox ref="mainBoxRef" :report-content="store.reportContent" />
+		<writtingMainBox v-show="!!store.reportContent" :report-content="store.reportContent" />
 	</div>
 </template>
 
 <script setup>
 import { ref, watch, onMounted, onUnmounted } from "vue";
+import { useWrittingAsstaintStore } from "@/stores/writtingAsstaintStore";
+import writtingMainBox from "./WrittingMainBox.vue";
+const store = useWrittingAsstaintStore();
+
 const mainBoxRef = ref(null); // 右侧子组件ref
 
 

src/views/writtingAsstaint/index.vue

@@ -53,7 +53,7 @@
 				</div>
 
 				<!-- 右侧子组件：绑定ref -->
-				<writtingMainBox v-show="!!store.reportContent" ref="mainBoxRef" :report-content="store.reportContent" />
+				<!-- <writtingMainBox v-show="!!store.reportContent" ref="mainBoxRef" :report-content="store.reportContent" /> -->
 
 			</div>
 			<WrittingBottom @generate="handleGenerate" @write="handleWrite"></WrittingBottom>
@@ -67,7 +67,7 @@ import { useRoute } from "vue-router";
 import { ElMessage } from "element-plus";
 import { useWrittingAsstaintStore } from "@/stores/writtingAsstaintStore";
 import writtingleftBox from "./components/WrittingLeftBox.vue";
-import writtingMainBox from "./components/WrittingMainBox.vue";
+
 import WrittingHeader from "./components/WrittingHeader.vue"; //头
 import WrittingBottom from "./components/WrittingBottom.vue"; //底部
 import WrittingTranslate from "./components/WrittingTranslate.vue"; //翻译