diff --git a/components/myMain.vue b/components/myMain.vue
index 5fc4f2e..8e873c9 100644
--- a/components/myMain.vue
+++ b/components/myMain.vue
@@ -1,24 +1,25 @@
-
+
邀请粉丝（代理）关注我的发单号
-
+
长按图片转发给微信好友
-
+ }" canvas-id="text">
-
+
@@ -27,16 +28,12 @@
今日更新职位{{ appInfo.jobUpdateNum }}
-
+ }">
@@ -56,15 +53,11 @@
-
+ }">
@@ -75,509 +68,550 @@
-
-
+
+
-
+
-
-
+
+
-
+
+
\ No newline at end of file
diff --git a/utils/canvas.js b/utils/canvas.js
new file mode 100644
index 0000000..8e7e335
--- /dev/null
+++ b/utils/canvas.js
@@ -0,0 +1,91 @@
+export default {
+ roundRect1 (ctx, x, y, w, h, r, color) {
+ //绘制圆角矩形(无填充色))
+ ctx.save();
+ ctx.fillStyle = color;
+ ctx.strokeStyle = color;
+ ctx.lineJoin = "round"; //交点设置成圆角
+ ctx.lineWidth = r;
+ ctx.strokeRect(x + r / 2, y + r / 2, w - r, h - r);
+ ctx.fillRect(x + r, y + r, w - r * 2, h - r * 2);
+ ctx.stroke();
+ ctx.closePath();
+ },
+ fillTextLineBreak (ctx, text, x, y, lw, lh, color = "#333", font = "32", weight = "500", align = "left") {
+ var i = 0;
+ var n = 0;
+ var r = -1;
+ // var initHeight = 0;
+ ctx.font = weight + " " + font + "px Arial"; //字体大小
+ ctx.fillStyle = color; //字体颜色
+ // ctx.textBaseline = align;
+ // ctx.textAlign = align;
+ while (i < text.length) {
+ while (ctx.measureText(text.substring(n, i)).width < lw && i < text.length) {
+ i++;
+ }
+ r++;
+ ctx.fillText(text.substring(n, i), x, y + lh * r);
+ n = i;
+ }
+ },
+ drawCenteredText (ctx, x, y, textSegments) {
+
+ // 计算总宽度
+ const totalWidth = this.calculateTotalWidth(ctx, textSegments);
+ // console.log('totalWidth', totalWidth, textSegments);
+ // 计算起始X坐标（居中位置）
+ const centerX = x;
+ const startX = (centerX - totalWidth) / 2;
+ const centerY = y;
+
+ // 绘制拼接文本
+ let currentX = startX;
+ textSegments.forEach((segment) => {
+ if (segment) {
+ ctx.font = `${segment.fontWeight} ${segment.fontSize}px Arial`;
+ ctx.fillStyle = segment.color;
+
+ // 文本基线设为中间，使垂直方向也居中
+ // ctx.textBaseline = "middle";
+
+ // 绘制当前文本片段
+ ctx.fillText(segment.content, currentX, centerY);
+
+ // 更新X坐标，为下一段文本做准备, 文本长度为1的时候，使用字体大小
+ currentX += ((ctx.measureText(segment.content).width) + (segment.space || 0));
+ }
+
+ });
+ },
+ roundRect_yuan (ctx, x, y, size, color) {
+ // 开始绘制
+ ctx.save(); // 保存
+
+ ctx.beginPath(); // 开始绘制
+ // ctx.arc(100, 75, 50, 0, 2 * Math.PI)
+ ctx.arc(size / 2 + x, size / 2 + y, size / 2, 0, Math.PI * 2, false);
+ ctx.fillStyle = color;
+ ctx.strokeStyle = color;
+ ctx.fill();
+ ctx.clip();
+ // 恢复之前保存的绘图上下文
+ ctx.restore();
+ },
+ /**
+ * 背景图绘制
+ */
+ roundRect (ctx, img, bg_x, bg_y, bg_w, bg_h, bg_r) {
+ // 开始绘制
+ ctx.save();
+ ctx.beginPath();
+ ctx.arc(bg_x + bg_r, bg_y + bg_r, bg_r, Math.PI, Math.PI * 1.5);
+ ctx.arc(bg_x + bg_w - bg_r, bg_y + bg_r, bg_r, Math.PI * 1.5, Math.PI * 2);
+ ctx.arc(bg_x + bg_w - bg_r, bg_y + bg_h - bg_r, bg_r, 0, Math.PI * 0.5);
+ ctx.arc(bg_x + bg_r, bg_y + bg_h - bg_r, bg_r, Math.PI * 0.5, Math.PI);
+ ctx.clip();
+ ctx.drawImage(img, bg_x, bg_y, bg_w, bg_h);
+ // 恢复之前保存的绘图上下文
+ ctx.restore();
+ },
+}
\ No newline at end of file