live chat ui redesigned.

merge-requests/390/head
Sikander Saleem 3 years ago
parent d2d22ff1fc
commit 1b7b7b6334

@ -4,6 +4,7 @@ import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/button.dart';
import 'package:diplomaticquarterapp/widgets/buttons/defaultButton.dart';
import 'package:diplomaticquarterapp/widgets/buttons/secondary_button.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
@ -37,182 +38,89 @@ class _HospitalsLiveChatPageState extends State<HospitalsLiveChatPage> {
builder: (_, model, widget) => AppScaffold(
baseViewModel: model,
isShowDecPage: false,
body: SingleChildScrollView(
child: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Stack(
body: Column(
children: [
Expanded(
child: SingleChildScrollView(
physics: BouncingScrollPhysics(),
padding: EdgeInsets.only(top: 16, bottom: 16, right: 21, left: 21),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 70,
),
Container(
width: double.infinity,
height: 230,
Text(
TranslationBase.of(context).instructions,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Color(0xff2B353E), letterSpacing: -0.56, height: 21 / 14),
),
SizedBox(height: 20),
Text(
TranslationBase.of(context).selectHospitalDec + " :",
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600, color: Color(0xff2B353E), letterSpacing: -0.64, height: 23 / 16),
),
SizedBox(height: 20),
ListView.separated(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
separatorBuilder: (context, index) => SizedBox(height: 14),
itemCount: model.LiveChatModelList.length,
itemBuilder: (context, index) => InkWell(
onTap: () {
setState(() {
tappedIndex = index;
chat =
"http://chat.dshmg.com:7788/hmgchatapp/hmgchattest/Index.aspx?Name=${model.user.firstName}&PatientID=${model.user.patientID}&MobileNo=${model.user.mobileNumber}&Language=${projectViewModel.currentLanguage}&WorkGroup=${model.LiveChatModelList[index].value}";
});
},
child: Container(
padding: EdgeInsets.only(right: 12, left: 18, top: 16, bottom: 16),
decoration: BoxDecoration(
image: DecorationImage(
image: ExactAssetImage(
'assets/images/dashboard_top_bg.png'),
fit: BoxFit.cover),
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: projectViewModel.isArabic? 10:20,
),
Texts(
TranslationBase.of(context).instructions,
color: Colors.white,
textAlign: TextAlign.start,
),
SizedBox(
height:projectViewModel.isArabic? 8:25,
),
Texts(
TranslationBase.of(context)
.selectHospitalDec +
" :",
color: Colors.white,
fontWeight: FontWeight.w700,
textAlign: TextAlign.start,
borderRadius: BorderRadius.all(
Radius.circular(10.0),
),
boxShadow: [
BoxShadow(
color: Color(0xff000000).withOpacity(.05),
blurRadius: 27,
offset: Offset(0, -3),
),
],
),
color: tappedIndex == index ? Color(0xff28323A).withOpacity(.7) : Colors.white),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Expanded(
child: Text(
model.LiveChatModelList[index]?.projectName ?? "",
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600, color: tappedIndex == index ? Colors.white : Color(0xff2B353E), letterSpacing: -0.64, height: 23 / 16),
),
),
Icon(
Icons.arrow_forward_ios,
color: tappedIndex == index ? Colors.white : Colors.black,
),
],
),
),
SizedBox(
height: MediaQuery.of(context).size.height * 0.85,
),
SizedBox(
height: 100,
),
],
),
Positioned(
left: 13,
right: 13,
top: 200,
child: Container(
width: double.maxFinite,
child: Column(
children: [
...List.generate(
model.LiveChatModelList.length,
(index) => Container(
margin: EdgeInsets.only(
left: 0, right: 0, bottom: 20),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
border: Border.all(
color: Colors.white, width: 0.5),
borderRadius: BorderRadius.all(
Radius.circular(5)),
color: tappedIndex == index
? Theme.of(context).primaryColor
: Colors.white,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
InkWell(
onTap: () {
setState(() {
tappedIndex = index;
chat = "http://chat.dshmg.com:7788/hmgchatapp/hmgchattest/Index.aspx?Name=${model.user.firstName}&PatientID=${model.user.patientID}&MobileNo=${model.user.mobileNumber}&Language=${projectViewModel.currentLanguage}&WorkGroup=${model.LiveChatModelList[index].value}";
});
},
child: Row(
mainAxisAlignment:
MainAxisAlignment
.spaceAround,
crossAxisAlignment:
CrossAxisAlignment.center,
children: <Widget>[
SizedBox(
width: 20,
),
Expanded(
child: Container(
margin:
EdgeInsets.only(
left: 5,
right: 5),
child: Texts(
'${model.LiveChatModelList[index].projectName}',
color:
tappedIndex ==
index
? Colors
.white
: Colors
.black,
textAlign: TextAlign
.center,
))),
//model.cOCItemList[index].cOCTitl
IconButton(
icon: Icon(
Icons.arrow_forward_ios,
color:
tappedIndex == index
? Colors.white
: Colors.black,
),
tooltip: '',
onPressed: () {
setState(() {});
},
),
],
),
)
],
),
),
)),
],
),
),
),
],
),
Container(
height: MediaQuery.of(context).size.height * 0.20,
width: double.maxFinite,
)
],
),
),
),
),
bottomSheet: Container(
height: MediaQuery.of(context).size.height * 0.10,
width: double.infinity,
padding: EdgeInsets.all(8.0),
child: Center(
child: Container(
height: MediaQuery.of(context).size.height * 0.07,
width: MediaQuery.of(context).size.width * 0.8,
child: SecondaryButton(
label: TranslationBase.of(context).start,
loading: model.state == ViewState.BusyLocal,
textColor: Colors.white,
disabled: chat.isEmpty,
onTap: () {
launch(chat);
},
Container(
color: Colors.white,
padding: EdgeInsets.only(top: 16, bottom: 16, right: 21, left: 21),
child: DefaultButton(
TranslationBase.of(context).start,
chat.isEmpty ? null : () => {launch(chat)},
color: Color(0xffD02127),
textColor: chat.isEmpty ? Color(0xff000000) : Colors.white,
disabledColor: Color(0xffEAEAEA),
),
),
),
],
),
),
);

@ -2,6 +2,7 @@ import 'dart:ui';
import 'package:diplomaticquarterapp/core/model/ImagesInfo.dart';
import 'package:diplomaticquarterapp/pages/ContactUs/LiveChat/pharmaciesLivechat_page.dart';
import 'package:diplomaticquarterapp/theme/colors.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
@ -15,17 +16,19 @@ class LiveChatPage extends StatefulWidget {
_LiveChatPageState createState() => _LiveChatPageState();
}
class _LiveChatPageState extends State<LiveChatPage>
with SingleTickerProviderStateMixin {
class _LiveChatPageState extends State<LiveChatPage> with SingleTickerProviderStateMixin {
TabController _tabController;
List<ImagesInfo> imagesInfo = List();
@override
void initState() {
super.initState();
imagesInfo.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/0.png',imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/0.png'));
imagesInfo.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/1.png',imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/1.png'));
imagesInfo.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/2.png',imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/2.png'));
imagesInfo
.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/0.png', imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/0.png'));
imagesInfo
.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/1.png', imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/1.png'));
imagesInfo
.add(ImagesInfo(imageEn: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/en/2.png', imageAr: 'https://hmgwebservices.com/Images/MobileApp/imges-info/live-chat/ar/2.png'));
_tabController = TabController(length: 2, vsync: this);
}
@ -44,84 +47,42 @@ class _LiveChatPageState extends State<LiveChatPage>
title: TranslationBase.of(context).liveChat,
description: TranslationBase.of(context).infoChat,
appBarTitle: TranslationBase.of(context).service,
body: Scaffold(
extendBodyBehindAppBar: true,
appBar: PreferredSize(
preferredSize: Size.fromHeight(65.0),
child: Stack(
children: <Widget>[
Positioned(
bottom: 1,
left: 0,
right: 0,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: Container(
color: Theme.of(context)
.scaffoldBackgroundColor
.withOpacity(0.8),
height: 70.0,
),
),
),
Center(
child: Container(
height: 60.0,
margin: EdgeInsets.only(top: 10.0),
width: MediaQuery.of(context).size.width * 0.92, // 0.9,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: Theme.of(context).dividerColor,
width: 0.9), //width: 0.7
),
color: Colors.white),
child: Center(
child: TabBar(
isScrollable: true,
controller: _tabController,
indicatorWeight: 5.0,
indicatorSize: TabBarIndicatorSize.tab,
indicatorColor: Theme.of(context).primaryColor,
labelColor: Theme.of(context).primaryColor,
labelPadding: EdgeInsets.only(top: 4.0, left: 35.0, right: 35.0),
unselectedLabelColor: Colors.grey[800],
tabs: [
Container(
width: MediaQuery.of(context).size.width * 0.30,
child: Center(
child: Texts(TranslationBase.of(context).hospitals),
),
),
Container(
width: MediaQuery.of(context).size.width * 0.30,
child: Center(
child: Texts(TranslationBase.of(context).pharmacies),
),
),
],
),
),
),
),
],
showNewAppBar: true,
showNewAppBarTitle: true,
backgroundColor: CustomColors.appBackgroudGrey2Color,
body: Column(
children: <Widget>[
TabBar(
controller: _tabController,
indicatorWeight: 3.0,
indicatorSize: TabBarIndicatorSize.tab,
labelColor: Color(0xff2B353E),
unselectedLabelColor: Color(0xff575757),
labelPadding: EdgeInsets.only(top: 15, bottom: 13, left: 20, right: 20),
labelStyle: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
letterSpacing: -0.48,
),
unselectedLabelStyle: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
letterSpacing: -0.48,
),
tabs: [Text(TranslationBase.of(context).hospitals), Text(TranslationBase.of(context).pharmacies)],
),
),
body: Column(
children: <Widget>[
Expanded(
child: TabBarView(
physics: BouncingScrollPhysics(),
controller: _tabController,
children: <Widget>[
HospitalsLiveChatPage(), //SendFeedbackPage(),
PhamaciesLiveChatPage()
//StatusFeedbackPage()
],
),
)
],
),
Expanded(
child: TabBarView(
physics: BouncingScrollPhysics(),
controller: _tabController,
children: <Widget>[
HospitalsLiveChatPage(), //SendFeedbackPage(),
PharmaciesLiveChatPage()
//StatusFeedbackPage()
],
),
)
],
),
);
}

@ -5,6 +5,7 @@ import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/button.dart';
import 'package:diplomaticquarterapp/widgets/buttons/defaultButton.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/cupertino.dart';
@ -13,21 +14,8 @@ import 'package:provider/provider.dart';
import 'package:url_launcher/url_launcher.dart';
class PhamaciesLiveChatPage extends StatefulWidget {
@override
_PhamaciesLiveChatPageState createState() => _PhamaciesLiveChatPageState();
}
class _PhamaciesLiveChatPageState extends State<PhamaciesLiveChatPage> {
int tappedIndex;
String chat;
@override
void initState() {
super.initState();
tappedIndex = -1;
chat = "";
}
class PharmaciesLiveChatPage extends StatelessWidget {
PharmaciesLiveChatPage({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
@ -36,53 +24,43 @@ class _PhamaciesLiveChatPageState extends State<PhamaciesLiveChatPage> {
builder: (_, model, widget) => AppScaffold(
baseViewModel: model,
isShowDecPage: false,
body: SingleChildScrollView(
child: Container(
margin: EdgeInsets.only(left: 15, right: 15),
child: Column(
children: [
SizedBox(
height: 20,
body: Column(
children: [
Expanded(
child: SingleChildScrollView(
physics: BouncingScrollPhysics(),
padding: EdgeInsets.only(top: 16, bottom: 16, right: 21, left: 21),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(height: 20),
Text(
TranslationBase.of(context).instructions,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Color(0xff2B353E), letterSpacing: -0.56, height: 21 / 14),
),
],
),
Container(
width: double.infinity,
height: 200,
child: Texts(
TranslationBase.of(context).instructionsPharmacies,
color: Colors.black,
textAlign: TextAlign.center,
),
),
///////////
SizedBox(
height: 100,
),
],
),
),
),
),
bottomSheet: Container(
height: MediaQuery.of(context).size.height * 0.11,
width: double.infinity,
padding: EdgeInsets.all(8.0),
child: Center(
child: Container(
height: MediaQuery.of(context).size.height * 0.7,
width: MediaQuery.of(context).size.width * 0.8,
child: Button(
label: TranslationBase.of(context).start,
loading: model.state == ViewState.BusyLocal,
onTap: () {
print("chat=" + chat);
Container(
color: Colors.white,
padding: EdgeInsets.only(top: 16, bottom: 16, right: 21, left: 21),
child: DefaultButton(
TranslationBase.of(context).start,
() {
String chat;
chat =
"http://chat.dshmg.com:7788/EPharmacyChat/EIndex.aspx?CustomerID=undefined&Name=${model.user.firstName}&MobileNo=${model.user.mobileNumber}&Language=${projectViewModel.isArabic? 1:2}";
"http://chat.dshmg.com:7788/EPharmacyChat/EIndex.aspx?CustomerID=undefined&Name=${model.user.firstName}&MobileNo=${model.user.mobileNumber}&Language=${projectViewModel.isArabic ? 1 : 2}";
launch(chat);
},
color: Color(0xffD02127),
textColor: Colors.white,
disabledColor: Color(0xffEAEAEA),
),
),
),
],
),
),
);

@ -15,5 +15,6 @@ class CustomColors {
static const Color pharmacyGreyColor = Color(0xFFDBDBDB);
static const Color backgroudGreyColor = Color(0xFFEFEFEF);
static const Color appBackgroudGreyColor = Color(0xFFF7F7F7);
static const Color appBackgroudGrey2Color = Color(0xFFF8F8F8);
static const Color green = Color(0xFF359846);
}

Loading…
Cancel
Save