diff --git a/Libs/CMS_CORE_Library.dll b/Libs/CMS_CORE_Library.dll index bf40bc19..b5c3803c 100644 Binary files a/Libs/CMS_CORE_Library.dll and b/Libs/CMS_CORE_Library.dll differ diff --git a/Step.Config/Config/userSoftKeyConfig.xml b/Step.Config/Config/userSoftKeyConfig.xml index 73271d8f..7789f8eb 100644 --- a/Step.Config/Config/userSoftKeyConfig.xml +++ b/Step.Config/Config/userSoftKeyConfig.xml @@ -1,5 +1,15 @@  + + true + 1 + true + 1 + + Test + Ita + + true 1 @@ -13,7 +23,7 @@ true 1 - false + true Test Ita @@ -85,14 +95,16 @@ 1 - 1 - 1 - 1 + 2 + 3 + 4 + 5 + 6 true - 2 + 3 false Test @@ -100,32 +112,32 @@ 1 - 1 - 1 - 1 - 1 + 2 + 3 + 4 + 5 true - 2 + 3 false Test Ita - 1 - 1 - 1 - 1 - 1 - 1 + A + B + C + D + E + V true - 1 + 3 true 1 @@ -133,4 +145,289 @@ Ita + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + false + + Test + Ita + + + A + B + C + D + E + V + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + true + 1 + + Test + Ita + + + + true + 3 + false + + Test + Ita + + + A + B + C + D + E + V + + + \ No newline at end of file diff --git a/Step/wwwroot/assets/styles/base/buttons.less b/Step/wwwroot/assets/styles/base/buttons.less index 0acb0006..b83d5d65 100644 --- a/Step/wwwroot/assets/styles/base/buttons.less +++ b/Step/wwwroot/assets/styles/base/buttons.less @@ -62,7 +62,11 @@ button.btn { background-color: @color-blue; color: white; } - + + &.btn-danger{ + color:@color-scarlet; + } + button.dark-blue:active { background-color: @color-darkish-blue-two; } @@ -185,7 +189,7 @@ button.soft { filter: grayscale(100%) invert(100) saturate(200); } } - &:active{ + &:active{ background-image: linear-gradient(to bottom, @color-silver, #f1f1f1); box-shadow: inset 0px 0px 3px 0px rgba(0, 0, 0, 0.5); } @@ -303,7 +307,7 @@ fieldset[disabled] .form-group.is-focused .togglebutton label { .togglebutton label input[type=checkbox]+.toggle:active:after, .togglebutton label input[type=checkbox][disabled]+.toggle:active:after { - box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.6), 0 0 0 20px rgba(0, 0, 0, 0.2); } .togglebutton label input[type=checkbox]:checked+.toggle:after { diff --git a/Step/wwwroot/assets/styles/base/layout.less b/Step/wwwroot/assets/styles/base/layout.less index 857f63c7..1ab4a4e0 100644 --- a/Step/wwwroot/assets/styles/base/layout.less +++ b/Step/wwwroot/assets/styles/base/layout.less @@ -15,6 +15,7 @@ @import "keypad.less"; @import "back-view.less"; @import "head.less"; +<<<<<<< HEAD @import "tooling.less"; @import "card.less"; @import "depot.less"; @@ -26,6 +27,13 @@ @import "equipment.less"; @import "skill-equipment.less"; @import "load-equipment.less"; +======= +// @import "tooling.less"; +// @import "card.less"; +// @import "depot.less"; +// @import "tool.less"; +// @import "detail-card.less"; +>>>>>>> 47dcfdc72f69746b3432660c7bb6c11272512e5e @background-color: rgb(216, 216, 216); @handle-width: 48px; diff --git a/Step/wwwroot/assets/styles/base/plc-softkeys.less b/Step/wwwroot/assets/styles/base/plc-softkeys.less index 7d2bf4fc..76b8c40c 100644 --- a/Step/wwwroot/assets/styles/base/plc-softkeys.less +++ b/Step/wwwroot/assets/styles/base/plc-softkeys.less @@ -16,16 +16,45 @@ background-image: linear-gradient(to bottom, #657178, #657178 65px, #404040); box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4); border-radius: 2px; - - .softkeys-backdrop{ - position:absolute; - top:0; - left: 0; - right: 0; - bottom: 0; - z-index:1; - background-color: rgba(255, 255, 255, 0.2); + .softkeys-backdrop, + .softkeys-backdrop-top, + .softkeys-backdrop-left, + .softkeys-backdrop-right, + .softkeys-backdrop-bottom { + position: absolute; + z-index: 1; + background-color: rgba(255, 255, 255, 0.5); } + .softkeys-backdrop { + top: 0; + left: 0; + right: 0; + bottom: 0; + } + // .softkeys-backdrop-top { + // top: 0; + // left: 0; + // width: 100%; + // height: 108px; + // } + // .softkeys-backdrop-left { + // top: 108px; + // left: 0; + // bottom: 16px; + // width: 4px; + // } + // .softkeys-backdrop-right { + // top: 108px; + // right: 0; + // bottom: 16px; + // width: 24px; + // } + // .softkeys-backdrop-bottom { + // bottom: 0; + // left: 0; + // width: 100%; + // height: 16px; + // } &>div.waiting::after { content: ""; display: block; @@ -33,22 +62,26 @@ top: 0; right: 0; left: 0; - bottom: 0; + bottom: 72px; cursor: wait; - background-color: rgba(255, 255, 255, 0.2); - width: 100%; - height: 100%; + background-color: rgba(255, 255, 255, 0.5); + width: 100%; // height: 100%; } &>div.waiting-button { display: none; &.waiting { - display: block; + display: flex; position: absolute; + justify-content: space-between; + align-items: center; bottom: 0; - width: 100%; + width: calc(~"100% - 60px"); height: 72px; background-color: #002680; z-index: 100; + color: #fff; + font-size: 24px; + padding: 0 30px; } } &>div.container { @@ -64,7 +97,7 @@ flex-grow: 1; border: none; background: @color-gunmetal; - border: 0.5px solid @color-slate-gray; + border: 1px solid @color-slate-gray; border-top: none; border-bottom: none; position: relative; @@ -92,6 +125,9 @@ color: white; font-size: 12px; } + &:active:not(.active) { + background-color: @color-black-50; + } } } .title { @@ -111,10 +147,8 @@ height: calc(~"100% - 124px"); overflow: hidden; overflow-y: scroll; - margin-right: 8px; - // position: relative; - overflow-x: visible; - transform: translateZ(0); + margin-right: 8px; // position: relative; + // transform: translateZ(0); } } @@ -135,27 +169,28 @@ cursor: not-allowed; } &.selected { - border: 2px solid rgba(23, 145, 255, 0.75); + box-shadow: inset 0px 0px 0px 2px rgba(23, 145, 255, 0.75); .detail section { height: 42px; } } - - &.opened{ - border: 2px solid #4b4b4b; - position: absolute; - z-index: 4; - .detail section { - height: 42px; + &.opened { + border: 2px solid #4b4b4b; // position: absolute; + z-index: 4; + .detail section { + height: 42px; + } } - } - position: relative; width: 184px; height: 70px; margin: 4px; box-sizing: border-box; background-color: @color-bluish-grey; + -webkit-tap-highlight-color: transparent; + &.command { + border: solid 3px @color-bluish-grey; + } .menu-container { width: 360px; top: 80px; @@ -165,8 +200,41 @@ justify-content: center; z-index: 100; transform: translateZ(0); + &.top { + top: -80px; + .menu::before { + content: "\f0d7"; + color: #4b4b4b; + position: absolute; + left: calc(~"50% - 11px"); + top: 47px; + font-family: 'fontawesome'; + font-size: 38px; + } + } + &.left{ + + left: -2px; + justify-content: flex-start; + } + &.right{ + left: -176px; + justify-content: flex-end; + } + &.bottom { + .menu::before { + content: "\f0d8"; + color: #4b4b4b; + position: absolute; + left: calc(~"50% - 11px"); + top: -26px; + font-family: 'fontawesome'; + font-size: 38px; + } + } .menu { background-color: #4b4b4b; + position: relative; padding: 7px; button { background-image: linear-gradient(to bottom, #5f676b, #4e585e); @@ -176,11 +244,30 @@ font-size: 20px; color: #fff; border: none; - &.active, - &:active { + position: relative; + &.active { background-image: none; background-color: #1791ff; } + &:active { + background-image: none; + background-color: @color-black-50; + } + &.active:active { + background-image: none; + background-color: @color-black-50; + } + &.disabled::after, + &:disabled::after { + content: " "; + position: absolute; + display: block; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(255, 255, 255, 0.5); + } } } } @@ -191,11 +278,10 @@ font-size: 14px; line-height: 21px; border-bottom: 1px solid #fff; - border-bottom: 1px solid #fff; box-sizing: content-box; } &.active { - border: 3px solid @color-clear-blue; + border: solid 3px rgba(23, 145, 255, 1); } button.star { background: transparent; @@ -229,7 +315,14 @@ margin-top: -1px; height: 46px; overflow-x: visible; - transform: translateZ(0); + // transform: translateZ(0); + &.description { + cursor: pointer; + margin-top: 0; + } + &.description:active { + background-color: #4e585e; + } &.toggle { align-items: center; justify-content: center; @@ -237,6 +330,12 @@ &.multiple { border: 0.5px solid #fff; cursor: pointer; + &:active { + background-color: #4e585e; + } + &:active span.active { + background-color: #4e585e; + } span { display: flex; background: transparent; @@ -249,7 +348,25 @@ box-sizing: border-box; border: 0.5px solid #fff; align-items: center; + position: relative; justify-content: center; + &.active { + background-color: #1791ff; + } + &.active:active { + background-color: #4e585e; + } + &.disabled::after { + content: " "; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + height: 100%; + width: 100%; + background: rgba(255, 255, 255, 0.5); + } } } } @@ -278,7 +395,8 @@ } } -.jog-menu, .auto-menu { +.jog-menu, +.auto-menu { // width: 100%; // height: 64px; background-color: @color-gunmetal; @@ -297,8 +415,7 @@ font-family: 'fontawesome'; font-size: 38px; } - - .axes-menu-container > .menu > button{ + .axes-menu-container>.menu>button { background-image: linear-gradient(to bottom, #5f676b, #4e585e); min-width: 48px; height: 48px; @@ -314,8 +431,7 @@ background-color: #1791ff; } } - - .incr-menu-container > .menu > button{ + .incr-menu-container>.menu>button { background-image: linear-gradient(to bottom, #5f676b, #4e585e); min-width: 48px; max-width: 48px; @@ -326,13 +442,19 @@ border: none; padding: 0; overflow: hidden; - &.active, - &:active { + &.active { background-image: none; background-color: #1791ff; } + &:active { + background-image: none; + background-color: @color-black-50; + } + &.active:active { + background-image: none; + background-color: @color-black-50; + } } - .axes-menu-container, .incr-menu-container { width: 360px; @@ -340,7 +462,7 @@ display: flex; justify-content: center; z-index: 100; - transform: translateZ(0); + // transform: translateZ(0); .menu { background-color: #4b4b4b; padding: 7px; @@ -358,16 +480,16 @@ .incr-menu-container { top: 75px; left: 340px; - &:before{ - left: 164px; + &:before { + left: 164px; } } .axes-menu-container { top: 75px; left: 0; justify-content: left; - &:before{ - left: 23px; + &:before { + left: 23px; } } } diff --git a/Step/wwwroot/assets/styles/style.css b/Step/wwwroot/assets/styles/style.css index 66e836ad..fd9ba1f1 100644 --- a/Step/wwwroot/assets/styles/style.css +++ b/Step/wwwroot/assets/styles/style.css @@ -330,6 +330,9 @@ button.btn.dark-blue { background-color: #002680; color: white; } +button.btn.btn-danger { + color: #d0021b; +} button.btn button.dark-blue:active { background-color: #004990; } @@ -545,7 +548,7 @@ fieldset[disabled] .form-group.is-focused .togglebutton label { } .togglebutton label input[type=checkbox] + .toggle:active:after, .togglebutton label input[type=checkbox][disabled] + .toggle:active:after { - box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1); + box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.6), 0 0 0 20px rgba(0, 0, 0, 0.2); } .togglebutton label input[type=checkbox]:checked + .toggle:after { left: 48px; @@ -1490,14 +1493,20 @@ footer .container button.big:before { box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4); border-radius: 2px; } -#plc-softkeys-container .softkeys-backdrop { +#plc-softkeys-container .softkeys-backdrop, +#plc-softkeys-container .softkeys-backdrop-top, +#plc-softkeys-container .softkeys-backdrop-left, +#plc-softkeys-container .softkeys-backdrop-right, +#plc-softkeys-container .softkeys-backdrop-bottom { position: absolute; + z-index: 1; + background-color: rgba(255, 255, 255, 0.5); +} +#plc-softkeys-container .softkeys-backdrop { top: 0; left: 0; right: 0; bottom: 0; - z-index: 1; - background-color: rgba(255, 255, 255, 0.2); } #plc-softkeys-container > div.waiting::after { content: ""; @@ -1506,23 +1515,27 @@ footer .container button.big:before { top: 0; right: 0; left: 0; - bottom: 0; + bottom: 72px; cursor: wait; - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(255, 255, 255, 0.5); width: 100%; - height: 100%; } #plc-softkeys-container > div.waiting-button { display: none; } #plc-softkeys-container > div.waiting-button.waiting { - display: block; + display: flex; position: absolute; + justify-content: space-between; + align-items: center; bottom: 0; - width: 100%; + width: calc(100% - 60px); height: 72px; background-color: #002680; z-index: 100; + color: #fff; + font-size: 24px; + padding: 0 30px; } #plc-softkeys-container > div.container { width: 100%; @@ -1538,7 +1551,7 @@ footer .container button.big:before { flex-grow: 1; border: none; background: #4e585e; - border: 0.5px solid #5c656b; + border: 1px solid #5c656b; border-top: none; border-bottom: none; position: relative; @@ -1567,6 +1580,9 @@ footer .container button.big:before { color: white; font-size: 12px; } +#plc-softkeys-container > div > header button:active:not(.active) { + background-color: rgba(0, 0, 0, 0.5); +} #plc-softkeys-container .title { height: 40px; display: flex; @@ -1585,8 +1601,6 @@ footer .container button.big:before { overflow: hidden; overflow-y: scroll; margin-right: 8px; - overflow-x: visible; - transform: translateZ(0); } .soft-key { position: relative; @@ -1595,6 +1609,7 @@ footer .container button.big:before { margin: 4px; box-sizing: border-box; background-color: #808e96; + -webkit-tap-highlight-color: transparent; } .soft-key.disabled::after, .soft-key:disabled::after { @@ -1609,19 +1624,21 @@ footer .container button.big:before { cursor: not-allowed; } .soft-key.selected { - border: 2px solid rgba(23, 145, 255, 0.75); + box-shadow: inset 0px 0px 0px 2px rgba(23, 145, 255, 0.75); } .soft-key.selected .detail section { height: 42px; } .soft-key.opened { border: 2px solid #4b4b4b; - position: absolute; z-index: 4; } .soft-key.opened .detail section { height: 42px; } +.soft-key.command { + border: solid 3px #808e96; +} .soft-key .menu-container { width: 360px; top: 80px; @@ -1632,8 +1649,38 @@ footer .container button.big:before { z-index: 100; transform: translateZ(0); } +.soft-key .menu-container.top { + top: -80px; +} +.soft-key .menu-container.top .menu::before { + content: "\f0d7"; + color: #4b4b4b; + position: absolute; + left: calc(50% - 11px); + top: 47px; + font-family: 'fontawesome'; + font-size: 38px; +} +.soft-key .menu-container.left { + left: -2px; + justify-content: flex-start; +} +.soft-key .menu-container.right { + left: -176px; + justify-content: flex-end; +} +.soft-key .menu-container.bottom .menu::before { + content: "\f0d8"; + color: #4b4b4b; + position: absolute; + left: calc(50% - 11px); + top: -26px; + font-family: 'fontawesome'; + font-size: 38px; +} .soft-key .menu-container .menu { background-color: #4b4b4b; + position: relative; padding: 7px; } .soft-key .menu-container .menu button { @@ -1644,12 +1691,31 @@ footer .container button.big:before { font-size: 20px; color: #fff; border: none; + position: relative; } -.soft-key .menu-container .menu button.active, -.soft-key .menu-container .menu button:active { +.soft-key .menu-container .menu button.active { background-image: none; background-color: #1791ff; } +.soft-key .menu-container .menu button:active { + background-image: none; + background-color: rgba(0, 0, 0, 0.5); +} +.soft-key .menu-container .menu button.active:active { + background-image: none; + background-color: rgba(0, 0, 0, 0.5); +} +.soft-key .menu-container .menu button.disabled::after, +.soft-key .menu-container .menu button:disabled::after { + content: " "; + position: absolute; + display: block; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(255, 255, 255, 0.5); +} .soft-key header { height: 23px; text-align: center; @@ -1660,7 +1726,7 @@ footer .container button.big:before { box-sizing: content-box; } .soft-key.active { - border: 3px solid #1791ff; + border: solid 3px #1791ff; } .soft-key button.star { background: transparent; @@ -1694,7 +1760,13 @@ footer .container button.big:before { margin-top: -1px; height: 46px; overflow-x: visible; - transform: translateZ(0); +} +.soft-key .detail section.description { + cursor: pointer; + margin-top: 0; +} +.soft-key .detail section.description:active { + background-color: #4e585e; } .soft-key .detail section.toggle { align-items: center; @@ -1704,6 +1776,12 @@ footer .container button.big:before { border: 0.5px solid #fff; cursor: pointer; } +.soft-key .detail section.multiple:active { + background-color: #4e585e; +} +.soft-key .detail section.multiple:active span.active { + background-color: #4e585e; +} .soft-key .detail section.multiple span { display: flex; background: transparent; @@ -1716,8 +1794,26 @@ footer .container button.big:before { box-sizing: border-box; border: 0.5px solid #fff; align-items: center; + position: relative; justify-content: center; } +.soft-key .detail section.multiple span.active { + background-color: #1791ff; +} +.soft-key .detail section.multiple span.active:active { + background-color: #4e585e; +} +.soft-key .detail section.multiple span.disabled::after { + content: " "; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + height: 100%; + width: 100%; + background: rgba(255, 255, 255, 0.5); +} #nc-softkeys-container { width: 312px; height: 216px; @@ -1792,11 +1888,19 @@ footer .container button.big:before { overflow: hidden; } .jog-menu .incr-menu-container > .menu > button.active, -.auto-menu .incr-menu-container > .menu > button.active, +.auto-menu .incr-menu-container > .menu > button.active { + background-image: none; + background-color: #1791ff; +} .jog-menu .incr-menu-container > .menu > button:active, .auto-menu .incr-menu-container > .menu > button:active { background-image: none; - background-color: #1791ff; + background-color: rgba(0, 0, 0, 0.5); +} +.jog-menu .incr-menu-container > .menu > button.active:active, +.auto-menu .incr-menu-container > .menu > button.active:active { + background-image: none; + background-color: rgba(0, 0, 0, 0.5); } .jog-menu .axes-menu-container, .auto-menu .axes-menu-container, @@ -1807,7 +1911,6 @@ footer .container button.big:before { display: flex; justify-content: center; z-index: 100; - transform: translateZ(0); } .jog-menu .axes-menu-container .menu, .auto-menu .axes-menu-container .menu, @@ -2377,6 +2480,7 @@ footer .container button.big:before { .heads-container-lt4 { right: -12px; } +<<<<<<< HEAD .tooling-container { height: 100%; width: 100%; @@ -3206,6 +3310,8 @@ footer .container button.big:before { .load-equipment .arrow .fa-arrow-down { color: #DC4557; } +======= +>>>>>>> 47dcfdc72f69746b3432660c7bb6c11272512e5e .persona { height: 88px; width: 88px; diff --git a/Step/wwwroot/src/app.business-logic.ts b/Step/wwwroot/src/app.business-logic.ts index 923da4b1..d7ae2cd4 100644 --- a/Step/wwwroot/src/app.business-logic.ts +++ b/Step/wwwroot/src/app.business-logic.ts @@ -158,6 +158,7 @@ if (typeof cmsClient != "undefined") { }); + /* Factory.Get(MessageService).subscribeToChannel("HMI-end-render", args => { clearTimeout(RerenderInterval); RerenderInterval = setTimeout(ElaborateHMIStatus, 15); @@ -229,3 +230,50 @@ function ElaborateHMIStatus() { cmsClient.setNcWindowState(0); } } + + + +// Enable/Disable Scrollers +Factory.Get(MessageService).subscribeToChannel("disable-scroll", (args) => { + disableScroll(args[0]); +}); +Factory.Get(MessageService).subscribeToChannel("enable-scroll", (args) => { + enableScroll(args[0]); +}); +// Scroll manipulation +var keys = { 37: 1, 38: 1, 39: 1, 40: 1 }; + +function preventDefault(e) { + e = e || window.event; + if (e.preventDefault) + e.preventDefault(); + e.returnValue = false; +} + +function preventDefaultForScrollKeys(e) { + if (keys[e.keyCode]) { + preventDefault(e); + return false; + } + return true; +} + +function disableScroll(element) { + debugger + if (element.addEventListener) // older FF + element.addEventListener('DOMMouseScroll', preventDefault, false); + element.onwheel = preventDefault; // modern standard + element.onmousewheel = document.onmousewheel = preventDefault; // older browsers, IE + element.ontouchmove = preventDefault; // mobile + element.onkeydown = preventDefaultForScrollKeys; +} + +function enableScroll(element) { + debugger + if (element.removeEventListener) + element.removeEventListener('DOMMouseScroll', preventDefault, false); + element.onmousewheel = document.onmousewheel = null; + element.onwheel = null; + element.ontouchmove = null; + element.onkeydown = null; +} diff --git a/Step/wwwroot/src/filters/longpress.ts b/Step/wwwroot/src/filters/longpress.ts new file mode 100644 index 00000000..a2740fe5 --- /dev/null +++ b/Step/wwwroot/src/filters/longpress.ts @@ -0,0 +1,9 @@ +import Vue from "vue"; + + +Vue.directive("longpress", { + bind: function (el, binding, vnode) { + + } +}); + diff --git a/Step/wwwroot/src/modules/nc-softkeys.vue b/Step/wwwroot/src/modules/nc-softkeys.vue index 0fb891ea..98ef6714 100644 --- a/Step/wwwroot/src/modules/nc-softkeys.vue +++ b/Step/wwwroot/src/modules/nc-softkeys.vue @@ -70,7 +70,6 @@ export default { return false; }, isKeyActive(id) { - if(this.checkSecurityDisabled('ncSoftkeys')) return false; let r = this.$store.getters.getNcSoftKeyStatus(id); diff --git a/Step/wwwroot/src/modules/plc-softkeys.ts b/Step/wwwroot/src/modules/plc-softkeys.ts index 28dbdcc8..3739c708 100644 --- a/Step/wwwroot/src/modules/plc-softkeys.ts +++ b/Step/wwwroot/src/modules/plc-softkeys.ts @@ -4,6 +4,7 @@ import { onOffSoftKey, procedureSoftKey, groupSoftKey } from "./under-the-hood" import { AppModel } from "../store"; import { Hub } from "src/services/hub"; import { mapGetters } from 'vuex' +import { Factory, MessageService } from "src/_base"; @Componet({ components: { onOffSoftKey, procedureSoftKey, groupSoftKey } @@ -16,8 +17,9 @@ export default class softKeys extends Vue { public waitingForStart: boolean = false; public disabled: boolean = false; - public selectedPositionTop: string = "0"; - public selectedPositionLeft: string = "0"; + public selectedPositionTop: number = 0; + + private confirmationDelegate: Function = null; public selectSection(value: number) { this.selectedSection = value; @@ -30,6 +32,14 @@ export default class softKeys extends Vue { return false; } + public getSubKeysStatus(keys: object): object { + let result = {}; + for (const key in keys) { + result[key] = this.getSoftKeyStatus(key as any); + } + return result; + } + public getSoftKeyActive(id: number): boolean { var sk = this.$store.getters.getSoftKeyStatus(id); if (sk) @@ -37,6 +47,14 @@ export default class softKeys extends Vue { return false; } + public getSubKeysActive(keys: object): object { + let result = {}; + for (const key in keys) { + result[key] = this.getSoftKeyActive(key as any); + } + return result; + } + public isSectionVisible(value: number) { return (this.$store.state as AppModel).machineInfo.softKeys[value] != null; } @@ -49,19 +67,46 @@ export default class softKeys extends Vue { if (this.selectedMenuItem == value.id) { this.selectedMenuItem = null; this.selectedSoftKey = null; + Factory.Get(MessageService).publishToChannel("enable-scroll", this.$refs.scrollable); } else { this.selectedMenuItem = value.id; this.selectedSoftKey = value; + this.$nextTick(() => { if (this.$refs.backdrop) (this.$refs.backdrop as any).focus(); }); + Factory.Get(MessageService).publishToChannel("disable-scroll", this.$refs.scrollable); } } - public setSoftKeyPosition(sk: any) { - this.selectedPositionLeft = sk.offsetLeft + "px"; - this.selectedPositionTop = (sk.offsetTop + 104) + "px"; + public closeBackdrop() { + this.selectedMenuItem = null; + this.selectedSoftKey = null; + Factory.Get(MessageService).publishToChannel("enable-scroll", this.$refs.scrollable); } - public softKeyChanged(id: number) { - Hub.Current.sendUserSoftKey(id); + public setSoftKeyPosition(sk: any) { + this.selectedPositionTop = (sk.offsetTop - (this.$refs.scrollable as any).scrollTop - (this.$refs.scrollable as any).offsetTop - 80); + } + + public softKeyChanged(id: number, confirm: boolean = false) { + if (!confirm) + Hub.Current.sendUserSoftKey(id); + else { + this.confirmationDelegate = () => { + Hub.Current.sendUserSoftKey(id); + }; + this.waitingForStart = true; + } + } + + public sendKeyConfirm() { + if (this.confirmationDelegate) + this.confirmationDelegate(); + this.confirmationDelegate = null; + this.waitingForStart = false; + } + + public sendKeyCancel() { + this.confirmationDelegate = null; + this.waitingForStart = false; } } diff --git a/Step/wwwroot/src/modules/plc-softkeys.vue b/Step/wwwroot/src/modules/plc-softkeys.vue index 55c34b75..9ac46d3b 100644 --- a/Step/wwwroot/src/modules/plc-softkeys.vue +++ b/Step/wwwroot/src/modules/plc-softkeys.vue @@ -11,34 +11,63 @@
{{'maint_' + selectedSection | localize('maint_' + selectedSection) }}
-
- - - +
+ + + +
+
- -
+ :confirmationNeeded="selectedSoftKey.operatorConfirmationNeeded" + @subkeyClick="softKeyChanged"> --> + + +
+ + {{'softkey_confirm' | localize("Confirm?")}} +
+ + + +
-
diff --git a/Step/wwwroot/src/modules/under-the-hood/soft-key1.vue b/Step/wwwroot/src/modules/under-the-hood/soft-key1.vue index 51f2a531..eccce52a 100644 --- a/Step/wwwroot/src/modules/under-the-hood/soft-key1.vue +++ b/Step/wwwroot/src/modules/under-the-hood/soft-key1.vue @@ -2,14 +2,17 @@
{{title}}
- +
- {{getSubKeyText(k)}} + {{getSubKeyText(k)}}
-
+
- +
@@ -18,12 +21,16 @@ export default { props: { starred: { default: false }, - toggleStar: { default: null }, title: { default: "_title_" }, subkeys: {}, + activeSubKeys: {}, + subkeysStatus: {}, menuOpened: { default: false }, - disabled: {default: false}, - selected: { default: false } + positionIndex: { default: 0 }, + verticalIndex:{default:0}, + // disabled: { default: false }, + selected: { default: false }, + confirmationNeeded: { default: false } }, computed: { keys() { @@ -32,9 +39,42 @@ export default { arr.push(key); } return arr; + }, + disabled() { + var _disabled = true; + + if(this.checkSecurityDisabled('userSoftkeys')) return true; + for (const key in this.activeSubKeys) { + if (this.activeSubKeys[key]) _disabled = false; + } + return _disabled; + }, + subkeyslength(){ + var c = 0; + for(const k in this.subkeys) + c++; + return c; } + }, methods: { + menuVerticalPosition(){ + if(this.positionIndex<4) return "bottom"; + return "top"; + }, + menuHorizontalPosition(){ + if(this.positionIndex%4 == 0) return "left"; + if(this.positionIndex%4 == 3) return "right"; + return "center"; + }, + getSoftKeyStatus(id) { + if (this.subkeysStatus) return this.subkeysStatus[id] || false; + return false; + }, + getSoftKeyActive(id) { + if (this.activeSubKeys) return this.activeSubKeys[id] || false; + return false; + }, getSubKeyText(value) { return this.subkeys[value]; }, @@ -43,7 +83,11 @@ export default { this.$emit("position", this.$refs.sk); }, sendSubKey(id) { - this.$emit("subkeyClick", id); + this.$emit("subkeyClick", id, this.confirmationNeeded); + this.toggleMenu(); + }, + toggleStar: function() { + this.$emit("toggleStar"); } } }; diff --git a/Step/wwwroot/src/modules/under-the-hood/soft-key2.vue b/Step/wwwroot/src/modules/under-the-hood/soft-key2.vue index b61ba58c..a86ad766 100644 --- a/Step/wwwroot/src/modules/under-the-hood/soft-key2.vue +++ b/Step/wwwroot/src/modules/under-the-hood/soft-key2.vue @@ -1,11 +1,11 @@