cemaden-educacao
/
WPD-MobileApp
2
1
Fork 1
Code Issues 2 Pull Requests Projects Releases Wiki Activity
Browse Source

Adding scroll view to change password screens

master
GabrielTrettel 3 years ago
parent
8c651def82
commit
de94d72999
2 changed files with 101 additions and 97 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 91
      src/app/screens/PasswordRecoveryChangePswdScreen.js
  2. 107
      src/app/screens/PasswordRecoveryScreen.js

91
src/app/screens/PasswordRecoveryChangePswdScreen.js
View File

@ -8,6 +8,7 @@ import { dimensions } from "../config/dimensions";
import PasswordFormField from "../components/forms/PasswordFormField";
import ConfirmationModal from "../components/ConfirmationModal";
import { updatePassword } from "../api/auth";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
const validationSchema = Yup.object().shape({
password: Yup.string()
@ -81,54 +82,56 @@ export default function PasswordRecoveryChangePswd({ navigation, route }) {
}}
/>
<Form
validationSchema={validationSchema}
initialValues={{
password: "",
confirmPassword: "",
}}
onSubmit={(form, actions) => {
const psw_not_match = comparePassword(
form.password,
form.confirmPassword
);
if (psw_not_match) {
actions.setFieldError(
"confirmPassword",
"As senhas não correspondem"
<KeyboardAwareScrollView>
<Form
validationSchema={validationSchema}
initialValues={{
password: "",
confirmPassword: "",
}}
onSubmit={(form, actions) => {
const psw_not_match = comparePassword(
form.password,
form.confirmPassword
);
} else {
handleSubmit(form.password);
}
}}
>
<View style={{ padding: 16 }}>
<Text style={styles.textHeader}>Redefinir sua senha</Text>
<Text style={styles.textSubtitle}>
Digite uma nova senha nos campos abaixo para redefini-la
</Text>
</View>
if (psw_not_match) {
actions.setFieldError(
"confirmPassword",
"As senhas não correspondem"
);
} else {
handleSubmit(form.password);
}
}}
>
<View style={{ padding: 16 }}>
<Text style={styles.textHeader}>Redefinir sua senha</Text>
<Text style={styles.textSubtitle}>
Digite uma nova senha nos campos abaixo para redefini-la
</Text>
</View>
<View>
<Text style={styles.labelStyle}>Nova senha*:</Text>
<PasswordFormField
maxLength={20}
name="password"
placeholder="Digite a nova senha"
/>
</View>
<View>
<Text style={styles.labelStyle}>Nova senha*:</Text>
<PasswordFormField
maxLength={20}
name="password"
placeholder="Digite a nova senha"
/>
</View>
<View style={{ marginVertical: 24 }}>
<Text style={styles.labelStyle}>Confirmar a senha</Text>
<PasswordFormField
maxLength={20}
name="confirmPassword"
placeholder="Digite novamente a senha"
/>
</View>
<View style={{ marginVertical: 24 }}>
<Text style={styles.labelStyle}>Confirmar a senha</Text>
<PasswordFormField
maxLength={20}
name="confirmPassword"
placeholder="Digite novamente a senha"
/>
</View>
<SubmitButton title="confirmar" backgroundColor={colors.primary} />
</Form>
<SubmitButton title="confirmar" backgroundColor={colors.primary} />
</Form>
</KeyboardAwareScrollView>
</View>
);
}

107
src/app/screens/PasswordRecoveryScreen.js
View File

@ -9,6 +9,7 @@ import PhoneNumberFormField from "../components/forms/PhoneNumberFormField";
import SearchablePicker from "../components/SearchablePicker";
import ConfirmationModal from "../components/ConfirmationModal";
import { loginByUsernamAnswers, existUsername } from "../api/auth";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
function SecQuestionPicker({ name }) {
const [items, setItems] = useState([
@ -67,7 +68,6 @@ const validationSchema = Yup.object().shape({
export default function PasswordRecovery({ navigation, route }) {
const user = route.params.user;
console.log(user)
const [showLoading, setShowLoading] = useState(false);
const [confirmatioModalData, setConfirmatioModalData] = useState({
@ -78,11 +78,11 @@ export default function PasswordRecovery({ navigation, route }) {
const handleSubmit = async (number, answer, secQuestion) => {
setShowLoading(true);
setTimeout(() => {
console.log("to rodando", showLoading)
showLoading && setConfirmatioModalData({
message: "Validando informações",
show: true,
});
showLoading &&
setConfirmatioModalData({
message: "Validando informações",
show: true,
});
}, 2000);
const userExists = await existUsername(number);
@ -94,7 +94,7 @@ export default function PasswordRecovery({ navigation, route }) {
setShowLoading(false);
return;
}
const apiResponse = await loginByUsernamAnswers(
number,
secQuestion,
@ -104,7 +104,6 @@ export default function PasswordRecovery({ navigation, route }) {
switch (apiResponse.status) {
case 200:
console.log("ir pra proxima tela....");
navigation.navigate("PasswordRecoveryChangePswd", {
authToken: apiResponse.data,
username: number,
@ -142,51 +141,53 @@ export default function PasswordRecovery({ navigation, route }) {
}
/>
<Form
validationSchema={validationSchema}
initialValues={{
number: user.username || "",
answer: "",
secQuestion: "",
}}
onSubmit={({ number, answer, secQuestion }) => {
handleSubmit(number, answer, secQuestion);
}}
>
<View style={{ padding: 16 }}>
<Text style={styles.textHeader}>Recuperação de senha</Text>
<Text style={styles.textSubtitle}>
Responda à pergunta de segurança, isso ajuda a mostrar que essa
conta realmente pertence a você
</Text>
</View>
<View>
<Text style={styles.labelStyle}>Número de telefone*:</Text>
<PhoneNumberFormField
name="number"
maxLength={11}
placeholder={"(DDD) XXXXX-XXXX"}
editable={user.username == null}
/>
</View>
<View style={{ marginTop: 24 }}>
<Text style={styles.labelStyle}>Pergunta*:</Text>
<SecQuestionPicker name="secQuestion" />
</View>
<View style={{ marginVertical: 24 }}>
<Text style={styles.labelStyle}>Resposta*:</Text>
<FormField
name="answer"
maxLength={255}
placeholder={"Digite a resposta à pergunta"}
/>
</View>
<SubmitButton title="próximo" backgroundColor={colors.primary} />
</Form>
<KeyboardAwareScrollView>
<Form
validationSchema={validationSchema}
initialValues={{
number: user.username || "",
answer: "",
secQuestion: "",
}}
onSubmit={({ number, answer, secQuestion }) => {
handleSubmit(number, answer, secQuestion);
}}
>
<View style={{ padding: 16 }}>
<Text style={styles.textHeader}>Recuperação de senha</Text>
<Text style={styles.textSubtitle}>
Responda à pergunta de segurança, isso ajuda a mostrar que essa
conta realmente pertence a você
</Text>
</View>
<View>
<Text style={styles.labelStyle}>Número de telefone*:</Text>
<PhoneNumberFormField
name="number"
maxLength={11}
placeholder={"(DDD) XXXXX-XXXX"}
editable={user.username == null}
/>
</View>
<View style={{ marginTop: 24 }}>
<Text style={styles.labelStyle}>Pergunta*:</Text>
<SecQuestionPicker name="secQuestion" />
</View>
<View style={{ marginVertical: 24 }}>
<Text style={styles.labelStyle}>Resposta*:</Text>
<FormField
name="answer"
maxLength={255}
placeholder={"Digite a resposta à pergunta"}
/>
</View>
<SubmitButton title="próximo" backgroundColor={colors.primary} />
</Form>
</KeyboardAwareScrollView>
</View>
);
}

Write Preview
Loading…
Cancel
Save