Skip to content

Commit

Permalink
Api integration
Browse files Browse the repository at this point in the history
  • Loading branch information
@syedn22
syedn22 committed Apr 18, 2021
1 parent f0ed922 commit e64cfc8
Show file tree
Hide file tree
Showing 3 changed files with 108 additions and 134 deletions.
1 change: 1 addition & 0 deletions app/component/AppDatePicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ function AppDatePicker({ dateTitle, timeTitle, setDateTime }) {
const timeArray = dateArray[4].split(":");

setvalue(formatDate(currentDate));
setDateTime(formatDate(currentDate));
};

const formatDate = (date) => {
Expand Down
2 changes: 1 addition & 1 deletion app/config/config.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"loginEndPoint": "auth/signin",
"baseUrl": "http://192.168.0.103:5000/",
"classRoomEndPoint": "Classroom",
"fileUploadEndPoint": "upload",
"fileUploadEndPoint": "File/upload",
"fileDownloadEndPoint": "download",
"filesGetEndPoint": "File/getfiles"
}
239 changes: 106 additions & 133 deletions app/screens/ReasonODForm.js
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
import React, { useContext, useState } from "react";
import { Formik } from "formik";
import { View, StyleSheet, Text, Image, TouchableOpacity } from "react-native";
import ErrorMessage from "./ErrorMessage";

import DocumentPickerApp from "./DocumentPicker";

import * as Yup from "yup";
import AppButton from "../component/AppButton";
Expand All @@ -16,6 +13,9 @@ import AppDatePicker from "../component/AppDatePicker";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import * as DocumentPicker from "expo-document-picker";

import config from "../config/config";
import { create } from "apisauce";

const validationSchema = Yup.object().shape({
roll_no: Yup.string().required().length(7).label("Roll No"),
description: Yup.string().required().length(50).label("Description"),
Expand All @@ -42,131 +42,109 @@ function ReasonODForm(props) {
];

const [category, setCategory] = useState(categories[0]);
const [date, setdate] = useState();
const [documentDetails, setdocumentDetails] = useState();

const { user, authToken } = useContext(AuthContext);

const [documentDetails, setdocumentDetails] = useState();
const api = create({
baseURL: config["baseUrl"],
headers: {
Authorization: "Bearer " + authToken,
Accept: "application",
},
});

const readDocument = async () => {
try {
const result = await DocumentPicker.getDocumentAsync({
type: "application/*",
type: "*/*",
copyToCacheDirectory: true,
});
setdocumentDetails(result);
} catch (error) {
console.log("Can't open file", error);
}
};

const handleSubmit = async () => {
// console.log(date);
// console.log(category);
// console.log(documentDetails);
const body = { ...documentDetails };

delete body.type;
body.type=""

const temp = new FormData();

temp.append("file", documentDetails);
temp.append("category", category["value"]);
temp.append("date", date);

try {
const result = await api
.post(config["fileUploadEndPoint"], temp)
.then((response) => {
// console.log(response);
})
.catch(console.log);

console.log(result);
} catch (error) {}

const options = {
method: "POST",
body: temp,
headers: {
Accept: "application/json",
"Content-Type": "multipart/form-data",
},
};
console.log(formData);

fetch(url, options).catch((error) => console.log(error));
};

return (
<View style={styles.container}>
<View>
<Image
style={styles.logo}
source={require("../../assets/logo-red.png")}
<AppPicker
selectedItem={category}
onSelectItem={(item) => setCategory(item)}
items={categories}
placeholder="Reason for Leave"
icon="apps"
/>
</View>
<Formik
initialValues={{ roll_no: "", description: " ", reason: "", docs: "" }}
onSubmit={(values) => console.log(values)}
validationSchema={validationSchema}
>
{({ handleChange, handleSubmit, errors, touched, setFieldTouched }) => (
<>
<View>
<AppTextInput
placeholder="Roll no"
autoCapitalize="none"
placeholderTextColor="gray"
autoCorrect={false}
onChangeText={handleChange("roll_no")}
keyboardType="numeric"
onBlur={() => setFieldTouched("roll_no")}
autoFocus={true}
/>
<ErrorMessage error={errors.roll_no} visible={touched.roll_no} />
</View>

<View>
<AppTextInput
autoCapitalize="none"
placeholderTextColor="gray"
placeholder="Description"
autoCapitalize="none"
autoCorrect={false}
onChangeText={handleChange("reason")}
onBlur={() => setFieldTouched("reason")}
keyboardType="default"
/>

<ErrorMessage error={errors.reason} visible={touched.reason} />
</View>

<View>
<AppPicker
selectedItem={category}
onSelectItem={(item) => setCategory(item)}
items={categories}
placeholder="Reason for Leave"
icon="apps"
/>
</View>

<AppDatePicker />
<TouchableOpacity
onPress={readDocument}
style={{
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
borderWidth: 1,
borderRadius: 5,
width: 150,
}}
>
<MaterialCommunityIcons name="paperclip" size={28} color="grey" />
<AppText style={{ fontSize: 15 }}>Add</AppText>
</TouchableOpacity>
{documentDetails && (
<View
style={{
width: 300,
height: 50,
borderWidth: 1,
borderRadius: 10,
padding: 5,
margin: 10,
flex: 1,
justifyContent: "center",
alignItems: "center",
fontSize: 24,
flexDirection: "row",
overflow: "hidden",
}}
>
<Text style={{ width: 200, fontSize: 14 }}>
{documentDetails.name}
</Text>
<MaterialCommunityIcons
onPress={() => setdocumentDetails(null)}
name="close"
size={24}
color="grey"
/>
</View>
)}

<AppButton
onPress={
(handleSubmit,
() => props.navigation.navigate("Student_Portal"))
}
title={"Submit Docs"}
color="dodgerblue"
/>
</>
)}
</Formik>

<AppDatePicker setDateTime={setdate} />
<TouchableOpacity onPress={readDocument} style={styles.addButton}>
<MaterialCommunityIcons name="paperclip" size={28} color="white" />
<AppText style={{ fontSize: 18, color: "white", fontWeight: "bold" }}>
Add
</AppText>
</TouchableOpacity>

{documentDetails && (
<View style={styles.docContainer}>
<Text style={{ width: 200, fontSize: 16, color: "white" }}>
{documentDetails.name}
</Text>
<MaterialCommunityIcons
onPress={() => setdocumentDetails(null)}
name="close"
size={30}
color="white"
/>
</View>
)}

<AppButton
onPress={handleSubmit}
title={"Submit Docs"}
color="dodgerblue"
/>
</View>
);
}
Expand All @@ -176,33 +154,28 @@ const styles = StyleSheet.create({
backgroundColor: "#3b5998",
flex: 1,
},
logo: {
width: 100,
height: 100,
alignSelf: "center",
marginTop: 10,
marginBottom: 20,
},
icon: {
marginRight: 30,
},
textInput: {
fontSize: 18,

borderBottomColor: "black",
color: "black",
},
text: {
color: "white",
fontSize: 25,
},
button: {
backgroundColor: "tomato",
addButton: {
flexDirection: "row",
justifyContent: "center",
borderRadius: 20,
alignItems: "center",
borderRadius: 10,
width: "100%",
marginVertical: 25,
height: 70,
backgroundColor: "dodgerblue",
},
docContainer: {
width: "95%",
height: 100,
borderWidth: 2,
borderRadius: 10,
borderColor: "white",
flex: 0.2,
margin: 10,
justifyContent: "center",
alignItems: "center",
fontSize: 24,
flexDirection: "row",
overflow: "hidden",
},
});
export default ReasonODForm;

0 comments on commit e64cfc8

Please sign in to comment.