Hi,How are you doing?
我是職場編碼(CodeVoc)。
在E000中,我們介紹了Node.js、Ruby、Electron等工具下載安裝。
這期,給你演示一下由Electron聯合Ruby製作的小工具。
視頻加載中...
藉助Electron官方Demo,我們很容易製作一個工具展示平臺。
點擊“View Demo”會彈出我們的工具界面。
一、項目需求
這個工具的主要目的是為了把Excel數據批量寫入Word生成工資字條。
它除了可以選擇源文件,還可以選擇目標文件。
點擊“寫入”按鈕,完美執行寫入操作。
二、界面設計
【html】
生成表單容器:
生成佈局標籤:
生成行內標籤:
生成單行輸入框:
生成文件選擇按鈕:
<code> /<code>
生成普通按鈕:
【css】
關注四點前白後綠氣泡某詞平臺,搜索“職場編碼”查看源碼。
【javascript】
根據ID,選中source_file按鈕
<code>var source_line=document.getElementById('source_line') /<code>
給source_file按鈕,添加"change"事件
<code>source_line.value=document.getElementById('source_file').files[0].path /<code>
根據ID,選中goal_file按鈕,
<code>var goal_line=document.getElementById('goal_line') /<code>
給goal_file按鈕,添加"change"事件
<code>goal_file.value=document.getElementById('goal_file').files[0].path /<code>
execute按鈕添加單擊事件
<code>execute.addEventListener("click",function(){獲取參數1,獲取參數2,調用}) /<code>
獲取參數1
<code>var source_line=document.getElementById('source_line').value /<code>
獲取參數2
<code>var goal_line=document.getElementById('goal_line').value /<code>
調用Ruby腳本
<code>const { spawn } = require('child_process') const ls = spawn('ruby', ['Ruby腳本完整路徑',參數1,參數2]) /<code>
三、邏輯梳理
=> 基礎語法
引用Ruby標準庫
<code>require "win32ole"/<code>
創建雙參數入口方法
<code>def Excel_to_table(pth_source,pth_goal)/<code>
接收控制檯傳雙參
<code>Excel_to_table(ARGV[0],ARGV[1])/<code>
設置條件判斷
<code>if 條件表達式 elsif 條件表達式 else end/<code>
設置雙循環
<code>s=2;s.step(20,2) do |s| (1..11).each do |j| end end /<code>
=> 對象模型
創建可視化Excel、Word應用
<code>@eap=WIN32OLE::new("excel.application");@eap.visible=true @wap=WIN32OLE::new("word.application");@wap.visible=true/<code>
打開Excel工作簿、Word文檔
<code>[email protected](pth_source) [email protected](pth_goal)/<code>
確定表格行數、創建表格
<code>[email protected](1).usedrange.currentregion.rows.count-1 wdc.tables.add(wdc.paragraphs(1).range,max*2,11); /<code>
表格格式化
<code>@wtb=wdc.tables(1) @wtb.borders.insidelinestyle=1 #內實線 @wtb.borders.outsidelinestyle=1 #外實線 @wtb.range.paragraphformat.alignment=1 #居中 @wtb.cell(s,j).range.font.name="黑體" /<code>
執行Excel數據寫入Word操作、日期格式化為“年-月”
<code>@wtb.cell(s,j)[email protected](1).cells(i,j).value.strftime("%Y-%m")/<code>
關注四點前白後綠氣泡某詞平臺,搜索“職場編碼”查看源碼。
關鍵字: getElementById 按鈕 file