update

api/routes/news.js

@@ -2,14 +2,64 @@ const { Router } = require('express')
 const newsData = require('./data/news');
 const router = Router()
 
-
+const total = newsData.length;
+const newsDetails = {};
+newsData.forEach((item)=>{
+    newsDetails[item.id]={
+        title:item.title,
+        time:item.time,
+        con:item.con,
+        id:item.id,
+    }
+})
+// const tetails
 /* GET users listing. */
 router.get('/news', function (req, res, next) {
+    const newsList = req.query.type==='simplify'?newsData.map((item)=>{
+        return({
+            title:item.title,
+            time:item.time,
+            id:item.id,
+        })
+    }):newsData;
+    
+
     if(req.query.pageSize){
-        res.json(newsData.slice(0,req.query.page))
+        if(req.query.pageIndex){
+            res.json({
+                total,
+                data:newsList.slice((req.query.pageIndex-1)*req.query.pageSize,(req.query.pageIndex-1)*req.query.pageSize+parseInt(req.query.pageSize)),
+                result:true
+            })
         }else{
-        res.json(newsData)
+            res.json({
+                total,
+                data:newsList.slice(0,req.query.pageSize),
+                result:true
+            })
+        } 
+    }else{
+        res.json({
+            total:0,
+            data:[],
+            result:true
+        })
     }
 })
 
+router.get('/news/detail/:id', function (req, res, next) {
+    const id = parseInt(req.params.id)
+    if (id >= 0 && id < newsData.length) {
+        res.json({
+            data:newsDetails[id],
+            result:true
+        })
+    } else {
+        res.json({
+            data:null,
+            message:'该页面不存在',
+            result:false
+        })
+    }  
+})
 module.exports = router
\ No newline at end of file

components/NewsScrollList.vue

@@ -5,7 +5,7 @@
             <no-ssr>
                 <vue-seamless-scroll :data="newsData" :class-option="optionTop" class="product-seamless-warp">
                     <ul class="item">
-                        <li v-for="(item,index) in newsData"  v-if="index<10" :key="item.id">
+                        <li v-for="item in newsData" :key="item.id">
                             <nuxt-link :to="'/news/' + item.id">
                                 {{item.title}}
                             </nuxt-link>
@@ -20,8 +20,8 @@
 <script>
 export default {
     async asyncData({ app }) {
-      const newsData = await app.$axios.$get('/api/news?pageSize=10');
-      return { newsData: newsData }
+      const newsData = await app.$axios.$get('/api/news?pageIndex=1&pageSize=20&type=simplify');
+      return { newsData: newsData.data||[] }
     },
     computed:{
         optionTop(){

pages/index.vue

@@ -103,9 +103,9 @@ import ContactUs from '~/components/ContactUs.vue'
 
 export default {
     async asyncData({ app }) {
-      const newsData = await app.$axios.$get('/api/news?pageSize=10');
+      const newsData = await app.$axios.$get('/api/news?pageSize=10&type=simplify');
       const productData = await app.$axios.$get('/api/product');
-      return { newsData: newsData,productData:[...productData.ozonizer.data,...productData.disinfectant.data,...productData.equipment.data] }
+      return { newsData: newsData.data||[],productData:[...productData.ozonizer.data,...productData.disinfectant.data,...productData.equipment.data] }
     },
     data:function(){
         return {

pages/news/_id.vue

 <template>
     <div class="currently-wrap">
         <div class="currently-node">新闻动态</div>
-        <div class="currently-title">{{title}}</div>
-        <div class="currently-time">发布时间：{{time}}</div>
-        <div class="currently-text" v-html="con"></div>
+        <div class="currently-title">{{details.title}}</div>
+        <div class="currently-time">发布时间：{{details.time}}</div>
+        <div class="currently-text" v-html="details.con"></div>
     </div>
 </template>
 <script>
 export default {
-    asyncData({ params, store, error }) {
-        const item = store.state.news.newsData.find((item) => String(item.id) === params.id)
-        if (!item) {
+    // asyncData({ params, store, error }) {
+    //     const item = store.state.news.newsData.find((item) => String(item.id) === params.id)
+    //     if (!item) {
+    //         return error({ message: '页面不存在', statusCode: 404 })
+    //     }
+    //     return item
+    // },
+    async asyncData({ app, params, error }) {
+      const details = await app.$axios.$get(`/api/news/detail/${params.id}`);
+      if(details.result){
+        return {details: details.data};
+      }else{
         return error({ message: '页面不存在', statusCode: 404 })
       }
-        return item
-    },
-    head() {
-        return {
-        }
+      
     }
 }
 </script>

pages/news/index.vue

@@ -3,7 +3,7 @@
         <div class="currently-node">新闻动态</div>
         <div class="currently-list">
             <ul>
-                <li class="listItem" v-for="(item, index) in newData.slice(startPage,endPage)" :key="index">
+                <li class="listItem" v-for="(item, index) in newData" :key="index">
                     <nuxt-link :to="'/news/' + item.id" class="itemTitle">{{item.title}}</nuxt-link>
                     <span class="contentTime">{{item.time}}</span>
                 </li>
@@ -15,32 +15,32 @@
             layout="prev, pager, next"
             prev-text="上一页"
             next-text="下一页"
-            :page-size="pageSize"
+            :page-size='20'
             @current-change="handleCurrentChange"
-            :total="newData.length">
+            :total="total">
         </el-pagination>
     </div>
 </template>
 <script>
 export default {
+    async asyncData({ app }) {
+      const newData = await app.$axios.$get('/api/news?pageIndex=1&pageSize=20&type=simplify');
+      return { newData: newData.data || [] ,total:newData.total}
+    },
     data(){
         return{
-            newData:this.$store.state.news.newsData,
-            pageSize:20,
-            currentPage:1,
-        }
-    },
-    computed:{
-        startPage(){
-            return this.pageSize*(this.currentPage-1);
-        },
-        endPage(){
-            return  this.startPage + this.pageSize;
+            
         }
     },
     methods:{
-        handleCurrentChange(val){
-            this.currentPage = val
+        handleCurrentChange(page){
+            this.$axios.$get(`/api/news?pageIndex=${page}&pageSize=20&type=simplify`).then(res => {
+                if (res.result) {
+                    this.newData = res.data;
+                } else {
+                    this.newData = [];
+                }
+            });
         }
     }
 }