diff --git a/lib/Utils/text.dart b/lib/Utils/text.dart index d80cd16..e0ee671 100644 --- a/lib/Utils/text.dart +++ b/lib/Utils/text.dart @@ -35,9 +35,10 @@ Widget text18W800(String text) { ); } -Widget text18W600(String text) { +Widget text18W600(String text, {TextAlign textAl = TextAlign.start}) { return Text( text, + textAlign: textAl, style: TextStyle( fontSize: 18.sp, color: Colors.white, @@ -130,12 +131,12 @@ Widget text14W600_1B1B1B(String text) { ); } -Widget text16W600(String text) { +Widget text16W600(String text, {Color clr = Colors.white}) { return Text( text, style: TextStyle( fontSize: 16.sp, - color: Colors.white, + color: clr, fontWeight: FontWeight.w600, fontFamily: 'manrope'), ); @@ -306,8 +307,6 @@ Widget text14W400_979797(String text) { ); } - - Widget text12W400_979797(String text) { return Text( text, diff --git a/lib/controller/contact_us_controller.dart b/lib/controller/contact_us_controller.dart index 5ce64ef..41c82be 100644 --- a/lib/controller/contact_us_controller.dart +++ b/lib/controller/contact_us_controller.dart @@ -3,6 +3,36 @@ import 'dart:io'; import 'package:get/get.dart'; class ContactUsController extends GetxController { + //contact us page controller RxList attachmentFileList = [File("")].obs; RxList attachmentPathNameList = [""].obs; + + //contact us details page controller + RxList attachmentFileDetailsList = [File("")].obs; + RxList attachmentPathNameDetailsList = [""].obs; + + RxList contactUsDetailsChatContent = [ + { + "initial_name": "SM", + "date": "16 Feb 2024, 11 : 35PM", + "content": """ Dear Customer, +Thank you for contacting Traders Circuit + +Your Service reference no is 18663765 + +when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to + +using 'Content here, content here', making it look like readable English. + +Regards, +Centralised Service Desk + +Traders Circuit""", + }, + { + "initial_name": "AM", + "date": "16 Feb 2024, 11 : 35PM", + "content": "Thank You.......", + } + ].obs; } diff --git a/lib/resources/routes/route_name.dart b/lib/resources/routes/route_name.dart index 9c0c81d..c84d058 100644 --- a/lib/resources/routes/route_name.dart +++ b/lib/resources/routes/route_name.dart @@ -43,4 +43,5 @@ class RouteName { //contact us static const String contactUsMain = '/contactUsMain'; + static const String contactUsMainDetails = '/contactUsMainDetails'; } diff --git a/lib/resources/routes/routes.dart b/lib/resources/routes/routes.dart index cbfef13..8250322 100644 --- a/lib/resources/routes/routes.dart +++ b/lib/resources/routes/routes.dart @@ -29,6 +29,7 @@ import 'package:traderscircuit/view/secureAccess.dart/Fingerprint.dart'; import 'package:traderscircuit/view/secureAccess.dart/Pin.dart'; import 'package:traderscircuit/view/secureAccess.dart/SecureAccess.dart'; +import '../../view/Sidemenu/contactUs/contact_us_details.dart'; import '../../view/login/uploadKycImage.dart'; class AppRoutes { @@ -151,6 +152,10 @@ class AppRoutes { GetPage( name: RouteName.contactUsMain, page: () => const ContactUsMainScreen(), + ), + GetPage( + name: RouteName.contactUsMainDetails, + page: () => const ContactUsDetailsScreen(), ) ]; } diff --git a/lib/view/Sidemenu/contactUs/cancel_ticket_bottom_sheet.dart b/lib/view/Sidemenu/contactUs/cancel_ticket_bottom_sheet.dart new file mode 100644 index 0000000..7cf690c --- /dev/null +++ b/lib/view/Sidemenu/contactUs/cancel_ticket_bottom_sheet.dart @@ -0,0 +1,101 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:gap/gap.dart'; +import 'package:get/get.dart'; +import 'package:traderscircuit/Utils/text.dart'; + +import '../../../Utils/Common/commonBotton.dart'; +import 'ticket_confirmed_bottom_sheet.dart'; + +class CancelTicketBottomSheet { + bottomSheet( + BuildContext context, + ) { + return showModalBottomSheet( + useSafeArea: true, + isScrollControlled: true, + context: context, + backgroundColor: const Color(0xFF101111), + isDismissible: false, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(8.r), + topRight: Radius.circular(8.r), + ), + ), + builder: (BuildContext context) { + return Container( + padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 20), + child: Wrap( + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.end, + mainAxisAlignment: MainAxisAlignment.end, + children: [ + GestureDetector( + onTap: () { + Get.back(); + }, + child: SvgPicture.asset( + "assets/images/svg/cross_cancel.svg")), + ], + ), + const Gap(16), + Container( + margin: const EdgeInsets.symmetric(horizontal: 15), + child: Center( + child: text18W600( + "Are You Sure You want to Close the Ticket?", + textAl: TextAlign.center), + ), + ), + const Gap(25), + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 17, vertical: 20), + child: Row( + children: [ + Expanded( + child: SizedBox( + width: 191.w, + child: kycBtn( + text: "Yes", + onTap: () { + Get.back(); + }, + bgClr: const Color(0xFF6C0000), + borderClr: const Color(0xFF9A0000), + ), + ), + ), + const Gap(16), + Expanded( + child: SizedBox( + width: 191.w, + child: kycBtn( + text: "No", + onTap: () { + Get.back(); + }, + bgClr: const Color(0xFF111313), + borderClr: const Color(0xFF9A0000), + ), + ), + ), + ], + ), + ), + const Gap(25), + ], + ) + ], + ), + ); + }, + ); + } +} diff --git a/lib/view/Sidemenu/contactUs/contact_us_details.dart b/lib/view/Sidemenu/contactUs/contact_us_details.dart new file mode 100644 index 0000000..641d7a6 --- /dev/null +++ b/lib/view/Sidemenu/contactUs/contact_us_details.dart @@ -0,0 +1,392 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:gap/gap.dart'; +import 'package:get/get.dart'; +import 'package:traderscircuit/controller/contact_us_controller.dart'; + +import '../../../Utils/Common/CommonAppbar.dart'; +import '../../../Utils/Common/CustomTextFormField.dart'; +import '../../../Utils/Common/FilePicker.dart'; +import '../../../Utils/Common/commonBotton.dart'; +import '../../../Utils/text.dart'; +import '../../onBoarding/splashScreen1.dart'; +import 'cancel_ticket_bottom_sheet.dart'; + +class ContactUsDetailsScreen extends StatefulWidget { + const ContactUsDetailsScreen({super.key}); + + @override + State createState() => _ContactUsDetailsScreenState(); +} + +class _ContactUsDetailsScreenState extends State { + ContactUsController contactUsController = Get.put(ContactUsController()); + TextEditingController queriesTextController = TextEditingController(); + @override + Widget build(BuildContext context) { + final GlobalKey queriesForm = GlobalKey(); + return Obx( + () => Form( + key: queriesForm, + child: Scaffold( + appBar: CommonAppbar( + height: 75, + titleTxt: "", + customActionWidget: text16W400(""), + ), + backgroundColor: Colors.black, + extendBody: true, + body: Stack( + children: [ + const CommonBlurLeft(), + const CommonBlurRight(), + Stack(children: [ + SingleChildScrollView( + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 18, vertical: 16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + //physics: const NeverScrollableScrollPhysics(), + children: [ + text25W600("Contact Us"), + const Gap(20), + Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + text22W600("#18663765"), + const Gap(10), + text16W500( + "RESOLVED", + clr: const Color(0xFF34C759), + ), + ], + ), + text16W400("16 Feb 2024, 11 : 35 PM"), + ], + ), + const Gap(15), + const Divider( + thickness: 1, + color: Color(0xFF242424), + ), + const Gap(20), + text16W600("Ticket Category"), + const Gap(10), + text16W400( + "It is a long established fact that a reader It is a long established fact that a reader It is a long established fact that a reader"), + contactUsController + .attachmentPathNameDetailsList.isEmpty + ? const SizedBox() + : const Gap(15), + contactUsController + .attachmentPathNameDetailsList.isEmpty + ? const SizedBox() + : ListView.builder( + physics: const NeverScrollableScrollPhysics(), + shrinkWrap: true, + itemCount: contactUsController + .attachmentPathNameDetailsList.length, + itemBuilder: (ctx, index) { + return Container( + width: 1.sw, + height: 42.h, + margin: const EdgeInsets.symmetric( + vertical: 6, + ), + decoration: BoxDecoration( + color: const Color(0xFF0C0C0C), + borderRadius: + BorderRadius.circular(4), + border: Border.all( + width: 1, + color: const Color(0xFF3A3A3A))), + child: Row( + mainAxisAlignment: + MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + const Gap(6), + SvgPicture.asset( + "assets/images/svg/attachment_pin.svg"), + const Gap(6), + Container( + width: 0.7.sw, + child: FittedBox( + child: text12W400( + contactUsController + .attachmentPathNameDetailsList[ + index]), + ), + ), + ], + ), + GestureDetector( + onTap: () { + contactUsController + .attachmentPathNameDetailsList + .removeAt(index); + contactUsController + .attachmentFileDetailsList + .removeAt(index); + }, + child: Container( + margin: const EdgeInsets.only( + right: 20), + child: SvgPicture.asset( + "assets/images/svg/cross_cancel.svg", + color: + const Color(0xFF818181), + width: 10, + height: 10, + ), + )), + ], + ), + ); + }), + contactUsController + .contactUsDetailsChatContent.isEmpty + ? const SizedBox() + : const Gap(18), + ListView.builder( + physics: const NeverScrollableScrollPhysics(), + shrinkWrap: true, + itemCount: contactUsController + .contactUsDetailsChatContent.length + + 1, + itemBuilder: (ctx, index) { + return index == + contactUsController + .contactUsDetailsChatContent.length + ? Container( + margin: EdgeInsets.only(top: 20), + child: Column( + crossAxisAlignment: + CrossAxisAlignment.end, + mainAxisSize: MainAxisSize.min, + children: [ + Stack( + children: [ + CustomTextFormField3( + texttype: + TextInputType.multiline, + hintText: + "Enter some text...", + textEditingController: + queriesTextController, + maxlines: 8, + validator: (value) { + if (value.isEmpty) { + return 'Enter your Content'; + } else if (value + .toString() + .length < + 30) { + return 'Content should be minimum 30 characters'; + } + return null; + }, + inputFormatters: [ + LengthLimitingTextInputFormatter( + 200), + ], + ), + Positioned( + bottom: 15, + left: 37, + right: 37, + child: SizedBox( + width: 200.w, + child: kycBtn( + text: "Close Ticket", + onTap: () { + CancelTicketBottomSheet() + .bottomSheet( + context); + }, + bgClr: const Color( + 0xFF111313), + borderClr: const Color( + 0xFF990000), + ), + ), + ) + ], + ), + contactUsController + .attachmentPathNameDetailsList + .length >= + 3 + ? const SizedBox() + : const Gap(10), + contactUsController + .attachmentPathNameDetailsList + .length >= + 3 + ? const SizedBox() + : InkWell( + onTap: () async { + var result = + await FilePickerMethod() + .pickFile(); + if (result != null) { + contactUsController + .attachmentPathNameDetailsList + .clear(); + + for (var a in result) { + contactUsController + .attachmentFileDetailsList + .add(a); + } + + for (var a + in contactUsController + .attachmentFileDetailsList) { + contactUsController + .attachmentPathNameDetailsList + .add(FilePickerMethod() + .extractFileName( + a?.path ?? + '')); + } + } + }, + child: Row( + mainAxisAlignment: + MainAxisAlignment.end, + children: [ + SvgPicture.asset( + "assets/images/svg/attachment_pin.svg"), + const Gap(6), + text12W400( + "Add Attachment (Max 32MB / Optional)"), + ], + ), + ), + const Gap(20), + Padding( + padding: + const EdgeInsets.symmetric( + // horizontal: 10, + vertical: 20), + child: SizedBox( + width: Get.width, + child: kycBtn( + text: "Submit", + onTap: () { + final isValid = queriesForm + .currentState + ?.validate(); + + if (isValid!) { + contactUsController + .contactUsDetailsChatContent + .add({ + "initial_name": "AM", + "date": + "16 Feb 2024, 11 : 35PM", + "content": + queriesTextController + .text, + }); + queriesTextController + .clear(); + } + }, + bgClr: + const Color(0xFF6C0000), + borderClr: + const Color(0xFF990000), + ), + ), + ), + ], + ), + ) + : Container( + width: 1.sw, + margin: const EdgeInsets.symmetric( + vertical: 5, + ), + decoration: BoxDecoration( + color: const Color(0xFF0C0C0C), + borderRadius: + BorderRadius.circular(8), + gradient: LinearGradient( + begin: + const Alignment(0.98, -0.21), + end: const Alignment(-0.98, 0.21), + colors: [ + Colors.white.withOpacity( + 0.03999999910593033), + Colors.white.withOpacity( + 0.05999999865889549) + ], + ), + border: Border.all( + width: 1, + color: + const Color(0xFF3A3A3A))), + child: Padding( + padding: const EdgeInsets.all(12.0), + child: Column( + crossAxisAlignment: + CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Row( + mainAxisAlignment: + MainAxisAlignment + .spaceBetween, + children: [ + CircleAvatar( + radius: 18, + backgroundColor: + Colors.white, + child: Center( + child: text16W600( + contactUsController + .contactUsDetailsChatContent[ + index] + ["initial_name"], + clr: const Color( + 0xFF535353)), + ), + ), + text14W500( + contactUsController + .contactUsDetailsChatContent[ + index]["date"], + ), + ], + ), + const Gap(18), + text16W400( + contactUsController + .contactUsDetailsChatContent[ + index]["content"], + ) + ], + ), + )); + }), + ]), + ), + ) + ]), + ], + ), + ), + ), + ); + } +} diff --git a/lib/view/Sidemenu/contactUs/contact_us_main.dart b/lib/view/Sidemenu/contactUs/contact_us_main.dart index dbd7426..00235a1 100644 --- a/lib/view/Sidemenu/contactUs/contact_us_main.dart +++ b/lib/view/Sidemenu/contactUs/contact_us_main.dart @@ -3,6 +3,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:gap/gap.dart'; import 'package:get/get.dart'; import 'package:traderscircuit/controller/contact_us_controller.dart'; +import 'package:traderscircuit/resources/routes/route_name.dart'; import '../../../Utils/Common/CommonAppbar.dart'; import '../../../Utils/Common/commonBotton.dart'; @@ -122,92 +123,100 @@ class _ContactUsMainScreenState extends State { } Widget ticketCardWidget(index, type) { + ContactUsController contactUsController = Get.put(ContactUsController()); return dataL[index]["type"] != type && type != "ALL" - ? SizedBox() - : Container( - width: Get.width, - height: 190, - margin: EdgeInsets.only(bottom: 18, top: index == 0 ? 15 : 0), - decoration: ShapeDecoration( - gradient: LinearGradient( - begin: const Alignment(0.98, -0.21), - end: const Alignment(-0.98, 0.21), - colors: [ - Colors.white.withOpacity(0.03999999910593033), - Colors.white.withOpacity(0.05999999865889549) - ], + ? const SizedBox() + : InkWell( + onTap: () { + contactUsController.attachmentFileDetailsList.clear(); + contactUsController.attachmentPathNameDetailsList.clear(); + Get.toNamed(RouteName.contactUsMainDetails); + }, + child: Container( + width: Get.width, + height: 190, + margin: EdgeInsets.only(bottom: 18, top: index == 0 ? 15 : 0), + decoration: ShapeDecoration( + gradient: LinearGradient( + begin: const Alignment(0.98, -0.21), + end: const Alignment(-0.98, 0.21), + colors: [ + Colors.white.withOpacity(0.03999999910593033), + Colors.white.withOpacity(0.05999999865889549) + ], + ), + shape: RoundedRectangleBorder( + side: const BorderSide(width: 1, color: Color(0xFF393939)), + borderRadius: BorderRadius.circular(8), + ), ), - shape: RoundedRectangleBorder( - side: const BorderSide(width: 1, color: Color(0xFF393939)), - borderRadius: BorderRadius.circular(8), - ), - ), - child: Padding( - padding: const EdgeInsets.symmetric( - vertical: 15, - horizontal: 10, - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - text16W600(dataL[index]["id"]), - Row( - children: [ - text16W500(dataL[index]["type"], - clr: dataL[index]["type"] == "OPEN" + child: Padding( + padding: const EdgeInsets.symmetric( + vertical: 15, + horizontal: 10, + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + text16W600(dataL[index]["id"]), + Row( + children: [ + text16W500(dataL[index]["type"], + clr: dataL[index]["type"] == "OPEN" + ? const Color(0xFFFFAD31) + : dataL[index]["type"] == "CLOSED" + ? const Color(0xFF95CCFF) + : const Color(0xFF34C759)), + const Gap(8), + CircleAvatar( + radius: 10, + backgroundColor: dataL[index]["type"] == "OPEN" ? const Color(0xFFFFAD31) : dataL[index]["type"] == "CLOSED" ? const Color(0xFF95CCFF) - : const Color(0xFF34C759)), - const Gap(8), - CircleAvatar( - radius: 10, - backgroundColor: dataL[index]["type"] == "OPEN" - ? const Color(0xFFFFAD31) - : dataL[index]["type"] == "CLOSED" - ? const Color(0xFF95CCFF) - : const Color(0xFF34C759), - child: const Center( - child: Icon( - Icons.check_rounded, - size: 15, - color: Colors.white, + : const Color(0xFF34C759), + child: const Center( + child: Icon( + Icons.check_rounded, + size: 15, + color: Colors.white, + ), ), - ), - ) - ], + ) + ], + ), + ], + ), + const Gap(10), + text16W600(dataL[index]["date"]), + const Gap(5), + text16W400(dataL[index]["category"]), + const Gap(22), + Container( + padding: const EdgeInsets.symmetric( + horizontal: 12, ), - ], - ), - const Gap(10), - text16W600(dataL[index]["date"]), - const Gap(5), - text16W400(dataL[index]["category"]), - const Gap(22), - Container( - padding: const EdgeInsets.symmetric( - horizontal: 12, - ), - width: Get.width, - height: 50, - decoration: ShapeDecoration( - color: Colors.black.withOpacity(0.03999999910593033), - shape: RoundedRectangleBorder( - side: - const BorderSide(width: 1, color: Color(0xFF393939)), - borderRadius: BorderRadius.circular(8), + width: Get.width, + height: 50, + decoration: ShapeDecoration( + color: Colors.black.withOpacity(0.03999999910593033), + shape: RoundedRectangleBorder( + side: const BorderSide( + width: 1, color: Color(0xFF393939)), + borderRadius: BorderRadius.circular(8), + ), ), - ), - child: Center( - child: text16W400(dataL[index]["desc"], - clr: const Color(0xFF9E9E9E), - textOver: TextOverflow.ellipsis), - ), - ) - ], + child: Center( + child: text16W400(dataL[index]["desc"], + clr: const Color(0xFF9E9E9E), + textOver: TextOverflow.ellipsis), + ), + ) + ], + ), ), ), );