usr-treeview.html 3.3 KB
<div class="app-mob-treeview ">
<ng-container *ngIf="viewtype !== 'TREEEXPBAR'">
<div class="app-tree"  [ngStyle]="{'height':$isEnableSelection === true?'calc(100% - 45px)':'100%','overflow-y':'auto'}">
        <div class="app-treenode">
            <ion-badge [color]="($treeNodeList.length > 0) ? 'primary' : 'light'" (click)="needTreeChange()">根节点</ion-badge>
            <ng-container *ngFor="let item of $treeNodeList;let i = index;">
                <ion-badge color="white">
                    >
                </ion-badge>
                <ion-badge [color]="($treeNodeList.length === (i + 1)) ? 'light' : 'primary'" (click)="needTreeChange(item, i)">
                    {{ item.text }}
                </ion-badge>
            </ng-container>
        </div>
        <div style="height: 5pt;background-color: #e3e3e3;"></div>
        <div *ngIf="$trunks.length > 0">
            <ion-list class="app-treectrl-list">
                <ion-item class="app-treectrl-list-item" *ngFor="let item of $trunks" href="javascript:;" (click)="checkboxChange(item)">
                    <ion-avatar slot="start" *ngIf="(item.iconCls != '' && item.iconCls) || (item.icon != '' && item.icon)">
                        <ion-icon [name]="(item.iconCls != '' && item.iconCls) ?  item.iconCls : ''" [src]="(item.icon != '' && item.icon) ? item.icon : ''"
                            size="large"></ion-icon>
                    </ion-avatar>
                    <ion-label>
                        {{ item.srfmajortext }}
                    </ion-label>
                </ion-item>
            </ion-list>
        </div>
        <div style="height: 10pt;background-color: #e3e3e3;"></div>
        <div *ngIf="$leafy.length > 0">
            <ion-list class="app-treectrl-list">
                <ion-item class="app-treectrl-list-item" *ngFor="let item of $leafy">
                    <ion-checkbox *ngIf="$isEnableSelection" slot="start" [(ngModel)]="item.isChecked" (ionChange)="selectChange(item)"></ion-checkbox>
                    <ion-avatar slot="start" *ngIf="(item.iconCls != '' && item.iconCls) || (item.icon != '' && item.icon)">
                        <ion-icon [name]="(item.iconCls != '' && item.iconCls) ?  item.iconCls : ''" [src]="(item.icon != '' && item.icon) ? item.icon : ''"
                            size="large"></ion-icon>
                    </ion-avatar>
                    <ion-label>
                        {{ item.srfmajortext }}
                    </ion-label>
                    <ion-icon *ngIf="!$isEnableSelection" src="./assets/images/edit.svg" slot="end" (click)="clickedit(item)"></ion-icon>
                </ion-item>
            </ion-list>
        </div>
    </div>
    <div *ngIf="$isEnableSelection" class="app-tree-selection">
        <ion-chip *ngFor="let value of selectedArray;let i = index;" (click)="removeItem(i,value)">
            <ion-label>{{ value.srfmajortext }}</ion-label>
            <ion-icon name="close-circle"></ion-icon>
        </ion-chip>
    </div>
</ng-container>
<ng-container *ngIf="viewtype === 'TREEEXPBAR'">
    <div class="app-tree-list">
        <ng-container *ngFor="let item of treedata">
                <div (click)="slectedChange(item)" class="app-tree-item">
                    {{item.text}}
                </div>
        </ng-container>
    </div> 
</ng-container>
</div>