select-person.component.ts

import {Component, EventEmitter, OnInit, Output} from '@angular/core';
import {NzTreeNode} from 'ng-zorro-antd';
import {SystemService} from '../../system/system.service';
import {CommonService} from '../../shared/common/common.service';

@Component({
    selector: 'smart-select-person',
    templateUrl: './select-person.component.html',
    styles: [
            `
            .p-list, .p-list-title {
                display: flex;
                align-items: center;
            }

            .p-list > span:last-child,
            .p-list-title > span:last-child {
                margin-left: auto;
                margin-right: 15px;
            }

            .p-list {
                padding: 8px 15px 0 15px;
            }

            .p-list + .p-list {
                margin-top: 8px;
            }

            .p-div {
                height: 400px;
                overflow-y: scroll;
            }
        `
    ]
})
export class SelectPersonComponent implements OnInit {
    @Output() done = new EventEmitter();

    isVisible = false;
    title;
    groupList;
    userList;
    selectList = [];
    nodes: any[];
    allChecked = false;
    disabledButton = true;
    indeterminate = false;
    roleId;
    deleteList = [];

    pageNum = 1;
    pageSize = 5;
    totalNum;

    organizationId = null;
    displayData: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }> = [];

    constructor(private systemSer: SystemService, private commonSer: CommonService) {
    }

    checkAll(value: boolean): void {
        this.displayData.forEach(data => {
            data.checked = value;
            if (value) {
                this.selectList.push(data);
            } else {
                this.selectList = [];
            }
        });
        this.refreshStatus();
    }

    currentPageDataChange($event: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }>): void {
        this.displayData = $event;
    }

    selectItem(item, e) {
        if (e) {
            this.selectList.push(item);
            this.deleteList.forEach((value, index) => {
                if (value.id == item.id) {
                    this.deleteList.splice(index, 1);
                }
            });
        } else {
            this.selectList.forEach((value, index) => {
                if (value.id == item.id) {
                    this.selectList.splice(index, 1);
                }
            });
            if (item.isRole == 1) {
                this.deleteList.push(item);
            }
        }
        this.refreshStatus();
    }

    deleteSelect(index) {
        if (this.selectList[index].isRole == 1) {
            this.deleteList.push(this.selectList[index]);
        }
        this.selectList.splice(index, 1);
    }

    refreshStatus(): void {
        const allChecked = this.displayData.every(value => value.checked === true);
        const allUnChecked = this.displayData.every(value => !value.checked);
        this.allChecked = allChecked;
        this.indeterminate = (!allChecked) && (!allUnChecked);
        this.disabledButton = !this.userList.some(value => value.checked);
    }

    ngOnInit() {

    }

    init() {
        this.selectList = [];
        this.deleteList = [];
        this.allChecked = false;
        this.disabledButton = true;
        this.indeterminate = false;
    }

    showModal(title, roleId) {
        this.getGroup();
        this.isVisible = true;
        this.title = title;
        this.roleId = roleId;
        this.getUser();
    }

    //翻页
    changePage($event) {
        if ($event > 0) {
            this.pageNum = $event;
            this.getUser();
        }
    }

    getUser() {
        const data = {
            'search': null,
            'organizationId': this.organizationId = this.organizationId == '' ? null : this.organizationId,
            'pageNum': this.pageNum,
            'pageSize': this.pageSize
        };
        this.systemSer.user(data).subscribe(
            (res) => {
                this.userList = res.data.data;
                this.totalNum = res.data.totalCount;
            }
        );
    }

    getOrg(e) {
        this.organizationId = e.node.key;
        this.getUser();
    }

    //组织信息
    getGroup() {
        this.systemSer.organization().subscribe(
            (res) => {
                this.groupList = res.data;
                if (this.title == '授予用户') {
                    this.getUserByOrgIdAboutRole(this.groupList[0].id);
                }
                this.groupList.forEach(
                    res => {
                        res.title = res.name;
                        res.key = res.id;
                    }
                );
                this.nodeTree();
            }
        );
    }

    //授予用户
    getUserByOrgIdAboutRole(orgId) {
        const data = {
            orgId: orgId,
            roleId: this.roleId
        };
        this.systemSer.getUserByOrgIdAboutRole(data).subscribe(
            (res) => {
                this.userList = res.data;
                this.userList.forEach(e => {
                    if (e.isRole == 1) {
                        e.checked = true;
                        this.selectList.push(e);
                    }
                });
            }
        );
    }

    nodeTree() {
        const tree = this.commonSer.listToTree('id', 'parentId', this.groupList,);
        const list = tree.map(res => {
            return new NzTreeNode(res);
        });
        this.nodes = list;
    }

    handleEditCancel() {
        this.isVisible = false;
        this.init();
    }

    handEditleOk() {
        if (this.title == '授予用户') {
            const data = {
                'select': this.selectList,
                'delete': this.deleteList
            };
            this.done.emit(data);
        } else {
            this.done.emit(this.selectList);
        }
        this.isVisible = false;
        this.init();
    }

    //清空选择
    clearList() {
        this.selectList = [];
    }

}