update

src/components/pages/classroomObservation/components/analysis.vue

@@ -17,6 +17,7 @@
 				ref="analysisItemRef"
 				v-if="analysisItemList.length > 0"
 				v-for="(item, index) in analysisItemList"
+				:dialogTagDataList="dialogTagDataList"
 				:key="item.id"
 				:data="item"
 				:tid="tid"
@@ -41,6 +42,12 @@ export default {
 			type: String,
 			default: "分析",
 		},
+		dialogTagDataList:{
+			type:Array,
+			default:()=>{
+				return [];
+			}
+		},
 		analysisItemList: {
 			type: Array,
 			default: () => {
@@ -82,14 +89,14 @@ export default {
 		editItem(id, _data) {
 			this.$emit("editItem", id, _data);
 		},
-		getReport(index) {
-			if (!index && index < 0) {
+		getReport(id) {
+			if (!id) {
 				this.$refs.analysisItemRef.forEach((i) => {
 					i.editBtn();
 				});
 			} else {
 				this.$nextTick(()=>{
-					this.$refs.analysisItemRef[index].editBtn();
+					this.$refs.analysisItemRef[this.analysisItemList.findIndex((i) => i.id == id)].editBtn();
 				})
 				
 			}

src/components/pages/classroomObservation/components/analysisItem.vue

@@ -8,8 +8,6 @@
 				<span class="ai-h-l-text">{{ data.jsonData.name }}</span>
 			</div>
 			<div class="ai-h-right">
-				<!-- <span class="ai-h-r-icon1" @click.stop="backLeft()"></span> -->
-				<!-- <span class="ai-h-r-icon2" @click.stop="backRight()"></span> -->
 				<span style="width: 100px; color: red" v-if="loadNum == 2"
 					>优化失败
 				</span>
@@ -26,12 +24,12 @@
 				></span>
 				<span
 					v-if="loadNum == 0 && openItem"
-					class="ai-h-r-icon1"
+					:class="['ai-h-r-icon1',showIndex<=0?'ai_h_r_iconOpacity':'']"
 					@click.stop="changeShowIndex(-1)"
 				></span>
 				<span
 					v-if="loadNum != 1 && openItem"
-					class="ai-h-r-icon2"
+					:class="['ai-h-r-icon2',showIndex>=historyResult.length-1?'ai_h_r_iconOpacity':'']"
 					@click.stop="changeShowIndex(1)"
 				></span>
 				<span
@@ -43,10 +41,7 @@
 			</div>
 		</div>
 		<div class="ai-main" v-if="openItem">
-			<!-- <div class="a-m-title">
-				<span></span>
-				<div>{{ data.title }}分析</div>
-			</div> -->
+
 
 			<div class="a-m-brief">
 				<mdView :text="data.jsonData.result" />
@@ -95,6 +90,12 @@ export default {
 				return {};
 			},
 		},
+		dialogTagDataList:{
+			type:Array,
+			default:()=>{
+				return []
+			}
+		},
 		index: {
 			type: Number,
 			default: 0,
@@ -136,13 +137,12 @@ export default {
 		},
 	},
 	watch:{
-		showIndex(){
-			let _copyData = JSON.parse(JSON.stringify(this.data));
-			_copyData.jsonData = this.historyResult[this.showIndex];
-			_copyData.json_data = JSON.stringify(_copyData.jsonData);
-			console.log(_copyData)
-			this.$emit("editItem", this.data.id, _copyData);
-		}
+		// showIndex(){
+		// 	let _copyData = JSON.parse(JSON.stringify(this.data));
+		// 	_copyData.jsonData = this.historyResult[this.showIndex];
+		// 	_copyData.json_data = JSON.stringify(_copyData.jsonData);
+		// 	this.$emit("editItem", this.data.id, _copyData);
+		// }
 	},
 	methods: {
 		changeOpenItem(newValue) {
@@ -151,97 +151,19 @@ export default {
 			this.loadNum = 0;
 			this.openItem = newValue;
 		},
-		backLeft() {
-			this.$message.info("回退左");
-		},
-		backRight() {
-			this.$message.info("回退右");
-		},
 		editBtn() {
 			this.$nextTick(() => {
 				this.loading = true;
 				this.openItem = false;
 				this.loadNum = 1;
-				let assistant_id = {
-					课堂观察: { value: "8ab07d41-e143-11ee-aaca-12e77c4cb76b", type: 0 },
-					教学阶段九事件分析: {
-						value: "5e0466b3-0075-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					OMO智慧课堂分析: {
-						value: "4cc367c1-0076-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					布鲁姆问题分类: {
-						value: "eac63117-00a7-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					麦卡锡问题分类: {
-						value: "18545cf7-0125-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					学生回答统计: {
-						value: "2c6ede88-0125-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					课堂活动类型: {
-						value: "41d2d2d4-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					素养目标分析: {
-						value: "b13a98de-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					科学教育目标分析: {
-						value: "d6cd48ab-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					"5E课程改编": {
-						value: "f757826e-0125-11ef-aaca-12e77c4cb76b",
-						type: 2,
-					},
-					"5EX课程改编": {
-						value: "0b6b08b7-0126-11ef-aaca-12e77c4cb76b",
-						type: 2,
-					},
-					UTOP课程观察: {
-						value: "8e3a389b-014f-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RST模型: {
-						value: "e649112e-0150-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RTOP模型: {
-						value: "68265b18-0151-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					课堂质量评价: {
-						value: "25e53379-0152-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					SCOP课堂观察: {
-						value: "d0c76d35-0152-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RTOP课堂观察: {
-						value: "2ace7ff6-0154-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-				};
-				let file_ids = {
-					"03": ["file-E8SvjCHbmhmjKczRWr11OuHx"],
-					"04": ["file-r5phg4I2oFqly4WpW7oOOTnA"],
-				};
+				let assistant = this.dialogTagDataList.find(i=>i.title==this.data.jsonData.name);
 				let parm = {
-					assistant_id: assistant_id[this.data.jsonData.name]
-						? assistant_id[this.data.jsonData.name].value
-						: null,
+					assistant_id: assistant?assistant.value:null,
 					message:
 						"请使用代码解析器获取文件，帮我根据要求完整的分析，输出请按照要求。",
 					session_name: new Date().getTime(),
 					userId: "1cf9dc4b-d95f-11ea-af4c-52540005ab01",
-					file_ids: this.fileId ? [this.fileId] : file_ids[this.tid],
+					file_ids: this.fileId,
 				};
 
 				if (!parm.assistant_id) {
@@ -253,7 +175,6 @@ export default {
 				this.ajax
 					.post("https://gpt4.cocorobo.cn/ai_agent_park_chat", parm)
 					.then((res) => {
-						console.log("👇👇");
 						let _data = res.data.FunctionResponse;
 						if (
 							!_data.message ||
@@ -267,25 +188,19 @@ export default {
 						_copyData.jsonData.dataFileList = [];
 						_copyData.jsonData.fileList = [];
 						_copyData.json_data = JSON.stringify(_copyData.jsonData);
-						// this.historyResult.push(_copyData.jsonData)
-						this.historyResult.splice(this.showIndex+1,0,_copyData.jsonData)
+						if(this.historyResult.length==0){
+							this.historyResult.push(_copyData.jsonData)
+						}else{
+							this.historyResult.splice(this.showIndex+1,0,_copyData.jsonData)
+						}
 						this.changeShowIndex(1);
-						// this.$emit("editItem", this.data.id, _copyData);
-						
-
 						this.loading = false;
-						
 					})
 					.catch((err) => {
 						this.$message.error("AI无法识别优化");
 						this.loading = false;
 						this.loadNum = 2;
 					});
-				// this.$emit
-				// setTimeout(()=>{
-				// 	this.loading = false;
-				// 	this.$emit("editItem", this.data);
-				// },1000)
 			});
 		},
 		delBtn() {
@@ -298,17 +213,26 @@ export default {
 			});
 		},
 		changeShowIndex(value){
+			if(this.historyResult.length==0)return;
 			if(value==-1){
-				if(this.showIndex<=0)return this.$message.info("已经是第一个了")
-				this.showIndex--;
+				if(this.showIndex>0)this.showIndex--;
 			}else if(value==1){
-				if(this.showIndex>=this.historyResult.length-1)return this.$message.info("已经是最后一个了");
-				this.showIndex++;
+				if(this.showIndex<this.historyResult.length-1)this.showIndex++;
 			}
+			let _copyData = JSON.parse(JSON.stringify(this.data));
+			let _oldCopyDate = JSON.parse(JSON.stringify(this.data));
+			_copyData.jsonData = this.historyResult[this.showIndex];
+			_copyData.json_data = JSON.stringify(_copyData.jsonData);
+			_oldCopyDate.json_data = JSON.stringify(_oldCopyDate.jsonData);
+			// 一样就不用更新了
+			if(JSON.stringify(_copyData)==JSON.stringify(_oldCopyDate))return;
+			this.$emit("editItem", this.data.id, _copyData);
 		}
 	},
 	mounted(){
-		this.historyResult.push(this.data.jsonData)
+		if(this.data.jsonData.result){
+			this.historyResult.push(this.data.jsonData)
+		}
 	},
 };
 </script>
@@ -390,6 +314,11 @@ export default {
 	background: url("../../../../assets/icon/classroomObservation/back.png");
 }
 
+.ai_h_r_iconOpacity{
+	opacity: 0.5;
+	cursor: not-allowed !important;
+}
+
 .ai-h-r-icon3 {
 	background: url("../../../../assets/icon/classroomObservation/edit.png");
 	/* background: url("../../../../assets/icon/classroomObservation/del.png"); */

src/components/pages/classroomObservation/components/baseMessage.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="message">
+	<div class="message" >
 		<div class="m-header" @click.stop="changeShowMain(!showMain)">
 			<span :class="['m-h-icon', showMain ? 'm-h-icon-active' : '']"></span>
 			<span class="m-h-title">{{ title }}</span>
@@ -12,6 +12,7 @@
 						<el-input
 							v-model="data.courseName"
 							placeholder="请输入课程名称"
+							@change="changeData()"
 						></el-input>
 					</div>
 				</div>
@@ -20,7 +21,7 @@
 					<div class="m-m-formItemBot">
 						<div class="m-m-fi-label">授课年级</div>
 						<div class="m-m-fi-input">
-							<el-select v-model="data.grade" placeholder="请选择年级">
+							<el-select v-model="data.grade" @change="changeData()" placeholder="请选择年级">
 								<el-option
 									v-for="(item, index) in gradeList"
 									:key="index"
@@ -34,7 +35,7 @@
 					<div class="m-m-formItemBot">
 						<div class="m-m-fi-label">授课科目</div>
 						<div class="m-m-fi-input">
-							<el-select v-model="data.subject" placeholder="请选择年级">
+							<el-select v-model="data.subject" @change="changeData()" placeholder="请选择年级">
 								<el-option
 									v-for="(item, index) in subjectList"
 									:key="index"
@@ -51,6 +52,7 @@
 							<el-input
 								v-model="data.class"
 								placeholder="请输入班级"
+								@change="changeData()"
 							></el-input>
 						</div>
 					</div>
@@ -65,6 +67,7 @@
 						<el-input
 							v-model="data.teacherName"
 							placeholder="请输入授课老师"
+							@change="changeData()"
 						></el-input>
 					</div>
 				</div>
@@ -75,6 +78,7 @@
 						<el-input
 							v-model.number="data.studentNum"
 							placeholder="请输入学生人数"
+							@change="changeData()"
 						></el-input>
 					</div>
 				</div>
@@ -83,23 +87,27 @@
 				<span>添加课堂图片</span>
 				<span>（建议图片比例16:9，最多上传3张图片）</span>
 			</div>
-			<div class="m-m-formImage">
+			<div class="m-m-formImage" v-loading="uploadImageLoading">
 				<div class="m-m-fi-imageList">
 					<div class="m-m-fi-imageList">
 						<div
 							class="m-m-fi-imageItem"
 							v-for="(value,key,index) in imageList"
 							:key="index"
-							v-if="key.indexOf('fileList')!=-1&&index!=0"
+							v-if="key.indexOf('fileList')!=-1&&index!=0 && value.length>0"
 							@click.stop="previewImg(value[0].url)"
 						>
-
-							<img class="itemUrl" :src="value[0].url" alt="" />
+						<el-image
+						class="itemUrl"
+      			:src="value[0].url"
+      			fit="cover"></el-image>
+						<span @click.stop="delImage(key)">x</span>
+							<!-- <img class="itemUrl" :src="value[0].url" alt="" /> -->
 						</div>
 						<!-- 图片区域 -->
 					</div>
 
-					<div class="m-m-fi-imageItem" @click.stop="addImage()">
+					<div class="m-m-fi-imageItem"  @click.stop="addImage()" v-if="imageList.fileList1&&(imageList.fileList1.length+imageList.fileList2.length+imageList.fileList3.length)<3">
 						<img
 							src="../../../../assets/icon/classroomObservation/Union.png"
 							alt=""
@@ -125,6 +133,7 @@
 
 <script>
 export default {
+	emits:["saveData","saveImage","delImage"],
 	props:{
 		data:{
 			type:Object,
@@ -143,6 +152,7 @@ export default {
 		return {
 			title: "基本信息",
 			showMain: true,
+			uploadImageLoading:false,
 			from: {
 				courseName: "",
 				teacherName: "",
@@ -162,14 +172,83 @@ export default {
 			subjectList: [{ value: "科学", label: "科学" }],
 		};
 	},
-	watch:{
-		data(newValue){
-			this.from = newValue;
-		}
-	},
 	methods: {
+		// 添加图片
 		addImage() {
-			this.$message.info("添加课堂图片");
+			// 上传录音
+			let input = document.createElement("input");
+			input.type = "file";
+			input.accept = "image/*";
+			input.click();
+			input.onchange = () => {
+				this.uploadImageLoading = true;
+				let file = input.files[0];
+				var credentials = {
+					accessKeyId: "AKIATLPEDU37QV5CHLMH",
+					secretAccessKey: "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",
+				}; //秘钥形式的登录上传
+				window.AWS.config.update(credentials);
+				window.AWS.config.region = "cn-northwest-1"; //设置区域
+
+				var bucket = new window.AWS.S3({ params: { Bucket: "ccrb" } }); //选择桶
+				var _this = this;
+
+				if (file) {
+					var params = {
+						Key:
+							file.name.split(".")[0] +
+							new Date().getTime() +
+							"." +
+							file.name.split(".")[file.name.split(".").length - 1],
+						ContentType: file.type,
+						Body: file,
+						"Access-Control-Allow-Credentials": "*",
+						ACL: "public-read",
+					}; //key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
+					var options = {
+						partSize: 2048 * 1024 * 1024,
+						queueSize: 2,
+						leavePartsOnError: true,
+					};
+					bucket
+						.upload(params, options)
+						.on("httpUploadProgress", function (evt) {
+							//这里可以写进度条
+							// console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
+						})
+						.send(function (err, data) {
+							if (err) {
+								_this.$message.error("上传失败");
+							} else {
+								_this.$emit("saveImage",{
+									name:data.key,
+									status:"success",
+									uid:"1",
+									url:data.Location
+								});
+								// _this.from.audioUrl = data.Location;
+								// _this.from.audioName = file.name;
+								// _this.from.audioSize = file.size;
+								// _this.from.audioTime = file.lastModified;
+
+								// console.log(data.Location)
+							}
+							_this.uploadImageLoading = false;
+						});
+				}
+			};
+			// this.mainBtnStatus = 1;
+			// this.barNum = 4;
+		},
+		// 删除图片
+		delImage(key){
+			this.$confirm('确定删除该图片吗？', '提示', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				type: 'warning'
+			}).then(() => {
+				this.$emit("delImage",key);
+			})
 		},
 		changeShowMain(newValue) {
 			this.showMain = newValue;
@@ -177,6 +256,9 @@ export default {
 		previewImg(url) {
 			this.$hevueImgPreview(url);
 		},
+		changeData(){
+			this.$emit("saveData");
+		},
 	},
 	mounted(){
 		
@@ -326,9 +408,33 @@ export default {
 	box-sizing: border-box;
 	font-size: 14px;
 	cursor: pointer;
+	position: relative;
 }
 .m-m-fi-imageItem > .itemUrl {
 	width: 100%;
+	height: 100%;
+}
+
+.m-m-fi-imageItem>span{
+	width:30px;
+	height: 30px;
+	position: absolute;
+	right: 0;
+	top: 0;
+	display: flex;
+	justify-content: flex-end;
+	align-items: flex-start;
+	box-sizing: border-box;
+	padding: 2px 10px;
+	color: white;
+	background-color: #e60012;
+	cursor: pointer;
+	border-radius: 0 0 0 100%;
+	display: none;
+}
+
+.m-m-fi-imageItem:hover>span{
+	display: flex;
 }
 
 .m-m-fi-i-icon {

src/components/pages/classroomObservation/components/chatArea.vue

@@ -35,7 +35,12 @@
 				:data="transcriptionData"
 			/>
 			<!-- ai对话 -->
-			<tape ref="tapeRef" :aiNameList="aiNameList" :chatData="chatList" v-show="pageStatus == 0 && !showIndexPage" />
+			<tape
+				ref="tapeRef"
+				:aiNameList="roleList"
+				:chatData="[]"
+				v-show="pageStatus == 0 && !showIndexPage"
+			/>
 			<!-- <div class="t-t-m-Item" v-show="cardStatus==1"> -->
 			<iframe
 				ref="viframe"
@@ -137,6 +142,7 @@
 					</div>
 					<div class="ca-b-o-m-tapeTwo" v-show="controlsStatus == 2">
 						<mini-audio
+							v-if="audioUrl"
 							:audio-source="audioUrl"
 							class="audio_class"
 						></mini-audio>
@@ -144,6 +150,8 @@
 							style="
 								width: 32px;
 								height: 32px;
+								margin-left: 20px;
+								cursor: pointer;
 								background-color: #3681fc;
 								border-radius: 50%;
 								display: flex;
@@ -159,7 +167,11 @@
 							/>
 						</div>
 					</div>
-					<div class="ca-b-o-m-inputAre" v-show="controlsStatus == 3">
+					<div
+						class="ca-b-o-m-inputAre"
+						v-show="controlsStatus == 3"
+						v-loading="textareaLoading"
+					>
 						<div class="ca-b-o-m-left">
 							<textarea
 								id="myTextarea"
@@ -171,6 +183,7 @@
 								autosize="none"
 								@input="textareaChange"
 								@change="textareaChange"
+								@keydown="textareaKeydown"
 							></textarea>
 						</div>
 						<div class="ca-b-o-m-right">
@@ -178,7 +191,44 @@
 							<!-- <div :class="sendBtnDsiable ? 'ca-b-o-m-r-dsiableBtn' : ''">
 								发送
 							</div> -->
-							<el-button :disabled="textareaValue.trim().length==0" type="primary" size="mini" @click="send()">发送</el-button>
+							<el-button
+								:disabled="textareaValue.trim().length == 0"
+								type="primary"
+								size="mini"
+								@click="send()"
+								>发送</el-button
+							>
+						</div>
+						<div
+							ref="roleListRef"
+							v-click-outside="noShowRoleList"
+							class="ca_b_o_m_roleList"
+							v-if="showRoleList && choseRoleList.length != 0"
+						>
+							<div
+								:class="['ca_b_o_m_rl_item',roleListIndex==index?'ca_b_o_m_rl_itemActive':'']"
+								v-for="(item,index) in choseRoleList"
+								:key="item.assistant_id"
+								@click="choseRole(item)"
+							>
+								<div class="ca_b-o_m_rl_i_top">
+									<el-avatar
+										size="medium"
+										:src="
+											item.headUrl
+												? item.headUrl
+												: require('@/assets/icon/classroomObservation/aiAvatar.png')
+										"
+									></el-avatar>
+									<div>
+										<div>{{ item.assistantName }}</div>
+										<span v-if="item.username">作者：{{ item.username }}</span>
+									</div>
+								</div>
+								<div class="ca_b-o_m_rl_i_bottom">
+									<span>{{ item.description }}</span>
+								</div>
+							</div>
 						</div>
 					</div>
 					<div class="ca-b-o-m-TapeArea" v-show="controlsStatus == 1">
@@ -189,8 +239,12 @@
 								alt=""
 							/>
 							<div>
-								<div v-if="recordedForm.status == 1" style="color:#EE3E3E">录音中...</div>
-								<div v-if="recordedForm.status == 2" style="color:#6b798e">已暂停...</div>
+								<div v-if="recordedForm.status == 1" style="color: #ee3e3e">
+									录音中...
+								</div>
+								<div v-if="recordedForm.status == 2" style="color: #6b798e">
+									已暂停...
+								</div>
 								<span>{{ recordedForm.time }}</span>
 							</div>
 						</div>
@@ -248,8 +302,9 @@
 import startPage from "./startPage.vue";
 import transcription from "./transcription.vue";
 import tape from "./tape.vue";
-
+import { v4 as uuidv4 } from "uuid";
 import Recorder from "js-audio-recorder";
+// import MarkdownIt from "markdown-it";
 const lamejs = require("lamejs");
 
 const recorder = new Recorder({
@@ -289,13 +344,17 @@ const clickOutside = {
 	},
 };
 export default {
-	emits: ["updateFileId"],
+	emits: ["updateFileId", "changeAudioUrl"],
 	props: {
 		tid: {
 			type: String,
 			require: true,
 		},
-		fileIdid: {
+		fileId: {
+			type: String,
+			default: "",
+		},
+		fileIdId: {
 			type: String,
 			default: "",
 		},
@@ -311,24 +370,23 @@ export default {
 	data() {
 		return {
 			// continuousDialogue: true,
-			controlsStatus: 0, //0--点击开始录音  1--录音中   2--录音完毕预览  3--文字输入
+			controlsStatus: 3, //0--点击开始录音  1--录音中   2--录音完毕预览  3--文字输入
 			pageStatus: 0, //0--ai对话  1--原文文稿  2--转录文稿
-			showIndexPage: true, //是否显示初始页面
+			showIndexPage: false, //是否显示初始页面
 			languageRadio: 1, //设置选择语言
 			languageShow: false, //控制显示
 			loading: false,
 			textareaValue: "",
+			textareaLoading: false,
+			showRoleList: false,
+			roleListIndex:0,
 			recordedForm: {
 				time: "00:00:00", //时间
 				status: 0, //0--未录音  1--正在录音  2--暂停  3--录音结束
 			},
-			aiNameList:[
-				{index:0,name:"ai助手"},
-				{index:1,name:"ABC模型"},
-				{index:2,name:'5EX模型'}
-			],
-			audioUrl:
-				"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E8%A7%A3%E5%86%B3%E5%9E%83%E5%9C%BE%E9%97%AE%E9%A2%981713172672090.m4a",
+			roleList: [],
+			publicRoleList: [],
+			audioUrl: "",
 			fileUrl:
 				"https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%E8%BD%AC%E5%BD%95%E6%96%87%E7%A8%BF1713172600896.xlsx",
 			// 设置list
@@ -413,58 +471,28 @@ export default {
 直接填埋这种方法会占用大量土地，而且还会污染土地，焚烧发电这种方法会会污_
 `,
 			},
-			chatList: [
-				{
-					role: "ai",
-					name: "AI助手",
-					create_at: "2024-04-14 10:19:00",
-					content:
-						"Hi~ 你可以针课堂。。。使用。。。提问后点击右下角的加号，可以将新的内容添加到展示看板中。",
-				},
-				{
-					role: "user",
-					name: "我",
-					create_at: "2024-04-14 10:20:00",
-					content: "@ABC模型  使用陈老师的5EX课程模型，改编一个新的课程。",
-				},
-				{
-					role: "ai",
-					name: "5EX模型",
-					create_at: "2024-04-14 10:23:00",
-					content: `通过对科学课堂实录的评估，发现需要增加探究型和创造型教学活动的比例，以及优化教学活动的编排，以促进学生的深入理解和应用知识。此外，平衡师生发言时长，特别是通过增加学生主导的互动活动，将有助于提高学生的课堂参与度和学习效果。
-通过对科学课堂实录的评估，发现需要增加探究型和创造型教学活动的比例，以及优化教学活动的编排，以促进学生的深入理解和应用知识。此外，平衡师生发言时长，特别是通过增加学生主导的互动活动，将有助于提高学生的课堂参与度和学习效果。
-Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格`,
-				},
-				{
-					role: "ai",
-					name: "AI助手",
-					create_at: "2024-04-14 10:19:00",
-					content:
-						"Hi~ 你可以针课堂。。。使用。。。提问后点击右下角的加号，可以将新的内容添加到展示看板中。",
-				},
-				{
-					role: "user",
-					name: "我",
-					create_at: "2024-04-14 10:20:00",
-					content: "@ABC模型  使用陈老师的5EX课程模型，改编一个新的课程。",
-				},
-				{
-					role: "ai",
-					name: "5EX模型",
-					create_at: "2024-04-14 10:23:00",
-					content: `通过对科学课堂实录的评估，发现需要增加探究型和创造型教学活动的比例，以及优化教学活动的编排，以促进学生的深入理解和应用知识。此外，平衡师生发言时长，特别是通过增加学生主导的互动活动，将有助于提高学生的课堂参与度和学习效果。
-通过对科学课堂实录的评估，发现需要增加探究型和创造型教学活动的比例，以及优化教学活动的编排，以促进学生的深入理解和应用知识。此外，平衡师生发言时长，特别是通过增加学生主导的互动活动，将有助于提高学生的课堂参与度和学习效果。
-Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格`,
-				},
-			],
+			chatList: [],
 		};
 	},
 	computed: {
-		sendBtnDsiable() {
-			return true;
+		// 选择可以@的角色
+		choseRoleList() {
+			let result = [...this.roleList, ...this.publicRoleList];
+			const _index = this.textareaValue.lastIndexOf("@");
+			if (_index !== -1) {
+				let roleName = this.textareaValue.substring(_index + 1);
+				result = result.filter((i) => i.assistantName.indexOf(roleName) != -1);
+			} else {
+				return [];
+			}
+			return result;
 		},
 	},
-	watch: {},
+	watch:{
+		choseRoleList(){
+			this.roleListIndex = 0;
+		}
+	},
 	methods: {
 		handleBlur(event) {
 			// console.log("点击其它区域啦", event);
@@ -523,7 +551,8 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 									_this.controlsStatus = 2;
 									_this.showIndexPage = false;
 									_this.pageStatus = 1;
-									_this.audioUrl = data.Location;
+									// _this.audioUrl = data.Location;
+									_this.$emit("changeAudioUrl", data);
 									_this.loading = false;
 								} else {
 									_this.ajax
@@ -535,7 +564,7 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 											if (_data.result && _data.result.id) {
 												_this.$emit("updateFileId", _data.result.id);
 												let pram2 = {
-													id: _this.fileIdid,
+													id: _this.fileIdId,
 													json_data: JSON.stringify({
 														file_ids: _data.result.id,
 													}),
@@ -593,7 +622,23 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 		},
 		recordedStart() {
 			// 开始录音
-			if (this.controlsStatus != 1 && this.recordedForm.status == 0) {
+			if (this.audioUrl) {
+				this.$confirm("再次录音会顶替掉原先的录音，您确定吗", "提醒", {
+					confirmButtonText: "确定",
+					cancelButtonText: "取消",
+					type: "warning",
+				})
+					.then(() => {
+						this.recordedForm.status = 0;
+						this.audioUrl = "";
+						recorder.initRecorder(); //初始化录音
+						recorder.destroy(); // 销毁录音
+						this.recordedStart();
+					})
+					.catch((_) => {
+						console.log("不顶替");
+					});
+			} else if (this.controlsStatus != 1 && this.recordedForm.status == 0) {
 				recorder.initRecorder(); //初始化录音
 				recorder.destroy(); // 销毁录音
 				// 开始录音
@@ -622,25 +667,10 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 			} else if ([1, 2].includes(this.recordedForm.status)) {
 				this.controlsStatus = 1;
 				this.$message.info("还在录音中");
-			} else if ([3].includes(this.recordedForm.status)) {
-				this.$confirm("再次录音会顶替掉之前的录音，您确定吗", "提醒", {
-					confirmButtonText: "确定",
-					cancelButtonText: "取消",
-					type: "warning",
-				})
-					.then(() => {
-						this.recordedForm.status = 0;
-						recorder.initRecorder(); //初始化录音
-						recorder.destroy(); // 销毁录音
-						this.recordedStart();
-					})
-					.catch((_) => {
-						console.log("不顶替");
-					});
 			}
 			// this.controlsStatus = 1;
 		},
-		updateRecordedTime({duration}) {
+		updateRecordedTime({ duration }) {
 			// 更新currentTime，将秒数转换为时分秒格式
 			let hours = Math.floor(duration / 3600);
 			let minutes = Math.floor((duration % 3600) / 60);
@@ -712,7 +742,7 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 						} else {
 							// 判断是不是音频文件
 							// 更改录音文件
-							_this.audioUrl = data.Location;
+							_this.$emit("changeAudioUrl", data);
 							_this.controlsStatus = 2;
 							_this.pageStatus = 1;
 							_this.recordedForm.status = 3;
@@ -792,36 +822,151 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 				this.$message.success("已继续录音");
 			}
 		},
-
+		changeAudioUrl(newValue) {
+			if (!newValue) return;
+			this.audioUrl = newValue;
+			this.pageStatus = 1;
+			this.controlsStatus = 2;
+			this.showIndexPage = false;
+		},
 		// 发送消息
-		send(){
-			if(this.textareaValue.trim().length<=0)return this.$message.info(`请输入内容`);
-
-			this.chatList.push({
+		send(_text = this.textareaValue) {
+			// 这里处理@的角色
+			return;
+			let _atRoleList = [];
+			let _roleList = [...this.roleList,...this.publicRoleList];
+			_roleList.forEach((i)=>{
+				if(_text.indexOf(`@${i.assistantName}`)!=-1){
+					_atRoleList.push(i)
+				}
+			})
+			if (_atRoleList.length > 0) {
+				let _oldText = _text;
+				_atRoleList.forEach(i=>_oldText = _text.replace(`@${i.assistantName}`,``))
+				console.log(_text);
+				console.log(_oldText)
+				//有@角色
+				console.log(_atRoleList);
+			} else {
+				//未@角色
+				let _uuid = uuidv4();
+				this.chatList.push({
 					role: "user",
-					name: "我",
-					create_at: new Date().toLocaleString().replace(/\//ig,'-'),
-					content: `${this.textareaValue}`,
-				},)
+					content: `${_text}`,
+					uid: _uuid,
+					AI: "AI",
+					aiContent: "",
+					oldContent: "",
+					isShowSynchronization: false,
+					filename: "",
+					index: this.chatList.length,
+					is_mind_map: false,
+					loading: true,
+				});
+				this.textareaValue = "";
+				this.scrollBottom();
+				// 连续对话设置
+				let _historyMessage = [];
+				// this.chatList.forEach(i=>{
 
-			this.textareaValue = "";
-			this.chatList.push({
-					role: "ai",
-					name: "AI助手",
-					create_at: new Date().toLocaleString().replace(/\//ig,'-'),
-					content:`您好呀，我有什么可以帮助您的吗`,
-				},)
+				// })
+				_historyMessage.push({role:'user',content:_text})
+				let params = JSON.stringify({
+          model: 'gpt-3.5-turbo',
+          temperature: 0,
+          max_tokens: 4096,
+          top_p: 1,
+          frequency_penalty: 0,
+          presence_penalty: 0,
+          messages: _historyMessage,
+          uid: _uuid,
+          mind_map_question: '',
+        });
+				this.ajax.post("https://gpt4.cocorobo.cn/chat",params).then(res=>{
+					if(res.data.FunctionResponse.result == '发送成功'){
+						this.getAiContent(_uuid);
+					}else{
+						this.$message.warning(response.data.FunctionResponse.result)
+					}
+				}).catch(e=>{
+					console.log(e)
+				})
 				
-				this.$nextTick(() => {
-					this.$refs.textareaRef.style.height = '50px'
-					this.$refs.tapeRef.$el.querySelector('.t-chartArea').scrollTop = this.$refs.tapeRef.$el.querySelector('.t-chartArea').scrollHeight;
-				});;
-		},
-		textareaChange(){
-			this.$refs.textareaRef.style.height = '50px'
-			this.$refs.textareaRef.style.height = this.$refs.textareaRef.scrollHeight+"px"
+				
+			}
 		},
+		getAiContent(_uid){
+			let _source = new EventSource(`https://gpt4.cocorobo.cn/stream/${_uid}`);
+			let _allText = "";
+			let _mdText = "";
+			// const md = new MarkdownIt()
+			_source.onmessage = (_e) =>{
+				this.chatList.find(i=>i.uid==_uid).loading = false;
+				if(_e.data.replace("'", '').replace("'", '') == '[DONE]'){//对话已经完成
+					_mdText = _mdText.replace("_",'');
+					_source.close();
+					this.chatList.find(i=>i.uid==_uid).aiContent = _mdText;
+					this.chatList.find(i=>i.uid==_uid).isalltext = true;
+					this.chatList.find(i=>i.uid==_uid).isShowSynchronization = true;
+					// 保存对话👇 #TODO保存对话
 
+
+					return;
+				}else{//对话还在继续
+					let _text = ""
+					_text = _e.data.replaceAll("'", '');
+					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.chatList.find(i=>i.uid==_uid).aiContent = _mdText;
+					this.scrollBottom();
+					// 处理流数据
+
+				}
+			}
+		},
+		getAtAuContent(_uid,_text,_headUrl,_assistantName){
+			console.log(_uid,_text,_headUrl,_assistantName)
+		},
+		textareaChange() {
+			if (this.textareaValue.at(-1) == "@") {
+				this.showRoleList = true;
+			}
+			this.$refs.textareaRef.style.height = "50px";
+			this.$refs.textareaRef.style.height =
+				this.$refs.textareaRef.scrollHeight + "px";
+			if (this.$refs.roleListRef) {
+				let roleListHeight =
+					this.$refs.textareaRef.scrollHeight >= 500
+						? 520
+						: this.$refs.textareaRef.scrollHeight + 20;
+				this.$refs.roleListRef.style["margin-bottom"] = "70px";
+				this.$refs.roleListRef.style["margin-bottom"] = roleListHeight + "px";
+				this.$refs.roleListRef.style["max-height"] = `calc(100vh - ${
+					roleListHeight + 160
+				}px)`;
+			}
+		},
+		// 滚动条触底
+		scrollBottom() {
+			this.$nextTick(() => {
+				this.textareaChange();
+				this.$refs.tapeRef.$el.querySelector(".t-chartArea").scrollTop =
+					this.$refs.tapeRef.$el.querySelector(".t-chartArea").scrollHeight;
+			});
+		},
+		// 点击了其他地方然后关闭角色列表
+		noShowRoleList() {
+			this.showRoleList = false;
+		},
 		convertToMp3(wavDataView) {
 			// 获取wav头信息
 			const wav = lamejs.WavHeader.readHeader(wavDataView); // 此处其实可以不用去读wav头信息，毕竟有对应的config配置
@@ -858,6 +1003,81 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 			}
 			return new Blob(buffer, { type: "audio/mp3" });
 		},
+		getRoleList() {
+			this.roleList = [];
+			let params = {
+				userId: "602def61-005d-11ee-91d8-005056b86db5",
+			};
+			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) => {
+					this.$message.error("获取角色列表失败");
+					this.roleList = [];
+				});
+		},
+		getPublicRoleList() {
+			this.publicRoleList = [];
+			let params = {
+				userId: "602def61-005d-11ee-91d8-005056b86db5",
+				organizeid: "45facc0a-1211-11ec-80ad-005056b86db5",
+			};
+			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);
+				});
+		},
+		// 选择了@的角色
+		choseRole(_data) {
+			let _lastAtIndex = this.textareaValue.lastIndexOf("@");
+			this.textareaValue = `${this.textareaValue.slice(0,_lastAtIndex)}@${_data.assistantName} `
+			this.$refs.textareaRef.focus();
+			this.showRoleList = false;
+		},
+		// 输入框键盘按下监听
+		textareaKeydown(_e){
+			if(this.showRoleList && this.choseRoleList.length>0){
+				switch(_e.keyCode){
+					case 38://小键盘上
+						_e.preventDefault();
+						if(this.roleListIndex==0)return;
+						this.roleListIndex--;
+						break;
+					case 40://小键盘下
+						_e.preventDefault();
+						if(this.roleListIndex==this.choseRoleList.length-1)return;
+						this.roleListIndex++;
+						break;
+					case 13://回车
+						_e.preventDefault();
+						this.choseRole(this.choseRoleList[this.roleListIndex]);
+						break;
+				}
+			}
+		},
+		getData() {
+			this.getRoleList();
+			this.getPublicRoleList();
+		},
+	},
+	mounted() {
+		this.getData();
 	},
 };
 </script>
@@ -1130,9 +1350,8 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 .ca-b-o-m-tapeTwo {
 	width: 100%;
 	height: 100%;
-	cursor: pointer;
 	display: flex;
-	justify-content: space-between;
+	justify-content: center;
 	align-items: center;
 	font-size: 20px;
 	color: #3681fc;
@@ -1169,7 +1388,7 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 	bottom: 0;
 }
 
-.ca-b-o-m-TapeArea{
+.ca-b-o-m-TapeArea {
 	width: 100%;
 	height: 100%;
 	display: flex;
@@ -1212,7 +1431,7 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 	/* justify-content: center; */
 	align-items: center;
 	box-sizing: border-box;
-	padding-left:  20px;
+	padding-left: 20px;
 }
 
 .ca-b-o-m-left > textarea {
@@ -1303,4 +1522,66 @@ Markdown表格Markdown表格Markdown表格Markdown表格Markdown表格Markdown
 	border-radius: 5px;
 	cursor: pointer;
 }
+.ca_b_o_m_roleList {
+	position: absolute;
+	left: 0;
+	width: 100%;
+	height: auto;
+	max-height: calc(100vh - 230px);
+	margin-bottom: 70px;
+	overflow: auto;
+	background-color: white;
+	border-radius: 10px;
+	box-sizing: border-box;
+	padding: 15px;
+}
+
+.ca_b_o_m_rl_item {
+	width: 100%;
+	height: auto;
+	margin-bottom: 15px;
+	background-color: #f3f7fd;
+	border-radius: 10px;
+	cursor: pointer;
+	transition: 0.3s;
+	box-sizing: border-box;
+	padding: 10px;
+}
+
+.ca_b_o_m_rl_item:hover {
+	background-color: #c3ddfa;
+}
+
+.ca_b_o_m_rl_itemActive{
+	background-color: #c3ddfa;
+}
+
+.ca_b_o_m_rl_i_left {
+	width: 50px;
+	height: 50px;
+	border-radius: 50%;
+	margin-right: 15px;
+}
+
+.ca_b-o_m_rl_i_top {
+	display: flex;
+}
+.ca_b-o_m_rl_i_top > div {
+	margin-left: 10px;
+}
+
+.ca_b-o_m_rl_i_top > div > span {
+	font-size: 14px;
+	margin-top: 5px;
+	color: #6b798e;
+}
+
+.ca_b-o_m_rl_i_bottom {
+	margin-top: 10px;
+	width: 90%;
+	overflow: hidden;
+	display: block;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
 </style>

src/components/pages/classroomObservation/components/messageArea.vue

@@ -21,6 +21,9 @@
 			<baseMessage
 				:data="bmData.jsonData"
 				:imageList="imageList.jsonData"
+				@saveData="saveBaseData"
+				@saveImage="saveBaseImage"
+				@delImage="delBaseImageList"
 				v-loading="baseMessageLoading"
 			/>
 
@@ -30,6 +33,7 @@
 				@delItem="delAnalysisItem"
 				@editItem="editAnalysisItem"
 				title="通用课堂分析"
+				:dialogTagDataList="dialogTagDataList"
 				:analysisItemList="dataList.filter((i) => i.Type === 0)"
 				:type="0"
 				:tid="tid"
@@ -42,6 +46,7 @@
 				@delItem="delAnalysisItem"
 				@editItem="editAnalysisItem"
 				title="科学课堂分析"
+				:dialogTagDataList="dialogTagDataList"
 				:analysisItemList="dataList.filter((i) => i.Type === 1)"
 				:type="1"
 				:tid="tid"
@@ -54,6 +59,7 @@
 				@delItem="delAnalysisItem"
 				@editItem="editAnalysisItem"
 				title="扩展分析"
+				:dialogTagDataList="dialogTagDataList"
 				:analysisItemList="dataList.filter((i) => i.Type === 2)"
 				:type="2"
 				:tid="tid"
@@ -66,6 +72,7 @@
 				@delItem="delAnalysisItem"
 				@editItem="editAnalysisItem"
 				title="增值性分析"
+				:dialogTagDataList="dialogTagDataList"
 				:analysisItemList="dataList.filter((i) => i.Type === 3)"
 				:type="3"
 				:tid="tid"
@@ -112,6 +119,7 @@
 						placeholder="请输入内容"
 						prefix-icon="el-icon-search"
 						v-model="input2"
+						clearable
 					>
 					</el-input>
 				</div>
@@ -153,9 +161,7 @@
 					<div style="display: flex; flex-wrap: wrap">
 						<div
 							class="a-d-b-item"
-							v-for="(item, index) in dialogTagDataList.filter(
-								(i) => i.type == tagIndex
-							)"
+							v-for="(item, index) in searchDataList"
 							:key="index"
 						>
 							<div class="a-d-b-i-top">
@@ -205,6 +211,7 @@ import baseMessage from "./baseMessage.vue"; //基本信息
 import analysis from "./analysis.vue";
 
 export default {
+	emits:["changeChatAreaAudioUrl"],
 	components: {
 		baseMessage,
 		// currencyAnalysis,
@@ -244,64 +251,87 @@ export default {
 				{
 					title: "OMO智慧课堂分析",
 					brief: "多维度分析课堂整体情况",
+					value: "4cc367c1-0076-11ef-aaca-12e77c4cb76b",
 					type: 0,
 				},
 				{
 					title: "教学阶段九事件分析",
 					brief: "使用加涅九事件分析教学环节",
+					value: "5e0466b3-0075-11ef-aaca-12e77c4cb76b",
 					type: 0,
 				},
 				{
 					title: "布鲁姆问题分类",
 					brief: "多维度分析课堂整体情况",
+					value: "eac63117-00a7-11ef-aaca-12e77c4cb76b",
 					type: 0,
 				},
 				{
 					title: "麦卡锡问题分类",
 					brief: "多维度分析课堂整体情况",
+					value: "18545cf7-0125-11ef-aaca-12e77c4cb76b",
 					type: 0,
 				},
 				{
 					title: "学生回答情况",
 					brief: "多维度分析课堂整体情况",
+					value: "d3f75199-eb4e-11ee-aaca-12e77c4cb76b",
 					type: 0,
 				},
-				{ title: "课堂时间分配", brief: "多维度分析课堂整体情况", type: 0 },
-				{ title: "师生互动分析", brief: "多维度分析课堂整体情况", type: 0 },
-				{ title: "教学模式分析", brief: "多维度分析课堂整体情况", type: 0 },
+				// {
+				// 	title: "课堂时间分配",
+				// 	brief: "多维度分析课堂整体情况",
+				// 	type: 0
+				// },
+				// {
+				// 	title: "师生互动分析",
+				// 	brief: "多维度分析课堂整体情况",
+				// 	type: 0
+				// },
+				// {
+				// 	title: "教学模式分析",
+				// 	brief: "多维度分析课堂整体情况",
+				// 	type: 0
+				// },
 				{
 					title: "课堂活动类型",
 					brief: "多维度分析课堂整体情况",
+					value: "41d2d2d4-0125-11ef-aaca-12e77c4cb76b",
 					type: 1,
 				},
 				{
 					title: "学科核心素养发展",
-					brief: "使用加涅九事件分析教学环节",
+					brief: "学科核心素养发展",
+					value: "b13a98de-0125-11ef-aaca-12e77c4cb76b",
 					type: 1,
 				},
 				{
 					title: "科学教育目标分析",
-					brief: "多维度分析课堂整体情况",
+					brief: "科学教育目标分析",
+					value: "b13a98de-0125-11ef-aaca-12e77c4cb76b",
 					type: 1,
 				},
 				{
 					title: "PORTAAL课堂观察",
-					brief: "使用加涅九事件分析教学环节",
+					brief: "PORTAAL课堂观察",
+					value: "8ab07d41-e143-11ee-aaca-12e77c4cb76b",
 					type: 1,
 				},
 				{
 					title: "5E课程改编",
-					brief: "多维度分析课堂整体情况",
+					brief: "5E课程改编",
+					value: "f757826e-0125-11ef-aaca-12e77c4cb76b",
 					type: 2,
 				},
 				{
 					title: "5EX课程改编",
-					brief: "使用加涅九事件分析教学环节",
+					brief: "5EX课程改编",
+					value: "0b6b08b7-0126-11ef-aaca-12e77c4cb76b",
 					type: 2,
 				},
 				{
-					title: "UTOP课程观察",
-					brief: "多维度分析课堂整体情况",
+					title: "UTOP课堂观察",
+					brief: "UTOP课堂观察",
 					value: "8e3a389b-014f-11ef-aaca-12e77c4cb76b",
 					type: 3,
 				},
@@ -318,9 +348,9 @@ export default {
 					type: 3,
 				},
 				{
-					title: "课堂质量评价",
-					brief: "多维度分析课堂整体情况",
-					value: "25e53379-0152-11ef-aaca-12e77c4cb76b",
+					title: "课程质量评价",
+					brief: "多维度分析课堂整体情况", 
+				 	value:"25e53379-0152-11ef-aaca-12e77c4cb76b",
 					type: 3,
 				},
 				{
@@ -332,7 +362,7 @@ export default {
 				{
 					title: "RTOP课堂观察",
 					brief: "多维度分析课堂整体情况",
-					value: "2ace7ff6-0154-11ef-aaca-12e77c4cb76b",
+					value: "a7107221-f7f5-11ee-aaca-12e77c4cb76b",
 					type: 3,
 				},
 			],
@@ -341,32 +371,45 @@ export default {
 			imageList: {},
 		};
 	},
+	computed: {
+		searchDataList() {
+			let _data = this.dialogTagDataList.filter((i) => i.type == this.tagIndex);
+			if (this.input2) {
+				return _data.filter((i) => i.title.indexOf(this.input2) > -1);
+			} else {
+				return _data;
+			}
+		},
+	},
 	methods: {
 		delAnalysisItem(id) {
 			let _index = this.dataList.findIndex((i) => i.id == id);
 			if (_index > -1) {
-				this.dataList.splice(_index, 1);
-				this.$message.success("删除成功");
+				let _data = this.dataList[_index];
+				let params = {
+					id: _data.id,
+					type: _data.Type,
+					tid: this.tid,
+				};
+				this.ajax
+					.post("https://gpt4.cocorobo.cn/delete_classroom_observation", params)
+					.then((res) => {
+						this.dataList.splice(_index, 1);
+						this.$message.success("删除成功");
+					})
+					.catch((e) => {
+						this.$message.error("删除失败");
+					});
 			} else {
 				this.$message.error("删除失败");
 			}
 		},
 		editAnalysisItem(id, _data) {
 			let _index = this.dataList.findIndex((i) => i.id == id);
-			if (_index > -1) {
+			if (_index != -1) {
 				this.dataList[_index] = _data;
-				if (this.dataList[_index].id) {
-					let pram2 = {
-						id: this.dataList[_index].id,
-						json_data: this.dataList[_index].json_data,
-					};
-					this.ajax.post(
-						"https://gpt4.cocorobo.cn/update_classroom_observation",
-						pram2
-					);
-				}
+				this.saveData(this.dataList[_index])
 				this.$forceUpdate();
-				this.$message.success("执行成功");
 			} else {
 				this.$message.info("执行错误");
 			}
@@ -397,177 +440,65 @@ export default {
 		addAnalysisItem(title) {
 			return new Promise((resolve, reject) => {
 				this.dialogVisible = false;
-				let assistant_id = {
-					课堂观察: { value: "8ab07d41-e143-11ee-aaca-12e77c4cb76b", type: 0 },
-					教学阶段九事件分析: {
-						value: "5e0466b3-0075-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					OMO智慧课堂分析: {
-						value: "4cc367c1-0076-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					布鲁姆问题分类: {
-						value: "eac63117-00a7-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					麦卡锡问题分类: {
-						value: "18545cf7-0125-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					学生回答统计: {
-						value: "2c6ede88-0125-11ef-aaca-12e77c4cb76b",
-						type: 0,
-					},
-					课堂活动类型: {
-						value: "41d2d2d4-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					素养目标分析: {
-						value: "b13a98de-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					科学教育目标分析: {
-						value: "d6cd48ab-0125-11ef-aaca-12e77c4cb76b",
-						type: 1,
-					},
-					"5E课程改编": {
-						value: "f757826e-0125-11ef-aaca-12e77c4cb76b",
-						type: 2,
-					},
-					"5EX课程改编": {
-						value: "0b6b08b7-0126-11ef-aaca-12e77c4cb76b",
-						type: 2,
-					},
-					UTOP课程观察: {
-						value: "8e3a389b-014f-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RST模型: {
-						value: "e649112e-0150-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RTOP模型: {
-						value: "68265b18-0151-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					课堂质量评价: {
-						value: "25e53379-0152-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					SCOP课堂观察: {
-						value: "d0c76d35-0152-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-					RTOP课堂观察: {
-						value: "2ace7ff6-0154-11ef-aaca-12e77c4cb76b",
-						type: 3,
-					},
-				};
-				let file_ids = {
-					"03": ["file-E8SvjCHbmhmjKczRWr11OuHx"],
-					"04": ["file-r5phg4I2oFqly4WpW7oOOTnA"],
-				};
+				let assistant = this.dialogTagDataList.find((i) => i.title == title);
+				
 				let parm = {
-					assistant_id: assistant_id[title] ? assistant_id[title].value : null,
+					assistant_id: assistant ? assistant.value : null,
 					message:
 						"请使用代码解析器获取文件，帮我根据要求完整的分析，输出请按照要求。",
 					session_name: new Date().getTime(),
 					userId: "1cf9dc4b-d95f-11ea-af4c-52540005ab01",
-					file_ids: this.fileId ? [this.fileId] : file_ids[this.tid],
+					file_ids: this.fileId,
 				};
 
 				if (!parm.assistant_id) {
 					resolve();
 					return this.$message.error("未找到对应的AI助手");
 				}
-				this.dataList.push({
-					id: assistant_id[title].value,
-					Type: assistant_id[title].type,
-					createTime: new Date(),
-					tId: this.tid,
-					tIndex: 2,
-					jsonData: {
-						dataFileList: [],
-						fileList: [],
-						fileList2: [],
-						name: title,
+				let newIndexData = this.dataList.filter((i) => i.Type == assistant.type).sort((a,b)=>new Date(a.createtime)-new Date(b.createtime))
+				newIndexData = newIndexData.length?newIndexData[newIndexData.length-1]:null;
+				let newIndex = newIndexData?newIndexData.tIndex+1:assistant.type==0?2:0;
+				let params = {
+					index: newIndex,
+					json_data: JSON.stringify({
+						name: assistant.title,
 						result: "",
-					},
-				});
+						fileList: [],
+						dataFileList: [],
+						content: "",
+					}),
+					tid: this.tid,
+					type: assistant.type.toString(),
+				};
 
-				if (assistant_id[title].type == 0) {
-					this.$refs.analysis0.getReport(
-						this.dataList.filter((i) => i.Type == 0).length - 1
-					);
-				} else if (assistant_id[title].type == 1) {
-					this.$refs.analysis1.getReport(
-						this.dataList.filter((i) => i.Type == 1).length - 1
-					);
-				} else if (assistant_id[title].type == 2) {
-					this.$refs.analysis1.getReport(
-						this.dataList.filter((i) => i.Type == 2).length - 1
-					);
-				} else if (assistant_id[title].type == 3) {
-					this.$refs.analysis1.getReport(
-						this.dataList.filter((i) => i.Type == 3).length - 1
-					);
-				}
-				this.$message.success("添加成功");
-				resolve();
-				// this.ajax
-				// 	.post("https://gpt4.cocorobo.cn/ai_agent_park_chat", parm)
-				// 	.then((res) => {
-				// 		let result = res.data.FunctionResponse;
-				// 		if(!result.message || result.message.indexOf('由于我无法直接访问您上传的文件内容')>-1){
-				// 			this.loading = false;
-				// 			resolve();
-				// 			return this.$message.error(`${title}无法生成`)
-				// 		}
-				// 		this.dataList.push({
-				// 			id:assistant_id[result.title].value,
-				// 			Type:assistant_id[result.title].type,
-				// 			createTime:new Date(),
-				// 			tId:this.tid,
-				// 			tIndex:2,
-				// 			jsonData:{
-				// 				dataFileList:[],
-				// 				fileList:[],
-				// 				fileList2:[],
-				// 				name:result.title,
-				// 				result:result.message
-				// 			}
-				// 		})
-				// 		resolve();
-				// 		this.loading = false;
-				// 	})
-				// 	.catch((e) => {
-				// 		this.$message.error(`${title}无法生成`)
-				// 		this.loading = false;
-				// 		resolve();
-				// 	});
+				// 这里调用添加
+				this.ajax
+					.post("https://gpt4.cocorobo.cn/insert_classroom_observation", params)
+					.then((res) => {
+						let _data = res.data.FunctionResponse;
+						if (_data.message && _data.message == "创建成功") {
+							let _result = JSON.parse(_data.result)[0];
+							_result.jsonData = JSON.parse(_result.jsonData);
+							this.dataList.push(_result);
+							if (_result.Type == 0) {
+								this.$refs.analysis0.getReport(_result.id);
+							} else if (_result.Type == 1) {
+								this.$refs.analysis1.getReport(_result.id);
+							} else if (_result.Type == 2) {
+								this.$refs.analysis2.getReport(_result.id);
+							} else if (_result.Type == 3) {
+								this.$refs.analysis3.getReport(_result.id);
+							}
+							this.$message.success("添加成功");
+							resolve();
+						} else {
+							this.$message.error("创建失败");
+						}
+					});
 			});
 		},
-		// getFileId() {
-		// 	let pram = {
-		// 		tid: this.tid,
-		// 		type: "10",
-		// 	};
-		// 	this.ajax
-		// 		.post("https://gpt4.cocorobo.cn/get_classroom_observation_new", pram)
-		// 		.then((res) => {
-		// 			let _data = res.data.FunctionResponse.result.length
-		// 				? JSON.parse(res.data.FunctionResponse.result)
-		// 				: [];
-		// 			this.$emit('updateFileIdid', _data[0].id)
-		// 			if(_data[0].jsonData !='' ){
-		// 				this.$emit("updateFileId", JSON.parse(_data[0].jsonData).file_ids)
-		// 			}else {
-		// 				this.$emit("updateFileId", '')
-		// 			}
-		// 		});
-		// },
 		getCurrencyAndBaseMessageData() {
+			if(!this.tid)return;
 			let pram = {
 				tid: this.tid,
 				// tid:'02',
@@ -599,14 +530,15 @@ export default {
 						? JSON.parse(res.data.FunctionResponse.result)
 						: [];
 					if (_data.length == 0) {
-						this.baseMessageLoading = false;
-						return (this.currencyLoading = false);
+						return this.insertBaseMessage().then(_=>{
+							this.getCurrencyAndBaseMessageData();
+						})
 					}
-					let _bmData = _data[0];
+					let _bmData = _data.find(i=>i.tIndex==0);
 					// 基础信息
 					_bmData.jsonData = JSON.parse(_bmData.jsonData);
 					// 图片
-					let _imageList = _data[1];
+					let _imageList = _data.find(i=>i.tIndex==1);
 					_imageList.jsonData = JSON.parse(_imageList.jsonData);
 					//通用分析
 					let currency = [];
@@ -619,11 +551,17 @@ export default {
 					this.dataList.push(...currency);
 					this.bmData = _bmData;
 					this.imageList = _imageList;
+					if(this.imageList.jsonData.fileList.length>0){
+						this.$emit("changeChatAreaAudioUrl",this.imageList.jsonData.fileList[0]);
+					}else{
+						this.$emit("changeChatAreaAudioUrl",{name:"",url:""});
+					}
 					this.baseMessageLoading = false;
 					this.currencyLoading = false;
 				});
 		},
 		getScienceData() {
+			if(!this.tid)return;
 			let pram = {
 				tid: this.tid,
 				// tid:'02',
@@ -650,6 +588,7 @@ export default {
 				});
 		},
 		getExtendData() {
+			if(!this.tid)return;
 			let pram = {
 				tid: this.tid,
 				// tid:'02',
@@ -676,6 +615,7 @@ export default {
 				});
 		},
 		getValueAddedData() {
+			if(!this.tid)return;
 			let pram = {
 				tid: this.tid,
 				// tid:'02',
@@ -709,57 +649,163 @@ export default {
 			this.getValueAddedData();
 			// this.getFileId();
 		},
-		saveData(fn) {
+		saveData(data) {
+			return new Promise((resolve,reject)=>{
+				this.ajax.post(
+						"https://gpt4.cocorobo.cn/update_classroom_observation",
+						{
+							id: data.id,
+							json_data: JSON.stringify(data.jsonData),
+						}
+					).then(res=>{
+						resolve();
+					})
+			})
 			// return;
-			let saveDataList = [];
+			// let saveDataList = [];
 
-			// 保存基础信息
-			saveDataList.push({
-				id: this.bmData.id,
-				json_data: JSON.stringify(this.bmData.jsonData),
-			});
+			// // 保存基础信息
+			// saveDataList.push({
+			// 	id: this.bmData.id,
+			// 	json_data: JSON.stringify(this.bmData.jsonData),
+			// });
 
-			// 所有分析
-			this.dataList.forEach((i1) => {
-				i1.forEach((i2) => {
-					saveDataList.push({
-						id: i2.id,
-						json_data: JSON.stringify(i2.jsonData),
-					});
-				});
-			});
-			let promises = [];
-			saveDataList.forEach((i) => {
-				promises.push(
-					new Promise((resolve) => {
-						let pram = {
-							id: i.id,
-							json_data: i.json_data,
-						};
-						this.ajax
-							.post(
-								"https://gpt4.cocorobo.cn/update_classroom_observation",
-								pram
-							)
-							.then((res) => {
-								console.log(res);
-								resolve();
-							});
-					})
-				);
-			});
+			// // 所有分析
+			// this.dataList.forEach((i1) => {
+			// 	i1.forEach((i2) => {
+			// 		saveDataList.push({
+			// 			id: i2.id,
+			// 			json_data: JSON.stringify(i2.jsonData),
+			// 		});
+			// 	});
+			// });
+			// let promises = [];
+			// saveDataList.forEach((i) => {
+			// 	promises.push(
+			// 		new Promise((resolve) => {
+			// 			let pram = {
+			// 				id: i.id,
+			// 				json_data: i.json_data,
+			// 			};
+			// 			this.ajax
+			// 				.post(
+			// 					"https://gpt4.cocorobo.cn/update_classroom_observation",
+			// 					pram
+			// 				)
+			// 				.then((res) => {
+			// 					console.log(res);
+			// 					resolve();
+			// 				});
+			// 		})
+			// 	);
+			// });
 
-			Promise.all(promises).then((res) => {
-				this.$message.success("保存成功");
-				fn ? fn() : "";
+			// Promise.all(promises).then((res) => {
+			// 	this.$message.success("保存成功");
+			// 	fn ? fn() : "";
+			// });
+		},
+		saveBaseData(){
+			this.bmData.json_data = JSON.stringify(this.bmData.jsonData);
+			this.saveData(this.bmData)
+		},
+		saveBaseImage(newImage){
+			if(this.imageList.jsonData.fileList1.length==0){
+				this.imageList.jsonData.fileList1.push(newImage);
+			}else if(this.imageList.jsonData.fileList2.length==0){
+				this.imageList.jsonData.fileList2.push(newImage)
+			}else if(this.imageList.jsonData.fileList3.length==0){
+				this.imageList.jsonData.fileList3.push(newImage)
+			}else{
+				this.$message.error("最多只能上传3张图片");
+				return;
+			}
+			this.imageList.json_data = JSON.stringify(this.imageList.jsonData);
+			this.saveData(this.imageList);
+		},
+		delBaseImageList(key){
+			this.imageList.jsonData[key] = [];
+			this.imageList.json_data = JSON.stringify(this.imageList.jsonData);
+			this.saveData(this.imageList).then(res=>{
+				this.$message.success("删除图片成功")
 			});
 		},
+		// 切换录音文件
+		changeAudioUrl(data){
+			this.imageList.jsonData.fileList = [];
+			let audio = {
+				name:data.key,
+				status:"success",
+				uid:"1",
+				url:data.Location
+			}
+			this.imageList.jsonData.fileList.push(audio)
+			this.saveData(this.imageList).then(res=>{
+				this.$message.success("更换录文件成功");
+				this.$emit("changeChatAreaAudioUrl",audio);
+			})
+		},
 		getReport() {
 			this.$refs.analysis0.getReport();
 			this.$refs.analysis1.getReport();
 			this.$refs.analysis2.getReport();
 			this.$refs.analysis3.getReport();
 		},
+		insertBaseMessage() {
+			return new Promise((resolve, reject) => {
+				// 添加基础信息
+				let params = {
+					index: "0",
+					json_data: JSON.stringify({
+						courseName: "",
+						studentNum: "0",
+						subject: "",
+						textbook: "",
+						classroom_resources: "",
+						activity_structure: "",
+						activity_methods: "",
+						name: "",
+					}),
+					tid: this.tid,
+					type: "0",
+				};
+				// 添加课堂图片
+				let params2 = {
+					index: "1",
+					tid: this.tid,
+					type: "0",
+					json_data: JSON.stringify({
+						fileList: [],
+						name: "课堂记录",
+						fileList1: [],
+						fileList2: [],
+						fileList3: [],
+					}),
+				};
+				this.ajax
+					.post("https://gpt4.cocorobo.cn/insert_classroom_observation", params)
+					.then((res) => {
+						let _data = res.data.FunctionResponse;
+						if (_data.message && _data.message == "创建成功") {
+							this.ajax
+								.post(
+									"https://gpt4.cocorobo.cn/insert_classroom_observation",
+									params2
+								)
+								.then((res2) => {
+									let _data2 = res2.data.FunctionResponse;
+									if (_data2.message && _data2.message == "创建成功") {
+									} else {
+										this.$message.error("创建课堂图片失败");
+									}
+									resolve();
+								});
+						} else {
+							this.$message.error("创建基础信息失败");
+						}
+					})
+			});
+		},
 	},
 	mounted() {
 		this.getData();

src/components/pages/classroomObservation/components/tape.vue

@@ -92,7 +92,7 @@
 									@click="copyContent(item.content)"
 								/>
 							</div>
-							<div class="t_ca_b_u_c_m_right" v-html="contentValue(item.content)"></div>
+							<div class="t_ca_b_u_c_m_right" v-html="item.content"></div>
 						</div>
 						<div class="t_ca_b_u_c_time">{{ item.create_at }}</div>
 					</div>
@@ -154,14 +154,14 @@ export default {
 	},
 	computed:{
 		contentValue(){
-			return (text)=>{
-				let newText = text;
-				this.aiNameList.forEach(i=>{
-					const regex = new RegExp(`@(${i.name})`,"g");
-					newText = newText.replace(regex,`<span class='atName'>@$1</span>`);
-				})
-				return newText;
-			}
+			// return (text)=>{
+			// 	let newText = text;
+			// 	this.aiNameList.forEach(i=>{
+			// 		const regex = new RegExp(`@(${i.name})`,"g");
+			// 		newText = newText.replace(regex,`<span class='atName'>@$1</span>`);
+			// 	})
+			// 	return newText;
+			// }
 		},
 	},
 	methods: {
@@ -357,7 +357,7 @@ export default {
 
 .t-chartArea {
 	width: 100%;
-	height: calc(100vh - 290px);
+	height: calc(100vh - 280px);
 	overflow: auto;
 }
 

src/components/pages/classroomObservation/components/transcription.vue

@@ -67,7 +67,7 @@ export default {
 .transcription {
 	width: 100%;
 	height: 100%;
-	max-height: calc(100% - 290px);
+	max-height: calc(100% - 280px);
 	/* display: flex; */
 	/* flex-direction: column; */
 	/* overflow: auto; */

src/components/pages/classroomObservation/index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="classroomObservation" v-loading="loading">
-    <!-- <div class="co-header1">
+	<div class="classroomObservation" v-loading="loading">
+		<!-- <div class="co-header1">
 			<div class="co-h1-left">
 				<span class="co-h1-l-icon el-icon-s-home"></span>
 				<div class="co-h1-l-router">
@@ -10,80 +10,92 @@
 				 </div>
 			</div>
 		</div> -->
-    <div class="co-header2">
-      <div class="co-h2-left">
-        <span class="co-h2-l-icon" @click="$refs.addNewCourseDialogRef.open()"></span>
-        <span class="co-h2-l-hr"></span>
-        <span class="co-h2-l-text">
-          <el-select
-            class="co_h2_l_t_select"
-            v-model="tid"
-            placeholder="请选择"
-            @change="changeTid"
-          >
-            <el-option
-              v-for="item in optionData"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
-            </el-option>
-          </el-select>
-        </span>
-      </div>
-      <div class="co-h2-right">
-        <div
-          class="co-h2-r-btn co-h2-r-blueBtn"
-          style="background: rgba(54, 129, 252, 1)"
-          @click.stop="getReport()"
-        >
-          <span class="co-h2-r-b-icon1"></span>
-          <div>生成报告</div>
-        </div>
-        <div class="co-h2-r-btn2" @click.stop="preview()">
-          <!-- <span class="co-h2-r-b-icon2"></span> -->
-          <img
-            src="../../../assets/icon/classroomObservation/Syan.png"
-            alt=""
-          />
-          <!-- <div>预览</div> -->
-        </div>
-        <div class="co-h2-r-btn2" @click.stop="shareBtn">
-          <!-- <span class="co-h2-r-b-icon3"></span> -->
-          <img
-            src="../../../assets/icon/classroomObservation/daoChu.png"
-            alt=""
-          />
-          <!-- <div>分享</div> -->
-        </div>
-      </div>
-    </div>
-    <div class="co-main">
-      <div class="co-m-left">
-        <chatArea
-          :tid="tid"
-          @updateFileId="updateFileId"
-          :fileIdid="fileIdid"
-        />
-      </div>
-      <div class="co-m-right">
-        <messageArea
-          :tid="tid"
-          :fileId="fileId"
-          ref="messageAreaRef"
-          @updateFileId="updateFileId"
-          @updateFileIdid="updateFileIdid"
-        />
-      </div>
-    </div>
-    <sharePdf
-      :dialogVisibleShare="dialogVisibleShare"
-      @shareBtn="shareBtn"
-    ></sharePdf>
-      
-
-		<addNewCourseDialog ref="addNewCourseDialogRef" @success="addNewCourse"/>
-  </div>
+		<div class="co-header2">
+			<div class="co-h2-left">
+				<span
+					class="co-h2-l-icon"
+					@click="$refs.addNewCourseDialogRef.open()"
+				></span>
+				<span class="co-h2-l-hr"></span>
+				<span class="co-h2-l-text">
+					<el-select
+						class="co_h2_l_t_select"
+						v-model="tid"
+						placeholder="请选择"
+						@change="changeTid"
+					>
+						<el-option
+							v-for="item in optionData"
+							:key="item.value"
+							:label="item.label"
+							:value="item.value"
+						>
+						</el-option>
+					</el-select>
+				</span>
+				<div
+					class="co_h2_l_del"
+					@click.stop="delCourse()"
+					v-if="optionData.length > 0"
+				>
+					<span></span>
+				</div>
+			</div>
+			<div class="co-h2-right">
+				<div
+					class="co-h2-r-btn co-h2-r-blueBtn"
+					style="background: rgba(54, 129, 252, 1)"
+					@click.stop="getReport()"
+				>
+					<span class="co-h2-r-b-icon1"></span>
+					<div>生成报告</div>
+				</div>
+				<div class="co-h2-r-btn2" @click.stop="preview()">
+					<!-- <span class="co-h2-r-b-icon2"></span> -->
+					<img
+						src="../../../assets/icon/classroomObservation/Syan.png"
+						alt=""
+					/>
+					<!-- <div>预览</div> -->
+				</div>
+				<div class="co-h2-r-btn2" @click.stop="shareBtn">
+					<!-- <span class="co-h2-r-b-icon3"></span> -->
+					<img
+						src="../../../assets/icon/classroomObservation/daoChu.png"
+						alt=""
+					/>
+					<!-- <div>分享</div> -->
+				</div>
+			</div>
+		</div>
+		<div class="co-main">
+			<div class="co-m-left">
+				<chatArea
+					ref="chatAreaRef"
+					:tid="tid"
+					@updateFileId="updateFileId"
+					@changeAudioUrl="changeAudioUrl"
+					:fileId="fileId"
+					:fileIdId="fileIdId"
+				/>
+			</div>
+			<div class="co-m-right">
+				<messageArea
+					:tid="tid"
+					:fileId="fileId"
+					ref="messageAreaRef"
+					@changeAudioUrl="changeAudioUrl"
+					@changeChatAreaAudioUrl="changeChatAreaAudioUrl"
+				/>
+			</div>
+		</div>
+		<sharePdf
+			:dialogVisibleShare="dialogVisibleShare"
+			@shareBtn="shareBtn"
+		></sharePdf>
+
+		<addNewCourseDialog ref="addNewCourseDialogRef" @success="addNewCourse" />
+	</div>
 </template>
 
 <script>
@@ -92,117 +104,206 @@ import chatArea from "./components/chatArea.vue";
 // 信息区域
 import messageArea from "./components/messageArea.vue";
 
-import sharePdf from './components/sharePdf.vue'
+import sharePdf from "./components/sharePdf.vue";
 // 添加课程弹窗
 import addNewCourseDialog from "./components/addNewCourseDialog.vue";
 export default {
-  components: {
-    chatArea,
-    messageArea,
-    sharePdf,
-		addNewCourseDialog
-  },
-  data() {
-    return {
-      title: "12月19日会议录音",
-      loading: false,
-      dialogVisibleShare: false,
-      tid: "03",
-      fileId: "",
-      fileIdid: "",
-      optionData: [
-        { label: "03课程", value: "03" },
-        { label: "04课程", value: "04" }
-      ]
-    };
-  },
-  methods: {
-    //切换了课堂
-    changeTid(newValue) {
-      // console.log(this.tid)
-      // console.log(newValue)
-      this.$nextTick(() => {
-        this.$refs.messageAreaRef.getData();
-      });
-		},
-		addNewCourse(form){
-			console.log("👇")
-			console.log(form)
-			this.optionData.push({
-				label:form.name,
-				value:form.no,
-			})
-			this.tid = form.no;
-			this.$nextTick(()=>{
+	components: {
+		chatArea,
+		messageArea,
+		sharePdf,
+		addNewCourseDialog,
+	},
+	data() {
+		return {
+			title: "12月19日会议录音",
+			loading: false,
+			dialogVisibleShare: false,
+			tid: "",
+			fileId: "",
+			fileIdId: "",
+			optionData: [
+				{ label: "03课程", value: "03" },
+				{ label: "04课程", value: "04" },
+				{ label: "05课程", value: "05" },
+			],
+		};
+	},
+	methods: {
+		//切换了课堂
+		changeTid(newValue) {
+			this.$nextTick(() => {
 				this.$refs.messageAreaRef.getData();
+				this.getFileIdId();
+			});
+		},
+		addNewCourse(form) {
+			let params = {
+				tid: form.no,
+			};
+			this.ajax
+				.post(
+					"https://gpt4.cocorobo.cn/insert_classroom_observation_tid",
+					params
+				)
+				.then((res) => {
+					let _data = res.data.FunctionResponse;
+					if (_data.message == "创建成功") {
+						this.optionData.push({
+							label: `${form.no}课程`,
+							value: form.no,
+						});
+						this.tid = form.no;
+						this.$nextTick(() => {
+							this.$refs.messageAreaRef.getData();
+							this.getFileIdId();
+						});
+					} else {
+						this.$message.error("创建失败");
+					}
+				});
+		},
+		updateFileId(newValue) {
+			this.fileId = newValue;
+		},
+		// 生成报告
+		getReport() {
+			this.$refs.messageAreaRef.getReport();
+			// let assistant_title = [
+			// 	"课堂观察",
+			// 	"教学阶段九事件分析",
+			// 	"OMO智慧课堂分析",
+			// 	"布鲁姆问题分类",
+			// 	"麦克锡问题分类",
+			// 	"学生回答统计",
+			// 	"课堂活动类型",
+			// 	"素养目标分析",
+			// 	"科学教育目标分析",
+			// 	"5E课程改编",
+			// 	"5EX课程改编",
+			// 	"UTOP课程观察",
+			// 	"RST模型",
+			// 	"RTOP模型",
+			// 	"课堂质量评价",
+			// 	"scop课堂观察",
+			// 	"rtop课堂观察",
+			// ]
+			// let _index = 0;
+			// let _this = this;
+			// function addValue(){
+			// 	_this.$refs.messageAreaRef.addAnalysisItem({title:assistant_title[_index]}).then(_=>{
+			// 		_index+=1;
+			// 		if(_index<assistant_title.length){
+			// 				addValue()
+			// 		}
+			// 	}).catch(_=>{
+			// 		_index+=1;
+			// 		if(_index<assistant_title.length){
+			// 			addValue()
+			// 		}
+			// 	})
+			// }
+			// addValue()
+		},
+		//预览
+		preview() {
+			window.parent.postMessage(
+				{
+					tools: "classroom_observation_board",
+					type: this.tid,
+				},
+				"*"
+			);
+		},
+		// 分享
+		shareBtn() {
+			this.dialogVisibleShare = !this.dialogVisibleShare;
+		},
+		delCourse() {
+			this.$confirm("此操作将永久删除该课程, 是否继续?", "提示", {
+				confirmButtonText: "确定",
+				cancelButtonText: "取消",
+				type: "warning",
 			})
-
-    },
-    updateFileId(newValue) {
-      this.fileId = newValue;
-    },
-    updateFileIdid(newValue) {
-      this.fileIdid = newValue;
-    },
-    // 跳转
-    goTo(path) {
-      this.$message.info(`去到：${path}`);
-    },
-    // 生成报告
-    getReport() {
-      this.$refs.messageAreaRef.getReport();
-      // let assistant_title = [
-      // 	"课堂观察",
-      // 	"教学阶段九事件分析",
-      // 	"OMO智慧课堂分析",
-      // 	"布鲁姆问题分类",
-      // 	"麦克锡问题分类",
-      // 	"学生回答统计",
-      // 	"课堂活动类型",
-      // 	"素养目标分析",
-      // 	"科学教育目标分析",
-      // 	"5E课程改编",
-      // 	"5EX课程改编",
-      // 	"UTOP课程观察",
-      // 	"RST模型",
-      // 	"RTOP模型",
-      // 	"课堂质量评价",
-      // 	"scop课堂观察",
-      // 	"rtop课堂观察",
-      // ]
-      // let _index = 0;
-      // let _this = this;
-      // function addValue(){
-      // 	_this.$refs.messageAreaRef.addAnalysisItem({title:assistant_title[_index]}).then(_=>{
-      // 		_index+=1;
-      // 		if(_index<assistant_title.length){
-      // 				addValue()
-      // 		}
-      // 	}).catch(_=>{
-      // 		_index+=1;
-      // 		if(_index<assistant_title.length){
-      // 			addValue()
-      // 		}
-      // 	})
-      // }
-      // addValue()
-    },
-    //预览
-    preview() {
-      window.parent.postMessage(
-        {
-          tools: "classroom_observation_board",
-          type: this.tid
-        },
-        "*"
-      );
-    },
-    // 分享
-    shareBtn() {
-      
-      this.dialogVisibleShare = !this.dialogVisibleShare;
-    }
-  }
+				.then(() => {
+					this.optionData.splice(
+						this.optionData.findIndex((item) => item.value == this.tid),
+						1
+					);
+					this.tid = this.optionData[0] ? this.optionData[0].value : "";
+					this.changeTid(this.tid);
+					this.$message({
+						type: "success",
+						message: "删除成功!",
+					});
+				})
+				.catch(() => {});
+		},
+		// 获取修改fileId的ID
+		getFileIdId() {
+			if (!this.tid) return;
+			let pram = {
+				tid: this.tid,
+				type: "10",
+			};
+			this.fileIdId = "";
+			this.fileId = "";
+			this.ajax
+				.post("https://gpt4.cocorobo.cn/get_classroom_observation_new", pram)
+				.then((res) => {
+					let _data = res.data.FunctionResponse.result.length
+						? JSON.parse(res.data.FunctionResponse.result)
+						: [];
+					if (_data.length <= 0) return;
+					this.fileIdId = _data[0].id;
+					if (_data[0].jsonData != "") {
+						this.fileId = JSON.parse(_data[0].jsonData).file_ids;
+					} else {
+						this.fileId = "";
+					}
+				});
+		},
+		// 切换录音文件
+		changeAudioUrl(data) {
+			this.$refs.messageAreaRef.changeAudioUrl(data);
+		},
+		changeChatAreaAudioUrl(data) {
+			this.$refs.chatAreaRef.changeAudioUrl(data.url);
+		},
+		getCourseList() {
+			return new Promise((resolve, reject) => {
+				this.ajax
+					.post("https://gpt4.cocorobo.cn/get_classroom_observation_all")
+					.then((res) => {
+						let _data = res.data.FunctionResponse.result;
+						let _result = _data ? JSON.parse(_data) : [];
+						if (_result.length <= 0) return;
+						let _optionData = _result.map((item) => {
+							item.jsonData = item.jsonData ? JSON.parse(item.jsonData) : {};
+							return {
+								label: item.jsonData.courseName,
+								value: item.tId,
+							};
+						});
+						_optionData = _optionData.filter(
+							(i) => i.label != "" && i.tId != ""
+						);
+						this.optionData = _optionData;
+						if(this.optionData.length>0){
+							this.tid = this.optionData[0].value;
+						}
+						resolve();
+						
+					});
+			});
+		},
+	},
+	mounted() {
+		this.getCourseList().then((_) => {
+			this.getFileIdId();
+			this.$refs.messageAreaRef.getData();
+		});
+	},
 };
 </script>
 
@@ -217,147 +318,147 @@ export default {
 }
 
 .co-header1 {
-  width: 100%;
-  height: 46px;
-  background-color: #060e17;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  box-sizing: border-box;
-  padding: 0 20px;
+	width: 100%;
+	height: 46px;
+	background-color: #060e17;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	box-sizing: border-box;
+	padding: 0 20px;
 }
 
 .co-h1-left {
-  width: auto;
-  height: 22px;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  padding: 0 20px;
+	width: auto;
+	height: 22px;
+	display: flex;
+	align-items: center;
+	box-sizing: border-box;
+	padding: 0 20px;
 }
 
 .co-h1-l-icon {
-  color: #5d6268;
-  width: 16px;
-  height: 16px;
-  margin-right: 10px;
+	color: #5d6268;
+	width: 16px;
+	height: 16px;
+	margin-right: 10px;
 }
 
 .co-h1-l-router {
-  display: flex;
-  align-items: center;
-  color: white;
-  font-size: 14px;
+	display: flex;
+	align-items: center;
+	color: white;
+	font-size: 14px;
 }
 
 .co-h1-l-router > span {
-  margin: 0 5px;
+	margin: 0 5px;
 }
 
 .co-h1-l-r-up {
-  color: #5d6268;
-  cursor: pointer;
+	color: #5d6268;
+	cursor: pointer;
 }
 
 .co-h1-l-r-up:hover {
-  color: white;
+	color: white;
 }
 
 .co-j1-l-r-down {
-  cursor: pointer;
+	cursor: pointer;
 }
 
 .co-h1-l-r-rightIcon {
-  font-size: 16px;
-  color: #5d6268;
+	font-size: 16px;
+	color: #5d6268;
 }
 
 .co-header2 {
-  width: 100%;
-  height: 42px;
-  min-height: 42px;
-  max-height: 42px;
-  background-color: white;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  box-sizing: border-box;
-  padding: 0 20px;
+	width: 100%;
+	height: 42px;
+	min-height: 42px;
+	max-height: 42px;
+	background-color: white;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	box-sizing: border-box;
+	padding: 0 20px;
 }
 
 .co-h2-left {
-  width: auto;
-  height: 22px;
-  display: flex;
-  align-items: center;
-  font-size: 14px;
+	width: auto;
+	height: 22px;
+	display: flex;
+	align-items: center;
+	font-size: 14px;
 }
 
 .co-h2-l-icon {
-  width: 20px;
-  height: 20px;
-  position: relative;
-  background: url("../../../assets/icon/classroomObservation/close.png")
-    no-repeat;
+	width: 20px;
+	height: 20px;
+	position: relative;
+	background: url("../../../assets/icon/classroomObservation/close.png")
+		no-repeat;
 	transform: rotate(45deg);
 	cursor: pointer;
-		background-size: 100% 100%;
+	background-size: 100% 100%;
 }
 .co-h2-l-hr {
-  width: 2px;
-  height: 20px;
-  background-color: #e7e7e7;
-  border-radius: 10px;
-  margin: 0 10px;
+	width: 2px;
+	height: 20px;
+	background-color: #e7e7e7;
+	border-radius: 10px;
+	margin: 0 10px;
 }
 
 .co-h2-right {
-  width: auto;
-  height: 100%;
-  display: flex;
-  align-items: center;
+	width: auto;
+	height: 100%;
+	display: flex;
+	align-items: center;
 }
 
 .co-h2-r-btn {
-  width: auto;
-  box-sizing: border-box;
-  padding: 0 10px;
-  height: 30px;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  font-size: 14px;
-  margin: 0 10px;
-  box-sizing: border-box;
-  border: 1px solid rgba(134, 179, 253, 1);
-  /* border: solid 1px #3681FC; */
-  border-radius: 5px;
+	width: auto;
+	box-sizing: border-box;
+	padding: 0 10px;
+	height: 30px;
+	display: flex;
+	align-items: center;
+	cursor: pointer;
+	font-size: 14px;
+	margin: 0 10px;
+	box-sizing: border-box;
+	border: 1px solid rgba(134, 179, 253, 1);
+	/* border: solid 1px #3681FC; */
+	border-radius: 5px;
 }
 .co-h2-r-btn2 {
-  width: auto;
-  box-sizing: border-box;
-  padding: 10px;
-  height: 30px;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  margin: 0 10px;
-  box-sizing: border-box;
-  border-radius: 5px;
-  box-shadow: 0px 4px 10px 0px rgba(29, 57, 131, 0.08);
-
-  /* box-shadow: 1px 1px 20px 4px rgba(29, 57, 131, 0.05); */
+	width: auto;
+	box-sizing: border-box;
+	padding: 10px;
+	height: 30px;
+	display: flex;
+	align-items: center;
+	cursor: pointer;
+	margin: 0 10px;
+	box-sizing: border-box;
+	border-radius: 5px;
+	box-shadow: 0px 4px 10px 0px rgba(29, 57, 131, 0.08);
+
+	/* box-shadow: 1px 1px 20px 4px rgba(29, 57, 131, 0.05); */
 }
 
 .co-h2-r-btn > span:nth-child(1) {
-  width: 20px;
-  height: 20px;
-  margin-right: 8px;
+	width: 20px;
+	height: 20px;
+	margin-right: 8px;
 }
 
 .co-h2-r-b-icon1 {
-  background: url("../../../assets/icon/classroomObservation/six.png") no-repeat;
-  background-size: 100% 100%;
+	background: url("../../../assets/icon/classroomObservation/six.png") no-repeat;
+	background-size: 100% 100%;
 }
 
 /* .co-h2-r-b-icon2 {
@@ -372,39 +473,64 @@ export default {
 } */
 
 .co-h2-r-blueBtn {
-  background: rgba(134, 179, 253, 1);
+	background: rgba(134, 179, 253, 1);
 
-  color: white;
+	color: white;
 }
 
 .co-main {
-  width: 100%;
-  flex: 1;
-  display: flex;
+	width: 100%;
+	flex: 1;
+	display: flex;
 
-  /* align-items: center; */
-  /* justify-content: center; */
+	/* align-items: center; */
+	/* justify-content: center; */
 }
 
 .co-m-left {
-  box-sizing: border-box;
-  flex: 1;
-  min-width: 650px;
+	box-sizing: border-box;
+	flex: 1;
+	min-width: 650px;
 }
 
 .co-m-right {
-  height: 100%;
-  flex: 1;
-  box-sizing: border-box;
-  min-width: 450px;
+	height: 100%;
+	flex: 1;
+	box-sizing: border-box;
+	min-width: 450px;
 
-  overflow: auto;
+	overflow: auto;
 }
 
 .co_h2_l_t_select >>> .el-input__inner {
-  border: none;
+	border: none;
 }
 .co_h2_l_t_select >>> .el-input__suffix {
-  display: none;
+	display: none;
+}
+
+.co_h2_l_del {
+	width: 35px;
+	height: 35px;
+	margin-left: 10px;
+	border-radius: 5px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	cursor: pointer;
+}
+
+.co_h2_l_del > span {
+	width: 20px;
+	height: 20px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background: url("../../../assets/icon/classroomObservation/del.png") no-repeat;
+	background-size: 100% 100%;
+}
+
+.co_h2_l_del:hover {
+	background-color: #eaeef1;
 }
 </style>