From bb2c8a41f0b3c8cf5f3b253c0ea3c74d6bd65867 Mon Sep 17 00:00:00 2001 From: Lucio Maranta Date: Tue, 18 Dec 2018 16:56:10 +0100 Subject: [PATCH 1/9] Minor fix --- Step.NC/NcHandler.cs | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Step.NC/NcHandler.cs b/Step.NC/NcHandler.cs index 534bf903..443d6c61 100644 --- a/Step.NC/NcHandler.cs +++ b/Step.NC/NcHandler.cs @@ -99,7 +99,7 @@ namespace Step.NC { if (NcConfig.NcVendor != NC_VENDOR.SIEMENS) { - // TODO Manare + // TODO Fix in the future return File.Exists(path); } else @@ -1063,7 +1063,7 @@ namespace Step.NC CreatedByCms = currMaintenance.UserId == null, CanEdit = canEdit, CanPerform = canPerform, - User = performed?.Maintainer == null ? null : (DTOMessageUserModel)performed.Maintainer + Maintainer = performed?.Maintainer == null ? null : (DTOMessageUserModel)performed.Maintainer }); } } @@ -1463,7 +1463,7 @@ namespace Step.NC if (cmsError.IsError()) return cmsError; - if (NcConfig.NcVendor != NC_VENDOR.SIEMENS) + if (NcConfig.NcVendor != NC_VENDOR.SIEMENS && NcConfig.NcVendor != NC_VENDOR.DEMO) { config.FamilyOptionActive = true; config.MultitoolOptionActive = true; From 76b882ce19b345ac89fba7f87a45333d5d0fdc43 Mon Sep 17 00:00:00 2001 From: Lucio Maranta Date: Tue, 18 Dec 2018 17:03:27 +0100 Subject: [PATCH 2/9] Fix previus commit --- Step.Model/DTOModels/MaintenanceModels/DTOMaintenanceModel.cs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Step.Model/DTOModels/MaintenanceModels/DTOMaintenanceModel.cs b/Step.Model/DTOModels/MaintenanceModels/DTOMaintenanceModel.cs index a3df2284..d7a47c8a 100644 --- a/Step.Model/DTOModels/MaintenanceModels/DTOMaintenanceModel.cs +++ b/Step.Model/DTOModels/MaintenanceModels/DTOMaintenanceModel.cs @@ -38,6 +38,6 @@ namespace Step.Model.DTOModels.MaintenanceModels public bool CanPerform { get; set; } - public DTOMessageUserModel User { get; set; } + public DTOMessageUserModel Maintainer { get; set; } } } \ No newline at end of file From 356e0eaae2ae0beb14ca15a9955a2c822372b10d Mon Sep 17 00:00:00 2001 From: Nicola Carminati Date: Wed, 19 Dec 2018 11:05:13 +0100 Subject: [PATCH 3/9] Check resolution on startup when not in DeveloperMode --- Client/Program.cs | 2 +- Client/View/MainForm.cs | 57 ++++++++++++++++++++++++++++++++++++++--- 2 files changed, 54 insertions(+), 5 deletions(-) diff --git a/Client/Program.cs b/Client/Program.cs index 16bb15bc..e45eb79b 100644 --- a/Client/Program.cs +++ b/Client/Program.cs @@ -209,7 +209,7 @@ namespace CMS_Client #region ALARM_METHODS //Method Used to Show an alarm and close the application - private static void ShowAlarmAndClose(string Message) + public static void ShowAlarmAndClose(string Message) { MessageBox.Show(Message, Application.ProductName, diff --git a/Client/View/MainForm.cs b/Client/View/MainForm.cs index b928d794..a5b1ae48 100644 --- a/Client/View/MainForm.cs +++ b/Client/View/MainForm.cs @@ -119,7 +119,7 @@ namespace CMS_Client.View } else { - if (Config.VendorHmiConfig.Enabled) + if (Config.VendorHmiConfig.Enabled && NcFrm != null) NcFrm.Show(); if (NcWindow.State == NcState.SHOW) @@ -434,6 +434,14 @@ namespace CMS_Client.View private void ShowWindow() { + if(Config.ClientConfig.DeveloperMode && Width < 1920 && Height < 1080) + { + double ratio = (((double)Width) / 1920.0) * 100.0; + //Funzione sperimentale presa da Forum CEF + double delta = 5.46149645 * Math.Log(ratio) - 25.12; + Browser.BrowserHost.ZoomLevel = delta; + } + //Invoke method if is needed or call the method in STD mode if (!IsDisposed) { @@ -583,7 +591,7 @@ namespace CMS_Client.View //Hide NC Method public void HideNCWindow() { - if (!Config.VendorHmiConfig.Enabled) + if (!Config.VendorHmiConfig.Enabled || NcFrm==null) return; //Invoke method if is needed or call the method in STD mode @@ -617,13 +625,55 @@ namespace CMS_Client.View private void CalcWindowPosition() { //Position of the Window + Screen ps = Screen.AllScreens.FirstOrDefault(S => S.Primary == true); + if (Screen.AllScreens.Length > 1 && Config.ClientConfig.RunningOnSecondaryScreen) { - Screen ps = Screen.AllScreens.FirstOrDefault(S => S.Primary == true); Screen ss = Screen.AllScreens.FirstOrDefault(S => S.Primary == false); X = ps.Bounds.Width; if (ss.Bounds.Top != 0) Y = ss.Bounds.Top; + + //Set the Secondary screen Size + if (Config.ClientConfig.DeveloperMode) + { + if (ss.Bounds.Width < 1920 && ss.Bounds.Height < 1080) + { + this.Width = ss.Bounds.Width; + this.Height = ss.Bounds.Height; + } + } + else + { + if (ss.Bounds.Width != 1920 && ss.Bounds.Height != 1080) + { + HideLoadingWindow(); + NcWindow.CloseNcWindow(false); + Program.ShowAlarmAndClose("Screen resolution " + ss.Bounds.Width + "x" + ss.Bounds.Height + " is not supported"); + } + } + } + else + { + if (Config.ClientConfig.DeveloperMode) + { + //Set the Prymary screen Size + if (ps.Bounds.Width < 1920 && ps.Bounds.Height < 1080) + { + this.Width = ps.Bounds.Width; + this.Height = ps.Bounds.Height; + } + + } + else + { + if (ps.Bounds.Width != 1920 && ps.Bounds.Height != 1080) + { + HideLoadingWindow(); + NcWindow.CloseNcWindow(false); + Program.ShowAlarmAndClose("Screen resolution " + ps.Bounds.Width + "x" + ps.Bounds.Height + " is not supported"); + } + } } } @@ -659,7 +709,6 @@ namespace CMS_Client.View } } - #endregion } } From 43ce78d2b197238d5a62eee2f78f9c13836a2dfe Mon Sep 17 00:00:00 2001 From: Nicola Carminati Date: Wed, 19 Dec 2018 17:46:02 +0100 Subject: [PATCH 4/9] Added author for performed maintenances --- Step.Utils/languages/IT.xml | 9 ++++----- Step.Utils/languages/en.xml | 9 ++++----- .../maintenance/components/maintenance-card.ts | 9 +++++---- .../maintenance/components/maintenance-card.vue | 4 +++- 4 files changed, 16 insertions(+), 15 deletions(-) diff --git a/Step.Utils/languages/IT.xml b/Step.Utils/languages/IT.xml index 0cb7380f..c1515bbe 100644 --- a/Step.Utils/languages/IT.xml +++ b/Step.Utils/languages/IT.xml @@ -140,7 +140,6 @@ Nuovo Offset Nuovo Tagliente Parametri - Modifica utensile n. %d - %s Modifica utensile n. %d Creazione Nuovo Utensile Modifica Tagliente n. %d @@ -470,10 +469,10 @@ Cancella Salva Nessun intervento di manutenzione effettuato - Ultimo intervento effettuato pochi minuti fa - Ultimo intervento effettuato %d ore fa - Ultimo intervento effettuato %d giorni fa - Ultimo intervento effettuato in data: %s + Ultimo intervento effettuato pochi minuti fa, da: %s + Ultimo intervento effettuato %d ore fa, da: %s + Ultimo intervento effettuato %d giorni fa, da: %s + Ultimo intervento effettuato in data: %s, da: %s Manutenzione creata in data %s alle ore %s Allegati Note diff --git a/Step.Utils/languages/en.xml b/Step.Utils/languages/en.xml index 5c478817..03eac72c 100644 --- a/Step.Utils/languages/en.xml +++ b/Step.Utils/languages/en.xml @@ -140,7 +140,6 @@ New Offset New Cutting Edge Parameters - Edit Tool no. %d - %s Edit Tool no. %d New Tool Creation Edit Offset no. %d @@ -469,10 +468,10 @@ Cancel Save Maintenance never registered - Last maintenance registered few minutes ago - Last maintenance registered %d hours ago - Last maintenance registered %d days ago - Last maintenance registered in: %s + Last maintenance registered few minutes ago, from: %s + Last maintenance registered %d hours ago, from: %s + Last maintenance registered %d days ago, from: %s + Last maintenance registered in: %s, from: %s Maintenance created in %s at %s Attachments Notes diff --git a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts index 55d10e73..1dd68129 100644 --- a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts +++ b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts @@ -165,14 +165,15 @@ export default class MaintenanceCard extends Vue { var end = moment(m.lastPerformedDate); var days = (moment.duration(today.diff(end)) as any)._data.days; var hours = (moment.duration(today.diff(end)) as any)._data.hours; + var author = m.maintainer.username; if (hours == 0) - return this.$options.filters.localize("maintenance_date_justdone", "Ultimo intervento effettuato pochi minuti fa"); + return this.$options.filters.localize("maintenance_date_justdone", "Ultimo intervento effettuato pochi minuti fa, da: %s"); else if (days == 0) - return this.$options.filters.localize("maintenance_date_hours", "Ultimo intervento effettuato %d ore fa", hours); + return this.$options.filters.localize("maintenance_date_hours", "Ultimo intervento effettuato %d ore fa, da: %s", hours,author); else if (days <= 7) - return this.$options.filters.localize("maintenance_date_days", "Ultimo intervento effettuato %d giorni fa", days); + return this.$options.filters.localize("maintenance_date_days", "Ultimo intervento effettuato %d giorni fa, da: %s", days,author); else - return this.$options.filters.localize("maintenance_date_fixeddate", "Ultimo intervento effettuato in data: %s", moment(m.lastPerformedDate).format('L')); + return this.$options.filters.localize("maintenance_date_fixeddate", "Ultimo intervento effettuato in data: %s, da: %s", moment(m.lastPerformedDate).format('L'),author); } return ""; } diff --git a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.vue b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.vue index fdf3f2b0..f19bf573 100644 --- a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.vue +++ b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.vue @@ -11,7 +11,9 @@
{{getDescMaintenance(selectedMaintenance.createdByCms, selectedMaintenance.id, selectedMaintenance.description)}}
-
{{this.getDaysFromLastExpiration(selectedMaintenance)}}
+
+ {{this.getDaysFromLastExpiration(selectedMaintenance)}} +
 
{{'maintenance_date_neverdone' | localize("Nessuna manutenzione effettuata")}}
From f8a3faf47e2973d5985f7765bbe663180217386f Mon Sep 17 00:00:00 2001 From: Nicola Carminati Date: Wed, 19 Dec 2018 17:51:25 +0100 Subject: [PATCH 5/9] Fix last commit --- .../src/app_modules/maintenance/components/maintenance-card.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts index 1dd68129..065f21fd 100644 --- a/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts +++ b/Step/wwwroot/src/app_modules/maintenance/components/maintenance-card.ts @@ -167,7 +167,7 @@ export default class MaintenanceCard extends Vue { var hours = (moment.duration(today.diff(end)) as any)._data.hours; var author = m.maintainer.username; if (hours == 0) - return this.$options.filters.localize("maintenance_date_justdone", "Ultimo intervento effettuato pochi minuti fa, da: %s"); + return this.$options.filters.localize("maintenance_date_justdone", "Ultimo intervento effettuato pochi minuti fa, da: %s",author); else if (days == 0) return this.$options.filters.localize("maintenance_date_hours", "Ultimo intervento effettuato %d ore fa, da: %s", hours,author); else if (days <= 7) From 120dc3e343ac32686d34d0beea78aee5784be448 Mon Sep 17 00:00:00 2001 From: Nicola Carminati Date: Thu, 27 Dec 2018 16:26:20 +0100 Subject: [PATCH 6/9] Added zoom-image on working file-image & maintenance-attachments --- Step/wwwroot/assets/styles/base/card.less | 25 +- Step/wwwroot/assets/styles/base/modals.less | 357 +++++++------- Step/wwwroot/assets/styles/style.css | 442 ++++++++---------- .../components/card-job-production.ts | 10 +- .../components/card-job-production.vue | 7 +- .../modules/base-components/modal-image.vue | 7 +- .../modules/base-components/zoom-image.vue | 31 +- 7 files changed, 434 insertions(+), 445 deletions(-) diff --git a/Step/wwwroot/assets/styles/base/card.less b/Step/wwwroot/assets/styles/base/card.less index d8b9f3d5..6e59ec90 100644 --- a/Step/wwwroot/assets/styles/base/card.less +++ b/Step/wwwroot/assets/styles/base/card.less @@ -1264,11 +1264,26 @@ justify-content: center; height: 335px; margin: 0px 18px 0 18px; - img{ - max-height:315px; - box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.4); - max-width: 100%; - } + .container{ + margin: auto; + overflow: visible; + position: relative; + cursor: pointer; + img { + display: block; + max-height:315px; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.4); + max-width: 100%; + } + .eye{ + position: absolute; + bottom: 2px; + right: 10px; + font-size: 25px; + color: @color-darkish-blue; + } + } + .noimage{ display: flex; align-items: center; diff --git a/Step/wwwroot/assets/styles/base/modals.less b/Step/wwwroot/assets/styles/base/modals.less index 2e6a6e85..a64b928f 100644 --- a/Step/wwwroot/assets/styles/base/modals.less +++ b/Step/wwwroot/assets/styles/base/modals.less @@ -989,6 +989,7 @@ justify-content: center; display: flex; background-color: #cccccc; + position: relative; } #imagecontainer{ position: relative; @@ -1085,178 +1086,7 @@ flex-flow: row; hr { width: 5%; - } - - - - .imageViewerZoom { - position: absolute; - width: 100%; - height: inherit; - background: #cccccc; - top: 0; - display: block; - overflow:hidden; - cursor: -webkit-grab; - - .container{ - width: 100%; - height: 100%; - } - img{ - position: absolute; - user-drag: none; - -webkit-user-drag: none; - box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4) - } - &::-webkit-scrollbar { - width: 4px; - height: 4px; - background-color: transparent; - } - - &::-webkit-scrollbar-thumb { - border-radius: 2px; - background-color: rgba(0, 0, 0, 0.3); - } - .btngroup_close{ - position: absolute; - top: 0; - right: 0; - margin-right: 20px; - margin-top: 20px; - - } - .btngroup{ - position: absolute; - bottom: 0; - right: 0; - margin-right: 20px; - margin-bottom: 50px; - button{ - margin-top: 20px; - } - button.searchminus{ - margin-top: 0px; - } - } - button { - font-size: 20px; - justify-content: center; - display: flex; - background-color: @color-header-button-background-color; - background-image: linear-gradient(to bottom, #1756ad, #002680); - box-shadow: @color-header-button-box-shadow; - border-radius: @header-button-size /2; - border: none; - height: @header-button-size; - max-height: @header-button-size; - min-width: @header-button-size; - max-width: @header-button-size; - cursor: pointer; - color: #FFF; - z-index: 1; - } - button:disabled { - background-color: #002680 !important;; - filter: grayscale(100%); - } - button>img { - margin: auto; - height: @header-button-size/2; - margin: auto; - display: block; - } - button>img.h-20 { - height: 20px; - } - button>img.h-24 { - height: 24px; - } - button .machine-info small { - display: block; - text-align: left; - margin-left: 5px; - font-family: 'Work Sans', sans-serif; - font-size: 11px; - } - button.red { - background-color: @color-scarlet; - color: white; - box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4), inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); - } - button.blue { - background-color: @color-clear-blue; - color: white; - } - button.dark-blue { - background-color: @color-darkish-blue; - color: white; - } - button.dark-blue:active { - background-color: @color-clear-blue; - } - button.gray { - background-color: @color-greyish-brown; - color: white; - } - button.profile { - width: @header-button-size; // background-image: url(../profile.png); - color: #000; - // background-size: cover; - &.colorWhite{ - color: #FFF; - } - } - button.unclickable { - cursor: default; - } - - - input[type=range] { - -webkit-appearance: none; - margin: 18px 0; - width: 200px; - transform: rotate(-90deg); - margin-top:200px; - } - input[type=range]:focus { - outline: none; - } - input[type=range]::-webkit-slider-runnable-track { - width: 100%; - height: 9px; - cursor: pointer; - background: #979797; - border-radius: 4px; - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4); - } - input[type=range]::-webkit-slider-thumb { - height: 30px; - width: 30px; - border-radius: 15px; - background-color: #ffffff; - background-image: linear-gradient(to left, #1756ad, #002680); - box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); - cursor: pointer; - -webkit-appearance: none; - margin-top: -10px; - } - .rangecontainer{ - height: 257px; - width: 44px; - overflow: hidden; - .range{ - position: absolute; - top: -15px; - left: -79px; - } - } - } - .imageViewerZoom:active { - cursor: -webkit-grabbing; - } - + } .first-column { min-width: 215px; border-right: solid 2px @color-whitethree; @@ -2272,4 +2102,187 @@ justify-content: flex-end; } } +} + +.imageViewerZoom { + position: absolute; + width: 100%; + height: 100%; + background: #cccccc; + top: 0; + display: block; + overflow:hidden; + .container{ + width: 100%; + height: 100%; + cursor: -webkit-grab; + } + .loading{ + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background: #cccccc; + display: flex; + align-items: center; + text-align: center; + font-size: 4em; + justify-content: center; + cursor:wait; + color: #4b4b4b; + } + + img{ + position: absolute; + user-drag: none; + -webkit-user-drag: none; + box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4) + } + &::-webkit-scrollbar { + width: 4px; + height: 4px; + background-color: transparent; + } + + &::-webkit-scrollbar-thumb { + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.3); + } + .btngroup_close{ + position: absolute; + top: 0; + right: 0; + margin-right: 20px; + margin-top: 20px; + + } + .btngroup{ + position: absolute; + bottom: 0; + right: 0; + margin-right: 20px; + margin-bottom: 50px; + button{ + margin-top: 20px; + } + button.searchminus{ + margin-top: 0px; + } + } + button { + font-size: 20px; + justify-content: center; + display: flex; + background-color: @color-header-button-background-color; + background-image: linear-gradient(to bottom, #1756ad, #002680); + box-shadow: @color-header-button-box-shadow; + border-radius: @header-button-size /2; + border: none; + height: @header-button-size; + max-height: @header-button-size; + min-width: @header-button-size; + max-width: @header-button-size; + cursor: pointer; + color: #FFF; + z-index: 1; + } + button:disabled { + background-color: #002680 !important;; + filter: grayscale(100%); + } + button>img { + margin: auto; + height: @header-button-size/2; + margin: auto; + display: block; + } + button>img.h-20 { + height: 20px; + } + button>img.h-24 { + height: 24px; + } + button .machine-info small { + display: block; + text-align: left; + margin-left: 5px; + font-family: 'Work Sans', sans-serif; + font-size: 11px; + } + button.red { + background-color: @color-scarlet; + color: white; + box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4), inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); + } + button.blue { + background-color: @color-clear-blue; + color: white; + } + button.dark-blue { + background-color: @color-darkish-blue; + color: white; + } + button.dark-blue:active { + background-color: @color-clear-blue; + } + button.gray { + background-color: @color-greyish-brown; + color: white; + } + button.profile { + width: @header-button-size; // background-image: url(../profile.png); + color: #000; + // background-size: cover; + &.colorWhite{ + color: #FFF; + } + } + button.unclickable { + cursor: default; + } + + + input[type=range] { + -webkit-appearance: none; + margin: 18px 0; + width: 200px; + transform: rotate(-90deg); + margin-top:200px; + } + input[type=range]:focus { + outline: none; + } + input[type=range]::-webkit-slider-runnable-track { + width: 100%; + height: 9px; + cursor: pointer; + background: #979797; + border-radius: 4px; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4); + } + input[type=range]::-webkit-slider-thumb { + height: 30px; + width: 30px; + border-radius: 15px; + background-color: #ffffff; + background-image: linear-gradient(to left, #1756ad, #002680); + box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); + cursor: pointer; + -webkit-appearance: none; + margin-top: -10px; + } + .rangecontainer{ + height: 257px; + width: 44px; + overflow: hidden; + .range{ + position: absolute; + top: -15px; + left: -79px; + } + } +} +.imageViewerZoom:active { + cursor: -webkit-grabbing; } \ No newline at end of file diff --git a/Step/wwwroot/assets/styles/style.css b/Step/wwwroot/assets/styles/style.css index 3e03b373..12d23fe7 100644 --- a/Step/wwwroot/assets/styles/style.css +++ b/Step/wwwroot/assets/styles/style.css @@ -935,6 +935,7 @@ justify-content: center; display: flex; background-color: #cccccc; + position: relative; } .modal.modal-image #imagecontainer { position: relative; @@ -1060,256 +1061,6 @@ .modal.modal-add-element-queue .modal-add-element-queue-body hr { width: 5%; } -.modal.modal-load-program .modal-load-program-body .imageViewerZoom, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom { - position: absolute; - width: 100%; - height: inherit; - background: #cccccc; - top: 0; - display: block; - overflow: hidden; - cursor: -webkit-grab; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .container, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .container, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .container, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .container { - width: 100%; - height: 100%; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom img, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom img, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom img, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom img { - position: absolute; - user-drag: none; - -webkit-user-drag: none; - box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom::-webkit-scrollbar, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom::-webkit-scrollbar, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom::-webkit-scrollbar, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom::-webkit-scrollbar { - width: 4px; - height: 4px; - background-color: transparent; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom::-webkit-scrollbar-thumb, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom::-webkit-scrollbar-thumb, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom::-webkit-scrollbar-thumb, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom::-webkit-scrollbar-thumb { - border-radius: 2px; - background-color: rgba(0, 0, 0, 0.3); -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .btngroup_close, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .btngroup_close, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .btngroup_close, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .btngroup_close { - position: absolute; - top: 0; - right: 0; - margin-right: 20px; - margin-top: 20px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .btngroup, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .btngroup, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .btngroup, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .btngroup { - position: absolute; - bottom: 0; - right: 0; - margin-right: 20px; - margin-bottom: 50px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .btngroup button, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .btngroup button, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .btngroup button, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .btngroup button { - margin-top: 20px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .btngroup button.searchminus, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .btngroup button.searchminus, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .btngroup button.searchminus, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .btngroup button.searchminus { - margin-top: 0px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button { - font-size: 20px; - justify-content: center; - display: flex; - background-color: #ffffff; - background-image: linear-gradient(to bottom, #1756ad, #002680); - box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4); - border-radius: 22px; - border: none; - height: 44px; - max-height: 44px; - min-width: 44px; - max-width: 44px; - cursor: pointer; - color: #FFF; - z-index: 1; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button:disabled, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button:disabled, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button:disabled, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button:disabled { - background-color: #002680 !important; - filter: grayscale(100%); -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button > img, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button > img, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button > img, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button > img { - height: 22px; - margin: auto; - display: block; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button > img.h-20, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button > img.h-20, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button > img.h-20, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button > img.h-20 { - height: 20px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button > img.h-24, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button > img.h-24, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button > img.h-24, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button > img.h-24 { - height: 24px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button .machine-info small, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button .machine-info small, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button .machine-info small, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button .machine-info small { - display: block; - text-align: left; - margin-left: 5px; - font-family: 'Work Sans', sans-serif; - font-size: 11px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.red, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.red, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.red, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.red { - background-color: #d0021b; - color: white; - box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4), inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.blue, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.blue, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.blue, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.blue { - background-color: #1791ff; - color: white; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.dark-blue, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.dark-blue, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.dark-blue, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.dark-blue { - background-color: #002680; - color: white; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.dark-blue:active, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.dark-blue:active, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.dark-blue:active, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.dark-blue:active { - background-color: #1791ff; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.gray, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.gray, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.gray, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.gray { - background-color: #4b4b4b; - color: white; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.profile, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.profile, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.profile, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.profile { - width: 44px; - color: #000; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.profile.colorWhite, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.profile.colorWhite, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.profile.colorWhite, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.profile.colorWhite { - color: #FFF; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom button.unclickable, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom button.unclickable, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom button.unclickable, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom button.unclickable { - cursor: default; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom input[type=range], -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom input[type=range], -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom input[type=range], -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom input[type=range] { - -webkit-appearance: none; - margin: 18px 0; - width: 200px; - transform: rotate(-90deg); - margin-top: 200px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom input[type=range]:focus, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom input[type=range]:focus, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom input[type=range]:focus, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom input[type=range]:focus { - outline: none; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom input[type=range]::-webkit-slider-runnable-track, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom input[type=range]::-webkit-slider-runnable-track, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom input[type=range]::-webkit-slider-runnable-track, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom input[type=range]::-webkit-slider-runnable-track { - width: 100%; - height: 9px; - cursor: pointer; - background: #979797; - border-radius: 4px; - box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4); -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom input[type=range]::-webkit-slider-thumb, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom input[type=range]::-webkit-slider-thumb, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom input[type=range]::-webkit-slider-thumb, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom input[type=range]::-webkit-slider-thumb { - height: 30px; - width: 30px; - border-radius: 15px; - background-color: #ffffff; - background-image: linear-gradient(to left, #1756ad, #002680); - box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); - cursor: pointer; - -webkit-appearance: none; - margin-top: -10px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .rangecontainer, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .rangecontainer, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .rangecontainer, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .rangecontainer { - height: 257px; - width: 44px; - overflow: hidden; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom .rangecontainer .range, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom .rangecontainer .range, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom .rangecontainer .range, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom .rangecontainer .range { - position: absolute; - top: -15px; - left: -79px; -} -.modal.modal-load-program .modal-load-program-body .imageViewerZoom:active, -.modal.modal-add-element-queue .modal-load-program-body .imageViewerZoom:active, -.modal.modal-load-program .modal-add-element-queue-body .imageViewerZoom:active, -.modal.modal-add-element-queue .modal-add-element-queue-body .imageViewerZoom:active { - cursor: -webkit-grabbing; -} .modal.modal-load-program .modal-load-program-body .first-column, .modal.modal-add-element-queue .modal-load-program-body .first-column, .modal.modal-load-program .modal-add-element-queue-body .first-column, @@ -2401,6 +2152,181 @@ align-items: center; justify-content: flex-end; } +.imageViewerZoom { + position: absolute; + width: 100%; + height: 100%; + background: #cccccc; + top: 0; + display: block; + overflow: hidden; +} +.imageViewerZoom .container { + width: 100%; + height: 100%; + cursor: -webkit-grab; +} +.imageViewerZoom .loading { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background: #cccccc; + display: flex; + align-items: center; + text-align: center; + font-size: 4em; + justify-content: center; + cursor: wait; + color: #4b4b4b; +} +.imageViewerZoom img { + position: absolute; + user-drag: none; + -webkit-user-drag: none; + box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); +} +.imageViewerZoom::-webkit-scrollbar { + width: 4px; + height: 4px; + background-color: transparent; +} +.imageViewerZoom::-webkit-scrollbar-thumb { + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.3); +} +.imageViewerZoom .btngroup_close { + position: absolute; + top: 0; + right: 0; + margin-right: 20px; + margin-top: 20px; +} +.imageViewerZoom .btngroup { + position: absolute; + bottom: 0; + right: 0; + margin-right: 20px; + margin-bottom: 50px; +} +.imageViewerZoom .btngroup button { + margin-top: 20px; +} +.imageViewerZoom .btngroup button.searchminus { + margin-top: 0px; +} +.imageViewerZoom button { + font-size: 20px; + justify-content: center; + display: flex; + background-color: #ffffff; + background-image: linear-gradient(to bottom, #1756ad, #002680); + box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4); + border-radius: 22px; + border: none; + height: 44px; + max-height: 44px; + min-width: 44px; + max-width: 44px; + cursor: pointer; + color: #FFF; + z-index: 1; +} +.imageViewerZoom button:disabled { + background-color: #002680 !important; + filter: grayscale(100%); +} +.imageViewerZoom button > img { + height: 22px; + margin: auto; + display: block; +} +.imageViewerZoom button > img.h-20 { + height: 20px; +} +.imageViewerZoom button > img.h-24 { + height: 24px; +} +.imageViewerZoom button .machine-info small { + display: block; + text-align: left; + margin-left: 5px; + font-family: 'Work Sans', sans-serif; + font-size: 11px; +} +.imageViewerZoom button.red { + background-color: #d0021b; + color: white; + box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4), inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); +} +.imageViewerZoom button.blue { + background-color: #1791ff; + color: white; +} +.imageViewerZoom button.dark-blue { + background-color: #002680; + color: white; +} +.imageViewerZoom button.dark-blue:active { + background-color: #1791ff; +} +.imageViewerZoom button.gray { + background-color: #4b4b4b; + color: white; +} +.imageViewerZoom button.profile { + width: 44px; + color: #000; +} +.imageViewerZoom button.profile.colorWhite { + color: #FFF; +} +.imageViewerZoom button.unclickable { + cursor: default; +} +.imageViewerZoom input[type=range] { + -webkit-appearance: none; + margin: 18px 0; + width: 200px; + transform: rotate(-90deg); + margin-top: 200px; +} +.imageViewerZoom input[type=range]:focus { + outline: none; +} +.imageViewerZoom input[type=range]::-webkit-slider-runnable-track { + width: 100%; + height: 9px; + cursor: pointer; + background: #979797; + border-radius: 4px; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4); +} +.imageViewerZoom input[type=range]::-webkit-slider-thumb { + height: 30px; + width: 30px; + border-radius: 15px; + background-color: #ffffff; + background-image: linear-gradient(to left, #1756ad, #002680); + box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.4); + cursor: pointer; + -webkit-appearance: none; + margin-top: -10px; +} +.imageViewerZoom .rangecontainer { + height: 257px; + width: 44px; + overflow: hidden; +} +.imageViewerZoom .rangecontainer .range { + position: absolute; + top: -15px; + left: -79px; +} +.imageViewerZoom:active { + cursor: -webkit-grabbing; +} .popup { width: 288px; height: 218px; @@ -6881,11 +6807,25 @@ footer .container button.big:before { height: 335px; margin: 0px 18px 0 18px; } -.card-job-production .card-job-production-body .card-job-production-body-top img { +.card-job-production .card-job-production-body .card-job-production-body-top .container { + margin: auto; + overflow: visible; + position: relative; + cursor: pointer; +} +.card-job-production .card-job-production-body .card-job-production-body-top .container img { + display: block; max-height: 315px; box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.4); max-width: 100%; } +.card-job-production .card-job-production-body .card-job-production-body-top .container .eye { + position: absolute; + bottom: 2px; + right: 10px; + font-size: 25px; + color: #002680; +} .card-job-production .card-job-production-body .card-job-production-body-top .noimage { display: flex; align-items: center; diff --git a/Step/wwwroot/src/app_modules/production/components/card-job-production.ts b/Step/wwwroot/src/app_modules/production/components/card-job-production.ts index 8ed2a0ea..c6b0a005 100644 --- a/Step/wwwroot/src/app_modules/production/components/card-job-production.ts +++ b/Step/wwwroot/src/app_modules/production/components/card-job-production.ts @@ -1,11 +1,11 @@ import Vue from "vue"; import cardProductionSectionFile from "./card-production-section-file.vue"; import moment from "moment"; - import { fileService, FileService } from "src/services/fileService"; - import Component from "vue-class-component"; import { Prop, Watch } from "vue-property-decorator"; +import { ModalHelper,Modal } from "src/components/modals"; +import { ModalImage } from "src/modules/base-components/index"; @Component({ components: { @@ -92,6 +92,12 @@ export default class CardJobProduction extends Vue { selectRow(row) { this.rowSelected = row; } + zoomImage() { + ModalHelper.modalImage.content = this.currentProgramImage; + ModalHelper.modalImage.title = this.currentProgramName; + ModalHelper.ShowModal(ModalImage); + + } async deactivateProgram() { await fileService.deactivateProgram(); } diff --git a/Step/wwwroot/src/app_modules/production/components/card-job-production.vue b/Step/wwwroot/src/app_modules/production/components/card-job-production.vue index b2d17733..f275f6ef 100644 --- a/Step/wwwroot/src/app_modules/production/components/card-job-production.vue +++ b/Step/wwwroot/src/app_modules/production/components/card-job-production.vue @@ -16,7 +16,12 @@
- + +
+ +
+
+
{{'modal_load_program_lbl_img_not_found' | localize('Preview non disponibile')}}
diff --git a/Step/wwwroot/src/modules/base-components/modal-image.vue b/Step/wwwroot/src/modules/base-components/modal-image.vue index 7daa8a54..67b70ea7 100644 --- a/Step/wwwroot/src/modules/base-components/modal-image.vue +++ b/Step/wwwroot/src/modules/base-components/modal-image.vue @@ -1,17 +1,16 @@