fix drag box reps
This commit is contained in:
@@ -904,42 +904,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
& .popup{
|
||||
position: absolute;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
top: 78px;
|
||||
left: 60px;
|
||||
.edit-reps{
|
||||
width: 100%;
|
||||
height: calc(~'100% - 26px');;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
// &:before {
|
||||
// content: "\f0d8";
|
||||
// color: @color-silver;
|
||||
// position: absolute;
|
||||
// top: -26px;
|
||||
// left: calc(~'50% - 10px');
|
||||
// font-family: 'fontawesome';
|
||||
// font-size: 38px;
|
||||
// }
|
||||
.group-button{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
.btn.btn-success.btn-small{
|
||||
height: 26px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
input{
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.smooth-dnd-draggable-wrapper .element-queue:first-child{
|
||||
margin-top: 3px;
|
||||
@@ -1151,6 +1115,40 @@
|
||||
color: @color-greyish-brown;
|
||||
}
|
||||
}
|
||||
& .popup{
|
||||
position: absolute;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
.edit-reps{
|
||||
width: 100%;
|
||||
height: calc(~'100% - 26px');;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
// &:before {
|
||||
// content: "\f0d8";
|
||||
// color: @color-silver;
|
||||
// position: absolute;
|
||||
// top: -26px;
|
||||
// left: calc(~'50% - 10px');
|
||||
// font-family: 'fontawesome';
|
||||
// font-size: 38px;
|
||||
// }
|
||||
.group-button{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
.btn.btn-success.btn-small{
|
||||
height: 26px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
input{
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.queue-footer{
|
||||
|
||||
@@ -5965,33 +5965,6 @@ footer .container button.big:before {
|
||||
.card-element-queue .card-element-queue-right button.btn i.fa.fa-trash {
|
||||
font-size: 24px;
|
||||
}
|
||||
.card-element-queue .popup {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
top: 78px;
|
||||
left: 60px;
|
||||
}
|
||||
.card-element-queue .popup .edit-reps {
|
||||
width: 100%;
|
||||
height: calc(100% - 26px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.card-element-queue .popup .group-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.card-element-queue .popup .group-button .btn.btn-success.btn-small {
|
||||
height: 26px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.card-element-queue .popup input {
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
}
|
||||
.smooth-dnd-draggable-wrapper .element-queue:first-child {
|
||||
margin-top: 3px;
|
||||
}
|
||||
@@ -6197,6 +6170,31 @@ footer .container button.big:before {
|
||||
font-size: 20px;
|
||||
color: #4b4b4b;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-body .popup {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-body .popup .edit-reps {
|
||||
width: 100%;
|
||||
height: calc(100% - 26px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-body .popup .group-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-body .popup .group-button .btn.btn-success.btn-small {
|
||||
height: 26px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-body .popup input {
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
}
|
||||
.card-queue-production .card-queue-production-body .queue-footer {
|
||||
display: flex;
|
||||
margin: 20px 0 0 8px;
|
||||
|
||||
@@ -16,16 +16,6 @@
|
||||
</div>
|
||||
<button class="btn" @click="onClick()"><i class="fa fa-trash"></i></button>
|
||||
</div>
|
||||
<popup v-if="enablePopup" :style="{top:verticalIndex + 'px'}" :arrow="'arrow-top'" :title="'Modifica ripetizioni'">
|
||||
<button class="close" slot="header-buttons" @click="close()"><i class="fa fa-remove"></i></button>
|
||||
<div class="edit-reps">
|
||||
<label>Ripetizioni</label>
|
||||
<input type="number" v-model.number="numberReps">
|
||||
</div>
|
||||
<div class="group-button">
|
||||
<button class="btn btn-success btn-small" @click="changeReps(numberReps)">Salva</button>
|
||||
</div>
|
||||
</popup>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</template>
|
||||
@@ -39,14 +29,12 @@ export default {
|
||||
number: { default: 2},
|
||||
remainingReps: {default: 0},
|
||||
status: { default: 0},
|
||||
verticalIndex: {default: 0},
|
||||
selectedProcess: { default: 0},
|
||||
idPartProgram: {default: 0}
|
||||
},
|
||||
data: function(){
|
||||
return{
|
||||
enablePopup: false,
|
||||
numberReps: this.number
|
||||
enablePopup: false
|
||||
}
|
||||
},
|
||||
// watch: {
|
||||
@@ -64,16 +52,16 @@ export default {
|
||||
clickReps: function(){
|
||||
debugger
|
||||
this.enablePopup = true;
|
||||
this.$emit("position", this.$el, true);
|
||||
this.$emit("position", this.$el, this.enablePopup, true);
|
||||
},
|
||||
async changeReps(value){
|
||||
console.log(value);
|
||||
await new FileService().changeReps(this.selectedProcess, this.idPartProgram, value)
|
||||
this.enablePopup = false;
|
||||
},
|
||||
close(){
|
||||
this.enablePopup = false;
|
||||
}
|
||||
// close(){
|
||||
// this.enablePopup = false;
|
||||
// }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -28,13 +28,20 @@
|
||||
<Container @drag-start="onDrag" @drag-end="onDragEnd" @drop="changePosition($event)" :get-child-payload="getPayloadForItemQueue">
|
||||
<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>
|
||||
<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" @position="positionBoxReps($event,pp.reps)"></card-element-queue>
|
||||
</div>
|
||||
</Draggable>
|
||||
</Container>
|
||||
<!-- <Container @drag-enter="onDragEnter(pp.id)" @drag-leave="onDragLeave()">
|
||||
|
||||
</Container> -->
|
||||
<popup v-if="enablePopup" :style="{top: selectedPositionTop + 'px'}" :arrow="'arrow-top'" :title="'Modifica ripetizioni'">
|
||||
<button class="close" slot="header-buttons" @click="close()"><i class="fa fa-remove"></i></button>
|
||||
<div class="edit-reps">
|
||||
<label>Ripetizioni</label>
|
||||
<input type="number" v-model.number="numberReps">
|
||||
</div>
|
||||
<div class="group-button">
|
||||
<button class="btn btn-success btn-small" @click="changeReps(numberReps)">Salva</button>
|
||||
</div>
|
||||
</popup>
|
||||
</div>
|
||||
<div class="queue-footer">
|
||||
<label>{{partPrograms.length}} elementi in coda</label>
|
||||
@@ -58,7 +65,7 @@ import { FileService } from '../../../services/fileService';
|
||||
import { Container, Draggable, } from "vue-smooth-dnd";
|
||||
export default {
|
||||
components:{
|
||||
cardElementQueue, Container, Draggable
|
||||
cardElementQueue, Container, Draggable, popup: Popup
|
||||
},
|
||||
mounted: function(){
|
||||
|
||||
@@ -70,7 +77,9 @@ export default {
|
||||
draggingPosition: null,
|
||||
itemStatusRunning: null,
|
||||
selectedPositionTop: 0,
|
||||
selectedTab: "Sinistra"
|
||||
selectedTab: "Sinistra",
|
||||
enablePopup: false,
|
||||
numberReps: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -102,6 +111,7 @@ export default {
|
||||
await new FileService().deleteItemQueue(processId, item);
|
||||
},
|
||||
onDrag({ isSource, payload, willAcceptDrop }) {
|
||||
this.enablePopup = false;
|
||||
this.draggingIn = true;
|
||||
this.draggingItem = payload;
|
||||
},
|
||||
@@ -138,11 +148,17 @@ export default {
|
||||
getPayloadForItemQueue(index){
|
||||
return this.partPrograms[index];
|
||||
},
|
||||
positionBoxReps(arg1, arg2){
|
||||
this.selectedPositionTop = (arg1.offsetTop + 78);
|
||||
positionBoxReps(arg1, reps){
|
||||
debugger
|
||||
this.numberReps = reps;
|
||||
this.selectedPositionTop = (arg1.offsetTop + 226);
|
||||
this.enablePopup = true;
|
||||
},
|
||||
selectTab(value){
|
||||
this.selectedTab = value;
|
||||
},
|
||||
close(){
|
||||
this.enablePopup = false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user