Progressbar not showing when using previewTemplate

[cnd-TLC]

trafficstars

I've tried to research more but still didn't come up with a solution. I'm using vue. As of the moment, I have this in my template. Everything works fine. The thumbnail, name, size, and even the custom remove button is displayed. Only the progressbar is missing.

template() {
                return `
                    <ul class="dz-preview dz-file-preview white pa-0 my-1 rounded divide-y shadow">
                        <div class="ma-0 px-2 py-3 divide-y">
                            <li class="dz-details flex items-center justify-between align-center">
                                <img data-dz-thumbnail />
                                <div class="dz-filename text-sm text-gray-700 col-5" style="word-wrap: break-word !important" data-dz-name></div>
                                <div class="dz-size text-sm text-gray-700" data-dz-size></div>
                                <p class="pa-0 ma-0 text-center font-medium text-sm text-red-400 hover:text-red-600 text-center cursor-pointer" data-dz-remove>Remove</p>
                            </li>
                            <!-- Upload Progress -->
                            <div class="dz-progress mt-1">
                                <span class="dz-upload" id="progress" data-dz-uploadprogress></span>
                            </div>
                            <div class="dz-error-message text-sm text-center red--text">
                                <span data-dz-errormessage></span>
                            </div>
                        </div>
                    </ul>
                `
            },

And these are my configurations

dropzoneOptions: {
                    url: 'api/managevehicle/store_image',
                    autoProcessQueue:false,
                    uploadMultiple: true,
                    thumbnailWidth: 50,
                    thumbnailHeight: null,
                    maxFilesize: 5,
                    acceptedFiles: ".jpeg,.jpg,.png,.gif,.pdf",
                    headers: {},
                    previewTemplate: this.template(),
                },

[Mecanik]

I had the same issue, it's because the CSS is not loading.

[Mecanik]

Just append dropzone to template container.