由于本系統(tǒng)需要兼容ASPNET

1、XXXX表單定制系統(tǒng)初步規(guī)劃由于本系統(tǒng)需要兼容ASP.NET 和 JSP 兩個(gè)WEB平臺(tái)，所以初步計(jì)劃利用面向切面的模式進(jìn)行開(kāi)發(fā)，即利用Ajax、 Web Service技術(shù)。這樣可以避免因?yàn)閃EB平臺(tái)的不同照成對(duì)表單編輯器頁(yè)面功能的重復(fù)開(kāi)發(fā)，同時(shí)也可以增加系統(tǒng)的靈活性。本項(xiàng)目完成的目標(biāo)：WEB頁(yè)面定制、數(shù)據(jù)格式化、業(yè)務(wù)邏輯定制。第一步：頁(yè)面定制器原型概要本頁(yè)面定制器功能，應(yīng)具備以下幾點(diǎn)：1）、操作簡(jiǎn)便、易掌握，盡可能在主界面上完成操作，而不采用彈出對(duì)話框方式；2）、程序代碼僅包含HTML、CSS、JS，不需要任何后臺(tái)服務(wù)器，前臺(tái)也不需要任何第三方工具，代碼須具有很好的可讀性；3）、編輯器能調(diào)

2、用外部系統(tǒng)提供的WebService；4）、支持文本框、下拉框、列表框、復(fù)選框、單選框等常用控件；5）、支持表格常用功能，如插入行、插入列、合并單元格、拆分單元格等；6）、支持IE6、IE7、IE8；7）、支持代碼模式和設(shè)計(jì)模式均能編輯表單，以及在定制器中預(yù)覽或IE新窗口中預(yù)覽。8）、因?yàn)槲覀児居幸呀?jīng)封裝了很多自定義標(biāo)簽，例如：輸入貨幣文本框（<pr:input name=”userName” typeProperty=”money” precision="18" scale="4"/> 表示為小數(shù)位保留四位），還有存在很多特殊的標(biāo)簽，所以

3、要求提供常用控件的同時(shí)，可以自定義添加用戶自定義的控件，以便于高使用性；9）、可以添加自定義標(biāo)簽到組件面板;10）、編輯器，現(xiàn)在好像已經(jīng)固化，因?yàn)槲覀児緦?shí)現(xiàn)多種不同樣式之間的切換，及多種業(yè)務(wù)系統(tǒng)間的樣式都不盡相同，這一切樣式都取決于最終用戶的確定。所以編輯器要求讀取特定的css而形成編輯器的風(fēng)格及布局；因?yàn)楣緦?duì)于css已經(jīng)在數(shù)據(jù)庫(kù)進(jìn)行維護(hù)，所以編輯器也要根據(jù)css而適應(yīng)編輯風(fēng)格及布局的變化；11）、編輯器最好可以實(shí)現(xiàn)拖拉組件的方式；12）、編輯器最好有布局模式的修改，因?yàn)轭愋陀谟脩籼砑右粋€(gè)input，可能是用于輸入地址的，所以可能是多個(gè)單元格進(jìn)行合并的，還有很多的特殊，類型于textare

4、a。因?yàn)榭赡苡脩暨€會(huì)添加更多的編輯的行與列；或者提供其它解決方案；13）、編輯器如何實(shí)現(xiàn)與數(shù)據(jù)實(shí)體，表結(jié)構(gòu)間的綁定?？赡芙壎▉?lái)源一個(gè)數(shù)據(jù)實(shí)體，或者需要?jiǎng)?chuàng)建數(shù)據(jù)實(shí)體才可以進(jìn)行編輯器元素與數(shù)據(jù)實(shí)體間的綁定；14）、編輯器中添加組件的事件機(jī)制；15）、如果編輯器的元素綁定了數(shù)據(jù)實(shí)體后，還需要提供代碼自動(dòng)生成的功能，但這個(gè)可以共同開(kāi)發(fā)完成；16）、設(shè)計(jì)的可視化頁(yè)面可以管理，并且有版本的管理；17）、頁(yè)面所有元素屬性，包含Table的設(shè)置；18）、根據(jù)頁(yè)面設(shè)計(jì)生成數(shù)據(jù)表，數(shù)據(jù)表名自定義，數(shù)據(jù)庫(kù)字段及屬性來(lái)源于頁(yè)面設(shè)置的名稱和字段數(shù)據(jù)類型而生成；19）、代碼自動(dòng)生成，根據(jù)頁(yè)面設(shè)計(jì)后，綁定數(shù)據(jù)實(shí)體后，可進(jìn)行

5、代碼生成，代碼生成可以根據(jù)定義的模板進(jìn)行生成；20）、數(shù)據(jù)庫(kù)實(shí)體逆向生成；根據(jù)存在數(shù)據(jù)表進(jìn)行生成頁(yè)面元素；21）、數(shù)據(jù)綁定的數(shù)據(jù)格式和代碼自動(dòng)生成，雙方可以一起討論及協(xié)作共同完成；22）、設(shè)計(jì)完成的頁(yè)面可以保存成文件，同時(shí)可以將頁(yè)面中所需要的數(shù)據(jù)剝離后形成的映射文件，能描述出數(shù)據(jù)的實(shí)體關(guān)系。并且能根據(jù)該映射文件生成數(shù)據(jù)庫(kù)表。如果先將表設(shè)計(jì)完成，可以將表或者視圖生成映射文件，表單編輯器可以根據(jù)生成的映射文件逆向生成表單，所有的生成都要支持主從表的設(shè)計(jì)。工具欄工具欄共包含6個(gè)類別，分別為：文件工具欄、編輯工具欄、格式工具欄、運(yùn)行工具欄、控件工具欄、表格工具欄。文件工具欄文件工具欄共包含3個(gè)工具按鈕

6、，分別為：新建、保存、刪除，功能描述如下：1） 新建：點(diǎn)擊后彈出一個(gè)下拉菜單，讓用戶新建表單表單的屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本審批表單對(duì)象的所屬類型名稱文本主表單對(duì)象的名稱別名文本displaymainform對(duì)象的別名流程名稱單選下拉列出當(dāng)前模塊對(duì)應(yīng)的流程名稱列表，供用戶選擇對(duì)應(yīng)的審批流程名稱附件功能單選是設(shè)置是否能上傳附件，下拉選擇，包含：是、否事件清單名稱說(shuō)明onLoad表單打開(kāi)時(shí)執(zhí)行2）保存：將設(shè)計(jì)器中當(dāng)前創(chuàng)建的表單保存到應(yīng)用模塊數(shù)據(jù)庫(kù)中。3）刪除：刪除當(dāng)前表單刪除。編輯工具欄編輯工具欄共包含5個(gè)工具按鈕，分別為：剪切、復(fù)制、粘貼、取消、重做，功能描述如下：1）剪

7、切：將當(dāng)前選中的控件剪切至剪貼板。2）復(fù)制：將當(dāng)前選中的控件復(fù)制至剪貼板。3）粘貼：生成剪貼板中保存的控件的新實(shí)例。4）取消：回滾最后一次操作。5）重做：重新執(zhí)行最后一次操作。格式工具欄格式工具欄共包含6個(gè)工具按鈕，分別為：粗體、斜體、下劃線、字體、字號(hào)、顏色，功能描述如下：1）粗體：設(shè)置/取消當(dāng)前選中文本的粗體樣式。2）斜體：設(shè)置/取消當(dāng)前選中文本的斜體樣式。3）下劃線：設(shè)置/取消當(dāng)前選中文本的下劃線；4）字體：設(shè)置當(dāng)前選中文本的字體類別。5）字號(hào)：設(shè)置當(dāng)前選中文本的字號(hào)大小。6）顏色：設(shè)置當(dāng)前選中文本的顏色。運(yùn)行工具欄運(yùn)行工具欄共包含4個(gè)工具按鈕，分別為：查看代碼、查看設(shè)計(jì)、預(yù)覽、新窗口預(yù)

8、覽，功能描述如下：1）查看代碼：切換到當(dāng)前表單的HTML代碼界面。2）查看設(shè)計(jì)：切換到當(dāng)前表單的設(shè)計(jì)界面。3）預(yù)覽：在設(shè)計(jì)中預(yù)覽表單的運(yùn)行效果。4）新窗口預(yù)覽：在一個(gè)新打開(kāi)的IE窗口中預(yù)覽表單的運(yùn)行效果?？丶ぞ邫诳丶ぞ邫诠舶?4個(gè)工具按鈕，分別為：標(biāo)簽、單行文本框、多行文本框、日期框、數(shù)字框、復(fù)選框、單選框、列表框、下拉框、圖片框、按鈕、計(jì)算文本、人員選擇框、部門(mén)選擇框，功能描述如下：1） 標(biāo)簽：用于描述文字的輸入。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本標(biāo)簽對(duì)象的所屬類型名稱文本lableN對(duì)象的名稱標(biāo)題文本標(biāo)簽N顯示的文字字體下拉宋體字體類別字號(hào)下拉五號(hào)字號(hào)大小顏色下拉黑色

9、顏色類別粗體下拉否粗體樣式，包含：是、否斜體下拉否斜體樣式，包含：是、否下劃線下拉否下劃線，包含：是、否隱藏控制文本所有相關(guān)人員均可見(jiàn)指定當(dāng)前對(duì)象在什么情況下顯示/隱藏事件清單名稱說(shuō)明無(wú)附加說(shuō)明： 用戶在屬性框中對(duì)標(biāo)簽的字體、字號(hào)、顏色、粗體、斜體、下劃線的修改直接生效；隱藏控制包含幾種控制類別：所有相關(guān)人員均可見(jiàn)、所有參與審批的人員均可見(jiàn)、僅當(dāng)前辦理人可見(jiàn)、指定人員可見(jiàn)、特定環(huán)節(jié)隱藏、公式為真時(shí)隱藏，現(xiàn)詳細(xì)描述如下：l 所有人員均可見(jiàn)：指與當(dāng)前審批單據(jù)相關(guān)的人員都可見(jiàn)，包含：起草人、審批人、抄送人、知會(huì)人、會(huì)簽人。l 所有參與審批的人員均可見(jiàn)：指所有參與審批當(dāng)前單據(jù)的人員都可見(jiàn)，包含：起草人

10、、審批人。l 僅當(dāng)前辦理人可見(jiàn)：指只有當(dāng)前環(huán)節(jié)的辦理人可見(jiàn)。l 指定人員可見(jiàn)：僅限于設(shè)置的特定人員可見(jiàn)。l 特定環(huán)節(jié)隱藏：當(dāng)前單據(jù)流轉(zhuǎn)到特定的環(huán)節(jié)時(shí)隱藏，否則顯示。l 公式為真時(shí)隱藏：對(duì)于一些比較復(fù)雜的邏輯控制，可在此寫(xiě)Notes公式來(lái)控制，公式的值返回真時(shí)隱藏，否則顯示。2）、單行文本框：用于單行文字內(nèi)容的輸入。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本單行文本框?qū)ο蟮乃鶎兕愋兔Q文本textN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算缺省值文本最大長(zhǎng)度數(shù)字設(shè)置能輸入字符的最大個(gè)數(shù)HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前文本框的內(nèi)容，下拉選擇，包

11、含：是、否禁用單選否設(shè)置是否禁用當(dāng)前文本框，下拉選擇，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，下拉選擇，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填允許多值單選否下拉選擇，包含：是、否輸入分隔符單選分號(hào)下拉選擇，包含：分號(hào)、逗號(hào)、新行顯示分隔符單選分號(hào)下拉選擇，包含：分號(hào)、逗號(hào)、新行隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onBlur離開(kāi)焦點(diǎn)時(shí)執(zhí)行onChange內(nèi)容改變時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行onKeyDown按下鍵盤(pán)時(shí)執(zhí)行onKeyPress輸入內(nèi)容時(shí)執(zhí)行onKeyUp鍵盤(pán)彈起時(shí)執(zhí)行3）多行文本框：用于多行文字內(nèi)容的輸入。屬

12、性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本多行文本框?qū)ο蟮乃鶎兕愋兔Q文本mulTextN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算缺省值文本HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前文本框的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前文本框，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填行數(shù)數(shù)字3設(shè)置在頁(yè)面顯示的行數(shù)隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onBlur離開(kāi)焦點(diǎn)時(shí)執(zhí)行onChange內(nèi)容改變時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行onKeyDown按

13、下鍵盤(pán)時(shí)執(zhí)行onKeyPress輸入內(nèi)容時(shí)執(zhí)行onKeyUp鍵盤(pán)彈起時(shí)執(zhí)行4）日期框：用于日期值的輸入。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本日期框?qū)ο蟮乃鶎兕愋兔Q文本dateN對(duì)象的名稱返回框名稱文本datN保存選擇的日期信息的域名編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算缺省值文本HTML屬性文本禁用單選否設(shè)置是否禁用當(dāng)前文本框，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onBlur離開(kāi)焦點(diǎn)時(shí)執(zhí)行onFocus獲得焦

14、點(diǎn)時(shí)執(zhí)行5）數(shù)字框：用于數(shù)字值的輸入。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本數(shù)字框?qū)ο蟮乃鶎兕愋兔Q文本numN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算缺省值文本數(shù)據(jù)類型單選整數(shù)包含整數(shù)、貨幣、數(shù)值（包含小數(shù)的數(shù)字）HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前數(shù)字框的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前數(shù)字框，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onBlur離開(kāi)焦點(diǎn)時(shí)執(zhí)行onChange內(nèi)容改變時(shí)

15、執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行onKeyDown按下鍵盤(pán)時(shí)執(zhí)行onKeyPress輸入內(nèi)容時(shí)執(zhí)行onKeyUp鍵盤(pán)彈起時(shí)執(zhí)行6）復(fù)選框：用于需要同時(shí)選擇多個(gè)選項(xiàng)的情況。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本復(fù)選框?qū)ο蟮乃鶎兕愋兔Q文本chkN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算列表值文本復(fù)選框的成員列表缺省值文本設(shè)置默認(rèn)選中的成員列數(shù)數(shù)字1設(shè)置成員列表的顯示列數(shù)HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前對(duì)象的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前對(duì)象，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)

16、在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onChange內(nèi)容改變時(shí)執(zhí)行onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行附加說(shuō)明：列表值包含兩種數(shù)據(jù)來(lái)源：輸入選項(xiàng)（每行一個(gè)）、為選項(xiàng)使用公式，現(xiàn)詳細(xì)描述如下：輸入選項(xiàng)（每行一個(gè)）界面如下：為選項(xiàng)使用公式界面如下：7）單選框：用于需要選擇單個(gè)選項(xiàng)的情況。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本單選框?qū)ο蟮乃鶎兕愋兔Q文本rdoN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算列表值文本與“復(fù)選框”控件功能相同缺省值文本設(shè)置默認(rèn)選中的成員列數(shù)數(shù)

17、字1設(shè)置成員列表的顯示列數(shù)HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前對(duì)象的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前對(duì)象，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onChange內(nèi)容改變時(shí)執(zhí)行onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行8）列表框：以列表方式展示各成員，供用戶單選。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本列表框?qū)ο蟮乃鶎兕愋兔Q文本olstN對(duì)象的名稱編輯單選可編輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建

18、時(shí)計(jì)算列表值文本與“復(fù)選框”控件功能相同缺省值文本設(shè)置默認(rèn)選中的成員HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前對(duì)象的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前對(duì)象，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onChange內(nèi)容改變時(shí)執(zhí)行onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行9）下拉列表框：以下拉列表方式展示各成員，供用戶單選。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本下拉框?qū)ο蟮乃鶎兕愋兔Q文本lstN對(duì)象的名稱編輯單選可編

19、輯下拉選擇，包含：可編輯、計(jì)算、顯示時(shí)計(jì)算、創(chuàng)建時(shí)計(jì)算列表值文本與“復(fù)選框”控件功能相同缺省值文本設(shè)置默認(rèn)選中的成員HTML屬性文本只讀單選否設(shè)置是否能修改當(dāng)前對(duì)象的內(nèi)容，包含：是、否禁用單選否設(shè)置是否禁用當(dāng)前對(duì)象，包含：是、否必填單選否設(shè)置是否要求用戶必須填寫(xiě)，包含：是、否必填環(huán)節(jié)單選第一個(gè)環(huán)節(jié)在環(huán)節(jié)列表中選擇在哪個(gè)環(huán)節(jié)必填隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onChange內(nèi)容改變時(shí)執(zhí)行onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行onFocus獲得焦點(diǎn)時(shí)執(zhí)行10）圖片框：用戶在頁(yè)面上放置圖片的情況。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本圖片框?qū)ο蟮乃鶎兕愋兔?/p>

20、稱文本imgN對(duì)象的名稱圖片URL文本可編輯要顯示的圖片的URL地址寬度數(shù)字16圖片的顯示寬度高度數(shù)字16圖片的顯示高度超鏈接文本點(diǎn)擊圖片鏈接到的URL地址隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行11）按鈕：用于需要在頁(yè)面上放置按鈕的情況。屬性和事件清單：屬性清單名稱類型缺省值說(shuō)明類型文本按鈕對(duì)象的所屬類型名稱文本btnN對(duì)象的名稱標(biāo)題文本按鈕N按鈕上的說(shuō)明文字提示文本鼠標(biāo)停留在其上時(shí)顯示的說(shuō)明文字快捷鍵字母設(shè)置字母后按Alt + 字母可激活按鈕的單擊事件隱藏控制文本所有相關(guān)人員均可見(jiàn)與“標(biāo)簽”控件功能相同事件清單名稱說(shuō)明onClick點(diǎn)擊鼠標(biāo)左鍵時(shí)執(zhí)行12）計(jì)算文本：用于動(dòng)態(tài)獲取特定文本的情況。屬性和事件清單：屬性清單名稱