1. According to the picture below, design a similar web page for the course administrator to publicize the list of open courses. [35 points]
2. Only classes that meet the requirements below (2.1-2.7) can be added to the list and various error messages should be given for each invalid input. [35 points]
2.1 Course name and teacher name can only be English letters, course code should be a combination of letters and numbers (e.g., CS309, 19SE).
2.2 The date selected should be after the current date, and the format must be "YYYY/MM/DD".
For example, if the current date is 2022/09/09 , the date after 2022/09/10 (included) is valid.
2.3 Language should be selected through a radio button group, with options Chinese, English and Bilingual.
2.4 Time and Location:
Any two different courses cannot share one room at the same time.
Normalize the input of time, which means if the time is lower than 10, please put a “0” ahead. (e.g., 04:05 15:02)
Location needs to be selected through a drop down menu, with options including Teaching
Building No.1 Lecture Hall, Research Building Lecture Hall, Library Conference Hall and Activity Room .
2.5 Teacher and Course Information:
Each teacher can take no more than one lecture per day.
One course is scheduled at most once a day.
Different courses should have different course codes.
2.6 Duration must be a number.
2.7 No field is allowed to be null.
3. Provide an interface for modifying information. [20 points]
For example, click the button and the form dialog appears for modification. (In this part, you can ignore the constraints in part two if you want.)
4. The examples above are crude, please make your page look nicer. [10 points]
You can design your CSS, or rewrite the whole page completely using frameworks like Vue.js, ReactJS and so on.
Your score for this section depends on how beautiful your page is and how much code you write for beautification.
What to submit?
Submit all of your .html , .css , .js files (or other files if you need) along with the screen shots of your page's final appearance, into sakai website before the deadline. Please make sure that all of your files can be linked directly in your submission path.
It is an elective assignment, and we have another one elective assignment in following weeks. We only mark the grade of these elective assignments for once time, and the final grade of elective assignment is the highest of those two.
No. 4 / 4
