route , approval screen & approval detail
This commit is contained in:
Sas Andy
368
lib/screen/approval_detail/approval_detail_screen.dart
Normal file
368
lib/screen/approval_detail/approval_detail_screen.dart
Normal file
@@ -0,0 +1,368 @@
|
||||
import 'dart:async';
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:absensi_sas/app/constant.dart';
|
||||
import 'package:absensi_sas/model/approval_detail_model.dart';
|
||||
import 'package:absensi_sas/screen/approval/approval_mockup.dart';
|
||||
import 'package:absensi_sas/screen/approval/widget/approval_dialog_confirmation.dart';
|
||||
import 'package:absensi_sas/widget/custom_button_approval.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:flutter_map/flutter_map.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:latlong2/latlong.dart';
|
||||
|
||||
class ApprovalDetailScreen extends HookConsumerWidget {
|
||||
const ApprovalDetailScreen({super.key});
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final loading = useState(true);
|
||||
final data = useState<ApprovalDetailModel>(
|
||||
ApprovalDetailModel(imagePath: "", lat: 0, long: 0));
|
||||
init() {
|
||||
loading.value = true;
|
||||
var randIdx = Random().nextInt(approvalDetailMockup.length);
|
||||
var tmp = approvalDetailMockup[randIdx];
|
||||
Timer(Duration(seconds: 2), () {
|
||||
data.value = tmp;
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
useEffect(() {
|
||||
WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
|
||||
init();
|
||||
return;
|
||||
});
|
||||
return () {};
|
||||
}, []);
|
||||
return SafeArea(
|
||||
minimum: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(context: context, y: 30)),
|
||||
child: Scaffold(
|
||||
backgroundColor: Constant.textWhite,
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.white,
|
||||
shadowColor: Colors.white,
|
||||
surfaceTintColor: Colors.white,
|
||||
scrolledUnderElevation: 0,
|
||||
elevation: 0,
|
||||
leading: Container(
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
Navigator.pop(context);
|
||||
},
|
||||
icon: Icon(Icons.arrow_back_ios_new_rounded)),
|
||||
),
|
||||
centerTitle: true,
|
||||
title: Text(
|
||||
"Detail",
|
||||
style: Constant.title_screen(context: context),
|
||||
),
|
||||
),
|
||||
body: loading.value
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: Container(
|
||||
color: Colors.white,
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal:
|
||||
Constant.getActualXPhone(context: context, x: 20)),
|
||||
child: RefreshIndicator(
|
||||
onRefresh: () async {
|
||||
init();
|
||||
},
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 36),
|
||||
),
|
||||
if (data.value.statusID == "1" ||
|
||||
data.value.statusID == "2")
|
||||
Row(
|
||||
children: [
|
||||
Spacer(),
|
||||
if (data.value.statusID == "1")
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
color: Constant.bgGreen),
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: Constant.getActualXPhone(
|
||||
context: context, x: 8),
|
||||
vertical: Constant.getActualYPhone(
|
||||
context: context, y: 2)),
|
||||
child: Text(
|
||||
"Approve",
|
||||
style: Constant.body_12(context: context)
|
||||
.copyWith(
|
||||
color: Constant.primaryGreen),
|
||||
),
|
||||
),
|
||||
if (data.value.statusID == "2")
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
color: Constant.bgRed),
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: Constant.getActualXPhone(
|
||||
context: context, x: 8),
|
||||
vertical: Constant.getActualYPhone(
|
||||
context: context, y: 2)),
|
||||
child: Text(
|
||||
"Reject",
|
||||
style: Constant.body_12(context: context)
|
||||
.copyWith(color: Constant.primaryRed),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
if (data.value.statusID == "1" ||
|
||||
data.value.statusID == "2")
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 8),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(bottom: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text("Nama : ",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
fontWeight: FontWeight.w400)),
|
||||
),
|
||||
Expanded(
|
||||
flex: 9,
|
||||
child: Text(data.value.name ?? "",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400)),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(bottom: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text("NIP : ",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
fontWeight: FontWeight.w400)),
|
||||
),
|
||||
Expanded(
|
||||
flex: 9,
|
||||
child: Text(data.value.nip ?? "",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400)),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(bottom: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text("Tanggal : ",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
fontWeight: FontWeight.w400)),
|
||||
),
|
||||
Expanded(
|
||||
flex: 9,
|
||||
child: Text(data.value.date ?? "",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400)),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(bottom: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text("Jam : ",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
fontWeight: FontWeight.w400)),
|
||||
),
|
||||
Expanded(
|
||||
flex: 9,
|
||||
child: Text(data.value.time ?? "",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400)),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(bottom: 8),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Text("Alamat : ",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
fontWeight: FontWeight.w400)),
|
||||
),
|
||||
Expanded(
|
||||
flex: 9,
|
||||
child: Text(data.value.address ?? "",
|
||||
style: Constant.body_16(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w400)),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(top: 16),
|
||||
width: MediaQuery.of(context).size.width,
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 400),
|
||||
child: FlutterMap(
|
||||
options: MapOptions(
|
||||
center: LatLng(data.value.lat ?? 0,
|
||||
data.value.long ?? 0),
|
||||
zoom: 16,
|
||||
),
|
||||
children: [
|
||||
TileLayer(
|
||||
urlTemplate:
|
||||
'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
userAgentPackageName: 'com.example.app',
|
||||
),
|
||||
MarkerLayer(
|
||||
markers: [
|
||||
Marker(
|
||||
point: LatLng(-7.539538, 110.798357),
|
||||
child: const Icon(
|
||||
Icons.location_on,
|
||||
color: Colors.red,
|
||||
size: 50,
|
||||
),
|
||||
)
|
||||
// Marker(
|
||||
// point: LatLng(lat, long),
|
||||
// width: 100,
|
||||
// height: 100,
|
||||
// builder: (context) => const Icon(
|
||||
// Icons.location_on,
|
||||
// color: Colors.red,
|
||||
// size: 50,
|
||||
// )),
|
||||
],
|
||||
),
|
||||
]),
|
||||
),
|
||||
if (data.value.imagePath != "" &&
|
||||
data.value.imagePath != null)
|
||||
Container(
|
||||
margin: EdgeInsets.only(top: 16, bottom: 48),
|
||||
child: Image.network(
|
||||
data.value.imagePath!,
|
||||
errorBuilder: (context, error, stackTrace) {
|
||||
return Text(
|
||||
"Error load image : ${error.toString()}",
|
||||
style: Constant.body_12(context: context)
|
||||
.copyWith(color: Constant.primaryRed),
|
||||
);
|
||||
},
|
||||
loadingBuilder:
|
||||
(context, child, loadingProgress) {
|
||||
if (loadingProgress == null) return child;
|
||||
return Container(
|
||||
child: Column(
|
||||
children: [
|
||||
Text(loadingProgress.expectedTotalBytes !=
|
||||
null
|
||||
? ((loadingProgress.cumulativeBytesLoaded /
|
||||
loadingProgress
|
||||
.expectedTotalBytes!) *
|
||||
100)
|
||||
.round()
|
||||
.toString() +
|
||||
" %"
|
||||
: ""),
|
||||
LinearProgressIndicator(
|
||||
value: loadingProgress
|
||||
.expectedTotalBytes !=
|
||||
null
|
||||
? loadingProgress
|
||||
.cumulativeBytesLoaded /
|
||||
loadingProgress
|
||||
.expectedTotalBytes!
|
||||
: null,
|
||||
),
|
||||
],
|
||||
));
|
||||
},
|
||||
),
|
||||
),
|
||||
if (data.value.statusID != "1" &&
|
||||
data.value.statusID != "2")
|
||||
Container(
|
||||
margin: EdgeInsets.symmetric(vertical: 24),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: CustomButtonWhite(
|
||||
btnText: "Reject",
|
||||
onPressed: () {
|
||||
ApprovalDialogConfirmation(
|
||||
context: context,
|
||||
typename: "presensi ",
|
||||
textInformation: "menolak ",
|
||||
staffName: data.value.name ?? "",
|
||||
confirmFunc: () {});
|
||||
}),
|
||||
),
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 24),
|
||||
),
|
||||
Expanded(
|
||||
child: CustomButtonOrange(
|
||||
btnText: "Approve",
|
||||
onPressed: () {
|
||||
ApprovalDialogConfirmation(
|
||||
context: context,
|
||||
typename: "presensi ",
|
||||
textInformation: "menyetujui ",
|
||||
staffName: data.value.name ?? "",
|
||||
confirmFunc: () {});
|
||||
}),
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
));
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user