fix: image

pages/make/index.vue

@@ -66,7 +66,7 @@
               fontFamily: selectedFont.family,
               fontSize: fontSize + 'rpx',
               lineHeight: fontSize * 1.5 + 'rpx',
-              fontWeight: 'bold',
+              fontWeight: fontWeight,
             }"
             >{{
               (targetName || "") + "\n  " + (blessingText.content || "")
@@ -85,10 +85,14 @@
         >
           <image class="avatar" :src="userAvatar" mode="aspectFill" />
           <view class="user-info">
-            <text class="user-name" :style="{ color: signatureColor }">{{
-              signatureName
-            }}</text>
-            <text class="user-desc" :style="{ color: signatureColor }"
+            <text
+              class="user-name"
+              :style="{ color: signatureColor, fontWeight: fontWeight }"
+              >{{ signatureName }}</text
+            >
+            <text
+              class="user-desc"
+              :style="{ color: signatureColor, fontWeight: fontWeight }"
               >送上祝福</text
             >
           </view>
@@ -288,6 +292,27 @@
               />
             </view>
 
+            <!-- 字体粗细 -->
+            <view class="form-item">
+              <text class="label">字体粗细</text>
+              <view class="weight-options">
+                <view
+                  class="weight-btn"
+                  :class="{ active: fontWeight === 'normal' }"
+                  @tap="fontWeight = 'normal'"
+                >
+                  <text>常规</text>
+                </view>
+                <view
+                  class="weight-btn"
+                  :class="{ active: fontWeight === 'bold' }"
+                  @tap="fontWeight = 'bold'"
+                >
+                  <text style="font-weight: bold">加粗</text>
+                </view>
+              </view>
+            </view>
+
             <view class="form-item">
               <text class="label">祝福语宽窄</text>
               <slider
@@ -624,6 +649,7 @@ const userAvatar = ref(userStore?.userInfo?.avatarUrl || DEFAULT_AVATAR);
 
 const blessingText = ref({});
 const fontSize = ref(38);
+const fontWeight = ref("normal"); // 默认加粗
 
 const textColors = [
   '#F8DA84',
@@ -640,8 +666,8 @@ const textColors = [
   "#9013FE",
   "#FFC0CB",
 ];
-const selectedColor = ref("#F8DA84");
-const signatureColor = ref("#B4802C");
+const selectedColor = ref("#000000");
+const signatureColor = ref("#000000");
 
 const fontList = [
   { name: "默认", family: "PingFang SC", url: "" },
@@ -965,7 +991,7 @@ onShareAppMessage(async (options) => {
         title: "新春祝福",
         path: "/pages/index/index?shareToken=" + shareToken,
         imageUrl:
-          "https://file.lihailezzc.com/resource/cfed2edbfa19250b836a87a4bbf0d5ad.png",
+          "https://file.lihailezzc.com/resource/8dd026d76ef7a63d123b7fd698fb989b.png",
       };
     }
     // 1. 确保有 cardId (如果内容有变动，最好是新建)
@@ -977,7 +1003,7 @@ onShareAppMessage(async (options) => {
       title: "我刚做了一张祝福卡片，送给你",
       path: "/pages/detail/index?shareToken=" + shareToken,
       imageUrl:
-        "https://file.lihailezzc.com/resource/13ec1134e6614feadeeaaa9ef21ea96e.png",
+        "https://file.lihailezzc.com/resource/b703cf78a970a65490d52213e4d7bf33.png",
     };
   } else {
     const shareToken = await getShareToken("card_generate_index", "");
@@ -985,7 +1011,7 @@ onShareAppMessage(async (options) => {
       title: "新春祝福",
       path: `/pages/index/index?shareToken=${shareToken}`,
       imageUrl:
-        "https://file.lihailezzc.com/resource/cfed2edbfa19250b836a87a4bbf0d5ad.png",
+        "https://file.lihailezzc.com/resource/8dd026d76ef7a63d123b7fd698fb989b.png",
     };
   }
 });
@@ -1192,6 +1218,7 @@ const saveByCanvas = async (save = true) => {
             maxWidth: r2p(bubbleMaxWidth.value), // 预览中 bubble-text 的宽度
             canvasWidth: W,
             fontSize: r2p(fontSize.value),
+            fontWeight: fontWeight.value,
             lineHeight: r2p(fontSize.value * 1.6), // 预览中是 1.6
             padding: r2p(40 + 30), // 内部 padding 40 + 容器 padding 30
             backgroundColor: "transparent",
@@ -1209,6 +1236,7 @@ const saveByCanvas = async (save = true) => {
             username: signatureName.value,
             desc: "送上祝福",
             textColor: signatureColor.value,
+            fontWeight: fontWeight.value,
             avatarSize: r2p(64),
             padding: r2p(15),
             fontSizeName: r2p(24),
@@ -1280,13 +1308,14 @@ function drawBubbleText(ctx, options) {
     backgroundColor = "rgba(255,255,255,0.9)",
     textColor = "#fff",
     fontSize = 32,
+    fontWeight = "normal",
     fontFamily = "PingFang SC",
     canvasWidth, // 新增：画布宽度，用于居中计算
   } = options;
   if (!text) return;
 
   ctx.fillStyle = textColor;
-  ctx.font = `bold ${fontSize}px '${fontFamily}'`;
+  ctx.font = `${fontWeight === "bold" ? "bold " : ""}${fontSize}px '${fontFamily}'`;
   ctx.textAlign = "left";
   ctx.textBaseline = "top";
 
@@ -1348,15 +1377,16 @@ function drawUserBubble(ctx, options) {
     fontSizeDesc = 20,
     bubbleColor = "rgba(255,255,255,0.18)",
     textColor = "#000000",
+    fontWeight = "normal",
   } = options;
 
   // 设置字体
   ctx.textBaseline = "top";
-  ctx.font = `${fontSizeName}px 'PingFang SC'`;
+  ctx.font = `${fontWeight === "bold" ? "bold " : ""}${fontSizeName}px 'PingFang SC'`;
 
   // 测量文字宽度
   const nameWidth = ctx.measureText(username).width;
-  ctx.font = `${fontSizeDesc}px 'PingFang SC'`;
+  ctx.font = `${fontWeight === "bold" ? "bold " : ""}${fontSizeDesc}px 'PingFang SC'`;
   const descWidth = ctx.measureText(desc).width;
 
   // 计算气泡宽度和高度
@@ -1407,11 +1437,11 @@ function drawUserBubble(ctx, options) {
   const textStartY = drawY + (bubbleHeight - totalTextHeight) / 2;
 
   ctx.fillStyle = textColor;
-  ctx.font = `${fontSizeName}px 'PingFang SC'`;
+  ctx.font = `${fontWeight === "bold" ? "bold " : ""}${fontSizeName}px 'PingFang SC'`;
   ctx.fillText(username, textX, textStartY);
 
-  ctx.font = `${fontSizeDesc}px 'PingFang SC'`;
-  ctx.globalAlpha = 0.6;
+  ctx.font = `${fontWeight === "bold" ? "bold " : ""}${fontSizeDesc}px 'PingFang SC'`;
+  ctx.globalAlpha = 0.8;
   ctx.fillText(desc, textX, textStartY + fontSizeName + 4);
   ctx.globalAlpha = 1;
 }
@@ -1942,6 +1972,30 @@ function drawRoundRect(ctx, x, y, w, h, r, color) {
   text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.2);
 }
 
+.weight-options {
+  display: flex;
+  gap: 20rpx;
+  flex: 1;
+}
+.weight-btn {
+  flex: 1;
+  height: 70rpx;
+  background: #f5f5f5;
+  border-radius: 12rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 26rpx;
+  color: #333;
+  border: 2rpx solid transparent;
+  transition: all 0.2s;
+}
+.weight-btn.active {
+  background: #fff5f5;
+  color: #ff3b30;
+  border-color: #ff3b30;
+}
+
 /* 按钮区 */
 .main-actions {
   display: flex;