-
{{ error }}
+
+
diff --git a/resources/styles/_fabourites.scss b/resources/styles/_fabourites.scss
index 0e7609a..9309cce 100644
--- a/resources/styles/_fabourites.scss
+++ b/resources/styles/_fabourites.scss
@@ -1,5 +1,32 @@
@include media-breakpoint-up('sm') {
.favourite-add-form {
- width: 250px;
+ width: 300px;
+ }
+}
+
+.favourite__stops {
+ display: block;
+ white-space: nowrap;
+ padding-left: 0;
+ font-size: $small-font-size;
+ overflow-x: hidden;
+ text-overflow: ellipsis;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+}
+
+.favourite__stop {
+ display: inline-flex;
+
+ &::after {
+ content: ", ";
+ margin-right: .5em;
+ }
+
+ &:last-child::after {
+ content: none;
+ margin-right: 0;
}
}
diff --git a/resources/styles/_form.scss b/resources/styles/_form.scss
index 37df9bb..501fd56 100644
--- a/resources/styles/_form.scss
+++ b/resources/styles/_form.scss
@@ -5,3 +5,7 @@ label {
margin-top: -0.2rem;
display: block;
}
+
+.form-group:last-child {
+ margin-bottom: 0;
+}
diff --git a/resources/styles/_stop.scss b/resources/styles/_stop.scss
index c6d5346..f8191cc 100644
--- a/resources/styles/_stop.scss
+++ b/resources/styles/_stop.scss
@@ -7,10 +7,7 @@
.stop__name {
flex: 1 0;
line-height: 1.1;
-}
-
-.stop__variant {
- margin: 0 .5rem;
+ margin-right: .5em;
}
.stop__actions {
diff --git a/resources/ts/components/favourites.ts b/resources/ts/components/favourites.ts
index 68f9aaa..10c11fa 100644
--- a/resources/ts/components/favourites.ts
+++ b/resources/ts/components/favourites.ts
@@ -1,33 +1,46 @@
import Vue from 'vue'
-import { Component } from 'vue-property-decorator'
-import { namespace } from "vuex-class";
+import { Component, Prop } from 'vue-property-decorator'
+import { namespace, State } from "vuex-class";
import { Favourite } from "../store/favourites";
import { SavedState } from "../store/root";
+import { Stop } from "../model";
+import * as uuid from "uuid";
+import { Favourites } from "../store";
-const { State, Mutation } = namespace('favourites');
@Component({ template: require('../../components/favourites.html' )})
export class FavouritesComponent extends Vue {
- @State favourites: Favourite[];
- @Mutation remove: (fav: Favourite) => void;
+ @Favourites.State favourites: Favourite[];
+ @Favourites.Mutation remove: (fav: Favourite) => void;
choose(favourite: Favourite) {
this.$store.dispatch('load', favourite.state);
}
}
+function createFavouriteEntry(name: string, stops: Stop[]): Favourite {
+ return {
+ id: uuid.v4(),
+ name,
+ stops,
+ state: {
+ version: 1,
+ stops: stops.map(stop => stop.id),
+ },
+ }
+}
+
@Component({ template: require('../../components/favourites/save.html' )})
export class FavouritesAdderComponent extends Vue {
+ @State stops: Stop[];
+
private name = "";
private errors = { name: [] };
- @Mutation add: (fav: Favourite) => void;
+ @Favourites.Mutation add: (favourite: Favourite) => void;
async save() {
- const state = await this.$store.dispatch('save') as SavedState;
- const name = this.name;
-
- const favourite: Favourite = { name, state };
+ const favourite: Favourite = createFavouriteEntry(this.name, this.stops);
if (this.validate(favourite)) {
this.add(favourite);
diff --git a/resources/ts/store/favourites.ts b/resources/ts/store/favourites.ts
index 51d711c..ebc27eb 100644
--- a/resources/ts/store/favourites.ts
+++ b/resources/ts/store/favourites.ts
@@ -1,9 +1,12 @@
import { RootState, SavedState } from "./root";
import { Module, Plugin, Store } from "vuex";
import * as utils from "../utils";
+import { Stop } from "../model";
export interface Favourite {
+ id: string;
name: string;
+ stops: Stop[];
state: SavedState;
}
@@ -34,4 +37,4 @@ export const localStorageSaver = (path: string, key: string): Plugin
=> (st
})
};
-export default favourites;
\ No newline at end of file
+export default favourites;
diff --git a/resources/ts/store/index.ts b/resources/ts/store/index.ts
index a8820a0..0719309 100644
--- a/resources/ts/store/index.ts
+++ b/resources/ts/store/index.ts
@@ -6,6 +6,7 @@ import favourites, { FavouritesState, localStorageSaver } from './favourites'
import { state, mutations, actions, RootState } from "./root";
import VuexPersistence from "vuex-persist";
+import { namespace } from "vuex-class";
export type State = {
messages: MessagesState;
@@ -34,3 +35,5 @@ const store = new Vuex.Store({
});
export default store;
+
+export const Favourites = namespace('favourites');
diff --git a/yarn.lock b/yarn.lock
index 6aedee3..79c4d8d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -308,6 +308,13 @@
dependencies:
source-map "^0.6.1"
+"@types/uuid@^3.4.6":
+ version "3.4.6"
+ resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-3.4.6.tgz#d2c4c48eb85a757bf2927f75f939942d521e3016"
+ integrity sha512-cCdlC/1kGEZdEglzOieLDYBxHsvEOIg7kp/2FYyVR9Pxakq+Qf/inL3RKQ+PA8gOlI/NnL+fXmQH12nwcGzsHw==
+ dependencies:
+ "@types/node" "*"
+
"@types/webpack-sources@*":
version "0.1.5"
resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-0.1.5.tgz#be47c10f783d3d6efe1471ff7f042611bd464a92"