13 changed files with 343 additions and 10 deletions
@ -0,0 +1,28 @@
|
||||
<div class="box informTime" 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>审批类型</th> |
||||
<th>是否年检</th> |
||||
<th>年检时间</th> |
||||
<th>操作</th> |
||||
</tr> |
||||
</thead> |
||||
<tbody id="table"> |
||||
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||
<td>{{item.licenseName}}</td> |
||||
<td> |
||||
{{item.isYearlyCheck ? '是' : '否'}} |
||||
</td> |
||||
<td>{{item.yearlyCheckDate | date:"MM/dd"}}</td> |
||||
<td class="operation"> |
||||
<span [ngClass]="{'greyColor': !item.isYearlyCheck}" class="blueColor" (click)="edit(item)">编辑</span> |
||||
</td> |
||||
</tr> |
||||
</tbody> |
||||
</nz-table> |
||||
|
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,15 @@
|
||||
.box { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
|
||||
.tablebox { |
||||
width: 100%; |
||||
height: 100%; |
||||
|
||||
.operation { |
||||
span { |
||||
margin-right: 6px; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,84 @@
|
||||
import { HttpClient } from '@angular/common/http'; |
||||
import { Component, ElementRef, OnInit, ViewContainerRef } from '@angular/core'; |
||||
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||
import { Observable, fromEvent } from 'rxjs'; |
||||
import { debounceTime } from 'rxjs/operators'; |
||||
import { EditAnnualInspectionComponent } from './edit-annual-inspection/edit-annual-inspection.component'; |
||||
@Component({ |
||||
selector: 'app-annual-inspection', |
||||
templateUrl: './annual-inspection.component.html', |
||||
styleUrls: ['./annual-inspection.component.scss'] |
||||
}) |
||||
export class AnnualInspectionComponent implements OnInit { |
||||
|
||||
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private http: HttpClient, private message: NzMessageService, private element: ElementRef) { } |
||||
tableSpin = false |
||||
|
||||
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' |
||||
}); |
||||
this.getAnnualInspectionList() |
||||
} |
||||
|
||||
|
||||
|
||||
list = [] |
||||
totalCount;//列表总数
|
||||
SkipCount: string = '0'; |
||||
MaxResultCount: string = '100'; |
||||
//获取当前油站档案类证照
|
||||
getAnnualInspectionList() { |
||||
this.tableSpin = true |
||||
let data = JSON.parse(sessionStorage.getItem('userdata')); |
||||
let params = { |
||||
OrganizationUnitId: data.organization.id || "", |
||||
IsContainsChildren: "true", |
||||
SkipCount: this.SkipCount, |
||||
MaxResultCount: this.MaxResultCount, |
||||
} |
||||
this.http.get(`/api/services/app/OrganizationValidityLicenseRule/GetCurOrgYearlyCheckRules`, { params }).subscribe((data: any) => { |
||||
|
||||
this.list = data.result |
||||
this.list = [...this.list] |
||||
this.tableSpin = false |
||||
console.log(data) |
||||
}) |
||||
} |
||||
|
||||
|
||||
edit(item) { |
||||
console.log('item', item) |
||||
if (!item.isYearlyCheck) { |
||||
this.message.create('warning', '不需要年检'); |
||||
return |
||||
} |
||||
|
||||
const modal = this.modal.create({ |
||||
nzContent: EditAnnualInspectionComponent, |
||||
nzViewContainerRef: this.viewContainerRef, |
||||
nzWidth: 450, |
||||
nzBodyStyle: { |
||||
'border': '1px solid #91CCFF', |
||||
'border-radius': '0px', |
||||
'padding': '7px', |
||||
'box-shadow': '0 0 8px 0 #fff', |
||||
'background-image': 'linear-gradient(#003665, #000f25)' |
||||
}, |
||||
nzComponentParams: { |
||||
data: item |
||||
}, |
||||
nzFooter: null, |
||||
nzClosable: false, |
||||
nzOnOk: async () => { |
||||
this.getAnnualInspectionList() |
||||
} |
||||
}); |
||||
const instance = modal.getContentComponent(); |
||||
modal.afterClose.subscribe(result => { }); |
||||
} |
||||
} |
||||
@ -0,0 +1,33 @@
|
||||
<div class="box" id="editfilecategory"> |
||||
<div class="title"> |
||||
<div class="titlecontent"> |
||||
编辑 |
||||
</div> |
||||
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||
</div> |
||||
<form nz-form [formGroup]="validateForm" class="form"> |
||||
|
||||
<div class="timebox"> |
||||
<div> |
||||
<p>请选择年检日期</p> |
||||
|
||||
<nz-form-item> |
||||
<nz-form-control> |
||||
<!-- <nz-input-group> |
||||
<input nz-input type="number" formControlName="time1" placeholder="请选择月份" /> |
||||
</nz-input-group> --> |
||||
<nz-date-picker [nzFormat]="dateFormat" style="width: 100%;" formControlName="time"></nz-date-picker> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
<!-- |
||||
<p class="p2">默认时间： 90天</p> --> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
<div class="btnbox"> |
||||
<button nz-button type="submit" class="ok" (click)="ok()" [nzLoading]="isLoading">保存</button> |
||||
<button nz-button type="button" class="cancel" (click)="destroyModal()">取消</button> |
||||
</div> |
||||
</form> |
||||
</div> |
||||
@ -0,0 +1,105 @@
|
||||
.box { |
||||
.title { |
||||
font-family: sybold; |
||||
width: 100%; |
||||
height: 48px; |
||||
background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.57) 50%, rgba(35, 153, 255, 0) 100%); |
||||
display: flex; |
||||
align-items: center; |
||||
position: relative; |
||||
|
||||
.titlecontent { |
||||
width: 100%; |
||||
height: 32px; |
||||
line-height: 32px; |
||||
background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.57) 50%, rgba(35, 153, 255, 0) 100%); |
||||
text-align: center; |
||||
color: #91CCFF; |
||||
font-size: 16px; |
||||
} |
||||
|
||||
i { |
||||
position: absolute; |
||||
right: 12px; |
||||
color: #fff; |
||||
font-size: 18px; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
p { |
||||
margin-bottom: 0; |
||||
color: #C4E2FC; |
||||
margin: 12px 0; |
||||
} |
||||
|
||||
.p2 { |
||||
margin: 6px 0; |
||||
font-size: 12px; |
||||
color: #C4E2FC; |
||||
} |
||||
|
||||
.form { |
||||
box-sizing: border-box; |
||||
padding: 0 17px; |
||||
|
||||
.timebox { |
||||
display: flex; |
||||
|
||||
div { |
||||
flex: 1; |
||||
display: flex; |
||||
flex-direction: column; |
||||
box-sizing: border-box; |
||||
padding: 0 6px; |
||||
} |
||||
} |
||||
|
||||
.explain { |
||||
box-sizing: border-box; |
||||
padding: 0 6px; |
||||
|
||||
textarea { |
||||
width: 100%; |
||||
height: 100px; |
||||
|
||||
background: rgba(145, 204, 255, 0.16); |
||||
color: #fff; |
||||
} |
||||
} |
||||
|
||||
.btnbox { |
||||
width: 100%; |
||||
margin-top: 24px; |
||||
margin-bottom: 17px; |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
box-sizing: border-box; |
||||
padding: 0 7px; |
||||
|
||||
button { |
||||
border-radius: 0px; |
||||
color: #91CCFF; |
||||
} |
||||
|
||||
button:nth-child(2) { |
||||
margin-left: 16px; |
||||
} |
||||
|
||||
.ok { |
||||
background: rgba(0, 129, 255, 0.4); |
||||
} |
||||
|
||||
.cancel { |
||||
border: 1px solid #C4E2FC; |
||||
background: #0c1e38; |
||||
color: rgba(99, 102, 105, 0.6); |
||||
box-shadow: 0 0 3px 0 #fff inset; |
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1,63 @@
|
||||
import { Component, OnInit, Input } from '@angular/core'; |
||||
import { NzModalRef } from 'ng-zorro-antd/modal'; |
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||
import { HttpClient } from '@angular/common/http'; |
||||
import { ObjectsSimpleService } from 'src/app/service/objectsSimple.service'; |
||||
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||
import * as moment from 'moment'; |
||||
|
||||
@Component({ |
||||
selector: 'app-edit-annual-inspection', |
||||
templateUrl: './edit-annual-inspection.component.html', |
||||
styleUrls: ['./edit-annual-inspection.component.scss'] |
||||
}) |
||||
export class EditAnnualInspectionComponent implements OnInit { |
||||
|
||||
|
||||
@Input() data?: any; |
||||
|
||||
validateForm!: FormGroup; |
||||
constructor(private message: NzMessageService, private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private objectsSrv: ObjectsSimpleService) { } |
||||
|
||||
|
||||
dataCopy |
||||
ngOnInit(): void { |
||||
this.dataCopy = JSON.parse(JSON.stringify(this.data)) |
||||
this.validateForm = this.fb.group({ |
||||
time: [null, [Validators.required]], |
||||
}); |
||||
|
||||
} |
||||
|
||||
|
||||
destroyModal() { |
||||
this.modal.destroy({ data: 'this the result data' }); |
||||
|
||||
} |
||||
|
||||
|
||||
isLoading = false |
||||
ok() { |
||||
if (this.validateForm.valid) { |
||||
this.isLoading = true |
||||
let params = { |
||||
id: this.dataCopy.licenseTypeId, |
||||
date: moment(this.validateForm.value.time).format('YYYY-MM-MM')//开业时间格式化
|
||||
} |
||||
this.http.put('/api/services/app/OrganizationValidityLicenseRule/UpdateYearlyCheckDate', null, { params: params }).subscribe((data) => { |
||||
this.message.create('success', '修改成功'); |
||||
this.isLoading = false |
||||
this.modal.triggerOk() |
||||
}, err => { |
||||
this.message.create('error', '修改失败'); |
||||
this.isLoading = false |
||||
}) |
||||
} else { |
||||
this.message.create('warning', '请填写完整！'); |
||||
} |
||||
|
||||
|
||||
} |
||||
|
||||
dateFormat = 'MM/dd'; |
||||
} |
||||
Loading…
Reference in new issue