Browse Source

[完成]数字油站档案类证照页面;审批之通知时间页面

dev
邵佳豪 3 years ago
parent
commit
9af2b86480
  1. 14
      src/app/pages/audit/audit-inform-time/audit-inform-time.component.html
  2. 41
      src/app/pages/audit/audit-inform-time/audit-inform-time.component.ts
  3. 4
      src/app/pages/audit/audit-nav/audit-nav.component.html
  4. 6
      src/app/pages/audit/audit-nav/audit-nav.component.ts
  5. 64
      src/app/pages/plan-admin/file-license-list/file-license-list.component.html
  6. 79
      src/app/pages/plan-admin/file-license-list/file-license-list.component.scss
  7. 173
      src/app/pages/plan-admin/file-license-list/file-license-list.component.ts
  8. 1
      src/app/pages/plan-admin/oil-station-list/oil-station-list.component.html
  9. 35
      src/app/pages/plan-admin/oil-station-list/oil-station-list.component.scss
  10. 18
      src/app/pages/plan-admin/plan-admin.component.ts
  11. 35
      src/app/pages/plan-admin/update-license-list/update-license-list.component.ts
  12. 1
      src/theme.less

14
src/app/pages/audit/audit-inform-time/audit-inform-time.component.html

@ -23,14 +23,14 @@
<tbody id="table">
<tr *ngFor="let item of headerTable.data;let key = index">
<td>
营业执照
{{item.licenseName}}
</td>
<td>90</td>
<td>90</td>
<td>90</td>
<td>90</td>
<td>时间</td>
<td>审批状态</td>
<td>{{item.handleRemindDaysDefault}}</td>
<td>{{item.handleRemindDays}}</td>
<td>{{item.closingRemindDaysDefault}}</td>
<td>{{item.closingRemindDays}}</td>
<td>{{item.commitTime ? (item.commitTime | date:"yyyy-MM-dd HH:mm:ss") : '/'}}</td>
<td>{{item.auditStatus | auditStatus}}</td>
<td class="operation">
<span class="blueColor" (click)="edit(item)">编辑</span>
<span class="blueColor" (click)="details(item)">审核详情</span>

41
src/app/pages/audit/audit-inform-time/audit-inform-time.component.ts

@ -1,4 +1,5 @@
import { Component, OnInit, ViewContainerRef } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Component, ElementRef, OnInit, ViewContainerRef } from '@angular/core';
import { NzModalService } from 'ng-zorro-antd/modal';
import { Observable, fromEvent } from 'rxjs';
import { debounceTime } from 'rxjs/operators';
@ -13,19 +14,49 @@ import { EditInformTimeComponent } from './edit-inform-time/edit-inform-time.com
})
export class AuditInformTimeComponent implements OnInit {
constructor(private modal: NzModalService, private viewContainerRef: ViewContainerRef) { }
constructor(private http: HttpClient, private element: ElementRef, private modal: NzModalService, private viewContainerRef: ViewContainerRef) { }
tableSpin = false
list = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
list = []
tableScrollHeight
ngOnInit(): void {
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 85) + 'px'
// 页面监听
this.tableScrollHeight = '0px'
fromEvent(window, 'resize').pipe(debounceTime(100)).subscribe((event) => {
this.tableScrollHeight = (document.getElementById('tablebox').clientHeight - 85) + 'px'
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 = this.list.concat(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) {

4
src/app/pages/audit/audit-nav/audit-nav.component.html

@ -6,6 +6,8 @@
<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>
</div>
</div>
</div>
@ -13,6 +15,6 @@
<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 == navList[2]"></app-audit-inform-time>
<app-audit-inform-time *ngIf="selectedItem == '通知时间'"></app-audit-inform-time>
</div>
</div>

6
src/app/pages/audit/audit-nav/audit-nav.component.ts

@ -10,12 +10,16 @@ export class AuditNavComponent implements OnInit {
constructor() { }
navList = ['审批', '历史纪录', '通知时间']
navList = ['审批', '历史纪录']
selectedItem = '审批'
selectNav(item) {
this.selectedItem = item
}
isLevel
ngOnInit(): void {
this.isLevel = JSON.parse(sessionStorage.getItem('userdata')).organization.level
}
}

64
src/app/pages/plan-admin/file-license-list/file-license-list.component.html

@ -1 +1,63 @@
<p>file-license-list works!</p>
<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>

79
src/app/pages/plan-admin/file-license-list/file-license-list.component.scss

@ -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;
}

173
src/app/pages/plan-admin/file-license-list/file-license-list.component.ts

@ -1,4 +1,16 @@
import { Component, OnInit } from '@angular/core';
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',
@ -7,9 +19,166 @@ import { Component, OnInit } from '@angular/core';
})
export class FileLicenseListComponent implements OnInit {
constructor() { }
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 => { });
// })
}
}

1
src/app/pages/plan-admin/oil-station-list/oil-station-list.component.html

@ -1,5 +1,6 @@
<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>

35
src/app/pages/plan-admin/oil-station-list/oil-station-list.component.scss

@ -1,13 +1,35 @@
.search {
box-sizing: border-box;
padding-left: 22px;
padding-right: 33px;
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 {
width: 100%;
flex: 1;
height: 32px;
display: flex;
justify-content: flex-end;
@ -19,21 +41,22 @@
}
.searchParams {
width: 22%;
width: 35%;
}
.btn {
width: 5%;
margin-left: 16px;
}
}
}
.box{
.box {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.tablebox {
flex: 1;
display: flex;

18
src/app/pages/plan-admin/plan-admin.component.ts

@ -36,7 +36,6 @@ export class PlanAdminComponent implements OnInit {
this.selectedTab = index
if (this.selectedTab == 0) {
console.log('选择tab')
setTimeout(() => {
this.oilStationListComponent.list = []
this.oilStationListComponent.SkipCount = '0'
@ -44,13 +43,19 @@ export class PlanAdminComponent implements OnInit {
}, 0);
}
if (this.selectedTab == 1) {
console.log('选择tab')
setTimeout(() => {
this.updateLicenseListComponent.list = []
this.updateLicenseListComponent.SkipCount = '0'
this.updateLicenseListComponent.onChildMethod()
}, 0);
}
if (this.selectedTab == 2) {
setTimeout(() => {
this.fileLicenseListComponent.list = []
this.fileLicenseListComponent.SkipCount = '0'
this.fileLicenseListComponent.onChildMethod()
}, 0);
}
}
@ -102,7 +107,6 @@ export class PlanAdminComponent implements OnInit {
this.activatedNode = data.node!;
sessionStorage.setItem('planAdminOrid', data.node.origin.id)
if (this.selectedTab == 0) {
console.log('选择tab')
setTimeout(() => {
this.oilStationListComponent.list = []
this.oilStationListComponent.SkipCount = '0'
@ -110,13 +114,19 @@ export class PlanAdminComponent implements OnInit {
}, 0);
}
if (this.selectedTab == 1) {
console.log('选择tab')
setTimeout(() => {
this.updateLicenseListComponent.list = []
this.updateLicenseListComponent.SkipCount = '0'
this.updateLicenseListComponent.onChildMethod()
}, 0);
}
if (this.selectedTab == 2) {
setTimeout(() => {
this.fileLicenseListComponent.list = []
this.fileLicenseListComponent.SkipCount = '0'
this.fileLicenseListComponent.onChildMethod()
}, 0);
}
}

35
src/app/pages/plan-admin/update-license-list/update-license-list.component.ts

@ -74,12 +74,6 @@ export class UpdateLicenseListComponent implements OnInit {
this.getStationLicenses()
}
look(item) {
}
tableSpin: boolean
totalCount: any //总数
//获取点击组织机构的所有加油站
@ -108,11 +102,30 @@ export class UpdateLicenseListComponent implements OnInit {
let keyArr = Object.keys(element);
let valueArr = Object.values(element);
let newElement = (keyArr as any).zip(valueArr, (a, b) => { return { name: a, value: b } });
arr.push(newElement)
//修改排头
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)
@ -141,7 +154,7 @@ export class UpdateLicenseListComponent implements OnInit {
let params = {
Id: i.licenseId
}
this.http.get('/api/services/app/StationValidityLicense/Get', { params: params }).subscribe(data => {
this.http.get('/api/services/app/StationValidityLicense/Get', { params: params }).subscribe((data:any) => {
console.log('证照信息', data)
const modal = this.modal.create({
nzContent: DetailsUpdateCategoryComponent,
@ -155,7 +168,7 @@ export class UpdateLicenseListComponent implements OnInit {
'background-image': 'linear-gradient(#003665, #000f25)'
},
nzComponentParams: {
data: data
data: data.result
},
nzFooter: null,
nzClosable: false,

1
src/theme.less

@ -418,6 +418,7 @@
border-bottom: none;
padding: 0;
color: #23D9FF;
line-height: 28px;
}
.ant-table-tbody>tr {

Loading…
Cancel
Save