電商網站商品模型之商品詳情頁設計方案

以下設計方案參考淘寶和華爲商城數據庫

SKU SPU的關係

SPU = Standard Product Unit (標準產品單位)
SPU是商品信息聚合的最小單位,是一組可複用、易檢索的標準化信息的集合,該集合描述了一個產品的特性。例如iphone4就是一個SPU,與套餐、存儲容量、顏色無關。iphone

SKU=stock keeping unit(庫存量單位)
SKU即庫存進出計量的單位, 能夠是以件、盒、托盤等爲單位。
SKU是物理上不可分割的最小存貨單元。在使用時要根據不一樣業態,不一樣管理模式來處理。例如32G白色iphone4就是一個SKU。數據庫設計

一個SPU包含一組SKU,咱們一般把一組具備通用信息的商品抽象成一個SPU,這樣更加有利於數據的複用。網站

好比淘寶就是把規格參數和商品詳情放在SPU中,這樣同一個SPU下的多個SKU就能夠複用這些信息。而把影響價格的屬性選項(顏色、套餐、存儲容量等等)放到SKU中。ui

以下圖:url

 注意:數據庫設計時,SKU的id能夠用自增加的七位數字表示,在數據庫初始化時設置SKU的id的起始值爲1000001,而後遞增增加。spa

 

 

屬性設計

 在電商網站的商品詳情頁的頭部,咱們常常能夠經過點擊不一樣的選項(顏色、套餐、尺寸等等)從而改變商品的價格設計

以下圖:blog

對應的數據庫設計方案以下圖:輪播圖的設計參考華爲商城圖片

 

屬性爲何要放到分類下面呢?若是把衣服和手機都看作一個分類的話,它們都有顏色屬性,可是它們全部的具體顏色有不太相同,好比衣服的顏色種類會比較豐富而手機的顏色可能就黑白藍等簡單的幾種顏色。這樣作確實是增長了數據庫的冗餘,可是對在後臺添加SKU帶來了查詢上的方便,提升了用戶體驗。

後臺界面設計方案:

第一步:添加一個分類

第二步:給分類添加所屬屬性

第三步:給屬性設置一系列選項

第四步:添加一個SPU並設置SPU下的一組輪播圖片

第五步:添加一個SKU,添加SKU的時候根據選擇的不一樣SPU自動列出對應的屬性和屬性選項供勾選(只能單選),而且列出SPU下的一組輪播圖片供SKU挑選

前臺界面數據讀取方案:

第一步:當跳轉到某個SKU詳情頁面的時候,根據當前的SKU查出當前SKU所在SPU組下面的全部SKU的屬性及屬性選項分組展現,默認勾選當前SKU對應的屬性選項值。

第二步:當用戶選擇不一樣的屬性選項時根據選擇狀態計算出對應的SKU,而後改變商品名稱、顯示價格、及輪播圖圖片。

計算SKUID的具體方法爲(僞代碼):

var skuids=當前頁碼url skuid對應的spu下的一組skuid。

var optionids=前臺獲取到的一組選項id;

int currentSkuid=0;

for(int i=0;i<skuids.count;i++)

{    

  for(int j=0;j<optionids.count;j++)

    {

       bool hasRecord= db.SKU-屬性選項表.Where(c=>c.skuid=skuids[i]&&c.選項ID=optionids[i]).Any();

       if(!hasRecord)

      {

          break;

      }

    }

    currentSkuid=skuids[i];

    break;

}

規格設計

規格選項是和SPU對應的,規格是一組相同SPU的商品的描述信息。

以下圖:

 

設計方案: 

後臺界面設計方案:

第一步:添加一個分類

第二步:給分類添加規格組

第三步:給規格組添加規格

第四步:給規格添加規格參數

第五步:添加SPU時,列出SPU對應分類下的全部規格組、規格、規格參數供勾選(可多選)

前臺界面數據讀取方案:

第一步:當跳轉到某個SKU詳情頁面的時候,根據當前的SKU查出當前SKU所在SPU下的全部規格參數,按規格組、規格合併顯示。

 商品詳情設計

 

商品詳情其實是文字信息加一系列的圖片(從詳情圖片表中取)。咱們把商品詳情放在SPU中。

設計方案以下:

 

 

後臺界面設計方案:

第一步:SPU編輯界面上傳詳情圖片

前臺界面數據讀取方案:

第一步:當跳轉到某個SKU詳情頁面的時候,根據當前的SKU查出當前SKU所在SPU下的全部詳情圖片。

 

 完整的設計方案

 

單位數量轉換關係

 以上設計方案雖然完成了商品詳情頁的設計,可是對因而商品的單位、數量、單價尚未進行具體的介紹。好比,地板採購單位多是箱,銷售單位是平方米,而庫存單位是片。這種問題怎麼解決呢?

設計單位數量轉換關係表

單位數量轉換關係表和sku表多對一關係。後臺商品添加時先設置單位數量轉換關係。sku的庫存單位爲單位數量轉換關係表中的基本單位,銷售單位採購單位都從單位數量轉換關係表中選擇。

在採購單的設計中要放(採購單位、採購數量、採購價、幣種、庫存單位數量),在銷售訂單的設計中要放(銷售單位、銷售數量、銷售價、幣種、庫存單位數量)。由於實際的出入庫數量用的都是庫存單位數量,這樣即便改了銷售單位、採購單位,出庫數量也不會錯。

相關文章
相關標籤/搜索