'报错页面'

layouts/empty.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <nuxt />
+  </div>
+</template>

layouts/error.vue

@@ -1,14 +1,26 @@
 <template>
   <div class="container">
     <div v-if="error.statusCode === 404" class="page">
-      <nuxt-link to="/">
-        <img src="http://img.binlive.cn/upload/1525013647902" alt="">
-      </nuxt-link>
+      <div class="error">
+        <div class="err-img">
+          <img src="~/assets/images/index/404.png" alt="" srcset="">
+        </div>
+        <div class="err-msg">出错啦！你访问的页面没找到！ </div>
+        <div class="err_btn">
+          <nuxt-link to="/">回到首页</nuxt-link>
+        </div>
+      </div>
     </div>
     <div v-else class="page">
-      <nuxt-link to="/">
-        <img src="http://img.binlive.cn/upload/1525016935287" alt="">
-      </nuxt-link>
+      <div class="error">
+        <div class="err-img">
+          <img src="~/assets/images/index/404.png" alt="" srcset="">
+        </div>
+        <div class="err-msg">出错啦！你访问的页面没找到！ </div>
+        <div class="err_btn">
+          <nuxt-link to="/">回到首页</nuxt-link>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -16,10 +28,45 @@
 <script>
   export default {
     props: ['error'],
-    layout: 'blog'
+    layout: 'empty'
   }
 </script>
 
-<style scoped>
-  .page img{width: 80%;padding-top: 60px; display: block; margin:0 auto}
+<style lang="scss" scoped>
+.page{
+  .error {
+    margin: 100px auto 150px;
+    text-align: center;
+    .err-img {
+      font-size: 0;
+      img {
+        width: 891px;
+        height: 431px;
+      }
+    }
+    .err-msg {
+      height: 46px;
+      font-size: 24px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333333;
+      line-height: 45px;
+      margin: 100px auto 50px;
+    }
+    .err_btn {
+      width: 215px;
+      margin: 0 auto;
+      height: 58px;
+      line-height: 58px;
+      background: #45AEFF;
+      border-radius: 4px;
+      a {
+        font-size: 26px;
+        font-family: PingFangSC-Semibold, PingFang SC;
+        font-weight: 600;
+        color: #FFFFFF;
+      }
+    }
+  }
+}
 </style>