一種促銷頁面配置方法及系統(tǒng)與流程
本發(fā)明涉及計(jì)算機(jī)技術(shù)領(lǐng)域，尤其是涉及一種促銷頁面配置方法及系統(tǒng)。
背景技術(shù)：
目前，面對解決日益增長的營銷類活動頁面需求，開發(fā)人員通過寫代碼的方式開發(fā)促銷活動頁面，有一定周期，任務(wù)越來越繁重，也增加了大量重復(fù)冗余的工作。當(dāng)促銷活動需求量大的時(shí)候，開發(fā)相關(guān)的活動頁面顯然占用了大量開發(fā)人員資源，促銷活動頁面的生成不夠高效、簡便、靈活易用。
JS：JavaScript一種直譯式腳本語言，是一種動態(tài)類型、弱類型、基于原型的語言，內(nèi)置支持類型。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用于客戶端的腳本語言，最早是在HTML(標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用)網(wǎng)頁上使用，用來給HTML網(wǎng)頁增加動態(tài)功能。
技術(shù)實(shí)現(xiàn)要素：
本發(fā)明的目的在于克服上述技術(shù)不足，提出一種促銷頁面配置方法及系統(tǒng)，解決現(xiàn)有技術(shù)中生成促銷活動頁面效率低、不夠簡便易用的技術(shù)問題。
為達(dá)到上述技術(shù)目的，本發(fā)明的技術(shù)方案提供一種促銷頁面配置方法，其中，包括:
S1、將促銷頁面劃分為不同的功能模塊，每個(gè)功能模塊由一個(gè)不同的所述組件實(shí)現(xiàn)，所述組件包括至少一個(gè)屬性；
S2、選擇需要的組件，配置組件的屬性信息；
S3、提取配置好屬性信息的所選組件的相應(yīng)代碼；
S4、將提取的所有組件的相應(yīng)代碼組裝形成結(jié)果頁代碼，顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
本發(fā)明還提供一種促銷頁面配置系統(tǒng)，包括：
組件定義模塊：將促銷頁面劃分為不同的功能模塊，每個(gè)功能模塊由一個(gè)不同的所述組件實(shí)現(xiàn)，所述組件包括至少一個(gè)屬性；
配置組件模塊：選擇需要的組件，配置組件的屬性信息；
提取組件模塊：提取配置好屬性信息的所選組件的相應(yīng)代碼；
組裝和顯示模塊：將提取的所有組件的相應(yīng)代碼組裝形成結(jié)果頁代碼，顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
與現(xiàn)有技術(shù)相比，本發(fā)明的有益效果包括：可選擇需要的不同組件，配置組件的屬性信息，實(shí)現(xiàn)不同的功能模塊的功能，并最終顯示結(jié)果頁的頁面效果，基本不需要開發(fā)人員參與編寫代碼即可由運(yùn)營人員配置好促銷頁面，簡單易用、高效，解放了開發(fā)人員的生產(chǎn)力，縮短了促銷頁面的開發(fā)周期，當(dāng)定義的組件確實(shí)無法滿足促銷頁面的某些需求時(shí)，可以通過開發(fā)人員的介入，在自定義組件提供的界面中輸入網(wǎng)頁代碼實(shí)現(xiàn)所需的特定需求，靈活易用。
附圖說明
圖1是本發(fā)明提供的一種促銷頁面配置方法流程圖；
圖2是本發(fā)明提供的一種促銷頁面配置系統(tǒng)結(jié)構(gòu)框圖。
附圖中：1、促銷頁面配置系統(tǒng)，11、組件定義模塊，12、配置組件模塊，13、提取組件模塊，14、組裝和顯示模塊。
具體實(shí)施方式
為了使本發(fā)明的目的、技術(shù)方案及優(yōu)點(diǎn)更加清楚明白，以下結(jié)合附圖及實(shí)施例，對本發(fā)明進(jìn)行進(jìn)一步詳細(xì)說明。應(yīng)當(dāng)理解，此處所描述的具體實(shí)施例僅僅用以解釋本發(fā)明，并不用于限定本發(fā)明。
本發(fā)明提供了一種促銷頁面配置方法，其中，包括：
S1、將促銷頁面劃分為不同的功能模塊，每個(gè)功能模塊由一個(gè)不同的所述組件實(shí)現(xiàn)，所述組件包括至少一個(gè)屬性；
S2、選擇需要的組件，配置組件的屬性信息；
S3、提取配置好屬性信息的所選組件的相應(yīng)代碼；
S4、將提取的所有組件的相應(yīng)代碼組裝形成結(jié)果頁代碼，顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
本發(fā)明所述的促銷頁面配置方法，步驟S1中：
在本發(fā)明的實(shí)施例中，促銷頁面可以劃分為頭圖模塊，倒計(jì)時(shí)模塊，商品流模塊，自定義模塊等，自定義功能模塊由自定義組件實(shí)現(xiàn)。
本發(fā)明所述的促銷頁面配置方法，步驟S2中：
組件的屬性信息包括：文字信息、圖片信息，每個(gè)組件可以配置文字信息、圖片信息。
在本發(fā)明的實(shí)施例中，每個(gè)組件都繼承自BaseWidget,每個(gè)組件有script,CSS,HTML3個(gè)基本屬性；每個(gè)組件都有文字屬性(text)、圖片屬性(img)，文字屬性(text)、圖片屬性(img)會配置一個(gè)繼承自BaseProp的輸入框TextProp.js、顏色選擇框ColorProp.js；利用`on('input','.input')`可對輸入框里內(nèi)容進(jìn)行更改，調(diào)用BaseProp類里的`set value`方法將輸入框里值對應(yīng)到組件的文字屬性(text)上；組件上文字屬性(text)、圖片屬性(img)更改后，會調(diào)用對應(yīng)的`setter`方法，重新生成對應(yīng)的html屬性或重新生成對應(yīng)的script和css屬性(如果這個(gè)屬性是樣式或者功能相關(guān)的，就會重新生成組件對應(yīng)的script和css屬性)；
自定義組件的功能實(shí)現(xiàn)：用戶在自定義組件提供的界面中輸入網(wǎng)頁代碼，自定義組件通過`match(/<style>([\s\S]+？)</style>/)`利用正則表則式的match方法提取用戶輸入代碼中的style標(biāo)簽作為css屬性，提取用戶輸入代碼中的`<script>`標(biāo)簽作為script屬性，提取用戶輸入代碼中的html標(biāo)簽作為html屬性，自定義組件能夠用CSS，HTML，javascript實(shí)現(xiàn)各種復(fù)雜功能。
本發(fā)明所述的促銷頁面配置方法，步驟S3中：
組件由CSS樣式代碼、HTML結(jié)構(gòu)代碼、JS控制邏輯代碼構(gòu)成，提取配置好屬性信息的所選組件的CSS樣式代碼、HTML結(jié)構(gòu)代碼、JS控制邏輯代碼。
在本發(fā)明的實(shí)施例中，首先通過`this.designView.find('.widget').each`遍歷頁面中的所有組件，然后通過(`$(this).data('script')`)提取出每個(gè)組件的script和css屬性，通過`$(this).html()`提取出每個(gè)組件的html屬性。
本發(fā)明所述的促銷頁面配置方法，步驟S4中：
具體的實(shí)施例中，通過`<style>${csscode}><body>${htmlcode}<script>${scriptcode}</body>`將提取的所有組件的css屬性、script屬性、html屬性組裝在一起形成結(jié)果頁代碼，每個(gè)組件提取出來的CSS屬性組裝在一起就是結(jié)果頁的CSS樣式，每個(gè)組件提取出來的script屬性組裝在一起就是結(jié)果頁的javascript，每個(gè)組件提取出來的html屬性組裝在一起就是結(jié)果頁的結(jié)構(gòu)，最終顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
促銷頁面還包括一促銷效果統(tǒng)計(jì)模塊，所述促銷效果統(tǒng)計(jì)模塊統(tǒng)計(jì)用戶下單數(shù)量，并上傳到服務(wù)器，服務(wù)器分析歷史記錄中不同促銷頁面上傳的用戶下單數(shù)量并對用戶下單數(shù)量從高到低進(jìn)行排序，當(dāng)用戶下單數(shù)量處于排序中前設(shè)定范圍內(nèi)，服務(wù)器向所述促銷效果統(tǒng)計(jì)模塊發(fā)送指令，所述促銷效果統(tǒng)計(jì)模塊上傳促銷頁面各組件的代碼至服務(wù)器，服務(wù)器保存所述促銷效果統(tǒng)計(jì)模塊上傳的代碼并提供給用戶下載。
本發(fā)明還提供一種促銷頁面配置系統(tǒng)1，其中，包括：
組件定義模塊11：將促銷頁面劃分為不同的功能模塊，每個(gè)功能模塊由一個(gè)不同的所述組件實(shí)現(xiàn)，所述組件包括至少一個(gè)屬性；
配置組件模塊12：選擇需要的組件，配置組件的屬性信息；
提取組件模塊13：提取配置好屬性信息的所選組件的相應(yīng)代碼；
組裝和顯示模塊14：將提取的所有組件的相應(yīng)代碼組裝形成結(jié)果頁代碼，顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
本發(fā)明所述的促銷頁面配置系統(tǒng)1，組件定義模塊11中：
頁面包括一自定義功能模塊，自定義功能模塊由自定義組件實(shí)現(xiàn)，用戶在自定義組件提供的界面中輸入網(wǎng)頁代碼自由編輯自定義功能模塊的頁面效果。
本發(fā)明所述的促銷頁面配置系統(tǒng)1，配置組件模塊12中：
組件的屬性信息包括：文字信息、圖片信息。
本發(fā)明所述的促銷頁面配置系統(tǒng)1，提取組件模塊13中：
組件由CSS樣式代碼、HTML結(jié)構(gòu)代碼、JS控制邏輯代碼構(gòu)成，提取配置好屬性信息的所選組件的CSS樣式代碼、HTML結(jié)構(gòu)代碼、JS控制邏輯代碼。
促銷頁面還包括一促銷效果統(tǒng)計(jì)模塊，所述促銷效果統(tǒng)計(jì)模塊統(tǒng)計(jì)用戶下單數(shù)量，并上傳到服務(wù)器，服務(wù)器分析歷史記錄中不同促銷頁面上傳的用戶下單數(shù)量并對用戶下單數(shù)量從高到低進(jìn)行排序，當(dāng)用戶下單數(shù)量處于排序中前設(shè)定范圍內(nèi)，服務(wù)器向所述促銷效果統(tǒng)計(jì)模塊發(fā)送指令，所述促銷效果統(tǒng)計(jì)模塊上傳促銷頁面各組件的代碼至服務(wù)器，服務(wù)器保存所述促銷效果統(tǒng)計(jì)模塊上傳的代碼并提供給用戶下載。
本發(fā)明提供的一種促銷頁面配置方法及系統(tǒng)在使用過程中，首先將頁面劃分為不同的功能模塊，定義不同的組件，每個(gè)功能模塊由一個(gè)不同的組件實(shí)現(xiàn)；然后選擇需要的組件，配置組件的屬性信息；提取配置好屬性信息的所選組件的相應(yīng)代碼；最后將提取的所有組件的相應(yīng)代碼組裝形成結(jié)果頁代碼，顯示結(jié)果頁代碼實(shí)現(xiàn)的頁面效果。
與現(xiàn)有技術(shù)相比，本發(fā)明的有益效果包括：可選擇需要的不同組件，配置組件的屬性信息，實(shí)現(xiàn)不同的功能模塊的功能，并最終顯示結(jié)果頁的頁面效果，基本不需要開發(fā)人員參與編寫代碼即可由運(yùn)營人員配置好促銷頁面，簡單易用、高效，解放了開發(fā)人員的生產(chǎn)力，縮短了促銷頁面的開發(fā)周期，當(dāng)定義的組件確實(shí)無法滿足促銷頁面的某些需求時(shí)，可以通過開發(fā)人員的介入，在自定義組件提供的界面中輸入網(wǎng)頁代碼實(shí)現(xiàn)所需的特定需求，靈活易用。
以上所述本發(fā)明的具體實(shí)施方式，并不構(gòu)成對本發(fā)明保護(hù)范圍的限定。任何根據(jù)本發(fā)明的技術(shù)構(gòu)思所做出的各種其他相應(yīng)的改變與變形，均應(yīng)包含在本發(fā)明權(quán)利要求的保護(hù)范圍內(nèi)。
- 還沒有人留言評論。精彩留言會獲得點(diǎn)贊！