mirror of
https://github.com/lemeow125/StudE-Frontend.git
synced 2025-06-29 08:45:46 +08:00
Fixed subjectspage and userinfo page being swapped
This commit is contained in:
parent
d6df6d4f7a
commit
ff973ccb0b
2 changed files with 177 additions and 283 deletions
|
|
@ -35,7 +35,7 @@ import DropDownPicker from "react-native-dropdown-picker";
|
|||
import { ValueType } from "react-native-dropdown-picker";
|
||||
import AnimatedContainerNoScroll from "../../components/AnimatedContainer/AnimatedContainerNoScroll";
|
||||
|
||||
export default function UserInfoPage() {
|
||||
export default function SubjectsPage() {
|
||||
const queryClient = useQueryClient();
|
||||
// User Info
|
||||
const [user, setUser] = useState({
|
||||
|
|
@ -75,9 +75,6 @@ export default function UserInfoPage() {
|
|||
first_name: data[1].first_name,
|
||||
last_name: data[1].last_name,
|
||||
});
|
||||
setSelectedCourse(data[1].course);
|
||||
setSelectedSemester(data[1].semester);
|
||||
setSelectedYearLevel(data[1].year_level);
|
||||
console.log(user.subjects);
|
||||
setSelectedSubjects(user.subjects);
|
||||
},
|
||||
|
|
@ -91,28 +88,10 @@ export default function UserInfoPage() {
|
|||
},
|
||||
});
|
||||
|
||||
// Semester
|
||||
const [selected_semester, setSelectedSemester] = useState("");
|
||||
const [semesterOpen, setSemesterOpen] = useState(false);
|
||||
const [semesters, setSemesters] = useState<OptionType[]>([]);
|
||||
const Semesters = useQuery({
|
||||
queryKey: ["semesters"],
|
||||
queryFn: GetSemesters,
|
||||
onSuccess: (data: SemesterParams) => {
|
||||
let semestersData = data[1].map((semester: Semester) => ({
|
||||
label: semester.name,
|
||||
value: semester.name,
|
||||
shortname: semester.shortname,
|
||||
}));
|
||||
// Update the 'semesters' state
|
||||
setSemesters(semestersData);
|
||||
},
|
||||
});
|
||||
|
||||
// Subjects
|
||||
|
||||
const [selected_subjects, setSelectedSubjects] = useState<any>([]);
|
||||
const [subjectsOpen, setSubjectsOpen] = useState(false);
|
||||
const [subjectsOpen, setSubjectsOpen] = useState(true);
|
||||
const [subjects, setSubjects] = useState<OptionType[]>([]);
|
||||
|
||||
const Subjects = useQuery({
|
||||
|
|
@ -155,37 +134,6 @@ export default function UserInfoPage() {
|
|||
},
|
||||
});
|
||||
|
||||
// Year Level
|
||||
const [selected_yearlevel, setSelectedYearLevel] = useState("");
|
||||
const [yearLevelOpen, setYearLevelOpen] = useState(false);
|
||||
const [year_levels, setYearLevels] = useState<OptionType[]>([]);
|
||||
const yearlevel_query = useQuery({
|
||||
queryKey: ["year_levels"],
|
||||
queryFn: GetYearLevels,
|
||||
onSuccess: (data) => {
|
||||
let year_levels = data[1].map((yearlevel: YearLevel) => ({
|
||||
label: yearlevel.name,
|
||||
value: yearlevel.name,
|
||||
}));
|
||||
setYearLevels(year_levels);
|
||||
},
|
||||
});
|
||||
|
||||
// Course
|
||||
const [selected_course, setSelectedCourse] = useState("");
|
||||
const [courseOpen, setCourseOpen] = useState(false);
|
||||
const [courses, setCourses] = useState<OptionType[]>([]);
|
||||
const course_query = useQuery({
|
||||
queryKey: ["courses"],
|
||||
queryFn: GetCourses,
|
||||
onSuccess: (data) => {
|
||||
let courses = data[1].map((course: Course) => ({
|
||||
label: course.name,
|
||||
value: course.name,
|
||||
}));
|
||||
setCourses(courses);
|
||||
},
|
||||
});
|
||||
// Toggle editing of profile
|
||||
const [isEditable, setIsEditable] = useState(false);
|
||||
// Profile photo
|
||||
|
|
@ -216,161 +164,6 @@ export default function UserInfoPage() {
|
|||
</Text>
|
||||
</View>
|
||||
|
||||
<View style={styles.padding} />
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={styles.text_white_small_bold}>First Name</Text>
|
||||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<TextInput
|
||||
style={styles.input}
|
||||
editable={isEditable}
|
||||
onChange={(
|
||||
e: NativeSyntheticEvent<TextInputChangeEventData>
|
||||
): void => {
|
||||
setUser({ ...user, first_name: e.nativeEvent.text });
|
||||
}}
|
||||
value={user.first_name}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={styles.text_white_small_bold}>Last Name</Text>
|
||||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<TextInput
|
||||
style={styles.input}
|
||||
editable={isEditable}
|
||||
onChange={(
|
||||
e: NativeSyntheticEvent<TextInputChangeEventData>
|
||||
): void => {
|
||||
setUser({ ...user, last_name: e.nativeEvent.text });
|
||||
}}
|
||||
value={user.last_name}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={styles.text_white_small_bold}>Year Level</Text>
|
||||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
disabled={!isEditable}
|
||||
zIndex={4000}
|
||||
open={yearLevelOpen}
|
||||
value={selected_yearlevel}
|
||||
items={year_levels}
|
||||
setOpen={(open) => {
|
||||
setYearLevelOpen(open);
|
||||
setSemesterOpen(false);
|
||||
setCourseOpen(false);
|
||||
setSubjectsOpen(false);
|
||||
}}
|
||||
onChangeValue={() => {
|
||||
setSelectedSubjects([]);
|
||||
queryClient.invalidateQueries({ queryKey: ["subjects"] });
|
||||
}}
|
||||
setValue={setSelectedYearLevel}
|
||||
placeholder={user.year_level}
|
||||
placeholderStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
style={styles.input}
|
||||
textStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 4000,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={styles.text_white_small_bold}>Semester</Text>
|
||||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
disabled={!isEditable}
|
||||
zIndex={3000}
|
||||
open={semesterOpen}
|
||||
value={selected_semester}
|
||||
items={semesters}
|
||||
setOpen={(open) => {
|
||||
setYearLevelOpen(false);
|
||||
setSemesterOpen(open);
|
||||
setCourseOpen(false);
|
||||
setSubjectsOpen(false);
|
||||
}}
|
||||
onChangeValue={() => {
|
||||
setSelectedSubjects([]);
|
||||
queryClient.invalidateQueries({ queryKey: ["subjects"] });
|
||||
}}
|
||||
setValue={setSelectedSemester}
|
||||
placeholder={user.semester}
|
||||
placeholderStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
style={styles.input}
|
||||
textStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 3000,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={styles.text_white_small_bold}>Course</Text>
|
||||
</View>
|
||||
<View style={{ flex: 3 }}>
|
||||
<DropDownPicker
|
||||
disabled={!isEditable}
|
||||
zIndex={2000}
|
||||
open={courseOpen}
|
||||
value={selected_course}
|
||||
items={courses}
|
||||
setOpen={(open) => {
|
||||
setYearLevelOpen(false);
|
||||
setSemesterOpen(false);
|
||||
setCourseOpen(open);
|
||||
setSubjectsOpen(false);
|
||||
}}
|
||||
onChangeValue={() => {
|
||||
setSelectedSubjects([]);
|
||||
queryClient.invalidateQueries({ queryKey: ["subjects"] });
|
||||
}}
|
||||
setValue={setSelectedCourse}
|
||||
placeholder={user.course}
|
||||
placeholderStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
style={styles.input}
|
||||
textStyle={{
|
||||
...styles.text_white_tiny_bold,
|
||||
...{ textAlign: "left" },
|
||||
}}
|
||||
dropDownContainerStyle={{
|
||||
backgroundColor: colors.primary_2,
|
||||
zIndex: 2000,
|
||||
}}
|
||||
dropDownDirection="TOP"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View style={styles.padding} />
|
||||
<View style={styles.flex_row}>
|
||||
<View style={{ flex: 1 }}>
|
||||
|
|
@ -386,9 +179,6 @@ export default function UserInfoPage() {
|
|||
value={selected_subjects}
|
||||
items={subjects}
|
||||
setOpen={(open) => {
|
||||
setYearLevelOpen(false);
|
||||
setSemesterOpen(false);
|
||||
setCourseOpen(false);
|
||||
setSubjectsOpen(open);
|
||||
}}
|
||||
setValue={setSelectedSubjects}
|
||||
|
|
@ -415,24 +205,16 @@ export default function UserInfoPage() {
|
|||
onPress={() => {
|
||||
if (isEditable) {
|
||||
setSelectedSubjects([]);
|
||||
setYearLevelOpen(false);
|
||||
setSemesterOpen(false);
|
||||
setCourseOpen(false);
|
||||
setSubjectsOpen(false);
|
||||
mutation.mutate({
|
||||
first_name: user.first_name,
|
||||
last_name: user.last_name,
|
||||
course: selected_course,
|
||||
semester: selected_semester,
|
||||
subjects: selected_subjects,
|
||||
year_level: selected_yearlevel,
|
||||
});
|
||||
}
|
||||
setIsEditable(!isEditable);
|
||||
}}
|
||||
>
|
||||
<Text style={styles.text_white_small}>
|
||||
{isEditable && StudentInfo.isSuccess ? "Save" : "Edit Profile"}
|
||||
{isEditable && StudentInfo.isSuccess ? "Save" : "Edit Subjects"}
|
||||
</Text>
|
||||
</Button>
|
||||
</View>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue