无效表单显示404

src/views/user/form.vue

@@ -21,6 +21,7 @@ export default Vue.extend({
       jobPage: 0,
       jobTotal: 1,
       jobL: [],
+      noForm: false,
       loading: false,
       isOk: false
     }
@@ -48,6 +49,7 @@ export default Vue.extend({
           })
           this.expo_id = res.data.id
         }).catch(err => {
+          this.noForm = true
         })
       }
     },
@@ -161,7 +163,11 @@ export default Vue.extend({
 </script>
 
 <template>
-  <div class="body">
+  <div class="no-info" v-if="noForm">
+    <img class="not-found" src="/static/image/404.webp"/>
+    <div class="info">此链接无效，请向管理员咨询。</div>
+  </div>
+  <div v-else class="body">
     <div class="head">
       <div class="form-name">
         {{ from_data.expo_name }}
@@ -336,6 +342,25 @@ export default Vue.extend({
 </template>
 
 <style scoped lang="scss">
+.no-info{
+  background-color: white;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  .not-found{
+    width: 24%;
+    margin-top: -8%;
+  }
+  .info{
+    text-align: center;
+    font-size: 20px;
+    font-weight: bold;
+    color: grey;
+  }
+}
 .body{
   margin: 36px auto;
   max-width: 800px;