|
@@ -1,10 +1,6 @@
|
|
|
<template>
|
|
|
<div class="ai_body" v-loading="loading">
|
|
|
- <div
|
|
|
- class="ai_body_dialog"
|
|
|
-
|
|
|
- ref="chatDialog"
|
|
|
- >
|
|
|
+ <div class="ai_body_dialog" ref="chatDialog">
|
|
|
<div class="dialog_content" v-for="item in array" :key="item.uid">
|
|
|
<div v-if="item.content" style="margin-left: auto;">
|
|
|
<div class="content content2" v-html="item.content"></div>
|
|
@@ -14,7 +10,7 @@
|
|
|
</div>
|
|
|
<div style="margin-top:20px;margin-bottom:20px ; margin-right: auto;">
|
|
|
<div class="role">
|
|
|
- <img src="../../../assets/icon/new/role1.png" />
|
|
|
+ <img :src="item.fileid?item.fileid:require('../../../assets/icon/new/role1.png')" />
|
|
|
</div>
|
|
|
<div
|
|
|
element-loading-background="#f6f9ff"
|
|
@@ -24,7 +20,10 @@
|
|
|
}"
|
|
|
class="content"
|
|
|
v-loading="item.loading"
|
|
|
- ><span v-html="item.aiContent"></span><span class="createTime" v-text="item.createtime"></span></div>
|
|
|
+ >
|
|
|
+ <span v-html="item.aiContent"></span
|
|
|
+ ><span class="createTime" v-text="item.createtime"></span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -130,6 +129,47 @@
|
|
|
<span>清屏</span>
|
|
|
</span>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ class="ai_b_i_roleListBox"
|
|
|
+ ref="roleListRef"
|
|
|
+ v-if="showRoleList && choseRoleList.length > 0"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ :class="[
|
|
|
+ 'ai_b_i_rlb_item',
|
|
|
+ index == choseRoleItem ? 'ai_b_i_rlb_itemActive' : ''
|
|
|
+ ]"
|
|
|
+ :ref="`roleItem${index}Ref`"
|
|
|
+ v-for="(item, index) in choseRoleList"
|
|
|
+ :key="item.id"
|
|
|
+ @mouseover="choseRoleItem = index"
|
|
|
+ @click.stop="choseRole(item)"
|
|
|
+ >
|
|
|
+ <div class="ai_b_i_rlb_itemTop">
|
|
|
+ <img
|
|
|
+ :src="
|
|
|
+ item.headUrl
|
|
|
+ ? item.headUrl
|
|
|
+ : require('../../../assets/icon/new/role1.png')
|
|
|
+ "
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ <div class="ai_b_i_rlb_i_name">
|
|
|
+ <span>{{ item.assistantName }}</span>
|
|
|
+ <span>作者:{{ item.username }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="ai_b_i_rlb_itemBottom">
|
|
|
+ {{ item.prologue }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- <div class="ai_b_i_textListBox">
|
|
|
+ <div class="ai_b_i_tlb_left"></div>
|
|
|
+ <div class="ai_b_i_tlb_right"></div>
|
|
|
+ </div> -->
|
|
|
<textarea
|
|
|
class="ai_body_input_textarea"
|
|
|
@input="inputChange"
|
|
@@ -138,7 +178,14 @@
|
|
|
v-model.trim="courseText"
|
|
|
placeholder="在此输入您想了解的内容"
|
|
|
></textarea>
|
|
|
- <div class="c_pub_button_confirm" v-if="!loading" @click="addContent">
|
|
|
+ <div
|
|
|
+ :class="[
|
|
|
+ 'c_pub_button_confirm',
|
|
|
+ courseText ? '' : 'c_pub_button_confirmDisabled'
|
|
|
+ ]"
|
|
|
+ v-if="!loading"
|
|
|
+ @click="addContent"
|
|
|
+ >
|
|
|
发送
|
|
|
</div>
|
|
|
</div>
|
|
@@ -186,6 +233,8 @@ export default {
|
|
|
checkImg: checkImg,
|
|
|
checkIsImg: checkIsImg,
|
|
|
userid: this.$route.query.userid,
|
|
|
+ oid: this.$route.query.oid,
|
|
|
+ org: this.$route.query.org,
|
|
|
checkArray: [],
|
|
|
course: [{ title: "任务1" }, { title: "任务2" }, { title: "任务3" }],
|
|
|
partArray: [
|
|
@@ -196,7 +245,37 @@ export default {
|
|
|
part: "全部内容",
|
|
|
checkBool: false,
|
|
|
loading: false,
|
|
|
- textareaHeight: 50
|
|
|
+ textareaHeight: 50,
|
|
|
+ publicRoleList: [],
|
|
|
+ roleList: [],
|
|
|
+ textList:[
|
|
|
+ {
|
|
|
+ title:"项目式学习",
|
|
|
+ dataList:['请给我一些学生开展项目式学习可以使用的主题或问题参考,请说出学生将要解决的问题,以及学生要经历怎样的学习活动。','请将一个关于生态保护项目的项目式学习展开描述,你需要描述学生如何解决这个问题,你需要至少写出四个活动,这些活动需要按照前后逻辑关系排列。','请对驱动问题为“如何为学校建造一个富有特色的花坛?”的项目式学习进行子问题拆解,至少拆解为5个子问题,并根据子问题对应写出各环节的主要活动。']
|
|
|
+ },{
|
|
|
+ title:"教学评价",
|
|
|
+ dataList:['如果需要给学生的社区服务进行评价,给出评价维度和至少3个等级的表现描述。','为6年级学生设计一份关于梧桐山研究报告的评估任务表,并给出参考的报告流程,至少包含8个步骤,并包括地图、图片和至少300个词。','创建一个给5年级学生使用的课堂小测试,包含5道多选题,评价学生对于太阳能这个概念的理解。你需要给出题目和正确答案。']
|
|
|
+ },{
|
|
|
+ title:"教学设计",
|
|
|
+ dataList:['如果需要5年级学生感受“移步换景”的景观写作手法,你有什么合适的阅读材料推荐?你需要给出材料名称,以及材料的哪部分内容。','设计一个针对8年级学生且关于人类迁徙主题的地理课,并在课程中设计至少1项小组活动。','设计一个针对5年级学生的课程,课程综合科学和信息技术领域,解决生物与环境领域的生活问题,你需要给出完整的课程框架和活动。','如果3年级的学生不能理解光合作用的实现过程,需要你帮我设计一个支持他们理解的教学活动,需要包含活动的形式、实施材料和清单。','请基于贝叶斯定理为8年级学生出三道题目。','如果需要八年级学生了解尼罗河流域的文化发展史,你有哪些推荐的网站或参考书籍?']
|
|
|
+ },{
|
|
|
+ title:"班级管理",
|
|
|
+ dataList:['创建一组给一年级学生使用的班级口号,要求大家注意卫生、保护环境,口号需要对仗工整,符合一年级学生的理解水平。',' 设计一套用于6年级学生的班级管理规章制度,内容需要包括学习、纪律、卫生、思想品德方面。']
|
|
|
+ },{
|
|
|
+ title:"课堂组织",
|
|
|
+ dataList:['请为“制作垃圾分类宣传单”的小组活动设计小组分工表,每个小组的成员为4-6人。','请给5年级“校园植物图鉴”社团课程设计一份小组合作公约,需包含小组成员信息、小组项目目标、填写日期,总长度不超过300字,并且提供至少3处学生自行填写的部分。','请用苏格拉底提问的方式,引导5年级学生拆解驱动问题:如何解决教室黑板反光的问题?其中需包含对于反光原因的分析与实验探究。']
|
|
|
+ },{
|
|
|
+ title:"教师发展",
|
|
|
+ dataList:['教师需要理解项目式学习的理论基础和基础概念,你需要生成一份阅读清单,要求内容为中文书籍或文献。','设计一个教师进行个人学期总结的框架,需要体现在教学、教研、个人学习方面的进步。']
|
|
|
+ },{
|
|
|
+ title:"代码分析",
|
|
|
+ dataList:['这段代码实现了什么效果?','请描述这段代码。','根据这段代码,给我一些修改意见。']
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ showTextList:false,
|
|
|
+ showRoleList: false,
|
|
|
+ choseRoleItem: 0,
|
|
|
+ choseTextItem:0,
|
|
|
};
|
|
|
},
|
|
|
watch: {
|
|
@@ -273,59 +352,154 @@ export default {
|
|
|
`;
|
|
|
message = msg;
|
|
|
}
|
|
|
- let _uuid = uuidv4();
|
|
|
- this.array.push({
|
|
|
- role: "user",
|
|
|
- content: `${this.courseText}`,
|
|
|
- uid: _uuid,
|
|
|
- AI: "AI",
|
|
|
- aiContent: "",
|
|
|
- oldContent: "",
|
|
|
- isShowSynchronization: false,
|
|
|
- filename: "",
|
|
|
- index: this.array.length,
|
|
|
- is_mind_map: false,
|
|
|
- createtime: new Date().toLocaleString().replaceAll("/", "-"),
|
|
|
- loading: true
|
|
|
- });
|
|
|
|
|
|
- let history = [];
|
|
|
- this.array.forEach(i => {
|
|
|
- if (i.content) history.push({ role: "user", content: i.content });
|
|
|
- if (i.aiContent)
|
|
|
- history.push({ role: "assistant", content: i.aiContent });
|
|
|
+ // 这里处理@的角色
|
|
|
+ let _atRoleList = [];
|
|
|
+ let _roleList = [...this.roleList, ...this.publicRoleList];
|
|
|
+ _roleList.forEach(i => {
|
|
|
+ if (message.indexOf(`@${i.assistantName}`) != -1) {
|
|
|
+ _atRoleList.push(i);
|
|
|
+ }
|
|
|
});
|
|
|
|
|
|
- history.push({ role: "user", content: message });
|
|
|
- this.$nextTick(() => {
|
|
|
- this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
- });
|
|
|
- let params = JSON.stringify({
|
|
|
- // model: "gpt-3.5-turbo",
|
|
|
- model: "gpt-4o-2024-08-06",
|
|
|
- temperature: 0,
|
|
|
- max_tokens: 4096,
|
|
|
- top_p: 1,
|
|
|
- frequency_penalty: 0,
|
|
|
- presence_penalty: 0,
|
|
|
- messages: history,
|
|
|
- uid: _uuid,
|
|
|
- mind_map_question: ""
|
|
|
- });
|
|
|
- this.courseText = "";
|
|
|
+ if (_atRoleList.length > 0) {
|
|
|
+ //有@角色
|
|
|
+ let _replaceText = message;
|
|
|
+ let _htmlText = message;
|
|
|
+ _atRoleList.forEach(_i => {
|
|
|
+ _replaceText = _replaceText.replaceAll(`@${_i.assistantName}`, ``);
|
|
|
+ _htmlText = _htmlText.replaceAll(
|
|
|
+ `@${_i.assistantName}`,
|
|
|
+ `<span class='aite-name'>@${_i.assistantName}</span>`
|
|
|
+ );
|
|
|
+ });
|
|
|
|
|
|
- this.ajax
|
|
|
- .post("https://gpt4.cocorobo.cn/chat", params)
|
|
|
- .then(res => {
|
|
|
- if (res.data.FunctionResponse.result == "发送成功") {
|
|
|
+ _atRoleList.forEach((_item, _index) => {
|
|
|
+ const _uid = uuidv4();
|
|
|
+ if (_index == 0) {
|
|
|
+ this.array.push({
|
|
|
+ loading: true,
|
|
|
+ role: "user",
|
|
|
+ content: _htmlText,
|
|
|
+ uid: _uid,
|
|
|
+ AI: "AI",
|
|
|
+ aiContent: "",
|
|
|
+ oldContent: "",
|
|
|
+ isShowSynchronization: false,
|
|
|
+ filename: _item.assistantName,
|
|
|
+ index: this.array.length,
|
|
|
+ is_mind_map: false,
|
|
|
+ fileid: _item.headUrl,
|
|
|
+ createtime: new Date().toLocaleString().replaceAll("/", "-")
|
|
|
+ });
|
|
|
} else {
|
|
|
- this.$message.warning(res.data.FunctionResponse.result);
|
|
|
+ this.array.push({
|
|
|
+ loading: true,
|
|
|
+ role: "user",
|
|
|
+ content: "",
|
|
|
+ uid: _uid,
|
|
|
+ AI: "AI",
|
|
|
+ aiContent: "",
|
|
|
+ oldContent: "",
|
|
|
+ isShowSynchronization: false,
|
|
|
+ filename: _item.assistantName,
|
|
|
+ index: this.array.length,
|
|
|
+ is_mind_map: false,
|
|
|
+ fileid: _item.headUrl,
|
|
|
+ createtime: new Date().toLocaleString().replaceAll("/", "-")
|
|
|
+ });
|
|
|
}
|
|
|
- })
|
|
|
- .catch(e => {
|
|
|
- console.log(e);
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
+ });
|
|
|
+
|
|
|
+ let params = {
|
|
|
+ assistant_id: _item.assistant_id,
|
|
|
+ userId: this.userid,
|
|
|
+ message: _replaceText,
|
|
|
+ session_name: `${this.courseId}-addCourseA`,
|
|
|
+ uid: _uid,
|
|
|
+ file_ids: [],
|
|
|
+ model: "gpt-4o-2024-08-06"
|
|
|
+ };
|
|
|
+ var OpenCC = require("opencc-js");
|
|
|
+ let converter = OpenCC.Converter({
|
|
|
+ from: "cn",
|
|
|
+ to: "hk"
|
|
|
+ });
|
|
|
+
|
|
|
+ this.ajax
|
|
|
+ .post("https://gpt4.cocorobo.cn/ai_agent_park_chat_new", params)
|
|
|
+ .then(res => {
|
|
|
+ if (
|
|
|
+ converter(res.data.FunctionResponse.result) ==
|
|
|
+ converter("发送成功")
|
|
|
+ ) {
|
|
|
+ } else {
|
|
|
+ this.$message.warning(res.data.FunctionResponse.result);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ this.getAtAuContent(_uid);
|
|
|
+ });
|
|
|
+ this.courseText = "";
|
|
|
+ } else {
|
|
|
+ let _uuid = uuidv4();
|
|
|
+ this.array.push({
|
|
|
+ role: "user",
|
|
|
+ content: `${this.courseText}`,
|
|
|
+ uid: _uuid,
|
|
|
+ AI: "AI",
|
|
|
+ aiContent: "",
|
|
|
+ oldContent: "",
|
|
|
+ isShowSynchronization: false,
|
|
|
+ filename: "",
|
|
|
+ index: this.array.length,
|
|
|
+ is_mind_map: false,
|
|
|
+ createtime: new Date().toLocaleString().replaceAll("/", "-"),
|
|
|
+ loading: true
|
|
|
+ });
|
|
|
+
|
|
|
+ let history = [];
|
|
|
+ this.array.forEach(i => {
|
|
|
+ if (i.content) history.push({ role: "user", content: i.content });
|
|
|
+ if (i.aiContent)
|
|
|
+ history.push({ role: "assistant", content: i.aiContent });
|
|
|
+ });
|
|
|
+
|
|
|
+ history.push({ role: "user", content: message });
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
+ });
|
|
|
+ let params = JSON.stringify({
|
|
|
+ // model: "gpt-3.5-turbo",
|
|
|
+ model: "gpt-4o-2024-08-06",
|
|
|
+ temperature: 0,
|
|
|
+ max_tokens: 4096,
|
|
|
+ top_p: 1,
|
|
|
+ frequency_penalty: 0,
|
|
|
+ presence_penalty: 0,
|
|
|
+ messages: history,
|
|
|
+ uid: _uuid,
|
|
|
+ mind_map_question: ""
|
|
|
});
|
|
|
- this.getAiContent(_uuid);
|
|
|
+ this.courseText = "";
|
|
|
+
|
|
|
+ this.ajax
|
|
|
+ .post("https://gpt4.cocorobo.cn/chat", params)
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.FunctionResponse.result == "发送成功") {
|
|
|
+ } else {
|
|
|
+ this.$message.warning(res.data.FunctionResponse.result);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.log(e);
|
|
|
+ });
|
|
|
+ this.getAiContent(_uuid);
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
getAiContent(_uid) {
|
|
@@ -374,6 +548,54 @@ export default {
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
+ getAtAuContent(_uid){
|
|
|
+ let _source = new EventSource(
|
|
|
+ `https://gpt4.cocorobo.cn/question/${_uid}`
|
|
|
+ ); //http://gpt4.cocorobo.cn:8011/question/ https://gpt4.cocorobo.cn/question/
|
|
|
+ let _allText = "";
|
|
|
+ let _mdText = "";
|
|
|
+ const md = new MarkdownIt();
|
|
|
+ _source.onmessage = _e => {
|
|
|
+ let _eData = JSON.parse(_e.data);
|
|
|
+ if (_eData.content.replace("'", "").replace("'", "") == "[DONE]") {
|
|
|
+ let _result = [];
|
|
|
+ if ("result" in _eData) {
|
|
|
+ _result = _eData.result;
|
|
|
+ for (let i = 0; i < _result.length; i++) {
|
|
|
+ _mdText = _mdText.replace(_result[i].text, _result[i].fileName);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ _mdText = _mdText.replace("_", "");
|
|
|
+ this.array.find(i => i.uid == _uid).aiContent = _mdText;
|
|
|
+ this.array.find(i => i.uid == _uid).isalltext = true;
|
|
|
+ this.array.find(i => i.uid == _uid).isShowSynchronization = true;
|
|
|
+ this.array.find(i => i.uid == _uid).loading = false;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
+ });
|
|
|
+ this.insertChat(_uid);
|
|
|
+ } else {
|
|
|
+ let _text = _eData.content.replace("'", "").replace("'", "");
|
|
|
+ if (_allText == "") {
|
|
|
+ _allText = _text.replace(/^\n+/, ""); //去掉回复消息中偶尔开头就存在的连续换行符
|
|
|
+ } else {
|
|
|
+ _allText += _text;
|
|
|
+ }
|
|
|
+ _mdText = _allText + "_";
|
|
|
+ _mdText = _mdText.replace(/\\n/g, "\n");
|
|
|
+ _mdText = _mdText.replace(/\\/g, "");
|
|
|
+ if (_allText.split("```").length % 2 == 0) _mdText += "\n```\n";
|
|
|
+ //转化返回的回复流数据
|
|
|
+ _mdText = md.render(_mdText);
|
|
|
+ this.array.find(i => i.uid == _uid).aiContent = _mdText;
|
|
|
+ this.array.find(i => i.uid == _uid).loading = false;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
+ });
|
|
|
+ // 处理流数据
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
//保存消息
|
|
|
insertChat(_uid) {
|
|
|
let _data = this.array.find(i => i.uid == _uid);
|
|
@@ -426,7 +648,7 @@ export default {
|
|
|
index: i,
|
|
|
is_mind_map: false,
|
|
|
fileid: _data[i].fileid,
|
|
|
- createtime:_data[i].createtime
|
|
|
+ createtime: _data[i].createtime
|
|
|
});
|
|
|
}
|
|
|
this.array = _chatList;
|
|
@@ -490,7 +712,7 @@ export default {
|
|
|
},
|
|
|
inputChange() {
|
|
|
if (this.courseText.at(-1) == "@") {
|
|
|
- console.log("哇咔咔");
|
|
|
+ this.showRoleList = true;
|
|
|
}
|
|
|
if (this.courseText.at(-1) == "/") {
|
|
|
console.log("哇卡ka2");
|
|
@@ -504,9 +726,41 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
textareaKeydown(_e) {
|
|
|
-
|
|
|
- if (_e.key === "Enter") {
|
|
|
- _e.preventDefault();
|
|
|
+ if (this.showRoleList && this.choseRoleList.length > 0) {
|
|
|
+ console.log(_e.keyCode);
|
|
|
+ switch (_e.keyCode) {
|
|
|
+ case 38: //小键盘上
|
|
|
+ _e.preventDefault();
|
|
|
+ if (this.choseRoleItem == 0) return;
|
|
|
+ this.choseRoleItem--;
|
|
|
+ // 修改滚动条高度
|
|
|
+ this.$refs.roleListRef.scrollTo({
|
|
|
+ top:
|
|
|
+ this.$refs[`roleItem${this.choseRoleItem}Ref`][0].offsetTop -
|
|
|
+ 10,
|
|
|
+ behavior: "smooth"
|
|
|
+ });
|
|
|
+ // this.$refs.roleListRef.scrollTop = this.choseRoleItem * 107;
|
|
|
+ break;
|
|
|
+ case 40: //小键盘下
|
|
|
+ _e.preventDefault();
|
|
|
+ if (this.choseRoleItem == this.choseRoleList.length - 1) return;
|
|
|
+ this.choseRoleItem++;
|
|
|
+ this.$refs.roleListRef.scrollTo({
|
|
|
+ top:
|
|
|
+ this.$refs[`roleItem${this.choseRoleItem}Ref`][0].offsetTop -
|
|
|
+ 10,
|
|
|
+ behavior: "smooth"
|
|
|
+ });
|
|
|
+ // this.$refs.roleListRef.scrollTop = this.choseRoleItem * 107;
|
|
|
+ break;
|
|
|
+ case 13: //回车
|
|
|
+ _e.preventDefault();
|
|
|
+ this.choseRole(this.choseRoleList[this.choseRoleItem]);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ } else if (_e.key === "Enter") {
|
|
|
+ _e.preventDefault();
|
|
|
if (_e.shiftKey) {
|
|
|
this.courseText += "\n";
|
|
|
} else {
|
|
@@ -514,8 +768,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- clear(){
|
|
|
- this.$confirm("确定清空聊天记录吗?", "提示", {
|
|
|
+ clear() {
|
|
|
+ this.$confirm("确定清空聊天记录吗?", "提示", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
type: "warning"
|
|
@@ -541,7 +795,57 @@ export default {
|
|
|
});
|
|
|
})
|
|
|
.catch(_ => {});
|
|
|
- }
|
|
|
+ },
|
|
|
+ getRoleList() {
|
|
|
+ this.roleList = [];
|
|
|
+ let params = {
|
|
|
+ userId: this.userid
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .post("https://gpt4.cocorobo.cn/get_ai_agent_assistant_list", params)
|
|
|
+ .then(res => {
|
|
|
+ let _data = res.data.FunctionResponse.result;
|
|
|
+ if (_data) {
|
|
|
+ this.roleList = JSON.parse(_data);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.log(e);
|
|
|
+ // this.$message.error("获取角色列表失败");
|
|
|
+ this.roleList = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getPublicRoleList() {
|
|
|
+ this.publicRoleList = [];
|
|
|
+ let params = {
|
|
|
+ userId: this.userid,
|
|
|
+ organizeid: this.oid
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .post(
|
|
|
+ "https://gpt4.cocorobo.cn/get_ai_agent_assistant_share_list",
|
|
|
+ params
|
|
|
+ )
|
|
|
+ .then(res => {
|
|
|
+ let _data = res.data.FunctionResponse.result;
|
|
|
+ if (_data) {
|
|
|
+ this.publicRoleList = JSON.parse(_data);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.publicRoleList = [];
|
|
|
+ console.log(e);
|
|
|
+ // console.log("获取公共角色失败", e);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ choseRole(item) {
|
|
|
+ let _lastAtIndex = this.courseText.lastIndexOf("@");
|
|
|
+ this.courseText = `${this.courseText.slice(0, _lastAtIndex)}@${
|
|
|
+ item.assistantName
|
|
|
+ } `;
|
|
|
+ this.$refs.textareaRef.focus();
|
|
|
+ this.showRoleList = false;
|
|
|
+ }
|
|
|
},
|
|
|
computed: {
|
|
|
courseTextLength() {
|
|
@@ -559,6 +863,18 @@ export default {
|
|
|
task += a.join("/");
|
|
|
}
|
|
|
return task + " " + this.part;
|
|
|
+ },
|
|
|
+ choseRoleList() {
|
|
|
+ let result = [...this.roleList, ...this.publicRoleList];
|
|
|
+ const _index = this.courseText.lastIndexOf("@");
|
|
|
+ if (_index !== -1) {
|
|
|
+ let roleName = this.courseText.substring(_index + 1);
|
|
|
+ result = result.filter(i => i.assistantName.indexOf(roleName) != -1);
|
|
|
+ } else {
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ this.choseRoleItem = 0;
|
|
|
+ return result;
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
@@ -568,6 +884,8 @@ export default {
|
|
|
this.$refs.chatDialog.scrollTop = this.$refs.chatDialog.scrollHeight;
|
|
|
});
|
|
|
});
|
|
|
+ this.getRoleList();
|
|
|
+ this.getPublicRoleList();
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
@@ -666,7 +984,7 @@ export default {
|
|
|
border: solid 1px #3781fb;
|
|
|
border-radius: 15px;
|
|
|
display: flex;
|
|
|
- font-size: 15px;
|
|
|
+ font-size: 15px;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
background-color: #fff;
|
|
@@ -676,7 +994,7 @@ export default {
|
|
|
width: 17px;
|
|
|
height: 17px;
|
|
|
margin-right: 5px;
|
|
|
- fill: black;
|
|
|
+ fill: black;
|
|
|
}
|
|
|
|
|
|
.ai_b_i_btnArea > span:hover {
|
|
@@ -688,6 +1006,110 @@ export default {
|
|
|
fill: #409eff;
|
|
|
}
|
|
|
|
|
|
+.ai_b_i_textListBox{
|
|
|
+ width: 100%;
|
|
|
+ height: 300px;
|
|
|
+ background-color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ bottom: calc(100% + 5px);
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px;
|
|
|
+ overflow: auto;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: 1px solid #e7e7e7;
|
|
|
+ box-shadow: 0 4px 10px 0 rgba(29, 57, 131, 0.08),
|
|
|
+ 1px 1px 20px 4px rgba(29, 57, 131, 0.05);
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_tlb_left{
|
|
|
+ width: 60px;
|
|
|
+ height: 100%;
|
|
|
+ background-color: red;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_tlb_right{
|
|
|
+ flex: 1;
|
|
|
+ height: 100%;
|
|
|
+ background-color: yellow;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_roleListBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 300px;
|
|
|
+ background-color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ bottom: calc(100% + 5px);
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px;
|
|
|
+ overflow: auto;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: 1px solid #e7e7e7;
|
|
|
+ box-shadow: 0 4px 10px 0 rgba(29, 57, 131, 0.08),
|
|
|
+ 1px 1px 20px 4px rgba(29, 57, 131, 0.05);
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_item {
|
|
|
+ width: calc(100% - 20px);
|
|
|
+ height: auto;
|
|
|
+ padding: 10px;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ border-radius: 8px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ transition: 0.3s;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemActive {
|
|
|
+ background-color: #d1d5db !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* .ai_b_i_rlb_item:hover{
|
|
|
+ background-color: #d1d5db;
|
|
|
+} */
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemTop {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemTop > img {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ margin-right: 10px;
|
|
|
+ border-radius: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemTop > div {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemTop > div > span {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemTop > div > span:last-child {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemBottom {
|
|
|
+ margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.ai_b_i_rlb_itemBottom > span {
|
|
|
+ width: 60px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 15px;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
.ai_body_input_textarea {
|
|
|
flex: 1;
|
|
|
margin: 10px 5px 10px 5px;
|
|
@@ -699,7 +1121,7 @@ export default {
|
|
|
resize: none;
|
|
|
font-size: 18px;
|
|
|
overflow: auto;
|
|
|
- padding-right: 100px;
|
|
|
+ padding-right: 100px;
|
|
|
}
|
|
|
|
|
|
.ai_body_input_textarea::-webkit-input-placeholder {
|
|
@@ -724,22 +1146,21 @@ export default {
|
|
|
color: grey; /* 修改placeholder文字颜色 */
|
|
|
}
|
|
|
|
|
|
-
|
|
|
.ai_body_input_textarea::-webkit-scrollbar {
|
|
|
width: 6px;
|
|
|
}
|
|
|
|
|
|
.ai_body_input_textarea::-webkit-scrollbar-track {
|
|
|
- background: #D8D9DC;
|
|
|
+ background: #d8d9dc;
|
|
|
border-radius: 2px;
|
|
|
}
|
|
|
|
|
|
.ai_body_input_textarea::-webkit-scrollbar-thumb {
|
|
|
- background: #C9C9C9;
|
|
|
+ background: #c9c9c9;
|
|
|
border-radius: 10px;
|
|
|
}
|
|
|
.ai_body_input_textarea::-webkit-scrollbar-thumb:hover {
|
|
|
- background: #C9C9C9;
|
|
|
+ background: #c9c9c9;
|
|
|
}
|
|
|
|
|
|
.c_pub_button_confirm {
|
|
@@ -747,7 +1168,7 @@ export default {
|
|
|
bottom: 13px;
|
|
|
right: 13px; */
|
|
|
/* margin-top: 10px; */
|
|
|
- width: 80px;
|
|
|
+ width: 60px;
|
|
|
margin-right: 5px;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
@@ -755,6 +1176,12 @@ export default {
|
|
|
position: absolute;
|
|
|
right: 10px;
|
|
|
bottom: 0px;
|
|
|
+ white-space: nowrap;
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.c_pub_button_confirmDisabled {
|
|
|
+ background-color: #aeccfe;
|
|
|
}
|
|
|
|
|
|
.ai_body_dialog {
|
|
@@ -802,6 +1229,7 @@ export default {
|
|
|
.dialog_content > div .role > img {
|
|
|
height: 100%;
|
|
|
width: 100%;
|
|
|
+ border-radius: 100%;
|
|
|
}
|
|
|
|
|
|
.dialog_content > div .content {
|
|
@@ -815,18 +1243,18 @@ export default {
|
|
|
background: #f6f9ff;
|
|
|
/* overflow: hidden; */
|
|
|
margin: 0 10px;
|
|
|
- position: relative;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
|
|
|
-.createTime{
|
|
|
- width: 100%;
|
|
|
- height: 20px;
|
|
|
- position: absolute;
|
|
|
- bottom: -25px;
|
|
|
- left: 0;
|
|
|
- font-size: 14px;
|
|
|
- white-space: nowrap;
|
|
|
- color: #919191;
|
|
|
+.createTime {
|
|
|
+ width: 100%;
|
|
|
+ height: 20px;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -25px;
|
|
|
+ left: 0;
|
|
|
+ font-size: 14px;
|
|
|
+ white-space: nowrap;
|
|
|
+ color: #919191;
|
|
|
}
|
|
|
|
|
|
.dialog_content > div .content2 {
|
|
@@ -995,5 +1423,4 @@ export default {
|
|
|
color: #0061ff;
|
|
|
border-color: #0061ff;
|
|
|
}
|
|
|
-
|
|
|
</style>
|