Merge pull request 'fixes #5293 Añadir secciones en claim' (!1448) from 5293-claim-sections into dev
gitea/salix/pipeline/head This commit looks good Details

Reviewed-on: #1448
Reviewed-by: Alex Moreno <alexm@verdnatura.es>
This commit is contained in:
Alexandre Riera 2023-04-26 06:10:02 +00:00
commit 740e03f0ee
6 changed files with 6 additions and 263 deletions

View File

@ -2789,7 +2789,7 @@ INSERT INTO `vn`.`profileType` (`id`, `name`)
INSERT INTO `salix`.`url` (`appName`, `environment`, `url`)
VALUES
('lilium', 'dev', 'http://localhost:8080/#/'),
('lilium', 'dev', 'http://localhost:9000/#/'),
('salix', 'dev', 'http://localhost:5000/#!/');
INSERT INTO `vn`.`report` (`id`, `name`, `paperSizeFk`, `method`)

View File

@ -1,48 +1 @@
<vn-crud-model
vn-id="model"
auto-load="true"
filter="::$ctrl.filter"
url="ClaimDms"
link="{claimFk: $ctrl.$params.id}"
limit="20"
data="$ctrl.photos">
</vn-crud-model>
<vn-horizontal class="photo-list drop-zone" vn-droppable="$ctrl.onDrop($event)">
<section class="empty-rows" ng-if="!$ctrl.photos.length">
<section><vn-icon icon="image"></vn-icon></section>
<section translate>Drag & Drop photos here...</section>
</section>
<section class="photo" ng-repeat="photo in $ctrl.photos">
<section class="image vn-shadow" on-error-src
ng-style="{'background': 'url(' + $ctrl.getImagePath(photo.dmsFk) + ')'}"
zoom-image="{{$ctrl.getImagePath(photo.dmsFk)}}"
ng-if="photo.dms.contentType != 'video/mp4'">
</section>
<video id="videobcg" muted="muted" controls ng-if="photo.dms.contentType == 'video/mp4'"
class="video">
<source src="{{$ctrl.getImagePath(photo.dmsFk)}}" type="video/mp4">
</video>
<section class="actions">
<vn-button
class="round"
ng-click="confirm.show($index)"
title="{{'Remove file' | translate}}"
tabindex="-1"
icon="delete">
</vn-button>
</section>
</section>
</vn-horizontal>
<vn-confirm
vn-id="confirm"
message="This file will be deleted"
question="Are you sure you want to continue?"
on-accept="$ctrl.deleteDms($data)">
</vn-confirm>
<vn-float-button
icon="add"
vn-tooltip="Select file"
vn-bind="+"
ng-click="$ctrl.openUploadDialog()"
fixed-bottom-right>
</vn-float-button>

View File

@ -1,105 +1,17 @@
import ngModule from '../module';
import Section from 'salix/components/section';
import './style.scss';
class Controller extends Section {
constructor($element, $, vnFile) {
constructor($element, $) {
super($element, $);
this.vnFile = vnFile;
this.filter = {
include: [
{
relation: 'dms'
}
]
};
}
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('File 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('File uploaded!'));
this.$.model.refresh();
});
}
getImagePath(dmsId) {
return this.vnFile.getPath(`/api/Claims/${dmsId}/downloadFile`);
async $onInit() {
const url = await this.vnApp.getUrl(`claim/${this.$params.id}/photos`);
window.location.href = url;
}
}
Controller.$inject = ['$element', '$scope', 'vnFile'];
ngModule.vnComponent('vnClaimPhotos', {
template: require('./index.html'),
controller: Controller,

View File

@ -1,70 +0,0 @@
import './index';
import crudModel from 'core/mocks/crud-model';
describe('Claim', () => {
describe('Component vnClaimPhotos', () => {
let $scope;
let $httpBackend;
let controller;
beforeEach(ngModule('claim'));
beforeEach(inject(($componentController, $rootScope, _$httpBackend_) => {
$httpBackend = _$httpBackend_;
$scope = $rootScope.$new();
controller = $componentController('vnClaimPhotos', {$element: null, $scope});
controller.$.model = crudModel;
controller.claim = {
id: 1,
client: {id: 1101, name: 'Bruce Wayne'}
};
}));
describe('deleteDms()', () => {
it('should make an HTTP Post query', () => {
jest.spyOn(controller.vnApp, 'showSuccess');
jest.spyOn(controller.$.model, 'remove');
const dmsId = 1;
const dmsIndex = 0;
controller.photos = [{dmsFk: 1}];
$httpBackend.expectPOST(`ClaimDms/${dmsId}/removeFile`).respond();
controller.deleteDms(dmsIndex);
$httpBackend.flush();
expect(controller.$.model.remove).toHaveBeenCalledWith(dmsIndex);
expect(controller.vnApp.showSuccess).toHaveBeenCalled();
});
});
describe('setDefaultParams()', () => {
it('should make an HTTP GET query, then set all dms properties', () => {
$httpBackend.expectRoute('GET', `DmsTypes/findOne`).respond({});
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;
jest.spyOn(controller.vnApp, 'showSuccess');
jest.spyOn(controller.$.model, 'refresh');
controller.photos = [{dmsFk: 1}];
controller.dmsIndex = dmsIndex;
controller.dms = {files: []};
$httpBackend.expectPOST(`claims/${claimId}/uploadFile`).respond({});
controller.create();
$httpBackend.flush();
expect(controller.$.model.refresh).toHaveBeenCalled();
expect(controller.vnApp.showSuccess).toHaveBeenCalled();
});
});
});
});

View File

@ -1,5 +0,0 @@
Are you sure you want to continue?: ¿Seguro que quieres continuar?
Drag & Drop photos here...: Arrastra y suelta fotos aquí...
File deleted: Archivo eliminado
File uploaded!: Archivo subido!
Select file: Seleccionar fichero

View File

@ -1,47 +0,0 @@
@import "./variables";
vn-claim-photos {
height: 100%;
.drop-zone {
color: $color-font-secondary;
box-sizing: border-box;
border-radius: 8px;
text-align: center;
min-height: 100%;
.empty-rows {
padding: 80px $spacing-md;
font-size: 1.375rem
}
vn-icon {
font-size: 3rem
}
}
.photo-list {
padding: $spacing-md;
min-height: 100%;
.photo {
width: 512px;
height: 288px;
}
}
.video {
width: 100%;
height: 100%;
object-fit: cover;
cursor: pointer;
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),
0 3px 1px -2px rgba(0,0,0,.2),
0 1px 5px 0 rgba(0,0,0,.12);
border: 2px solid transparent;
}
.video:hover {
border: 2px solid $color-primary
}
}