ui: use common component prefix

Author: sevein

ui/src/components/CollectionDetail.vue

@@ -13,7 +13,7 @@
           <dl>
             <dt>Status</dt>
             <dd>
-              <CollectionStatusBadge :status="collection.status"/>
+              <en-collection-status-badge :status="collection.status"/>
             </dd>
             <template v-if="collection.originalId">
               <dt>OriginalID</dt>
@@ -88,7 +88,7 @@ import moment from 'moment';
 
 @Component({
   components: {
-    CollectionStatusBadge,
+    'en-collection-status-badge': CollectionStatusBadge,
   },
 })
 export default class CollectionDetail extends Vue {

ui/src/components/CollectionList.vue

@@ -37,7 +37,7 @@
               <td class="collection-name">{{ item.name }}</td>
               <td>{{ item.createdAt | formatDateTime }}</td>
               <td>{{ item.completedAt | formatDateTime }}</td>
-              <td><CollectionStatusBadge :status="item.status"/></td>
+              <td><en-collection-status-badge :status="item.status"/></td>
             </tr>
           </tbody>
         </table>
@@ -70,7 +70,7 @@ const collectionStoreNs = namespace('collection');
 
 @Component({
   components: {
-    CollectionStatusBadge,
+    'en-collection-status-badge': CollectionStatusBadge,
   },
 })
 export default class CollectionList extends Vue {

ui/src/views/Collection.vue

@@ -1,5 +1,5 @@
 <template>
-  <CollectionDetail></CollectionDetail>
+  <en-collection-detail/>
 </template>
 
 <script lang="ts">
@@ -8,7 +8,7 @@ import CollectionDetail from '@/components/CollectionDetail.vue';
 
 @Component({
   components: {
-    CollectionDetail,
+    'en-collection-detail': CollectionDetail,
   },
 })
 export default class Collection extends Vue {}

ui/src/views/CollectionWorkflow.vue

@@ -26,7 +26,7 @@
                 <td scope="row">{{ item.name }}</td>
                 <td>{{ item.started | formatEpoch }}</td>
                 <td>{{ item.duration }}</td>
-                <td><CollectionStatusBadge :status="item.status"/></td>
+                <td><en-collection-status-badge :status="item.status"/></td>
               </tr>
             </tbody>
           </table>
@@ -64,7 +64,7 @@ import { api, EnduroCollectionClient } from '../client';
 
 @Component({
   components: {
-    CollectionStatusBadge,
+    'en-collection-status-badge': CollectionStatusBadge,
   },
 })
 export default class CollectionWorkflow extends Vue {

ui/src/views/Collections.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="collections">
-    <CollectionList></CollectionList>
+    <en-collection-list/>
   </div>
 </template>
 
@@ -10,7 +10,7 @@ import CollectionList from '@/components/CollectionList.vue';
 
 @Component({
   components: {
-    CollectionList,
+    'en-collection-list': CollectionList,
   },
 })