Added calendar date adjuster.

Author: Phil Wing

src/components/ListItems/BooleanSlider.vue

@@ -37,8 +37,7 @@ export default {
   },
   methods: {
     emitSliderChange() {
-      this.$emit('update:modelValue', this.isChecked); // Emit for v-model binding
-      console.log("toggling");
+      this.$emit('update:modelValue', this.isChecked); // Emit for v-model bindingS
     },
     toggleSlider() {
       this.isChecked = !this.isChecked;

src/components/ListItems/ListElement.vue

@@ -67,6 +67,7 @@ import TimeInput from './TimeInput.vue';
 import MinuteInput from './MinuteInput.vue';
 import { createList } from '../../api.js';
 import './ListElement.css';
+import { getTodayDate } from '../../date.js';
 
 export default {
   name: 'ListElement',
@@ -83,6 +84,10 @@ export default {
     multiplayer: {
       type: Boolean,
       required: false 
+    },
+    initialDate: {
+      type: String,
+      required: false,
     }
   },
   data() {
@@ -125,6 +130,11 @@ export default {
         immediate: true,
         deep: true, // Watch deeply for changes in array content
       },*/
+      initialDate(){
+        if(this.listName!='Backburner'){
+          
+        }
+      }
   },
   created() {
     this.loadInitialData();
@@ -251,7 +261,7 @@ export default {
       return {
         textString: text || '',
         scheduledCheckbox: false,
-        scheduledDate: null,
+        scheduledDate: this.initialDate,
         scheduledTime: null,
         taskTimeEstimate: 0,
         recurringTask: false,
@@ -266,7 +276,7 @@ export default {
         //Will be replaced eventually
         textString: text,
         scheduledCheckbox: this.scheduledCheckbox,
-        scheduledDate: this.scheduledDate,
+        scheduledDate: this.initialDate,
         scheduledTime: this.scheduledTime,
         taskTimeEstimate: this.taskTimeEstimate,
         recurringTask: false,

src/date.js

@@ -8,5 +8,31 @@ export function getTodayDate() {
     return `${year}-${month}-${day}`; // Format: YYYY-MM-DD
   }
 
-  
+  export function incrementDate(dateString) {
+    let date;
+
+    // Check if dateString is null or undefined, use current date if so
+    if (!dateString) {
+      date = new Date(this.getCurrentDate()); // Convert the current date string to a Date object
+    } else {
+      date = new Date(dateString); // Convert the provided dateString to a Date object
+    }
+
+    date.setDate(date.getDate() + 1); // Increment the date by 1
+    return date.toISOString().split('T')[0]; // Return the incremented date as a string in YYYY-MM-DD format
+  }
+
+  export function decrementDate(dateString) {
+    let date;
+
+    // Check if dateString is null or undefined, use current date if so
+    if (!dateString) {
+      date = new Date(this.getCurrentDate()); // Convert the current date string to a Date object
+    } else {
+      date = new Date(dateString); // Convert the provided dateString to a Date object
+    }
+
+    date.setDate(date.getDate() - 1); // Increment the date by 1
+    return date.toISOString().split('T')[0]; // Return the incremented date as a string in YYYY-MM-DD format
+  }
 

src/router/generalRoutes.js

@@ -1,16 +1,10 @@
 // src/router/routes/generalRoutes.js
-import AboutMe from '@/views/AboutMe.vue';
 import Learn from '@/views/Learn.vue';
 import Type from '@/views/Type.vue';
 import Lists from '@/views/Lists.vue';
 import Settings from '@/views/Settings.vue';
 
 export default [
-  {
-    path: '/about-me',
-    name: 'AboutMe',
-    component: AboutMe
-  },
   {
     path: '/learn',
     name: 'Learn',

src/views/Dashboard.vue

@@ -7,15 +7,16 @@
         <!--Need to put these in a v-if is bound to the emits of multiplayer toggle-->
           <div class="bigButton" id="previousDay" @click="decrementDay"
             :style="{ 'background-color': colors.background }">&lt;&lt;</div>
-          <DateInput :style="{margin:'0px' }" @date-selected="handleDueDateChange" :initialDate="currentDate"/>
-          <div class="bigButton" id="nextDay" :style="{ 'background-color': colors.background }">>></div>
+          <DateInput :style="{margin:'0px',color:'white' }" @date-selected="handleDateChange" v-model="currentDate"/>
+          <div class="bigButton" id="nextDay" @click="incrementDay"
+          :style="{ 'background-color': colors.background }">>></div>
       </div>
     </div>
 
     <div class="page-container" :style="{ 'background-color': colors.background }">
       <div class="lists-container">
         <ListElement listName="Backburner" v-model="backburner" />
-        <ListElement listName="Daily List" v-model="dailyList" :multiplayer="isChecked"/>
+        <ListElement listName="Daily List" v-model="dailyList" :initialDate="currentDate"/>
         <DailyCalendar v-model:list1="backburner" v-model:list2="dailyList" />
       </div>
     </div>
@@ -31,6 +32,7 @@ import DailyCalendar from '@/components/CalendarComponents/DailyCalendar.vue';
 import DateInput from '@/components/ListItems/DateInput.vue';
 import './cssViews/Dashboard.css';
 import MultiplayerToggle from '@/components/DashboardComponents/MultiplayerToggle.vue';
+import { getTodayDate, incrementDate, decrementDate } from '../date.js'
 
 export default {
   name: 'DashboardWorld',
@@ -45,7 +47,7 @@ export default {
       colors: colors,
       dailyList: [],
       backburner: [],
-      currentDate: 0,
+      currentDate: getTodayDate(),
       isChecked: false,
     };
   },
@@ -63,10 +65,12 @@ export default {
       this.itemsArray[this.selectedItemIndex].scheduledDate = date;
     },
     decrementDay() {
-      console.log("0");
+      this.currentDate = decrementDate(this.currentDate);
+      console.log(this.currentDate);
     },
     incrementDay() {
-
+      this.currentDate = incrementDate(this.currentDate);
+      console.log(this.currentDate);
     },
     onEventClicked({ event, listType, index }) {
       console.log(`Event clicked:`, event);