Load folder data on dialog open

AsgardCms · Oct 8, 2017 · 8c60d82 · 8c60d82
1 parent f738d5a
commit 8c60d82
Show file tree

Hide file tree

Showing 2 changed files with 72,161 additions and 72,174 deletions.
diff --git a/Modules/Media/Assets/js/components/MoveMediaDialog.vue b/Modules/Media/Assets/js/components/MoveMediaDialog.vue
@@ -1,14 +1,15 @@
 <template>
     <div>
-        <el-dialog title="Move Media" :visible.sync="dialogFormVisible" size="tiny" class="move-media-dialog">
+        <el-dialog title="Move Media" :visible.sync="dialogFormVisible" size="tiny" class="move-media-dialog"  @open="fetchFolders">
             <el-form v-loading.body="loading" @submit.native.prevent="onSubmit()">
                 <el-form-item label="To" :class="{'el-form-item is-error': form.errors.has('name') }">
                     <el-select v-model="destinationFolder" placeholder="Select">
                         <el-option
                                 v-for="(item, id) in options"
                                 :key="id"
                                 :label="item"
-                                :value="id">
+                                :value="id"
+                                :loading="selectIsLoading">
                             <span v-html="item"></span>
                         </el-option>
                     </el-select>
@@ -37,6 +38,7 @@
                 dialogFormVisible: false,
                 form: new Form(),
                 loading: false,
+                selectIsLoading: false,
                 options: [],
                 destinationFolder: '',
             };
@@ -63,15 +65,17 @@
                 this.form.clear();
                 this.dialogFormVisible = false;
             },
-            async fetchFolders() {
+            fetchFolders() {
+                this.selectIsLoading = true;
                 axios.get(route('api.media.folders.all-nestable'))
                     .then((response) => {
-                        this.options = _.merge(response.data, {0: 'Root'});
+                        console.log(response);
+                        this.options = _.merge(response.data, { 0: 'Root' });
+                        this.selectIsLoading = false;
                     });
             },
         },
         mounted() {
-            this.fetchFolders();
             this.$events.listen('moveMediaWasClicked', (eventData) => {
                 this.selectedMedia = eventData;
                 this.dialogFormVisible = true;