Egalware/cms_thermo_active
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

block drop program running and finished

Browse Source
This commit is contained in:
Alessandro Francia
2018-09-18 15:07:51 +02:00
parent 250d880174
commit 2d0795dbcd
3 changed files with 169 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/card.less
+69
View File
@@ -1059,6 +1059,75 @@
width: 100%;
display: flex;
flex-flow: column;
.queue-header{
height: 64px;
width: 100%;
.tab-box {
height: 64px;
width: 100%;
background-color: @color-whitethree;
display: flex;
flex-direction: row;
border: none !important;
.tab {
flex-grow: 0;
flex-shrink: 0;
float: left !important;
width: 256px !important;
height: 100% !important;
margin: 0 !important;
padding: 0;
border: none !important;
border-right: solid 1px @color-label-grey !important;
background-color: @color-whitethree;
font-size: 18px !important;
line-height: 1 !important;
color: @color-greyish-brown !important;
position: relative;
&.plus {
border-right: none !important;
.btn {
float: left !important;
margin: 0;
width: 48px;
height: 48px;
position: absolute;
top: calc(~"50% - 24px");
margin-left: 20px;
padding: 0;
.fa {
vertical-align: middle;
font-size: 21px;
}
}
}
}
.tab:last-child {
border-right: none !important;
}
.active {
background-color: @color-white;
border-top: solid 2px @color-clear-blue !important;
}
.tab-box-scroll {
width: 100%;
overflow-y: hidden;
overflow-x: auto;
display: flex;
flex-direction: row;
flex-basis: auto;
&::-webkit-scrollbar {
width: 5px;
height: 5px;
}
&::-webkit-scrollbar-thumb {
border-radius: 5px;
height: 1px;
background-color: rgba(0, 0, 0, 0.3);
}
}
}
}
.queue-body{
height: calc(~'100% - 63px');
width: calc(~'100% - 16px');
Step/wwwroot/assets/styles/style.css
+69
View File
@@ -6104,6 +6104,75 @@ footer .container button.big:before {
display: flex;
flex-flow: column;
}
.card-queue-production .card-queue-production-body .queue-header {
height: 64px;
width: 100%;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box {
height: 64px;
width: 100%;
background-color: #e7e7e7;
display: flex;
flex-direction: row;
border: none !important;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab {
flex-grow: 0;
flex-shrink: 0;
float: left !important;
width: 256px !important;
height: 100% !important;
margin: 0 !important;
padding: 0;
border: none !important;
border-right: solid 1px #979797 !important;
background-color: #e7e7e7;
font-size: 18px !important;
line-height: 1 !important;
color: #4b4b4b !important;
position: relative;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab.plus {
border-right: none !important;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab.plus .btn {
float: left !important;
margin: 0;
width: 48px;
height: 48px;
position: absolute;
top: calc(50% - 24px);
margin-left: 20px;
padding: 0;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab.plus .btn .fa {
vertical-align: middle;
font-size: 21px;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab:last-child {
border-right: none !important;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .active {
background-color: #fff;
border-top: solid 2px #1791ff !important;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab-box-scroll {
width: 100%;
overflow-y: hidden;
overflow-x: auto;
display: flex;
flex-direction: row;
flex-basis: auto;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab-box-scroll::-webkit-scrollbar {
width: 5px;
height: 5px;
}
.card-queue-production .card-queue-production-body .queue-header .tab-box .tab-box-scroll::-webkit-scrollbar-thumb {
border-radius: 5px;
height: 1px;
background-color: rgba(0, 0, 0, 0.3);
}
.card-queue-production .card-queue-production-body .queue-body {
height: calc(100% - 63px);
width: calc(100% - 16px);
Step/wwwroot/src/modules/base-components/cards/card-queue-production.vue
+31 -9
View File
@@ -12,9 +12,21 @@
</div>
</div>
<div class="card-queue-production-body">
<div class="queue-body scrollable">
<div class="queue-header">
<div class="tab-box">
<div class="tab-box-scroll">
<button class="tab" :class="{'active': selectedTab == 'Sinistra'}" @click="selectTab('Sinistra')">
<span>Sinistra</span>
</button>
<button class="tab" :class="{'active': selectedTab == 'Destra'}" @click="selectTab('Destra')">
<span>Destra</span>
</button>
</div>
</div>
</div>
<div class="queue-body scrollable" v-if="selectedTab == 'Sinistra'">
<Container @drag-start="onDrag" @drag-end="onDragEnd" @drop="changePosition($event)" :get-child-payload="getPayloadForItemQueue">
<Draggable v-for="pp in partPrograms" :key="pp.id" >
<Draggable v-for="pp in partPrograms" :key="pp.id">
<div class="element-queue">
<label class="number">{{pp.id}}</label><card-element-queue @click="deleteItemQueue(selectedProcess, pp)" :selected-process="selectedProcess" :id-part-program="pp.id" :name="pp.partProgramName" :number="pp.reps" :remaining-reps="pp.remainingReps" :status="pp.status" :vertical-index="selectedPositionTop" @position="positionBoxReps"></card-element-queue>
</div>
@@ -43,7 +55,7 @@ import cardElementQueue from "./card-element-queue.vue";
import {ModalHelper} from "src/modules/base-components";
import modalAddElementQueue from "src/modules/base-components/modal-add-element-queue.vue"
import { FileService } from '../../../services/fileService';
import { Container, Draggable } from "vue-smooth-dnd";
import { Container, Draggable, } from "vue-smooth-dnd";
export default {
components:{
cardElementQueue, Container, Draggable
@@ -57,7 +69,8 @@ export default {
draggingItem: null,
draggingPosition: null,
itemStatusRunning: null,
selectedPositionTop: 0
selectedPositionTop: 0,
selectedTab: "Sinistra"
}
},
computed: {
@@ -105,17 +118,26 @@ export default {
this.draggingPosition = null;
},
async changePosition(event){
this.draggingIn = false;
this.draggingItem = null;
this.partPrograms.splice(event.addedIndex, 0, this.partPrograms.splice(event.removedIndex,1)[0]);
var itemsPositions = {objectId: event.payload.id, newPosition: event.addedIndex};
await new FileService().moveItemsQueue(this.selectedProcess,itemsPositions,this.partPrograms);
debugger
if(event.payload.status != 1 && event.payload.status != 3){
this.draggingIn = false;
this.draggingItem = null;
this.partPrograms.splice(event.addedIndex, 0, this.partPrograms.splice(event.removedIndex,1)[0]);
var itemsPositions = {objectId: event.payload.id, newPosition: event.addedIndex};
await new FileService().moveItemsQueue(this.selectedProcess,itemsPositions,this.partPrograms);
}
else{
event = null;
}
},
getPayloadForItemQueue(index){
return this.partPrograms[index];
},
positionBoxReps(arg1, arg2){
this.selectedPositionTop = (arg1.offsetTop + 78);
},
selectTab(value){
this.selectedTab = value;
}
}