购物车页面的代码如下:
import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';
import '../models/cart.dart';
import '../services/api_service.dart';
class CartPage extends StatefulWidget {
@override
_CartPageState createState() => _CartPageState();
}
class _CartPageState extends State {
List _carts = [];
@override
void initState() {
super.initState();
_loadCarts();
}
Future _loadCarts() async {
List carts = await ApiService.getCartList();
setState(() {
_carts = carts;
});
}
Future _updateCart(int productId, int quantity) async {
dynamic data = await ApiService.updateCart(productId, quantity);
setState(() {
if (data is List) {
_carts = _carts.map((cart) {
if (cart.productId == productId) {
return Cart.fromJson(data[1]);
} else {
return cart;
}
}).toList();
}
});
}
Future _deleteCart(int productId) async {
dynamic data = await ApiService.deleteCart(productId);
setState(() {
if (data is double) {
_carts.removeWhere((cart) => cart.productId == productId);
}
});
}
TextStyle _textStyle = TextStyle(fontSize: 16);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('购物车'),
centerTitle: true,
),
body: _carts.isNotEmpty
? Column(
children: [
Expanded(
child: ListView.builder(
itemCount: _carts.length,
itemBuilder: (BuildContext context, int index) {
final cart = _carts[index];
return Card(
margin: EdgeInsets.all(8),
child: Row(
children: [
Expanded(
child: CachedNetworkImage(
imageUrl: cart.productImageUrl,
fit: BoxFit.cover,
errorWidget: (context, url, error) =>
Icon(Icons.error),
),
),
Expanded(
flex: 2,
child: Padding(
padding: EdgeInsets.all(8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
cart.productName,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 4),
Text(
'价格: ¥${cart.price.toStringAsFixed(2)}',
style: _textStyle,
),
SizedBox(height: 4),
Text(
'数量: ${cart.quantity}',
style: _textStyle,
),
],
),
),
),
Expanded(
child: IconButton(
icon: Icon(Icons.add),
onPressed: () {
_updateCart(cart.productId, 1);
},
),
),
Expanded(
child: IconButton(
icon: Icon(Icons.remove),
onPressed: () {
_updateCart(cart.productId, -1);
},
),
),
Expanded(
child: IconButton(
icon: Icon(Icons.delete),
onPressed: () {
_deleteCart(cart.productId);
},
),
),
],
),
);
},
),
),
SizedBox(
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Text(
'总价:',
style: _textStyle,
),
Text(
'¥${_carts.fold(0, (acc, cart) => acc + cart.price * cart.quantity).toStringAsFixed(2)}',
style: textStyle,
),
RaisedButton(
child: Text('结算'),
onPressed: () {
showDialog(
context: context,
builder: () => AlertDialog(
title: Text('付款'),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('选择地址'),
SizedBox(height: 8),
FutureBuilder(
future: ApiService.getAddressList(),
builder: (BuildContext context,
AsyncSnapshot snapshot) {
if (snapshot.hasData) {
return Container(
height: 200,
child: ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context,
int index) {
final address =
snapshot.data[index];
return ListTile(
title: Text(
'${address.provience}${address.city}${address.district}${address.addressLine}',
),
subtitle: Text(
address.isDefault == 1
? '默认地址'
: '',
),
trailing: Icon(Icons
.keyboard_arrow_right),
);
},
),
);
} else {
return CircularProgressIndicator();
}
},
),
SizedBox(height: 8),
Text('新增地址'),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '收货人姓名',
),
),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '收货人电话',
),
),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '省份',
),
),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '城市',
),
),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '区县',
),
),
SizedBox(height: 8),
TextFormField(
decoration: InputDecoration(
hintText: '详细地址',
),
),
SizedBox(height: 8),
Text('选择支付方式'),
SizedBox(height: 8),
Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
Column(
children: [
Icon(Icons.alipay),
SizedBox(height: 4),
Text('支付宝'),
],
),
Column(
children: [
Icon(Icons.payment),
SizedBox(height: 4),
Text('微信'),
],
),
],
),
SizedBox(height: 8),
RaisedButton(
child: Text('确认付款'),
onPressed: () {},
),
],
),
),
);
},
),
],
),
),
],
)
: Center(
child: Text('购物车为空'),
),
)