verdnatura/salix
verdnatura
/
salix
3
4
Fork 0
Code Issues Pull Requests 58 Releases Wiki Activity

Merge branch '1986-claim_draggable_pictures' of verdnatura/salix into dev
gitea/salix/dev Build queued... Details

This commit is contained in:
Carlos Jimenez Ruiz 2020-01-09 08:00:35 +00:00 committed by Gitea
parent a82de9f7b6 e637f32aaa
commit ff7c6bea6a
10 changed files with 61 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
front/core/directives/droppable.scss
View File

@ -11,11 +11,9 @@
.vn-droppable,
[vn-droppable] {
display: block;
&.dropping {
background-color: $color-hover-cd;
border-color: $color-bg-dark;
border-color: $color-font-secondary;
}
}

2
front/salix/components/app/style.scss
View File

@ -7,7 +7,7 @@ vn-app {
ui-view {
display: block;
box-sizing: border-box;
height: inherit;
height: 100%;
&.ng-enter {
animation-name: nothing, slideIn;

2
front/salix/components/layout/style.scss
View File

@ -87,6 +87,8 @@ vn-layout {
& > * {
display: block;
padding: $spacing-md;
box-sizing: border-box;
height: 100%
}
&.ng-enter {
vn-side-menu {

6
front/salix/styles/photo-list.scss
View File

@ -11,7 +11,6 @@
transition: all 0.5s;
padding: $spacing-sm;
position: relative;
opacity: 0.7;
width: 28em;
.image {
@ -20,6 +19,7 @@
0 1px 5px 0 rgba(0,0,0,.12);
background: no-repeat center center fixed;
background-size: cover !important;
border: 2px solid transparent;
overflow: hidden;
cursor: zoom-in;
height: 100%;
@ -34,7 +34,7 @@
top: 1em
}
}
.photo:hover {
opacity: 1
.photo:hover .image {
border: 2px solid $color-primary
}
}

53
modules/claim/front/dms/index/index.html
View File

@ -5,31 +5,28 @@
data="$ctrl.photos">
</vn-crud-model>
<section class="drop-zone" vn-droppable="$ctrl.onDrop($event)">
<section><vn-icon icon="add_circle"></vn-icon></section>
<section translate>Drag & Drop files here...</section>
</section>
<vn-data-viewer
model="model"
class="vn-w-xl">
<vn-horizontal class="photo-list">
<section class="photo" ng-repeat="photo in $ctrl.photos">
<section class="image vn-shadow" on-error-src
ng-style="{'background': 'url(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.accessToken + ')'}"
zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.accessToken}}">
</section>
<section class="actions">
<vn-button
class="round"
ng-click="$ctrl.showDeleteConfirm($index)"
title="{{'Remove file' | translate}}"
tabindex="-1"
icon="delete">
</vn-button>
</section>
<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(/api/dms/' + photo.dmsFk + '/downloadFile?access_token=' + $ctrl.accessToken + ')'}"
zoom-image="/api/dms/{{::photo.dmsFk}}/downloadFile?access_token={{::$ctrl.accessToken}}">
</section>
</vn-horizontal>
</vn-data-viewer>
<section class="actions">
<vn-button
class="round"
ng-click="$ctrl.showDeleteConfirm($index)"
title="{{'Remove file' | translate}}"
tabindex="-1"
icon="delete">
</vn-button>
</section>
</section>
</vn-horizontal>
<vn-worker-descriptor-popover
vn-id="workerDescriptor">
</vn-worker-descriptor-popover>
@ -38,4 +35,10 @@
message="This file will be deleted"
question="Are you sure you want to continue?"
on-response="$ctrl.deleteDms($response)">
</vn-confirm>
</vn-confirm>
<vn-float-button fixed-bottom-right
icon="add"
vn-tooltip="Select photo"
vn-bind="+"
ng-click="$ctrl.openUploadDialog()">
</vn-float-button>

13
modules/claim/front/dms/index/index.js
View File

@ -68,6 +68,19 @@ class Controller {
});
}
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`;

9
modules/claim/front/dms/index/style.scss
View File

@ -2,13 +2,16 @@
vn-claim-dms-index {
.drop-zone {
border: 2px dashed $color-font-secondary;
color: $color-font-secondary;
box-sizing: border-box;
padding: 2em $spacing-md;
border-radius: 0.5em;
text-align: center;
font-size: 1.4em;
min-height: 100%;
.empty-rows {
padding: 5em $spacing-md;
font-size: 1.4em
}
vn-icon {
font-size: 3em

2
modules/claim/front/dms/locale/en.yml
View File

@ -1,2 +0,0 @@
FileDescription: Ticket id {{ticketId}} from client {{clientName}} id {{clientId}}
ContentTypesInfo: Allowed file types {{allowedContentTypes}}

5
modules/claim/front/dms/locale/es.yml
View File

@ -1,4 +1,5 @@
Are you sure you want to continue?: ¿Seguro que quieres continuar?
Drag & Drop files here...: Arrastra y suelta archivos aquí...
Drag & Drop photos here...: Arrastra y suelta fotos aquí...
Photo deleted: Foto eliminada
Photo uploaded!: Foto subida!
Photo uploaded!: Foto subida!
Select photo: Seleccionar foto

10
modules/claim/front/summary/style.scss
View File

@ -1,12 +1,10 @@
@import "./variables";
vn-claim-summary {
.photo {
height: 15.5em;
section.photo {
height: 15.5em
}
.photo .image {
border: 2px solid $color-bg-dark;
border-radius: 0.2em;
.photo .image {
border-radius: 0.2em
}
}