From d5506eaa53973e770c2f8b94c71d0638feb63906 Mon Sep 17 00:00:00 2001 From: mk <2403457699@qq.com> Date: Tue, 11 Mar 2025 15:46:55 +0800 Subject: [PATCH] =?UTF-8?q?12345=E5=8A=A9=E6=89=8B=E5=BC=B9=E6=A1=86?= =?UTF-8?q?=E5=B0=81=E8=A3=85=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modules/shequzhili/analysis/index.vue | 162 +++++++++--------- .../modules/shequzhili/analysis/markDown.vue | 123 +++++++++++++ 2 files changed, 204 insertions(+), 81 deletions(-) create mode 100644 src/views/modules/shequzhili/analysis/markDown.vue diff --git a/src/views/modules/shequzhili/analysis/index.vue b/src/views/modules/shequzhili/analysis/index.vue index 46297dd23..1800aa5a2 100644 --- a/src/views/modules/shequzhili/analysis/index.vue +++ b/src/views/modules/shequzhili/analysis/index.vue @@ -461,10 +461,7 @@
- - 思考中... - -
+
@@ -476,7 +473,6 @@ import eventInfo from "../../shequzhili/event/cpts/event-info.vue"; import { requestPost, requestGet } from "@/js/dai/request"; import nextTick from "dai-js/tools/nextTick"; import { mapGetters } from "vuex"; -import axios from "axios"; import * as echarts from "echarts"; import util from "@js/util.js"; import TableRow from './TableRow.vue'; @@ -484,9 +480,9 @@ import mobileList from "./mobileList"; import areaNoSameList from "./areaNoSameList"; import addComplainList from "./addComplainList"; import echartsAffairs from "./cpts/echarts-affairs.vue"; -import { marked } from "marked"; +import markDown from "./markDown.vue"; export default { - components: { TableRow, formList, eventInfo, areaSameList, mobileList, areaNoSameList, addComplainList, echartsAffairs }, + components: { TableRow, formList, eventInfo, areaSameList, mobileList, areaNoSameList, addComplainList, echartsAffairs ,markDown}, data() { return { selectedIndex: 0, @@ -809,8 +805,11 @@ export default { ] }, summarizeDialog: false, - displayedText: null, - typingSpeed: 100, // 每个字出现的间隔时间（毫秒） + displayedText: '', + typingSpeed: 50, //每个字出现的间隔时间（毫秒） + typingQueue: [], //队列存储 + isTyping: false, + showMarkdown:false, }; }, @@ -821,16 +820,9 @@ export default { return this.$store.state.inIframe ? h : _h; }, ...mapGetters(["clientHeight", "iframeHeight"]), - renderedMarkdown() { - return marked(this.displayedText); // 转换 Markdown 为 HTML - }, - }, - watch: { - renderedMarkdown(newText) { - this.displayedText = null; // 清空旧内容 - this.startTypingEffect(newVal); - } + }, + watch: {}, mounted() { this.user = this.$store.state.user; this.agencyId = this.user.agencyId; @@ -845,6 +837,75 @@ export default { this.initChart("/actual/base/residentIntegrity/resiCategoryStats/byOrg/query4Org"); }, methods: { + regexChat(str) { + const regex = /"content":"(.*?)"/g; + const matches = []; + let match; + while ((match = regex.exec(str)) !== null) { + const formattedContent = match[1].replace(/\\n/g, '\\\\n'); + console.log(formattedContent,'formattedContent'); + + matches.push(formattedContent); + } + const mergedContent = matches.join(''); + return mergedContent; + }, + handelClickShowSummarize() { + this.summarizeDialog = true; + // const that = this; + // const { queryDateStart, queryDateEnd } = this.getLastWeekDateRange(); + + // fetch(`${process.env.VUE_APP_API_SERVER}/governance/event/assistant/report?queryDateStart=${queryDateStart}&queryDateEnd=${queryDateEnd}`, { + // method: "GET", + // headers: { + // "Authorization": localStorage.getItem('token'), + // "Content-Type": "application/json" + // } + // }) + // .then(response => { + // const reader = response.body.getReader(); + // const decoder = new TextDecoder("utf-8"); + + // reader.read().then(function process({ done, value }) { + // if (done) { + // console.log("流读取完成"); + // that.showMarkdown = true; + // return; + // } + + // const chunk = decoder.decode(value, { stream: true }); + // console.log("流数据块：", chunk,typeof (chunk)); + // const text = that.regexChat(chunk); + // console.log("转换后：", text,typeof (text)); + + // // 将数据推入队列 + // that.typingQueue.push(text); + // that.startNextTypingEffect(); // 尝试开始下一个 + + // // 继续读取 + // return reader.read().then(process); + // }); + // }) + // .catch(err => console.error("请求出错：", err)); + }, + + startNextTypingEffect() { + // 如果正在打字或队列为空，则直接返回 + if (this.isTyping || this.typingQueue.length === 0){ + + }; + console.log(this.typingQueue,'typingQueue'); + const nextText = this.typingQueue.shift(); + console.log(typeof(nextText)); + + this.displayedText += nextText.toString() + }, + + + handleCloseSummarizeDialog(){ + this.displayedText = ''; + this.showMarkdown = false; + }, initChart(url) { this.$http.get(url).then(({ data: { data } }) => { const chartDom = this.$refs.chart; @@ -873,7 +934,6 @@ export default { ]; let xData = departmentNames.map(item => item.name) let xiangying = departmentNames.map(item => item.xiangying) - console.log(xiangying, "dsfll;dsfj"); let banjie = departmentNames.map(item => item.banjie) let zuizhong = departmentNames.map(item => item.zuizhong) let manyi = departmentNames.map(item => item.manyi) @@ -1142,8 +1202,6 @@ export default { if (code === 0) { this.tableList = data // this.tableList=this.flattenTree(data); - console.log(this.tableList); - console.log(this.tableList, "lksdjfklj s"); } else { this.$message.error(msg); } @@ -1542,45 +1600,7 @@ export default { queryDateEnd: formatDate(endOfLastWeek), }; }, - regexChat(str) { - console.log(str,'jieshou'); - - const regex = /"content":"([^\\\n]*?)"(?:}}])?/g; - const matches = []; - let match; - while ((match = regex.exec(str)) !== null) { - matches.push(match[1]); - } - const mergedContent = matches.join(''); - return mergedContent; - }, - handelClickShowSummarize() { - this.summarizeDialog = true; - const { queryDateStart, queryDateEnd } = this.getLastWeekDateRange() - this.$http.get(`/governance/event/assistant/report?queryDateStart=${queryDateStart}&queryDateEnd=${queryDateEnd}`).then((res) => { - const text = this.regexChat(res.data); - // 确保文本不为空 - if (text) { - this.startTypingEffect(text); - } - }); - }, - - startTypingEffect(text) { - this.displayedText = ""; // 清空内容 - let index = 0; - const interval = setInterval(() => { - if (index < text.length) { - this.displayedText += text[index]; // 逐个字符添加 - index++; - } else { - clearInterval(interval); // 结束打字效果 - } - }, this.typingSpeed); - }, - handleCloseSummarizeDialog(){ - this.displayedText = null; - } + }, @@ -1705,7 +1725,7 @@ thead { width: 100%; /* 限制最大宽度，确保换行 */ word-wrap: break-word; - /* 确保长文本换行 */ + // /* 确保长文本换行 */ overflow-wrap: break-word; white-space: pre-wrap; /* 保持空格和换行 */ @@ -1713,26 +1733,6 @@ thead { overflow-y: scroll; } -.typing-animation { - display: inline-block; - overflow: hidden; - /* 隐藏未显示的部分 */ - white-space: nowrap; - /* 避免提前换行 */ - animation: typing 2s steps(20, end) forwards; -} - -/* 动画：逐字显示 */ -@keyframes typing { - from { - width: 0; - } - - to { - width: 100%; - } -} - .flex { display: flex; justify-content: center; diff --git a/src/views/modules/shequzhili/analysis/markDown.vue b/src/views/modules/shequzhili/analysis/markDown.vue new file mode 100644 index 000000000..bd64a3ff5 --- /dev/null +++ b/src/views/modules/shequzhili/analysis/markDown.vue @@ -0,0 +1,123 @@ + + +