15 changed files with 396 additions and 85 deletions
@ -1,38 +1,29 @@ |
|||||||
import { Injectable } from '@angular/core'; |
import { Injectable } from "@angular/core"; |
||||||
|
|
||||||
@Injectable() |
@Injectable() |
||||||
export class TreeService { |
export class TreeService { |
||||||
|
toTree(olddata) { |
||||||
|
let newdata = []; |
||||||
toTree(olddata){ |
function getparentNode(parentId) { |
||||||
let newdata = [] |
return olddata.find((item) => { |
||||||
function getparentNode(parentId){ |
return item.id == parentId; |
||||||
return olddata.find((item)=>{ |
}); |
||||||
return item.id == parentId |
|
||||||
}) |
|
||||||
} |
|
||||||
olddata.forEach(item => { |
|
||||||
var parentNode = getparentNode(item.parentId); |
|
||||||
if(parentNode){ |
|
||||||
if(!parentNode.children){ |
|
||||||
parentNode.children = [] |
|
||||||
} |
|
||||||
|
|
||||||
// if (parentNode.children.length == 0) {
|
|
||||||
// item.isTop = true;
|
|
||||||
// } else {
|
|
||||||
// item.isTop = false;
|
|
||||||
// parentNode.children[parentNode.children.length -1].isBottom = false;
|
|
||||||
// }
|
|
||||||
// item.isBottom = true;
|
|
||||||
|
|
||||||
parentNode.children.push(item) |
|
||||||
}else{ |
|
||||||
if(!item.parentId){//如果parentId为null
|
|
||||||
newdata.push(item) |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
return newdata; |
|
||||||
} |
} |
||||||
} |
olddata.forEach((item) => { |
||||||
|
var parentNode = getparentNode(item.parentId); |
||||||
|
if (parentNode) { |
||||||
|
parentNode.isLeaf = false; |
||||||
|
if (!parentNode.children) { |
||||||
|
parentNode.children = []; |
||||||
|
} |
||||||
|
parentNode.children.push(item); |
||||||
|
} else { |
||||||
|
if (!item.parentId) { |
||||||
|
//如果parentId为null
|
||||||
|
newdata.push(item); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
return newdata; |
||||||
|
} |
||||||
|
} |
||||||
|
@ -0,0 +1,58 @@ |
|||||||
|
<div class="box" id="algorithmConfig"> |
||||||
|
<div class="orbox"> |
||||||
|
<div class="topbox"> |
||||||
|
<span class="name">组织机构</span> |
||||||
|
<nz-input-group nzPrefixIcon="search"> |
||||||
|
<input type="text" nz-input placeholder="请输入机构名称" [(ngModel)]="searchValue" /> |
||||||
|
</nz-input-group> |
||||||
|
</div> |
||||||
|
<div class="treebox"> |
||||||
|
<nz-tree [nzSearchValue]="searchValue" #nzTreeComponent [nzData]="nodes" [nzExpandAll]="nzExpandAll" |
||||||
|
[nzExpandedKeys]="nzExpandedKeys" [nzSelectedKeys]='nzSelectedKeys' (nzClick)="nzClick($event)" |
||||||
|
[nzHideUnMatched]="true"> |
||||||
|
</nz-tree> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div class="contentbox"> |
||||||
|
<div> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div class="tableBox"> |
||||||
|
<nz-table #basicTable [nzData]="listOfData" [nzShowPagination]='false' [nzPageSize]='999' |
||||||
|
[nzLoading]="isLoading"> |
||||||
|
<thead> |
||||||
|
<tr> |
||||||
|
<th *ngFor="let item of thList">{{item}}</th> |
||||||
|
</tr> |
||||||
|
</thead> |
||||||
|
<tbody> |
||||||
|
<tr *ngFor="let item of basicTable.data;let key = idnex"> |
||||||
|
<td>{{item.stationName || '/'}}</td> |
||||||
|
<td>{{item.locationName || '/'}}</td> |
||||||
|
<td>{{item.companyName || '/'}}</td> |
||||||
|
<td *ngFor="let i of item.stationViolations" class="dataItem"> |
||||||
|
<div class="hover"> |
||||||
|
<div class="on" (click)="change(i,false)"> |
||||||
|
<img src="../../../assets/images/icon/on.png" alt=""> |
||||||
|
</div> |
||||||
|
<div class="off" (click)="change(i,true)"> |
||||||
|
<img src="../../../assets/images/icon/off.png" alt=""> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="item"> |
||||||
|
<ng-container *ngIf="i.disabled; else elseTemplate"> |
||||||
|
<img src="../../../assets/images/icon/off.png" alt=""> |
||||||
|
</ng-container> |
||||||
|
<ng-template #elseTemplate> |
||||||
|
<img src="../../../assets/images/icon/on.png" alt=""> |
||||||
|
</ng-template> |
||||||
|
</div> |
||||||
|
|
||||||
|
</td> |
||||||
|
</tr> |
||||||
|
</tbody> |
||||||
|
</nz-table> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
@ -0,0 +1,99 @@ |
|||||||
|
.box { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: flex; |
||||||
|
box-sizing: border-box; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.orbox { |
||||||
|
width: 250px; |
||||||
|
height: 100%; |
||||||
|
overflow-y: auto; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
background: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
.topbox { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
box-sizing: border-box; |
||||||
|
margin-top: 12px; |
||||||
|
padding: 0px 12px; |
||||||
|
|
||||||
|
span { |
||||||
|
color: #000D21; |
||||||
|
margin-right: 16px; |
||||||
|
font-family: sybold; |
||||||
|
} |
||||||
|
|
||||||
|
nz-input-group { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.treebox { |
||||||
|
margin-top: 12px; |
||||||
|
flex: 1; |
||||||
|
overflow-y: auto; |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 0 6px; |
||||||
|
padding-bottom: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.contentbox { |
||||||
|
flex: 1; |
||||||
|
background: #fff; |
||||||
|
margin-left: 16px; |
||||||
|
overflow-y: auto; |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 12px; |
||||||
|
|
||||||
|
.tableBox { |
||||||
|
.dataItem { |
||||||
|
|
||||||
|
.hover, |
||||||
|
.item { |
||||||
|
height: 48px; |
||||||
|
line-height: 48px; |
||||||
|
} |
||||||
|
|
||||||
|
.hover { |
||||||
|
display: none; |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
|
||||||
|
.dataItem:hover { |
||||||
|
.hover { |
||||||
|
display: block; |
||||||
|
width: 72px; |
||||||
|
height: 48px; |
||||||
|
border-radius: 12px; |
||||||
|
overflow: hidden; |
||||||
|
div{ |
||||||
|
display: inline-block; |
||||||
|
width: 50%; |
||||||
|
} |
||||||
|
.on { |
||||||
|
background: #1e1e1e; |
||||||
|
} |
||||||
|
|
||||||
|
.off { |
||||||
|
background: #434446; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.item { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
@ -0,0 +1,155 @@ |
|||||||
|
import { HttpClient } from "@angular/common/http"; |
||||||
|
import { Component, OnInit } from "@angular/core"; |
||||||
|
import { NzMessageService } from "ng-zorro-antd/message"; |
||||||
|
import { NzFormatEmitEvent } from "ng-zorro-antd/tree"; |
||||||
|
import { TreeService } from "src/app/service/tree.service"; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: "app-algorithm-config", |
||||||
|
templateUrl: "./algorithm-config.component.html", |
||||||
|
styleUrls: ["./algorithm-config.component.scss"], |
||||||
|
}) |
||||||
|
export class AlgorithmConfigComponent implements OnInit { |
||||||
|
constructor( |
||||||
|
private http: HttpClient, |
||||||
|
private toTree: TreeService, |
||||||
|
private message: NzMessageService |
||||||
|
) {} |
||||||
|
|
||||||
|
OrganizationUnitId: string; |
||||||
|
ngOnInit(): void { |
||||||
|
this.OrganizationUnitId = |
||||||
|
sessionStorage.getItem("isGasStation") == "true" |
||||||
|
? JSON.parse(sessionStorage.getItem("userdataOfgasstation")) |
||||||
|
.organization.id |
||||||
|
: JSON.parse(sessionStorage.getItem("userdata")).organization.id; |
||||||
|
|
||||||
|
this.getAllOrganization(); |
||||||
|
} |
||||||
|
|
||||||
|
//获取所有组织机构
|
||||||
|
searchValue = ""; |
||||||
|
nzExpandAll = false; |
||||||
|
totalCount: string; |
||||||
|
organizationList; //组织机构列表
|
||||||
|
getAllOrganization() { |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: this.OrganizationUnitId, |
||||||
|
IsContainsChildren: "true", |
||||||
|
}; |
||||||
|
this.http |
||||||
|
.get("/api/services/app/Organization/GetAll", { |
||||||
|
params: params, |
||||||
|
}) |
||||||
|
.subscribe((data: any) => { |
||||||
|
data.result.items = data.result.items.filter((item, i) => { |
||||||
|
return !item.isGasStation; |
||||||
|
}); |
||||||
|
this.organizationList = data.result.items; |
||||||
|
this.getStationsNum(data.result.items); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
//获得组织机构下有多少油站
|
||||||
|
stationsList; |
||||||
|
nodes: any[] = []; |
||||||
|
nzExpandedKeys = []; |
||||||
|
nzSelectedKeys: any[] = []; |
||||||
|
getStationsNum(e) { |
||||||
|
this.http |
||||||
|
.get( |
||||||
|
"/api/services/app/GasStation/GetCountsByOrganizations?IsContainsChildren=true" |
||||||
|
) |
||||||
|
.subscribe((data: any) => { |
||||||
|
this.stationsList = data.result; |
||||||
|
const arrs = e.map((item) => { |
||||||
|
const data = this.stationsList.find( |
||||||
|
(i) => item.id == i.organizationId |
||||||
|
); |
||||||
|
return { |
||||||
|
...item, |
||||||
|
products: data ? data : false, |
||||||
|
}; |
||||||
|
}); |
||||||
|
for (let index = 0; index < arrs.length; index++) { |
||||||
|
arrs[index].isLeaf = true; |
||||||
|
if (arrs[index].id == this.OrganizationUnitId) { |
||||||
|
arrs[index].parentId = null; |
||||||
|
} |
||||||
|
arrs[index].title = |
||||||
|
arrs[index].displayName + |
||||||
|
" " + |
||||||
|
`(${ |
||||||
|
arrs[index].products ? arrs[index].products.stationsCount : 0 |
||||||
|
})`;
|
||||||
|
arrs[index].key = arrs[index].id; |
||||||
|
} |
||||||
|
this.nodes = [...this.toTree.toTree(arrs)]; |
||||||
|
this.nzExpandedKeys = [this.OrganizationUnitId]; |
||||||
|
this.nzSelectedKeys = [this.OrganizationUnitId]; |
||||||
|
this.selectedOrId = this.OrganizationUnitId; |
||||||
|
this.getStationViolationConfigList(); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
selectedOrId: any; |
||||||
|
nzClick(event: NzFormatEmitEvent): void { |
||||||
|
console.log(event.node.origin); |
||||||
|
this.selectedOrId = event.node.origin.id; |
||||||
|
this.getStationViolationConfigList(); |
||||||
|
} |
||||||
|
|
||||||
|
SkipCount = 0; |
||||||
|
MaxResultCount = 100; |
||||||
|
isLoading = false; |
||||||
|
listOfData: any[] = []; |
||||||
|
thList = []; |
||||||
|
getStationViolationConfigList() { |
||||||
|
let params = { |
||||||
|
OrganizationUnitId: this.selectedOrId, |
||||||
|
IsContainsChildren: true, |
||||||
|
SkipCount: this.SkipCount, |
||||||
|
MaxResultCount: this.MaxResultCount, |
||||||
|
}; |
||||||
|
this.isLoading = true; |
||||||
|
this.http |
||||||
|
.get("/api/services/app/Violation/GetStationViolationConfigList", { |
||||||
|
params: params, |
||||||
|
}) |
||||||
|
.subscribe({ |
||||||
|
next: (data: any) => { |
||||||
|
this.isLoading = false; |
||||||
|
this.listOfData = data.result; |
||||||
|
|
||||||
|
if (this.listOfData && this.listOfData.length !== 0) { |
||||||
|
let arr1 = ["油站名称", "区域名称", "公司名称"]; |
||||||
|
let arr2 = []; |
||||||
|
this.listOfData[0].stationViolations.forEach((item) => { |
||||||
|
arr2.push(item.violation.eventSystemName); |
||||||
|
}); |
||||||
|
this.thList = arr1.concat(arr2); |
||||||
|
} |
||||||
|
|
||||||
|
console.log("台账列表", data.result); |
||||||
|
}, |
||||||
|
error: (err) => {}, |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
change(item, type) { |
||||||
|
this.isLoading = true; |
||||||
|
let body = { |
||||||
|
stationId: item.stationId, |
||||||
|
violationId: item.violation.id, |
||||||
|
disabled: type, |
||||||
|
}; |
||||||
|
|
||||||
|
this.http |
||||||
|
.post("/api/services/app/Violation/UpdateStationViolation", body) |
||||||
|
.subscribe((data) => { |
||||||
|
this.isLoading = false; |
||||||
|
this.message.create("success", "修改成功"); |
||||||
|
item.disabled = type |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
@ -1,28 +1,30 @@ |
|||||||
import { Routes, RouterModule } from '@angular/router'; |
import { Routes, RouterModule } from "@angular/router"; |
||||||
import { NgModule } from '@angular/core'; |
import { NgModule } from "@angular/core"; |
||||||
|
|
||||||
import { AuthGuard } from '../auth.guard' |
import { AuthGuard } from "../auth.guard"; |
||||||
import { RoleComponent } from './role/role.component'; |
import { RoleComponent } from "./role/role.component"; |
||||||
import { OrganizationComponent } from './organization/organization.component'; |
import { OrganizationComponent } from "./organization/organization.component"; |
||||||
import { UserComponent } from './user/user.component'; |
import { UserComponent } from "./user/user.component"; |
||||||
import { AnalysisOfTheHostComponent } from './analysis-of-the-host/analysis-of-the-host.component'; |
import { AnalysisOfTheHostComponent } from "./analysis-of-the-host/analysis-of-the-host.component"; |
||||||
import { PushComponent } from './push/push.component'; |
import { PushComponent } from "./push/push.component"; |
||||||
import { UpdateOfLicenseComponent } from './update-of-license/update-of-license.component'; |
import { UpdateOfLicenseComponent } from "./update-of-license/update-of-license.component"; |
||||||
import { FileOfLicenseComponent } from './file-of-license/file-of-license.component'; |
import { FileOfLicenseComponent } from "./file-of-license/file-of-license.component"; |
||||||
import { MenuComponent } from './menu/menu.component' |
import { MenuComponent } from "./menu/menu.component"; |
||||||
|
import { AlgorithmConfigComponent } from "./algorithm-config/algorithm-config.component"; |
||||||
const routes: Routes = [ |
const routes: Routes = [ |
||||||
{ path: 'organization', component: OrganizationComponent }, |
{ path: "organization", component: OrganizationComponent }, |
||||||
{ path: 'user', component: UserComponent }, |
{ path: "user", component: UserComponent }, |
||||||
{ path: 'role', component: RoleComponent }, |
{ path: "role", component: RoleComponent }, |
||||||
{ path: 'host', component: AnalysisOfTheHostComponent }, |
{ path: "host", component: AnalysisOfTheHostComponent }, |
||||||
{ path: 'push', component: PushComponent }, |
{ path: "push", component: PushComponent }, |
||||||
{ path: 'fileOfLicense', component: FileOfLicenseComponent }, |
{ path: "fileOfLicense", component: FileOfLicenseComponent }, |
||||||
{ path: 'updateOfLicense', component: UpdateOfLicenseComponent }, |
{ path: "updateOfLicense", component: UpdateOfLicenseComponent }, |
||||||
{ path: 'menu', component: MenuComponent } |
{ path: "menu", component: MenuComponent }, |
||||||
|
{ path: "algorithm", component: AlgorithmConfigComponent }, |
||||||
]; |
]; |
||||||
|
|
||||||
@NgModule({ |
@NgModule({ |
||||||
imports: [RouterModule.forChild(routes)], |
imports: [RouterModule.forChild(routes)], |
||||||
exports: [RouterModule] |
exports: [RouterModule], |
||||||
}) |
}) |
||||||
export class SystemRoutingModule { } |
export class SystemRoutingModule {} |
||||||
|
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.1 KiB |
Loading…
Reference in new issue