Fix lint errors in .vue files (#880)

frontend/src/component/footer.vue

@@ -25,7 +25,7 @@
 
 <script>
 export default {
-  name: 'p-about-footer',
+  name: 'PAboutFooter',
   data() {
     return {};
   },

frontend/src/component/loading-bar.vue

@@ -1,12 +1,12 @@
 <template>
   <transition
       id="p-loading-bar"
-      v-on:before-enter="beforeEnter"
-      v-on:enter="enter"
-      v-on:after-enter="afterEnter"
-      v-bind:css="false"
+      :css="false"
+      @before-enter="beforeEnter"
+      @enter="enter"
+      @after-enter="afterEnter"
   >
-    <div class="top-progress" :style="barStyle" v-if="show">
+    <div v-if="show" class="top-progress" :style="barStyle">
       <div class="peg" :style="pegStyle">
       </div>
     </div>
@@ -15,12 +15,12 @@
 <script>
 function clamp(n, min, max) {
   if (n < min) {
-    return min
+    return min;
   }
   if (n > max) {
-    return max
+    return max;
   }
-  return n
+  return n;
 }
 
 let queue = (() => {
@@ -30,7 +30,7 @@ let queue = (() => {
     let fn = pending.shift();
 
     if (fn) {
-      fn(next)
+      fn(next);
     }
   }
 
@@ -38,43 +38,13 @@ let queue = (() => {
     pending.push(fn);
 
     if (pending.length === 1) {
-      next()
+      next();
     }
-  }
+  };
 })();
 
 export default {
-  name: "p-loading-bar",
-  data() {
-    return {
-      error: false,
-      show: false,
-      progress: 0,
-      opacity: 1,
-      status: null,
-      isPaused: false
-    }
-  },
-
-  mounted() {
-    let stackSize = 0;
-
-    this.$event.subscribe('ajax.start', function () {
-      stackSize++;
-
-      if (stackSize === 1) {
-        this.start();
-      }
-    }.bind(this));
-
-    this.$event.subscribe('ajax.end', function () {
-      stackSize--;
-
-      if (stackSize === 0) {
-        this.done();
-      }
-    }.bind(this));
-  },
+  name: "PLoadingBar",
 
   props: {
     speed: {
@@ -127,14 +97,24 @@ export default {
       default: 9999
     }
   },
+  data() {
+    return {
+      error: false,
+      show: false,
+      progress: 0,
+      opacity: 1,
+      status: null,
+      isPaused: false
+    };
+  },
 
   computed: {
     progressColor() {
-      return this.error ? this.errorColor : this.color
+      return this.error ? this.errorColor : this.color;
     },
 
     isStarted() {
-      return typeof this.status === 'number'
+      return typeof this.status === 'number';
     },
 
     barStyle() {
@@ -149,7 +129,7 @@ export default {
         transition: `all ${this.speed}ms ${this.easing}`,
         opacity: `${this.opacity}`,
         zIndex: `${this.zIndex}`
-      }
+      };
     },
 
     pegStyle() {
@@ -162,127 +142,147 @@ export default {
         opacity: this.progress ? '1' : '0',
         boxShadow: `0 0 10px ${this.progressColor}, 0 0 5px ${this.progressColor}`,
         transform: 'rotate(3deg) translate(0px, -4px)'
-      }
+      };
     }
   },
 
+  mounted() {
+    let stackSize = 0;
+
+    this.$event.subscribe('ajax.start', function () {
+      stackSize++;
+
+      if (stackSize === 1) {
+        this.start();
+      }
+    }.bind(this));
+
+    this.$event.subscribe('ajax.end', function () {
+      stackSize--;
+
+      if (stackSize === 0) {
+        this.done();
+      }
+    }.bind(this));
+  },
+
   methods: {
     beforeEnter(el) {
-      this.opacity = 0
-      this.progress = 0
-      this.width = 0
+      this.opacity = 0;
+      this.progress = 0;
+      this.width = 0;
     },
 
     enter(el, done) {
-      this.opacity = 1
-      done()
+      this.opacity = 1;
+      done();
     },
 
     afterEnter(el) {
-      this._runStart()
+      this._runStart();
     },
 
     _work() {
       setTimeout(() => {
         if (!this.isStarted || this.isPaused) {
-          return
+          return;
         }
-        this.increase()
-        this._work()
-      }, this.trickleSpeed)
+        this.increase();
+        this._work();
+      }, this.trickleSpeed);
     },
 
     _runStart() {
-      this.status = (this.progress === 100 ? null : this.progress)
+      this.status = (this.progress === 100 ? null : this.progress);
 
       if (this.trickle) {
-        this._work()
+        this._work();
       }
     },
 
     start() {
-      this.isPaused = false
+      this.isPaused = false;
 
       if (this.show) {
-        this._runStart()
+        this._runStart();
       } else {
-        this.show = true
+        this.show = true;
       }
     },
 
     set(amount) {
-      this.isPaused = false
+      this.isPaused = false;
 
-      let o
+      let o;
       if (this.isStarted) {
         o = amount < this.progress
-            ? clamp(amount, 0, 100)
-            : clamp(amount, this.minimum, 100)
+          ? clamp(amount, 0, 100)
+          : clamp(amount, this.minimum, 100);
       } else {
-        o = 0
+        o = 0;
       }
 
-      this.status = (o === 100 ? null : o)
+      this.status = (o === 100 ? null : o);
 
       queue(next => {
-        this.progress = o
+        this.progress = o;
         if (o === 100) {
           setTimeout(() => {
-            this.opacity = 0
+            this.opacity = 0;
             setTimeout(() => {
-              this.show = false
-              this.error = false
-              next()
-            }, this.speed)
-          }, this.speed)
+              this.show = false;
+              this.error = false;
+              next();
+            }, this.speed);
+          }, this.speed);
         } else {
-          setTimeout(next, this.speed)
+          setTimeout(next, this.speed);
         }
-      })
+      });
     },
 
     increase(amount) {
-      let o = this.progress
+      let o = this.progress;
 
       if (o < 100 && typeof amount !== 'number') {
         if (o >= 0 && o < 25) {
-          amount = Math.random() * 3 + 3
+          amount = Math.random() * 3 + 3;
         } else if (o >= 25 && o < 50) {
-          amount = Math.random() * 3
+          amount = Math.random() * 3;
         } else if (o >= 50 && o < 85) {
-          amount = Math.random() * 2
+          amount = Math.random() * 2;
         } else if (o >= 85 && o < 99) {
-          amount = 0.5
+          amount = 0.5;
         } else {
-          amount = 0
+          amount = 0;
         }
       }
-      this.set(clamp(o + amount, 0, this.maximum))
+      this.set(clamp(o + amount, 0, this.maximum));
     },
 
     decrease(amount) {
       if (this.progress === 0) {
-        return
+        return;
       }
-      this.increase(-amount)
+      this.increase(-amount);
     },
 
     done() {
-      this.set(100)
+      this.set(100);
     },
 
     getProgress() {
-      return this.status ? this.progress : 0
+      return this.status ? this.progress : 0;
     },
 
     pause() {
-      this.isPaused = true
+      this.isPaused = true;
     },
 
     fail() {
-      this.error = true
-      this.done()
+      this.error = true;
+      this.done();
     },
   }
-}
+};
 </script>

frontend/src/component/notify.vue

@@ -22,7 +22,7 @@
 import Event from 'pubsub-js';
 
 export default {
-  name: 'p-notify',
+  name: 'PNotify',
   data() {
     return {
       text: '',

frontend/src/component/scroll-top.vue

@@ -6,8 +6,8 @@
         dark
         fab
         fixed
-        @click.stop="scrollToTop"
         class="p-scroll-top"
+        @click.stop="scrollToTop"
     >
       <v-icon>arrow_upward</v-icon>
     </v-btn>
@@ -16,13 +16,19 @@
 
 <script>
 export default {
-  name: 'p-scroll-top',
+  name: 'PScrollTop',
   data() {
     return {
       show: false,
       maxY: 0,
     };
   },
+  created() {
+    window.addEventListener('scroll', this.onScroll);
+  },
+  destroyed() {
+    window.removeEventListener('scroll', this.onScroll);
+  },
   methods: {
     onScroll: function () {
       if (window.scrollY > this.maxY) {
@@ -38,12 +44,6 @@ export default {
     scrollToTop: function () {
       return this.$vuetify.goTo(0);
     },
-  },
-  created() {
-    window.addEventListener('scroll', this.onScroll);
-  },
-  destroyed() {
-    window.removeEventListener('scroll', this.onScroll);
   }
 };
 </script>

frontend/src/dialog/reload.vue

@@ -19,8 +19,8 @@
         <v-btn
             color="secondary-dark"
             dark depressed small
-            @click="reload"
             class="action-update-reload"
+            @click="reload"
         >
           <translate>Reload</translate>
         </v-btn>
@@ -31,7 +31,7 @@
 
 <script>
 export default {
-  name: 'p-dialog-webdav',
+  name: 'PDialogWebdav',
   props: {
     show: Boolean,
   },

frontend/src/dialog/video.vue

@@ -1,5 +1,5 @@
 <template>
-  <modal name="video" ref="video" :height="height" :width="width" :reset="true" class="p-video-dialog"
+  <modal ref="video" name="video" :height="height" :width="width" :reset="true" class="p-video-dialog"
          @before-close="onClose"
          @before-open="onOpen">
     <p-video-player v-show="show" ref="player" :source="source" :height="height.toString()"
@@ -8,7 +8,7 @@
 </template>
 <script>
 export default {
-  name: 'p-video-dialog',
+  name: 'PVideoDialog',
   data() {
     return {
       show: false,
@@ -20,7 +20,7 @@ export default {
       video: null,
       album: null,
       loop: false,
-    }
+    };
   },
   methods: {
     onOpen(ev) {
@@ -88,7 +88,7 @@ export default {
 
       // Resize video overlay.
       this.$refs.video.setInitialSize();
-      let size = {width: this.width, height: this.height}
+      let size = {width: this.width, height: this.height};
       this.$refs.video.onModalResize({size});
 
       // Play by triggering source change event.
@@ -96,5 +96,5 @@ export default {
       this.show = true;
     },
   },
-}
+};
 </script>

frontend/src/pages/discover.vue

@@ -50,24 +50,24 @@ import tabColors from "pages/discover/colors.vue";
 import tabTodo from "pages/discover/todo.vue";
 
 export default {
-  name: 'p-page-settings',
-  props: {
-    tab: Number
-  },
+  name: 'PPageSettings',
   components: {
     'p-tab-discover-colors': tabColors,
     'p-tab-discover-todo': tabTodo,
   },
+  props: {
+    tab: Number
+  },
   data() {
     return {
       readonly: this.$config.get("readonly"),
       active: this.tab,
-    }
+    };
   },
   methods: {
     changePath: function (path) {
       if (this.$route.path !== path) {
-        this.$router.replace(path)
+        this.$router.replace(path);
       }
     }
   },

frontend/src/pages/login.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="p-page p-page-login">
-    <v-form dense ref="form" autocomplete="off" class="p-form-login" @submit.prevent="login" accept-charset="UTF-8">
+    <v-form ref="form" dense autocomplete="off" class="p-form-login" accept-charset="UTF-8" @submit.prevent="login">
       <v-card flat tile class="ma-2 application">
         <v-card-actions>
           <v-layout wrap align-top>
@@ -12,20 +12,20 @@
             <v-flex xs12 class="pa-2">
 
               <v-text-field
+                  v-model="username"
                   :disabled="loading"
                   :label="$gettext('Name')"
                   color="accent"
-                  v-model="username"
                   flat solo required hide-details
                   type="text"
               ></v-text-field>
             </v-flex>
             <v-flex xs12 class="pa-2">
               <v-text-field
+                  v-model="password"
                   :disabled="loading"
                   :label="$gettext('Password')"
                   color="accent"
-                  v-model="password"
                   flat solo required hide-details
                   :append-icon="showPassword ? 'visibility' : 'visibility_off'"
                   :type="showPassword ? 'text' : 'password'"
@@ -54,7 +54,7 @@
 
 <script>
 export default {
-  name: 'login',
+  name: 'Login',
   data() {
     return {
       loading: false,
@@ -68,16 +68,16 @@ export default {
   methods: {
     login() {
       if (!this.username || !this.password) {
-        return
+        return;
       }
 
       this.loading = true;
       this.$session.login(this.username, this.password).then(
-          () => {
-            this.loading = false;
-            this.$router.push(this.nextUrl);
-          }
-      ).catch(() => this.loading = false)
+        () => {
+          this.loading = false;
+          this.$router.push(this.nextUrl);
+        }
+      ).catch(() => this.loading = false);
     },
   }
 };

frontend/src/pages/people.vue

@@ -22,7 +22,7 @@
 
 <script>
 export default {
-  name: 'people',
+  name: 'People',
   data() {
     return {};
   },

frontend/src/pages/places.vue

@@ -3,8 +3,8 @@
     <div id="map" style="width: 100%; height: 100%;">
       <div class="p-map-control">
         <div class="mapboxgl-ctrl mapboxgl-ctrl-group">
-          <v-text-field class="pa-0 ma-0 input-search"
-                        v-model="filter.q"
+          <v-text-field v-model="filter.q"
+                        class="pa-0 ma-0 input-search"
                         single-line
                         solo
                         flat

frontend/src/share/navigation.vue

@@ -25,7 +25,7 @@
 
 <script>
 export default {
-  name: "p-navigation",
+  name: "PNavigation",
   data() {
     return {
       drawer: null,
@@ -52,7 +52,7 @@ export default {
   },
   computed: {
     auth() {
-      return this.session.auth || this.public
+      return this.session.auth || this.public;
     },
   },
   methods: {