adding location to ranges and more control on MyCalendarRanges

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store/index.ts

@@ -1,30 +1,22 @@
 import 'es6-promise/auto';
 import {Store, createStore} from 'vuex';
 import {InjectionKey} from "vue";
-//import actions from './actions';
-//import getters from './getters';
-//import mutations from './mutations';
 import me, {MeState} from './modules/me';
 import fullCalendar, {FullCalendarState} from './modules/fullcalendar';
 import calendarRanges, {CalendarRangesState} from './modules/calendarRanges';
 import calendarRemotes, {CalendarRemotesState} from './modules/calendarRemotes';
-import {whoami} from '../../Calendar/api';
+import {whoami} from "../../../../../../ChillMainBundle/Resources/public/lib/api/user";
 import {User} from '../../../../../../ChillMainBundle/Resources/public/types';
+import locations, {LocationState} from "./modules/location";
 
 const debug = process.env.NODE_ENV !== 'production';
 
 export interface State {
-  /*
-  appointments: Calendar[],
-  appointmentsShown: boolean,
-  startDate: Date|null,
-  endDate: Date|null,
-   */
-  //key: number,
   calendarRanges: CalendarRangesState,
   calendarRemotes: CalendarRemotesState,
   fullCalendar: FullCalendarState,
   me: MeState,
+  locations: LocationState
 }
 
 export const key: InjectionKey<Store<State>> = Symbol();
@@ -33,38 +25,20 @@ const futureStore = function(): Promise<Store<State>> {
   return whoami().then((user: User) => {
     const store = createStore<State>({
       strict: debug,
-      /*
-      state: (): State => ({
-        //key: 0,
-      }),
-
-       */
       modules: {
         me,
         fullCalendar,
         calendarRanges,
         calendarRemotes,
+        locations,
       },
-      mutations: {
-        increaseKey(state: State) {
-          //state.key = state.key + 1;
-        }
-      }
-      /*
-      state: {
-        appointments: [],
-        appointmentsShown: true,
-        startDate: null,
-        endDate: null,
-      },
-       */
-      //getters,
-      //mutations,
-      //actions,
+      mutations: {}
     });
 
-    store.commit('me/setWhoAmi', user, {root: true})
-    //store.dispatch('calendarRanges/fetchRanges', null, {root: true});
+    store.commit('me/setWhoAmi', user, {root: true});
+    store.dispatch('locations/getLocations', null, {root: true}).then(_ => {
+      return store.dispatch('locations/getCurrentLocation', null, {root: true});
+    });
 
     return Promise.resolve(store);
   });

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store/modules/calendarRanges.ts

@@ -1,6 +1,7 @@
 import {State} from './../index';
 import {ActionContext, Module} from 'vuex';
 import {CalendarRange, CalendarRangeCreate, CalendarRangeEdit, isEventInputCalendarRange} from "../../../../types";
+import {Location} from "../../../../../../../ChillMainBundle/Resources/public/types";
 import {fetchCalendarRangeForUser} from '../../../Calendar/api';
 import {calendarRangeToFullCalendarEvent} from '../../../Calendar/store/utils';
 import {EventInput} from '@fullcalendar/vue3';
@@ -89,7 +90,7 @@ export default <Module<CalendarRangesState, State>>{
   },*/
     addRange(state: CalendarRangesState, payload: CalendarRange) {
       const asEvent = calendarRangeToFullCalendarEvent(payload);
-      state.ranges.push(asEvent);
+      state.ranges.push({...asEvent, backgroundColor: 'white', borderColor: '#3788d8', textColor: 'black'});
       state.rangesIndex.add(asEvent.id);
       state.key = state.key + 1;
     },
@@ -122,17 +123,14 @@ export default <Module<CalendarRangesState, State>>{
   },
   actions: {
     fetchRanges(ctx: Context, payload: { start: Date, end: Date }): Promise<null> {
-      console.log('fetchRanges', payload);
       const start = payload.start;
       const end = payload.end;
 
       if (ctx.rootGetters['me/getMe'] === null) {
-        console.log('me is not there');
         return Promise.resolve(ctx.getters.getRangeSource);
       }
 
       if (ctx.getters.isRangeLoaded({start, end})) {
-        console.log('range already loaded');
         return Promise.resolve(ctx.getters.getRangeSource);
       }
 
@@ -151,7 +149,7 @@ export default <Module<CalendarRangesState, State>>{
           return Promise.resolve(null);
         });
     },
-    createRange(ctx, {start, end}: { start: Date, end: Date }): Promise<null> {
+    createRange(ctx, {start, end, location}: { start: Date, end: Date, location: Location }): Promise<null> {
       const url = `/api/1.0/calendar/calendar-range.json?`;
 
       if (ctx.rootState.me.me === null) {
@@ -169,6 +167,10 @@ export default <Module<CalendarRangesState, State>>{
         endDate: {
           datetime: datetimeToISO(end)
         },
+        location: {
+          id: location.id,
+          type: "location"
+        }
       } as CalendarRangeCreate;
 
       return makeFetch<CalendarRangeCreate, CalendarRange>('POST', url, body)
@@ -179,7 +181,7 @@ export default <Module<CalendarRangesState, State>>{
           return Promise.resolve(null);
         })
         .catch((error) => {
-          console.log(error);
+          console.error(error);
 
           throw error;
         })
@@ -208,7 +210,7 @@ export default <Module<CalendarRangesState, State>>{
           ctx.commit('updateRange', range);
         })
         .catch((error) => {
-          console.log(error);
+          console.error(error);
         })
     },
     copyFromDayToAnotherDay(ctx, {from, to}: {from: Date, to: Date}): Promise<null> {

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store/modules/location.ts

@@ -0,0 +1,57 @@
+import {Location} from "../../../../../../../ChillMainBundle/Resources/public/types";
+import {State} from '../index';
+import {Module} from 'vuex';
+import {getLocations} from "../../../../../../../ChillMainBundle/Resources/public/lib/api/locations";
+import {whereami} from "../../../../../../../ChillMainBundle/Resources/public/lib/api/user";
+
+export interface LocationState {
+  locations: Location[];
+  locationPicked: Location | null;
+  currentLocation: Location | null;
+}
+
+export default <Module<LocationState, State>>{
+  namespaced: true,
+  state: (): LocationState => {
+    return {
+      locations: [],
+      locationPicked: null,
+      currentLocation: null,
+    }
+  },
+  mutations: {
+    setLocations(state, locations): void {
+      state.locations = locations;
+    },
+    setLocationPicked(state, location: Location | null): void {
+      if (null === location) {
+        state.locationPicked = null;
+        return;
+      }
+
+      state.locationPicked = state.locations.find(l => l.id === location.id) || null;
+    },
+    setCurrentLocation(state, location: Location | null): void {
+      if (null === location) {
+        state.currentLocation = null;
+        return;
+      }
+
+      state.currentLocation = state.locations.find(l => l.id === location.id) || null;
+    }
+  },
+  actions: {
+    getLocations(ctx): Promise<void> {
+      return getLocations().then(locations => {
+        ctx.commit('setLocations', locations);
+        return Promise.resolve();
+      });
+    },
+    getCurrentLocation(ctx): Promise<void> {
+      return whereami().then(location => {
+        ctx.commit('setCurrentLocation', location);
+      })
+    }
+  }
+}
+