|
|
|
@ -86,8 +86,9 @@ export default {
|
|
|
|
|
if (this.sljhGroup){
|
|
|
|
|
this.sljhGroup.destroyChildren()
|
|
|
|
|
}
|
|
|
|
|
const itemWith=85;
|
|
|
|
|
const itemWith=111;
|
|
|
|
|
const itemHeight=108
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i < list.length; i++) {
|
|
|
|
|
const item=list[i];
|
|
|
|
|
const x=(i+1)*5+i*itemWith;
|
|
|
|
@ -99,12 +100,183 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
qyGroup.setAttr('index',i)
|
|
|
|
|
qyGroup.setAttr('item',item)
|
|
|
|
|
this.sljhGroup.add(qyGroup)
|
|
|
|
|
|
|
|
|
|
const imageObj = new Image();
|
|
|
|
|
imageObj.src = require('@/assets/sliao/sljhItemBg.png');
|
|
|
|
|
imageObj.onload = function () {
|
|
|
|
|
const shape = new Konva.Image({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 0,
|
|
|
|
|
width: 111,
|
|
|
|
|
height:163,
|
|
|
|
|
image: this,
|
|
|
|
|
});
|
|
|
|
|
qyGroup.add(shape)
|
|
|
|
|
shape.zIndex(0)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const tlth=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 0,
|
|
|
|
|
width: 111,
|
|
|
|
|
height:34,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:item.tzbh
|
|
|
|
|
})
|
|
|
|
|
qyGroup.add(tlth)
|
|
|
|
|
|
|
|
|
|
const nameGroup=new Konva.Group({
|
|
|
|
|
x: 5,
|
|
|
|
|
y: 43,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:105,
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const nameImageObj1 = new Image();
|
|
|
|
|
nameImageObj1.src = require('@/assets/sliao/nameBg1.png');
|
|
|
|
|
nameImageObj1.onload = function () {
|
|
|
|
|
const shape = new Konva.Image({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 0,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:105,
|
|
|
|
|
image: this,
|
|
|
|
|
});
|
|
|
|
|
nameGroup.add(shape)
|
|
|
|
|
shape.zIndex(0)
|
|
|
|
|
}
|
|
|
|
|
qyGroup.add(nameGroup)
|
|
|
|
|
|
|
|
|
|
const name1=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 0,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:'船号'
|
|
|
|
|
})
|
|
|
|
|
nameGroup.add(name1)
|
|
|
|
|
|
|
|
|
|
const name2=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 21,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:'批量'
|
|
|
|
|
})
|
|
|
|
|
nameGroup.add(name2)
|
|
|
|
|
|
|
|
|
|
const name3=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 43,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:'规格'
|
|
|
|
|
})
|
|
|
|
|
nameGroup.add(name3)
|
|
|
|
|
|
|
|
|
|
const name4=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 64.5,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:'垛位'
|
|
|
|
|
})
|
|
|
|
|
nameGroup.add(name4)
|
|
|
|
|
|
|
|
|
|
const name5=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 86.5,
|
|
|
|
|
width: 38,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:'层数'
|
|
|
|
|
})
|
|
|
|
|
nameGroup.add(name5)
|
|
|
|
|
|
|
|
|
|
const infoGroup=new Konva.Group({
|
|
|
|
|
x: 43,
|
|
|
|
|
y: 43,
|
|
|
|
|
width: 65,
|
|
|
|
|
height:105,
|
|
|
|
|
})
|
|
|
|
|
qyGroup.add(infoGroup)
|
|
|
|
|
|
|
|
|
|
const info1=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 0,
|
|
|
|
|
width: 65,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:item.dcCh
|
|
|
|
|
})
|
|
|
|
|
infoGroup.add(info1)
|
|
|
|
|
|
|
|
|
|
const info2=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 21,
|
|
|
|
|
width: 65,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:12,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:item.dcPl
|
|
|
|
|
})
|
|
|
|
|
infoGroup.add(info2)
|
|
|
|
|
|
|
|
|
|
const info3=new Konva.Text({
|
|
|
|
|
x: 0,
|
|
|
|
|
y: 43,
|
|
|
|
|
width: 65,
|
|
|
|
|
height:20,
|
|
|
|
|
fontSize:9,
|
|
|
|
|
fontStyle:'bold',
|
|
|
|
|
fill:'#fff',
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
text:item.wpgg
|
|
|
|
|
})
|
|
|
|
|
infoGroup.add(info3)
|
|
|
|
|
|
|
|
|
|
const _layer=this.layer
|
|
|
|
|
const _sljhGroup=this.sljhGroup;
|
|
|
|
|
let touchingFlag=false;
|
|
|
|
|
const that=this
|
|
|
|
|
qyGroup.on('touchstart',function ({evt}){
|
|
|
|
|
qyGroup.on('click touchstart',function ({evt}){
|
|
|
|
|
const worker=that.getCurrentWorker();
|
|
|
|
|
if (!that.canSl||!worker){
|
|
|
|
|
return
|
|
|
|
@ -126,6 +298,9 @@ export default {
|
|
|
|
|
tmpGroup.dragBoundFunc(function (pos){
|
|
|
|
|
return{...pos}
|
|
|
|
|
})
|
|
|
|
|
tmpGroup.startDrag()
|
|
|
|
|
_that.visible(false)
|
|
|
|
|
|
|
|
|
|
tmpGroup.on('dragend',function (){
|
|
|
|
|
const {x:thisX,y:thisY}=this.absolutePosition()
|
|
|
|
|
const {x,y}=that.slGroup.absolutePosition()
|
|
|
|
@ -150,9 +325,7 @@ export default {
|
|
|
|
|
bfr:that.getCurrentWorker()?.userCode
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
shangLiao(data).then(res=>{
|
|
|
|
|
console.log(res)
|
|
|
|
|
})
|
|
|
|
|
shangLiao(data).then(res=>{})
|
|
|
|
|
|
|
|
|
|
this.remove()
|
|
|
|
|
|
|
|
|
@ -165,8 +338,7 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
_sljhGroup.draggable(true)
|
|
|
|
|
})
|
|
|
|
|
tmpGroup.startDrag()
|
|
|
|
|
_that.visible(false)
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},500)
|
|
|
|
@ -178,30 +350,6 @@ export default {
|
|
|
|
|
_sljhGroup.draggable(true)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const rect=new Konva.Rect({
|
|
|
|
|
x:0,
|
|
|
|
|
y:0,
|
|
|
|
|
width:itemWith,
|
|
|
|
|
height:itemHeight,
|
|
|
|
|
stroke:'black',
|
|
|
|
|
strokeWidth:1,
|
|
|
|
|
})
|
|
|
|
|
qyGroup.add(rect)
|
|
|
|
|
const text=new Konva.Text({
|
|
|
|
|
x:0,
|
|
|
|
|
y:0,
|
|
|
|
|
width:itemWith,
|
|
|
|
|
height:itemHeight,
|
|
|
|
|
lineHeight:1,
|
|
|
|
|
stroke:'blue',
|
|
|
|
|
strokeWidth:0.1,
|
|
|
|
|
text:item.dcCh+'\n'+item.dcPl+'\n'+item.dcFd+'\n'+item.tzbh+'\n'+formatTlt(item.kw,this.tlt),
|
|
|
|
|
align:'center',
|
|
|
|
|
verticalAlign:'middle',
|
|
|
|
|
})
|
|
|
|
|
qyGroup.add(text)
|
|
|
|
|
|
|
|
|
|
this.sljhGroup.add(qyGroup)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
initYcldw(){
|
|
|
|
@ -255,9 +403,9 @@ export default {
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
.vxe-button{
|
|
|
|
|
top: -2px;
|
|
|
|
|
top: 0px;
|
|
|
|
|
width: 80px;
|
|
|
|
|
height: 27px !important;
|
|
|
|
|
height: 22px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.vxe-input{
|
|
|
|
@ -266,7 +414,7 @@ export default {
|
|
|
|
|
|
|
|
|
|
#searchPl {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top:43px;
|
|
|
|
|
top:45px;
|
|
|
|
|
left:15px;
|
|
|
|
|
border: none;
|
|
|
|
|
margin: 0;
|
|
|
|
|