院校库--就业报告

src/views/career/plan/UniversitiesDetail.vue

@@ -140,6 +140,17 @@
               </template>
             </mx-table>
           </div>
+          <div class="mt20" v-if="employmentreports.length">
+            <p class="format-tit">就业报告</p>
+            <div class="list f-333">
+                <div class="list-item" v-for="item in employmentreports">
+                  <span @click="toWindow(item.webSite)">{{item.title}}</span>
+                  <span class="url" @click="toWindow(item.url)" v-if="item.url"><i class="el-icon-edit mr5" ></i>在线预览</span>
+                  <span v-if="item.url"  @click="toWindow(item.url)">下载附件</span>
+                </div>
+            </div>
+          </div>
+
         </div>
 
       </div>
@@ -186,6 +197,7 @@ export default {
       subjectevaluates: [],
       evaluateTypes: [],
       evaluate_type: '',
+      employmentreports:[],
       loading:false,
       professionsProps: {
         level: {
@@ -351,6 +363,9 @@ export default {
   },
   watch: {},
   methods: {
+    toWindow(url) {
+      window.open(url,'_blank')
+    },
     getEvaluateType() {
       evaluateType({ code: this.code }).then(res => {
         this.evaluateTypes = res.data
@@ -374,6 +389,7 @@ export default {
         this.professions = res.data.professions
         this.subjects = res.data.subjects
         this.subjectevaluates = res.data.subjectevaluates
+        this.employmentreports =res.data.employmentreports
         this.activeSylId = this.subjects.sylSubjectsGroup ? this.subjects.sylSubjectsGroup[0].id : ''
         console.log(res)
       }).finally(_=>{
@@ -423,7 +439,17 @@ export default {
     -webkit-box-orient: vertical;
     word-wrap: break-word;
   }
-
+  .list-item{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 1px solid #f2f2f2;
+    font-size: 14px;
+    padding-bottom: 10px;
+    .url:hover{
+      color: #42b983;
+    }
+  }
   .major-wrap {
     text-align: left;
 

src/views/career/plan/compoents/UniversityStyle.vue

@@ -20,13 +20,23 @@
     <!--    </div>-->
     <!--     图片列表-->
     <div class="image-wrap" v-if="senceList.length">
-      <div class="image-item" v-for="item in senceList" >
-        <el-image class="cover-image" fit="fill" :src="item.url" :preview-src-list="srcList"></el-image>
-        <p class="mt15 text-overflow-ellipsis f14 lh20">{{ item.description }}</p>
+      <div class="image-item" v-for="item in senceList">
+        <div v-if="item.type == 1" class="cover-image vr" @click="toVR(item.url)">
+          <el-image class="cover-image" fit="fill" :src="item.coverUrl"  ></el-image>
+          <p class="mt10 text-overflow-ellipsis f14 lh20">VR校园</p>
+          <div class="colleges-imgs-mask">
+            <i class="iconfont icon-vr" style="font-size: 28px"></i>
+          </div>
+        </div>
+        <div v-if="item.type == 3">
+          <el-image class="cover-image" fit="fill" :src="item.url" :preview-src-list="srcList"></el-image>
+          <p class="mt10 text-overflow-ellipsis f14 lh20">{{ item.description }}</p>
+        </div>
+
       </div>
     </div>
 
-    <evaluation-empty  class="mt20" v-else shadow title="暂无数据"></evaluation-empty>
+    <evaluation-empty class="mt20" v-else shadow title="暂无数据"></evaluation-empty>
 
   </div>
 </template>
@@ -54,7 +64,9 @@ export default {
   computed: {
     srcList() {
       if (!this.senceList.length) return []
-      return this.senceList.map(item => {
+      return this.senceList.filter(item => {
+          return item.type == 3
+      }).map(item => {
         return item.url
       })
     }
@@ -69,6 +81,9 @@ export default {
         .finally(_ => {
           this.loading = false
         })
+    },
+    toVR(url) {
+      window.open(url,"_blank");
     }
   }
 }
@@ -102,25 +117,28 @@ export default {
     margin-right: 0;
   }
 
-  //.vr{
-  //  background-image: url("http://toc.cn-bj.ufileos.com/media/files/20210414/9d02bb82.png");
-  //}
-  //.video {
-  //  background-image: url("http://img1.youzy.cn/content/media/thumbs/p00176063.jpeg");
-  //}
-  //.colleges-imgs-mask {
-  //  position: absolute;
-  //  top: 0;
-  //  left: 0;
-  //  width: 217px;
-  //  height: 120px;
-  //  background: rgba(0,0,0,.5);
-  //  color: #fff;
-  //  text-align: center;
-  //  line-height: 120px;
-  //  border-radius: 4px;
-  //  overflow: hidden;
-  //}
+  .vr {
+    background-image: url("http://toc.cn-bj.ufileos.com/media/files/20210414/9d02bb82.png");
+  }
+
+  .video {
+    background-image: url("http://img1.youzy.cn/content/media/thumbs/p00176063.jpeg");
+  }
+
+  .colleges-imgs-mask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 217px;
+    height: 120px;
+    background: rgba(0, 0, 0, .5);
+    color: #fff;
+    text-align: center;
+    line-height: 120px;
+    border-radius: 4px;
+    overflow: hidden;
+  }
+
   &:hover {
     color: #42b983;
   }