Merge remote-tracking branch 'origin/master'

src/views/jhzx/symxCX.vue

@@ -26,7 +26,7 @@
     <el-container style="padding-top: 0px">
       <el-main>
         <el-tabs v-model="activeName" @tab-click="handleClick">
-          <el-tab-pane label="月度计划编制" name="sygdjh" v-if="isUser">
+          <el-tab-pane label="月度计划明细" name="sygdjh" v-if="isUser">
             <div class="mytable" >
               <el-button type="success" @click="paichan">月度计划排产</el-button>
               <el-button type="success" @click="jgcx(false)">获取排产结果</el-button>
@@ -59,7 +59,7 @@
               </vxe-grid>
             </div>
           </el-tab-pane>
-          <el-tab-pane label="前方三月需求计划" name="first">
+          <el-tab-pane label="月度计划编制" name="first">
             <div class="mytable">
               <el-button type="success" @click="confirmModal">月度计划排产</el-button>
               <el-button type="success" @click="creatYdjh">生成月度计划</el-button>

src/views/jhzx/ydjhzxGL.vue

@@ -25,7 +25,7 @@
         <el-tabs v-model="activeName" @tab-click="handleClick">
           <el-tab-pane label="月度计划" name="first">
             <div class="mytable">
-              <el-button type="success" @click="symxhz">汇总</el-button>
+              <el-button type="success" @click="symxhz">准备检查</el-button>
               <vxe-grid
                 id="id"
                 ref="xGrid"
@@ -213,6 +213,9 @@ export default {
       tableColumn:[
         { type: 'checkbox', width: 50 ,},
         { type: 'seq', width: 60, title: '序号'},
+        { field: 'jhlx', title: '计划类型',width: 70,formatter:this.formatterZt,
+          filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
+          filterRender: { name: 'FilterCombination', }},
         { field: 'dcCh', title: '船号',width: 100,
           filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
           filterRender: { name: 'FilterCombination', }},
@@ -341,9 +344,6 @@ export default {
         { field: 'zt', title: '状态',width: 70,formatter: ['dictFormat','SYZT'],
           filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
           filterRender: { name: 'FilterCombination', }},
-        { field: 'jhlx', title: '计划类型',width: 70,formatter:this.formatterZt,
-          filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
-          filterRender: { name: 'FilterCombination', }},
         { field: 'gxsj', title: '数据更新时间',width: 100,
           filters: [{ data: { checks: [], sVal: '', sMenu: '', fType1: '', fVal1: '', fMode: 'and', fType2: '', fVal2: '' } }],
           filterRender: { name: 'FilterCombination', }},

src/views/zyjhzx/hxianfkui/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,16 +12,19 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
@@ -29,8 +32,8 @@ export default function (width,height){
     // this.layer.destroyChildren();
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +41,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +51,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +64,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +73,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -126,9 +126,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +147,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +166,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +176,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +189,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +199,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +211,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +221,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +246,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +256,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,7 +269,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -289,10 +279,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwry,
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +291,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +301,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +326,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +345,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +355,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +377,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +387,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +400,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +410,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +434,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +444,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +453,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)

src/views/zyjhzx/hxianpgong/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,16 +12,19 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
@@ -29,8 +32,8 @@ export default function (width,height){
     // this.layer.destroyChildren();
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +41,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +51,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +64,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +73,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -126,9 +126,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +147,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +166,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +176,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +189,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +199,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +211,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +221,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +246,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +256,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,7 +269,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -289,10 +279,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwry,
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +291,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +301,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +326,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +345,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +355,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +377,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +387,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +400,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +410,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +434,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +444,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +453,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)

src/views/zyjhzx/lliaofkui/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,16 +12,19 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
@@ -29,8 +32,8 @@ export default function (width,height){
     // this.layer.destroyChildren();
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +41,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +51,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +64,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +73,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -126,9 +126,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +147,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +166,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +176,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +189,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +199,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +211,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +221,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +246,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +256,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,7 +269,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -289,10 +279,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwry,
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +291,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +301,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +326,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +345,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +355,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +377,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +387,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +400,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +410,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +434,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +444,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +453,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)

src/views/zyjhzx/lliaopgong/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,16 +12,19 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
@@ -29,8 +32,8 @@ export default function (width,height){
     // this.layer.destroyChildren();
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +41,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +51,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +64,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +73,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -126,9 +126,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +147,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +166,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +176,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +189,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +199,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +211,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +221,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +246,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +256,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,7 +269,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -289,10 +279,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwry,
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +291,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +301,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +326,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +345,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +355,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +377,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +387,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +400,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +410,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +434,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +444,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +453,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)

src/views/zyjhzx/pwanfkui/comps/PwanPgd.vue

@@ -4,20 +4,34 @@
 
 <script>
 import paoWanPgdConfig from './pgdTable'
+import {getPgd} from "@/api/zyjh";
 export default {
   name:'PwanPgd',
+  props:{
+    workers:{
+      type:Array,
+      default:[]
+    }
+  },
   data(){
     return{
       gridOptions:{},
-      list:{},
+      setExt:null,
     }
   },
   created(){
-    const {options,columns}=paoWanPgdConfig()
+    const {options,columns,setExt}=paoWanPgdConfig()
+    this.setExt=setExt
     this.gridOptions=options
     this.gridOptions.columns=columns
   },
   methods:{
+    initData(worker,zt){
+      getPgd({user:worker,zt:zt,field:'pwry'}).then(res=>{
+        this.gridOptions.data=res.data
+        this.setExt('workers',this.$props.workers)
+      })
+    },
     cellClick({row}){
       this.$emit('initPgd',row)
     }

src/views/zyjhzx/pwanfkui/comps/baifang.js

@@ -1,4 +1,6 @@
 import Konva from "konva";
+import {zx} from "@/api/zyjh";
+import { VXETable } from 'vxe-table'
 
 const baifang=function (option={}) {
   const width=option.width,height=option.height,slList=option.dw,image=require('@/assets/gb.png')
@@ -13,16 +15,34 @@ const baifang=function (option={}) {
       height:_height
     })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
+      shape.zIndex(0)
+    }
 
-    group.add(rect)
+    const selectObj = new Image();
+    selectObj.src = require('@/assets/pwan/gbSelectBg.png');
+    selectObj.onload = function () {
+      const shape = new Konva.Image({
+        x: 0,
+        y: 0,
+        width: _width,
+        height:_height,
+        image: this,
+        visible:false
+      });
+      group.add(shape)
+      shape.zIndex(0)
+    }
 
     return group
   }
@@ -30,7 +50,7 @@ const baifang=function (option={}) {
   const slGroup=container()
 
   const thatHeight=height
-  const gangban=function (index,str){
+  const gangban=function (index,item){
     const group=new Konva.Group({
       x:0,
       y:thatHeight-310-index*40,
@@ -38,6 +58,7 @@ const baifang=function (option={}) {
     })
 
     group.setAttr('index',index)
+    group.setAttr('item',item)
 
     slGroup.add(group)
     const {x}=group.absolutePosition()
@@ -48,6 +69,84 @@ const baifang=function (option={}) {
       }
     })
     let _index=0
+    let touchingFlag=false;
+    group.on('mousedown touchstart',function (evt){
+      const layer=evt.currentTarget.parent.parent
+      touchingFlag=true
+      const {x,y}=evt.evt
+      setTimeout(()=>{
+        const moving=this.isDragging()
+        if (!moving){
+          if (touchingFlag){
+            this.draggable(false)
+
+            const tmpGroup=this.clone()
+            tmpGroup.x(x-10)
+            tmpGroup.y(y-10)
+            layer.add(tmpGroup)
+            tmpGroup.draggable(true)
+            tmpGroup.dragBoundFunc(function (pos){
+              return{...pos}
+            })
+            tmpGroup.startDrag()
+
+            const that=this
+            tmpGroup.on('dragend',function (){
+              const {x:thisX,y:thisY}=this.absolutePosition()
+              for (const item of layer.children) {
+                if(item.attrs.id==='csd'){
+                  const {x,y}=item.absolutePosition()
+                  const worker=JSON.parse(window.localStorage.getItem('worker'))
+                  if ((thisX>=x&&thisY>=y)&&!!worker){
+                    const info=this.getAttr('item')
+                    const zyjh=JSON.parse(window.localStorage.getItem('zyjh'))
+                    if (!zyjh){
+                      VXETable.modal.message({content: '请先选择待反馈的派工单', status: 'warning'})
+                      this.remove()
+                      that.visible(true)
+                      return
+                    }
+                    zx({
+                      field:'pwfkrq',
+                      zxZtName:'PWFK',
+                      list:[{
+                        id:zyjh.id,
+                        pwfkry: worker.userCode
+                      }],
+                      ycldwInfo:info
+                    }).then(res=>{
+                      if (res.success){
+                        window.localStorage.removeItem('zyjh')
+                      }
+                    })
+                    this.scaleX(0.7)
+                    const image=this.find('Image')[0]
+                    image.x(5)
+                    image.y(800)
+                    image.scaleX(0.90)
+                    image.moveTo(item.children[0].children[0])
+                    // this.moveTo(item.children[0].children[0])
+                    image.zIndex(2)
+                    image.setAttr('_ad','sdf')
+                    this.remove()
+                    that.remove()
+                  }else{
+                    this.remove()
+                    that.visible(true)
+                  }
+                }
+              }
+            })
+            this.visible(false)
+          }
+        }
+      },500)
+
+    })
+
+    group.on('mouseup touchend',function (){
+      touchingFlag=false
+    })
 
     group.on('dragstart',function (){
       const {x,y}=this.absolutePosition()
@@ -60,7 +159,7 @@ const baifang=function (option={}) {
       if(_index===0){
         _index=this.getAttr('index')
       }
-      this.zIndex(999)
+      this.zIndex(7)
       const {y:thisY}=this.absolutePosition()
 
       const dir=thisY-this.startPos.y>0?-40:40
@@ -140,7 +239,7 @@ const baifang=function (option={}) {
         width: imgSize,
         height:40,
         fill:'black',
-        text:str+',12*2830*13090',
+        text:`${item.wph||''},${item.wpgg}`,
         align:'center',
         verticalAlign:'middle',
       })
@@ -153,7 +252,7 @@ const baifang=function (option={}) {
       width: imgSize-20,
       height:40,
       fill:'black',
-      text:'G175K-4,001,2302\n上料:2024/07/01,切割:2024/07/04',
+      text:`${item.czbh},${item.pl},${item.fd}\n上料:${item.bfrq||''},切割:${item.qgjhrq||''}`,
       align:'center',
       verticalAlign:'middle',
     })

src/views/zyjhzx/pwanfkui/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
   }

src/views/zyjhzx/pwanfkui/comps/csd.js

@@ -4,35 +4,115 @@ import Konva from "konva";
 export default function (width,height){
   const x=width*0.55+40,y=45,_width=width*0.1,_height=height*0.945
   const container=new Konva.Group({
+    id:'csd',
     x:x,
     y:y,
     width:_width,
     height:_height
   })
 
-  const rect=new Konva.Rect({
+  // const imageObj = new Image();
+  const imgSize=_width
+  // imageObj.src = require('@/assets/pwan/csdbg.png');
+  // imageObj.onload = function () {
+  //   const shape = new Konva.Image({
+  //     x: 0,
+  //     y: 0,
+  //     width: imgSize,
+  //     height:_height,
+  //     image: imageObj,
+  //   });
+  //   container.add(shape)
+  //   shape.zIndex(0)
+  // }
+
+  const imageObj1 = new Image();
+  imageObj1.src = require('@/assets/pwan/csd0.png');
+  imageObj1.onload = function () {
+    const shape = new Konva.Image({
       x: 0,
       y: 0,
-    width:_width,
+      width: imgSize,
-    height:_height,
+      height:_height*0.1,
-    stroke:'black',
+      image: this,
-    strokeWidth:1,
+    });
+    container.add(shape)
+    shape.zIndex(1)
+  }
+
+  const imageObj3 = new Image();
+  imageObj3.src = require('@/assets/pwan/csd0.png');
+  imageObj3.onload = function () {
+    const shape = new Konva.Image({
+      x: 0,
+      y: _height-_height*0.1,
+      width: imgSize,
+      height:_height*0.1,
+      image: this,
+    });
+    container.add(shape)
+    shape.zIndex(1)
+  }
+
+  const group=new Konva.Group({
+    x:0,
+    y:_height*0.1,
+    width: imgSize,
+    height:_height-_height*0.1,
   })
+  container.add(group)
+  group.clipFunc(function(ctx) {
+    ctx.rect(0, 0, imgSize, _height-_height*0.1);
+  });
 
-  container.add(rect)
+  initCsd()
+
+  function initCsd() {
+    const imageObj2 = new Image();
+    imageObj2.src = require('@/assets/pwan/csd1.png');
+    imageObj2.onload = function () {
+      play(this,imgSize,_height)
+    }
+  }
 
-  const text=new Konva.Text({
+  function play(img,imgSize,_height){
+    const csdGroup=new Konva.Group({
       x: 0,
       y: 0,
-    width: _width,
+      width: imgSize,
       height: _height,
-    fill:'black',
+      image: img,
-    text:'传送带',
-    align:'center',
-    verticalAlign:'middle',
     })
+    group.add(csdGroup)
+    const shape = new Konva.Image({
+      x: 0,
+      y: 0,
+      width: imgSize,
+      height: _height,
+      image: img,
+    });
+    csdGroup.add(shape)
+    shape.zIndex(0)
 
-  container.add(text)
+    const shape1 = new Konva.Image({
+      x: 0,
+      y: _height,
+      width: imgSize,
+      height: _height,
+      image: img,
+    });
+    csdGroup.add(shape1)
+    shape1.zIndex(1)
 
+    csdGroup.to({
+      x: 0,
+      y: -876,
+      duration: 20, //持续时间
+      onFinish() {
+        csdGroup.remove()
+        play(img,imgSize,_height)
+      }
+    })
+  }
   return container
 }

src/views/zyjhzx/pwanfkui/comps/dw.js

@@ -1,7 +1,6 @@
 import Konva from "konva";
 
 export default function (width,height,callback){
-  console.log(callback)
   const x=0,y=0,_width=width*0.16,_height=height*0.67
 
   const container=function (){
@@ -14,20 +13,24 @@ export default function (width,height,callback){
       height:_height
     })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
 
     return group
   }
 
+  let selectedShape=null;
   const dw=function (index,item=[]){
 
     const alignSize=2
@@ -40,20 +43,52 @@ export default function (width,height,callback){
       height:height
     })
     group.on('click touchstart',function (){
-      console.log(item)
+      if (selectedShape){
-      callback(index,item.list)
+        selectedShape.hide()
+        if (selectedShape===selectShape){
+          selectedShape=null
+          return
+        }
+      }
+      selectedShape=selectShape
+      selectedShape.show()
+      callback(index,item)
     })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
+      shape.zIndex(0)
+    }
 
-    group.add(rect)
+    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: width-width*0.31,
+        y: 4,
+        width: width*0.25,
+        height:width*0.25,
+        image: this,
+        visible:false
+      });
+      group.add(shape)
+      shape.zIndex(0)
+      setSelectShape(shape)
+    }
 
     const text=new Konva.Text({
       x:0,
@@ -61,10 +96,10 @@ export default function (width,height,callback){
       width: width,
       height: height,
       fill:'black',
-      text:item.name,
+      text:`${item.name}\n${item.list.length}张`,
       align:'center',
       verticalAlign:'middle',
-      fontSize:20
+      fontSize:18
     })
     group.add(text)
 

src/views/zyjhzx/pwanfkui/comps/person.js

@@ -1,36 +1,63 @@
 import Konva from "konva";
 
 export default function (width,height){
-  const _width=width*0.134,_height=height*0.67
+  const _width=width*0.134,_height=height*0.737
 
   const container=function (){
     const x=20,y=300
 
     const group=new Konva.Group({
+      x:0,
+      y:0,
+      width:_width,
+      height:_height,
+      draggable:true,
+      dragBoundFunc:function (pos){
+        return {
+          x:x,
+          y:pos.y
+        }
+      },
+    })
+
+    const bgGroup=new Konva.Group({
       x:x,
       y:y,
       width:_width,
-      height:_height
+      height:_height,
     })
+    bgGroup.clipFunc(function(ctx) {
+      ctx.rect(0, 6, _width, _height-11);
+    });
+    bgGroup.add(group)
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      bgGroup.add(shape)
+      shape.zIndex(0)
+    }
 
-    group.add(rect)
+    return bgGroup
+  }
+  let currentWork=null;
+  let selectedShape=null;
 
-    return group
+  const getCurrentWorker=function (){
+    return currentWork
   }
 
   const person=function (index,persons={}){
     const alignSize=2
-    const width=(_width-20)/alignSize,height=110
+    const width=(_width-5)/alignSize,height=110
-    const x=index%alignSize*width+index%alignSize*10+5,y=height*(Math.floor(index/alignSize))+(Math.floor(index/alignSize)+1)*10
+    const x=index%alignSize*width+index%alignSize+5,y=height*(Math.floor(index/alignSize))+(Math.floor(index/alignSize)+1)*10
     const group=new Konva.Group({
       x:x,
       y:y,
@@ -38,21 +65,76 @@ export default function (width,height){
       height:height
     })
 
-    const rect=new Konva.Rect({
+    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: width-width*0.3,
+        y: 2,
+        width: width*0.25,
+        height:height*0.25,
+        image: this,
+        visible:false
+      });
+      group.add(shape)
+      shape.zIndex(0)
+      setSelectShape(shape)
+    }
+
+    group.on('click touchstart',function (){
+      currentWork=persons
+      window.localStorage.setItem('worker',JSON.stringify(currentWork))
+      if (selectedShape){
+        selectedShape.hide()
+        if (selectedShape===selectShape){
+          selectedShape=null
+          return
+        }
+      }
+      selectedShape=selectShape
+      selectedShape.show()
+    })
+
+    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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-    group.add(rect)
+      shape.zIndex(0)
+    }
 
-    const text=new Konva.Text({
+    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: width*0.89,
+        height:height*0.85,
+        image: this,
+      });
+      group.add(shape)
+      shape.zIndex(0)
+    }
+
+    const text=new Konva.Text({
+      x:0,
+      y:height,
       width:width,
-      height:height,
+      height:height*0.1,
       text: persons.userName,
       align: 'center',
       verticalAlign:'middle',

src/views/zyjhzx/pwanfkui/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,25 +12,42 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
+  let workers=[]
+  const setWorkers=function (persons){
+    workers=persons
+  }
+
+  const formatWorker=function (code){
+    for (const item of workers) {
+      if(item.userCode===code){
+        return item.userName
+      }
+    }
+  }
+
   const drawGd=function (data){
     // this.layer.destroyChildren();
+    window.localStorage.setItem('zyjh',JSON.stringify(data))
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +55,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +65,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +78,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +87,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -108,7 +122,6 @@ export default function (width,height){
     group0.add(group7)
     const group8=drawQz(data)
     group0.add(group8)
-    console.log(data)
     generateQRCode(data.gdh,group0)
     return group
   }
@@ -126,9 +139,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +160,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +179,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +189,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +202,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +212,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +224,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +234,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +259,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +269,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,7 +282,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -289,10 +292,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:formatWorker(data.pwry),
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +304,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +314,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +339,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +358,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +368,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +390,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +400,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +413,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +423,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +447,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +457,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +466,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -508,6 +499,6 @@ export default function (width,height){
   }
 
   return {
-    container,drawGd
+    container,drawGd,setWorkers
   }
 }

src/views/zyjhzx/pwanfkui/comps/pgdTable.js

@@ -11,12 +11,31 @@ export default function () {
     scrollY:{enable:true},
     data:[]
   }
+  const ext={}
+  const setExt=function (key,value){
+    ext[key]=value
+  }
   const gdhFormat=function ({cellValue}){
     if (cellValue){
       return 'PW'+cellValue
     }
     return ''
   }
+  const nameFormat=function ({cellValue}){
+    const workers=ext.workers
+    for (const item of workers) {
+      if(item.userCode===cellValue){
+        return item.userName
+      }
+    }
+  }
+  const ztFormat=function ({cellValue}){
+    return ztEnmu[cellValue]
+  }
+  const ztEnmu={
+    '31':'派工',
+    '32':'反馈'
+  }
   const columns = [
     { type: 'checkbox', width: 40 },
     { type: 'seq',title:'序号', width: 60 },
@@ -30,15 +49,16 @@ export default function () {
     {field: '', title: '规格', width: 100},
     {field: '', title: '炉批号', width: 100},
     {field: 'tzbh', title: '套料图号', width: 100},
-    {field: '', title: '接收人', width: 80},
+    {field: 'pwry', title: '接收人', width: 80,formatter:nameFormat},
-    {field: '', title: '接收时间', width: 100},
+    {field: 'pwpgrq', title: '接收时间', width: 100},
-    {field: '', title: '反馈人', width: 80},
+    {field: 'pwfkr', title: '反馈人', width: 80,formatter:nameFormat},
-    {field: '', title: '反馈时间', width: 100},
+    {field: 'pwfkrq', title: '反馈时间', width: 100},
-    {field: '', title: '状态', width: 60},
+    {field: 'zt', title: '状态', width: 60,formatter:ztFormat},
   ]
 
   return {
     options,
     columns,
+    setExt
   }
 }

src/views/zyjhzx/pwanfkui/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

src/views/zyjhzx/pwanfkui/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <div id="pwpg" class="pwpg" ref="pwpg"></div>
-    <PWanPgd id="pwpgd" ref="pwpgd" @initPgd="initPgd" :pgd="pgd" />
+    <PWanPgd id="pwpgd" ref="pwpgd" @initPgd="initPgd" :pgd="pgd" :workers="workers" />
   </div>
 </template>
 
@@ -14,8 +14,7 @@ import drawDw from './comps/dw'
 import drawPgd from './comps/pgd'
 import baifang from "./comps/baifang";
 import drawCsd from './comps/csd'
-import {getPgd, getYcldw} from "@/api/zyjh";
+import { getYcldw} from "@/api/zyjh";
-import liliao from "@/views/zyjhzx/sliao/comps/liliao";
 import {getBzryList} from "@/api/sjzx/bzzGL";
 
 export default {
@@ -32,24 +31,56 @@ export default {
       drawGd:null,
       dw:[],
       pgd:[],
+      currentDw:'',
+      currentDwIndex:'',
       currentWorker:null,
+      setWorkers:null,
+      workers:null,
+      slGroup:null,
     }
   },
   mounted() {
+    this.$socket.open()
+    this.wsSubscribe()
     this.initKonvaStage();
   },
+  sockets:{},
+  created(){
+    window.addEventListener('resize', this.initKonvaStage)
+  },
   methods:{
+    wsSubscribe(){
+      this.sockets.subscribe('pwComplete', data => {
+        if (this.currentDw&&this.currentDw.id===data.dwId) {
+          if (this.slGroup){
+            this.slGroup.destroyChildren()
+          }
+          for (let i = 0; i < this.dw[this.currentDwIndex].list.length; i++) {
+            const item=this.dw[this.currentDwIndex].list[i]
+            console.log(123)
+            console.log(item.czbh===data.czbh&&item.pl===data.pl&&item.tlth===data.tlth)
+            if (item.czbh===data.czbh&&item.pl===data.pl&&item.tlth===data.tlth){
+              this.dw[this.currentDwIndex].list.splice(i,1)
+              console.log(this.dw[this.currentDwIndex].list)
+              break
+            }
+          }
+          this.drawBaiFang(this.dw[this.currentDwIndex].list)
+        }
+      })
+    },
     initPgd(pgd={}){
       const group=this.drawGd(pgd)
       this.pgdGroup.add(group)
     },
-    initBaiFang(index,list){
+    initBaiFang(index,dw){
       if (this.slGroup){
         this.slGroup.destroyChildren()
       }
       this.canSl=true
+      this.currentDw=dw
       this.currentDwIndex=index
-      const {slGroup,handler}= baifang({width:this.width,height:this.height,dw:list})
+      const {slGroup,handler}= baifang({width:this.width,height:this.height,dw:dw.list})
       this.slGroup=slGroup
       this.drawBaiFang=handler
       this.layer.add(slGroup)
@@ -62,6 +93,7 @@ export default {
 
         this.layer.add(group)
 
+        this.dw=res.data
         for (let i=0;i<res.data.length;i++){
           const item=res.data[i]
           const dwGroup=dw(i,item)
@@ -75,17 +107,18 @@ export default {
         const {container,person}=workers(this.width,this.height)
         const group=container()
         this.layer.add(group)
+        this.workers=res.data
 
+        that.setWorkers(res.data)
         for (let i=0;i<res.data.length;i++){
           const item=res.data[i]
           const worker=person(i,item)
           worker.on('click touchstart',function (){
             that.currentWorker=item
-            getPgd({field:'pwry',jhrqField:'pwjhrq',user:that.currentWorker.userCode}).then(res=>[
+            that.$refs.pwpgd.initData(that.currentWorker.userCode,'31')
-              that.pgd=res.data
-            ])
           })
           group.add(worker)
+          worker.zIndex(1)
         }
       })
     },
@@ -99,17 +132,18 @@ export default {
       const titel=drawTitle(this.width,this.height,this.title)
       this.layer.add(titel)
 
-      this.initWorkers()
-
       this.initDw()
 
-      const {container:pgdContainer,drawGd}=drawPgd(this.width,this.height)
+      const {container:pgdContainer,drawGd,setWorkers}=drawPgd(this.width,this.height)
+      this.setWorkers=setWorkers
       this.drawGd=drawGd
       this.pgdGroup=pgdContainer()
       this.layer.add(this.pgdGroup)
 
       const csdGroup=drawCsd(this.width,this.height)
       this.layer.add(csdGroup)
+
+      this.initWorkers()
     },
   }
 }

src/views/zyjhzx/pwanpgong/comps/PwanPgd.vue

@@ -60,7 +60,7 @@ export default {
       for (const item of list) {
         const data={
           id:item.id,
-          pwsgr:worker.userCode,//抛丸施工人员姓名
+          pwry:worker.userCode,//抛丸施工人员姓名
         }
         tmpArr.push(data)
       }

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
   }

src/views/zyjhzx/pwanpgong/comps/dw.js

@@ -4,7 +4,7 @@ export default function (width,height){
   const x=0,y=0,_width=width*0.16,_height=height*0.945
 
   const container=function (){
-    const x=width*0.5+30,y=45
+    const x=width*0.5+30,y=40
 
     const group=new Konva.Group({
       x:x,
@@ -13,16 +13,19 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
 
     return group
   }
@@ -38,20 +41,21 @@ export default function (width,height){
       width:width,
       height:height
     })
-    group.on('click touchstart',function (){
-      callback(index,dw[index].list)
-    })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
 
     const text=new Konva.Text({
       x:0,
@@ -59,10 +63,10 @@ export default function (width,height){
       width: width,
       height: height,
       fill:'black',
-      text:item.name,
+      text:`${item.name}\n${item.list.length}张`,
       align:'center',
       verticalAlign:'middle',
-      fontSize:20
+      fontSize:18
     })
     group.add(text)
 

src/views/zyjhzx/pwanpgong/comps/person.js

@@ -4,29 +4,13 @@ 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,
       y:y,
-      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,
       y:0,
@@ -40,13 +24,39 @@ export default function (width,height){
         }
       },
     })
-    layer.add(group)
 
+    const bgGroup=new Konva.Group({
+      x:0,
+      y:0,
+    })
+    bgGroup.clipFunc(function(ctx) {
+      ctx.rect(6, 0, width*0.5+1, 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:6,
+        width: width*0.52-14,
+        height:182*0.8,
+        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
@@ -55,7 +65,7 @@ export default function (width,height){
   const person=function (index,persons={}){
 
     const width=120,height=110
-    const x=index*120+(index+1)*5,y=5
+    const x=index*125+(index+1)+14,y=5
     const group=new Konva.Group({
       x:x,
       y:y,
@@ -67,19 +77,72 @@ export default function (width,height){
       currentWork=persons
     })
 
-    const rect=new Konva.Rect({
+    const selectObj = new Image();
-      x:0,
+    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:width,
+        width: 39,
-      height:height,
+        height:39,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+        visible:false
+      });
+      group.add(shape)
+      shape.zIndex(0)
+      setSelectShape(shape)
+    }
+
+    group.on('click touchstart',function (){
+      currentWork=persons
+      if (selectedShape){
+        selectedShape.hide()
+        if (selectedShape===selectShape){
+          selectedShape=null
+          return
+        }
+      }
+      selectedShape=selectShape
+      selectedShape.show()
     })
-    group.add(rect)
 
-    const text=new Konva.Text({
+    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:75,
       width:width,
       height:height,
       text: persons.userName,

src/views/zyjhzx/pwanpgong/comps/pgd.js

@@ -2,7 +2,7 @@ import Konva from "konva";
 import QRCode from 'qrcode'
 
 export default function (width,height){
-  const x=width*0.66+40,y=45,_width=width*0.30,_height=height*0.945
+  const x=width*0.66+40,y=40,_width=width*0.30,_height=height*0.945
 
   const container=function (){
     const group=new Konva.Group({
@@ -12,25 +12,41 @@ export default function (width,height){
       height:_height
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/pwan/pgdbg.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
         width: _width,
         height:_height,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
     return group
   }
 
+  let workers=[]
+  const setWorkers=function (persons){
+    workers=persons
+  }
+
+  const formatWorker=function (code){
+    for (const item of workers) {
+      if(item.userCode===code){
+        return item.userName
+      }
+    }
+  }
+
   const drawGd=function (data){
     // this.layer.destroyChildren();
 
     const group=new Konva.Group({
-      x:0,
+      x:13,
-      y:0,
+      y:12,
       width:_width,
       height:_height
     })
@@ -38,9 +54,8 @@ export default function (width,height){
     const rect=new Konva.Rect({
       x:0,
       y:0,
-      width:_width,
+      width:_width-25,
-      height:_height,
+      height:_height-20,
-      fill:'white'
     })
     group.add(rect)
 
@@ -49,9 +64,7 @@ export default function (width,height){
       y:10,
       width:_width,
       height:35,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:1.2,
       text:'大连重工大连钢材加工配送有限公司',
       align:'center',
       fontSize:22,
@@ -64,7 +77,7 @@ export default function (width,height){
       width:_width,
       height:25,
       lineHeight:1,
-      stroke:'black',
+      fill:'#fff',
       strokeWidth:1,
       text:'抛丸施工单',
       align:'center',
@@ -73,13 +86,13 @@ export default function (width,height){
     group.add(sgdTitle)
 
     const dhTitle=new Konva.Text({
-      x:0,
+      x:_width*0.7,
       y:50,
       width:_width-48,
       height:15,
-      lineHeight:1,
+      fill:'#fff',
-      text:'单号:PW_'+data.gdh,
+      text:`单号:${data.gdh?'PW_'+data.gdh:''}`,
-      align:'right',
+      align:'left',
       fontSize:12,
     })
     group.add(dhTitle)
@@ -108,7 +121,6 @@ export default function (width,height){
     group0.add(group7)
     const group8=drawQz(data)
     group0.add(group8)
-    console.log(data)
     generateQRCode(data.gdh,group0)
     return group
   }
@@ -126,9 +138,7 @@ export default function (width,height){
       y:1,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'负责人:',
       fontSize:18,
       verticalAlign:'middle'
@@ -149,7 +159,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:180,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -168,7 +178,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -178,9 +188,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'回报',
       fontSize:18,
       align:'center',
@@ -193,7 +201,7 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -203,9 +211,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.jsr,
       fontSize:18,
       align:'center',
@@ -217,7 +223,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -227,10 +233,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwfkrq,
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -254,7 +258,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(jsRect)
@@ -264,9 +268,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'接收',
       fontSize:18,
       align:'center',
@@ -279,20 +281,20 @@ export default function (width,height){
       y:30,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
 
+    const name=formatWorker(data.pwry)
+
     const plText=new Konva.Text({
       x:0,
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:name,
-      strokeWidth:0.8,
-      text:data.jsr,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -303,7 +305,7 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -313,10 +315,8 @@ export default function (width,height){
       y:30,
       width:(_width-60)/2,
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
+      text:data.pwpgrq||'',
-      strokeWidth:0.8,
-      text:data.jssj,
       fontSize:18,
       align:'center',
       verticalAlign:'middle'
@@ -340,7 +340,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:200,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -359,7 +359,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -369,9 +369,7 @@ export default function (width,height){
       y:0,
       width:(_width-60),
       height:30,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:data.tzbh,
       fontSize:18,
       align:'center',
@@ -393,7 +391,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(plRect)
@@ -403,9 +401,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'批量:'+data.dcPl,
       fontSize:18,
       align:'center',
@@ -418,7 +414,7 @@ export default function (width,height){
       y:0,
       width:(_width-188)/2,
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(fdRect)
@@ -428,9 +424,7 @@ export default function (width,height){
       y:0,
       width:(-width-188)/2,
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'分段:'+data.dcFd,
       fontSize:18,
       align:'center',
@@ -454,7 +448,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     czbhGroup.add(czbhRect)
@@ -464,9 +458,7 @@ export default function (width,height){
       y:0,
       width:(_width-188),
       height:60,
-      lineHeight:1,
+      fill:'#fff',
-      stroke:'black',
-      strokeWidth:0.8,
       text:'船号:'+data.dcCh,
       fontSize:18,
       align:'center',
@@ -475,14 +467,14 @@ export default function (width,height){
     czbhGroup.add(czbhText)
     return czbhGroup
   }
-  const generateQRCode=function (text,group) {
+  const generateQRCode=function (text='',group) {
     const imgSize=118
     const rect=new Konva.Rect({
       x:385,
       y:0,
       width:128.7,
       height:120,
-      stroke:'black',
+      stroke:'#4991E5',
       strokeWidth:1,
     })
     group.add(rect)
@@ -508,6 +500,6 @@ export default function (width,height){
   }
 
   return {
-    container,drawGd
+    container,drawGd,setWorkers
   }
 }

src/views/zyjhzx/pwanpgong/comps/pgdTable.js

@@ -1,7 +1,7 @@
 
 export default function () {
   const options={
-    height:740,
+    height:706,
     align:'center',
     border: true,
     resizable: true,

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

src/views/zyjhzx/pwanpgong/index.vue

@@ -28,11 +28,15 @@ export default {
       pgdGroup:null,
       drawGd:null,
       getCurrentWorker:null,
+      setWorkers:null,
     }
   },
   mounted() {
     this.initKonvaStage();
   },
+  created(){
+    window.addEventListener('resize', this.initKonvaStage)
+  },
   methods:{
     initPgd(pgd={}){
       const group=this.drawGd(pgd)
@@ -61,6 +65,7 @@ export default {
         const {layer,group}=container()
         this.stage.add(layer)
 
+        this.setWorkers(res.data)
         for (let i=0;i<res.data.length;i++){
           const item=res.data[i]
           const worker=person(i,item)
@@ -78,14 +83,15 @@ export default {
       const titel=drawTitle(this.width,this.height,this.title)
       this.layer.add(titel)
 
-      this.initWorkers()
-
       this.initDw()
 
-      const {container:pgdContainer,drawGd}=drawPgd(this.width,this.height)
+      const {container:pgdContainer,drawGd,setWorkers}=drawPgd(this.width,this.height)
+      this.setWorkers=setWorkers
       this.drawGd=drawGd
       this.pgdGroup=pgdContainer()
       this.layer.add(this.pgdGroup)
+
+      this.initWorkers()
     },
 
   }
@@ -98,7 +104,7 @@ export default {
   width:50%;
   height: auto;
   position: absolute;
-  top:175px;
+  top:200px;
   left:20px;
   border: none;
   margin: 0;

src/views/zyjhzx/qgefkui/index.vue

@@ -74,7 +74,7 @@ export default {
         const group=container()
         group.on('click touchstart',function (){
           that.currentWorker=person
-          getPgd({field:'',jhrqField:'',user:that.currentWorker.userCode}).then(res=>[
+          getPgd({user:that.currentWorker.userCode,zt:'6'}).then(res=>[
             that.pgd=res.data
           ])
         })

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
     },

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)
+    const imageObj = new Image();
-    // group.add(rect)
+    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];

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:0,
+      y:0,
+      width:_width,
+      height:_height
+    })
+
+    const bgGroup=new Konva.Group({
       x:x,
       y:y,
       width:_width,
-      height:_height
+      height:_height,
     })
+    bgGroup.clipFunc(function(ctx) {
+      ctx.rect(0, 6, _width, _height-11);
+    });
+    bgGroup.add(group)
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      bgGroup.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
 
     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
@@ -49,28 +63,62 @@ const liliao=function (width,height,dw,callback) {
       height:height
     })
     group.on('click touchstart',function (){
+      if (selectedShape){
+        selectedShape.hide()
+        if (selectedShape===selectShape){
+          selectedShape=null
+          return
+        }
+      }
+      selectedShape=selectShape
+      selectedShape.show()
       currentDw=item
       callback(index,dw[index])
     })
 
-    const rect=new Konva.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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      group.add(shape)
+      shape.zIndex(0)
+    }
 
-    group.add(rect)
+    const selectObj = new Image();
+    let selectedShape=null;
+    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: width-width*0.30,
+        y: 4,
+        width: width*0.25,
+        height:width*0.25,
+        image: this,
+        visible:false
+      });
+      group.add(shape)
+      shape.zIndex(0)
+      setSelectShape(shape)
+    }
 
     const text=new Konva.Text({
       x:0,
       y:0,
       width: width,
       height: height,
-      fill:'black',
+      fill:'#fff',
-      text:item.name,
+      text:`${item.name}\n${item.list.length}张钢板`,
       align:'center',
       verticalAlign:'middle',
       fontSize:20

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:0,
+      y:0,
+      width:_width,
+      height:_height,
+      draggable:true,
+      dragBoundFunc:function (pos){
+        return {
+          x:x,
+          y:pos.y
+        }
+      },
+    })
+
+    const bgGroup=new Konva.Group({
       x:x,
       y:y,
       width:_width,
-      height:_height
+      height:_height,
     })
-
+    bgGroup.clipFunc(function(ctx) {
-    const rect=new Konva.Rect({
+      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,
-      stroke:'black',
+        image: this,
-      strokeWidth:1,
+      });
-    })
+      bgGroup.add(shape)
-
+      shape.zIndex(0)
-    group.add(rect)
+    }
 
     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,73 @@ 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){
+          selectedShape=null
+          return
+        }
+      }
+      selectedShape=selectShape
+      selectedShape.show()
     })
 
-    const rect=new Konva.Rect({
+    const bgObj = new Image();
+    bgObj.src = require('@/assets/sliao/personbg1.png');
+    bgObj.onload = function () {
+      const shape = new Konva.Image({
         x: 0,
         y: 0,
-      width:width,
+        offsetX:4,
-      height:height,
+        width: 137*0.95,
-      stroke:'black',
+        height:155*0.80,
-      strokeWidth:1,
+        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',

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,

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,
+    x:20,
-    y:65,
+    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

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,
   })

src/views/zyjhzx/sliao/index.vue

@@ -53,7 +53,7 @@ export default {
   methods:{
     wsSubscribe(){
       this.sockets.subscribe('slComplete', data => {
-        if (this.currentDw&&this.currentDwIndex&&this.currentDw.id===data.dwId) {
+        if (this.currentDw&&this.currentDw.id===data.dwId) {
           if (this.slGroup){
             this.slGroup.destroyChildren()
           }
@@ -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=>{
+                    shangLiao(data).then(res=>{})
-                      console.log(res)
-                    })
 
                     this.remove()
 
@@ -165,8 +338,6 @@ export default {
                   }
                   _sljhGroup.draggable(true)
                 })
-                tmpGroup.startDrag()
-                _that.visible(false)
               }
             }
           },500)
@@ -178,30 +349,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 +402,9 @@ export default {
 
 <style>
 .vxe-button{
-  top: -2px;
+  top: 0px;
   width: 80px;
-  height: 27px !important;
+  height: 22px !important;
 }
 
 .vxe-input{
@@ -266,7 +413,7 @@ export default {
 
 #searchPl {
   position: absolute;
-  top:43px;
+  top:45px;
   left:15px;
   border: none;
   margin: 0;

src/views/zyjhzx/sliao/index_sliao.vue

@@ -160,7 +160,6 @@ export default {
         })
 
         group.on('dragend',function (){
-          console.log(_index)
           const index=this.getAttr('index')
           const element = slList.splice(index-1, 1)[0];
           slList.splice(_index-1, 0, element);

src/views/zyjhzx/sliao/sliao.worker.js

@@ -22,8 +22,6 @@
 
 //*.work.js
 onmessage = (e)=>{
-  console.log(1234)
   const {data}=e
-  console.log(data)
   postMessage(data)
 }