-
客服电话
-
APP下载
迪恩网络APP
随时随地掌握行业动态
-
官方微信
扫描二维码
关注迪恩网络微信公众号
客服电话
APP下载
迪恩网络APP
随时随地掌握行业动态
官方微信
扫描二维码
关注迪恩网络微信公众号
|
项目目录： 模拟数据： utils / data.js function getSData() {
var data = [
{
"name": "热销榜",
"type": -1,
"foods": [
{
"name": "皮蛋瘦肉粥",
"price": 10,
"oldPrice": "",
"description": "咸粥",
"sellCount": 229,
"Count": 0,
"rating": 100,
"info": "一碗皮蛋瘦肉粥，总是我到粥店时的不二之选。香浓软滑，饱腹暖心，皮蛋的Q弹与瘦肉的滑嫩伴着粥香溢于满口，让人喝这样的一碗粥也觉得心满意足",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "很喜欢的粥",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 1,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "扁豆焖面",
"price": 14,
"oldPrice": "",
"description": "",
"sellCount": 188,
"Count": 0,
"rating": 96,
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 1,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"info": "",
"icon": "http://fuss10.elemecdn.com/c/6b/29e3d29b0db63d36f7c500bca31d8jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/c/6b/29e3d29b0db63d36f7c500bca31d8jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "葱花饼",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 124,
"Count": 0,
"rating": 85,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "没啥味道",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 1,
"text": "很一般啊",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/f/28/a51e7b18751bcdf871648a23fd3b4jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/f/28/a51e7b18751bcdf871648a23fd3b4jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "牛肉馅饼",
"price": 14,
"oldPrice": "",
"description": "",
"sellCount": 114,
"Count": 0,
"rating": 91,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "难吃不推荐",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/d/b9/bcab0e8ad97758e65ae5a62b2664ejpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/d/b9/bcab0e8ad97758e65ae5a62b2664ejpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "招牌猪肉白菜锅贴/10个",
"price": 17,
"oldPrice": "",
"description": "",
"sellCount": 101,
"Count": 0,
"rating": 78,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "不脆,不好吃",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/7/72/9a580c1462ca1e4d3c07e112bc035jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/7/72/9a580c1462ca1e4d3c07e112bc035jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "南瓜粥",
"price": 9,
"oldPrice": "",
"description": "甜粥",
"sellCount": 91,
"Count": 0,
"rating": 100,
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/8/a6/453f65f16b1391942af11511b7a90jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/8/a6/453f65f16b1391942af11511b7a90jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "红豆薏米美肤粥",
"price": 12,
"oldPrice": "",
"description": "甜粥",
"sellCount": 86,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/d/22/260bd78ee6ac6051136c5447fe307jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/d/22/260bd78ee6ac6051136c5447fe307jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "八宝酱菜",
"price": 4,
"oldPrice": "",
"description": "",
"sellCount": 84,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "红枣山药糙米粥",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 81,
"Count": 0,
"rating": 91,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "糊塌子",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 80,
"Count": 0,
"rating": 93,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/0/05/097a2a59fd2a2292d08067e16380cjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/0/05/097a2a59fd2a2292d08067e16380cjpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "单人精彩套餐",
"type": 2,
"foods": [
{
"name": "红枣山药粥套餐",
"price": 29,
"oldPrice": 36,
"description": "红枣山药糙米粥,素材包,爽口莴笋丝,四川泡菜或八宝酱菜,配菜可备注",
"sellCount": 17,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/6/72/cb844f0bb60c502c6d5c05e0bddf5jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/6/72/cb844f0bb60c502c6d5c05e0bddf5jpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "冰爽饮品限时特惠",
"type": 1,
"foods": [
{
"name": "VC无限橙果汁",
"price": 8,
"oldPrice": 10,
"description": "",
"sellCount": 15,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "还可以",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/e/c6/f348e811772016ae24e968238bcbfjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/e/c6/f348e811772016ae24e968238bcbfjpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "精选热菜",
"type": -1,
"foods": [
{
"name": "娃娃菜炖豆腐",
"price": 17,
"oldPrice": "",
"description": "",
"sellCount": 43,
"Count": 0,
"rating": 92,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "菜量还可以,味道还可以",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/d/2d/b1eb45b305635d9dd04ddf157165fjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/d/2d/b1eb45b305635d9dd04ddf157165fjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "手撕包菜",
"price": 16,
"oldPrice": "",
"description": "",
"sellCount": 29,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/9/c6/f3bc84468820121112e79583c24efjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/9/c6/f3bc84468820121112e79583c24efjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "香酥黄金鱼/3条",
"price": 11,
"oldPrice": "",
"description": "",
"sellCount": 15,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/4/e7/8277a6a2ea0a2e97710290499fc41jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/4/e7/8277a6a2ea0a2e97710290499fc41jpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "爽口凉菜",
"type": -1,
"foods": [
{
"name": "八宝酱菜",
"price": 4,
"oldPrice": "",
"description": "",
"sellCount": 84,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "拍黄瓜",
"price": 9,
"oldPrice": "",
"description": "",
"sellCount": 28,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/6/54/f654985b4e185f06eb07f8fa2b2e8jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/6/54/f654985b4e185f06eb07f8fa2b2e8jpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "精选套餐",
"type": -1,
"foods": [
{
"name": "红豆薏米粥套餐",
"price": 37,
"oldPrice": "",
"description": "红豆薏米粥,三鲜干蒸烧卖,拍黄瓜",
"sellCount": 3,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/f/49/27f26ed00c025b2200a9ccbb7e67ejpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/f/49/27f26ed00c025b2200a9ccbb7e67ejpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "皮蛋瘦肉粥套餐",
"price": 31,
"oldPrice": "",
"description": "",
"sellCount": 12,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/8/96/f444a8087f0e940ef264617f9d98ajpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/8/96/f444a8087f0e940ef264617f9d98ajpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "果拼果汁",
"type": -1,
"foods": [
{
"name": "蜜瓜圣女萝莉杯",
"price": 6,
"oldPrice": "",
"description": "",
"sellCount": 1,
"Count": 0,
"rating": "",
"info": "",
"ratings": [],
"icon": "http://fuss10.elemecdn.com/b/5f/b3b04c259d5ec9fa52e1856ee50dajpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/b/5f/b3b04c259d5ec9fa52e1856ee50dajpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "加多宝",
"price": 6,
"oldPrice": "",
"description": "",
"sellCount": 7,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/b/9f/5e6c99c593cf65229225c5661bcdejpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/b/9f/5e6c99c593cf65229225c5661bcdejpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "VC无限橙果汁",
"price": 8,
"oldPrice": 10,
"description": "",
"sellCount": 15,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "还可以",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/e/c6/f348e811772016ae24e968238bcbfjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/e/c6/f348e811772016ae24e968238bcbfjpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "小吃主食",
"type": -1,
"foods": [
{
"name": "扁豆焖面",
"price": 14,
"oldPrice": "",
"description": "",
"sellCount": 188,
"Count": 0,
"rating": 96,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 1,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/c/6b/29e3d29b0db63d36f7c500bca31d8jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/c/6b/29e3d29b0db63d36f7c500bca31d8jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "葱花饼",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 124,
"Count": 0,
"rating": 85,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "没啥味道",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 1,
"text": "很一般啊",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/f/28/a51e7b18751bcdf871648a23fd3b4jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/f/28/a51e7b18751bcdf871648a23fd3b4jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "牛肉馅饼",
"price": 14,
"oldPrice": "",
"description": "",
"sellCount": 114,
"Count": 0,
"rating": 91,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "难吃不推荐",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/d/b9/bcab0e8ad97758e65ae5a62b2664ejpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/d/b9/bcab0e8ad97758e65ae5a62b2664ejpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "招牌猪肉白菜锅贴/10个",
"price": 17,
"oldPrice": "",
"description": "",
"sellCount": 101,
"Count": 0,
"rating": 78,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 1,
"text": "不脆,不好吃",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/7/72/9a580c1462ca1e4d3c07e112bc035jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/7/72/9a580c1462ca1e4d3c07e112bc035jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "糊塌子",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 80,
"Count": 0,
"rating": 93,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/0/05/097a2a59fd2a2292d08067e16380cjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/0/05/097a2a59fd2a2292d08067e16380cjpeg.jpeg?imageView2/1/w/750/h/750"
}
]
},
{
"name": "特色粥品",
"type": -1,
"foods": [
{
"name": "皮蛋瘦肉粥",
"price": 10,
"oldPrice": "",
"description": "咸粥",
"sellCount": 229,
"Count": 0,
"rating": 100,
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "很喜欢的粥",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 1,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "南瓜粥",
"price": 9,
"oldPrice": "",
"description": "甜粥",
"sellCount": 91,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/8/a6/453f65f16b1391942af11511b7a90jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/8/a6/453f65f16b1391942af11511b7a90jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "红豆薏米美肤粥",
"price": 12,
"oldPrice": "",
"description": "甜粥",
"sellCount": 86,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/d/22/260bd78ee6ac6051136c5447fe307jpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/d/22/260bd78ee6ac6051136c5447fe307jpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "红枣山药糙米粥",
"price": 10,
"oldPrice": "",
"description": "",
"sellCount": 81,
"Count": 0,
"rating": 91,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/9/b5/469d8854f9a3a03797933fd01398bjpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "鲜蔬菌菇粥",
"price": 11,
"oldPrice": "",
"description": "咸粥",
"sellCount": 56,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": ""
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/e/a3/5317c68dd618929b6ac05804e429ajpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/e/a3/5317c68dd618929b6ac05804e429ajpeg.jpeg?imageView2/1/w/750/h/750"
},
{
"name": "田园蔬菜粥",
"price": 10,
"oldPrice": "",
"description": "咸粥",
"sellCount": 33,
"Count": 0,
"rating": 100,
"info": "",
"ratings": [
{
"username": "3******c",
"rateTime": 1469281964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "2******3",
"rateTime": 1469271264000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
},
{
"username": "3******b",
"rateTime": 1469261964000,
"rateType": 0,
"text": "",
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/default_header.png"
}
],
"icon": "http://fuss10.elemecdn.com/a/94/7371083792c19df00e546b29e344cjpeg.jpeg?imageView2/1/w/114/h/114",
"image": "http://fuss10.elemecdn.com/a/94/7371083792c19df00e546b29e344cjpeg.jpeg?imageView2/1/w/750/h/750"
}
]
}
];
return data || [];
}
module.exports = {
getSData: getSData
}
逻辑层： goods.js // pages/goods/goods.js
var data_ = require('../../utils/data.js')
Page({
/**
* 页面的初始数据
*/
data: {
goods: [],
toView: '0',
scrollTop: 100,
foodCounts: 0,
totalPrice: 0,// 总价格
totalCount: 0, // 总商品数
carArray: [],
minPrice: 20,//起送價格
payDesc: '',
deliveryPrice: 4,//配送費
fold: true,
selectFoods: [{ price: 20, count: 2 }],
cartShow: 'none',
status: 0,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
// 页面初始化 options为页面跳转所带来的参数
this.setData({
goods: data_.getSData(),
payDesc: this.payDesc()
});
},
/**
* 点击左侧菜单
*/
selectMenu: function (e) {
var index = e.currentTarget.dataset.itemIndex;
this.setData({
toView: 'order' + index.toString()
})
console.log(this.data.toView);
},
/**
* 移除商品
*/
decreaseCart: function (e) {
var index = e.currentTarget.dataset.itemIndex;
var parentIndex = e.currentTarget.dataset.parentindex;
this.data.goods[parentIndex].foods[index].Count--
var num = this.data.goods[parentIndex].foods[index].Count;
var mark = 'a' + index + 'b' + parentIndex
var price = this.data.goods[parentIndex].foods[index].price;
var obj = { price: price, num: num, mark: mark, name: name, index: index, parentIndex: parentIndex };
var carArray1 = this.data.carArray.filter(item => item.mark != mark);
carArray1.push(obj);
console.log(carArray1);
this.setData({
carArray: carArray1,
goods: this.data.goods
})
this.calTotalPrice()
this.setData({
payDesc: this.payDesc(),
})
//关闭弹起
var count1 = 0
for (let i = 0; i < carArray1.length; i++) {
if (carArray1[i].num == 0) {
count1++;
}
}
//console.log(count1)
if (count1 == carArray1.length) {
if (num == 0) {
this.setData({
cartShow: 'none'
})
}
}
},
/**
* 移除商品
*/
decreaseShopCart: function (e) {
console.log('1');
this.decreaseCart(e);
},
/**
* 添加到购物车
*/
addCart(e) {
var index = e.currentTarget.dataset.itemIndex;
var parentIndex = e.currentTarget.dataset.parentindex;
this.data.goods[parentIndex].foods[index].Count++;
var mark = 'a' + index + 'b' + parentIndex
var price = this.data.goods[parentIndex].foods[index].price;
var num = this.data.goods[parentIndex].foods[index].Count;
var name = this.data.goods[parentIndex].foods[index].name;
var obj = { price: price, num: num, mark: mark, name: name, index: index, parentIndex: parentIndex };
var carArray1 = this.data.carArray.filter(item => item.mark != mark)
carArray1.push(obj)
console.log(carArray1);
this.setData({
carArray: carArray1,
goods: this.data.goods
})
this.calTotalPrice();
this.setData({
payDesc: this.payDesc()
})
},
addShopCart: function (e) {
this.addCart(e);
},
/**
* 计算总价
*/
calTotalPrice: function () {
var carArray = this.data.carArray;
var totalPrice = 0;
var totalCount = 0;
for (var i = 0; i < carArray.length; i++) {
totalPrice += carArray[i].price * carArray[i].num;
totalCount += carArray[i].num
}
this.setData({
totalPrice: totalPrice,
totalCount: totalCount,
//payDesc: this.payDesc()
});
},
/**
* 差几元起送
*/
payDesc() {
if (this.data.totalPrice === 0) {
return `￥${this.data.minPrice}元起送`;
} else if (this.data.totalPrice < this.data.minPrice) {
let diff = this.data.minPrice - this.data.totalPrice;
return '还差' + diff + '元起送';
} else {
return '去结算';
}
},
/**
* 结算
*/
pay() {
if (this.data.totalPrice < this.data.minPrice) {
return;
}
// window.alert('支付' + this.totalPrice + '元');
//确认支付逻辑
var resultType = "success";
wx.redirectTo({
url: '../pay/pay?resultType=' + resultType
})
},
/**
* 弹起购物车
*/
toggleList: function () {
if (!this.data.totalCount) {
return;
}
this.setData({
fold: !this.data.fold,
})
var fold = this.data.fold
//console.log(this.data.fold);
this.cartShow(fold)
},
/**
* 显示购物车
*/
cartShow: function (fold) {
console.log(fold);
if (fold == false) {
this.setData({
cartShow: 'block',
})
} else {
this.setData({
cartShow: 'none',
})
}
console.log(this.data.cartShow);
},
/**
* 切换选项卡
*/
tabChange: function (e) {
var showtype = e.target.dataset.type;
this.setData({
status: showtype,
});
}
})
页面布局： goods.wxml <!--pages/goods/goods.wxml-->
<!--head -->
<view class="header">
<view class="content-wrapper">
<view class="avatar">
<image src="http://static.galileo.xiaojukeji.com/static/tms/seller_avatar_256px.jpg" style="width:64px;height:64px;"></image>
</view>
<view class="content">
<view class="title">
<image src="../../assets/images/[email protected]" style="width:30px;height:18px;"></image>
<span class="name">粥品香坊（回龙观）</span>
</view>
<view class="description">
蜂鸟专送/38分钟送达
</view>
<view v-if="seller.supports" class="support">
<span class="icon" :class="classMap[seller.supports[0].type]">
<image src="../../assets/images/[email protected]" style="width:12px;height:12px;"></image>
</span>
<span class="text">在线支付满28减5</span>
</view>
</view>
<view class="supports-count">
<view class="count">5个</view>
</view>
</view>
<view class="bulletin-wrapper">
<image src="../../assets/images/[email protected]" style="width:22px;height:12px;"></image>
<span class="bulletin-text">"粥品香坊其烹饪粥料的秘方源于中国千年古法，在融和现代制作工艺，由世界烹饪大师屈浩先生领衔研发。坚守纯天然、0添加的良心品质深得消费者青睐，发展至今成为粥类的引领品牌。是2008年奥运会和2013年园博会指定餐饮服务商。"</span>
</view>
<view class="background">
<image src="http://static.galileo.xiaojukeji.com/static/tms/seller_avatar_256px.jpg" style="width:100%;height:100%;"></image>
</view>
</view>
<!--head -->
<!--tab -->
<view class="tab border-1px">
<view class="tab-item">
<a class="{{status==0 ? 'active':''}}" bindtap="tabChange" data-type="0">商品</a>
</view>
<view class="tab-item">
<a class="{{status==1 ? 'active':''}}" bindtap="tabChange" data-type="1">评论</a>
</view>
<view class="tab-item">
<a class="{{status==2 ? 'active':''}}" bindtap="tabChange" data-type="2">商家</a>
</view>
</view>
<!--tab -->
<view class="goods" wx:if="{{status==0||item.status==status}}">
<view class="menu-wrapper">
<scroll-view scroll-y="true" style="height: 100%;">
<view wx:for="{{goods}}" class="menu-item border-1px" bindtap="selectMenu" data-item-index="{{index}}" wx:key="id">
<view class="text">
{{item.name}}
</view>
</view>
</scroll-view>
</view>
<scroll-view scroll-y="true" style="height: 100%;" scroll-into-view="{{toView}}" class="foods-wrapper">
<view wx:for="{{goods}}" class="food-list food-list-hook" wx:for-index="parentIndex" wx:key="id">
<view >{{item.name}}</view>
<view wx:for="{{item.foods}}" class="food-item" wx:for-item="food" data-food="{{food}}" wx:key="id">
<view class="icon">
<image src="{{food.icon}}" style="width: 57px;height: 57px"></image>
</view>
<view class="content">
<view class="name">{{food.name}}</view>
<view class="desc">{{food.description}}</view>
<view class="extra">
<text class="count">月售{{food.sellCount}}</text>
<text class="count">好评{{food.rating}}</text>
</view>
<view class="price">
<view class="now">￥{{food.price}}</view>
<view class="old" wx:if="{{food.oldPrice}}">￥{{food.oldPrice}}</view>
</view>
<!--cartControl-->
<view class="cartControl-wrapper">
<view class="cartControl">
<view name="fade">
<view class="cart-decrease" wx:if="{{food.Count > 0}}" data-item-index="{{index}}" data-parentIndex="{{parentIndex}}" catchtap="decreaseCart">
<view class="inner iconfont icon-jian" style="font-size:24px;color:#00A0DC;"></view>
</view>
<view class="cart-count" wx:if="{{food.Count > 0 }}">{{food.Count}}</view>
<view class=" iconfont icon-jia cart-add " style="color:#00A0DC; " data-item-index="{{index}}" data-parentIndex="{{parentIndex}}" catchtap="addCart"></view>
</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
<!-- shopCart 购物车 -->
<view>
<view>
<view class="shopCart">
<view class="content" bindtap="toggleList">
<view class="content-left">
<view class="logo-wrapper">
<view class="logo highlight">
<view class="iconfont icon-gouwuche highlight"></view>
</view>
<view class="num" wx:if="{{totalCount> 0}}">{{totalCount}}</view>
</view>
<view class="price highlight">￥{{totalPrice}}</view>
<view class="desc">另需配送费￥{{deliveryPrice}}元</view>
</view>
<view class="content-right" catchtap="pay">
<view class="pay enough" :class="payClass">
{{payDesc}}
</view>
</view>
</view>
<view class="shopcart-list" style="display:{{cartShow}}">
<view class="list-header">
<view class="title">购物车</view>
<text class="empty" bindtap="empty">清空</text>
</view>
<view class="list-content">
<view class="shopcart-food" wx:for="{{carArray}}" wx:key="id">
<text class="name">{{item.name}}</text>
<view class="price" wx:if="{{item.num > 0}}">
<span>￥{{item.price*item.num}}</span>
</view>
<!--cartControl-->
<view class="cartControl-wrapper" style="bottom:10px;" wx:if="{{item.num > 0}}">
<view class="cartControl" style="width:80px;">
<view name="fade">
<view class="cart-decrease" style="display:inline-block;" data-item-index="{{item.index}}" data-parentIndex="{{item.parentIndex}}" catchtap="decreaseShopCart">
<view class="inner iconfont icon-jian" style="font-size:24px;color:#00A0DC;"></view>
</view>
<view class="cart-count" style="display:inline-block;width:32px;text-align:center;font-size:14px;">{{item.num}}</view>
<view class=" iconfont icon-jia cart-add " style="font-size:24px;color:#00A0DC; padding:0;" data-item-index="{{item.index}}" data-parentIndex="{{item.parentIndex}}" catchtap="addShopCart"></view>
</view>
</view>
</view>
<!--cartControl-->
</view>
</view>
</view>
</view>
</view>
</view>
<view name="fade">
<view class="list-mask" wx:if="{{listShow}}" bindtap="hideList"></view>
</view>
</view>
样式： goods.wxss /* pages/goods/goods.wxss */
.goods {
display: flex;
position: absolute;
width: 100%;
top: 174px;
bottom: 46px;
overflow: hidden;
font-family:"微软雅黑";
}
.goods .menu-wrapper {
flex: 0 0 80px;
width: 80px;
background: #f3f5f7;
}
.goods .menu-wrapper .menu-item {
display: table;
width: 56px;
height: 54px;
line-height: 14px;
padding: 0 12px;
}
.goods .menu-wrapper .menu-item:current {
position: relative;
z-index: 10;
margin-top: -1px;
background: #fff;
font-weight: 700;
}
.goods .menu-wrapper .menu-item:current .text {
border: none;
}
.goods .menu-wrapper .menu-item .icon {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: top;
margin-right: 4px;
background-size: 12px 12px;
background-repeat: no-repeat;
}
.goods .menu-wrapper .menu-item .text {
display: table-cell;
width: 56px;
vertical-align: middle;
position: relative;
font-size: 12px;
border-bottom:1px solid rgba(7,17,27,0.1);
}
.goods .foods-wrapper {
flex: 1;
}
.goods .foods-wrapper .food-list .title {
padding-left: 14px;
height: 26px;
line-height: 26px;
border-left: 2px solid #d9dde1;
font-size: 12px;
color: rgb(147, 153, 159);
background: #f3f5f7;
}
.goods .foods-wrapper .food-list .food-item {
display: flex;
margin: 18px;
padding-bottom: 18px;
position: relative;
border-bottom:1px solid rgba(7,17,27,0.1);
}
.goods .foods-wrapper .food-list .food-item:last-child {
border: none;
margin-bottom: 0px;
}
.goods .foods-wrapper .food-list .food-item .icon {
flex: 0 0 57px;
margin-right: 10px;
}
.goods .foods-wrapper .food-list .food-item .content {
flex: 1;
}
.goods .foods-wrapper .food-list .food-item .content .name {
margin: 2px 0 8px 0;
font-size: 14px;
line-height: 14px;
height: 14px;
color: rgb(7, 17, 27);
}
.goods .foods-wrapper .food-list .food-item .content .desc, .extra {
font-size: 10px;
line-height: 10px;
color: rgb(147, 153, 159);
}
.goods .foods-wrapper .food-list .food-item .content .desc {
margin-bottom: 8px;
line-height: 12px;
}
.goods .foods-wrapper .food-list .food-item .content .extra .count {
margin-right: 12px;
}
.goods .foods-wrapper .food-list .food-item .content .price {
font-weight: 700px;
line-height: 24px;
}
.goods .foods-wrapper .food-list .food-item .content .price .now {
margin-right: 8px;
font-size: 14px;
color: rgb(240, 20, 20);
}
.goods .foods-wrapper .food-list .food-item .content .price .old {
font-size: 10px;
color: rgb(147, 153, 159);
text-decoration: line-through;
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper {
position: absolute;
right: 0;
bottom: 12px;
}
/* cartControl 样式 */
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl {
font-size: 0;
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add {
display: inline-block;
padding: 4px 6px 6px 6px;
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add :fade-enter-active, :fade-leave-active {
transition: all 0.4s linear;
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add :fade-enter, :fade-leave-active {
opacity: 0 transform translate3d(24px, 0, 0);
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add .inner {
display: inline-block;
line-height: 24px;
font-size: 24px;
vertical-align: top;
color: rgb(0, 160, 220, 0.2);
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add :inner-enter-active, :inner-leave-active {
transition: all 0.4s linear;
transform: rotate(0);
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-decrease,
.cart-add :inner-enter, :inner-leave-active {
opacity: 0 transform rotate(180deg);
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-count {
display: inline-block;
font-size: 10px;
line-height: 24px;
width: 12px;
vertical-align: top;
padding-top: 6px;
text-align: center;
color: rgb(147, 153, 159);
}
.goods .foods-wrapper .food-list .food-item .content .cartControl-wrapper .cartControl .cart-add {
display: inline-block;
padding: 6px;
line-height: 24px;
font-size: 24px;
vertical-align: top;
color: rgb(0, 160, 220, 0.2);
}
/* shopcart 样式 */
.shopCart {
position: fixed;
left: 0px;
bottom: 0px;
z-index: 50;
width: 100%;
height: 48px;
}
.shopCart .content {
display: flex;
background: #141d27;
}
.shopCart .content .content-left {
flex: 1;
}
.shopCart .content .content-left .logo-wrapper {
display: inline-block;
position: relative;
top: -10px;
margin: 0 12px;
padding: 6px;
width: 56px;
height: 56px;
box-sizing: border-box;
vertical-align: top;
border-radius: 50%;
background: #141d27;
}
.shopCart .content .content-left .logo-wrapper .num {
position: absolute;
top: 0;
right: 0;
width: 24px;
height: 24px;
line-height: 24px;
text-align: center;
border-radius: 16px;
font-size: 9px;
font-weight: 700;
color: #fff;
background: rgb(240, 20, 20);
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4);
}
.shopCart .content .content-left .logo-wrapper .logo {
width: 100%;
height: 100%;
text-align: center;
border-radius: 50%;
background: #2b343c;
}
.shopCart .content .content-left .logo-wrapper .logo.highlight {
background: rgb(0, 160, 220);
}
.shopCart .content .content-left .logo-wrapper .logo .icon-gouwuche {
line-height: 44px;
font-size: 24px;
color: #80858a;
}
.shopCart .content .content-left .logo-wrapper .logo .icon-gouwuche.highlight {
color: #fff;
}
.shopCart .content .content-left .price {
display: inline-block;
vertical-align: top;
margin-top: 12px;
line-height: 24px;
padding-right: 12px;
box-sizing: border-box;
border-right: 1px solid rgba(255, 255, 255, 0.1);
font-size: 16px;
font-weight: 700;
color: rgba(255, 255, 255, 0.4);
}
.shopCart .content .content-left .price.highlight {
color: #fff;
}
.shopCart .content .content-left .desc {
display: inline-block;
vertical-align: top;
line-height: 24px;
margin-left: 12px;
margin-top: 12px;
color: rgba(255, 255, 255, 0.4);
font-size: 10px;
}
.shopCart .content .content-right {
flex: 0 0 105px;
width: 105px;
}
.shopCart .content .content-right .pay {
height: 48px;
line-height: 48px;
text-align: center;
font-size: 12px;
color: rgba(255, 255, 255, 0.4);
font-weight: 700;
background: #2b333b;
}
.shopCart .content .content-right .pay.not-enough {
background: #2b333b;
}
.shopCart .content .content-right .pay.enough {
background: #00b43c;
color: #fff;
}
.shopCart .ball-container .ball {
position: fixed;
left: 32px;
bottom: 22px;
z-index: 200;
transition: all 0.6s cubic-bezier(0.49, -0.29, 0.75, 0.41);
}
.shopCart .ball-container .ball .inner {
width: 16px;
height: 16px;
border-radius: 50%;
background: rgb(0, 160, 220);
transition: all 0.4s linear;
}
.shopCart .shopcart-list {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
transform:translate3d(0, -100%, 0);
}
.shopCart .shopcart-list :fade-enter-active, :fade-leave-active {
transition: all 0.5s transform translate3d(0, -100%, 0);
}
.shopCart .shopcart-list :fade-enter, :fade-leave-active {
transform: translate3d(0, 0, 0);
}
.shopCart .shopcart-list .list-header {
height: 40px;
line-height: 40px;
padding: 0 18px;
background: #f3f5f7;
border-bottom: 1px solid rgba(7, 17, 27, 0.1);
}
.shopCart .shopcart-list .list-header .title {
float: left;
font-size: 14px;
color: rgb(7, 17, 27);
}
.shopCart .shopcart-list .list-header .empty {
float: right;
font-size: 12px;
color: rgb(0, 160, 220);
}
.shopCart .shopcart-list .list-content {
padding: 0 18px;
max-height: 217px;
overflow: hidden;
background: #fff;
}
.shopCart .shopcart-list .list-content .shopcart-food {
position: relative;
padding: 12px 0;
box-sizing: border-box;
/*border-top: 1px solid rgba(7,17,27,0.1);*/
}
.shopCart .shopcart-list .list-content .shopcart-food .name {
line-height: 24px;
font-size: 14px;
color: rgb(7, 17, 27);
}
.shopCart .shopcart-list .list-content .shopcart-food .price {
position: absolute;
right: 90px;
bottom: 12px;
line-height: 24px;
font-size: 14px;
font-weight: 700;
color: rgb(240, 20, 20);
}
.shopCart .shopcart-list .list-content .shopcart-food .cartControl-wrapper {
position: absolute;
right: 0;
bottom: 6px;
}
/* head */
.header {
position: relative;
color: #fff;
overflow: hidden;
background: rgba(7, 17, 27, 0.5);
}
.header .content-wrapper {
position: relative;
padding: 24px 12px 18px 24px;
font-size: 0;
}
.header .content-wrapper .avatar {
display: inline-block;
vertical-align: top;
}
.header .content-wrapper .avatar img {
border-radius: 2px;
}
.header .content-wrapper .content {
display: inline-block;
font-size: 14px;
margin-left: 16px;
}
.header .content-wrapper .content .title {
margin: 2px 0 8px 0;
}
.header .content-wrapper .content .title .brand {
display: inline-block;
vertical-align: top;
width: 30px;
height: 18px;
/*bg-image('brand')*/
background-size: 30px 18px;
background-repeat: no-repeat;
}
.header .content-wrapper .content .title .name {
margin-left: 6px;
font-size: 16px;
line-height: 18px;
font-weight: bold;
}
.header .content-wrapper .content .description {
margin-bottom: 10px;
line-height: 12px;
font-size: 12px;
}
.header .content-wrapper .content .support .icon {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: top;
margin-right: 4px;
background-size: 12px 12px;
background-repeat: no-repeat;
/*&.decrease
bg-image('decrease_1')
&.discount
bg-image('discount_1')
&.guarantee
bg-image('guarantee_1')
&.invoice
bg-image('invoice_1')
&.special
bg-image('special_1')*/
}
.header .content-wrapper .content .support .text {
line-height: 12px;
font-size: 12px;
}
.header .content-wrapper .content .supports-count {
position: absolute;
right: 12px;
bottom: 14px;
padding: 0 8px;
height: 24px;
line-height: 24px;
border-radius: 12px;
background: rgba(0, 0, 0, 0.2);
text-align: content;
}
.header .content-wrapper .content .supports-count .count {
font-size: 10px;
vertical-align: top;
}
.header .content-wrapper .content .supports-count .icon {
margin-left: 2px;
line-height: 24px;
font-size: 10px;
}
.header .bulletin-wrapper {
position: relative;
background-color: rgba(7, 17, 27, 0.2);
height: 28px;
line-height: 28px;
padding: 0 22px 0 12px;
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
}
.header .bulletin-wrapper .bulletin-title {
display: inline-block;
vertical-align: top;
margin-top: 8px;
width: 22px;
height: 12px;
/*bg-image('bulletin')*/
background-size: 22px 12px;
background-repeat: no-repeat;
}
.header .bulletin-wrapper .bulletin-text {
vertical-align: top;
margin: 0 4px;
font-size: 10px;
}
.header .bulletin-wrapper .icon {
position: absolute;
font-size: 20px;
right: 12px;
top: 0px;
}
.header .background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
filter: blur(10px);
}
.header .background .detail {
position: fixed;
z-index: 100;
top: 0;
right: 0;
width: 100%;
height: 100%;
overflow: auto;
background: rgba(7, 17, 27, 0.8);
-webkit-backdrop-filter: blur(10px);
}
/* tab */
.tab {
display: -ms-flexbox;
display: flex;
width: 100%;
height: 40px;
line-height: 40px;
/* border: 1px solid rgba(7,17,27,0.1); */
position: relative;
}
.tab .tab-item {
-ms-flex: 1;
flex: 1;
text-align: center;
}
.tab .tab-item a {
display: block;
font-size: 14px;
color: #4d555d;
}
.tab .tab-item .active {
color: #f01414;
}
.list-mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 40;
/*backdrop-filter: blur(10px);*/
-webkit-backdrop-filter: 1;
|
今天小编告诉大家如何对win10系统删除桌面回收站图标进行设置，可能很多用户都不知道
请发表评论