Update linting packages to use latest

- 99% of changes were small syntax changes that were changed by the
lint command. There were a couple of small manual changes to meet the
property order patterns established as part of the vue:recommended
guidelines.

There are rules that were set from errors to warnings and new stories
are being opened to address those issues.

Testing:
- Successfully ran npm run serve
- Successfully ran npm run lint
- Verified functionality works as expected, e.g. success and failure use cases
- Resolved any JavaScript errors thrown to the console

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Ie082f31c73ccbe8a60afa8f88a9ef6dbf33d9fd2
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
index da4d546..fc65fbf 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableStystem.vue
@@ -9,7 +9,7 @@
       :empty-text="$t('global.table.emptyMessage')"
     >
       <!-- Expand chevron icon -->
-      <template v-slot:cell(expandRow)="row">
+      <template #cell(expandRow)="row">
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandSystem"
@@ -21,12 +21,12 @@
       </template>
 
       <!-- Health -->
-      <template v-slot:cell(health)="{ value }">
+      <template #cell(health)="{ value }">
         <status-icon :status="statusIcon(value)" />
         {{ value }}
       </template>
 
-      <template v-slot:row-details="{ item }">
+      <template #row-details="{ item }">
         <b-container fluid>
           <b-row>
             <b-col sm="6" xl="4">
@@ -94,42 +94,42 @@
         {
           key: 'expandRow',
           label: '',
-          tdClass: 'table-row-expand'
+          tdClass: 'table-row-expand',
         },
         {
           key: 'id',
           label: this.$t('pageHardwareStatus.table.id'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'health',
           label: this.$t('pageHardwareStatus.table.health'),
           formatter: this.tableFormatter,
-          tdClass: 'text-nowrap'
+          tdClass: 'text-nowrap',
         },
         {
           key: 'partNumber',
           label: this.$t('pageHardwareStatus.table.partNumber'),
-          formatter: this.tableFormatter
+          formatter: this.tableFormatter,
         },
         {
           key: 'serialNumber',
           label: this.$t('pageHardwareStatus.table.serialNumber'),
-          formatter: this.tableFormatter
-        }
-      ]
+          formatter: this.tableFormatter,
+        },
+      ],
     };
   },
   computed: {
     systems() {
       return this.$store.getters['system/systems'];
-    }
+    },
   },
   created() {
     this.$store.dispatch('system/getSystem').finally(() => {
       // Emit initial data fetch complete to parent component
       this.$root.$emit('hardwareStatus::system::complete');
     });
-  }
+  },
 };
 </script>