salix/modules/claim/front/photos/index.js

import ngModule from '../module';
import Section from 'salix/components/section';
import './style.scss';

class Controller extends Section {
    constructor($element, $, vnFile) {
        super($element, $);
        this.vnFile = vnFile;
    }

    deleteDms(index) {
        const dmsFk = this.photos[index].dmsFk;
        return this.$http.post(`ClaimDms/${dmsFk}/removeFile`)
            .then(() => {
                this.$.model.remove(index);
                this.vnApp.showSuccess(this.$t('Photo deleted'));
            });
    }

    onDrop($event) {
        const files = $event.dataTransfer.files;
        this.setDefaultParams().then(() => {
            this.dms.files = files;
            this.create();
        });
    }

    setDefaultParams() {
        const filter = {
            where: {code: 'claim'}
        };
        return this.$http.get('DmsTypes/findOne', {filter}).then(res => {
            const dmsTypeId = res.data && res.data.id;
            const companyId = this.vnConfig.companyFk;
            const warehouseId = this.vnConfig.warehouseFk;
            this.dms = {
                hasFile: false,
                hasFileAttached: false,
                reference: this.claim.id,
                warehouseId: warehouseId,
                companyId: companyId,
                dmsTypeId: dmsTypeId,
                description: this.$t('FileDescription', {
                    claimId: this.claim.id,
                    clientId: this.claim.client.id,
                    clientName: this.claim.client.name
                }).toUpperCase()
            };
        });
    }

    openUploadDialog() {
        const element = document.createElement('input');
        element.setAttribute('type', 'file');
        element.setAttribute('multiple', true);
        element.click();

        element.addEventListener('change', () =>
            this.setDefaultParams().then(() => {
                this.dms.files = element.files;
                this.create();
            })
        );
    }

    create() {
        const query = `claims/${this.claim.id}/uploadFile`;
        const options = {
            method: 'POST',
            url: query,
            params: this.dms,
            headers: {'Content-Type': undefined},
            transformRequest: files => {
                const formData = new FormData();

                for (let i = 0; i < files.length; i++)
                    formData.append(files[i].name, files[i]);

                return formData;
            },
            data: this.dms.files
        };
        this.$http(options).then(() => {
            this.vnApp.showSuccess(this.$t('Photo uploaded!'));
            this.$.model.refresh();
        });
    }

    getImagePath(dmsId) {
        return this.vnFile.getPath(`/api/dms/${dmsId}/downloadFile`);
    }
}

Controller.$inject = ['$element', '$scope', 'vnFile'];

ngModule.vnComponent('vnClaimPhotos', {
    template: require('./index.html'),
    controller: Controller,
    bindings: {
        claim: '<'
    }
});