前端补正

ruoyi-ui/.env.development

@@ -5,8 +5,8 @@ VUE_APP_TITLE = 虚拟仿真实验教学中心
 ENV = 'development'
 
 # 若依管理系统/开发环境
-VUE_APP_BASE_API = 'https://f382b38516.zicp.fun'
-
+# VUE_APP_BASE_API = 'https://f382b38516.zicp.fun'
+VUE_APP_BASE_API = 'http://localhost:8080'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

ruoyi-ui/src/views/home.vue

@@ -60,7 +60,7 @@
             </swiper-slide>
           </swiper>
           <div class="swiper-pagination"></div>
-          <div style=" width: 156px;height: 42px;position: absolute;bottom: 30px; z-index: 99 "  @click="golist(indexList[0].id)" >
+          <div style=" width: 156px;height: 42px;position: absolute;bottom: 30px; z-index: 99 "  @click="golist(indexList[0])" >
             <img src="../assets/gw/anniu.png" style=" width: 156px;height: 42px" >
           </div>
         </div>
@@ -295,11 +295,12 @@ export default {
         query:{ id: '1813829868593483776' }
       });
     },
-    golist(id){
-      console.log('跳转',id)
+    golist(row){
+      // console.log('跳转',id)
+      console.log(row)
       this.$router.push({
         name: 'list',
-        query:{ id: id }
+        query:{ id: row.id, categoryTitle: row.categoryName }
       });
     },
     tabClick(item){

ruoyi-ui/src/views/officialWebsite/Components/page/index.vue

@@ -26,23 +26,36 @@ export default {
       defaultValue: undefined,
       required: false
     },
+    pageSize: {
+      type: Number,
+      defaultValue: 10,
+      required: false
+    },
+    pageNum: {
+      type: Number,
+      defaultValue: 1,
+      required: false
+    }
   },
   watch: {
     categoryId(newVal) {
-      this.queryParams = {
-        pageNum: 1,
-        pageSize: 10,
-        categoryId: newVal,
-      }
+      this.queryParams.categoryId = newVal
+      this.queryParams.pageNum = 1
       this.initPageData()
     },
+    pageSize(newVal){
+      this.queryParams.pageSize = newVal
+    },
+    pageNum(newVal){
+      this.queryParams.pageSize = newVal
+    },
   },
   data () {
     return{
       queryParams: {
         categoryId:"",
-        pageNum: 1,
-        pageSize: 10,
+        pageNum: this.pageNum || 1,
+        pageSize: this.pageSize || 10,
       },
       total: 0
     }
@@ -50,12 +63,17 @@ export default {
   methods : {
     initPageData() {
       // console.log(1, this.queryParams)
-      getPageData(this.queryParams).then(res => {
-        // console.log('列表',res)
-        this.listinfo = res.data.list;
-        this.total =res.data.total;
-        this.$emit('event-message', this.listinfo)
-      })
+      // console.log(this.queryParams.pageNum)
+      if (this.queryParams.categoryId !== ''){
+        getPageData(this.queryParams).then(res => {
+          // console.log('列表',res)
+          this.listinfo = res.data.list;
+          this.total =res.data.total;
+          this.$emit('event-message', this.listinfo)
+        })
+      }else {
+        this.$emit('event-message', [])
+      }
     },
   },
 }

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

@@ -21,29 +21,29 @@
         </div>
       </div>
     </div>
-    <div class="committee-cont">
-      <div v-if="currentActive == 0">
+    <div class="committee-cont" v-show="currentActive == 0">
+      <div >
         <div class="noticeRsr"   v-for="(item,index) in onelist" @click="goDeatail(item)" >
           <div >{{item.contentTitle}}</div>
           <div >{{item.publishDate}}</div>
         </div>
       </div>
-      <div v-if="currentActive == 0">
-        <page-util :category-id="categoryId" @event-message="handleDataFromPage" />
-      </div>
+      <page-util style="margin-top: 30px" :category-id="categoryId" @event-message="handleDataFromPage" />
+    </div>
 
+    <div class="committee-cont" v-if="currentActive !== 0" >
       <!-- main -->
-      <div v-for="(item, index) in nav " :key=index>
+      <div>
 
         <div class="about-conts-item1" v-if="currentActive == 2">
-          <div class="noticeRsr"   v-for="(item,index) in twolist" @click="goDeatail(item)" >
-            <div >{{item.contentTitle}}</div>
-            <div >{{item.publishDate}}</div>
+          <div class="noticeRsr" v-html="twolist[0].contentDetail" >
+<!--            <div >{{item.contentTitle}}</div>-->
+<!--            <div >{{item.publishDate}}</div>-->
           </div>
         </div>
-        <div v-if="currentActive == 2">
-          <page-util :category-id="categoryId" @event-message="handleDataFromPage" />
-        </div>
+<!--        <div v-show="currentActive == 2">-->
+<!--          <page-util :category-id="categoryId" @event-message="handleDataFromPage" />-->
+<!--        </div>-->
         <div class="about-conts-item1" v-if="currentActive == 1">
           <div class="dataClass">
             <div v-for="(item, index) in dataList">
@@ -52,7 +52,9 @@
           </div>
         </div>
       </div>
-
+<!--      <div v-show="currentActive !== 1 && currentActive !== 2">-->
+<!--        -->
+<!--      </div>-->
     </div>
 
     <footers></footers>
@@ -95,7 +97,7 @@ export default {
       input4: ""
     }
   },
-  mounted() {
+  created() {
     // 页面加载完毕调用
     this.initPageData();
   },
@@ -105,12 +107,18 @@ export default {
 
   methods: {
     handleDataFromPage(data){
-      if (this.currentActive == 0){
+      if (this.currentActive === 0){
         this.onelist = data
       }
-      if (this.currentActive == 2){
+      if (this.currentActive === 2){
         this.twolist = data
       }
+      // if (this.currentActive == 0){
+      //   this.onelist = data
+      // }
+      // if (this.currentActive == 2){
+      //   this.twolist = data
+      // }
 
     },
     goDeatail(data){
@@ -132,12 +140,17 @@ export default {
     },
     // 触发导航
     getCurrentActive(value) {
-      if (this.currentActive === 0){
-        this.categoryId = this.oneid
-      }
-      if (this.currentActive === 1){
-        this.categoryId = this.twoid
+      // console.log(1,value,  this.currentActive, this.categoryId)
+      if (this.value !== 1){
+        this.categoryId = this.nav[value].id
       }
+      // console.log(2, this.currentActive, this.categoryId)
+      // if (this.currentActive === 0){
+      //   this.categoryId = this.oneid
+      // }
+      // if (this.currentActive === 1){
+      //   this.categoryId = this.twoid
+      // }
       if (this.currentActive == value) {
         return
       }
@@ -145,6 +158,7 @@ export default {
       if (value === 1){
         this.getContentByCategoryId(this.nav[value].id)
       }
+
     },
     initPageData() {
 
@@ -613,5 +627,8 @@ export default {
 .noticeRsr:hover{
   color: #00A0E8;
   cursor: pointer;
+}
+committee-cont2{
+
 }
 </style>

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

@@ -404,7 +404,13 @@ export default {
       }
 
       this.currentActive = value
-      this.categoryId = value === 5 ? this.getNoticeId() : this.nav[value].id;
+      this.categoryId = ""
+
+      if (value === 5){
+        this.categoryId = this.getNoticeId()
+      }else {
+        this.categoryId = this.nav[value].id;
+      }
       // console.log(this.nav,'nav' )
     },
     initPageData() {

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

@@ -9,6 +9,7 @@
     </div>
     <!-- new -->
       <div class="b-box">
+        <div style="font-size: 28px;text-align: center">{{categoryTitle}}</div>
           <div class="gang_" v-for="(item,index) in listinfo" :key="index" @click="goDeatail(item)" >
             <div class="title_">{{item.contentTitle || '暂无标题' }}</div>
             <div class="time_" >{{item.createTime || 0.00 }}</div>
@@ -70,6 +71,7 @@ export default {
 
       content: "",
       leaderList: "",
+      categoryTitle: this.$route.query.categoryTitle,
     }
   },
   computed: {
@@ -106,7 +108,8 @@ export default {
     },
     initPageData() {
       // console.log("传参id", this.$route.query.id);
-      console.log(this.queryParams)
+      // console.log(this.queryParams)
+      if (!this.queryParams.categoryId) return;
       getPageData(this.queryParams).then(res => {
         console.log('列表',res)
         this.listinfo = res.data.list;

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

@@ -39,9 +39,9 @@
 <!--        </div>-->
 <!--      </div>-->
 
-    </div>
-    <div class="page-box">
-      <page-util :category-id="categoryId" @event-message="handleDataFromPage" />
+      <div class="page-box">
+        <page-util :category-id="categoryId" @event-message="handleDataFromPage" />
+      </div>
     </div>
     <footers></footers>
   </div>

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

@@ -21,6 +21,7 @@
         </div>
       </div>
     </div>
+
     <div class="about-conts" v-bind:class="[currentActive == 1 ? 'bj' : '']">
       <!-- main -->
       <div  v-for="(item, index) in nav " :key=index>
@@ -29,7 +30,7 @@
         </div>
       </div>
       <!-- 专业平台介绍 -->
-      <div class="ayptjs" v-if="currentActive == 0">
+      <div class="ayptjs" v-show="currentActive == 0">
 
         <div class="ayptjs-list">
           <div class="item" v-for="(item, index) in onelist" @click="goDeatail(item)" >
@@ -120,6 +121,7 @@ export default {
       }
     },
     handleDataFromPage(data){
+      console.log(data)
         this.onelist = data
     },
     // 触发导航

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

@@ -26,8 +26,8 @@
       <div v-for="(item, index) in nav " :key=index>
         <div class="about-conts-item1" v-if="currentActive == index">
           <!-- 实践平台 -->
-          <div v-if="item.id == '1813831828977618944'" class="list">
-            <div class="item" v-for="(item, index) in teachingAchievements" :key="index">
+          <div v-if="currentActive !== 0" class="list" >
+            <div class="item" v-for="(item, index) in teachingAchievements" :key="index" @click="toDetail(item.id)">
               <div class="img">
                 <img :src="imgurl + item.contentImg" alt="">
               </div>
@@ -35,38 +35,37 @@
               <div class="desc">
                 <div class="desc" v-html="item.summary"></div>
               </div>
-
             </div>
           </div>
 
           <!-- 实践项目 -->
-          <div v-else-if="item.id == '1813831932748894208'" class="swiper-list">
-            <div class="item" v-for="(item, index) in teachingAchievements2" :key="index">
-              <div class="img">
-                <img :src="imgurl + item.contentImg" alt="" class="imgWO">
-              </div>
-              <div class="tt">{{ item.contentTitle }}</div>
-              <div class="desc">
-                {{ item.summary }}
-              </div>
-              <div class="time">{{ item.publishDate }}</div>
-            </div>
-          </div>
+<!--          <div v-else-if="currentActive === 2" class="swiper-list">-->
+<!--            <div class="item" v-for="(item, index) in teachingAchievements2" :key="index">-->
+<!--              <div class="img">-->
+<!--                <img :src="imgurl + item.contentImg" alt="" class="imgWO">-->
+<!--              </div>-->
+<!--              <div class="tt">{{ item.contentTitle }}</div>-->
+<!--              <div class="desc">-->
+<!--                {{ item.summary }}-->
+<!--              </div>-->
+<!--              <div class="time">{{ item.publishDate }}</div>-->
+<!--            </div>-->
+<!--          </div>-->
 
           <!-- 自制仪器设备 -->
-          <div v-else-if="item.id == '1813832045458231296'" class="swiper-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">
-                {{ item.summary }}
-              </div> -->
+<!--          <div v-else-if="currentActive === 3" class="swiper-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>-->
+<!--              &lt;!&ndash; <div class="desc">-->
+<!--                {{ item.summary }}-->
+<!--              </div> &ndash;&gt;-->
 
-            </div>
+<!--            </div>-->
 
-          </div>
+<!--          </div>-->
 
           <!-- 通用 -->
           <div class="neirong" v-html="pageContextList[index]" v-else></div>
@@ -78,6 +77,9 @@
         </div>
       </div>
 
+      <div>
+        <page-util :page-num="pageNum" :page-size="8" :category-id="categoryId" @event-message="handleDataFromPage"/>
+      </div>
 
 
       <!-- 实践教学资源 -->
@@ -153,12 +155,14 @@ import "swiper/css/swiper.min.css";
 import { getPageData, getPageColumn } from "@/api/officialWebsite/getPageData";
 import footers from '@/views/officialWebsite/Components/footer.vue'
 import headers from '@/views/officialWebsite/Components/header.vue'
+import PageUtil from '@/views/officialWebsite/Components/page'
 export default {
   components: {
     headers,
     footers,
     Swiper,
     SwiperSlide,
+    PageUtil,
   },
   name: 'HelloWorld',
   props: {
@@ -173,6 +177,8 @@ export default {
       teachingAchievements2: [],
       teachingAchievements3: [],
       pageContextList: [],
+      categoryId: "",
+      pageNum: 1,
       input4: "",
       show_search: true,
       nav: [
@@ -194,7 +200,7 @@ export default {
 </p>
 <p style="box-sizing: inherit; margin-top: 0px; text-align: justify; text-indent: 2em; margin-bottom: 5px; line-height: 1.75em;">
     <span style="box-sizing: inherit; font-family: 微软雅黑, MicrosoftYaHei;"></span><br/>
-</p>`
+</p>`,
     }
   },
   mounted() {
@@ -216,6 +222,10 @@ export default {
       if (this.currentActive == value) {
         return
       }
+      if (value !== 0){
+        this.categoryId = this.nav[value].id
+        this.pageNum = 1
+      }
       this.currentActive = value;
       this.isShowDetails = false;
     },
@@ -236,29 +246,49 @@ 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);
-            });
-          }
+          // //实践平台
+          // if (cloumnItem.id == "1813831828977618944") {
+          //   cloumnItem.children.list.forEach(element => {
+          //     this.teachingAchievements.push(element);
+          //   });
+          // }
+          // //实践项目
+          // if (cloumnItem.id == "1813831932748894208") {
+          //   cloumnItem.id
+          //   cloumnItem.children.list.forEach(element => {
+          //     this.teachingAchievements2.push(element);
+          //   });
+          // }
+          // //自制仪器设备
+          // if (cloumnItem.id == "1813832045458231296") {
+          //   cloumnItem.children.list.forEach(element => {
+          //     this.teachingAchievements3.push(element);
+          //   });
+          // }
           // cloumnItem.categoryName
         });
       });
 
     },
+    handleDataFromPage(data){
+      if (this.currentActive !== 0){
+        this.teachingAchievements = data
+      }
+      // if (this.currentActive === 2 || this.currentActive == 4){
+      //   this.nav[this.currentActive].children.list = data
+      // }
+      // if (this.currentActive === 5){
+      //   this.noticeList = data
+      // }
+    },
+    toDetail(id){
+      if (id){
+        this.$router.push({
+          name: 'details',
+          query:{ id: id }
+        });
+      }
+    }
   }
 
 }
@@ -615,7 +645,7 @@ export default {
   display: flex;
   flex-wrap: wrap;
 
-  justify-content: space-between;
+  /*justify-content: space-between;*/
   margin-top: 0px;
 }
 
@@ -891,7 +921,7 @@ export default {
   margin: 30px auto;
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-between;
+  /*justify-content: space-between;*/
   margin-top: 50px;
 
 }

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

@@ -66,7 +66,9 @@
           <div class="neirong" v-html="detailsContent"></div>
         </div>
 
-
+        <div v-show="currentActive === 1">
+          <page-util :page-size="8" :category-id="categoryId" @event-message="handleDataFromPage" />
+        </div>
 
     </div>
     <footers></footers>
@@ -79,12 +81,15 @@ import "swiper/css/swiper.min.css";
 import { getPageData, getPageColumn } from "@/api/officialWebsite/getPageData";
 import footers from '@/views/officialWebsite/Components/footer.vue'
 import headers from '@/views/officialWebsite/Components/header.vue'
+import PageUtil from "@/views/officialWebsite/Components/page"
+
 export default {
   components: {
     headers,
     footers,
     Swiper,
     SwiperSlide,
+    PageUtil,
   },
   name: 'HelloWorld',
   props: {
@@ -103,7 +108,7 @@ export default {
       ],
       currentActive: 0,
       isMounted: false,
-
+      categoryId: "0"
     }
   },
   created() {
@@ -127,6 +132,9 @@ export default {
       }
       this.currentActive = value
       this.isShowDetails = false;
+      if (value === 1){
+        this.categoryId = this.nav[value].id
+      }
     },
     initPageData() {
 
@@ -161,6 +169,17 @@ export default {
       });
 
     },
+    handleDataFromPage(data){
+      if (this.currentActive !== 0){
+        this.teachingAchievements = data
+      }
+      // if (this.currentActive === 2 || this.currentActive == 4){
+      //   this.nav[this.currentActive].children.list = data
+      // }
+      // if (this.currentActive === 5){
+      //   this.noticeList = data
+      // }
+    },
   }
 
 }
@@ -641,4 +660,52 @@ export default {
   line-height: 18px;
 
 }
+/* 圆形分页按钮样式 */
+::v-deep .el-pagination .el-pager li:not(.disabled) {
+  border-radius: 100%;
+  /* 圆形 */
+  width: 50px;
+  height: 50px;
+  /* 按钮高度 */
+  line-height: 50px;
+  /* 文字垂直居中 */
+  text-align: center;
+  /* 文字水平居中 */
+  margin: 0 15px;
+  /* 按钮间距 */
+  border-radius: 50%;
+  width: 50px;
+  height: 50px;
+  background: #FFFFFF;
+
+  border: 1px solid #DDDDDD;
+}
+
+/* 选中的页码按钮样式 */
+::v-deep .el-pagination .el-pager .active {
+  background-color: #005375;
+;
+  /* 背景颜色 */
+  color: #fff;
+  /* 文字颜色 */
+}
+
+::v-deep .el-pagination.is-background .btn-next,
+::v-deep .el-pagination.is-background .btn-prev {
+
+  background-color: #f4f4f5;
+  color: #333;
+  margin: 0 15px;
+  border-radius: 50%;
+  width: 50px;
+  height: 50px;
+  background: #FFFFFF;
+
+  border: 1px solid #DDDDDD;
+}
+
+::v-deep .el-pagination .btn-next .el-icon,
+::v-deep .el-pagination .btn-prev .el-icon {
+  font-size: 18px;
+}
 </style>