11 changed files with 249 additions and 8 deletions
@ -0,0 +1 @@
|
||||
<p>addequipment works!</p> |
||||
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-addequipment', |
||||
templateUrl: './addequipment.component.html', |
||||
styleUrls: ['./addequipment.component.scss'] |
||||
}) |
||||
export class AddequipmentComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1 @@
|
||||
<p>editequipment works!</p> |
||||
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
@Component({ |
||||
selector: 'app-editequipment', |
||||
templateUrl: './editequipment.component.html', |
||||
styleUrls: ['./editequipment.component.scss'] |
||||
}) |
||||
export class EditequipmentComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
} |
||||
|
||||
} |
||||
@ -1 +1,82 @@
|
||||
<p>equipment-info works!</p> |
||||
<!-- <p>器材管理</p> --> |
||||
<div class="box" id="equipmentInfo"> |
||||
<div class="content"> |
||||
<div class="title"> |
||||
<app-title [name]="'编辑器材信息'"></app-title> |
||||
</div> |
||||
<div class="topbox"> |
||||
<div class="lefttop"> |
||||
<span>消防器材列表</span> |
||||
</div> |
||||
<div class="righttop"> |
||||
<form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()"> |
||||
<nz-form-item> |
||||
<nz-form-control> |
||||
<nz-input-group nzPrefixIcon="search"> |
||||
<input type="text" nz-input placeholder="请输入器材名称" formControlName="search" /> |
||||
</nz-input-group> |
||||
</nz-form-control> |
||||
<button style="display: none;" type="submit"></button> |
||||
</nz-form-item> |
||||
</form> |
||||
<button nz-button (click)="add()">新增</button> |
||||
</div> |
||||
</div> |
||||
<div class="tablebox"> |
||||
<div class="table"> |
||||
<div nz-row class="th"> |
||||
<div nz-col nzSpan="5" style="box-sizing: border-box;padding-left: 28px;"> |
||||
消防器材 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
规格 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
购入日期 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
生产日期 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
有效期至 |
||||
</div> |
||||
<div nz-col nzSpan="3"> |
||||
操作 |
||||
</div> |
||||
</div> |
||||
<div class="tbody"> |
||||
<div nz-row class="tr" *ngFor="let item of arr"> |
||||
<div nz-col nzSpan="5" style="box-sizing: border-box;padding-left: 28px;"> |
||||
干粉灭火器 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
普通 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
2021.01.05 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
2021.01.05 |
||||
</div> |
||||
<div nz-col nzSpan="4"> |
||||
2021.01.05 |
||||
</div> |
||||
<div nz-col nzSpan="3" class="btn"> |
||||
<span> |
||||
编辑 |
||||
</span> |
||||
<span> |
||||
删除 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="pagination"> |
||||
<nz-pagination [nzPageIndex]="1" [nzTotal]="85" [nzPageSize]="20" [nzShowTotal]="totalTemplate" |
||||
nzShowQuickJumper></nz-pagination> |
||||
<ng-template #totalTemplate let-total> 16条/页,共100条 </ng-template> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
@ -0,0 +1,117 @@
|
||||
.box { |
||||
width: 100%; |
||||
height: 100%; |
||||
display: flex; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.content { |
||||
width: 1000px; |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
|
||||
.title { |
||||
height: 48px; |
||||
width: 100%; |
||||
margin: 16px 0; |
||||
} |
||||
|
||||
.topbox { |
||||
width: 1000px; |
||||
height: 34px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
margin-bottom: 16px; |
||||
|
||||
.lefttop { |
||||
span { |
||||
color: #C4E2FC; |
||||
font-size: 16px; |
||||
} |
||||
} |
||||
|
||||
.righttop { |
||||
height: 34px; |
||||
display: flex; |
||||
|
||||
button { |
||||
margin-left: 16px; |
||||
background: #143c61; |
||||
color: #91CCFF; |
||||
border-radius: 0px; |
||||
border: 1px solid #36A2FF; |
||||
width: 64px; |
||||
} |
||||
|
||||
nz-input-group { |
||||
height: 32px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.tablebox { |
||||
flex: 1; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
overflow: hidden; |
||||
|
||||
.table { |
||||
color: white; |
||||
flex: 1; |
||||
width: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
overflow: hidden; |
||||
font-size: 16px; |
||||
|
||||
.th { |
||||
height: 40px; |
||||
line-height: 40px; |
||||
color: #23D9FF; |
||||
background: rgba(35, 153, 255, 0.2); |
||||
border: 1px solid rgba(35, 217, 255, 0.4); |
||||
// box-shadow: 0 0 3px 1px rgba(35, 217, 255, 0.4); |
||||
} |
||||
|
||||
.tbody { |
||||
flex: 1; |
||||
overflow-y: auto; |
||||
color: #C4E2FC; |
||||
font-size: 15px; |
||||
|
||||
.tr { |
||||
height: 40px; |
||||
line-height: 40px; |
||||
border-bottom: 1px solid #115188; |
||||
|
||||
.btn { |
||||
span { |
||||
color: #2399FF; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
span:nth-child(1) { |
||||
margin-right: 18px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.pagination { |
||||
height: 32px; |
||||
margin: 15px 0; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
} |
||||
|
||||
::-webkit-scrollbar { |
||||
width: 0px; |
||||
} |
||||
|
||||
} |
||||
} |
||||
@ -1,15 +1,23 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
|
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||
@Component({ |
||||
selector: 'app-equipment-info', |
||||
templateUrl: './equipment-info.component.html', |
||||
styleUrls: ['./equipment-info.component.scss'] |
||||
}) |
||||
export class EquipmentInfoComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
validateForm!: FormGroup; |
||||
constructor(private fb: FormBuilder) { } |
||||
arr = [1,1,1,1,1,1,1,1,1] |
||||
ngOnInit(): void { |
||||
this.validateForm = this.fb.group({ |
||||
search: [null] |
||||
}); |
||||
} |
||||
submitForm(){ |
||||
|
||||
} |
||||
add(){ |
||||
|
||||
} |
||||
} |
||||
|
||||
Loading…
Reference in new issue