From 10b8c12d511441b2fa463b661c21a9b251f82cde Mon Sep 17 00:00:00 2001
From: R524809 <R524809@hyundai-hmatc.com>
Date: Mon, 20 Oct 2025 17:40:06 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E7=BB=83=E5=AD=97=E8=B4=B4=E7=94=9F?=
 =?UTF-8?q?=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 miniprogram/app.json                          |  10 +-
 .../assets/tabBar/icon-edit-active.png        | Bin 0 -> 7802 bytes
 miniprogram/assets/tabBar/icon-edit.png       | Bin 0 -> 4635 bytes
 .../components/word-picker/word-picker.less   |   1 +
 .../components/word-picker/word-picker.ts     |  15 +-
 .../components/word-picker/word-picker.wxml   |   2 +-
 miniprogram/pages/copyBook/copyBook.ts        | 160 +++++++++++-----
 miniprogram/pages/copyBook/copyBook.wxml      |   3 +-
 miniprogram/pages/index/index.ts              |   5 +-
 miniprogram/service/wordDrawService.ts        | 178 +++++++++---------
 10 files changed, 218 insertions(+), 156 deletions(-)
 create mode 100644 miniprogram/assets/tabBar/icon-edit-active.png
 create mode 100644 miniprogram/assets/tabBar/icon-edit.png

diff --git a/miniprogram/app.json b/miniprogram/app.json
index 116e85d..d8195a8 100644
--- a/miniprogram/app.json
+++ b/miniprogram/app.json
@@ -45,15 +45,9 @@
             },
             {
                 "pagePath": "pages/copyBook/copyBook",
-                "iconPath": "assets/tabBar/icon-shape.png",
-                "selectedIconPath": "assets/tabBar/icon-shape-active.png",
+                "iconPath": "assets/tabBar/icon-edit.png",
+                "selectedIconPath": "assets/tabBar/icon-edit-active.png",
                 "text": "练字"
-            },
-            {
-                "pagePath": "pages/wordDemo/index",
-                "iconPath": "assets/tabBar/icon-shape.png",
-                "selectedIconPath": "assets/tabBar/icon-shape-active.png",
-                "text": "练字2"
             }
         ]
     }
diff --git a/miniprogram/assets/tabBar/icon-edit-active.png b/miniprogram/assets/tabBar/icon-edit-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..4a2d38f8bf70652dc56c03f1cd85f1e01c57922e
GIT binary patch
literal 7802
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

literal 0
HcmV?d00001

diff --git a/miniprogram/assets/tabBar/icon-edit.png b/miniprogram/assets/tabBar/icon-edit.png
new file mode 100644
index 0000000000000000000000000000000000000000..c644c207451f76bc544ce7372a93f3585fbadf67
GIT binary patch
literal 4635
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

literal 0
HcmV?d00001

diff --git a/miniprogram/components/word-picker/word-picker.less b/miniprogram/components/word-picker/word-picker.less
index 4860914..e15323c 100644
--- a/miniprogram/components/word-picker/word-picker.less
+++ b/miniprogram/components/word-picker/word-picker.less
@@ -74,6 +74,7 @@
 
 
 .selected-words {
+    height: 66rpx;
     padding: 28rpx;
     font-size: 28rpx;
     color: #141414;
diff --git a/miniprogram/components/word-picker/word-picker.ts b/miniprogram/components/word-picker/word-picker.ts
index c871149..3af2e68 100644
--- a/miniprogram/components/word-picker/word-picker.ts
+++ b/miniprogram/components/word-picker/word-picker.ts
@@ -14,17 +14,20 @@ Component({
             type: Number,
             value: 0,
         },
-        cardList: {
+        selectedWords: {
             type: Array,
-            value: [],
+            value: []
         },
+        max: {
+            type: Number,
+            value: 6
+        }
     },
     /**
      * 组件的初始数据
      */
     data: {
         wordList: WORDS,
-        selectedWords: [] as string[],
     },
     lifetimes: {
         ready() {
@@ -60,7 +63,7 @@ Component({
 
         onWordClick(e: WechatMiniprogram.TouchEvent) {
             const { word } = e.currentTarget.dataset;
-            const { selectedWords } = this.data;
+            const { selectedWords, max } = this.data;
             let newSelectedWords = selectedWords as string[];
 
             // 如果是已选中的文字,直接取消选中
@@ -68,9 +71,9 @@ Component({
                 newSelectedWords = newSelectedWords.filter((item) => item !== word);
             } else {
                 // 如果是未选中的文字,先判断是否已选满6个
-                if (newSelectedWords.length >= 6) {
+                if (newSelectedWords.length >= max) {
                     wx.showToast({
-                        title: '最多选择6个字',
+                        title: `最多选择 ${max} 个字`,
                         icon: 'none',
                     });
                     return;
diff --git a/miniprogram/components/word-picker/word-picker.wxml b/miniprogram/components/word-picker/word-picker.wxml
index ca0f979..6a7b5dc 100644
--- a/miniprogram/components/word-picker/word-picker.wxml
+++ b/miniprogram/components/word-picker/word-picker.wxml
@@ -8,7 +8,7 @@
     close-on-click-overlay="{{true}}"
     safe-area-inset-bottom="{{false}}"
     position="bottom"
-    custom-style="height:75%"
+    custom-style="height:78%"
     custom-class="word-picker">
     <view class="word-picker-content">
         <view class="word-picker-title">请选择文字</view>
diff --git a/miniprogram/pages/copyBook/copyBook.ts b/miniprogram/pages/copyBook/copyBook.ts
index 8fed7dd..cc0e52d 100644
--- a/miniprogram/pages/copyBook/copyBook.ts
+++ b/miniprogram/pages/copyBook/copyBook.ts
@@ -10,28 +10,29 @@ Page({
 
     data: {
         // 选中的汉字列表
-        words: ['赢', '张', '政'] as string[],
+        words: [] as string[],
         showSelectWordPopup: false,
         showColorPopup: false,
         currentKey: 0,
         currentColor: '',
-
-        // 田字格配置
-        // rows: 10,
-        // cols: 12,
-        // rowsArray: [] as number[],
-        // colsArray: [] as number[],
         boxWidth: 0,
         boxHeight: 0,
     },
 
     onLoad() {
-        // this.initGrid();
         this.loadSvgWords();
+        const hasShowIntroduction =
+            wx.getStorageSync('hasShowIntroduction') || false;
+        if (!hasShowIntroduction) {
+            this.setData({
+                words: ['好', '好', '学', '习', '天', '天', '向', '上']
+            })
+        }
     },
 
-    onReady() {
-        this.setCanvasBoxSize();
+    async onReady() {
+        await this.setCanvasBoxSize();
+        this.initCanvas()
     },
 
     loadSvgWords() {
@@ -44,9 +45,7 @@ Page({
                     wx.showToast({ title: '加载中...', icon: 'loading' });
                     const parsedData = JSON.parse(res.data as string);
                     this.svgWords = parsedData;
-                    console.log('this.svgWords.length----:', Object.keys(this.svgWords).length)
                     wx.hideToast();
-                    console.log('SVG words loaded successfully');
                     const { words } = this.data as any;
                     if (words && words.length > 0) {
                         this.drawPracticeSheet().catch(console.error);
@@ -73,16 +72,75 @@ Page({
             return;
         }
 
-        const chars = this.splitToSingleChars(text);
         const { words } = this.data as any;
-        const exists = new Set(words);
-        const newWords = [...words];
-        chars.forEach((ch) => {
-            if (!exists.has(ch)) {
-                newWords.push(ch);
+
+        // 1. 先检查原来已有的汉字是否超过11个
+        if (words.length >= 11) {
+            wx.showToast({
+                title: '最多只能添加 11 个字哦！',
+                icon: 'none',
+                duration: 2000,
+            });
+            return;
+        }
+
+        // 2. 解析新输入的汉字
+        const newChars = this.splitToSingleChars(text);
+        if (newChars.length === 0) {
+            wx.showToast({ title: '请输入有效汉字', icon: 'none' });
+            return;
+        }
+
+        // 3. 保留原有汉字，追加新汉字（去重处理）
+        const existingWords = new Set(words); // 用于快速查找重复
+        const updatedWords: string[] = [...words]; // 保留原有汉字
+        let addedCount = 0;
+        let skippedCount = 0;
+
+        for (const char of newChars) {
+            // 检查是否已达到11个字的限制
+            if (updatedWords.length >= 11) {
+                break;
             }
+
+            // 检查是否已存在（去重）
+            if (existingWords.has(char)) {
+                skippedCount++;
+                continue;
+            }
+
+            // 添加新汉字
+            updatedWords.push(char);
+            existingWords.add(char);
+            addedCount++;
+        }
+
+        // 4. 更新数据并提示
+        this.setData({ words: updatedWords }, () => {
+            this.drawPracticeSheet().catch(console.error);
         });
-        this.setData({ words: newWords }, () => this.drawPracticeSheet().catch(console.error));
+
+        // 5. 显示添加结果提示
+        if (addedCount > 0) {
+            let message = `成功添加 ${addedCount} 个汉字`;
+            if (skippedCount > 0) {
+                message += `，跳过 ${skippedCount} 个重复汉字`;
+            }
+            if (updatedWords.length >= 11) {
+                message += '，已达到最大限制';
+            }
+            wx.showToast({
+                title: message,
+                icon: 'none',
+                duration: 2000,
+            });
+        } else if (skippedCount > 0) {
+            wx.showToast({
+                title: `所有汉字都已存在，跳过 ${skippedCount} 个重复汉字`,
+                icon: 'none',
+                duration: 2000,
+            });
+        }
     },
 
     // 选择面板
@@ -98,11 +156,12 @@ Page({
         this.setData({ words: newWords, showSelectWordPopup: false }, () => this.drawPracticeSheet().catch(console.error));
     },
 
-    // 删除与颜色
+    // 删除
     deleteWordCard(e: any) {
-        const { word } = e.detail;
+        const { key } = e.detail;
         const { words } = this.data as any;
-        const next = words.filter((w: string) => w !== word);
+        const next = words.filter((_: string, index: number) => index !== key);
+        console.log("-nextnext-----:", next);
         this.setData({ words: next }, () => this.drawPracticeSheet().catch(console.error));
     },
 
@@ -117,16 +176,6 @@ Page({
         return matches || [];
     },
 
-    // 田字格
-    /* initGrid() {
-        const { rows, cols } = this.data as any;
-        const rowsArray = Array.from({ length: rows }, (_, i) => i);
-        const colsArray = Array.from({ length: cols }, (_, i) => i);
-        console.log('rowsArray----:', rowsArray)
-        console.log('colsArray----:', colsArray)
-        this.setData({ rowsArray, colsArray });
-    }, */
-
     setCanvasBoxSize() {
         const query = wx.createSelectorQuery();
         query
@@ -158,7 +207,7 @@ Page({
                         this.ctx = ctx;
                         this.wordDrawService = new WordDrawService(canvas, ctx, {
                             appName: '涂鸦丫小程序',
-                            appHint: '练字|识字|打印',
+                            appHint: '练字|识字|涂色｜打印',
                             title: '田字格  练 字  贴',
                             subTitle: '按笔画临摹练习'
                         });
@@ -174,26 +223,53 @@ Page({
             this.initCanvas();
         }
         const { words } = this.data as any;
-        if (!words || words.length === 0) {
-            return;
-        }
-
         // 构建汉字笔画数据
+        const wordsMap: Record<string, string[]> | null = this.checkWords(words);
+        await this.wordDrawService?.draw(wordsMap || {});
+    },
+
+    checkWords(words: string[]): Record<string, string[]> | null {
+        // 构建汉字笔画数据（已去重）
         const wordsMap: Record<string, string[]> = {};
-        console.log('this.svgWords----:', this.svgWords)
+        const supportedWords: string[] = [];
+
+        // 按顺序处理每个汉字
         words.forEach((word: string) => {
             if (this.svgWords[word]) {
                 wordsMap[word] = this.svgWords[word];
+                supportedWords.push(word);
             }
         });
-        if (Object.keys(wordsMap).length === 0) {
+
+        if (supportedWords.length === 0) {
             wx.showToast({ title: '暂不支持这些汉字', icon: 'none' });
-            return;
+            return null;
         }
 
-        await this.wordDrawService?.draw(wordsMap);
-    },
+        const maxRow = 11, maxCol = 9;
+        let rowIndex = 0;
+        const characters = Object.keys(wordsMap);
+        const newWorksMap: Record<string, string[]> = {};
+        const boundaryWords: string[] = []
 
+        characters.forEach((char) => {
+            const strokes = wordsMap[char] || [];
+            const strokeCount = strokes.length;
+            const totalCells = 1 + strokeCount + 2;
+            const totalRows = Math.ceil(totalCells / maxCol);
+            rowIndex += totalRows;
+            if (rowIndex <= maxRow) {
+                newWorksMap[char] = wordsMap[char];
+            } else {
+                boundaryWords.push(char)
+            }
+        });
+
+        if (boundaryWords.length > 0) {
+            wx.showToast({ title: `练字贴已超过一页，部分汉字未包含在本次生成结果中`, icon: 'none' });
+        }
+        return newWorksMap;
+    },
     // 下载打印练字贴
     exportToPrint() {
         const { words } = this.data as any;
diff --git a/miniprogram/pages/copyBook/copyBook.wxml b/miniprogram/pages/copyBook/copyBook.wxml
index 616b8c0..db0525a 100644
--- a/miniprogram/pages/copyBook/copyBook.wxml
+++ b/miniprogram/pages/copyBook/copyBook.wxml
@@ -39,12 +39,10 @@
         <text class="wrapper-title">预览练字田字格</text>
         <view id="canvasWrapper" class="canvas-wrapper">
             <canvas
-                wx:if="{{words}}"
                 type="2d"
                 id="canvasContent"
                 class="canvas-content"
                 style="width:{{boxWidth}}px;height:{{boxHeight}}px" />
-            <view wx:else class="empty-tip">请选择或输入汉字后生成田字格</view>
         </view>
     </view>
 
@@ -75,6 +73,7 @@
     <word-picker
         show="{{showSelectWordPopup}}"
         selectedWords="{{words}}"
+        max="11"
         bind:onClose="closeSelectWordPopup"
         bind:onChange="onChangeWord" />
 
diff --git a/miniprogram/pages/index/index.ts b/miniprogram/pages/index/index.ts
index 8115428..811f062 100644
--- a/miniprogram/pages/index/index.ts
+++ b/miniprogram/pages/index/index.ts
@@ -71,9 +71,6 @@ Page({
                     const boxWidth = rect.width;
                     const boxHeight = boxWidth / (width / height);
 
-                    console.log('boxWidth----:', boxWidth)
-                    console.log('boxHeight----:', boxHeight)
-
                     // 然后初始化canvas
                     wx.createSelectorQuery()
                         .select('#canvasContent')
@@ -182,7 +179,7 @@ Page({
         }
         if (isBeyond) {
             wx.showToast({
-                title: '最多只能添加6个字，多余的字为被添加哦！',
+                title: '最多只能添加6个字，多余的字未被添加哦！',
                 icon: 'none',
                 duration: 2000,
             });
diff --git a/miniprogram/service/wordDrawService.ts b/miniprogram/service/wordDrawService.ts
index ac5bc84..83500cd 100644
--- a/miniprogram/service/wordDrawService.ts
+++ b/miniprogram/service/wordDrawService.ts
@@ -116,7 +116,6 @@ function drawStrokes({
 }: DrawStrokesParams) {
     // 模板中使用 54x54 的视窗尺寸
     const viewBoxSize = 54;
-    const scale = size / viewBoxSize;
 
     // 添加内边距：在田字格四周预留空间，避免笔画贴边
     const padding = size * 0.1; // 内边距为田字格大小的10%
@@ -127,22 +126,22 @@ function drawStrokes({
     const contentOffsetX = offsetX + padding;
     const contentOffsetY = offsetY + padding;
 
-    console.log('drawStrokes 参数:', {
-        strokesCount: strokes.length,
-        uptoInclusive,
-        offsetX,
-        offsetY,
-        size,
-        padding,
-        contentSize,
-        contentOffsetX,
-        contentOffsetY,
-        originalScale: scale,
-        contentScale,
-        fillStyle,
-        strokeStyle,
-        lineWidth
-    });
+    // console.log('drawStrokes 参数:', {
+    //     strokesCount: strokes.length,
+    //     uptoInclusive,
+    //     offsetX,
+    //     offsetY,
+    //     size,
+    //     padding,
+    //     contentSize,
+    //     contentOffsetX,
+    //     contentOffsetY,
+    //     originalScale: scale,
+    //     contentScale,
+    //     fillStyle,
+    //     strokeStyle,
+    //     lineWidth
+    // });
 
     for (let s = 0; s <= uptoInclusive && s < strokes.length; s++) {
         // console.log(`绘制第 ${s} 个笔画:`, strokes[s]);
@@ -357,7 +356,7 @@ class WordDrawService {
     drawContent(wordsMap: Record<string, string[]>) {
         const { canvas, ctx } = this;
         const characters = Object.keys(wordsMap).slice(0, 10);
-        if (characters.length === 0) return;
+
 
         // 布局参数
         const topGap = 50; // 与页眉分割线的距离
@@ -365,7 +364,6 @@ class WordDrawService {
         const rightMargin = 120;
         const bottomMargin = 120;
         const contentTop = this.currentY + topGap;
-        console.log('contentTop----:', contentTop)
         const contentWidth = canvas.width - leftMargin - rightMargin;
         const contentHeight = canvas.height - contentTop - bottomMargin;
 
@@ -374,24 +372,19 @@ class WordDrawService {
         const rowGap = 36;   // 最小格子行间距，用于保证纵向不拥挤，后续可动态调整为实际间距
 
         // 计算每行可容纳的田字格数量
-        const maxPerRow = Math.max(1, Math.floor((contentWidth + minGap) / (cellSize + minGap)));
+        const columnNumber = Math.max(1, Math.floor((contentWidth + minGap) / (cellSize + minGap)));
 
         // 计算每列可容纳的田字格数量
-        const actualRows = Math.max(1, Math.floor((contentHeight + rowGap) / (cellSize + rowGap)));
+        const rowNumber = Math.max(1, Math.floor((contentHeight + rowGap) / (cellSize + rowGap)));
 
         // 计算总需要的田字格数量
-        const totalCellsNeeded = actualRows * maxPerRow;
-
-        // 计算实际需要的行数
-        console.log('actualRows----:', actualRows)
-        console.log('totalCellsNeeded----:', totalCellsNeeded)
-        console.log('maxPerRow----:', maxPerRow)
+        const totalCellsNeeded = rowNumber * columnNumber;
 
         // 动态调整间距以充分利用空间（在允许的最小间距基础上弹性扩展以适配画布）
-        const actualRowGap = actualRows > 1 ? (contentHeight - actualRows * cellSize) / (actualRows - 1) : 0;
-        const actualColGap = maxPerRow > 1 ? (contentWidth - maxPerRow * cellSize) / (maxPerRow - 1) : 0;
+        const actualRowGap = rowNumber > 1 ? (contentHeight - rowNumber * cellSize) / (rowNumber - 1) : 0;
+        const actualColGap = columnNumber > 1 ? (contentWidth - columnNumber * cellSize) / (columnNumber - 1) : 0;
 
-        console.log(`布局信息: 总格数=${totalCellsNeeded}, 行数=${actualRows}, 列数=${maxPerRow}, 行间距=${actualRowGap.toFixed(1)}, 列间距=${actualColGap.toFixed(1)}`);
+        console.log(`布局信息: 总格数=${totalCellsNeeded}, 行数=${rowNumber}, 列数=${columnNumber}, 行间距=${actualRowGap.toFixed(1)}, 列间距=${actualColGap.toFixed(1)}`);
 
         // 第一阶段：绘制所有空田字格
         this.drawEmptyGrids({
@@ -401,21 +394,23 @@ class WordDrawService {
             cellSize,
             colGap: actualColGap,
             rowGap: actualRowGap,
-            maxPerRow,
-            maxRows: actualRows
+            rowNumber,
+            columnNumber
         });
 
-        // 第二阶段：绘制练字内容
-        this.drawPracticeContent({
-            ctx,
-            wordsMap,
-            startX: leftMargin,
-            startY: contentTop,
-            cellSize,
-            colGap: actualColGap,
-            rowGap: actualRowGap,
-            maxPerRow
-        });
+        if (characters.length > 0) {
+            // 第二阶段：绘制练字内容
+            this.drawPracticeContent({
+                ctx,
+                wordsMap,
+                startX: leftMargin,
+                startY: contentTop,
+                cellSize,
+                colGap: actualColGap,
+                rowGap: actualRowGap,
+                columnNumber
+            });
+        };
     }
 
     /**
@@ -444,8 +439,8 @@ class WordDrawService {
         cellSize,
         colGap,
         rowGap,
-        maxPerRow,
-        maxRows
+        rowNumber,
+        columnNumber
     }: {
         ctx: RenderingContext;
         startX: number;
@@ -453,12 +448,12 @@ class WordDrawService {
         cellSize: number;
         colGap: number;
         rowGap: number;
-        maxPerRow: number;
-        maxRows: number;
+        rowNumber: number;  // 行数
+        columnNumber: number;  // 列数
     }) {
         console.log('drawEmptyGrids startY----:', startY)
-        for (let row = 0; row < maxRows; row++) {
-            for (let col = 0; col < maxPerRow; col++) {
+        for (let row = 0; row < rowNumber; row++) {
+            for (let col = 0; col < columnNumber; col++) {
                 const x = startX + col * (cellSize + colGap) + cellSize / 2;
                 const y = startY + row * (cellSize + rowGap) + cellSize / 2;
                 drawTianZiGrid({ ctx, x, y, size: cellSize });
@@ -477,7 +472,7 @@ class WordDrawService {
         cellSize,
         colGap,
         rowGap,
-        maxPerRow
+        columnNumber
     }: {
         ctx: RenderingContext;
         wordsMap: Record<string, string[]>;
@@ -486,18 +481,21 @@ class WordDrawService {
         cellSize: number;
         colGap: number;
         rowGap: number;
-        maxPerRow: number;
+        columnNumber: number;
     }) {
         const characters = Object.keys(wordsMap);
-        let cellIndex = 0;
+        const reservedCells = 2;
+        let rowIndex = 0, columnIndex = 0;
 
-        console.log('开始绘制练字内容，汉字数量:', characters.length);
+        // console.log('开始绘制练字内容，汉字数量:', characters.length);
 
-        characters.forEach((char, charIndex) => {
-            const strokes = wordsMap[char] || [];
+        characters.forEach((uniqueKey, charIndex) => {
+            const strokes = wordsMap[uniqueKey] || [];
             const strokeCount = strokes.length;
+            // 从uniqueKey中提取原始汉字（去掉后缀）
+            const originalChar = uniqueKey.split('_')[0];
 
-            console.log(`绘制第 ${charIndex + 1} 个汉字 "${char}"，笔画数: ${strokeCount}`);
+            console.log(`绘制第 ${charIndex + 1} 个汉字 "${originalChar}"，笔画数: ${strokeCount}`);
 
             // 1. 预览格：显示完整汉字（黑色）
             this.drawPreviewCell({
@@ -508,10 +506,9 @@ class WordDrawService {
                 cellSize,
                 colGap,
                 rowGap,
-                maxPerRow,
-                cellIndex
+                rowIndex,
             });
-            cellIndex++;
+            columnIndex++;
 
             // 2. 练习格：逐笔画显示（红色）
             for (let strokeIndex = 0; strokeIndex < strokeCount; strokeIndex++) {
@@ -525,29 +522,30 @@ class WordDrawService {
                     cellSize,
                     colGap,
                     rowGap,
-                    maxPerRow,
-                    cellIndex
+                    rowIndex,
+                    columnIndex
                 });
-                cellIndex++;
-
-                console.log(`笔画 ${strokeIndex + 1} 绘制完成，当前 cellIndex: ${cellIndex}`);
+                columnIndex++;
+                if (columnIndex >= columnNumber) {
+                    columnIndex = 0;
+                    rowIndex++;
+                }
+                // console.log(`笔画 ${strokeIndex + 1} 绘制完成，当前 columnIndex: ${columnIndex}`);
+            }
+            if (columnIndex + reservedCells > columnNumber) {
+                columnIndex = 0;
+                rowIndex++;
             }
-
-            // 3. 汉字间留空：每个汉字后留2个空白格
-            cellIndex += 0;
 
             // 4. 强制下一个汉字换行到新行的第一个田字格
             if (charIndex < characters.length - 1) { // 不是最后一个汉字
-                const currentRow = Math.floor(cellIndex / maxPerRow);
-                const nextRow = currentRow + 1;
-                cellIndex = nextRow * maxPerRow;
-                console.log(`汉字 "${char}" 绘制完成，强制换行到新行，下一个汉字从 cellIndex: ${cellIndex} 开始`);
-            } else {
-                console.log(`汉字 "${char}" 绘制完成，这是最后一个汉字`);
+                rowIndex = rowIndex + 1;
+                columnIndex = 0;
+                // console.log(`汉字 "${char}" 绘制完成，强制换行到新行，下一个汉字从 rowIndex: ${rowIndex}, columnIndex: ${columnIndex} 开始`);
             }
         });
 
-        console.log('所有汉字绘制完成');
+        // console.log('所有汉字绘制完成');
     }
 
     /**
@@ -561,8 +559,7 @@ class WordDrawService {
         cellSize,
         colGap,
         rowGap,
-        maxPerRow,
-        cellIndex
+        rowIndex
     }: {
         ctx: RenderingContext;
         strokes: string[];
@@ -571,15 +568,13 @@ class WordDrawService {
         cellSize: number;
         colGap: number;
         rowGap: number;
-        maxPerRow: number;
-        cellIndex: number;
+        rowIndex: number;
     }) {
-        const row = Math.floor(cellIndex / maxPerRow);
-        const col = cellIndex % maxPerRow;
-        const x = startX + col * (cellSize + colGap);
-        const y = startY + row * (cellSize + rowGap);
+        const columnIndex = 0;
+        const x = startX + columnIndex * (cellSize + colGap);
+        const y = startY + rowIndex * (cellSize + rowGap);
 
-        console.log(`预览格 [${cellIndex}] 坐标: (${x}, ${y}), 行列: (${row}, ${col}), 笔画数: ${strokes.length}`);
+        // console.log(`预览格 [${rowIndex}, ${columnIndex}] 坐标: (${x}, ${y}), 笔画数: ${strokes.length}`);
 
         // 绘制完整汉字（黑色，较粗）
         drawStrokes({
@@ -607,8 +602,8 @@ class WordDrawService {
         cellSize,
         colGap,
         rowGap,
-        maxPerRow,
-        cellIndex
+        rowIndex,
+        columnIndex
     }: {
         ctx: RenderingContext;
         strokes: string[];
@@ -618,15 +613,13 @@ class WordDrawService {
         cellSize: number;
         colGap: number;
         rowGap: number;
-        maxPerRow: number;
-        cellIndex: number;
+        rowIndex: number;
+        columnIndex: number;
     }) {
-        const row = Math.floor(cellIndex / maxPerRow);
-        const col = cellIndex % maxPerRow;
-        const x = startX + col * (cellSize + colGap);
-        const y = startY + row * (cellSize + rowGap);
+        const x = startX + columnIndex * (cellSize + colGap);
+        const y = startY + rowIndex * (cellSize + rowGap);
 
-        console.log(`练习格 [${cellIndex}] 坐标: (${x}, ${y}), 行列: (${row}, ${col}), 笔画: ${strokeIndex + 1}/${strokes.length}`);
+        // console.log(`练习格 [${rowIndex}, ${columnIndex}] 坐标: (${x}, ${y}), 笔画: ${strokeIndex + 1}/${strokes.length}`);
 
         // 绘制到指定笔画的汉字（红色，中等粗细）
         drawStrokes({
@@ -643,7 +636,6 @@ class WordDrawService {
     }
 
     drawLine(linY: number) {
-        console.log('drawLine linY----:', linY)
         const { canvas, ctx } = this;
         ctx.strokeStyle = '#000';
         ctx.lineWidth = 2;