Resolve "Update Vuetify"

Closes #250 (closed)

frontend/src/components/export/DataExport.vue

@@ -2,7 +2,7 @@
   <v-dialog
     v-model="exportDialog"
     max-width="31vw"
-    @update:returnValue="hide"
+    @update:return-value="hide"
   >
     <v-card id="data-export-modal">
       <v-card-title class="title">
@@ -12,47 +12,50 @@
         <div v-if="!mapFileLoaded">
           If you select a mapping file, the anonymized data
           will be mapped back automatically and locally on your machine.
-          <v-layout
-            row
-            align-center
+          <v-row
+
+            align="center"
           >
-            <file-select
+            <v-file-input
               v-model="mapFile"
-              display-text="Select map file"
-              class="ma-3"
+              label="Map file"
+              accept="application/JSON"
             />
             <span>Without the mapping, the data will still be obfuscated.</span>
-          </v-layout>
+          </v-row>
         </div>
         <span>
           <b>NOTE:</b> Mapping / setting passwords can take some time depending on course size.
         </span>
-        <v-layout row>
-          <v-flex xs4>
+        <v-row>
+          <v-col cols="4">
             <v-tooltip top>
-              <v-checkbox
-                slot="activator"
-                v-model="setPasswords"
-                label="Set passwords"
-              />
+              <template #activator="{ on }">
+                <div v-on="on">
+                  <v-checkbox
+                    v-model="setPasswords"
+                    label="Set passwords"
+                  />
+                </div>
+              </template>
               <span>Setting this will cause all student passwords
                 to be reset upon export. The new passwords will be contained in the
                 export file.
               </span>
             </v-tooltip>
-          </v-flex>
-          <v-flex
+          </v-col>
+          <v-col
             id="type-select"
-            xs3
-            offset-xs1
+            cols="3"
+            offset="1"
           >
             <span>Export as <b>json</b>
             </span>
-          </v-flex>
-        </v-layout>
+          </v-col>
+        </v-row>
         <v-card-actions>
           <v-btn
-            flat
+            text
             color="blue lighten-2"
             @click="exportDialog = false"
           >
@@ -66,8 +69,8 @@
           <v-btn
             v-else
             id="export-data-download-btn"
-            flat
-            outline
+            text
+            outlined
             @click="getExportFile('data')"
           >
             {{ mapFile || mapFileLoaded ? 'Download and apply mapping' : 'Download without mapping' }}
@@ -82,13 +85,10 @@
 import Component, { mixins } from 'vue-class-component'
 import { getters } from '@/store/getters'
 import ax, { StudentExportItem, fetchStudentExportData } from '@/api'
-import FileSelect from '@/components/util/FileSelect.vue'
 import { mutations as mut } from '@/store/mutations'
 import { ExportType, exportMixin } from '@/components/mixins/exportMixin.ts'
 
-@Component({
-  components: { FileSelect }
-})
+@Component
 export default class DataExport extends mixins(exportMixin) {
 
   get studentMap () { return getters.state.studentMap }