From 867606c7f2d4ce4f182403ffd32d2bd9ff294e39 Mon Sep 17 00:00:00 2001 From: jscyl13849007907 <13849007907@163.com> Date: Sat, 16 May 2026 11:04:51 +0800 Subject: [PATCH] no message --- components/myMain.vue | 59 +++++++++++++++++++++------------------------------ 1 file changed, 24 insertions(+), 35 deletions(-) diff --git a/components/myMain.vue b/components/myMain.vue index 5fa03c2..79b83d1 100644 --- a/components/myMain.vue +++ b/components/myMain.vue @@ -3,12 +3,12 @@ :style="{ 'background-image': showBg ? 'url(' + cdnBaseImg + 'share_bg.svg)' : '' }" :class="showBg ? 'g_pt_32' : ''"> - +
- 长按图片转发给微信好友 @@ -349,33 +349,31 @@ size: true, }) .exec((res) => { - // console.log("uni 获取节点信息：", res); - // // console.log("sharelImg", sharelImg); const canvas = res[0].node; const ctx = canvas.getContext("2d"); + // 元素整体上移偏移量 + const offsetTop = 190; new Promise(function(resolve) { - // 绘制背景图片 uni.getImageInfo({ - src: sharelImg, // 网络图片 + src: sharelImg, success(res) { - // console.log("res111", res); canvas.width = res.width; canvas.height = res.height + 250; mycenter = canvas.width; myheight = canvas.height; const img = canvas.createImage(); img.src = res.path; - // console.log("img111", img); img.onload = (info) => { - // 绘制背景色 - canvasJS.roundRect1(ctx, 0, 0, canvas.width, canvas.height + 250, 0, baseColor); + // 绘制背景色（圆角矩形） + canvasJS.roundRect1(ctx, 0, 0, canvas.width, canvas.height, 30, baseColor); // 绘制中间白色背景 - canvasJS.roundRect1(ctx, (mycenter - canvas.width + 120) / 2, 280, canvas.width - - 120, canvas.height - 360, 180, "#fff"); + const whiteTop = 120; + const whiteHeight = canvas.height - 240; + canvasJS.roundRect1(ctx, 60, whiteTop, canvas.width - 120, whiteHeight, 60, "#fff"); // 绘制关注发单号背景色 - canvasJS.roundRect1(ctx, (mycenter - 800) / 2, canvas.height - 600, 800, 136, 135, + canvasJS.roundRect1(ctx, (mycenter - 800) / 2, canvas.height - 540 - offsetTop, 800, 136, 135, baseColor); - let qrTop = 1145; + let qrTop = 1145 - offsetTop; // 二维码左上角的 canvasJS.roundRect1(ctx, (mycenter - 600) / 2 - 5, qrTop, 136, 136, 80, baseColor); // 二维码右上角的 @@ -388,40 +386,33 @@ baseColor); // 绘制关注发单号文字 canvasJS.fillTextLineBreak(ctx, "扫一扫关注我的发单号", (mycenter - "扫一扫关注我的发单号".length * 54) / - 2, canvas.height - 515, "扫一扫关注我的发单号".length * 54, 58, that.isLightColor( - baseColor) ? "#333" : "#fff", 54, 600); // 总职位 + 2, canvas.height - 445 - offsetTop, "扫一扫关注我的发单号".length * 54, 58, that.isLightColor( + baseColor) ? "#333" : "#fff", 54, 600); - canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 300, [{ + canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 170 - offsetTop, [{ content: "该图片请不要发给工友", color: "#d30000", - fontWeight: 500, + fontWeight: 600, fontSize: 72 }]); - canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 200, [{ + canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 60 - offsetTop, [{ content: "关注后能直接看到单子的代理费/佣金", color: "#333", fontWeight: 500, fontSize: 48 }]); - // 绘制头像背景色 - // canvasJS.roundRect_yuan(ctx, (mycenter - 360) / 2, 110, 360, "#ffffff"); resolve(true); }; }, - fail(err) { - // console.log("errerrerrerrerrerrerr", err); - }, + fail(err) {}, }); }).then(() => { - //使用： - this.setShareJobImg(ctx, canvas, mycenter) + this.setShareJobImg(ctx, canvas, mycenter, offsetTop) .then(function(canvas1) { - // console.log("canvas1", canvas1); uni.canvasToTempFilePath({ canvas: canvas1, success(res) { - // console.log("res222", res); resolve(res); }, fail(res) { @@ -521,17 +512,16 @@ return (num / 10000).toFixed(fixed); }, // 设置分享布局 - setShareJobImg(ctx, canvas, mycenter, funObj) { + setShareJobImg(ctx, canvas, mycenter, offsetTop = 0) { let that = this; return new Promise((imgres) => { uni.getImageInfo({ src: that.wxCode, success(res) { const img = canvas.createImage(); - // console.log("res333", res); img.src = res.path; img.onload = () => { - canvasJS.roundRect(ctx, img, (mycenter - 600) / 2, 1150, 600, 600, 35); + canvasJS.roundRect(ctx, img, (mycenter - 600) / 2, 1150 - offsetTop, 600, 600, 35); let info = that.appInfo; if (!info.logo) { info.logo = @@ -544,13 +534,12 @@ img.src = res.path; img.onload = () => { let numBase = 150; - // canvasJS.roundRect(ctx, img, (mycenter - 300) / 2, 140, 300, 300, 150); // logo canvasJS.fillTextLineBreak(ctx, info.fullName, (mycenter - info.fullName.length * - 80) / 2, 600, info.fullName.length * 80, 200, "#333", 80, 600, "left"); // 企业名称 + 80) / 2, 600 - offsetTop, info.fullName.length * 80, 200, "#333", 80, 600, "left"); canvasJS.fillTextLineBreak(ctx, - `【${info.fullName}】新一代发单号（小程序），海量职位每日更新，线上报名方便快捷，工单状态实时查看。`, numBase - 25, 800, - mycenter - 260, 86, "#666", 56, 500, "center"); // slogan + `【${info.fullName}】新一代发单号（小程序），海量职位每日更新，线上报名方便快捷，工单状态实时查看。`, numBase - 25, 800 - offsetTop, + mycenter - 260, 86, "#666", 56, 500, "center"); const textSegments = [ { content: that.formatNumberAdvanced(info.recruitmentJobNum).toString(),