admin/imexmobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Package updates & minor fixes.

Browse Source
This commit is contained in:
Patrick Fic
2021-03-09 14:10:26 -08:00
parent 2759c3322b
commit d3b3436a93
9 changed files with 9480 additions and 29528 deletions
Download Patch File Download Diff File Expand all files Collapse all files

196
components/camera-controls/camera-controls.component.jsx
View File

@@ -1,103 +1,103 @@
// src/toolbar.component.js file // // src/toolbar.component.js file
import { Ionicons } from "@expo/vector-icons"; // import { Ionicons } from "@expo/vector-icons";
import { Camera } from "expo-camera"; // import { Camera } from "expo-camera";
import React from "react"; // import React from "react";
import { // import {
StyleSheet, // StyleSheet,
TouchableOpacity, // TouchableOpacity,
TouchableWithoutFeedback, // TouchableWithoutFeedback,
View, // View,
} from "react-native"; // } from "react-native";
const styles = StyleSheet.create({ // const styles = StyleSheet.create({
alignCenter: { // alignCenter: {
flex: 1, // flex: 1,
alignItems: "center", // alignItems: "center",
justifyContent: "center", // justifyContent: "center",
}, // },
bottomToolbar: { // bottomToolbar: {
marginTop: "auto", // marginTop: "auto",
height: 100, // height: 100,
display: "flex", // display: "flex",
justifyContent: "space-evenly", // justifyContent: "space-evenly",
alignItems: "center", // alignItems: "center",
flexDirection: "row", // flexDirection: "row",
}, // },
captureBtn: { // captureBtn: {
width: 60, // width: 60,
height: 60, // height: 60,
borderWidth: 2, // borderWidth: 2,
borderRadius: 60, // borderRadius: 60,
borderColor: "#FFFFFF", // borderColor: "#FFFFFF",
}, // },
captureBtnActive: { // captureBtnActive: {
width: 80, // width: 80,
height: 80, // height: 80,
}, // },
captureBtnInternal: { // captureBtnInternal: {
width: 76, // width: 76,
height: 76, // height: 76,
borderWidth: 2, // borderWidth: 2,
borderRadius: 76, // borderRadius: 76,
backgroundColor: "red", // backgroundColor: "red",
borderColor: "transparent", // borderColor: "transparent",
}, // },
}); // });
const { FlashMode: CameraFlashModes, Type: CameraTypes } = Camera.Constants; // const { FlashMode: CameraFlashModes, Type: CameraTypes } = Camera.Constants;
export default function CameraControls({ // export default function CameraControls({
capturing = false, // capturing = false,
cameraType = CameraTypes.back, // cameraType = CameraTypes.back,
flashMode = CameraFlashModes.off, // flashMode = CameraFlashModes.off,
setFlashMode, // setFlashMode,
setCameraType, // setCameraType,
onCaptureIn, // onCaptureIn,
onCaptureOut, // onCaptureOut,
onLongCapture, // onLongCapture,
onShortCapture, // onShortCapture,
}) { // }) {
return ( // return (
<View style={styles.bottomToolbar}> // <View style={styles.bottomToolbar}>
<TouchableOpacity // <TouchableOpacity
onPress={() => // onPress={() =>
setFlashMode( // setFlashMode(
flashMode === CameraFlashModes.on // flashMode === CameraFlashModes.on
? CameraFlashModes.off // ? CameraFlashModes.off
: CameraFlashModes.on // : CameraFlashModes.on
) // )
} // }
> // >
<Ionicons // <Ionicons
name={flashMode == CameraFlashModes.on ? "md-flash" : "md-flash-off"} // name={flashMode == CameraFlashModes.on ? "md-flash" : "md-flash-off"}
color="white" // color="white"
size={30} // size={30}
/> // />
</TouchableOpacity> // </TouchableOpacity>
<TouchableWithoutFeedback // <TouchableWithoutFeedback
onPressIn={onCaptureIn} // onPressIn={onCaptureIn}
onPressOut={onCaptureOut} // onPressOut={onCaptureOut}
onLongPress={onLongCapture} // onLongPress={onLongCapture}
onPress={onShortCapture} // onPress={onShortCapture}
disabled={capturing} // disabled={capturing}
> // >
<View style={[styles.captureBtn, capturing && styles.captureBtnActive]}> // <View style={[styles.captureBtn, capturing && styles.captureBtnActive]}>
{capturing && <View style={styles.captureBtnInternal} />} // {capturing && <View style={styles.captureBtnInternal} />}
</View> // </View>
</TouchableWithoutFeedback> // </TouchableWithoutFeedback>
<TouchableOpacity // <TouchableOpacity
onPress={() => // onPress={() =>
setCameraType( // setCameraType(
cameraType === CameraTypes.back // cameraType === CameraTypes.back
? CameraTypes.front // ? CameraTypes.front
: CameraTypes.back // : CameraTypes.back
) // )
} // }
> // >
<Ionicons name="md-reverse-camera" color="white" size={30} /> // <Ionicons name="md-reverse-camera" color="white" size={30} />
</TouchableOpacity> // </TouchableOpacity>
</View> // </View>
); // );
} // }

53
components/job-list-item/job-list-item.component.jsx
View File

@@ -1,10 +1,9 @@
import { Ionicons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native"; import { useNavigation } from "@react-navigation/native";
import * as ImagePicker from "expo-image-picker";
import { Body, H3, Icon, ListItem, Right } from "native-base"; import { Body, H3, Icon, ListItem, Right } from "native-base";
import React, { useEffect } from "react"; import React from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Animated, Platform, Text } from "react-native"; import { Animated, Text } from "react-native";
import { TouchableOpacity } from "react-native-gesture-handler"; import { TouchableOpacity } from "react-native-gesture-handler";
import Swipeable from "react-native-gesture-handler/Swipeable"; import Swipeable from "react-native-gesture-handler/Swipeable";
import { connect } from "react-redux"; import { connect } from "react-redux";
@@ -24,33 +23,33 @@ export function JobListItem({ setCameraJob, setCameraJobId, item }) {
const { t } = useTranslation(); const { t } = useTranslation();
const navigation = useNavigation(); const navigation = useNavigation();
useEffect(() => { // useEffect(() => {
(async () => { // (async () => {
if (Platform.OS !== "web") { // if (Platform.OS !== "web") {
const { // const {
status, // status,
} = await ImagePicker.requestMediaLibraryPermissionsAsync(); // } = await ImagePicker.requestMediaLibraryPermissionsAsync();
if (status !== "granted") { // if (status !== "granted") {
alert("Sorry, we need camera roll permissions to make this work!"); // alert("Sorry, we need camera roll permissions to make this work!");
} // }
} // }
})(); // })();
}, []); // }, []);
const pickImage = async () => { // const pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({ // let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All, // mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true, // allowsEditing: true,
aspect: [4, 3], // aspect: [4, 3],
quality: 1, // quality: 1,
}); // });
console.log(result); // console.log(result);
if (!result.cancelled) { // if (!result.cancelled) {
// setImage(result.uri); // // setImage(result.uri);
} // }
}; // };
const RenderRightAction = (progress, dragX) => { const RenderRightAction = (progress, dragX) => {
const scale = dragX.interpolate({ const scale = dragX.interpolate({

3
components/job-notes-item/job-notes-item.component.jsx
View File

@@ -11,7 +11,7 @@ export default function NoteListItem({ item }) {
<Text>{item.text}</Text> <Text>{item.text}</Text>
<View <View
style={{ style={{
flexDirection: "row", flexDirection: "column",
alignSelf: "flex-end", alignSelf: "flex-end",
alignItems: "center", alignItems: "center",
}} }}
@@ -32,6 +32,7 @@ export default function NoteListItem({ item }) {
color="tomato" color="tomato"
/> />
)} )}
<Text style={{ fontSize: 12 }}>{item.created_by}</Text>
<Text style={{ fontSize: 12 }}> <Text style={{ fontSize: 12 }}>
{DateTime.fromISO(item.created_at).toLocaleString( {DateTime.fromISO(item.created_at).toLocaleString(
DateTime.DATETIME_SHORT DateTime.DATETIME_SHORT

213
components/screen-camera-roll/screen-camera-roll.component.jsx
View File

@@ -1,213 +0,0 @@
import React, { Component } from "react";
import {
ActivityIndicator,
Button,
Clipboard,
Image,
Share,
StatusBar,
StyleSheet,
Text,
TouchableOpacity,
View,
} from "react-native";
import { Constants } from "expo";
import * as Permissions from "expo-permissions";
import * as ImagePicker from "expo-image-picker";
export default class ScreenCameraRoll extends Component {
state = {
image: null,
uploading: false,
};
render() {
let { image } = this.state;
return (
<View style={styles.container}>
<StatusBar barStyle="default" />
<Text style={styles.exampleText}>
Example: Upload ImagePicker result
</Text>
<Button
onPress={this._pickImage}
title="Pick an image from camera roll"
/>
<Button onPress={this._takePhoto} title="Take a photo" />
{this._maybeRenderImage()}
{this._maybeRenderUploadingOverlay()}
</View>
);
}
_maybeRenderUploadingOverlay = () => {
if (this.state.uploading) {
return (
<View style={[StyleSheet.absoluteFill, styles.maybeRenderUploading]}>
<ActivityIndicator color="#fff" size="large" />
</View>
);
}
};
_maybeRenderImage = () => {
let { image } = this.state;
if (!image) {
return;
}
return (
<View style={styles.maybeRenderContainer}>
<View style={styles.maybeRenderImageContainer}>
<Image source={{ uri: image }} style={styles.maybeRenderImage} />
</View>
<Text
onPress={this._copyToClipboard}
onLongPress={this._share}
style={styles.maybeRenderImageText}
>
{image}
</Text>
</View>
);
};
_share = () => {
Share.share({
message: this.state.image,
title: "Check out this photo",
url: this.state.image,
});
};
_copyToClipboard = () => {
Clipboard.setString(this.state.image);
alert("Copied image URL to clipboard");
};
_takePhoto = async () => {
const { status: cameraPerm } = await Permissions.askAsync(
Permissions.CAMERA
);
const { status: cameraRollPerm } = await Permissions.askAsync(
Permissions.CAMERA_ROLL
);
// only if user allows permission to camera AND camera roll
if (cameraPerm === "granted" && cameraRollPerm === "granted") {
let pickerResult = await ImagePicker.launchCameraAsync({
allowsMultipleSelection: true,
quality: 0.8,
//allowsEditing: true,
aspect: [4, 3],
});
if (!pickerResult.cancelled) {
this.setState({ image: pickerResult.uri });
}
this.uploadImageAsync(pickerResult.uri);
}
};
_pickImage = async () => {
const { status: cameraRollPerm } = await Permissions.askAsync(
Permissions.CAMERA_ROLL
);
// only if user allows permission to camera roll
if (cameraRollPerm === "granted") {
let pickerResult = await ImagePicker.launchImageLibraryAsync({
allowsEditing: true,
base64: true,
aspect: [4, 3],
});
if (!pickerResult.cancelled) {
this.setState({ image: pickerResult.uri });
}
this.uploadImageAsync(pickerResult.uri);
}
};
uploadImageAsync(pictureuri) {
let apiUrl = "http://123.123.123.123/ABC";
var data = new FormData();
data.append("file", {
uri: pictureuri,
name: "file",
type: "image/jpg",
});
fetch(apiUrl, {
headers: {
Accept: "application/json",
"Content-Type": "multipart/form-data",
},
method: "POST",
body: data,
})
.then((response) => {
console.log("succ ");
console.log(response);
})
.catch((err) => {
console.log("err ");
console.log(err);
});
}
}
const styles = StyleSheet.create({
container: {
alignItems: "center",
flex: 1,
justifyContent: "center",
},
exampleText: {
fontSize: 20,
marginBottom: 20,
marginHorizontal: 15,
textAlign: "center",
},
maybeRenderUploading: {
alignItems: "center",
backgroundColor: "rgba(0,0,0,0.4)",
justifyContent: "center",
},
maybeRenderContainer: {
borderRadius: 3,
elevation: 2,
marginTop: 30,
shadowColor: "rgba(0,0,0,1)",
shadowOpacity: 0.2,
shadowOffset: {
height: 4,
width: 4,
},
shadowRadius: 5,
width: 250,
},
maybeRenderImageContainer: {
borderTopLeftRadius: 3,
borderTopRightRadius: 3,
overflow: "hidden",
},
maybeRenderImage: {
height: 250,
width: 250,
},
maybeRenderImageText: {
paddingHorizontal: 10,
paddingVertical: 10,
},
});

280
components/screen-camera/screen-camera.jsx
View File

@@ -1,157 +1,157 @@
import { useFocusEffect } from "@react-navigation/native"; // import { useFocusEffect } from "@react-navigation/native";
import { Camera } from "expo-camera"; // import { Camera } from "expo-camera";
import * as FileSystem from "expo-file-system"; // import * as FileSystem from "expo-file-system";
import React, { useEffect, useRef, useState } from "react"; // import React, { useEffect, useRef, useState } from "react";
import { Text, View } from "react-native"; // import { Text, View } from "react-native";
import { connect } from "react-redux"; // import { connect } from "react-redux";
import { createStructuredSelector } from "reselect"; // import { createStructuredSelector } from "reselect";
import { // import {
selectCurrentCameraJob, // selectCurrentCameraJob,
selectCurrentCameraJobId, // selectCurrentCameraJobId,
} from "../../redux/app/app.selectors"; // } from "../../redux/app/app.selectors";
import { addPhoto } from "../../redux/photos/photos.actions"; // import { addPhoto } from "../../redux/photos/photos.actions";
import CameraControls from "../camera-controls/camera-controls.component"; // import CameraControls from "../camera-controls/camera-controls.component";
import CameraSelectJob from "../camera-select-job/camera-select-job.component"; // import CameraSelectJob from "../camera-select-job/camera-select-job.component";
const mapStateToProps = createStructuredSelector({ // const mapStateToProps = createStructuredSelector({
cameraJobId: selectCurrentCameraJobId, // cameraJobId: selectCurrentCameraJobId,
cameraJob: selectCurrentCameraJob, // cameraJob: selectCurrentCameraJob,
}); // });
const mapDispatchToProps = (dispatch) => ({ // const mapDispatchToProps = (dispatch) => ({
addPhoto: (photo) => dispatch(addPhoto(photo)), // addPhoto: (photo) => dispatch(addPhoto(photo)),
}); // });
export function ScreenCamera({ cameraJobId, addPhoto }) { // export function ScreenCamera({ cameraJobId, addPhoto }) {
const [hasPermission, setHasPermission] = useState(null); // const [hasPermission, setHasPermission] = useState(null);
const [state, setState] = useState({ // const [state, setState] = useState({
flashMode: Camera.Constants.FlashMode.off, // flashMode: Camera.Constants.FlashMode.off,
capturing: null, // capturing: null,
cameraType: Camera.Constants.Type.back, // cameraType: Camera.Constants.Type.back,
tabHasFocus: null, // tabHasFocus: null,
}); // });
const cameraRef = useRef(null); // const cameraRef = useRef(null);
useFocusEffect( // useFocusEffect(
React.useCallback(() => { // React.useCallback(() => {
// Do something when the screen is focused // // Do something when the screen is focused
setState({ ...state, tabHasFocus: true }); // setState({ ...state, tabHasFocus: true });
return () => { // return () => {
// Do something when the screen is unfocused // // Do something when the screen is unfocused
// Useful for cleanup functions // // Useful for cleanup functions
setState({ ...state, tabHasFocus: false }); // setState({ ...state, tabHasFocus: false });
}; // };
}, []) // }, [])
); // );
useEffect(() => { // useEffect(() => {
(async () => { // (async () => {
const { status } = await Camera.requestPermissionsAsync(); // const { status } = await Camera.requestPermissionsAsync();
setHasPermission(status === "granted"); // setHasPermission(status === "granted");
})(); // })();
}, []); // }, []);
const setFlashMode = (flashMode) => setState({ ...state, flashMode }); // const setFlashMode = (flashMode) => setState({ ...state, flashMode });
const setCameraType = (cameraType) => setState({ ...state, cameraType }); // const setCameraType = (cameraType) => setState({ ...state, cameraType });
const handleCaptureIn = () => setState({ ...state, capturing: true }); // const handleCaptureIn = () => setState({ ...state, capturing: true });
const handleCaptureOut = () => { // const handleCaptureOut = () => {
if (state.capturing) cameraRef.current.stopRecording(); // if (state.capturing) cameraRef.current.stopRecording();
}; // };
const handleShortCapture = async () => { // const handleShortCapture = async () => {
if (cameraRef.current) { // if (cameraRef.current) {
const options = { // const options = {
quality: 0.8, // quality: 0.8,
//base64: true, // //base64: true,
skipProcessing: true, // skipProcessing: true,
}; // };
let photo = await cameraRef.current.takePictureAsync(options); // let photo = await cameraRef.current.takePictureAsync(options);
const filename = photo.uri.substring(photo.uri.lastIndexOf("/") + 1); // const filename = photo.uri.substring(photo.uri.lastIndexOf("/") + 1);
const newUri = FileSystem.documentDirectory + "photos/" + filename; // const newUri = FileSystem.documentDirectory + "photos/" + filename;
await FileSystem.moveAsync({ // await FileSystem.moveAsync({
from: photo.uri, // from: photo.uri,
to: newUri, // to: newUri,
}); // });
setState({ ...state, capturing: false }); // setState({ ...state, capturing: false });
addPhoto({ // addPhoto({
...photo, // ...photo,
id: filename, // id: filename,
uri: newUri, // uri: newUri,
jobId: cameraJobId, // jobId: cameraJobId,
video: false, // video: false,
}); // });
} // }
}; // };
const handleLongCapture = async () => { // const handleLongCapture = async () => {
console.log("Taking a video!"); // console.log("Taking a video!");
if (cameraRef.current) { // if (cameraRef.current) {
let video = await cameraRef.current.recordAsync(); // let video = await cameraRef.current.recordAsync();
const filename = video.uri.substring(video.uri.lastIndexOf("/") + 1); // const filename = video.uri.substring(video.uri.lastIndexOf("/") + 1);
const newUri = FileSystem.documentDirectory + "photos/" + filename; // const newUri = FileSystem.documentDirectory + "photos/" + filename;
await FileSystem.moveAsync({ // await FileSystem.moveAsync({
from: video.uri, // from: video.uri,
to: newUri, // to: newUri,
}); // });
setState({ ...state, capturing: false }); // setState({ ...state, capturing: false });
console.log("Adding Photo", { // console.log("Adding Photo", {
...video, // ...video,
id: filename, // id: filename,
uri: newUri, // uri: newUri,
jobId: cameraJobId, // jobId: cameraJobId,
video: true, // video: true,
}); // });
addPhoto({ // addPhoto({
...video, // ...video,
id: filename, // id: filename,
uri: newUri, // uri: newUri,
jobId: cameraJobId, // jobId: cameraJobId,
video: true, // video: true,
}); // });
} // }
}; // };
if (hasPermission === null || !state.tabHasFocus) { // if (hasPermission === null || !state.tabHasFocus) {
return <View />; // return <View />;
} // }
if (hasPermission === false) { // if (hasPermission === false) {
return <Text>No access to camera. Please ensure that you allow it.</Text>; // return <Text>No access to camera. Please ensure that you allow it.</Text>;
} // }
const { flashMode, cameraType, capturing } = state; // const { flashMode, cameraType, capturing } = state;
return ( // return (
<Camera // <Camera
style={{ flex: 1, display: "flex" }} // style={{ flex: 1, display: "flex" }}
type={state.cameraType} // type={state.cameraType}
ref={cameraRef} // ref={cameraRef}
ratio={"16:9"} // ratio={"16:9"}
> // >
<View // <View
style={{ // style={{
flex: 1, // flex: 1,
}} // }}
> // >
<CameraSelectJob /> // <CameraSelectJob />
<CameraControls // <CameraControls
capturing={capturing} // capturing={capturing}
flashMode={flashMode} // flashMode={flashMode}
cameraType={cameraType} // cameraType={cameraType}
setFlashMode={setFlashMode} // setFlashMode={setFlashMode}
setCameraType={setCameraType} // setCameraType={setCameraType}
onCaptureIn={handleCaptureIn} // onCaptureIn={handleCaptureIn}
onCaptureOut={handleCaptureOut} // onCaptureOut={handleCaptureOut}
onLongCapture={handleLongCapture} // onLongCapture={handleLongCapture}
onShortCapture={handleShortCapture} // onShortCapture={handleShortCapture}
/> // />
</View> // </View>
</Camera> // </Camera>
); // );
} // }
export default connect(mapStateToProps, mapDispatchToProps)(ScreenCamera); // export default connect(mapStateToProps, mapDispatchToProps)(ScreenCamera);

36
graphql/jobs.queries.js
View File

@@ -201,16 +201,6 @@ export const GET_JOB_BY_PK = gql`
towing_payable towing_payable
storage_payable storage_payable
adjustment_bottom_line adjustment_bottom_line
federal_tax_rate
state_tax_rate
local_tax_rate
tax_tow_rt
tax_str_rt
tax_paint_mat_rt
tax_sub_rt
tax_lbr_rt
tax_levies_rt
parts_tax_rates
job_totals job_totals
ownr_fn ownr_fn
ownr_ln ownr_ln
@@ -235,30 +225,7 @@ export const GET_JOB_BY_PK = gql`
ownr_ctry ownr_ctry
ownr_ph1 ownr_ph1
} }
labor_rate_desc
rate_la1
rate_la2
rate_la3
rate_la4
rate_laa
rate_lab
rate_lad
rate_lae
rate_laf
rate_lag
rate_lam
rate_lar
rate_las
rate_lau
rate_ma2s
rate_ma2t
rate_ma3s
rate_mabl
rate_macs
rate_mahw
rate_mapa
rate_mash
rate_matd
actual_in actual_in
scheduled_completion scheduled_completion
scheduled_in scheduled_in
@@ -300,6 +267,7 @@ export const GET_JOB_BY_PK = gql`
private private
created_at created_at
updated_at updated_at
created_by
} }
documents(order_by: { created_at: desc }) { documents(order_by: { created_at: desc }) {
id id

29012
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
package.json
View File

@@ -21,10 +21,8 @@
"expo": "^40.0.0", "expo": "^40.0.0",
"expo-app-loading": "^1.0.0", "expo-app-loading": "^1.0.0",
"expo-av": "~8.7.0", "expo-av": "~8.7.0",
"expo-camera": "~9.1.0",
"expo-file-system": "~9.3.0", "expo-file-system": "~9.3.0",
"expo-font": "~8.4.0", "expo-font": "~8.4.0",
"expo-image-picker": "~9.2.0",
"expo-images-picker": "https://github.com/snaptsoft/expo-images-picker/", "expo-images-picker": "https://github.com/snaptsoft/expo-images-picker/",
"expo-localization": "~9.1.0", "expo-localization": "~9.1.0",
"expo-media-library": "~10.0.0", "expo-media-library": "~10.0.0",
@@ -43,7 +41,6 @@
"react-dom": "16.13.1", "react-dom": "16.13.1",
"react-i18next": "^11.8.2", "react-i18next": "^11.8.2",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz", "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-easy-grid": "^0.2.2",
"react-native-gesture-handler": "~1.8.0", "react-native-gesture-handler": "~1.8.0",
"react-native-image-zoom-viewer": "^3.0.1", "react-native-image-zoom-viewer": "^3.0.1",
"react-native-indicators": "^0.17.0", "react-native-indicators": "^0.17.0",

9212
yarn.lock Normal file
View File

File diff suppressed because it is too large Load Diff