|
|
@@ -2,14 +2,14 @@
|
|
|
<div class="pblCourse" v-loading="loading">
|
|
|
<div class="pc_left">
|
|
|
<div class="pc_l_top">
|
|
|
- <procedureArea/>
|
|
|
+ <procedureArea :phase="phase" />
|
|
|
</div>
|
|
|
<div class="pc_l_bottom">
|
|
|
- <doWorkArea/>
|
|
|
+ <doWorkArea :phase="phase" @changePhase="changePhase" @choiceAnswer="choiceAnswer" @submitTask="submitTask" :task="taskList[phase.atPhase]" @getTaskList="getTaskList"/>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="pc_right">
|
|
|
- <chatArea/>
|
|
|
+ <chatArea />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -18,6 +18,8 @@
|
|
|
import chatArea from './component/chatArea'
|
|
|
import doWorkArea from './component/doWorkArea'
|
|
|
import procedureArea from './component/procedureArea'
|
|
|
+import { v4 as uuidv4 } from "uuid";
|
|
|
+import MarkdownIt from "markdown-it";
|
|
|
export default {
|
|
|
components: {
|
|
|
chatArea,
|
|
|
@@ -25,15 +27,160 @@ export default {
|
|
|
procedureArea,
|
|
|
},
|
|
|
data() {
|
|
|
- return {
|
|
|
+ return {
|
|
|
loading: false,
|
|
|
+ phase:{
|
|
|
+ doPhase:0,
|
|
|
+ atPhase:0,
|
|
|
+ },
|
|
|
+ taskList:[]
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ changePhase(type,newValue){
|
|
|
+ this.phase[type] = newValue;
|
|
|
+ },
|
|
|
+ getTaskList(phase = 0){
|
|
|
+ return new Promise((resolve,reject)=>{
|
|
|
+ if(this.loading)return this.$message.info("请稍等")
|
|
|
+ this.loading = true;
|
|
|
+ const _uuid = uuidv4()
|
|
|
+ const _msg = `
|
|
|
+ NOTICE
|
|
|
+ Role: 作为学生的学习指导Agent，你熟悉熟悉PBL（基于问题的学习）和5EX教学模型，能够根据学生的学情数据（当前的学习任务设计、学习表现数据、作业数据等）生成自适应的学习任务和对应的5道考核题目。
|
|
|
+ Language: Please use the same language as the user requirement, if the user speaks Chinese, the specific text of your answer should also be in Chinese.
|
|
|
+ ATTENTION: Use '##' to SPLIT SECTIONS, not '#'. Output format carefully referenced "Format example".
|
|
|
+ Instruction: Based on the context, follow "Format example", write content.
|
|
|
+
|
|
|
+ # Context
|
|
|
+ ## 语气
|
|
|
+ 你的语气应该是亲切地，有趣的，循循善诱的一个老师
|
|
|
+
|
|
|
+ ## 工具能力
|
|
|
+ 1. 5E教学模型应用：
|
|
|
+ 你需要熟悉并应用5E教学模型（即引入、探索、解释、扩展和评估）于学习任务的设计中，确保学习过程的有效性和吸引力。5E教学模型是一种以学生为中心的教学方法，旨在通过五个阶段（Engage, Explore, Explain, Elaborate, Evaluate）来促进学生的学习和理解。
|
|
|
+ Engage（引入）：在这个阶段，教师通过引人入胜的活动或问题来激发学生的兴趣和好奇心，帮助他们建立与新知识的联系。
|
|
|
+ Explore（探索）：学生通过动手实验或调查活动来探索新概念，培养他们的探究能力和批判性思维。
|
|
|
+ Explain（解释）：学生在这个阶段分享他们的发现，教师提供进一步的解释和指导，帮助学生理解新概念。
|
|
|
+ Elaborate（拓展）：学生通过应用新知识来解决更复杂的问题，进一步深化他们的理解。
|
|
|
+ Evaluate（评估）：教师和学生共同评估学习效果，反思学习过程，确定需要改进的地方。
|
|
|
+ 2. 学生表现与选择的感知：
|
|
|
+ 通过与学生互动，实时感知学生的学习表现和选择，理解他们的学习需求和难点。
|
|
|
+ 3. 自适应任务生成：
|
|
|
+ 基于学生的反馈和选择，自动生成个性化的学习任务，任务难度和类型随学生的表现和需求而变化。
|
|
|
+
|
|
|
+ ## 工作流程
|
|
|
+ 1. 判断学生当前处在5E模型中哪一个学习阶段。如果未提供学情数据，或无法判断学生当前处在5E教学模型中的哪一个解释，则默认处在第一个阶段（引入）阶段。请随机选择一个适合小学五年级学生的科学学习主题，并生成相应的符合引入阶段的学习任务。
|
|
|
+ 2. 结合学生当前的学情数据，生成紧随其后的下一个阶段的学习任务，但是仅仅生成紧随其后的下一个阶段的学习任务。你需要沿着这个顺序判断：引入阶段→探索阶段→解释阶段→拓展阶段→评估阶段。比如，当你判断学情数据中，学生目前已经完成了引入阶段的学习，那么你需要提供探索阶段的学习任务。
|
|
|
+ 3. 生成上一步中学习任务对应的5道考核选择题
|
|
|
+
|
|
|
+ ## 限制
|
|
|
+ 1. 请仅仅生成某一个阶段对应的学习任务。不要同时给出多个阶段、多个学习任务。
|
|
|
+ 2. 请严格按照以下格式要求输出内容，请仅仅告知相应的5E阶段名称和对应的任务描述，不需要包含学情数据等与【任务】无关的内容。
|
|
|
+ 3. 生成相应的考核题目，仅限单选题
|
|
|
+ 4. 任务描述的格式以markdown方式输出
|
|
|
+ ${
|
|
|
+ this.phase.doPhase==0?'':`
|
|
|
+ ## 学情数据
|
|
|
+ 这是你生成适应性学习任务时，需要参考的前置学情数据${JSON.stringify(this.taskList[this.phase.doPhase])}（当前的学习任务设计、学习表现数据、作业数据等）。`
|
|
|
+ }
|
|
|
+
|
|
|
+ # Format example
|
|
|
+ {
|
|
|
+ "name": "任务名字",
|
|
|
+ "detail": "任务描述（要求markdown的格式）",
|
|
|
+ "target":"任务目标",
|
|
|
+ "steps":"任务步骤",
|
|
|
+ "tips":"任务提示",
|
|
|
+ "answerArray":[
|
|
|
+ {
|
|
|
+ title: "标题",
|
|
|
+ type: "单选题",
|
|
|
+ option: ["选项1","选项2","选项3","选项4"],
|
|
|
+ answer: "答案（最好是index）"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "标题",
|
|
|
+ type: "单选题",
|
|
|
+ option: ["选项1","选项2","选项3","选项4"],
|
|
|
+ answer: "答案（最好是index）"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }`
|
|
|
+
|
|
|
+ // ${
|
|
|
+ // this.phase.doPhase==0?'':`
|
|
|
+ // ## 学情数据
|
|
|
+ // 这是你生成适应性学习任务时，需要参考的前置学情数据${JSON.stringify(this.taskList[this.phase.doPhase])}（当前的学习任务设计、学习表现数据、作业数据等）。`
|
|
|
+ // }
|
|
|
+
|
|
|
+ let params = {
|
|
|
+ model: "gpt-3.5-turbo",
|
|
|
+ temperature: 0,
|
|
|
+ max_tokens: 4096,
|
|
|
+ top_p: 1,
|
|
|
+ frequency_penalty: 0,
|
|
|
+ presence_penalty: 0,
|
|
|
+ messages: [{role:"user",content:_msg}],
|
|
|
+ uid: _uuid,
|
|
|
+ mind_map_question: "",
|
|
|
+ stream:false
|
|
|
+ }
|
|
|
+ this.ajax
|
|
|
+ .post("https://gpt4.cocorobo.cn/chat", params)
|
|
|
+ .then((res) => {
|
|
|
+ let _data = res.data.FunctionResponse.choices[0];
|
|
|
+ const content = _data.message.content;
|
|
|
+ const _result = JSON.parse(content);
|
|
|
+ const md = new MarkdownIt();
|
|
|
+ _result.detail = _result.detail?md.render(_result.detail):"",
|
|
|
+ _result.steps = _result.steps?md.render(_result.steps):"",
|
|
|
+ _result.target = _result.target?md.render(_result.target):"",
|
|
|
+ _result.tips =_result.tips?md.render(_result.tips):""
|
|
|
+ this.taskList[phase] = _result;
|
|
|
+ // this.phase.doPhase = phase;
|
|
|
+ this.phase.atPhase = phase;
|
|
|
+ console.log(this.taskList)
|
|
|
+ this.loading = false;
|
|
|
+ resolve();
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ this.loading = false;
|
|
|
+ this.$message.error("获取任务失败")
|
|
|
+ resolve();
|
|
|
+ console.log(e);
|
|
|
+ });
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ choiceAnswer(_data){
|
|
|
+ this.taskList[this.phase.atPhase].answerArray[_data[0]].userAnswer = _data[1];
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ submitTask(){
|
|
|
+
|
|
|
+ this.loading = true;
|
|
|
+ let sum = 0;
|
|
|
+ this.taskList[this.phase.atPhase].answerArray.forEach(i=>{
|
|
|
+ if('userAnswer' in i){
|
|
|
+ sum++;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(sum<this.taskList[this.phase.atPhase].answerArray.length){
|
|
|
+ this.loading = false;
|
|
|
+ return this.$message.error("当前阶段还未完成")
|
|
|
+ }else if((this.phase.doPhase>this.phase.atPhase)){
|
|
|
+ this.loading = false;
|
|
|
+ return this.$message.error("该阶段已经提交过了")
|
|
|
+ }else{
|
|
|
+ this.loading = false;
|
|
|
+ this.phase.doPhase++;
|
|
|
+ this.getTaskList(this.phase.doPhase)
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
mounted() {
|
|
|
-
|
|
|
+ this.getTaskList()
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
@@ -50,29 +197,28 @@ export default {
|
|
|
padding: 20px;
|
|
|
}
|
|
|
|
|
|
-.pc_left{
|
|
|
+.pc_left {
|
|
|
width: calc(100% - 500px - 20px);
|
|
|
margin-right: 20px;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
-.pc_l_top{
|
|
|
+.pc_l_top {
|
|
|
width: 100%;
|
|
|
height: 150px;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
-.pc_l_bottom{
|
|
|
+.pc_l_bottom {
|
|
|
width: 100%;
|
|
|
height: calc(100% - 150px - 15px);
|
|
|
box-sizing: border-box;
|
|
|
margin-top: 15px;
|
|
|
}
|
|
|
|
|
|
-.pc_right{
|
|
|
+.pc_right {
|
|
|
width: 500px;
|
|
|
height: 100%;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
-
|
|
|
</style>
|
SanHQin
