yixr
/
mobile_skt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lib/screens/inventory_inout/components/custom_app_bar.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/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';

1
lib/screens/inventory_inout/components/date_container.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';

135
lib/screens/inventory_inout/inventory_inout_controller.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,22 +56,42 @@ 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)),
child: Material(
child: Ink(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
],
),
borderRadius:
BorderRadius.all(Radius.circular(30)),
),
child: ElevatedButton(
onPressed: () {
Get.back(); Get.back();
showInventoryInoutCreateDialog(); showInventoryInoutCreateDialog('in');
}, },
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(
Colors.transparent),
shadowColor: MaterialStateProperty.all(
Colors.transparent),
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius:
BorderRadius.all(Radius.circular(30)),
),
),
padding: MaterialStateProperty.all(
EdgeInsets.zero),
),
child: Container( child: Container(
height: ScreenAdaper.height(350), height: ScreenAdaper.height(350),
width: ScreenAdaper.height(350), width: ScreenAdaper.height(350),
decoration: const BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
]),
),
alignment: Alignment.center, alignment: Alignment.center,
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
@ -86,38 +111,63 @@ class InventoryInoutController extends GetxController {
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:
const BorderRadius.all(Radius.circular(30)),
child: Material(
child: Ink(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
],
),
borderRadius:
BorderRadius.all(Radius.circular(30)),
),
child: ElevatedButton(
onPressed: () {
Get.back(); Get.back();
showInventoryInoutCreateDialog(); 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( child: Container(
height: ScreenAdaper.height(350), height: ScreenAdaper.height(350),
width: ScreenAdaper.height(350), width: ScreenAdaper.height(350),
decoration: const BoxDecoration(
// shape: BoxShape.circle,
borderRadius:
BorderRadius.all(Radius.circular(30)),
gradient: LinearGradient(colors: [
AppTheme.primaryColorLight,
AppTheme.primaryColor
]),
),
alignment: Alignment.center, alignment: Alignment.center,
child: Column( 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),
), ),
@ -130,12 +180,18 @@ class InventoryInoutController extends GetxController {
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);
}, },
); );
} }

3
lib/screens/login/login.controller.dart
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);

3
lib/screens/login/login.dart
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(

43
lib/screens/new_inventory_inout/new_inventory_inout.dart
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(
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("产品"),
])));
}, itemBuilder: (context, product) { }, itemBuilder: (context, product) {
return ListTile( return ListTile(
title: Text(product.name ?? ''), title: Text(product.name ?? ''),

98
lib/widgets/floating_action.dart
View File

@ -2,18 +2,14 @@ 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(
@ -21,102 +17,14 @@ class FloatingCreateButton extends StatelessWidget {
width: ScreenAdaper.height(140), width: ScreenAdaper.height(140),
decoration: const BoxDecoration( decoration: const BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
gradient: LinearGradient(colors: [ gradient: LinearGradient(
AppTheme.primaryColorLight, colors: [AppTheme.primaryColorLight, AppTheme.primaryColor])),
AppTheme.primaryColor
])),
child: Icon( child: Icon(
Icons.add, Icons.add,
color: Colors.white, color: Colors.white,
size: ScreenAdaper.sp(70), 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),
)
])),
),
],
); );
},
));
} }
} }