TmOct5/gl_dao
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

收银台页面搭建及封装 dialog 公用函数且套入页面使用

Browse Source
This commit is contained in:
张冬雪
2022-06-06 16:02:56 +08:00
parent ed024f5962
commit a3e2a61f63
43 changed files with 909 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
lib/pages/address/adds_add/adds_add_page.dart
View File

@@ -1,12 +1,11 @@
/*
* @Author: Aimee~
* @Date: 2022-06-01 11:11:40
* @LastEditTime: 2022-06-02 17:51:22
* @LastEditTime: 2022-06-06 14:13:28
* @LastEditors: Aimee
* @FilePath: /gl_dao/lib/pages/address/adds_add/adds_add_page.dart
* @Description: 新增地址
*/
// import 'package:address_picker/address_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter_pickers/address_picker/locations_data.dart';
import 'package:flutter_pickers/pickers.dart';
@@ -35,6 +34,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
padding: const EdgeInsets.fromLTRB(16, 30, 16, 30),
child: ListView(
children: [
// 收件人姓名
const TextField(
decoration: InputDecoration(
hintText: "收货人姓名",
@@ -53,6 +53,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
),
),
const Divider(),
// 收件人电话
const TextField(
decoration: InputDecoration(
hintText: "收货人联系电话",
@@ -71,6 +72,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
),
),
const Divider(),
// 省市区
GestureDetector(
onTap: _chooseArea,
child: TextField(
@@ -95,6 +97,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
),
),
const Divider(),
// 详细地址、
const TextField(
maxLength: 120,
maxLines: 3,
@@ -135,6 +138,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
});
/// 根据城市名 查询城市code(有先后顺序)
// ignore: avoid_print
print(
Address.getCityCodeByName(
provinceName: p,
@@ -144,6 +148,7 @@ class _AddressAddPageState extends State<AddressAddPage> {
);
/// 根据城市code 查询城市名称
// ignore: avoid_print
print(
Address.getCityNameByCode(
provinceCode: "510000",

74
lib/pages/components/yy_alert_dialog_with_divider.dart Normal file
View File

@@ -0,0 +1,74 @@
/*
* @Author: Aimee~
* @Date: 2022-06-06 13:31:27
* @LastEditTime: 2022-06-06 15:44:53
* @LastEditors: Aimee
* @FilePath: /gl_dao/lib/pages/components/yy_alert_dialog_with_divider.dart
* @Description: 弹窗样式
*/
import 'package:flutter/material.dart';
import 'package:flutter_custom_dialog/flutter_custom_dialog.dart';
import '../../main_color.dart';
YYDialog yYAlertDialogWithDivider(
BuildContext context, {
String text1 = '',
String text2 = '',
required String title,
String type = '', // 默认是问号，成功显示success
VoidCallback? onCancel,
VoidCallback? onSure,
}) {
return YYDialog().build(context)
..width = MediaQuery.of(context).size.width * 0.8
..borderRadius = 4.0
..widget(
Opacity(
opacity: 0.5,
child: Container(
margin: const EdgeInsets.only(top: 21),
width: 50.0,
height: 50.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(150.0),
),
child: Image.asset(
type == ""
? "assets/images/order/icon_order_null.png"
: "assets/images/order/icon_order_success.png",
alignment: Alignment.center,
fit: BoxFit.cover,
repeat: ImageRepeat.noRepeat,
),
),
),
)
..text(
padding: const EdgeInsets.all(25.0),
alignment: Alignment.center,
text: title,
color: tTextColor333,
fontSize: 16.0,
fontWeight: FontWeight.w500,
)
..divider()
..doubleButton(
height: 60.0,
padding: const EdgeInsets.all(16.0),
gravity: Gravity.spaceEvenly,
withDivider: true,
text1: text1,
color1: tTextColor666,
fontSize1: 15.0,
fontWeight1: FontWeight.w400,
onTap1: onCancel,
text2: text2,
color2: tMainRedColor,
fontSize2: 15.0,
fontWeight2: FontWeight.w400,
onTap2: onSure,
)
..show();
}

27
lib/pages/store/buy/buy.dart
View File

@@ -1,7 +1,7 @@
/*
* @Author: Aimee~
* @Date: 2022-05-26 13:16:03
* @LastEditTime: 2022-06-01 13:01:25
* @LastEditTime: 2022-06-06 15:53:45
* @LastEditors: Aimee
* @FilePath: /gl_dao/lib/pages/store/buy/buy.dart
* @Description: 订单确认页面
@@ -11,6 +11,8 @@ import 'package:get/get.dart';
import '../../../main_color.dart';
import '../../address/adds_list/adds_list_page.dart';
import '../../components/yy_alert_dialog_with_divider.dart';
import '../checkout/checkout_page.dart';
class BuyPages extends StatefulWidget {
const BuyPages({Key? key}) : super(key: key);
@@ -107,7 +109,18 @@ class _BuyPagesState extends State<BuyPages> {
),
),
GestureDetector(
onTap: () {},
onTap: () {
Get.to(const CheckoutPage());
// yYAlertDialogWithDivider(
// context,
// title: '订单提交成功',
// type: 'success',
// text1: '继续采购',
// text2: '查看订单',
// onCancel: onCancel,
// onSure: onSure,
// );
},
child: Container(
margin: const EdgeInsets.only(top: 1),
padding: const EdgeInsets.fromLTRB(26, 10, 26, 10),
@@ -135,6 +148,16 @@ class _BuyPagesState extends State<BuyPages> {
);
}
onCancel() {
// ignore: avoid_print
print('onCancel.....');
}
onSure() {
// ignore: avoid_print
print('onSure.....');
}
// 自定义购买信息
Widget purchaseInfo() {
return Container(

292
lib/pages/store/checkout/checkout_page.dart Normal file
View File

@@ -0,0 +1,292 @@
// ignore_for_file: unnecessary_const
/*
* @Author: Aimee~
* @Date: 2022-06-06 09:14:27
* @LastEditTime: 2022-06-06 15:45:05
* @LastEditors: Aimee
* @FilePath: /gl_dao/lib/pages/store/checkout/checkout_page.dart
* @Description: 收银台
*/
// import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import '../../../main_color.dart';
import '../../components/yy_alert_dialog_with_divider.dart';
class CheckoutPage extends StatefulWidget {
const CheckoutPage({Key? key}) : super(key: key);
@override
State<CheckoutPage> createState() => _CheckoutPageState();
}
class _CheckoutPageState extends State<CheckoutPage> {
String defaultValue = "A";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: appBar(),
body: Stack(
children: [
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: MediaQuery.of(context).size.width,
padding: const EdgeInsets.fromLTRB(0, 30, 0, 50),
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
tMainRedColor,
Colors.red,
],
),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
const Text(
'1999',
style: TextStyle(
fontSize: 34,
color: Colors.white,
fontWeight: FontWeight.bold,
),
),
Container(
padding: const EdgeInsets.only(bottom: 5),
child: const Text(
' DT积分',
style: TextStyle(
fontSize: 14,
color: Colors.white,
),
),
),
],
),
const SizedBox(height: 26),
Container(
padding: const EdgeInsets.only(
left: 12,
right: 12,
top: 4,
bottom: 4,
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(150.0),
color: Colors.white.withOpacity(0.2),
),
child: const Text(
'订单编号:202206061232334322122 ',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 13,
),
),
),
],
),
),
const SizedBox(height: 26),
Column(
children: [
Row(
children: [
const SizedBox(
width: 16,
),
Container(
height: 16,
width: 4,
color: tMainRedColor.withOpacity(0.5),
),
const SizedBox(width: 6),
const Text(
'支付方式',
style: TextStyle(
fontSize: 16,
color: tTextColor333,
fontWeight: FontWeight.w500,
),
),
const SizedBox(
height: 26,
),
],
),
RadioListTile(
value: 'A',
groupValue: defaultValue,
title: const Text(
"DT积分支付",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w400,
),
),
activeColor: tMainRedColor,
subtitle: const Text(
"使用DT积分 方便快捷 升值快",
style: TextStyle(
fontSize: 12,
),
),
secondary: SizedBox(
width: 44,
height: 44,
child: ClipOval(
child: Image.network(
'https://www.itying.com/images/flutter/1.png',
fit: BoxFit.cover,
),
),
),
controlAffinity: ListTileControlAffinity.trailing,
onChanged: (v) {
setState(() {
defaultValue = v.toString();
});
},
),
const Divider(),
RadioListTile(
value: 'B',
groupValue: defaultValue,
title: const Text(
"微信支付",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w400,
),
),
activeColor: tMainRedColor,
subtitle: const Text(
"使用DT积分 方便快捷 升值快",
style: TextStyle(
fontSize: 12,
),
),
secondary: SizedBox(
width: 44,
height: 44,
child: ClipOval(
child: Image.network(
'https://www.itying.com/images/flutter/1.png',
fit: BoxFit.cover,
),
),
),
controlAffinity: ListTileControlAffinity.trailing,
onChanged: (v) {
setState(() {
defaultValue = v.toString();
});
},
),
const Divider(),
],
),
],
),
buttomButton(),
],
),
);
}
// 自定义底部提交按钮
Widget buttomButton() {
return Positioned(
bottom: 0,
left: 0,
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
margin: EdgeInsets.only(left: MediaQuery.of(context).size.width * 0.1),
decoration: const BoxDecoration(
color: Colors.white,
),
child: SafeArea(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
flex: 1,
child: GestureDetector(
onTap: () {
yYAlertDialogWithDivider(
context,
title: '确认放弃支付么?',
text1: '放弃支付',
text2: '继续支付',
onCancel: onCancel,
onSure: onSure,
);
},
child: Container(
margin: const EdgeInsets.only(top: 1),
padding: const EdgeInsets.fromLTRB(26, 10, 26, 10),
height: 60,
alignment: Alignment.center,
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [tMainRedColor, tMainRedColor],
),
),
child: const Text(
'立即支付',
style: TextStyle(
fontSize: 17,
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
),
),
),
],
),
),
),
);
}
onCancel() {
// ignore: avoid_print
print('onCancel.....');
}
onSure() {
// ignore: avoid_print
print('onSure.....');
}
// 自定义顶部导航
PreferredSizeWidget appBar() {
return AppBar(
elevation: 0,
backgroundColor: tMainRedColor,
title: const Text(
'支付收银台',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.w500,
),
),
);
}
}