选课系统

Course Selection System

1. Instructions

This project targets to create a course-selection-system, which is powered by Django and involving
AngularJs.

Figure 1:

The above figure shows the design-flow of the course-selection-system, and it is divided into
5 parts, Main Page, Administer Page, Teacher Page, Student Page and Course Page.

Figure 2:

The corresponding databases used in the project, is showing as above, and it is divided into
4 parts, Administer, Teacher, Student and Course.

1.1 Environment

This project is developing on Windows 8, and the edition of Django and Python are 1.7.8 and 3.4.3,
respectively.

2. Details

2.1 HTML

2.1.1 Main Page

This page mainly focuses on the function for logging into administer account and user account
(teacher/student). Figure 3 shows the login interface for the administer, and Figure 4 shows
the similar interface for user accounts.

Figure 3:

Figure 4

2.1.2 Administer Page

Logging into this account, there are several functions that an administer can manage this system:
change own password, add accounts or change password for other users and other administers,
delete accounts, and manage courses.

Figure 5:

Figure 6:

Figure 10:

Figure 11:

2.1.3 Teacher Page

This section for teacher is divided into two parts: one page for displaying basic information, another for
modifying account information.

Figure 15:

Figure 16:

2.1.4 Student Page

Figure 17:

Figure 18:

2.2 Database

2.2.1 Administer Table

Column Name	Type	NULL
username	email	False
password	varchar(30)	False

2.2.2 Course Table

Column Name	Type	NULL	Unique	default
Course Name	varchar(50)		True	“”
Course Credit	Positive Integer
Course Hour	Positive Integer
Course Start	DateTime
Course Overall People	Positive Integer			0

2.2.3 Teacher Table

Column Name	Type	NULL	Unique	default	Foreign Key
Teacher Id	varchar(30)		True	“”
Teacher Name	varchar(30)			“”
Course					True
Teacher Password	varchar(30)

2.2.4 Student Table

Column Name	Type	NULL	Unique	default	Foreign Key
Student Id	varchar(30)		True	“”
Student Name	varchar(30)			“”
Course					True
Student Password	varchar(30)			“”

3. Steps for Running Project

3.1 Download Project from Github

• Select a folder you want to store the project “StuManage”
• Run the “Git Bash”
• Enter “git clone git@github.com:daihong391/StuManage.git”

3.2 Creating an Administer Account

• Open Command Prompt Window
• Enter the document which you store the cloned project “StuManage” from Github
• Continue to enter this project, and then input “python manage.py shell”
• Enter “from studentManage.models import Adminer” to invoke the database of administer
• user following two command to create an account:
  
  • ”p=Adminer(username=’HONG@126.com’, password=’111111’)”
  • “p.save()”

3.3 Starting Server

• Enter “exit()” to quit shell
• Input “python manage.py runserver” to start the Server

3.4 Running project

• Open a browser, and input the link “127.0.0.1:8000/mainpage/”
• The main page is divided into two parts, Figure 3 and
  Figure 4.

Figure 3:

Figure 4

• By clicking the bellowing two buttons you can change between each other.

Figure 7:

Figure 8:

3.4.1 Administer Part

• Entering the correct username and password, you will enter the administer page, as
  Figure 5, 6, 10 and 11.

Figure 5:

Figure 6:

Figure 10:

Figure 11:

• In this part, you can change the password for administer in Figure 5.
• You can also create account for other administer, teacher and student, and change their password
  in Figure 6.
• In Figure 10, you can delete accounts for other users and administers except yourself.
• Figure 11 shows the interface for managing the course database. Inside this page, you can
  add a new course, modify it, and delete courses.
  
  • Figure 12 is for adding a new course
  • Figure 13 is for searching a course and modifying it
  • Figure 14 is for deleting a course

Figure 12:

Figure 13:

Figure 14:

• By clicking the bwllowing buttons, you can switch among those four pages.

Figure 9:

3.4.2 User Part

• Entering the correct username and password, you can enter either the teacher page or student page
  including basic information through the login page Figure 4.
• Both student and teacher part, they include one page for showing basic information, and another for
  modifying account as Figure 15, 16 for teacher and Figure 17,18 for student.
• By click buttons in Figure 19, you can between two pages: the basic and the modify.

Figure 19: