initial folder and file filter about vue-laravel-file-manager HOT 9 CLOSED

Hi.
You can use the URL parameters to set the default disk and the default folder - docs

Example (see the URL) - demo site

If you use ACL, do not forget - all parent folders must have read permissions!

And i can't find in documentation am i able to set filetype filters to show only certain files (images, audios, videos)

There is no such functionality

from vue-laravel-file-manager.

Thanks for reply.
I'm confused how to send params in URl if i use it in vue component

1. Vue.use(FileManager, { store })
2. Add "file-manager" vue component inside modal view in my vue component.

How i can set URL from vue ? Is there prop ?

P.S. My be i should use mutation when window with file-manager component mounted? As i can see in Vue devtools, there is fm/left/setDisk mutation

from vue-laravel-file-manager.

Are you not using Vue Router?... you can try to use something like this:

<template>
    <div class="container">
        <div class="card card-default">
            <div class="card-header">Example Component</div>

            <div class="card-body">
                <button v-on:click="show" type="button" class="btn btn-primary">Show FM!</button>
                <button v-on:click="hide" type="button" class="btn btn-warning">Hide FM!</button>
            </div>
            <div v-if="key" style="height: 600px;">
                <file-manager></file-manager>
            </div>
        </div>
    </div>
</template>

<script>
  export default {
    data () {
      return {
        key: false,
      }
    },
    methods: {
      show () {
        let url = new URLSearchParams(window.location.search)
        url.append('leftDisk', 'local')
        url.append('leftPath', 'new')

        this.setNewURL(url.toString())

        this.key = true
      },

      hide () {
        let url = new URLSearchParams(window.location.search)
        url.delete('leftDisk')
        url.delete('leftPath')

        this.setNewURL(url.toString())

        this.key = false
      },

      setNewURL (params) {
        let newURL = window.location.protocol
          + '//'
          + window.location.host
          + window.location.pathname
          + '?'
          + params

        window.history.pushState({ path: newURL }, '', newURL)
      },
    },
  }
</script>

P.S. My be i should use mutation when window with file-manager component mounted? As i can see in Vue devtools, there is fm/left/setDisk mutation

I think it's a bad idea.. but you can try. See src/storeaction.js - initializeApp()

You can change defaultDisk:
commit('fm/left/setDisk', 'disk-name);
You can set deafultPath:
commit('fm/left/setSelectedDirectory', 'path-name');
commit('fm/left/addToHistory', 'path-name');
Update directories tree:
dispatch('fm/tree/reopenPath', 'path-name');

BUT you can do this after completing the default initialization ..

from vue-laravel-file-manager.

My backend is SPA using bootstrap-vue. Yes it uses Vue router to show sections. But file-manager is inside one of section component. I included file-manager to modal view:
https://bootstrap-vue.js.org/docs/components/modal/#modals

So it's just a part of component and it's not opened in new window with Vue router.
<b-modal ok-only id="file-manager-modal" ref="file-manager-modal" v-model="fileManagerShow" size="xl" :title="$t('labels.choose_file')" @ok="onSelectFile" > <file-manager ref="file-manager"></file-manager> </b-modal>

I think I'll try to subscribe to finished initialization event and switch to needed folder with mutation.
BTW Are events emited?

from vue-laravel-file-manager.

I think I'll try to subscribe to finished initialization event and switch to needed folder with mutation.
BTW Are events emited?

This method does not generate any events.. that's why I wrote "bad idea"

from vue-laravel-file-manager.

I subscribed to modal "shown" event and successfully changed initial folder at the left panel with mutations. All folders became opened. But right panel did not refresh view and stayed the same file list from initial root folder.
Is fm/tree/reopenPath action enough ?

from vue-laravel-file-manager.

Do you use windowsConfig = 2 ? (one file manager window with directories tree module)
fm/tree/reopenPath - this action for the tree module (left panel)

The problem is most likely that you change the settings before the answer comes from the server with the configurations and they overwrite your changes - see vue dev tools
How easy it is to track the completion of the initialization, without modifying the code, I do not know

I think so far it is worth using the solution I proposed. As time will be, I will try to add events that will help solve this problem.
Do not close the issue so that I do not forget about it...

from vue-laravel-file-manager.

I do not change window config. So i think it's default. Yes tree at the left side and file list at the right side.
I will check if settings recieve from endpoint with setTimeout(). If no success i will try to use Vue router and open file-manager as new window with query string. Just can't understand how to managed to show new window and register callback from file-manager when back to previous route.

from vue-laravel-file-manager.

IMO there is no any problem to control behavior of file-manager. The problem is in small documentation.
I found required action in source and managed to get file list in right (manager) panel.
this.$store.dispatch('fm/left/selectDirectory', {
path,
history: false
})
It would be great to see all useful vuex stores items. Actions, mutations if needed. May be getters etc.
And i think there is a need of emited events.

from vue-laravel-file-manager.