138 changed files with 8695 additions and 573 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,64 @@ |
|||||||
|
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: [this.dataCopy.yearlyCheckDate, [Validators.required]], |
||||||
|
}); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
isLoading = false |
||||||
|
ok() { |
||||||
|
if (this.validateForm.valid) { |
||||||
|
this.isLoading = true |
||||||
|
let body = { |
||||||
|
licenseTypeId: this.dataCopy.licenseTypeId, |
||||||
|
organizationId: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
yearlyCheckDate: moment(this.validateForm.value.time).format('YYYY-MM-DD')//开业时间格式化
|
||||||
|
} |
||||||
|
this.http.put('/api/services/app/OrganizationValidityLicenseRule/UpdateYearlyCheckDate', body).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'; |
||||||
|
} |
||||||
@ -0,0 +1,30 @@ |
|||||||
|
<div class="box" id="detailsupdatecategory"> |
||||||
|
<div class="title"> |
||||||
|
<div class="titlecontent"> |
||||||
|
详情 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<p>{{organizationName}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p class="flexp"> |
||||||
|
<span>办理提醒时间：修改时间 {{data.handleRemindDays}}天</span> |
||||||
|
<span>默认时间 {{data.handleRemindDaysDefault}}天</span> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p class="flexp"> |
||||||
|
<span>临期提醒时间：修改时间 {{data.closingRemindDays}}天</span> |
||||||
|
<span>默认时间 {{data.closingRemindDaysDefault}}天</span> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>修改说明：{{data.remark}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>审核状态：{{data.auditStatus | auditStatus}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>驳回说明：{{data.auditLog? data.auditLog.rejectReason : ''}}</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
@ -0,0 +1,65 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 15px; |
||||||
|
max-height: 580px; |
||||||
|
overflow-y: auto; |
||||||
|
|
||||||
|
.circle { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
background: linear-gradient(180deg, #36A2FF 0%, #FFFFFF 100%); |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.recordP { |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
margin-bottom: 0; |
||||||
|
color: #C4E2FC; |
||||||
|
margin: 12px 0; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 88px; |
||||||
|
height: 56px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
.flexp{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,22 @@ |
|||||||
|
import { Component, Input, OnInit } from '@angular/core'; |
||||||
|
import { NzModalRef } from 'ng-zorro-antd/modal'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-details-inform-time', |
||||||
|
templateUrl: './audit-details-inform-time.component.html', |
||||||
|
styleUrls: ['./audit-details-inform-time.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditDetailsInformTimeComponent implements OnInit { |
||||||
|
@Input() data?: any; |
||||||
|
constructor(private modal: NzModalRef) { } |
||||||
|
|
||||||
|
|
||||||
|
organizationName |
||||||
|
ngOnInit(): void { |
||||||
|
|
||||||
|
this.organizationName = JSON.parse(sessionStorage.getItem('userdata')).organization.displayName |
||||||
|
} |
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,46 @@ |
|||||||
|
<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 rowspan="2" [nzWidth]="'16%'"> |
||||||
|
<span>审批类型</span> |
||||||
|
</th> |
||||||
|
<th colspan="2">办理提醒时间</th> |
||||||
|
<th colspan="2">临期提醒时间</th> |
||||||
|
<th rowspan="2">提交审核时间</th> |
||||||
|
<th rowspan="2">审核状态</th> |
||||||
|
<th rowspan="2">操作</th> |
||||||
|
</tr> |
||||||
|
<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.handleRemindDaysDefault}}天</td> |
||||||
|
<td>{{item.handleRemindDays}}天</td> |
||||||
|
<td>{{item.closingRemindDaysDefault}}天</td> |
||||||
|
<td>{{item.closingRemindDays}}天</td> |
||||||
|
<td>{{(item.auditLog && item.auditLog.committedTime) ? (item.auditLog.committedTime | date:"yyyy-MM-dd HH:mm:ss") : '/'}}</td> |
||||||
|
<td>{{item.auditStatus | auditStatus}}</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="edit(item)" |
||||||
|
[ngClass]="{'greyColor': item.auditStatus == 1}">编辑</span> |
||||||
|
<span class="blueColor" (click)="unCommit(item)" |
||||||
|
*ngIf="item.auditStatus == 1">撤销审核</span> |
||||||
|
<span class="blueColor" (click)="details(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,130 @@ |
|||||||
|
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 { AuditDetailsInformTimeComponent } from './audit-details-inform-time/audit-details-inform-time.component'; |
||||||
|
import { EditInformTimeComponent } from './edit-inform-time/edit-inform-time.component'; |
||||||
|
// import { AuditDisposeComponent } from './audit-dispose/audit-dispose.component';
|
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-inform-time', |
||||||
|
templateUrl: './audit-inform-time.component.html', |
||||||
|
styleUrls: ['./audit-inform-time.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditInformTimeComponent implements OnInit { |
||||||
|
|
||||||
|
constructor(private message: NzMessageService, private http: HttpClient, private element: ElementRef, private modal: NzModalService, private viewContainerRef: ViewContainerRef) { } |
||||||
|
tableSpin = false |
||||||
|
list = [] |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
ngOnInit(): void { |
||||||
|
// 页面监听
|
||||||
|
this.tableScrollHeight = '0px' |
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader) + 'px' |
||||||
|
}); |
||||||
|
|
||||||
|
this.getTimeList() |
||||||
|
} |
||||||
|
|
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '100' |
||||||
|
async getTimeList() { |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
IsContainsChildren: 'true', |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
} |
||||||
|
this.tableSpin = true |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.http.get('/api/services/app/OrganizationValidityLicenseRule/GetCurOrgRules', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
this.list = data.result |
||||||
|
this.list = [...this.list] |
||||||
|
console.log('时间表格', data) |
||||||
|
this.tableSpin = false |
||||||
|
|
||||||
|
setTimeout(() => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader) + 'px' |
||||||
|
}, 0); |
||||||
|
resolve(data) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
edit(item) { |
||||||
|
console.log('item', item) |
||||||
|
if (item.auditStatus == 1) { |
||||||
|
this.message.create('warning', '审核中不允许编辑'); |
||||||
|
return |
||||||
|
} |
||||||
|
|
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: EditInformTimeComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 600, |
||||||
|
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.getTimeList() |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
details(item) { |
||||||
|
console.log('item', item) |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: AuditDetailsInformTimeComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 650, |
||||||
|
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 () => { |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
|
||||||
|
unCommit(item) { |
||||||
|
let params = { |
||||||
|
id: item.id |
||||||
|
} |
||||||
|
this.http.post('/api/services/app/OrganizationValidityLicenseRule/Uncommit', '', { params: params }).subscribe((data) => { |
||||||
|
this.message.create('success', '撤销审核成功'); |
||||||
|
this.getTimeList() |
||||||
|
}, err => { |
||||||
|
this.message.create('error', '撤销审核失败'); |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,54 @@ |
|||||||
|
<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-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<p class="p2">默认时间： 90天</p> |
||||||
|
</div> |
||||||
|
<div> |
||||||
|
<p>临期提醒时间</p> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-control> |
||||||
|
<nz-input-group> |
||||||
|
<input nz-input type="number" formControlName="time2" placeholder="请填写时间" /> |
||||||
|
</nz-input-group> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<p class="p2">默认时间： 30天</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="explain"> |
||||||
|
<p>修改说明</p> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-control> |
||||||
|
<textarea formControlName="explain"></textarea> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</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,67 @@ |
|||||||
|
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'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-edit-inform-time', |
||||||
|
templateUrl: './edit-inform-time.component.html', |
||||||
|
styleUrls: ['./edit-inform-time.component.scss'] |
||||||
|
}) |
||||||
|
export class EditInformTimeComponent 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({ |
||||||
|
time1: [this.dataCopy.handleRemindDays, [Validators.required]], |
||||||
|
time2: [this.dataCopy.closingRemindDays, [Validators.required]], |
||||||
|
explain: [null] |
||||||
|
}); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
isLoading = false |
||||||
|
ok() { |
||||||
|
if (this.validateForm.valid) { |
||||||
|
this.isLoading = true |
||||||
|
let body = { |
||||||
|
licenseTypeId: this.dataCopy.licenseTypeId, |
||||||
|
organizationId: this.dataCopy.organizationId, |
||||||
|
handleRemindDays: this.validateForm.value.time1, |
||||||
|
closingRemindDays: this.validateForm.value.time2, |
||||||
|
remark: this.validateForm.value.explain |
||||||
|
} |
||||||
|
console.log(body) |
||||||
|
this.http.put('/api/services/app/OrganizationValidityLicenseRule/UpdateAndCommit', body).subscribe((data) => { |
||||||
|
console.log('提交审核成功') |
||||||
|
this.message.create('success', '提交审核成功'); |
||||||
|
this.isLoading = false |
||||||
|
this.modal.triggerOk() |
||||||
|
}, err => { |
||||||
|
this.message.create('error', '提交审核失败'); |
||||||
|
this.isLoading = false |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '请填写完整！'); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,59 @@ |
|||||||
|
<div class="box" id="detailsupdatecategory"> |
||||||
|
<div class="title"> |
||||||
|
<div class="titlecontent"> |
||||||
|
处置 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<p *ngIf="data.auditType != 0 && data.auditType != 1 && data.gasStation">{{data.gasStation.companyName}} - {{data.gasStation.locationName}} - {{data.gasStation.stationName}}</p> |
||||||
|
<div class="cutoffrule" *ngIf="data.auditType != 0 && data.auditType != 1"></div> |
||||||
|
<div *ngIf="data.auditType == 0"><app-gas-base-info [data]="data"></app-gas-base-info></div> |
||||||
|
<div *ngIf="data.auditType == 1"> |
||||||
|
<p> |
||||||
|
办理提醒时间：修改时间 {{data.getData.handleRemindDays}}天 |
||||||
|
<span style="float: right;">默认时间 {{data.getData.handleRemindDaysDefault}}天</span> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
临期提醒时间：修改时间 {{data.getData.closingRemindDays}}天 |
||||||
|
<span style="float: right;">默认时间 {{data.getData.closingRemindDaysDefault}}天</span> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>修改说明： {{data.getData.remark}}</p> |
||||||
|
</div> |
||||||
|
<div *ngIf="data.auditType == 2"> |
||||||
|
<p>证件名称: {{data.getData.licenseTypeName}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>证件编号: {{data.getData.licenseCode || ''}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>证件有效期: <span *ngIf="!data.getData.isLongTerm">{{data.getData.validityStartTime | date:"yyyy/MM/dd"}} - </span>{{data.getData.validityEndTime | date:"yyyy/MM/dd"}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>办理类型: {{getHandleTypes(data.getData.handleTypes)}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>有效期类型: {{data.getData.validityDays || 0}}天</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>是否年检: <span *ngIf="data.getData.isYearlyCheck">是</span><span *ngIf="!data.getData.isYearlyCheck">否</span></p> |
||||||
|
</div> |
||||||
|
<div *ngIf="data.auditType == 3"> |
||||||
|
<p>证件名称: {{data.getData.licenseTypeName}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>有效期类型: <span *ngIf="data.getData.validatyType == 0">不适用</span><span *ngIf="data.getData.validatyType == 1">无</span><span *ngIf="data.getData.validatyType == 2">有</span></p> |
||||||
|
</div> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p [hidden]="data.getData.imageUrl === undefined">证件图片: |
||||||
|
<img *ngIf="data.getData.imageUrl && getFileType(data.getData.imageUrl) == 'img'" [src]="data.getData.imageUrl" (click)="viewImg(data.getData.imageUrl)"> |
||||||
|
<img *ngIf="data.getData.imageUrl && getFileType(data.getData.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(data.getData)"> |
||||||
|
<img *ngIf="data.getData.imageUrl && getFileType(data.getData.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(data.getData)"> |
||||||
|
<div class="cutoffrule" [hidden]="data.getData.imageUrl === undefined"></div> |
||||||
|
<p>审批意见：</p> |
||||||
|
<textarea style="background: #173350;height: 100px;width: 100%;border-radius: 0;border: 0;color: white;" cols="30" rows="10" [(ngModel)]="textarea"></textarea> |
||||||
|
<div class="btnbox"> |
||||||
|
<button nz-button type="button" class="ok" (click)="ok(true)">通过</button> |
||||||
|
<button nz-button type="button" class="cancel" (click)="ok(false)">驳回</button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
@ -0,0 +1,91 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 15px; |
||||||
|
// max-height: 580px; |
||||||
|
// overflow-y: auto; |
||||||
|
|
||||||
|
.circle { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
background: linear-gradient(180deg, #36A2FF 0%, #FFFFFF 100%); |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.recordP { |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
width: 100%; |
||||||
|
margin: 10px 0; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
button { |
||||||
|
border-radius: 0px; |
||||||
|
color: #91CCFF; |
||||||
|
} |
||||||
|
|
||||||
|
button:nth-child(2) { |
||||||
|
margin-left: 16px; |
||||||
|
} |
||||||
|
|
||||||
|
.ok { |
||||||
|
|
||||||
|
background: rgba(0, 129, 255, 0.24); |
||||||
|
} |
||||||
|
|
||||||
|
.cancel { |
||||||
|
border: 1px solid #C4E2FC; |
||||||
|
|
||||||
|
background: rgba(255, 75, 101, 0.24); |
||||||
|
|
||||||
|
color: #C4E2FC; |
||||||
|
// box-shadow: 0 0 3px 0 #fff inset; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
margin-bottom: 0; |
||||||
|
color: #C4E2FC; |
||||||
|
margin: 12px 0; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 88px; |
||||||
|
height: 56px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,102 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
import { handleType, handleTypeList } from 'src/app/pages/license/update-category/edit-update-category/edit-update-category.component'; |
||||||
|
|
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-dispose', |
||||||
|
templateUrl: './audit-dispose.component.html', |
||||||
|
styleUrls: ['./audit-dispose.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditDisposeComponent implements OnInit { |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
constructor(private modal: NzModalRef, private message: NzMessageService) { } |
||||||
|
|
||||||
|
textarea: string = ""; //审批意见
|
||||||
|
ngOnInit(): void { |
||||||
|
console.log(this.data) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy(); |
||||||
|
} |
||||||
|
|
||||||
|
isPass: boolean; |
||||||
|
ok(isPass: boolean) { |
||||||
|
this.isPass = isPass; |
||||||
|
this.modal.triggerOk() |
||||||
|
} |
||||||
|
|
||||||
|
//获取办理类型
|
||||||
|
getHandleTypes(handleTypes: any[]):string { |
||||||
|
if (!handleTypes || !handleTypes.length) { |
||||||
|
return |
||||||
|
} |
||||||
|
let names: string[] = [] |
||||||
|
let handleTypeList = JSON.parse(JSON.stringify(handleTypes)); |
||||||
|
let list: handleTypeList[] = new handleType().list; |
||||||
|
handleTypeList.forEach(item=>{ |
||||||
|
list.find(element=>{ |
||||||
|
item == element.value? names.push(element.name) : null |
||||||
|
}) |
||||||
|
}) |
||||||
|
return names.join(',') |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,44 @@ |
|||||||
|
<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: 30px;">审批类型</span> |
||||||
|
</th> |
||||||
|
<th>审批信息</th> |
||||||
|
<th>加油站名称</th> |
||||||
|
<th [nzWidth]="'16%'">区域</th> |
||||||
|
<th>省公司</th> |
||||||
|
<th>提交时间</th> |
||||||
|
<th>审批状态</th> |
||||||
|
<th>操作</th> |
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 30px;">{{item.auditTitle || ''}}</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<span *ngIf="item.auditType == 0">油站信息</span> |
||||||
|
<span *ngIf="item.auditType == 1">更新类证照提醒时间</span> |
||||||
|
<span *ngIf="item.auditType == 2">更新类证照</span> |
||||||
|
<span *ngIf="item.auditType == 3">档案类证照</span> |
||||||
|
</td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.stationName}}</label></td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.locationName}}</label></td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.companyName}}</label></td> |
||||||
|
<td>{{item.committedTime | date:"yyyy/MM/dd"}}</td> |
||||||
|
<td>{{item.auditStatusDesc}}</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="dispose(item)">处置</span> |
||||||
|
<span class="blueColor" (click)="details(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,196 @@ |
|||||||
|
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 { DetailsFileCategoryComponent } from '../../license/file-category/details-file-category/details-file-category.component'; |
||||||
|
import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component'; |
||||||
|
import { AuditDetailsInformTimeComponent } from '../audit-inform-time/audit-details-inform-time/audit-details-inform-time.component'; |
||||||
|
import { GasBaseInfoComponent } from '../gas-base-info/gas-base-info.component'; |
||||||
|
import { AuditDisposeComponent } from './audit-dispose/audit-dispose.component'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-ing', |
||||||
|
templateUrl: './audit-ing.component.html', |
||||||
|
styleUrls: ['./audit-ing.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditIngComponent 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 = '100px' |
||||||
|
// 页面监听
|
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}); |
||||||
|
this.getStationList() |
||||||
|
} |
||||||
|
|
||||||
|
ngAfterViewInit(): void { |
||||||
|
fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe((event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
this.getStationList() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
list = [] |
||||||
|
totalCount;//列表总数
|
||||||
|
SkipCount: string = '0'; |
||||||
|
MaxResultCount: string = '100'; |
||||||
|
//获取当前油站档案类证照
|
||||||
|
getStationList() { |
||||||
|
this.tableSpin = true |
||||||
|
let data = JSON.parse(sessionStorage.getItem('userdata')); |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: data.organization.id || "", |
||||||
|
IsContainsChildren: "true", |
||||||
|
AuditStatuses: "1", |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
} |
||||||
|
this.http.get(`/api/services/app/ContentAuditLog/GetAuditting`, { params }).subscribe((info: any) => { |
||||||
|
info.result.items.forEach(element => { |
||||||
|
element.itemData = JSON.parse(element.itemData) |
||||||
|
}); |
||||||
|
this.list = this.list.concat(info.result.items); |
||||||
|
this.list = [...this.list] |
||||||
|
this.totalCount = info.result.totalCount |
||||||
|
this.tableSpin = false |
||||||
|
setTimeout(() => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}, 0); |
||||||
|
|
||||||
|
console.log(this.list) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
dispose(item) { |
||||||
|
// if (item.auditStatus != 1) {
|
||||||
|
// return
|
||||||
|
// }
|
||||||
|
this.getData(item).then(res => { |
||||||
|
item.getData = res |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: AuditDisposeComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: item.auditType == 0 ? 700 : 600, |
||||||
|
nzBodyStyle: { |
||||||
|
'border': '1px solid #91CCFF', |
||||||
|
'border-radius': '0px', |
||||||
|
'padding': '7px', |
||||||
|
'box-shadow': '0 0 8px 0 #fff', |
||||||
|
'background-image': 'linear-gradient(#003665, #000f25)' |
||||||
|
}, |
||||||
|
nzStyle: { |
||||||
|
'top': '50px', |
||||||
|
}, |
||||||
|
nzComponentParams: { |
||||||
|
data: item |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
nzOnOk: async () => { |
||||||
|
await new Promise(resolve => { |
||||||
|
let url |
||||||
|
if (item.auditType == 0) { |
||||||
|
url = '/api/services/app/GasStation/Audit' |
||||||
|
} else if (item.auditType == 1) { |
||||||
|
url = '/api/services/app/OrganizationValidityLicenseRule/Audit' |
||||||
|
} else if (item.auditType == 2) { |
||||||
|
url = '/api/services/app/StationValidityLicense/Audit' |
||||||
|
} else if (item.auditType) { |
||||||
|
url = '/api/services/app/StationFileLicense/Audit' |
||||||
|
} |
||||||
|
let params = { |
||||||
|
id: item.auditType == 0 ? item.gasStation.id : item.getData.id, |
||||||
|
remark: instance.textarea |
||||||
|
} |
||||||
|
let body = instance.isPass ? 2 : 3; |
||||||
|
this.http.post(url, body, { params }).subscribe(data => { |
||||||
|
resolve(data); |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getStationList(); |
||||||
|
this.message.create('success', '审核完成！'); |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
details(item) { |
||||||
|
let component |
||||||
|
if (item.auditType == 0) { |
||||||
|
component = GasBaseInfoComponent |
||||||
|
} else if (item.auditType == 1) { |
||||||
|
component = AuditDetailsInformTimeComponent |
||||||
|
} else if (item.auditType == 2) { |
||||||
|
component = DetailsUpdateCategoryComponent |
||||||
|
} else if (item.auditType) { |
||||||
|
component = DetailsFileCategoryComponent |
||||||
|
} |
||||||
|
this.getData(item).then(res => { |
||||||
|
item.getData = res |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: component, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: item.auditType == 0 ? 700 : 450, |
||||||
|
nzBodyStyle: { |
||||||
|
'border': '1px solid #91CCFF', |
||||||
|
'border-radius': '0px', |
||||||
|
'padding': '7px', |
||||||
|
'box-shadow': '0 0 8px 0 #fff', |
||||||
|
'background-image': 'linear-gradient(#003665, #000f25)' |
||||||
|
}, |
||||||
|
nzStyle: { |
||||||
|
'top': '50px', |
||||||
|
}, |
||||||
|
nzComponentParams: { |
||||||
|
data: item.getData |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取证照类data
|
||||||
|
getData(item) { |
||||||
|
let url |
||||||
|
if (item.auditType == 0) { //油站基本信息
|
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let organization = { organizationId: item.organizationId } |
||||||
|
resolve(organization) |
||||||
|
}) |
||||||
|
} else if (item.auditType == 1) { |
||||||
|
url = '/api/services/app/OrganizationValidityLicenseRule/Get' |
||||||
|
} else if (item.auditType == 2) { |
||||||
|
url = '/api/services/app/StationValidityLicense/Get' |
||||||
|
} else if (item.auditType) { |
||||||
|
url = '/api/services/app/StationFileLicense/Get' |
||||||
|
} |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let params = { id: item.itemId } |
||||||
|
this.http.get(url, { params }).subscribe((data: any) => { |
||||||
|
resolve(data.result) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,23 @@ |
|||||||
|
<div class="audit" id="audit"> |
||||||
|
<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> |
||||||
|
<span *ngIf="isLevel == 2" [ngClass]="{'grey': selectedItem != '通知时间'}" |
||||||
|
(click)="selectNav('通知时间')">通知时间</span> |
||||||
|
<span *ngIf="isLevel == 2" [ngClass]="{'grey': selectedItem != '年检设置'}" |
||||||
|
(click)="selectNav('年检设置')">年检设置</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="content"> |
||||||
|
<app-audit-ing *ngIf="selectedItem == navList[0]"></app-audit-ing> |
||||||
|
<app-audit-record *ngIf="selectedItem == navList[1]"></app-audit-record> |
||||||
|
<app-audit-inform-time *ngIf="selectedItem == '通知时间'"></app-audit-inform-time> |
||||||
|
<app-annual-inspection *ngIf="selectedItem == '年检设置'"></app-annual-inspection> |
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,76 @@ |
|||||||
|
.audit { |
||||||
|
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: 25px; |
||||||
|
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,25 @@ |
|||||||
|
import { Component, OnInit } from '@angular/core'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-nav', |
||||||
|
templateUrl: './audit-nav.component.html', |
||||||
|
styleUrls: ['./audit-nav.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditNavComponent implements OnInit { |
||||||
|
|
||||||
|
constructor() { } |
||||||
|
|
||||||
|
|
||||||
|
navList = ['审批', '历史纪录'] |
||||||
|
selectedItem = '审批' |
||||||
|
selectNav(item) { |
||||||
|
this.selectedItem = item |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
isLevel |
||||||
|
ngOnInit(): void { |
||||||
|
this.isLevel = JSON.parse(sessionStorage.getItem('userdata')).organization.level |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,126 @@ |
|||||||
|
<div class="box" id="inform"> |
||||||
|
<div class="search"> |
||||||
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
||||||
|
<nz-form-item class="searchParams searchParamsLong"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="type" nzPlaceHolder="审批类型" [nzLoading]="typeLoading"> |
||||||
|
<nz-option *ngFor="let item of typeList" [nzValue]="item.licenseName" |
||||||
|
[nzLabel]="item.licenseName"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="info" nzPlaceHolder="审批信息"> |
||||||
|
<nz-option nzValue="0" nzLabel="油站信息"></nz-option> |
||||||
|
<nz-option nzValue="1" nzLabel="更新类证照提醒时间"></nz-option> |
||||||
|
<nz-option nzValue="2" nzLabel="更新类证照"></nz-option> |
||||||
|
<nz-option nzValue="3" nzLabel="档案类证照"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="searchParams searchParamsLong"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-tree-select [nzAllowClear]="false" [nzDropdownClassName]="'maxHeightTreeSelect'" nzShowSearch |
||||||
|
formControlName="organization" [nzNodes]="nodes" nzPlaceHolder="请选择所属机构" |
||||||
|
[nzExpandedIcon]="multiExpandedIconTpl"> |
||||||
|
</nz-tree-select> |
||||||
|
<ng-template #multiExpandedIconTpl let-node let-origin="origin"> |
||||||
|
<ng-container *ngIf="node.children.length == 0; else elseTemplate"> |
||||||
|
|
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
<i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" |
||||||
|
class="ant-tree-switcher-line-icon"></i> |
||||||
|
</ng-template> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
|
||||||
|
<nz-form-item class="searchParams searchParams2"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-range-picker [nzAllowClear]="false" formControlName="datePicker"></nz-range-picker> |
||||||
|
<br /> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="level" nzPlaceHolder="审批级别"> |
||||||
|
<nz-option nzValue="1" nzLabel="总公司"></nz-option> |
||||||
|
<nz-option nzValue="2" nzLabel="省公司"></nz-option> |
||||||
|
<nz-option nzValue="3" nzLabel="区域"></nz-option> |
||||||
|
<nz-option nzValue="4" nzLabel="油站"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="state" nzPlaceHolder="审批状态"> |
||||||
|
<nz-option nzValue="1" nzLabel="审核中"></nz-option> |
||||||
|
<nz-option nzValue="2" nzLabel="审核通过"></nz-option> |
||||||
|
<nz-option nzValue="3" nzLabel="审核驳回"></nz-option> |
||||||
|
<nz-option nzValue="4" nzLabel="已撤销审核"></nz-option> |
||||||
|
<nz-option nzValue="5" nzLabel="审核完成"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="submit" class="submit" [nzLoading]="tableSpin"><i nz-icon [nzType]="'search'"></i>查询</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="button" class="reset" (click)="resetForm($event)" [nzLoading]="tableSpin"><i nz-icon [nzType]="'sync'"></i>重置</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
<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: 30px;">审批类型</span> |
||||||
|
</th> |
||||||
|
<th>审批信息</th> |
||||||
|
<th>加油站名称</th> |
||||||
|
<th [nzWidth]="'16%'">区域</th> |
||||||
|
<th>省公司</th> |
||||||
|
<th>提交时间</th> |
||||||
|
<th>审批状态</th> |
||||||
|
<th>操作</th> |
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 30px;">{{item.auditTitle || ''}}</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<span *ngIf="item.auditType == 0">油站信息</span> |
||||||
|
<span *ngIf="item.auditType == 1">更新类证照提醒时间</span> |
||||||
|
<span *ngIf="item.auditType == 2">更新类证照</span> |
||||||
|
<span *ngIf="item.auditType == 3">档案类证照</span> |
||||||
|
</td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.stationName}}</label></td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.locationName}}</label></td> |
||||||
|
<td><label *ngIf="item.gasStation">{{item.gasStation.companyName}}</label></td> |
||||||
|
<td>{{item.committedTime | date:"yyyy/MM/dd"}}</td> |
||||||
|
<td>{{item.auditStatusDesc}}</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="details(item)">详情</span> |
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,67 @@ |
|||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
margin-bottom: 16px; |
||||||
|
|
||||||
|
form { |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-start; |
||||||
|
|
||||||
|
.searchParams, |
||||||
|
.btn { |
||||||
|
margin: 0 3px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams { |
||||||
|
// flex: 5; |
||||||
|
width: 150px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParamsLong { |
||||||
|
width: 250px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams2 { |
||||||
|
width: 220px; |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
// flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
nz-select { |
||||||
|
color: rgba(145, 204, 255, 0.95); |
||||||
|
} |
||||||
|
|
||||||
|
nz-tree-select { |
||||||
|
color: rgba(145, 204, 255, 0.95); |
||||||
|
} |
||||||
|
|
||||||
|
nz-range-picker { |
||||||
|
background-color: rgba(0, 0, 0, 0); |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
.operation { |
||||||
|
span { |
||||||
|
margin-right: 6px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,259 @@ |
|||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { Component, ElementRef, OnInit, ViewContainerRef } from '@angular/core'; |
||||||
|
import { FormBuilder, FormGroup } from '@angular/forms'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
import { Observable, fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
import { TreeService } from 'src/app/service/tree.service'; |
||||||
|
import { DetailsFileCategoryComponent } from '../../license/file-category/details-file-category/details-file-category.component'; |
||||||
|
import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component'; |
||||||
|
import { AuditDetailsInformTimeComponent } from '../audit-inform-time/audit-details-inform-time/audit-details-inform-time.component'; |
||||||
|
import { GasBaseInfoComponent } from '../gas-base-info/gas-base-info.component'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-audit-record', |
||||||
|
templateUrl: './audit-record.component.html', |
||||||
|
styleUrls: ['./audit-record.component.scss'] |
||||||
|
}) |
||||||
|
export class AuditRecordComponent implements OnInit { |
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private element: ElementRef, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private toTree: TreeService, private http: HttpClient, private fb: FormBuilder) { } |
||||||
|
|
||||||
|
list = [] |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
startdate |
||||||
|
enddate |
||||||
|
async ngOnInit(): Promise<void> { |
||||||
|
this.tableScrollHeight = '100px' |
||||||
|
// 页面监听
|
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
|
||||||
|
console.log('页面尺寸变化', this.tableScrollHeight) |
||||||
|
}); |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
type: [null], |
||||||
|
info: [null], |
||||||
|
organization: [null], |
||||||
|
datePicker: [null], |
||||||
|
level: [null], |
||||||
|
state: [null], |
||||||
|
}); |
||||||
|
//当前日期
|
||||||
|
let myDate: any = new Date(); |
||||||
|
let nowY = myDate.getFullYear(); |
||||||
|
let nowM = myDate.getMonth() + 1; |
||||||
|
let nowD = myDate.getDate(); |
||||||
|
this.enddate = nowY + "-" + (nowM < 10 ? "0" + nowM : nowM) + "-" + (nowD < 10 ? "0" + nowD : nowD);//当前日期
|
||||||
|
//获取三十天前日期
|
||||||
|
let lw = new Date(myDate - 1000 * 60 * 60 * 24 * 30);//最后一个数字30可改，30天的意思
|
||||||
|
let lastY = lw.getFullYear(); |
||||||
|
let lastM = lw.getMonth() + 1; |
||||||
|
let lastD = lw.getDate(); |
||||||
|
this.startdate = lastY + "-" + (lastM < 10 ? "0" + lastM : lastM) + "-" + (lastD < 10 ? "0" + lastD : lastD);//三十天之前日期
|
||||||
|
|
||||||
|
this.getTypeList() |
||||||
|
await this.getAllOrganization() |
||||||
|
this.getRecordList() |
||||||
|
} |
||||||
|
|
||||||
|
submitForm(): void { |
||||||
|
if (this.validateForm.value.datePicker[0].toLocaleDateString) { |
||||||
|
this.validateForm.value.datePicker[0] = this.validateForm.value.datePicker[0].toLocaleDateString() |
||||||
|
} |
||||||
|
if (this.validateForm.value.datePicker[1].toLocaleDateString) { |
||||||
|
this.validateForm.value.datePicker[1] = this.validateForm.value.datePicker[1].toLocaleDateString() |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getRecordList() |
||||||
|
} |
||||||
|
|
||||||
|
resetForm(e: MouseEvent): void { |
||||||
|
e.preventDefault(); |
||||||
|
this.validateForm.reset(); |
||||||
|
this.validateForm.patchValue({ |
||||||
|
organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
datePicker: [this.startdate, this.enddate], |
||||||
|
}); |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getRecordList() |
||||||
|
} |
||||||
|
|
||||||
|
//获取所有组织机构
|
||||||
|
nodes: any = [] |
||||||
|
async getAllOrganization() { |
||||||
|
let OrganizationUnitId = JSON.parse(sessionStorage.getItem('userdata')).organization.id |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: OrganizationUnitId, |
||||||
|
IsContainsChildren: "true" |
||||||
|
} |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.http.get('/api/services/app/Organization/GetAll', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
data.result.items.forEach(element => { |
||||||
|
if (element.id == OrganizationUnitId) { |
||||||
|
element.parentId = null |
||||||
|
} |
||||||
|
element.key = element.id |
||||||
|
element.title = element.displayName |
||||||
|
}); |
||||||
|
this.nodes = [...this.toTree.toTree(data.result.items)] |
||||||
|
this.validateForm.patchValue({ |
||||||
|
organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
datePicker: [this.startdate, this.enddate], |
||||||
|
}); |
||||||
|
resolve(data) |
||||||
|
|
||||||
|
}) |
||||||
|
}) |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//证照类型
|
||||||
|
typeLoading |
||||||
|
typeList |
||||||
|
getTypeList() { |
||||||
|
this.typeLoading = true |
||||||
|
let promiseArr = [] |
||||||
|
let api = ['/api/services/app/ValidityLicenseType/GetAll', '/api/services/app/FileLicenseType/GetAll'] |
||||||
|
api.forEach(element => { |
||||||
|
promiseArr.push( |
||||||
|
new Promise((resolve, reject) => { |
||||||
|
this.http.get(element, { |
||||||
|
params: { |
||||||
|
SkipCount: '0', |
||||||
|
MaxResultCount: '999' |
||||||
|
} |
||||||
|
}).subscribe({ |
||||||
|
next: (data) => { |
||||||
|
resolve(data) |
||||||
|
}, |
||||||
|
error: err => { |
||||||
|
reject(err) |
||||||
|
} |
||||||
|
}) |
||||||
|
}) |
||||||
|
) |
||||||
|
}); |
||||||
|
|
||||||
|
Promise.all(promiseArr).then((result) => { |
||||||
|
|
||||||
|
let arr = [{ licenseName: '油站信息' }] |
||||||
|
result.forEach(item => { |
||||||
|
arr = arr.concat(item.result.items) |
||||||
|
}); |
||||||
|
this.typeLoading = false |
||||||
|
this.typeList = arr |
||||||
|
}).catch((error) => { |
||||||
|
|
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//历史记录列表
|
||||||
|
totalCount//列表总数
|
||||||
|
tableSpin = true |
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '100' |
||||||
|
getRecordList() { |
||||||
|
this.tableSpin = true |
||||||
|
let params = { |
||||||
|
IsContainsChildren: 'true', |
||||||
|
OrganizationUnitId: this.validateForm.value.organization, |
||||||
|
AuditTitle: this.validateForm.value.type, |
||||||
|
AuditType: this.validateForm.value.info, |
||||||
|
StartTime: this.validateForm.value.datePicker[0], |
||||||
|
EndTime: this.validateForm.value.datePicker[1], |
||||||
|
AuditStatuses: this.validateForm.value.state, |
||||||
|
AuditLevel: this.validateForm.value.level, |
||||||
|
Sorting: null, |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
} |
||||||
|
this.http.get('/api/services/app/ContentAuditLog/GetHistory', { params }).subscribe((data: any) => { |
||||||
|
this.list = this.list.concat(data.result.items); |
||||||
|
this.list = [...this.list] |
||||||
|
this.totalCount = data.result.totalCount |
||||||
|
this.tableSpin = false |
||||||
|
console.log('审核历史纪录', this.list) |
||||||
|
setTimeout(() => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}, 0); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
details(item) { |
||||||
|
let component |
||||||
|
if (item.auditType == 0) { |
||||||
|
component = GasBaseInfoComponent |
||||||
|
} else if (item.auditType == 1) { |
||||||
|
component = AuditDetailsInformTimeComponent |
||||||
|
} else if (item.auditType == 2) { |
||||||
|
component = DetailsUpdateCategoryComponent |
||||||
|
} else if (item.auditType) { |
||||||
|
component = DetailsFileCategoryComponent |
||||||
|
} |
||||||
|
this.getData(item).then(res => { |
||||||
|
item.getData = res |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: component, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: item.auditType == 0 ? 700 : 450, |
||||||
|
nzBodyStyle: { |
||||||
|
'border': '1px solid #91CCFF', |
||||||
|
'border-radius': '0px', |
||||||
|
'padding': '7px', |
||||||
|
'box-shadow': '0 0 8px 0 #fff', |
||||||
|
'background-image': 'linear-gradient(#003665, #000f25)' |
||||||
|
}, |
||||||
|
nzStyle: { |
||||||
|
'top': '50px', |
||||||
|
}, |
||||||
|
nzComponentParams: { |
||||||
|
data: item.getData |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取证照类data
|
||||||
|
getData(item) { |
||||||
|
let url |
||||||
|
if (item.auditType == 0) { //油站基本信息
|
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let organization = { organizationId: item.organizationId } |
||||||
|
resolve(organization) |
||||||
|
}) |
||||||
|
} else if (item.auditType == 1) { |
||||||
|
url = '/api/services/app/OrganizationValidityLicenseRule/Get' |
||||||
|
} else if (item.auditType == 2) { |
||||||
|
url = '/api/services/app/StationValidityLicense/Get' |
||||||
|
} else if (item.auditType) { |
||||||
|
url = '/api/services/app/StationFileLicense/Get' |
||||||
|
} |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let params = { id: item.itemId } |
||||||
|
this.http.get(url, { params }).subscribe((data: any) => { |
||||||
|
resolve(data.result) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
ngAfterViewInit(): void { |
||||||
|
fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe((event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
this.getRecordList() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,95 @@ |
|||||||
|
<div [ngStyle]="{'padding': isDetails? '0 15px' : null}"> |
||||||
|
<div class="title" *ngIf="isDetails"> |
||||||
|
<div class="titlecontent"> |
||||||
|
详情 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<p> |
||||||
|
<label class="marginLeft">站名: {{baseInfo.stationName}}</label> |
||||||
|
<label>开业时间: {{baseInfo.openTime | date:"yyyy/MM/dd"}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">油站类型: <span *ngIf="baseInfo.stationType == 0">自营</span><span *ngIf="baseInfo.stationType == 1">加盟</span><span *ngIf="baseInfo.stationType == 2">其他</span></label> |
||||||
|
<label>车道数量: {{baseInfo.laneCount}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>地址: {{baseInfo.address}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">区域: {{baseInfo.locationName}}</label> |
||||||
|
<label>所属公司: {{baseInfo.companyName}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">联系人: {{baseInfo.leaderName}}</label> |
||||||
|
<label>联系电话: {{baseInfo.leaderContact}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">油站等级: {{baseInfo.stationLevel}}</label> |
||||||
|
<label>经营品种: {{baseInfo.sellVariety}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">油机数量: {{baseInfo.gasStationCount}}</label> |
||||||
|
<label>油罐容积(m³): {{baseInfo.tankVolume}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<div *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.policeStation"> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">辖区派出所: {{baseInfo.govUnitDetail.policeStation.name}}</label> |
||||||
|
<label>地址: {{baseInfo.govUnitDetail.policeStation.address}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">距离: {{baseInfo.govUnitDetail.policeStation.distance}}</label> |
||||||
|
<label>联系方式: {{baseInfo.govUnitDetail.policeStation.contactInformation}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
</div> |
||||||
|
<div *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.hospital"> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">辖区医院: {{baseInfo.govUnitDetail.hospital.name}}</label> |
||||||
|
<label>地址: {{baseInfo.govUnitDetail.hospital.address}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">距离: {{baseInfo.govUnitDetail.hospital.distance}}</label> |
||||||
|
<label>联系方式: {{baseInfo.govUnitDetail.hospital.contactInformation}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
</div> |
||||||
|
<div *ngIf="baseInfo.govUnitDetail && baseInfo.govUnitDetail.fireBrigade"> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">辖区消防队: {{baseInfo.govUnitDetail.fireBrigade.name}}</label> |
||||||
|
<label>地址: {{baseInfo.govUnitDetail.fireBrigade.address}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p> |
||||||
|
<label class="marginLeft">距离: {{baseInfo.govUnitDetail.fireBrigade.distance}}</label> |
||||||
|
<label>联系方式: {{baseInfo.govUnitDetail.fireBrigade.contactInformation}}</label> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- <p class="recordP" *ngIf="isDetails"> |
||||||
|
<span>审核记录</span> |
||||||
|
<span> |
||||||
|
<span style="margin-right: 6px;"> |
||||||
|
审核次数：{{getVerifyNum()}} |
||||||
|
</span> |
||||||
|
<span> |
||||||
|
驳回次数：{{getRejectNum()}} |
||||||
|
</span> |
||||||
|
</span> |
||||||
|
</p> |
||||||
|
<nz-timeline *ngIf="isDetails"> |
||||||
|
<nz-timeline-item *ngFor="let item of auditList"> |
||||||
|
<span style="margin-right: 12px;">{{item.creationTime | date:"yyyy/MM/dd"}}</span> |
||||||
|
<span>{{item.auditStatus | auditStatus}}</span> |
||||||
|
</nz-timeline-item> |
||||||
|
</nz-timeline> --> |
||||||
|
</div> |
||||||
@ -0,0 +1,47 @@ |
|||||||
|
p { |
||||||
|
margin-bottom: 0; |
||||||
|
color: #C4E2FC; |
||||||
|
margin: 10px 0; |
||||||
|
img { |
||||||
|
width: 88px; |
||||||
|
height: 56px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
label{ display: inline-block; vertical-align: middle; } |
||||||
|
.marginLeft { |
||||||
|
width: 55%; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
.recordP{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
@ -0,0 +1,75 @@ |
|||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { Component, Input, OnInit } from '@angular/core'; |
||||||
|
import { NzModalRef } from 'ng-zorro-antd/modal'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-gas-base-info', |
||||||
|
templateUrl: './gas-base-info.component.html', |
||||||
|
styleUrls: ['./gas-base-info.component.scss'] |
||||||
|
}) |
||||||
|
export class GasBaseInfoComponent implements OnInit { |
||||||
|
|
||||||
|
constructor(private modal: NzModalRef,private http: HttpClient) { } |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
isDetails: boolean = false; //是否是详情
|
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
if (this.data.id === undefined) { //详情
|
||||||
|
this.isDetails = true |
||||||
|
//this.getAuditLogging()
|
||||||
|
} |
||||||
|
this.getBaseInfo() |
||||||
|
} |
||||||
|
|
||||||
|
baseInfo: any = { |
||||||
|
stationType: null, |
||||||
|
} |
||||||
|
getBaseInfo() { |
||||||
|
let params = { organizationUnitId: this.data.organizationId } |
||||||
|
this.http.get('/api/services/app/GasStation/Get',{params}).subscribe((data: any)=>{ |
||||||
|
data.result.govUnitDetail? data.result.govUnitDetail = JSON.parse(data.result.govUnitDetail) : null; |
||||||
|
this.baseInfo = data.result |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
|
||||||
|
auditList: any[] = []; |
||||||
|
//获取审核记录
|
||||||
|
getAuditLogging() { |
||||||
|
if (!this.data.organizationId) { |
||||||
|
return |
||||||
|
} |
||||||
|
let params = { orgId: this.data.organizationId } |
||||||
|
this.http.get(`/api/services/app/GasStation/GetAuditted`,{params}).subscribe((data: any)=>{ |
||||||
|
//this.auditList = data.result.actionList || []
|
||||||
|
console.log(data) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取审核次数
|
||||||
|
getVerifyNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 2 || item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
//获取驳回次数
|
||||||
|
getRejectNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,47 @@ |
|||||||
|
<div class="box" id="detailsfilecategory"> |
||||||
|
<div class="title"> |
||||||
|
<div class="titlecontent"> |
||||||
|
详情 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<p>证件名称: {{data.licenseTypeName}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>有效期类型: <span *ngIf="data.validatyType == 0">不适用</span><span *ngIf="data.validatyType == 1">无</span><span *ngIf="data.validatyType == 2">有</span></p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<!-- <p>是否年检: 是</p> |
||||||
|
<div class="cutoffrule"></div> --> |
||||||
|
<p>证件图片: |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'img'" [src]="data.imageUrl" (click)="viewImg(data.imageUrl)"> |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(data)"> |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(data)"> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p class="recordP"> |
||||||
|
<span>审核记录</span> |
||||||
|
<span> |
||||||
|
<span style="margin-right: 6px;"> |
||||||
|
审核次数：{{getVerifyNum()}} |
||||||
|
</span> |
||||||
|
<span> |
||||||
|
驳回次数：{{getRejectNum()}} |
||||||
|
</span> |
||||||
|
</span> |
||||||
|
</p> |
||||||
|
<nz-timeline> |
||||||
|
<nz-timeline-item *ngFor="let item of auditList"> |
||||||
|
<span style="margin-right: 12px;">{{item.creationTime | date:"yyyy/MM/dd"}}</span> |
||||||
|
<span>{{item.auditStatus | auditStatus}}</span> |
||||||
|
</nz-timeline-item> |
||||||
|
</nz-timeline> |
||||||
|
<ng-template #soccerTemplate> |
||||||
|
<div class="circle"> |
||||||
|
|
||||||
|
</div> |
||||||
|
</ng-template> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
@ -0,0 +1,60 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 15px; |
||||||
|
max-height: 580px; |
||||||
|
overflow-y: auto; |
||||||
|
|
||||||
|
.circle { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
background: linear-gradient(180deg, #36A2FF 0%, #FFFFFF 100%); |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
.recordP{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
margin-bottom: 0; |
||||||
|
color: #C4E2FC; |
||||||
|
margin: 12px 0; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 88px; |
||||||
|
height: 56px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,111 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-details-file-category', |
||||||
|
templateUrl: './details-file-category.component.html', |
||||||
|
styleUrls: ['./details-file-category.component.scss'] |
||||||
|
}) |
||||||
|
export class DetailsFileCategoryComponent implements OnInit { |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
constructor(private modal: NzModalRef, private http: HttpClient,private message: NzMessageService) { } |
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.getAuditLogging() |
||||||
|
} |
||||||
|
|
||||||
|
auditList: any[] = []; |
||||||
|
//获取审核记录
|
||||||
|
getAuditLogging() { |
||||||
|
if (!this.data.auditLogId) { |
||||||
|
return |
||||||
|
} |
||||||
|
let params = { id: this.data.auditLogId } |
||||||
|
this.http.get(`/api/services/app/ContentAuditLog/Get`,{params}).subscribe((data: any)=>{ |
||||||
|
this.auditList = data.result.actionList || [] |
||||||
|
console.log(this.auditList) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取审核次数
|
||||||
|
getVerifyNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 2 || item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
//获取驳回次数
|
||||||
|
getRejectNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,48 @@ |
|||||||
|
<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"> |
||||||
|
<p>证件名称: {{data2.licenseTypeName || ''}}</p> |
||||||
|
|
||||||
|
<div class="cutoffrule"></div> |
||||||
|
|
||||||
|
<p>有效期类型<span style="color: red;">*</span></p> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select formControlName="type" [(ngModel)]="validatyType"> |
||||||
|
<nz-option nzValue="0" nzLabel="不适用"></nz-option> |
||||||
|
<nz-option nzValue="1" nzLabel="无"></nz-option> |
||||||
|
<nz-option nzValue="2" nzLabel="有"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<p>附件上传（图片格式、pdf格式、word格式）</p> |
||||||
|
|
||||||
|
<div class="uploadDivbox"> |
||||||
|
<div class="uploadDiv" style="margin-right: 12px;"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'img'" style="width: 100%;height: 100%;cursor: pointer;" [src]="data2.imageUrl" (click)="viewImg(data2.imageUrl)"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(data2)"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(data2)"> |
||||||
|
|
||||||
|
<input *ngIf="!data2.imageUrl" (change)="filechange($event)" class="fileinput" type="file" name="" id=""> |
||||||
|
<button *ngIf="!data2.imageUrl" nz-button [nzLoading]=""><i nz-icon nzType="upload" |
||||||
|
nzTheme="outline"></i>上传附件</button> |
||||||
|
</div> |
||||||
|
<div class="uploadDiv" *ngIf="data2.imageUrl"> |
||||||
|
<input (change)="filechange($event)" class="fileinput" type="file" name="" id=""> |
||||||
|
<button nz-button [nzLoading]=""><i nz-icon nzType="upload" nzTheme="outline"></i>重新上传</button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="btnbox"> |
||||||
|
<button nz-button type="submit" class="ok" (click)="ok()">确定</button> |
||||||
|
<button nz-button type="button" class="cancel" (click)="destroyModal()">取消</button> |
||||||
|
</div> |
||||||
|
</form> |
||||||
|
</div> |
||||||
@ -0,0 +1,127 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
|
||||||
|
.form { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 17px; |
||||||
|
|
||||||
|
label { |
||||||
|
color: #C4E2FC; |
||||||
|
margin-right: 6px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.validity { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
nz-date-picker { |
||||||
|
flex: .5; |
||||||
|
} |
||||||
|
|
||||||
|
nz-range-picker { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
width: 100%; |
||||||
|
margin-top: 24px; |
||||||
|
margin-bottom: 17px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.uploadDivbox { |
||||||
|
width: 100%; |
||||||
|
height: 80px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
position: relative; |
||||||
|
margin: 5px 0; |
||||||
|
|
||||||
|
.uploadDiv { |
||||||
|
width: 120px; |
||||||
|
height: 80px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
position: relative; |
||||||
|
|
||||||
|
.fileinput { |
||||||
|
width: 114px; |
||||||
|
height: 32px; |
||||||
|
position: absolute; |
||||||
|
z-index: 100; |
||||||
|
opacity: 0; |
||||||
|
top: 23px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
|
||||||
|
button { |
||||||
|
z-index: 99; |
||||||
|
width: 114px; |
||||||
|
height: 32px; |
||||||
|
background: rgba(0, 129, 255, 0.3); |
||||||
|
border: 1px solid #36A2FF; |
||||||
|
opacity: 1; |
||||||
|
border-radius: 0px; |
||||||
|
color: #91CCFF; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,147 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-edit-file-category', |
||||||
|
templateUrl: './edit-file-category.component.html', |
||||||
|
styleUrls: ['./edit-file-category.component.scss'] |
||||||
|
}) |
||||||
|
export class EditFileCategoryComponent implements OnInit { |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
|
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private objectsSrv: ObjectsSimpleService,private message: NzMessageService) { } |
||||||
|
|
||||||
|
|
||||||
|
data2 |
||||||
|
ngOnInit(): void { |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
type: [null, [Validators.required]] |
||||||
|
}); |
||||||
|
this.data2 = JSON.parse(JSON.stringify(this.data)) |
||||||
|
this.validatyType = (this.data2.validatyType).toString() |
||||||
|
console.log(this.data2) |
||||||
|
} |
||||||
|
|
||||||
|
validatyType: string |
||||||
|
isLongTerm = false |
||||||
|
imageUrl = '/api/Objects/sinochemweb/stationPhotos/175/timg.jpg' |
||||||
|
validityChange($event) { |
||||||
|
this.isLongTerm = $event |
||||||
|
} |
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
ok() { |
||||||
|
this.modal.triggerOk() |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
isLoadingSave: boolean = false |
||||||
|
uploadIndex: string |
||||||
|
filechange(e) { |
||||||
|
let oilStationId = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id |
||||||
|
let file = e.target.files[0] || null //获取上传的文件
|
||||||
|
this.openFileSelect(file, `stationPhotos/${oilStationId}/`) |
||||||
|
} |
||||||
|
//设置文件路径并上传
|
||||||
|
postFilePath |
||||||
|
async openFileSelect(file: File, extensionPath: string) { |
||||||
|
this.postFilePath = extensionPath; |
||||||
|
let fileSize = file.size || null //上传文件的总大小
|
||||||
|
let shardSize = 5 * 1024 * 1024 //5MB 超过5MB要分块上传
|
||||||
|
if (fileSize >= shardSize) // 超过5MB要分块上传
|
||||||
|
{ |
||||||
|
await this.postFileByMul(file); |
||||||
|
} |
||||||
|
else //普通上传
|
||||||
|
{ |
||||||
|
await this.postFile(file); |
||||||
|
} |
||||||
|
} |
||||||
|
//上传文件
|
||||||
|
async postFile(file: File) { |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.objectsSrv.postFile(this.postFilePath, file).subscribe(data => { |
||||||
|
let dataObj = data as any; |
||||||
|
let filePath: string = ObjectsSimpleService.baseUrl + dataObj.objectName; |
||||||
|
this.imageUrl = filePath |
||||||
|
this.data2.imageUrl = filePath |
||||||
|
console.log('上传成功', filePath) |
||||||
|
resolve('success') |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 分块上传 |
||||||
|
* @param file
|
||||||
|
*/ |
||||||
|
postFileByMul(file: File) { |
||||||
|
this.objectsSrv.postFile_MultipartUpload(this.postFilePath, file).then((value) => { |
||||||
|
let dataObj = value as any; |
||||||
|
let filePath = dataObj.filePath |
||||||
|
this.imageUrl = filePath |
||||||
|
this.data2.imageUrl = filePath |
||||||
|
console.log('上传成功', filePath) |
||||||
|
}); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,47 @@ |
|||||||
|
<div class="box" id="fileLicense"> |
||||||
|
<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> |
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 25%;">{{item.licenseTypeName || ''}}</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<span *ngIf="item.validatyType == 0">不适用</span> |
||||||
|
<span *ngIf="item.validatyType == 1">无</span> |
||||||
|
<span *ngIf="item.validatyType == 2">有</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'img'" [src]="item.imageUrl" (click)="viewImg(item.imageUrl)"> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(item)"> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(item)"> |
||||||
|
</td> |
||||||
|
<td>{{item.committedTime | date:"yyyy/MM/dd"}}<span *ngIf="!item.committedTime">未提交审核</span></td> |
||||||
|
<td> |
||||||
|
<span>{{item.auditStatus | auditStatus}}</span> |
||||||
|
</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="edit(item)">编辑</span> |
||||||
|
<span class="blueColor" (click)="details(item)">详情</span> |
||||||
|
<span class="blueColor" (click)="cancelReview(item)" *ngIf="item.auditStatus === 1">撤销审核</span> |
||||||
|
<span class="blueColor" (click)="submitReview(item)" *ngIf="item.auditStatus != 1">提交审核</span> |
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,23 @@ |
|||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
.operation { |
||||||
|
span { |
||||||
|
margin-right: 6px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
#table { |
||||||
|
img { |
||||||
|
width: 30px; |
||||||
|
height: 30px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,175 @@ |
|||||||
|
import { Component, OnInit, ViewContainerRef } from '@angular/core'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
import { Observable, fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
import Viewer from 'viewerjs'; |
||||||
|
import * as moment from 'moment'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { EditFileCategoryComponent } from './edit-file-category/edit-file-category.component'; |
||||||
|
import { DetailsFileCategoryComponent } from './details-file-category/details-file-category.component'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-file-category', |
||||||
|
templateUrl: './file-category.component.html', |
||||||
|
styleUrls: ['./file-category.component.scss'] |
||||||
|
}) |
||||||
|
export class FileCategoryComponent implements OnInit { |
||||||
|
|
||||||
|
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private message: NzMessageService, private http: HttpClient) { } |
||||||
|
tableSpin = false |
||||||
|
list = []; //tabelData
|
||||||
|
|
||||||
|
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.getStationList() |
||||||
|
} |
||||||
|
|
||||||
|
//获取当前油站档案类证照
|
||||||
|
getStationList() { |
||||||
|
this.tableSpin = true |
||||||
|
let data = JSON.parse(sessionStorage.getItem('userdataOfgasstation')); |
||||||
|
let params = { orgId: data.organization.id || "" } |
||||||
|
this.http.get(`/api/services/app/StationFileLicense/GetStationList`, { params }).subscribe((info: any) => { |
||||||
|
this.list = info.result |
||||||
|
this.tableSpin = false |
||||||
|
console.log(info.result) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
dispose() { |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
edit(item) { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: EditFileCategoryComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 750, |
||||||
|
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 () => { |
||||||
|
await new Promise(resolve => { |
||||||
|
instance.data2.validatyType = Number(instance.validatyType) |
||||||
|
this.http.post('/api/services/app/StationFileLicense/Create', instance.data2).subscribe(data => { |
||||||
|
resolve(data); |
||||||
|
this.getStationList(); |
||||||
|
this.message.create('success', '修改成功！'); |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
details(item) { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DetailsFileCategoryComponent, |
||||||
|
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 () => { |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
|
||||||
|
//提交审核
|
||||||
|
submitReview(item) { |
||||||
|
if (!item.id) { |
||||||
|
return |
||||||
|
} |
||||||
|
let params = { id: item.id } |
||||||
|
this.http.post('/api/services/app/StationFileLicense/Commit', {}, { params }).subscribe(data => { |
||||||
|
this.message.create('success', '提交审核成功！'); |
||||||
|
this.getStationList(); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//撤销审核
|
||||||
|
cancelReview(item) { |
||||||
|
let params = { id: item.id } |
||||||
|
this.http.post('/api/services/app/StationFileLicense/Uncommit', {}, { params }).subscribe(data => { |
||||||
|
this.message.create('success', '撤销审核成功！'); |
||||||
|
this.getStationList(); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,49 @@ |
|||||||
|
<div class="box" id="histories"> |
||||||
|
<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:30px;">证件名称</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"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 30px;">{{item.licenseSnapshot.validityLicenseType.licenseName}}</span> |
||||||
|
</td> |
||||||
|
<td>{{item.licenseSnapshot.licenseCode}}</td> |
||||||
|
<td>{{item.licenseSnapshot.validityEndTime | date:"yyyy/MM/dd"}}</td> |
||||||
|
<td> |
||||||
|
<ng-container *ngIf="item.licenseSnapshot.isLongTerm; else elseTemplate"> |
||||||
|
长期 |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
{{item.licenseSnapshot.validityDays ? item.licenseSnapshot.validityDays+'天' : '/'}} |
||||||
|
</ng-template> |
||||||
|
</td> |
||||||
|
<td>{{getHandleTypes(item.handleTypes)}}</td> |
||||||
|
<td>{{item.notificationContent | notificationContent}}</td> |
||||||
|
<td |
||||||
|
[ngClass]="{'greenColor': item.licenseSnapshot.licenseViolationType == 1,'yellowColor': item.licenseSnapshot.licenseViolationType == 2,'redColor': item.licenseSnapshot.licenseViolationType == 3}"> |
||||||
|
{{item.licenseSnapshot.licenseViolationType | licenseViolationType}}</td> |
||||||
|
<td [ngClass]="{'yellowColor': item.handleState == 3}">{{item.handleState | handleState}}</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="details(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,123 @@ |
|||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { Component, 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 { DetailsUpdateCategoryComponent } from '../update-category/details-update-category/details-update-category.component'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-histories', |
||||||
|
templateUrl: './histories.component.html', |
||||||
|
styleUrls: ['./histories.component.scss'] |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
export class HistoriesComponent implements OnInit { |
||||||
|
|
||||||
|
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private http: HttpClient, private message: NzMessageService) { } |
||||||
|
tableSpin = false |
||||||
|
list = [] |
||||||
|
|
||||||
|
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.getInform() |
||||||
|
} |
||||||
|
|
||||||
|
dispose() { |
||||||
|
console.log('处置') |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//获取当前油站通知
|
||||||
|
SkipCount = '0' |
||||||
|
MaxResultCount = '999' |
||||||
|
getInform() { |
||||||
|
this.tableSpin = true |
||||||
|
let data = JSON.parse(sessionStorage.getItem('userdataOfgasstation')); |
||||||
|
let params: any = { |
||||||
|
OrganizationUnitId: data.organization.id || "", |
||||||
|
Active: false, |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount |
||||||
|
} |
||||||
|
this.http.get(`/api/services/app/StationValidityLicenseNotificationRecord/GetAll`, { params: params }).subscribe((data: any) => { |
||||||
|
|
||||||
|
this.list = data.result.items |
||||||
|
this.tableSpin = false |
||||||
|
console.log(data.result.items) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//获取办理类型
|
||||||
|
getHandleTypes(handleTypes: any[]): string { |
||||||
|
if (!handleTypes || !handleTypes.length) { |
||||||
|
return |
||||||
|
} |
||||||
|
let names: string[] = [] |
||||||
|
let handleTypeList = JSON.parse(JSON.stringify(handleTypes)); |
||||||
|
let list: handleTypeList[] = new handleType().list; |
||||||
|
handleTypeList.forEach(item => { |
||||||
|
list.find(element => { |
||||||
|
item == element.value ? names.push(element.name) : null |
||||||
|
}) |
||||||
|
}) |
||||||
|
return names.join(',') |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//处置
|
||||||
|
details(item) { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DetailsUpdateCategoryComponent, |
||||||
|
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.licenseSnapshot |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
nzOnOk: async () => { |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//办理类型
|
||||||
|
export class handleType { |
||||||
|
list: handleTypeList[] = [ |
||||||
|
{ value: 0, name: "无" }, |
||||||
|
{ value: 1, name: "年度公示" }, |
||||||
|
{ value: 2, name: "年检" }, |
||||||
|
{ value: 3, name: "到期换证" }, |
||||||
|
{ value: 4, name: "年度执行报告" }, |
||||||
|
{ value: 5, name: "到期检测" }, |
||||||
|
{ value: 6, name: "年度复训" }, |
||||||
|
{ value: 7, name: "年度检测" }, |
||||||
|
{ value: 8, name: "到期备案" }, |
||||||
|
{ value: 9, name: "到期评价" }, |
||||||
|
] |
||||||
|
} |
||||||
|
export class handleTypeList { |
||||||
|
value: number |
||||||
|
name: string |
||||||
|
} |
||||||
@ -0,0 +1,51 @@ |
|||||||
|
<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: 30px;">证件名称</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"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 30px;">{{item.licenseSnapshot.validityLicenseType.licenseName}}</span> |
||||||
|
</td> |
||||||
|
<td>{{item.licenseSnapshot.licenseCode}}</td> |
||||||
|
<td>{{item.licenseSnapshot.validityEndTime | date:"yyyy/MM/dd"}}</td> |
||||||
|
<td> |
||||||
|
<ng-container *ngIf="item.licenseSnapshot.isLongTerm; else elseTemplate"> |
||||||
|
长期 |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
{{item.licenseSnapshot.validityDays ? item.licenseSnapshot.validityDays+'天' : '/'}} |
||||||
|
</ng-template> |
||||||
|
</td> |
||||||
|
<td>{{getHandleTypes(item.handleTypes)}}</td> |
||||||
|
<td>{{item.notificationContent | notificationContent}}</td> |
||||||
|
<td |
||||||
|
[ngClass]="{'greenColor': item.licenseSnapshot.licenseViolationType == 1,'yellowColor': item.licenseSnapshot.licenseViolationType == 2,'redColor': item.licenseSnapshot.licenseViolationType == 3}"> |
||||||
|
{{item.licenseSnapshot.licenseViolationType | licenseViolationType}}</td> |
||||||
|
<td [ngClass]="{'yellowColor': item.handleState == 3}">{{item.handleState | handleState}}</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="updateState(item,0)">忽略</span> |
||||||
|
<span class="blueColor" (click)="updateState(item,1)">处置</span> |
||||||
|
<span class="blueColor" (click)="updateState(item,2)">申请延期</span> |
||||||
|
</td> |
||||||
|
</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,108 @@ |
|||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { Component, OnInit } from '@angular/core'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
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(private http: HttpClient, private message: NzMessageService) { } |
||||||
|
tableSpin = false |
||||||
|
list = [] |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
|
||||||
|
fromEvent |
||||||
|
ngOnInit(): void { |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
// 页面监听
|
||||||
|
|
||||||
|
this.fromEvent = fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
|
this.getInform() |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
dispose() { |
||||||
|
console.log('处置') |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//获取当前油站通知
|
||||||
|
SkipCount = '0' |
||||||
|
MaxResultCount = '100' |
||||||
|
getInform() { |
||||||
|
this.tableSpin = true |
||||||
|
let data = JSON.parse(sessionStorage.getItem('userdataOfgasstation')); |
||||||
|
let params: any = { |
||||||
|
OrganizationUnitId: data.organization.id || "", |
||||||
|
Active: true, |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount |
||||||
|
} |
||||||
|
this.http.get(`/api/services/app/StationValidityLicenseNotificationRecord/GetAll`, { params: params }).subscribe((data: any) => { |
||||||
|
this.list = data.result.items |
||||||
|
this.tableSpin = false |
||||||
|
console.log(data.result.items) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//获取办理类型
|
||||||
|
getHandleTypes(handleTypes: any[]): string { |
||||||
|
if (!handleTypes || !handleTypes.length) { |
||||||
|
return |
||||||
|
} |
||||||
|
let names: string[] = [] |
||||||
|
let handleTypeList = JSON.parse(JSON.stringify(handleTypes)); |
||||||
|
let list: handleTypeList[] = new handleType().list; |
||||||
|
handleTypeList.forEach(item => { |
||||||
|
list.find(element => { |
||||||
|
item == element.value ? names.push(element.name) : null |
||||||
|
}) |
||||||
|
}) |
||||||
|
return names.join(',') |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//处置
|
||||||
|
updateState(item, type) { |
||||||
|
let body = { |
||||||
|
id: item.id, |
||||||
|
operation: type |
||||||
|
} |
||||||
|
this.http.put('/api/services/app/StationValidityLicenseNotificationRecord/UpdateState', body).subscribe(data => { |
||||||
|
this.getInform() |
||||||
|
this.message.create('success', '操作成功'); |
||||||
|
}, err => { |
||||||
|
this.message.create('error', '操作失败'); |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
//办理类型
|
||||||
|
export class handleType { |
||||||
|
list: handleTypeList[] = [ |
||||||
|
{ value: 0, name: "无" }, |
||||||
|
{ value: 1, name: "年度公示" }, |
||||||
|
{ value: 2, name: "年检" }, |
||||||
|
{ value: 3, name: "到期换证" }, |
||||||
|
{ value: 4, name: "年度执行报告" }, |
||||||
|
{ value: 5, name: "到期检测" }, |
||||||
|
{ value: 6, name: "年度复训" }, |
||||||
|
{ value: 7, name: "年度检测" }, |
||||||
|
{ value: 8, name: "到期备案" }, |
||||||
|
{ value: 9, name: "到期评价" }, |
||||||
|
] |
||||||
|
} |
||||||
|
export class handleTypeList { |
||||||
|
value: number |
||||||
|
name: string |
||||||
|
} |
||||||
@ -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: 25px; |
||||||
|
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,12 @@ |
|||||||
|
<div class="box"> |
||||||
|
<div class="title"> |
||||||
|
<div class="titlecontent"> |
||||||
|
详情 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<iframe [src]="data.url" frameborder="0"></iframe> |
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,38 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 15px; |
||||||
|
max-height: 580px; |
||||||
|
overflow-y: auto; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,28 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-pdf-word-look', |
||||||
|
templateUrl: './pdf-word-look.component.html', |
||||||
|
styleUrls: ['./pdf-word-look.component.scss'] |
||||||
|
}) |
||||||
|
export class PdfWordLookComponent implements OnInit { |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
constructor(private modal: NzModalRef) { } |
||||||
|
|
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
console.log('文档地址',this.data.url) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,53 @@ |
|||||||
|
<div class="box" id="detailsupdatecategory"> |
||||||
|
<div class="title"> |
||||||
|
<div class="titlecontent"> |
||||||
|
详情 |
||||||
|
</div> |
||||||
|
<i nz-icon nzType="close" nzTheme="outline" (click)="destroyModal()"></i> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="content"> |
||||||
|
<p>证件名称: {{data.licenseTypeName || ''}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>证件编号: {{data.licenseCode || ''}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>证件有效期: <span *ngIf="!data.isLongTerm">{{data.validityStartTime | date:"yyyy/MM/dd"}} - </span>{{data.validityEndTime | date:"yyyy/MM/dd"}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>办理类型: {{getHandleTypes(data.handleTypes)}}</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p>有效期类型: {{data.validityDays || 0}}天</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<!-- <p>是否年检: <span *ngIf="data.isYearlyCheck">是</span><span *ngIf="!data.isYearlyCheck">否</span></p> |
||||||
|
<div class="cutoffrule"></div> --> |
||||||
|
<p>证件图片: |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'img'" [src]="data.imageUrl" (click)="viewImg(data.imageUrl)"> |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(data)"> |
||||||
|
<img *ngIf="data.imageUrl && getFileType(data.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(data)"> |
||||||
|
</p> |
||||||
|
<div class="cutoffrule"></div> |
||||||
|
<p class="recordP"> |
||||||
|
<span>审核记录</span> |
||||||
|
<span> |
||||||
|
<span style="margin-right: 6px;"> |
||||||
|
审核次数：{{getVerifyNum()}} |
||||||
|
</span> |
||||||
|
<span> |
||||||
|
驳回次数：{{getRejectNum()}} |
||||||
|
</span> |
||||||
|
</span> |
||||||
|
</p> |
||||||
|
<nz-timeline> |
||||||
|
<nz-timeline-item *ngFor="let item of auditList"> |
||||||
|
<span style="margin-right: 12px;">{{item.creationTime | date:"yyyy/MM/dd"}}</span> |
||||||
|
<span>{{item.auditStatus | auditStatus}}</span> |
||||||
|
</nz-timeline-item> |
||||||
|
</nz-timeline> |
||||||
|
<ng-template #soccerTemplate> |
||||||
|
<div class="circle"> |
||||||
|
|
||||||
|
</div> |
||||||
|
</ng-template> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
@ -0,0 +1,59 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 15px; |
||||||
|
max-height: 580px; |
||||||
|
overflow-y: auto; |
||||||
|
.circle { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
background: linear-gradient(180deg, #36A2FF 0%, #FFFFFF 100%); |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
.recordP{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
p { |
||||||
|
margin-bottom: 0; |
||||||
|
color: #C4E2FC; |
||||||
|
margin: 12px 0; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 88px; |
||||||
|
height: 56px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,128 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
import { handleType, handleTypeList } from '../edit-update-category/edit-update-category.component'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-details-update-category', |
||||||
|
templateUrl: './details-update-category.component.html', |
||||||
|
styleUrls: ['./details-update-category.component.scss'] |
||||||
|
}) |
||||||
|
export class DetailsUpdateCategoryComponent implements OnInit { |
||||||
|
@Input() data?: any; |
||||||
|
constructor(private modal: NzModalRef,private message: NzMessageService,private http: HttpClient) { } |
||||||
|
|
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.getAuditLogging() |
||||||
|
} |
||||||
|
|
||||||
|
auditList: any[] = []; |
||||||
|
//获取审核记录
|
||||||
|
getAuditLogging() { |
||||||
|
if (!this.data.auditLogId) { |
||||||
|
return |
||||||
|
} |
||||||
|
let params = { id: this.data.auditLogId } |
||||||
|
this.http.get(`/api/services/app/ContentAuditLog/Get`,{params}).subscribe((data: any)=>{ |
||||||
|
this.auditList = data.result.actionList || [] |
||||||
|
console.log(this.auditList) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取审核次数
|
||||||
|
getVerifyNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 2 || item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
//获取驳回次数
|
||||||
|
getRejectNum(): number { |
||||||
|
let num = 0 |
||||||
|
this.auditList.forEach(item=>{ |
||||||
|
if (item.auditStatus == 3) { |
||||||
|
num = num + 1 |
||||||
|
} |
||||||
|
}) |
||||||
|
return num |
||||||
|
} |
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
|
||||||
|
//获取办理类型
|
||||||
|
getHandleTypes(handleTypes: any[]):string { |
||||||
|
if (!handleTypes || !handleTypes.length) { |
||||||
|
return |
||||||
|
} |
||||||
|
let names: string[] = [] |
||||||
|
let handleTypeList = JSON.parse(JSON.stringify(handleTypes)); |
||||||
|
let list: handleTypeList[] = new handleType().list; |
||||||
|
handleTypeList.forEach(item=>{ |
||||||
|
list.find(element=>{ |
||||||
|
item == element.value? names.push(element.name) : null |
||||||
|
}) |
||||||
|
}) |
||||||
|
return names.join(',') |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,70 @@ |
|||||||
|
<div class="box" id="editupdatecategory"> |
||||||
|
<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"> |
||||||
|
<p>证件名称: {{data2.licenseTypeName}}</p> |
||||||
|
|
||||||
|
<div class="cutoffrule"></div> |
||||||
|
|
||||||
|
<p>证件编号<span style="color: red;">*</span></p> |
||||||
|
<nz-form-item> |
||||||
|
<nz-form-control> |
||||||
|
<nz-input-group> |
||||||
|
<input nz-input type="text" formControlName="number" placeholder="请输入证件编号" [(ngModel)]="data2.licenseCode"/> |
||||||
|
</nz-input-group> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<p>证件有效期<span style="color: red;">*</span></p> |
||||||
|
|
||||||
|
<div class="validity"> |
||||||
|
<label nz-checkbox (ngModelChange)="validityChange($event)" [(ngModel)]="data2.isLongTerm" formControlName="isLongTerm"> |
||||||
|
<span>长期</span> |
||||||
|
</label> |
||||||
|
<nz-date-picker *ngIf="data2.isLongTerm" nzPlaceHolder="请选择开始日期" [(ngModel)]="isLongTermTime" (ngModelChange)="onChange($event)" formControlName="isLongTermTime"></nz-date-picker> |
||||||
|
<nz-range-picker *ngIf="!data2.isLongTerm" [(ngModel)]="isNoLongTermTime" (ngModelChange)="onChange($event)" formControlName="isNoLongTermTime"></nz-range-picker> |
||||||
|
</div> |
||||||
|
|
||||||
|
<p> |
||||||
|
<span style="margin-right: 12px;">有效期类型: {{data2.validityDays || 0}}天</span> |
||||||
|
<!-- <span>是否年检: <span *ngIf="data2.isYearlyCheck">是</span><span *ngIf="!data2.isYearlyCheck">否</span></span> --> |
||||||
|
</p> |
||||||
|
|
||||||
|
<p>办理类型</p> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select formControlName="type" nzMode="multiple" [(ngModel)]="data2.handleTypes"> |
||||||
|
<nz-option [nzValue]="item.value" [nzLabel]="item.name" *ngFor="let item of handleTypeList"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<p>附件上传（图片格式、pdf格式、word格式）</p> |
||||||
|
|
||||||
|
<div class="uploadDivbox"> |
||||||
|
<div class="uploadDiv" style="margin-right: 12px;"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'img'" style="width: 100%;height: 100%;cursor: pointer;" [src]="data2.imageUrl" (click)="viewImg(data2.imageUrl)"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(data2)"> |
||||||
|
<img *ngIf="data2.imageUrl && getFileType(data2.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(data2)"> |
||||||
|
|
||||||
|
<input *ngIf="!data2.imageUrl" (change)="filechange($event)" class="fileinput" type="file" name="" id=""> |
||||||
|
<button *ngIf="!data2.imageUrl" nz-button [nzLoading]=""><i nz-icon nzType="upload" |
||||||
|
nzTheme="outline"></i>上传附件</button> |
||||||
|
</div> |
||||||
|
<div class="uploadDiv" *ngIf="data2.imageUrl"> |
||||||
|
<input (change)="filechange($event)" class="fileinput" type="file" name="" id=""> |
||||||
|
<button nz-button [nzLoading]=""><i nz-icon nzType="upload" nzTheme="outline"></i>重新上传</button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="btnbox"> |
||||||
|
<button nz-button type="submit" class="ok" (click)="ok()">确定</button> |
||||||
|
<button nz-button type="button" class="cancel" (click)="destroyModal()">取消</button> |
||||||
|
</div> |
||||||
|
</form> |
||||||
|
</div> |
||||||
@ -0,0 +1,127 @@ |
|||||||
|
.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; |
||||||
|
} |
||||||
|
|
||||||
|
.form { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 17px; |
||||||
|
|
||||||
|
label { |
||||||
|
color: #C4E2FC; |
||||||
|
margin-right: 6px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.validity { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
nz-date-picker { |
||||||
|
flex: .5; |
||||||
|
} |
||||||
|
|
||||||
|
nz-range-picker { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
width: 100%; |
||||||
|
margin-top: 24px; |
||||||
|
margin-bottom: 17px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.uploadDivbox { |
||||||
|
width: 100%; |
||||||
|
height: 80px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
position: relative; |
||||||
|
margin: 5px 0; |
||||||
|
|
||||||
|
.uploadDiv { |
||||||
|
width: 120px; |
||||||
|
height: 80px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
position: relative; |
||||||
|
|
||||||
|
.fileinput { |
||||||
|
width: 114px; |
||||||
|
height: 32px; |
||||||
|
position: absolute; |
||||||
|
z-index: 100; |
||||||
|
opacity: 0; |
||||||
|
top: 23px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
|
||||||
|
button { |
||||||
|
z-index: 99; |
||||||
|
width: 114px; |
||||||
|
height: 32px; |
||||||
|
background: rgba(0, 129, 255, 0.3); |
||||||
|
border: 1px solid #36A2FF; |
||||||
|
opacity: 1; |
||||||
|
border-radius: 0px; |
||||||
|
color: #91CCFF; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,221 @@ |
|||||||
|
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 Viewer from 'viewerjs'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-edit-update-category', |
||||||
|
templateUrl: './edit-update-category.component.html', |
||||||
|
styleUrls: ['./edit-update-category.component.scss'] |
||||||
|
}) |
||||||
|
export class EditUpdateCategoryComponent implements OnInit { |
||||||
|
|
||||||
|
@Input() data?: any; |
||||||
|
|
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private objectsSrv: ObjectsSimpleService,private message: NzMessageService,) { } |
||||||
|
|
||||||
|
handleTypeList: handleTypeList[] = new handleType().list; |
||||||
|
data2: any; //深拷贝data
|
||||||
|
isLongTermTime: Date = null; // 限期 日期
|
||||||
|
isNoLongTermTime: Date[] = []; //长期 日期
|
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
number: [null, [Validators.required]], |
||||||
|
isLongTerm: [null, [Validators.required]], |
||||||
|
type: [null, [Validators.required]], |
||||||
|
isLongTermTime: [null,], |
||||||
|
isNoLongTermTime: [null,], |
||||||
|
}); |
||||||
|
// 日期
|
||||||
|
this.data2 = JSON.parse(JSON.stringify(this.data)) |
||||||
|
if (this.data2.isLongTerm) { |
||||||
|
this.isLongTermTime = new Date(this.data2.validityStartTime) |
||||||
|
if (this.isLongTermTime.getFullYear && this.isLongTermTime.getFullYear() < 1000) { |
||||||
|
this.isLongTermTime = new Date() |
||||||
|
} |
||||||
|
} else { |
||||||
|
this.isNoLongTermTime = [] |
||||||
|
this.isNoLongTermTime.push(new Date(this.data2.validityStartTime)) |
||||||
|
this.isNoLongTermTime.push(new Date(this.data2.validityEndTime)) |
||||||
|
if (this.isNoLongTermTime.length && this.isNoLongTermTime.find(item=>{ return item.getFullYear() < 1000 })) { |
||||||
|
this.isNoLongTermTime[0] = new Date() |
||||||
|
this.isNoLongTermTime[1] = new Date() |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
console.log(this.data2) |
||||||
|
} |
||||||
|
|
||||||
|
imageUrl = '/api/Objects/sinochemweb/stationPhotos/175/timg.jpg' |
||||||
|
|
||||||
|
destroyModal() { |
||||||
|
this.modal.destroy({ data: 'this the result data' }); |
||||||
|
} |
||||||
|
|
||||||
|
ok() { |
||||||
|
this.modal.triggerOk() |
||||||
|
} |
||||||
|
|
||||||
|
//check change
|
||||||
|
validityChange($event) { |
||||||
|
if ($event) { //长期
|
||||||
|
this.data2.validityDays = 999 |
||||||
|
} else { //限期
|
||||||
|
let start = (new Date(this.isNoLongTermTime[0])).getTime(); |
||||||
|
let end = (new Date(this.isNoLongTermTime[1])).getTime(); |
||||||
|
let time = end - start |
||||||
|
if (time <= 0) { |
||||||
|
this.data2.validityDays = 0 |
||||||
|
} else { |
||||||
|
this.data2.validityDays = time / (1000*3600*24); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
//date change
|
||||||
|
onChange(e) { |
||||||
|
if (!e) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (e instanceof Array) { |
||||||
|
let start = (new Date(e[0])).getTime(); |
||||||
|
let end = (new Date(e[1])).getTime(); |
||||||
|
let time = end - start |
||||||
|
if (time <= 0) { |
||||||
|
this.data2.validityDays = 0 |
||||||
|
} else { |
||||||
|
this.data2.validityDays = time / (1000*3600*24); |
||||||
|
} |
||||||
|
} else { |
||||||
|
this.data2.validityDays = 999 |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
isLoadingSave: boolean = false |
||||||
|
uploadIndex: string |
||||||
|
filechange(e) { |
||||||
|
let oilStationId = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id |
||||||
|
let file = e.target.files[0] || null //获取上传的文件
|
||||||
|
this.openFileSelect(file, `stationPhotos/${oilStationId}/`) |
||||||
|
} |
||||||
|
//设置文件路径并上传
|
||||||
|
postFilePath |
||||||
|
async openFileSelect(file: File, extensionPath: string) { |
||||||
|
this.postFilePath = extensionPath; |
||||||
|
let fileSize = file.size || null //上传文件的总大小
|
||||||
|
let shardSize = 5 * 1024 * 1024 //5MB 超过5MB要分块上传
|
||||||
|
if (fileSize >= shardSize) // 超过5MB要分块上传
|
||||||
|
{ |
||||||
|
await this.postFileByMul(file); |
||||||
|
} |
||||||
|
else //普通上传
|
||||||
|
{ |
||||||
|
await this.postFile(file); |
||||||
|
} |
||||||
|
} |
||||||
|
//上传文件
|
||||||
|
async postFile(file: File) { |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.objectsSrv.postFile(this.postFilePath, file).subscribe(data => { |
||||||
|
let dataObj = data as any; |
||||||
|
let filePath: string = ObjectsSimpleService.baseUrl + dataObj.objectName; |
||||||
|
this.imageUrl = filePath |
||||||
|
this.data2.imageUrl = filePath |
||||||
|
console.log('上传成功', filePath) |
||||||
|
resolve('success') |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 分块上传 |
||||||
|
* @param file
|
||||||
|
*/ |
||||||
|
postFileByMul(file: File) { |
||||||
|
this.objectsSrv.postFile_MultipartUpload(this.postFilePath, file).then((value) => { |
||||||
|
let dataObj = value as any; |
||||||
|
let filePath = dataObj.filePath |
||||||
|
this.imageUrl = filePath |
||||||
|
this.data2.imageUrl = filePath |
||||||
|
console.log('上传成功', filePath) |
||||||
|
}); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//办理类型
|
||||||
|
export class handleType { |
||||||
|
list: handleTypeList[] =[ |
||||||
|
{ value: 0, name: "无" }, |
||||||
|
{ value: 1, name: "年度公示" }, |
||||||
|
{ value: 2, name: "年检" }, |
||||||
|
{ value: 3, name: "到期换证" }, |
||||||
|
{ value: 4, name: "年度执行报告" }, |
||||||
|
{ value: 5, name: "到期检测" }, |
||||||
|
{ value: 6, name: "年度复训" }, |
||||||
|
{ value: 7, name: "年度检测" }, |
||||||
|
{ value: 8, name: "到期备案" }, |
||||||
|
{ value: 9, name: "到期评价" }, |
||||||
|
] |
||||||
|
} |
||||||
|
export class handleTypeList { |
||||||
|
value: number |
||||||
|
name: string |
||||||
|
} |
||||||
@ -0,0 +1,66 @@ |
|||||||
|
<div class="box" id="updateLicense"> |
||||||
|
<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: 30px;">证件名称</span> |
||||||
|
</th> |
||||||
|
<th>证件编号</th> |
||||||
|
<th>证件有效期</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"> |
||||||
|
<td> |
||||||
|
<span style="margin-left: 30px;">{{item.licenseTypeName || ''}}</span> |
||||||
|
</td> |
||||||
|
<td>{{item.licenseCode || ''}}</td> |
||||||
|
<td>{{item.isLongTerm ? '长期证照' : (item.validityEndTime | date:"yyyy/MM/dd")}}</td> |
||||||
|
<td> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'img'" [src]="item.imageUrl" (click)="viewImg(item.imageUrl)"> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'word'" src="../../../../assets/images/license/word.png" (click)="lookFile(item)"> |
||||||
|
<img *ngIf="item.imageUrl && getFileType(item.imageUrl) == 'pdf'" src="../../../../assets/images/license/pdf.png" (click)="lookFile(item)"> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<ng-container *ngIf="item.isLongTerm; else elseTemplate"> |
||||||
|
长期 |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
{{item.validityDays ? item.validityDays+'天' : '/'}} |
||||||
|
</ng-template> |
||||||
|
|
||||||
|
</td> |
||||||
|
<td>{{getHandleTypes(item.handleTypes)}}</td> |
||||||
|
<!-- <td><span *ngIf="item.isYearlyCheck">是</span><span *ngIf="!item.isYearlyCheck">否</span></td> --> |
||||||
|
<td>{{item.committedTime | date:"yyyy/MM/dd"}}<span *ngIf="!item.committedTime">未提交审核</span></td> |
||||||
|
<td> |
||||||
|
<span>{{item.auditStatus | auditStatus}}</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<span *ngIf="item.licenseViolationType == 0">无</span> |
||||||
|
<span *ngIf="item.licenseViolationType == 1">办理提醒</span> |
||||||
|
<span *ngIf="item.licenseViolationType == 2">临期提醒</span> |
||||||
|
<span *ngIf="item.licenseViolationType == 3">逾期报警</span> |
||||||
|
</td> |
||||||
|
<td class="operation"> |
||||||
|
<span class="blueColor" (click)="edit(item)">编辑</span> |
||||||
|
<span class="blueColor" (click)="details(item)">详情</span> |
||||||
|
<span class="blueColor" (click)="cancelReview(item)" *ngIf="item.auditStatus === 1">撤销审核</span> |
||||||
|
<span class="blueColor" (click)="submitReview(item)" *ngIf="item.auditStatus != 1">提交审核</span> |
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,20 @@ |
|||||||
|
.box{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
.tablebox{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
.operation{ |
||||||
|
span{ |
||||||
|
margin-right: 6px; |
||||||
|
} |
||||||
|
} |
||||||
|
#table{ |
||||||
|
img{ |
||||||
|
width: 30px; |
||||||
|
height: 30px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,205 @@ |
|||||||
|
import { Component, OnInit, ViewContainerRef } from '@angular/core'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
import { Observable, fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
import Viewer from 'viewerjs'; |
||||||
|
import { EditUpdateCategoryComponent, handleType, handleTypeList } from './edit-update-category/edit-update-category.component'; |
||||||
|
import * as moment from 'moment'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { DetailsUpdateCategoryComponent } from './details-update-category/details-update-category.component'; |
||||||
|
import { PdfWordLookComponent } from '../pdf-word-look/pdf-word-look.component'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-update-category', |
||||||
|
templateUrl: './update-category.component.html', |
||||||
|
styleUrls: ['./update-category.component.scss'] |
||||||
|
}) |
||||||
|
export class UpdateCategoryComponent implements OnInit { |
||||||
|
|
||||||
|
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private message: NzMessageService, private http: HttpClient) { } |
||||||
|
tableSpin = false |
||||||
|
list = [] |
||||||
|
|
||||||
|
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.getStationList() |
||||||
|
} |
||||||
|
|
||||||
|
//获取当前油站档案类证照
|
||||||
|
getStationList() { |
||||||
|
this.tableSpin = true |
||||||
|
let data = JSON.parse(sessionStorage.getItem('userdataOfgasstation')); |
||||||
|
let params = { orgId: data.organization.id || "" } |
||||||
|
this.http.get(`/api/services/app/StationValidityLicense/GetCurStationLicense`,{params}).subscribe((info: any)=>{ |
||||||
|
this.list = info.result |
||||||
|
this.tableSpin = false |
||||||
|
console.log(info.result) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//获取办理类型
|
||||||
|
getHandleTypes(handleTypes: any[]):string { |
||||||
|
if (!handleTypes || !handleTypes.length) { |
||||||
|
return |
||||||
|
} |
||||||
|
let names: string[] = [] |
||||||
|
let handleTypeList = JSON.parse(JSON.stringify(handleTypes)); |
||||||
|
let list: handleTypeList[] = new handleType().list; |
||||||
|
handleTypeList.forEach(item=>{ |
||||||
|
list.find(element=>{ |
||||||
|
item == element.value? names.push(element.name) : null |
||||||
|
}) |
||||||
|
}) |
||||||
|
return names.join(',') |
||||||
|
} |
||||||
|
|
||||||
|
//获取文件格式
|
||||||
|
getFileType(name: string):string { |
||||||
|
let suffix |
||||||
|
if (name.substring(name.length-4).includes('png') || name.substring(name.length-4).includes('jpg') || name.substring(name.length-4).includes('jpeg') || name.substring(name.length-4).includes('webp')) { |
||||||
|
suffix = 'img' |
||||||
|
} else if (name.substring(name.length-4).includes('doc') || name.substring(name.length-4).includes('docx')) { |
||||||
|
suffix = 'word' |
||||||
|
} else if (name.substring(name.length-4).includes('pdf')) { |
||||||
|
suffix = 'pdf' |
||||||
|
} |
||||||
|
return suffix |
||||||
|
} |
||||||
|
|
||||||
|
//查看图片
|
||||||
|
viewImg(url) { |
||||||
|
let dom = document.getElementById(`viewerjs`) |
||||||
|
let pObjs = dom.childNodes; |
||||||
|
let node = document.createElement("img") |
||||||
|
node.style.display = "none"; |
||||||
|
node.src = url; |
||||||
|
node.id = 'img' |
||||||
|
dom.appendChild(node) |
||||||
|
setTimeout(() => { |
||||||
|
let viewer = new Viewer(document.getElementById(`viewerjs`), { |
||||||
|
hidden: () => { |
||||||
|
dom.removeChild(pObjs[0]); |
||||||
|
viewer.destroy(); |
||||||
|
} |
||||||
|
}); |
||||||
|
node.click(); |
||||||
|
}, 0); |
||||||
|
} |
||||||
|
|
||||||
|
//查看文件
|
||||||
|
lookFile(item) { |
||||||
|
if (!item.imageUrl) { |
||||||
|
return |
||||||
|
} |
||||||
|
if (this.getFileType(item.imageUrl) == 'word') { |
||||||
|
let arr = item.imageUrl.split('.') |
||||||
|
arr[arr.length - 1] = 'pdf' |
||||||
|
window.open(arr.join('.')) |
||||||
|
} else if (this.getFileType(item.imageUrl) == 'pdf') { |
||||||
|
window.open(item.imageUrl) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '暂不支持查看！'); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
dispose() { |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
edit(item) { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: EditUpdateCategoryComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 750, |
||||||
|
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 () => { |
||||||
|
if (instance.validateForm.valid) { |
||||||
|
await new Promise(resolve => { |
||||||
|
let body = instance.data2 |
||||||
|
// 日期
|
||||||
|
if (body.isLongTerm) { |
||||||
|
body.validityStartTime = instance.isLongTermTime |
||||||
|
} else { |
||||||
|
body.validityStartTime = instance.isNoLongTermTime[0] || new Date() |
||||||
|
body.validityEndTime = instance.isNoLongTermTime[1] || new Date() |
||||||
|
} |
||||||
|
this.http.post('/api/services/app/StationValidityLicense/Create', body).subscribe(data => { |
||||||
|
resolve(data); |
||||||
|
this.getStationList(); |
||||||
|
this.message.create('success', '修改成功！'); |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '请填写完整！'); |
||||||
|
return false |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
|
||||||
|
details(item) { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DetailsUpdateCategoryComponent, |
||||||
|
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 () => { |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
} |
||||||
|
|
||||||
|
//提交审核
|
||||||
|
submitReview(item){ |
||||||
|
if (!item.id) { |
||||||
|
return |
||||||
|
} |
||||||
|
let params = { id: item.id } |
||||||
|
this.http.post('/api/services/app/StationValidityLicense/Commit', {},{params}).subscribe(data => { |
||||||
|
this.message.create('success', '提交审核成功！'); |
||||||
|
this.getStationList(); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//撤销审核
|
||||||
|
cancelReview(item){ |
||||||
|
let params = { id: item.id } |
||||||
|
this.http.post('/api/services/app/StationValidityLicense/Uncommit', {},{params}).subscribe(data => { |
||||||
|
this.message.create('success', '撤销审核成功！'); |
||||||
|
this.getStationList(); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,260 @@ |
|||||||
|
<div class="recordsboxadmin" id="recordsboxadmin"> |
||||||
|
<div class="content"> |
||||||
|
|
||||||
|
<div class="title"> |
||||||
|
<div class="titlebox"> |
||||||
|
<img src="../../../assets/images/logosm.png" alt=""> |
||||||
|
<div class="content"> |
||||||
|
<div class="contentitem"> |
||||||
|
<span class="grey" (click)="gorecordList()">预警类型统计</span> |
||||||
|
<span>预警误报统计</span> |
||||||
|
<span class="grey" (click)="goOilList()">卸油统计</span> |
||||||
|
<span class="grey" (click)="goWarningList()">证照预警统计</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!-- <img (click)="isEchartsShow()" class="packup" src="../../../assets/images/packup.png" alt=""> --> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="search"> |
||||||
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear id="level" formControlName="level" nzPlaceHolder="请选择预警级别"> |
||||||
|
<nz-option nzValue="1" nzLabel="Ⅰ级"></nz-option> |
||||||
|
<nz-option nzValue="2" nzLabel="Ⅱ级"></nz-option> |
||||||
|
<nz-option nzValue="3" nzLabel="Ⅲ级"></nz-option> |
||||||
|
<nz-option nzValue="4" nzLabel="Ⅳ级"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="searchParams searchParamsLong"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-tree-select [nzAllowClear]="false" [nzDropdownClassName]="'maxHeightTreeSelect'" |
||||||
|
nzShowSearch [(ngModel)]="defaultOrId" formControlName="organization" [nzNodes]="nodes" |
||||||
|
nzPlaceHolder="请选择所属机构" [nzExpandedIcon]="multiExpandedIconTpl"> |
||||||
|
</nz-tree-select> |
||||||
|
<ng-template #multiExpandedIconTpl let-node let-origin="origin"> |
||||||
|
<ng-container *ngIf="node.children.length == 0; else elseTemplate"> |
||||||
|
|
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
<i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" |
||||||
|
class="ant-tree-switcher-line-icon"></i> |
||||||
|
</ng-template> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear id="type" (ngModelChange)="typeChange($event)" formControlName="type" |
||||||
|
nzPlaceHolder="请选择预警类型"> |
||||||
|
<nz-option *ngFor="let item of warningTypes" [nzValue]="item.key" [nzLabel]="item.key"> |
||||||
|
</nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="event" nzPlaceHolder="请选择预警事件"> |
||||||
|
<nz-option *ngFor="let item of warningTypesDetails" [nzValue]="item.id" |
||||||
|
[nzLabel]="item.eventSystemName"> |
||||||
|
</nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear id="site" formControlName="site" nzPlaceHolder="请选择区域"> |
||||||
|
<nz-option nzValue="出入口" nzLabel="出入口"></nz-option> |
||||||
|
<nz-option nzValue="加油区" nzLabel="加油区"></nz-option> |
||||||
|
<nz-option nzValue="油罐区" nzLabel="油罐区"></nz-option> |
||||||
|
<nz-option nzValue="便利店" nzLabel="便利店"></nz-option> |
||||||
|
<nz-option nzValue="办公区" nzLabel="办公区"></nz-option> |
||||||
|
<nz-option nzValue="其他区域" nzLabel="其他区域"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-select nzAllowClear formControlName="disposalState" nzPlaceHolder="请选择处置状态"> |
||||||
|
<nz-option nzValue="0" nzLabel="已处置"></nz-option> |
||||||
|
<nz-option nzValue="1" nzLabel="未处置"></nz-option> |
||||||
|
</nz-select> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="searchParams searchParams2"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-range-picker [nzAllowClear]="false" formControlName="datePicker"></nz-range-picker> |
||||||
|
<br /> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="submit" class="submit"><i nz-icon [nzType]="'search'"></i>查询</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="button" class="reset" (click)="resetForm($event)"><i nz-icon |
||||||
|
[nzType]="'sync'"></i>重置</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="chartsbox" hidden> |
||||||
|
<div class="chart"> |
||||||
|
<div class="leftbox" style="position: relative;"> |
||||||
|
<span class="chartname"> |
||||||
|
<img src="../../../assets/images/flower.png" alt=""> |
||||||
|
预警类别统计 |
||||||
|
</span> |
||||||
|
<div class="centerContent"> |
||||||
|
<div class="numname">预警事件总数</div> |
||||||
|
<div class="num">{{num}}</div> |
||||||
|
</div> |
||||||
|
<div class="piechart" id="piechart"> |
||||||
|
|
||||||
|
</div> |
||||||
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
||||||
|
</div> |
||||||
|
<div class="rightbox" style="position: relative;"> |
||||||
|
<span class="chartname"> |
||||||
|
<img src="../../../assets/images/flower.png" alt=""> |
||||||
|
近一个月预警统计 |
||||||
|
</span> |
||||||
|
<div class="btnbox"> |
||||||
|
<div class="btn" (click)="echartClick('分布')" [ngClass]="{'selectedbtn': selectedType == '分布'}"> |
||||||
|
统计</div> |
||||||
|
<div class="rankingBtnbox" (mouseenter)="mouseEnter()" (mouseleave)="mouseleave()"> |
||||||
|
<div class="btn" |
||||||
|
[ngClass]="{'selectedbtn': (selectedRankingType == '站点排名' || selectedRankingType == '事件排名')}"> |
||||||
|
排名</div> |
||||||
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('站点排名')" |
||||||
|
[ngClass]="{'selectedbtn': selectedRankingType == '站点排名'}">油站</div> |
||||||
|
<div class="btn rankingBtn" *ngIf="isMouseEnter" (click)="echartClick2('事件排名')" |
||||||
|
[ngClass]="{'selectedbtn': selectedRankingType == '事件排名'}">事件</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="barchart" id="barchart"> |
||||||
|
</div> |
||||||
|
<nz-spin *ngIf="chartsSpin" nzSimple class="nzspin"></nz-spin> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!-- <div class="title"> |
||||||
|
<app-title [name]="'预警类型统计'"></app-title> |
||||||
|
</div> --> |
||||||
|
|
||||||
|
<div class="tablebox"> |
||||||
|
<div class="table"> |
||||||
|
<div nz-row class="th"> |
||||||
|
<div nz-col nzSpan="1" style="text-align: center;"> |
||||||
|
<span>序号</span> |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" style="text-align: center;"> |
||||||
|
<span style="margin-right:46px;"> |
||||||
|
预警级别 |
||||||
|
</span> |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
预警类型 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
预警事件 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
所属公司 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="3"> |
||||||
|
管理区域 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
加油站 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
预警区域 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
摄像头名称 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="3"> |
||||||
|
预警时间 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
状态 |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="1"> |
||||||
|
操作 |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="tbody" id="tbody"> |
||||||
|
<div nz-row class="tr" *ngFor="let item of list;let key = index"> |
||||||
|
<div nz-col nzSpan="1" style="text-align: center;"> |
||||||
|
<span>{{key + 1}}</span> |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
<img style="margin-left: 18px;" *ngIf="item.violation.level == 1" |
||||||
|
src="../../../assets/images/level1.png" alt=""> |
||||||
|
<img style="margin-left: 18px;" *ngIf="item.violation.level == 2" |
||||||
|
src="../../../assets/images/level2.png" alt=""> |
||||||
|
<img style="margin-left: 18px;" *ngIf="item.violation.level == 3" |
||||||
|
src="../../../assets/images/level3.png" alt=""> |
||||||
|
<img style="margin-left: 18px;" *ngIf="item.violation.level == 4" |
||||||
|
src="../../../assets/images/level4.png" alt=""> |
||||||
|
<span *ngIf="item.violation.level == 1">Ⅰ级</span> |
||||||
|
<span *ngIf="item.violation.level == 2">Ⅱ级</span> |
||||||
|
<span *ngIf="item.violation.level == 3">Ⅲ级</span> |
||||||
|
<span *ngIf="item.violation.level == 4">Ⅳ级</span> |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.violation.violationType"> |
||||||
|
{{item.violation.violationType}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.violation.eventSystemName"> |
||||||
|
{{item.violation.eventSystemName}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.gasStation.companyName"> |
||||||
|
{{item.gasStation.companyName}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="3" [title]="item.gasStation.locationName"> |
||||||
|
{{item.gasStation.locationName}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.gasStation.stationName"> |
||||||
|
{{item.gasStation.stationName}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.violateArea"> |
||||||
|
{{item.violateArea}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2" [title]="item.cameraNo"> |
||||||
|
{{item.cameraNo}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="3"> |
||||||
|
{{item.violateTime | date:"yyyy-MM-dd HH:mm:ss"}} |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="2"> |
||||||
|
<span *ngIf="item.handleTime">已处置</span> |
||||||
|
<span *ngIf="!item.handleTime" style="color: #FF4B65;">未处置</span> |
||||||
|
</div> |
||||||
|
<div nz-col nzSpan="1"> |
||||||
|
<span class="look" (click)="look(item)" style="margin-right: 12px;">查看</span> |
||||||
|
<!-- <span *ngIf="!item.handleTime" style="color: #36A2FF;cursor: pointer;" (click)="dispose(item)">处置</span> |
||||||
|
<span *ngIf="item.handleTime" style="color: rgba(145, 204, 255, 0.24);;">处置</span> --> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div nz-row class="tr" *ngIf="tableSpin"> |
||||||
|
<div nz-col nzSpan="24" style="text-align: center;"> |
||||||
|
<nz-spin nzSimple></nz-spin> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,612 @@ |
|||||||
|
.recordsboxadmin { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 36px; |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
margin-bottom: 16px; |
||||||
|
|
||||||
|
form { |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-start; |
||||||
|
|
||||||
|
.searchParams, |
||||||
|
.btn { |
||||||
|
margin: 0 3px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams { |
||||||
|
// flex: 5; |
||||||
|
width: 150px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParamsLong { |
||||||
|
width: 250px; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams2 { |
||||||
|
width: 220px; |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
// flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
nz-select { |
||||||
|
color: rgba(145, 204, 255, 0.95); |
||||||
|
} |
||||||
|
|
||||||
|
nz-tree-select { |
||||||
|
color: rgba(145, 204, 255, 0.95); |
||||||
|
} |
||||||
|
|
||||||
|
nz-range-picker { |
||||||
|
background-color: rgba(0, 0, 0, 0); |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: hidden; |
||||||
|
|
||||||
|
.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; |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
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%); |
||||||
|
|
||||||
|
.contentitem { |
||||||
|
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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.chartsbox { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
|
||||||
|
.chartname { |
||||||
|
position: absolute; |
||||||
|
left: 20px; |
||||||
|
top: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.chart { |
||||||
|
width: 98%; |
||||||
|
height: 350px; |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 10px; |
||||||
|
display: flex; |
||||||
|
|
||||||
|
div { |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
|
||||||
|
span { |
||||||
|
font-family: titlefont; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
height: 28px; |
||||||
|
color: #bee1ff; |
||||||
|
font-size: 16px; |
||||||
|
} |
||||||
|
|
||||||
|
div { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.leftbox { |
||||||
|
width: 360px; |
||||||
|
position: relative; |
||||||
|
border: 0px; |
||||||
|
box-shadow: 0 0 26px 0px #1a7fd7 inset; |
||||||
|
margin-right: 16px; |
||||||
|
|
||||||
|
.centerContent { |
||||||
|
position: absolute; |
||||||
|
top: 42%; |
||||||
|
left: 50%; |
||||||
|
transform: translateX(-50%); |
||||||
|
width: 170px; |
||||||
|
|
||||||
|
div { |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
|
||||||
|
.numname { |
||||||
|
font-family: titlefont; |
||||||
|
color: #bee1ff; |
||||||
|
} |
||||||
|
|
||||||
|
.num { |
||||||
|
color: #FFFFFF; |
||||||
|
font-size: 42px; |
||||||
|
text-shadow: 0px 0px 16px #3A9AFF; |
||||||
|
font-weight: bold; |
||||||
|
height: 49px; |
||||||
|
line-height: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.rightbox { |
||||||
|
flex: 1; |
||||||
|
position: relative; |
||||||
|
border: 0px; |
||||||
|
box-shadow: 0 0 26px 0px #1a7fd7 inset; |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
position: absolute; |
||||||
|
right: 28px; |
||||||
|
top: 12px; |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
z-index: 999; |
||||||
|
|
||||||
|
.btn { |
||||||
|
width: 64px; |
||||||
|
height: 30px; |
||||||
|
text-align: center; |
||||||
|
line-height: 30px; |
||||||
|
// border: 1px solid #91CCFF; |
||||||
|
color: #91CCFF; |
||||||
|
border-radius: 0px; |
||||||
|
box-shadow: 0 0 5px 1px #2399FF inset; |
||||||
|
background: none; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
|
||||||
|
.rankingBtnbox { |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.selectedbtn { |
||||||
|
background: linear-gradient(180deg, #000D21 0%, #001331 27%, #2399FF 100%); |
||||||
|
color: white; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
overflow: hidden; |
||||||
|
|
||||||
|
.table { |
||||||
|
color: white; |
||||||
|
flex: 1; |
||||||
|
width: 96%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: hidden; |
||||||
|
|
||||||
|
.th { |
||||||
|
height: 38px; |
||||||
|
line-height: 38px; |
||||||
|
background: rgba(35, 153, 255, 0.2); |
||||||
|
border: 1px solid rgba(35, 217, 255, 0.4); |
||||||
|
box-shadow: 0 0 3px 0 rgba(35, 217, 255, 0.4) inset; |
||||||
|
color: #23D9FF; |
||||||
|
} |
||||||
|
|
||||||
|
.tbody { |
||||||
|
flex: 1; |
||||||
|
overflow-y: auto; |
||||||
|
|
||||||
|
.tr { |
||||||
|
height: 38px; |
||||||
|
line-height: 38px; |
||||||
|
border-bottom: 1px solid #0d3761; |
||||||
|
|
||||||
|
div { |
||||||
|
color: #91CCFF; |
||||||
|
white-space: nowrap; |
||||||
|
overflow: hidden; |
||||||
|
text-overflow: ellipsis; |
||||||
|
|
||||||
|
.look { |
||||||
|
color: #36A2FF; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
img { |
||||||
|
width: 36px; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.pagination { |
||||||
|
margin: 15px 0; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
|
||||||
|
::-webkit-scrollbar { |
||||||
|
width: 0px; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
// 适配125% |
||||||
|
@media screen and (max-height: 750px) { |
||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 30px; |
||||||
|
height: 32px; |
||||||
|
margin-bottom: 12px; |
||||||
|
|
||||||
|
form { |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
overflow: hidden; |
||||||
|
|
||||||
|
.title { |
||||||
|
height: 42px; |
||||||
|
padding: 0 20px; |
||||||
|
margin: 8px 0; |
||||||
|
|
||||||
|
.titlebox { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 46px; |
||||||
|
height: 46px; |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
height: 36px; |
||||||
|
|
||||||
|
.contentitem { |
||||||
|
width: 100%; |
||||||
|
height: 25px; |
||||||
|
|
||||||
|
span { |
||||||
|
margin-left: 6px; |
||||||
|
font-size: 16px; |
||||||
|
} |
||||||
|
|
||||||
|
span:nth-child(1) { |
||||||
|
margin-left: 8px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.packup { |
||||||
|
position: absolute; |
||||||
|
right: 33px; |
||||||
|
top: 4px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.chartsbox { |
||||||
|
width: 100%; |
||||||
|
height: 43%; |
||||||
|
|
||||||
|
.chartname { |
||||||
|
position: absolute; |
||||||
|
left: 20px; |
||||||
|
top: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.chart { |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
div { |
||||||
|
span { |
||||||
|
font-size: 14px; |
||||||
|
} |
||||||
|
|
||||||
|
div { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.leftbox { |
||||||
|
width: 300px; |
||||||
|
box-shadow: 0 0 20px 0px #1a7fd7 inset; |
||||||
|
margin-right: 12px; |
||||||
|
|
||||||
|
.centerContent { |
||||||
|
.num { |
||||||
|
color: #FFFFFF; |
||||||
|
font-size: 42px; |
||||||
|
text-shadow: 0px 0px 16px #3A9AFF; |
||||||
|
font-weight: bold; |
||||||
|
height: 49px; |
||||||
|
line-height: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.rightbox { |
||||||
|
flex: 1; |
||||||
|
position: relative; |
||||||
|
border: 0px; |
||||||
|
box-shadow: 0 0 26px 0px #1a7fd7 inset; |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
position: absolute; |
||||||
|
right: 28px; |
||||||
|
top: 12px; |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
z-index: 999; |
||||||
|
|
||||||
|
.rankingBtn { |
||||||
|
margin-right: 12px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
.table { |
||||||
|
.th { |
||||||
|
height: 32px; |
||||||
|
line-height: 32px; |
||||||
|
font-size: 12px !important; |
||||||
|
} |
||||||
|
|
||||||
|
.tbody { |
||||||
|
|
||||||
|
.tr { |
||||||
|
height: 32px; |
||||||
|
line-height: 32px; |
||||||
|
|
||||||
|
div { |
||||||
|
font-size: 12px !important; |
||||||
|
} |
||||||
|
|
||||||
|
img { |
||||||
|
width: 32px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// 适配150% |
||||||
|
@media screen and (max-height: 600px) { |
||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 22px; |
||||||
|
height: 32px; |
||||||
|
margin-bottom: 6px; |
||||||
|
|
||||||
|
form { |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
.title { |
||||||
|
height: 36px; |
||||||
|
padding: 0 20px; |
||||||
|
margin: 3px 0; |
||||||
|
|
||||||
|
.titlebox { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
img { |
||||||
|
width: 36px; |
||||||
|
height: 36px; |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
height: 30px; |
||||||
|
|
||||||
|
.contentitem { |
||||||
|
width: 100%; |
||||||
|
height: 22px; |
||||||
|
|
||||||
|
span { |
||||||
|
margin-left: 6px; |
||||||
|
font-size: 13px; |
||||||
|
} |
||||||
|
|
||||||
|
span:nth-child(1) { |
||||||
|
margin-left: 12px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.packup { |
||||||
|
position: absolute; |
||||||
|
right: 33px; |
||||||
|
top: 2px; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.chartsbox { |
||||||
|
width: 100%; |
||||||
|
height: 40%; |
||||||
|
|
||||||
|
.chartname { |
||||||
|
position: absolute; |
||||||
|
left: 20px; |
||||||
|
top: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.chart { |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
div { |
||||||
|
span { |
||||||
|
font-size: 14px; |
||||||
|
} |
||||||
|
|
||||||
|
div { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.leftbox { |
||||||
|
width: 260px; |
||||||
|
box-shadow: 0 0 20px 0px #1a7fd7 inset; |
||||||
|
margin-right: 8px; |
||||||
|
|
||||||
|
.centerContent { |
||||||
|
.num { |
||||||
|
color: #FFFFFF; |
||||||
|
font-size: 32px; |
||||||
|
text-shadow: 0px 0px 12px #3A9AFF; |
||||||
|
font-weight: bold; |
||||||
|
height: 42px; |
||||||
|
line-height: 42px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.rightbox { |
||||||
|
box-shadow: 0 0 22px 0px #1a7fd7 inset; |
||||||
|
|
||||||
|
.btnbox { |
||||||
|
position: absolute; |
||||||
|
right: 28px; |
||||||
|
top: 12px; |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
z-index: 999; |
||||||
|
|
||||||
|
.rankingBtn { |
||||||
|
margin-right: 8px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
.table { |
||||||
|
.th { |
||||||
|
height: 28px; |
||||||
|
line-height: 28px; |
||||||
|
font-size: 10px !important; |
||||||
|
} |
||||||
|
|
||||||
|
.tbody { |
||||||
|
|
||||||
|
.tr { |
||||||
|
height: 28px; |
||||||
|
line-height: 28px; |
||||||
|
|
||||||
|
div { |
||||||
|
font-size: 10px !important; |
||||||
|
} |
||||||
|
|
||||||
|
img { |
||||||
|
width: 30px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,822 @@ |
|||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { Component, ElementRef, OnInit, ViewContainerRef } from '@angular/core'; |
||||||
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||||
|
import { Router } from '@angular/router' |
||||||
|
import * as echarts from 'echarts'; |
||||||
|
|
||||||
|
import { fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
|
||||||
|
import * as moment from 'moment'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
import { GetOutOfLineDetailsComponent } from '../today-warning/get-out-of-line-details/get-out-of-line-details.component'; |
||||||
|
import { OilUnloadingProcessComponent } from '../oil-unloading-process/oil-unloading-process.component'; |
||||||
|
import { DispositionComponent } from '../disposition/disposition.component'; |
||||||
|
import { NzMessageService } from 'ng-zorro-antd/message'; |
||||||
|
import { TreeService } from 'src/app/service/tree.service'; |
||||||
|
import { DisposeequipmentComponent } from '../warning-statistics-list/disposeequipment/disposeequipment.component'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-misinformation-list', |
||||||
|
templateUrl: './misinformation-list.component.html', |
||||||
|
styleUrls: ['./misinformation-list.component.scss'] |
||||||
|
}) |
||||||
|
export class MisinformationListComponent implements OnInit { |
||||||
|
|
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private element: ElementRef, private toTree: TreeService, private http: HttpClient, private fb: FormBuilder, private router: Router, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private message: NzMessageService) { } |
||||||
|
//饼图
|
||||||
|
myChart |
||||||
|
option = { |
||||||
|
color: ['#FF4B65', '#23D9FF', '#608AFF', '#B2FF6D', '#FFFF99', '#C4E2FC', '#FF7F00', '#0090FF', '#FFD634', '#105597', '#FF4B65', '#23D9FF', '#71FFF5', '#B2FF6D'], |
||||||
|
tooltip: { |
||||||
|
trigger: 'item'//触发类型
|
||||||
|
}, |
||||||
|
series: [ |
||||||
|
{ |
||||||
|
// name: 'Access From',
|
||||||
|
type: 'pie', |
||||||
|
radius: ['58%', '75%'],//内半径外，外半径
|
||||||
|
left: '0', |
||||||
|
top: '9%', |
||||||
|
avoidLabelOverlap: false,//防止标签重叠策略
|
||||||
|
label: {//每一个标签外网延伸的引导说明
|
||||||
|
show: false, |
||||||
|
position: 'outside' |
||||||
|
}, |
||||||
|
labelLine: {//引导线
|
||||||
|
show: true, |
||||||
|
showAbove: true |
||||||
|
}, |
||||||
|
emphasis: {//中间高亮区域
|
||||||
|
label: { |
||||||
|
show: false, |
||||||
|
fontSize: '40', |
||||||
|
fontWeight: 'bold' |
||||||
|
} |
||||||
|
}, |
||||||
|
data: [ |
||||||
|
|
||||||
|
], |
||||||
|
tooltip: {//鼠标移入提示
|
||||||
|
position: 'right', |
||||||
|
padding: [14, 19], |
||||||
|
backgroundColor: 'rgba(28, 129, 218, 0.4)', |
||||||
|
textStyle: { |
||||||
|
color: '#fff', |
||||||
|
fontSize: 12 |
||||||
|
}, |
||||||
|
formatter: "{b} : {c} ({d}%)" |
||||||
|
} |
||||||
|
} |
||||||
|
] |
||||||
|
}; |
||||||
|
//柱状图
|
||||||
|
mybarChart: any |
||||||
|
baroption = { |
||||||
|
xAxis: { |
||||||
|
type: 'category', |
||||||
|
data: [], |
||||||
|
axisLine: { |
||||||
|
show: false, |
||||||
|
lineStyle: { |
||||||
|
color: '#91CCFF' |
||||||
|
} |
||||||
|
}, |
||||||
|
axisTick: {//刻度线
|
||||||
|
show: false |
||||||
|
}, |
||||||
|
inverse: true |
||||||
|
}, |
||||||
|
yAxis: { |
||||||
|
type: 'value', |
||||||
|
nameTextStyle: { |
||||||
|
color: '#C4E2FC' |
||||||
|
}, |
||||||
|
splitLine: {//分割线
|
||||||
|
lineStyle: { |
||||||
|
color: ['#0f4374'], |
||||||
|
width: 2 |
||||||
|
} |
||||||
|
}, |
||||||
|
axisTick: {//刻度线
|
||||||
|
show: false |
||||||
|
}, |
||||||
|
axisLine: {//轴线
|
||||||
|
show: false, |
||||||
|
lineStyle: { |
||||||
|
color: '#C4E2FC' |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
tooltip: { |
||||||
|
// trigger: 'axis'
|
||||||
|
}, |
||||||
|
series: [ |
||||||
|
{ |
||||||
|
data: [], |
||||||
|
type: 'bar', |
||||||
|
itemStyle: { |
||||||
|
color: { |
||||||
|
type: 'linear', |
||||||
|
x: 0, |
||||||
|
y: 0, |
||||||
|
x2: 0, |
||||||
|
y2: 1, |
||||||
|
colorStops: [{ |
||||||
|
offset: 0, color: '#23F0FF' // 0% 处的颜色
|
||||||
|
}, { |
||||||
|
offset: 1, color: 'rgba(35, 153, 255, 0.1)' // 100% 处的颜色
|
||||||
|
}], |
||||||
|
global: false // 缺省为 false
|
||||||
|
} |
||||||
|
}, |
||||||
|
barWidth: '25%' |
||||||
|
}, |
||||||
|
{ |
||||||
|
data: [], |
||||||
|
type: 'line', |
||||||
|
symbol: 'circle', |
||||||
|
symbolSize: 8, |
||||||
|
label: { |
||||||
|
show: true |
||||||
|
}, |
||||||
|
itemStyle: { |
||||||
|
color: '#fff', |
||||||
|
shadowColor: '#fff', |
||||||
|
shadowBlur: 10 |
||||||
|
}, |
||||||
|
lineStyle: { |
||||||
|
color: '#FFCC8A', |
||||||
|
width: 1 |
||||||
|
} |
||||||
|
} |
||||||
|
], |
||||||
|
grid: { |
||||||
|
left: '42px', |
||||||
|
right: '30px', |
||||||
|
bottom: '38px', |
||||||
|
top: '80px' |
||||||
|
} |
||||||
|
}; |
||||||
|
baroption2 = { |
||||||
|
xAxis: { |
||||||
|
type: 'value', |
||||||
|
show: false |
||||||
|
}, |
||||||
|
tooltip: { |
||||||
|
// trigger: 'axis'
|
||||||
|
}, |
||||||
|
yAxis: { |
||||||
|
type: 'category', |
||||||
|
data: [], |
||||||
|
axisLine: { |
||||||
|
show: false, |
||||||
|
lineStyle: { |
||||||
|
color: '#91CCFF', |
||||||
|
} |
||||||
|
}, |
||||||
|
axisTick: {//刻度线
|
||||||
|
show: false |
||||||
|
}, |
||||||
|
axisLabel: { |
||||||
|
formatter: function (value, index) { |
||||||
|
let newParamsName = ''; |
||||||
|
const paramsNameNumber = value.length; |
||||||
|
const provideNumber = 1000; |
||||||
|
const rowNumber = Math.ceil(paramsNameNumber / provideNumber); |
||||||
|
if (paramsNameNumber > provideNumber) { |
||||||
|
for (let p = 0; p < rowNumber; p++) { |
||||||
|
let tempStr = ''; |
||||||
|
const start = p * provideNumber; |
||||||
|
const end = start + provideNumber; |
||||||
|
if (p == rowNumber - 1) { |
||||||
|
tempStr = value.substring(start, paramsNameNumber); |
||||||
|
} else { |
||||||
|
tempStr = value.substring(start, end) + '\n'; |
||||||
|
} |
||||||
|
newParamsName += tempStr; |
||||||
|
} |
||||||
|
} else { |
||||||
|
newParamsName = value; |
||||||
|
} |
||||||
|
// 格式化成月/日，只在第一个刻度显示年份
|
||||||
|
return '{s|·}' + `{a|${newParamsName}}`; |
||||||
|
}, |
||||||
|
rich: { |
||||||
|
a: { |
||||||
|
color: '#C4E2FC', |
||||||
|
padding: [0, 0, 0, 8], |
||||||
|
}, |
||||||
|
s: { |
||||||
|
color: '#fff', |
||||||
|
borderWidth: 1, |
||||||
|
borderColor: '#23D9FF', |
||||||
|
backgroundColor: '#fff', |
||||||
|
width: 4, |
||||||
|
height: 4, |
||||||
|
shadowBlur: 3, |
||||||
|
shadowColor: "#fff" |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
inverse: true//倒序
|
||||||
|
|
||||||
|
}, |
||||||
|
series: |
||||||
|
{ |
||||||
|
label: { |
||||||
|
// 柱图头部显示值
|
||||||
|
show: true, |
||||||
|
position: "right", |
||||||
|
color: "#fff", |
||||||
|
fontSize: 12, |
||||||
|
formatter: '{c}', |
||||||
|
offset: [6, 0] |
||||||
|
}, |
||||||
|
data: [], |
||||||
|
type: 'bar', |
||||||
|
itemStyle: { |
||||||
|
color: { |
||||||
|
type: 'linear', |
||||||
|
x: 0, |
||||||
|
y: 0, |
||||||
|
x2: 1, |
||||||
|
y2: 0, |
||||||
|
colorStops: [{ |
||||||
|
offset: 0, color: '#063d72' // 0% 处的颜色
|
||||||
|
}, { |
||||||
|
offset: 1, color: '#FF9963' // 100% 处的颜色
|
||||||
|
}], |
||||||
|
global: false // 缺省为 false
|
||||||
|
} |
||||||
|
}, |
||||||
|
barWidth: '36%' |
||||||
|
} |
||||||
|
, |
||||||
|
grid: { |
||||||
|
left: '175px', |
||||||
|
right: '60px', |
||||||
|
bottom: '3px', |
||||||
|
top: '36px' |
||||||
|
}, |
||||||
|
// dataZoom: [ //Y轴滑动条
|
||||||
|
// {
|
||||||
|
// type: 'slider', //滑动条
|
||||||
|
// show: true, //开启
|
||||||
|
// yAxisIndex: 0,//表示控制第几个y轴
|
||||||
|
// left: '97%', //滑动条位置
|
||||||
|
// start: 1, //初始化时，滑动条宽度开始标度
|
||||||
|
// end: 100, //初始化时，滑动条宽度结束标度<br>
|
||||||
|
// maxValueSpan: 10,//显示数据的条数(默认显示10个)
|
||||||
|
// showDataShadow: false,//是否显示数据阴影 默认auto
|
||||||
|
// showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
|
||||||
|
// realtime: true, //是否实时更新
|
||||||
|
// filterMode: 'filter',
|
||||||
|
// backgroundColor: '#001735',
|
||||||
|
// width: '18'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: 'inside',
|
||||||
|
// yAxisIndex: 0,
|
||||||
|
// zoomOnMouseWheel: false, //滚轮是否触发缩放
|
||||||
|
// moveOnMouseMove: true, //鼠标滚轮触发滚动
|
||||||
|
// moveOnMouseWheel: true
|
||||||
|
// }
|
||||||
|
// ]
|
||||||
|
} |
||||||
|
isEcharts: boolean = true |
||||||
|
isEchartsShow() { |
||||||
|
this.isEcharts = !this.isEcharts |
||||||
|
} |
||||||
|
startdate |
||||||
|
enddate |
||||||
|
|
||||||
|
isMisinformation: boolean = false//误报按钮的显隐
|
||||||
|
ngOnInit(): void { |
||||||
|
let loginUserInfo |
||||||
|
if (sessionStorage.getItem('isGasStation') == 'true') { |
||||||
|
loginUserInfo = JSON.parse(sessionStorage.getItem('userdataOfgasstation')) |
||||||
|
} else { |
||||||
|
loginUserInfo = JSON.parse(sessionStorage.getItem('userdata')) |
||||||
|
} |
||||||
|
|
||||||
|
if (loginUserInfo.roles.find((item) => { |
||||||
|
return item.name == 'ViolationPositiveCensorer' |
||||||
|
})) { |
||||||
|
this.isMisinformation = true |
||||||
|
} else { |
||||||
|
this.isMisinformation = false |
||||||
|
} |
||||||
|
|
||||||
|
//当前日期
|
||||||
|
let myDate: any = new Date(); |
||||||
|
let nowY = myDate.getFullYear(); |
||||||
|
let nowM = myDate.getMonth() + 1; |
||||||
|
let nowD = myDate.getDate(); |
||||||
|
this.enddate = nowY + "-" + (nowM < 10 ? "0" + nowM : nowM) + "-" + (nowD < 10 ? "0" + nowD : nowD);//当前日期
|
||||||
|
//获取三十天前日期
|
||||||
|
let lw = new Date(myDate - 1000 * 60 * 60 * 24 * 30);//最后一个数字30可改，30天的意思
|
||||||
|
let lastY = lw.getFullYear(); |
||||||
|
let lastM = lw.getMonth() + 1; |
||||||
|
let lastD = lw.getDate(); |
||||||
|
this.startdate = lastY + "-" + (lastM < 10 ? "0" + lastM : lastM) + "-" + (lastD < 10 ? "0" + lastD : lastD);//三十天之前日期
|
||||||
|
|
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
level: [null], |
||||||
|
organization: [null], |
||||||
|
type: [null], |
||||||
|
event: [null], |
||||||
|
site: [null], |
||||||
|
disposalState: [null], |
||||||
|
datePicker: [[this.startdate, this.enddate]] |
||||||
|
}); |
||||||
|
|
||||||
|
//饼图
|
||||||
|
this.myChart = echarts.init(document.getElementById('piechart')); |
||||||
|
this.myChart.setOption(this.option); |
||||||
|
//柱状折线图
|
||||||
|
this.mybarChart = echarts.init(document.getElementById('barchart')); |
||||||
|
this.mybarChart.setOption(this.baroption); |
||||||
|
|
||||||
|
this.warningType() |
||||||
|
this.tableSpin = true |
||||||
|
this.getAllOrganization() |
||||||
|
this.getAggregations() |
||||||
|
} |
||||||
|
|
||||||
|
defaultOrId: string |
||||||
|
//获取所有组织机构
|
||||||
|
nodes: any = [] |
||||||
|
getAllOrganization() { |
||||||
|
let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: OrganizationUnitId, |
||||||
|
IsContainsChildren: "true" |
||||||
|
} |
||||||
|
this.http.get('/api/services/app/Organization/GetAll', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
data.result.items.forEach(element => { |
||||||
|
if (element.id == OrganizationUnitId) { |
||||||
|
element.parentId = null |
||||||
|
} |
||||||
|
element.key = element.id |
||||||
|
element.title = element.displayName |
||||||
|
}); |
||||||
|
this.nodes = [...this.toTree.toTree(data.result.items)] |
||||||
|
this.defaultOrId = JSON.parse(sessionStorage.getItem('userdata')).organization.id |
||||||
|
this.validateForm.value.organization = this.defaultOrId |
||||||
|
this.getViolateRecordList() |
||||||
|
}) |
||||||
|
} |
||||||
|
//刷新饼图图表数据
|
||||||
|
num |
||||||
|
echartsData: any |
||||||
|
refreshPieData(data) { |
||||||
|
//饼图
|
||||||
|
let option = this.myChart.getOption(); |
||||||
|
var num = 0 |
||||||
|
data.pieTop.forEach(element => { |
||||||
|
num += element.count |
||||||
|
element.name = element.key |
||||||
|
element.value = element.count |
||||||
|
}); |
||||||
|
this.num = num |
||||||
|
option.series[0].data = data.pieTop; |
||||||
|
this.myChart.setOption(option); |
||||||
|
} |
||||||
|
//刷新柱状折线图表数据
|
||||||
|
refreshBarLineData(data, type) { |
||||||
|
console.log('统计图表数据', data) |
||||||
|
//柱状图
|
||||||
|
let option = this.mybarChart.getOption(); |
||||||
|
console.log('柱图option', option) |
||||||
|
if (type == 'month') {//近一个月柱状折线图
|
||||||
|
option = this.baroption |
||||||
|
let monthArr = [] |
||||||
|
let valuedata = [] |
||||||
|
data.timeTop.forEach(element => { |
||||||
|
monthArr.push(moment(element.key).format('MM.DD')) |
||||||
|
valuedata.push(element.count) |
||||||
|
}); |
||||||
|
option.xAxis.data = monthArr |
||||||
|
option.series[0].data = valuedata |
||||||
|
option.series[1].data = valuedata |
||||||
|
} else if (type == 'eventTop') { |
||||||
|
option = this.baroption2 |
||||||
|
let ydata = [] |
||||||
|
let valuedata = [] |
||||||
|
data.eventTop.forEach(element => { |
||||||
|
ydata.push(element.key) |
||||||
|
valuedata.push(element.count) |
||||||
|
}); |
||||||
|
option.yAxis.data = ydata |
||||||
|
option.series.data = valuedata |
||||||
|
} else if (type == 'siteTop') { |
||||||
|
option = this.baroption2 |
||||||
|
let ydata = [] |
||||||
|
let valuedata = [] |
||||||
|
data.siteTop.forEach(element => { |
||||||
|
ydata.push(element.key) |
||||||
|
valuedata.push(element.count) |
||||||
|
}); |
||||||
|
option.yAxis.data = ydata |
||||||
|
option.series.data = valuedata |
||||||
|
} |
||||||
|
this.mybarChart.setOption(option); |
||||||
|
} |
||||||
|
|
||||||
|
//获取统计信息
|
||||||
|
chartsSpin: boolean = false |
||||||
|
getAggregations() { |
||||||
|
this.chartsSpin = true |
||||||
|
let ViolationIds = [] |
||||||
|
if (this.validateForm.value.type) { |
||||||
|
this.warningTypesDetails.forEach(item => { |
||||||
|
item.id ? ViolationIds.push(item.id) : null |
||||||
|
}); |
||||||
|
} |
||||||
|
let body: any = { |
||||||
|
organizationUnitId: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
isContainsChildren: true, |
||||||
|
ViolateTime: this.validateForm.value.datePicker ? [moment(this.validateForm.value.datePicker[0]).format('yyyy-MM-DD'), moment(this.validateForm.value.datePicker[1]).format('yyyy-MM-DD')] : null |
||||||
|
} |
||||||
|
this.validateForm.value.level ? body.level = this.validateForm.value.level : null |
||||||
|
this.validateForm.value.site ? body.violateArea = this.validateForm.value.site : null |
||||||
|
ViolationIds.length != 0 ? body.violationType = ViolationIds : null |
||||||
|
this.http.post('/api/services/app/ViolateRecord/Aggregations', body).subscribe((data: any) => { |
||||||
|
this.echartsData = data.result |
||||||
|
this.chartsSpin = false |
||||||
|
this.refreshPieData(data.result) |
||||||
|
this.refreshBarLineData(this.echartsData, 'month') |
||||||
|
}) |
||||||
|
} |
||||||
|
//获得违规记录列表
|
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '50' |
||||||
|
list: any = [] |
||||||
|
totalCount: string |
||||||
|
tableSpin: boolean = false |
||||||
|
getViolateRecordList() { |
||||||
|
let ViolationIds = [] |
||||||
|
if (this.validateForm.value.event) { |
||||||
|
ViolationIds.push(this.validateForm.value.event) |
||||||
|
} |
||||||
|
if (this.validateForm.value.type && !this.validateForm.value.event) { |
||||||
|
this.warningTypesDetails.forEach(item => { |
||||||
|
item.id ? ViolationIds.push(item.id) : null |
||||||
|
}); |
||||||
|
} |
||||||
|
let disposalState |
||||||
|
if (this.validateForm.value.disposalState == '0') { |
||||||
|
disposalState = true |
||||||
|
} else if (this.validateForm.value.disposalState == '1') { |
||||||
|
disposalState = false |
||||||
|
} else { |
||||||
|
disposalState = null |
||||||
|
} |
||||||
|
let params = { |
||||||
|
Level: this.validateForm.value.level, |
||||||
|
ViolationIds: ViolationIds, |
||||||
|
ViolateArea: this.validateForm.value.site, |
||||||
|
OrganizationUnitId: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
IsContainsChildren: 'true', |
||||||
|
IsHandled: disposalState, |
||||||
|
ViolateTime: this.validateForm.value.datePicker ? [moment(this.validateForm.value.datePicker[0]).format('yyyy-MM-DD'), moment(this.validateForm.value.datePicker[1]).format('yyyy-MM-DD')] : null, |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount |
||||||
|
} |
||||||
|
this.tableSpin = true |
||||||
|
this.http.get('/api/services/app/ViolateRecord/GetAll', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
this.list = this.list.concat(data.result.items); |
||||||
|
this.list = [...this.list] |
||||||
|
// this.list = data.result.items
|
||||||
|
this.totalCount = data.result.totalCount |
||||||
|
console.log('违规记录列表', data) |
||||||
|
this.tableSpin = false |
||||||
|
|
||||||
|
console.log(this.list.length) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
isMouseEnter = false |
||||||
|
mouseEnter() { |
||||||
|
this.isMouseEnter = true |
||||||
|
} |
||||||
|
mouseleave() { |
||||||
|
this.isMouseEnter = false |
||||||
|
} |
||||||
|
|
||||||
|
ngAfterViewInit(): void { |
||||||
|
fromEvent(this.element.nativeElement.querySelector(`#tbody`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe((event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
console.log('需要加载数据了', event) |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
this.getViolateRecordList() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
getThirtyDays() { |
||||||
|
//获取当前日期
|
||||||
|
let myDate = new Date(); |
||||||
|
var nowY = myDate.getFullYear(); |
||||||
|
var nowM = myDate.getMonth() + 1; |
||||||
|
var nowD = myDate.getDate(); |
||||||
|
var enddateStr = nowY + "-" + (nowM < 10 ? "0" + nowM : nowM) + "-" + (nowD < 10 ? "0" + nowD : nowD);//当前日期
|
||||||
|
var enddate = new Date(enddateStr); |
||||||
|
|
||||||
|
|
||||||
|
//获取三十天前日期
|
||||||
|
var lw = new Date(new Date().getTime() - 1000 * 60 * 60 * 24 * 30);//最后一个数字30可改，30天的意思
|
||||||
|
var lastY = lw.getFullYear(); |
||||||
|
var lastM = lw.getMonth() + 1; |
||||||
|
var lastD = lw.getDate(); |
||||||
|
var startdateStr = lastY + "-" + (lastM < 10 ? "0" + lastM : lastM) + "-" + (lastD < 10 ? "0" + lastD : lastD);//三十天之前日期
|
||||||
|
var startDate = new Date(startdateStr); |
||||||
|
|
||||||
|
const dateList = [] |
||||||
|
while (true) { |
||||||
|
startDate.setDate(startDate.getDate() + 1) |
||||||
|
if (startDate.getTime() <= enddate.getTime()) { |
||||||
|
if (startDate.getDate() < 10) { |
||||||
|
// startDate.getFullYear() 获取年，此处没加上年份
|
||||||
|
dateList.push((startDate.getMonth() + 1) + '.0' + startDate.getDate()) |
||||||
|
} else { |
||||||
|
dateList.push((startDate.getMonth() + 1) + '.' + startDate.getDate()) |
||||||
|
} |
||||||
|
} else { |
||||||
|
break |
||||||
|
} |
||||||
|
} |
||||||
|
return dateList; |
||||||
|
} |
||||||
|
submitForm(): void { |
||||||
|
for (const i in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[i].markAsDirty(); |
||||||
|
this.validateForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getViolateRecordList() |
||||||
|
// this.getAggregations()
|
||||||
|
} |
||||||
|
resetForm(e: MouseEvent): void { |
||||||
|
e.preventDefault(); |
||||||
|
this.validateForm.reset(); |
||||||
|
for (const key in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[key].markAsPristine(); |
||||||
|
this.validateForm.controls[key].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.validateForm.patchValue({ |
||||||
|
organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id, |
||||||
|
datePicker: [this.startdate, this.enddate] |
||||||
|
}); |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getViolateRecordList() |
||||||
|
} |
||||||
|
|
||||||
|
//预警类型接口
|
||||||
|
warningTypes: any //预警接口数据
|
||||||
|
warningTypesDetails: any |
||||||
|
warningType() { |
||||||
|
this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => { |
||||||
|
this.warningTypesDetails = data.result |
||||||
|
this.warningTypes = (data.result as any).groupBy((t) => { return t.violationType }); |
||||||
|
}) |
||||||
|
} |
||||||
|
typeChange(e) { |
||||||
|
this.warningTypes.forEach(element => { |
||||||
|
if (element.key == e) { |
||||||
|
this.warningTypesDetails = element |
||||||
|
} |
||||||
|
}); |
||||||
|
this.validateForm.patchValue({ |
||||||
|
event: null, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
look(item) { |
||||||
|
console.log('点击item', item) |
||||||
|
if (item.violation.eventSystemName == '灭火器维护') { |
||||||
|
item.violatedItemSnapshotObj = JSON.parse(item.violatedItemSnapshot) |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DisposeequipmentComponent, |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 380, |
||||||
|
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 () => { |
||||||
|
if (instance.isScrap) { |
||||||
|
await new Promise(resolve => { |
||||||
|
let body = { |
||||||
|
id: item.violatedItemSnapshotObj.id, |
||||||
|
name: instance.copydata2.violatedItemSnapshotObj.name, |
||||||
|
storageLocation: instance.copydata2.violatedItemSnapshotObj.storageLocation, |
||||||
|
productionDate: moment(instance.copydata2.violatedItemSnapshotObj.productionDate).format('yyyy-MM-DD'), |
||||||
|
maintenanceDate: moment(instance.copydata2.violatedItemSnapshotObj.maintenanceDate).format('yyyy-MM-DD'), |
||||||
|
validityEndTime: moment(instance.copydata2.violatedItemSnapshotObj.validityEndTime).format('yyyy-MM-DD'), |
||||||
|
isScrapped: true, |
||||||
|
organizationUnitId: item.violatedItemSnapshotObj.organizationUnitId |
||||||
|
} |
||||||
|
this.http.put('/api/services/app/FireEquipment/Update', body).subscribe((data: any) => { |
||||||
|
let body = { |
||||||
|
id: item.id, |
||||||
|
handleRecord: '报废成功！' |
||||||
|
} |
||||||
|
this.http.post('/api/services/app/ViolateRecord/HandleViolateRecord', body).subscribe(data => { |
||||||
|
resolve(data) |
||||||
|
this.message.create('success', '报废成功！'); |
||||||
|
item.handleTime = new Date() |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
}) |
||||||
|
|
||||||
|
} else { |
||||||
|
if (instance.validateForm.valid) { |
||||||
|
await new Promise(resolve => { |
||||||
|
let body = { |
||||||
|
id: item.violatedItemSnapshotObj.id, |
||||||
|
name: instance.validateForm.value.name, |
||||||
|
storageLocation: instance.validateForm.value.storageLocation, |
||||||
|
productionDate: moment(instance.validateForm.value.productionDate).format('yyyy-MM-DD'), |
||||||
|
maintenanceDate: moment(instance.validateForm.value.maintenanceDate).format('yyyy-MM-DD'), |
||||||
|
validityEndTime: moment(instance.validateForm.value.validityEndTime).format('yyyy-MM-DD'), |
||||||
|
organizationUnitId: item.violatedItemSnapshotObj.organizationUnitId |
||||||
|
} |
||||||
|
this.http.put('/api/services/app/FireEquipment/Update', body).subscribe((data: any) => { |
||||||
|
// item.violatedItemSnapshotObj = data.result
|
||||||
|
let body = { |
||||||
|
id: item.id, |
||||||
|
handleRecord: '维保成功！' |
||||||
|
} |
||||||
|
this.http.post('/api/services/app/ViolateRecord/HandleViolateRecord', body).subscribe(data => { |
||||||
|
resolve(data) |
||||||
|
this.message.create('success', '维保成功！'); |
||||||
|
item.handleTime = new Date() |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '请填写完整！'); |
||||||
|
return false |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
} else { |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: GetOutOfLineDetailsComponent, |
||||||
|
nzWrapClassName: "vertical-center-modal", |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: (document.documentElement.clientHeight < 650 || document.documentElement.clientWidth < 1400) ? 1000 : 1200, |
||||||
|
nzBodyStyle: { |
||||||
|
'border': '1px solid #6d9cc7', |
||||||
|
'border-radius': '0px', |
||||||
|
'padding': '0px', |
||||||
|
'box-shadow': '0 0 8px 0 #fff', |
||||||
|
'background': '#000D21', |
||||||
|
}, |
||||||
|
nzComponentParams: { |
||||||
|
data: item |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzOnOk: async () => { |
||||||
|
console.log('误报处理') |
||||||
|
for (let index = 0; index < this.list.length; index++) { |
||||||
|
const element = this.list[index]; |
||||||
|
if (element.id == item.id) { |
||||||
|
this.list.splice(index, 1) |
||||||
|
this.totalCount = String(Number(this.totalCount) - 1) |
||||||
|
this.SkipCount = String(Number(this.SkipCount) - 1) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
selectedType = '分布' |
||||||
|
selectedRankingType = null |
||||||
|
echartClick(type) { |
||||||
|
this.selectedType = type |
||||||
|
this.mybarChart.dispose() |
||||||
|
this.mybarChart = echarts.init(document.getElementById('barchart')); |
||||||
|
// if (type == '排名') {
|
||||||
|
|
||||||
|
// console.log(this.selectedRankingType)
|
||||||
|
// if (this.selectedRankingType == '站点排名') {
|
||||||
|
// this.refreshBarLineData(this.echartsData, 'siteTop')
|
||||||
|
// }
|
||||||
|
// if (this.selectedRankingType == '事件排名') {
|
||||||
|
// this.refreshBarLineData(this.echartsData, 'eventTop')
|
||||||
|
// }
|
||||||
|
// } else {
|
||||||
|
|
||||||
|
// }
|
||||||
|
this.selectedRankingType = null |
||||||
|
this.refreshBarLineData(this.echartsData, 'month') |
||||||
|
|
||||||
|
} |
||||||
|
echartClick2(type) { |
||||||
|
this.mybarChart.dispose() |
||||||
|
this.mybarChart = echarts.init(document.getElementById('barchart')); |
||||||
|
this.selectedType = null |
||||||
|
this.selectedRankingType = type |
||||||
|
if (this.selectedRankingType == '站点排名') { |
||||||
|
this.refreshBarLineData(this.echartsData, 'siteTop') |
||||||
|
} |
||||||
|
if (this.selectedRankingType == '事件排名') { |
||||||
|
this.refreshBarLineData(this.echartsData, 'eventTop') |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
//跳转卸油统计页面
|
||||||
|
goOilList() { |
||||||
|
|
||||||
|
if (this.router.url.indexOf('petrolStation') != -1) { |
||||||
|
this.router.navigate(['/records/petrolStation/oliunloadinglist']) |
||||||
|
} else { |
||||||
|
this.router.navigate(['/records/oliunloadinglist']) |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
goWarningList() { |
||||||
|
if (this.router.url.indexOf('petrolStation') != -1) { |
||||||
|
this.router.navigate(['/records/petrolStation/warningstatisticslist']) |
||||||
|
} else { |
||||||
|
this.router.navigate(['/records/warningstatisticslist']) |
||||||
|
} |
||||||
|
} |
||||||
|
gorecordList() { |
||||||
|
if (this.router.url.indexOf('petrolStation') != -1) { |
||||||
|
this.router.navigate(['/records/petrolStation']) |
||||||
|
} else { |
||||||
|
this.router.navigate(['/records']) |
||||||
|
} |
||||||
|
} |
||||||
|
dispose(item) { |
||||||
|
console.log(item) |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DispositionComponent, |
||||||
|
nzWrapClassName: "vertical-center-modal", |
||||||
|
nzViewContainerRef: this.viewContainerRef, |
||||||
|
nzWidth: 380, |
||||||
|
nzBodyStyle: { |
||||||
|
'border': '1px solid #91CCFF', |
||||||
|
'border-radius': '0px', |
||||||
|
'padding': '7px', |
||||||
|
'box-shadow': '0 0 8px 0 #fff', |
||||||
|
'background-image': 'linear-gradient(#003665, #000f25)' |
||||||
|
}, |
||||||
|
nzComponentParams: {}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
nzOnOk: async () => { |
||||||
|
if (instance.validateForm.valid) { |
||||||
|
await new Promise(resolve => { |
||||||
|
let body = { |
||||||
|
id: item.id, |
||||||
|
handleRecord: instance.validateForm.value.content |
||||||
|
} |
||||||
|
this.http.post('/api/services/app/ViolateRecord/HandleViolateRecord', body).subscribe(data => { |
||||||
|
resolve(data) |
||||||
|
this.message.create('success', '处置成功！'); |
||||||
|
item.handleTime = new Date() |
||||||
|
return true |
||||||
|
}) |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.message.create('warning', '请填写完整！'); |
||||||
|
return false |
||||||
|
} |
||||||
|
}, |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,63 @@ |
|||||||
|
<div class="box"> |
||||||
|
<div class="search"> |
||||||
|
<div class="legendbox"> |
||||||
|
</div> |
||||||
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-input-group> |
||||||
|
<input required nz-input type="text" formControlName="name" placeholder="请输入加油站名称" /> |
||||||
|
</nz-input-group> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="submit" class="submit"><i nz-icon [nzType]="'search'"></i>查询</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="button" class="reset" (click)="resetForm($event)"><i nz-icon |
||||||
|
[nzType]="'sync'"></i>重置</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
<div class="tablebox" id="tablebox"> |
||||||
|
<nz-table [nzLoading]="tableSpin" [nzPageSize]='999' #headerTable [nzData]="list" [nzShowPagination]="false" |
||||||
|
[nzScroll]="{ y:tableScrollHeight }" [nzNoResult]='null' nzTableLayout="fixed"> |
||||||
|
<thead> |
||||||
|
<tr> |
||||||
|
<th style="text-align: center">序号</th> |
||||||
|
<th *ngFor="let item of headerTable.data[0]"> |
||||||
|
{{item.name}} |
||||||
|
</th> |
||||||
|
|
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td style="text-align: center">{{key + 1}}</td> |
||||||
|
|
||||||
|
<td *ngFor="let i of item"> |
||||||
|
<ng-container *ngIf="i.value; else elseTemplate"> |
||||||
|
<ng-container *ngIf="i.value.validityType; else elseTemplate"> |
||||||
|
<span> |
||||||
|
{{i.value.validityType}} |
||||||
|
</span> |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
{{i.value}} |
||||||
|
</ng-template> |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
/ |
||||||
|
</ng-template> |
||||||
|
|
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,79 @@ |
|||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding-left: 38px; |
||||||
|
padding-right: 35px; |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
margin: 12px 0; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.legendbox { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
color: #FFFFFF; |
||||||
|
flex: 1; |
||||||
|
|
||||||
|
.legendItem { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-right: 12px; |
||||||
|
|
||||||
|
div { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
margin-right: 3px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
form { |
||||||
|
flex: 1; |
||||||
|
height: 32px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
input { |
||||||
|
background: none; |
||||||
|
border: 1px solid #91ccff; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams { |
||||||
|
width: 35%; |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
margin-left: 16px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.green { |
||||||
|
color: #4BFFD4; |
||||||
|
} |
||||||
|
|
||||||
|
.yellow { |
||||||
|
color: #FFBD4B; |
||||||
|
} |
||||||
|
|
||||||
|
.red { |
||||||
|
color: #FF4B65; |
||||||
|
} |
||||||
@ -0,0 +1,184 @@ |
|||||||
|
import { Component, OnInit, ViewChild, ElementRef, ViewContainerRef } from '@angular/core'; |
||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { TreeService } from 'src/app/service/tree.service'; |
||||||
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||||
|
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown'; |
||||||
|
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree'; |
||||||
|
import { Router } from '@angular/router'; |
||||||
|
import { NavChangeService } from 'src/app/service/navChange.service'; |
||||||
|
import { fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
import 'linqjs'; |
||||||
|
import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-file-license-list', |
||||||
|
templateUrl: './file-license-list.component.html', |
||||||
|
styleUrls: ['./file-license-list.component.scss'] |
||||||
|
}) |
||||||
|
export class FileLicenseListComponent implements OnInit { |
||||||
|
|
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { } |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.tableScrollHeight = '100px' |
||||||
|
console.log('tableScrollHeight', this.tableScrollHeight) |
||||||
|
// 页面监听
|
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}); |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
name: [null] |
||||||
|
}); |
||||||
|
|
||||||
|
this.tableSpin = true |
||||||
|
} |
||||||
|
ngAfterViewInit(): void { |
||||||
|
|
||||||
|
|
||||||
|
fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
console.log('需要加载数据了', event) |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
await this.getStationLicenses() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
submitForm(): void { |
||||||
|
for (const i in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[i].markAsDirty(); |
||||||
|
this.validateForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
resetForm(e: MouseEvent): void { |
||||||
|
e.preventDefault(); |
||||||
|
this.validateForm.reset(); |
||||||
|
for (const key in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[key].markAsPristine(); |
||||||
|
this.validateForm.controls[key].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
|
||||||
|
tableSpin: boolean |
||||||
|
totalCount: any //总数
|
||||||
|
//获取点击组织机构的所有加油站
|
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '100' |
||||||
|
|
||||||
|
orId |
||||||
|
list: any = [] |
||||||
|
async getStationLicenses() { |
||||||
|
let params = { |
||||||
|
StationName: this.validateForm.value.name, |
||||||
|
OrganizationUnitId: String(sessionStorage.getItem('planAdminOrid')), |
||||||
|
IsContainsChildren: 'true', |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
// Sorting: ' BuildingBasicInfo.Id asc'
|
||||||
|
} |
||||||
|
this.tableSpin = true |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.http.get('/api/services/app/StationFileLicense/GetStationLicenses', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
this.totalCount = data.result.totalCount |
||||||
|
let arr = [] |
||||||
|
data.result.data.forEach(element => { |
||||||
|
let keyArr = Object.keys(element); |
||||||
|
let valueArr = Object.values(element); |
||||||
|
let newElement = (keyArr as any).zip(valueArr, (a, b) => { return { name: a, value: b } }); |
||||||
|
|
||||||
|
//修改排头
|
||||||
|
let newArr = [] |
||||||
|
for (let index = 0; index < newElement.length; index++) { |
||||||
|
const item = newElement[index]; |
||||||
|
if (item.name == '省公司') { |
||||||
|
newArr[0] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
if (item.name == '区域') { |
||||||
|
newArr[1] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
if (item.name == '油站名称') { |
||||||
|
newArr[2] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
} |
||||||
|
let atLastArr = newArr.concat(newElement); |
||||||
|
arr.push(atLastArr) |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
|
this.list = this.list.concat(arr); |
||||||
|
this.list = [...this.list] |
||||||
|
console.log('证照表格', this.list) |
||||||
|
this.tableSpin = false |
||||||
|
|
||||||
|
setTimeout(() => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}, 0); |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
resolve(data) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//父组件调用子组件方法
|
||||||
|
public onChildMethod() { |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
lookDetails(i) { |
||||||
|
// console.log(i)
|
||||||
|
// let params = {
|
||||||
|
// Id: i.licenseId
|
||||||
|
// }
|
||||||
|
// this.http.get('/api/services/app/StationValidityLicense/Get', { params: params }).subscribe((data: any) => {
|
||||||
|
// console.log('证照信息', data)
|
||||||
|
// const modal = this.modal.create({
|
||||||
|
// nzContent: DetailsUpdateCategoryComponent,
|
||||||
|
// 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: data.result
|
||||||
|
// },
|
||||||
|
// nzFooter: null,
|
||||||
|
// nzClosable: false,
|
||||||
|
// nzOnOk: async () => {
|
||||||
|
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// const instance = modal.getContentComponent();
|
||||||
|
// modal.afterClose.subscribe(result => { });
|
||||||
|
// })
|
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,78 @@ |
|||||||
|
<div class="box"> |
||||||
|
<div class="search"> |
||||||
|
<div class="legendbox"></div> |
||||||
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-input-group> |
||||||
|
<input required nz-input type="text" formControlName="name" placeholder="请输入加油站名称" /> |
||||||
|
</nz-input-group> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="submit" class="submit"><i nz-icon [nzType]="'search'"></i>查询</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="button" class="reset" (click)="resetForm($event)"><i nz-icon |
||||||
|
[nzType]="'sync'"></i>重置</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
<div class="tablebox" id="tablebox"> |
||||||
|
<nz-table [nzLoading]="tableSpin" [nzPageSize]='999' #headerTable [nzData]="list" [nzShowPagination]="false" |
||||||
|
[nzScroll]="{ y:tableScrollHeight }" [nzNoResult]='null' nzTableLayout="fixed"> |
||||||
|
<thead> |
||||||
|
<tr> |
||||||
|
<th [nzWidth]="'20%'"> |
||||||
|
<div |
||||||
|
style="width: 20px;height: 20px;display: inline-block;margin-left: 20px;margin-right: 6px;"> |
||||||
|
|
||||||
|
</div>加油站名称 |
||||||
|
</th> |
||||||
|
<th>区域</th> |
||||||
|
<th>所属公司</th> |
||||||
|
<th style="text-align: center;">联系人</th> |
||||||
|
<th style="text-align: center;">联系电话</th> |
||||||
|
<th style="text-align: center;">油站等级</th> |
||||||
|
<th style="text-align: center;">经营品类</th> |
||||||
|
<th [nzWidth]="'6%'" style="text-align: center;">油机数量</th> |
||||||
|
<th [nzWidth]="'6%'" style="text-align: center;">车道数量</th> |
||||||
|
<th [nzWidth]="'8%'" style="text-align: center;">油罐容积</th> |
||||||
|
<th [nzWidth]="'5%'">操作</th> |
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td nzEllipsis [title]="item.stationName"> |
||||||
|
<div |
||||||
|
style="width: 20px;height: 20px;display: inline-block;margin-left: 20px;margin-right: 6px;"> |
||||||
|
<img src="../../../assets/images/3d.png" alt="" *ngIf="item.hasBuildingInfo"> |
||||||
|
</div> |
||||||
|
{{item.stationName}} |
||||||
|
</td> |
||||||
|
<td nzEllipsis [title]="item.locationName">{{item.locationName}}</td> |
||||||
|
<td nzEllipsis [title]="item.companyName">{{item.companyName}}</td> |
||||||
|
<td nzEllipsis [title]="item.leaderName" style="text-align: center;">{{item.leaderName}}</td> |
||||||
|
<td nzEllipsis [title]="item.leaderContact" style="text-align: center;">{{item.leaderContact}}</td> |
||||||
|
<td nzEllipsis [title]="item.stationLevel" style="text-align: center;">{{item.stationLevel}}</td> |
||||||
|
<td nzEllipsis [title]="item.sellVariety" style="text-align: center;">{{item.sellVariety}}</td> |
||||||
|
<td style="text-align: center;">{{item.gasStationCount}}</td> |
||||||
|
<td style="text-align: center;">{{item.laneCount}}</td> |
||||||
|
<td style="text-align: center;"> |
||||||
|
<span>{{item.tankVolume}}</span> |
||||||
|
<span>{{item.tankVolume ? 'm³' : null}}</span> |
||||||
|
</td> |
||||||
|
<td> |
||||||
|
<span class="look" (click)="look(item)" style="cursor:pointer;color: #36A2FF">查看</span> |
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,66 @@ |
|||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding-left: 38px; |
||||||
|
padding-right: 35px; |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
margin: 12px 0; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.legendbox { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
color: #FFFFFF; |
||||||
|
flex: 1; |
||||||
|
|
||||||
|
.legendItem { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-right: 12px; |
||||||
|
|
||||||
|
div { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
margin-right: 3px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
form { |
||||||
|
flex: 1; |
||||||
|
height: 32px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
input { |
||||||
|
background: none; |
||||||
|
border: 1px solid #91ccff; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams { |
||||||
|
width: 35%; |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
margin-left: 16px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
@ -0,0 +1,123 @@ |
|||||||
|
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; |
||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { TreeService } from 'src/app/service/tree.service'; |
||||||
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||||
|
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown'; |
||||||
|
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree'; |
||||||
|
import { Router } from '@angular/router'; |
||||||
|
import { NavChangeService } from 'src/app/service/navChange.service'; |
||||||
|
import { fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-oil-station-list', |
||||||
|
templateUrl: './oil-station-list.component.html', |
||||||
|
styleUrls: ['./oil-station-list.component.scss'] |
||||||
|
}) |
||||||
|
export class OilStationListComponent implements OnInit { |
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { } |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
|
||||||
|
console.log('tableScrollHeight', this.tableScrollHeight) |
||||||
|
// 页面监听
|
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
}); |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
name: [null] |
||||||
|
}); |
||||||
|
|
||||||
|
this.tableSpin = true |
||||||
|
} |
||||||
|
ngAfterViewInit(): void { |
||||||
|
fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
console.log('需要加载数据了', event) |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
await this.getGasStation() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
submitForm(): void { |
||||||
|
for (const i in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[i].markAsDirty(); |
||||||
|
this.validateForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getGasStation() |
||||||
|
} |
||||||
|
resetForm(e: MouseEvent): void { |
||||||
|
e.preventDefault(); |
||||||
|
this.validateForm.reset(); |
||||||
|
for (const key in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[key].markAsPristine(); |
||||||
|
this.validateForm.controls[key].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getGasStation() |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
look(item) { |
||||||
|
let gastionobj = { |
||||||
|
organization: { |
||||||
|
displayName: item.stationName, |
||||||
|
isGasStation: true, |
||||||
|
id: item.organizationUnitId |
||||||
|
} |
||||||
|
} |
||||||
|
sessionStorage.setItem('userdataOfgasstation', JSON.stringify(gastionobj)) |
||||||
|
this.router.navigate(['/todaywarning/petrolStation']) |
||||||
|
let obj = { |
||||||
|
name: 'oilstation' |
||||||
|
} |
||||||
|
this.navChangeService.sendMessage(obj);//发布一条消息
|
||||||
|
} |
||||||
|
|
||||||
|
tableSpin: boolean |
||||||
|
totalCount: any //总数
|
||||||
|
//获取点击组织机构的所有加油站
|
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '100' |
||||||
|
|
||||||
|
orId |
||||||
|
list: any = [] |
||||||
|
async getGasStation() { |
||||||
|
let params = { |
||||||
|
StationName: this.validateForm.value.name, |
||||||
|
OrganizationUnitId: String(sessionStorage.getItem('planAdminOrid')), |
||||||
|
IsContainsChildren: 'true', |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
Sorting: ' BuildingBasicInfo.Id asc' |
||||||
|
} |
||||||
|
this.tableSpin = true |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.http.get('/api/services/app/GasStation/GetAll', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
this.totalCount = data.result.totalCount |
||||||
|
this.list = this.list.concat(data.result.items); |
||||||
|
this.list = [...this.list] |
||||||
|
this.tableSpin = false |
||||||
|
resolve(data) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//父组件调用子组件方法
|
||||||
|
public onChildMethod() { |
||||||
|
this.getGasStation() |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,73 @@ |
|||||||
|
<div class="box"> |
||||||
|
<div class="search"> |
||||||
|
<div class="legendbox"> |
||||||
|
<div class="legendItem"> |
||||||
|
<div style="background: #4BFFD4;box-shadow: 0px 2px 6px 1px #4BFFD4;"></div>办理提醒 |
||||||
|
</div> |
||||||
|
<div class="legendItem"> |
||||||
|
<div style="background: #FFBD4B;box-shadow: 0px 2px 6px 1px #FFBD4B;"></div>临期提醒 |
||||||
|
</div> |
||||||
|
<div class="legendItem"> |
||||||
|
<div style="background: #FF4B65;box-shadow: 0px 2px 6px 1px #FF4B65;"></div>逾期提醒 |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()"> |
||||||
|
<nz-form-item class="searchParams"> |
||||||
|
<nz-form-control> |
||||||
|
<nz-input-group> |
||||||
|
<input required nz-input type="text" formControlName="name" placeholder="请输入加油站名称" /> |
||||||
|
</nz-input-group> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="submit" class="submit"><i nz-icon [nzType]="'search'"></i>查询</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
<nz-form-item class="btn"> |
||||||
|
<nz-form-control> |
||||||
|
<button nz-button type="button" class="reset" (click)="resetForm($event)"><i nz-icon |
||||||
|
[nzType]="'sync'"></i>重置</button> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
<div class="tablebox" id="tablebox"> |
||||||
|
<nz-table [nzLoading]="tableSpin" [nzPageSize]='999' #headerTable [nzData]="list" [nzShowPagination]="false" |
||||||
|
[nzScroll]="{ y:tableScrollHeight }" [nzNoResult]='null' nzTableLayout="fixed"> |
||||||
|
<thead> |
||||||
|
<tr> |
||||||
|
<th style="text-align: center">序号</th> |
||||||
|
<th *ngFor="let item of headerTable.data[0]"> |
||||||
|
{{item.name}} |
||||||
|
</th> |
||||||
|
|
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody id="table"> |
||||||
|
<tr *ngFor="let item of headerTable.data;let key = index"> |
||||||
|
<td style="text-align: center">{{key + 1}}</td> |
||||||
|
|
||||||
|
<td *ngFor="let i of item"> |
||||||
|
<ng-container *ngIf="i.value; else elseTemplate"> |
||||||
|
<ng-container *ngIf="i.value.endDate; else elseTemplate"> |
||||||
|
<span (click)="lookDetails(i.value)" style="cursor: pointer;" [ngClass]="{'green': i.value.licenseViolationType == 1,'yellow': i.value.licenseViolationType == 2,'red': i.value.licenseViolationType == 3}"> |
||||||
|
{{i.value.endDate | date:"yyyy-MM-dd"}} |
||||||
|
</span> |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
{{i.value}} |
||||||
|
</ng-template> |
||||||
|
|
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
/ |
||||||
|
</ng-template> |
||||||
|
|
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,79 @@ |
|||||||
|
.search { |
||||||
|
box-sizing: border-box; |
||||||
|
padding-left: 38px; |
||||||
|
padding-right: 35px; |
||||||
|
width: 100%; |
||||||
|
height: 32px; |
||||||
|
margin: 12px 0; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.legendbox { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
color: #FFFFFF; |
||||||
|
flex: 1; |
||||||
|
|
||||||
|
.legendItem { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-right: 12px; |
||||||
|
|
||||||
|
div { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
margin-right: 3px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
form { |
||||||
|
flex: 1; |
||||||
|
height: 32px; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
|
||||||
|
input { |
||||||
|
background: none; |
||||||
|
border: 1px solid #91ccff; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
.searchParams { |
||||||
|
width: 35%; |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
margin-left: 16px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.tablebox { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.green { |
||||||
|
color: #4BFFD4; |
||||||
|
} |
||||||
|
|
||||||
|
.yellow { |
||||||
|
color: #FFBD4B; |
||||||
|
} |
||||||
|
|
||||||
|
.red { |
||||||
|
color: #FF4B65; |
||||||
|
} |
||||||
@ -0,0 +1,185 @@ |
|||||||
|
import { Component, OnInit, ViewChild, ElementRef, ViewContainerRef } from '@angular/core'; |
||||||
|
import { HttpClient } from '@angular/common/http'; |
||||||
|
import { TreeService } from 'src/app/service/tree.service'; |
||||||
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||||
|
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown'; |
||||||
|
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree'; |
||||||
|
import { Router } from '@angular/router'; |
||||||
|
import { NavChangeService } from 'src/app/service/navChange.service'; |
||||||
|
import { fromEvent } from 'rxjs'; |
||||||
|
import { debounceTime } from 'rxjs/operators'; |
||||||
|
import 'linqjs'; |
||||||
|
import { DetailsUpdateCategoryComponent } from '../../license/update-category/details-update-category/details-update-category.component'; |
||||||
|
import { NzModalService } from 'ng-zorro-antd/modal'; |
||||||
|
@Component({ |
||||||
|
selector: 'app-update-license-list', |
||||||
|
templateUrl: './update-license-list.component.html', |
||||||
|
styleUrls: ['./update-license-list.component.scss'] |
||||||
|
}) |
||||||
|
export class UpdateLicenseListComponent implements OnInit { |
||||||
|
|
||||||
|
validateForm!: FormGroup; |
||||||
|
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef, private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { } |
||||||
|
|
||||||
|
tableScrollHeight |
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
|
||||||
|
|
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
|
||||||
|
console.log('tableScrollHeight', this.tableScrollHeight) |
||||||
|
// 页面监听
|
||||||
|
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => { |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 42) + 'px' |
||||||
|
}); |
||||||
|
this.validateForm = this.fb.group({ |
||||||
|
name: [null] |
||||||
|
}); |
||||||
|
|
||||||
|
this.tableSpin = true |
||||||
|
} |
||||||
|
ngAfterViewInit(): void { |
||||||
|
|
||||||
|
|
||||||
|
fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件
|
||||||
|
if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) { |
||||||
|
if (this.totalCount > this.list.length) { |
||||||
|
console.log('需要加载数据了', event) |
||||||
|
this.SkipCount = String(Number(this.SkipCount) + 50) |
||||||
|
await this.getStationLicenses() |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
submitForm(): void { |
||||||
|
for (const i in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[i].markAsDirty(); |
||||||
|
this.validateForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
resetForm(e: MouseEvent): void { |
||||||
|
e.preventDefault(); |
||||||
|
this.validateForm.reset(); |
||||||
|
for (const key in this.validateForm.controls) { |
||||||
|
this.validateForm.controls[key].markAsPristine(); |
||||||
|
this.validateForm.controls[key].updateValueAndValidity(); |
||||||
|
} |
||||||
|
this.list = [] |
||||||
|
this.SkipCount = '0' |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
|
||||||
|
tableSpin: boolean |
||||||
|
totalCount: any //总数
|
||||||
|
//获取点击组织机构的所有加油站
|
||||||
|
SkipCount: string = '0' |
||||||
|
MaxResultCount: string = '100' |
||||||
|
|
||||||
|
orId |
||||||
|
list: any = [] |
||||||
|
async getStationLicenses() { |
||||||
|
let params = { |
||||||
|
StationName: this.validateForm.value.name, |
||||||
|
OrganizationUnitId: String(sessionStorage.getItem('planAdminOrid')), |
||||||
|
IsContainsChildren: 'true', |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
// Sorting: ' BuildingBasicInfo.Id asc'
|
||||||
|
} |
||||||
|
this.tableSpin = true |
||||||
|
await new Promise((resolve, reject) => { |
||||||
|
this.http.get('/api/services/app/StationValidityLicense/GetStationLicenses', { |
||||||
|
params: params |
||||||
|
}).subscribe((data: any) => { |
||||||
|
this.totalCount = data.result.totalCount |
||||||
|
let arr = [] |
||||||
|
data.result.data.forEach(element => { |
||||||
|
let keyArr = Object.keys(element); |
||||||
|
let valueArr = Object.values(element); |
||||||
|
let newElement = (keyArr as any).zip(valueArr, (a, b) => { return { name: a, value: b } }); |
||||||
|
|
||||||
|
//修改排头
|
||||||
|
let newArr = [] |
||||||
|
for (let index = 0; index < newElement.length; index++) { |
||||||
|
const item = newElement[index]; |
||||||
|
if (item.name == '省公司') { |
||||||
|
newArr[0] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
if (item.name == '区域') { |
||||||
|
newArr[1] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
if (item.name == '油站名称') { |
||||||
|
newArr[2] = item |
||||||
|
newElement.splice(index--, 1) |
||||||
|
} |
||||||
|
} |
||||||
|
let atLastArr = newArr.concat(newElement); |
||||||
|
arr.push(atLastArr) |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
|
this.list = this.list.concat(arr); |
||||||
|
this.list = [...this.list] |
||||||
|
console.log('证照表格', this.list) |
||||||
|
this.tableSpin = false |
||||||
|
|
||||||
|
setTimeout(() => { |
||||||
|
let tableHeader = this.element.nativeElement.querySelector(`.ant-table-header`).clientHeight |
||||||
|
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - tableHeader - 30) + 'px' |
||||||
|
}, 0); |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
resolve(data) |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
//父组件调用子组件方法
|
||||||
|
public onChildMethod() { |
||||||
|
this.getStationLicenses() |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
lookDetails(i) { |
||||||
|
console.log(i) |
||||||
|
let params = { |
||||||
|
Id: i.licenseId |
||||||
|
} |
||||||
|
this.http.get('/api/services/app/StationValidityLicense/Get', { params: params }).subscribe((data:any) => { |
||||||
|
console.log('证照信息', data) |
||||||
|
const modal = this.modal.create({ |
||||||
|
nzContent: DetailsUpdateCategoryComponent, |
||||||
|
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: data.result |
||||||
|
}, |
||||||
|
nzFooter: null, |
||||||
|
nzClosable: false, |
||||||
|
nzOnOk: async () => { |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
const instance = modal.getContentComponent(); |
||||||
|
modal.afterClose.subscribe(result => { }); |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue