caichengyu 1 هفته پیش
والد
کامیت
0fc5f289f5
51فایلهای تغییر یافته به همراه823 افزوده شده و 212 حذف شده
  1. 7 0
      src/apis/course.js
  2. BIN
      src/assets/new1/teach1.png
  3. BIN
      src/assets/new1/teach2.png
  4. BIN
      src/assets/new1/teach3.png
  5. BIN
      src/assets/new1/teach33.png
  6. BIN
      src/assets/new1/teach4.png
  7. BIN
      src/assets/new1/teach5.png
  8. BIN
      src/assets/new1/teach55.png
  9. BIN
      src/assets/new1/teach6.png
  10. BIN
      src/assets/video/全面识别 高度警惕 防范非法集资活动.mp4
  11. BIN
      src/assets/video/戳破非法金融 “新话术”,远离非法金融活动.mp4
  12. BIN
      src/assets/video/警惕养老服务领域骗局.mp4
  13. BIN
      src/assets/zzzs/2018A1.jpg
  14. BIN
      src/assets/zzzs/2018A2.jpg
  15. BIN
      src/assets/zzzs/2018A3.jpg
  16. BIN
      src/assets/zzzs/2018A4.jpg
  17. BIN
      src/assets/zzzs/2018A5.jpg
  18. BIN
      src/assets/zzzs/2018A6.jpg
  19. BIN
      src/assets/zzzs/2018A7.jpg
  20. BIN
      src/assets/zzzs/2018A8.jpg
  21. BIN
      src/assets/zzzs/2019A1.jpg
  22. BIN
      src/assets/zzzs/bxxkz-zb.jpg
  23. BIN
      src/assets/zzzs/bxxkz-zb.png
  24. BIN
      src/assets/zzzs/bxxkz-zb2.png
  25. BIN
      src/assets/zzzs/djz.jpg
  26. BIN
      src/assets/zzzs/djz.png
  27. BIN
      src/assets/zzzs/djz2.png
  28. BIN
      src/assets/zzzs/djz3.png
  29. BIN
      src/assets/zzzs/facesbrzzs.jpg
  30. BIN
      src/assets/zzzs/hjgltxrz.jpg
  31. BIN
      src/assets/zzzs/zlgltxrz.jpg
  32. BIN
      src/assets/zzzs/zyhjaqgktxrz.jpg
  33. BIN
      src/assets/zzzs/zzqyzhjyxtrzzs.jpg
  34. BIN
      src/assets/zzzs/zzyxtptrzzs1.jpg
  35. BIN
      src/assets/zzzs/zzyxtptrzzs2.jpg
  36. BIN
      src/assets/zzzs/zzzhkcrzzs.jpg
  37. BIN
      src/assets/zzzs/zzzhkcrzzs1.jpg
  38. BIN
      src/assets/zzzs/zzzhkcrzzs2.jpg
  39. BIN
      src/assets/zzzs/zzzhkcrzzs3-3.jpg
  40. BIN
      src/assets/zzzs/zzzhkcrzzs3.jpg
  41. 23 13
      src/components/footer1/index.vue
  42. 2 2
      src/components/goodsItem/index.vue
  43. 2 2
      src/components/handoutItem/index.vue
  44. 2 2
      src/components/header1/index.vue
  45. 1 1
      src/components/listOption1/index.vue
  46. 2 2
      src/components/listOption2/index.vue
  47. 233 0
      src/components/toolbar/videoFloatWindow.vue
  48. 45 0
      src/components/videoCy/index.vue
  49. 1 1
      src/pages/home1/index.vue
  50. 178 178
      src/pages/home2/index.vue
  51. 327 11
      src/pages/home3/index.vue

+ 7 - 0
src/apis/course.js

@@ -464,4 +464,11 @@ export default {
 			params: data
 		})
 	},
+	//获取离开是否暂停视频
+	screencheck(data) {
+		return request({
+			url: '/order/screen/check/'+data,
+			method: 'get'
+		})
+	},
 }

BIN
src/assets/new1/teach1.png


BIN
src/assets/new1/teach2.png


BIN
src/assets/new1/teach3.png


BIN
src/assets/new1/teach33.png


BIN
src/assets/new1/teach4.png


BIN
src/assets/new1/teach5.png


BIN
src/assets/new1/teach55.png


BIN
src/assets/new1/teach6.png


BIN
src/assets/video/全面识别 高度警惕 防范非法集资活动.mp4


BIN
src/assets/video/戳破非法金融 “新话术”,远离非法金融活动.mp4


BIN
src/assets/video/警惕养老服务领域骗局.mp4


BIN
src/assets/zzzs/2018A1.jpg


BIN
src/assets/zzzs/2018A2.jpg


BIN
src/assets/zzzs/2018A3.jpg


BIN
src/assets/zzzs/2018A4.jpg


BIN
src/assets/zzzs/2018A5.jpg


BIN
src/assets/zzzs/2018A6.jpg


BIN
src/assets/zzzs/2018A7.jpg


BIN
src/assets/zzzs/2018A8.jpg


BIN
src/assets/zzzs/2019A1.jpg


BIN
src/assets/zzzs/bxxkz-zb.jpg


BIN
src/assets/zzzs/bxxkz-zb.png


BIN
src/assets/zzzs/bxxkz-zb2.png


BIN
src/assets/zzzs/djz.jpg


BIN
src/assets/zzzs/djz.png


BIN
src/assets/zzzs/djz2.png


BIN
src/assets/zzzs/djz3.png


BIN
src/assets/zzzs/facesbrzzs.jpg


BIN
src/assets/zzzs/hjgltxrz.jpg


BIN
src/assets/zzzs/zlgltxrz.jpg


BIN
src/assets/zzzs/zyhjaqgktxrz.jpg


BIN
src/assets/zzzs/zzqyzhjyxtrzzs.jpg


BIN
src/assets/zzzs/zzyxtptrzzs1.jpg


BIN
src/assets/zzzs/zzyxtptrzzs2.jpg


BIN
src/assets/zzzs/zzzhkcrzzs.jpg


BIN
src/assets/zzzs/zzzhkcrzzs1.jpg


BIN
src/assets/zzzs/zzzhkcrzzs2.jpg


BIN
src/assets/zzzs/zzzhkcrzzs3-3.jpg


BIN
src/assets/zzzs/zzzhkcrzzs3.jpg


+ 23 - 13
src/components/footer1/index.vue

@@ -9,21 +9,27 @@
             :key="index"
             :href="item.url ? item.url : 'javascript:;'"
             target="_blank"
-            >{{ item.name }}</a
+            >{{ item.name }}
+      </a
           >
         </div>
       </div>
 
       <div class="footer__body">
-        <p v-for="(item, index) in footer.tableData" :key="index">{{ item.name }}</p>
+        <p>
+        <img src="@/assets/new1/sztd.png" alt="" style="background:#ede7ff;width: 30px;" /><br />
+      <span v-if="footer.copyrightStatus == 1">Copyright © {{new Date().getFullYear()}} 版权所有:{{ footer.copyright }}&nbsp;&nbsp;|&nbsp;&nbsp;</span> 
+        <span v-for="(item, index) in footer.tableData" :key="index">{{ index==0?"":"&nbsp;&nbsp;|&nbsp;&nbsp;" }} {{ item.name }}</span>
+        <span v-if="footer.technologyStatus == 1">&nbsp;&nbsp;|&nbsp;&nbsp;技术支持:{{ footer.technology }}</span>
+        </p>
       </div>
 
-      <div class="footer__footer">
+      <!-- <div class="footer__footer">
         <a style="color:#e1e1e1;" target="_blank" :href="footer.miit">{{footer.icp}}</a>
         <p v-if="footer.technologyStatus == 1">技术支持:{{ footer.technology }}</p>
         <p v-if="footer.copyrightStatus == 1">版权所有:{{ footer.copyright }}</p>
         <div v-html="footer.otherHtml"></div>
-      </div>
+      </div> -->
     </div>
   </div>
 </template>
@@ -57,36 +63,40 @@ export default {
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
 .footer {
-  background: #f8fafc;
+  background: #333;
 
   &__header {
     .title {
       height: 40px;
       line-height: 40px;
-      font-size: 12px;
+      font-size: 18px;
       font-family: Microsoft YaHei;
-      font-weight: 400;
-      color: #999999;
-      border-bottom: 1px solid #eeeeee;
+      font-weight: bold;
+      color: #d8d8d8;
+      // border-bottom: 1px solid #eeeeee;
     }
 
     .links {
       padding-bottom: 14px;
-      border-bottom: 1px solid #eeeeee;
+      border-bottom: 1px solid #666;
 
       a {
+        cursor: pointer;
+        text-decoration: none;
         line-height: 14px;
         display: inline-block;
         margin-top: 14px;
         margin-right: 40px;
-        font-size: 12px;
+        font-size: 14px;
         font-family: Microsoft YaHei;
         font-weight: 400;
-        color: #999999;
+        color: #a9a9a9;
       }
     }
   }
-
+.footer__body{
+  text-align: center;
+}
   &__body {
     padding: 14px 0;
     p {

+ 2 - 2
src/components/goodsItem/index.vue

@@ -360,7 +360,7 @@ export default {
       width: 108px;
       height: 32px;
       line-height: 30px;
-      background: #3f8dfd;
+      background: #e48f00;//#3f8dfd;
       border-radius: 8px;
       font-size: 16px;
       color: #fff;
@@ -368,7 +368,7 @@ export default {
       transition: all 0.3s;
 
       &:hover {
-        background: #2b6dd6;
+        background: #e48f00;// #2b6dd6;
       }
     }
   }

+ 2 - 2
src/components/handoutItem/index.vue

@@ -177,7 +177,7 @@ export default {
       width: 108px;
       height: 32px;
       line-height: 30px;
-      background: #3f8dfd;
+      background: #e48f00;// #3f8dfd;
       border-radius: 8px;
       font-size: 16px;
       color: #fff;
@@ -185,7 +185,7 @@ export default {
       transition: all 0.3s;
 
       &:hover {
-        background: #2b6dd6;
+        background:  #e48f00;//#2b6dd6;
       }
     }
   }

+ 2 - 2
src/components/header1/index.vue

@@ -34,7 +34,7 @@
             style="display: none"
           />
         </div>
-        <el-button type="primary" @click="search" class="search__btn"
+        <el-button type="warning" @click="search" class="search__btn"
           >搜索</el-button
         >
       </div>
@@ -626,7 +626,7 @@ export default {
       // margin-top: 20px;
       width: 324px;
       background: #fafbfc;
-      border: 1px solid #3f8dfd;
+      border: 1px solid #e48f00;//#3f8dfd;
       border-radius: 8px;
       display: flex;
       overflow: hidden;

+ 1 - 1
src/components/listOption1/index.vue

@@ -375,7 +375,7 @@ export default {
           transition: all 0.2s;
           &.active {
             color: #fff;
-            background: #3f8dfd;
+            background: #e48f00;// #3f8dfd;
           }
         }
       }

+ 2 - 2
src/components/listOption2/index.vue

@@ -402,11 +402,11 @@ export default {
           transition: all 0.1s;
           &.active {
             color: #fff;
-            background: rgba(0, 122, 255, 1);
+            background: #e48f00;//  rgba(0, 122, 255, 1);
           }
           &:hover {
             color: #fff;
-            background: rgba(0, 122, 255, 1);
+            background:  #e48f00;// rgba(0, 122, 255, 1);
           }
         }
         & > .t-button-text {

+ 233 - 0
src/components/toolbar/videoFloatWindow.vue

@@ -0,0 +1,233 @@
+<template>
+  <div class="video-popup-container">
+    <!-- 右下方悬浮触发按钮 -->
+    <div class="popup-trigger" v-show="!videoPopupVisible" @click="openVideoPopup">
+      <el-button icon="el-icon-video-play" type="primary" circle size="large" />
+    </div>
+
+    <!-- Element Dialog实现500*500视频弹出层 -->
+    <el-dialog
+      :title="videoList[curIndex].title"
+      :visible.sync="videoPopupVisible"
+      width="400px"
+      class="video-dialog1"
+      top="0px"
+      :modal="false" 
+      :close-on-click-modal="false" 
+      :style="{right:'0px',left:'unset',bottom:'0px',top:'unset'}"
+      destroy-on-close  
+    >
+      <!-- 视频播放核心区域(500*500适配) -->
+      <div class="video-play-wrapper">
+        <video
+          ref="videoPlayer"
+          :src="videoList[curIndex].videoUrl"
+          class="video-player"
+          controls
+          muted
+          autoplay
+          loop
+          playsinline
+        ></video>
+      </div>
+
+      <!-- 视频操作按钮 -->
+       <div class="video-control-btns" slot="footer">
+  <el-button @click="prevVideo" icon="el-icon-arrow-left" type="text">上一个</el-button>
+  <el-button @click="controlVideo('pause')" v-show="!videoPaused">
+    <i class="el-icon-video-pause"></i> 暂停
+  </el-button>
+  <el-button @click="controlVideo('play')" v-show="videoPaused">
+    <i class="el-icon-video-play"></i> 播放
+  </el-button>
+  <el-button @click="nextVideo" icon="el-icon-arrow-right" type="text">下一个</el-button>
+  <el-button type="primary" @click="closeVideoPopup">关闭窗口</el-button>
+</div>
+      <!-- <div class="video-control-btns" slot="footer">
+        <el-button @click="controlVideo('pause')" v-show="!videoPaused">
+          <i class="el-icon-video-pause"></i> 暂停
+        </el-button>
+        <el-button @click="controlVideo('play')" v-show="videoPaused">
+          <i class="el-icon-video-play"></i> 播放
+        </el-button>
+        <el-button type="primary" @click="closeVideoPopup">关闭窗口</el-button>
+      </div> -->
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'VideoPopupWindow',
+  data() {
+    return {
+      // 弹出层显示状态
+      videoPopupVisible: true,
+      // 视频地址(替换为你的实际地址,mp4/webm优先)
+      videoList: [{title:'全面识别 高度警惕 防范非法集资活动',videoUrl:require("@/assets/video/全面识别 高度警惕 防范非法集资活动.mp4")},
+        {title:'警惕养老服务领域骗局',videoUrl:require("@/assets/video/警惕养老服务领域骗局.mp4")},
+        {title:'戳破非法金融"新话术",远离非法金融活动',videoUrl:require("@/assets/video/戳破非法金融 “新话术”,远离非法金融活动.mp4")},
+      ],//'https://www.w3school.com.cn/i/movie.mp4',
+      // 视频播放状态
+      videoPaused: false,
+      curIndex:0,
+    }
+  },
+  mounted() {
+    // 监听视频播放/暂停状态,同步到页面
+    this.$nextTick(() => {
+      const video = this.$refs.videoPlayer
+      if (video) {
+        video.addEventListener('pause', () => { this.videoPaused = true })
+        video.addEventListener('play', () => { this.videoPaused = false })
+        // 4. 核心新增:监听视频播放完毕事件(ended),自动切下一个
+        video.addEventListener('ended', this.autoNextVideo)
+      }
+    })
+  },
+  beforeDestroy() {
+    // 销毁前移除监听,防止内存泄漏
+    const video = this.$refs.videoPlayer
+    if (video) {
+      video.removeEventListener('pause', () => {})
+      video.removeEventListener('play', () => {})
+      // 新增:移除ended事件监听
+      video.removeEventListener('ended', this.autoNextVideo)
+    }
+  },
+  methods: {
+    // 打开视频弹出层
+    openVideoPopup() {
+      this.videoPopupVisible = true
+      // 打开后自动播放视频
+      this.$nextTick(() => {
+        this.$refs.videoPlayer.play()
+      })
+    },
+    // 关闭视频弹出层
+    closeVideoPopup() {
+      this.videoPopupVisible = false
+      // 关闭后暂停视频
+      this.$refs.videoPlayer.pause()
+    },
+    // 控制视频播放/暂停
+    controlVideo(type) {
+      const video = this.$refs.videoPlayer
+      if (!video) return
+      type === 'play' ? video.play() : video.pause()
+    },
+    // 5. 核心新增:自动切下一个视频(ended事件回调)
+    autoNextVideo() {
+      this.nextVideo() // 直接调用手动下一个方法,逻辑复用
+    },
+    // 6. 新增:手动切下一个视频(支持循环,最后一个切回第一个)
+    nextVideo() {
+      // 计算下一个索引:最后一个视频则切回0,否则+1
+      this.curIndex = (this.curIndex + 1) % this.videoList.length
+      // 切换地址后,自动播放新视频
+      this.$nextTick(() => {
+        this.$refs.videoPlayer.play()
+      })
+    },
+    // 7. 新增:手动切上一个视频(支持循环,第一个切回最后一个)
+    prevVideo() {
+      // 计算上一个索引:第一个视频则切回最后一个,否则-1
+      this.curIndex = (this.curIndex - 1 + this.videoList.length) % this.videoList.length
+      // 切换地址后,自动播放新视频
+      this.$nextTick(() => {
+        this.$refs.videoPlayer.play()
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="css">
+/* 总容器:右下方固定,最高层级避免遮挡 */
+.video-popup-container {
+  position: fixed;
+  bottom: 30px;
+  right: 30px;
+  z-index: 9999;
+  pointer-events: auto;
+}
+
+/* 悬浮触发按钮:右下方固定,hover动画 */
+.popup-trigger {
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+.popup-trigger:hover {
+  transform: scale(1.05);
+}
+.el-dialog__wrapper{
+    position: absolute !important;
+}
+::v-deep .el-dialog__wrapper{
+    position: unset !important;
+}
+::v-deep .el-dialog__wrapper .el-dialog{
+    border: 1px solid #ccc;
+    margin: unset !important;
+    margin-bottom: 0px !important;
+}
+/* 核心:500*500视频弹层样式,固定右下方 */
+.video-dialog {
+  /* position: absolute;
+  top: auto;
+  left: auto;
+  bottom: 20px !important;
+  right: 20px !important; */
+  /* margin: 0 !important;
+  width: 400px !important;
+  height: 400px; */
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
+  border-radius: 8px;
+  /* overflow: hidden; */
+}
+
+/* Element Dialog头部样式适配 */
+::v-deep .video-dialog .el-dialog__header {
+  /* padding: 12px 20px; */
+  border-bottom: 1px solid #e6e6e6;
+  height: 60px;
+  box-sizing: border-box;
+}
+::v-deep .video-dialog .el-dialog__title {
+  font-size: 16px;
+  color: #333;
+}
+
+/* Element Dialog主体:填充剩余高度,适配500*500 */
+::v-deep .video-dialog .el-dialog__body {
+  padding: 0 0 !important;
+  height: calc(400px - 60px - 60px) !important; /* 总高 - 头部60 - 底部60 */
+  overflow: hidden;
+}
+
+/* Element Dialog底部:操作按钮区域,固定高度 */
+::v-deep .video-dialog .el-dialog__footer {
+  padding: 12px 20px;
+  border-top: 1px solid #e6e6e6;
+  height: 60px;
+  box-sizing: border-box;
+  text-align: right;
+}
+
+/* 视频播放容器:铺满Dialog主体 */
+.video-play-wrapper {
+  width: 100%;
+  height: 100%;
+}
+/* 视频样式:铺满容器,保持比例,不拉伸 */
+.video-player {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+/* 操作按钮间距适配 */
+.video-control-btns .el-button {
+  margin-left: 8px;
+}
+</style>

+ 45 - 0
src/components/videoCy/index.vue

@@ -63,6 +63,8 @@ export default {
       timeNeedtoTakeVideo: null, //需要随机录制2秒视频定时器
       curPlayOver:false,//当前视频已播放完毕
       picDeviceName:'',//PHOTE
+      leaveTips: false,
+      showtipsing: false,
     };
   },
   computed: {
@@ -151,10 +153,50 @@ export default {
           }
         }
       ); //播放器初始化完毕时触发。播放器提供的方法需要在此事件发生后才可以调用。
+      await this.screencheck(); //获取离开是否暂停视频
     });
     // document.addEventListener("visibilitychange", this.pauseVideo);
   },
   methods: {
+    handleMouseOut() {
+      // console.log(111, this.leaveTips, this.showtipsing);
+      if (this.leaveTips && !this.showtipsing) {
+        this.showtipsing = true;
+         setTimeout(() => {
+        if (this.viewSign == 2) {
+          this.player_tencent.pause(); //暂停
+        } else {
+          this.player.j2s_pauseVideo(); //暂停
+        }
+      }, 1000);
+        this.$confirm(`退出会中断学习,请保持鼠标在当前页面!`, "提示", {
+          confirmButtonText: "确定",
+          closeOnClickModal: false,
+          closeOnPressEscape: false,
+          showCancelButton: false,
+          distinguishCancelAndClose: false,
+          showClose: false,
+        })
+          .then((_) => {
+            this.showtipsing = false;
+          })
+          .catch((_) => {});
+      }
+    },
+    screencheck() {
+       return new Promise((resolve) => {
+      // console.log(222,this.goodsData)
+      this.$request.screencheck(this.goodsData.orderGoodsId).then((res) => {
+        if (res.code == 200) {
+          if (res.data) {
+            this.leaveTips = true;
+    window.addEventListener("blur", this.handleMouseOut);
+          }
+        }
+      resolve();
+      }); 
+        });
+    },
     getBeforeWork() {},
     //初始化参数
     initData() {
@@ -1196,6 +1238,9 @@ export default {
     },
   },
   beforeDestroy() {
+    if(this.leaveTips){
+      window.removeEventListener('blur', this.handleMouseOut);
+    }
     this.$bus.$off("toPlay");
     clearTimeout(this.videoPauseSetTimeout); //删除暂停计算拍照定时器
     // document.removeEventListener("visibilitychange", this.pauseVideo);

+ 1 - 1
src/pages/home1/index.vue

@@ -86,7 +86,7 @@
                 autocomplete="new-password"
               />
             </div>
-            <el-button type="primary" @click="search" class="search__btn"
+            <el-button type="warning" @click="search" class="search__btn"
               >搜索</el-button
             >
           </div>

+ 178 - 178
src/pages/home2/index.vue

@@ -238,187 +238,187 @@ export default {
       ],
       teacher: [
         [
-          {
-            imgUrl: require("@/assets/new1/ch.png"),
-            name: "陈红",
-            occupation: "教授、高级工程师",
-            remark: [
-              "国务院安委会、咨询、建筑施工专业委员会专家",
-              "中国模板手脚架协会副秘书长",
-              "原中国建筑一局 (集团)有限公司工程技术部经理参编国家标准:",
-              "《建筑施工脚手架安全技术统一标准》",
-              "《建筑施工扣件式钢管脚手架安全技术规范》",
-              "《建筑施工临时支撑技术规范》"
-            ]
-          },
-          {
-            imgUrl: require("@/assets/new1/xfk.png"),
-            name: "徐福康",
-            occupation: "教授、高级工程师",
-            remark: [
-              "上海市施工现场安全生产保证体系第一审核认证中心副主任、总工程师",
-              "上海市建设工程安全质量监督总站高级工程师",
-              "国家标准《建筑施工企业安全生产管理规范》主要起草人"
-            ]
-          },
-          {
-            imgUrl: require("@/assets/new1/mym.png"),
-            name: "马英明",
-            occupation: "教授、高级工程师",
-            remark: [
-              "中国矿业大学博士生导师",
-              "国家住建部全国地铁与轻轨建设专家组专家",
-              "广东省人民政府科技专家顾问委员会委员",
-              "原中国地下工程学会副主任"
-            ]
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/new1/khc.png"),
-            name: "邝穗春",
-            occupation: "工程师、高级讲师",
-            remark: [
-              "广州市建筑置业有限公司",
-              "生产技术部/工程部/资料管理部副部长",
-              "广州市市政集团培训中心高级讲师",
-              "广州大学市政技术学院特聘讲师",
-              "专业从事建筑工程竣工验收/技术资料管理",
-              "建筑工程施工安全资料管理"
-            ]
-          },
-          {
-            imgUrl: require("@/assets/new1/hxx.png"),
-            name: "胡欣欣",
-            occupation: "教授、硕士生导师",
-            remark: [
-              "二建考前名师",
-              "广东工业大学土木与交通工程学员硕士生导师",
-              "广东省工程造价协会专家库成员",
-              "广东省工程咨询协会专家库成员"
-            ]
-          },
-          {
-            imgUrl: require("@/assets/new1/zzhteacher.png"),
-            name: "朱培浩",
-            occupation: "博士、教材主编",
-            remark: ["机电实务全国名师", "建造师相关教材主编、参编"]
-          }
+        //   {
+        //     imgUrl: require("@/assets/new1/ch.png"),
+        //     name: "陈红",
+        //     occupation: "教授、高级工程师",
+        //     remark: [
+        //       "国务院安委会、咨询、建筑施工专业委员会专家",
+        //       "中国模板手脚架协会副秘书长",
+        //       "原中国建筑一局 (集团)有限公司工程技术部经理参编国家标准:",
+        //       "《建筑施工脚手架安全技术统一标准》",
+        //       "《建筑施工扣件式钢管脚手架安全技术规范》",
+        //       "《建筑施工临时支撑技术规范》"
+        //     ]
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/new1/xfk.png"),
+        //     name: "徐福康",
+        //     occupation: "教授、高级工程师",
+        //     remark: [
+        //       "上海市施工现场安全生产保证体系第一审核认证中心副主任、总工程师",
+        //       "上海市建设工程安全质量监督总站高级工程师",
+        //       "国家标准《建筑施工企业安全生产管理规范》主要起草人"
+        //     ]
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/new1/mym.png"),
+        //     name: "马英明",
+        //     occupation: "教授、高级工程师",
+        //     remark: [
+        //       "中国矿业大学博士生导师",
+        //       "国家住建部全国地铁与轻轨建设专家组专家",
+        //       "广东省人民政府科技专家顾问委员会委员",
+        //       "原中国地下工程学会副主任"
+        //     ]
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/new1/khc.png"),
+        //     name: "邝穗春",
+        //     occupation: "工程师、高级讲师",
+        //     remark: [
+        //       "广州市建筑置业有限公司",
+        //       "生产技术部/工程部/资料管理部副部长",
+        //       "广州市市政集团培训中心高级讲师",
+        //       "广州大学市政技术学院特聘讲师",
+        //       "专业从事建筑工程竣工验收/技术资料管理",
+        //       "建筑工程施工安全资料管理"
+        //     ]
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/new1/hxx.png"),
+        //     name: "胡欣欣",
+        //     occupation: "教授、硕士生导师",
+        //     remark: [
+        //       "二建考前名师",
+        //       "广东工业大学土木与交通工程学员硕士生导师",
+        //       "广东省工程造价协会专家库成员",
+        //       "广东省工程咨询协会专家库成员"
+        //     ]
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/new1/zzhteacher.png"),
+        //     name: "朱培浩",
+        //     occupation: "博士、教材主编",
+        //     remark: ["机电实务全国名师", "建造师相关教材主编、参编"]
+        //   }
         ]
       ],
       certificate: [
-        [
-          {
-            imgUrl: require("@/assets/zzzs/bxxkz-zb.jpg"),
-            width: "290px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/djz.jpg"),
-            width: "290px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/hjgltxrz.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zyhjaqgktxrz.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zlgltxrz.jpg"),
-            width: "147px"
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/zzzs/zzqyzhjyxtrzzs.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/facesbrzzs.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzyxtptrzzs1.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzyxtptrzzs2.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzzhkcrzzs1.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzzhkcrzzs3.jpg"),
-            width: "147px"
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/zzzs/zzzhkcrzzs2.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzzhkcrzzs3-3.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/zzzhkcrzzs.jpg"),
-            width: "147px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A1.jpg"),
-            width: "290px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A2.jpg"),
-            width: "290px"
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/zzzs/2018A3.jpg"),
-            width: "300px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A4.jpg"),
-            width: "300px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A5.jpg"),
-            width: "300px"
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/zzzs/2018A6.jpg"),
-            width: "300px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A7.jpg"),
-            width: "300px"
-          },
-          {
-            imgUrl: require("@/assets/zzzs/2018A8.jpg"),
-            width: "300px"
-          }
-        ],
-        [
-          {
-            imgUrl: require("@/assets/zzzs/2019A1.jpg"),
-            width: "300px"
-          },
-          {
-            imgUrl: "",
-            width: "300px"
-          },
-          {
-            imgUrl: "",
-            width: "300px"
-          }
-        ]
+         // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/bxxkz-zb.jpg"),
+        //     width: "290px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/djz.jpg"),
+        //     width: "290px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/hjgltxrz.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zyhjaqgktxrz.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zlgltxrz.jpg"),
+        //     width: "147px"
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzqyzhjyxtrzzs.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/facesbrzzs.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzyxtptrzzs1.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzyxtptrzzs2.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzzhkcrzzs1.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzzhkcrzzs3.jpg"),
+        //     width: "147px"
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzzhkcrzzs2.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzzhkcrzzs3-3.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/zzzhkcrzzs.jpg"),
+        //     width: "147px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A1.jpg"),
+        //     width: "290px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A2.jpg"),
+        //     width: "290px"
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A3.jpg"),
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A4.jpg"),
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A5.jpg"),
+        //     width: "300px"
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A6.jpg"),
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A7.jpg"),
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2018A8.jpg"),
+        //     width: "300px"
+        //   }
+        // ],
+        // [
+        //   {
+        //     imgUrl: require("@/assets/zzzs/2019A1.jpg"),
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: "",
+        //     width: "300px"
+        //   },
+        //   {
+        //     imgUrl: "",
+        //     width: "300px"
+        //   }
+        // ]
       ]
     };
   },

+ 327 - 11
src/pages/home3/index.vue

@@ -89,7 +89,7 @@
                   autocomplete="new-password"
                 />
               </div>
-              <el-button type="primary" @click="search" class="search__btn"
+              <el-button type="warning" @click="search" class="search__btn"
                 >搜索</el-button
               >
             </div>
@@ -486,7 +486,7 @@
         <template v-if="apiList[activeName].length > 0">
           <ul class="c">
             <li
-              v-for="(item, index) in apiList[activeName].slice(0, 5)"
+              v-for="(item, index) in apiList[activeName].slice(0, 4)"
               :key="index"
               @click="jumpInfo(item)"
             >
@@ -711,7 +711,69 @@
           </div>
         </div>
       </section>
-  
+   <section class="section container content_main tj_main"
+      v-if="$store.state.other.team == 1"
+    >
+      <div class="header_main">
+        <div class="hbox">
+          <img src="@/assets/new1/sztd.png" alt="" />
+          <h2>师资团队</h2>
+        </div>
+      </div>
+      <el-carousel indicator-position="none" :autoplay="false" height="363px">
+        <el-carousel-item v-for="(item, index) in teacher" :key="index">
+          <div class="carousel_box">
+            <div v-for="(it, ix) in item" class="carousel_li" :key="ix">
+              <div class="header_teacher">
+                <img :src="it.imgUrl" alt="" />
+                <div class="r">
+                  <h3>{{ it.name }}</h3>
+                  <p>{{ it.occupation }}</p>
+                </div>
+              </div>
+              <ul class="content_teacher">
+                <li v-for="(its, ixs) in it.remark" :key="ixs">{{ its }}</li>
+              </ul>
+            </div>
+          </div>
+        </el-carousel-item>
+      </el-carousel>
+    </section>
+    <section class="section container content_main tj_main"
+      style="margin-bottom: 20px!important;"
+      v-if="$store.state.other.certificate == 1"
+    >
+      <div class="header_main">
+        <div class="hbox">
+          <img src="@/assets/new1/cjwt.png" alt="" />
+          <h2>资质证书</h2>
+        </div>
+      </div>
+      <el-carousel indicator-position="none" :autoplay="false" height="207px">
+        <el-carousel-item v-for="(item, index) in certificate" :key="index">
+          <div class="carousel_box">
+            <div
+              v-for="(it, ix) in item"
+              class="carousel_img"
+              :key="ix"
+              :class="it.imgUrl ? 'carousel_hover' : ''"
+              :style="{
+                width: it.width,
+                borderColor: !it.imgUrl ? 'transparent' : '#eee'
+              }"
+            >
+              <el-image
+                v-if="it.imgUrl"
+                style="width: 100%; height: 100%"
+                :src="it.imgUrl"
+                :preview-src-list="[it.imgUrl]"
+              >
+              </el-image>
+            </div>
+          </div>
+        </el-carousel-item>
+      </el-carousel>
+    </section>
       <el-dialog
         :visible.sync="bindShow"
         width="348px"
@@ -756,6 +818,7 @@
   
       <ToolBar></ToolBar>
       <Footer></Footer>
+      <videoFloatWindow />
       <wx-login ref="wxLogin" @wxLoginBack="wxLoginBack"></wx-login>
   
       <RebuildModal
@@ -780,6 +843,7 @@
   import wxLogin from "@/components/wxLogin/index";
   import Footer from "@/components/footer/index";
   import ToolBar from "@/components/toolbar/index";
+  import videoFloatWindow from "@/components/toolbar/videoFloatWindow";
   import GoodsItem from "@/components/goodsItem/index";
   import { swiper, swiperSlide } from "vue-awesome-swiper";
   import { mapGetters, mapMutations } from "vuex";
@@ -794,7 +858,8 @@
       GoodsItem,
       ToolBar,
       wxLogin,
-      RebuildModal
+      RebuildModal,
+      videoFloatWindow
     },
     computed: {
       ...mapGetters(["userInfo", "token", "header", "nav", "msgCount", "mobile"]),
@@ -848,7 +913,124 @@
         isLoginSms: false,
         isBind: false,
         getLoginCodeLock: false,
-  
+   teacher: [
+        [
+          {
+            imgUrl: require("@/assets/new1/teach1.png"),
+            name: "魏霖阳",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "工学硕士、金牌讲师",
+              "国家级科研项目核心成员",
+              "粉丝矩阵:50w+;单日涨粉:10000+",
+              "独创「秒题全课程体系」",
+              "\"社工赛道破局者\"",
+              "学术实战派教育管理者,专注于社会工作师等职业考证培训,以学术严谨性和实战效果著称。"
+            ]
+          },
+          {
+            imgUrl: require("@/assets/new1/teach2.png"),
+            name: "晁高点",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "金牌讲师",
+              "独创「举例教学法」    全网粉丝:20w+",
+              "抖音平台单课程累计付费:突破1000w+",
+              "5年扎实社工经验  10年金牌授课经验",
+              "\"桃李天下 赞誉载道\"",
+              "兼具实战经验与授课技巧的资深讲师,以举例教学法著称。"
+            ]
+          },
+          {
+            imgUrl: require("@/assets/new1/teach3.png"),
+            name: "王娜",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "金牌讲师",
+              "首创「娜多分口诀」记忆法",
+              "全网粉丝:20w+  线上学员总量:突破100w+",
+              "\"战略转型 破圈典范\"",
+              "\"专业筑基 实践先锋\"",
+              "以创新记忆法著称的专业讲师,擅长将复杂考点转化为易于记忆的口诀"
+            ]
+          }
+        ],
+        [
+          {
+            imgUrl: require("@/assets/new1/teach4.png"),
+            name: "李君",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "金牌讲师",
+              "抖音粉丝:50w+",
+              "视频号粉丝:10w+",
+              "教学卓越 · 备受信赖 · 真诚服务 · 口碑载道",
+              "入职3年成功转型优秀讲师主播",
+              "从传统教学成功转型为线上直播讲师的代表人物"
+            ]
+          },
+          {
+            imgUrl: require("@/assets/new1/teach5.png"),
+            name: "张小凡",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "金牌讲师",
+              "社会工作者单月业绩:10w+",
+              "一级建造师单月业绩:30w+",
+              "中级经济师单日业绩:3w+",
+              "三域穿透式教学法  “三域开疆 · 数据见证破局”",
+              "横跨社会工作者、一级建造师、中级经济师三大考证领域的全能型讲师"
+            ]
+          },
+          {
+            imgUrl: require("@/assets/new1/teach6.png"),
+            name: "刘向向",
+            occupation: "工程师、高级讲师",
+            remark: [
+              "金牌讲师", 
+            "矩阵粉丝:50w+  年课程销售额:500w+", 
+            "现象级教培IP       学员通关率:行业TOP 3%",
+            "职业考证三栖王牌导师        主编《社会工作者330句》连续登顶抖音教辅热销榜",
+            "全链路操盘型的现象级教培讲师,从教材研发到直播带货的完整闭环能力"]
+          }
+        ]
+      ],
+      certificate: [
+        [
+          {
+            imgUrl: require("@/assets/zzzs/bxxkz-zb.png"),
+            width: "300px"
+          },
+          {
+            imgUrl: require("@/assets/zzzs/djz.png"),
+            width: "300px"
+          },
+          {
+            imgUrl: require("@/assets/zzzs/djz2.png"),
+            width: "300px"
+          },
+          {
+            imgUrl: require("@/assets/zzzs/bxxkz-zb2.png"),
+            width: "300px"
+          },
+          // {
+          //   imgUrl: require("@/assets/zzzs/hjgltxrz.jpg"),
+          //   width: "147px"
+          // },
+          // {
+          //   imgUrl: require("@/assets/zzzs/zyhjaqgktxrz.jpg"),
+          //   width: "147px"
+          // },
+          // {
+          //   imgUrl: require("@/assets/zzzs/zlgltxrz.jpg"),
+          //   width: "147px"
+          // }
+        ],[
+          {
+            imgUrl: require("@/assets/zzzs/djz3.png"),
+            width: "300px"
+          },
+        ]],
         isloginSms: false,
         swiperOptions: {
           loop: true,
@@ -907,11 +1089,11 @@
         courseId: "",
         bankId: "",
         packPageStatus: false,
-        activeName: "d1",
+        activeName: "d2",
         tab: [
-        { label: "开班消息", value: "d1" },
         { label: "最新消息", value: "d2" },
         { label: "政策法规", value: "d3" },
+        { label: "开班消息", value: "d1" },
         { label: "通知公告", value: "d4" },
       ],
       apiList: {
@@ -923,7 +1105,7 @@
       d0Total: 0,
       total: 0,
       formData: {
-        pagesize: 10,
+        pagesize: 8,
         pageindex: 1,
       },
       };
@@ -950,7 +1132,7 @@
       // this.color = this.colors[0];
       this.advertisingList();
       this.educationTypeList();
-      this.getd1();
+      this.getd2();
     },
     watch: {
       userInfo(val) {
@@ -2007,7 +2189,7 @@
             margin-left: 30px;
             width: 648px;
             background: #fafbfc;
-            border: 1px solid #3f8dfd;
+            border: 1px solid #e6a23c;//#3f8dfd;
             border-radius: 8px;
             display: flex;
             overflow: hidden;
@@ -2084,7 +2266,7 @@
           color: #333;
   
           &.active {
-            color: #3f8dfd;
+            color:#e6a23c;// #3f8dfd;
             background: #f0f5fc;
           }
         }
@@ -2883,6 +3065,140 @@
     background-color: #eee;
     height: 100%;
   }
+}
+.tj_main {
+    padding: 30px 20px 40px;
+    .header_main {
+      user-select: none;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding-bottom: 24px;
+      border-bottom: 1px dashed rgb(215, 215, 215);
+      margin-bottom: 20px;
+      & > .hbox {
+        display: flex;
+        align-items: center;
+        & > img {
+          width: 27px;
+          height: 27px;
+          margin-right: 10px;
+        }
+        & > h2 {
+          font-size: 24px;
+          font-style: italic;
+        }
+
+        /deep/ .el-tabs {
+          margin: 0px 40px;
+          width: 900px;
+          & > .el-tabs__header {
+            margin-bottom: 0px;
+            & > .el-tabs__nav-wrap::after {
+              display: none;
+            }
+          }
+        }
+        /deep/ .el-tabs__active-bar {
+          display: none;
+        }
+        /deep/ .el-tabs__item {
+          height: 30px;
+          line-height: 30px;
+        }
+        /deep/ .el-tabs__item.is-active {
+          color: #007aff !important;
+          font-weight: bold;
+        }
+        /deep/ .el-tabs__item:hover {
+          color: #007aff !important;
+          font-weight: bold;
+        }
+        /deep/ .el-tabs__nav-prev {
+          height: 30px !important;
+          line-height: 30px !important;
+        }
+        /deep/ .el-tabs__nav-next {
+          height: 30px !important;
+          line-height: 30px !important;
+        }
+      }
+      & > i {
+        cursor: pointer;
+        font-style: normal;
+        color: #7f7f7f;
+        &:hover {
+          font-weight: bold;
+          color: rgb(0, 122, 255);
+        }
+      }
+    }
+    .goods_main {
+      display: flex;
+      align-items: center;
+    }
+  }
+  .carousel_box {
+  width: 1050px;
+  margin: 0px auto;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  & > .carousel_li {
+    width: 330px;
+    height: 363px;
+    border-radius: 4px;
+    border: 1px solid #eee;
+    display: flex;
+    flex-direction: column;
+    cursor: pointer;
+    transition: all 0.2s;
+    overflow: hidden;
+    &:hover {
+      border-color: #409eff;
+    }
+    & > .header_teacher {
+      height: 124px;
+      display: flex;
+      align-items: center;
+      background-color: #fff;
+      padding: 20px;
+      & > img {
+        width: 80px;
+        height: 80px;
+        border-radius: 50%;
+        overflow: hidden;
+        margin-right: 20px;
+      }
+      & > .r {
+        flex: 1;
+        h3 {
+          font-size: 18px;
+          margin-bottom: 10px;
+        }
+        p {
+          font-size: 14px;
+        }
+      }
+    }
+    & > .content_teacher {
+      padding: 14px;
+      height: 1px;
+      flex: 1;
+      color: #fff;
+      background-color:#2c55cb;// rgb(51, 149, 255);
+      li {
+        line-height: 30px;
+      }
+    }
+  }
+  & > .carousel_img {
+    border: 1px solid #eee;
+    height: 207px;
+  }
+}
+.carousel_hover:hover {
+  border-color: rgb(0, 122, 255) !important;
 }
   </style>