效果图
demo下载
本demo使用了lin-ui小程序第三库
数据分析图
数据分析图
数据分析
写死的数据在：项目路径/utils/constants.js里面(数据太多就不全部展示了，关键数据写了备注)
{
.......
},
{
"id": "id4", // 分类id
"title": "分类4", // 分类标题
"num":0, // 分类数量
"items": [
{
"id": 40000, // spu id
"num":0, // spu 数量
"title": "林间有风自营针织衫", // spu名字
"subtitle": "秋日冬款，浪漫满屋",
"category_id": 12,
"root_category_id": 2,
"online": true,
"price": "77.00",
"sketch_spec_id": 1,
"default_sku_id": 2,
"img": "http://image.biaobaiju.com/uploads/20190807/11/1565150295-tzKZnFVJTg.jpeg",
"discount_price": "62.00",
"description": null,
"tags": "秋日冬款$浪漫满屋",
"is_test": true,
"for_theme_img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"sku_list": [
{
"id": 40001, // sku id
"price": 77.76,
"discount_price": null,
"online": true,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"title": "金属灰·七龙珠",
"spu_id": 2,
"code": "2$1-45#3-9#4-14", // sku 唯一状态吗、用于判断规格的可能性
"stock": 5,
"category_id": 17,
"root_category_id": 3,
"specs": [ // sku 规格
{
"key_id": 1,
"key": "颜色",
"value_id": 45,
"value": "金属灰"
},
{
"key_id": 3,
"key": "图案",
"value_id": 9,
"value": "七龙珠"
},
{
"key_id": 4,
"key": "尺码",
"value_id": 14,
"value": "小号 S"
}
],
"num": 0,
"actual_price": 77.76
},
{
"id": 40002, // sku id
"price": 66,
"discount_price": 59,
"online": true,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"title": "青芒色·灌篮高手",
"spu_id": 2,
"code": "2$1-42#3-10#4-15", // sku 唯一状态吗、用于判断规格的可能性
"stock": 999,
"category_id": 17,
"root_category_id": 3,
"specs": [ // sku 规格
{
"key_id": 1,
"key": "颜色",
"value_id": 42,
"value": "青芒色"
},
{
"key_id": 3,
"key": "图案",
"value_id": 10,
"value": "灌篮高手"
},
{
"key_id": 4,
"key": "尺码",
"value_id": 15,
"value": "中号 M"
}
],
"num": 0,
"actual_price": 59
},
{
"id": 40003, // sku id
"price": 88,
"discount_price": null,
"online": true,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"title": "青芒色·圣斗士",
"spu_id": 2,
"code": "2$1-42#3-11#4-16", // sku 唯一状态吗、用于判断规格的可能性
"stock": 8,
"category_id": 17,
"root_category_id": 3,
"specs": [ // sku 规格
{
"key_id": 1,
"key": "颜色",
"value_id": 42,
"value": "青芒色"
},
{
"key_id": 3,
"key": "图案",
"value_id": 11,
"value": "圣斗士"
},
{
"key_id": 4,
"key": "尺码",
"value_id": 16,
"value": "大号 L"
}
],
"num": 0,
"actual_price": 88
},
{
"id": 40004, // sku id
"price": 77,
"discount_price": 59,
"online": true,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"title": "橘黄色·七龙珠",
"spu_id": 2,
"code": "2$1-44#3-9#4-14", // sku 唯一状态吗、用于判断规格的可能性
"stock": 7,
"category_id": 17,
"root_category_id": 3,
"specs": [ // sku 规格
{
"key_id": 1,
"key": "颜色",
"value_id": 44,
"value": "橘黄色"
},
{
"key_id": 3,
"key": "图案",
"value_id": 9,
"value": "七龙珠"
},
{
"key_id": 4,
"key": "尺码",
"value_id": 14,
"value": "小号 S"
}
],
"num": 0,
"actual_price": 59
}
],
"spu_img_list": [
{
"id": 165,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"spu_id": 2
},
{
"id": 166,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"spu_id": 2
},
{
"id": 167,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"spu_id": 2
}
],
"spu_detail_img_list": [
{
"id": 28,
"img": "http://q9c36wjwt.bkt.clouddn.com/1.jpg",
"spu_id": 2,
"index": 1
}
]
}
]
},
界面与数据分析
1.主界面的分类、spu、sku添加删除。主要是操作上面的数据对应分类数量、spu数量、sku数量
2.商品购物车界面是保存sku的数据，spu id、分类id
3.搜索界面也是操作面的数据对应分类数量、spu数量、sku数量
4.商品规格展示主要是操作sku里面specs的数据、把全部可能性计算出来。
目录界面分析
目录界面分析
网友评论