返回按钮

src/components/classRoomHelper/index.vue

@@ -1,212 +1,249 @@
 <template>
   <div class="ch_box" ref="ch_box">
     <div class="ch_content_box" v-if="type == 1">
-			<searchArea v-show="itemType==1"/>
-			<taskArea v-show="itemType==2"/>
-			<dialogArea v-show="itemType==3"/>
+      <searchArea v-show="itemType == 1" />
+      <taskArea v-show="itemType == 2" />
+      <dialogArea v-show="itemType == 3" />
     </div>
     <div class="ch_nav_box">
-			<div class="ch_nav_box_top">
-				<div>
-					<img :src="require('../../assets/icon/course/return.png')" alt="">
-				</div>
-				<div @click="$emit('refresh')">
-					<img :src="require('../../assets/icon/course/refresh.png')" alt="">
-				</div>
-				<div>
-					<img :src="require('../../assets/icon/course/setting.png')" alt="">
-				</div>
-			</div>
-			<div class="ch_nav_box_middle">
-				<div :class="['ch_nav_box_middle_item',itemType==1?'ch_nav_box_middle_item_active':'']" @click.stop="changeItemType(1)">
-					<img v-if="itemType==1" :src="require('../../assets/icon/course/up_active.png')">
-					<img v-if="itemType!=1" :src="require('../../assets/icon/course/up.png')">
-					<!-- <span :style="`background:url(${itemType==1?require('../../assets/icon/course/up_active.png'):require('../../assets/icon/course/up.png')});`"></span> -->
-					<div>搜索</div>
-				</div>
-				<div :class="['ch_nav_box_middle_item',itemType==2?'ch_nav_box_middle_item_active':'']" @click.stop="changeItemType(2)">
-					<img v-if="itemType==2" :src="require('../../assets/icon/course/task_active.png')">
-					<img v-if="itemType!=2" :src="require('../../assets/icon/course/task.png')">
-					<!-- <span :style="`background:url(${itemType==2?require('../../assets/icon/course/task_active.png'):require('../../assets/icon/course/task.png')});`"></span> -->
-					<div>任务</div>
-				</div>
-				<div :class="['ch_nav_box_middle_item',itemType==3?'ch_nav_box_middle_item_active':'']" @click.stop="changeItemType(3)">
-					<img v-if="itemType==3" :src="require('../../assets/icon/course/dialog_active.png')">
-					<img v-if="itemType!=3" :src="require('../../assets/icon/course/dialog.png')">
-					<!-- <span :style="`background:url(${itemType==3?require('../../assets/icon/course/dialog_active.png'):require('../../assets/icon/course/dialog.png')});`"></span> -->
-					<div>对话</div>
-				</div>
-			</div>
-			<div class="ch_nav_box_bottom">
-				<div @click.stop="$emit('goStep',0)">
-					<img :src="require('../../assets/icon/course/last.png')">
-				</div>
-				<div @click.stop="$emit('goStep',1)">
-					<img :src="require('../../assets/icon/course/next.png')">
-				</div>
-				<div @click="openSetting">
-					<img :src="require('../../assets/icon/course/menu.png')">
-				</div>
-			</div>
-
+      <div class="ch_nav_box_top">
+        <div @click="back">
+          <img :src="require('../../assets/icon/course/return.png')" alt="" />
+        </div>
+        <div @click="$emit('refresh')">
+          <img :src="require('../../assets/icon/course/refresh.png')" alt="" />
+        </div>
+        <div>
+          <img :src="require('../../assets/icon/course/setting.png')" alt="" />
+        </div>
+      </div>
+      <div class="ch_nav_box_middle">
+        <div
+          :class="[
+            'ch_nav_box_middle_item',
+            itemType == 1 ? 'ch_nav_box_middle_item_active' : ''
+          ]"
+          @click.stop="changeItemType(1)"
+        >
+          <img
+            v-if="itemType == 1"
+            :src="require('../../assets/icon/course/up_active.png')"
+          />
+          <img
+            v-if="itemType != 1"
+            :src="require('../../assets/icon/course/up.png')"
+          />
+          <!-- <span :style="`background:url(${itemType==1?require('../../assets/icon/course/up_active.png'):require('../../assets/icon/course/up.png')});`"></span> -->
+          <div>搜索</div>
+        </div>
+        <div
+          :class="[
+            'ch_nav_box_middle_item',
+            itemType == 2 ? 'ch_nav_box_middle_item_active' : ''
+          ]"
+          @click.stop="changeItemType(2)"
+        >
+          <img
+            v-if="itemType == 2"
+            :src="require('../../assets/icon/course/task_active.png')"
+          />
+          <img
+            v-if="itemType != 2"
+            :src="require('../../assets/icon/course/task.png')"
+          />
+          <!-- <span :style="`background:url(${itemType==2?require('../../assets/icon/course/task_active.png'):require('../../assets/icon/course/task.png')});`"></span> -->
+          <div>任务</div>
+        </div>
+        <div
+          :class="[
+            'ch_nav_box_middle_item',
+            itemType == 3 ? 'ch_nav_box_middle_item_active' : ''
+          ]"
+          @click.stop="changeItemType(3)"
+        >
+          <img
+            v-if="itemType == 3"
+            :src="require('../../assets/icon/course/dialog_active.png')"
+          />
+          <img
+            v-if="itemType != 3"
+            :src="require('../../assets/icon/course/dialog.png')"
+          />
+          <!-- <span :style="`background:url(${itemType==3?require('../../assets/icon/course/dialog_active.png'):require('../../assets/icon/course/dialog.png')});`"></span> -->
+          <div>对话</div>
+        </div>
+      </div>
+      <div class="ch_nav_box_bottom">
+        <div @click.stop="$emit('goStep', 0)">
+          <img :src="require('../../assets/icon/course/last.png')" />
+        </div>
+        <div @click.stop="$emit('goStep', 1)">
+          <img :src="require('../../assets/icon/course/next.png')" />
+        </div>
+        <div @click="openSetting">
+          <img :src="require('../../assets/icon/course/menu.png')" />
+        </div>
+      </div>
     </div>
-
   </div>
 </template>
 
 <script>
-import searchArea from './component/searchArea.vue';
-import taskArea from './component/taskArea.vue';
-import dialogArea from './component/dialogArea.vue';
+import searchArea from "./component/searchArea.vue";
+import taskArea from "./component/taskArea.vue";
+import dialogArea from "./component/dialogArea.vue";
 export default {
-	emits:["refresh","goStep"],
-	components:{
-		searchArea,
-		taskArea,
-		dialogArea
-	},
+  emits: ["refresh", "goStep", "backPage"],
+  components: {
+    searchArea,
+    taskArea,
+    dialogArea
+  },
   data() {
-      return {
-          type: 0,
-					itemType:0,//0--无  1-搜索  2-任务 3-对话
-      }
+    return {
+      type: 0,
+      itemType: 0 //0--无  1-搜索  2-任务 3-对话
+    };
   },
-  mounted () {
-      this.setWidth();
+  mounted() {
+    this.setWidth();
   },
   methods: {
-      setWidth() {
-          let w = this.$refs.ch_box;
-          let w2 = w.offsetWidth + 30 + 'px'
-          this.$emit('setWidth', w2)
-      },
-      openSetting(){
-          this.type = this.type == 1 ? 0 : 1;
-          this.$nextTick(()=>{
-              this.setWidth();
-          })
-      },
-			changeItemType(type){
-				this.type = 0;
-				this.openSetting();
-				this.itemType = type;
-			}
-  },
-}
+    setWidth() {
+      let w = this.$refs.ch_box;
+      let w2 = w.offsetWidth + 30 + "px";
+      this.$emit("setWidth", w2);
+    },
+    //   返回
+    back() {
+      this.$emit("backPage");
+    },
+    openSetting() {
+      this.type = this.type == 1 ? 0 : 1;
+      this.$nextTick(() => {
+        this.setWidth();
+      });
+    },
+    changeItemType(type) {
+      this.type = 0;
+      this.openSetting();
+      this.itemType = type;
+    }
+  }
+};
 </script>
 
 <style scoped>
-    .ch_box{
-        width: auto;
-        background: rgb(255, 255, 255);
-        position: fixed;
-        height: calc(100% - 40px);
-        border-radius: 10px;
-        box-sizing: border-box;
-        right: 20px;
-        overflow: hidden;
-        display: flex;
-    }
+.ch_box {
+  width: auto;
+  background: rgb(255, 255, 255);
+  position: fixed;
+  height: calc(100% - 40px);
+  border-radius: 10px;
+  box-sizing: border-box;
+  right: 20px;
+  overflow: hidden;
+  display: flex;
+}
 
-    .ch_nav_box{
-        height: 100%;
-        width: 65px;
-        display: flex;
-        flex-direction: column;
-        justify-content: flex-end;
-        align-items: center;
-    }
+.ch_nav_box {
+  height: 100%;
+  width: 65px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  align-items: center;
+}
 
-    .ch_content_box{
-        width: 400px;
-        height: 100%;
-        border-right: 2px solid #e7e7e7;
-    }
+.ch_content_box {
+  width: 400px;
+  height: 100%;
+  border-right: 2px solid #e7e7e7;
+}
 
-		.ch_nav_box_bottom{
-			width: 100%;
-			height: auto;
-			box-sizing: border-box;
-			border-top: solid 1px #EAEAEA;
-			display: flex;
-			flex-direction: column;
-			justify-content: flex-end;
-		}
+.ch_nav_box_bottom {
+  width: 100%;
+  height: auto;
+  box-sizing: border-box;
+  border-top: solid 1px #eaeaea;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+}
 
-		.ch_nav_box_middle{
-			width: 100%;
-			height:auto;
-			display: flex;
-			box-sizing: border-box;
-			border-top: solid 1px #EAEAEA;
-			flex-direction: column;
-			justify-content: space-between;
-		}
+.ch_nav_box_middle {
+  width: 100%;
+  height: auto;
+  display: flex;
+  box-sizing: border-box;
+  border-top: solid 1px #eaeaea;
+  flex-direction: column;
+  justify-content: space-between;
+}
 
-		.ch_nav_box_middle_item{
-			width: 100%;
-			height: 80px;
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			align-items: center;
-			cursor: pointer;
-			transition: .3s;
-			font-size: 14px;
-		}
+.ch_nav_box_middle_item {
+  width: 100%;
+  height: 80px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  transition: 0.3s;
+  font-size: 14px;
+}
 
-		/* .ch_nav_box_middle_item:hover{
+/* .ch_nav_box_middle_item:hover{
 			background-color: rgb(195, 215, 247);
 		} */
 
-		.ch_nav_box_middle_item_active{
-			  background-color: #3681FC;
-				color: white;
-		}
-		
-		.ch_nav_box_middle_item>img{
-			width: 24px;
-			height: 24px;
-			margin-bottom: 5px;
-		}
+.ch_nav_box_middle_item_active {
+  background-color: #3681fc;
+  color: white;
+}
 
-		/* .ch_nav_box_middle_item>span{
+.ch_nav_box_middle_item > img {
+  width: 24px;
+  height: 24px;
+  margin-bottom: 5px;
+}
+
+/* .ch_nav_box_middle_item>span{
 			width: 24px;
 			height: 24px;
 			background-size: 100% 100%;
 			background-repeat: no-repeat;
 			background-position: center;
 		} */
-		
 
-		.ch_nav_box_bottom>div{
-			width: 100%;
-			height: 65px;
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			align-items: center;
-			cursor: pointer;
-		}
-		.ch_nav_box_bottom>div>img{
-			width: 24px;
-			height: 24px;
-		}
+.ch_nav_box_bottom > div {
+  width: 100%;
+  height: 65px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+.ch_nav_box_bottom > div > img {
+  width: 24px;
+  height: 24px;
+}
 
-		.ch_nav_box_top{
-			width: 100%;
-			height: auto;	
-		}
-		.ch_nav_box_top>div{
-			width:100%;
-			height:65px;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			cursor: pointer;
-		}
-		.ch_nav_box_top>div>img{
-			width: 24px;
-			height: 24px;
-		}
-</style>
+.ch_nav_box_top {
+  width: 100%;
+  height: auto;
+}
+.ch_nav_box_top > div {
+  width: 100%;
+  height: 65px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+.ch_nav_box_top > div > img {
+  width: 24px;
+  height: 24px;
+}
+</style>

src/components/studyStudent.vue

@@ -8037,7 +8037,22 @@
           </div>
         </el-dialog>
       </div>
-      <classRoomHelper ref="classRoomHelperRef" @setWidth="setClassRoomHelperWidth" @refresh="refreshCourse" @goStep="nextOrpreSteps"></classRoomHelper>
+      <classRoomHelper ref="classRoomHelperRef" @setWidth="setClassRoomHelperWidth" @refresh="refreshCourse" @goStep="nextOrpreSteps" @backPage="()=>goTo(
+                    '/courseDetail?userid=' +
+                      userid +
+                      '&oid=' +
+                      oid +
+                      '&org=' +
+                      org +
+                      '&cid=' +
+                      classId +
+                      '&courseId=' +
+                      id +
+                      '&tType=' +
+                      tType +
+                      '&screenType=' +
+                      screenType
+                  )"></classRoomHelper>
     </div>
     <div
       class="pButton"