![09e3ceec745e5d24ce1cd3894dcb26c5.png](https://img-blog.csdnimg.cn/img_convert/09e3ceec745e5d24ce1cd3894dcb26c5.png)
![7578d65eaf1c9cdc17cfa19a4ff588c0.png](https://img-blog.csdnimg.cn/img_convert/7578d65eaf1c9cdc17cfa19a4ff588c0.png)
Hi,How are you doing?
我是职场编码(CodeVoc)。
在E000中,我们介绍了Node.js、Ruby、Electron等工具下载安装。
这期,给你演示一下由Electron联合Ruby制作的小工具。
知乎视频www.zhihu.com借助Electron官方Demo,我们很容易制作一个工具展示平台。
![43ec977367a521e69852ae0c91c2db8d.png](https://img-blog.csdnimg.cn/img_convert/43ec977367a521e69852ae0c91c2db8d.png)
点击“View Demo”会弹出我们的工具界面。
![2db99d71a93fe99f4871fcdd08f06cee.png](https://img-blog.csdnimg.cn/img_convert/2db99d71a93fe99f4871fcdd08f06cee.png)
一、项目需求
这个工具的主要目的是为了把Word版试题选项题目分离写入Excel题库。
它除了可以选择源文件,还可以选择目标文件。
甚至还能监听控制台输出,也就是说我们可以在脚本里输出控制台语句,
Electron文本框会接收控制台输出信息,从而显示在前端,
我们点击“写入”按钮,即可完成试题分离写入题库。
![e9176ba36a48acdcdb80c850b8ebbef0.png](https://img-blog.csdnimg.cn/img_convert/e9176ba36a48acdcdb80c850b8ebbef0.png)
二、界面设计
【html】
生成表单容器:<form></form>
生成布局标签:<div></div>
生成行内标签:<span></span>
生成单行输入框:<input id="source_line"><input id="goal_line">
生成文件选择按钮:
<input type="file" id="goal_file">
<input type="file" id="source_file">
生成文本框:<textarea id="text"></textarea>
生成普通按钮:<input type="button" id="execute">
【css】
关注四点前白后绿气泡某杺平台,搜索“职场编码”查看源码。
【javascript】
根据ID,选中source_file按钮
var source_line=document.getElementById('source_line')
给source_file按钮,添加"change"事件
source_line.value=document.getElementById('source_file').files[0].path
根据ID,选中goal_file按钮,
var goal_line=document.getElementById('goal_line')
给goal_file按钮,添加"change"事件
goal_file.value=document.getElementById('goal_file').files[0].path
execute按钮添加单击事件
execute.addEventListener("click",function(){获取参数1,获取参数2,调用})
获取参数1
var source_line=document.getElementById('source_line').value
获取参数2
var goal_line=document.getElementById('goal_line').value
调用Ruby脚本
const { spawn } = require('child_process')
const ls = spawn('ruby', ['Ruby脚本完整路径',参数1,参数2])
监听脚本命令行输出,将接收值即时传入文本框,自动显示最新行
var text=document.getElementById('text')
ls.stdout.on('data', data=>{text.value+=data;
var d = document.getElementById("text").scrollHeight;
document.getElementById("text").scrollTop = d})
三、逻辑梳理
=> 基础语法
引用Ruby标准库
require "win32ole"
创建双参数入口方法
def Word_to_excel(pth_source,pth_goal)
接收控制台传双参
Word_to_excel(ARGV[0],ARGV[1])
设置变量初值、创建二维数组
s1="A."
s4="D."
s5="正确答案"
arr = Array.new(150){[nil]}
设置条件判断
if 条件表达式
elsif 条件表达式
end
设置循环
(1..wdc.paragraphs.count).each{|j|
}
=> 对象模型
创建可视化Excel、Word应用
@eap=WIN32OLE::new("excel.application");@eap.visible=true
@wap=WIN32OLE::new("word.application");@wap.visible=true
打开Excel工作簿、Word文档
ebk=@eap.workbooks.open(pth_goal)
wdc=@wap.documents.open(pth_source)
执行Word段落数据写入数组操作
arr[i][0] = wdc.paragraphs(j-2).range.Text
arr[i][1] = wdc.paragraphs(j-1).range.Text
arr[i][2] = wdc.paragraphs(j).range.Text
arr[i][3] = wdc.paragraphs(j+1).range.Text
arr[i][4] = wdc.paragraphs(j+2).range.Text
arr[i][5] = wdc.paragraphs(j).range.Text
arr[i][6] = wdc.paragraphs(j).range.Text
执行数组写入Excel单元格区域操作
ebk.worksheets(1).range("a1").resize(150,7).value=arr
关注四点前白后绿气泡某杺平台,搜索“职场编码”查看源码。