Openwrt Luci界面開發

轉自:https://blog.csdn.net/qq_19004627/article/details/80364029

Openwrt已經提供了一個很強大的web管理界面Luci,可以方便的管理路由器。我們在開發智能路由器時,一般就需要在OpenWrt的WEB界面增加內容。

1.Luci簡介

LuCI是OpenWrt上的Web管理界面,LuCI採用了MVC三層架構,使用Lua腳本開發,所以開發LuCI的配置界面不需要編輯任何的Html代碼,除非想自己單獨去創建網頁(View層),否則我們基本上只需要修改Model層就可以了。

2. 添加選項Test

接下來介紹如何在“System”添加Test選項卡。

在文件系統目錄“/usr/lib/lua/luci/controller/admin”下創建test.lua文件,文件內容如下


module("luci.controller.admin.test", package.seeall)

 

function index()

    entry({"admin", "test"}, alias("admin", "test", "test"), _("Test1"), 30).index = true

    entry({"admin", "test", "control"}, cbi("admin_test/control"), _("ControlTest"), 1)

end

/etc/init.d/uhttpd restart 重啓http服務之後,刷新界面之後(有時候因爲緩存,界面沒有及時變化,rm -rf /tmp/luci-* 刪除緩存就可以了),界面變成

test.lua中 entry表示添加一個新的模塊入口,entry的定義如下,其中後兩項都是可以爲空:

entry(path, target, title=nil, order=nil)

“path”是訪問的路徑,路徑是按字符串數組給定的,比如路徑按如下方式寫“{"admin", "test", "control"}”,那麼就可以在瀏覽器裏訪問“http://192.168.1.1/cgi-bin/luci/admin/test/control”來訪問這個腳本。其中的“admin”表示爲管理員添加腳本,“test”即爲一級菜單名,“control”爲菜單項名。系統會自動在對應的菜單中生成菜單項。比如想在“System”菜單下創建一個菜單項,那麼一級菜單名可以寫爲“system”。
        “target”爲調用目標,調用目標分爲三種,分別是執行指定方法(Action)、訪問指定頁面(Views)以及調用CBI Module。
第一種可以直接調用指定的函數,比如點擊菜單項就直接重啓路由器等等,比如寫爲“call("function_name")”,然後在該lua文件下編寫名爲function_name的函數就可以調用了。
第二種可以訪問指定的頁面,比如寫爲“template("myapp/mymodule")”就可以調用/usr/lib/lua/luci/view/myapp/mymodule.htm文件了。
第三種主要應用在配置界面,比如寫爲“cbi("myapp/mymodule")”就可以調用/usr/lib/lua/luci/model/cbi/myapp/mymodule.lua文件了。
title和order是針對管理員菜單的,其中的title即是顯示在網頁上的內容。這裏我們創建“/usr/lib/lua/luci/controller/admin/test.lua”文件,定義我們的入口爲“test”。

3添加cbi腳本

由test.lua中cbi指示的目錄,在“/usr/lib/lua/luci/model/cbi/admin_test”目錄下有control.lua腳本。
1.在/usr/lib/lua/luci/model/cbi在新建admin_test目錄
2.在admin_test中新建control.lua文件,添加內容
 


require("luci.sys")

require("luci.sys.zoneinfo")

require("luci.tools.webadmin")

require("luci.fs")

require("luci.config")

 

local m, s, o

 

m = Map("test", translate("Test"), translate("This is simple test."))

m:chain("luci")

 

s = m:section(TypedSection, "controlboard", translate("Control Board"))

s.anonymous = true

s.addremove = false

 

 

s:tab("led", translate("Control LED"))

s:tab("beep", translate("Control Beep"))

--s:tab("adc", translate("Control Adc"))

 

--

-- LED

--

o = s:taboption("led", ListValue, "lednum", translate("LED NUM:"))

o.default = 0

o.datatype = "uinteger"

o:value(0, translate("LED0"))

o:value(1, translate("LED1"))

o:value(2, translate("LED2"))

 

o = s:taboption("led", ListValue, "ledstatus", translate("LED STATUS:"))

o.default = 1    --off status

o.datatype = "uinteger"

o:value(0, translate("LED ON"))

o:value(1, translate("LED OFF"))

 

 

--

-- BEEP

--

o = s:taboption("beep", ListValue, "beepstatus", translate("BEEP STATUS:"))

o.default = 1    --off status

o.datatype = "uinteger"

o:value(0, translate("ON"))

o:value(1, translate("OFF"))

 

o = s:taboption("beep", Value, "beepfreq", translate("BEEP FREQ:"))

o.datatype = "uinteger"

該腳本表示讀取/etc/config下的test文件,因此我們需要在/etc/config/中添加test文件。並在文件中添加:config controlboard

重啓uhttpd服務後,刷新後界面爲:

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章