minor guff around linkages

src/TableManager.vue

@@ -21,27 +21,27 @@ onMounted(() => {
     },
   ]
 
-  axios.get('http://localhost/api/tables').then((resp) => (allTables.value = resp.data))
+  axios.get('http://localhost/api/tables/all').then((resp) => (allTables.value = resp.data))
-  axios.get('http://localhost/api/active_tables').then((resp) => (activeTables.value = resp.data))
+  axios.get('http://localhost/api/tables/active').then((resp) => (activeTables.value = resp.data))
 })
 
 function startTable(tableId: number) {
-  const activate = axios.get(`http://localhost/api/tables/${tableId}:start`)
+  const start = axios.post(`http://localhost/api/tables/${tableId}:start`)
-  activate
+  start
-    .then((resp) => axios.get('http://localhost/api/tables'))
+    .then((resp) => axios.get('http://localhost/api/tables/all'))
     .then((resp) => (allTables.value = resp.data))
-  activate
+  start
-    .then((resp) => axios.get('http://localhost/api/active_tables'))
+    .then((resp) => axios.get('http://localhost/api/tables/active'))
     .then((resp) => (activeTables.value = resp.data))
 }
 
 function stopTable(tableId: number) {
-  const activate = axios.get(`http://localhost/api/tables/${tableId}:stop`)
+  const stop = axios.post(`http://localhost/api/tables/${tableId}:stop`)
-  activate
+  stop
-    .then((resp) => axios.get('http://localhost/api/tables'))
+    .then((resp) => axios.get('http://localhost/api/tables/all'))
     .then((resp) => (allTables.value = resp.data))
-  activate
+  stop
-    .then((resp) => axios.get('http://localhost/api/active_tables'))
+    .then((resp) => axios.get('http://localhost/api/tables/active'))
     .then((resp) => (activeTables.value = resp.data))
 }
 
@@ -60,7 +60,7 @@ function buildButtonModel(id: number) {
 
 function createTable() {
   axios.post("http://localhost/api/tables",
-      {table_name: "table name", table_link: "table link"})
+    { table_name: "table name", table_link: "table link" })
 }
 
 </script>
@@ -107,14 +107,8 @@ function createTable() {
         <Column field="table_name" header="Table Name" />
         <Column field="table_link" header="Table Link">
           <template #body="slotProps">
-            <RouterLink
+            <a :href="'/' + slotProps.data.table_link" target="_blank" rel="noopener noreferrer">
-              :to="{path: 'https://localhost/' + slotProps.data.table_link}">
+              http://localhost/{{ slotProps.data.table_link }}
-             GO
-            </RouterLink>
-            <a href="http://localhost/test_table_1"
-                target="_blank"
-                rel="noopener noreferrer">
-              {{ slotProps.data.table_link }}
             </a>
           </template>
         </Column>
@@ -136,7 +130,18 @@ function createTable() {
       <DataTable class="Tables" :value="allTables">
         <Column field="table_name" header="Table Name">
         </Column>
-        <Column field="table_link" header="Table Link" />
+        <Column field="table_link" header="Table Link">
+          <template #body="slotProps">
+            <a v-if="slotProps.data.active" :href="'/' + slotProps.data.table_link" target="_blank"
+              rel="noopener noreferrer">
+              http://localhost/{{ slotProps.data.table_link }}
+            </a>
+            <div v-if="!slotProps.data.active">
+              http://localhost/{{ slotProps.data.table_link }}
+            </div>
+          </template>
+
+        </Column>
         <Column header="Close">
           <template #body="slotProps">
             <SplitButton label="Start" @click="startTable(slotProps.data.id)"
@@ -145,7 +150,7 @@ function createTable() {
         </Column>
       </DataTable>
       <div class="button-box flex justify-content-end">
-        <Button label="New Table" @click="createTable()"/>
+        <Button label="New Table" @click="createTable()" />
       </div>
     </template>
   </Card>