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
gitea/salix/pipeline/head This commit looks good
Details
Reviewed-on: #1448 Reviewed-by: Alex Moreno <alexm@verdnatura.es>
This commit is contained in:
commit
740e03f0ee
|
@ -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`)
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
|
@ -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
|
|
@ -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
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue