Merge branch 'main' of http://122.51.230.86:3000/dianliang/school_website

ruoyi-ui/src/views/officialWebsite/cases.vue

@@ -13,27 +13,47 @@
         <div class="left"> <img src="../../assets/gw/home.png" alt="">
           <p><span href="/">首页</span><i class="el-icon-arrow-right"></i> <span href="">合作企业</span></p>
         </div>
-        <div class="nav-item" v-for="(item, index) in nav" v-bind:class="[index === currentActive ? 'active' : '']"
+        <!-- <div class="nav-item" v-for="(item, index) in nav" v-bind:class="[index === currentActive ? 'active' : '']"
           @click="getCurrentActive(index)">
           {{ item.categoryName }}
-        </div>
+        </div> -->
       </div>
     </div>
 
     <div class="list">
       <!-- main -->
-      <div v-for="(item, index) in nav " :key=index>
+      <!-- <div v-for="(item, index) in nav " :key=index>
         <div class="about-conts-item1" v-if="currentActive == index">
           <div class="neirong" v-html="pageContextList[index]"></div>
         </div>
-      </div>
-      <!-- <div class="item" v-for="(item, index) in 8" :key="index">
-        <div class="img">
-          <img src="../../assets/gw/Snipaste_2024-07-24_21-58-16.jpg" alt="" class="">
-        </div>
-        <div class="tt">船舶轮机实训虚拟仿真项目</div>
-
       </div> -->
+
+      <!-- 教学成果 -->
+      <!-- <div class="ayptjs" >
+        <div class="tt">教学成果</div>
+        <div class="ayptjs-list">
+          <div class="item" v-for="(item, index) in teachingAchievements" :key="index" @click="showDetails(item)">
+            <div class="img">
+              <img :src="imgurl + item.contentImg" alt="">
+              <img src="../../assets/gw/Snipaste_2024-07-23_22-51-23.jpg" alt="">
+            </div>
+            <div class="text">
+              <div class="tts">{{ item.contentTitle }}</div>
+              <div class="desc">
+                <div class="desc" v-html="item.summary"></div>
+              </div>
+            </div>
+
+          </div>
+        </div>
+      </div> -->
+      <div class="item" v-for="(item, index) in teachingAchievements" :key="index">
+        <div class="img">
+          <img :src="imgurl + item.contentImg" alt="">
+        </div>
+        <div class="tt">{{ item.contentTitle }}</div>
+
+      </div>
     </div>
 
     <div class="page-box">
@@ -65,6 +85,8 @@ export default {
   },
   data() {
     return {
+      imgurl: process.env.VUE_APP_BASE_API,
+      teachingAchievements: [],
       pageContextList: [],
       nav: [
         // { name: '教学团队' },
@@ -75,7 +97,7 @@ export default {
 
     }
   },
-  mounted() {
+  created() {
     // 页面加载完毕调用
     this.initPageData();
   },
@@ -91,29 +113,26 @@ export default {
       }
       this.currentActive = value
     },
+
     initPageData() {
 
-      let routeParam = {
+let routeParam = {
-        "categoryId": this.$route.query.id,
+  "categoryId": this.$route.query.id,
-        "pageNum": 1,
+  "pageNum": 1,
-        "pageSize": 10
+  "pageSize": 10
-      }
+}
-      getPageColumn(routeParam).then(response => {
+getPageColumn(routeParam).then(response => {
-        response.data.forEach(cloumnItem => {
+  response.data.forEach(cloumnItem => {
-          this.nav.push(cloumnItem);
+    this.nav.push(cloumnItem);
 
-          let context = "";
+      cloumnItem.children.list.forEach(element => {
-          cloumnItem.children.list.forEach(element => {
+        this.teachingAchievements.push(element);
-            context += element.contentDetail;
-          });
-
-          this.pageContextList.push(context);
-
-          // cloumnItem.categoryName
-        });
       });
+    // cloumnItem.categoryName
+  });
+});
 
-    },
+},
   }
 
 }
@@ -192,10 +211,12 @@ export default {
   /* 禁止背景图片重复 */
   position: relative;
 }
-.page-box{
+
+.page-box {
   width: 82%;
   margin: 10px auto;
 }
+
 .tab-box {
   width: 100%;
   box-sizing: border-box;

ruoyi-ui/src/views/officialWebsite/practice.vue

@@ -25,9 +25,55 @@
       <!-- main -->
       <div v-for="(item, index) in nav " :key=index>
         <div class="about-conts-item1" v-if="currentActive == index">
-          <div class="neirong" v-html="pageContextList[index]"></div>
+          <!-- 实践平台 -->
+          <div v-if="item.id == '1813831828977618944'" class="list">
+            <div class="item" v-for="(item, index) in teachingAchievements" :key="index">
+              <div class="img">
+                <img :src="imgurl + item.contentImg" alt="">
+              </div>
+              <div class="tt">{{ item.contentTitle }}</div>
+              <div class="desc">
+                <div class="desc" v-html="item.summary"></div>
+              </div>
+
+            </div>
+          </div>
+
+          <!-- 实践项目 -->
+          <div v-if="item.id == '1813831932748894208'" class="list">
+            <div class="item" v-for="(item, index) in teachingAchievements2" :key="index">
+              <div class="img">
+                <img :src="imgurl + item.contentImg" alt="">
+              </div>
+              <div class="tt">{{ item.contentTitle }}</div>
+              <div class="desc">
+                <div class="desc" v-html="item.summary"></div>
+              </div>
+
+            </div>
+          </div>
+
+          <!-- 实践项目 -->
+          <div v-if="item.id == '1813832045458231296'" class="list">
+            <div class="item" v-for="(item, index) in teachingAchievements3" :key="index">
+              <div class="img">
+                <img :src="imgurl + item.contentImg" alt="">
+              </div>
+              <div class="tt">{{ item.contentTitle }}</div>
+              <div class="desc">
+                <div class="desc" v-html="item.summary"></div>
+              </div>
+
+            </div>
+          </div>
+
+          <!-- 通用 -->
+          <div class="neirong" v-html="pageContextList[index]" v-else></div>
         </div>
       </div>
+
+
+
       <!-- 实践教学资源 -->
       <!-- <div class="about-conts-item1" v-if="currentActive == 0">
         <div class="neirong" v-html="content"></div>
@@ -112,6 +158,10 @@ export default {
   },
   data() {
     return {
+      imgurl: process.env.VUE_APP_BASE_API,
+      teachingAchievements: [],
+      teachingAchievements2: [],
+      teachingAchievements3: [],
       pageContextList: [],
       input4: "",
       show_search: true,
@@ -171,6 +221,21 @@ export default {
 
           this.pageContextList.push(context);
 
+          if (cloumnItem.id == "1813831828977618944") {
+            cloumnItem.children.list.forEach(element => {
+              this.teachingAchievements.push(element);
+            });
+          }
+          if (cloumnItem.id == "1813831932748894208") {
+            cloumnItem.children.list.forEach(element => {
+              this.teachingAchievements2.push(element);
+            });
+          }
+          if (cloumnItem.id == "1813832045458231296") {
+            cloumnItem.children.list.forEach(element => {
+              this.teachingAchievements3.push(element);
+            });
+          }
           // cloumnItem.categoryName
         });
       });
@@ -802,4 +867,82 @@ export default {
   line-height: 18px;
 
 }
+
+.list {
+  width: 80%;
+  margin: 30px auto;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  margin-top: 50px;
+
+}
+
+.list .item {
+  width: 23%;
+  height: 220px;
+  margin-bottom: 30px;
+  position: relative;
+  background-color: #fff;
+  overflow: hidden;
+  cursor: pointer;
+}
+
+.list .item .img {
+  width: 100%;
+  height: 220px;
+  border-radius: 0px 0px 0px 0px;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.list .item .img img {
+  width: 75%;
+}
+
+.list .item .tt {
+  font-size: 20px;
+
+  position: absolute;
+  width: 94%;
+  height: 94%;
+  font-weight: 500;
+  font-size: 20px;
+  color: #FFFFFF;
+  line-height: 35px;
+  padding: 3%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: rgba(0, 83, 117, 0.9);
+  top: 100%;
+  left: 0;
+  transition: 0.5s ease;
+}
+
+.list .item:hover .tt {
+  top: 0%;
+}
+
+.desc {
+  overflow: hidden;
+  /** 隐藏超出的内容 **/
+  word-break: break-all;
+  text-overflow: ellipsis;
+  /** 多行 **/
+  display: -webkit-box;
+  /** 对象作为伸缩盒子模型显示 **/
+  -webkit-box-orient: vertical;
+  /** 设置或检索伸缩盒对象的子元素的排列方式 **/
+  -webkit-line-clamp: 2;
+  /** 显示的行数 **/
+  line-height: 28px;
+  font-size: 16px;
+  /* display: none; */
+  transition: 0.5s ease;
+  margin-bottom: -85px;
+  /* padding-bottom: 20px; */
+}
 </style>