亚洲乱色熟女一区二区三区丝袜,天堂√中文最新版在线,亚洲精品乱码久久久久久蜜桃图片,香蕉久久久久久av成人,欧美丰满熟妇bbb久久久

前言

表單在我們的日常工作中經(jīng)常會用到，一個優(yōu)質(zhì)的表單可以提高我們的工作效率，完成一些更多的業(yè)務(wù)，提高產(chǎn)品體驗，在實際應(yīng)用中，根據(jù)不同場景表單、表格、圖表，其中表單涉及到聯(lián)動、校驗、布局等復雜場景，經(jīng)常是開發(fā)者的需要耗費精力去解決的點。本文作為《OneCode表單系統(tǒng)》介紹的續(xù)篇，將著重介紹OneCode在復雜場景下的表單解決方案。

一，復雜表單系統(tǒng)難點

1，數(shù)據(jù)動態(tài)聯(lián)動

數(shù)據(jù)聯(lián)動是表單系統(tǒng)中最常見的動態(tài)組件，在組件定義過程中會預先設(shè)定好關(guān)聯(lián)規(guī)則，當規(guī)則中對應(yīng)的元素發(fā)生變化時會處罰與之相關(guān)聯(lián)的數(shù)據(jù)自動執(zhí)行變化。我們將這一類的組件根據(jù)場景不同進行了以下3個方面的細分。

（1）常用字典表聯(lián)動

用戶在做表單錄入時針對一些數(shù)據(jù)量比較大選擇項時通常會引導用戶通過分類來完成， 例如在錄入用戶居住地時，會依次完成省、市、區(qū)三級的選擇這期間就是一個基本的聯(lián)動關(guān)系，在不同的應(yīng)用場景中級聯(lián)的選項以及對應(yīng)的字典數(shù)據(jù)也會有所不同。我們將這一類以分類引導為主的關(guān)系型數(shù)據(jù)輸入統(tǒng)稱為“常用字典表聯(lián)動”；

（2）表格計算聯(lián)動

在實際應(yīng)用中還有一類表格計算型數(shù)據(jù)聯(lián)動也是非常常見的比如：在財務(wù)、建筑等系統(tǒng)中各種數(shù)據(jù)匯總表，在醫(yī)療系統(tǒng)中患者的藥品匯總單，等等都會涉及到表單輸入項的一些匯總求和等及時計算，我們將這一類的聯(lián)動統(tǒng)一歸類為“表格計算”。

（3）自定義公式聯(lián)動

在表單的實際應(yīng)用場景中，同樣的數(shù)據(jù)錄入往往會因為，輸入的人員角色不同，權(quán)限不同以及表單數(shù)據(jù)狀態(tài)不同，而表現(xiàn)出不同的狀態(tài)，這些跟具體的業(yè)務(wù)場景以及數(shù)據(jù)內(nèi)容相關(guān)的數(shù)據(jù)聯(lián)動，在實際開發(fā)中一般會選擇類似于exelc公式的動態(tài)DSL語法來完成一些小型的腳本邏輯嵌入，我們將這一類的聯(lián)動需求統(tǒng)稱為：“自定義公式聯(lián)動”。

2， 數(shù)據(jù)效驗

在大多數(shù)的表單系統(tǒng)中面向的用戶是一些非專業(yè)的IT人員，在設(shè)計輸入選項時為避免用戶的輸入錯誤需要針對用戶輸入的數(shù)據(jù)格式、大小、范圍等進行一些基礎(chǔ)的校驗，規(guī)范數(shù)據(jù)采集，避免數(shù)據(jù)問題造成數(shù)據(jù)無效。在表單系統(tǒng)設(shè)計方面，一般會根據(jù)業(yè)務(wù)對象的數(shù)據(jù)類型自動完成一些基礎(chǔ)類型的校驗，同時根據(jù)業(yè)務(wù)的一些特殊場景也需要用戶自定義一些業(yè)務(wù)效驗規(guī)則。

（1）基礎(chǔ)類型效驗

在基礎(chǔ)數(shù)據(jù)效驗方面，通常會優(yōu)先一些基礎(chǔ)類型的校驗，比如：文本、數(shù)字、日期甚至在前端輸入控件上使用一些特定的輸入方式，規(guī)范用戶輸入，同時再輔助一些大小范圍等業(yè)務(wù)定義輔助校驗。

（2）自定義效驗

在實際的業(yè)務(wù)場景中，都需要根據(jù)具體的業(yè)務(wù)場景來擴展數(shù)據(jù)效驗。比如在一些建筑類表單中運用的土方計算、醫(yī)療應(yīng)用中專有的血壓、體溫等等數(shù)據(jù)都會根據(jù)，數(shù)據(jù)對象的不同而表現(xiàn)為不同的效驗規(guī)則。

3，融合展現(xiàn)

表單的基本功能是負責數(shù)據(jù)的輸入輸出，在輸入端面向數(shù)據(jù)錄入者提供交互頁面，在數(shù)據(jù)展示端則負責面向數(shù)據(jù)的接受者展示數(shù)據(jù)的結(jié)果。隨著業(yè)務(wù)場景的多樣化以及業(yè)務(wù)數(shù)據(jù)應(yīng)用的逐步深入。數(shù)據(jù)端輸入要求的精度以及便捷度在逐步提高，在數(shù)據(jù)的接收展示端也越來越多的要求數(shù)據(jù)呈現(xiàn)的多樣性。簡單數(shù)據(jù)數(shù)字數(shù)據(jù)表格已經(jīng)很難以承載日益復雜的數(shù)據(jù)模型展現(xiàn)。這就要求表單在數(shù)據(jù)展現(xiàn)層面支持多樣化的結(jié)果展示。這其中最為常用的幾塊包括：圖形、圖標混排，更高層次的展現(xiàn)數(shù)據(jù)；將數(shù)據(jù)結(jié)果直接以版式文件模式展示方便最終結(jié)果的成文歸檔。支持數(shù)據(jù)錄入、展示為一體的嵌套混搭展示，提供一體化的輸入輸入載體。

（1）圖形、圖表混排

（2）版式文件格式支持

在國內(nèi)很多的業(yè)務(wù)數(shù)據(jù)系統(tǒng)，來源于傳統(tǒng)的業(yè)務(wù)的無紙化辦公應(yīng)用，

（3）錄入展示混搭嵌套

4，智能輸入輔助

在表單應(yīng)用中，有很大一部分是在高頻高強度輸入的強度使用的，比如醫(yī)療系統(tǒng)中醫(yī)師的病例診斷錄入，工商稅務(wù)等系統(tǒng)中直接面向個人或商戶的“窗口應(yīng)用”。這些應(yīng)用在設(shè)計上通常都需要一些常用場景的預設(shè)錄入，在操作者掌握一定的規(guī)則之后便可快捷方便的完成常用場景的快捷輸入以及數(shù)據(jù)的批量錄入。這就對表單系統(tǒng)提出了更高的要求。

（1）專業(yè)詞匯字典

（2）模糊智能推薦檢索

（3）個性化交互推薦操作

二，OneCode簡介

OneCode表單是基于OneCode開源低代碼引擎，開發(fā)的一款。面向復雜應(yīng)用的表單可視化解決方案產(chǎn)品。

onecode表單系統(tǒng)是建立在OneCode低代碼引擎的一個重要組成部分，由設(shè)計器，表單引擎、以及領(lǐng)域設(shè)計工具組成。

（1）可視化設(shè)計器

設(shè)計器是表單系統(tǒng)統(tǒng)一入口，onecode 設(shè)計器本身是一套開放的設(shè)計，用戶可以通過，OneCode語言指定擴展。設(shè)計器，采用的是拖拽引擎+插件的構(gòu)造模型，用戶可以通過開放的低代碼協(xié)議編寫插件。支持JS和JAVA兩種擴展語言。樣式構(gòu)建提供了標準CSS3編輯器，支持事件動作以及函數(shù)動態(tài)擴展。支持自定義函數(shù)庫擴展，支持阿里字體圖片等資源庫。

（2）表單引擎

表單引擎由三塊自成體系的可獨立部署運行的部分組成。前端引擎負責界面建模并按低代碼協(xié)議協(xié)議生成標準JSON，中后臺OneCode通過讀取標準JSON協(xié)議，完成后端的視圖建模，合并DSM后端服務(wù)建模系統(tǒng)，完成完整的后端服務(wù)建模應(yīng)用，通過代碼工程完成前后端一體的出碼應(yīng)用。JDSCloud是OneCode的協(xié)同支撐系統(tǒng)，除了常規(guī)的資源代碼空間管理外，提供了獨立的沙箱運行環(huán)境。為OneCode 提供工程化的仿真版本Ops等服務(wù)。

（3）DDD領(lǐng)域設(shè)計工具

OneCode-DSM(以下簡稱DSM)工具集是建立是以O(shè)neCode低代碼引擎為基礎(chǔ)專注于低代碼建模應(yīng)用的高階建模工具。在OneCode引擎中，出了為普通用戶提供無代碼的拖動設(shè)計器，低代碼的業(yè)務(wù)邏輯編排器，之外還提供了供專業(yè)業(yè)務(wù)領(lǐng)域?qū)＜业氖褂玫腄SM建模工具。

三，OneCode標準表單輸入控件

（1）頁面布局

表單系統(tǒng)，依然采用的是，OneCode低代碼引擎的布局結(jié)構(gòu)。使用工程結(jié)構(gòu)來完成項目代碼的管理及復用。

在主體布局上默認采用的表格布局，支持行列的自由拖動，以及行列合并操作。

允許以，整行、整列、獨立單元格獨立設(shè)置樣式。

OneCode也提供了，常用的嵌套布局容器組件。方便進行復雜頁面組合。

（2）表單輸入

基于OneCode的通用輸入控件，是經(jīng)過OneCode封裝后統(tǒng)一輸出的，包括前端用戶展現(xiàn)控制以及OneCode后端定義語法及DSM工具。

四，OneCode圖表支持

1，圖表配置器

2， FusionChartsXT

(3) ECharts

(4) SVGPaper

五，OneCode 前端設(shè)計器UI組件擴展

（1）設(shè)計器功能介紹

（2）物料庫

"物料"：低代碼引擎的核心目的之一是建設(shè)跨行業(yè)的低代碼框架，而每個行業(yè)由于其應(yīng)用的領(lǐng)域不同，使用的人員以及方法方式不同，在一些底層組件方面會有會有加大差距。比如：政府業(yè)務(wù)中會大量使用的非規(guī)則表單元素，企業(yè)應(yīng)用中各個行業(yè)自有的圖標體系，物聯(lián)網(wǎng)行業(yè)大量的設(shè)備圖標圖片以及實時聯(lián)網(wǎng)圖。

（3）組件庫

組件定義：可以用于低代碼平臺的組件，包含了搭建體驗增強配置，可以在設(shè)計器中 進行拖拽、配置等操作。有兩種分類方式：按照場景可以分為基礎(chǔ)組件、業(yè)務(wù)組件、圖 表組件、布局組件和復合組件等。通常用戶可以自主完成相關(guān)設(shè)定，并根據(jù)業(yè)務(wù)特點在視圖引擎中進行自行擴展（后續(xù)章節(jié)中會演示實際注冊示例）

（4）樣式體系

DOM樹透視樣式盒

DOM樹透視

配圖示例代碼

{
        "alias":"BuildTreeTreeView",
        "key":"xui.UI.TreeView",
        "host":this,
        "properties":{
            "name":"BuildTreeTreeGrid",
            "items":[
                {
                    "borderType":"none",
                    "caption":"JAVA樹",
                    "dynDestory":false,
                    "hidden":false,
                    "id":"getBuildTree",
                    "imageClass":"bpmfont bpmgongzuoliuxitongpeizhi",
                    "tagVar":{ }
                }
            ],
            "iniFold":false,
            "dynDestory":true
        },
      
        "CS":{
            "KEY":{
                "color":"#000000",
                "font-weight":"lighter",
                "border-radius":"0px 2px 0px 0px"
            },
            "BAR":{
                "font-family":"tahoma,geneva,sans-serif"
            }
        }
    }

代碼配置示例

{
        "alias":"xui_ui_cssbox1",
        "key":"xui.UI.CSSBox",
        "host":this,
        "properties":{
            "className":"xui-css-ame",
            "normalStatus":{
                "color":"#eeeeee",
                "border-radius":"6px",
                "box-shadow":"inset 0px 1px 0px #87C1DD",
                "text-shadow":"0 1px 0 #297192",
                "$gradient":{
                    "stops":[
                        {
                            "pos":"0%",
                            "clr":"#4BA3CC"
                        },
                        {
                            "pos":"70%",
                            "clr":"#3289B2"
                        }
                    ],
                    "type":"linear",
                    "orient":"T"
                },
                "cursor":"pointer",
                "border-top":"solid #3899C6  1px",
                "border-right":"solid #3899C6  1px",
                "border-bottom":"solid #3899C6  1px",
                "border-left":"solid #3899C6  1px"
            },
            "hoverStatus":{
                "border-radius":"0px 3px 0px 0px"
            }
        }
    }

（5）事件框架

配置代碼示例：

{
        "alias":"BuildTreeTreeView",
        "key":"xui.UI.TreeView",
        "host":this,
        "properties":{
            "name":"BuildTreeTreeGrid",
            "items":[
                {
                    "borderType":"none",
                    "caption":"JAVA樹",
                    "dynDestory":false,
                    "hidden":false,
                    "id":"getBuildTree",
                    "imageClass":"bpmfont bpmgongzuoliuxitongpeizhi",
                    "tagVar":{ }
                }
            ],
            "iniFold":false,
            "dynDestory":true
        },
        "events":{
    //獲取數(shù)據(jù)
            "onGetContent":{
                "actions":[
                    {
                        "args":[
                            "{page.ReloadChild.setQueryData()}",
                            null,
                            null,
                            "{args[1].tagVar}",
                            ""
                        ],
                        "desc":"設(shè)置擴展參數(shù)",
                        "method":"setQueryData",
                        "redirection":"other:callback:call",
                        "target":"ReloadChild",
                        "type":"control"
                    }
                ]
            },//數(shù)據(jù)項選擇
            "onItemSelected":{
                "actions":[
                    {
                        "args":[
                            "{args[1].id}"
                        ],
                        "conditions":[
                            {
                                "symbol":"non-empty",
                                "right":"",
                                "conditionId":"_nonempty_{args[1].className}",
                                "left":"{args[1].className}"
                            }
                        ],
                        "desc":"刪除存在頁",
                        "method":"removeItems",
                        "target":"BuildTreeTab",
                        "type":"control"
                    }
                ]
            }
        }
    }

（6）動作編排框架

動作設(shè)計概覽

在OneCode白皮書中參數(shù)了OneCode工作原理，其中有一個章節(jié)就是允許用戶將邏輯片段以及動作函數(shù)序列化為特定的JSON字符串。動作（邏輯）概覽則是針對邏輯片段可視化的入口工具。打開任意頁面便可以直觀的將該頁面的代碼片段以直觀的方式展現(xiàn)出來。并且可以直接插入，編輯事件，修改動作。同時也可以在調(diào)試期動態(tài)的中斷、跳出終止等功能。

動作概覽入口

動作概覽功能

六，OneCode前后端一體化建模擴展

（1）運行原理

用戶通過，拖拽完成頁面建模序列化為按標準協(xié)議序列化JSON文件,后端OneCode服務(wù)支撐系統(tǒng)解析JSON文件并混合DSM建模信息以及后端服務(wù)邏輯后，通過混合編譯，通過代碼工廠指定出碼模板，完成前后端一體的編譯文件。

運行原理

原型原理

(2) 一體化建模流程

（3）Java原生語言擴展

OneCode 本身基于JAVA語言體系，是在Java Spring 注解基礎(chǔ)上的一套擴展子集，混合編譯引擎器通過擴展注解構(gòu)建完整的Domain模型，通過讀取標準Spring 注解完成普通Web數(shù)據(jù)交付及調(diào)度過程，通過Domin域模型動態(tài)渲染JS文件輸出為JSON交付給前端引擎構(gòu)建頁面。

（4）領(lǐng)域建模工具

OneCode語法編輯

屬性配置

表單交互AJAX設(shè)定

后端聚合配置

（5）配置運行實例：

配置項示例：

OneCode配置

按鈕綁定服務(wù)OneCode代碼

七，工程發(fā)布總覽

（1）發(fā)布服務(wù)組成

工程發(fā)布，需要三方面的資源做支撐，分別是用戶通過設(shè)計完成的頁面及功能交互，通過特定的特定的出碼模板完成相應(yīng)的技術(shù)棧前端轉(zhuǎn)換形成的前端頁面目錄。而后端應(yīng)用則根據(jù)則是用戶通過基礎(chǔ)數(shù)據(jù)建模形成的領(lǐng)域模型文件，這些領(lǐng)域模型文件通常會按照，資源庫、支撐域工程域等模型方式來獨立打包方便后期版本管理及個體更新。另外第三塊則是方便工程啟動運行以及訪問控制，對外暴露監(jiān)控等相關(guān)的工程配置信息。

（2）發(fā)布配置

本地

發(fā)布遠程

工程配置

（3）前端庫

（4）后端服務(wù)

（5）通用域打包