front toDos almost position, checked, delete

resources/js/views/ToDoLists/ToDoListIndex.vue

@@ -17,11 +17,14 @@
         <Loader v-if="loading" />
         <div v-else class="flex flex-wrap -m-2 mt-2">
             <div v-if="toDoLists.length < 1">No List Yet</div>
-                <ToDoList v-else
-                          v-for="(toDoList, index) in toDoLists"
-                          :key="index"
-                          :to-do-list="toDoList"
-                          class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" />
+            <router-link v-else
+                      v-for="(toDoList, index) in toDoLists"
+                      :key="index"
+                         :to="'/to-do-lists/' + toDoList.data.to_do_list_id"
+                      :to-do-list="toDoList"
+                      class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4" >
+                {{ toDoList.data.attributes.data.name }}
+            </router-link>
         </div>
     </div>
 </template>
@@ -29,12 +32,11 @@
 <script>
 import Loader from '../../components/Loader'
 import InputField from '../../components/InputField'
-import ToDoList from './ToDoList'
 
 export default {
     name: 'ToDoListIndex',
     components: {
-        Loader, InputField, ToDoList
+        Loader, InputField
     },
     data: function () {
         return {