feat: UI redo for in or out picker

This commit is contained in:
louis 2024-03-20 11:26:44 +08:00
parent c9d6adc670
commit 7f309e999b
7 changed files with 172 additions and 194 deletions

View File

@ -1,7 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/constants/bg_color.dart';
import 'package:sk_base_mobile/constants/constants.dart'; import 'package:sk_base_mobile/constants/constants.dart';
import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart'; import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart';
import 'package:sk_base_mobile/store/auth.store.dart'; import 'package:sk_base_mobile/store/auth.store.dart';

View File

@ -1,7 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/constants/bg_color.dart';
import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart'; import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart'; import 'package:sk_base_mobile/util/screen_adaper_util.dart';
import 'dates.dart'; import 'dates.dart';

View File

@ -1,11 +1,9 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/db_helper/dbHelper.dart'; import 'package:sk_base_mobile/db_helper/dbHelper.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/new_inventory_inout.dart'; import 'package:sk_base_mobile/screens/new_inventory_inout/new_inventory_inout.dart';
import 'package:sk_base_mobile/util/date.util.dart'; import 'package:sk_base_mobile/util/date.util.dart';
import 'package:sk_base_mobile/util/logger_util.dart';
import 'package:sk_base_mobile/util/modal.util.dart'; import 'package:sk_base_mobile/util/modal.util.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart'; import 'package:sk_base_mobile/util/screen_adaper_util.dart';
@ -29,7 +27,14 @@ class InventoryInoutController extends GetxController {
RxInt barIndex = 0.obs; RxInt barIndex = 0.obs;
RxList model = [].obs; RxList model = [].obs;
final ScrollController scrollController = ScrollController(); final ScrollController scrollController = ScrollController();
// decoration: const BoxDecoration(
// borderRadius:
// BorderRadius.all(Radius.circular(30)),
// gradient: LinearGradient(colors: [
// AppTheme.primaryColorLight,
// AppTheme.primaryColor
// ]),
// ),
Future<void> showInOrOutPickerDialog() async { Future<void> showInOrOutPickerDialog() async {
showDialog( showDialog(
context: Get.overlayContext!, context: Get.overlayContext!,
@ -51,73 +56,118 @@ class InventoryInoutController extends GetxController {
AnimatedPositioned( AnimatedPositioned(
duration: const Duration(milliseconds: 100), duration: const Duration(milliseconds: 100),
left: value * 80, left: value * 80,
child: GestureDetector( child: ClipRRect(
onTap: () { borderRadius: BorderRadius.all(Radius.circular(30)),
Get.back(); child: Material(
showInventoryInoutCreateDialog(); child: Ink(
}, decoration: BoxDecoration(
child: Container( gradient: LinearGradient(
height: ScreenAdaper.height(350), colors: [
width: ScreenAdaper.height(350), AppTheme.primaryColorLight,
decoration: const BoxDecoration( AppTheme.primaryColor
],
),
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(30)), BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
]),
), ),
alignment: Alignment.center, child: ElevatedButton(
child: Column( onPressed: () {
mainAxisAlignment: MainAxisAlignment.center, Get.back();
children: [ showInventoryInoutCreateDialog('in');
Icon( },
Icons.add_circle_outline, style: ButtonStyle(
color: AppTheme.nearlyWhite, backgroundColor: MaterialStateProperty.all(
size: ScreenAdaper.sp(80), Colors.transparent),
shadowColor: MaterialStateProperty.all(
Colors.transparent),
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius:
BorderRadius.all(Radius.circular(30)),
), ),
SizedBox( ),
height: ScreenAdaper.height(10), padding: MaterialStateProperty.all(
), EdgeInsets.zero),
Text( ),
'入库', child: Container(
style: TextStyle( height: ScreenAdaper.height(350),
width: ScreenAdaper.height(350),
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.add_circle_outline,
color: AppTheme.nearlyWhite,
size: ScreenAdaper.sp(80),
),
SizedBox(
height: ScreenAdaper.height(10),
),
Text(
'入库',
style: TextStyle(
decoration: TextDecoration.none, decoration: TextDecoration.none,
color: AppTheme.nearlyWhite, color: AppTheme.nearlyWhite,
fontSize: ScreenAdaper.sp(60), fontSize: ScreenAdaper.sp(60),
letterSpacing: ScreenAdaper.width(5), letterSpacing: ScreenAdaper.width(5),
fontWeight: FontWeight.w700), fontWeight: FontWeight.w700,
) ),
]), )
)), ],
),
),
),
),
),
),
), ),
AnimatedPositioned( AnimatedPositioned(
duration: const Duration(milliseconds: 100), duration: const Duration(milliseconds: 100),
right: 80 * value, right: value * 80,
child: GestureDetector( child: ClipRRect(
onTap: () { borderRadius:
Get.back(); const BorderRadius.all(Radius.circular(30)),
showInventoryInoutCreateDialog(); child: Material(
}, child: Ink(
child: Container( decoration: const BoxDecoration(
height: ScreenAdaper.height(350), gradient: LinearGradient(
width: ScreenAdaper.height(350), colors: [
decoration: const BoxDecoration(
// shape: BoxShape.circle,
borderRadius:
BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight, AppTheme.primaryColorLight,
AppTheme.primaryColor AppTheme.primaryColor
]), ],
), ),
alignment: Alignment.center, borderRadius:
child: Column( BorderRadius.all(Radius.circular(30)),
),
child: ElevatedButton(
onPressed: () {
Get.back();
showInventoryInoutCreateDialog('out');
},
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(
Colors.transparent),
shadowColor: MaterialStateProperty.all(
Colors.transparent),
shape: MaterialStateProperty.all(
const RoundedRectangleBorder(
borderRadius:
BorderRadius.all(Radius.circular(30)),
),
),
padding: MaterialStateProperty.all(
EdgeInsets.zero),
),
child: Container(
height: ScreenAdaper.height(350),
width: ScreenAdaper.height(350),
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Icon( Icon(
// Icons.add_circle_outline,
Icons.remove_circle_outline,
color: AppTheme.nearlyWhite, color: AppTheme.nearlyWhite,
size: ScreenAdaper.sp(80), size: ScreenAdaper.sp(80),
), ),
@ -127,15 +177,21 @@ class InventoryInoutController extends GetxController {
Text( Text(
'出库', '出库',
style: TextStyle( style: TextStyle(
decoration: TextDecoration.none, decoration: TextDecoration.none,
color: AppTheme.nearlyWhite, color: AppTheme.nearlyWhite,
fontSize: ScreenAdaper.sp(60), fontSize: ScreenAdaper.sp(60),
letterSpacing: letterSpacing: ScreenAdaper.width(5),
ScreenAdaper.width(5), fontWeight: FontWeight.w700,
fontWeight: FontWeight.w700), ),
) )
])), ],
)), ),
),
),
),
),
),
),
], ],
); );
}, },
@ -144,9 +200,8 @@ class InventoryInoutController extends GetxController {
} }
/// ///
Future<void> showInventoryInoutCreateDialog() async { Future<void> showInventoryInoutCreateDialog(String inOrOut) async {
final isTablet = Responsive.isTablet(Get.context!); final isTablet = Responsive.isTablet(Get.context!);
print(isTablet);
isTablet isTablet
? showGeneralDialog( ? showGeneralDialog(
context: Get.overlayContext!, context: Get.overlayContext!,
@ -180,7 +235,7 @@ class InventoryInoutController extends GetxController {
backgroundColor: Colors.white, backgroundColor: Colors.white,
context: Get.overlayContext!, context: Get.overlayContext!,
builder: (context) { builder: (context) {
return NewInventoryInout(); return NewInventoryInout(inOrOut: inOrOut);
}, },
); );
} }

View File

@ -1,9 +1,6 @@
import 'package:flutter/widgets.dart'; import 'package:flutter/widgets.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/config.dart';
import '../../constants/enum.dart';
import '../../store/auth.store.dart'; import '../../store/auth.store.dart';
import '../../util/util.dart';
class LoginController extends GetxController { class LoginController extends GetxController {
final isAgreeTerm = RxBool(false); final isAgreeTerm = RxBool(false);

View File

@ -1,4 +1,3 @@
import 'package:date_format/date_format.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
@ -8,7 +7,7 @@ import 'package:sk_base_mobile/util/screen_adaper_util.dart';
class LoginScreen extends StatelessWidget { class LoginScreen extends StatelessWidget {
LoginScreen({super.key}); LoginScreen({super.key});
final _controller = Get.put<LoginController>(LoginController()); final _controller = Get.put<LoginController>(LoginController());
double formWidth = 700; final double formWidth = 700;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Scaffold(

View File

@ -1,21 +1,16 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_typeahead/flutter_typeahead.dart'; import 'package:flutter_typeahead/flutter_typeahead.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/constants/constants.dart'; import 'package:sk_base_mobile/constants/constants.dart';
import 'package:sk_base_mobile/models/product.model.dart'; import 'package:sk_base_mobile/models/product.model.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/components/category_input.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/components/date_time.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/components/description_input.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/components/lable_input.dart';
import 'package:sk_base_mobile/widgets/gradient_button.dart'; import 'package:sk_base_mobile/widgets/gradient_button.dart';
import 'package:sk_base_mobile/screens/new_inventory_inout/new_inventory_inout_controller.dart'; import 'package:sk_base_mobile/screens/new_inventory_inout/new_inventory_inout_controller.dart';
import 'package:sk_base_mobile/screens/inventory_inout/components/responsive.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart'; import 'package:sk_base_mobile/util/screen_adaper_util.dart';
class NewInventoryInout extends StatelessWidget { class NewInventoryInout extends StatelessWidget {
NewInventoryInout({super.key}); String inOrOut;
NewInventoryInout({super.key, this.inOrOut = 'in'});
final controller = Get.put(NewInventoryInoutController()); final controller = Get.put(NewInventoryInoutController());
@ -131,22 +126,39 @@ class NewInventoryInout extends StatelessWidget {
TextStyle(fontSize: ScreenAdaper.sp(22), color: AppTheme.nearlyBlack), TextStyle(fontSize: ScreenAdaper.sp(22), color: AppTheme.nearlyBlack),
// value: _dropdownValue, // value: _dropdownValue,
decoration: InputDecoration( decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
border: OutlineInputBorder( border: OutlineInputBorder(
borderRadius: BorderRadius.circular(ScreenAdaper.sp(15))), borderRadius: BorderRadius.circular(ScreenAdaper.sp(15))),
labelText: "出/入库", label: const Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Text(
"*",
style: TextStyle(color: Colors.red),
),
Text("出/入库"),
]),
), ),
onChanged: (String? newValue) { onChanged: (String? newValue) {
// setState(() { // setState(() {
// _dropdownValue = newValue; // _dropdownValue = newValue;
// }); // });
}, },
icon: Icon(
Icons.arrow_drop_down_outlined,
size: ScreenAdaper.sp(40),
),
items: <String>[ items: <String>[
'入库', '入库',
'出库', '出库',
].map<DropdownMenuItem<String>>((String value) { ].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>( return DropdownMenuItem<String>(
value: value, value: value,
child: Text(value), child: Text(
value,
style: TextStyle(fontSize: ScreenAdaper.sp(30)),
),
); );
}).toList(), }).toList(),
); );
@ -160,10 +172,19 @@ class NewInventoryInout extends StatelessWidget {
controller: controller, controller: controller,
focusNode: focusNode, focusNode: focusNode,
decoration: InputDecoration( decoration: InputDecoration(
border: OutlineInputBorder( floatingLabelBehavior: FloatingLabelBehavior.always,
borderRadius: BorderRadius.circular(ScreenAdaper.sp(15))), border: OutlineInputBorder(
labelText: "选择产品", borderRadius: BorderRadius.circular(ScreenAdaper.sp(15))),
)); label: const Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Text(
"*",
style: TextStyle(color: Colors.red),
),
Text("产品"),
])));
}, itemBuilder: (context, product) { }, itemBuilder: (context, product) {
return ListTile( return ListTile(
title: Text(product.name ?? ''), title: Text(product.name ?? ''),

View File

@ -2,121 +2,29 @@ import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:sk_base_mobile/app_theme.dart'; import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart'; import 'package:sk_base_mobile/screens/inventory_inout/inventory_inout_controller.dart';
import 'package:sk_base_mobile/screens/landing/landing_controller.dart';
import 'package:sk_base_mobile/util/logger_util.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart'; import 'package:sk_base_mobile/util/screen_adaper_util.dart';
class FloatingCreateButton extends StatelessWidget { class FloatingCreateButton extends StatelessWidget {
FloatingCreateButton({super.key}); FloatingCreateButton({super.key});
final controller = Get.find<LandingController>();
final inventoryInoutController = Get.find<InventoryInoutController>(); final inventoryInoutController = Get.find<InventoryInoutController>();
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Obx(() => controller.showCreateBtn.value return InkWell(
? InkWell( borderRadius: BorderRadius.circular(ScreenAdaper.sp(50)),
borderRadius: BorderRadius.circular(ScreenAdaper.sp(50)), onTap: inventoryInoutController.showInOrOutPickerDialog,
onTap: inventoryInoutController.showInOrOutPickerDialog, child: Container(
child: Container( height: ScreenAdaper.height(140),
height: ScreenAdaper.height(140), width: ScreenAdaper.height(140),
width: ScreenAdaper.height(140), decoration: const BoxDecoration(
decoration: const BoxDecoration( shape: BoxShape.circle,
shape: BoxShape.circle, gradient: LinearGradient(
gradient: LinearGradient(colors: [ colors: [AppTheme.primaryColorLight, AppTheme.primaryColor])),
AppTheme.primaryColorLight, child: Icon(
AppTheme.primaryColor Icons.add,
])), color: Colors.white,
child: Icon( size: ScreenAdaper.sp(70),
Icons.add, ),
color: Colors.white, ),
size: ScreenAdaper.sp(70), );
),
),
)
: TweenAnimationBuilder(
curve: Curves.easeInOut,
tween: Tween<double>(begin: 0, end: 1),
duration: const Duration(milliseconds: 200),
builder: (context, value, child) {
return Stack(
alignment: Alignment.center,
children: [
GestureDetector(
onTap: () {
print('元素被点击');
//
},
child: Transform.translate(
offset: Offset(-ScreenAdaper.width(120) * value,
-ScreenAdaper.height(120)),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
height: ScreenAdaper.height(200),
width: ScreenAdaper.height(200),
decoration: const BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
]),
),
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.add_circle_outline,
color: AppTheme.nearlyWhite,
size: ScreenAdaper.sp(70),
),
Text(
'入库',
style: TextStyle(
color: AppTheme.nearlyWhite,
fontSize: ScreenAdaper.sp(50),
letterSpacing: ScreenAdaper.width(5),
fontWeight: FontWeight.w700),
)
]),
))),
Transform.translate(
offset: Offset(ScreenAdaper.width(120) * value,
-ScreenAdaper.height(120)),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
height: ScreenAdaper.height(200),
width: ScreenAdaper.height(200),
decoration: const BoxDecoration(
// shape: BoxShape.circle,
borderRadius: BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
]),
),
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
//
Icons.remove_circle_outline,
color: AppTheme.nearlyWhite,
size: ScreenAdaper.sp(70),
),
Text(
'出库',
style: TextStyle(
color: AppTheme.nearlyWhite,
fontSize: ScreenAdaper.sp(50),
letterSpacing: ScreenAdaper.width(5),
fontWeight: FontWeight.w700),
)
])),
),
],
);
},
));
} }
} }