---
# System prepended metadata

title: JS直播班第6組 - 第八週小組任務

---

# JS直播班第6組 - 第八週小組任務

## 簽到區


| 組員名單 | 簽到 |
| -------- | -------- | 
| (組長)雷雷#7844     | :heavy_check_mark: |
| Glamorouscoast#4095|  |
| Karen Chan#4625    |     |
| Nini Chen#5790    |   |
| StellaHsu#2687     |   |
| Vera#5592   |:heavy_check_mark:|
| 溡月#2553    |   |
| ssozr#4680   | |
| 雨增#9840   |    |
| Hazel.#6020    |   |


:::info
**小組討論方式：** 組員各自利用空檔時間，將答案貼上來並互相討論，有另外開一個DC讀書會進行各種作業資訊交流以及閒聊打屁(?。
:::



## 小組討論
### 問題
## 第一題 最終關卡討論

請討論 API 該如何與整合前端 [XD 設計稿](https://xd.adobe.com/view/a48b8617-4588-4817-9062-b62130dce916-f1d8/)

### 問題一：初始化，取得產品與購物車列表

* [取得產品列表(Get)：/api/livejs/v1/customer/{api_path}/products](https://hexschool.github.io/hexschoolliveswagger/#/%E7%94%A2%E5%93%81%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/get_api_livejs_v1_customer__api_path__products)
* [取得購物車列表(Get)：：/api/livejs/v1/customer/{api_path}/carts](https://hexschool.github.io/hexschoolliveswagger/#/%E8%B3%BC%E7%89%A9%E8%BB%8A%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/get_api_livejs_v1_customer__api_path__carts)

```
//取得產品列表(Get)：/api/livejs/v1/customer/{api_path}/products
{
  "status": true,
  "products": [
    {
      "category": "產品分類 (String)",
      "image": "產品圖片 (String)",
      "id": "產品ID  (String)",
      "title": "產品名稱  (String)",
      "origin_price": "產品原始價錢 (Number)",
      "price": "產品銷售價錢 (Number)"
    }
  ]
}
```
>新帳號預設購物車會有一筆資料
### 問題二：新增購物車品項，並再次初始化購物車列表
* [加入購物車(POST)：/api/livejs/v1/customer/{api_path}/carts](https://hexschool.github.io/hexschoolliveswagger/#/%E8%B3%BC%E7%89%A9%E8%BB%8A%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/post_api_livejs_v1_customer__api_path__carts)


### 問題三：修改購物車狀態(刪除全部、刪除單筆)，並再次初始化購物車列表
* [清除購物車內全部產品(DELETE)：/api/livejs/v1/customer/{api_path}/carts](https://hexschool.github.io/hexschoolliveswagger/#/%E8%B3%BC%E7%89%A9%E8%BB%8A%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/delete_api_livejs_v1_customer__api_path__carts)
* [刪除購物車內特定產品(DELETE)：/api/livejs/v1/customer/{api_path}/carts/{id}](https://hexschool.github.io/hexschoolliveswagger/#/%E8%B3%BC%E7%89%A9%E8%BB%8A%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/delete_api_livejs_v1_customer__api_path__carts__id_)


### 問題四：送出購買訂單，並再次初始化購物車列表
* [送出購買訂單(POST)：/api/livejs/v1/customer/{api_path}/orders](https://hexschool.github.io/hexschoolliveswagger/#/%E8%A8%82%E5%96%AE%E7%9B%B8%E9%97%9C(%E5%AE%A2%E6%88%B6)/post_api_livejs_v1_customer__api_path__orders)


### 問題五：觀看後台訂單
* [取得訂單列表(GET)：/api/livejs/v1/admin/{api_path}/orders](https://hexschool.github.io/hexschoolliveswagger/#/%E8%A8%82%E5%96%AE%E7%9B%B8%E9%97%9C(%E7%AE%A1%E7%90%86%E8%80%85)/get_api_livejs_v1_admin__api_path__orders)
* [Codepen 範例](https://codepen.io/hexschool/pen/yLgaBWV?editors=1010)



---
### 討論截圖

**Vera#5592**

![](https://i.imgur.com/dns0bg6.png)

![](https://i.imgur.com/4fv6Hyv.png)

![](https://i.imgur.com/5J5qkYT.png)

![](https://i.imgur.com/dzVDKPf.png)

![](https://i.imgur.com/JK8u2gt.png)

![](https://i.imgur.com/cy5Zrzz.png)


**雷雷#7844**

取得產品列表(Get)

![](https://i.imgur.com/STIlwM9.png)

取得購物車列表(Get)

![](https://i.imgur.com/kusVytt.png)

加入購物車(POST)

![](https://i.imgur.com/vh1b0xx.png)

清除購物車內全部產品(DELETE)

![](https://i.imgur.com/Jp12LDG.png)


刪除購物車內特定產品(DELETE)

![](https://i.imgur.com/2BUDxud.png)

![](https://i.imgur.com/IWN6fYV.png)

![](https://i.imgur.com/A3gAtHs.png)


送出購買訂單(POST)

![](https://i.imgur.com/pdkEHNW.png)

取得訂單列表(GET)

![](https://i.imgur.com/PbSxfkY.png)



| 組員| Codepen |
| -------- | -------- |
| 雷雷#7844    | [取得訂單列表](https://codepen.io/lei-yi-jie/pen/JjZvobw?editors=0010)     | 

