Calculation/app/public/js/tender_list.js

'use strict';

/**
 *
 *
 * @author Mai
 * @date 2018/10/11
 * @version
 */
const EmptyTenderHtml = [
    '<div class="jumbotron">',
    '<h3 class="display-6">还没有标段数据</h3>',
    '</div>'
];
// levelTree - setting
const levelTreeSetting = {
    view: {
        selectedMulti: false
    },
    data: {
        simpleData: {
            idKey: 'lid',
            pIdKey: 'lpId',
            rootPId: 0,
            enable: true,
        }
    },
    edit: {
        enable: true,
        showRemoveBtn: false,
        showRenameBtn: false,
        drag: {
            autoExpandTrigger: true,
            isCopy: false,
            isMove:  true,
            prev: false,
            next: false,
            inner: true,
        }
    },
    callback: {
        beforeDrop: beforeDropNode,
        onDrop: onDropNode,
    }
};
const levelNodes =[];
const tenderTree = [];
function createTree() {
    const zTree = $.fn.zTree.getZTreeObj('treeLevel');
    if (zTree) {
        zTree.destroy();
    }
    $.fn.zTree.init($("#treeLevel"), levelTreeSetting, levelNodes);
}
function beforeDropNode(treeId, treeNodes, targetNode, moveType, isCopy) {
    if (targetNode.lid !== 1) {
        const parent = targetNode.getParentNode();
        if (parent && parent.lid === 1) {
            return false;
        }
    }
}
function onDropNode(event, treeId, treeNodes, targetNode, moveType) {
    const zTree = $.fn.zTree.getZTreeObj(treeId);
    function resetFixNode(id) {
        const node = zTree.getNodeByParam('lid', id);
        node.isParent = true;
        zTree.updateNode(node, false);
        zTree.expandNode(node, true);
    }
    function moveChildren(children, node) {
        if (!children || children.length === 0) { return }
        for (const c of children) {
            moveChildren(c.children, node);
            zTree.moveNode(node, c, 'inner');
        }
    }
    resetFixNode(1);
    resetFixNode(2);
    if (targetNode.lid === 1 && treeNodes[0].children && treeNodes[0].children.length !== 0) {
        moveChildren(treeNodes[0].children, zTree.getNodeByParam('lid', 1));
    } else if (targetNode.lid !== 1) {
        if (targetNode.children.length >= 2) {
            for (const c of targetNode.children) {
                if (c.lid !== treeNodes[0].lid) {
                    zTree.moveNode(treeNodes[0], c, 'inner');
                }
            }
        }
    }
}
// 查询方法
function findNode (key, value, arr) {
    for (const a of arr) {
        if (a[key] && a[key] === value) {
            return a;
        }
    }
}
function getPId(level) {
    if (level !== 1) {
        const p = findNode('level', level - 1, levelNodes);
        if (p) {
            return p.lid
        } else {
            return 1;
        }
    } else {
        return 2;
    }
}
// 分类数据排序
function sortCategory() {
    category.sort(function (a, b) {
        return a.level ? (b.level ? a.level - b.level : -1) : a.id - b.id;
    });
}
// 初始化分类树结构数据
function initCategoryLevelNode() {
    levelNodes.splice(0, levelNodes.length);
    levelNodes.push(
        { lid:1, lpId:0, name:"可用类别", open:true, isParent: true},
        { lid:2, lpId:0, name:"已用类别", open:true, isParent: true}
    );
    for (const c of category) {
        const cate = JSON.parse(JSON.stringify(c));
        cate.lid = levelNodes.length + 1;
        cate.open = true;
        if (!cate.level) {
            cate.lpId = 1;
            levelNodes.push(cate);
        } else {
            cate.lpId = getPId(cate.level);
            levelNodes.push(cate);
        }
    }
}
// 新建标段 -- 分类属性选择
function getCategoryHtml() {
    function getSelectCategoryHtml (cate) {
        const html = [];
        html.push('<div class="form-group" cate-id="' + cate.id + '">');
        html.push('<lable>', cate.name, '</lable>');
        html.push('<select class="form-control">');
        for (const v of cate.value) {
            html.push('<option>', v, '</option>');
        }
        html.push('</select>');
        html.push('</div>');
        return html.join('');
    }
    function getRadioCategoryHtml (cate) {
        const html = [];
        html.push('<div class="form-group" cate-id="' + cate.id + '">');
        html.push('<lable>', cate.name, '</lable>');
        html.push('<div>');
        for (const v of cate.value) {
            html.push('<div class="form-check-inline">');
            html.push('<input class="form-check-input" type="radio"', 'value="' , v,  '">');
            html.push('<label class="form-check-label">', v, '</label>');
            html.push('</div>');
        }
        html.push('</div>');
        html.push('</div>');
        return html.join('');
    }
    const html = [];
    for (const c of category) {
        if (c.type === categoryType.key.dropDown) {
            html.push(getSelectCategoryHtml(c));
        } else if (c.type === categoryType.key.radio) {
            html.push(getRadioCategoryHtml(c));
        }
    }
    return html.join('');
}
// 初始化TenderTree数据
function initTenderTree () {
    const levelCategory = category.filter(function (c) {
        return c.level && c.level > 0;
    });
    function findCategoryNode(cid, value, array) {
        for (const a of array) {
            if (a.cid === cid && a.vid === value) {
                return a;
            }
        }
    }
    function getCategoryNode(category, value, parent) {
        const array = parent ?  parent.children : tenderTree;
        let cate = findCategoryNode(category.id, value, array);
        if (!cate) {
            cate = {
                cid: category.id,
                vid: value,
                name: findNode('id', value, category.value).value,
                children: [],
                level: category.level,
            };
            array.push(cate);
        }
        return cate;
    }
    function loadTenderCategory (tender) {
        let tenderCategory = null;
        for (const lc of levelCategory) {
            const tenderCate = findNode('cid', lc.id, tender.category);
            if (tenderCate) {
                tenderCategory = getCategoryNode(lc, tenderCate.value, tenderCategory);
            } else {
                return tenderCategory;
            }
        }
        return tenderCategory;
    }
    tenderTree.splice(0, tenderTree.length);
    for (const t of tenders) {
        t.valid = true;
        if (t.category && levelCategory.length > 0) {
            const parent = loadTenderCategory(t);
            if (parent) {
                t.level = parent.level + 1;
                parent.children.push(t);
            } else {
                tenderTree.push(t);
            }
        } else {
            tenderTree.push(t);
        }
    }
}
function recursiveGetTenderNodeHtml (node, arr) {
    const html = [];
    html.push('<tr>');
    for (const c of TenderTableCol) {
        if (c.folderCell) {
            html.push('<td class="in-' + node.level + '">');
            if (node.cid) {
                html.push('<i class="fa fa-folder-o"></i> ', node[c.field]);
            } else {
                html.push('<span class="text-muted mr-2">');
                html.push(arr.indexOf(node) === arr.length - 1 ? '└' : '├');
                html.push('</span>');
                html.push('<a href="/tender/' + node.id + '">', node[c.field], '</a>');
            }
            html.push('</td>');
        } else {
            html.push('<td>');
            html.push(node[c.field] ? node[c.field] : '');
            html.push('</td>');
        }
    }
    html.push('</tr>');
    if (node.children) {
        for (const c of node.children) {
            html.push(recursiveGetTenderNodeHtml(c, node.children));
        }
    }
    return html.join('');
}
// 根据TenderTree数据获取Html代码
function getTenderTreeHtml () {
    if (tenderTree.length > 0) {
        const html = [];
        html.push('<table class="table table-bordered">');
        html.push('<thead>', '<tr>');
        for (const c of TenderTableCol) {
            html.push('<th>', c.title, '</th>');
        }
        html.push('</tr>', '</thead>');
        for (const t of tenderTree) {
            html.push(recursiveGetTenderNodeHtml(t, tenderTree));
        }
        html.push('</table>');
        return html.join('');
    } else {
        return EmptyTenderHtml.join('');
    }
}

$(document).ready(() => {
    sortCategory();
    // 初始化分类数据
    initCategoryLevelNode();
    $('.modal-body', '#add-bd').append(getCategoryHtml());
    // 初始化标段树结构
    initTenderTree();
    console.log(tenderTree);
    $('.c-body').html(getTenderTreeHtml());
    // 分类
    $('#cate-set').on('show.bs.modal', function () {
        createTree();
    });
    $('#set-cate-ok').click(function () {
        const data = [];
        const zTree = $.fn.zTree.getZTreeObj('treeLevel');
        for (const c of category) {
            const node = zTree.getNodeByParam('id', c.id);
            const parent = node.getParentNode();
            if (parent.lid === 1) {
                data.push({id: c.id, level: 0});
            } else {
                data.push({id: c.id, level: node.getPath().length - 1});
            }
        }
        postData('/api/setting/category/level', data, function (rst) {
            for (const d of data) {
                const c = findNode('id', d.id, category);
                c.level = d.level;
            }
            sortCategory();
            initCategoryLevelNode();
            initTenderTree();
            $('.c-body').html(getTenderTreeHtml());
            $('#cate-set').modal('hide');
        });
    });
    // 新增标段
    $('#add-bd-ok').click(function () {
        const data = {
            name: $('[name=name]', '#add-bd').val(),
            category: [],
        };
        if (!data.name || data.name === '') {
            // TODO 提示用户
            return;
        }
        for (const c of category) {
            const cate = {cid: c.id};
            if (c.type === categoryType.key.dropDown) {
                cate.value = $('select', '[cate-id=' + c.id + ']').val();
            } else if (c.type === categoryType.key.radio) {
                cate.value = $('input:checked', '[cate-id=' + c.id + ']').val();
            }
            data.category.push(cate);
        }
        postData('/list/add', data, function (result) {
            tenders.push(result);
            initTenderTree();
            $('.c-body').html(getTenderTreeHtml());
        });
    });
});