shaojiahao
/
examSystem-Anxin
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[新增]创建考试页面搭建

master
邵佳豪 4 years ago
parent
8fed9759f1
commit
f8635d5c9d
7 changed files with 225 additions and 9 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. 4
      src/app/app.module.ts
  2. 13
      src/app/pipes/size.pipe.ts
  3. 55
      src/app/ui/create-exam/create-exam.component.html
  4. 52
      src/app/ui/create-exam/create-exam.component.scss
  5. 69
      src/app/ui/create-exam/create-exam.component.ts
  6. 34
      src/app/ui/create-exam/createDialog.html
  7. 7
      src/app/ui/ui.module.ts

4
src/app/app.module.ts
Unescape View File

@ -18,7 +18,9 @@ import {CacheTokenService} from './http-interceptors/cache-token.service'
import { TreeService } from'./http-interceptors/tree.service'
import { IsLoginService } from './is-login.service';
import { ComponentServiceService } from './component-service.service';
import { registerLocaleData } from '@angular/common';
import zh from '@angular/common/locales/zh';
registerLocaleData(zh);
@NgModule({
declarations: [
AppComponent

13
src/app/pipes/size.pipe.ts
Unescape View File

@ -42,4 +42,17 @@ export class NamePipe3 implements PipeTransform {
return name.replace(/\//g,'>').substring(9,name.length)
}
}
}
@Pipe({name: 'testState'})
export class testState implements PipeTransform {
transform(name: string): string {
if(name == "1"){
return "未开考"
}else if(name == "2"){
return "开考中"
}else{
return "已结束"
}
}
}

55
src/app/ui/create-exam/create-exam.component.html
Unescape View File

@ -1 +1,54 @@
<p>创建考试</p>
<div class="box">
<div class="createBtn">
<button mat-raised-button color="primary" (click)="createTest()">新增考题</button>
</div>
<div class="tablebox">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>试卷名称</th>
<td mat-cell *matCellDef="let element">{{element.name}}</td>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="organization">
<th mat-header-cell *matHeaderCellDef>考核中队</th>
<td mat-cell *matCellDef="let element">{{element.organization}}</td>
</ng-container>
<!-- Weight Column -->
<ng-container matColumnDef="startTime">
<th mat-header-cell *matHeaderCellDef>开考时间</th>
<td mat-cell *matCellDef="let element">{{element.startTime}}</td>
</ng-container>
<!-- Symbol Column -->
<ng-container matColumnDef="overTime">
<th mat-header-cell *matHeaderCellDef>结束时间</th>
<td mat-cell *matCellDef="let element">{{element.overTime}}</td>
</ng-container>
<!-- Symbol Column -->
<ng-container matColumnDef="testState">
<th mat-header-cell *matHeaderCellDef>考试状态</th>
<td mat-cell *matCellDef="let element">
<i [ngClass]="{'green': element.testState == '2','red':element.testState == '3'}">
{{element.testState | testState}}
</i>
</td>
</ng-container>
<!-- Symbol Column -->
<ng-container matColumnDef="operation">
<th mat-header-cell *matHeaderCellDef>操作</th>
<td mat-cell *matCellDef="let element">
<span>编辑</span>
<span>详情</span>
<span [ngClass]="{'grey': element.testState == '2' || element.testState == '3'}">删除</span>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<mat-paginator [pageSize]="10"></mat-paginator>
</div>
</div>

52
src/app/ui/create-exam/create-exam.component.scss
Unescape View File

@ -0,0 +1,52 @@
.box{
width:100%;
height: 100%;
margin: 0 auto;
.createBtn{
height: 60px;
line-height: 60px;
margin-bottom: 6px;
margin-left: 20px;
}
.tablebox{
table{
width: 100%;
}
}
}
.mat-header-cell{
text-align: center;
}
.mat-cell{
text-align: center;
span{
color: #0000BF;
margin: 0 3px;
cursor: pointer;
}
span:hover{
text-decoration:underline
}
.grey{
color: grey;
pointer-events: none;
}
.green{
color: #70b603;
}
.red{
color: #d9001b;
}
}
.dialog{
.title{
h1{
font-size: 25px;
font-weight: 900;
text-align: center;
}
}
}

69
src/app/ui/create-exam/create-exam.component.ts
Unescape View File

@ -1,5 +1,19 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnInit,Inject } from '@angular/core';
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import {FormControl} from '@angular/forms';
const ELEMENT_DATA: any[] = [
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'1'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'1'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'2'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'2'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'2'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'2'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'2'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'3'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'3'},
{name: "富华酒店", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'3'},
];
@Component({
selector: 'app-create-exam',
templateUrl: './create-exam.component.html',
@ -7,9 +21,56 @@ import { Component, OnInit } from '@angular/core';
})
export class CreateExamComponent implements OnInit {
constructor() { }
constructor(public dialog: MatDialog,public snackBar: MatSnackBar) { }
displayedColumns: string[] = ['name', 'organization', 'startTime', 'overTime', 'testState', 'operation'];
dataSource = ELEMENT_DATA;
ngOnInit(): void {
}
//新增考题弹出框
createTest(){
const dialogRef = this.dialog.open(CreateDialog, {
data: {}
});
dialogRef.afterClosed().subscribe(
data=>{
if(data){
}
}
);
}
}
import getISOWeek from 'date-fns/getISOWeek';
//创建组织
@Component({
selector: 'CreateDialog',
templateUrl: './createDialog.html',
styleUrls: ['./create-exam.component.scss']
})
export class CreateDialog {
myControl = new FormControl();
constructor(
public dialogRef: MatDialogRef<CreateDialog>,
@Inject(MAT_DIALOG_DATA) public data,
public snackBar: MatSnackBar) {}
onNoClick(): void {
this.dialogRef.close();
}
onSubmit(value){
}
date = null;
onChange(result: Date[]): void {
console.log('onChange: ', result);
}
getWeek(result: Date[]): void {
console.log('week: ', result.map(getISOWeek));
}
}

34
src/app/ui/create-exam/createDialog.html
Unescape View File

@ -0,0 +1,34 @@
<div class="dialog">
<div class="title">
<h1>试卷新增</h1>
</div>
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
<div>
<span>试卷名称</span>
<input id="name" name="name" type='text'
required
ngModel #name="ngModel">
</div>
<div>
<span>考核中队</span>
<input id="name" name="name" type='text'
required
ngModel #name="ngModel">
</div>
<div>
<span>考试时间</span>
<!-- <nz-range-picker id="date" name="date" [nzShowTime]="true" [(ngModel)]="date" (ngModelChange)="onChange($event)"></nz-range-picker> -->
</div>
<div class="btn">
<button type="submit" class="savebtn" mat-raised-button color="primary" [disabled]='form.invalid'>确定</button>
<button type="button" mat-button (click)="onNoClick()" mat-raised-button>取消</button>
</div>
</form>
</div>

7
src/app/ui/ui.module.ts
Unescape View File

@ -47,7 +47,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatPaginatorIntl } from '@angular/material/paginator';
import { PersonaldataComponent } from '../pages/personaldata/personaldata.component';
import { ChangepasswordComponent } from './changepassword/changepassword.component';
import { SizePipe , NamePipe,NamePipe2, NamePipe3} from '../pipes/size.pipe';
import { SizePipe , NamePipe,NamePipe2, NamePipe3, testState} from '../pipes/size.pipe';
import {ConfirmpswDirective} from './changepassword/equal-validator.directive';
import { FileUploadModule } from 'ng2-file-upload'
import { AllFileComponent, ViewDetails, FolderDialog } from './all-file/all-file.component';
@ -62,13 +62,14 @@ import { TeacherManagementComponent, editTeacher, seeTeacher } from './teacherMa
import { AddTeacher } from './teacherManagement/addenterpriseuser.component';
import { LearningRecordDetailsComponent } from './learning-record-details/learning-record-details.component';
import {EhartsStatisticsComponent} from './eharts-statistics/eharts-statistics.component';
import { CreateExamComponent } from './create-exam/create-exam.component';
import { CreateExamComponent, CreateDialog } from './create-exam/create-exam.component';
import { LookOverTestComponent } from './look-over-test/look-over-test.component';
import { StatisticAnalysisComponent } from './statistic-analysis/statistic-analysis.component';
import { JoinExamComponent } from './join-exam/join-exam.component';
import { TestRecordsComponent } from './test-records/test-records.component'
@NgModule({
declarations: [FolderDialog,ViewDetails,PersonaldataComponent, ChangepasswordComponent,SizePipe,NamePipe,NamePipe2,NamePipe3,ConfirmpswDirective, AllFileComponent, ChangeuserdataComponent, LoginComponent, UploadFilesComponent,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser,TeacherManagementComponent,editTeacher,AddTeacher,seeTeacher, LearningRecordDetailsComponent, EhartsStatisticsComponent, CreateExamComponent, LookOverTestComponent, StatisticAnalysisComponent, JoinExamComponent, TestRecordsComponent],
declarations: [FolderDialog,ViewDetails,PersonaldataComponent, ChangepasswordComponent,SizePipe,NamePipe,NamePipe2,NamePipe3,ConfirmpswDirective, AllFileComponent, ChangeuserdataComponent, LoginComponent, UploadFilesComponent,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser,TeacherManagementComponent,editTeacher,AddTeacher,seeTeacher, LearningRecordDetailsComponent, EhartsStatisticsComponent, CreateExamComponent, LookOverTestComponent, StatisticAnalysisComponent, JoinExamComponent, TestRecordsComponent,testState,CreateDialog],
imports: [
CommonModule,

Write Preview
Loading…
Cancel
Save