一種復(fù)雜頁面門戶頁面布局方法
【專利摘要】本發(fā)明公開了一種復(fù)雜頁面門戶頁面布局方法，其實(shí)現(xiàn)過程為：通過拖拽的方式設(shè)計(jì)表格布局，并對表格進(jìn)行合并行、合并列的操作，從而實(shí)現(xiàn)復(fù)雜頁面布局的頁面設(shè)計(jì)。該一種復(fù)雜頁面門戶頁面布局方法與現(xiàn)有技術(shù)相比，很好的解決了傳統(tǒng)列式布局無法完成復(fù)雜頁面布局的需求；通過使用JSON數(shù)組格式的數(shù)據(jù)，存儲(chǔ)門戶頁面的布局信息，使得保存門戶頁面布局時(shí)，極大地減少了關(guān)系數(shù)據(jù)庫的存儲(chǔ)記錄條數(shù)，一定程度上壓縮了存儲(chǔ)空間；采用分層渲染的方式加快了頁面的渲染速度，提高了資源的利用效率，實(shí)用性強(qiáng)，適用范圍廣泛，易于推廣。
【專利說明】
一種復(fù)雜頁面門戶頁面布局方法
技術(shù)領(lǐng)域
[0001]本發(fā)明涉及web應(yīng)用技術(shù)領(lǐng)域，具體地說是一種實(shí)用性強(qiáng)、復(fù)雜頁面門戶頁面布局方法。
【背景技術(shù)】
[0002]無論是企業(yè)還是政府部門在做信息化建設(shè)時(shí)，缺乏統(tǒng)一規(guī)劃、統(tǒng)一IT架構(gòu)和技術(shù)架構(gòu)、標(biāo)準(zhǔn)化，再加上采用分階段逐步建設(shè)的過程，導(dǎo)致建設(shè)的應(yīng)用系統(tǒng)彼此孤立，標(biāo)準(zhǔn)不一，資源難以共享，不能互聯(lián)互通，在資源重復(fù)建設(shè)等問題，這種“煙囪”式的管理模式使建設(shè)的多應(yīng)用系統(tǒng)不能夠有機(jī)的整合，形成“信息孤島”，造成流程、信息的交換隔閡。
[0003]門戶作為一個(gè)整合資源的應(yīng)用框架，在企業(yè)信息化建設(shè)中日益受到重視，它將各種應(yīng)用系統(tǒng)、數(shù)據(jù)資源和互聯(lián)網(wǎng)資源集中到一個(gè)信息管理平臺(tái)之上，并以統(tǒng)一的用戶界面提供給用戶，是企業(yè)快速的建立企業(yè)對客戶、企業(yè)對內(nèi)部員工和企業(yè)對企業(yè)的信息通道，使企業(yè)能夠釋放存儲(chǔ)在企業(yè)內(nèi)部和外部的各種信息。
[0004]隨著Web2.0技術(shù)的深入普及，以及基于Portlet規(guī)范的“重量級”門戶日顯得力不從心，基于Widget規(guī)范的“輕量級”門戶觀念深入人心，帶來了一種全新的用戶體驗(yàn)。隨著互聯(lián)網(wǎng)、移動(dòng)互聯(lián)網(wǎng)等前端新技術(shù)的快速發(fā)展，云計(jì)算、大數(shù)據(jù)等云技術(shù)的深入應(yīng)用，以及項(xiàng)目需求的不斷變化，簡單列式布局已經(jīng)越來越不能滿足項(xiàng)目要求。
[0005]基于上述技術(shù)，現(xiàn)提供一種復(fù)雜頁面門戶頁面布局方法，利用該方法可以實(shí)現(xiàn)跨行跨列的復(fù)雜頁面布局。

【發(fā)明內(nèi)容】

[0006]本發(fā)明的技術(shù)任務(wù)是針對以上不足之處，提供一種實(shí)用性強(qiáng)、復(fù)雜頁面門戶頁面布局方法。
[0007]—種復(fù)雜頁面門戶頁面布局方法，其實(shí)現(xiàn)過程為:通過拖拽的方式設(shè)計(jì)表格布局，并對表格進(jìn)行合并行、合并列的操作，從而實(shí)現(xiàn)復(fù)雜頁面布局的頁面設(shè)計(jì)。
[0008]所述表格布局方式通過Widget拖拽實(shí)現(xiàn)，具體為:
步驟一、首先提供Widget注冊頁面給門戶設(shè)計(jì)人員；
步驟二、門戶設(shè)計(jì)人員將Widget拖拽到內(nèi)容區(qū)并開始設(shè)計(jì)，通過對表格行列的合并、拆分、增刪操作，實(shí)現(xiàn)頁面上跨行、跨列的布局，進(jìn)而設(shè)計(jì)出符合項(xiàng)目需求的復(fù)雜頁面；
步驟三、設(shè)計(jì)結(jié)束后，為該頁面設(shè)置應(yīng)用范圍，即頁面查看權(quán)限，將相應(yīng)頁面布局信息保存在數(shù)據(jù)庫中，同時(shí)輸出只包含布局表格的html文件到應(yīng)用服務(wù)器指定目錄下，便于運(yùn)行時(shí)訪問；
步驟四、用戶訪問相關(guān)門戶，相關(guān)數(shù)據(jù)信息從數(shù)據(jù)庫中推送到前臺(tái)并展示，完成設(shè)計(jì)過程。
[0009 ]當(dāng)門戶設(shè)計(jì)人員設(shè)計(jì)，使用已經(jīng)注冊的Wi dget，將Wi dget拖拽到內(nèi)容區(qū)時(shí)，只顯示W(wǎng)idget布局占位信息及元數(shù)據(jù)信息，并通過預(yù)覽的方式查看最終渲染的頁面及Widget。
[0010]所述布局占位信息是指高度及寬度信息，元數(shù)據(jù)信息是指Widget名稱、作者及描述信息。
[0011]設(shè)計(jì)結(jié)束后，使用二維JSON數(shù)組存儲(chǔ)頁面布局信息，使用Jsoup解析布局頁面大字段字符串，提取HTML元素，計(jì)算組裝出包含Widget行列信息的二維JSON數(shù)組，并保存到數(shù)據(jù)庫中。
[0012]二維JSON數(shù)組中第一維代表整個(gè)門戶頁面，第二維代表Wi dge t，數(shù)組中包含三個(gè)元素:分別表示W(wǎng)idget的行號(hào)、列號(hào)、ID。
[0013]當(dāng)用戶訪問門戶時(shí)，通過運(yùn)行門戶引擎查詢，該門戶引擎展示以下信息:該用戶有權(quán)限看到的頁面信息;該頁面下包含的Widget信息。
[0014]當(dāng)包含門戶引擎將上述展示信息推送到前臺(tái)后，具體為:通過頁面信息請求應(yīng)用服務(wù)器上的頁面布局文件，通過頁面Widget信息確定頁面上每個(gè)Widget的位置，并加載相應(yīng)的Widget模版，通過Widget信息請求每個(gè)Widget文件，從而使用分層清染的方式展現(xiàn)頁面。
[0015]使用分層渲染的方式展現(xiàn)頁面，首先根據(jù)頁面的ID請求已經(jīng)保存在本地的html文件，該文件中只有表格沒有Widget，再通過后臺(tái)接口獲取表格中Widget的位置信息，在對應(yīng)的位置上渲染W(wǎng)idget模板，最后根據(jù)Widget的ID請求具體數(shù)據(jù)，渲染到頁面上，最終渲染出用戶看到的門戶頁面。
[0016]本發(fā)明的一種復(fù)雜頁面門戶頁面布局方法，具有以下優(yōu)點(diǎn):
該發(fā)明的一種復(fù)雜頁面門戶頁面布局方法通過拖拽的方式設(shè)計(jì)表格布局，并對表格進(jìn)行合并行、合并列等操作，從而實(shí)現(xiàn)復(fù)雜頁面布局頁面設(shè)計(jì)，很好的解決了傳統(tǒng)列式布局無法完成復(fù)雜頁面布局的需求;通過使用JSON數(shù)組格式的數(shù)據(jù)，存儲(chǔ)門戶頁面的布局信息，使得保存門戶頁面布局時(shí)，極大地減少了關(guān)系數(shù)據(jù)庫的存儲(chǔ)記錄條數(shù)，一定程度上壓縮了存儲(chǔ)空間；采用分層渲染的方式加快了頁面的渲染速度，提高了資源的利用效率，實(shí)用性強(qiáng)，適用范圍廣泛，易于推廣。
【具體實(shí)施方式】
[0017]下面結(jié)合具體實(shí)施例對本發(fā)明作進(jìn)一步說明。
[0018]本發(fā)明提供一種復(fù)雜頁面門戶頁面布局方法，該方法的實(shí)現(xiàn)過程為:通過拖拽的方式設(shè)計(jì)表格布局，并對表格進(jìn)行合并行、合并列的操作，從而實(shí)現(xiàn)復(fù)雜頁面布局的頁面設(shè)
i+o
[0019]所述表格布局方式通過Widget拖拽實(shí)現(xiàn)，具體為:
步驟一、首先提供Widget注冊頁面給門戶設(shè)計(jì)人員；
步驟二、門戶設(shè)計(jì)人員將Widget拖拽到內(nèi)容區(qū)并開始設(shè)計(jì)，通過對表格行列的合并、拆分、增刪操作，實(shí)現(xiàn)頁面上跨行、跨列的布局，進(jìn)而設(shè)計(jì)出符合項(xiàng)目需求的復(fù)雜頁面；
步驟三、門戶設(shè)計(jì)人員設(shè)計(jì)完畢，需要為該頁面設(shè)置應(yīng)用范圍，即頁面查看權(quán)限，可以是BSP的角色、組織機(jī)構(gòu)、用戶等;可以保存設(shè)計(jì)的完整布局頁到數(shù)據(jù)庫并使用JSON數(shù)組格式保存頁面布局信息，同時(shí)輸出只包含布局表格的html文件到應(yīng)用服務(wù)器指定目錄下，便于運(yùn)行時(shí)訪問；
步驟四、用戶訪問相關(guān)門戶，相關(guān)數(shù)據(jù)信息從數(shù)據(jù)庫中推送到前臺(tái)并展示，完成設(shè)計(jì)過程。
[0020]當(dāng)門戶設(shè)計(jì)人員設(shè)計(jì)，使用已經(jīng)注冊的Widget，將Widget拖拽到內(nèi)容區(qū)時(shí)，只顯示W(wǎng)idget布局占位信息及元數(shù)據(jù)信息，并通過預(yù)覽的方式查看最終渲染的頁面及Widget。
[0021]所述布局占位信息是指高度及寬度信息，元數(shù)據(jù)信息是指Widget名稱、作者及描述信息。
[0022]設(shè)計(jì)結(jié)束后，使用二維JSON數(shù)組存儲(chǔ)頁面布局信息，使用Jsoup解析布局頁面大字段字符串，提取HTML元素，計(jì)算組裝出包含Widget行列信息的二維JSON數(shù)組，并保存到數(shù)據(jù)庫中。
[0023]二維JSON數(shù)組中第一維代表整個(gè)門戶頁面，第二維代表Widget，數(shù)組中包含三個(gè)元素:分別表示W(wǎng)idget的行號(hào)、列號(hào)、ID。
[0024]當(dāng)用戶訪問門戶時(shí)，通過運(yùn)行門戶引擎查詢，該門戶引擎展示以下信息:該用戶有權(quán)限看到的頁面信息;該頁面下包含的Widget信息。
[0025]當(dāng)包含門戶引擎將上述展示信息推送到前臺(tái)后，具體為:通過頁面信息請求應(yīng)用服務(wù)器上的頁面布局文件，通過頁面Widget信息確定頁面上每個(gè)Widget的位置，并加載相應(yīng)的Widget模版，通過Widget信息請求每個(gè)Widget文件，從而使用分層清染的方式展現(xiàn)頁面。
[0026]使用分層渲染的方式展現(xiàn)頁面，首先根據(jù)頁面的ID請求已經(jīng)保存在本地的html文件，該文件中只有表格沒有Widget，再通過后臺(tái)接口獲取表格中Widget的位置信息，在對應(yīng)的位置上渲染W(wǎng)idget模板，最后根據(jù)Widget的ID請求具體數(shù)據(jù)，渲染到頁面上，最終渲染出用戶看到的門戶頁面。
[0027]上述【具體實(shí)施方式】僅是本發(fā)明的具體個(gè)案，本發(fā)明的專利保護(hù)范圍包括但不限于上述【具體實(shí)施方式】，任何符合本發(fā)明的一種復(fù)雜頁面門戶頁面布局方法的權(quán)利要求書的且任何所屬技術(shù)領(lǐng)域的普通技術(shù)人員對其所做的適當(dāng)變化或替換，皆應(yīng)落入本發(fā)明的專利保護(hù)范圍。
【主權(quán)項(xiàng)】
1.一種復(fù)雜頁面門戶頁面布局方法，其特征在于，其實(shí)現(xiàn)過程為:通過拖拽的方式設(shè)計(jì)表格布局，并對表格進(jìn)行合并行、合并列的操作，從而實(shí)現(xiàn)復(fù)雜頁面布局的頁面設(shè)計(jì)。2.根據(jù)權(quán)利要求1所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，所述表格布局方式通過Widget拖拽實(shí)現(xiàn)，具體為: 步驟一、首先提供Widget注冊頁面給門戶設(shè)計(jì)人員； 步驟二、門戶設(shè)計(jì)人員將Widget拖拽到內(nèi)容區(qū)并開始設(shè)計(jì)，通過對表格行列的合并、拆分、增刪操作，實(shí)現(xiàn)頁面上跨行、跨列的布局，進(jìn)而設(shè)計(jì)出符合項(xiàng)目需求的復(fù)雜頁面； 步驟三、設(shè)計(jì)結(jié)束后，為該頁面設(shè)置應(yīng)用范圍，即頁面查看權(quán)限，將相應(yīng)頁面布局信息保存在數(shù)據(jù)庫中，同時(shí)輸出只包含布局表格的html文件到應(yīng)用服務(wù)器指定目錄下，便于運(yùn)行時(shí)訪問； 步驟四、用戶訪問相關(guān)門戶，相關(guān)數(shù)據(jù)信息從數(shù)據(jù)庫中推送到前臺(tái)并展示，完成設(shè)計(jì)過程。3.根據(jù)權(quán)利要求2所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，當(dāng)門戶設(shè)計(jì)人員設(shè)計(jì)，使用已經(jīng)注冊的Widget，將Widget拖拽到內(nèi)容區(qū)時(shí)，只顯示W(wǎng)idget布局占位信息及元數(shù)據(jù)信息，并通過預(yù)覽的方式查看最終渲染的頁面及Widget。4.根據(jù)權(quán)利要求3所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，所述布局占位信息是指高度及寬度信息，元數(shù)據(jù)信息是指Widget名稱、作者及描述信息。5.根據(jù)權(quán)利要求2所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，設(shè)計(jì)結(jié)束后，使用二維JSON數(shù)組存儲(chǔ)頁面布局信息，使用Jsoup解析布局頁面大字段字符串，提取HTML元素，計(jì)算組裝出包含Widget行列信息的二維JSON數(shù)組，并保存到數(shù)據(jù)庫中。6.根據(jù)權(quán)利要求5所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，二維JSON數(shù)組中第一維代表整個(gè)門戶頁面，第二維代表Widget，數(shù)組中包含三個(gè)元素:分別表示W(wǎng)idget的行號(hào)、列號(hào)、ID。7.根據(jù)權(quán)利要求2所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，當(dāng)用戶訪問門戶時(shí)，通過運(yùn)行門戶引擎查詢，該門戶引擎展示以下信息:該用戶有權(quán)限看到的頁面信息；該頁面下包含的Widget信息。8.根據(jù)權(quán)利要求7所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，當(dāng)包含門戶引擎將上述展示信息推送到前臺(tái)后，具體為:通過頁面信息請求應(yīng)用服務(wù)器上的頁面布局文件，通過頁面Widget信息確定頁面上每個(gè)Widget的位置，并加載相應(yīng)的Widget模版，通過Widget信息請求每個(gè)Widget文件，從而使用分層清染的方式展現(xiàn)頁面。9.根據(jù)權(quán)利要求8所述的一種復(fù)雜頁面門戶頁面布局方法，其特征在于，使用分層渲染的方式展現(xiàn)頁面，首先根據(jù)頁面的ID請求已經(jīng)保存在本地的html文件，該文件中只有表格沒有Widget，再通過后臺(tái)接口獲取表格中Widget的位置信息，在對應(yīng)的位置上渲染W(wǎng)idget模板，最后根據(jù)Widget的ID請求具體數(shù)據(jù)，渲染到頁面上，最終渲染出用戶看到的門戶頁面。
【文檔編號(hào)】G06F9/44GK106020794SQ201610304461
【公開日】2016年10月12日
【申請日】2016年5月10日
【發(fā)明人】解成龍, 劉桂海, 呂廣義
【申請人】浪潮軟件股份有限公司