低代碼開發(fā)重要工具:JVS列表頁與表單配置全解析(javaweb表單代碼)
在JVS低代碼開發(fā)平臺中,操作頁面與數(shù)據(jù)模型之間關(guān)系是非常緊密的,一個簡單列表頁、表單的交互,這個過程我們可以大致分為幾個步驟:
頁面與數(shù)據(jù)模型的說明
創(chuàng)建目錄
1、創(chuàng)建列表頁
2、列表頁配置
- 設(shè)置列表頁的字段,保存(系統(tǒng)會自動創(chuàng)建對應(yīng)的數(shù)據(jù)模型)
- 刷新預(yù)覽列表頁配置的效果
- 設(shè)置列表新增按鈕觸發(fā)表單(系統(tǒng)會自動跳轉(zhuǎn)到表單配置界面)
3、表單配置
- 設(shè)置表單基本信息
- 設(shè)置表單中需要的組件
- 綁定表單組件和數(shù)據(jù)模型字段(系統(tǒng)會自動關(guān)聯(lián)對應(yīng)的數(shù)據(jù)模型,只需要選擇組件和字段的綁定關(guān)系)
- 設(shè)置表單展示的樣式
4、預(yù)覽表單配置效果(嘗試數(shù)據(jù)錄入)
關(guān)于模型的說明,用戶在創(chuàng)建/修改列表頁(表單),點擊保存時,系統(tǒng)會自動校驗頁面的字段與模型字段是否匹配,如果不匹配,模型會動態(tài)的對底層數(shù)據(jù)結(jié)構(gòu)進(jìn)行修改,以實現(xiàn)動態(tài)匹配業(yè)務(wù)需求的目標(biāo)。
其中,我們可以預(yù)覽數(shù)據(jù)模型的實際效果,點擊
①設(shè)置按鈕,系統(tǒng)自動彈出
②數(shù)據(jù)模型界面
如下圖所示,這里就是展示的列表頁對應(yīng)數(shù)據(jù)模型的具體字段
當(dāng)然在表單中,也是可以看到對應(yīng)的數(shù)據(jù)模型的,如下圖所示:
列表頁字段打開表單配置
在列表也中,為了讓用戶體驗更加便捷,往往希望在點擊字段內(nèi)容時,直接觸發(fā)表單,JVS也提供了類似的功能,如下圖所示:
上圖展示了兩種方式觸發(fā)表單,一種是在操作列中,通過按鈕觸發(fā),另外一種方式在數(shù)據(jù)展示內(nèi)容上點擊觸發(fā)彈出表單。
那么接下來我們來看下具體第二種通過內(nèi)容觸發(fā)的配置方式。
進(jìn)入列表頁設(shè)計界面中,在字段配置可配置點擊列表中字段打開表單。
進(jìn)入列表設(shè)計頁面-表格配置列,點擊需要打開表單的字段所在行的顯示配置【配置】。
點擊打開表單配置,這里表示通過這個字段的內(nèi)容點擊后,會觸發(fā)的表單
系統(tǒng)會自動進(jìn)入觸發(fā)的表單設(shè)計界面,如下圖所示
那么根據(jù)具體的業(yè)務(wù)要求,設(shè)計對應(yīng)的表單,如下圖所示
保存設(shè)計和配置,查看效果如下圖
在線配置地址:https://frame.bctools.cn/
開源地址:https://gitee.com/software-minister/jvs