From a38a6e880b0f4e6018413c07807473da326286f6 Mon Sep 17 00:00:00 2001
From: "robinwilliam.hundt" <robinwilliam.hundt@stud.uni-goettingen.de>
Date: Thu, 30 Nov 2017 00:13:03 +0100
Subject: [PATCH] Created new vuex store module for submission-notes
Started work on using a store for the submission-notes component
---
.../submission_notes/AnnotatedSubmission.vue | 45 +++--------
.../submission_notes/FeedbackForm.vue | 2 +-
frontend/src/main.js | 3 +-
.../src/store/modules/submission-notes.js | 76 +++++++++++++++++++
.../src/store/modules/submission_notes.js | 7 --
frontend/src/store/store.js | 5 ++
6 files changed, 92 insertions(+), 46 deletions(-)
create mode 100644 frontend/src/store/modules/submission-notes.js
delete mode 100644 frontend/src/store/modules/submission_notes.js
diff --git a/frontend/src/components/submission_notes/AnnotatedSubmission.vue b/frontend/src/components/submission_notes/AnnotatedSubmission.vue
index 5ecb1262..ca41a231 100644
--- a/frontend/src/components/submission_notes/AnnotatedSubmission.vue
+++ b/frontend/src/components/submission_notes/AnnotatedSubmission.vue
@@ -18,6 +18,7 @@
<script>
+ import {mapGetters, mapState} from 'vuex'
import CommentForm from '@/components/submission_notes/FeedbackForm.vue'
import FeedbackComment from '@/components/submission_notes/FeedbackComment.vue'
@@ -26,46 +27,18 @@
FeedbackComment,
CommentForm},
name: 'annotated-submission',
+ beforeCreate () {
+ this.$store.dispatch('getFeedback', 0)
+ this.$store.dispatch('getSubmission', 0)
+ },
computed: {
- submission () {
- return this.source.split('\n').reduce((acc, cur, index) => {
- acc[index + 1] = cur
- return acc
- }, {})
- }
+ ...mapState({
+ feedback: state => state.submissionNotes.feedback
+ }),
+ ...mapGetters(['submission'])
},
data: function () {
return {
- source: '//Procedural Programming technique shows creation of Pascal\'s Triangl\n' +
- '#include <iostream>\n' +
- '#include <iomanip>\n' +
- 'using namespace std;\n' +
- 'int** comb(int** a , int row , int col)\n' +
- '{\n' +
- ' int mid = col/2;\n' +
- ' //clear matrix\n' +
- ' for( int i = 0 ; i < row ; i++)\n' +
- ' for( int j = 0 ; j < col ; j++)\n' +
- ' a[i][j] = 0;\n' +
- ' a[0][mid] = 1; //put 1 in the middle of first row\n' +
- ' //build up Pascal\'s Triangle matrix\n' +
- ' for( int i = 1 ; i < row ; i++)\n' +
- ' {\n' +
- ' for( int j = 1 ; j < col - 1 ; j++)\n' +
- ' a[i][j] = a[i-1][j-1] + a[i-1][j+1];\n' +
- ' }\n' +
- ' return a;\n' +
- '}\n' +
- 'void disp(int** ptr, int row, int col)\n' +
- '{\n' +
- ' cout << endl << endl;\n' +
- ' for ( int i = 0 ; i < row ; i++)\n' +
- ' {\n' +
- ' for ( int j = 0 ; j < col ; j++)\n',
- feedback: {
- '1': 'Youre STUPID',
- '4': 'Very much so'
- },
showEditorOnLine: { }
}
},
diff --git a/frontend/src/components/submission_notes/FeedbackForm.vue b/frontend/src/components/submission_notes/FeedbackForm.vue
index bd4ed906..f5daf4f7 100644
--- a/frontend/src/components/submission_notes/FeedbackForm.vue
+++ b/frontend/src/components/submission_notes/FeedbackForm.vue
@@ -11,7 +11,7 @@
hide-details
></v-text-field>
<v-btn color="success" @click="submitFeedback()">Submit</v-btn>
- <v-btn>Cancel</v-btn>
+ <v-btn>Discard</v-btn>
</div>
</template>
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 10e17e6a..2181166f 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -7,10 +7,9 @@ import store from './store/store'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
-
+import 'font-awesome/css/font-awesome.min.css'
import 'google-code-prettify/bin/prettify.min'
import 'google-code-prettify/bin/prettify.min.css'
-import 'font-awesome/css/font-awesome.min.css'
Vue.use(Vuetify)
diff --git a/frontend/src/store/modules/submission-notes.js b/frontend/src/store/modules/submission-notes.js
new file mode 100644
index 00000000..3c1e7633
--- /dev/null
+++ b/frontend/src/store/modules/submission-notes.js
@@ -0,0 +1,76 @@
+import Vue from 'vue'
+
+const mockSubmission = '//Procedural Programming technique shows creation of Pascal\'s Triangl\n' +
+ '#include <iostream>\n' +
+ '#include <iomanip>\n' +
+ 'using namespace std;\n' +
+ 'int** comb(int** a , int row , int col)\n' +
+ '{\n' +
+ ' int mid = col/2;\n' +
+ ' //clear matrix\n' +
+ ' for( int i = 0 ; i < row ; i++)\n' +
+ ' for( int j = 0 ; j < col ; j++)\n' +
+ ' a[i][j] = 0;\n' +
+ ' a[0][mid] = 1; //put 1 in the middle of first row\n' +
+ ' //build up Pascal\'s Triangle matrix\n' +
+ ' for( int i = 1 ; i < row ; i++)\n' +
+ ' {\n' +
+ ' for( int j = 1 ; j < col - 1 ; j++)\n' +
+ ' a[i][j] = a[i-1][j-1] + a[i-1][j+1];\n' +
+ ' }\n' +
+ ' return a;\n' +
+ '}\n' +
+ 'void disp(int** ptr, int row, int col)\n' +
+ '{\n' +
+ ' cout << endl << endl;\n' +
+ ' for ( int i = 0 ; i < row ; i++)\n' +
+ ' {\n' +
+ ' for ( int j = 0 ; j < col ; j++)\n'
+
+const mockFeedback = {
+ '1': 'Youre STUPID',
+ '4': 'Very much so'
+}
+
+const submissionNotes = {
+ state: {
+ rawSubmission: '',
+ feedback: {}
+ },
+ getters: {
+ // reduce the string rawSubmission into an object where the keys are the
+ // line indexes starting at one and the values the corresponding submission line
+ // this makes iterating over the submission much more pleasant
+ submission: state => {
+ return state.rawSubmission.split('\n').reduce((acc, cur, index) => {
+ acc[index + 1] = cur
+ return acc
+ }, {})
+ }
+ },
+ mutations: {
+ 'SET_RAW_SUBMISSION': function (state, submission) {
+ state.rawSubmission = mockSubmission
+ },
+ 'SET_FEEDBACK': function (state, feedback) {
+ state.feedback = feedback
+ },
+ 'UPDATE_FEEDBACK': function (state, lineIndex, feedbackContent) {
+ Vue.set(state.feedback, lineIndex, feedbackContent)
+ }
+ },
+ actions: {
+ // TODO remove mock data
+ getSubmission (context, submissionId) {
+ context.commit('SET_RAW_SUBMISSION', mockSubmission)
+ },
+ getFeedback (context, feedbackId) {
+ context.commit('SET_FEEDBACK', mockFeedback)
+ },
+ updateFeedback (context, lineIndex, feedbackContent) {
+ context.commit('UPDATE_FEEDBACK', lineIndex, feedbackContent)
+ }
+ }
+}
+
+export default submissionNotes
diff --git a/frontend/src/store/modules/submission_notes.js b/frontend/src/store/modules/submission_notes.js
deleted file mode 100644
index 3212a56a..00000000
--- a/frontend/src/store/modules/submission_notes.js
+++ /dev/null
@@ -1,7 +0,0 @@
-const submission = {
- state: {
- submission: ''
- }
-}
-
-export default submission
diff --git a/frontend/src/store/store.js b/frontend/src/store/store.js
index d2119b94..9e1e6c43 100644
--- a/frontend/src/store/store.js
+++ b/frontend/src/store/store.js
@@ -2,9 +2,14 @@ import Vuex from 'vuex'
import Vue from 'vue'
import ax from './api'
+import submissionNotes from './modules/submission-notes'
+
Vue.use(Vuex)
const store = new Vuex.Store({
+ modules: {
+ submissionNotes: submissionNotes
+ },
state: {
token: '',
loggedIn: false,
--
GitLab