Save Activity, list existing Activities

Author: avivace

src/components/ActivityEditor.vue

@@ -202,6 +202,9 @@
 				</v-tabs-items>
 			</v-content>
 		</v-app>
+		<v-snackbar v-model="snackbar">
+			{{ snackbarText }}
+		</v-snackbar>
 	</div>
 </template>
 <script>
@@ -256,6 +259,9 @@ export default {
 	},
 	data() {
 		return {
+			CB: process.env.CB_ENDPOINT + process.env.APIv2,
+			snackbar: false,
+			snackbarText: "",
 			activity: {
 				name: null,
 				drawerEnabled: true,
@@ -334,6 +340,20 @@ export default {
 	methods: {
 		save: function() {
 			console.log(JSON.stringify(this.activity))
+			if (this.activity.name) {
+				let axios = this.$axios
+				let CB = this.CB
+				axios.post(CB + '/saveActivity', {
+						activity: this.activity
+					})
+					.then(function(data) {
+						this.snackbarText = "Attività salvata";
+						this.snackbar = true;
+					}.bind(this))
+			} else {
+				this.snackbarText = "Salvataggio non riuscito: inserisci un nome all'attività!";
+				this.snackbar = true;
+			}
 		},
 		toggleSidebar: function() {
 			let currentStatus = this.$store.getters.drawerStatus

src/components/ActivityList.vue

@@ -0,0 +1,61 @@
+<template>
+	<div>
+		<v-app id="inspire">
+			<sidebar></sidebar>
+			<v-toolbar color="indigo" dark fixed app>
+				<v-toolbar-side-icon @click.stop="toggleSidebar()"></v-toolbar-side-icon>
+				<v-toolbar-title>CoderBot</v-toolbar-title>
+			</v-toolbar>
+			<v-content>
+				<v-list>
+					<span v-if="activityList == null">
+						Nessuna Attività, perchè non ne <a href="#/activity/new">crei</a> una nuova?
+					</span>
+						<v-list-tile v-for="activity in activityList" :key="activity.el" avatar @click="">
+							<v-list-tile-title ripple @click="loadProgram(activity.name)">
+								{{ activity.name }}
+							</v-list-tile-title>
+							<v-btn flat icon color="grey darken-1" ripple @click="deleteActivityDlg(activity.name)">
+								<v-icon>delete</v-icon>
+							</v-btn>
+						</v-list-tile>
+					</v-list>
+			</v-content>
+		</v-app>
+	</div>
+</template>
+<script>
+import sidebar from "../components/Sidebar"
+
+export default {
+	components: { sidebar },
+	name: 'CoderBot',
+	mounted() {
+		let axios = this.$axios
+		let CB = this.$data.CB
+		//let programList = this.$data.programList
+		axios.get(CB + '/listActivities')
+			.then(function(response) {
+					this.$data.activityList = response.data;
+			}.bind(this))
+	},
+	methods: {
+		toggleSidebar: function() {
+			let currentStatus = this.$store.getters.drawerStatus
+			this.$store.commit('toggleDrawer', !currentStatus)
+		}
+	},
+	data() {
+		return {
+			CB: process.env.CB_ENDPOINT + process.env.APIv2,
+			activityList: null,
+			drawer: null,
+			source: null,
+		};
+	},
+};
+
+</script>
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+</style>