src/views/details.vue

@@ -9,6 +9,7 @@
           <h2>{{ contentitem.title }}</h2>
           <p class="date">发表时间: {{ contentitem.date }}</p>
           <div class="content" v-html="contentitem.content"></div>
+          <a v-if="contentitem && contentitem.annexname" :href="contentitem.annex">附件: {{ contentitem.annexname }}</a>
         </div>
       </div>
     </div>

src/views/list.vue

@@ -4,24 +4,27 @@
     <div class="box">
       <breadcrumb :type="'列表'" :item="item" :en="en"></breadcrumb>
       <el-button class="btn">{{ item }}</el-button>
-      <el-card class="box-card" v-for="(item, index) in contentitems" :key="index">
-        <img :src="item.thumbnail || imguri" alt="缩略图" class="imgs">
-        <div class="item">
-          <h4 class="title" @click="btn(item)">{{ item.title }}</h4>
-          <div class="details">{{ item.slug }}</div>
-          <div class="other">
-            <div class="el-icon-time date">{{ item.date }}</div>
-            <div class="el-icon-view num">{{ item.hits || 0 }}</div>
+      <div v-if="contentlist.length > 0">
+        <el-card class="box-card" v-for="(item, index) in contentlist" :key="index">
+          <img :src="item.thumbnail || imguri" alt="缩略图" class="imgs">
+          <div class="item">
+            <h4 class="title" @click="btn(item)">{{ item.title }}</h4>
+            <div class="details">{{ item.slug }}</div>
+            <div class="other">
+              <div class="el-icon-time date">{{ item.date }}</div>
+              <div class="el-icon-view num">{{ item.hits || 0 }}</div>
+            </div>
           </div>
-        </div>
-      </el-card>
+        </el-card>
+      </div>
+      <el-divider class="divider" v-else>暂无数据</el-divider>
       <el-pagination
         class="pagination"
         background
         layout="prev, pager, next"
         @current-change="currentChange"
         :page-size="pageSize"
-        :total="contenttotal">
+        :total="total">
       </el-pagination>
     </div>
   </div>
@@ -46,7 +49,9 @@ export default {
       en: '',
       pageSize: 6,
       item: '',
-      imguri: require('../assets/moren.png')
+      imguri: require('../assets/moren.png'),
+      contentlist: [],
+      total: 0
     }
   },
   methods: {
@@ -55,7 +60,6 @@ export default {
     ...contentmapActions(['getcontent']),
     // 分页
     currentChange (e) {
-      console.log(e)
       this.getcontent({ code: this.columnitems[0].code, skip: e - 1, limit: this.pageSize })
     },
     // 跳转正文
@@ -72,7 +76,14 @@ export default {
       this.en = items.en || ''
       const res = await this.getcolumn(items)
       if (res.data.errcode === 0) {
-        await this.getcontent({ code: this.columnitems[0].code, skip: 0, limit: this.pageSize })
+        if (this.columnitems.length > 0) {
+          await this.getcontent({ code: this.columnitems[0].code, skip: 0, limit: this.pageSize })
+          this.contentlist = [...this.contentitems]
+          this.total = this.contenttotal
+        } else {
+          this.contentlist = []
+          this.total = 0
+        }
       }
     }
   },
@@ -115,6 +126,10 @@ export default {
   width: 90%;
   margin: 5% auto;
 }
+.divider {
+  width: 70%;
+  margin: 5% auto;
+}
 .box-card {
   width: 70%;
   margin: 2% 15%;