From 09e45cd4f5e233d4ec75c086dd7ab912a2f79a41 Mon Sep 17 00:00:00 2001
From: Derick Montague <derick.montague@ibm.com>
Date: Thu, 23 Jan 2020 15:45:57 -0600
Subject: Change eslint rules to use vue recommended
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resubmitting after reverted–original commit here
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/28763/7

- Ran npm run lint
- Resolved eslint issues

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I2b8b9244acddd483d0a72f9a5d156a79de9869a0
---
 src/components/AppHeader/AppHeader.vue             |  6 ++---
 src/components/AppNavigation/AppNavigation.vue     |  8 +++---
 src/components/Global/PageSection.vue              |  7 ++++-
 src/components/Global/PageTitle.vue                |  7 ++++-
 src/components/Global/StatusIcon.vue               |  7 ++++-
 src/layouts/AppLayout.vue                          |  8 +++---
 .../LocalUserManagement/LocalUserManagement.vue    | 12 ++++-----
 .../LocalUserManagement/ModalSettings.vue          |  7 ++++-
 .../LocalUserManagement/ModalUser.vue              | 13 +++++++---
 .../LocalUserManagement/TableRoles.vue             |  8 +++---
 src/views/Login/Login.vue                          | 12 ++++-----
 src/views/Overview/Overview.vue                    | 30 +++++++++++-----------
 src/views/Overview/OverviewEvents.vue              | 10 ++++----
 src/views/Overview/OverviewQuickLinks.vue          | 20 +++++++--------
 src/views/Unauthorized/Unauthorized.vue            |  2 +-
 15 files changed, 91 insertions(+), 66 deletions(-)

(limited to 'src')

diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index 5c2c333c..b2d29c95 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -42,9 +42,6 @@ import StatusIcon from '../Global/StatusIcon';
 export default {
   name: 'AppHeader',
   components: { IconAvatar, IconRenew, StatusIcon },
-  created() {
-    this.getHostInfo();
-  },
   computed: {
     hostStatus() {
       return this.$store.getters['global/hostStatus'];
@@ -61,6 +58,9 @@ export default {
       }
     }
   },
+  created() {
+    this.getHostInfo();
+  },
   methods: {
     getHostInfo() {
       this.$store.dispatch('global/getHostStatus');
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index c246b537..47609d96 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -7,7 +7,7 @@
         <icon-health />Health
         <icon-expand class="icon-expand" />
       </b-button>
-      <b-collapse tag="ul" id="health-menu" class="nav-item__nav">
+      <b-collapse id="health-menu" tag="ul" class="nav-item__nav">
         <b-nav-item href="javascript:void(0)">Event Log</b-nav-item>
         <b-nav-item href="javascript:void(0)">Hardware Status</b-nav-item>
         <b-nav-item href="javascript:void(0)">Sensors</b-nav-item>
@@ -19,7 +19,7 @@
         <icon-control />Control
         <icon-expand class="icon-expand" />
       </b-button>
-      <b-collapse tag="ul" id="control-menu" class="nav-item__nav">
+      <b-collapse id="control-menu" tag="ul" class="nav-item__nav">
         <b-nav-item href="javascript:void(0)">
           Server power operations
         </b-nav-item>
@@ -33,7 +33,7 @@
         <icon-configuration />Configuration
         <icon-expand class="icon-expand" />
       </b-button>
-      <b-collapse tag="ul" id="configuration-menu" class="nav-item__nav">
+      <b-collapse id="configuration-menu" tag="ul" class="nav-item__nav">
         <b-nav-item href="javascript:void(0)">Network settings</b-nav-item>
         <b-nav-item href="javascript:void(0)">SNMP settings</b-nav-item>
         <b-nav-item href="javascript:void(0)">Firmware</b-nav-item>
@@ -45,7 +45,7 @@
         <icon-access-control />Access Control
         <icon-expand class="icon-expand" />
       </b-button>
-      <b-collapse tag="ul" id="access-control-menu" class="nav-item__nav">
+      <b-collapse id="access-control-menu" tag="ul" class="nav-item__nav">
         <b-nav-item href="javascript:void(0)">LDAP</b-nav-item>
         <b-nav-item to="/access-control/local-user-management">
           Local user management
diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index 678fd31d..03040b29 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -8,7 +8,12 @@
 <script>
 export default {
   name: 'PageSection',
-  props: ['sectionTitle']
+  props: {
+    sectionTitle: {
+      type: String,
+      required: true
+    }
+  }
 };
 </script>
 
diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue
index 02314249..26588ca7 100644
--- a/src/components/Global/PageTitle.vue
+++ b/src/components/Global/PageTitle.vue
@@ -8,7 +8,12 @@
 <script>
 export default {
   name: 'PageTitle',
-  props: ['description'],
+  props: {
+    description: {
+      type: String,
+      default: ''
+    }
+  },
   data() {
     return {
       title: this.$route.meta.title
diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue
index 63155c9a..a2c7f04f 100644
--- a/src/components/Global/StatusIcon.vue
+++ b/src/components/Global/StatusIcon.vue
@@ -13,11 +13,16 @@ import IconError from '@carbon/icons-vue/es/error--filled/20';
 
 export default {
   name: 'StatusIcon',
-  props: ['status'],
   components: {
     iconSuccess: IconCheckmark,
     iconDanger: IconWarning,
     iconSecondary: IconError
+  },
+  props: {
+    status: {
+      type: String,
+      default: ''
+    }
   }
 };
 </script>
diff --git a/src/layouts/AppLayout.vue b/src/layouts/AppLayout.vue
index e5a55018..e1bb4103 100644
--- a/src/layouts/AppLayout.vue
+++ b/src/layouts/AppLayout.vue
@@ -1,15 +1,15 @@
 <template>
   <div>
-    <AppHeader ref="focusTarget" />
+    <app-header ref="focusTarget" />
     <b-container fluid class="page-container">
       <b-row no-gutters>
         <b-col tag="nav" cols="12" md="3" lg="2">
-          <AppNavigation />
+          <app-navigation />
         </b-col>
         <b-col cols="12" md="9" lg="10">
-          <PageContainer>
+          <page-container>
             <router-view ref="routerView" />
-          </PageContainer>
+          </page-container>
         </b-col>
       </b-row>
     </b-container>
diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
index b81dba67..0ca3428d 100644
--- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
+++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
@@ -1,13 +1,13 @@
 <template>
   <b-container class="ml-0">
-    <PageTitle />
+    <page-title />
     <b-row>
       <b-col lg="10" class="text-right">
         <b-button variant="link" @click="initModalSettings">
           Account policy settings
           <icon-settings />
         </b-button>
-        <b-button @click="initModalUser(null)" variant="primary">
+        <b-button variant="primary" @click="initModalUser(null)">
           Add user
           <icon-add />
         </b-button>
@@ -69,7 +69,7 @@ import ModalSettings from './ModalSettings';
 import PageTitle from '../../../components/Global/PageTitle';
 
 export default {
-  name: 'local-users',
+  name: 'LocalUsers',
   components: {
     IconAdd,
     IconChevron,
@@ -97,9 +97,6 @@ export default {
       ]
     };
   },
-  created() {
-    this.getUsers();
-  },
   computed: {
     allUsers() {
       return this.$store.getters['localUsers/allUsers'];
@@ -124,6 +121,9 @@ export default {
       });
     }
   },
+  created() {
+    this.getUsers();
+  },
   methods: {
     getUsers() {
       this.$store.dispatch('localUsers/getUsers');
diff --git a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
index dae4d908..a0d62941 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
@@ -4,6 +4,11 @@
 
 <script>
 export default {
-  props: ['settings']
+  props: {
+    settings: {
+      type: String,
+      default: ''
+    }
+  }
 };
 </script>
diff --git a/src/views/AccessControl/LocalUserManagement/ModalUser.vue b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
index e3ceb7df..d156c3da 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalUser.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
@@ -37,9 +37,9 @@
                 No special characters except underscore
               </b-form-text>
               <b-form-input
+                id="username"
                 v-model="form.username"
                 type="text"
-                id="username"
                 aria-describedby="username-help-block"
                 :state="getValidationState($v.form.username)"
                 :disabled="!newUser && originalUsername === 'root'"
@@ -78,9 +78,9 @@
                 Password must between 8 – 20 characters
               </b-form-text>
               <b-form-input
+                id="password"
                 v-model="form.password"
                 type="password"
-                id="password"
                 aria-describedby="password-help-block"
                 :state="getValidationState($v.form.password)"
                 @input="$v.form.password.$touch()"
@@ -103,9 +103,9 @@
               label-for="password-confirmation"
             >
               <b-form-input
+                id="password-confirmation"
                 v-model="form.passwordConfirmation"
                 type="password"
-                id="password-confirmation"
                 :state="getValidationState($v.form.passwordConfirmation)"
                 @input="$v.form.passwordConfirmation.$touch()"
               />
@@ -147,8 +147,13 @@ import {
 import VuelidateMixin from '../../../components/Mixins/VuelidateMixin.js';
 
 export default {
-  props: ['user'],
   mixins: [VuelidateMixin],
+  props: {
+    user: {
+      type: Object,
+      default: null
+    }
+  },
   data() {
     return {
       privilegeTypes: ['Administrator', 'Operator', 'ReadOnly', 'NoAccess'],
diff --git a/src/views/AccessControl/LocalUserManagement/TableRoles.vue b/src/views/AccessControl/LocalUserManagement/TableRoles.vue
index 7ea89da9..0927c55d 100644
--- a/src/views/AccessControl/LocalUserManagement/TableRoles.vue
+++ b/src/views/AccessControl/LocalUserManagement/TableRoles.vue
@@ -2,22 +2,22 @@
   <b-table small :items="items" :fields="fields">
     <template v-slot:cell(administrator)="data">
       <template v-if="data.value">
-        <Checkmark20 />
+        <checkmark20 />
       </template>
     </template>
     <template v-slot:cell(operator)="data">
       <template v-if="data.value">
-        <Checkmark20 />
+        <checkmark20 />
       </template>
     </template>
     <template v-slot:cell(readonly)="data">
       <template v-if="data.value">
-        <Checkmark20 />
+        <checkmark20 />
       </template>
     </template>
     <template v-slot:cell(noaccess)="data">
       <template v-if="data.value">
-        <Checkmark20 />
+        <checkmark20 />
       </template>
     </template>
   </b-table>
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue
index 4270b3fd..35af76f2 100644
--- a/src/views/Login/Login.vue
+++ b/src/views/Login/Login.vue
@@ -15,7 +15,7 @@
         </b-col>
 
         <b-col md="6">
-          <b-form class="login-form" @submit.prevent="login" novalidate>
+          <b-form class="login-form" novalidate @submit.prevent="login">
             <b-alert class="login-error" :show="authError" variant="danger">
               <p id="login-error-alert">
                 <strong>{{ errorMsg.title }}</strong>
@@ -81,11 +81,6 @@ import VuelidateMixin from '../../components/Mixins/VuelidateMixin.js';
 export default {
   name: 'Login',
   mixins: [VuelidateMixin],
-  computed: {
-    authError() {
-      return this.$store.getters['authentication/authError'];
-    }
-  },
   data() {
     return {
       errorMsg: {
@@ -99,6 +94,11 @@ export default {
       disableSubmitButton: false
     };
   },
+  computed: {
+    authError() {
+      return this.$store.getters['authentication/authError'];
+    }
+  },
   validations: {
     userInfo: {
       username: {
diff --git a/src/views/Overview/Overview.vue b/src/views/Overview/Overview.vue
index 2672af7e..6ff9f4a2 100644
--- a/src/views/Overview/Overview.vue
+++ b/src/views/Overview/Overview.vue
@@ -1,9 +1,9 @@
 <template>
   <b-container fluid>
-    <PageTitle />
+    <page-title />
     <b-row>
       <b-col lg="8" sm="12">
-        <PageSection sectionTitle="Server information">
+        <page-section section-title="Server information">
           <b-row>
             <b-col sm="6">
               <dl>
@@ -30,8 +30,8 @@
               </dl>
             </b-col>
           </b-row>
-        </PageSection>
-        <PageSection sectionTitle="BMC information">
+        </page-section>
+        <page-section section-title="BMC information">
           <b-row>
             <b-col sm="6">
               <dl>
@@ -48,7 +48,7 @@
             <b-col sm="6">
               <dl>
                 <dt>IP address</dt>
-                <dd v-for="ip in ipAddress" v-bind:key="ip.id">{{ ip }}</dd>
+                <dd v-for="ip in ipAddress" :key="ip.id">{{ ip }}</dd>
               </dl>
             </b-col>
             <b-col sm="6">
@@ -58,8 +58,8 @@
               </dl>
             </b-col>
           </b-row>
-        </PageSection>
-        <PageSection sectionTitle="Power consumption">
+        </page-section>
+        <page-section section-title="Power consumption">
           <b-row>
             <b-col sm="6">
               <dl>
@@ -74,15 +74,15 @@
               </dl>
             </b-col>
           </b-row>
-        </PageSection>
+        </page-section>
       </b-col>
       <b-col lg="4" sm="12">
-        <OverviewQuickLinks />
+        <overview-quick-links />
       </b-col>
     </b-row>
-    <PageSection sectionTitle="High priority events">
-      <OverviewEvents />
-    </PageSection>
+    <page-section section-title="High priority events">
+      <overview-events />
+    </page-section>
   </b-container>
 </template>
 
@@ -100,9 +100,6 @@ export default {
     PageTitle,
     PageSection
   },
-  created() {
-    this.getOverviewInfo();
-  },
   computed: mapState({
     serverModel: state => state.overview.serverModel,
     serverManufacturer: state => state.overview.serverManufacturer,
@@ -115,6 +112,9 @@ export default {
     ipAddress: state => state.networkSettings.ipAddress,
     macAddress: state => state.networkSettings.macAddress
   }),
+  created() {
+    this.getOverviewInfo();
+  },
   methods: {
     getOverviewInfo() {
       this.$store.dispatch('overview/getServerInfo');
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index 07aab1d5..5820e612 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -8,7 +8,7 @@
           <small>{{
             logData.Timestamp | date('MMM DD YYYY HH:MM:SS A ZZ')
           }}</small>
-          <ChevronRight16 />
+          <chevron-right16 />
         </div>
         <p class="mb-1">{{ logData.eventID }}: {{ logData.description }}</p>
       </b-list-group-item>
@@ -22,18 +22,18 @@
 <script>
 import ChevronRight16 from '@carbon/icons-vue/es/chevron--right/16';
 export default {
-  name: 'events',
+  name: 'Events',
   components: {
     ChevronRight16
   },
-  created() {
-    this.getEventLogData();
-  },
   computed: {
     eventLogData() {
       return this.$store.getters['eventLog/eventLogData'];
     }
   },
+  created() {
+    this.getEventLogData();
+  },
   methods: {
     getEventLogData() {
       this.$store.dispatch('eventLog/getEventLogData');
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index 726eaf7d..d9d86ca8 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -21,7 +21,7 @@
     >
       <!-- TODO: link to SOL -->
       <span>Serial over LAN console</span>
-      <ChevronRight16 />
+      <chevron-right16 />
     </b-list-group-item>
     <b-list-group-item
       href="#"
@@ -29,7 +29,7 @@
     >
       <!-- TODO: link to network settings -->
       <span>Edit network settings</span>
-      <ChevronRight16 />
+      <chevron-right16 />
     </b-list-group-item>
   </b-list-group>
 </template>
@@ -37,27 +37,27 @@
 <script>
 import ChevronRight16 from '@carbon/icons-vue/es/chevron--right/16';
 export default {
-  name: 'quickLinks',
+  name: 'QuickLinks',
   components: {
     ChevronRight16
   },
-  created() {
-    this.getBmcTime();
+  data() {
+    return {
+      serverLEDChecked: false
+    };
   },
   computed: {
     bmcTime() {
       return this.$store.getters['global/bmcTime'];
     }
   },
+  created() {
+    this.getBmcTime();
+  },
   methods: {
     getBmcTime() {
       this.$store.dispatch('global/getBmcTime');
     }
-  },
-  data() {
-    return {
-      serverLedChecked: false
-    };
   }
 };
 </script>
diff --git a/src/views/Unauthorized/Unauthorized.vue b/src/views/Unauthorized/Unauthorized.vue
index 446270d7..d4203598 100644
--- a/src/views/Unauthorized/Unauthorized.vue
+++ b/src/views/Unauthorized/Unauthorized.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <PageTitle :description="description" />
+    <page-title :description="description" />
   </div>
 </template>
 <script>
-- 
cgit v1.2.3