error message in invalid articles

src/components/Article.vue

 <template>
   <article class='v-sheet v-card rounded-xl' v-bind:class="{'collapsable': collapsable, 'collapsed': collapsed}" v-if="article">
-    <Header :title_id="title_id" :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id" @toggle-collapse = "toggle_collapse"/>
+    <div v-if ="invalid"><v-icon left>warning</v-icon> {{$t('error.article', {no: article.article_id, dict: $t('dicts.'+this.dictionary)})}}</div>
+    <Header v-if="!invalid" :title_id="title_id" :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id" @toggle-collapse = "toggle_collapse"/>
     <InflectionButton :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id"/>
     
-    <div class="article_content" :class="$vuetify.breakpoint.name" v-if="!collapsed">
+    <div class="article_content" :class="$vuetify.breakpoint.name" v-if="!collapsed && !invalid">
       <section v-if="article.body.pronunciation && article.body.pronunciation.length" class="pronunciation">
         <h3>{{$t('article.headings.pronunciation', content_locale)}}</h3>
           <ul>
@@ -29,7 +30,7 @@
         </ul>
       </section>
     </div>
-    <ArticleFooter v-if="!collapsed" :article="article"/>
+    <ArticleFooter v-if="!collapsed && !invalid" :article="article"/>
 </article>
 </template>
 
@@ -81,7 +82,8 @@ export default {
   },
   data: function() {
     return {
-      is_collapsed: true
+      is_collapsed: true,
+      invalid: false
     }
   },
   metaInfo() {
@@ -153,6 +155,7 @@ export default {
       }
       } catch(error) {
         console.error("link_to_self",this.article.article_id, this.dictionary, error.message)
+        this.invalid = true
         //console.error(error)
         return {ref: "", article: this.article}
       }
@@ -237,6 +240,7 @@ export default {
       })
       } catch(error) {
         console.error("parse_definitions",this.article.article_id, this.dictionary, error.message)
+        this.invalid = true
         //console.error(error)
         definitionTexts = []
       }

src/components/Header.vue

@@ -204,6 +204,7 @@ export default {
         }
     } catch(error) {
       console.error("lemma_groups",this.article_id, this.dictionary, error.message)
+      this.$parent.invalid = true
       //console.error(error)
     }
       return groups

src/locales/eng.json

@@ -134,6 +134,7 @@
   }
 },
 "error": {
+      "article": "An error has occured in article {no} in {dict}",
       "404": {
           "title": "404: Not Found",
           "description": "The page may have been deleted or moved, or you may have used an invalid link."

src/locales/nno.json

@@ -134,6 +134,7 @@
         }
     },
     "error": {
+          "article": "Det har oppstått ein feil i artikkel {no} i {dict}",
           "404": {
               "title": "404: Ikkje funne",
               "description": "Sida kan ha blitt sletta eller flytta, eller du kan ha brukt ei ugyldig lenkje."

src/locales/nob.json

@@ -146,6 +146,7 @@
       }
   },
   "error": {
+        "article": "Det har oppstått en feil i artikkel {no} i {dict}",
         "404": {
             "title": "404: Ikke funnet",
             "description": "Siden kan ha blitt slettet eller flyttet, eller du kan ha brukt en ugyldig lenke."