20 changed files with 344 additions and 56 deletions
@ -0,0 +1 @@
|
||||
<p>file-category works!</p> |
||||
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-file-category', |
||||
templateUrl: './file-category.component.html', |
||||
styleUrls: ['./file-category.component.scss'] |
||||
}) |
||||
export class FileCategoryComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1 @@
|
||||
<p>histories works!</p> |
||||
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-histories', |
||||
templateUrl: './histories.component.html', |
||||
styleUrls: ['./histories.component.scss'] |
||||
}) |
||||
export class HistoriesComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1,42 @@
|
||||
<div class="box" id="inform"> |
||||
<div class="tablebox" id="tablebox"> |
||||
<nz-table *ngIf="tableScrollHeight" [nzLoading]="tableSpin" [nzPageSize]='9999' #headerTable [nzData]="list" |
||||
[nzShowPagination]="false" [nzScroll]="{ y:tableScrollHeight }" [nzNoResult]='null' nzTableLayout="fixed"> |
||||
<thead> |
||||
<tr> |
||||
<th [nzWidth]="'16%'"> |
||||
<span style="margin-left: 25%;">证件名称</span> |
||||
</th> |
||||
<th>证件编号</th> |
||||
<th>证件有效期</th> |
||||
<th>有效期类型</th> |
||||
<th>办理类型</th> |
||||
<th>通知内容</th> |
||||
<th>通知状态</th> |
||||
<th>处置状态</th> |
||||
<th>操作</th> |
||||
</tr> |
||||
</thead> |
||||
<tbody id="table"> |
||||
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||
<th> |
||||
<span style="margin-left: 25%;">证件名称</span> |
||||
</th> |
||||
<th>证件编号</th> |
||||
<th>证件有效期</th> |
||||
<th>有效期类型</th> |
||||
<th>办理类型</th> |
||||
<th>通知内容</th> |
||||
<th>通知状态</th> |
||||
<th>处置状态</th> |
||||
<th class="operation"> |
||||
<span class="buleColor">忽略</span> |
||||
<span class="greyColor" (click)="dispose()">处置</span> |
||||
<span class="buleColor">申请延期</span> |
||||
</th> |
||||
</tr> |
||||
</tbody> |
||||
</nz-table> |
||||
|
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,13 @@
|
||||
.box{ |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
.tablebox{ |
||||
width: 100%; |
||||
height: 100%; |
||||
.operation{ |
||||
span{ |
||||
margin-right: 6px; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,32 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
import { Observable, fromEvent } from 'rxjs'; |
||||
import { debounceTime } from 'rxjs/operators'; |
||||
@Component({ |
||||
selector: 'app-inform', |
||||
templateUrl: './inform.component.html', |
||||
styleUrls: ['./inform.component.scss'] |
||||
}) |
||||
export class InformComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
tableSpin = false |
||||
list = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1] |
||||
|
||||
tableScrollHeight |
||||
ngOnInit(): void { |
||||
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||
// 页面监听
|
||||
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||
}); |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
dispose() { |
||||
console.log('处置') |
||||
} |
||||
} |
||||
@ -0,0 +1,19 @@
|
||||
<div class="license" id="license"> |
||||
<div class="title"> |
||||
<div class="titlebox"> |
||||
<img src="../../../assets/images/logosm.png" alt=""> |
||||
<div class="nav"> |
||||
<div class="navitem"> |
||||
<span *ngFor="let item of navList" [ngClass]="{'grey': selectedItem != item}" |
||||
(click)="selectNav(item)">{{item}}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="content"> |
||||
<app-inform *ngIf="selectedItem == navList[0]"></app-inform> |
||||
<app-update-category *ngIf="selectedItem == navList[1]"></app-update-category> |
||||
<app-file-category *ngIf="selectedItem == navList[2]"></app-file-category> |
||||
<app-histories *ngIf="selectedItem == navList[3]"></app-histories> |
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,75 @@
|
||||
.license { |
||||
width: 100%; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
} |
||||
|
||||
.title { |
||||
width: 100%; |
||||
height: 64px; |
||||
box-sizing: border-box; |
||||
padding: 0 28px; |
||||
margin: 13px 0; |
||||
position: relative; |
||||
|
||||
.titlebox { |
||||
width: 100%; |
||||
height: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
img { |
||||
width: 65px; |
||||
height: 65px; |
||||
} |
||||
|
||||
.nav { |
||||
flex: 1; |
||||
height: 48px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
// background-image: linear-gradient(to right, #002147, #033565, #064e8e, #064e8e, #033565, #002147); |
||||
background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.32) 50%, rgba(35, 153, 255, 0) 100%); |
||||
|
||||
.navitem { |
||||
width: 100%; |
||||
height: 32px; |
||||
display: flex; |
||||
align-items: center; |
||||
// background-image: linear-gradient(to right, #002147, #0f5ca0, #1c88e6, #1c88e6, #0f5ca0, #002147); |
||||
background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.8) 50%, rgba(35, 153, 255, 0) 100%); |
||||
|
||||
span { |
||||
margin-left: 10px; |
||||
color: #bce0ff; |
||||
font-size: 20px; |
||||
font-family: titlefont; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
span:nth-child(1) { |
||||
margin-left: 12px; |
||||
} |
||||
|
||||
.grey { |
||||
color: #68829F; |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
|
||||
.packup { |
||||
position: absolute; |
||||
right: 33px; |
||||
top: 16px; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
.content{ |
||||
flex: 1; |
||||
box-sizing: border-box; |
||||
padding: 0 40px 20px 40px; |
||||
} |
||||
@ -0,0 +1,20 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-nav-bar', |
||||
templateUrl: './nav-bar.component.html', |
||||
styleUrls: ['./nav-bar.component.scss'] |
||||
}) |
||||
export class NavBarComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
navList = ['通知','更新类证件','档案类证件','历史纪录'] |
||||
selectedItem = '通知' |
||||
selectNav(item){ |
||||
this.selectedItem = item |
||||
} |
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1 @@
|
||||
<p>update-category works!</p> |
||||
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-update-category', |
||||
templateUrl: './update-category.component.html', |
||||
styleUrls: ['./update-category.component.scss'] |
||||
}) |
||||
export class UpdateCategoryComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
Loading…
Reference in new issue