From 57183af8226d35dd759fb9f50c24f41681fc8b9b Mon Sep 17 00:00:00 2001 From: "florian.azizian" <florian.azizian@maarch.org> Date: Fri, 14 Feb 2020 09:40:11 +0100 Subject: [PATCH] FEAT #12982 TIME 0:45 tabs for signature book --- .../app/signature-book.component.html | 42 +- .../app/signature-book.component.scss | 927 ++++++++++++++++++ src/frontend/app/signature-book.component.ts | 136 +-- 3 files changed, 1026 insertions(+), 79 deletions(-) create mode 100755 src/frontend/app/signature-book.component.scss diff --git a/src/frontend/app/signature-book.component.html b/src/frontend/app/signature-book.component.html index 454ac72e012..12bfc5e9c9d 100755 --- a/src/frontend/app/signature-book.component.html +++ b/src/frontend/app/signature-book.component.html @@ -4,23 +4,12 @@ <div *ngIf="!loading" class='visaContent'> <div class="titleSignatureBook"> <div id="tabSignatureBook"> - <div *ngIf="signatureBook.documents[0] && signatureBook.documents[0].category_id != 'outgoing'" title="{{lang.mail}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 1}" (click)="changeSignatureBookLeftContent(1)"> + <div *ngIf="signatureBook.documents[0] && signatureBook.documents[0].category_id != 'outgoing'" title="{{lang.mail}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 'document'}" (click)="changeSignatureBookLeftContent(1)"> <i class="fa fa-file-alt fa-2x"></i> </div> - <div title="{{lang.notes}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 2}" (click)="changeSignatureBookLeftContent(2)"> - <i class="fa fa-pencil-alt fa-2x"> - <sup *ngIf="signatureBook.nbNotes > 0" class="nbRes" style="font-size: 12px;font-weight: bold;">{{signatureBook.nbNotes}}</sup> - </i> - </div> - <div title="{{lang.visaWorkflow}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 3}" (click)="changeSignatureBookLeftContent(3)"> - <i class="fa fa-list-ol fa-2x"></i> - </div> - <div title="{{lang.progression}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 4}" (click)="changeSignatureBookLeftContent(4)"> - <i class="fa fa-history fa-2x"></i> - </div> - <div title="{{lang.links}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == 5}" (click)="changeSignatureBookLeftContent(5)"> - <i class="fa fa-link fa-2x"> - <sup *ngIf="signatureBook.nbLinks > 0" class="nbRes" style="font-size: 12px;font-weight: bold;">{{signatureBook.nbLinks}}</sup> + <div *ngFor="let module of processTool" title="{{module.label}}" class="item" [ngClass]="{'activeTabSignatureBook': headerTab == module.id}" (click)="changeSignatureBookLeftContent(module.id)"> + <i [class]="module.icon"> + <sup *ngIf="module.count > 0" class="nbRes" style="font-size: 12px;font-weight: bold;">{{module.count}}</sup> </i> </div> </div> @@ -72,7 +61,7 @@ <i class="fa fa-chevron-left" aria-hidden="true" *ngIf="showResLeftPanel"></i> <i class="fa fa-chevron-right" aria-hidden="true" *ngIf="!showResLeftPanel"></i> </div> - <div *ngIf="headerTab == 1" class="contentShow"> + <div *ngIf="headerTab == 'document'" class="contentShow"> <div *ngIf="showTopLeftPanel" class="pjDoc"> <div style="height:100%;"> <img title="{{document.title}}" id="thumnails_img" *ngFor="let document of signatureBook.documents; let i = index" (click)="changeLeftViewer(i)" [src]="coreUrl + document.thumbnailLink" @@ -98,17 +87,22 @@ </div> </div> </div> - <div *ngIf="headerTab == 2" class="contentShow" style="width:98%;"> - <iframe [src]="notesViewerLink | safeUrl"></iframe> + <div *ngIf="headerTab == 'notes'" class="contentShow" style="width:98%;"> + <app-notes-list #appNotesList [editMode]="true" + [resId]="resId" (reloadBadgeNotes)="refreshBadge($event,'notes')"> + </app-notes-list> </div> - <div *ngIf="headerTab == 3" class="contentShow" style="width:98%;overflow-x: hidden;"> - <iframe [src]="visaViewerLink | safeUrl"></iframe> + <div *ngIf="headerTab == 'visaCircuit'" class="contentShow" style="width:98%;overflow-x: hidden;"> + <app-visa-workflow #appVisaWorkflow [resId]="resId" + [adminMode]="privilegeService.hasCurrentUserPrivilege('config_visa_workflow')"></app-visa-workflow> </div> - <div *ngIf="headerTab == 4" class="contentShow" style="width:98%;"> - <iframe [src]="histViewerLink | safeUrl"></iframe> + <div *ngIf="headerTab == 'history'" class="contentShow" style="width:98%;"> + <app-history-list #appHistoryList [resId]="resId"></app-history-list> </div> - <div *ngIf="headerTab == 5" class="contentShow" style="width:98%;"> - <iframe [src]="linksViewerLink | safeUrl"></iframe> + <div *ngIf="headerTab == 'linkedResources'" class="contentShow" style="width:98%;"> + <app-linked-resource-list #appLinkedResourceList [resId]="resId" + (reloadBadgeLinkedResources)="refreshBadge($event,'linkedResources')"> + </app-linked-resource-list> </div> <div class="hideRightContent" (click)="displayPanel('MIDDLE')" [ngStyle]="{'right': showRightPanel ? '-10px' : '0px'}"> <i class="fa fa-chevron-right" aria-hidden="true" *ngIf="showRightPanel"></i> diff --git a/src/frontend/app/signature-book.component.scss b/src/frontend/app/signature-book.component.scss new file mode 100755 index 00000000000..cae6f2ea179 --- /dev/null +++ b/src/frontend/app/signature-book.component.scss @@ -0,0 +1,927 @@ +#modalSaveVisaModel{ + padding-top:20px; + z-index: 1050; + width: 300px; + height: 80px; + border: 2px solid #000; + display: none; + position: absolute; + background-color: #F2F2F2; + left: 40%; + top: 10%; + text-align: center; +} + +.unselectedId{ + background-color:#F2F2F2; +} + +.selectedId{ + background-color:#F99830; +} + +#tab_visaSetWorkflow td{ + white-space: pre; +} + +[draggable=true]{ + cursor: move; +} +[draggable=true]:hover{ + box-shadow:0 0 5px green; /* CSS3 */ +} +[draggable=false]:hover{ + cursor: not-allowed; +} +#visa_content{ + display: block; + width: 100%; +} +.droptarget{ + position: relative; + background-color: #135F7F33; + display: table; + margin: 10px; + padding: 5px; + text-align: left; + width: 95%; + cursor: default; + border: dashed 2px #135F7F33 +} + +.droptarget_arrow { + border: none; + display:table-cell; +} + +.vised{ + opacity: 1; + color: green; + border: solid 2px green; +} + +.moved{ + opacity: 0.5 !important; + color : #666 !important; + border: solid 2px white !important; + text-decoration: line-through !important; +} + +.droptarget input{ + width : 100%; +} + +#visaUserList{ + width:45%; + float:left; +} + +.droptarget.currentVis{ + color : #135F7F; + border: solid 2px #135F7F; +} + +.visaUserInfo,.visaUserStatus,.visaUserConsigne,.visaUserAction{ + display: table-cell; + vertical-align: middle; +} + +.visaUserStatus{ + width: 5%; +} +.vised .visaUserStatus{ + opacity: 1; +} +.visaUserInfo{ + width: 55%; + font-weight: bold; +} + +.visaUserInfo .nbRes{ + background-color: grey; + font-weight: normal; +} + +.visaUserInfo sub{ + font-weight: normal; +} + +.droptarget:hover.vised #dropZone{ + visibility: hidden; +} +.droptarget:hover #dropZone{ + visibility: visible; +} + +.dropArea{ + border: dashed 3px white; + width: 60%; + margin:auto; + opacity: 0.5; + padding: 5px; + +} + +.dropArea::after{ + font-weight: bolder; +} + +#dropZone,#dropZone:active{ + width: 40px; + text-align: right; + opacity: 0.5; + visibility: hidden; + float: right; + margin: 5px; +} +#dropZone:hover{ + cursor: grab; +} +#dropZone:active{ + cursor: grabbing; +} +.visaUserConsigne{ + width: 30%; +} +.visaUserAction{ + color : red; + text-align: center; + width: 5%; +} +.visaUserAction i{ + cursor: pointer; +} + +/* Signature Book CSS */ + +.visaContent{ + position: relative; + height:95vh; + margin-top: 5px; +} + +.visaContent h1{ + display: block !important; + position: initial !important; + padding: 10px; + text-align: center !important; +} + +.titleSignatureBook .others{ + float:right; + width:14%; + padding: 5px; + vertical-align: middle; + text-align: right; +} + +.titleSignatureBook .others input{ + width: 95%; + background: #E6E6E6; + border-radius: 2px; + border: none; + padding: 5px; +} + +.resListContent{ + width:8%; + height:100%; + text-align: center; + border-right: solid 1px; + vertical-align: top; + overflow: auto; + font-size: 10px; +} + +.resListContentInfo{ + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + width: 95%; + text-align: left; + padding:5px; + cursor:pointer; + margin-top: 0px; +} + +.resListContentInfo i{ + width:5%; + text-align: center; +} + +.resListContentFrame:hover{ + background-color: #F99830; +} + +.resListContentFrame{ + border-bottom : solid 1px black; + position:relative; + overflow: hidden; + background-color: white; +} + +.resListContentPos{ + overflow-x: hidden; + overflow-y: auto; +} + +.hideLeftContent{ + position: absolute; + margin-left: -13px; + color: #666; + top: 45%; + padding: 5px; + cursor: pointer; + background: #F2F2F2; + border-radius:40px; +} +.hideRightContent{ + position: absolute; + right: -10px; + color: #666; + top: 45%; + padding: 5px; + cursor: pointer; + background: #F2F2F2; + border-radius:40px; +} + +.hideresListContent{ + position: absolute; + left: -4px; + color: #666; + top: 45%; + padding: 5px; + cursor: pointer; + background: #F2F2F2; + border-radius:40px; +} + +.contentLeft{ + position: relative; + border-right: solid 1px; + vertical-align: top; + padding-left: 10px; + /*width:39%;*/ +} + +.contentRight{ + /*width:39%;*/ +} + +.contentLeft, .contentRight{ + display: inline-block; + height:100%; + text-align: center; + vertical-align: top; +} + +.visaContent iframe{ + margin: auto; + width: 100%; + height: 75vh; + border: none; +} + +.contentLeft iframe{ + height: 99%; +} + +.panelRight{ + width: 50px; + border-left: solid 1px; + text-align: center; + position: absolute; + right: -1px; + background-color: white; +} + +.panelRightContent{ + width: 100%; + height: 69%; + overflow: auto; +} + +.panelRight .item{ + padding:10px; + padding-left: 5px; + cursor: pointer; + padding-top: 20px; + padding-bottom: 20px; +} + +.panelRight,.contentRight .contentShow{ + display: inline-block; + height: 91vh; +} +.contentLeft .contentShow{ + height: 95vh; + overflow: auto; + width:98%; +} + +.contentRight .contentShow,.contentLeft .contentShow{ + padding : 5px; + height: 100%; +} + +.contentRight .contentShow{ + position: relative; + vertical-align: top; + width:98%; +} +.pjDetails,.pjDoc{ + margin-bottom: 5px; +} + +.pjDetails,.pjSign,.pjCreate{ + background-color:white; + display: block; + width: 97%; + text-align: left; + -moz-box-shadow: inset 0px 0px 5px 0px #656565; + -webkit-box-shadow: inset 0px 0px 5px 0px #656565; + -o-box-shadow: inset 0px 0px 5px 0px #656565; + box-shadow: inset 0px 0px 5px 0px #656565; + filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=5); + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; + padding:10px; + height:100px; +} + +.pjSign,.pjCreate{ + cursor: pointer; +} + +.pjDetails label{ + font-weight: bold; + cursor: inherit; +} + +.pjDetailsMore{ + z-index: 1; + position: absolute; + left: 15px; + margin-top: 2px; + text-align: center; + cursor: pointer; + background: #135F7F; + color: white; + padding:10px; + /*border-radius: 25px;*/ + -moz-box-shadow: 0px 0px 10px 0px #656565; + -webkit-box-shadow: 0px 0px 10px 0px #656565; + -o-box-shadow: 0px 0px 10px 0px #656565; + box-shadow: 0px 0px 10px 0px #656565; + filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565,Direction=NaN,Strength=10); +} + +.pjCreate{ + height: auto; + white-space: initial; +} + +.pjCreate input,.pjCreate select{ + width:80%; +} + +.pjCreateFile{ + border: dashed 12px #ccc; + height: 60%; + border-radius: 5px; + margin-top: 10px; +} + +.pjCreateFile i{ + font-size: 100px; + opacity: 0.5; + margin-top: 20%; + cursor: pointer; +} + +.pjDetails div{ + white-space: initial; +} + +.pjDoc{ + height: 100px; + background-color: white; + -moz-box-shadow: inset 0px 0px 5px 0px #656565; + -webkit-box-shadow: inset 0px 0px 5px 0px #656565; + -o-box-shadow: inset 0px 0px 5px 0px #656565; + box-shadow: inset 0px 0px 5px 0px #656565; + filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=5); + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; + padding: 10px; +} + +.pjDoc img{ + height: 95%; + border: solid 2px white; + cursor:pointer; +} + +img.panelSelectedThumbnail,img:hover.panelSelectedThumbnail{ + border: solid 2px #135F7F; + cursor:pointer; +} + +.actions{ + float:right; + width: 25%; + padding: 5px; + vertical-align: middle; + text-align: right; + text-transform: initial; + border-left: solid 1px black; + border-right: solid 1px black; +} +.actions i{ + width:5%; +} + +.actions select{ + width:75%; +} + +.actions input{ + text-align:center; + width:17%; +} + +.titleSignatureBook{ + display: block; + width:100%; + border: solid 1px black; + vertical-align: middle; + font-weight: bold; + background: #135F7F; + color: white; + text-transform : uppercase; + white-space: nowrap; + overflow: hidden; +} +#closeSignatureBook{ + float:right; + padding:5px; + width:2%; + text-align: center; +} +#labelSignatureBook{ + float:left; + width: 33%; + padding-left: 10px; + margin-top: 10px; +} + +#labelSignatureBook div{ + /*width: 100%;*/ + overflow: hidden; + text-overflow: ellipsis; + display: block; +} + +#tabSignatureBook{ + float:left; + width:auto; +} +.titleSignatureBook div{ + display:inline-block; + vertical-align: middle; +} + +#tabSignatureBook .item{ + border-right: solid 1px black; + display: table-cell; + padding: 5px; + cursor: pointer; + vertical-align: middle; + width: 40px; + text-align: center; + padding-left: 10px; + padding-right: 10px; + padding-bottom: 7px; + color:#666; + background-color: #F2F2F2; +} +/*.titleSignatureBook span{ + display: inline-block; + vertical-align: middle; + padding:10px; + width: 90%; + overflow: hidden; + text-overflow: ellipsis; + +} + +.titleSignatureBook span:nth-child(2){ + position: absolute; + right: 0px; + text-align: right; + padding-left: 5px; + top: -4px; +}*/ + +.headerSignatureBook{ + border: solid 1px black; + display: table; + margin-bottom: 10px; + white-space: nowrap; + text-align: center; + width: 100%; +} + +.contentSignatureBook{ + border: solid 1px black; + display: block; + width: 100%; + height:91vh; + white-space: nowrap; + overflow: hidden; + background-color: #F2F2F2; + margin-top: 5px; +} + +.headerSignatureBook .item{ + border-right: solid 1px black; + display: table-cell; + padding: 5px; + cursor: pointer; + width: 5%; + vertical-align: middle; + background-color: #F2F2F2; +} + +.headerSignatureBook .activeTabSignatureBook i{ + display: table-cell; + vertical-align: middle; +} + +#tabSignatureBook .item.activeTabSignatureBook{ + /*background: #135F7F; + color:white;*/ + -moz-box-shadow: inset 0px 0px 5px 0px #656565; + -webkit-box-shadow: inset 0px 0px 5px 0px #656565; + -o-box-shadow: inset 0px 0px 5px 0px #656565; + box-shadow: inset 0px 0px 5px 0px #656565; + padding-left: 10px; + padding-right: 10px; +} + +.resListContentFrameSelected{ + background-color: #F99830; + +} + +.panelRightContent .item:hover{ + -moz-box-shadow: inset 0px 0px 5px 0px #656565; + -webkit-box-shadow: inset 0px 0px 5px 0px #656565; + -o-box-shadow: inset 0px 0px 5px 0px #656565; + box-shadow: inset 0px 0px 5px 0px #656565; + background-color: #F99830; +} +.panelSelectedThumbnail{ + -moz-box-shadow: inset 0px 0px 5px 0px #656565; + -webkit-box-shadow: inset 0px 0px 5px 0px #656565; + -o-box-shadow: inset 0px 0px 5px 0px #656565; + box-shadow: inset 0px 0px 5px 0px #656565; + background-color: #F99830; + color: #666 !important; +} + +.infoPj{ + width: 30%; + display: inline-block; + white-space: nowrap !important; + overflow: hidden; + text-overflow: ellipsis; + padding: 5px; +} + +.infoPj label{ + vertical-align: top; +} + + + +/* NG TABLE */ +.ng-table th{ + text-align:left; + padding: 5px; + -webkit-touch-callout:none; + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none; +} + +.ng-table th.sortable{ + cursor:pointer; +} + +.ng-table th.sortable .sort-indicator{ + padding-right:18px; + position:relative; +} +.ng-table th.sortable .sort-indicator:after,.ng-table th.sortable .sort-indicator:before{ + content:""; + border-width:0 4px 4px; + border-style:solid; + border-color:#000 transparent; + visibility:visible; + right:5px; + top:50%; + position:absolute; + opacity:.3; + margin-top:-4px; +} + +.ng-table th.sortable .sort-indicator:before{ + margin-top:2px; + border-bottom:none; + border-left:4px solid transparent; + border-right:4px solid transparent; + border-top:4px solid #000; +} + +.ng-table th.sortable .sort-indicator:hover:after,.ng-table th.sortable .sort-indicator:hover:before{ + opacity:1; + visibility:visible; +} + +.ng-table th.sortable.sort-asc,.ng-table th.sortable.sort-desc{ + background-color:rgba(141,192,219,.25); + text-shadow:0 1px 1px hsla(0,0%,100%,.75); +} + +.ng-table th.sortable.sort-asc .sort-indicator:after,.ng-table th.sortable.sort-desc .sort-indicator:after{ + margin-top:-2px; +} + +.ng-table th.sortable.sort-asc .sort-indicator:before,.ng-table th.sortable.sort-desc .sort-indicator:before{ + visibility:hidden; +} + +.ng-table th.sortable.sort-asc .sort-indicator:after,.ng-table th.sortable.sort-asc .sort-indicator:hover:after,.ng-table th.sortable.sort-desc .sort-indicator:after{ + visibility:visible; + filter:alpha(opacity=60); + -khtml-opacity:.6; + -moz-opacity:.6; + opacity:.6; +} + +.ng-table th.sortable.sort-desc .sort-indicator:after{ + border-bottom:none; + border-left:4px solid transparent; + border-right:4px solid transparent; + border-top:4px solid #000; + box-shadow:none; +} +.ng-table th.filter .input{ + margin:0;display:block; + width:auto; + /*min-height:30px;*/ + font-size: 9px; + box-sizing:border-box; +} + +.ng-table .ng-table-group-header th{ + text-align:left; +} +.ng-table .ng-table-group-selector{display:block}.ng-table .ng-table-group-close,.ng-table .ng-table-group-toggle{float:right}.ng-table .ng-table-group-toggle{margin-right:5px}@media only screen and (max-width:800px){.ng-table-responsive{border-bottom:1px solid #999}.ng-table-responsive tr{border-top:1px solid #999;border-left:1px solid #999;border-right:1px solid #999}.ng-table-responsive td:before{position:absolute;padding:8px;left:0;top:0;width:50%;white-space:nowrap;text-align:left;font-weight:700}.ng-table-responsive thead tr th{text-align:left}.ng-table-responsive thead tr.ng-table-filters th{padding:0}.ng-table-responsive thead tr.ng-table-filters th form>div{padding:8px}.ng-table-responsive td{border:none;border-bottom:1px solid #eee;position:relative;padding-left:50%;white-space:normal;text-align:left}.ng-table-responsive td:before{content:attr(data-title-text)}.ng-table-responsive,.ng-table-responsive tbody,.ng-table-responsive td,.ng-table-responsive th,.ng-table-responsive thead,.ng-table-responsive tr{display:block}}.ng-table-pagination{margin-top:0}.filter:after,.filter:before,.ng-table-group-selector:after,.ng-table-group-selector:before{display:table;content:" "}.filter:after,.ng-table-group-selector:after{clear:both}.filter>.filter-cell{float:left;box-sizing:border-box}.filter-horizontal>.filter-cell{padding:0 2px}.filter-horizontal>.filter-cell:first-child{padding-left:0}.filter-horizontal>.filter-cell.last,.filter-horizontal>.filter-cell:last-child{padding-right:0}.s12{width:100%}.s11{width:91.66666666666666%}.s10{width:83.33333333333334%}.s9{width:75%}.s8{width:66.66666666666666%}.s7{width:58.333333333333336%}.s6{width:50%}.s5{width:41.66666666666667%}.s4{width:33.33333333333333%}.s3{width:25%}.s2{width:16.666666666666664%}.s1{width:8.333333333333332%}@media all and (max-width:468px){.s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10,.s11,.s12{width:100%}.filter>.filter-cell{padding:0}} + +.ng-table { + margin-bottom: 20px; + max-width: 100%; + width: 100%; + background-color: transparent; + border-collapse: collapse; + border-spacing: 0; + border-bottom: solid 1px #135F7F; +} + +.ng-table td{ + text-align: left; + padding: 10px; +} + +.ng-table th{ + border-bottom: solid 1px #135F7F; +} + +.ng-table-counts{ + display:none; +} + +.ng-table-pagination li{ + display: inline-block; + border: solid 1px #135F7F; + padding: 5px; + margin:5px; + border-radius: 10px; +} + +.ng-table-pagination li.active{ + background : #135F7F; + color: white; +} + +.ng-table-pagination li.active a{ + color: white; +} + +.ng-table-pagination li:hover{ + background : #135F7F; + color: white; +} + +.ng-table-pagination li:hover a{ + color: white; +} + +.ng-table tr:nth-child(even) { + background-color: rgba(141,192,219,.25); +} + +.ng-table th:nth-child(1) { + width:20%; +} + +.ng-table th:nth-child(2) { + width:20%; +} + +.ng-table th:nth-child(3) { + width:60%; +} + +#footer{ + padding: 0px; +} + +.pjSign{ + text-align: left; + height: auto; + position: absolute; + bottom: 0px; + background: white; + margin-bottom: 5px; + width : 50px; + -webkit-transition: width 0.5s; /* Safari */ + transition: width 0.5s; + overflow:auto !important; +} + +.pjSign.signed{ + width: auto !important; +} + +.pjSign img{ + border: solid 2px white; + height: 30px; + width: 50px; + -webkit-transition: height 0.5s; /* Safari */ + transition: height 0.5s; +} +.pjSign:hover img{ + height: 60px; + width:auto; + -webkit-transition: height 0.5s; /* Safari */ + transition: height 0.5s; +} +.pjSign:hover img:hover{ + border: solid 2px #135F7F; +} +.pjSign:hover { + width : 95%; + -webkit-transition: width 0.5s; /* Safari */ + transition: width 0.5s; +} +.visaPjView{ + color: initial; +} + +.panelRightListPj{ + padding: 5px; + margin-bottom: 5px; + cursor: pointer; +} +.panelRightListPj:hover{ + color: #135F7F; +} + +.panelRightAddPj{ + display: block; + padding:10px; + margin: auto; + margin-bottom: 10px; + font-size: 10px; + height:20px; + width:20px; + cursor: pointer; + padding: 10px; + background-color: #16a765; + color: white; + border-radius: 25px; + -moz-box-shadow: 0px 0px 10px 0px #656565; + -webkit-box-shadow: 0px 0px 10px 0px #656565; + -o-box-shadow: 0px 0px 10px 0px #656565; + box-shadow: 0px 0px 10px 0px #656565; + filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=10); +} + +.panelRightAddPj i{ + margin-left: -5px; +} + +.visaPjUp{ + margin: auto; + margin-bottom: 10px; + font-size: 10px; + height:20px; + width:20px; + cursor: pointer; + padding: 10px; + background-color: #4285f4; + color: white; + border-radius: 25px; + -moz-box-shadow: 0px 0px 10px 0px #656565; + -webkit-box-shadow: 0px 0px 10px 0px #656565; + -o-box-shadow: 0px 0px 10px 0px #656565; + box-shadow: 0px 0px 10px 0px #656565; + filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=10); +} +.visaPjDel{ + margin: auto; + font-size: 10px; + margin-bottom: 5px; + height:20px; + width:20px; + cursor: pointer; + padding: 10px; + background-color: #d14836; + color: white; + border-radius: 25px; + -moz-box-shadow: 0px 0px 10px 0px #656565; + -webkit-box-shadow: 0px 0px 10px 0px #656565; + -o-box-shadow: 0px 0px 10px 0px #656565; + box-shadow: 0px 0px 10px 0px #656565; + filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=10); +} +.visaNoPdfWarning{ + border: dashed; + font-weight: bold; + opacity: 0.5; + white-space: normal; + font-size: 40px; +} +.visaNoWorkflowWarning{ + height: 96%; + width:100%; + font-size: 40px; + border: dashed; + font-weight: bold; + opacity: 0.5; + white-space: normal; + margin-top: 10px; +} +.visaNoPjWarning{ + height: 80vh; + font-size: 40px; + border: dashed; + font-weight: bold; + opacity: 0.5; + white-space: normal; + margin-top: 10px; +} + +.visaDisabledButton{ + cursor: inherit; + opacity: 0.3; +} + +.chosen-container-single .chosen-default { + color: black !important; +} + +#visa_content select{ + font-size: 11px; +} + +.nbResZero{ + background: #666; + color: white; + padding: 3px; + border-radius: 7px; +} + +.nbRes{ + background: #F99830; + color: white; + padding: 3px; + border-radius: 7px; +} \ No newline at end of file diff --git a/src/frontend/app/signature-book.component.ts b/src/frontend/app/signature-book.component.ts index 9af049d4cd2..af5b7a05cb2 100755 --- a/src/frontend/app/signature-book.component.ts +++ b/src/frontend/app/signature-book.component.ts @@ -4,6 +4,9 @@ import { DomSanitizer } from '@angular/platform-browser'; import { Router, ActivatedRoute } from '@angular/router'; import { LANG } from './translate.component'; import { NotificationService } from './notification.service'; +import { tap, catchError } from 'rxjs/operators'; +import { of } from 'rxjs'; +import { PrivilegeService } from '../service/privileges.service'; declare function lockDocument(resId: number) : void; declare function unlockDocument(resId: number) : void; @@ -12,7 +15,7 @@ declare function $j(selector: string) : any; declare function showAttachmentsForm(path: string) : void; declare function modifyAttachmentsForm(path: string, width: string, height: string) : void; declare function setSessionForSignatureBook(resId: any) : void; -declare function triggerAngular(route: string) : void; +// declare function triggerAngular(route: string) : void; declare var angularGlobals : any; @@ -27,6 +30,7 @@ export class SafeUrlPipe implements PipeTransform { @Component({ templateUrl: "signature-book.component.html", + styleUrls: ['signature-book.component.scss'], providers: [NotificationService] }) export class SignatureBookComponent implements OnInit { @@ -51,7 +55,7 @@ export class SignatureBookComponent implements OnInit { leftSelectedThumbnail : number = 0; rightViewerLink : string = ""; leftViewerLink : string = ""; - headerTab : number = 1; + headerTab : string = "document"; showTopRightPanel : boolean = false; showTopLeftPanel : boolean = false; showResLeftPanel : boolean = true; @@ -65,29 +69,57 @@ export class SignatureBookComponent implements OnInit { leftContentWidth : string = "44%"; rightContentWidth : string = "44%"; - notesViewerLink : string = ""; - visaViewerLink : string = ""; - histViewerLink : string = ""; - linksViewerLink : string = ""; attachmentsViewerLink : string = ""; - - constructor(public http: HttpClient, private route: ActivatedRoute, private router: Router, private zone: NgZone, private notify: NotificationService) { - - $j("head style").remove(); - if ($j("link[href='merged_css.php']").length == 0) { - var head = document.getElementsByTagName('head')[0]; - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = 'merged_css.php'; - link.type = 'text/css'; - link.media = 'screen'; - head.insertBefore(link,head.children[5]) + + processTool: any[] = [ + { + id: 'notes', + icon: 'fas fa-pen-square fa-2x', + label: this.lang.notesAlt, + count: 0 + }, + { + id: 'visaCircuit', + icon: 'fas fa-list-ol fa-2x', + label: this.lang.visaWorkflow, + count: 0 + }, + { + id: 'history', + icon: 'fas fa-history fa-2x', + label: this.lang.history, + count: 0 + }, + { + id: 'linkedResources', + icon: 'fas fa-link fa-2x', + label: this.lang.links, + count: 0 } + ]; + + constructor( + public http: HttpClient, + private route: ActivatedRoute, + private router: Router, + private zone: NgZone, + private notify: NotificationService, + public privilegeService: PrivilegeService + ) { + + // $j("head style").remove(); + // if ($j("link[href='merged_css.php']").length == 0) { + // var head = document.getElementsByTagName('head')[0]; + // var link = document.createElement('link'); + // link.rel = 'stylesheet'; + // link.href = 'merged_css.php'; + // link.type = 'text/css'; + // link.media = 'screen'; + // head.insertBefore(link,head.children[5]) + // } window['angularSignatureBookComponent'] = { componentAfterAttach: (value: string) => this.processAfterAttach(value), - componentAfterAction: () => this.processAfterAction(), - componentAfterNotes: () => this.processAfterNotes(), - componentAfterLinks: () => this.processAfterLinks() + componentAfterAction: () => this.processAfterAction() }; (<any>window).pdfWorkerSrc = '../../node_modules/pdfjs-dist/build/pdf.worker.min.js'; } @@ -121,7 +153,7 @@ export class SignatureBookComponent implements OnInit { } this.signatureBook = data; - this.headerTab = 1; + this.headerTab = "document"; this.leftSelectedThumbnail = 0; this.rightSelectedThumbnail = 0; this.leftViewerLink = ""; @@ -132,10 +164,6 @@ export class SignatureBookComponent implements OnInit { this.showTopLeftPanel = false; this.showTopRightPanel = false; this.showAttachmentPanel = false; - // this.notesViewerLink = "index.php?display=true&module=notes&page=notes&identifier=" + this.resId + "&origin=document&coll_id=letterbox_coll&load&size=full"; - // this.visaViewerLink = "index.php?display=true&page=show_visa_tab&module=visa&resId=" + this.resId + "&collId=letterbox_coll&visaStep=true"; - // this.histViewerLink = "index.php?display=true&page=show_history_tab&resId=" + this.resId + "&collId=letterbox_coll"; - // this.linksViewerLink = "index.php?display=true&page=show_links_tab&id=" + this.resId; // this.attachmentsViewerLink = "index.php?display=true&module=attachments&page=frame_list_attachments&resId=" + this.resId + "&noModification=true&template_selected=documents_list_attachments_simple&load&attach_type_exclude=converted_pdf,print_folder"; this.leftContentWidth = "44%"; @@ -143,7 +171,7 @@ export class SignatureBookComponent implements OnInit { if (this.signatureBook.documents[0]) { this.leftViewerLink = this.signatureBook.documents[0].viewerLink; if (this.signatureBook.documents[0].category_id == "outgoing") { - this.headerTab = 3; + this.headerTab = "visaCircuit"; } } if (this.signatureBook.attachments[0]) { @@ -163,6 +191,7 @@ export class SignatureBookComponent implements OnInit { }); } }, 0); + this.loadBadges(); }, (err) => { this.notify.error(err.error.errors); setTimeout(() => { @@ -187,14 +216,6 @@ export class SignatureBookComponent implements OnInit { this.zone.run(() => this.refreshAttachments(mode)); } - processAfterNotes() { - this.zone.run(() => this.refreshNotes()); - } - - processAfterLinks() { - this.zone.run(() => this.refreshLinks()); - } - processAfterAction() { var idToGo = -1; var c = this.signatureBook.resList.length; @@ -220,7 +241,7 @@ export class SignatureBookComponent implements OnInit { } } - changeSignatureBookLeftContent(id: number) { + changeSignatureBookLeftContent(id: string) { this.headerTab = id; this.showTopLeftPanel = false; } @@ -376,20 +397,6 @@ export class SignatureBookComponent implements OnInit { } } - refreshNotes() { - // this.http.get(this.coreUrl + 'rest/res/' + this.resId + '/notes/count') - // .subscribe((data : any) => { - // this.signatureBook.nbNotes = data; - // }); - } - - refreshLinks() { - // this.http.get(this.coreUrl + 'rest/links/resId/' + this.resId) - // .subscribe((data : any) => { - // this.signatureBook.nbLinks = data.length; - // }); - } - signFile(attachment: any, signature: any) { if (!this.loadingSign && this.signatureBook.canSign) { this.loadingSign = true; @@ -432,10 +439,10 @@ export class SignatureBookComponent implements OnInit { if (this.signatureBook.resList.length > 0) { this.signatureBook.resList[this.signatureBook.resListIndex].allSigned = false; } - if(this.headerTab==3){ - this.changeSignatureBookLeftContent(0); + if(this.headerTab=="visaCircuit"){ + this.changeSignatureBookLeftContent("document"); setTimeout(() => { - this.changeSignatureBookLeftContent(3); + this.changeSignatureBookLeftContent("visaCircuit"); }, 0); } @@ -443,11 +450,12 @@ export class SignatureBookComponent implements OnInit { } backToBasket() { + let path = '/basketList/users/'+this.userId+'/groups/'+this.groupId+'/baskets/'+this.basketId; this.http.put('../../rest/resourcesList/users/' + this.userId + '/groups/' + this.groupId + '/baskets/' + this.basketId + '/unlock', { resources: [this.resId] }) .subscribe((data: any) => { - window.location.href = 'index.php?page=view_baskets&module=basket&basketId='+this.basketId+'&userId='+this.userId+'&groupIdSer='+this.groupId+'&backToBasket=true'; + this.router.navigate([path]); }, (err: any) => { - window.location.href = 'index.php?page=view_baskets&module=basket&basketId='+this.basketId+'&userId='+this.userId+'&groupIdSer='+this.groupId+'&backToBasket=true'; + this.router.navigate([path]); }); } @@ -500,4 +508,22 @@ export class SignatureBookComponent implements OnInit { ); } + refreshBadge(nbRres: any, id: string) { + this.processTool.filter(tool => tool.id === id)[0].count = nbRres; + } + + loadBadges() { + this.http.get(`../../rest/resources/${this.resId}/items`).pipe( + tap((data: any) => { + this.processTool.forEach(element => { + element.count = data[element.id] !== undefined ? data[element.id] : 0; + }); + }), + catchError((err: any) => { + this.notify.handleSoftErrors(err); + return of(false); + }) + ).subscribe(); + } + } -- GitLab