Files
taimed/pages/articleList/article.vue
liuyuan 0d0bf4bb3a tijiao
2025-09-04 13:55:23 +08:00

1857 lines
44 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view
class="content"
:class="`${options.type == 'detail' ? 'content_detail' : ''}`"
:style="options.statusId == 0 ? 'background-color: #f0f0f026;' : ''"
>
<u-loading-page
:loading="submitLoading"
style="
width: 100vw;
height: 100vh;
z-index: 9999;
top: 0;
background-color: #00000080;
"
loading-text="文章正在发布中请稍后..."
color="#fff"
></u-loading-page>
<z-nav-bar
:title="options.navTitle"
:bgColor="
options.type == 'detail'
? options.statusId == 0
? '#f7f7f7'
: '#d8e6ff73'
: '#5188e5'
"
:fontColor="
options.type == 'detail'
? options.statusId == 0
? '#333'
: '#333'
: '#fff'
"
>
<template v-slot:right>
<view
class="top_right"
style="
background-color: #fff;
margin-right: 10rpx;
border-radius: 4rpx;
"
@tap="handleOpenShowSubmit"
v-if="options.type == 'add'"
>
<text
style="
padding: 2rpx 20rpx;
border-radius: 20rpx;
line-height: 50rpx;
color: #215fc7;
"
>提交</text
>
</view>
<view
v-if="options.type == 'detail' && options.statusId == 1"
class="top_right"
style="display: flex; align-items: center"
>
<uni-icons
type="redo-filled"
size="28"
@tap="newOnShare()"
style="color: #66bc54"
></uni-icons>
<text
style="
letter-spacing: 2rpx;
color: #66bc54;
margin-right: 20rpx;
margin-left: 10rpx;
font-weight: 600;
"
>分享</text
>
</view>
</template>
</z-nav-bar>
<view
class="home_wrap home_wrap_analysis"
v-if="options.type != 'detail'"
:style="`height:auto;overflow-y: visible`"
>
<view class="home_form" style="position: relative">
<view
class="form_item"
style="
height: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
"
>
<!-- <text>医案信息</text> -->
<!-- 固定标题和输入框部分 -->
<view class="analysis_box">
<view class="analysis_title" style="margin-bottom: 10rpx">
<textarea
auto-height
v-model="formData.title"
maxlength="-1"
placeholder="请输入标题"
placeholder-class="custom-placeholder"
/>
</view>
<!-- 固定的输入框部分 -->
<view
style="
min-height: calc(100% - 380rpx);
height: calc(100% - 380rpx);
height: auto;
"
>
<commonEditor
@saveContens="saveContens"
:content="formData.content"
placeholder="请输入文章正文内容"
height="calc(100% - 25px)"
></commonEditor>
</view>
<view style="padding: 0 26rpx">
<u-upload
:max-count="9"
:fileList="fileList1"
@afterRead="addPic"
@delete="deletePic"
multiple
width="110"
height="110"
:previewFullImage="true"
>
</u-upload>
</view>
</view>
<!-- <view class="submit_btn" @click="submit">解析医案</view> -->
</view>
</view>
<!-- 搜索结果列表 -->
<scroll-view
scroll-y
class="result-list"
v-if="searchResultStatus && searchResults.length > 0"
>
<view
v-for="item in searchResults"
:key="item.id"
@click="selectItem(item)"
class="result-item"
>
{{ item.name }}
</view>
</scroll-view>
</view>
<scroll-view
:scroll-into-view="targetId"
scroll-y
class="home_wrap home_wrap_analysis home"
ref="homeContainer"
v-if="options.type == 'detail'"
:style="`height: calc(100% - ${
48 + statusBarHeight + (options.statusId == 0 ? 10 : 60)
}px);padding:0 20rpx;text-align: justify;`"
>
<view class="analysis_box" style="height: auto; padding-top: 40rpx">
<view class="analysis_img_box">
<view class="analysis_img">
<image
v-if="
articleInfo &&
articleInfo.taihuTalent &&
articleInfo.taihuTalent.icon
"
:src="articleInfo.taihuTalent.icon"
/>
<image v-else src="/static/icon/noIcon.png" />
<view class="taihuTalentBox">
<view class="taihuTalent_name" style="color: #5a6988">{{
articleInfo &&
articleInfo.taihuTalent &&
articleInfo.taihuTalent.name
? articleInfo.taihuTalent.name
: "普通用户"
}}</view>
<view
class="taihuTalent_title"
style="margin-top: 20rpx"
v-if="
articleInfo &&
articleInfo.taihuTalent &&
articleInfo.taihuTalent.title
"
><text class="zhicheng">{{
articleInfo.taihuTalent.title
}}</text></view
>
</view>
</view>
<view style="color: #aaacab; text-align: right">
{{ articleInfo.readCount }}人阅读</view
>
</view>
<view
class="analysis_title analysis_title_detail"
style="
color: #302f35;
font-size: 40rpx !important;
line-height: 50rpx;
"
>
{{ articleInfo.title }}
</view>
<rich-text
:nodes="articleInfo.content"
style="
height: auto;
margin-bottom: 260rpx;
color: #4b4b4b;
text-align: justify;
white-space: pre-wrap;
word-wrap: break-word;
"
/>
</view>
<view class="allImage">
<view class="imgList">
<view
class="images"
:class="`${fileList1.length > 4 ? 'images3' : ''}`"
v-for="(item, index) in fileList1"
:key="index"
>
<image
@click.stop="previewImg(index)"
class="oneimg"
:src="item"
mode="aspectFill"
:style="{
width: imgWidth + 'px',
'max-height': imgHeight + 'px',
}"
></image>
</view>
</view>
</view>
<view
style="
letter-spacing: 1rpx;
color: #aaacab;
margin-top: 20rpx;
margin-bottom: 20rpx;
display: flex;
align-items: center;
"
v-if="articleInfo.createTime"
>{{ articleInfo.createTime }}
<uni-icons
type="trash-filled"
size="24"
@tap="showDel = true"
style="color: #aa3629; margin-left: 20rpx; margin-right: 20rpx"
></uni-icons>
</view>
<view class="likeList" v-if="likeList.length > 0" style="color: #5188e5">
<uni-icons
type="heart"
size="20"
style="color: #5188e5; margin-right: 10rpx"
></uni-icons>
<view class="">{{
likeList
.map((item) =>
item.user.nickname ? item.user.nickname : "普通用户"
)
.join(" , ")
}}</view>
</view>
<view v-if="commentData" id="commentData">
<hb-comment
:isDisable="options.statusId == 0 ? true : false"
:isShowList="true"
:articleUserId="articleInfo.userId"
style=""
:user="currentUser"
ref="hbComment"
@add="sendComment"
:deleteTip="'确认删除?'"
:cmData="commentData"
v-if="commentData"
></hb-comment>
</view>
<!-- 显示聊天记录 -->
<!-- <articleDetail
:loading="loading"
:type="options.type"
:page="options.page ? options.page : ''"
:statusId="options.statusId"
:medicalRecords="medicalRecords"
@editableMap="updateEditableMap"
@formData="updateMedicalForm"
@record="updateRecord"
@fileList1="updateFileList1"
ref="commonMedicalDetail"
></articleDetail> -->
<!-- <view class="footer_box" v-if="options.statusId != 0">
<template>
<view
class="footer_item"
style="color: #9a9a9a"
@click.stop="clickLike"
>
<view class="footer_item_icon"
><uni-icons
type="hand-up-filled"
size="30"
style="color: #9a9a9a"
:style="{ color: articleInfo.likeFlag ? '#ff4949' : '#9a9a9a' }"
></uni-icons>
<view class="footer_item_count" style="text-align: center">{{
articleInfo.likeCount ? articleInfo.likeCount : "0"
}}</view>
</view>
<text style="letter-spacing: 4rpx">点赞</text>
</view>
<view
class="footer_item"
style="color: #9a9a9a"
@click.stop="onHandleClickOpenComment"
>
<view class="footer_item_icon"
><uni-icons
type="chat-filled"
size="30"
style="color: #9a9a9a"
></uni-icons>
<view class="footer_item_count" style="text-align: center">{{
articleInfo.commentCount ? articleInfo.commentCount : "0"
}}</view>
</view>
<text style="letter-spacing: 4rpx">评论</text>
</view>
<view
v-if="articleInfo.showFlag != 0"
class="footer_item"
style="color: #9a9a9a"
@click.stop="newOnShare"
>
<view class="footer_item_icon"
><uni-icons
type="redo-filled"
size="30"
style="color: #9a9a9a"
></uni-icons>
</view>
<text style="letter-spacing: 4rpx">分享</text>
</view>
</template>
</view> -->
</scroll-view>
<view style="padding-bottom: 20px">
<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
<uni-popup-share :bottom="500" @select="haveSelected"></uni-popup-share>
</uni-popup>
</view>
<!-- <z-navigation></z-navigation> -->
<u-popup
@close="orderModalShow = false"
:show="orderModalShow"
mode="bottom"
:round="8"
:background="'#fff'"
style="background: #fff"
backgroundColor="#fff"
>
<view class="orderModalShow popup_box">
<view style="text-align: center; padding-bottom: 20rpx"
>全部 {{ articleInfo.commentCount }} 条评论</view
>
<u-icon
name="close"
color="#333"
size="18"
@click="closeOrderModalShow"
style="
display: inline-block;
position: absolute;
right: 20rpx;
top: 20rpx;
"
></u-icon>
<hb-comment
style="padding-top: 40rpx; overflow: auto; padding-bottom: 100rpx"
:user="currentUser"
ref="hbComment"
@add="sendComment"
:deleteTip="'确认删除?'"
:cmData="commentData"
v-if="commentData"
></hb-comment>
</view>
</u-popup>
<u-modal
:show="showDel"
@confirm="confirmDel"
@cancel="showDel = false"
ref="uModalDel"
:asyncClose="true"
:showCancelButton="true"
confirmText="删除"
confirmColor="#aa3629"
title="提示"
>
<view class="slot-content"> 您确定要删除该文章吗? </view>
</u-modal>
<u-modal
:show="showSubmit"
@confirm="confirmSubmit"
@cancel="showSubmit = false"
ref="uModalSubmit"
:asyncClose="true"
:showCancelButton="true"
confirmText="发布"
confirmColor="#5188e5"
title="提示"
>
<view class="slot-content"> 是否立即发布文章? </view>
</u-modal>
</view>
</template>
<script>
import $http from "@/config/requestConfig.js";
import { mapState, mapMutations } from "vuex";
import articleDetail from "./articleDetail.vue";
import commonEditor from "./common-editor.vue";
import qs from "qs";
import text from "uview-ui/libs/config/props/text";
import { debounce, throttle } from "@/common/debounce.js";
export default {
components: {
articleDetail,
commonEditor,
},
data() {
return {
targetId: null,
submitLoading: false,
currentUser: {},
likeList: [],
orderModalShow: false,
showDel: false,
showSubmit: false,
commentData: [],
articleInfo: {},
editorOption: {},
options: {},
fileList1: [],
containerHeight: null,
pollInterval: null,
formData: {
message: "",
},
medicalForm: {},
chatId: null, //选择助手的id
chatName: "",
chatAssistants: [],
activeIndex: null,
sessionId: "", //对话id
medicalId: "", //医案id
eventSource: null,
showMessages: false,
loading: true,
question: "", //传递的问题
messages: [],
record: [],
previousAnswer: null, //存储上一条回答内容
question_send: "",
pauseStatus: false, //暂停操作
record_list: [], //对话列表
null_text: "",
activeRecord: null,
tishi: false, //提示语
folderList: [], //病历夹列表
folderName: "", //病历夹名称
chatAssistantName: "",
patientName: "",
pageData: {},
pageType: "", //从患者列表过来的type
isChecked: true,
medicalRecords: [], //模糊已选项
selectedItems: [], //模糊已选项
selectedId: [],
searchResults: [], //模糊搜索结果
searchResultStatus: false,
vipCount: null,
vipText: "",
vipStatus: null,
freeCount: null,
freeText: "",
freeStatus: null,
flag: null,
scrollIntoView: "",
recordData: {},
editableMap: {},
isRefreshing: false, //刷新状态
windowWidth: 0, //屏幕可用宽度
windowHeight: 0, //屏幕可用高度
imgWidth: 0, //图片宽度
imgHeight: 0, //图片高度
};
},
computed: {
...mapState(["userInfo"]),
},
async onLoad(options) {
this.options = options;
this.medicalId = options.id;
uni.hideTabBar();
uni.removeStorageSync("homeParams");
//获取设备信息
const systemInfo = uni.getSystemInfoSync();
this.containerHeight = systemInfo.windowHeight; //获取设备的窗口高度
// this.sendQuestion();
this.windowHeight = systemInfo.windowHeight;
this.windowWidth = systemInfo.windowWidth;
if (this.options.type == "add") {
this.loading = true;
} else {
this.loading = true;
await this.getMedicalDetail(() => {
if (this.options.open) {
// if (this.options.open == "查看文章") {
// this.onHandleClickOpenComment();
// }
if (this.options.open == "查看评论") {
this.onHandleClickOpenComment();
}
if (this.options.open == "分享文章") {
this.newOnShare();
}
delete this.options.open;
}
});
// this.tishi=true
}
},
async onShow() {
this.submitLoading = false;
},
async onPullDownRefresh() {
this.isRefreshing = true;
console.log("下拉刷新");
setTimeout(async () => {
if (this.options.type == "add") {
this.showMessages = false;
this.loading = true;
} else {
this.showMessages = true;
this.loading = true;
await this.getMedicalDetail();
// this.tishi=true
}
uni.stopPullDownRefresh();
this.isRefreshing = false;
console.log("下拉刷新已停止");
}, 800);
},
methods: {
scrollToView(id) {
// commentData
this.targetId = id; // 设置目标元素 id
setTimeout(() => {
this.targetId = null;
}, 1000);
},
confirmDel: throttle(function () {
this.delArticle();
}, 2000),
handleOpenShowSubmit() {
if (!this.formData.title) {
this.$commonJS.showToast("请输入文章标题");
return;
}
if (!this.formData.message) {
this.$commonJS.showToast("请输入文章正文内容");
return;
}
if (this.fileList1.length == 0) {
this.$commonJS.showToast("请至少上传一张图片");
return;
}
// this.showSubmit = true;
this.confirmSubmit();
},
confirmSubmit: throttle(function () {
this.submitLoading = true;
this.showSubmit = false;
this.handleSubmit("submit");
}, 2000),
delArticle() {
var that = this;
this.showDel=false
uni.showLoading({
title: "加载中",
});
this.$http
.request({
url: "common/taihuTalentArticle/delArticle",
method: "POST",
data: {
id: this.articleInfo.id,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
uni.hideLoading();
if (res.code == 0) {
uni.showToast({
title: "删除成功",
icon: "success",
duration: 2000,
});
this.$commonJS.refreshPrevPageData();
} else {
this.showDel=false
uni.showToast({
title: "删除失败",
icon: "success",
duration: 2000,
});
}
});
},
newOnShare() {
this.$refs.share.open();
},
haveSelected(data) {
if (!this.articleInfo) {
return false;
}
let image = "";
this.articleInfo.img && this.articleInfo.img != ""
? (image = this.articleInfo.img.split(",")[0])
: (image = "static/logo_zi.png");
console.log(data, " 选择的是");
if (data.index == 0) {
// 分享到好友
uni.share({
provider: "weixin",
scene: "WXSceneSession",
type: 0,
href: this.$apkUrl,
title: `我在【太湖云医】发布了文章 “ ${this.articleInfo.title} ”`,
summary: `${this.articleInfo.content.substring(0, 50).replace(/<[^>]*>/g, '').trim()}`,
imageUrl: image,
success: function (res) {
console.log("success:" + JSON.stringify(res));
},
fail: function (err) {
console.log("fail:" + JSON.stringify(err));
},
});
} else if (data.index == 1) {
// 分享到朋友圈
uni.share({
provider: "weixin",
scene: "WXSceneTimeline",
type: 0,
href: this.$apkUrl,
title: `我在【太湖云医】发布了文章 “ ${this.articleInfo.title} ”`,
summary: `${this.articleInfo.content.substring(0, 50).replace(/<[^>]*>/g, '').trim()}`,
imageUrl: image,
success: function (res) {
console.log("success:" + JSON.stringify(res));
},
fail: function (err) {
console.log("fail:" + JSON.stringify(err));
},
});
}
},
// 自适应判断
judgeImg() {
if (this.fileList1.length === 1) {
const firstImg = this.fileList1[0];
// 获取图片的宽高信息
uni.getImageInfo({
src: firstImg, // 获取图片路径
success: (res) => {
const imgWidth = res.width;
const imgHeight = res.height;
// 如果是横向图片(宽大于高)
if (imgWidth > imgHeight) {
// 横向图片尺寸设置
this.imgWidth = ((this.windowWidth - 40) * 2) / 2;
this.imgHeight = (this.windowHeight * 3) / 5;
} else {
// 纵向图片尺寸设置
this.imgWidth = ((this.windowWidth - 40) * 2) / 3;
this.imgHeight = (this.windowHeight * 3) / 5;
}
},
fail: (err) => {
console.error("图片加载失败", err);
},
});
} else if (this.fileList1.length == 4) {
this.imgWidth = (this.windowWidth - 10) / 3.3;
this.imgHeight = this.imgWidth;
} else {
this.imgWidth = (this.windowWidth - 10) / 3.4;
this.imgHeight = this.imgWidth;
}
},
previewImg(index) {
uni.previewImage({
urls: this.fileList1,
// longPressActions: {
// itemList: ["保存图片"],
// },
current: index, // 设置当前预览的图片索引
});
},
clickLike() {
console.log("childThumbsup");
this.$http
.request({
url: "common/taihuTalentArticle/addOrCancelArticleLike",
method: "POST",
data: {
articleId: this.articleInfo.id,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
console.log("res at line 308:", res);
this.getMedicalDetail();
this.$forceUpdate();
});
// common/taihuTalentArticle/addOrCancelArticleLike
},
onHandleClickOpenComment() {
console.log("111 at line 384:", 111);
console.log(
"this.currentUser at line 365:",
this.articleInfo.taihuTalent
);
this.orderModalShow = true;
},
closeOrderModalShow() {
this.orderModalShow = false;
},
saveContens(content) {
this.formData.message = content;
},
handleSubmit: throttle(function (type, isNewSave) {
var data = {
img:
this.fileList1.length > 0
? this.fileList1.map((e) => e.url).toString()
: "",
title: this.formData.title ? this.formData.title : "",
content: this.formData.message ? this.formData.message : "",
};
// debounce(() => {
this.$http
.request({
url: "common/taihuTalentArticle/addArticle",
method: "POST",
data: {
...data,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
if (res.code == 0) {
setTimeout(() => {
this.$commonJS.refreshPrevPageData(1);
this.submitLoading = false;
}, 2000);
} else {
this.submitLoading = false;
this.$commonJS.showToast(res.msg);
}
})
.catch((err) => {
this.submitLoading = false;
});
}, 3000),
async addPic(e) {
let that = this;
for (var i = 0; i < e.file.length; i++) {
uni.uploadFile({
url: this.$baseUrl + "/oss/fileoss",
filePath: e.file[i].url,
name: "file",
formData: {},
success: (res) => {
that.fileList1.push({
url: JSON.parse(res.data).url,
});
},
fail: (error) => {},
});
}
},
deletePic(event) {
this.fileList1.splice(event.index, 1);
},
//更新子组件内容
updateEditableMap(val) {
this.editableMap = val;
},
updateMedicalForm(val) {
console.log("val at line 232:", val);
this.medicalForm = val;
},
updateRecord(val) {
this.record = val;
},
updateFileList1(val) {
this.fileList1 = val;
},
// 判断内容是否为空或无效
async checkPermision() {
var result = await permission.premissionCheck("CAMERA_EXTERNAL_STORAGE");
if (result != 1) {
return false;
}
},
clickCourseInfo(val) {
console.log(val);
this.formData.labelId = val.id;
this.formData.labelTitle = val.title;
this.$forceUpdate();
},
//设置滚动到最底部
scrollToBottom() {
this.scrollIntoView = "";
setTimeout(() => {
this.scrollIntoView = "bottom-anchor";
}, 50);
},
//基因
handleInput(val) {
let name = val.detail.value;
this.getGenes(name);
},
//模糊搜索选中
selectItem(item) {
if (!this.selectedItems.some((i) => i.id === item.id)) {
this.selectedItems.push(item.name);
this.selectedId.push(item.id);
}
this.formData.genetic = "";
this.searchResultStatus = false;
console.log(this.selectedItems);
console.log(this.selectedId);
},
//删除标签
removeTag(index) {
this.selectedItems.splice(index, 1);
this.selectedId.splice(index, 1);
console.log(this.selectedItems);
console.log(this.selectedId);
},
//勾选
toggleCheck() {
this.isChecked = !this.isChecked;
},
//获取病症种类数据
//获取对话记录数据
getRecordsData() {
this.record_list = [];
this.$http
.request({
url: "common/ragFlowApi/getChats",
method: "POST",
data: {
chatId: "",
sessionId: "",
page: 1,
pageSize: 300,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
if (res.code == 0) {
console.log("请求最新列表");
if (res.list && res.list.length > 0) {
this.record_list = res.list;
//患者列表跳转来的
const index = res.list.findIndex(
(item) =>
item.chatAssistantId === this.pageData.chatAssistantId &&
item.chatId === this.pageData.chatId
);
if (this.pageType && this.pageType == "patient") {
this.clickRecord(this.pageData, index);
}
} else {
this.record_list = [];
this.null_text = "暂无数据";
}
}
})
.catch((e) => {
console.log(e);
});
},
//点击每个记录
clickRecord(item, index) {
//重新定义id
this.chatId = item.chatAssistantId;
this.sessionId = item.chatId;
//助手类型
this.chatName = item.chatAssistantName;
this.patientName = item.patientName;
console.log("我是:" + this.patientName);
uni.setStorageSync("homeParams", { data: item, index: index });
this.activeRecord = index;
this.messages = [];
this.showMessages = true;
//请求病历夹接口
this.getRecordFolderList();
//如果正在回答的时候切换需要中断回答
this.closeWebSocket();
uni.showLoading({
title: "加载中",
});
this.$http
.request({
url: "common/ragFlowApi/getChats",
method: "POST",
data: {
chatId: item.chatAssistantId,
sessionId: item.chatId,
page: 1,
pageSize: 300,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
if (res.code == 0) {
uni.hideLoading();
if (res.list && res.list.length > 0) {
this.messages = res.list.map((item) => {
let content = item.content.replace(/##\d+$$/g, "");
content = item.content.replace(/<\/?think>/g, "");
content = content.replace(
/\*\*(.*?)\*\*/g,
'<b class="bold-text">$1</b>'
);
content = content.replace(
/\*(.*?)\*/g,
'<span class="red-text">$1</span>'
);
content = content.replace(/\n\n/g, "\n");
content = content.replace(/\n/g, "<br>");
//content = content.replace(/^#{3,4}.*(\r?\n)?/gm, '');
return {
...item,
type: item.type === 1 ? "answer" : "question",
content: content,
};
});
//滚动到最底部锚点
this.$nextTick(() => {
this.scrollToBottom();
});
}
this.tishi = false; //提示语不用展示
this.$refs.drawer.close();
}
});
},
//选中科目类别
clickAssistants(item, index) {
this.activeIndex = index;
this.chatId = item.id;
this.chatName = item.name;
},
//提交
submit() {
let content = "";
let confirmText = "确定";
//没有次数的时候要求购买vip
if (!this.formData.message) {
this.$commonJS.showToast("请输入医案详情");
return;
}
//创建对话 获取sessionId
},
//创建新对话
createChat() {
this.$http
.request({
url: "common/medicalRecords/medicalRecordsSplit",
method: "POST",
data: {
message: this.formData.message,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
console.log("res at line 713:", res);
if (res.code == 0) {
this.medicalId = res.data;
this.sendQuestion();
}
});
},
scrollToComment() {
// 获取容器
const container = this.$refs.homeWrap;
// 先获取目标元素的位置
const query = uni.createSelectorQuery().in(this);
query
.select("#commentData")
.boundingClientRect((rect) => {
if (rect) {
// 获取容器的位置
query
.select("#home_wrap")
.boundingClientRect((containerRect) => {
if (containerRect) {
console.log("containerRect at line 1068:", containerRect);
// 计算相对位置并设置 scrollTop
const scrollTop =
container.scrollTop + (rect.top - containerRect.top);
container.scrollTop = scrollTop; // 滚动容器到目标位置
}
})
.exec(); // 执行容器位置查询
}
})
.exec(); // 执行目标元素位置查询
},
//创建新对话
sendComment: throttle(function (comment, pid) {
this.$http
.request({
url: "common/taihuTalentArticle/addArticleComment",
method: "POST",
data: {
pid: pid ? pid : 0, //第一条评论为0
articleId: this.options.id, //文章id
content: comment, //内容
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
console.log("res at line 713:", res);
if (res.code == 0) {
if(pid==0){
setTimeout(() => {
this.scrollToView("commentData");
}, 100);
}
this.getMedicalDetail();
// this.scrollToComment();
} else {
this.$commonJS.showToast("评论失败");
}
});
}),
//交谈请求,获取回答
getTree(data) {
let result = [];
let map = {};
data.forEach((item) => {
map[item.id] = item;
});
data.forEach((item) => {
let parent = map[item.parentId];
if (parent) {
(parent.children || (parent.children = [])).push(item);
} else {
result.push(item);
}
});
return result;
},
getMedicalDetail(fn) {
//清空消息记录
this.$http
.request({
url: "common/taihuTalentArticle/getArticleInfo",
method: "POST",
data: {
articleId: this.medicalId,
},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
console.log("res at line 682:", res);
if (res.code == 0) {
this.loading = false;
this.articleInfo = res.article;
this.options.statusId = res.article.showFlag;
this.medicalForm = { ...this.articleInfo };
console.log("this.medicalForm at line 193:", this.articleInfo);
if (this.articleInfo.img) {
this.fileList1 = this.articleInfo.img.split(",");
}
this.$nextTick(() => {
// if (this.userInfo.id == this.articleInfo.userId) {
// this.currentUser = this.articleInfo.taihuTalent;
// } else {
this.currentUser = {
...this.userInfo,
icon: this.userInfo.avatar,
};
console.log("this.currentUser at line 823:", this.currentUser);
// }
});
this.likeList = res.article.likeList;
this.commentData = res.comments;
this.commentData = {
commentSize: res.commentCount,
comment: this.getTree(this.commentData),
};
this.judgeImg();
this.$forceUpdate();
if (fn) {
fn();
}
// 滚动到最底部锚点
// that.$nextTick(() => {
// that.scrollToBottom();
// });
// 停止轮询
}
})
.catch((error) => {
console.log("请求出错:", error);
});
//调用后端 SSE 接口,发送问题并接收实时回答
// this.startSSE(params);
},
},
onHide() {},
onUnload() {},
};
</script>
<style lang="scss" scoped>
@import "@/static/mixin.scss";
.content {
height: 100%;
background: linear-gradient(to bottom, #d8e6ff 0%, #d8e6ff57 90%, #fff 98%);
}
.home_top {
width: 100%;
background: #fff;
position: fixed;
top: 0;
left: 0;
padding: 90rpx 50rpx 30rpx;
text-align: center;
box-sizing: border-box;
z-index: 999;
.home_top_icon {
position: absolute;
left: 40rpx;
top: 85rpx;
display: flex;
align-items: center;
.home_top_left,
.home_top_right {
width: 60rpx;
height: 60rpx;
padding: 10rpx;
box-sizing: border-box;
}
.home_top_right {
margin-left: 30rpx;
}
}
text {
font-size: 43rpx;
line-height: 44rpx;
font-weight: bold;
color: $themeColor;
}
.home_top_folder {
padding: 12rpx;
position: absolute;
right: 40rpx;
top: 75rpx;
image {
width: 50rpx;
height: 50rpx;
}
}
}
.home_wrap {
// padding-bottom: 300rpx;
overflow-y: auto;
.home_logo {
padding-top: 40rpx;
image {
display: block;
width: 130rpx;
height: 130rpx;
margin: 0 auto;
}
.logo_main {
text-align: center;
display: block;
padding-top: 30rpx;
font-size: 35rpx;
color: $themeColor;
line-height: 46rpx;
}
.logo_con {
display: block;
width: 510rpx;
margin: 30rpx auto;
font-size: 28rpx;
color: #303030;
line-height: 40rpx;
text-indent: 2em;
}
}
}
.home_form {
height: 100%;
// margin-top: 60rpx;
position: relative;
.form_item {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 30rpx;
text {
line-height: 68rpx;
font-size: 38rpx;
color: #fff;
background: $themeBgColor;
text-align: center;
border-radius: 20rpx;
padding: 0 25rpx;
border: 1rpx solid $themeBgColor;
box-sizing: border-box;
}
textarea,
input {
display: inline-block;
width: calc(100%);
height: 70rpx;
line-height: 44rpx;
padding: 0 20rpx;
// padding: 17rpx 30rpx;
font-size: 38rpx;
color: #303030;
box-sizing: border-box;
resize: none;
overflow-y: scroll;
}
}
}
.custom-placeholder {
font-size: 38rpx;
font-weight: 500 !important;
color: #8b8c90 !important;
}
.submit_form {
width: 100%;
height: 90px;
background: #fff;
position: fixed;
left: 0;
bottom: 120rpx;
padding: 0 50rpx;
z-index: 999;
}
.submit_btn {
position: absolute;
right: 0rpx;
bottom: 10rpx;
image {
width: 55rpx;
height: 55rpx;
}
}
.active {
text {
color: $themeBgColor;
}
.assistants_img_1 {
display: none !important;
}
.assistants_img_2 {
display: block !important;
}
}
.message_wrap {
position: relative;
width: 100%;
// background: #fff;
z-index: 99;
padding: 0 30rpx;
height: 85vh;
}
.message_title {
text-align: center;
font-size: 30rpx;
color: #333;
line-height: 50rpx;
display: block;
font-weight: bold;
padding: 10rpx 0;
}
.message-container-block {
padding-top: 20rpx;
padding-bottom: 80px;
font-size: 30rpx;
}
.message-container {
display: inline;
line-height: 48rpx;
}
/* 自定义的loading效果 */
.loading-spinner {
margin-top: 10rpx;
border: 2px solid #f3f3f3;
/* 灰色背景 */
border-top: 2px solid #3498db;
/* 蓝色顶部 */
border-radius: 50%;
width: 16px;
height: 16px;
animation: spin 1s linear infinite;
/* 旋转动画 */
}
/* 旋转动画 */
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.bold-text {
display: block;
font-weight: bold;
font-size: 28rpx;
/* 增大字号 */
}
h3 {
font-size: 36rpx;
font-weight: bold;
}
h3 {
font-size: 32rpx;
}
.red-text {
color: red;
font-size: 28rpx;
/* 增大字号 */
}
.message-right {
display: block;
text-align: right;
margin: 30rpx 0;
text {
display: inline-block;
padding: 20rpx;
line-height: 38rpx;
background-color: rgba(81, 136, 229, 0.2);
border-radius: 15rpx;
color: #333;
font-size: 28rpx;
text-align: left;
}
}
.drawer-content {
height: 100vh;
display: flex;
flex-direction: column;
}
.list_content {
padding: 70rpx 20rpx 30rpx;
overflow-y: auto;
}
.list_item {
padding: 18rpx 10rpx;
}
.text_item {
display: block;
width: 100%;
font-size: 30rpx;
line-height: 40rpx;
padding: 0 10rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.null_text {
display: block;
text-align: center;
font-size: 30rpx;
color: #999;
padding-top: 150rpx;
}
.active_item {
background: #d8e6ff;
border-radius: 15rpx;
text {
color: #5188e5;
}
}
.folder_popup {
z-index: 9999;
.popup-content {
padding: 30rpx;
width: 550rpx;
background: #fff;
border-radius: 10rpx;
.popup-top {
padding: 15rpx;
display: flex;
align-items: center;
background: #5188e5;
border-radius: 10rpx;
color: #fff;
font-size: 28rpx;
line-height: 45rpx;
.uni-icons {
margin-right: 2rpx;
}
}
.popup-list {
.item-list {
padding: 15rpx;
background: #d8e6ff;
border-radius: 10rpx;
font-size: 28rpx;
line-height: 45rpx;
color: #5188e5;
margin-top: 15rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
text {
position: absolute;
right: 20rpx;
top: 12rpx;
font-size: 22rpx;
line-height: 45rpx;
color: #ff7800;
}
}
.popup-scroll {
max-height: 330rpx;
}
}
}
}
.aiFlag {
position: absolute;
bottom: 55px;
left: 20px;
width: calc(100% - 40px);
font-size: 11px;
line-height: 16px;
color: #f69e12;
z-index: 999;
background: rgba(254, 243, 225, 0.8);
border: 1px solid #f2d7aa;
padding: 5px;
border-radius: 6px;
}
.in {
border: 1rpx solid #eeeeee;
border-radius: 8rpx;
width: calc(100% - 200rpx);
}
.shangpin_editor {
width: 100%;
}
/deep/.h1_box {
height: 24px;
margin-top: 40rpx;
h1 {
margin: 0 !important;
font-size: 20px;
line-height: 24px;
}
}
#editor {
height: 300px;
border: 1px solid #ccc;
}
.ql-container {
height: auto;
min-height: auto;
}
.editor-wrapper {
// background-color: #f0f0f080;
padding: 20rpx;
box-sizing: border-box;
border-radius: 20rpx;
border: 0.5px solid #777778;
}
.footer_box {
background: #fff;
padding-top: 10rpx;
height: 80rpx;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
z-index: 10 !important;
box-sizing: content-box;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
box-shadow: 0 1px 15px rgba(0, 0, 0, 0.1);
}
.footer_bg {
background-color: #fff;
box-shadow: 0 0px 10px 1px #0000001a;
}
.footer_item {
position: relative;
flex: 1;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.footer_item .footer_item_icon {
display: flex;
align-items: center;
margin-bottom: 4rpx;
// justify-content: space-around;
}
.footer_item_count {
margin-left: 10rpx;
}
/deep/.u-upload__button {
background-color: #fff;
.uicon-camera-fill {
color: #5188e5 !important;
}
}
.analysis_box {
height: 100%;
// padding-top: 20rpx;
width: 100%;
box-sizing: border-box !important;
uni-textarea {
border: none !important;
}
.analysis_title {
margin-top: 30rpx;
margin-bottom: 20rpx;
// color: #1781ff;
font-size: 32rpx;
font-weight: 700;
}
.analysis_title_detail {
margin-top: 10rpx;
margin-bottom: 40rpx;
// color: #1781ff;
font-size: 38rpx !important;
font-weight: 700;
}
}
/deep/.home_wrap_analysis {
.home_form {
padding-bottom: 0px;
}
.form_item {
margin-bottom: 0 !important;
textarea {
// padding-top: 20rpx;
// height: 80vh !important;
}
.uni-textarea-wrapper {
// height: 100% !important;
}
}
.submit_btn {
padding: 0 40rpx;
position: absolute;
right: 24rpx;
bottom: 24rpx;
background-color: #1985fd;
margin: auto auto;
margin-top: 10rpx;
border-radius: 20rpx;
line-height: 62rpx;
height: 62rpx;
text-align: center;
color: #fff;
// font-weight: bold;
}
}
.content_detail {
background: #fff;
padding: 0 20rpx;
}
.message_wrap_detail {
padding: 0;
}
.analysis_img_box {
margin-bottom: 4rpx;
}
.analysis_img {
display: flex;
align-items: center;
// margin-bottom: 10rpx;
image {
width: 80rpx;
height: 80rpx;
border-radius: 80rpx;
margin-right: 20rpx;
}
}
.taihuTalentBox {
width: calc(100% - 100rpx);
color: #1b1b1b;
.taihuTalent_name {
font-size: 32rpx;
font-weight: 600;
}
.zhicheng {
background: #e4f0ff;
color: #1985fd;
padding: 4rpx 20rpx;
border-radius: 10rpx;
font-size: 24rpx;
line-height: 28rpx;
}
}
.orderModalShow {
width: 100%;
// max-height: 48vh;
// padding-bottom: 120rpx;
}
.popup_box {
padding: 20rpx;
box-sizing: border-box;
.curriulum_title_box {
.title {
text-align: center;
font-size: 34rpx !important;
}
}
}
.allImage {
margin-top: 40rpx;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
.imgList {
// margin: 0 30rpx;
}
.images:not(:nth-child(3n)) {
/* margin-right: 10rpx; */
}
.text {
margin: 1% 3% 2%;
}
.images {
margin-right: 10rpx;
display: inline-block;
}
.images3:nth-child(3n) {
margin-right: 0rpx;
}
.likeList {
background: #f7f7f7;
border-radius: 4rpx;
padding: 8rpx 20rpx;
box-sizing: border-box;
margin: 20rpx 0;
display: flex;
align-items: center;
}
::v-deep rich-text {
text-align: justify;
white-space: pre-wrap;
word-wrap: break-word;
}
::v-deep rich-text p,
h1,
h2 {
text-indent: 0 !important;
}
/deep/ rich-text br {
height: 0 !important;
display: none;
}
::v-deep rich-text h1 {
font-size: 36rpx;
line-height: 40rpx;
}
::v-deep rich-text h2 {
font-size: 32rpx;
line-height: 30rpx;
}
</style>