From d0e846a329a7676908166197df2f6a0b1d1bfda8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=91=A3=E5=93=B2=E5=A5=87?= <13840175730@139.com> Date: Thu, 18 Jul 2024 16:43:53 +0800 Subject: [PATCH] =?UTF-8?q?1.=E5=A2=9E=E5=8A=A0=E4=B8=8A=E6=96=99=E8=AE=A1?= =?UTF-8?q?=E5=88=92=E6=89=A7=E8=A1=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 + pnpm-lock.yaml | 91 ++++++++++ src/assets/gb.png | Bin 0 -> 3880 bytes src/main.js | 3 + src/views/hbao/comps/Hcq.vue | 19 ++- src/views/hbao/comps/Hgx.vue | 1 - src/views/hbao/comps/Hlj.vue | 5 +- src/views/sliao/index.vue | 316 +++++++++++++++++++++++++++++++---- 8 files changed, 397 insertions(+), 40 deletions(-) create mode 100644 src/assets/gb.png diff --git a/package.json b/package.json index 258931c..679c8d8 100644 --- a/package.json +++ b/package.json @@ -53,6 +53,7 @@ "vue-print-nb": "^1.7.5", "vue-router": "3.0.2", "vue-splitpane": "1.0.4", + "vue-worker": "^1.2.1", "vuedraggable": "2.20.0", "vuex": "3.1.0", "vxe-table": "^3.7.5", @@ -81,6 +82,7 @@ "less-loader": "5.0.0", "lint-staged": "8.1.5", "mockjs": "1.0.1-beta3", + "npm": "^10.8.2", "plop": "2.3.0", "runjs": "4.3.2", "sass": "1.26.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2506028..435577f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -110,6 +110,9 @@ dependencies: vue-splitpane: specifier: 1.0.4 version: 1.0.4 + vue-worker: + specifier: ^1.2.1 + version: 1.2.1 vuedraggable: specifier: 2.20.0 version: 2.20.0 @@ -190,6 +193,9 @@ devDependencies: mockjs: specifier: 1.0.1-beta3 version: 1.0.1-beta3 + npm: + specifier: ^10.8.2 + version: 10.8.2 plop: specifier: 2.3.0 version: 2.3.0 @@ -9659,6 +9665,81 @@ packages: which: 1.3.1 dev: true + /npm@10.8.2: + resolution: {integrity: sha512-x/AIjFIKRllrhcb48dqUNAAZl0ig9+qMuN91RpZo3Cb2+zuibfh+KISl6+kVVyktDz230JKc208UkQwwMqyB+w==} + engines: {node: ^18.17.0 || >=20.5.0} + hasBin: true + dev: true + bundledDependencies: + - '@isaacs/string-locale-compare' + - '@npmcli/arborist' + - '@npmcli/config' + - '@npmcli/fs' + - '@npmcli/map-workspaces' + - '@npmcli/package-json' + - '@npmcli/promise-spawn' + - '@npmcli/redact' + - '@npmcli/run-script' + - '@sigstore/tuf' + - abbrev + - archy + - cacache + - chalk + - ci-info + - cli-columns + - fastest-levenshtein + - fs-minipass + - glob + - graceful-fs + - hosted-git-info + - ini + - init-package-json + - is-cidr + - json-parse-even-better-errors + - libnpmaccess + - libnpmdiff + - libnpmexec + - libnpmfund + - libnpmhook + - libnpmorg + - libnpmpack + - libnpmpublish + - libnpmsearch + - libnpmteam + - libnpmversion + - make-fetch-happen + - minimatch + - minipass + - minipass-pipeline + - ms + - node-gyp + - nopt + - normalize-package-data + - npm-audit-report + - npm-install-checks + - npm-package-arg + - npm-pick-manifest + - npm-profile + - npm-registry-fetch + - npm-user-validate + - p-map + - pacote + - parse-conflict-json + - proc-log + - qrcode-terminal + - read + - semver + - spdx-expression-parse + - ssri + - supports-color + - tar + - text-table + - tiny-relative-date + - treeverse + - validate-npm-package-name + - which + - write-file-atomic + /nprogress@0.2.0: resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==} dev: false @@ -11801,6 +11882,10 @@ packages: is-arrayish: 0.3.2 dev: true + /simple-web-worker@1.2.0: + resolution: {integrity: sha512-+okbi2fpRokCZoCgdWqb+2kOykkdcSnLkdz54EivlqACst5TSqJRLXPiilAjlkwW9Z0SRwev74qKMc+3jIVL0g==} + dev: false + /sisteransi@1.0.5: resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} dev: true @@ -13298,6 +13383,12 @@ packages: resolution: {integrity: sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==} dev: true + /vue-worker@1.2.1: + resolution: {integrity: sha512-feu5cWI0ztoSSIZxVvaCWLBEKUG1pCJqVkKmWvyrkUfOqMuOkklmY8iX5kaJTSsRuvVFPEkTExkMXM6+Nkec1Q==} + dependencies: + simple-web-worker: 1.2.0 + dev: false + /vue@2.6.10: resolution: {integrity: sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ==} diff --git a/src/assets/gb.png b/src/assets/gb.png new file mode 100644 index 0000000000000000000000000000000000000000..eacd916de74affc009d34310dd6dbc7fad3aed32 GIT binary patch literal 3880 zcmZ`+dt6d?8%IJ#R6+q~Mh4ze50)ygI%CcIy z$}~&c+?jH0-PT1cNPAZpMX`WxF zAv?5p!(gRI3fbnWNhoIfXw4^(FqWL0jyQ;H)v$%vrNW=ia1#=#R!$hDc|v zx|}Oy?>n`=yuqS?8KmSo!(KNKA4~YB7AX6I10?({2x9ggMco7M2i`%HgQiZm$ICB# z^UVhs11Z~GM7HTL5$F%|&l$*Au&O5ah`kGb!S=$t?7PyDI$7#^Zb%yQ1GmDDczQw$}GDtHkXjeB%)0g4|u{9vo~|Jk6+LzO_p zfvVp&ABiU6`0w?QVWo}K3pjk?=^@c9ODcQ@Gh?6GP9{Q9%&ie%#p|PkiXp1CI(V)D zPSx_$?NdAVK_VB1ZGZ?1LPxI4&GP zPWiWO^%@CF-@rg#e!VI(9O91|#T)PG*PiVj8_R4#n*-PHst>^g$&J$rAipoIi$4`% zUT8iu{bt>52nC*u7}X#@ZETJ^)N{5tLGU$(iwjY_62Sh@XZ$12H<(DPHAs_`*Ix8b zpXoR-OX?r5v6F2_i|)J)@PNqbTF0&BeyoBwhU`Dlw0TJ4D*^*b=2YEVN=tZKjuU) zJ>7Qj?s{L-(hR&U>`jIeZT|I_brAmS=MiNE%$S&%?ty`s-=obemj+!6BtT5%v4!kj zv?yLlLmW(h+YB4n^EH+@R%)m1AL`;)yhS*Y?E!p0Hhlw+9>GYDY&${l4FSrY>E|4-U#4O*(6??LX5$?+yT| zx-_|Y)9QzFa0lyK6G{YTcT7#(cCA)h4j}7&MAqx0m4WCa{D-`Ik#GT9ZIDX+akbha zm7sF^bnK8y{iSJTA(aOF*dy2U`%%m1X2-ufRjJRDTAnw>)=@9iG=ypt58C!)@)+Sg zuPxLhbNot)1H1%^h!TE4*DX-)Q0j?(xZpg@FL=^?z3c%7y~Uk|wB}CA09q;cZ-2BY z!M62fuLLnR-@NS(cUE$ASHte<-5SLw-9tk|;zcX(9IL9*^lrYevMuTChR5fqoc0^( zs+oYY#e=&>xRA1|5VSS84J_(1-&rGbE_QzfUhB(FG=tgb=gbzpD%~BW6FysOIzdPS z7mKAD2T55B{-l7p`j!raljko7ukTK{ zrIs0Ij=ep9E+VPUOmq+BV1muW3S;Ee94f&I^|$(|44$CDG?ND3i19Ey5!1L#o265N!j zN>?{<9>vBPUoX1!G40xA5u?m!6kt>~snAGLsXb zNCZp7g<|{wFnPkSyD9Xa;scwpl!$3uFr)Ni5@n(|Z78`aF@DWZlnyB71MqT-JU1KK z2fPEscvFQ>1HkJSr0W)(c)6;$Uea%%a<&LyeOBB!pS*fJ&3b4wXZ*%S!3227H#|H) z1D#`k|B%>gm^2y)q2MZH`vMzz@f?(qzG#~pBrIOeb^*d)I}hm96ej|+_ZsFYU0)s= z5kg^mo>lDut<1^_mucGRPY0o@lnJDl!4U8ZGLi9%?x+t!Ls5F(_zf79J#V#E+@`6q z^PswrnkcE3HWE$jzdOxIilj&pgd;(^kGK+yzUGX4l43w4f(}E1^f>XcPWWXSNs$>R zf{0F#ill$drMccRe%9;&DBNt-Y-v1**VdOS(|G>t!UUm|_t#vSTp;#pZ;FKQV?STq zwN^Ru>PeJth=zd8IW_g9G0B`B0%!FZEzOQw7%0U05#fb7P9DmbRax>e2|O2YX8z7YEl|Ic^MD0_2kGj1n=c=;JgJ!c)4TC?Jr~+o}U($ vsiqj=4w6ukf*iOU8YI~&Dq`jZM}}61h-Lo;RcCRt literal 0 HcmV?d00001 diff --git a/src/main.js b/src/main.js index c86e310..0d21c8f 100644 --- a/src/main.js +++ b/src/main.js @@ -85,6 +85,9 @@ import dataV from '@jiaminghi/data-view' Vue.config.productionTip = false Vue.use(dataV) +import VueWorker from 'vue-worker' // Web worker插件 +Vue.use(VueWorker) + // register global utility filters Object.keys(filters).forEach(key => { Vue.filter(key, filters[key]) diff --git a/src/views/hbao/comps/Hcq.vue b/src/views/hbao/comps/Hcq.vue index d2612ac..7df6c64 100644 --- a/src/views/hbao/comps/Hcq.vue +++ b/src/views/hbao/comps/Hcq.vue @@ -15,7 +15,23 @@ export default { {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, {name:'张三02',imgSrc:require("@/assets/user.png"),yhdm:'张三02'}, {name:'张三03',imgSrc:require("@/assets/user.png"),yhdm:'张三03'}, - {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'} + {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'}, + // {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, + // {name:'张三02',imgSrc:require("@/assets/user.png"),yhdm:'张三02'}, + // {name:'张三03',imgSrc:require("@/assets/user.png"),yhdm:'张三03'}, + // {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'}, + // {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, + // {name:'张三02',imgSrc:require("@/assets/user.png"),yhdm:'张三02'}, + // {name:'张三03',imgSrc:require("@/assets/user.png"),yhdm:'张三03'}, + // {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'}, + // {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, + // {name:'张三02',imgSrc:require("@/assets/user.png"),yhdm:'张三02'}, + // {name:'张三03',imgSrc:require("@/assets/user.png"),yhdm:'张三03'}, + // {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'}, + // {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, + // {name:'张三02',imgSrc:require("@/assets/user.png"),yhdm:'张三02'}, + // {name:'张三03',imgSrc:require("@/assets/user.png"),yhdm:'张三03'}, + // {name:'张三04',imgSrc:require("@/assets/user.png"),yhdm:'张三04'}, ] } }, @@ -94,6 +110,5 @@ export default { width: 100%; height: 13vh; aspect-ratio: 16/9; - margin-left: 4%; } diff --git a/src/views/hbao/comps/Hgx.vue b/src/views/hbao/comps/Hgx.vue index 8c1263a..dc2e30a 100644 --- a/src/views/hbao/comps/Hgx.vue +++ b/src/views/hbao/comps/Hgx.vue @@ -108,6 +108,5 @@ export default { width: 90%; height: 75.5vh; aspect-ratio: 16/9; - margin-left: 4%; } diff --git a/src/views/hbao/comps/Hlj.vue b/src/views/hbao/comps/Hlj.vue index 2835e66..eca472a 100644 --- a/src/views/hbao/comps/Hlj.vue +++ b/src/views/hbao/comps/Hlj.vue @@ -11,9 +11,7 @@ export default { layer:'', width:'', height:'', - msgList:[ - - ], + msgList:[], ljList:[ {name:'张三01',imgSrc:require("@/assets/user.png"),yhdm:'张三01'}, ] @@ -150,6 +148,5 @@ export default { width: 95%; height: 13vh; aspect-ratio: 16/9; - margin-left: 4%; } diff --git a/src/views/sliao/index.vue b/src/views/sliao/index.vue index c8698f1..65d2a8c 100644 --- a/src/views/sliao/index.vue +++ b/src/views/sliao/index.vue @@ -11,24 +11,184 @@ export default { title:'上 料 作 业 区', stage:null, layer:null, + width:'', + height:'', + gbImage:require('@/assets/gb.png'), sljhGroup:null, sljhList:[],//上料计划 - qyList:[],//区域,每个内部包含垛位信息 - msg:'123ada地方多少', + slGroup:'', + slList:'', + dwGroup:'', + qyList:[//区域,每个内部包含垛位信息 + { + name:'一区', + dw:[ + { + name:'一剁', + list:['板材1','板材2','板材3','板材4','板材5','板材6','板材7','板材8','板材9','板材10','板材11','板材12','板材13','板材14',] + }, + { + name:'二剁', + list:['板材1','板材2','板材3','板材4','板材5','板材6','板材7','板材8','板材9','板材10','板材11','板材12','板材13','板材14',] + } + ] + }, + { + name:'二区', + dw:[ + { + name:'一剁', + list:['板材1','板材2','板材3','板材4','板材5','板材6','板材7','板材8','板材9','板材10','板材11','板材12','板材13','板材14',] + } + ] + }, + ], + msg:'板材1放入一剁三层', + worker:'', } }, + created(){ + const actions = [ + { + message: "fn1", // message消息与func函数执行为映射关系 + func: (params1, params2) => { + console.log("params参数-->", params1, params2); + function fib(n) { + if ((n == 1) | (n == 2)) { + return 1; + } else { + return fib(n - 1) + fib(n - 2); + } + } + return fib(30); + }, + }, + { + message: "fn2", + func: () => { + function fib(n) { + if ((n == 1) | (n == 2)) { + return 1; + } else { + return fib(n - 1) + fib(n - 2); + } + } + return fib(30); + }, + }, + { + message: "fn3", + func: () => { + function fib(n) { + if ((n == 1) | (n == 2)) { + return 1; + } else { + return fib(n - 1) + fib(n - 2); + } + } + // throw "一个报错挂了,其他的也跟着挂了,走.catch"; // 抛出错误(的确很像Promise.all()) + return fib(30); + }, + }, + ]; + // 2. 根据消息函数数组去create创建一个worker，并存到data变量中去，以便于后续随时使用 + 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; + }); + this.initKonvaStage(); //fixme 调试用 this.drawMsg() this.drawSljhItem([ - {czbh:'123',pl:'001',tzbh:'123123121',perQy:'一区',perDw:'三层'}, - {czbh:'123',pl:'001',tzbh:'123123122',perQy:'一区',perDw:'三层'}, - {czbh:'123',pl:'001',tzbh:'123123123',perQy:'一区',perDw:'三层'}, - + {czbh:'G175K-4',pl:'001',tzbh:'B006N4PX006',perQy:'一区',perDw:'一剁',perCeng:'三层'}, + {czbh:'G175K-4',pl:'001',tzbh:'B006N4PX007',perQy:'一区',perDw:'一剁',perCeng:'三层'}, + {czbh:'G175K-4',pl:'001',tzbh:'B006N4PX008',perQy:'一区',perDw:'一剁',perCeng:'三层'}, ]) }, methods: { + //料场垛位实际情况 + drawSlItem(slList){ + console.log(slList.length) + for (let i = 1; i <=slList.length; i++) { + const gb=slList[i-1] + const group=new Konva.Group({ + x:0, + y:this.height-260-i*40, + }) + this.slGroup.add(group) + const indexRect=new Konva.Rect({ + x:0, + y:0, + width:40, + height:40, + stroke:'black', + strokeWidth:1, + }) + //group.add(indexRect) + const indexText=new Konva.Text({ + x:0, + y:0, + width:40, + height:40, + fill:'black', + text:i, + align:'center', + verticalAlign:'middle', + }) + group.add(indexText) + + //层 规格,套料图 船号,上料日期,计划切割日期 + const imageObj = new Image(); + const imgSize=300 + imageObj.src = this.gbImage; + imageObj.onload = function () { + const shape = new Konva.Image({ + x: 60, + y: 0, + width: imgSize, + height:40, + image: imageObj, + }); + group.add(shape) + const gbText=new Konva.Text({ + x: 60, + y: 0, + width: imgSize, + height:40, + fill:'black', + text:gb+',12*2830*13090', + align:'center', + verticalAlign:'middle', + }) + group.add(gbText) + } + + const concent=new Konva.Text({ + x: imgSize+40, + y: 0, + width: imgSize, + height:40, + fill:'black', + text:'G175K-4,上料:2024/07/01,切割:2024/07/04', + align:'center', + verticalAlign:'middle', + }) + group.add(concent) + } + }, //绘制上料计划钢板信息 drawSljhItem(list){ const itemWith=80; @@ -58,89 +218,179 @@ export default { lineHeight:1, stroke:'blue', strokeWidth:0.1, - text:item.czbh+'\n'+item.pl+'\n'+item.tzbh+'\n建议位置\n'+item.perQy+'\n'+item.perDw, + text:item.czbh+'\n'+item.pl+'\n'+item.tzbh+'\n建议位置\n'+item.perQy+'\n'+item.perDw+'\n'+item.perCeng, align:'center', - verticalAlign:'middle' + verticalAlign:'middle', }) qyGroup.add(text) - console.log(this.sljhGroup) this.sljhGroup.add(qyGroup) } }, initKonvaStage(){ + this.width=this.$refs.sliao.clientWidth + this.height=this.$refs.sliao.clientHeight + this.stage = new Konva.Stage({ container: "sliao", - width: this.$refs.sliao.clientWidth, - height: this.$refs.sliao.clientHeight, + width: this.width, + height: this.height, }); - //pointer //this.stage.container().style.cursor = "sw-resize"; this.layer = new Konva.Layer(); this.stage.add(this.layer) + this.layer.draw(); + this.drawTitle() //构建布局区域 //上料计划显示区 this.drawSljh() //区域垛位选择区 - this.drawDw() + this.drawQy() //上料功能区 this.drawSl(); //移垛记录区 this.drawYd(); - - this.layer.draw(); }, //绘制移垛记录区 drawYd(){ this.drawContainer({ - x:15+this.$refs.sliao.clientWidth*0.6+10, - y:this.$refs.sliao.clientHeight-this.$refs.sliao.clientHeight*0.8+10, - width: this.$refs.sliao.clientWidth*0.38-2, - height: this.$refs.sliao.clientHeight*0.8-20, + x:15+this.width*0.6-15+5, + y:this.height-this.height*0.8+10, + width: this.width*0.4-20, + height: this.height*0.8-20, stroke:'blue', strokeWidth:1, }) }, //绘制上料功能区 drawSl(){ - this.drawContainer({ - x:15+this.$refs.sliao.clientWidth*0.2+5, - y:this.$refs.sliao.clientHeight-this.$refs.sliao.clientHeight*0.8+10, - width: this.$refs.sliao.clientWidth*0.4, - height: this.$refs.sliao.clientHeight*0.8-20, + const {qyGroup}=this.drawContainer({ + x:15+this.width*0.2+5, + y:this.height-this.height*0.8+10, + width: this.width*0.4-20, + height: this.height*0.8-20, stroke:'blue', strokeWidth:1, }) + this.slGroup=qyGroup + }, + drawDw(qyGroup,qy,size){ + if (this.dwGroup){ + this.dwGroup.destroyChildren() + } + const _group=this.dwGroup=new Konva.Group({ + x:54+size, + y:15, + width: size, + height: size, + }) + qyGroup.add(_group) + for (let i = 0; i < qy.dw.length; i++) { + const dw=qy.dw[i] + const group=new Konva.Group({ + x:0, + y:i*5+i*size, + width: size, + height: size, + }) + const rect=new Konva.Rect({ + x:0, + y:0, + width: size, + height: size, + stroke:'black', + strokeWidth:1, + }) + group.add(rect) + const text=new Konva.Text({ + x:0, + y:0, + width: size, + height: size, + fill:'black', + text:qy.name+'\n'+dw.name, + align:'center', + verticalAlign:'middle', + fontSize:20 + }) + group.add(text) + group.on('click touchstart',(evt)=>{ + console.log(evt.target) + this.slGroup.destroyChildren() + this.drawSlItem(dw.list) + }) + _group.add(group) + } }, //绘制垛位选择区 - drawDw(){ - this.drawContainer({ + drawQy(){ + const {quRet,qyGroup}=this.drawContainer({ x:15, - y:this.$refs.sliao.clientHeight-this.$refs.sliao.clientHeight*0.8+10, - width: this.$refs.sliao.clientWidth*0.2, - height: this.$refs.sliao.clientHeight*0.8-20, + y:this.height-this.height*0.8+10, + width: this.width*0.2, + height: this.height*0.8-20, stroke:'blue', strokeWidth:1, }) + console.log(111) + const size=120; + for (let i = 0; i < this.qyList.length; i++) { + const qy=this.qyList[i] + const group=new Konva.Group({ + x:23, + y:15+i*5+i*size, + width: size, + height: size, + }) + const rect=new Konva.Rect({ + x:0, + y:0, + width: size, + height: size, + stroke:'black', + strokeWidth:1, + }) + group.add(rect) + const text=new Konva.Text({ + x:0, + y:0, + width: size, + height: size, + fill:'black', + text:qy.name, + align:'center', + verticalAlign:'middle', + fontSize:20 + }) + group.add(text) + group.on('click touchstart',(evt)=>{ + console.log(evt.target) + this.drawDw(qyGroup,qy,size) + }) + qyGroup.add(group) + } }, //上料计划选择区 drawSljh(){ const {quRet,qyGroup}=this.drawContainer({ x:15, y:65, - width: this.$refs.sliao.clientWidth-30, - height: this.$refs.sliao.clientHeight*0.2-60, + width: this.width-30, + height: this.height*0.2-60, stroke:'blue', strokeWidth:1, }) + qyGroup.on('click touchstart',(evt)=>{ + console.log(evt) + }) this.sljhGroup=qyGroup }, drawMsg(){ this.drawText({ x:15, y:50, - width:this.$refs.sliao.clientWidth-30, + width:this.width-30, height:20, lineHeight:1, stroke:'black', @@ -153,7 +403,7 @@ export default { this.drawText({ x:15, y:8, - width:this.$refs.sliao.clientWidth-30, + width:this.width-30, height:20, lineHeight:1, stroke:'blue',