课堂观察

src/components/pages/classroomObservation/components/addNewAnalysisDialog.vue

@@ -102,6 +102,7 @@
                 />
                 <div class="a-d-b-i-t-title">{{ item.name }}</div>
               </div>
+							<div class="a_d_b_i_author" v-if="item.username">创作者：{{ item.username }}</div>
               <div class="a-d-b-i-bottom">{{ item.detail }}</div>
               <div class="a-d-b-i-bottomPer" style="display: block">
                 {{ item.count }}人已使用
@@ -1349,4 +1350,11 @@ export default {
 .a_d_b_i_t_t_editDialog > div > span {
   margin: 0 5px 0 10px;
 }
+
+.a_d_b_i_author{
+	font-size: 14px;
+	margin-bottom: 5px;
+	margin-top: -5px;
+	font-weight: normal;
+}
 </style>

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

@@ -596,7 +596,7 @@ export default {
 		},
 		dragSubmit(){
 			this.visible = false;
-			this.$parent.isDrag = false;
+			this.$parent.moveAnalysisSubmit()
 		},
 		moveAnalysisSubmit(data){
 			this.$emit('moveAnalysis',data)

src/components/pages/classroomObservation/components/analysis2.vue

@@ -2,7 +2,7 @@
 	<div class="analysis">
 		<div class="a-header">
 			<div class="a-h-left" @click.stop="changeShowItem(!showItem)">
-				<span :class="['a-h-l-icon', showItem ? 'a-h-l-showIcon' : '']"></span>
+				<!-- <span :class="['a-h-l-icon', showItem ? 'a-h-l-showIcon' : '']"></span> -->
 				<span class="a-h-l-title">{{ title }}</span>
 			</div>
 			<div class="a-h-right" v-if="showAdd">
@@ -85,8 +85,8 @@ export default {
 	padding: 5px 8px 5px 8px;
 	gap: 8px;
 	opacity: 0px;
-	margin: 20px 0;
-	margin-bottom: 10px;
+	margin: 20px 0px 5px 0;
+	margin-bottom: 5px;
 	border-bottom: 1px #ccc solid;
 }
 .analysis {

src/components/pages/classroomObservation/components/analysisItem2.vue

@@ -2,9 +2,9 @@
 	<div class="analysisItem">
 		<div class="ai-header" v-show="data.jsonData.name != '词频词汇分析'">
 			<div class="ai-h-left" @click.stop="changeOpenItem(!openItem)">
-				<span
+				<!-- <span
 					:class="['ai-h-l-icon', openItem ? 'ai-h-l-iconActive' : '']"
-				></span>
+				></span> -->
 				<span class="ai-h-l-text">{{ data.jsonData.name }}</span>
 			</div>
 			<div class="ai-h-right" v-if="showAdd">

src/components/pages/classroomObservation/components/analysisSpecialItem.vue

@@ -1,5 +1,10 @@
 <template>
-  <div class="analysisItem">
+  <div class="analysisItem" ref="analysisItemRef" :style="
+      `top:${moveTop}px;transition:${isDragging ? '0' : '.3s'}s;${
+        isDragging ? 'z-index:999' : ''
+      }`
+    "
+		@mousedown="moveDown($event)">
     <div class="ai-header">
       <div class="ai-h-left" @click.stop="changeOpenItem(!openItem)">
         <span
@@ -1120,6 +1125,101 @@ CH：${_CH}
 
         resolve(_contentTableList);
       });
+    },
+		moveDown(e) {
+			if(!this.isDrag)return;
+      this.isDragging = true;
+      this.startY = e.clientY;
+      this.$nextTick(() => {
+        this.dialogTagList.forEach(i => {
+          this.dragBoxList.push(
+            ...this.$parent.$parent.$refs[`analysis_${i.value}`][0].$refs
+              .dragBoxRefTop
+          );
+					if(this.$parent.$parent.$refs[`analysis_${i.value}`][0].$refs.dragBoxRefBottom.length>0){
+						this.dragBoxList.push(
+            ...this.$parent.$parent.$refs[`analysis_${i.value}`][0].$refs
+              .dragBoxRefBottom
+          );
+					}else if(this.$parent.$parent.$refs[`analysis_${i.value}`][0].$refs.dragBoxRefBottom){
+						this.dragBoxList.push(this.$parent.$parent.$refs[`analysis_${i.value}`][0].$refs.dragBoxRefBottom);
+					}
+          
+        });
+        // 禁用页面文本选择
+        document.body.style.userSelect = "none";
+        document.addEventListener("mousemove", this.onMouseMove);
+        document.addEventListener("mouseup", this.stopDragging);
+      });
+    },
+    onMouseMove(e) {
+      if (!this.isDragging) return;
+
+      const newTop = e.clientY - this.startY; // 计算鼠标移动的Y轴距离
+
+      // // 更新div的top样式，使其跟随鼠标移动
+      this.moveTop = newTop;
+      // this.dragBoxList.forEach(i=>{
+      // 	let _i = i.getBoundingClientRect();
+      // 	if(e.clientX>=_i.left && e.clientX<=_i.right && e.clientY>=_i.top && e.clientY<=_i.bottom){
+      // 		this.enterDrag = i;
+      // 		console.log("👇")
+      // 		console.log(e)
+      // 	}else{
+      // 		this.enterDrag = null;
+      // 	}
+      // })
+      // for (let i = 0; i <= this.dragBoxList.length; i++) {
+      //   let _i = this.dragBoxList[i].getBoundingClientRect();
+      //   if (
+      //     e.clientX >= _i.left &&
+      //     e.clientX <= _i.right &&
+      //     e.clientY >= _i.top &&
+      //     e.clientY <= _i.bottom
+      //   ) {
+      //     this.enterDrag = this.dragBoxList[i];
+      //     console.log("👇");
+      //     console.log(e);
+      // 		break;
+      //   } else {
+      //     this.enterDrag = null;
+      //   }
+      // }
+    },
+    stopDragging(e) {
+      this.isDragging = false;
+      try {
+        for (let i = 0; i <= this.dragBoxList.length; i++) {
+          let _i = this.dragBoxList[i].getBoundingClientRect();
+          if (
+            e.clientX >= _i.left &&
+            e.clientX <= _i.right &&
+            e.clientY >= _i.top &&
+            e.clientY <= _i.bottom
+          ) {
+            this.enterDrag = this.dragBoxList[i];
+            break;
+          } else {
+            this.enterDrag = null;
+          }
+        }
+        // 恢复页面的文本选择
+        document.body.style.userSelect = "";
+        if (!this.enterDrag) {
+          this.moveTop = 0;
+        } else {
+					this.moveTop = 0;
+					let moveData = this.enterDrag.getAttribute('type');
+					this.$emit("moveAnalysis",{form:`${this.data.Type}_${this.index}_${this.data.tIndex}`,to:moveData})
+        }
+        // 移除全局的鼠标移动和释放事件
+        document.removeEventListener("mousemove", this.onMouseMove);
+        document.removeEventListener("mouseup", this.stopDragging);
+      } catch (error) {
+				this.moveTop = 0;
+				document.removeEventListener("mousemove", this.onMouseMove);
+        document.removeEventListener("mouseup", this.stopDragging);
+			}
     }
   },
   mounted() {
@@ -1143,6 +1243,7 @@ CH：${_CH}
   border: 1px solid #e7e7e7;
   border-radius: 4px;
   transition: 0.3s;
+	position: relative;
 }
 
 .analysisItem:hover {

src/components/pages/classroomObservation/components/analysisTemplateDialog.vue

@@ -1238,7 +1238,7 @@ export default {
 .ad_h_b_shu {
   width: 1px;
   height: 10px;
-  background-color: #00000066;
+  background-color: #999999;
   margin: 2px 8px 0 8px;
 }
 

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

@@ -29,6 +29,9 @@
         @startTape="onClickStartRecord"
         @uploadTape="uploadRecording"
         :uploadFileLoading="uploadFileLoading"
+				:teacherVoiceprintList="teacherVoiceprintList"
+				:chosenVoiceprint="chosenVoiceprint"
+				:controlsStatus="controlsStatus"
         ref="startPageRef"
       />
       <!-- 原文速递 -->

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

@@ -1268,6 +1268,35 @@ export default {
       this.dataList = JSON.parse(JSON.stringify(this.copyDataList));
       this.copyDataList = [];
     },
+		moveAnalysisSubmit(){
+			this.loading = true;
+			if(JSON.stringify(this.copyDataList)===JSON.stringify(this.dataList)){
+				this.isDrag = false;
+				this.loading = false;
+				// this.$message.success("更换成功")
+				return 
+			}
+
+			let _copyData = JSON.parse(JSON.stringify(this.dataList));
+
+			_copyData = _copyData.filter(i=>!(i.Type==0&&i.tIndex==2));
+
+			let _result = _copyData.map(i=>({id:i.id,tIndex:i.tIndex,Type:i.Type}));
+			
+			let params = {
+				data:JSON.stringify(_result)
+			}
+			this.ajax.post('https://gpt4.cocorobo.cn/batch_update_type_tindex',params).then(res=>{
+				this.isDrag = false;
+				this.loading = false;
+				this.$message.success("保存成功")
+			}).catch(e=>{
+				console.log(e)
+				this.isDrag = true;
+				this.loading = false;
+				this.$message.error("保存失败")
+			})
+		},
     init() {
       this.bmData = {};
       this.getDefaultData();

src/components/pages/classroomObservation/components/startPage.vue

@@ -20,20 +20,52 @@
     </div>
     <div class="sp-main">
       <div class="sp_m_box">
-        <div class="sp_m_b_top"></div>
+        <div class="sp_m_b_top">
+          <div class="sp_m_b_t_voice">
+            <div class="sp_m_b_t_v_title">声纹选择</div>
+            <span>请选择/新增本次课堂授课教师的声纹</span>
+            <div class="sp_m_b_t_v_inputArea">
+              <el-select
+                v-model="inputValue"
+                @change="handleSelect"
+                multiple
+                placeholder="请选择"
+                :multiple-limit="10"
+                filterable
+							 :disabled="controlsStatus === 1"
+              >
+                <el-option
+                  v-for="item in teacherList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+              <span @click="addNew">＋</span>
+            </div>
+            <img
+              src="../../../../assets/icon/classroomObservation/voiceCard.png"
+            />
+          </div>
+        </div>
         <div class="sp_m_b_bottom">
-          <div  @click.stop="$emit('startTape')">
-						<div>开始录音</div>
-						<span>实时语音转录文字</span>
-						<span>智能课堂观察</span>
-						<img src="../../../../assets/icon/classroomObservation/startPageIcon2.png">
-					</div>
-          <div  @click.stop="$emit('uploadTape')">
-						<div>上传文件</div>
-						<span>录音复盘</span>
-						<span>一键分析课堂情况</span>
-						<img src="../../../../assets/icon/classroomObservation/startPageIcon1.png">
-					</div>
+          <div @click.stop="$emit('startTape')">
+            <div>开始录音</div>
+            <span>实时语音转录文字</span>
+            <span>智能课堂观察</span>
+            <img
+              src="../../../../assets/icon/classroomObservation/startPageIcon2.png"
+            />
+          </div>
+          <div @click.stop="$emit('uploadTape')">
+            <div>上传文件</div>
+            <span>录音复盘</span>
+            <span>一键分析课堂情况</span>
+            <img
+              src="../../../../assets/icon/classroomObservation/startPageIcon1.png"
+            />
+          </div>
         </div>
       </div>
       <!-- <div class="sp-m-item" @click.stop="$emit('startTape')">
@@ -78,12 +110,43 @@
 <script>
 export default {
   emits: ["startTape", "uploadTape"],
+  props: {
+    teacherVoiceprintList: {
+      type: Array,
+      default: () => []
+    },
+    chosenVoiceprint: {
+      type: Array,
+      default: []
+    },
+		controlsStatus:{
+			type:Number,
+			default:0
+		},
+  },
   data() {
     return {
-      showIntroduce: true
+      showIntroduce: true,
+      inputValue: [],
+      teacherList: []
     };
   },
-  methods: {}
+  watch: {
+    teacherVoiceprintList() {
+      this.teacherList = JSON.parse(JSON.stringify(this.teacherVoiceprintList));
+    },
+    chosenVoiceprint() {
+      this.inputValue = this.chosenVoiceprint;
+    }
+  },
+  methods: {
+    handleSelect(item) {
+      this.$parent.chosenVoiceprint = JSON.parse(JSON.stringify(this.inputValue));
+    },
+		addNew(){
+			this.$parent.onClickAddNewVoiceprint();
+		}
+  }
 };
 </script>
 
@@ -180,13 +243,20 @@ export default {
 .sp_m_box {
   width: 70%;
   height: 100%;
-	/* max-height: 550px; */
-	max-height: 400px;
+  max-height: 500px;
+  /* max-height: 400px; */
   display: flex;
   flex-direction: column;
   margin-bottom: 8%;
 }
 
+.sp_m_b_top {
+  width: 100%;
+  height: 220px;
+  /* background-color: red; */
+  margin-bottom: 20px;
+}
+
 .sp_m_b_bottom {
   width: 100%;
   flex: 1;
@@ -195,7 +265,6 @@ export default {
   justify-content: center;
 }
 
-
 .sp_m_b_bottom > div {
   height: 100%;
   flex: 1;
@@ -207,30 +276,30 @@ export default {
   box-shadow: 0px 4px 10px 0px #1d398314;
 
   box-shadow: 1px 1px 20px 4px #1d39830d;
-	background-color: #fff;
-	border-radius: 8px;
-	padding: 40px;
-	flex-direction: column;
-	cursor: pointer;
-	position: relative;
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 40px;
+  flex-direction: column;
+  cursor: pointer;
+  position: relative;
 }
 
-.sp_m_b_bottom > div>img{
-	width: 50%;
-	position: absolute;
-	right: 0;
-	bottom: 0;
+.sp_m_b_bottom > div > img {
+  width: 50%;
+  position: absolute;
+  right: 0;
+  bottom: 0;
 }
 
-.sp_m_b_bottom > div>div{
-	font-size: 30px;
-	font-weight: bold;
-	margin-bottom: 10px;
+.sp_m_b_bottom > div > div {
+  font-size: 30px;
+  font-weight: bold;
+  margin-bottom: 10px;
 }
 
-.sp_m_b_bottom > div>span{
-	margin-top: 5px;
-	color: #00000066;
+.sp_m_b_bottom > div > span {
+  margin-top: 5px;
+  color: #00000066;
 }
 
 .sp_m_b_bottom > div:nth-of-type(2) {
@@ -301,7 +370,63 @@ export default {
   background-size: 100% 100%;
   margin-bottom: 15px;
 }
+.sp_m_b_t_voice {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  /* align-items: center; */
+  /* justify-content: center; */
+  box-sizing: border-box;
+  border: 1px solid #aeccfe;
+  box-shadow: 0px 4px 10px 0px #1d398314;
+
+  box-shadow: 1px 1px 20px 4px #1d39830d;
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 40px;
+  flex-direction: column;
+  /* cursor: pointer; */
+  position: relative;
+}
+
+.sp_m_b_t_voice > img {
+  height: 80%;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+}
+
+.sp_m_b_t_voice > .sp_m_b_t_v_title {
+  font-size: 30px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+
+.sp_m_b_t_voice > span {
+  margin-top: 5px;
+  color: #00000066;
+}
 
+.sp_m_b_t_v_inputArea {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+}
+
+.sp_m_b_t_v_inputArea > span {
+  width: 35px;
+  height: 35px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: #f3f7fd;
+  border-radius: 3px;
+  margin-left: 10px;
+  cursor: pointer;
+  font-weight: bold;
+  color: #3681fc;
+  font-size: 16px;
+}
 /* .sp-m-i-icon1 {
 	background: url("../../../../assets/icon/classroomObservation/tape.png")
 		no-repeat;