shaojiahao
/
examSystem-Anxin
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[新增]四周毗邻tree渲染

master
邵佳豪 4 years ago
parent
84adb48f5b
commit
fde7d60aab
6 changed files with 183 additions and 26 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      src/app/examiner/create-test-score/create-test-score.component.html
  2. 148
      src/app/examiner/create-test-score/create-test-score.component.ts
  3. 29
      src/app/examiner/create-test-score/lookTreeNode.html
  4. 16
      src/app/examiner/create-test-score/lookTreeNode.scss
  5. 4
      src/app/examiner/examiner.module.ts
  6. 2
      src/styles.scss

10
src/app/examiner/create-test-score/create-test-score.component.html
Unescape View File

@ -74,7 +74,7 @@
</nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
<div class="treeNodeTemplate">
<label title="{{node.origin.name}}" class="overflowText textNode">{{node.origin.name}}</label>
<label class="overflowText textNode">{{node.origin.name}}</label>
<div class="scoreDiv" *ngIf="node.level == '0'">
<span class="colorspan lookitem" (click)="lookTreeNode(node)">查看</span>
</div>
@ -85,7 +85,7 @@
</mat-expansion-panel>
</mat-accordion>
<!-- 四周毗邻 -->
<!-- <mat-accordion>
<mat-accordion *ngIf="unit.aroundNodes.length != 0">
<mat-expansion-panel style="box-shadow: 0 0 black;" expanded>
<mat-expansion-panel-header collapsedHeight ='40px' expandedHeight='40px' style="position: relative;padding-left:20px;background: #F5FDFE;">
<mat-panel-title>
@ -116,16 +116,16 @@
</nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
<div class="treeNodeTemplate">
<label title="{{node.origin.name}}" class="overflowText textNode">{{node.origin.name}}</label>
<label class="overflowText textNode">{{node.origin.title ? node.origin.title : node.origin.name}}</label>
<div class="scoreDiv" *ngIf="node.level == '0'">
<span class="colorspan lookitem">查看</span>
<span class="colorspan lookitem" (click)="lookTreeNode(node)">查看</span>
</div>
</div>
</ng-template>
</div>
</mat-expansion-panel>
</mat-accordion> -->
</mat-accordion>
</div>
</div>
<div class="fightdeploydiv" *ngIf="selectedTab == 2">

148
src/app/examiner/create-test-score/create-test-score.component.ts
Unescape View File

@ -17,8 +17,8 @@ export class CreateTestScoreComponent implements OnInit {
this.selectedTab = index
}
ngOnInit(): void {
console.log(12345,)
this.getUnitData()
this.getAround()
}
//模拟单位数据
@ -91,7 +91,7 @@ export class CreateTestScoreComponent implements OnInit {
element.basicInfoItemScore = 0
this.http.get(`/api/Companies/${element.id}`).subscribe((data:any)=>{
console.log('单位信息',index,data)
// console.log('单位信息',index,data)
let unitData = {
name: '单位信息',
type:'基本信息',
@ -137,7 +137,7 @@ export class CreateTestScoreComponent implements OnInit {
buildingType:data[i].buildingTypes[0].id
}
}).subscribe((buildingsData:any)=>{
console.log(1234,buildingsData)
// console.log(1234,buildingsData)
buildingsData.name = data[i].name
buildingsData.buildingType = data[i].buildingTypes[0].name
@ -173,7 +173,6 @@ export class CreateTestScoreComponent implements OnInit {
})
y.tabledata = dest
tabledata = dest
console.log('pppp',y)
y.tabledata[0].data.forEach((x,key) => {
if(x.propertyValue){
x.key = (Math.random()*10000000).toString(16).substr(0,4)+(new Date()).getTime()+Math.random().toString().substr(2,5)
@ -192,36 +191,122 @@ export class CreateTestScoreComponent implements OnInit {
}
})
}
element.basicInfoNodes.push({
name:y.name != '基本信息' ? buildingsData.name + '-' + y.name : buildingsData.name ,
type:'基本信息',
expanded: false,
key:(Math.random()*10000000).toString(16).substr(0,4)+(new Date()).getTime()+Math.random().toString().substr(2,5),
children:propertyInfosArr,
tabledata:tabledata ? tabledata : null
})
element.basicInfoNodes = [...element.basicInfoNodes]
if(propertyInfosArr.length != 0){
element.basicInfoNodes.push({
name:y.name != '基本信息' ? buildingsData.name + '-' + y.name : buildingsData.name ,
type:'基本信息',
expanded: false,
key:(Math.random()*10000000).toString(16).substr(0,4)+(new Date()).getTime()+Math.random().toString().substr(2,5),
children:propertyInfosArr,
tabledata:tabledata ? tabledata : null
})
element.basicInfoNodes = [...element.basicInfoNodes]
}
})
resolve(i)
})
})
}
console.log(987,this.unitId)
// console.log(987,this.unitId)
})
})
})
}
//获取四周毗邻数据
getAround(){
this.unitId.forEach((element,index) => {
element.aroundScore = 0
element.aroundItemScore = 0
element.aroundNodes = []
//获得当前单位的单位毗邻
let id = {companyId:element.id}
this.http.get('/api/CompanyAdjoins',{params:id}).subscribe((data:any)=>{
// console.log(index+'四周毗邻',data)
data.forEach(item => {
item.direction == 0 ? item.title = '东方向' : null
item.direction == 1 ? item.title = '西方向' : null
item.direction == 2 ? item.title = '南方向' : null
item.direction == 3 ? item.title = '北方向' : null
item.direction == 4 ? item.title = '东南方向' : null
item.direction == 5 ? item.title = '西南方向' : null
item.direction == 6 ? item.title = '东北方向' : null
item.direction == 7 ? item.title = '西北方向' : null
item.isLeaf = true
})
//如果存在单位毗邻
if(data.length != 0){
this.unitId[index].aroundNodes.push({
name: '单位毗邻',
key: (Math.random()*10000000).toString(16).substr(0,4)+(new Date()).getTime()+Math.random().toString().substr(2,5),
expanded: false,
type:'四周毗邻',
children: data
})
element.aroundNodes = [...element.aroundNodes]
}
})
//获得当前单位的建筑毗邻
this.http.get('/api/Buildings',{params:id}).subscribe((data:any)=>{
if (data.length) {
getAllArchitecture(data)
}
})
let that = this
async function getAllArchitecture(buildongsdata){
for (let i = 0, length = buildongsdata.length; i < length; i++){
let id = {buildingId:buildongsdata[i].id}
let result = await new Promise((resolve, reject) => {
that.http.get('/api/BuildingAdjoins',{params:id}).subscribe((data:any)=>{
data.forEach(item => {
item.direction == 0 ? item.title = '东方向' : null
item.direction == 1 ? item.title = '西方向' : null
item.direction == 2 ? item.title = '南方向' : null
item.direction == 3 ? item.title = '北方向' : null
item.direction == 4 ? item.title = '东南方向' : null
item.direction == 5 ? item.title = '西南方向' : null
item.direction == 6 ? item.title = '东北方向' : null
item.direction == 7 ? item.title = '西北方向' : null
item.isLeaf = true
})
if(data.length != 0){
that.unitId[index].aroundNodes.push({
name: buildongsdata[i].name,
key: (Math.random()*10000000).toString(16).substr(0,4)+(new Date()).getTime()+Math.random().toString().substr(2,5),
expanded: false,
type:'四周毗邻',
children: data
})
element.aroundNodes = [...element.aroundNodes]
}
resolve('1')
})
})
}
}
})
}
//查看树节点
lookTreeNode(node){
console.log(node.origin)
// console.log(node.origin)
const dialogRef = this.dialog.open(LookTreeNodeDialog, {
// width: '380px',
// height: '136px',
id:'lookTreeNode',
data: node.origin
});
dialogRef.afterClosed().subscribe(result => {
console.log('The dialog was closed');
});
}
@ -283,7 +368,7 @@ export class CreateTestScoreComponent implements OnInit {
i.checked ? selectedNum.push(i) : ''
})
})
console.log(7894,selectedNum)
// console.log(7894,selectedNum)
if(selectedNum.length != 0 ){
this.unitId[key].aroundScore ? this.unitId[key].aroundItemScore = this.unitId[key].aroundScore / selectedNum.length : null
}else{
@ -429,3 +514,30 @@ export class AddPlanTwoDialog {
}
}
//查看答案
@Component({
selector: 'lookTreeNode-dialog',
templateUrl: 'lookTreeNode.html',
styleUrls: ['lookTreeNode.scss']
})
export class LookTreeNodeDialog {
constructor(public dialog: MatDialog,public dialogRef: MatDialogRef<LookTreeNodeDialog>,@Inject(MAT_DIALOG_DATA) public data: any) {}
ngOnInit(): void {
console.log(this.data)
}
onNoClick(): void {
this.dialogRef.close();
}
//取消
close(){
this.dialogRef.close();
}
}

29
src/app/examiner/create-test-score/lookTreeNode.html
Unescape View File

@ -0,0 +1,29 @@
<div>
<!-- 非表格类 -->
<table *ngIf="!data.tabledata && data.type != '四周毗邻'">
<tr>
<td *ngFor="let item of data.children">{{item.name}}</td>
</tr>
<tr>
<td *ngFor="let item of data.children">{{item.value || item.propertyValue}}</td>
</tr>
</table>
<!-- 表格类 -->
<table *ngIf="data.tabledata">
<tr>
<td *ngFor="let item of data.tabledata">{{item.propertyName}}</td>
</tr>
<tr *ngFor="let item of data.tabledata[0].data;let key = index">
<td *ngFor="let i of data.tabledata">{{i.data[key]. propertyValue}}</td>
</tr>
</table>
<table *ngIf="data.type == '四周毗邻'">
<tr>
<td *ngFor="let item of data.children">{{item.title}}</td>
</tr>
<tr>
<td *ngFor="let item of data.children">{{item.name}}</td>
</tr>
</table>
</div>

16
src/app/examiner/create-test-score/lookTreeNode.scss
Unescape View File

@ -0,0 +1,16 @@
table,table tr th, table tr td { border: 1px solid #EEF1F5; }
table { text-align: center; border-collapse: collapse; padding:2px;}
table{
width: 100%;
font-size: 15px;
tr{
height: 35px;
td{
box-sizing: border-box;
padding: 6px;
}
}
tr:nth-child(1){
background: #F5FDFE;
}
}

4
src/app/examiner/examiner.module.ts
Unescape View File

@ -46,7 +46,7 @@ import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatPaginatorIntl } from '@angular/material/paginator';
import { myPaginator } from '../ui/my-paginator';
import { AddPlanDialog, AddPlanTwoDialog, CreateTestScoreComponent } from './create-test-score/create-test-score.component';
import { AddPlanDialog, AddPlanTwoDialog, CreateTestScoreComponent, LookTreeNodeDialog } from './create-test-score/create-test-score.component';
import { NavigationModule } from '../navigation/navigation.module';
import { NzTreeModule } from 'ng-zorro-antd/tree';
import { ExaminerIndexComponent } from './examiner-index/examiner-index.component';
@ -54,7 +54,7 @@ import { ExaminerIndexComponent } from './examiner-index/examiner-index.componen
@NgModule({
declarations: [CreateTestScoreComponent,AddPlanDialog,AddPlanTwoDialog],
declarations: [CreateTestScoreComponent,AddPlanDialog,AddPlanTwoDialog,LookTreeNodeDialog],
imports: [
CommonModule,
examinerRoutingModule,

2
src/styles.scss
Unescape View File

@ -96,7 +96,7 @@ table td.mat-footer-cell:last-of-type{
}
}
//弹出框样式取消padding
#addPlanTwo{
#addPlanTwo,#lookTreeNode{
padding: 0;
.mat-elevation-z8{
box-shadow:none

Write Preview
Loading…
Cancel
Save