SanHQin 10 months ago
parent
commit
30e6d87f46

BIN
src/assets/icon/classroomObservation/bmRefresh.png


+ 124 - 3
src/components/pages/classroomObservation/components/baseMessage.vue

@@ -229,6 +229,48 @@
 					</div>
 				</div>
 			</div>
+			<!-- <div class="nephogramArea">
+				<div class="fl_nephogram">
+					<div class="imgTit">
+						<span>词云图</span>
+						<span></span>
+					</div>
+					<div class="m-m-formImage" v-loading="uploadNephogramLoading">
+								<div
+									class="m-m-fi-nephogramItem"
+									style="width:100%;"
+									v-if="!imageList.videoList.length==0"
+									v-for="(item, index) in imageList.NephogramList?imageList.NephogramList:[]"
+									:key="index"
+								>
+								
+									<span @click.stop="delNephogram('NephogramList')"></span>
+								</div>
+							<div
+								class="m-m-fi-nephogramItem"
+								@click.stop="addNephogram()"
+								style="width:23.5%;max-height: 100px;"
+								v-if="((imageList.NephogramList&&imageList.NephogramList.length<=0) || !imageList.NephogramList)"
+							>
+								<img
+									:src="require('../../../../assets/icon/classroomObservation/bmRefresh.png')"
+									alt=""
+									style="width:20px"
+								/>
+								<div
+									style="
+										font-size: 12px;
+										font-weight: 400;
+										margin-top: 5px;
+										color: rgba(0, 0, 0, 0.4);
+									"
+								>
+									生成词云图
+								</div>
+							</div>
+					</div>
+				</div>
+			</div> -->
 		</div>
 		<previewVideoDialog ref="previewVideoDialogRef"/>
 	</div>
@@ -271,6 +313,7 @@ export default {
 			showMain: true,
 			uploadImageLoading: false,
 			uploadVideoLoading:false,
+			uploadNephogramLoading:false,
 			from: {
 				courseName: "",
 				teacherName: "",
@@ -450,7 +493,10 @@ export default {
 				}
 			};
 		},
-
+		//添加云图
+		addNephogram(){
+			this.$message.info("生成词云图")
+		},
 		// 删除图片
 		delImage(key) {
 			this.$confirm("确定删除该图片吗?", "提示", {
@@ -473,6 +519,18 @@ export default {
 				console.log("取消删除")
 			});
 		},
+		//删除词云图
+		delNephogram(key){
+			this.$confirm("确定删除该词云图吗?", "提示", {
+				confirmButtonText: "确定",
+				cancelButtonText: "取消",
+				type: "warning",
+			}).then(() => {
+				this.$emit("delImage", key);
+			}).catch(e=>{
+				console.log("取消删除")
+			});
+		},
 		changeShowMain(newValue) {
 			this.showMain = newValue;
 		},
@@ -636,6 +694,7 @@ export default {
 	background-color: rgba(238, 238, 238, 1);
 	width: 140px;
 	height: 100px;
+	min-width: 110px !important;
 	margin-right: 1%;
 	display: flex;
 	justify-content: center;
@@ -715,9 +774,22 @@ export default {
 }
 
 .fl_video{
-	width: 48.5%;
-	margin-left: 1.5%;
+	width: 48.4%;
+	margin-left: 1.6%;
+	height: auto;
+
+}
+
+.nephogramArea{
+	width: 100%;
+	height: auto;
+}
+
+.fl_nephogram{
+	width: 50%;
+	/* margin-left: 1.5%; */
 	height: auto;
+	margin-top: -2%;
 }
 
 
@@ -757,4 +829,53 @@ export default {
 	max-width: 100%;
 	height: 100%;
 }
+
+.m-m-fi-nephogramItem{
+	width: auto;
+	height: auto;
+	background-color: rgba(238, 238, 238, 1);
+	width: 100%;
+	height: 250px;
+	margin-right: 1%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-direction: column;
+	box-sizing: border-box;
+	font-size: 14px;
+	cursor: pointer;
+	position: relative;
+	margin-bottom: 10px;
+}
+.m-m-fi-nephogramItem> .itemUrl {
+	width: 100%;
+	height: 100%;
+}
+
+.m-m-fi-imageItem > span {
+	width: 20px;
+	height: 20px;
+	position: absolute;
+	right: 4px;
+	top: 4px;
+	background-image: url("../../../../assets/icon/classroomObservation/delFile.svg");
+	background-repeat: no-repeat;
+	background-size: 100% 100%;
+	display: none;
+	/* display: flex;
+	justify-content: flex-end;
+	align-items: flex-start;
+	box-sizing: border-box;
+	padding: 2px 10px;
+	color: #666666;
+	font-size: 18px;
+	background-color: #FFBBBB;
+	cursor: pointer;
+	border-radius: 100%;
+	display: none; */
+}
+
+.m-m-fi-nephogramItem:hover > span {
+	display: flex;
+}
 </style>

+ 79 - 0
src/components/pages/classroomObservation/components/changeCourseNameDialog.vue

@@ -0,0 +1,79 @@
+<template>
+	<div class="changeCourseNameDialog">
+		<el-dialog title="修改课堂名称" :close-on-click-modal="false" :visible.sync="dialogVisible" width="500px" >
+			<div>
+				<el-form ref="form" :model="form" :rules="rules" label-position="top">
+					<!-- <el-form-item label="课堂编号" prop="no">
+						<el-input v-model="form.no" placeholder="请输入课堂编号,支持英文和数数字结合"></el-input>
+					</el-form-item> -->
+					<el-form-item label="课堂名称" prop="name">
+						<el-input
+							v-model="form.name"
+							placeholder="请输入课堂名称"
+						></el-input>
+					</el-form-item>
+				</el-form>
+			</div>
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="dialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="submit('form')">确 定</el-button>
+			</span>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+export default {
+	emits: ["success"],
+	props: {
+
+	},
+	data() {
+		let validateName = (rule, value, callback) => {
+			if (value.trim().length == 0) {
+				callback(new Error("请输入课堂名称"));
+			} else {
+				callback();
+			}
+		};
+		return {
+			dialogVisible: false,
+			loading:true,
+			form: {
+				id:"",
+				name: "",
+				tid:"",
+			},
+			rules: {
+				name: [{ validator: validateName, trigger: "change" }],
+			},
+		};
+	},
+	methods: {
+		open(item) {
+			this.form = {
+				id:item.id,
+				tid:item.value,
+				name: item.label,
+			};
+			this.dialogVisible = true;
+		},
+		submit(formName) {
+			this.$refs[formName].validate((valid) => {
+				if (valid) {
+					this.$emit("success", this.form);
+					this.dialogVisible = false;
+				} else {
+					console.log("error submit!!");
+					return false;
+				}
+			});
+		},
+	},
+};
+</script>
+
+<style scoped>
+.addNewCourse {
+}
+</style>

+ 15 - 6
src/components/pages/classroomObservation/components/messageArea.vue

@@ -12,10 +12,8 @@
 				>
 				</el-switch>
 			</div>
-			<div class="m-o-btn" @click.stop="useAnalysisTemplate()">
-				使用分析模板
-			</div>
-			<div class="m-o-btn" @click.stop="saveAsTemplate()">另存为模板</div>
+			<!-- <div class="m-o-btn" @click.stop="useAnalysisTemplate()">使用分析模板</div> -->
+			<!-- <div class="m-o-btn" @click.stop="saveAsTemplate()">另存为模板</div> -->
 			<div class="m-o-btn" :disabled="bmData.jsonData?false:true" @click="openBindForm(bmData)">绑定表单</div>
 		</div>
 		<div class="ma-main">
@@ -217,6 +215,8 @@
 		</el-dialog>
 		<!-- 绑定 表单 -->
 		<bindingFormDialog ref="bindingFormDialogRef" :tid="tid" @success="bindingForm"/>
+		<!-- 保存模板 -->
+		<saveTemplateDialog ref="saveTemplateDialogRef" :dataList="dataList"/>
 	</div>
 </template>
 
@@ -227,6 +227,7 @@ import baseMessage from "./baseMessage.vue"; //基本信息
 // import extendAnalysis from "./extendAnalysis.vue"; //扩展分析
 import analysis from "./analysis.vue";
 import bindingFormDialog from './bindingFormDialog.vue'
+import saveTemplateDialog from './saveTemplateDialog'
 
 export default {
 	emits:["changeChatAreaAudioUrl","changeTranscription","changeOptionData","updateTime"],
@@ -237,6 +238,9 @@ export default {
 		// extendAnalysis,
 		analysis,
 		bindingFormDialog,
+		saveTemplateDialog,
+
+
 	},
 	props: {
 		tid: {
@@ -339,7 +343,6 @@ export default {
 					title: "科学教育目标分析",
 					brief: "分析四类科学教育目标的情况",
 					value: "d6cd48ab-0125-11ef-aaca-12e77c4cb76b",
-					//a6c0b92b-06de-11ef-aaca-12e77c4cb76b   b13a98de-0125-11ef-aaca-12e77c4cb76b  b204de39-2286-11ef-aaca-12e77c4cb76b   6c344985-2287-11ef-aaca-12e77c4cb76b  efb24c07-2288-11ef-aaca-12e77c4cb76b  1402d19e-228d-11ef-aaca-12e77c4cb76b   183d3fdd-228d-11ef-aaca-12e77c4cb76b
 					subject:"科学",
 					type: 1,
 					sum:513
@@ -565,11 +568,14 @@ export default {
 		},
 		// 使用分析模板
 		useAnalysisTemplate() {
+			if(!this.tid)return this.$message.error("请先选择课堂")
 			this.$message.info("使用分析模板");
 		},
 		//另存为模板
 		saveAsTemplate() {
-			this.$message.info("另存为模板");
+			if(!this.tid)return this.$message.error("请先选择课堂")
+			this.$refs.saveTemplateDialogRef.open();
+			// this.$message.info("另存为模板");
 		},
 		addAnalysisItem(title) {
 			return new Promise((resolve, reject) => {
@@ -677,6 +683,9 @@ export default {
 					if(!_imageList.jsonData.videoList){
 						_imageList.jsonData.videoList = [];
 					}
+					if(!_imageList.jsonData.NephogramList){
+						_imageList.jsonData.NephogramList = [];
+					}
 					//通用分析
 					let currency = [];
 					for (let i = 2; i < _data.length; i++) {

+ 272 - 0
src/components/pages/classroomObservation/components/saveTemplateDialog.vue

@@ -0,0 +1,272 @@
+<template>
+	<div>
+		<el-dialog
+			:center="true"
+			:visible.sync="dialogVisible"
+			:close-on-click-modal="false"
+			width="500px"
+			class="bindingFormDialog"
+		>
+			<div class="a-d-top">
+				<div class="a-d-topTit">
+					<div>另存为模板</div>
+				</div>
+				<!-- <div class="a_d_t_input">
+					<el-input
+						placeholder="请输入标题"
+						prefix-icon="el-icon-search"
+						v-model="text"
+						@submit.native.prevent="search()"
+						clearable
+					>
+					</el-input>
+					<el-button
+						size="mini"
+						:disabled="loading"
+						style="margin-left: 10px"
+						@click="search()"
+						type="primary"
+						>搜索</el-button
+					>
+				</div> -->
+				<div class="a-d-t-right">
+					<span @click.stop="close()">×</span>
+				</div>
+			</div>
+			<div class="bfd_box" v-loading="loading" label-position="top">
+				<el-form :model="form" :rules="rules" ref="ruleForm">
+					<div style="display: flex;width: 100%;justify-content: space-between;">
+						<el-form-item label="模板名称" prop="name">
+  				  <el-input v-model="form.name" placeholder="请输入模板名称" style="width: 300px;"></el-input>
+  				</el-form-item>
+					<el-form-item label="所属学科" prop="subject">
+						<el-select v-model="form.subject" placeholder="请选择所属学科" style="width: 300px;">
+  					  <el-option
+  					    v-for="item in subjectList"
+  					    :key="item.value"
+  					    :label="item.label"
+  					    :value="item.value">
+  					  </el-option>
+  					</el-select>
+  				  <!-- <el-input v-model="form.subject" placeholder="请输入所属学科" style="width: 300px;"></el-input> -->
+  				</el-form-item>
+					</div>
+					<el-form-item label="模板简介(40字以内)" prop="brief">
+						<el-input type="textarea" v-model="form.brief" style="width: 100%;" :rows="3" :maxlength="40" resize="none" placeholder="请输入模板简介"></el-input>
+					</el-form-item>
+					<el-form-item label="权限管理" style="display: flex;flex-direction: column;align-items: flex-start;">
+						<div>公开到社区:<el-switch v-model="form.permissions"></el-switch></div>
+					</el-form-item>
+				</el-form>
+			</div>
+			<div class="bfd_bottom">
+				<el-button @click="close()">取消</el-button>
+				<el-button type="primary" @click="submitBtn('ruleForm')">保存</el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+export default {
+	emits: ["success"],
+	props: {
+		dataList:{
+			type:Array,
+			default:()=>{return []}
+		}
+	},
+	data() {
+		return {
+			loading: false,
+			dialogVisible: false,
+			userId: this.$route.query["userid"],
+			oid: this.$route.query["oid"],
+			org: this.$route.query["org"],
+			subjectList:[
+				{value:'1',label:'语文'},
+				{value:'2',label:'数学'},
+				{value:'3',label:'英语'},
+				{value:'4',label:'科学'},
+				{value:'5',label:'物理'},
+				{value:'6',label:'化学'},
+				{value:'7',label:'生物'},
+				{value:'8',label:'历史'},
+				{value:'9',label:'地理'},
+				{value:'10',label:'政治'},
+				
+			],
+			form:{
+				name:"",
+				subject:"",
+				brief:"",
+				permissions:false,
+			},
+			rules:{
+				name:[{required:true,message:"请输入课程名称",trigger:"blur"}],
+				subject:[{required:true,message:"请输入所属学科",trigger:"blur"}]
+			},
+
+		};
+	},
+	methods: {
+		open(_json) {
+			this.form = {
+				name:"",
+				subject:"",
+				brief:"",
+				permissions:false,
+			}
+			this.loading = false;
+			this.dialogVisible = true;
+		},
+		close() {
+			this.dialogVisible = false;
+			this.form = {
+				name:"",
+				subject:"",
+				brief:"",
+				permissions:false,
+			};
+		},
+		search(){
+			
+		},
+		submitBtn(ref) {
+			this.$refs[ref].validate((valid) => {
+          if (valid) {
+						let params = {
+							title:this.form.name,
+							subject:this.form.subject,
+							uid:this.userId,
+							brief:this.form.brief,
+							per:this.form.permissions?0:1,
+							jsonData:JSON.stringify(this.dataList),
+						}
+						return console.log(params)
+          }
+        });
+		},
+
+	},
+};
+</script>
+
+<style scoped>
+.bindingFormDialog >>> .el-dialog {
+	min-width: 700px;
+
+	height: 500px;
+	box-shadow: 0px 0 8px 0px #555555;
+	border-radius: 8px;
+	background-color: #fff;
+	/* top: 0px; */
+	/* margin: 0 auto; */
+	overflow: hidden;
+}
+.bindingFormDialog >>> .el-dialog__body {
+	height: 100%;
+	min-width: 700px;
+	flex-shrink: 0;
+	box-sizing: border-box;
+	padding-bottom: 50px;
+	padding-top: 10px;
+}
+.bindingFormDialog >>> .el-dialog__header {
+	display: none !important;
+}
+
+.a-d-top {
+	/* background: #adadad; */
+	display: flex;
+	flex-direction: row;
+	flex-wrap: nowrap;
+	align-items: center;
+	justify-content: space-between;
+	height: 54px;
+	border-radius: 8px 8px 0 0;
+	user-select: none;
+	border-bottom: 1px #ccc solid;
+}
+.a-d-top >>> .el-input__inner {
+	width: 320px;
+	height: 32px;
+}
+.a-d-top >>> .el-input__icon {
+	line-height: 32px;
+}
+
+.a-d-topTit {
+	/* width: 171px; */
+	/* margin-left: 20px; */
+	height: 32px;
+	display: flex;
+	align-items: center;
+	font-family: PingFang SC;
+	box-sizing: border-box;
+	padding: 5px;
+	line-height: 22px;
+	justify-content: center;
+	/* text-align: left; */
+}
+
+.a-d-t-right {
+	width: 40px;
+	height: 40px;
+	margin-right: 10px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	color: black !important;
+}
+
+.a-d-t-right > span {
+	width: 25px;
+	height: 25px;
+	border-radius: 25px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	/* align-items: center; */
+	font-size: 22px;
+	color: #fff;
+	/* background-color: #adadad; */
+	cursor: pointer;
+	/* background-color: #e6e6e6; */
+	color: #adadad;
+}
+
+.bfd_box {
+	width: 100%;
+	height: calc(100% - 80px);
+	overflow: hidden;
+}
+
+.bfd_bottom {
+	width: 100%;
+	height: calc(40px);
+	margin-top: 10px;
+	display: flex;
+	justify-content: flex-end;
+}
+
+.bfd_b_left {
+	flex: 1;
+	height: 100%;
+	display: flex;
+	align-items: center;
+}
+
+.a_d_t_input {
+	display: flex;
+	align-items: center;
+}
+
+/* .bfd_b_right {
+	width: 200px;
+	height: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+} */
+</style>

+ 71 - 7
src/components/pages/classroomObservation/index.vue

@@ -32,12 +32,16 @@
 							:value="item.value"
 						>
 							<div class="selectBox">
-								<span style="float: left">{{ item.label }}</span>
-								<span
+								<span>{{ item.label }}</span>
+								<div class="controlsBox">
+									<span class="changeSelect" @click.stop="changeCourse(item)">修改</span>
+									<span
 									class="delSelect"
 									@click.stop="delCourse(item.id)"
 									style="float: right"
 								></span>
+								</div>
+								
 							</div>
 						</el-option>
 					</el-select>
@@ -153,7 +157,8 @@
 			:tid="tid"
 			@shareBtn="shareBtn"
 		></sharePdf>
-
+		<changeCourseNameDialog :tid="tid" ref="changeCourseNameDialogRef" @success="changeCourseSuccess"/>
+		
 		<!-- <addNewCourseDialog
 			:courseList="optionData"
 			ref="addNewCourseDialogRef"
@@ -173,11 +178,16 @@ import sharePdf from "./components/sharePdf.vue";
 import { v4 as uuidv4 } from "uuid";
 // 添加课堂弹窗
 // import addNewCourseDialog from "./components/addNewCourseDialog.vue";
+//修改课程名称弹窗
+import changeCourseNameDialog from './components/changeCourseNameDialog';
+//保存模板弹窗
+
 export default {
 	components: {
 		chatArea,
 		messageArea,
 		sharePdf,
+		changeCourseNameDialog,
 		// addNewCourseDialog,
 	},
 	data() {
@@ -453,11 +463,47 @@ export default {
 				this.optionData[_index] = { ...this.optionData[_index], ..._newObj };
 				this.$forceUpdate();
 			}
-			console.log(this.optionData);
 		},
 		updateTime(time) {
 			this.createTime = time;
 		},
+		// 修改课程名称
+		changeCourse(item){
+			this.$refs.changeCourseNameDialogRef.open(item);
+			// console.log(item);
+		},
+		// 修改课程名称确定
+		changeCourseSuccess(data){
+			this.loading = true;
+			if(this.tid==data.tid){
+				this.$refs.messageAreaRef.bmData.jsonData.courseName = data.name;
+				this.$refs.messageAreaRef.saveData(this.$refs.messageAreaRef.bmData).then(res=>{
+					this.loading = false;
+					this.optionData.find(i=>i.id==data.id).label=data.name
+					this.$message.success('修改成功')
+				})
+			}else{
+				this.ajax.post("https://gpt4.cocorobo.cn/get_classroom_observation_new",{
+				tid:data.tid,
+				type:0
+			}).then(res=>{
+				let _data = res.data.FunctionResponse.result;
+				_data = JSON.parse(_data);
+				let _bmData = _data.find(i=>i.tIndex==0);
+				_bmData.jsonData = JSON.parse(_bmData.jsonData);
+				_bmData.jsonData.courseName = data.name;
+				this.$refs.messageAreaRef.saveData(_bmData).then(res=>{
+					this.loading = false;
+					this.optionData.find(i=>i.id==data.id).label=data.name
+					this.$message.success('修改成功')
+				})
+			}).catch(e=>{
+				console.log(e);
+				this.$message.error('修改失败')
+				this.loading = false;
+			})
+			}
+		}
 	},
 	mounted() {
 		this.getCourseList().then((_) => {
@@ -712,20 +758,38 @@ export default {
 .selectBox {
 	width: 100%;
 	height: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
 }
-.selectBox:hover .delSelect {
+
+.controlsBox{
 	display: flex;
+	align-items: center;
+	width: auto;
+	height: 100%;
+	display: none;
+}
+
+.selectBox:hover>.controlsBox{
+	display: flex;
+}
+
+.changeSelect{
+	font-size: 14px;
+	color:#5E9AFC;
+	margin-right: 5px;
 }
 
 .delSelect {
 	width: 16px;
 	height: 16px;
-	display: none;
+	/* display: none; */
 	align-items: center;
 	justify-content: center;
 	background: url("../../../assets/icon/classroomObservation/del.svg") no-repeat;
 	background-size: 100% 100%;
 	box-sizing: border-box;
-	transform: translateY(7px);
+	/* transform: translateY(7px); */
 }
 </style>