diff --git a/src/assets/pwan/personbg.png b/src/assets/pwan/personbg.png new file mode 100644 index 0000000..5f69714 Binary files /dev/null and b/src/assets/pwan/personbg.png differ diff --git a/src/assets/sliao/headImage.png b/src/assets/sliao/headImage.png new file mode 100644 index 0000000..ee96591 Binary files /dev/null and b/src/assets/sliao/headImage.png differ diff --git a/src/assets/sliao/left12.png b/src/assets/sliao/left12.png new file mode 100644 index 0000000..d1452d8 Binary files /dev/null and b/src/assets/sliao/left12.png differ diff --git a/src/assets/sliao/left2.png b/src/assets/sliao/left2.png new file mode 100644 index 0000000..46e64a3 Binary files /dev/null and b/src/assets/sliao/left2.png differ diff --git a/src/assets/sliao/nameBg1.png b/src/assets/sliao/nameBg1.png new file mode 100644 index 0000000..2835b59 Binary files /dev/null and b/src/assets/sliao/nameBg1.png differ diff --git a/src/assets/sliao/nameBg2.png b/src/assets/sliao/nameBg2.png new file mode 100644 index 0000000..e74c0b1 Binary files /dev/null and b/src/assets/sliao/nameBg2.png differ diff --git a/src/assets/sliao/personbg.png b/src/assets/sliao/personbg.png new file mode 100644 index 0000000..47d0ab1 Binary files /dev/null and b/src/assets/sliao/personbg.png differ diff --git a/src/assets/sliao/personbg1.png b/src/assets/sliao/personbg1.png new file mode 100644 index 0000000..8a70cfd Binary files /dev/null and b/src/assets/sliao/personbg1.png differ diff --git a/src/assets/sliao/persongb2.png b/src/assets/sliao/persongb2.png new file mode 100644 index 0000000..da706f5 Binary files /dev/null and b/src/assets/sliao/persongb2.png differ diff --git a/src/assets/sliao/right1.png b/src/assets/sliao/right1.png new file mode 100644 index 0000000..3f578e6 Binary files /dev/null and b/src/assets/sliao/right1.png differ diff --git a/src/assets/sliao/right2.png b/src/assets/sliao/right2.png new file mode 100644 index 0000000..6b1d1dc Binary files /dev/null and b/src/assets/sliao/right2.png differ diff --git a/src/assets/sliao/selected.png b/src/assets/sliao/selected.png new file mode 100644 index 0000000..9c814f6 Binary files /dev/null and b/src/assets/sliao/selected.png differ diff --git a/src/assets/sliao/sljhItemBg.png b/src/assets/sliao/sljhItemBg.png new file mode 100644 index 0000000..9b5ae39 Binary files /dev/null and b/src/assets/sliao/sljhItemBg.png differ diff --git a/src/assets/sliao/sljhItemBg1.png b/src/assets/sliao/sljhItemBg1.png new file mode 100644 index 0000000..0e88473 Binary files /dev/null and b/src/assets/sliao/sljhItemBg1.png differ diff --git a/src/views/zyjhzx/pwanpgong/comps/container.js b/src/views/zyjhzx/pwanpgong/comps/container.js index 6df3bde..068159b 100644 --- a/src/views/zyjhzx/pwanpgong/comps/container.js +++ b/src/views/zyjhzx/pwanpgong/comps/container.js @@ -11,6 +11,21 @@ const container=function (width=0,height=0,container){ stage.add(layer) layer.draw(); + const imageObj = new Image(); + const imgSize=width + imageObj.src = require('@/assets/kban/bg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: imgSize, + height:this.height, + image: imageObj, + }); + layer.add(shape) + shape.zIndex(0) + } + return { stage,layer } diff --git a/src/views/zyjhzx/pwanpgong/comps/person.js b/src/views/zyjhzx/pwanpgong/comps/person.js index 67f9b99..0198e0d 100644 --- a/src/views/zyjhzx/pwanpgong/comps/person.js +++ b/src/views/zyjhzx/pwanpgong/comps/person.js @@ -4,7 +4,7 @@ export default function (width,height){ const _width=width*0.5,_height=120 const container=function (){ - const x=20,y=45 + const x=13,y=45 const layer=new Konva.Layer({ x:x, @@ -12,20 +12,6 @@ export default function (width,height){ width:_width, height:_height }) - layer.clipFunc(function(ctx) { - ctx.rect(0, 0, _width, _height); - }); - - const rect=new Konva.Rect({ - x:0, - y:0, - width:_width, - height:_height, - stroke:'black', - strokeWidth:1, - }) - - layer.add(rect) const group=new Konva.Group({ x:0, @@ -40,13 +26,39 @@ export default function (width,height){ } }, }) - layer.add(group) + const bgGroup=new Konva.Group({ + x:0, + y:0, + }) + bgGroup.clipFunc(function(ctx) { + ctx.rect(0, 0, width-929, 182); + }); + + const imageObj = new Image(); + imageObj.src = require('@/assets/pwan/personbg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:7, + width: 996*0.986, + height:182*0.986, + image: this, + }); + bgGroup.add(shape) + shape.zIndex(0) + } + + layer.add(bgGroup) + bgGroup.zIndex(0) + bgGroup.add(group) return {layer,group} } let currentWork=null; + let selectedShape=null; const getCurrentWorker=function (){ return currentWork @@ -67,16 +79,68 @@ export default function (width,height){ currentWork=persons }) - const rect=new Konva.Rect({ - x:0, - y:0, - width:width, - height:height, - stroke:'black', - strokeWidth:1, + const selectObj = new Image(); + selectObj.src = require('@/assets/sliao/selected.png'); + let selectShape=null + const setSelectShape=function (shape){ + selectShape=shape + } + selectObj.onload = function () { + const shape = new Konva.Image({ + x: 83, + y: 0, + width: 39, + height:39, + image: this, + visible:false + }); + group.add(shape) + shape.zIndex(0) + setSelectShape(shape) + } + + group.on('click touchstart',function (){ + currentWork=item + if (selectedShape){ + selectedShape.hide() + if (selectedShape===selectShape){ + return + } + } + selectedShape=selectShape + selectedShape.show() }) - group.add(rect) + const bgObj = new Image(); + bgObj.src = require('@/assets/sliao/personbg1.png'); + bgObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:4, + width: 137*0.95, + height:155*0.80, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } + + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/headImage.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:-4, + offsetY:-10, + width: 126*0.9, + height:134*0.80, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } const text=new Konva.Text({ x:0, y:0, diff --git a/src/views/zyjhzx/pwanpgong/comps/pgdTable.js b/src/views/zyjhzx/pwanpgong/comps/pgdTable.js index 9062517..40980eb 100644 --- a/src/views/zyjhzx/pwanpgong/comps/pgdTable.js +++ b/src/views/zyjhzx/pwanpgong/comps/pgdTable.js @@ -1,7 +1,7 @@ export default function () { const options={ - height:740, + height:685, align:'center', border: true, resizable: true, diff --git a/src/views/zyjhzx/pwanpgong/comps/title.js b/src/views/zyjhzx/pwanpgong/comps/title.js index 711a4ae..67e1866 100644 --- a/src/views/zyjhzx/pwanpgong/comps/title.js +++ b/src/views/zyjhzx/pwanpgong/comps/title.js @@ -1,18 +1,40 @@ import Konva from "konva"; const title=function (width,height,title) { - return new Konva.Text({ + const group=new Konva.Group({ + x: 0, + y: 0, + width: width, + height: 20, + }) + + const imageObj = new Image(); + imageObj.src = require('@/assets/kban/logo.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: width*0.86, + height:41, + image: imageObj, + }); + group.add(shape) + } + + const text=new Konva.Text({ x: 0, y: 8, width: width, height: 20, - lineHeight: 1, - stroke: 'blue', - strokeWidth: 2, text: title, align: 'center', + fill:'#fff', fontSize: 32, + fontStyle:'bold' }) + group.add(text) + + return group } export default title diff --git a/src/views/zyjhzx/pwanpgong/index.vue b/src/views/zyjhzx/pwanpgong/index.vue index 7ffef7b..de1cfce 100644 --- a/src/views/zyjhzx/pwanpgong/index.vue +++ b/src/views/zyjhzx/pwanpgong/index.vue @@ -98,7 +98,7 @@ export default { width:50%; height: auto; position: absolute; - top:175px; + top:230px; left:20px; border: none; margin: 0; diff --git a/src/views/zyjhzx/sliao/_index.vue b/src/views/zyjhzx/sliao/_index.vue index 14b0d31..c974848 100644 --- a/src/views/zyjhzx/sliao/_index.vue +++ b/src/views/zyjhzx/sliao/_index.vue @@ -52,7 +52,6 @@ export default { { message: "fn1", // message消息与func函数执行为映射关系 func: (params1, params2) => { - console.log("params参数-->", params1, params2); function fib(n) { if ((n == 1) | (n == 2)) { return 1; @@ -95,17 +94,12 @@ export default { this.worker = this.$worker.create(actions); }, mounted() { - console.time("多个线程计算用时1") this.worker .postAll() .then((res) => { - console.timeEnd("多个线程计算用时1"); - console.log("res", res); // 结果是一个数组 [267914296, 433494437, 701408733] this.loadingOne = false; }) .catch((err) => { - console.timeEnd("多个线程计算用时1"); - console.log("err", err); this.loadingOne = false; }); @@ -315,7 +309,6 @@ export default { }) group.add(text) group.on('click touchstart',(evt)=>{ - console.log(evt.target) this.slGroup.destroyChildren() this.drawSlItem(dw.list||[]) }) @@ -332,7 +325,6 @@ export default { stroke:'blue', strokeWidth:1, }) - console.log(111) const size=120; for (let i = 0; i < this.qyList.length; i++) { const qy=this.qyList[i] @@ -364,7 +356,6 @@ export default { }) group.add(text) group.on('click touchstart',(evt)=>{ - console.log(evt.target) this.drawDw(qyGroup,qy,size) }) qyGroup.add(group) @@ -381,7 +372,6 @@ export default { strokeWidth:1, }) qyGroup.on('click touchstart',(evt)=>{ - console.log(evt) }) this.sljhGroup=qyGroup }, diff --git a/src/views/zyjhzx/sliao/comps/baifang.js b/src/views/zyjhzx/sliao/comps/baifang.js index 63a3759..5dd8c8c 100644 --- a/src/views/zyjhzx/sliao/comps/baifang.js +++ b/src/views/zyjhzx/sliao/comps/baifang.js @@ -2,9 +2,9 @@ import Konva from "konva"; const baifang=function (option={}) { const width=option.width,height=option.height,slList=option.dw,image=require('@/assets/gb.png') - const _width=width*0.4-50,_height=height*0.81 + const _width=width*0.4-50,_height=height*0.737 const container=function (){ - const x=width*0.6+40,y=190 + const x=width*0.6+40,y=262 const group=new Konva.Group({ x:x, @@ -13,8 +13,19 @@ const baifang=function (option={}) { height:_height }) - // const rect=createRect(x,y) - // group.add(rect) + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/personbg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: _width, + height:_height, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } return group } @@ -37,7 +48,7 @@ const baifang=function (option={}) { const gangban=function (index,item){ const group=new Konva.Group({ x:0, - y:thatHeight-260-index*40, + y:thatHeight-280-index*40, draggable:true }) @@ -61,6 +72,7 @@ const baifang=function (option={}) { y:y } }) + const movedList=[] group.on('dragmove',function (){ if(_index===0){ @@ -108,7 +120,7 @@ const baifang=function (option={}) { for (const it of movedList) { mList.push(it.getAttr('item')) } - console.log(mList) + //todo 倒剁 const data={ id:item.id, lastCeng:item.ceng, @@ -122,6 +134,7 @@ const baifang=function (option={}) { this.setAttr('index',_index) _index=0 handler(slList) + //todo 倒剁 // daoduo(data).then(res=>{ // if (res.success){ // const element = slList.splice(index-1, 1)[0]; diff --git a/src/views/zyjhzx/sliao/comps/liliao.js b/src/views/zyjhzx/sliao/comps/liliao.js index 5e7f01e..a17d3c6 100644 --- a/src/views/zyjhzx/sliao/comps/liliao.js +++ b/src/views/zyjhzx/sliao/comps/liliao.js @@ -2,27 +2,41 @@ import Konva from "konva"; const liliao=function (width,height,dw,callback) { - const _width=width*0.4,_height=height*0.81 + const _width=width*0.4,_height=height*0.737 const container=function (){ - const x=width*0.2+30,y=190 + const x=width*0.2+30,y=262 const group=new Konva.Group({ - x:x, - y:y, + x:0, + y:0, width:_width, height:_height }) - const rect=new Konva.Rect({ - x:0, - y:0, + const bgGroup=new Konva.Group({ + x:x, + y:y, width:_width, height:_height, - stroke:'black', - strokeWidth:1, }) + bgGroup.clipFunc(function(ctx) { + ctx.rect(0, 6, _width, _height-11); + }); + bgGroup.add(group) - group.add(rect) + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/personbg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: _width, + height:_height, + image: this, + }); + bgGroup.add(shape) + shape.zIndex(0) + } for (let i = 0; i < dw.length; i++) { const item=dw[i] @@ -30,7 +44,7 @@ const liliao=function (width,height,dw,callback) { group.add(_group) } - return group + return bgGroup } let currentDw=null @@ -53,24 +67,28 @@ const liliao=function (width,height,dw,callback) { callback(index,dw[index]) }) - const rect=new Konva.Rect({ - x:0, - y:0, - width:width, - height:height, - stroke:'black', - strokeWidth:1, - }) - - group.add(rect) + const bgObj = new Image(); + bgObj.src = require('@/assets/sliao/personbg1.png'); + bgObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:4, + width: width, + height:height, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } const text=new Konva.Text({ x:0, y:0, width: width, height: height, - fill:'black', - text:item.name, + fill:'#fff', + text:`${item.name}\n${item.list.length}张钢板`, align:'center', verticalAlign:'middle', fontSize:20 diff --git a/src/views/zyjhzx/sliao/comps/person.js b/src/views/zyjhzx/sliao/comps/person.js index 7af6426..16cb259 100644 --- a/src/views/zyjhzx/sliao/comps/person.js +++ b/src/views/zyjhzx/sliao/comps/person.js @@ -2,27 +2,48 @@ import Konva from "konva"; const workers=function (width,height,persons) { - const _width=width*0.2,_height=height*0.81 + const _width=width*0.2,_height=height*0.737 const container=function (){ - const x=20,y=190 + const x=20,y=262 const group=new Konva.Group({ - x:x, - y:y, - width:_width, - height:_height - }) - - const rect=new Konva.Rect({ x:0, y:0, width:_width, height:_height, - stroke:'black', - strokeWidth:1, + draggable:true, + dragBoundFunc:function (pos){ + return { + x:x, + y:pos.y + } + }, }) - group.add(rect) + const bgGroup=new Konva.Group({ + x:x, + y:y, + width:_width, + height:_height, + }) + bgGroup.clipFunc(function(ctx) { + ctx.rect(0, 6, _width, _height-11); + }); + bgGroup.add(group) + + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/personbg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: _width, + height:_height, + image: this, + }); + bgGroup.add(shape) + shape.zIndex(0) + } for (let i = 0; i < persons.length; i++) { const item=persons[i] @@ -30,17 +51,18 @@ const workers=function (width,height,persons) { group.add(_group) } - return group + return bgGroup } let currentWork=null; + let selectedShape=null; const getCurrentWorker=function (){ return currentWork } const person=function (index,item){ const alignSize=2 - const width=((_width-30)/alignSize),height=108 + const width=((_width-30)/alignSize),height=135 const x=index%alignSize*width+(index%alignSize+1)*10,y=height*(Math.floor(index/alignSize))+(Math.floor(index/alignSize)+1)*10 const group=new Konva.Group({ x:x, @@ -49,24 +71,72 @@ const workers=function (width,height,persons) { height:height }) + const selectObj = new Image(); + selectObj.src = require('@/assets/sliao/selected.png'); + let selectShape=null + const setSelectShape=function (shape){ + selectShape=shape + } + selectObj.onload = function () { + const shape = new Konva.Image({ + x: 83, + y: 0, + width: 39, + height:39, + image: this, + visible:false + }); + group.add(shape) + shape.zIndex(0) + setSelectShape(shape) + } + group.on('click touchstart',function (){ currentWork=item + if (selectedShape){ + selectedShape.hide() + if (selectedShape===selectShape){ + return + } + } + selectedShape=selectShape + selectedShape.show() }) - const rect=new Konva.Rect({ - x:0, - y:0, - width:width, - height:height, - stroke:'black', - strokeWidth:1, - }) + const bgObj = new Image(); + bgObj.src = require('@/assets/sliao/personbg1.png'); + bgObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:4, + width: 137*0.95, + height:155*0.80, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } - group.add(rect) + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/headImage.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + offsetX:-4, + offsetY:-10, + width: 126*0.9, + height:134*0.80, + image: this, + }); + group.add(shape) + shape.zIndex(0) + } const text=new Konva.Text({ x:0, - y:0, + y:70, width: width, height: height, fill:'black', diff --git a/src/views/zyjhzx/sliao/comps/search.js b/src/views/zyjhzx/sliao/comps/search.js index 90dc4aa..17e0180 100644 --- a/src/views/zyjhzx/sliao/comps/search.js +++ b/src/views/zyjhzx/sliao/comps/search.js @@ -3,7 +3,7 @@ import Konva from "konva"; const search=function (){ const group=new Konva.Group({ x:20, - y:50 + y:52 }) const selectRect=new Konva.Rect({ x: 0, diff --git a/src/views/zyjhzx/sliao/comps/sljh.js b/src/views/zyjhzx/sliao/comps/sljh.js index d47c78c..58bb9eb 100644 --- a/src/views/zyjhzx/sliao/comps/sljh.js +++ b/src/views/zyjhzx/sliao/comps/sljh.js @@ -4,42 +4,87 @@ export const sljh=function (width,height){ const layer=new Konva.Layer({ id:'2', - x:15, - y:65, + x:20, + y:75, }) - layer.clipFunc(function(ctx) { - ctx.rect(0, 0, width-30, height*0.2-60); - }); - - const imageObj = new Image(); - imageObj.src = require('@/assets/sliao/sljhbg.png'); - imageObj.onload = function () { - const shape = new Konva.Image({ - x: 0, - y: 0, - width: width-30, - height:189, - image: imageObj, - }); - layer.add(shape) - shape.zIndex(0) - } const group=new Konva.Group({ x:0, y:0, - width: width-30, + width: width-74, height: height*0.2-60, draggable: true, dragBoundFunc:function (pos){ return { x:pos.x, - y:65 + y:75 } }, }); - layer.add(group) - group.zIndex(2) + + const bgGroup=new Konva.Group({ + x:34, + y:0, + }) + bgGroup.clipFunc(function(ctx) { + ctx.rect(4, 0, width-114, height*0.2-10); + }); + + layer.add(bgGroup) + bgGroup.zIndex(0) + bgGroup.add(group) + + const left2ImageObj=new Image() + left2ImageObj.src = require('@/assets/sliao/left2.png'); + left2ImageObj.onload = function () { + const shape1 = new Konva.Image({ + x: 0, + y: 35, + width: 32, + height:120, + image: this, + }); + layer.add(shape1) + shape1.zIndex(1) + shape1.on('click touchstart',function (){ + group.move({ + x:-116 + }) + }) + } + + const right2ImageObj=new Image() + right2ImageObj.src = require('@/assets/sliao/right2.png'); + right2ImageObj.onload = function () { + const shape1 = new Konva.Image({ + x: width-72, + y: 35, + width: 32, + height:120, + image: this, + }); + layer.add(shape1) + shape1.zIndex(1) + shape1.on('click touchstart',function (){ + group.move({ + x:116 + }) + }) + } + + const imageObj = new Image(); + imageObj.src = require('@/assets/sliao/sljhbg.png'); + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 0, + y: 0, + width: width-60, + height:181, + image: this, + }); + layer.add(shape) + shape.zIndex(0) + } return { layer,group diff --git a/src/views/zyjhzx/sliao/comps/title.js b/src/views/zyjhzx/sliao/comps/title.js index a048572..67e1866 100644 --- a/src/views/zyjhzx/sliao/comps/title.js +++ b/src/views/zyjhzx/sliao/comps/title.js @@ -3,7 +3,7 @@ import Konva from "konva"; const title=function (width,height,title) { const group=new Konva.Group({ x: 0, - y: 8, + y: 0, width: width, height: 20, }) diff --git a/src/views/zyjhzx/sliao/index.vue b/src/views/zyjhzx/sliao/index.vue index 126db7d..5571d7a 100644 --- a/src/views/zyjhzx/sliao/index.vue +++ b/src/views/zyjhzx/sliao/index.vue @@ -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 {