From 6d54e7a89ddbac2bf5a55b8e63b7fc5b92d4e6f0 Mon Sep 17 00:00:00 2001 From: Joan Sanchez Date: Mon, 30 Sep 2019 14:57:54 +0200 Subject: [PATCH] Claim dms upload file with drag & drop #1731 --- front/core/components/icon-menu/style.scss | 3 +- front/core/directives/droppable.js | 39 ++---- front/core/directives/droppable.scss | 11 ++ front/salix/components/app/style.scss | 9 +- modules/claim/front/dms/create/index.html | 71 ----------- modules/claim/front/dms/create/index.js | 115 ----------------- modules/claim/front/dms/create/index.spec.js | 83 ------------ modules/claim/front/dms/create/style.scss | 7 -- modules/claim/front/dms/edit/index.html | 71 ----------- modules/claim/front/dms/edit/index.js | 104 --------------- modules/claim/front/dms/edit/index.spec.js | 86 ------------- modules/claim/front/dms/edit/style.scss | 7 -- modules/claim/front/dms/index/index.html | 126 ++++--------------- modules/claim/front/dms/index/index.js | 98 +++++++++------ modules/claim/front/dms/index/index.spec.js | 47 ++++++- modules/claim/front/dms/index/style.scss | 22 +++- modules/claim/front/dms/locale/es.yml | 12 +- modules/claim/front/routes.json | 20 +-- modules/claim/front/summary/style.scss | 26 +++- 19 files changed, 200 insertions(+), 757 deletions(-) create mode 100644 front/core/directives/droppable.scss delete mode 100644 modules/claim/front/dms/create/index.html delete mode 100644 modules/claim/front/dms/create/index.js delete mode 100644 modules/claim/front/dms/create/index.spec.js delete mode 100644 modules/claim/front/dms/create/style.scss delete mode 100644 modules/claim/front/dms/edit/index.html delete mode 100644 modules/claim/front/dms/edit/index.js delete mode 100644 modules/claim/front/dms/edit/index.spec.js delete mode 100644 modules/claim/front/dms/edit/style.scss diff --git a/front/core/components/icon-menu/style.scss b/front/core/components/icon-menu/style.scss index 06f66127f..df7a5e331 100644 --- a/front/core/components/icon-menu/style.scss +++ b/front/core/components/icon-menu/style.scss @@ -2,6 +2,7 @@ vn-icon-menu { cursor: pointer; vn-drop-down { - font-family: 'vn-font' + font-family: 'vn-font'; + outline: 0 } } \ No newline at end of file diff --git a/front/core/directives/droppable.js b/front/core/directives/droppable.js index b99f397c7..483282418 100644 --- a/front/core/directives/droppable.js +++ b/front/core/directives/droppable.js @@ -1,5 +1,5 @@ import ngModule from '../module'; - +import './droppable.scss'; export function directive($parse) { return { @@ -22,7 +22,7 @@ export function directive($parse) { * Enter droppable area event */ element.addEventListener('dragenter', event => { - element.style.backgroundColor = 'yellow'; + element.classList.add('active'); event.stopImmediatePropagation(); event.preventDefault(); @@ -33,7 +33,7 @@ export function directive($parse) { * Exit droppable area event */ element.addEventListener('dragleave', event => { - element.style.backgroundColor = 'transparent'; + element.classList.remove('active'); event.stopImmediatePropagation(); event.preventDefault(); @@ -52,37 +52,12 @@ export function directive($parse) { * Fires when a drop events */ element.addEventListener('drop', event => { - const draggedParent = this.dragged.parentNode; - const targetChild = element.querySelector('ul'); + element.classList.remove('active'); + onDropEvent($scope, {event}); - element.style.transition = 'background 2s'; - element.style.backgroundColor = 'transparent'; - - if (this.dragged === element) - return event.preventDefault(); - - - if (targetChild) { - const targetNodes = targetChild.querySelectorAll('li'); - const before = targetNodes[targetNodes.length - 1]; - - targetChild.insertBefore(this.dragged, before); - } else - draggedParent.removeChild(this.dragged); - - onDropEvent($scope, { - dragged: { - element: this.dragged, - scope: angular.element(this.dragged).scope() - }, - dropped: { - element: element, - scope: angular.element(element).scope() - } - }); - - event.stopImmediatePropagation(); + event.stopPropagation(); + event.preventDefault(); }); } }; diff --git a/front/core/directives/droppable.scss b/front/core/directives/droppable.scss new file mode 100644 index 000000000..749bc9a12 --- /dev/null +++ b/front/core/directives/droppable.scss @@ -0,0 +1,11 @@ +@import "./variables"; + +[vn-droppable] { + border: 2px dashed transparent; + transition: all 0.5s; + + &.active { + background-color: $color-hover-cd; + border: 2px dashed $color-bg-dark; + } +} \ No newline at end of file diff --git a/front/salix/components/app/style.scss b/front/salix/components/app/style.scss index d9638df17..a2082dc8e 100644 --- a/front/salix/components/app/style.scss +++ b/front/salix/components/app/style.scss @@ -5,6 +5,7 @@ body { overflow: auto; } vn-app { + height: inherit; display: block; & > vn-topbar { @@ -50,11 +51,16 @@ vn-app { } } & > .main-view { + box-sizing: border-box; + height: inherit; + &.padding { padding-top: $topbar-height; } .content-block { - margin: $margin-medium; + box-sizing: border-box; + padding: $pad-medium; + height: inherit; form vn-horizontal { align-items: center; @@ -68,6 +74,7 @@ vn-app { display: block; margin: 0 auto; padding-left: $menu-width; + height: 100% } .main-with-right-menu { diff --git a/modules/claim/front/dms/create/index.html b/modules/claim/front/dms/create/index.html deleted file mode 100644 index 0aba5a46a..000000000 --- a/modules/claim/front/dms/create/index.html +++ /dev/null @@ -1,71 +0,0 @@ - - -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
diff --git a/modules/claim/front/dms/create/index.js b/modules/claim/front/dms/create/index.js deleted file mode 100644 index 2560d6c24..000000000 --- a/modules/claim/front/dms/create/index.js +++ /dev/null @@ -1,115 +0,0 @@ -import ngModule from '../../module'; -import './style.scss'; - -class Controller { - constructor($scope, $http, $state, $translate, vnApp) { - this.$ = $scope; - this.$http = $http; - this.$state = $state; - this.$translate = $translate; - this.vnApp = vnApp; - this.dms = { - files: [], - hasFile: false, - hasFileAttached: false - }; - } - - get claim() { - return this._claim; - } - - set claim(value) { - this._claim = value; - - if (value) { - this.setDefaultParams(); - this.getAllowedContentTypes(); - } - } - - getAllowedContentTypes() { - this.$http.get('/api/claimDms/allowedContentTypes').then(res => { - const contentTypes = res.data.join(', '); - this.allowedContentTypes = contentTypes; - }); - } - - get contentTypesInfo() { - return this.$translate.instant('ContentTypesInfo', { - allowedContentTypes: this.allowedContentTypes - }); - } - - setDefaultParams() { - const params = {filter: { - where: {code: 'claim'} - }}; - this.$http.get('/api/DmsTypes/findOne', {params}).then(res => { - const dmsTypeId = res.data && res.data.id; - const companyId = window.localStorage.defaultCompanyFk; - const warehouseId = window.localStorage.defaultWarehouseFk; - const defaultParams = { - reference: this.claim.id, - warehouseId: warehouseId, - companyId: companyId, - dmsTypeId: dmsTypeId, - description: this.$translate.instant('FileDescription', { - claimId: this.claim.id, - clientId: this.claim.client.id, - clientName: this.claim.client.name - }).toUpperCase() - }; - - this.dms = Object.assign(this.dms, defaultParams); - }); - } - - onSubmit() { - const query = `/api/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(res => { - if (res) { - this.vnApp.showSuccess(this.$translate.instant('Data saved!')); - this.$.watcher.updateOriginalData(); - this.$state.go('claim.card.dms.index'); - } - }); - } - - onFileChange(files) { - let hasFileAttached = false; - if (files.length > 0) - hasFileAttached = true; - - this.$.$applyAsync(() => { - this.dms.hasFileAttached = hasFileAttached; - }); - } -} - -Controller.$inject = ['$scope', '$http', '$state', '$translate', 'vnApp']; - -ngModule.component('vnClaimDmsCreate', { - template: require('./index.html'), - controller: Controller, - bindings: { - claim: '<' - } -}); diff --git a/modules/claim/front/dms/create/index.spec.js b/modules/claim/front/dms/create/index.spec.js deleted file mode 100644 index 804120403..000000000 --- a/modules/claim/front/dms/create/index.spec.js +++ /dev/null @@ -1,83 +0,0 @@ -import './index'; - -describe('Claim', () => { - describe('Component vnClaimDmsCreate', () => { - let controller; - let $scope; - let $httpBackend; - let $httpParamSerializer; - - beforeEach(angular.mock.module('claim', $translateProvider => { - $translateProvider.translations('en', {}); - })); - - beforeEach(angular.mock.inject(($componentController, $rootScope, _$httpBackend_, _$httpParamSerializer_) => { - $scope = $rootScope.$new(); - $httpBackend = _$httpBackend_; - $httpParamSerializer = _$httpParamSerializer_; - controller = $componentController('vnClaimDmsCreate', {$scope}); - controller._claim = { - id: 15, - client: {id: 101, name: 'Bruce wayne'}, - ticketFk: 16 - }; - })); - - describe('claim() setter', () => { - it('should set the claim data and then call setDefaultParams() and getAllowedContentTypes()', () => { - spyOn(controller, 'setDefaultParams'); - spyOn(controller, 'getAllowedContentTypes'); - controller._claim = undefined; - controller.claim = { - id: 15, - client: {id: 101, name: 'Bruce wayne'}, - ticketFk: 16 - }; - - expect(controller.claim).toBeDefined(); - expect(controller.setDefaultParams).toHaveBeenCalledWith(); - expect(controller.getAllowedContentTypes).toHaveBeenCalledWith(); - }); - }); - - describe('setDefaultParams()', () => { - it('should perform a GET query and define the dms property on controller', () => { - const params = {filter: { - where: {code: 'claim'} - }}; - let serializedParams = $httpParamSerializer(params); - $httpBackend.when('GET', `/api/DmsTypes/findOne?${serializedParams}`).respond({id: 14, code: 'claim'}); - $httpBackend.expect('GET', `/api/DmsTypes/findOne?${serializedParams}`); - controller.setDefaultParams(); - $httpBackend.flush(); - - expect(controller.dms).toBeDefined(); - expect(controller.dms.reference).toEqual(15); - expect(controller.dms.dmsTypeId).toEqual(14); - }); - }); - - describe('onFileChange()', () => { - it('should set dms hasFileAttached property to true if has any files', () => { - const files = [{id: 1, name: 'MyFile'}]; - controller.onFileChange(files); - $scope.$apply(); - - expect(controller.dms.hasFileAttached).toBeTruthy(); - }); - }); - - describe('getAllowedContentTypes()', () => { - it('should make an HTTP GET request to get the allowed content types', () => { - const expectedResponse = ['image/png', 'image/jpg']; - $httpBackend.when('GET', `/api/claimDms/allowedContentTypes`).respond(expectedResponse); - $httpBackend.expect('GET', `/api/claimDms/allowedContentTypes`); - controller.getAllowedContentTypes(); - $httpBackend.flush(); - - expect(controller.allowedContentTypes).toBeDefined(); - expect(controller.allowedContentTypes).toEqual('image/png, image/jpg'); - }); - }); - }); -}); diff --git a/modules/claim/front/dms/create/style.scss b/modules/claim/front/dms/create/style.scss deleted file mode 100644 index b47544b12..000000000 --- a/modules/claim/front/dms/create/style.scss +++ /dev/null @@ -1,7 +0,0 @@ -vn-ticket-request { - vn-textfield { - margin: 0!important; - max-width: 100px; - } -} - diff --git a/modules/claim/front/dms/edit/index.html b/modules/claim/front/dms/edit/index.html deleted file mode 100644 index 9a74807bc..000000000 --- a/modules/claim/front/dms/edit/index.html +++ /dev/null @@ -1,71 +0,0 @@ - - -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
diff --git a/modules/claim/front/dms/edit/index.js b/modules/claim/front/dms/edit/index.js deleted file mode 100644 index 02b1fd54b..000000000 --- a/modules/claim/front/dms/edit/index.js +++ /dev/null @@ -1,104 +0,0 @@ -import ngModule from '../../module'; -import './style.scss'; - -class Controller { - constructor($scope, $http, $state, $translate, vnApp) { - this.$ = $scope; - this.$http = $http; - this.$state = $state; - this.$stateParams = $state.params; - this.$translate = $translate; - this.vnApp = vnApp; - } - - get claim() { - return this._claim; - } - - set claim(value) { - this._claim = value; - - if (value) { - this.setDefaultParams(); - this.getAllowedContentTypes(); - } - } - - getAllowedContentTypes() { - this.$http.get('/api/claimDms/allowedContentTypes').then(res => { - const contentTypes = res.data.join(', '); - this.allowedContentTypes = contentTypes; - }); - } - - get contentTypesInfo() { - return this.$translate.instant('ContentTypesInfo', { - allowedContentTypes: this.allowedContentTypes - }); - } - - setDefaultParams() { - const path = `/api/Dms/${this.$stateParams.dmsId}`; - this.$http.get(path).then(res => { - const dms = res.data && res.data; - this.dms = { - reference: dms.reference, - warehouseId: dms.warehouseFk, - companyId: dms.companyFk, - dmsTypeId: dms.dmsTypeFk, - description: dms.description, - hasFile: dms.hasFile, - hasFileAttached: false, - files: [] - }; - }); - } - - onSubmit() { - const query = `/api/dms/${this.$stateParams.dmsId}/updateFile`; - 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(res => { - if (res) { - this.vnApp.showSuccess(this.$translate.instant('Data saved!')); - this.$.watcher.updateOriginalData(); - this.$state.go('claim.card.dms.index'); - } - }); - } - - onFileChange(files) { - let hasFileAttached = false; - if (files.length > 0) - hasFileAttached = true; - - this.$.$applyAsync(() => { - this.dms.hasFileAttached = hasFileAttached; - }); - } -} - -Controller.$inject = ['$scope', '$http', '$state', '$translate', 'vnApp']; - -ngModule.component('vnClaimDmsEdit', { - template: require('./index.html'), - controller: Controller, - bindings: { - claim: '<' - } -}); diff --git a/modules/claim/front/dms/edit/index.spec.js b/modules/claim/front/dms/edit/index.spec.js deleted file mode 100644 index 068807658..000000000 --- a/modules/claim/front/dms/edit/index.spec.js +++ /dev/null @@ -1,86 +0,0 @@ -import './index'; - -describe('Claim', () => { - describe('Component vnClaimDmsEdit', () => { - let controller; - let $scope; - let $httpBackend; - let $state; - - beforeEach(angular.mock.module('claim', $translateProvider => { - $translateProvider.translations('en', {}); - })); - - beforeEach(angular.mock.inject(($componentController, $rootScope, _$httpBackend_) => { - $scope = $rootScope.$new(); - $httpBackend = _$httpBackend_; - $state = {params: {dmsId: 1}}; - controller = $componentController('vnClaimDmsEdit', {$scope, $state}); - controller._claim = {id: 1, ticketFk: 16}; - })); - - describe('claim() setter', () => { - it('should set the claim data and then call setDefaultParams() and getAllowedContentTypes()', () => { - spyOn(controller, 'setDefaultParams'); - spyOn(controller, 'getAllowedContentTypes'); - controller._claim = undefined; - controller.claim = { - id: 15, - ticketFk: 16 - }; - - expect(controller.setDefaultParams).toHaveBeenCalledWith(); - expect(controller.claim).toBeDefined(); - expect(controller.getAllowedContentTypes).toHaveBeenCalledWith(); - }); - }); - - describe('setDefaultParams()', () => { - it('should perform a GET query and define the dms property on controller', () => { - const dmsId = 1; - const expectedResponse = { - reference: 101, - warehouseFk: 1, - companyFk: 442, - dmsTypeFk: 20, - description: 'Test', - hasFile: false, - hasFileAttached: false - }; - - $httpBackend.when('GET', `/api/Dms/${dmsId}`).respond(expectedResponse); - $httpBackend.expect('GET', `/api/Dms/${dmsId}`).respond(expectedResponse); - controller.setDefaultParams(); - $httpBackend.flush(); - - expect(controller.dms).toBeDefined(); - expect(controller.dms.reference).toEqual(101); - expect(controller.dms.dmsTypeId).toEqual(20); - }); - }); - - describe('onFileChange()', () => { - it('should set dms hasFileAttached property to true if has any files', () => { - const files = [{id: 1, name: 'MyFile'}]; - controller.dms = {hasFileAttached: false}; - controller.onFileChange(files); - $scope.$apply(); - - expect(controller.dms.hasFileAttached).toBeTruthy(); - }); - }); - - describe('getAllowedContentTypes()', () => { - it('should make an HTTP GET request to get the allowed content types', () => { - const expectedResponse = ['image/png', 'image/jpg']; - $httpBackend.when('GET', `/api/claimDms/allowedContentTypes`).respond(expectedResponse); - $httpBackend.expect('GET', `/api/claimDms/allowedContentTypes`); - controller.getAllowedContentTypes(); - $httpBackend.flush(); - - expect(controller.allowedContentTypes).toBeDefined(); - expect(controller.allowedContentTypes).toEqual('image/png, image/jpg'); - }); - }); - }); -}); diff --git a/modules/claim/front/dms/edit/style.scss b/modules/claim/front/dms/edit/style.scss deleted file mode 100644 index b47544b12..000000000 --- a/modules/claim/front/dms/edit/style.scss +++ /dev/null @@ -1,7 +0,0 @@ -vn-ticket-request { - vn-textfield { - margin: 0!important; - max-width: 100px; - } -} - diff --git a/modules/claim/front/dms/index/index.html b/modules/claim/front/dms/index/index.html index 86d9d3a36..91dad4e1e 100644 --- a/modules/claim/front/dms/index/index.html +++ b/modules/claim/front/dms/index/index.html @@ -1,113 +1,33 @@ - + data="$ctrl.photos"> - - - - - - - Id - Type - Order - Reference - Description - Original - File - Employee - Created - - - - - - - - {{::document.dmsFk}} - - - {{::document.dms.dmsType.name}} - - - - - {{::document.dms.hardCopyNumber}} - - - - - {{::document.dms.reference}} - - - - - {{::document.dms.description}} - - - - - - - - - {{::document.dms.file}} - - - - - {{::document.dms.worker.user.nickname | dashIfEmpty}} - - - {{::document.dms.created | dateTime:'dd/MM/yyyy HH:mm'}} - - - - - - - - - - - - - - - - - - - - - - + +
+
+ +
+
+ +
+
+ + Drag & Drop files here... + + + - - - { this.$.model.remove(this.dmsIndex); - this.vnApp.showSuccess(this.$translate.instant('Data saved!')); + this.vnApp.showSuccess(this.$translate.instant('Photo deleted')); }); } } + + onDrop(event) { + const files = event.dataTransfer.files; + this.setDefaultParams().then(() => { + this.dms.files = files; + this.create(); + }); + } + + setDefaultParams() { + const params = {filter: { + where: {code: 'claim'} + }}; + return this.$http.get('/api/DmsTypes/findOne', {params}).then(res => { + const dmsTypeId = res.data && res.data.id; + const companyId = window.localStorage.defaultCompanyFk; + const warehouseId = window.localStorage.defaultWarehouseFk; + this.dms = { + hasFile: false, + hasFileAttached: false, + reference: this.claim.id, + warehouseId: warehouseId, + companyId: companyId, + dmsTypeId: dmsTypeId, + description: this.$translate.instant('FileDescription', { + claimId: this.claim.id, + clientId: this.claim.client.id, + clientName: this.claim.client.name + }).toUpperCase() + }; + }); + } + + + create() { + const query = `/api/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.$translate.instant('Photo uploaded!')); + this.$.model.refresh(); + }); + } } Controller.$inject = ['$stateParams', '$scope', '$http', '$translate', 'vnToken', 'vnApp']; @@ -76,4 +97,7 @@ Controller.$inject = ['$stateParams', '$scope', '$http', '$translate', 'vnToken' ngModule.component('vnClaimDmsIndex', { template: require('./index.html'), controller: Controller, + bindings: { + claim: '<' + } }); diff --git a/modules/claim/front/dms/index/index.spec.js b/modules/claim/front/dms/index/index.spec.js index 69a394232..cdc184f81 100644 --- a/modules/claim/front/dms/index/index.spec.js +++ b/modules/claim/front/dms/index/index.spec.js @@ -7,17 +7,23 @@ describe('Claim', () => { let $scope; let $httpBackend; let controller; + let $httpParamSerializer; beforeEach(angular.mock.module('claim', $translateProvider => { $translateProvider.translations('en', {}); })); - beforeEach(angular.mock.inject((_$componentController_, $rootScope, _$httpBackend_) => { + beforeEach(angular.mock.inject((_$componentController_, $rootScope, _$httpBackend_, _$httpParamSerializer_) => { $componentController = _$componentController_; + $httpParamSerializer = _$httpParamSerializer_; $httpBackend = _$httpBackend_; $scope = $rootScope.$new(); controller = $componentController('vnClaimDmsIndex', {$: $scope}); controller.$.model = crudModel; + controller.claim = { + id: 1, + client: {id: 101, name: 'Bruce Wayne'} + }; })); describe('deleteDms()', () => { @@ -26,7 +32,7 @@ describe('Claim', () => { const dmsIndex = 0; spyOn(controller.vnApp, 'showSuccess'); spyOn(controller.$.model, 'remove'); - controller.claimDms = [{dmsFk: 1}]; + controller.photos = [{dmsFk: 1}]; controller.dmsIndex = dmsIndex; $httpBackend.when('POST', `/api/claimDms/${dmsId}/removeFile`).respond({}); @@ -35,7 +41,42 @@ describe('Claim', () => { $httpBackend.flush(); expect(controller.$.model.remove).toHaveBeenCalledWith(dmsIndex); - expect(controller.vnApp.showSuccess).toHaveBeenCalledWith('Data saved!'); + expect(controller.vnApp.showSuccess).toHaveBeenCalledWith('Photo deleted!'); + }); + }); + + describe('setDefaultParams()', () => { + it('should make an HTTP GET query, then set all dms properties', () => { + const params = {filter: { + where: {code: 'claim'} + }}; + let serializedParams = $httpParamSerializer(params); + $httpBackend.when('GET', `/api/DmsTypes/findOne?${serializedParams}`).respond({}); + $httpBackend.expect('GET', `/api/DmsTypes/findOne?${serializedParams}`); + controller.setDefaultParams(); + $httpBackend.flush(); + + expect(controller.dms).toBeDefined(); + }); + }); + + describe('create()', () => { + it('should make an HTTP Post query, then refresh the model data', () => { + const claimId = 1; + const dmsIndex = 0; + spyOn(controller.vnApp, 'showSuccess'); + spyOn(controller.$.model, 'refresh'); + controller.photos = [{dmsFk: 1}]; + controller.dmsIndex = dmsIndex; + controller.dms = {files: []}; + + $httpBackend.when('POST', `/api/claims/${claimId}/uploadFile`).respond({}); + $httpBackend.expect('POST', `/api/claims/${claimId}/uploadFile`); + controller.create(); + $httpBackend.flush(); + + expect(controller.$.model.refresh).toHaveBeenCalledWith(); + expect(controller.vnApp.showSuccess).toHaveBeenCalledWith('Photo uploaded!'); }); }); }); diff --git a/modules/claim/front/dms/index/style.scss b/modules/claim/front/dms/index/style.scss index a6758e2e6..067a7c95c 100644 --- a/modules/claim/front/dms/index/style.scss +++ b/modules/claim/front/dms/index/style.scss @@ -1,6 +1,20 @@ -vn-client-risk-index { - .totalBox { - display: table; - float: right; +@import "./variables"; + +vn-claim-dms-index { + .photo-list { + border: 2px dashed $color-font-secondary; + box-sizing: border-box; + border-radius: 0.5em; + padding: $pad-medium; + min-height: 100%; + + .photo { + width: 32em; + } + } + + vn-empty-rows { + color: $color-font-secondary; + font-size: 2em } } \ No newline at end of file diff --git a/modules/claim/front/dms/locale/es.yml b/modules/claim/front/dms/locale/es.yml index 8a8674c5a..3e5edad07 100644 --- a/modules/claim/front/dms/locale/es.yml +++ b/modules/claim/front/dms/locale/es.yml @@ -1,8 +1,4 @@ -Upload file: Subir fichero -Edit file: Editar fichero -Upload: Subir -File: Fichero -FileDescription: Reclamación id {{claimId}} del cliente "{{clientName}}" id {{clientId}} -Generate identifier for original file: Generar identificador para archivo original -ContentTypesInfo: "Tipos de archivo permitidos: {{allowedContentTypes}}" -Are you sure you want to continue?: ¿Seguro que quieres continuar? \ No newline at end of file +Are you sure you want to continue?: ¿Seguro que quieres continuar? +Drag & Drop files here...: Arrasta y suelta archivos aquí... +Photo deleted: Foto eliminada +Photo uploaded!: Foto subida! \ No newline at end of file diff --git a/modules/claim/front/routes.json b/modules/claim/front/routes.json index 892e21635..bda7da74b 100644 --- a/modules/claim/front/routes.json +++ b/modules/claim/front/routes.json @@ -7,9 +7,9 @@ "menu": [ {"state": "claim.card.basicData", "icon": "settings"}, {"state": "claim.card.detail", "icon": "icon-details"}, + {"state": "claim.card.dms.index", "icon": "image"}, {"state": "claim.card.development", "icon": "icon-traceability"}, - {"state": "claim.card.action", "icon": "icon-actions"}, - {"state": "claim.card.dms.index", "icon": "image"} + {"state": "claim.card.action", "icon": "icon-actions"} ], "keybindings": [ {"key": "r", "state": "claim.index"} @@ -88,22 +88,6 @@ "params": { "claim": "$ctrl.claim" } - }, { - "url" : "/create", - "state": "claim.card.dms.create", - "component": "vn-claim-dms-create", - "description": "Upload file", - "params": { - "claim": "$ctrl.claim" - } - }, { - "url": "/:dmsId/edit", - "state": "claim.card.dms.edit", - "component": "vn-claim-dms-edit", - "description": "Edit file", - "params": { - "claim": "$ctrl.claim" - } } ] } \ No newline at end of file diff --git a/modules/claim/front/summary/style.scss b/modules/claim/front/summary/style.scss index 778d91d0e..280e519c2 100644 --- a/modules/claim/front/summary/style.scss +++ b/modules/claim/front/summary/style.scss @@ -1,22 +1,36 @@ @import "./variables"; .photo-list { + justify-content: center; align-items: flex-start; + align-content: flex-start; flex-wrap: wrap; - + .photo { box-sizing: border-box; padding: $pad-small; - width: 33%; + position: relative; + opacity: 0.7; + transition: all 0.5s; + width: 28em; .image { - border: 2px solid $color-main; - border-radius: 0.5em; + border: 2px solid $color-bg-dark; + border-radius: 0.2em; overflow: hidden; - img { + img, video { max-width: 100% } - } + } + .actions { + position: absolute; + right: 1em; + top: 1em + } + } + + .photo:hover { + opacity: 1 } } \ No newline at end of file