add links to view and edit

src/components/CustomerCard.vue

@@ -2,7 +2,9 @@
   <div class="card">
     <header class="card-header">
       <p class="card-header-title">
-        {{ this.name }}
+        <router-link :to="{ name: 'customer-view', params: { id: customer.id } }">
+          {{ this.name }}
+        </router-link>
       </p>
     </header>
     <div class="card-content">
@@ -13,12 +15,12 @@
       </div>
     </div>
     <footer class="card-footer">
-      <a class="card-footer-item">
+      <router-link class="card-footer-item" :to="{ name: 'customer-edit', params: { id: customer.id } }">
         <span class="icon is-small">
           <i class="fa fa-pencil"></i>
         </span>
-        <span>&nbsp;Edit</span>
+        &nbsp;Edit
-      </a>
+      </router-link>
       <a class="card-footer-item">
         <span class="icon is-small">
           <i class="fa fa-trash"></i>

src/components/CustomerRow.vue

@@ -1,17 +1,21 @@
 <template>
     <tr>
-      <td>{{ this.name }}</td>
+      <td>
+        <router-link :to="{ name: 'customer-view', params: { id: customer.id } }">
+          {{ this.name }}
+        </router-link>
+      </td>
       <td>{{ customer.email }}</td>
       <td>{{ customer.city }}, {{ customer.state }}</td>
       <td>XX</td>
       <td>
         <div class="control has-addons is-pulled-right">
-          <a class="button is-outlined is-primary">
+          <router-link class="button is-outlined is-primary" :to="{ name: 'customer-edit', params: { id: customer.id } }">
             <span class="icon is-small">
               <i class="fa fa-pencil"></i>
             </span>
-            <span>Edit</span>
+            &nbsp;Edit
-          </a>
+          </router-link>
           <a class="button is-outlined is-primary">
             <span class="icon is-small">
               <i class="fa fa-trash"></i>