0

app.json

@@ -8,9 +8,17 @@
   "window": {
     "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#fff",
-    "navigationBarTitleText": "英语学习助手",
+    "navigationBarTitleText": "秒过英语-AI生文记单词",
     "navigationBarTextStyle": "black"
   },
   "style": "v2",
-  "sitemapLocation": "sitemap.json"
+  "sitemapLocation": "sitemap.json",
+  "permission": {
+    "scope.writePhotosAlbum": {
+      "desc": "保存PDF文件需要使用相册权限"
+    }
+  },
+  "setting": {
+    "urlCheck": false
+  }
 }

pages/article_generator/article_generator.js

@@ -8,10 +8,11 @@ Page({
     selectedWords: [],
     difficulty: 0,
     difficulties: constant1.arrHardLevel,
+    articleStyles: constant1.arrArticleStyle,
+    articleStyle: '',
     generatedArticle: '',
     articleTranslation: '',
     generating: false,
-    generatingImage: false,
     Content:"",
   },
 
@@ -40,21 +41,43 @@ Page({
     });
   },
 
+  onArticleStyleChange: function(e) {
+    this.setData({
+      articleStyle: e.detail.value
+    });
+    console.log('选择的文章类型:', e.detail.value);
+  },
+
   generateArticle: async function() {
     let that=this;
-    this.setData({ generating: true });
+
+    if (!this.data.articleStyle) {
+      wx.showToast({
+        title: '请选择文章类型',
+        icon: 'none'
+      });
+      return;
+    }
+
+    this.setData({ 
+      generating: true,
+      Content:"" 
+    });
 
     try {
       let url = common.Encrypt("GenerateArticle");
-      url="https://www.kylx365.com/apiData/"+url;
+      //url="https://www.kylx365.com/apiData/"+url;
+      url="http://localhost:3020/api/GenerateArticle";
       let words=that.data.wordList;
+      debugger;
       const cloudRes = await new Promise((resolve, reject) => {
         wx.request({
           url: url,
           method: "POST",
           data: {
             Words:JSON.stringify(words),
-            Level:that.data.difficulty
+            Level:that.data.difficulty,
+            Style:that.data.articleStyle
           },
           success: resolve,
           fail: reject,
@@ -102,317 +125,112 @@ Page({
     })
   },
 
-  generateImage: async function() {
-    const that = this;
-    this.setData({ generatingImage: true });
+  generateTestArticle:function(e){
+    this.setData({
+      Content:{
+        Title: "Sample Reading Article",
+        ArticleEnglishStr:"This is a <span>sample</span> article for testing the PDF generation functionality.It contains multiple paragraphs and some <span>bold text</span> to test formatting.The PDF should be generated with proper layout and styling.",
+        ArticleEnglish: [
+          "This is a <span>sample</span> article for testing the PDF generation functionality.",
+          "It contains multiple paragraphs and some <span>bold text</span> to test formatting.",
+          "The PDF should be generated with proper layout and styling."
+        ],
+        Question: [
+          {
+            QuestionEnglish: "What is the purpose of this article?",
+            OptionsEnglish: [
+              "A. To test PDF generation",
+              "B. To teach English",
+              "C. To demonstrate formatting",
+              "D. All of the above"
+            ]
+          },
+          {
+            QuestionEnglish: "What special formatting is used in this article?",
+            OptionsEnglish: [
+              "A. Italics",
+              "B. Bold text",
+              "C. Underline",
+              "D. Strikethrough"
+            ]
+          }
+        ]
+      },
+    })
+  },
+
+  //生成PDF文件
+  //访问服务器的GeneratePDF接口，提交this.data.Content数据，获得一个生成好的pdf文件，服务端的代码已经生成好
+  generatePDF: function(e) {
+    let that = this;
+    this.setData({ 
+      generatingPDF: true,
+    });
     
-    try {
-      const query = wx.createSelectorQuery();
-      query.select('#articleCanvas')
-        .fields({ node: true, size: true })
-        .exec((res) => {
-          const canvas = res[0].node;
-          const ctx = canvas.getContext('2d');
-          
-          // 基本设置
-          canvas.width = 595;
-          canvas.height = 842;
-          const margin = 40;
-          const lineHeight = 24;
-          const articleWidth = canvas.width - 2 * margin;
-          
-          // 计算内容高度的函数
-          const calculateHeight = () => {
-            let yPos = 40;
-            
-            // 标题高度
-            yPos += 40;
-            
-            // 文章高度
-            ctx.font = '16px Arial';
-            let articleText = that.data.Content.ArticleEnglish.join(" ");
-            articleText = articleText.replace(/<span[^>]*>(.*?)<\/span>/g, '###BOLD###$1###BOLD###');
-            const words = articleText.split(/\s+/);
-            
-            let lineWidth = 0;
-            words.forEach(word => {
-              if (!word) return;
-              
-              let wordToDraw = word.includes('###BOLD###') ? 
-                word.replace(/###BOLD###/g, '') : word;
-              
-              if (/[.,!?;:]$/.test(wordToDraw)) {
-                wordToDraw = wordToDraw.slice(0, -1);
-              }
-              
-              const spaceWidth = ctx.measureText(' ').width;
-              const wordWidth = ctx.measureText(wordToDraw).width;
-              const puncWidth = /[.,!?;:]$/.test(word) ? 
-                ctx.measureText(word.slice(-1)).width : 0;
-              
-              if (lineWidth + wordWidth + puncWidth + (lineWidth > 0 ? spaceWidth : 0) > articleWidth) {
-                yPos += lineHeight;
-                lineWidth = 0;
-              }
-              
-              lineWidth += wordWidth + puncWidth + (lineWidth > 0 ? spaceWidth : 0);
-            });
-            
-            yPos += lineHeight * 2;
-            
-            // 分隔线和问题标题高度
-            yPos += lineHeight * 2.5;
-            
-            // 问题高度
-            const questions = that.data.Content.Question;
-            questions.forEach(question => {
-              //debugger;
-              // 问题文本高度
-              const questionText = question.QuestionEnglish || '';
-              let textWidth = 0;
-              const words = questionText.split(' ');
-              words.forEach(word => {
-                const wordWidth = ctx.measureText(word + ' ').width;
-                if (textWidth + wordWidth > articleWidth) {
-                  yPos += lineHeight;
-                  textWidth = wordWidth;
-                } else {
-                  textWidth += wordWidth;
-                }
-              });
-              yPos += lineHeight;
-              
-              // 选项高度
-              if (question.OptionsEnglish && Array.isArray(question.OptionsEnglish)) {
-                question.OptionsEnglish.forEach(option => {
-                  if (!option) return;
-                  textWidth = 20; // 选项缩进
-                  const words = option.split(' ');
-                  words.forEach(word => {
-                    const wordWidth = ctx.measureText(word + ' ').width;
-                    if (textWidth + wordWidth > articleWidth) {
-                      yPos += lineHeight;
-                      textWidth = 20 + wordWidth;
-                    } else {
-                      textWidth += wordWidth;
-                    }
-                  });
-                  yPos += lineHeight;
-                });
-              }
-              
-              yPos += lineHeight / 2;
-            });
-            
-            return yPos + margin;
-          };
-          
-          // 计算所需高度
-          const requiredHeight = calculateHeight();
-          canvas.height = Math.max(842, requiredHeight);
-          
-          // 绘制背景
-          ctx.fillStyle = '#ffffff';
-          ctx.fillRect(0, 0, canvas.width, canvas.height);
-          ctx.fillStyle = '#000000';
-          ctx.textBaseline = 'top';
-          
-          // 绘制标题
-          let yPos = 40;
-          ctx.font = 'bold 20px Arial';
-          const title = that.data.Content.Title || "English Reading Practice";
-          const titleWidth = ctx.measureText(title).width;
-          ctx.fillText(title, (canvas.width - titleWidth) / 2, yPos);
-          yPos += 40;
-          
-          // 绘制文章
-          ctx.font = '16px Arial';
-          let articleText = that.data.Content.ArticleEnglish.join(" ");
-          articleText = articleText.replace(/<span[^>]*>(.*?)<\/span>/g, '###BOLD###$1###BOLD###');
-          const words = articleText.split(/\s+/);
-          
-          let xPos = margin;
-          let lineWidth = 0;
-          
-          words.forEach(word => {
-            if (!word) return;
-            
-            // 处理加粗和标点
-            let isBold = word.includes('###BOLD###');
-            let wordToDraw = isBold ? word.replace(/###BOLD###/g, '') : word;
-            let punctuation = '';
-            
-            if (/[.,!?;:]$/.test(wordToDraw)) {
-              punctuation = wordToDraw.slice(-1);
-              wordToDraw = wordToDraw.slice(0, -1);
-            }
-            
-            // 设置字体
-            ctx.font = isBold ? 'bold 16px Arial' : '16px Arial';
-            
-            // 计算宽度
-            const spaceWidth = ctx.measureText(' ').width;
-            const wordWidth = ctx.measureText(wordToDraw).width;
-            const puncWidth = punctuation ? ctx.measureText(punctuation).width : 0;
-            const totalWidth = wordWidth + puncWidth;
-            
-            // 检查换行
-            if (lineWidth + totalWidth + (lineWidth > 0 ? spaceWidth : 0) > articleWidth) {
-              xPos = margin;
-              yPos += lineHeight;
-              lineWidth = 0;
-            }
-            
-            // 添加空格
-            if (lineWidth > 0) {
-              xPos += spaceWidth;
-              lineWidth += spaceWidth;
-            }
-            
-            // 绘制单词
-            ctx.fillText(wordToDraw, xPos, yPos);
-            
-            // 绘制标点
-            if (punctuation) {
-              ctx.font = '16px Arial';
-              ctx.fillText(punctuation, xPos + wordWidth, yPos);
-            }
-            
-            xPos += totalWidth;
-            lineWidth += totalWidth;
-          });
-          
-          // 添加分隔线
-          yPos += lineHeight * 2;
-          ctx.beginPath();
-          ctx.moveTo(margin, yPos);
-          ctx.lineTo(canvas.width - margin, yPos);
-          ctx.stroke();
-          yPos += lineHeight;
-          
-          // 绘制问题标题
-          ctx.font = 'bold 16px Arial';
-          ctx.fillText("Reading Comprehension Questions:", margin, yPos);
-          yPos += lineHeight * 1.5;
-          
-          // 绘制问题
-          const questions = that.data.Content.Question;          
-          questions.forEach((question, index) => {
-            // 绘制问题
-            ctx.font = 'bold 16px Arial';
-            const questionText = `${index + 1}. ${question.QuestionEnglish || ''}`;
-            const words = questionText.split(' ');
-            let line = '';
-            let testLine = '';
-            
-            words.forEach(word => {
-              testLine = line + (line ? ' ' : '') + word;
-              if (ctx.measureText(testLine).width > articleWidth) {
-                ctx.fillText(line, margin, yPos);
-                yPos += lineHeight;
-                line = word;
-              } else {
-                line = testLine;
-              }
-            });
-            if (line) {
-              ctx.fillText(line, margin, yPos);
-              yPos += lineHeight;
-            }
-            
-            // 绘制选项
-            ctx.font = '16px Arial';
-            if (question.OptionsEnglish && Array.isArray(question.OptionsEnglish)) {
-              question.OptionsEnglish.forEach((option, optIndex) => {
-                if (!option) return;
-                
-                const optionText = `${option}`;
-                const optionWords = optionText.split(' ');
-                line = '';
-                testLine = '';
-                
-                optionWords.forEach(word => {
-                  testLine = line + (line ? ' ' : '') + word;
-                  if (ctx.measureText(testLine).width > articleWidth - 20) {
-                    ctx.fillText(line, margin + 20, yPos);
-                    yPos += lineHeight;
-                    line = word;
-                  } else {
-                    line = testLine;
-                  }
-                });
-                if (line) {
-                  ctx.fillText(line, margin + 20, yPos);
-                  yPos += lineHeight;
-                }
-              });
-            }
-            
-            yPos += lineHeight / 2;
-          });
+    let url = common.Encrypt("GeneratePDF");
+    url = "https://www.kylx365.com/apiData/" + url;
+    //url="http://localhost:3020/api/GeneratePDF";
+    wx.request({
+      url: url,
+      method: "POST",
+      data: {
+        Content: that.data.Content
+      },
+      responseType: 'arraybuffer',  // 确保响应类型为arraybuffer
+      success: function(res) {
+        // 将arraybuffer转为临时文件
+        const fsm = wx.getFileSystemManager();
+        const tempFilePath = `${wx.env.USER_DATA_PATH}/temp_${Date.now()}.pdf`;
+        
+        try {
+          fsm.writeFileSync(
+            tempFilePath,
+            res.data,
+            'binary'
+          );
+
+          // 直接使用临时文件路径，不再尝试永久保存
+          console.log('文件已生成:', tempFilePath);
           
-          // 保存图片
-          wx.canvasToTempFilePath({
-            canvas: canvas,
-            width: canvas.width,
-            height: canvas.height,
-            destWidth: canvas.width * 2,
-            destHeight: canvas.height * 2,
-            fileType: 'jpg',
-            quality: 0.9,
-            success(res) {
-              wx.saveImageToPhotosAlbum({
-                filePath: res.tempFilePath,
-                success() {
-                  wx.showToast({
-                    title: '图片已保存到相册',
-                    icon: 'success',
-                    duration: 2000
-                  });
-                  that.setData({ generatingImage: false });
-                },
-                fail(err) {
-                  console.error('保存图片失败:', err);
-                  if (err.errMsg.indexOf('auth deny') >= 0 || err.errMsg.indexOf('authorize') >= 0) {
-                    wx.showModal({
-                      title: '提示',
-                      content: '需要您授权保存图片到相册',
-                      showCancel: false,
-                      success() {
-                        wx.openSetting({
-                          success(res) {
-                            console.log('设置结果', res);
-                          }
-                        });
-                      }
-                    });
-                  } else {
-                    wx.showToast({
-                      title: '保存图片失败',
-                      icon: 'none'
-                    });
-                  }
-                  that.setData({ generatingImage: false });
-                }
+          // 打开PDF文件预览
+          wx.openDocument({
+            filePath: tempFilePath,
+            fileType: 'pdf',
+            showMenu: true,  // 显示右上角菜单，可以分享
+            success: function() {
+              console.log('打开文档成功');
+              wx.showToast({
+                title: 'PDF生成成功',
+                icon: 'success'
               });
             },
-            fail(err) {
-              console.error('生成图片失败:', err);
+            fail: function(error) {
+              console.error('打开文档失败:', error);
               wx.showToast({
-                title: '生成图片失败',
+                title: '打开文件失败',
                 icon: 'none'
               });
-              that.setData({ generatingImage: false });
             }
           });
+        } catch (error) {
+          console.error('写入文件失败:', error);
+          wx.showToast({
+            title: '写入文件失败',
+            icon: 'none'
+          });
+        }
+      },
+      fail: function(err) {
+        console.error('请求GeneratePDF接口失败:', err);
+        wx.showToast({
+          title: '网络错误，请稍候重试',
+          icon: 'none'
         });
-    } catch (error) {
-      console.error('生成图片过程出错:', error);
-      wx.showToast({
-        title: '生成图片失败',
-        icon: 'none'
-      });
-      this.setData({ generatingImage: false });
-    }
-  }
+      },
+      complete: function() {
+        that.setData({ generatingPDF: false });
+      }
+    });
+  },
+
 });

pages/article_generator/article_generator.wxml

@@ -26,6 +26,25 @@
     </radio-group>
   </view>
 
+  <!-- 文章类型选择区域 -->
+  <view class="section">
+    <view class="section-title">选择文章类型</view>
+    <radio-group class="two-column-layout" bindchange="onArticleStyleChange">
+      <block wx:for="{{articleStyles}}" wx:key="index" wx:for-item="category">
+        <view class="style-category">{{category.Name}}</view>
+        <view class="style-options-container">
+          <label class="style-option" 
+            wx:for="{{category.List}}" 
+            wx:key="Name"
+            wx:for-item="style">
+            <radio value="{{style.Name}}" checked="{{articleStyle === style.Name}}"/>
+            <text>{{style.Name}}</text>
+          </label>
+        </view>
+      </block>
+    </radio-group>
+  </view>
+
   <!-- 生成按钮 -->
   <view class="section">
     <button 
@@ -35,6 +54,13 @@
       loading="{{generating}}">
       生成文章
     </button>
+
+    <button 
+      class="generate-btn" 
+      type="primary" 
+      bindtap="generateTestArticle">
+      测试文章（非AI生成)
+    </button>
   </view>
 
   <!-- 生成的文章区域 -->
@@ -62,14 +88,16 @@
         答案：<view class="Answer1" wx:for="{{Content.Question}}" wx:key="index">({{index+1}}) {{item.Answer}}</view>
       </view>
     </view>
-    <!-- 生成图片按钮 -->
+    <!-- 生成图片和PDF按钮 -->
     <view class="section" wx:if="{{Content}}">
-      <button 
-        class="generate-image-btn" 
-        bindtap="generateImage"
-        loading="{{generatingImage}}">
-        生成练习图片
-      </button>
+      <view class="button-group">
+        <button 
+          class="generate-image-btn" 
+          bindtap="generatePDF"
+          loading="{{generatingPDF}}">
+          生成PDF文件
+        </button>
+      </view>
     </view>
   </block>
 

pages/article_generator/article_generator.wxss

@@ -59,16 +59,39 @@
 .difficulty-group {
   display: flex;
   flex-direction: column;
-  gap: 20rpx;
   width: 650rpx;
 }
 
+.two-column-layout {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+.style-options-container {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+  gap: 10rpx;
+}
+
 .difficulty-item {
   display: flex;
   align-items: center;
   gap: 10rpx;
   font-size: 28rpx;
   color: #333;
+  width: calc(50% - 10rpx);
+  box-sizing: border-box;
+  padding: 10rpx;
+}
+
+.style-option{
+  font-size:28rpx;
+}
+
+.full-width {
+  width: 100% !important;
 }
 
 /* 生成按钮样式 */
@@ -146,9 +169,64 @@
   visibility: hidden;
 }
 
+/* 按钮组样式 */
+.button-group {
+  display: flex;
+  justify-content: space-between;
+  gap: 20rpx;
+  width: 100%;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+}
+
 .generate-image-btn {
-  width: 80% !important;
-  margin: 30rpx auto !important;
+  flex: 1;
+  margin: 30rpx 0 !important;
   background-color: #1890ff;
   color: #fff;
+  font-size: 36rpx;
+  padding: 0 10rpx;
+  line-height: 80rpx;
+}
+
+/* 文章类型选择样式 */
+.style-category {
+  width: 100%;
+  font-size: 28rpx;
+  color: #666;
+  padding: 10rpx 0;
+  margin-top: 20rpx;
+  margin-bottom: 10rpx;
+  font-weight: bold;
+  border-bottom: 1rpx solid #eee;
+}
+
+.difficulty-group radio-group {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.difficulty-item {
+  width: 50%;
+  box-sizing: border-box;
+  padding: 10rpx;
+}
+
+.difficulty-item radio {
+  transform: scale(0.8);
+}
+
+.difficulty-item text {
+  font-size: 28rpx;
+  color: #333;
+}
+
+/* 难度选择保持单列 */
+.difficulty-select radio-group {
+  flex-direction: column;
+}
+
+.difficulty-select .difficulty-item {
+  width: 100%;
 }

pages/index/index.js

@@ -5,8 +5,7 @@ const app = getApp();
 
 Page({
   data: {
-    //Words:"apple\rblue\rred\rgreen\rbanana\rfish\rtable\rboy\rgirl"
-    Words:"go\r\ndo\r\nbe\r\ngood\r\nking\r\nriver\r\nfire\r\ndragon"
+    Words:""
   },
   onLoad: function (options) {
     var that = this;
@@ -42,6 +41,12 @@ Page({
       url: url,
     });
   },
+  getTest:function(){
+    this.setData({
+      Words:"go\r\ndo\r\nbe\r\ngood\r\nking\r\nriver\r\nfire\r\ndragon"
+    });
+  },
+
   onShareAppMessage: function () {
     return {
       title: app.globalData.ShareTitle,

pages/index/index.wxml

@@ -4,6 +4,9 @@
   <button class="feature-btn" bindtap="goto" data-url="../ocr/ocr">
     <view class="feature-name">拍照识别获得单词</view>
   </button>
+  <button class="feature-btn" bindtap="getTest">
+    <view class="feature-name">测试使用单词</view>
+  </button>
   
   <button class="footer feature-btn btn-retake" bindtap="goto" data-url="../article_generator/article_generator">
       <view class="feature-name">生成文章</view>

utils/constant.js

@@ -1,15 +1,60 @@
 module.exports = {
   arrHardLevel: [{
-    Level:0,
-    Name:"小学生难度"
-  },{
-    Level:1,
-    Name:"初中生难度"
-   },{
-    Level:2,
-    Name:"高中生难度"
-   },{
-    Level:3,
-    Name:"大学生难度"
-   }],
+    Level: 0,
+    Name: "小学生难度"
+  }, {
+    Level: 1,
+    Name: "初中生难度"
+  }, {
+    Level: 2,
+    Name: "高中生难度"
+  }, {
+    Level: 3,
+    Name: "大学生难度"
+  }],
+  arrArticleStyle: [{
+      Name: "童话类",
+      List: [{
+        Name: "童话故事"
+      }, {
+        Name: "寓言故事"
+      }, {
+        Name: "科幻/奇幻故事"
+      }]
+    },
+    {
+      Name: "生活类",
+      List: [{
+        Name: "校园文化"
+      }, {
+        Name: "家庭故事"
+      }, {
+        Name: "节日与文化"
+      }, {
+        Name: "旅行见闻"
+      }]
+    },
+    {
+      Name: "自然与科学",
+      List: [{
+        Name: "动物故事"
+      }, {
+        Name: "环保主题"
+      }, {
+        Name: "科普短文"
+      }]
+    },
+    {
+      Name: "情感与哲理",
+      List: [{
+        Name: "友情与分享"
+      }, {
+        Name: "成长烦恼"
+      }, {
+        Name: "人生哲理"
+      }, {
+        Name: "励志故事"
+      }]
+    },
+  ]
 }