7 changed files with 204 additions and 11 deletions
@ -0,0 +1,33 @@
|
||||
<div style="min-width: 240px;"> |
||||
<div style="text-align: center;font-weight: 550;">消防设施考题设定</div> |
||||
<div style="max-height: 300px;overflow-y: auto; margin: 25px 0;"> |
||||
<!-- 消防列表树 --> |
||||
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" cdkDropList [cdkDropListData]="dataSource"> |
||||
|
||||
<mat-tree-node cdkDrag cdkDragDisabled="false" [ngClass]="{'isLookPattern': !node.isLookPattern}" *matTreeNodeDef="let node;" matTreeNodePadding cdkTreeNodePaddingIndent='26' class="treeNode"> |
||||
<button mat-icon-button disabled></button> |
||||
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}"> |
||||
{{node.name}} |
||||
</span> |
||||
<span *ngIf="node.isTemplate">({{node.children.length}})</span> |
||||
<mat-checkbox style="margin-left: auto;" color=primary></mat-checkbox> |
||||
</mat-tree-node> |
||||
|
||||
<mat-tree-node cdkDrag cdkDragDisabled="false" [ngClass]="{'isLookPattern': !node.isLookPattern}" *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding class="treeNode" > |
||||
<button mat-icon-button matTreeNodeToggle [attr.aria-label]="'toggle ' + node.name"> |
||||
<mat-icon class="mat-icon-rtl-mirror"> |
||||
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}} |
||||
</mat-icon> |
||||
</button> |
||||
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}"> |
||||
{{node.name}} |
||||
</span> |
||||
<span *ngIf="node.isTemplate && node.isNewElement">({{node.children.length}})</span> |
||||
<mat-checkbox style="margin-left: auto;" color=primary></mat-checkbox> |
||||
</mat-tree-node> |
||||
|
||||
</mat-tree> |
||||
<!-- 消防列表树 --> |
||||
</div> |
||||
<div style="text-align: center;"><button mat-stroked-button style="border: none;background-color: #FF8678;color: #fff;" mat-dialog-close>退出</button></div> |
||||
</div> |
||||
@ -0,0 +1,93 @@
|
||||
import { Component, OnInit, Inject } from '@angular/core'; |
||||
import { HttpClient, HttpHeaders } from '@angular/common/http'; |
||||
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
||||
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
||||
import {CanvasShareDataService,DisposalNodeData} from '../../canvas-share-data.service' //引入服务
|
||||
import { FlatTreeControl } from '@angular/cdk/tree'; |
||||
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree'; |
||||
|
||||
@Component({ |
||||
selector: 'dialog-examination-questions', |
||||
templateUrl: './examinationQuestions.html', |
||||
styleUrls: ['./collection-tools.component.scss',] |
||||
}) |
||||
export class examinationQuestions { |
||||
|
||||
constructor(private http:HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<any>, |
||||
@Inject(MAT_DIALOG_DATA) public data) {} |
||||
// tree配置
|
||||
private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数
|
||||
return { |
||||
expandable: !!node.children && node.children.length > 0, |
||||
name: node.name || node.Name, |
||||
level: level, |
||||
id: node.id || node.Id, |
||||
children:node.children, |
||||
isTemplate:node.isTemplate, |
||||
isNewElement:node.isNewElement, |
||||
isLook:node.isLook, |
||||
isLookPattern:node.isLookPattern || null |
||||
}; |
||||
} |
||||
treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable); |
||||
treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children); |
||||
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); |
||||
hasChild = (_: number, node: any) => node.expandable; |
||||
|
||||
ngOnInit(): void { |
||||
this.dataSource.data = this.data.treeData |
||||
this.treeControl.expandAll() |
||||
} |
||||
|
||||
} |
||||
|
||||
@Component({ |
||||
selector: 'dialog-upload-questions', |
||||
templateUrl: './uploadQuestions.html', |
||||
styleUrls: ['./collection-tools.component.scss',] |
||||
}) |
||||
export class uploadQuestions { |
||||
|
||||
constructor(private http:HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<any>, |
||||
@Inject(MAT_DIALOG_DATA) public data) {} |
||||
// tree配置
|
||||
private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数
|
||||
return { |
||||
expandable: !!node.children && node.children.length > 0, |
||||
name: node.name || node.Name, |
||||
level: level, |
||||
id: node.id || node.Id, |
||||
children:node.children, |
||||
isTemplate:node.isTemplate, |
||||
isNewElement:node.isNewElement, |
||||
isLook:node.isLook, |
||||
isLookPattern:node.isLookPattern || null |
||||
}; |
||||
} |
||||
treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable); |
||||
treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children); |
||||
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); |
||||
hasChild = (_: number, node: any) => node.expandable; |
||||
|
||||
ngOnInit(): void { |
||||
this.dataSource.data = this.data.treeData |
||||
this.treeControl.expandAll() |
||||
} |
||||
|
||||
//上传
|
||||
submit () { |
||||
if (this.data.question.grade && this.data.question.keynote) { |
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('上传成功','确定',config); |
||||
this.dialogRef.close() |
||||
} else { |
||||
const config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('请填写必填项','确定',config); |
||||
} |
||||
} |
||||
|
||||
} |
||||
@ -1,5 +1,5 @@
|
||||
<div mat-dialog-title>处置节点保存</div> |
||||
<div style="text-align: center; margin-bottom: 25px; font-weight: 550;">处置节点保存</div> |
||||
<div style="display: flex;"> |
||||
<button mat-stroked-button style="margin-right: 5px;" (click)="saveType('new')">新建节点并保存</button> |
||||
<button mat-stroked-button (click)="saveType('old')">保存到已有节点</button> |
||||
<button mat-stroked-button style="margin-right: 15px; color: #fff; background-color: #07CDCF; border: none;" (click)="saveType('new')">新建节点并保存</button> |
||||
<button mat-stroked-button style="margin-left: 15px; color: #fff; background-color: #FF8678; border: none;" (click)="saveType('old')">保存到已有节点</button> |
||||
</div> |
||||
@ -0,0 +1,45 @@
|
||||
<div style="min-width: 260px;"> |
||||
<div style="text-align: center;font-weight: 550;">上传</div> |
||||
<div style="padding-left: 10px; font-size: 14px; font-weight: 550;margin: 5px 0;">设置分数</div> |
||||
<div style="margin-bottom: 25px;"> |
||||
<input type="text" style="width: 100%;border-radius: 5px;height: 26px;background-color: #dfe0e0;" placeholder="请填写考试分数" [(ngModel)]="data.question.grade"> |
||||
</div> |
||||
<div style="padding-left: 10px; font-size: 14px; font-weight: 550;margin: 5px 0;">考试要点</div> |
||||
<div style="margin-bottom: 25px;"> |
||||
<textarea style="width: 100%;background-color: #dfe0e0;border: none;outline: none;height: 50px;border-radius: 5px;resize: none;" placeholder="请填写考试要点" [(ngModel)]="data.question.keynote"></textarea> |
||||
</div> |
||||
<div style="padding-left: 10px; font-size: 14px; font-weight: 550;margin: 5px 0;">考核消防设施</div> |
||||
<div style="max-height: 200px;overflow-y: auto;margin-bottom: 25px;"> |
||||
<!-- 消防列表树 --> |
||||
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" cdkDropList [cdkDropListData]="dataSource"> |
||||
|
||||
<mat-tree-node cdkDrag cdkDragDisabled="false" [ngClass]="{'isLookPattern': !node.isLookPattern}" *matTreeNodeDef="let node;" matTreeNodePadding cdkTreeNodePaddingIndent='26' class="treeNode"> |
||||
<button mat-icon-button disabled></button> |
||||
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}"> |
||||
{{node.name}} |
||||
</span> |
||||
<span *ngIf="node.isTemplate">({{node.children.length}})</span> |
||||
<mat-checkbox style="margin-left: auto;" color=primary></mat-checkbox> |
||||
</mat-tree-node> |
||||
|
||||
<mat-tree-node cdkDrag cdkDragDisabled="false" [ngClass]="{'isLookPattern': !node.isLookPattern}" *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding class="treeNode" > |
||||
<button mat-icon-button matTreeNodeToggle [attr.aria-label]="'toggle ' + node.name"> |
||||
<mat-icon class="mat-icon-rtl-mirror"> |
||||
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}} |
||||
</mat-icon> |
||||
</button> |
||||
<span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}"> |
||||
{{node.name}} |
||||
</span> |
||||
<span *ngIf="node.isTemplate && node.isNewElement">({{node.children.length}})</span> |
||||
<mat-checkbox style="margin-left: auto;" color=primary></mat-checkbox> |
||||
</mat-tree-node> |
||||
|
||||
</mat-tree> |
||||
<!-- 消防列表树 --> |
||||
</div> |
||||
<div style="text-align: center;"> |
||||
<button mat-stroked-button style="margin-right: 15px;border: none;background: #07CDCF;color: #fff;" (click)='submit()'>确定</button> |
||||
<button mat-stroked-button style="margin-left: 15px;border: none;background: #dfe0e0;" mat-dialog-close>取消</button> |
||||
</div> |
||||
</div> |
||||
Loading…
Reference in new issue