chenjingyu
4 years ago
13 changed files with 326 additions and 39 deletions
@ -0,0 +1,50 @@
|
||||
<!-- |
||||
* @Descripttion: |
||||
* @version: |
||||
* @Author: sueRimn |
||||
* @Date: 2020-12-14 17:21:02 |
||||
* @LastEditors: sueRimn |
||||
* @LastEditTime: 2020-12-15 09:21:32 |
||||
--> |
||||
<div class="content"> |
||||
<div class="header"> |
||||
<div class="queryBox"> |
||||
<div class="queryField"> |
||||
<label style="margin-right: 10px;font-size: 20px;">{{headtext}}</label> |
||||
|
||||
</div> |
||||
|
||||
|
||||
</div> |
||||
</div> |
||||
<div class="centertable"> |
||||
<table > |
||||
<thead> |
||||
<th style="width: 15%;">考试人</th> |
||||
<th style="width: 15%;">考核中队</th> |
||||
<th style="width: 15%;">交卷时间</th> |
||||
<th style="width: 15%;">是否已阅</th> |
||||
<th style="width: 15%;">分数</th> |
||||
<th style="width: 20%;">操作</th> |
||||
</thead> |
||||
<tbody> |
||||
<tr *ngFor="let item of dataSource"> |
||||
<td>{{item.name}}</td> |
||||
<td>{{item.organization}}</td> |
||||
<td>{{item.startTime}}</td> |
||||
<td [ngClass]="{'green': item.testState == '已阅卷','red':item.testState == '未阅卷'}">{{item.testState}}</td> |
||||
<td>{{item.mark}}</td> |
||||
<td > |
||||
<span style="color: #01CFD5;">阅卷</span> |
||||
</td> |
||||
</tr> |
||||
</tbody> |
||||
|
||||
</table> |
||||
<mat-paginator [length]="100" |
||||
[pageSize]="10" |
||||
[pageSizeOptions]="[10]"> |
||||
</mat-paginator> |
||||
</div> |
||||
|
||||
</div> |
||||
@ -0,0 +1,95 @@
|
||||
table { |
||||
width: 100%; |
||||
text-align: center; |
||||
.cdk-header-cell { |
||||
text-align: center; |
||||
} |
||||
} |
||||
|
||||
.content { |
||||
width: 100%; |
||||
height: 100%; |
||||
overflow: hidden; |
||||
background: #F2F5F6; |
||||
overflow-y: auto; |
||||
} |
||||
.header { |
||||
width: 100%; |
||||
padding: 10px; |
||||
margin-bottom: 10px; |
||||
box-sizing: border-box; |
||||
.queryBox { |
||||
box-sizing: border-box; |
||||
padding: 5px 15px; |
||||
display: flex; |
||||
flex-direction: row; |
||||
flex-wrap: wrap; |
||||
align-items:center; |
||||
justify-content:left; |
||||
.queryField { |
||||
margin: 0 25px; |
||||
font-size: 14px; |
||||
input { |
||||
width: 320px; |
||||
height: 44px; |
||||
line-height: 34px; |
||||
border-radius: 5px; |
||||
padding-left: 5px; |
||||
outline: none; |
||||
border: 1px solid rgb(226, 211, 211); |
||||
} |
||||
button { |
||||
border: none; |
||||
color: white; |
||||
padding: 10px 25px; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
font-size: 16px; |
||||
margin: 4px 2px; |
||||
cursor: pointer; |
||||
border-radius: 8px; |
||||
outline:0 none !important; |
||||
} |
||||
} |
||||
.headerright{ |
||||
float: right; |
||||
} |
||||
} //queryBox |
||||
} |
||||
.centertable{ |
||||
width: 95%; |
||||
margin-right: 40px; |
||||
margin-left: 40px; |
||||
background-color: #FFFFFF; |
||||
table{ |
||||
td,th{ |
||||
height: 48px; |
||||
font-size: 16px; |
||||
} |
||||
td{ |
||||
border-bottom: 1px solid #F2F5F6; |
||||
} |
||||
thead{ |
||||
background-color:#F5FDFE; |
||||
} |
||||
.green{ |
||||
color: #07CDCF; |
||||
} |
||||
.red{ |
||||
color: #FF8678; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.operationSpan{ |
||||
margin: 0 10px; |
||||
.spanbtn { |
||||
font-weight: 550; |
||||
cursor: pointer; |
||||
} |
||||
.green{ color: #04ced1; } |
||||
.red{ color: #FF8678 } |
||||
.gray{ color: gray; } |
||||
} |
||||
|
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
|
||||
import { MarkPapersTwoComponent } from './mark-papers-two.component'; |
||||
|
||||
describe('MarkPapersTwoComponent', () => { |
||||
let component: MarkPapersTwoComponent; |
||||
let fixture: ComponentFixture<MarkPapersTwoComponent>; |
||||
|
||||
beforeEach(async(() => { |
||||
TestBed.configureTestingModule({ |
||||
declarations: [ MarkPapersTwoComponent ] |
||||
}) |
||||
.compileComponents(); |
||||
})); |
||||
|
||||
beforeEach(() => { |
||||
fixture = TestBed.createComponent(MarkPapersTwoComponent); |
||||
component = fixture.componentInstance; |
||||
fixture.detectChanges(); |
||||
}); |
||||
|
||||
it('should create', () => { |
||||
expect(component).toBeTruthy(); |
||||
}); |
||||
}); |
||||
@ -0,0 +1,49 @@
|
||||
/* |
||||
* @Descripttion:
|
||||
* @version:
|
||||
* @Author: sueRimn |
||||
* @Date: 2020-12-14 17:21:02 |
||||
* @LastEditors: sueRimn |
||||
* @LastEditTime: 2020-12-15 09:16:29 |
||||
*/ |
||||
import { Component, OnInit, ViewChild, Inject } from '@angular/core'; |
||||
import {HttpClient} from '@angular/common/http' |
||||
import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
||||
import { MatPaginator } from '@angular/material/paginator'; |
||||
import { MatTableDataSource } from '@angular/material/table'; |
||||
import { PageEvent } from '@angular/material/paginator'; |
||||
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
||||
import {FormControl} from '@angular/forms'; |
||||
import { Router,ActivatedRoute } from '@angular/router'; |
||||
const ELEMENT_DATA = [ |
||||
{name: "张三三", organization: '浦东支队', startTime: "2020-09-19 10:00", mark: '120',testState:'未阅卷'}, |
||||
{name: "提亚马特", organization: '黄埔支队', startTime: "2020-09-19 10:00", mark: '100',testState:'已阅卷'}, |
||||
{name: "艾泽拉斯", organization: '徐汇支队', startTime: "2020-09-19 10:00", mark: '90',testState:'已阅卷'}, |
||||
/* {name: "富华酒店", organization: '普陀支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'开考中'}, |
||||
{name: "立新加油站", organization: '浦东支队', startTime: "2020-09-19 10:00", overTime: '2020-09-19 12:00',testState:'开考中'}, |
||||
{name: "富华酒店", organization: '宝山支队', startTime: "2020-07-19 10:00", overTime: '2020-07-19 12:00',testState:'已结束'}, |
||||
{name: "裕达国际酒店", organization: '浦东支队', startTime: "2020-08-19 10:00", overTime: '2020-08-19 12:00',testState:'已结束'}, |
||||
{name: "锦德大酒店", organization: '长宁支队', startTime: "2019-09-19 10:00", overTime: '2019-09-19 12:00',testState:'已结束'}, */ |
||||
]; |
||||
|
||||
@Component({ |
||||
selector: 'app-mark-papers-two', |
||||
templateUrl: './mark-papers-two.component.html', |
||||
styleUrls: ['./mark-papers-two.component.scss'] |
||||
}) |
||||
export class MarkPapersTwoComponent implements OnInit { |
||||
|
||||
constructor(private router: Router,private activatedRoute: ActivatedRoute,public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { } |
||||
|
||||
ngOnInit(): void { |
||||
this.activatedRoute.queryParams.subscribe(param=>{ |
||||
this.headtext=param.level |
||||
//console.log(headName)
|
||||
}); |
||||
} |
||||
headtext |
||||
dataSource = ELEMENT_DATA; |
||||
markName//试卷名称
|
||||
markDate//考试日期
|
||||
|
||||
} |
||||
Loading…
Reference in new issue