import 'package:diplomaticquarterapp/core/enum/viewstate.dart'; import 'package:diplomaticquarterapp/core/viewModels/feedback/feedback_view_model.dart'; import 'package:diplomaticquarterapp/pages/base/base_view.dart'; import 'package:diplomaticquarterapp/uitl/app_toast.dart'; import 'package:diplomaticquarterapp/uitl/date_uitl.dart'; import 'package:diplomaticquarterapp/widgets/avatar/large_avatar.dart'; import 'package:diplomaticquarterapp/widgets/bottom_options/BottomSheet.dart'; import 'package:diplomaticquarterapp/widgets/buttons/button.dart'; import 'package:diplomaticquarterapp/widgets/data_display/text.dart'; import 'package:diplomaticquarterapp/widgets/input/text_field.dart'; import 'package:diplomaticquarterapp/widgets/others/StarRating.dart'; import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'appointment_history.dart'; class SendFeedbackPage extends StatefulWidget { @override _SendFeedbackPageState createState() => _SendFeedbackPageState(); } class _SendFeedbackPageState extends State { TextEditingController titleController = TextEditingController(); TextEditingController messageController = TextEditingController(); List images = []; String title; AppointmentHistory appointHistory; bool isShowListAppointHistory = true; String message; final formKey = GlobalKey(); @override Widget build(BuildContext context) { return BaseView( builder: (_, model, widget) => AppScaffold( baseViewModel: model, body: Container( height: MediaQuery.of(context).size.height * 0.8, child: SingleChildScrollView( child: Form( key: formKey, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ SizedBox( height: 65, ), Container( margin: EdgeInsets.only(left: 20, right: 20, top: 8), child: Texts( 'We\'d love to hear your feedback about the health care services and online services. Please fill in the required fields', //يسعدنا سماع ملاحظاتك حول خدمات الرعاية الصحية والخدمات الإلكترونية. يرجى تعبئة الحقول المطلوبة textAlign: TextAlign.center, variant: 'body2Link', ), ), InkWell( onTap: () { confirmBox(model); }, child: Container( margin: EdgeInsets.only(left: 10, right: 10, top: 15), height: 50, decoration: BoxDecoration( border: Border.all(color: Colors.grey), borderRadius: BorderRadius.circular(7), color: Colors.white, shape: BoxShape.rectangle, ), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Container( child: Texts( model.selected, variant: 'bodyText', ), margin: EdgeInsets.only(left: 10), ), Icon( Icons.arrow_drop_down, size: 22, color: Colors.grey, ) ], ), ), ), if (appointHistory != null && model.messageType == MessageType.ComplaintOnAnAppointment) InkWell( onTap: () { setState(() { isShowListAppointHistory = true; }); }, child: Container( margin: EdgeInsets.all(8.0), color: Colors.white, child: Row( children: [ Expanded( flex: 4, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Padding( padding: const EdgeInsets.all(10.0), child: Row( children: [ Expanded( flex: 1, child: LargeAvatar( name: appointHistory.doctorNameObj, url: appointHistory.doctorImageURL, ), ), Expanded( flex: 4, child: Container( margin: EdgeInsets.all(10), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Texts( appointHistory.doctorNameObj, bold: true, ), Texts( DateUtil .getMonthDayYearDateFormatted( appointHistory .appointmentDate), variant: 'caption3', ), StarRating( totalAverage: appointHistory .doctorRate .toDouble(), forceStars: true), ], ), ), ), ], ), ), ], ), ), Expanded( flex: 1, child: Center( child: Icon( Icons.arrow_forward_ios, size: 15, ), ), ) ], ), ), ), if (model.messageType == MessageType.ComplaintOnAnAppointment && model.appointHistoryList.length != 0 && isShowListAppointHistory) Container( height: MediaQuery.of(context).size.height * 0.4, child: ListView.builder( itemCount: model.appointHistoryList.length, itemBuilder: (context, index) => InkWell( onTap: () { setState(() { appointHistory = model.appointHistoryList[index]; isShowListAppointHistory = false; }); }, child: Container( margin: EdgeInsets.only(left: 8, right: 8), color: Colors.white, child: Column( children: [ Row( children: [ Expanded( flex: 4, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Padding( padding: const EdgeInsets.all(10.0), child: Row( children: [ Expanded( flex: 1, child: LargeAvatar( name: model .appointHistoryList[ index] .doctorNameObj, url: model .appointHistoryList[ index] .doctorImageURL, ), ), Expanded( flex: 4, child: Container( margin: EdgeInsets.all(10), child: Column( crossAxisAlignment: CrossAxisAlignment .start, children: [ Texts( model .appointHistoryList[ index] .doctorNameObj, bold: true, ), Texts( DateUtil.getMonthDayYearDateFormatted(model .appointHistoryList[ index] .appointmentDate), variant: 'caption3', ), StarRating( totalAverage: model .appointHistoryList[ index] .doctorRate .toDouble(), forceStars: true), ], ), ), ), ], ), ), ], ), ), Expanded( flex: 1, child: Center( child: Icon( Icons.arrow_forward_ios, size: 15, ), ), ) ], ), SizedBox( height: 5, ), Divider( height: 0.5, color: Colors.grey[400], ) ], ), ), ), ), ), Container( margin: EdgeInsets.only(left: 10, right: 10, top: 15), child: TextFields( hintText: 'Title', controller: titleController, fontSize: 13.5, hintColor: Colors.black, fontWeight: FontWeight.w600, validator: (value) { if (value == null) return "please Enter title"; else return null; }, ), ), Container( margin: EdgeInsets.only(left: 10, right: 10, top: 15), child: TextFields( hintText: 'message', fontSize: 13.5, hintColor: Colors.black, fontWeight: FontWeight.w600, maxLines: 25, minLines: 13, controller: messageController, validator: (value) { if (value == null) return "please Enter message"; else return null; }), ), InkWell( onTap: () { ImageOptions.showImageOptions(context, (String image) { setState(() { images.add(image); }); }); }, child: Container( margin: EdgeInsets.only(left: 10, right: 10, top: 15), height: 50, decoration: BoxDecoration( border: Border.all(color: Colors.grey), borderRadius: BorderRadius.circular(7), color: Colors.white, shape: BoxShape.rectangle, ), child: Center( child: Row( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [ Icon(Icons.attach_file), Texts( 'selected attachment', variant: 'bodyText', textAlign: TextAlign.center, ), ], ), ), ), ), ...List.generate( images.length, (index) => Container( margin: EdgeInsets.all(10), padding: EdgeInsets.all(8.0), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ Icon(FontAwesomeIcons.paperclip), SizedBox( width: 8, ), Texts( 'image ${index + 1}.png', ), ], ), InkWell( onTap: () { setState(() { images.remove(images[index]); }); }, child: Icon( FontAwesomeIcons.trashAlt, color: Colors.red[300], )) ], ), )), SizedBox( height: 30, ), ], ), ), ), ), bottomSheet: Container( height: MediaQuery.of(context).size.height * 0.13, width: double.infinity, padding: EdgeInsets.all(8.0), child: Center( child: Container( height: MediaQuery.of(context).size.height * 0.1, width: MediaQuery.of(context).size.width * 0.8, child: Button( label: 'Send', loading: model.state == ViewState.BusyLocal, onTap: () { final form = formKey.currentState; if (form.validate()) if (model.messageType != MessageType.NON) model .sendCOCItem( title: titleController.text, attachment: images.length > 0 ? images[0] : "", details: messageController.text, cOCTypeName: getCOCName(model), appointHistory: model.messageType == MessageType.ComplaintOnAnAppointment ? appointHistory : null) .then((value) { if (value) { setState(() { titleController.text = ""; messageController.text = ""; images = []; }); model.setMessageType(MessageType.NON); AppToast.showSuccessToast( message: "Your feedback was send"); } else { AppToast.showErrorToast(message: model.error); } }); else { AppToast.showErrorToast(message: "Please select COC"); } }, ), ), ), ), ), ); } String getCOCName(FeedbackViewModel model) { switch (model.messageType) { case MessageType.ComplaintOnAnAppointment: return "1"; break; case MessageType.ComplaintWithoutAppointment: return "2"; break; case MessageType.Question: return "3"; break; case MessageType.Compliment: return "4"; break; case MessageType.Suggestion: return "5"; break; case MessageType.NON: return ""; break; } return ""; } // Show Dialog function void confirmBox(FeedbackViewModel model) { showDialog( context: context, child: FeedbackTypeDialog( onValueSelected: (MessageType value) { if (value == MessageType.ComplaintOnAnAppointment) { model.getPatentAppointmentHistory().then((value) { setState(() { appointHistory = null; }); }); } model.setMessageType(value); }, )); } } class FeedbackTypeDialog extends StatefulWidget { final Function(MessageType) onValueSelected; const FeedbackTypeDialog({Key key, this.onValueSelected}) : super(key: key); @override State createState() => new FeedbackTypeDialogState(); } class FeedbackTypeDialogState extends State { Widget build(BuildContext context) { return BaseView( builder: (_, model, widge) => SimpleDialog( title: Text( "Message Type", textAlign: TextAlign.center, ), children: [ Container( // padding: const EdgeInsets.all(10.0), child: Column( children: [ Divider( height: 2.5, color: Colors.grey[500], ), Row( children: [ Expanded( flex: 1, child: InkWell( onTap: () => model.setMessageDialogType( MessageType.ComplaintOnAnAppointment), child: ListTile( title: const Text('Complaint on an appointment'), leading: Radio( value: MessageType.ComplaintOnAnAppointment, groupValue: model.messageTypeDialog, activeColor: Colors.red[800], onChanged: (MessageType value) => model.setMessageDialogType(value), ), ), ), ) ], ), SizedBox( height: 5.0, ), Row( children: [ Expanded( flex: 1, child: InkWell( onTap: () => model.setMessageDialogType( MessageType.ComplaintWithoutAppointment), child: ListTile( title: const Text('Complaint without appointment'), leading: Radio( value: MessageType.ComplaintWithoutAppointment, groupValue: model.messageTypeDialog, activeColor: Colors.red[800], onChanged: (MessageType value) => model.setMessageDialogType(value), ), ), ), ) ], ), SizedBox( height: 5.0, ), Row( children: [ Expanded( flex: 1, child: InkWell( onTap: () => model.setMessageDialogType(MessageType.Question), child: ListTile( title: const Text('Question'), leading: Radio( value: MessageType.Question, groupValue: model.messageTypeDialog, activeColor: Colors.red[800], onChanged: (MessageType value) => model.setMessageDialogType(value), ), ), ), ) ], ), SizedBox( height: 5.0, ), Row( children: [ Expanded( flex: 1, child: InkWell( onTap: () => model.setMessageDialogType(MessageType.Compliment), child: ListTile( title: const Text('compliment'), leading: Radio( value: MessageType.Compliment, groupValue: model.messageTypeDialog, activeColor: Colors.red[800], onChanged: (MessageType value) => model.setMessageDialogType(value), ), ), ), ) ], ), SizedBox( height: 5.0, ), Row( children: [ Expanded( flex: 1, child: InkWell( onTap: () => model.setMessageDialogType(MessageType.Suggestion), child: ListTile( title: const Text('Suggestion'), leading: Radio( value: MessageType.Suggestion, groupValue: model.messageTypeDialog, activeColor: Colors.red[800], onChanged: (MessageType value) => model.setMessageDialogType(value), ), ), ), ) ], ), SizedBox( height: 5.0, ), Divider( height: 2.5, color: Colors.grey[500], ), SizedBox( height: 5, ), Row( // mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Expanded( flex: 1, child: InkWell( onTap: () { Navigator.pop(context); }, child: Padding( padding: const EdgeInsets.all(8.0), child: Container( child: Center( child: Texts( 'cancel', color: Colors.red, ), ), ), ), ), ), Container( width: 1, height: 30, color: Colors.grey[500], ), Expanded( flex: 1, child: InkWell( onTap: () { widget.onValueSelected(model.messageTypeDialog); Navigator.pop(context); }, child: Padding( padding: const EdgeInsets.all(8.0), child: Center( child: Texts( 'ok', fontWeight: FontWeight.w400, )), ), )), ], ) ], ), ), ], ), ); } }