image to base64 view and student, teacher, dairy
This commit is contained in:
parent
7c8ca5a70d
commit
e2cf625ae7
|
@ -168,7 +168,7 @@ class Sidebar extends React.Component<any, any> {
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
{this.state.image && this.state.image !== '' ?
|
{this.state.image && this.state.image !== '' ?
|
||||||
<View style={[styles.profileImgView]}>
|
<View style={[styles.profileImgView]}>
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + this.state.image}` }} style={[styles.profileImg]} />
|
<Image source={{ uri: `${this.state.image}` }} style={[styles.profileImg]} />
|
||||||
</View> :
|
</View> :
|
||||||
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' }, BaseStyles.marRight10, styles.profileImgView]}>
|
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' }, BaseStyles.marRight10, styles.profileImgView]}>
|
||||||
<Text style={{ fontSize: 32, color: BaseColors.white, textAlign: 'center' }}>{this.state.name && this.state.name.charAt(0)}</Text>
|
<Text style={{ fontSize: 32, color: BaseColors.white, textAlign: 'center' }}>{this.state.name && this.state.name.charAt(0)}</Text>
|
||||||
|
|
|
@ -155,3 +155,8 @@ export const MONTHLIST = [
|
||||||
address: /^\S+(?: \S+)*$/, //NOSONAR
|
address: /^\S+(?: \S+)*$/, //NOSONAR
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const imageFormat: any = {
|
||||||
|
MAX_FILE_SIZE: 6 * 1024 * 1024,
|
||||||
|
SUPPORTED_FORMATS: ['image/png', 'image/jpeg', 'image/jpg']
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
@ -29,7 +29,7 @@ export const passwordStrengthValidator = (password:any) => {
|
||||||
return 'Password cannot be empty.'
|
return 'Password cannot be empty.'
|
||||||
}
|
}
|
||||||
if (!re.test(password)) {
|
if (!re.test(password)) {
|
||||||
return 'Password atleast 8 character,one upper case, one lower case, one number and one special characters.'
|
return 'Password should be 8 to 12 characters with at least one upper case, one lower case, one number and one special character.'
|
||||||
}
|
}
|
||||||
|
|
||||||
return ''
|
return ''
|
||||||
|
|
|
@ -102,7 +102,7 @@ class AttendanceDetailView extends React.Component<any, any>{
|
||||||
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', justifyContent: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', justifyContent: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile_picture !== '') ?
|
{(studentItem.profile_picture !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
<Image source={{ uri: `${studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
||||||
:
|
:
|
||||||
<View style={{ borderWidth: 1, borderColor: attendanceDetail?.present_details?.color_code, borderRadius: 40, padding: 20, margin: 6 }}>
|
<View style={{ borderWidth: 1, borderColor: attendanceDetail?.present_details?.color_code, borderRadius: 40, padding: 20, margin: 6 }}>
|
||||||
<Text style={[{ color: attendanceDetail?.present_details?.color_code }, BaseStyles.font20]}>{studentItem?.card_id || '0'}</Text>
|
<Text style={[{ color: attendanceDetail?.present_details?.color_code }, BaseStyles.font20]}>{studentItem?.card_id || '0'}</Text>
|
||||||
|
@ -134,7 +134,7 @@ class AttendanceDetailView extends React.Component<any, any>{
|
||||||
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', justifyContent: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', justifyContent: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile_picture !== '') ?
|
{(studentItem.profile_picture !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
<Image source={{ uri: `${studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
||||||
:
|
:
|
||||||
<View style={{ borderWidth: 1, borderColor: BaseColors.green, borderRadius: 40, padding: 24 }}>
|
<View style={{ borderWidth: 1, borderColor: BaseColors.green, borderRadius: 40, padding: 24 }}>
|
||||||
<Text style={[{ color: BaseColors.green }, BaseStyles.font24]}>{studentItem?.card_id || ''}</Text>
|
<Text style={[{ color: BaseColors.green }, BaseStyles.font24]}>{studentItem?.card_id || ''}</Text>
|
||||||
|
|
|
@ -5,7 +5,7 @@ import { Formik } from 'formik'
|
||||||
import * as yup from 'yup'
|
import * as yup from 'yup'
|
||||||
import { Picker } from '@react-native-picker/picker'
|
import { Picker } from '@react-native-picker/picker'
|
||||||
import AsyncStorage from "@react-native-async-storage/async-storage"
|
import AsyncStorage from "@react-native-async-storage/async-storage"
|
||||||
import { currentYear, UserRoles, currentAcademicYear, fetchBaseUrl } from '@constants/Constants' //NOSONAR
|
import { currentYear, UserRoles, currentAcademicYear, fetchBaseUrl, imageFormat } from '@constants/Constants' //NOSONAR
|
||||||
import { connect } from "react-redux"
|
import { connect } from "react-redux"
|
||||||
import { ActionCreators } from "@actions" //NOSONAR
|
import { ActionCreators } from "@actions" //NOSONAR
|
||||||
import PropTypes, { array } from 'prop-types'
|
import PropTypes, { array } from 'prop-types'
|
||||||
|
@ -16,6 +16,7 @@ import BaseColors from "@theme/Colors" //NOSONAR
|
||||||
import * as ImagePicker from 'expo-image-picker'
|
import * as ImagePicker from 'expo-image-picker'
|
||||||
import Constants from "expo-constants"
|
import Constants from "expo-constants"
|
||||||
import RNPickerSelect from "react-native-picker-select"
|
import RNPickerSelect from "react-native-picker-select"
|
||||||
|
import RNFS from 'react-native-fs';
|
||||||
|
|
||||||
const diaryValidationSchema = yup.object().shape({
|
const diaryValidationSchema = yup.object().shape({
|
||||||
diary_type: yup
|
diary_type: yup
|
||||||
|
@ -261,19 +262,35 @@ class DiaryCreate extends React.Component<any, any>{
|
||||||
quality: 1,
|
quality: 1,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
if (!result.cancelled) {
|
// if (!result.cancelled) {
|
||||||
const fileNameURL = result.assets[0].uri
|
// const fileNameURL = result.assets[0].uri
|
||||||
const index = fileNameURL.lastIndexOf('/')
|
// const index = fileNameURL.lastIndexOf('/')
|
||||||
const fileName = fileNameURL.substring(index + 1)
|
// const fileName = fileNameURL.substring(index + 1)
|
||||||
const fileExtensionType = fileName.split('.').pop()
|
// const fileExtensionType = fileName.split('.').pop()
|
||||||
const formData: any = new FormData()
|
// const formData: any = new FormData()
|
||||||
formData.append('file', {
|
// formData.append('file', {
|
||||||
uri: result.assets[0].uri,
|
// uri: result.assets[0].uri,
|
||||||
name: fileName,
|
// name: fileName,
|
||||||
type: `image/${fileExtensionType}`,
|
// type: `image/${fileExtensionType}`,
|
||||||
})
|
// })
|
||||||
this.setState({ isImageUploaded: false })
|
// this.setState({ isImageUploaded: false })
|
||||||
this.props.setDiaryImage({ data: formData, token: this.token })
|
// this.props.setDiaryImage({ data: formData, token: this.token })
|
||||||
|
// }
|
||||||
|
if (!result.canceled && result.assets && result.assets[0].uri) {
|
||||||
|
const fileUri = result.assets[0].uri;
|
||||||
|
const fileType = result.assets[0].mimeType; // MIME type
|
||||||
|
const fileStat = await RNFS.stat(fileUri);
|
||||||
|
const fileSize = fileStat.size; // File size in bytes
|
||||||
|
if (fileSize > imageFormat.MAX_FILE_SIZE) {
|
||||||
|
Alert.alert('Error', 'File size exceeds 6 MB.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!imageFormat.SUPPORTED_FORMATS.includes(fileType)) {
|
||||||
|
Alert.alert('Error', 'Only PNG, JPEG, and JPG formats are allowed.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const base64 = await RNFS.readFile(fileUri, 'base64');
|
||||||
|
this.setState({ isImageUploaded: true, image: `data:image/jpeg;base64,${base64}`, imagePreviewURL: `data:image/jpeg;base64,${base64}` })
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -134,7 +134,7 @@ class DiaryView extends React.PureComponent<any, any> {
|
||||||
const images = []
|
const images = []
|
||||||
|
|
||||||
if (data) {
|
if (data) {
|
||||||
images.push({ uri: `${this.imageBaseUrl + data}` })
|
images.push({ uri: `${data}` })
|
||||||
this.setState({ isVisible: true, images: images })
|
this.setState({ isVisible: true, images: images })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -284,7 +284,7 @@ class DiaryView extends React.PureComponent<any, any> {
|
||||||
<View style={[BaseStyles.marBottom5, BaseStyles.padHorizontal10]}>
|
<View style={[BaseStyles.marBottom5, BaseStyles.padHorizontal10]}>
|
||||||
{item?.images !== '' && this.imageBaseUrl !== '' && <TouchableOpacity style={{ width: 160, height: 120, borderWidth: 1, borderColor: BaseColors.grey, borderRadius: 10 }}
|
{item?.images !== '' && this.imageBaseUrl !== '' && <TouchableOpacity style={{ width: 160, height: 120, borderWidth: 1, borderColor: BaseColors.grey, borderRadius: 10 }}
|
||||||
onPress={this.onImagePreview.bind(this, item?.images)}>
|
onPress={this.onImagePreview.bind(this, item?.images)}>
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + item?.images}` }} style={[AppStyles.diaryViewImage]} />
|
<Image source={{ uri: `${item?.images}` }} style={[AppStyles.diaryViewImage]} />
|
||||||
</TouchableOpacity>}
|
</TouchableOpacity>}
|
||||||
</View>
|
</View>
|
||||||
<Sepator />
|
<Sepator />
|
||||||
|
|
|
@ -262,7 +262,7 @@ class Home extends React.Component<any, any> {
|
||||||
{
|
{
|
||||||
item?.profile_picture ?
|
item?.profile_picture ?
|
||||||
<View style={[BaseStyles.alignSelfCenter, BaseStyles.justifyCenter]}>
|
<View style={[BaseStyles.alignSelfCenter, BaseStyles.justifyCenter]}>
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + item?.profile_picture}` }} style={[AppStyles.listViewImage, BaseStyles.marLeft10]} />
|
<Image source={{ uri: `${item?.profile_picture}` }} style={[AppStyles.listViewImage, BaseStyles.marLeft10]} />
|
||||||
</View>
|
</View>
|
||||||
:
|
:
|
||||||
<View style={[{}, BaseStyles.alignSelfCenter, BaseStyles.justifyCenter, BaseStyles.buttonBgColor, AppStyles.listViewImage, BaseStyles.marLeft10]}>
|
<View style={[{}, BaseStyles.alignSelfCenter, BaseStyles.justifyCenter, BaseStyles.buttonBgColor, AppStyles.listViewImage, BaseStyles.marLeft10]}>
|
||||||
|
|
|
@ -87,7 +87,7 @@ class InstantFeedbackDetail extends React.Component<any, any>{
|
||||||
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile_picture !== '') ?
|
{(studentItem.profile_picture !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
<Image source={{ uri: `${studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
||||||
:
|
:
|
||||||
<View style={{ borderWidth: 1, borderColor: item?.color_code, borderRadius: 40, padding: 24 }}>
|
<View style={{ borderWidth: 1, borderColor: item?.color_code, borderRadius: 40, padding: 24 }}>
|
||||||
<Text style={[{ color: item?.color_code }, BaseStyles.font24]}>{studentItem?.card_id || '0'}</Text>
|
<Text style={[{ color: item?.color_code }, BaseStyles.font24]}>{studentItem?.card_id || '0'}</Text>
|
||||||
|
|
|
@ -88,7 +88,7 @@ class InstantFeedbackDetailView extends React.Component<any, any>{
|
||||||
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
<TouchableOpacity key={studentIndex} style={[styles.studentCard, { width: 100 }]} activeOpacity={0.8} onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile_picture !== '') ?
|
{(studentItem.profile_picture !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
<Image source={{ uri: `${studentItem?.profile_picture}` }} style={[AppStyles.detailViewImage, { borderRadius: 16 }]} />
|
||||||
:
|
:
|
||||||
<View style={{ borderWidth: 1, borderColor: item?.color_code, borderRadius: 40, padding: 24 }}>
|
<View style={{ borderWidth: 1, borderColor: item?.color_code, borderRadius: 40, padding: 24 }}>
|
||||||
<Text style={[{ color: item?.color_code }, BaseStyles.font24]}>{studentItem?.card_id || '0'}</Text>
|
<Text style={[{ color: item?.color_code }, BaseStyles.font24]}>{studentItem?.card_id || '0'}</Text>
|
||||||
|
|
|
@ -108,7 +108,7 @@ class NoticeBoardView extends React.Component<any, any>{
|
||||||
onImagePreview = (data: any) => {
|
onImagePreview = (data: any) => {
|
||||||
const images = []
|
const images = []
|
||||||
if (data.url) {
|
if (data.url) {
|
||||||
images.push({ uri: `${this.imageBaseUrl + data.url}` })
|
images.push({ uri: `${data.url}` })
|
||||||
this.setState({ isVisible: true, images: images })
|
this.setState({ isVisible: true, images: images })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -217,7 +217,7 @@ class NoticeBoardView extends React.Component<any, any>{
|
||||||
{item?.image && this.imageBaseUrl && item?.image.map((imageInfo: any, index: any) => (
|
{item?.image && this.imageBaseUrl && item?.image.map((imageInfo: any, index: any) => (
|
||||||
<TouchableOpacity key={index} style={{ width: 160, height: 120, borderWidth: 1, borderColor: BaseColors.grey, borderRadius: 10, margin: 5 }}
|
<TouchableOpacity key={index} style={{ width: 160, height: 120, borderWidth: 1, borderColor: BaseColors.grey, borderRadius: 10, margin: 5 }}
|
||||||
onPress={this.onImagePreview.bind(this, imageInfo)}>
|
onPress={this.onImagePreview.bind(this, imageInfo)}>
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + imageInfo?.url}` }} style={[AppStyles.diaryViewImage]} />
|
<Image source={{ uri: `${imageInfo?.url}` }} style={[AppStyles.diaryViewImage]} />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
))}
|
))}
|
||||||
</View>
|
</View>
|
||||||
|
|
|
@ -326,7 +326,7 @@ class QuizSummaryDetails extends React.Component<any, any>{
|
||||||
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile !== '') ?
|
{(studentItem.profile !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
<Image source={{ uri: `${studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
||||||
width: 50,
|
width: 50,
|
||||||
height: 50, borderRadius: 16
|
height: 50, borderRadius: 16
|
||||||
}]} />
|
}]} />
|
||||||
|
@ -374,7 +374,7 @@ class QuizSummaryDetails extends React.Component<any, any>{
|
||||||
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile !== '') ?
|
{(studentItem.profile !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
<Image source={{ uri: `${studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
||||||
width: 50,
|
width: 50,
|
||||||
height: 50, borderRadius: 16
|
height: 50, borderRadius: 16
|
||||||
}]} />
|
}]} />
|
||||||
|
@ -422,7 +422,7 @@ class QuizSummaryDetails extends React.Component<any, any>{
|
||||||
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
onPress={this.onStudentProfileCheck.bind(this, studentItem)}>
|
||||||
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
<View style={{ alignSelf: 'center', marginTop: 4 }}>
|
||||||
{(studentItem.profile !== '') ?
|
{(studentItem.profile !== '') ?
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
<Image source={{ uri: `${studentItem?.profile}` }} style={[AppStyles.detailViewImage, {
|
||||||
width: 50,
|
width: 50,
|
||||||
height: 50, borderRadius: 16
|
height: 50, borderRadius: 16
|
||||||
}]} />
|
}]} />
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { StyleSheet, Text, View, TouchableOpacity, TextInput, ScrollView, Activi
|
||||||
import { AppStyles, BaseStyles } from "@theme/BaseStyles" //NOSONAR
|
import { AppStyles, BaseStyles } from "@theme/BaseStyles" //NOSONAR
|
||||||
import { Formik } from 'formik'
|
import { Formik } from 'formik'
|
||||||
import * as yup from 'yup'
|
import * as yup from 'yup'
|
||||||
import { formValidationPatten, currentYear, UserRoles, currentAcademicYear, fetchBaseUrl } from '@constants/Constants' //NOSONAR
|
import { formValidationPatten, currentYear, UserRoles, currentAcademicYear, fetchBaseUrl, imageFormat } from '@constants/Constants' //NOSONAR
|
||||||
import { connect } from "react-redux"
|
import { connect } from "react-redux"
|
||||||
import { ActionCreators } from "@actions" //NOSONAR
|
import { ActionCreators } from "@actions" //NOSONAR
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
|
@ -15,6 +15,7 @@ import * as ImagePicker from 'expo-image-picker'
|
||||||
import Constants from "expo-constants"
|
import Constants from "expo-constants"
|
||||||
import { RadioButton } from 'react-native-paper'
|
import { RadioButton } from 'react-native-paper'
|
||||||
import DateTimePickerModal from 'react-native-modal-datetime-picker';
|
import DateTimePickerModal from 'react-native-modal-datetime-picker';
|
||||||
|
import RNFS from 'react-native-fs';
|
||||||
|
|
||||||
const Sepator = ({ style }: any) => <View style={[BaseStyles.separator, style]} />
|
const Sepator = ({ style }: any) => <View style={[BaseStyles.separator, style]} />
|
||||||
|
|
||||||
|
@ -193,19 +194,35 @@ class StudentCreate extends React.Component<any, any>{
|
||||||
quality: 1,
|
quality: 1,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
if (!result.cancelled) {
|
// if (!result.cancelled) {
|
||||||
const fileNameURL = result.assets[0].uri
|
// const fileNameURL = result.assets[0].uri
|
||||||
const index = fileNameURL.lastIndexOf('/')
|
// const index = fileNameURL.lastIndexOf('/')
|
||||||
const fileName = fileNameURL.substring(index + 1)
|
// const fileName = fileNameURL.substring(index + 1)
|
||||||
const fileExtensionType = fileName.split('.').pop()
|
// const fileExtensionType = fileName.split('.').pop()
|
||||||
const formData: any = new FormData()
|
// const formData: any = new FormData()
|
||||||
formData.append('file', {
|
// formData.append('file', {
|
||||||
uri: result.assets[0].uri,
|
// uri: result.assets[0].uri,
|
||||||
name: fileName,
|
// name: fileName,
|
||||||
type: `image/${fileExtensionType}`,
|
// type: `image/${fileExtensionType}`,
|
||||||
})
|
// })
|
||||||
this.setState({ isImageUploaded: false })
|
// this.setState({ isImageUploaded: false })
|
||||||
this.props.setStudentImage({ data: formData, token: this.token })
|
// this.props.setStudentImage({ data: formData, token: this.token })
|
||||||
|
// }
|
||||||
|
if (!result.canceled && result.assets && result.assets[0].uri) {
|
||||||
|
const fileUri = result.assets[0].uri;
|
||||||
|
const fileType = result.assets[0].mimeType; // MIME type
|
||||||
|
const fileStat = await RNFS.stat(fileUri);
|
||||||
|
const fileSize = fileStat.size; // File size in bytes
|
||||||
|
if (fileSize > imageFormat.MAX_FILE_SIZE) {
|
||||||
|
Alert.alert('Error', 'File size exceeds 6 MB.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!imageFormat.SUPPORTED_FORMATS.includes(fileType)) {
|
||||||
|
Alert.alert('Error', 'Only PNG, JPEG, and JPG formats are allowed.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const base64 = await RNFS.readFile(fileUri, 'base64');
|
||||||
|
this.setState({ isImageUploaded: true, image: `data:image/jpeg;base64,${base64}`, imagePreviewURL: `data:image/jpeg;base64,${base64}` })
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -208,7 +208,7 @@ class StudentProfile extends React.Component<any, any>{
|
||||||
<ScrollView style={{ marginVertical: 12, marginHorizontal: 15 }}>
|
<ScrollView style={{ marginVertical: 12, marginHorizontal: 15 }}>
|
||||||
<View style={[BaseStyles.padHorizontal10, AppStyles.CardView, AppStyles.studentCard]}>
|
<View style={[BaseStyles.padHorizontal10, AppStyles.CardView, AppStyles.studentCard]}>
|
||||||
{(studentProfile?.profile_picture !== '') ?
|
{(studentProfile?.profile_picture !== '') ?
|
||||||
<Image defaultSource={Images.avatar} source={{ uri: `${this.imageBaseUrl + studentProfile?.profile_picture}` }} style={[AppStyles.studentImage, BaseStyles.marRight20]} />
|
<Image defaultSource={Images.avatar} source={{ uri: `${studentProfile?.profile_picture}` }} style={[AppStyles.studentImage, BaseStyles.marRight20]} />
|
||||||
:
|
:
|
||||||
<View style={{ borderWidth: 1, borderColor: BaseColors.lightGreen, borderRadius: 40, padding: 20, margin: 6 }}>
|
<View style={{ borderWidth: 1, borderColor: BaseColors.lightGreen, borderRadius: 40, padding: 20, margin: 6 }}>
|
||||||
<Text style={[{ color: BaseColors.lightGreen }, BaseStyles.font20]}>{studentProfile?.card_id || '0'}</Text>
|
<Text style={[{ color: BaseColors.lightGreen }, BaseStyles.font20]}>{studentProfile?.card_id || '0'}</Text>
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { StyleSheet, Text, View, TouchableOpacity, TextInput, ScrollView, Activi
|
||||||
import { AppStyles, BaseStyles } from "@theme/BaseStyles" //NOSONAR
|
import { AppStyles, BaseStyles } from "@theme/BaseStyles" //NOSONAR
|
||||||
import { Formik } from 'formik'
|
import { Formik } from 'formik'
|
||||||
import * as yup from 'yup'
|
import * as yup from 'yup'
|
||||||
import { formValidationPatten, currentYear, currentAcademicYear, fetchBaseUrl } from '@constants/Constants' //NOSONAR
|
import { formValidationPatten, currentYear, currentAcademicYear, fetchBaseUrl, imageFormat } from '@constants/Constants' //NOSONAR
|
||||||
import { connect } from "react-redux"
|
import { connect } from "react-redux"
|
||||||
import { ActionCreators } from "@actions" //NOSONAR
|
import { ActionCreators } from "@actions" //NOSONAR
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
|
@ -15,6 +15,7 @@ import * as ImagePicker from 'expo-image-picker'
|
||||||
import Constants from "expo-constants"
|
import Constants from "expo-constants"
|
||||||
import { RadioButton } from 'react-native-paper'
|
import { RadioButton } from 'react-native-paper'
|
||||||
import DateTimePickerModal from 'react-native-modal-datetime-picker';
|
import DateTimePickerModal from 'react-native-modal-datetime-picker';
|
||||||
|
import RNFS from 'react-native-fs';
|
||||||
|
|
||||||
const Sepator = ({ style }: any) => <View style={[BaseStyles.separator, style]} />
|
const Sepator = ({ style }: any) => <View style={[BaseStyles.separator, style]} />
|
||||||
|
|
||||||
|
@ -183,19 +184,36 @@ class StudentUpdate extends React.Component<any, any>{
|
||||||
quality: 1,
|
quality: 1,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
if (!result.cancelled) {
|
// if (!result.cancelled) {
|
||||||
const fileNameURL = result.assets[0].uri
|
// const fileNameURL = result.assets[0].uri
|
||||||
const index = fileNameURL.lastIndexOf('/')
|
// const index = fileNameURL.lastIndexOf('/')
|
||||||
const fileName = fileNameURL.substring(index + 1)
|
// const fileName = fileNameURL.substring(index + 1)
|
||||||
const fileExtensionType = fileName.split('.').pop()
|
// const fileExtensionType = fileName.split('.').pop()
|
||||||
const formData: any = new FormData()
|
// const formData: any = new FormData()
|
||||||
formData.append('file', {
|
// formData.append('file', {
|
||||||
uri: result.assets[0].uri,
|
// uri: result.assets[0].uri,
|
||||||
name: fileName,
|
// name: fileName,
|
||||||
type: `image/${fileExtensionType}`,
|
// type: `image/${fileExtensionType}`,
|
||||||
})
|
// })
|
||||||
this.setState({ isImageUploaded: false })
|
// this.setState({ isImageUploaded: false })
|
||||||
this.props.setStudentImage({ data: formData, token: this.token })
|
// this.props.setStudentImage({ data: formData, token: this.token })
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (!result.canceled && result.assets && result.assets[0].uri) {
|
||||||
|
const fileUri = result.assets[0].uri;
|
||||||
|
const fileType = result.assets[0].mimeType; // MIME type
|
||||||
|
const fileStat = await RNFS.stat(fileUri);
|
||||||
|
const fileSize = fileStat.size; // File size in bytes
|
||||||
|
if (fileSize > imageFormat.MAX_FILE_SIZE) {
|
||||||
|
Alert.alert('Error', 'File size exceeds 6 MB.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!imageFormat.SUPPORTED_FORMATS.includes(fileType)) {
|
||||||
|
Alert.alert('Error', 'Only PNG, JPEG, and JPG formats are allowed.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const base64 = await RNFS.readFile(fileUri, 'base64');
|
||||||
|
this.setState({ isImageUploaded: true, image: `data:image/jpeg;base64,${base64}`, imagePreviewURL: `data:image/jpeg;base64,${base64}` })
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -251,7 +269,7 @@ class StudentUpdate extends React.Component<any, any>{
|
||||||
{this.state.isImageUploaded ?
|
{this.state.isImageUploaded ?
|
||||||
<Image source={{ uri: this.state.imagePreviewURL }} style={[AppStyles.studentImage]} />
|
<Image source={{ uri: this.state.imagePreviewURL }} style={[AppStyles.studentImage]} />
|
||||||
:
|
:
|
||||||
studentProfileInfo && <Image source={{ uri: `${this.imageBaseUrl + studentInfo?.studentclass_details?.profile_picture}` }}
|
studentProfileInfo && <Image source={{ uri: `${studentInfo?.studentclass_details?.profile_picture}` }}
|
||||||
style={[AppStyles.studentImage]} />
|
style={[AppStyles.studentImage]} />
|
||||||
}
|
}
|
||||||
{(!studentProfileInfo && !this.state.isImageUploaded) && <Image source={Images.avatar} style={[AppStyles.studentImage]} />}
|
{(!studentProfileInfo && !this.state.isImageUploaded) && <Image source={Images.avatar} style={[AppStyles.studentImage]} />}
|
||||||
|
|
|
@ -185,7 +185,7 @@ class StudentView extends React.Component<any, any>{
|
||||||
{
|
{
|
||||||
(this.imageBaseUrl && item?.studentclass_details?.profile_picture) ?
|
(this.imageBaseUrl && item?.studentclass_details?.profile_picture) ?
|
||||||
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
||||||
<Image defaultSource={Images.avatar} source={{ uri: `${this.imageBaseUrl + item?.studentclass_details?.profile_picture}` }}
|
<Image defaultSource={Images.avatar} source={{ uri: `${item?.studentclass_details?.profile_picture}` }}
|
||||||
style={[AppStyles.listViewImage, BaseStyles.marRight10]} />
|
style={[AppStyles.listViewImage, BaseStyles.marRight10]} />
|
||||||
</View>
|
</View>
|
||||||
:
|
:
|
||||||
|
|
|
@ -192,7 +192,7 @@ class TeacherProfile extends React.Component<any, any>{
|
||||||
|
|
||||||
this.state.teacherInfo?.image ?
|
this.state.teacherInfo?.image ?
|
||||||
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
||||||
<Image source={{ uri: `${this.imageBaseUrl + this.state.teacherInfo?.image}` }} style={[AppStyles.listViewImage]} />
|
<Image source={{ uri: `${this.state.teacherInfo?.image}` }} style={[AppStyles.listViewImage]} />
|
||||||
</View>
|
</View>
|
||||||
:
|
:
|
||||||
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' },
|
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' },
|
||||||
|
|
|
@ -135,7 +135,7 @@ class TeacherView extends React.Component<any, any>{
|
||||||
{
|
{
|
||||||
item?.image ?
|
item?.image ?
|
||||||
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
<View style={[{ alignSelf: 'center', justifyContent: 'center' }]}>
|
||||||
<Image defaultSource={Images.avatar} source={{ uri: `${this.imageBaseUrl + item?.image}` }} style={[AppStyles.listViewImage, BaseStyles.marRight10]} />
|
<Image defaultSource={Images.avatar} source={{ uri: `${item?.image}` }} style={[AppStyles.listViewImage, BaseStyles.marRight10]} />
|
||||||
</View>
|
</View>
|
||||||
:
|
:
|
||||||
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' }, AppStyles.listViewImage, BaseStyles.marRight10]}>
|
<View style={[{ backgroundColor: BaseColors.headerStyleBackgroundColor, alignSelf: 'center', justifyContent: 'center' }, AppStyles.listViewImage, BaseStyles.marRight10]}>
|
||||||
|
|
Loading…
Reference in New Issue