haopengzhan/own-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add Learn-Number tool for preschool math practice and refactor HTML components
Build and Push Docker Image / build (push) Successful in 2m55s
Details

Browse Source
This commit is contained in:
haopengzhan
2026-02-25 19:22:58 -08:00
parent e320f9ee50
commit 0be94026c5
9 changed files with 396 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
cmd/toolbox/web/tools/learn_number.html
+38
View File
@@ -0,0 +1,38 @@
{{define "learn_number"}}
<div id="panel-learn-number" class="tool-panel">
<header class="page-header">
<h1>幼儿数学助手</h1>
<p>通过趣味图形和基础练习，培养孩子的数感与逻辑。</p>
</header>
<div class="tabs-container">
<div id="tab-counting" class="tab-btn active">数图形练习</div>
</div>
<div class="card">
<div style="display: flex; flex-direction: column; gap: 24px;">
<div style="display: flex; gap: 30px; flex-wrap: wrap;">
<div style="flex: 1; min-width: 250px;">
<label style="font-size: 13px; font-weight: 600; color: #86868b; display: block; margin-bottom: 12px;">图标种类数 (1 - 5)</label>
<input type="range" id="icon_types" min="1" max="5" value="3" style="width: 100%;" oninput="this.nextElementSibling.value = this.value">
<output style="font-size: 18px; font-weight: 700; color: var(--apple-blue); margin-top: 10px; display: block;">3</output>
</div>
<div style="flex: 1; min-width: 250px;">
<label style="font-size: 13px; font-weight: 600; color: #86868b; display: block; margin-bottom: 12px;">总图案数量 (种类数 - 30)</label>
<input type="range" id="total_count" min="5" max="30" value="15" style="width: 100%;" oninput="this.nextElementSibling.value = this.value">
<output style="font-size: 18px; font-weight: 700; color: var(--apple-blue); margin-top: 10px; display: block;">15</output>
</div>
<div style="width: 240px;">
<label>纸张大小</label>
<select id="math_paper_size">
<option value="A4">A4</option>
<option value="Letter">Letter</option>
</select>
</div>
</div>
<button onclick="generateMathPDF()">生成数学练习帖</button>
</div>
</div>
<div id="math-preview" style="display:none; width: 100%; height: 800px; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.1); background: #fff; border: 1px solid #d2d2d7;">
<iframe id="math-frame" style="width:100%; height:100%; border:none;"></iframe>
</div>
</div>
{{end}}
cmd/toolbox/web/tools/zitie.html
+43
View File
@@ -0,0 +1,43 @@
{{define "zitie"}}
<div id="panel-zitie" class="tool-panel">
<header class="page-header">
<h1>汉字字帖生成器</h1>
<p>生成高颜值的硬笔/毛笔书法练习帖。</p>
</header>
<div class="tabs-container">
<div id="tab-teaching" class="tab-btn active" onclick="switchZitieTab('teaching')">2x3 教学方格</div>
<div id="tab-step" class="tab-btn" onclick="switchZitieTab('step')">步进式分解</div>
<div id="tab-manuscript" class="tab-btn" onclick="switchZitieTab('manuscript')">古风竖排</div>
</div>
<div class="card">
<div style="display: flex; flex-direction: column; gap: 24px;">
<div class="input-group">
<label id="input-label">输入汉字内容</label>
<textarea id="chars" placeholder="支持多行输入...">永和九年，岁在癸丑。</textarea>
</div>
<div style="display: flex; gap: 20px; align-items: flex-end; flex-wrap: wrap;">
<div style="flex: 1; min-width: 200px;">
<label>纸张大小</label>
<select id="paper_size">
<option value="A4">A4 (210x297mm)</option>
<option value="Letter">Letter (8.5x11in)</option>
</select>
</div>
<div id="font-select-group" style="flex: 1; min-width: 200px; display: none;">
<label>书法字体</label>
<select id="font_type">
<option value="kaiti">华光楷体</option>
<option value="xingshu">华光行草</option>
<option value="lishu">华光隶变</option>
<option value="songti">华光书宋</option>
</select>
</div>
<button onclick="generateZitiePDF()">生成字帖预览</button>
</div>
</div>
</div>
<div id="zitie-preview" style="display:none; width: 100%; height: 800px; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.1); background: #fff; border: 1px solid #d2d2d7;">
<iframe id="zitie-frame" style="width:100%; height:100%; border:none;"></iframe>
</div>
</div>
{{end}}