step 12 : proses absen masuk selfie, absen pulang selfie
This commit is contained in:
@@ -24,6 +24,9 @@ class Constant {
|
||||
static Color textDarkGrey = const Color(0xff637381);
|
||||
static Color bgAddressPresensi = const Color.fromRGBO(241, 90, 41, 0.08);
|
||||
static Color textWhite = Color(0xffFDFDFD);
|
||||
static Color textRed = Color(0xffFF4842);
|
||||
// background upload file
|
||||
static Color bgUploadFile = Color.fromRGBO(207, 207, 207, 0.20);
|
||||
|
||||
// size convertion
|
||||
static double getActualXPhone({
|
||||
@@ -91,6 +94,14 @@ class Constant {
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle titleH2_400({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontFamily: 'Public Sans',
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 12),
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle titlePresensiH2_700({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontFamily: 'Quicksand',
|
||||
|
||||
@@ -46,7 +46,7 @@ class MyApp extends StatelessWidget {
|
||||
),
|
||||
// home: TestMap(),
|
||||
initialRoute: loginRoute,
|
||||
// initialRoute: presensiRoute,
|
||||
// initialRoute: presensiSelfieRoute,
|
||||
// initialRoute: testFlutterMapRoute,
|
||||
onGenerateRoute: AppRoute.generateRoute,
|
||||
);
|
||||
|
||||
@@ -155,8 +155,10 @@ class HomeScreen extends HookConsumerWidget {
|
||||
ref.read(currentPageProvider.notifier).update((state) => -1);
|
||||
Navigator.pushNamed(context, presensiSelfieRoute);
|
||||
} else {
|
||||
ref.read(currentPageProvider.notifier).update((state) => -1);
|
||||
Navigator.pushNamed(context, presensiRoute);
|
||||
if (varCurrentDistanceProvider?.selfie == "FALSE") {
|
||||
ref.read(currentPageProvider.notifier).update((state) => -1);
|
||||
Navigator.pushNamed(context, presensiRoute);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@@ -507,7 +507,7 @@ class PresensiScreen extends HookConsumerWidget {
|
||||
|
||||
// tombol aksi absen masuk & pulang
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "TRUE" &&
|
||||
varCurrentCheckJamProvider?.isAbsenClockIn == "TRUE") ...[
|
||||
varCurrentCheckJamProvider?.isAbsenClockOut == "TRUE") ...[
|
||||
SizedBox.shrink()
|
||||
] else ...[
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "FALSE" &&
|
||||
|
||||
@@ -1,12 +1,480 @@
|
||||
import 'dart:convert';
|
||||
import 'dart:io';
|
||||
|
||||
import 'package:absensi_sas_flutter/screen/presensi/presensi_clock_in_provider.dart';
|
||||
import 'package:absensi_sas_flutter/screen/presensi/presensi_clock_out_provider.dart';
|
||||
import 'package:absensi_sas_flutter/widget/custom_drawer.dart';
|
||||
import 'package:file_picker/file_picker.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:geocoding/geocoding.dart';
|
||||
import 'package:geolocator/geolocator.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:image_picker/image_picker.dart';
|
||||
import 'package:mobkit_dashed_border/mobkit_dashed_border.dart';
|
||||
import 'package:permission_handler/permission_handler.dart';
|
||||
|
||||
import '../../app/constant.dart';
|
||||
import '../../app/route.dart';
|
||||
import '../../provider/current_check_distance_provider.dart';
|
||||
import '../../provider/current_check_jam_presensi_provider.dart';
|
||||
import '../../provider/current_user_provider.dart';
|
||||
import '../../widget/real_date.dart';
|
||||
import '../../widget/real_time.dart';
|
||||
import '../../widget/sankbar_widget.dart';
|
||||
import 'check_distance_provider.dart';
|
||||
import 'check_presensi_jam_provider.dart';
|
||||
import 'presensi_selfie_upload_area.dart';
|
||||
import 'dart:io' as io;
|
||||
|
||||
class PresensiSelfieScreen extends StatelessWidget {
|
||||
class PresensiSelfieScreen extends HookConsumerWidget {
|
||||
const PresensiSelfieScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final currentAddressUserLocation = useState<String>("");
|
||||
final isLoadingAddressUserLocation = useState<bool>(false);
|
||||
final isLoadingProsesCheckDistance = useState<bool>(false);
|
||||
final varCurrentDistanceProvider = ref.watch(currentCheckDistanceProvider);
|
||||
final varCurrentCheckJamProvider =
|
||||
ref.watch(currentCheckJamPresensiProvider);
|
||||
final selectedUser = ref.watch(currentUserProvider);
|
||||
|
||||
final positionLatitude = useState<String>("");
|
||||
final positionLongitude = useState<String>("");
|
||||
// final tTransactionCurrentDistance = useState<String>("NULL");
|
||||
|
||||
final fileData = useState<XFile?>(null);
|
||||
final fileDataBase64 = useState<String>("");
|
||||
final isImage = useState(false);
|
||||
final fileEkstension = useState("");
|
||||
final fileSize = useState(0);
|
||||
final fileName = useState("");
|
||||
|
||||
getBase64() async {
|
||||
// List<int> imageBytes = await fileData.value?.readAsBytes();
|
||||
if (fileData.value != null) {
|
||||
final bytes = io.File(fileData.value!.path).readAsBytesSync();
|
||||
String base64Image = base64Encode(await fileData.value!.readAsBytes());
|
||||
fileDataBase64.value = base64Image;
|
||||
final file = File(fileData.value!.path);
|
||||
|
||||
print(file.lengthSync() / 1000000);
|
||||
print(await fileData.value!.length());
|
||||
fileSize.value = await fileData.value!.length();
|
||||
|
||||
// await getExternalStorageDirectory();
|
||||
// print(await fileData.value!.saveTo(path));
|
||||
print(fileDataBase64.value);
|
||||
}
|
||||
}
|
||||
|
||||
final ImagePicker _picker = ImagePicker();
|
||||
pickImage() async {
|
||||
final XFile? pickedFile = await _picker.pickImage(
|
||||
source: ImageSource.camera,
|
||||
// maxWidth set untuk width image
|
||||
maxWidth: 640,
|
||||
// maxHeight set untuk width image
|
||||
maxHeight: 480);
|
||||
if (pickedFile != null) {
|
||||
final tmpFile = FilePickerResult([
|
||||
PlatformFile(
|
||||
name: pickedFile.name,
|
||||
size: await pickedFile.length(),
|
||||
path: pickedFile.path,
|
||||
)
|
||||
]);
|
||||
if (await pickedFile.length() > 10000000) {
|
||||
SanckbarWidget(context, "File tidak boleh lebih dari 10 MB",
|
||||
snackbarType.warning);
|
||||
} else {
|
||||
fileData.value = pickedFile;
|
||||
isImage.value = true;
|
||||
fileEkstension.value = tmpFile.files.single.extension ?? "";
|
||||
DateTime now = new DateTime.now();
|
||||
fileName.value =
|
||||
"IMG-${now.year}${now.month}${now.day}.${tmpFile.files.single.extension ?? ''}";
|
||||
}
|
||||
|
||||
// final Directory appDocumentsDir =
|
||||
// await getApplicationDocumentsDirectory();
|
||||
// print(appDocumentsDir);
|
||||
// await pickedFile!.saveTo(appDocumentsDir.path);
|
||||
await getBase64();
|
||||
}
|
||||
}
|
||||
|
||||
browseImage() async {
|
||||
final XFile? pickedFile = await _picker.pickImage(
|
||||
source: ImageSource.gallery,
|
||||
);
|
||||
fileData.value = pickedFile;
|
||||
getBase64();
|
||||
}
|
||||
|
||||
pickFile() async {
|
||||
List<String> imgExt = [
|
||||
'jpg',
|
||||
'png',
|
||||
'jpeg',
|
||||
];
|
||||
FilePickerResult? result = await FilePicker.platform.pickFiles(
|
||||
allowMultiple: false,
|
||||
type: FileType.custom,
|
||||
dialogTitle: "Pick a file",
|
||||
allowedExtensions: [
|
||||
...imgExt,
|
||||
'pdf',
|
||||
'doc',
|
||||
'docx',
|
||||
'xls',
|
||||
'xlsx',
|
||||
'ppt',
|
||||
'pptx',
|
||||
'txt'
|
||||
],
|
||||
);
|
||||
|
||||
if (result != null) {
|
||||
if (result.files.single.size > 10000000) {
|
||||
SanckbarWidget(context, "File tidak boleh lebih dari 10 MB",
|
||||
snackbarType.warning);
|
||||
} else {
|
||||
// File files = File(result.files.single.path!);
|
||||
print(result.files.single.extension);
|
||||
XFile fl = XFile(result.files.single.path!);
|
||||
fileName.value = result.files.single.name;
|
||||
|
||||
isImage.value = imgExt.contains(result.files.single.extension);
|
||||
|
||||
print(result.files.single.name);
|
||||
fileData.value = fl;
|
||||
await getBase64();
|
||||
fileEkstension.value = result.files.single.extension ?? "";
|
||||
}
|
||||
} else {
|
||||
// User canceled the picker
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> getAddressFromLocation() async {
|
||||
try {
|
||||
isLoadingAddressUserLocation.value = true;
|
||||
// Mendapatkan posisi pengguna
|
||||
LocationPermission permission = await Geolocator.requestPermission();
|
||||
|
||||
if (permission == LocationPermission.denied) {
|
||||
isLoadingAddressUserLocation.value = false;
|
||||
SanckbarWidget(context, 'Izin lokasi ditolak', snackbarType.error);
|
||||
// Handle jika pengguna menolak izin lokasi
|
||||
print("Izin lokasi ditolak");
|
||||
return;
|
||||
}
|
||||
|
||||
Position position = await Geolocator.getCurrentPosition(
|
||||
desiredAccuracy: LocationAccuracy.high);
|
||||
|
||||
// Mendapatkan alamat dari posisi
|
||||
List<Placemark> placemarks = await placemarkFromCoordinates(
|
||||
position.latitude, position.longitude);
|
||||
|
||||
if (positionLongitude.value.isEmpty && positionLatitude.value.isEmpty) {
|
||||
if (placemarks.isNotEmpty) {
|
||||
isLoadingAddressUserLocation.value = false;
|
||||
Placemark placemark = placemarks.first;
|
||||
// String address =
|
||||
// "${placemark.thoroughfare}, ${placemark.locality}, ${placemark.administrativeArea}, ${placemark.country},";
|
||||
|
||||
String address =
|
||||
"${placemark.street}, ${placemark.subLocality}, ${placemark.subAdministrativeArea}, ${placemark.postalCode}";
|
||||
print("Alamat: $address");
|
||||
|
||||
positionLatitude.value = position.latitude.toString();
|
||||
positionLongitude.value = position.longitude.toString();
|
||||
|
||||
if (address != "") {
|
||||
currentAddressUserLocation.value = address;
|
||||
}
|
||||
} else {
|
||||
isLoadingAddressUserLocation.value = false;
|
||||
SanckbarWidget(
|
||||
context, 'Tidak dapat menemukan alamat.', snackbarType.error);
|
||||
print("Tidak dapat menemukan alamat.");
|
||||
}
|
||||
} else {
|
||||
// jika sudah dapat latitude dan logitude baru panggil check distance provider
|
||||
if (positionLatitude.value.isNotEmpty &&
|
||||
positionLongitude.value.isNotEmpty) {
|
||||
print('check distance provider');
|
||||
|
||||
// panggil check distance provider
|
||||
ref.read(checkDistanceProvider.notifier).checkDistance(
|
||||
selectedUser?.model.staffId ?? "",
|
||||
selectedUser?.model.companyId ?? "",
|
||||
positionLatitude.value,
|
||||
positionLongitude.value,
|
||||
);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
print("Error: $e");
|
||||
isLoadingAddressUserLocation.value = false;
|
||||
SanckbarWidget(context, 'Error : $e', snackbarType.error);
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> requestLocationPermission() async {
|
||||
var status = await Permission.location.request();
|
||||
isLoadingAddressUserLocation.value = true;
|
||||
if (status.isGranted) {
|
||||
// Izin diberikan, lanjutkan dengan mendapatkan lokasi
|
||||
getAddressFromLocation();
|
||||
} else {
|
||||
isLoadingAddressUserLocation.value = false;
|
||||
// Izin ditolak, berikan pemberitahuan atau instruksi
|
||||
// print('Izin lokasi ditolak');
|
||||
SanckbarWidget(context, 'Izin Ditolak', snackbarType.error);
|
||||
}
|
||||
}
|
||||
|
||||
// check distance provider
|
||||
ref.listen(checkDistanceProvider, (prev, next) {
|
||||
print('status check distance ' + next.toString());
|
||||
if (next is CheckDistanceStateLoading) {
|
||||
isLoadingProsesCheckDistance.value = true;
|
||||
} else if (next is CheckDistanceStateError) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
SanckbarWidget(context, next.message, snackbarType.warning);
|
||||
} else if (next is CheckDistanceStateDone) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
|
||||
// tTransactionCurrentDistance.value =
|
||||
// varCurrentDistanceProvider?.currentDistance ?? "";
|
||||
|
||||
// print("distance XXX : "+tTransactionCurrentDistance.value);
|
||||
|
||||
if (varCurrentDistanceProvider?.selfie == "FALSE") {
|
||||
Navigator.pushNamed(context, presensiRoute);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// check jam presensi
|
||||
ref.listen(checkPresensiJamProvider, (prev, next) {
|
||||
if (next is CheckPresensiJamStateLoading) {
|
||||
isLoadingProsesCheckDistance.value = true;
|
||||
} else if (next is CheckPresensiJamStateError) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
SanckbarWidget(
|
||||
context, "Error : " + next.toString(), snackbarType.warning);
|
||||
} else if (next is CheckPresensiJamStateDone) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
}
|
||||
});
|
||||
|
||||
// proses presensi clock in
|
||||
ref.listen(presensiClockInProvider, (prev, next) {
|
||||
if (next is PresensiClockInStateLoading) {
|
||||
isLoadingProsesCheckDistance.value = true;
|
||||
} else if (next is PresensiClockInStateError) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
SanckbarWidget(
|
||||
context, "Error : " + next.toString(), snackbarType.warning);
|
||||
} else if (next is PresensiClockInStateDone) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
if (next.model == "OK") {
|
||||
SanckbarWidget(context, "Berhasil Absen Masuk", snackbarType.success);
|
||||
requestLocationPermission();
|
||||
}
|
||||
// else{
|
||||
// if(next.model == "WARNING"){
|
||||
// SanckbarWidget(context, "Berhasil Absen Masuk", snackbarType.success);
|
||||
// }
|
||||
// }
|
||||
}
|
||||
});
|
||||
|
||||
// proses presensi clock in
|
||||
ref.listen(presensiClockOutProvider, (prev, next) {
|
||||
if (next is PresensiClockOutStateLoading) {
|
||||
isLoadingProsesCheckDistance.value = true;
|
||||
} else if (next is PresensiClockOutStateError) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
SanckbarWidget(
|
||||
context, "Error : " + next.toString(), snackbarType.warning);
|
||||
} else if (next is PresensiClockOutStateDone) {
|
||||
isLoadingProsesCheckDistance.value = false;
|
||||
if (next.model == "OK") {
|
||||
SanckbarWidget(
|
||||
context, "Berhasil Absen Pulang", snackbarType.success);
|
||||
requestLocationPermission();
|
||||
}
|
||||
// else{
|
||||
// if(next.model == "WARNING"){
|
||||
// SanckbarWidget(context, "Berhasil Absen Masuk", snackbarType.success);
|
||||
// }
|
||||
// }
|
||||
}
|
||||
});
|
||||
|
||||
useEffect(() {
|
||||
WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
|
||||
final staffID = ref.read(currentUserProvider)?.model.staffId ?? "0";
|
||||
if (staffID == "0") {
|
||||
//not login
|
||||
Navigator.of(context)
|
||||
.pushNamedAndRemoveUntil(loginRoute, (route) => true);
|
||||
|
||||
// Navigator.popAndPushNamed(context, loginRoute);
|
||||
return;
|
||||
}
|
||||
|
||||
// requestLocationPermission();
|
||||
});
|
||||
return () {};
|
||||
}, []);
|
||||
|
||||
useEffect(() {
|
||||
WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
|
||||
requestLocationPermission();
|
||||
});
|
||||
return () {};
|
||||
}, []);
|
||||
|
||||
// show konfirmasi dialog
|
||||
Future<void> showConfirmationDialog(
|
||||
BuildContext context,
|
||||
String T_TransactionM_StaffID,
|
||||
String T_TransactionM_CompanyID,
|
||||
String T_TransactionCurrentLatitude,
|
||||
String T_TransactionCurrentLongitude,
|
||||
String T_TransactionCurrentDistance,
|
||||
String T_TransactionSelfiePhoto,
|
||||
String token,
|
||||
String tipeAbsen,
|
||||
) async {
|
||||
return showDialog(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
return AlertDialog(
|
||||
title: Text('Konfirmasi'),
|
||||
content: Text('Apakah anda yakin untuk melakukan $tipeAbsen?'),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8.0),
|
||||
),
|
||||
actions: <Widget>[
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
if (T_TransactionSelfiePhoto == "") {
|
||||
SanckbarWidget(
|
||||
context,
|
||||
"Silahkan Foto Selfie Terlebih Dahulu",
|
||||
snackbarType.warning);
|
||||
} else {
|
||||
Map<String, dynamic> param = {
|
||||
"T_TransactionM_StaffID": T_TransactionM_StaffID,
|
||||
"T_TransactionM_CompanyID": T_TransactionM_CompanyID,
|
||||
"T_TransactionCurrentLatitude":
|
||||
T_TransactionCurrentLatitude,
|
||||
"T_TransactionCurrentLongitude":
|
||||
T_TransactionCurrentLongitude,
|
||||
"T_TransactionCurrentDistance":
|
||||
T_TransactionCurrentDistance,
|
||||
"T_TransactionSelfiePhoto": "data:image/jpeg;base64,$T_TransactionSelfiePhoto",
|
||||
"token": token,
|
||||
"isSelfie": "TRUE"
|
||||
};
|
||||
// print(param);
|
||||
|
||||
if (tipeAbsen == "Clock In") {
|
||||
ref
|
||||
.read(presensiClockInProvider.notifier)
|
||||
.presensiClockIn(
|
||||
T_TransactionM_StaffID,
|
||||
T_TransactionM_CompanyID,
|
||||
T_TransactionCurrentLatitude,
|
||||
T_TransactionCurrentLongitude,
|
||||
T_TransactionCurrentDistance,
|
||||
T_TransactionSelfiePhoto,
|
||||
token,
|
||||
"FALSE",
|
||||
param,
|
||||
);
|
||||
Navigator.of(context).pop();
|
||||
} else {
|
||||
if (tipeAbsen == "Clock Out") {
|
||||
ref
|
||||
.read(presensiClockOutProvider.notifier)
|
||||
.presensiClockOut(
|
||||
T_TransactionM_StaffID,
|
||||
T_TransactionM_CompanyID,
|
||||
T_TransactionCurrentLatitude,
|
||||
T_TransactionCurrentLongitude,
|
||||
T_TransactionCurrentDistance,
|
||||
T_TransactionSelfiePhoto,
|
||||
token,
|
||||
"FALSE",
|
||||
param,
|
||||
);
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
child: Text(
|
||||
'Yakin',
|
||||
style: Constant.logintitle_700(context: context).copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Constant.textWhite,
|
||||
),
|
||||
),
|
||||
style: ButtonStyle(
|
||||
backgroundColor: MaterialStateColor.resolveWith(
|
||||
(st) => Constant.textOrange),
|
||||
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
|
||||
RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
side: BorderSide(
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
),
|
||||
shadowColor: MaterialStateProperty.all(Color(0xffff48423d)),
|
||||
elevation: MaterialStateProperty.all(4.0),
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () {
|
||||
Navigator.of(context).pop(); // Tutup dialog
|
||||
},
|
||||
style: ButtonStyle(
|
||||
backgroundColor: MaterialStateColor.resolveWith(
|
||||
(st) => Constant.textWhite),
|
||||
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
|
||||
RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
side: BorderSide(
|
||||
color: Constant.textBlack,
|
||||
),
|
||||
),
|
||||
),
|
||||
shadowColor: MaterialStateProperty.all(Color(0xffff48423d)),
|
||||
elevation: MaterialStateProperty.all(4.0),
|
||||
),
|
||||
child: Text(
|
||||
'Batal',
|
||||
style: TextStyle(
|
||||
color: Constant.textTrueBlack,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constant.getActualYPhone(context: context, y: 30),
|
||||
@@ -15,7 +483,7 @@ class PresensiSelfieScreen extends StatelessWidget {
|
||||
appBar: AppBar(
|
||||
title: Text(
|
||||
// 'Home Screen',
|
||||
'Presensi',
|
||||
'Presensi Selfie',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: Constant.textBlack,
|
||||
@@ -28,6 +496,7 @@ class PresensiSelfieScreen extends StatelessWidget {
|
||||
// elevation: 1.0,
|
||||
elevation: 0.5,
|
||||
),
|
||||
drawer: CustomDrawer(),
|
||||
body: SafeArea(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
@@ -37,8 +506,442 @@ class PresensiSelfieScreen extends StatelessWidget {
|
||||
),
|
||||
child: Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 390),
|
||||
height: 100,
|
||||
color: Colors.green,
|
||||
// height: Constant.getActualYPhone(context: context, y: 844),
|
||||
height: MediaQuery.of(context).size.height,
|
||||
child: Column(
|
||||
children: [
|
||||
// Text(ref.watch(currentCheckDistanceProvider)?.currentDistance ?? "NULL"),
|
||||
// Spacer(),
|
||||
// tanggal sekarang
|
||||
RealTimeFormattedDate(),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 8),
|
||||
),
|
||||
// jam sekarang
|
||||
RealTimeClock(),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 24),
|
||||
),
|
||||
|
||||
// address dan refresh
|
||||
Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 350),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
color: Constant.bgAddressPresensi,
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(context: context, x: 12),
|
||||
right:
|
||||
Constant.getActualXPhone(context: context, x: 12),
|
||||
top: Constant.getActualYPhone(context: context, y: 12),
|
||||
bottom:
|
||||
Constant.getActualYPhone(context: context, y: 12),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
// Bagian kiri
|
||||
Padding(
|
||||
padding: EdgeInsets.only(left: 12, right: 8),
|
||||
child: Column(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.location_on_outlined,
|
||||
color: Constant.textDarkGrey,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Bagian tengah
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 8),
|
||||
child: Column(
|
||||
children: [
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: Text(
|
||||
// 'Perumahan Grand House of Klodran No. 5, Klodran, Kec. Colomadu, Kabupaten Karanganyar, Jawa Tengah 57172',
|
||||
currentAddressUserLocation.value,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
maxLines: 10,
|
||||
style: Constant.titleH2_400_12(
|
||||
context: context)
|
||||
.copyWith(
|
||||
color: Constant.textDarkGrey,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Bagian kanan
|
||||
Padding(
|
||||
padding: EdgeInsets.only(right: 12),
|
||||
child: Column(
|
||||
children: [
|
||||
InkWell(
|
||||
onTap: () async {
|
||||
getAddressFromLocation();
|
||||
// jika sudah dapat latitude dan logitude baru panggil check distance provider
|
||||
if (positionLatitude.value.isNotEmpty &&
|
||||
positionLongitude.value.isNotEmpty) {
|
||||
// panggil check distance provider
|
||||
ref
|
||||
.read(checkDistanceProvider.notifier)
|
||||
.checkDistance(
|
||||
selectedUser?.model.staffId ?? "",
|
||||
selectedUser?.model.companyId ?? "",
|
||||
positionLatitude.value,
|
||||
positionLongitude.value,
|
||||
);
|
||||
}
|
||||
},
|
||||
child: Container(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 36),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 36),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
child: Image.asset(
|
||||
'images/sync_white.png', // Path gambar untuk "Refresh"
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 20),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 6),
|
||||
),
|
||||
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left:
|
||||
Constant.getActualXPhone(context: context, x: 12)),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width:
|
||||
Constant.getActualXPhone(context: context, x: 16),
|
||||
height:
|
||||
Constant.getActualYPhone(context: context, y: 16),
|
||||
decoration: BoxDecoration(
|
||||
image: DecorationImage(
|
||||
// fit: BoxFit.cover,
|
||||
image: AssetImage(
|
||||
'images/warning_selfie.png'), // Ganti dengan path gambar Anda
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width:
|
||||
Constant.getActualXPhone(context: context, x: 4),
|
||||
),
|
||||
Text(
|
||||
'Anda berada diluar kantor, silahkan ajukan approval ',
|
||||
style:
|
||||
Constant.titleH2_400(context: context).copyWith(
|
||||
color: Constant.textRed,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(context: context, y: 28),
|
||||
),
|
||||
|
||||
// upload file
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "TRUE" &&
|
||||
varCurrentCheckJamProvider?.isAbsenClockOut == "TRUE") ...[
|
||||
SizedBox.shrink()
|
||||
] else ...[
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "FALSE" &&
|
||||
varCurrentCheckJamProvider?.jamClockIn == "") ...[
|
||||
// gambar icon presensi clock in
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: PresensiSelfieUploadAreaWidget(
|
||||
isLoading: isLoadingAddressUserLocation,
|
||||
isImage: isImage,
|
||||
fileData: fileData,
|
||||
fileDataBase64: fileDataBase64,
|
||||
pickFile: pickFile,
|
||||
pickImage: pickImage,
|
||||
),
|
||||
] else ...[
|
||||
// gambar icon presensi clock out
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn ==
|
||||
"TRUE" &&
|
||||
varCurrentCheckJamProvider?.jamClockIn != "") ...[
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: PresensiSelfieUploadAreaWidget(
|
||||
isLoading: isLoadingAddressUserLocation,
|
||||
isImage: isImage,
|
||||
fileData: fileData,
|
||||
fileDataBase64: fileDataBase64,
|
||||
pickFile: pickFile,
|
||||
pickImage: pickImage,
|
||||
),
|
||||
]
|
||||
],
|
||||
],
|
||||
|
||||
Spacer(),
|
||||
|
||||
// button clock in dan clock out
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "TRUE" &&
|
||||
varCurrentCheckJamProvider?.isAbsenClockOut == "TRUE") ...[
|
||||
SizedBox.shrink()
|
||||
] else ...[
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn == "FALSE" &&
|
||||
varCurrentCheckJamProvider?.jamClockIn == "") ...[
|
||||
// gambar icon presensi clock in
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
top: Constant.getActualYPhone(
|
||||
context: context, y: 24),
|
||||
bottom: Constant.getActualYPhone(
|
||||
context: context, y: 24),
|
||||
),
|
||||
child: SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 390),
|
||||
// height:
|
||||
// Constant.getActualYPhone(context: context, y: 50),
|
||||
child: ElevatedButton(
|
||||
// onPressed: () {
|
||||
// Navigator.of(context).pushNamed(homeRoute);
|
||||
// },
|
||||
onPressed: () {
|
||||
final T_TransactionM_StaffID =
|
||||
selectedUser?.model.staffId ?? "";
|
||||
final T_TransactionM_CompanyID =
|
||||
selectedUser?.model.companyId ?? "";
|
||||
final T_TransactionCurrentLatitude =
|
||||
positionLatitude.value;
|
||||
final T_TransactionCurrentLongitude =
|
||||
positionLongitude.value;
|
||||
final T_TransactionCurrentDistance =
|
||||
varCurrentDistanceProvider
|
||||
?.currentDistance ??
|
||||
"";
|
||||
final T_TransactionSelfiePhoto =
|
||||
fileDataBase64.value;
|
||||
final token = selectedUser?.token ?? "";
|
||||
|
||||
showConfirmationDialog(
|
||||
context,
|
||||
T_TransactionM_StaffID,
|
||||
T_TransactionM_CompanyID,
|
||||
T_TransactionCurrentLatitude,
|
||||
T_TransactionCurrentLongitude,
|
||||
T_TransactionCurrentDistance,
|
||||
T_TransactionSelfiePhoto,
|
||||
token,
|
||||
"Clock In");
|
||||
|
||||
// print(
|
||||
// fileDataBase64.value,
|
||||
// );
|
||||
},
|
||||
style: ButtonStyle(
|
||||
backgroundColor:
|
||||
MaterialStateColor.resolveWith(
|
||||
(st) => Constant.textOrange),
|
||||
shape: MaterialStateProperty.all<
|
||||
RoundedRectangleBorder>(
|
||||
RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
side: BorderSide(
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
),
|
||||
shadowColor: MaterialStateProperty.all(
|
||||
Color(0xffff48423d)),
|
||||
elevation: MaterialStateProperty.all(4.0),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 24),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 32),
|
||||
child: Center(
|
||||
child:
|
||||
CircularProgressIndicator(
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
)
|
||||
: Align(
|
||||
alignment: Alignment.center,
|
||||
child: Text(
|
||||
'Clock In',
|
||||
style: Constant.titleH1_500_18(
|
||||
context: context)
|
||||
.copyWith(
|
||||
color: Constant.textWhite,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
] else ...[
|
||||
// gambar icon presensi clock out
|
||||
if (varCurrentCheckJamProvider?.isAbsenClockIn ==
|
||||
"TRUE" &&
|
||||
varCurrentCheckJamProvider?.jamClockIn != "") ...[
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? Center(
|
||||
child: CircularProgressIndicator(),
|
||||
)
|
||||
: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context, x: 20),
|
||||
top: Constant.getActualYPhone(
|
||||
context: context, y: 24),
|
||||
bottom: Constant.getActualYPhone(
|
||||
context: context, y: 24),
|
||||
),
|
||||
child: SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 390),
|
||||
// height:
|
||||
// Constant.getActualYPhone(context: context, y: 50),
|
||||
child: ElevatedButton(
|
||||
// onPressed: () {
|
||||
// Navigator.of(context).pushNamed(homeRoute);
|
||||
// },
|
||||
onPressed: () {
|
||||
final T_TransactionM_StaffID =
|
||||
selectedUser?.model.staffId ?? "";
|
||||
final T_TransactionM_CompanyID =
|
||||
selectedUser?.model.companyId ?? "";
|
||||
final T_TransactionCurrentLatitude =
|
||||
positionLatitude.value;
|
||||
final T_TransactionCurrentLongitude =
|
||||
positionLongitude.value;
|
||||
final T_TransactionCurrentDistance =
|
||||
varCurrentDistanceProvider
|
||||
?.currentDistance ??
|
||||
"";
|
||||
final T_TransactionSelfiePhoto =
|
||||
fileDataBase64.value;
|
||||
final token = selectedUser?.token ?? "";
|
||||
|
||||
showConfirmationDialog(
|
||||
context,
|
||||
T_TransactionM_StaffID,
|
||||
T_TransactionM_CompanyID,
|
||||
T_TransactionCurrentLatitude,
|
||||
T_TransactionCurrentLongitude,
|
||||
T_TransactionCurrentDistance,
|
||||
T_TransactionSelfiePhoto,
|
||||
token,
|
||||
"Clock Out");
|
||||
// print(
|
||||
// fileDataBase64.value,
|
||||
// );
|
||||
},
|
||||
style: ButtonStyle(
|
||||
backgroundColor:
|
||||
MaterialStateColor.resolveWith(
|
||||
(st) => Constant.textOrange),
|
||||
shape: MaterialStateProperty.all<
|
||||
RoundedRectangleBorder>(
|
||||
RoundedRectangleBorder(
|
||||
borderRadius:
|
||||
BorderRadius.circular(8),
|
||||
side: BorderSide(
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
),
|
||||
shadowColor: MaterialStateProperty.all(
|
||||
Color(0xffff48423d)),
|
||||
elevation: MaterialStateProperty.all(4.0),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
(isLoadingAddressUserLocation.value)
|
||||
? SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context, x: 24),
|
||||
height:
|
||||
Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 32),
|
||||
child: Center(
|
||||
child:
|
||||
CircularProgressIndicator(
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
)
|
||||
: Align(
|
||||
alignment: Alignment.center,
|
||||
child: Text(
|
||||
'Clock Out',
|
||||
style:
|
||||
Constant.titleH1_500_18(
|
||||
context: context)
|
||||
.copyWith(
|
||||
color: Constant.textWhite,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
]
|
||||
],
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
181
lib/screen/presensi/presensi_selfie_upload_area.dart
Normal file
181
lib/screen/presensi/presensi_selfie_upload_area.dart
Normal file
@@ -0,0 +1,181 @@
|
||||
import 'dart:io';
|
||||
|
||||
import '../../app/constant.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:image_picker/image_picker.dart';
|
||||
import 'package:mime/mime.dart';
|
||||
|
||||
class PresensiSelfieUploadAreaWidget extends StatelessWidget {
|
||||
const PresensiSelfieUploadAreaWidget({
|
||||
super.key,
|
||||
required this.isImage,
|
||||
required this.fileData,
|
||||
required this.fileDataBase64,
|
||||
required this.pickFile,
|
||||
required this.pickImage,
|
||||
required this.isLoading,
|
||||
});
|
||||
|
||||
final ValueNotifier<bool> isImage;
|
||||
final ValueNotifier<bool> isLoading;
|
||||
final ValueNotifier<XFile?> fileData;
|
||||
final ValueNotifier<String> fileDataBase64;
|
||||
final Function pickImage;
|
||||
final Function pickFile;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return InkWell(
|
||||
onTap: !isLoading.value
|
||||
? () {
|
||||
showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (context) {
|
||||
return Container(
|
||||
height: Constant.getActualYPhone(context: context, y: 200),
|
||||
padding: EdgeInsets.all(20),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
// Column(
|
||||
// children: [
|
||||
// IconButton(
|
||||
// onPressed: () {
|
||||
// Navigator.pop(context);
|
||||
// pickFile();
|
||||
// },
|
||||
// icon: Icon(
|
||||
// Icons.folder_copy_rounded,
|
||||
// size: 50,
|
||||
// color: Constant.textOrange,
|
||||
// )),
|
||||
// Text(
|
||||
// "Browse a file",
|
||||
// style: Constant.titleH2_400_12(context: context)
|
||||
// .copyWith(
|
||||
// fontWeight: FontWeight.w600,
|
||||
// color: Constant.textBlack,
|
||||
// ),
|
||||
// )
|
||||
// ],
|
||||
// ),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
Navigator.pop(context);
|
||||
pickImage();
|
||||
},
|
||||
icon: Icon(
|
||||
Icons.add_a_photo_rounded,
|
||||
size: 50,
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: 10),
|
||||
),
|
||||
Text(
|
||||
"Take a picture",
|
||||
style: Constant.titleH2_400_12(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Constant.textBlack,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
: null,
|
||||
child: Stack(
|
||||
alignment: AlignmentDirectional.topEnd,
|
||||
children: [
|
||||
Container(
|
||||
width: Constant.getActualXPhone(context: context, x: 390),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context, y: isImage.value ? 200 : 83),
|
||||
decoration: BoxDecoration(color: Constant.bgUploadFile),
|
||||
child: Builder(builder: (context) {
|
||||
final String? mime = lookupMimeType(fileData.value?.path ?? "");
|
||||
return Semantics(
|
||||
label: 'image_picker_example_picked_image',
|
||||
child: (mime != null
|
||||
? (mime.startsWith('image/'))
|
||||
? Image.file(
|
||||
// image: AssetImage(photo.value!.path),
|
||||
File(fileData.value!.path),
|
||||
frameBuilder: (context, child, frame,
|
||||
wasSynchronouslyLoaded) {
|
||||
return (wasSynchronouslyLoaded)
|
||||
? Center(
|
||||
child: Text("Loadinga"),
|
||||
)
|
||||
: Container(
|
||||
child: child,
|
||||
);
|
||||
},
|
||||
errorBuilder: (BuildContext context, Object error,
|
||||
StackTrace? stackTrace) {
|
||||
return const Center(
|
||||
child: Text(
|
||||
'This image type is not supported'));
|
||||
},
|
||||
)
|
||||
: Container(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.file_present_rounded,
|
||||
size: 40,
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
Text(
|
||||
fileData.value?.name ?? '',
|
||||
style:
|
||||
Constant.titleH2_400(context: context),
|
||||
)
|
||||
],
|
||||
),
|
||||
)
|
||||
: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.upload_outlined,
|
||||
color: Constant.textOrange,
|
||||
),
|
||||
Text(
|
||||
'Upload File',
|
||||
style: Constant.titleH2_400_12(context: context)
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Constant.textOrange),
|
||||
)
|
||||
],
|
||||
)));
|
||||
}),
|
||||
),
|
||||
if (fileData.value != null && !isLoading.value)
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
fileData.value = null;
|
||||
fileDataBase64.value = '';
|
||||
isImage.value = false;
|
||||
},
|
||||
icon: Icon(Icons.cancel_outlined)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user