mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-20 16:26:43 +08:00
Compare commits
8 Commits
master
...
master-bug
| Author | SHA1 | Date | |
|---|---|---|---|
|
e6e60ae2e6 | ||
|
|
19618e3b90 | ||
|
|
4d4a93698f | ||
|
|
7e53ed11c2 | ||
|
|
85152e2e25 | ||
|
|
a1d5d0f079 | ||
|
|
99760c9940 | ||
|
|
3cfd025858 |
@@ -1,14 +1,14 @@
|
||||
/* 案例模块的相关处理*/
|
||||
import ajax from '@/utils/xajax.js'
|
||||
import ajaxs from '@/api/ajax.js'
|
||||
import ajax from "@/utils/xajax.js";
|
||||
import ajaxs from "@/api/ajax.js";
|
||||
/**首页查询
|
||||
* pageSize
|
||||
* orderField
|
||||
* orderAsc
|
||||
*/
|
||||
const indexList = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/case-random', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/case-random", query);
|
||||
};
|
||||
/*
|
||||
*案例分页搜索查询 是否推荐
|
||||
*@param(String) keyWord 关键词
|
||||
@@ -20,11 +20,11 @@ const indexList = function (query) {
|
||||
* @param(String) majorDomain 专业领域
|
||||
*/
|
||||
const queryList = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/queryList', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/queryList", query);
|
||||
};
|
||||
const queryListV2 = function (query) {
|
||||
return ajax.postJson('/xboe/m/boe/cases/queryListV2', query);
|
||||
}
|
||||
return ajax.postJson("/xboe/m/boe/cases/queryListV2", query);
|
||||
};
|
||||
/* 案例分页搜索查询 是否置顶
|
||||
*@param(String) keyWord 关键词
|
||||
@param(Boolean) isTop 是否置顶 true或false
|
||||
@@ -33,32 +33,32 @@ const queryListV2 = function (query) {
|
||||
* @param(String) majorDomain 专业领域
|
||||
*/
|
||||
const isTopList = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/isTopList', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/isTopList", query);
|
||||
};
|
||||
/* 设置置顶 取消置顶
|
||||
@param(String) id
|
||||
@param(Integer) isTop 是否置顶 0：未置顶，1：已置顶
|
||||
*/
|
||||
const updateTop = function (id, isTop) {
|
||||
return ajax.get(`/xboe/m/boe/cases/updateTop?id=${id}&isTop=${isTop}`);
|
||||
}
|
||||
};
|
||||
/* 删除案例
|
||||
*param(String) id 案例的id
|
||||
*/
|
||||
const del = function (id) {
|
||||
return ajax.get('/xboe/m/boe/cases/delete?id=' + id);
|
||||
}
|
||||
return ajax.get("/xboe/m/boe/cases/delete?id=" + id);
|
||||
};
|
||||
/*案例详情
|
||||
@param(String) id 案例的id
|
||||
@param(Boolean) addView 是否增加浏览量
|
||||
*/
|
||||
const detail = function (id, addView) {
|
||||
let pars = 'id=' + id;
|
||||
let pars = "id=" + id;
|
||||
if (addView) {
|
||||
pars += '&addView=' + addView
|
||||
}
|
||||
return ajax.get('/xboe/m/boe/cases/detail?' + pars);
|
||||
pars += "&addView=" + addView;
|
||||
}
|
||||
return ajax.get("/xboe/m/boe/cases/detail?" + pars);
|
||||
};
|
||||
/*推荐
|
||||
*@param (String) id 案例的id
|
||||
*@param (String) title 案例的标题
|
||||
@@ -66,61 +66,65 @@ const detail = function (id, addView) {
|
||||
*@param (String) recommentThat 推荐说明
|
||||
*/
|
||||
const savaRecommend = function (data) {
|
||||
return ajax.post('/xboe/m/boe/recommend/save', data);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/recommend/save", data);
|
||||
};
|
||||
/* 推荐列表
|
||||
*没有参数
|
||||
*/
|
||||
const query = function () {
|
||||
return ajax.get('/xboe/m/boe/recommend/query');
|
||||
}
|
||||
return ajax.get("/xboe/m/boe/recommend/query");
|
||||
};
|
||||
/*
|
||||
*作者排行榜
|
||||
@param pageSize 长度
|
||||
*/
|
||||
const usernameList = function (pageSize) {
|
||||
return ajax.get(`/xboe/m/boe/cases/usernamelist?pageSize=${pageSize}`);
|
||||
}
|
||||
};
|
||||
/*
|
||||
人气榜
|
||||
@param pageSize 长度
|
||||
*/
|
||||
const queryPraises = function (pageSize) {
|
||||
return ajax.get(`/xboe/m/boe/cases/query-praises?pageSize=${pageSize}`);
|
||||
}
|
||||
};
|
||||
const queryPraisesNew = function (pageSize, rankType) {
|
||||
return ajax.get(`/xboe/m/boe/cases/queryPopularity?pageSize=${pageSize}&rankType=${rankType}`);
|
||||
}
|
||||
return ajax.get(
|
||||
`/xboe/m/boe/cases/queryPopularity?pageSize=${pageSize}&rankType=${rankType}`
|
||||
);
|
||||
};
|
||||
const queryRecommendRank = function (pageSize) {
|
||||
return ajax.get(`/xboe/m/boe/cases/queryRecommendRank?pageSize=${pageSize}`);
|
||||
}
|
||||
};
|
||||
/*
|
||||
好评榜
|
||||
@param pageSize 长度
|
||||
*/
|
||||
const queryComments = function (pageSize) {
|
||||
return ajax.get(`/xboe/m/boe/cases/query-comments?pageSize=${pageSize}`);
|
||||
}
|
||||
};
|
||||
const queryCommentsNew = function (pageSize, rankType) {
|
||||
return ajax.get(`/xboe/m/boe/cases/queryHighOpinion?pageSize=${pageSize}&rankType=${rankType}`);
|
||||
}
|
||||
return ajax.get(
|
||||
`/xboe/m/boe/cases/queryHighOpinion?pageSize=${pageSize}&rankType=${rankType}`
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* 专业分类
|
||||
* */
|
||||
const majorTypes = function () {
|
||||
return ajax.get('/xboe/m/boe/cases/majorTypes');
|
||||
}
|
||||
return ajax.get("/xboe/m/boe/cases/majorTypes");
|
||||
};
|
||||
|
||||
/**
|
||||
* 详情新*/
|
||||
const details = function (id, addView) {
|
||||
let pars = 'id=' + id;
|
||||
let pars = "id=" + id;
|
||||
if (addView) {
|
||||
pars += '&addView=' + addView
|
||||
}
|
||||
return ajax.get('/xboe/m/boe/cases/details?' + pars);
|
||||
pars += "&addView=" + addView;
|
||||
}
|
||||
return ajax.get("/xboe/m/boe/cases/details?" + pars);
|
||||
};
|
||||
|
||||
/**
|
||||
* 二次查询
|
||||
@@ -129,8 +133,8 @@ const details = function (id, addView) {
|
||||
* }
|
||||
* */
|
||||
const ids = function (data) {
|
||||
return ajax.postJson('/xboe/m/boe/cases/ids', data);
|
||||
}
|
||||
return ajax.postJson("/xboe/m/boe/cases/ids", data);
|
||||
};
|
||||
|
||||
/**
|
||||
* 设置和取消优秀案例
|
||||
@@ -140,9 +144,8 @@ const ids = function (data) {
|
||||
* }
|
||||
* */
|
||||
const excellent = function (data) {
|
||||
return ajax.post('/xboe/m/boe/cases/excellent', data)
|
||||
}
|
||||
|
||||
return ajax.post("/xboe/m/boe/cases/excellent", data);
|
||||
};
|
||||
|
||||
/**
|
||||
*我的案例
|
||||
@@ -152,8 +155,8 @@ const excellent = function (data) {
|
||||
* }
|
||||
* */
|
||||
const mylist = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/mylist', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/mylist", query);
|
||||
};
|
||||
|
||||
/**
|
||||
* 导出
|
||||
@@ -163,21 +166,26 @@ const mylist = function (query) {
|
||||
* }
|
||||
* */
|
||||
const exportCases = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/export', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/export", query);
|
||||
};
|
||||
|
||||
/**
|
||||
* 导出案例后加的
|
||||
* */
|
||||
const exports = function (query) {
|
||||
return ajax.post('/xboe/m/boe/cases/exportCase', query, { responseType: 'blob' });
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/exportCase", query, {
|
||||
responseType: "blob",
|
||||
});
|
||||
};
|
||||
/**
|
||||
* @param
|
||||
* 记录查看开始时间
|
||||
* caseRecommendId读取的案例的id
|
||||
*/
|
||||
const startReadTimer = (caseRecommendId) => ajax.get(`/xboe/m/boe/cases/recommend/startRead?caseRecommendId=${caseRecommendId}`);
|
||||
const startReadTimer = (caseRecommendId) =>
|
||||
ajax.get(
|
||||
`/xboe/m/boe/cases/recommend/startRead?caseRecommendId=${caseRecommendId}`
|
||||
);
|
||||
|
||||
/**
|
||||
* @param
|
||||
@@ -187,34 +195,56 @@ const startReadTimer = (caseRecommendId) => ajax.get(`/xboe/m/boe/cases/recomm
|
||||
* browseDuration [浏览时间秒]
|
||||
* }
|
||||
*/
|
||||
const endReadTimer = (data)=> ajax.postJson('/xboe/m/boe/cases/recommend/recordBrowseDuration',data)
|
||||
const endReadTimer = (data) =>
|
||||
ajax.postJson("/xboe/m/boe/cases/recommend/recordBrowseDuration", data);
|
||||
|
||||
/**年份查询
|
||||
*
|
||||
*/
|
||||
const caseYears = function (query = {}) {
|
||||
return ajax.post('/xboe/m/boe/cases/caseYears', query);
|
||||
}
|
||||
return ajax.post("/xboe/m/boe/cases/caseYears", query);
|
||||
};
|
||||
//案例推荐榜单
|
||||
const getQueryRecommendRank = function (params) {
|
||||
return ajax.get(`/xboe/m/boe/cases/queryRecommendRank?pageSize=${params.pageSize}`)
|
||||
}
|
||||
return ajax.get(
|
||||
`/xboe/m/boe/cases/queryRecommendRank?pageSize=${params.pageSize}`
|
||||
);
|
||||
};
|
||||
//案例上榜
|
||||
const riseIntoRank = (data) => ajax.post(`/xboe/m/boe/cases/riseIntoRank?caseId=${data.caseId}`)
|
||||
const riseIntoRank = (data) =>
|
||||
ajax.post(`/xboe/m/boe/cases/riseIntoRank?caseId=${data.caseId}`);
|
||||
//取消上榜
|
||||
const cancelRiseIntoRank = (data) => ajax.post(`/xboe/m/boe/cases/cancelRiseIntoRank?caseId=${data.caseId}`)
|
||||
const cancelRiseIntoRank = (data) =>
|
||||
ajax.post(`/xboe/m/boe/cases/cancelRiseIntoRank?caseId=${data.caseId}`);
|
||||
//调整榜单
|
||||
const adjustRank = (data) => ajax.post(`/xboe/m/boe/cases/adjustRank?caseIds=${data.caseIds}`)
|
||||
const adjustRank = (data) =>
|
||||
ajax.post(`/xboe/m/boe/cases/adjustRank?caseIds=${data.caseIds}`);
|
||||
//收藏案例
|
||||
const queryFavoriteCaseOfIndex = (params) => ajax.get(`/xboe/m/boe/cases/queryFavoriteCaseOfIndex?pageIndex=${params.pageIndex}&pageSize=${params.pageSize}&orderField=${params.orderField}&orderAsc=${params.orderAsc}`)
|
||||
const queryFavoriteCaseOfIndex = (params) =>
|
||||
ajax.get(
|
||||
`/xboe/m/boe/cases/queryFavoriteCaseOfIndex?pageIndex=${params.pageIndex}&pageSize=${params.pageSize}&orderField=${params.orderField}&orderAsc=${params.orderAsc}`
|
||||
);
|
||||
//浏览记录
|
||||
const queryViewRecord = (data) => ajaxs.post(`/statApi/xboe/m/stat/userdynamic/list?pageIndex=${data.pageIndex}&pageSize=${data.pageSize}&contentType=${data.contentType}&aid=${data.aid}&hidden=${data.hidden}&eventKey=${data.eventKey}`)
|
||||
const queryViewRecord = (data) =>
|
||||
ajaxs.post(
|
||||
`/statApi/xboe/m/stat/userdynamic/list?pageIndex=${data.pageIndex}&pageSize=${data.pageSize}&contentType=${data.contentType}&aid=${data.aid}&hidden=${data.hidden}&eventKey=${data.eventKey}`
|
||||
);
|
||||
//浏览量TOP榜单
|
||||
const queryPopularityOfMajor = (params) => ajax.get(`/xboe/m/boe/cases/queryPopularityOfMajor?pageSize=${params.pageSize}&rankMonth=${params.rankMonth}&majorId=${params.majorId}`)
|
||||
const queryPopularityOfMajor = (params) =>
|
||||
ajax.get(
|
||||
`/xboe/m/boe/cases/queryPopularityOfMajor?pageSize=${params.pageSize}&rankMonth=${params.rankMonth}&majorId=${params.majorId}`
|
||||
);
|
||||
//浏览记录新
|
||||
const browsingHistory = (params) => ajax.get(`/xboe/m/boe/cases/browsingHistory?pageIndex=${params.pageIndex}&pageSize=5`)
|
||||
const browsingHistory = (params) =>
|
||||
ajax.get(
|
||||
`/xboe/m/boe/cases/browsingHistory?pageIndex=${params.pageIndex}&pageSize=5`
|
||||
);
|
||||
//获取所有的专业月份
|
||||
const queryAllTimePopularityOfMajor = () => ajax.get('/xboe/m/boe/cases/queryAllTimePopularityOfMajor')
|
||||
const queryAllTimePopularityOfMajor = () =>
|
||||
ajax.get("/xboe/m/boe/cases/queryAllTimePopularityOfMajor");
|
||||
// 获取会话ID
|
||||
const initChat = () => ajax.get("/xboe/m/boe/case/ai/initChat");
|
||||
|
||||
export default {
|
||||
queryAllTimePopularityOfMajor,
|
||||
getQueryRecommendRank,
|
||||
@@ -249,5 +279,6 @@ export default {
|
||||
exports,
|
||||
startReadTimer,
|
||||
endReadTimer,
|
||||
caseYears
|
||||
}
|
||||
caseYears,
|
||||
initChat,
|
||||
};
|
||||
|
||||
BIN
src/assets/images/case/stop.png
Normal file
BIN
src/assets/images/case/stop.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
@@ -40,6 +40,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-colleage-active');
|
||||
|
||||
let list = colleage.colleage;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -47,39 +50,44 @@ export default {
|
||||
});
|
||||
this.colleageList = list;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-colleage-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-colleage-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-colleage-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-colleage-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-colleage-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-colleage-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-colleage-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-colleage-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-colleage-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-colleage-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,41 +49,49 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-course-active');
|
||||
|
||||
this.courseList = course.course;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-course-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-course-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-course-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-course-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-course-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-course-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-course-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-course-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-course-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-course-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -98,6 +98,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('course-detail-page-active');
|
||||
|
||||
this.id = this.$route.params.id
|
||||
let list = course.course;
|
||||
let pid = this.id
|
||||
@@ -124,45 +127,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('course-detail-page-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.course-detail-page-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.course-detail-page-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.course-detail-page-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.course-detail-page-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.course-detail-page-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.course-detail-page-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.course-detail-page-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.course-detail-page-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.course-detail-page-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.course-detail-page-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -123,6 +123,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-project-detail-active');
|
||||
|
||||
this.id = this.$route.params.id;
|
||||
let list = project.project;
|
||||
let pid = this.id;
|
||||
@@ -154,45 +157,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-project-detail-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-project-detail-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-project-detail-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-detail-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-project-detail-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-detail-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-project-detail-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-detail-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-project-detail-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-detail-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.contributor-conference-project-detail-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -52,6 +52,9 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-example-active');
|
||||
|
||||
let list = example.example
|
||||
for(let i = 0; i<list.length; i++){
|
||||
if(list[i].content.length > 200){
|
||||
@@ -60,40 +63,45 @@ export default {
|
||||
}
|
||||
this.exampleList = list
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-example-active');
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-example-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-example-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-example-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-example-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-example-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-example-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-example-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-example-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-example-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -383,41 +383,49 @@ export default {
|
||||
// if (res && res.code == "0") {
|
||||
// console.log(res);
|
||||
// }
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-index-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-index-active');
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-index-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-index-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-index-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-index-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-index-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-index-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-index-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-index-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-index-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -111,39 +111,48 @@ export default {
|
||||
this.$router.back('/contributor/index')
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-project-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-project-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-project-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-project-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-project-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-project-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-project-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-project-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,6 +43,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-teacher-active');
|
||||
|
||||
let list = teacher.teacher;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -51,38 +54,43 @@ export default {
|
||||
this.teacherList = list
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-teacher-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-teacher-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-teacher-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-teacher-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-teacher-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-teacher-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-teacher-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-teacher-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-teacher-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-teacher-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -40,6 +40,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-colleage-active');
|
||||
|
||||
let list = colleage.colleage;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -49,39 +52,44 @@ export default {
|
||||
});
|
||||
this.colleageList = list;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-colleage-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-colleage-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-colleage-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-colleage-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-colleage-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-colleage-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-colleage-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-colleage-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-colleage-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-colleage-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -50,41 +50,49 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-course-active');
|
||||
|
||||
this.courseList = course.course;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-course-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-course-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -98,6 +98,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-course-detail-active');
|
||||
|
||||
this.id = this.$route.params.id
|
||||
let list = course.course;
|
||||
let pid = this.id
|
||||
@@ -124,45 +127,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-course-detail-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-course-detail-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-detail-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-detail-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-detail-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-detail-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-detail-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-detail-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-course-detail-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-course-detail-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.contributor-conference-2024-course-detail-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -129,6 +129,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-project-detail-active');
|
||||
|
||||
this.id = this.$route.params.id;
|
||||
let list = project.project;
|
||||
let pid = this.id;
|
||||
@@ -160,45 +163,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-project-detail-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-project-detail-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-detail-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-detail-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-detail-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-detail-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-detail-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-detail-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-detail-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-detail-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.contributor-conference-2024-project-detail-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -52,6 +52,9 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-example-active');
|
||||
|
||||
let list = example.example
|
||||
for(let i = 0; i<list.length; i++){
|
||||
if(list[i].content.length > 200){
|
||||
@@ -60,40 +63,45 @@ export default {
|
||||
}
|
||||
this.exampleList = list
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-example-active');
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-example-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-example-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-example-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-example-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-example-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-example-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-example-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-example-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-example-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -408,6 +408,14 @@ export default {
|
||||
// if (res && res.code == "0") {
|
||||
// console.log(res);
|
||||
// }
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-index-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-index-active');
|
||||
}
|
||||
|
||||
}
|
||||
@@ -425,35 +433,36 @@ export default {
|
||||
font-family: 'biaoti2';
|
||||
src: url('../../assets/fonts/KMQfP4.ttf');
|
||||
}
|
||||
// 使用 body.contributor-conference-2024-index-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-index-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-index-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-index-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-index-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-index-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-index-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-index-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-index-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -139,39 +139,48 @@ export default {
|
||||
this.$router.back('/contributor_2024/index')
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-project-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-project-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-project-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-project-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-project-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,6 +43,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-2024-teacher-active');
|
||||
|
||||
let list = teacher.teacher;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -51,38 +54,43 @@ export default {
|
||||
this.teacherList = list
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-2024-teacher-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-2024-teacher-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-2024-teacher-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-teacher-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-2024-teacher-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-teacher-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-2024-teacher-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-teacher-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-2024-teacher-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-2024-teacher-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -40,6 +40,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-colleage-active');
|
||||
|
||||
let list = colleage.colleage;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -47,39 +50,44 @@ export default {
|
||||
});
|
||||
this.colleageList = list;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-colleage-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-colleage-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-colleage-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-colleage-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-colleage-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-colleage-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-colleage-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-colleage-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-colleage-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-colleage-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -50,41 +50,49 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-course-active');
|
||||
|
||||
this.courseList = course.course;
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-course-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-course-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-course-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-course-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-course-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-course-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -98,6 +98,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-course-detail-active');
|
||||
|
||||
this.id = this.$route.params.id
|
||||
let list = course.course;
|
||||
let pid = this.id
|
||||
@@ -124,45 +127,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-course-detail-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-course-detail-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-course-detail-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-detail-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-course-detail-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-detail-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-course-detail-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-detail-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-course-detail-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-course-detail-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.contributor-conference-new-course-detail-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -129,6 +129,9 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-project-detail-active');
|
||||
|
||||
this.id = this.$route.params.id;
|
||||
let list = project.project;
|
||||
let pid = this.id;
|
||||
@@ -160,45 +163,50 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-project-detail-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-project-detail-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-project-detail-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-detail-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-project-detail-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-detail-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-project-detail-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-detail-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-project-detail-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-detail-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
body.contributor-conference-new-project-detail-active {
|
||||
background-color: #e0ded9;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -52,6 +52,9 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-example-active');
|
||||
|
||||
let list = example.example
|
||||
for(let i = 0; i<list.length; i++){
|
||||
if(list[i].content.length > 200){
|
||||
@@ -60,40 +63,45 @@ export default {
|
||||
}
|
||||
this.exampleList = list
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-example-active');
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-example-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-example-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-example-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-example-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-example-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-example-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-example-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-example-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-example-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -401,6 +401,14 @@ export default {
|
||||
// if (res && res.code == "0") {
|
||||
// console.log(res);
|
||||
// }
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-index-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-index-active');
|
||||
}
|
||||
|
||||
|
||||
@@ -419,35 +427,36 @@ export default {
|
||||
font-family: 'biaoti2';
|
||||
src: url('../../assets/fonts/KMQfP4.ttf');
|
||||
}
|
||||
// 使用 body.contributor-conference-new-index-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-index-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-index-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-index-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-index-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-index-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-index-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-index-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-index-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -183,39 +183,48 @@ export default {
|
||||
this.$router.back('/contributornew/index')
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-project-active');
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-project-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-project-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-project-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-project-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-project-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-project-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-project-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,6 +43,9 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 给 body 添加特定类名，用于限制样式作用域
|
||||
document.body.classList.add('contributor-conference-new-teacher-active');
|
||||
|
||||
let list = teacher.teacher;
|
||||
list.forEach(element => {
|
||||
let temp = element.org.split('/')
|
||||
@@ -51,38 +54,43 @@ export default {
|
||||
this.teacherList = list
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时移除类名
|
||||
document.body.classList.remove('contributor-conference-new-teacher-active');
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
// 使用 body.contributor-conference-new-teacher-active 类名限制样式只在该页面生效
|
||||
@media screen and (min-width: 1440px) and (max-width: 1600px){
|
||||
body{
|
||||
body.contributor-conference-new-teacher-active{
|
||||
zoom: 79%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-teacher-active #bg{
|
||||
width: 1900px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1366px) and (max-width: 1440px){
|
||||
body{
|
||||
body.contributor-conference-new-teacher-active{
|
||||
zoom: 74%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-teacher-active #bg{
|
||||
width: 1869px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1280px) and (max-width: 1366px){
|
||||
body{
|
||||
body.contributor-conference-new-teacher-active{
|
||||
zoom: 72%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-teacher-active #bg{
|
||||
width: 1874px !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px){
|
||||
body{
|
||||
body.contributor-conference-new-teacher-active{
|
||||
zoom: 67%;
|
||||
}
|
||||
#bg{
|
||||
body.contributor-conference-new-teacher-active #bg{
|
||||
width: 1885px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -71,7 +71,9 @@
|
||||
</el-row>
|
||||
</div>
|
||||
<div style="margin-right:30px;">
|
||||
<el-table style="margin:10px 32px 10px 22px;" :data="pageData" border stripe>
|
||||
<!-- ai播放器相关 -->
|
||||
<el-table style="margin:10px 32px 10px 22px;" :data="pageData" border stripe @selection-change="handleSelectionChange">
|
||||
<el-table-column v-if="aiPermission" type="selection" width="55"></el-table-column>
|
||||
<el-table-column label="序号" type="index" width="50"></el-table-column>
|
||||
<el-table-column v-if="forChoose" label="选择" width="80">
|
||||
<template slot-scope="scope" v-if="scope.row.published">
|
||||
@@ -107,7 +109,7 @@
|
||||
{{ courseType(scope.row.type)}}
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column label="状态" prop="status" width="120px">
|
||||
<el-table-column label="状态" prop="status" width="100">
|
||||
<template slot-scope="scope">
|
||||
<!-- 1，未提交 2.已提交 = 未审核 5 已审核 -->
|
||||
<span v-if="scope.row.status == 1">未提交</span>
|
||||
@@ -116,23 +118,25 @@
|
||||
<span v-if="scope.row.status == 3">审核未通过</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否发布" width="130px">
|
||||
<el-table-column label="是否发布" width="80">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.published == true ? '已发布' : '未发布' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建人" prop="sysCreateBy"></el-table-column>
|
||||
<el-table-column label="创建时间" prop="sysCreateTime" width="230px" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="是否停用" width="130px">
|
||||
<el-table-column label="创建时间" prop="sysCreateTime" width="150" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="是否停用" width="80">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.enabled == true ? '启用' : '停用' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否置顶" width="130px">
|
||||
<el-table-column label="是否置顶" width="80">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.isTop == true ? '置顶' : '未置顶' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="审核人" prop="auditUser" width="80"></el-table-column>
|
||||
<el-table-column label="审核时间" prop="auditTime" width="150" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="操作" width="180px" fixed="right">
|
||||
<template slot-scope="scope" class="btn-gl">
|
||||
<!-- 20240621 修改scope.row.isPermission = fasle 时不展示操作按钮-->
|
||||
@@ -299,7 +303,7 @@ import auditCourse2 from '@/components/Course/auditCourse2.vue';
|
||||
import adminPage from '@/components/Administration/adminPage.vue';
|
||||
import apiResowner from '../../api/modules/resowner.js';
|
||||
import apiType from '../../api/modules/type.js'
|
||||
import {courseType} from '../../utils/tools.js';
|
||||
import {courseType, deepCopy} from '../../utils/tools.js';
|
||||
import apiCourse from '../../api/modules/course.js';
|
||||
// import {resOwnerIndexName,sysTypeIndexName} from '@/utils/type.js';
|
||||
import { mapGetters,mapActions } from 'vuex';
|
||||
@@ -307,8 +311,9 @@ import apiUserbasic from "@/api/boe/userbasic.js"
|
||||
export default {
|
||||
name: 'manageCourse',
|
||||
components: {courseForm, manager, auditCourse1, auditCourse2,adminPage},
|
||||
// ai播放器相关
|
||||
computed: {
|
||||
...mapGetters(['resOwnerMap','sysTypeMap','userInfo']),
|
||||
...mapGetters(['resOwnerMap','sysTypeMap','userInfo', 'selectAllLang']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -426,6 +431,7 @@ export default {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
getAudiences(){
|
||||
apiUserbasic.getInAudienceIds().then(res=>{
|
||||
if (res.status == 200) {
|
||||
@@ -449,6 +455,7 @@ export default {
|
||||
inputOn() {
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
// 置顶
|
||||
setTop(row) {
|
||||
let params = {
|
||||
|
||||
@@ -19,22 +19,27 @@
|
||||
<span>案例专家</span>
|
||||
<div class="window-control-btn">
|
||||
<el-button
|
||||
style="color:#96999f;margin-right: 6px;"
|
||||
style="color: #96999f; margin-right: 6px"
|
||||
type="text"
|
||||
@click="minimizeWindow"
|
||||
>
|
||||
<i class="el-icon-minus"></i>
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
style="color:#96999f;"
|
||||
>
|
||||
<img v-if="!dialogFullscreen" @click="onbigWindowClick" :src="openImg" alt="" style="width: 17px">
|
||||
<i v-else @click="onRestoreWindowClick" class="el-icon-copy-document"></i>
|
||||
<el-button type="text" style="color: #96999f">
|
||||
<img
|
||||
v-if="!dialogFullscreen"
|
||||
@click="onbigWindowClick"
|
||||
:src="openImg"
|
||||
alt=""
|
||||
style="width: 17px"
|
||||
/>
|
||||
<i
|
||||
v-else
|
||||
@click="onRestoreWindowClick"
|
||||
class="el-icon-copy-document"
|
||||
></i>
|
||||
</el-button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="content-wrapper" v-show="isLan">
|
||||
@@ -48,11 +53,31 @@
|
||||
@scroll="handleScroll"
|
||||
@wheel="handleWheel"
|
||||
>
|
||||
<div class="message-text" v-for="(item, index) in messageList" :key="index">
|
||||
<messages :messageData="item" @update:messageData="val=> $set(messageList, index, val)" :suggestions="suggestions" @getMinWindow="minimizeWindow" :isFirstMessage="item.isFirstMessage"></messages>
|
||||
<div
|
||||
class="message-text"
|
||||
v-for="(item, index) in messageList"
|
||||
:key="index"
|
||||
>
|
||||
<messages
|
||||
:messageData="item"
|
||||
@update:messageData="(val) => $set(messageList, index, val)"
|
||||
:suggestions="suggestions"
|
||||
@getMinWindow="minimizeWindow"
|
||||
:isFirstMessage="item.isFirstMessage"
|
||||
></messages>
|
||||
</div>
|
||||
<div class="message-suggestions" v-if="messageList.length > 0 && messageList[messageList.length-1].textCompleted">
|
||||
<div class="suggestion-item" v-for="(item, index) in suggestions" :key="index">
|
||||
<div
|
||||
class="message-suggestions"
|
||||
v-if="
|
||||
messageList.length > 0 &&
|
||||
messageList[messageList.length - 1].textCompleted
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="suggestion-item"
|
||||
v-for="(item, index) in suggestions"
|
||||
:key="index"
|
||||
>
|
||||
<a @click="sendSuggestions(item)"> {{ item }} →</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -75,6 +100,8 @@
|
||||
@update-suggestions="updateSuggestions"
|
||||
@new-conversation="startNewConversation"
|
||||
:disabled="isLoading"
|
||||
:stopShow="stopShow"
|
||||
:sendShow="sendShow"
|
||||
class="input-area-wrapper"
|
||||
ref="sendMessage"
|
||||
/>
|
||||
@@ -95,7 +122,7 @@
|
||||
class="window-control-btn"
|
||||
@click.stop="onMinimizedWindowClick"
|
||||
>
|
||||
<img :src="openImg" alt="" style="width: 17px">
|
||||
<img :src="openImg" alt="" style="width: 17px" />
|
||||
</el-button>
|
||||
|
||||
<el-button
|
||||
@@ -121,47 +148,48 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
import messages from './components/messages.vue'
|
||||
import sendMessage from './components/sendMessage.vue'
|
||||
import openImg from './components/open.png'
|
||||
import { mapState } from "vuex";
|
||||
import messages from "./components/messages.vue";
|
||||
import sendMessage from "./components/sendMessage.vue";
|
||||
import openImg from "./components/open.png";
|
||||
import LanServiceChecker from "@/components/LanServiceChecker.vue";
|
||||
export default {
|
||||
name: 'CaseExpertDialog',
|
||||
name: "CaseExpertDialog",
|
||||
props: {
|
||||
dialogVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
components: {
|
||||
LanServiceChecker,
|
||||
messages,
|
||||
sendMessage
|
||||
sendMessage,
|
||||
},
|
||||
directives: {
|
||||
draggable: {
|
||||
bind(el, binding, vnode) {
|
||||
vnode.context.$nextTick(() => {
|
||||
const dialogEl = el.querySelector('.el-dialog');
|
||||
const dialogEl = el.querySelector(".el-dialog");
|
||||
if (!dialogEl) return;
|
||||
|
||||
const headerEl = dialogEl.querySelector('.dialog-title');
|
||||
const headerEl = dialogEl.querySelector(".dialog-title");
|
||||
if (!headerEl) return;
|
||||
|
||||
// 检查是否有保存的位置状态
|
||||
const savedPosition = sessionStorage.getItem('aiCallDialogPosition');
|
||||
const savedPosition = sessionStorage.getItem("aiCallDialogPosition");
|
||||
if (savedPosition) {
|
||||
const { left, top } = JSON.parse(savedPosition);
|
||||
dialogEl.style.left = left + 'px';
|
||||
dialogEl.style.top = top + 'px';
|
||||
dialogEl.style.left = left + "px";
|
||||
dialogEl.style.top = top + "px";
|
||||
} else {
|
||||
// 设置初始样式
|
||||
dialogEl.style.position = 'fixed';
|
||||
dialogEl.style.top = '100px';
|
||||
dialogEl.style.left = (window.innerWidth - dialogEl.offsetWidth) / 2 + 'px';
|
||||
dialogEl.style.position = "fixed";
|
||||
dialogEl.style.top = "100px";
|
||||
dialogEl.style.left =
|
||||
(window.innerWidth - dialogEl.offsetWidth) / 2 + "px";
|
||||
}
|
||||
dialogEl.style.margin = '0';
|
||||
dialogEl.style.margin = "0";
|
||||
|
||||
let isDragging = false;
|
||||
let startX = 0;
|
||||
@@ -170,10 +198,10 @@ export default {
|
||||
let startTop = 0;
|
||||
const startDrag = (event) => {
|
||||
// 只有在标题栏上按下鼠标才开始拖动
|
||||
if (event.target.closest('.resize-handle')) {
|
||||
if (event.target.closest(".resize-handle")) {
|
||||
return; // 如果点击的是resize-handle，则不触发拖动
|
||||
}
|
||||
if (event.target.closest('.window-control-btn')) {
|
||||
if (event.target.closest(".window-control-btn")) {
|
||||
return; // 如果点击的是控制按钮，则不触发拖动
|
||||
}
|
||||
// 全屏状态下拖动为正常弹窗大小
|
||||
@@ -191,8 +219,8 @@ export default {
|
||||
event.stopPropagation();
|
||||
|
||||
// 添加全局事件监听
|
||||
document.addEventListener('mousemove', handleMouseMove);
|
||||
document.addEventListener('mouseup', stopDrag);
|
||||
document.addEventListener("mousemove", handleMouseMove);
|
||||
document.addEventListener("mouseup", stopDrag);
|
||||
};
|
||||
|
||||
const handleMouseMove = (event) => {
|
||||
@@ -201,8 +229,26 @@ export default {
|
||||
const deltaX = event.clientX - startX;
|
||||
const deltaY = event.clientY - startY;
|
||||
|
||||
dialogEl.style.left = (startLeft + deltaX) + 'px';
|
||||
dialogEl.style.top = (startTop + deltaY) + 'px';
|
||||
// 计算新位置
|
||||
let newLeft = startLeft + deltaX;
|
||||
let newTop = startTop + deltaY;
|
||||
|
||||
// 获取对话框尺寸
|
||||
const dialogWidth = dialogEl.offsetWidth;
|
||||
const dialogHeight = dialogEl.offsetHeight;
|
||||
|
||||
// 限制拖拽范围在浏览器可视区域内
|
||||
// 左边界
|
||||
newLeft = Math.max(-500, newLeft);
|
||||
// 右边界
|
||||
newLeft = Math.min(window.innerWidth - dialogWidth, newLeft);
|
||||
// 上边界
|
||||
newTop = Math.max(0, newTop);
|
||||
// 下边界 (确保标题栏始终可见，标题栏高度约为80px)
|
||||
newTop = Math.min(window.innerHeight - 80, newTop);
|
||||
|
||||
dialogEl.style.left = newLeft + "px";
|
||||
dialogEl.style.top = newTop + "px";
|
||||
};
|
||||
|
||||
const stopDrag = () => {
|
||||
@@ -210,114 +256,113 @@ export default {
|
||||
// 保存当前位置到 sessionStorage
|
||||
const currentPosition = {
|
||||
left: parseInt(dialogEl.style.left),
|
||||
top: parseInt(dialogEl.style.top)
|
||||
top: parseInt(dialogEl.style.top),
|
||||
};
|
||||
// sessionStorage.setItem('aiCallDialogPosition', JSON.stringify(currentPosition));
|
||||
// 移除全局事件监听
|
||||
document.removeEventListener('mousemove', handleMouseMove);
|
||||
document.removeEventListener('mouseup', stopDrag);
|
||||
document.removeEventListener("mousemove", handleMouseMove);
|
||||
document.removeEventListener("mouseup", stopDrag);
|
||||
};
|
||||
|
||||
// 为标题栏绑定拖动事件
|
||||
headerEl.addEventListener('mousedown', startDrag);
|
||||
headerEl.addEventListener("mousedown", startDrag);
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
resizeable: {
|
||||
bind(el, binding, vnode) {
|
||||
// 确保元素已插入DOM
|
||||
vnode.context.$nextTick(() => {
|
||||
const dialogEl = el.querySelector('.el-dialog');
|
||||
const dialogEl = el.querySelector(".el-dialog");
|
||||
if (!dialogEl) return;
|
||||
|
||||
// 检查是否有保存的尺寸状态
|
||||
const savedSize = sessionStorage.getItem('aiCallDialogSize');
|
||||
const savedSize = sessionStorage.getItem("aiCallDialogSize");
|
||||
if (savedSize) {
|
||||
const { width, height, left, top } = JSON.parse(savedSize);
|
||||
dialogEl.style.width = width + 'px';
|
||||
dialogEl.style.height = height + 'px';
|
||||
dialogEl.style.left = left + 'px';
|
||||
dialogEl.style.top = top + 'px';
|
||||
dialogEl.style.width = width + "px";
|
||||
dialogEl.style.height = height + "px";
|
||||
dialogEl.style.left = left + "px";
|
||||
dialogEl.style.top = top + "px";
|
||||
} else {
|
||||
// 设置初始样式
|
||||
dialogEl.style.position = 'fixed';
|
||||
dialogEl.style.top = '100px';
|
||||
dialogEl.style.left = (window.innerWidth - dialogEl.offsetWidth) / 2 + 'px';
|
||||
dialogEl.style.position = "fixed";
|
||||
dialogEl.style.top = "100px";
|
||||
dialogEl.style.left =
|
||||
(window.innerWidth - dialogEl.offsetWidth) / 2 + "px";
|
||||
}
|
||||
|
||||
// 创建拖拽手柄
|
||||
const createHandle = (direction) => {
|
||||
const handle = document.createElement('div');
|
||||
const handle = document.createElement("div");
|
||||
handle.className = `resize-handle ${direction}`;
|
||||
handle.style.position = 'absolute';
|
||||
handle.style.zIndex = '10';
|
||||
handle.style.position = "absolute";
|
||||
handle.style.zIndex = "10";
|
||||
|
||||
switch (direction) {
|
||||
case 'left':
|
||||
case 'right':
|
||||
handle.style.width = '6px';
|
||||
handle.style.height = '100%';
|
||||
handle.style.top = '0';
|
||||
handle.style.cursor = 'ew-resize';
|
||||
case "left":
|
||||
case "right":
|
||||
handle.style.width = "6px";
|
||||
handle.style.height = "100%";
|
||||
handle.style.top = "0";
|
||||
handle.style.cursor = "ew-resize";
|
||||
break;
|
||||
case 'top':
|
||||
case 'bottom':
|
||||
handle.style.width = '100%';
|
||||
handle.style.height = '6px';
|
||||
handle.style.left = '0';
|
||||
handle.style.cursor = 'ns-resize';
|
||||
case "top":
|
||||
case "bottom":
|
||||
handle.style.width = "100%";
|
||||
handle.style.height = "6px";
|
||||
handle.style.left = "0";
|
||||
handle.style.cursor = "ns-resize";
|
||||
break;
|
||||
case 'top-left':
|
||||
case 'top-right':
|
||||
case 'bottom-left':
|
||||
case 'bottom-right':
|
||||
handle.style.width = '10px';
|
||||
handle.style.height = '10px';
|
||||
handle.style.zIndex = '20';
|
||||
case "top-left":
|
||||
case "top-right":
|
||||
case "bottom-left":
|
||||
case "bottom-right":
|
||||
handle.style.width = "10px";
|
||||
handle.style.height = "10px";
|
||||
handle.style.zIndex = "20";
|
||||
break;
|
||||
}
|
||||
|
||||
switch (direction) {
|
||||
case 'left':
|
||||
handle.style.left = '0';
|
||||
case "left":
|
||||
handle.style.left = "0";
|
||||
break;
|
||||
case 'right':
|
||||
handle.style.right = '0';
|
||||
case "right":
|
||||
handle.style.right = "0";
|
||||
break;
|
||||
case 'top':
|
||||
handle.style.top = '0';
|
||||
case "top":
|
||||
handle.style.top = "0";
|
||||
break;
|
||||
case 'bottom':
|
||||
handle.style.bottom = '0';
|
||||
case "bottom":
|
||||
handle.style.bottom = "0";
|
||||
break;
|
||||
case 'top-left':
|
||||
handle.style.top = '0';
|
||||
handle.style.left = '0';
|
||||
handle.style.cursor = 'nw-resize';
|
||||
case "top-left":
|
||||
handle.style.top = "0";
|
||||
handle.style.left = "0";
|
||||
handle.style.cursor = "nw-resize";
|
||||
break;
|
||||
case 'top-right':
|
||||
handle.style.top = '0';
|
||||
handle.style.right = '0';
|
||||
handle.style.cursor = 'ne-resize';
|
||||
case "top-right":
|
||||
handle.style.top = "0";
|
||||
handle.style.right = "0";
|
||||
handle.style.cursor = "ne-resize";
|
||||
break;
|
||||
case 'bottom-left':
|
||||
handle.style.bottom = '0';
|
||||
handle.style.left = '0';
|
||||
handle.style.cursor = 'sw-resize';
|
||||
case "bottom-left":
|
||||
handle.style.bottom = "0";
|
||||
handle.style.left = "0";
|
||||
handle.style.cursor = "sw-resize";
|
||||
break;
|
||||
case 'bottom-right':
|
||||
handle.style.bottom = '0';
|
||||
handle.style.right = '0';
|
||||
handle.style.cursor = 'se-resize';
|
||||
case "bottom-right":
|
||||
handle.style.bottom = "0";
|
||||
handle.style.right = "0";
|
||||
handle.style.cursor = "se-resize";
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
// 防止拖拽手柄的事件冒泡到标题栏
|
||||
handle.addEventListener('mousedown', (e) => {
|
||||
handle.addEventListener("mousedown", (e) => {
|
||||
e.stopPropagation();
|
||||
|
||||
});
|
||||
|
||||
dialogEl.appendChild(handle);
|
||||
@@ -326,19 +371,19 @@ export default {
|
||||
|
||||
// 创建8个拖拽手柄
|
||||
const handles = {
|
||||
left: createHandle('left'),
|
||||
right: createHandle('right'),
|
||||
top: createHandle('top'),
|
||||
bottom: createHandle('bottom'),
|
||||
topLeft: createHandle('top-left'),
|
||||
topRight: createHandle('top-right'),
|
||||
bottomLeft: createHandle('bottom-left'),
|
||||
bottomRight: createHandle('bottom-right')
|
||||
left: createHandle("left"),
|
||||
right: createHandle("right"),
|
||||
top: createHandle("top"),
|
||||
bottom: createHandle("bottom"),
|
||||
topLeft: createHandle("top-left"),
|
||||
topRight: createHandle("top-right"),
|
||||
bottomLeft: createHandle("bottom-left"),
|
||||
bottomRight: createHandle("bottom-right"),
|
||||
};
|
||||
|
||||
// 添加拖拽事件处理
|
||||
let isResizing = false;
|
||||
let resizeDirection = '';
|
||||
let resizeDirection = "";
|
||||
let startX = 0;
|
||||
let startY = 0;
|
||||
let startWidth = 0;
|
||||
@@ -363,8 +408,8 @@ export default {
|
||||
startTop = parseInt(dialogEl.style.top) || 0;
|
||||
|
||||
// 添加全局事件监听
|
||||
document.addEventListener('mousemove', handleMouseMove);
|
||||
document.addEventListener('mouseup', stopResize);
|
||||
document.addEventListener("mousemove", handleMouseMove);
|
||||
document.addEventListener("mouseup", stopResize);
|
||||
};
|
||||
|
||||
const handleMouseMove = (event) => {
|
||||
@@ -376,71 +421,71 @@ export default {
|
||||
let newWidth, newHeight, newLeft, newTop;
|
||||
|
||||
switch (resizeDirection) {
|
||||
case 'right':
|
||||
case "right":
|
||||
newWidth = Math.max(400, startWidth + deltaX);
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
break;
|
||||
case 'left':
|
||||
case "left":
|
||||
newWidth = Math.max(400, startWidth - deltaX);
|
||||
newLeft = startLeft + startWidth - newWidth;
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.left = newLeft + 'px';
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
dialogEl.style.left = newLeft + "px";
|
||||
break;
|
||||
case 'bottom':
|
||||
case "bottom":
|
||||
newHeight = Math.max(600, startHeight + deltaY);
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
break;
|
||||
case 'top':
|
||||
case "top":
|
||||
// 当窗口高度达到最小值时，不再调整高度和位置
|
||||
if (startHeight - deltaY >= 600) {
|
||||
newHeight = startHeight - deltaY;
|
||||
newTop = startTop + deltaY;
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.top = newTop + 'px';
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
dialogEl.style.top = newTop + "px";
|
||||
}
|
||||
break;
|
||||
case 'bottom-right':
|
||||
case "bottom-right":
|
||||
newWidth = Math.max(400, startWidth + deltaX);
|
||||
newHeight = Math.max(600, startHeight + deltaY);
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
break;
|
||||
case 'bottom-left':
|
||||
case "bottom-left":
|
||||
newWidth = Math.max(400, startWidth - deltaX);
|
||||
newHeight = Math.max(600, startHeight + deltaY);
|
||||
newLeft = startLeft + startWidth - newWidth;
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.left = newLeft + 'px';
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
dialogEl.style.left = newLeft + "px";
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
break;
|
||||
case 'top-right':
|
||||
case "top-right":
|
||||
// 当窗口高度达到最小值时，不再调整高度和位置
|
||||
if (startHeight - deltaY >= 600) {
|
||||
newHeight = startHeight - deltaY;
|
||||
newTop = startTop + deltaY;
|
||||
newWidth = Math.max(400, startWidth + deltaX);
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.top = newTop + 'px';
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
dialogEl.style.top = newTop + "px";
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
}
|
||||
break;
|
||||
case 'top-left':
|
||||
case "top-left":
|
||||
// 当窗口高度达到最小值时，不再调整高度和位置
|
||||
if (startHeight - deltaY >= 600) {
|
||||
newHeight = startHeight - deltaY;
|
||||
newTop = startTop + deltaY;
|
||||
newWidth = Math.max(400, startWidth - deltaX);
|
||||
newLeft = startLeft + startWidth - newWidth;
|
||||
dialogEl.style.height = newHeight + 'px';
|
||||
dialogEl.style.top = newTop + 'px';
|
||||
dialogEl.style.width = newWidth + 'px';
|
||||
dialogEl.style.left = newLeft + 'px';
|
||||
dialogEl.style.height = newHeight + "px";
|
||||
dialogEl.style.top = newTop + "px";
|
||||
dialogEl.style.width = newWidth + "px";
|
||||
dialogEl.style.left = newLeft + "px";
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
let doc = document.querySelector('.welcome-message')
|
||||
let sendBox = document.querySelector('.input-area-wrapper');
|
||||
let doc = document.querySelector(".welcome-message");
|
||||
let sendBox = document.querySelector(".input-area-wrapper");
|
||||
// sendBox 的高度
|
||||
if (doc && sendBox) {
|
||||
doc.style.height = `calc(${dialogEl.style.height} - ${sendBox.offsetHeight}px - 120px)`;
|
||||
@@ -449,50 +494,71 @@ export default {
|
||||
|
||||
const stopResize = () => {
|
||||
isResizing = false;
|
||||
resizeDirection = '';
|
||||
resizeDirection = "";
|
||||
|
||||
// 保存当前尺寸和位置到 sessionStorage
|
||||
const currentSize = {
|
||||
width: parseInt(dialogEl.style.width),
|
||||
height: parseInt(dialogEl.style.height),
|
||||
left: parseInt(dialogEl.style.left),
|
||||
top: parseInt(dialogEl.style.top)
|
||||
top: parseInt(dialogEl.style.top),
|
||||
};
|
||||
sessionStorage.setItem('aiCallDialogSize', JSON.stringify(currentSize));
|
||||
sessionStorage.setItem(
|
||||
"aiCallDialogSize",
|
||||
JSON.stringify(currentSize)
|
||||
);
|
||||
|
||||
// 移除全局事件监听
|
||||
document.removeEventListener('mousemove', handleMouseMove);
|
||||
document.removeEventListener('mouseup', stopResize);
|
||||
document.removeEventListener("mousemove", handleMouseMove);
|
||||
document.removeEventListener("mouseup", stopResize);
|
||||
};
|
||||
|
||||
// 为每个手柄绑定事件
|
||||
handles.left.addEventListener('mousedown', (e) => startResize('left', e));
|
||||
handles.right.addEventListener('mousedown', (e) => startResize('right', e));
|
||||
handles.top.addEventListener('mousedown', (e) => startResize('top', e));
|
||||
handles.bottom.addEventListener('mousedown', (e) => startResize('bottom', e));
|
||||
handles.topLeft.addEventListener('mousedown', (e) => startResize('top-left', e));
|
||||
handles.topRight.addEventListener('mousedown', (e) => startResize('top-right', e));
|
||||
handles.bottomLeft.addEventListener('mousedown', (e) => startResize('bottom-left', e));
|
||||
handles.bottomRight.addEventListener('mousedown', (e) => startResize('bottom-right', e));
|
||||
handles.left.addEventListener("mousedown", (e) =>
|
||||
startResize("left", e)
|
||||
);
|
||||
handles.right.addEventListener("mousedown", (e) =>
|
||||
startResize("right", e)
|
||||
);
|
||||
handles.top.addEventListener("mousedown", (e) =>
|
||||
startResize("top", e)
|
||||
);
|
||||
handles.bottom.addEventListener("mousedown", (e) =>
|
||||
startResize("bottom", e)
|
||||
);
|
||||
handles.topLeft.addEventListener("mousedown", (e) =>
|
||||
startResize("top-left", e)
|
||||
);
|
||||
handles.topRight.addEventListener("mousedown", (e) =>
|
||||
startResize("top-right", e)
|
||||
);
|
||||
handles.bottomLeft.addEventListener("mousedown", (e) =>
|
||||
startResize("bottom-left", e)
|
||||
);
|
||||
handles.bottomRight.addEventListener("mousedown", (e) =>
|
||||
startResize("bottom-right", e)
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState('app', ['showAICallMinimized']),
|
||||
...mapState("app", ["showAICallMinimized"]),
|
||||
showMinimizedWindow() {
|
||||
// 只有在Vuex状态为true时才显示最小化窗口
|
||||
return this.showAICallMinimized;
|
||||
}
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogFullscreen: false,
|
||||
isLan: true,
|
||||
openImg,
|
||||
AIContent: '',
|
||||
AIContent: "",
|
||||
isLoading: false,
|
||||
windowState: 'maximized', // 'maximized' 或 'minimized'
|
||||
stopShow: false,
|
||||
sendShow: true,
|
||||
windowState: "maximized", // 'maximized' 或 'minimized'
|
||||
messageList: [
|
||||
{
|
||||
typing: true,
|
||||
@@ -501,14 +567,14 @@ export default {
|
||||
text: `<p><b>您好！我是京东方案例智能问答助手，随时为您服务。</b></p>
|
||||
<p>我可以帮您快速查找和解读平台内的各类案例内容。只需输入您想了解的问题或关键词，我会从案例库中精准匹配相关信息，并提供清晰的解答。每条回答都会附上来源链接，方便您随时查阅原始案例全文。</p>
|
||||
<p>我还会根据您的提问，智能推荐相关延伸问题，助您更高效地探索知识、解决问题。</p>
|
||||
<p>现在，欢迎随时向我提问，开启高效的知识查询体验吧！</p>`
|
||||
}
|
||||
<p>现在，欢迎随时向我提问，开启高效的知识查询体验吧！</p>`,
|
||||
},
|
||||
],
|
||||
suggestions: [],
|
||||
isAutoScroll: true, // 是否自动滚动
|
||||
// 添加一个标志位，用于标识组件是否已经初始化完成
|
||||
isComponentReady: false
|
||||
}
|
||||
isComponentReady: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 组件挂载完成后，标记为已准备就绪
|
||||
@@ -519,22 +585,24 @@ export default {
|
||||
watch: {
|
||||
dialogVisible: {
|
||||
handler(newVal) {
|
||||
console.log('dialogVisible发生变化');
|
||||
console.log("dialogVisible发生变化");
|
||||
console.log(newVal);
|
||||
console.log(this.windowState);
|
||||
if (newVal) {
|
||||
this.$nextTick(() => {
|
||||
// 获取对话框元素
|
||||
const dialogEl = document.querySelector('.case-expert-dialog .el-dialog');
|
||||
const dialogEl = document.querySelector(
|
||||
".case-expert-dialog .el-dialog"
|
||||
);
|
||||
if (dialogEl) {
|
||||
// 检查是否有保存的尺寸状态
|
||||
const savedSize = sessionStorage.getItem('aiCallDialogSize');
|
||||
const savedSize = sessionStorage.getItem("aiCallDialogSize");
|
||||
if (savedSize) {
|
||||
const { width, height, left, top } = JSON.parse(savedSize);
|
||||
dialogEl.style.width = width + 'px';
|
||||
dialogEl.style.height = height + 'px';
|
||||
dialogEl.style.left = left + 'px';
|
||||
dialogEl.style.top = top + 'px';
|
||||
dialogEl.style.width = width + "px";
|
||||
dialogEl.style.height = height + "px";
|
||||
dialogEl.style.left = left + "px";
|
||||
dialogEl.style.top = top + "px";
|
||||
}
|
||||
|
||||
// 检查是否有保存的位置状态
|
||||
@@ -546,11 +614,11 @@ export default {
|
||||
// }
|
||||
}
|
||||
|
||||
let doc = document.querySelector('.welcome-message')
|
||||
let sendBox = document.querySelector('.input-area-wrapper');
|
||||
let doc = document.querySelector(".welcome-message");
|
||||
let sendBox = document.querySelector(".input-area-wrapper");
|
||||
// 只有在没有保存的尺寸状态时才使用默认值
|
||||
if (doc && sendBox) {
|
||||
const savedSize = sessionStorage.getItem('aiCallDialogSize');
|
||||
const savedSize = sessionStorage.getItem("aiCallDialogSize");
|
||||
if (!savedSize) {
|
||||
doc.style.height = `calc(600px - ${sendBox.offsetHeight}px - 120px)`;
|
||||
} else {
|
||||
@@ -561,7 +629,7 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
immediate: true,
|
||||
},
|
||||
messageList: {
|
||||
handler() {
|
||||
@@ -572,23 +640,28 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onbigWindowClick() {
|
||||
console.log('放大');
|
||||
console.log("放大");
|
||||
// 保存当前非全屏状态的尺寸和位置（仅当当前不是全屏状态时）
|
||||
if (!this.dialogFullscreen) {
|
||||
const dialogEl = document.querySelector('.case-expert-dialog .el-dialog');
|
||||
const dialogEl = document.querySelector(
|
||||
".case-expert-dialog .el-dialog"
|
||||
);
|
||||
if (dialogEl) {
|
||||
const normalSize = {
|
||||
width: parseInt(dialogEl.style.width) || dialogEl.offsetWidth,
|
||||
height: parseInt(dialogEl.style.height) || dialogEl.offsetHeight,
|
||||
left: parseInt(dialogEl.style.left) || dialogEl.offsetLeft,
|
||||
top: parseInt(dialogEl.style.top) || dialogEl.offsetTop
|
||||
top: parseInt(dialogEl.style.top) || dialogEl.offsetTop,
|
||||
};
|
||||
sessionStorage.setItem('aiCallDialogNormalSize', JSON.stringify(normalSize));
|
||||
sessionStorage.setItem(
|
||||
"aiCallDialogNormalSize",
|
||||
JSON.stringify(normalSize)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -597,16 +670,18 @@ export default {
|
||||
|
||||
// 设置全屏尺寸和位置
|
||||
this.$nextTick(() => {
|
||||
const dialogEl = document.querySelector('.case-expert-dialog .el-dialog');
|
||||
const dialogEl = document.querySelector(
|
||||
".case-expert-dialog .el-dialog"
|
||||
);
|
||||
if (dialogEl) {
|
||||
dialogEl.style.width = '100vw';
|
||||
dialogEl.style.height = '100vh';
|
||||
dialogEl.style.left = '0px';
|
||||
dialogEl.style.top = '0px';
|
||||
dialogEl.style.width = "100vw";
|
||||
dialogEl.style.height = "100vh";
|
||||
dialogEl.style.left = "0px";
|
||||
dialogEl.style.top = "0px";
|
||||
|
||||
// 更新消息容器高度
|
||||
const messageContainer = document.querySelector('.welcome-message');
|
||||
const inputArea = document.querySelector('.input-area-wrapper');
|
||||
const messageContainer = document.querySelector(".welcome-message");
|
||||
const inputArea = document.querySelector(".input-area-wrapper");
|
||||
if (messageContainer && inputArea) {
|
||||
messageContainer.style.height = `calc(100vh - ${inputArea.offsetHeight}px - 120px)`;
|
||||
}
|
||||
@@ -614,45 +689,49 @@ export default {
|
||||
});
|
||||
},
|
||||
onRestoreWindowClick() {
|
||||
console.log('缩小');
|
||||
console.log("缩小");
|
||||
this.dialogFullscreen = false;
|
||||
|
||||
this.$nextTick(() => {
|
||||
const dialogEl = document.querySelector('.case-expert-dialog .el-dialog');
|
||||
const dialogEl = document.querySelector(
|
||||
".case-expert-dialog .el-dialog"
|
||||
);
|
||||
if (dialogEl) {
|
||||
// 从 sessionStorage 中获取保存的正常窗口尺寸和位置
|
||||
const savedNormalSize = sessionStorage.getItem('aiCallDialogNormalSize');
|
||||
const savedSize = sessionStorage.getItem('aiCallDialogSize');
|
||||
const savedPosition = sessionStorage.getItem('aiCallDialogPosition');
|
||||
const savedNormalSize = sessionStorage.getItem(
|
||||
"aiCallDialogNormalSize"
|
||||
);
|
||||
const savedSize = sessionStorage.getItem("aiCallDialogSize");
|
||||
const savedPosition = sessionStorage.getItem("aiCallDialogPosition");
|
||||
|
||||
if (savedNormalSize) {
|
||||
// 使用之前保存的正常尺寸
|
||||
const { width, height, left, top } = JSON.parse(savedNormalSize);
|
||||
dialogEl.style.width = width + 'px';
|
||||
dialogEl.style.height = height + 'px';
|
||||
dialogEl.style.left = left + 'px';
|
||||
dialogEl.style.top = top + 'px';
|
||||
dialogEl.style.width = width + "px";
|
||||
dialogEl.style.height = height + "px";
|
||||
dialogEl.style.left = left + "px";
|
||||
dialogEl.style.top = top + "px";
|
||||
} else if (savedSize) {
|
||||
// 回退到通用保存的尺寸
|
||||
const { width, height, left, top } = JSON.parse(savedSize);
|
||||
dialogEl.style.width = width + 'px';
|
||||
dialogEl.style.height = height + 'px';
|
||||
dialogEl.style.left = left + 'px';
|
||||
dialogEl.style.top = top + 'px';
|
||||
dialogEl.style.width = width + "px";
|
||||
dialogEl.style.height = height + "px";
|
||||
dialogEl.style.left = left + "px";
|
||||
dialogEl.style.top = top + "px";
|
||||
} else {
|
||||
// 如果没有保存的尺寸，则使用默认值
|
||||
dialogEl.style.width = '800px';
|
||||
dialogEl.style.height = '600px';
|
||||
dialogEl.style.left = (window.innerWidth - 800) / 2 + 'px';
|
||||
dialogEl.style.top = '100px';
|
||||
dialogEl.style.width = "800px";
|
||||
dialogEl.style.height = "600px";
|
||||
dialogEl.style.left = (window.innerWidth - 800) / 2 + "px";
|
||||
dialogEl.style.top = "100px";
|
||||
}
|
||||
|
||||
// 应用相应的消息容器高度
|
||||
this.$nextTick(() => {
|
||||
const messageContainer = document.querySelector('.welcome-message');
|
||||
const inputArea = document.querySelector('.input-area-wrapper');
|
||||
const messageContainer = document.querySelector(".welcome-message");
|
||||
const inputArea = document.querySelector(".input-area-wrapper");
|
||||
if (messageContainer && inputArea) {
|
||||
const dialogHeight = dialogEl.style.height || '600px';
|
||||
const dialogHeight = dialogEl.style.height || "600px";
|
||||
messageContainer.style.height = `calc(${dialogHeight} - ${inputArea.offsetHeight}px - 120px)`;
|
||||
}
|
||||
});
|
||||
@@ -662,33 +741,33 @@ onRestoreWindowClick(){
|
||||
|
||||
// / 关闭最小化窗口
|
||||
closeMinimizedWindow() {
|
||||
this.$store.commit('app/SET_SHOW_AI_CALL_MINIMIZED', false);
|
||||
this.$store.commit('app/SET_SHOW_AI_CALL', false);
|
||||
this.windowState = 'maximized';
|
||||
this.$store.commit("app/SET_SHOW_AI_CALL_MINIMIZED", false);
|
||||
this.$store.commit("app/SET_SHOW_AI_CALL", false);
|
||||
this.windowState = "maximized";
|
||||
},
|
||||
getMinWidow(vis) {
|
||||
// this.showAICallMinimized = vis
|
||||
this.windowState = 'minimized';
|
||||
this.windowState = "minimized";
|
||||
},
|
||||
onClose() {
|
||||
console.log('关闭弹窗')
|
||||
console.log("关闭弹窗");
|
||||
// 清除保存的状态
|
||||
sessionStorage.removeItem('aiCallDialogSize');
|
||||
sessionStorage.removeItem("aiCallDialogSize");
|
||||
// sessionStorage.removeItem('aiCallDialogPosition');
|
||||
this.$emit('close')
|
||||
this.dialogFullscreen=false
|
||||
this.$emit("close");
|
||||
this.dialogFullscreen = false;
|
||||
// 可以在这里执行其他逻辑
|
||||
},
|
||||
|
||||
minimizeWindow() {
|
||||
console.log(131);
|
||||
|
||||
this.windowState = 'minimized';
|
||||
this.$store.commit('app/SET_SHOW_AI_CALL_MINIMIZED', true);
|
||||
this.windowState = "minimized";
|
||||
this.$store.commit("app/SET_SHOW_AI_CALL_MINIMIZED", true);
|
||||
},
|
||||
|
||||
maximizeWindow() {
|
||||
this.windowState = 'maximized';
|
||||
this.windowState = "maximized";
|
||||
},
|
||||
|
||||
getLastUserMessage() {
|
||||
@@ -696,18 +775,20 @@ closeMinimizedWindow() {
|
||||
for (let i = this.messageList.length - 1; i >= 0; i--) {
|
||||
if (!this.messageList[i].isBot) {
|
||||
// 移除HTML标签只返回纯文本
|
||||
const tempDiv = document.createElement('div');
|
||||
const tempDiv = document.createElement("div");
|
||||
tempDiv.innerHTML = this.messageList[i].text;
|
||||
return tempDiv.textContent || tempDiv.innerText || '';
|
||||
return tempDiv.textContent || tempDiv.innerText || "";
|
||||
}
|
||||
}
|
||||
return '';
|
||||
return "";
|
||||
},
|
||||
|
||||
// 处理加载状态
|
||||
handleLoading(status) {
|
||||
console.log('handleLoading---'+status);
|
||||
console.log("handleLoading---" + status);
|
||||
this.isLoading = status;
|
||||
this.sendShow = !status;
|
||||
this.stopShow = status;
|
||||
},
|
||||
|
||||
// 更新消息
|
||||
@@ -716,16 +797,16 @@ closeMinimizedWindow() {
|
||||
// 这里不需要额外的操作
|
||||
},
|
||||
updateSuggestions(arr) {
|
||||
this.suggestions = arr
|
||||
this.suggestions = arr;
|
||||
},
|
||||
// 处理建议
|
||||
sendSuggestions(item) {
|
||||
// this.suggestions = []
|
||||
this.AIContent = item
|
||||
this.AIContent = item;
|
||||
setTimeout(() => {
|
||||
this.$refs.sendMessage.handleSend()
|
||||
this.AIContent = ''
|
||||
},500)
|
||||
this.$refs.sendMessage.handleSend();
|
||||
this.AIContent = "";
|
||||
}, 500);
|
||||
},
|
||||
startNewConversation() {
|
||||
// 重置对话时，先标记组件为未准备就绪状态
|
||||
@@ -738,10 +819,10 @@ closeMinimizedWindow() {
|
||||
text: `<p><b>您好！我是京东方案例智能问答助手，随时为您服务。</b></p>
|
||||
<p>我可以帮您快速查找和解读平台内的各类案例内容。只需输入您想了解的问题或关键词，我会从案例库中精准匹配相关信息，并提供清晰的解答。每条回答都会附上来源链接，方便您随时查阅原始案例全文。</p>
|
||||
<p>我还会根据您的提问，智能推荐相关延伸问题，助您更高效地探索知识、解决问题。</p>
|
||||
<p>现在，欢迎随时向我提问，开启高效的知识查询体验吧！</p>`
|
||||
}
|
||||
<p>现在，欢迎随时向我提问，开启高效的知识查询体验吧！</p>`,
|
||||
},
|
||||
];
|
||||
this.AIContent = '';
|
||||
this.AIContent = "";
|
||||
this.isLoading = false;
|
||||
|
||||
// 在下一个 tick 中重新标记为准备就绪
|
||||
@@ -754,7 +835,8 @@ closeMinimizedWindow() {
|
||||
handleScroll(event) {
|
||||
const element = event.target;
|
||||
// 判断是否滚动到底部
|
||||
const isAtBottom = element.scrollHeight - element.scrollTop <= element.clientHeight + 1;
|
||||
const isAtBottom =
|
||||
element.scrollHeight - element.scrollTop <= element.clientHeight + 1;
|
||||
|
||||
// 如果滚动到底部，则开启自动滚动
|
||||
// 如果离开底部，则关闭自动滚动
|
||||
@@ -764,7 +846,8 @@ closeMinimizedWindow() {
|
||||
// 滚动到底部
|
||||
scrollToBottom() {
|
||||
if (this.isAutoScroll && this.$refs.messageContainer) {
|
||||
this.$refs.messageContainer.scrollTop = this.$refs.messageContainer.scrollHeight;
|
||||
this.$refs.messageContainer.scrollTop =
|
||||
this.$refs.messageContainer.scrollHeight;
|
||||
}
|
||||
},
|
||||
|
||||
@@ -783,7 +866,10 @@ closeMinimizedWindow() {
|
||||
if (delta < 0 && element.scrollTop === 0) {
|
||||
// 向上滚动且已在顶部，阻止默认行为
|
||||
event.preventDefault();
|
||||
} else if (delta > 0 && element.scrollHeight - element.scrollTop <= element.clientHeight) {
|
||||
} else if (
|
||||
delta > 0 &&
|
||||
element.scrollHeight - element.scrollTop <= element.clientHeight
|
||||
) {
|
||||
// 向下滚动且已在底部，阻止默认行为
|
||||
event.preventDefault();
|
||||
} else {
|
||||
@@ -797,13 +883,13 @@ closeMinimizedWindow() {
|
||||
onMinimizedWindowClick() {
|
||||
// 当点击最小化窗口时，如果dialogVisible为false，则通过事件通知父组件显示对话框
|
||||
if (!this.dialogVisible) {
|
||||
this.$emit('restore');
|
||||
this.$emit("restore");
|
||||
}
|
||||
// 然后将窗口状态设置为最大化
|
||||
this.windowState = 'maximized';
|
||||
}
|
||||
}
|
||||
}
|
||||
this.windowState = "maximized";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@@ -857,7 +943,6 @@ closeMinimizedWindow() {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.message-suggestions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -966,7 +1051,9 @@ closeMinimizedWindow() {
|
||||
}
|
||||
|
||||
@keyframes loading {
|
||||
0%, 80%, 100% {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
transform: scale(0);
|
||||
}
|
||||
40% {
|
||||
|
||||
@@ -44,6 +44,7 @@
|
||||
<img :src="messageData.isLike == 1 ? require('@/assets/images/case/zan-yes.svg') : require('@/assets/images/case/zan.svg')"
|
||||
@click="toggleStar(1)" alt="zan" class="zan_img">
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" content="点踩" placement="bottom">
|
||||
<el-popover placement="bottom" trigger="manual" v-model="caiDialogShow">
|
||||
<div class="feedback-class">
|
||||
<span>反馈</span>
|
||||
@@ -58,11 +59,11 @@
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button style="margin-top: 10px;" type="primary" size="mini" @click="handleSure">确定</el-button>
|
||||
</div>
|
||||
<!-- 修改为根据 isLike 值判断状态，使用 == 而不是 === -->
|
||||
<img slot="reference"
|
||||
:src="messageData.isLike == -1 ? require('@/assets/images/case/cai-yes.svg') : require('@/assets/images/case/cai.svg')"
|
||||
@click="toggleStar(-1)" alt="cai" class="zan_img" style="margin-left:10px">
|
||||
</el-popover>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -195,6 +196,7 @@ export default {
|
||||
} else {
|
||||
newIsLike = type;
|
||||
if (type === -1) {
|
||||
this.feedbackText = ''
|
||||
this.caiDialogShow = true;
|
||||
} else {
|
||||
this.caiDialogShow = false;
|
||||
@@ -221,6 +223,10 @@ export default {
|
||||
},
|
||||
// 确定
|
||||
handleSure() {
|
||||
if(this.feedbackText == ''){
|
||||
this.$message({ type: "error", message: "请输入反馈内容"});
|
||||
return;
|
||||
}
|
||||
let params = {
|
||||
docId: this.messageData.docId,
|
||||
feedback: this.feedbackText
|
||||
|
||||
@@ -1,123 +1,245 @@
|
||||
<template>
|
||||
<div class="input-area">
|
||||
<el-input v-model="inputContent" type="textarea" class="input-placeholder" placeholder="有问题，尽管问"
|
||||
@keyup.enter.native.prevent="handleSend" :disabled="disabled" :autosize="{ minRows: 2, maxRows: 4 }"
|
||||
resize="none"></el-input>
|
||||
<el-input
|
||||
v-model="inputContent"
|
||||
type="textarea"
|
||||
class="input-placeholder"
|
||||
placeholder="有问题，尽管问"
|
||||
@keyup.enter.native.prevent="handleSend"
|
||||
:disabled="disabled"
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
resize="none"
|
||||
></el-input>
|
||||
<div class="action-buttons">
|
||||
<el-button type="primary" size="small" class="start-btn" @click="handleNewConversation">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
class="start-btn"
|
||||
@click="handleNewConversation"
|
||||
>
|
||||
+ 开启新对话
|
||||
</el-button>
|
||||
<el-button type="text" class="send-btn" @click="handleSend" :disabled="disabled">
|
||||
<el-button
|
||||
type="text"
|
||||
class="send-btn"
|
||||
@click="handleSend"
|
||||
v-if="sendShow"
|
||||
>
|
||||
<i class="el-icon-s-promotion"></i>
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
class="send-btn"
|
||||
@click="handleStop"
|
||||
v-if="stopShow"
|
||||
>
|
||||
<img class="stop" src="@/assets/images/case/stop.png" alt="" />
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { aiChat } from '@/api/boe/aiChat.js'
|
||||
import { aiChat } from "@/api/boe/aiChat.js";
|
||||
import apiCase from "@/api/modules/cases.js";
|
||||
|
||||
export default {
|
||||
name: 'SendMessage',
|
||||
name: "SendMessage",
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: "",
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
sendShow: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
stopShow: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
messageList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
default: () => [],
|
||||
},
|
||||
suggestions: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
inputContent: this.value,
|
||||
conversationId: '' // 会话ID
|
||||
}
|
||||
currentAbortController: null, // 添加abort controller引用
|
||||
isStopped: false, // 添加停止状态
|
||||
typingTimer: null, // 添加这一行
|
||||
thinkTypingTimer: null, // 添加这一行
|
||||
conversationId: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(newVal) {
|
||||
this.inputContent = newVal
|
||||
}
|
||||
this.inputContent = newVal;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getConversationId();
|
||||
},
|
||||
|
||||
methods: {
|
||||
getConversationId() {
|
||||
apiCase.initChat().then((res) => {
|
||||
if (res.status == 200) {
|
||||
const { result } = res;
|
||||
// console.log(result);
|
||||
this.conversationId = result;
|
||||
sessionStorage.setItem("conversationId", this.conversationId);
|
||||
}
|
||||
});
|
||||
},
|
||||
handleSend(event) {
|
||||
// 阻止事件的默认行为和冒泡
|
||||
if (event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
console.log('preventDefault');
|
||||
console.log("preventDefault");
|
||||
}
|
||||
console.log('handleSend');
|
||||
if (!this.inputContent.trim() || this.disabled) return
|
||||
console.log("handleSend");
|
||||
if (!this.inputContent.trim() || this.disabled) return;
|
||||
// 重置停止状态，确保可以正常发送新消息
|
||||
this.isStopped = false;
|
||||
|
||||
// 添加用户消息到列表
|
||||
const userMessage = {
|
||||
isBot: false,
|
||||
text: this.inputContent
|
||||
text: this.inputContent,
|
||||
};
|
||||
this.messageList.push(userMessage);
|
||||
|
||||
// 显示加载状态
|
||||
this.$emit('loading', true);
|
||||
this.$emit("loading", true);
|
||||
|
||||
// 调用AI聊天接口 (暂时注释掉SSE，使用模拟数据)
|
||||
this.callAIChat(this.inputContent);
|
||||
|
||||
// 清空输入框
|
||||
this.inputContent = ''
|
||||
this.inputContent = "";
|
||||
},
|
||||
handleStop() {
|
||||
console.log(this.accumulatedContent, "accumulatedContent");
|
||||
// 设置停止状态
|
||||
this.isStopped = true;
|
||||
// 清除打字机定时器
|
||||
if (this.typingTimer) {
|
||||
clearInterval(this.typingTimer);
|
||||
this.typingTimer = null;
|
||||
}
|
||||
|
||||
if (this.thinkTypingTimer) {
|
||||
clearInterval(this.thinkTypingTimer);
|
||||
this.thinkTypingTimer = null;
|
||||
}
|
||||
if (this.conversationId) {
|
||||
// const stopAbortController = new AbortController();
|
||||
fetch(
|
||||
`/systemapi/xboe/m/boe/case/ai/stop?conversationId=${this.conversationId}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
// signal: stopAbortController.signal,
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
if (response.ok) {
|
||||
console.log("成功发送停止请求"); // 通知父组件需要重新获取会话ID
|
||||
this.$emit("need-new-conversation-id");
|
||||
} else {
|
||||
console.error("停止请求失败:", response.status);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("停止请求出错:", error);
|
||||
});
|
||||
}
|
||||
// 终止当前正在进行的聊天请求
|
||||
if (this.currentAbortController) {
|
||||
this.currentAbortController.abort();
|
||||
}
|
||||
|
||||
// 立即发送加载完成事件，停止按钮状态切换
|
||||
this.$emit("loading", false);
|
||||
// 发送按钮状态更新事件
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: true,
|
||||
stopShow: false,
|
||||
});
|
||||
},
|
||||
|
||||
// 真实的SSE实现（暂时注释掉）
|
||||
callAIChat(question) {
|
||||
// 重置停止状态
|
||||
this.isStopped = false;
|
||||
// 开始请求时显示加载状态
|
||||
this.$emit("loading", true);
|
||||
// 创建AbortController实例
|
||||
this.currentAbortController = new AbortController();
|
||||
|
||||
// 创建新的AI消息对象
|
||||
const aiMessage = {
|
||||
docId: '',
|
||||
docId: "",
|
||||
isBot: true,
|
||||
text: '',
|
||||
text: "",
|
||||
status: null,
|
||||
thinkText: '',
|
||||
thinkText: "",
|
||||
caseRefers: [], // 添加caseRefers字段
|
||||
textCompleted: false // 添加文字处理完成状态，默认为false
|
||||
textCompleted: false, // 添加文字处理完成状态，默认为false
|
||||
};
|
||||
this.messageList.push(aiMessage);
|
||||
let hasFinished = false; // 新增
|
||||
|
||||
// 构造请求参数
|
||||
const requestData = {
|
||||
conversationId: this.conversationId,
|
||||
query: question
|
||||
query: question,
|
||||
};
|
||||
// 创建POST请求
|
||||
fetch('/systemapi/xboe/m/boe/case/ai/chat', {
|
||||
method: 'POST',
|
||||
fetch("/systemapi/xboe/m/boe/case/ai/chat", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
"accept": "text/event-stream",
|
||||
"Content-Type": "application/json",
|
||||
accept: "text/event-stream",
|
||||
},
|
||||
body: JSON.stringify(requestData)
|
||||
}).then(r => {
|
||||
return r
|
||||
}).then(response => {
|
||||
body: JSON.stringify(requestData),
|
||||
signal: this.currentAbortController.signal, // 添加signal
|
||||
})
|
||||
.then((r) => {
|
||||
return r;
|
||||
})
|
||||
.then((response) => {
|
||||
// 处理流式响应
|
||||
const reader = response.body.getReader();
|
||||
const decoder = new TextDecoder('utf-8');
|
||||
let buffer = '';
|
||||
let accumulatedContent = ''; // 累积的内容用于打字机效果
|
||||
let accumulatedThinkContent = ''; // 累积的思考内容
|
||||
const decoder = new TextDecoder("utf-8");
|
||||
let buffer = "";
|
||||
let accumulatedContent = ""; // 累积的内容用于打字机效果
|
||||
let accumulatedThinkContent = ""; // 累积的思考内容
|
||||
let inThinkSection = false; // 是否在思考部分
|
||||
let typingTimer = null; // 打字机定时器
|
||||
let thinkTypingTimer = null; // 思考内容打字机定时器
|
||||
|
||||
// 逐字显示文本的函数
|
||||
const typeText = (message, fullContent) => {
|
||||
// 如果已经停止，则直接显示全部内容
|
||||
if (this.isStopped) {
|
||||
message.text = fullContent;
|
||||
this.$emit("update-message", message);
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果已有定时器在运行，先清除它
|
||||
if (typingTimer) {
|
||||
clearInterval(typingTimer);
|
||||
@@ -136,11 +258,19 @@ export default {
|
||||
const typingSpeed = 30; // 每个字符的间隔时间（毫秒）
|
||||
|
||||
typingTimer = setInterval(() => {
|
||||
// 如果已停止，立即停止渲染并保持当前内容
|
||||
if (this.isStopped) {
|
||||
clearInterval(typingTimer);
|
||||
typingTimer = null;
|
||||
// 保持当前已渲染的内容，不显示剩余内容
|
||||
this.$emit("update-message", message);
|
||||
return;
|
||||
}
|
||||
// 计算下一个要显示的字符索引
|
||||
const nextIndex = message.text.length + 1;
|
||||
if (nextIndex <= targetLength) {
|
||||
message.text = fullContent.substring(0, nextIndex);
|
||||
this.$emit('update-message', message);
|
||||
this.$emit("update-message", message);
|
||||
} else {
|
||||
clearInterval(typingTimer);
|
||||
typingTimer = null;
|
||||
@@ -157,6 +287,17 @@ export default {
|
||||
|
||||
// 逐字显示思考内容的函数
|
||||
const typeThinkText = (message, fullThinkContent) => {
|
||||
// 如果已经停止，则直接显示当前已渲染的内容并清理定时器
|
||||
if (this.isStopped) {
|
||||
// 清理可能存在的定时器
|
||||
if (thinkTypingTimer) {
|
||||
clearInterval(thinkTypingTimer);
|
||||
thinkTypingTimer = null;
|
||||
}
|
||||
// 保持当前已渲染的内容，不显示完整内容
|
||||
this.$emit("update-message", message);
|
||||
return;
|
||||
}
|
||||
// 如果已有定时器在运行，先清除它
|
||||
if (thinkTypingTimer) {
|
||||
clearInterval(thinkTypingTimer);
|
||||
@@ -178,11 +319,19 @@ export default {
|
||||
const typingSpeed = 20; // 每个字符的间隔时间（毫秒）
|
||||
|
||||
thinkTypingTimer = setInterval(() => {
|
||||
// 如果已停止，立即停止渲染并保持当前内容
|
||||
if (this.isStopped) {
|
||||
clearInterval(thinkTypingTimer);
|
||||
thinkTypingTimer = null;
|
||||
// 保持当前已渲染的内容，不显示剩余内容
|
||||
this.$emit("update-message", message);
|
||||
return;
|
||||
}
|
||||
// 计算下一个要显示的字符索引
|
||||
const nextIndex = message.thinkText.length + 1;
|
||||
if (nextIndex <= targetLength) {
|
||||
message.thinkText = fullThinkContent.substring(0, nextIndex);
|
||||
this.$emit('update-message', message);
|
||||
this.$emit("update-message", message);
|
||||
} else {
|
||||
clearInterval(thinkTypingTimer);
|
||||
thinkTypingTimer = null;
|
||||
@@ -197,12 +346,26 @@ export default {
|
||||
|
||||
// 读取流数据
|
||||
const read = () => {
|
||||
reader.read().then(({ done, value }) => {
|
||||
// 如果已停止，直接返回
|
||||
if (this.isStopped || hasFinished) {
|
||||
this.$emit("loading", false);
|
||||
return;
|
||||
}
|
||||
|
||||
reader
|
||||
.read()
|
||||
.then(({ done, value }) => {
|
||||
// 如果已停止，直接返回
|
||||
if (this.isStopped || hasFinished) {
|
||||
this.$emit("loading", false);
|
||||
return;
|
||||
}
|
||||
|
||||
if (done) {
|
||||
// 当流结束时，等待打字机效果完成
|
||||
const waitForTyping = () => {
|
||||
if (!typingTimer) {
|
||||
this.$emit('loading', false);
|
||||
this.$emit("loading", false);
|
||||
} else {
|
||||
setTimeout(waitForTyping, 100);
|
||||
}
|
||||
@@ -215,42 +378,61 @@ export default {
|
||||
buffer += decoder.decode(value, { stream: true });
|
||||
|
||||
// 按行分割数据
|
||||
const lines = buffer.split('\n');
|
||||
const lines = buffer.split("\n");
|
||||
buffer = lines.pop(); // 保留不完整的行
|
||||
|
||||
for (const line of lines) {
|
||||
if (line.startsWith('data:')) {
|
||||
// 如果已停止，跳出循环
|
||||
if (this.isStopped) {
|
||||
this.$emit("loading", false);
|
||||
return;
|
||||
}
|
||||
if (line.startsWith("data:")) {
|
||||
try {
|
||||
const jsonData = JSON.parse(line.substring(5));
|
||||
// 根据status处理不同类型的数据
|
||||
switch (jsonData.status) {
|
||||
case 0: // 引用文件
|
||||
// 处理引用文件信息
|
||||
if (jsonData.fileRefer && jsonData.fileRefer.caseRefers) {
|
||||
aiMessage.caseRefers = jsonData.fileRefer.caseRefers;
|
||||
if (
|
||||
jsonData.fileRefer &&
|
||||
jsonData.fileRefer.caseRefers
|
||||
) {
|
||||
aiMessage.caseRefers =
|
||||
jsonData.fileRefer.caseRefers;
|
||||
// 更新父组件的messageList
|
||||
this.$emit('update-message', aiMessage);
|
||||
this.$emit("update-message", aiMessage);
|
||||
}
|
||||
// 从响应中获取并保存conversationId
|
||||
if (jsonData.conversationId) {
|
||||
this.conversationId = jsonData.conversationId;
|
||||
sessionStorage.setItem('conversationId', jsonData.conversationId);
|
||||
}
|
||||
// if (jsonData.conversationId) {
|
||||
// this.conversationId = jsonData.conversationId;
|
||||
// sessionStorage.setItem(
|
||||
// "conversationId",
|
||||
// jsonData.conversationId
|
||||
// );
|
||||
// }
|
||||
break;
|
||||
|
||||
case 1: // 流式对话内容
|
||||
if (!this.isStopped) {
|
||||
// 处理
|
||||
const content = jsonData.content;
|
||||
aiMessage.hasThink = false;
|
||||
if (content.startsWith('<think>')) {
|
||||
aiMessage.hasThink = true
|
||||
if (content.startsWith("<think>")) {
|
||||
aiMessage.hasThink = true;
|
||||
inThinkSection = true;
|
||||
accumulatedThinkContent = content.replace('<think>', '');
|
||||
accumulatedThinkContent = content.replace(
|
||||
"<think>",
|
||||
""
|
||||
);
|
||||
// 使用打字机效果显示think内容
|
||||
typeThinkText(aiMessage, accumulatedThinkContent);
|
||||
} else if (content.startsWith('</think>')) {
|
||||
} else if (content.startsWith("</think>")) {
|
||||
inThinkSection = false;
|
||||
accumulatedThinkContent += content.replace('</think>', '');
|
||||
accumulatedThinkContent += content.replace(
|
||||
"</think>",
|
||||
""
|
||||
);
|
||||
// 使用打字机效果显示think内容
|
||||
typeThinkText(aiMessage, accumulatedThinkContent);
|
||||
} else if (inThinkSection) {
|
||||
@@ -262,13 +444,21 @@ export default {
|
||||
accumulatedContent += content;
|
||||
// 如果thinkText已经显示完整，则继续使用打字机效果显示内容
|
||||
if (aiMessage.hasThink) {
|
||||
if (aiMessage.thinkText.length >= accumulatedThinkContent.length) {
|
||||
if (
|
||||
aiMessage.thinkText.length >=
|
||||
accumulatedThinkContent.length
|
||||
) {
|
||||
typeText(aiMessage, accumulatedContent);
|
||||
}
|
||||
} else {
|
||||
typeText(aiMessage, accumulatedContent);
|
||||
}
|
||||
|
||||
}
|
||||
// 发送事件更新按钮状态：显示停止按钮
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: false,
|
||||
stopShow: true,
|
||||
});
|
||||
}
|
||||
// 不在这里直接更新，让打字机效果处理更新
|
||||
break;
|
||||
@@ -276,88 +466,153 @@ export default {
|
||||
case 2: // 回答完成
|
||||
// 不再在这里设置textCompleted状态
|
||||
// 更新父组件的messageList
|
||||
this.$emit('update-message', aiMessage);
|
||||
// 只有在未停止状态下才更新
|
||||
if (!this.isStopped) {
|
||||
// 更新父组件的messageList
|
||||
this.$emit("update-message", aiMessage);
|
||||
// 发送事件更新按钮状态：显示停止按钮
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: false,
|
||||
stopShow: true,
|
||||
});
|
||||
}
|
||||
// 从响应中获取并保存conversationId
|
||||
|
||||
break;
|
||||
|
||||
case 3: // 返回建议
|
||||
// 只有在未停止状态下才处理建议
|
||||
if (!this.isStopped) {
|
||||
// 这里可以处理建议问题
|
||||
this.$emit('update-suggestions', jsonData.suggestions);
|
||||
this.$emit(
|
||||
"update-suggestions",
|
||||
jsonData.suggestions
|
||||
);
|
||||
// 发送事件更新按钮状态：显示停止按钮
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: false,
|
||||
stopShow: true,
|
||||
});
|
||||
}
|
||||
break;
|
||||
|
||||
case 4: // 交互完成
|
||||
aiMessage.status = 4
|
||||
// 只有在未停止状态下才处理完成状态
|
||||
if (!this.isStopped) {
|
||||
aiMessage.status = 4;
|
||||
|
||||
// 从响应中获取并保存conversationId
|
||||
this.$emit('loading', false);
|
||||
// this.$emit("loading", false);
|
||||
// 检查文本是否已经完全显示，如果是则设置textCompleted为true
|
||||
if (isTextDisplayCompleted(aiMessage, accumulatedContent)) {
|
||||
if (
|
||||
isTextDisplayCompleted(
|
||||
aiMessage,
|
||||
accumulatedContent
|
||||
)
|
||||
) {
|
||||
// aiMessage.textCompleted = true;
|
||||
this.$emit('update-message', aiMessage);
|
||||
this.$emit("update-message", aiMessage);
|
||||
// 发送事件更新按钮状态：显示发送按钮
|
||||
hasFinished = true; // 标记完成
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: true,
|
||||
stopShow: false,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
|
||||
case 9:
|
||||
if (jsonData.docId) {
|
||||
aiMessage.docId = jsonData.docId
|
||||
this.$emit('update-message', aiMessage);
|
||||
// 只有在未停止状态下才处理docId
|
||||
if (!this.isStopped && jsonData.docId) {
|
||||
aiMessage.docId = jsonData.docId;
|
||||
this.$emit("update-message", aiMessage);
|
||||
}
|
||||
console.log(jsonData)
|
||||
break
|
||||
// 显示发送按钮，隐藏停止按钮
|
||||
// this.$emit("loading", false);
|
||||
console.log(jsonData);
|
||||
// 发送事件更新按钮状态：显示发送按钮
|
||||
hasFinished = true; // 标记完成
|
||||
this.$emit("update-button-state", {
|
||||
sendShow: true,
|
||||
stopShow: false,
|
||||
});
|
||||
break;
|
||||
default:
|
||||
if (jsonData.docId) {
|
||||
aiMessage.docId = jsonData.docId
|
||||
this.$emit('update-message', aiMessage);
|
||||
if (!this.isStopped && jsonData.docId) {
|
||||
aiMessage.docId = jsonData.docId;
|
||||
this.$emit("update-message", aiMessage);
|
||||
}
|
||||
break
|
||||
|
||||
|
||||
|
||||
break;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('解析SSE数据错误:', error);
|
||||
console.error("解析SSE数据错误:", error);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 继续读取
|
||||
// 继续读取（除非已停止）
|
||||
if (!this.isStopped) {
|
||||
read();
|
||||
}).catch(error => {
|
||||
console.error('SSE连接错误:', error);
|
||||
}
|
||||
// 继续读取
|
||||
// read();
|
||||
})
|
||||
.catch((error) => {
|
||||
// 处理AbortError
|
||||
if (error.name === "AbortError") {
|
||||
console.log("请求已被用户取消");
|
||||
// aiMessage.text = "请求已被取消";
|
||||
aiMessage.textCompleted = true;
|
||||
this.$emit("update-message", aiMessage);
|
||||
} else {
|
||||
console.error("SSE连接错误:", error);
|
||||
// 出错时也设置文字处理完成状态
|
||||
if (typingTimer) {
|
||||
clearInterval(typingTimer);
|
||||
typingTimer = null;
|
||||
}
|
||||
aiMessage.textCompleted = true;
|
||||
this.$emit('loading', false);
|
||||
aiMessage.text = '当前无法获取回答，请稍后重试';
|
||||
aiMessage.text = "当前无法获取回答，请稍后重试";
|
||||
// 更新父组件的messageList
|
||||
this.$emit('update-message', aiMessage);
|
||||
this.$emit("update-message", aiMessage);
|
||||
}
|
||||
this.$emit("loading", false);
|
||||
});
|
||||
};
|
||||
|
||||
// 开始读取数据
|
||||
// 继续读取（除非已停止）
|
||||
if (!this.isStopped) {
|
||||
read();
|
||||
}).catch(error => {
|
||||
console.error('请求失败:', error);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// 处理AbortError
|
||||
if (error.name === "AbortError") {
|
||||
console.log("请求已被用户取消");
|
||||
aiMessage.text = "请求已被取消";
|
||||
aiMessage.textCompleted = true;
|
||||
this.$emit("update-message", aiMessage);
|
||||
} else {
|
||||
console.error("请求失败:", error);
|
||||
// 出错时也设置文字处理完成状态
|
||||
aiMessage.textCompleted = true;
|
||||
this.$emit('loading', false);
|
||||
aiMessage.text = '当前无法获取回答，请稍后重试';
|
||||
aiMessage.text = "当前无法获取回答，请稍后重试";
|
||||
// 更新父组件的messageList
|
||||
this.$emit('update-message', aiMessage);
|
||||
this.$emit("update-message", aiMessage);
|
||||
}
|
||||
// 只有在非停止状态下才发送 loading 事件
|
||||
if (!this.isStopped) {
|
||||
this.$emit("loading", false);
|
||||
}
|
||||
});
|
||||
},
|
||||
handleNewConversation() {
|
||||
this.conversationId = ''
|
||||
this.$emit('new-conversation')
|
||||
}
|
||||
}
|
||||
}
|
||||
// this.conversationId = "";
|
||||
this.$emit("new-conversation");
|
||||
this.getConversationId();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.input-area {
|
||||
background-color: white;
|
||||
@@ -405,5 +660,10 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.stop {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user