forked from dotnetcore/osharp
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
7 changed files
with
310 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
15 changes: 15 additions & 0 deletions
15
tests/web/ui/ng-alain7/src/app/shared/components/filter-group/filter-group.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<div class="group-box" #groupBox *ngIf="group" [ngStyle]="{'background-color': group.Level%2==0?'#eee':'#fff'}"> | ||
<admin-security-filter-group *ngFor="let subGroup of group.Groups" [group]="subGroup" [entity]="entity" (remove)="removeSubGroup($event)"></admin-security-filter-group> | ||
<div> | ||
<admin-security-filter-rule *ngFor="let subRule of group.Rules" [rule]="subRule" [properties]="entityProperties" (remove)="removeRule($event)"></admin-security-filter-rule> | ||
<nz-row class="group-operate"> | ||
<nz-select [(ngModel)]="group.Operate" nzSize="small"> | ||
<nz-option *ngFor="let entry of groupOperateEntries" [nzValue]="entry.Operate" [nzLabel]="entry.Display"></nz-option> | ||
</nz-select> | ||
<button nz-button nzSize="small" (click)="addGroup()">增加分组</button> | ||
<button nz-button nzSize="small" (click)="addRule()">增加条件</button> | ||
<button nz-button nzSize="small" (click)="removeGroup()" *ngIf="group.Level>1">删除分组</button> | ||
</nz-row> | ||
</div> | ||
</div> | ||
<nz-alert *ngIf="!group" nzType="info" nzMessage="请选择左边一行进行操作"></nz-alert> |
92 changes: 92 additions & 0 deletions
92
tests/web/ui/ng-alain7/src/app/shared/components/filter-group/filter-group.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,92 @@ | ||
import { Component, Input, OnChanges, Output, EventEmitter } from '@angular/core'; | ||
import { HttpClient } from '@angular/common/http'; | ||
import { FilterGroup, FilterRule, FilterOperate, AjaxResult, AjaxResultType, EntityProperty, FilterOperateEntry } from '@shared/osharp/osharp.model'; | ||
import { OsharpService } from '@shared/osharp/services/osharp.service'; | ||
|
||
|
||
@Component({ | ||
selector: 'app-security-filter-group', | ||
templateUrl: './filter-group.component.html', | ||
styles: [` | ||
.group-box{margin:2px;padding:3px; border:dashed 2px #ddd;} | ||
.group-box nz-select{margin-right:5px;} | ||
.group-operate{margin:3px 0;} | ||
`] | ||
}) | ||
export class FilterGroupComponent implements OnChanges { | ||
|
||
@Input() group: FilterGroup; | ||
@Input() entity: string; | ||
@Output() remove: EventEmitter<FilterGroup> = new EventEmitter<FilterGroup>(); | ||
|
||
entityProperties: EntityProperty[] = []; | ||
groupOperateEntries: FilterOperateEntry[] = [new FilterOperateEntry(FilterOperate.And), new FilterOperateEntry(FilterOperate.Or)]; | ||
|
||
constructor( | ||
private osharp: OsharpService, | ||
private http: HttpClient | ||
) { | ||
this.group = new FilterGroup(); | ||
this.group.Operate = FilterOperate.Or; | ||
} | ||
|
||
ngOnChanges() { | ||
if (this.group && (!this.group.Level || this.group.Level == 1)) { | ||
FilterGroup.Init(this.group); | ||
} | ||
if (this.group) { | ||
if (!this.entity) { | ||
this.entityProperties = []; | ||
return; | ||
} | ||
this.http.get<AjaxResult>("api/admin/entityinfo/ReadProperties?typeName=" + this.entity).subscribe(res => { | ||
if (res.Type != AjaxResultType.Success) { | ||
this.osharp.error(res.Content); | ||
return; | ||
} | ||
this.entityProperties = res.Data; | ||
}); | ||
} | ||
} | ||
addGroup() { | ||
if (!this.entity) { | ||
this.osharp.error("请选择左边的一行再进行操作"); | ||
return; | ||
} | ||
let subGroup = new FilterGroup(); | ||
subGroup.Level = this.group.Level + 1; | ||
this.group.Groups.push(subGroup); | ||
} | ||
addRule() { | ||
if (!this.entity) { | ||
this.osharp.error("请选择左边的一行再进行操作"); | ||
return; | ||
} | ||
let rule = new FilterRule(null, null); | ||
if (this.entityProperties.length > 0) { | ||
rule.Field = this.entityProperties[0].Name; | ||
} | ||
this.group.Rules.push(rule); | ||
} | ||
removeRule(rule: FilterRule) { | ||
if (rule) { | ||
let index = this.group.Rules.indexOf(rule); | ||
if (index >= 0) { | ||
this.group.Rules.splice(index, 1); | ||
} | ||
} | ||
} | ||
/** 删除分组按钮 */ | ||
removeGroup() { | ||
this.remove.emit(this.group); | ||
} | ||
/**删除子分组的事件响应 */ | ||
removeSubGroup(subGroup: FilterGroup) { | ||
if (subGroup) { | ||
let index = this.group.Groups.indexOf(subGroup); | ||
if (index >= 0) { | ||
this.group.Groups.splice(index, 1); | ||
} | ||
} | ||
} | ||
} |
56 changes: 56 additions & 0 deletions
56
tests/web/ui/ng-alain7/src/app/shared/components/filter-group/filter-rule.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,56 @@ | ||
<nz-row> | ||
<div class="rule-box" *ngIf="properties && properties.length>0"> | ||
<nz-select [(ngModel)]="rule.Field" nzSize="small" (ngModelChange)="fieldChange($event)" class="f-left"> | ||
<nz-option *ngFor="let property of properties" [nzValue]="property.Name" [nzLabel]="property.Display"></nz-option> | ||
</nz-select> | ||
<nz-select [(ngModel)]="rule.Operate" nzSize="small" class="f-left"> | ||
<nz-option *ngFor="let entry of operateEntries" [nzValue]="entry.Operate" [nzLabel]="entry.Display"></nz-option> | ||
</nz-select> | ||
|
||
<div *ngIf="property" class="f-left"> | ||
<!--布尔类型--> | ||
<ng-container *ngIf="property.TypeName=='System.Boolean'; else NotBoolean"> | ||
<nz-select [(ngModel)]="rule.Value" nzSize="small"> | ||
<nz-option nzValue="true" nzLabel="是"></nz-option> | ||
<nz-option nzValue="false" nzLabel="否"></nz-option> | ||
</nz-select> | ||
</ng-container> | ||
<ng-template #NotBoolean> | ||
<!--数值类型--> | ||
<ng-container *ngIf="property.TypeName=='System.Int32'; else NotNumber"> | ||
<!--枚举类型--> | ||
<ng-container *ngIf="property.ValueRange.length>0; else NotEnum"> | ||
<nz-select [(ngModel)]="rule.Value" nzSize="small"> | ||
<nz-option *ngFor="let value of property.ValueRange" [nzValue]="value.id" [nzLabel]="value.text"></nz-option> | ||
</nz-select> | ||
</ng-container> | ||
<ng-template #NotEnum> | ||
<!--用户类型--> | ||
<ng-container *ngIf="property.IsUserFlag&&rule.Operate==3; else NotUser"> | ||
<nz-select [(ngModel)]="rule.Value" nzMode="tags" nzMaxMultipleCount="1" (ngModelChange)="onTagsChangeEvent($event)" nzSize="small"> | ||
<nz-option nzValue="@CurrentUserId" nzLabel="@当前用户"></nz-option> | ||
</nz-select> | ||
</ng-container> | ||
<ng-template #NotUser> | ||
<!--数值类型--> | ||
<nz-input-number [(ngModel)]="rule.Value" nzSize="small"></nz-input-number> | ||
</ng-template> | ||
</ng-template> | ||
</ng-container> | ||
<ng-template #NotNumber> | ||
<!--时间类型--> | ||
<ng-container *ngIf="property.TypeName=='System.DateTime'; else NotDateTime"> | ||
<nz-date-picker nzShowTime [(ngModel)]="rule.Value" nzFormat="yyyy-MM-dd HH:mm" nzPlaceHolder="Select Time" nzSize="small"></nz-date-picker> | ||
</ng-container> | ||
<ng-template #NotDateTime> | ||
<!--其他类型,使用字符串--> | ||
<input nz-input [(ngModel)]="rule.Value" nzSize="small" /> | ||
</ng-template> | ||
</ng-template> | ||
</ng-template> | ||
</div> | ||
<button nz-button (click)="removeRule()" nzType="default" nzSize="small" nzShape="circle" class="f-left"> | ||
<i class="anticon anticon-close"></i> | ||
</button> | ||
</div> | ||
</nz-row> |
122 changes: 122 additions & 0 deletions
122
tests/web/ui/ng-alain7/src/app/shared/components/filter-group/filter-rule.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,122 @@ | ||
import { Component, Output, EventEmitter, Input, OnChanges } from '@angular/core'; | ||
import { FilterRule, EntityProperty, FilterOperate, FilterOperateEntry } from '@shared/osharp/osharp.model'; | ||
import { OsharpService } from '@shared/osharp/services/osharp.service'; | ||
|
||
@Component({ | ||
selector: 'app-security-filter-rule', | ||
templateUrl: './filter-rule.component.html', | ||
styles: [` | ||
.rule-box{margin:3px 3px;} | ||
.rule-box nz-select, | ||
.rule-box nz-input-number, | ||
.rule-box input[nz-input], | ||
.rule-box nz-date-picker {width:150px;float:left; margin-right:8px;} | ||
.f-left{float:left;} | ||
.k-input{padding:0;line-height:normal;} | ||
`] | ||
}) | ||
export class FilterRuleComponent implements OnChanges { | ||
|
||
@Input() rule: FilterRule; | ||
@Input() properties: EntityProperty[]; | ||
@Output() remove: EventEmitter<FilterRule> = new EventEmitter<FilterRule>(); | ||
|
||
operateEntries: FilterOperateEntry[] = []; | ||
property: EntityProperty; | ||
|
||
constructor( | ||
private osharp: OsharpService | ||
) { } | ||
|
||
ngOnChanges(): void { | ||
if (this.rule) { | ||
this.fieldChange(this.rule.Field, true); | ||
} else { | ||
this.operateEntries = []; | ||
} | ||
} | ||
removeRule() { | ||
this.remove.emit(this.rule); | ||
} | ||
|
||
fieldChange(field: string, first: boolean = false) { | ||
if (this.properties.length == 0 || !field) { | ||
return; | ||
} | ||
this.property = this.properties.find(m => m.Name == field); | ||
if (this.property == null) { | ||
return; | ||
} | ||
if (!first) { | ||
this.rule.Value = null; | ||
} | ||
switch (this.property.TypeName) { | ||
case 'System.Boolean': | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = 'false'; | ||
} | ||
break; | ||
case 'System.Guid': | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = ''; | ||
} | ||
break; | ||
case 'System.Int32': | ||
if (this.property.ValueRange.length == 0) { | ||
//数值类型 | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual, FilterOperate.Less, FilterOperate.LessOrEqual, FilterOperate.Greater, FilterOperate.GreaterOrEqual]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = '0'; | ||
} | ||
} else { | ||
//枚举类型 | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = this.property.ValueRange[0].id; | ||
} | ||
} | ||
break; | ||
case 'System.DateTime': | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual, FilterOperate.Less, FilterOperate.LessOrEqual, FilterOperate.Greater, FilterOperate.GreaterOrEqual]); | ||
if (!this.rule.Value) { | ||
// this.rule.Value = new Date().toLocaleString(); | ||
} | ||
break; | ||
case 'System.String': | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual, FilterOperate.StartsWith, FilterOperate.EndsWith, FilterOperate.Contains, FilterOperate.NotContains]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = ''; | ||
} | ||
break; | ||
default: | ||
this.operateEntries = this.getOperateEntries([FilterOperate.Equal, FilterOperate.NotEqual, FilterOperate.Less, FilterOperate.LessOrEqual, FilterOperate.Greater, FilterOperate.GreaterOrEqual, FilterOperate.StartsWith, FilterOperate.EndsWith, FilterOperate.Contains, FilterOperate.NotContains]); | ||
if (!this.rule.Value) { | ||
this.rule.Value = ''; | ||
} | ||
break; | ||
} | ||
if (!this.rule.Operate || this.operateEntries.filter(m => m.Operate == this.rule.Operate).length == 0) { | ||
this.rule.Operate = this.operateEntries[0].Operate; | ||
} | ||
} | ||
|
||
private getOperateEntries(operates: FilterOperate[]): FilterOperateEntry[] { | ||
let entries: FilterOperateEntry[] = []; | ||
for (let index = 0; index < operates.length; index++) { | ||
const operate = operates[index]; | ||
entries.push(new FilterOperateEntry(operate)); | ||
} | ||
return entries; | ||
} | ||
|
||
onTagsChangeEvent(e) { | ||
if (!e || e.length == 0) { | ||
this.osharp.error(`${this.property.Display}不能为空`); | ||
this.rule.Value = null; | ||
return; | ||
} | ||
this.rule.Value = e[0]; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters