From 6069325e1a37cf0462afda1627d4c660735dc57e Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期二, 16 七月 2024 09:51:56 +0800
Subject: [PATCH] 版本更新
---
src/components/Chat/chatList.vue | 488 ++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 434 insertions(+), 54 deletions(-)
diff --git a/src/components/Chat/chatList.vue b/src/components/Chat/chatList.vue
index 1675f08..6286115 100644
--- a/src/components/Chat/chatList.vue
+++ b/src/components/Chat/chatList.vue
@@ -1,75 +1,112 @@
<template>
- <div class="body">
- <div :style="pageConfig.width | setWidth">
+ <div class="body webBody">
+ <div :class="$store.state.setScreenFlag ? 'webmainBox_Active' : 'webmainBox'">
<div class="web__main" ref="main">
- <div
- class="web__main-item"
- v-for="(item, index) in list"
- :key="loding(index)"
- :class="{ 'web__main-item--mine': item.mine }"
- >
+ <div class="web__main-item" v-for="(item, index) in list" :key="loding(index)"
+ :class="{ 'web__main-item--mine': item.mine }">
<div class="web__main_content">
<div>
<img :src="item.img" />
</div>
+
<div class="web__main_Date">
<div>
<cite>
- <div>
+ <div style="float: left;">
{{ item.name }}
</div>
- <div>
+ <div v-show="item.sourceValue" class="sourcefrom" style="float: left;margin-left:20px">
+ <el-select size="small" v-model="item.sourceValue" placeholder="璧勬枡鏉ユ簮">
+ <el-option value="1" label="GEDB"></el-option>
+ <el-option value="2" label="GeoAgent"></el-option>
+ </el-select>
+ </div>
+ <div style="float: right;">
{{ item.date }}
</div>
</cite>
</div>
-
<div class="web__main-text">
- <div class="web__main-arrow"></div>
- <span
- v-html="handleDetail(item.text.text)"
- ref="content"
- ></span>
- <ul class="web__main-list" v-if="item.text.list">
- <li
- @click="handleItemMsg(citem)"
- v-for="(citem, cindex) in item.text.list"
- :key="cindex"
- >
- {{ citem.text }}
- </li>
- </ul>
+ <div v-for="(res, key) in item.list" :key="key">
+ <div v-if="res.type === 'html'">
+ <div v-html="res.val"></div>
+ </div>
+ <div v-if="res.type === 'JsonHtml'">
+ <div class="JsonHtml">
+ <table>
+ <tr>
+ <th v-show="index != 'rowspan'" v-for="(item, index) in res.val[0]" :key=index>
+ {{ index }}
+ </th>
+ </tr>
+ <tr v-if="!item.break" v-for="(item, index) in res.val" :key=index>
+ <td v-if="item.rowspan != ''" :rowspan="item.rowspan">
+ {{ item[Object.keys(item)[0]] }}
+ </td>
+ <td v-if="Object.keys(item)[0] != n && n != 'rowspan'" v-for="(rs, n ) in item " :key="n"> {{
+ item[n] }}</td>
+ <!-- -->
+ </tr>
+
+ </table>
+ <div>
+ <p v-for="(item, index) in res.val[res.val.length - 1].break" :key=index>
+ {{ item.bak }}
+ </p>
+ </div>
+ </div>
+ </div>
+ <div v-if="res.type === 'text'">
+ {{ res.val }}
+ </div>
+ <div v-else-if="res.type == 'loader'">
+ <span v-html="handleDetail(res.val)" ref="content"></span>
+ </div>
+ <div v-else-if="res.type == 'markdown'">
+ <vue-markdown :source="res.val" class="newConcentLeft my-markdown"></vue-markdown>
+ <div v-show="res.link" style="float: right; ">
+ <a @click="setDownLoadFile(res.link)" style="color: white">涓嬭浇鎶ュ憡</a>
+ </div>
+ </div>
+ <div v-else-if="res.type == 'table'">
+ <table class="contTable">
+ <thead>
+ <th v-for="(item, index) in res.val[0]" :key="index">
+ {{ item }}
+ </th>
+ </thead>
+ <tbody>
+ <tr v-for="(item, index) in res.val[1]" :key="index">
+ <td v-for="(rs, flag) in item" :key="flag">
+ {{ rs }}
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div style="margin-bottom: 10px" v-else-if="res.type == 'rag'">
+ <div v-show="res.acction">
+ {{ res.acction }}
+ </div>
+ <div>{{ res.question }}</div>
+ <div style="display: flex">
+ 鏉ユ簮: {{ res.source }}
+ <div @click.stop="setRagMoreList(res.msg)" class="setRagMore" v-show="res.more">
+ ...鏇村
+ </div>
+ </div>
+ </div>
+ </div>
</div>
</div>
</div>
- <!-- <div class="web__main-user">
-
-
- </div> -->
- <!-- -->
</div>
</div>
</div>
- <el-dialog
- :visible.sync="show"
- width="40%"
- append-to-body
- :before-close="handleClose"
- class="web__dialog"
- >
+ <el-dialog :visible.sync="show" width="40%" append-to-body :before-close="handleClose" class="web__dialog">
<img :src="imgSrc" v-if="imgSrc" style="width: 100%; object-fit: cover" />
- <video
- :src="videoSrc"
- v-if="videoSrc"
- style="width: 100%; object-fit: cover"
- controls="controls"
- ></video>
- <audio
- :src="audioSrc"
- v-if="audioSrc"
- style="width: 100%; object-fit: cover"
- controls="controls"
- ></audio>
+ <video :src="videoSrc" v-if="videoSrc" style="width: 100%; object-fit: cover" controls="controls"></video>
+ <audio :src="audioSrc" v-if="audioSrc" style="width: 100%; object-fit: cover" controls="controls"></audio>
</el-dialog>
</div>
</template>
@@ -77,13 +114,24 @@
<script>
import emojiParser from "wechat-emoji-parser";
+import VueMarkdown from "vue-markdown";
+
+import axios from "axios";
+import bus from "../../assets/js/bus";
export default {
name: "JwChat_list",
+ arr: [],
+ components: {
+ VueMarkdown
+ },
filters: {
setWidth(value) {
let width = value;
if (`${value}`.match(/^\d+$/)) {
- width = value + "px";
+ width = value - 30 + "px";
+ }
+ if (width == "100vh") {
+ return "99vh";
}
return width;
}
@@ -106,7 +154,8 @@
show: false,
imgSrc: "",
videoSrc: "",
- audioSrc: ""
+ audioSrc: "",
+ isDisabled: true
};
},
watch: {
@@ -120,6 +169,40 @@
}
},
methods: {
+ setrowSpan(res, name) {
+ if (Object.keys(res)[0] == name) {
+ return res['rowspan']
+ } else {
+ return 1
+ }
+ },
+ setDownLoadFile(res) {
+ const downloadLink = document.createElement('a');
+ downloadLink.href = res
+ document.body.appendChild(downloadLink);
+ downloadLink.click();
+ document.body.removeChild(downloadLink);
+
+ },
+ setRagMoreList(res) {
+ if (this.isDisabled) {
+ this.isDisabled = false;
+ setTimeout(() => {
+ bus.$emit("setRagMoreListAll", res);
+ }, 500);
+ setTimeout(() => {
+ this.isDisabled = false;
+ }, 3000);
+ }
+ },
+ setFileChange(res) {
+ if (res == "testUrl") return;
+ axios.get(res).then((response) => {
+ if (response.status == 200) {
+ bus.$emit("setInsertMarkDown", response.data);
+ }
+ });
+ },
loding(index) {
const size = this.list.length;
if (index == size - 1) {
@@ -228,6 +311,7 @@
cursor: pointer;
display: block;
}
+
.web__msg--img[data-class="iconBox"] {
max-width: 24px;
min-width: unset;
@@ -236,8 +320,57 @@
vertical-align: bottom;
display: inline-block;
}
+
+.contTable {
+ border: 1px solid white;
+ font-family: "Arial", sans-serif !important;
+}
+
+.contTable th {
+ border: 1px solid white;
+ padding: 10px;
+ text-align: center;
+ font-size: 16px;
+}
+
+.contTable td {
+ border: 1px solid white;
+ padding: 10px;
+ text-align: center;
+ font-size: 14px;
+}
</style>
<style scoped>
+.webBody {
+ display: flex;
+ justify-content: center;
+}
+
+/deep/.el-select:hover .el-input__inner {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ color: #ffffff !important;
+}
+
+/deep/ .el-input__inner {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ padding: 0 10px !important;
+ color: #ffffff !important;
+
+}
+
+/deep/.el-input--small .el-input__inner {
+ height: 30px;
+ font-size: 12px;
+}
+
+.webmainBox {
+ width: 50%;
+}
+
+.webmainBox_Active {
+ width: 90%;
+}
+
.web__main-item {
position: relative;
font-size: 0;
@@ -254,6 +387,10 @@
@css { * }zoom: 1; */
vertical-align: top;
font-size: 20px;
+ background: #555555;
+ padding: 10px !important;
+ border-radius: 10px !important;
+ margin-top: 10px;
}
.web__main-user {
@@ -288,11 +425,13 @@
padding-left: 0px;
font-style: normal;
}
+
.citeTitle {
width: 100%;
display: flex;
justify-content: space-between;
}
+
.web__main-text {
/* max-width: 40%; */
width: 100%;
@@ -308,15 +447,18 @@
font-size: 16px;
word-break: break-all;
}
+
.web__main_content {
- width: 100%;
+ width: calc(100% - 50px);
padding: 10px 0px;
display: flex;
}
+
.web__main_Date {
flex: 1;
padding: 0px 15px;
}
+
.web__main_Date cite {
line-height: 24px;
font-size: 14px;
@@ -325,9 +467,10 @@
text-align: left;
font-style: normal;
width: 100%;
- display: flex;
- justify-content: space-between;
+ /* display: flex; */
+ /* justify-content: space-between; */
}
+
.web__main-arrow {
top: 6px;
left: -8px;
@@ -418,7 +561,244 @@
font-size: 16px;
color: #f2f2f2;
}
+
.web__main-text img {
max-width: 200px;
}
+
+.setRagMore {
+ margin-left: 10px;
+}
+
+.setRagMore:hover {
+ color: #409eff;
+}
+</style>
+<style>
+.el-select-dropdown {
+ background-color: #555555 !important;
+ color: #409eff !important;
+
+}
+
+.el-select-dropdown__item {
+ color: #ffffff !important;
+ background: transparent !important;
+}
+
+.el-select-dropdown__item.selected {
+ color: #409eff !important;
+ background: transparent !important;
+}
+
+.el-select-dropdown__item.selected span {
+ color: #409eff !important;
+ background: transparent !important;
+
+}
+
+.el-select-dropdown__item:hover {
+ /* background-color: #555555 !important; */
+ color: #409eff !important;
+}
+
+.parentBox {
+ height: 100%;
+ /* background: rgb(31, 31, 31); */
+ padding: 20px;
+}
+
+.loadBox .loaderContantBox {
+ color: white;
+ font-size: 40px;
+ overflow: hidden;
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ transform: translateZ(0);
+ /* animation锛氳瀹氬畬鎴愬姩鐢绘墍鑺辫垂鐨勬椂闂达紝璇ュ睘鎬у繀椤昏瀹氾紝鍚﹀垯鍔ㄧ敾鏃堕暱涓�0锛屾棤娉曟挱鏀� */
+ animation: loadBox 1.7s infinite ease, round 1.7s infinite ease;
+}
+
+@keyframes loadBox {
+ 0% {
+ box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
+ 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+ }
+
+ 5%,
+ 95% {
+ box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
+ 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+ }
+
+ 10%,
+ 59% {
+ box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
+ -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
+ -0.297em -0.775em 0 -0.477em;
+ }
+
+ 20% {
+ box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
+ -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
+ -0.749em -0.34em 0 -0.477em;
+ }
+
+ 38% {
+ box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
+ -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
+ -0.82em -0.09em 0 -0.477em;
+ }
+
+ 100% {
+ box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
+ 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+ }
+}
+
+@keyframes round {
+ 0% {
+ transform: rotate(0deg);
+ /* 寮�濮嬫棆杞� div 鍏冪礌 */
+ }
+
+ 100% {
+ transform: rotate(360deg);
+ /* 缁撴潫鏃嬭浆 div 鍏冪礌 */
+ }
+}
+
+.newConcentLeft {
+ margin: 16px;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 400;
+ font-size: 14px;
+
+ text-align: left;
+ font-style: normal;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+}
+
+.JsonHtml table {
+ border: 1px solid white;
+ text-align: center;
+ line-height: 30px;
+ font-family: "Arial", sans-serif;
+ font-size: 16px;
+}
+
+.JsonHtml tr {
+ border: 1px solid white;
+
+}
+
+.JsonHtml th {
+ border: 1px solid white;
+ padding: 10px 10px;
+}
+
+.JsonHtml td {
+ border: 1px solid white;
+ padding: 10px 10px;
+
+}
+
+
+
+.newConcentLeft table {
+ border: 1px solid white;
+ text-align: center;
+ line-height: 30px;
+ font-family: "Arial", sans-serif;
+ font-size: 16px;
+}
+
+.newConcentLeft tr {
+ border: 1px solid white;
+
+}
+
+.newConcentLeft th {
+ border: 1px solid white;
+
+}
+
+.newConcentLeft td {
+ border: 1px solid white;
+
+}
+
+.newConcentLeft img {
+ width: 75%;
+}
+
+.newConcentLeft table {
+ width: 100%;
+}
+
+.newConcentLeft pre {
+ white-space: normal;
+}
+
+.newConcentLeft li {
+
+ font-size: 15px !important;
+ line-height: 15px !important;
+ list-style: disc;
+}
+
+.newConcentLeft p {
+ font-size: 15px !important;
+ /* */
+}
+.newConcentLeft h1 {
+ font-size: 2rem !important;
+ padding: 20px 0px;
+ border-bottom: 1px solid rgba(209, 209, 209, 0.0);
+}
+.newConcentLeft h2 {
+ padding:30px 0px;
+ line-height: 0px;
+ border-bottom: 1px solid rgba(209, 209, 209, 0.0);
+ /* */
+}
+</style>
+
+<style>
+/* .web_Main_markDown h1 {
+ line-height: 20px !important;
+ font-size: 20px !important;
+}
+
+.web_Main_markDown h2 {
+ line-height: 20px !important;
+ font-size: 18px !important;
+ margin-left: 10px;
+}
+
+.web_Main_markDown h3 {
+ line-height: 20px !important;
+ font-size: 18px !important;
+ margin-left: 10px;
+}
+
+.web_Main_markDown li {
+ line-height: 15px !important;
+ font-size: 16px !important;
+ margin-left: 20px;
+}
+
+.web_Main_markDown p {
+ line-height: 15px !important;
+ font-size: 16px !important;
+ margin-left: 20px;
+}
+
+.web_Main_markDown {
+ background: #555555;
+ padding: 10px;
+ border-radius: 10px;
+} */
</style>
--
Gitblit v1.9.3