Calculation/app/public/js/tender_list_progress.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 = [];
let parentId = 0;
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 value="' + v.id + '">', v.value, '</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 iV in cate.value) {
            const v = cate.value[iV];
            html.push('<div class="form-check-inline">');
            html.push('<input class="form-check-input" type="radio"', 'name="' + cate.name + '" ', 'value="' , v.id, (iV == 0 ? '" checked="' : ''),  '">');
            html.push('<label class="form-check-label">', v.value, '</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, i = null) {
        const array = parent ?  parent.children : tenderTree;
        let cate = findCategoryNode(category.id, value, array);
        if (!cate) {
            const cateValue = findNode('id', value, category.value);
            if (!cateValue) return null;
            cate = {
                cid: category.id,
                vid: value,
                name: cateValue.value,
                children: [],
                level: i ? i : category.level,
                sort_id: ++parentId,
            };
            array.push(cate);
        }
        return cate;
    }
    function loadTenderCategory (tender) {
        let tenderCategory = null;
        for (const [index, lc] of levelCategory.entries()) {
            const tenderCate = findNode('cid', lc.id, tender.category);
            if (tenderCate) {
                tenderCategory = getCategoryNode(lc, tenderCate.value, tenderCategory);
            } else {
                if (index === 0 && tender.category) {
                    for (const [i,c] of tender.category.entries()) {
                        const cate = findNode('id', c.cid, category);
                        tenderCategory = getCategoryNode(cate, c.value, tenderCategory, i+1);
                    }
                }
                return tenderCategory;
            }
        }
        return tenderCategory;
    }
    function calculateTender(tender) {
        if (tender.lastStage) {
            tender.end_qc_tp = ZhCalc.add(tender.lastStage.pre_qc_tp, tender.lastStage.qc_tp);
            tender.pre_gather_tp = ZhCalc.add(tender.lastStage.pre_contract_tp, tender.lastStage.pre_qc_tp);
            tender.gather_tp = ZhCalc.add(tender.lastStage.contract_tp, tender.lastStage.qc_tp);
            tender.sum_tp = ZhCalc.add(tender.total_price, tender.end_qc_tp);
        } else {
            tender.sum_tp = tender.total_price;
        }
    }
    tenderTree.splice(0, tenderTree.length);
    for (const t of tenders) {
        calculateTender(t);
        t.valid = true;
        delete t.level;
        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 getProgressHtml(total, pre, cur) {
    if (total !== 0) {
        let preP = ZhCalc.mul(ZhCalc.div(pre, total, 2), 100, 0);
        let curP = ZhCalc.mul(ZhCalc.div(cur, total, 2), 100, 0);
        let other = Math.max(ZhCalc.sub(ZhCalc.sub(total, pre), cur), 0);
        let otherP = Math.max(100 - preP - curP, 0);
        const html = '<div class="progress">' +
            '<div class="progress-bar bg-success" style="width: ' + preP + '%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期完成：￥' + pre + '">' + preP + '%</div>' +
            '<div class="progress-bar bg-info" style="width: ' + curP + '%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成：￥' + cur + '">' + curP + '%</div>' +
            '<div class="progress-bar bg-gray" style="width: ' + otherP + '%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成：￥' + other + '">' + otherP + '%</div>' +
            '</div>';
        return html;
    } else {
        return '';
    }
}
function recursiveGetTenderNodeHtml (node, arr, pid) {
    const html = [];
    html.push('<tr pid="' + pid + '">');
    // 名称
    html.push('<td class="in-' + node.level + '">');
    if (node.cid) {
        html.push('<span class="fold-switch mr-1" title="收起" cid="'+ node.sort_id +'"><i class="fa fa-minus-square-o"></i></span> <i class="fa fa-folder-o"></i> ', node.name);
    } 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('<a href="javascript: void(0)" id="' + node.id + '">', node.name, '</a>');
    }
    html.push('</td>');
    // 计量期数
    html.push('<td>');
    if (!node.cid) {
        html.push(node.lastStage ? '第' + node.lastStage.order + '期' : '台账');
    }
    html.push('</td>');
    // 累计合同计量
    html.push('<td>');
    const sum = node.lastStage ? ZhCalc.add(node.total_price, node.lastStage.end_qc_tp) : node.total_price;
    html.push(node.sum_tp ? node.sum_tp : '');
    html.push('</td>');
    // 截止本期累计完成/本期完成/未完成
    html.push('<td>');
    if (node.lastStage) {
        html.push(getProgressHtml(node.sum_tp, node.pre_gather_tp, node.gather_tp));
    } else {
        html.push('');
    }
    html.push('</td>');
    html.push('</tr>');
    if (node.children) {
        for (const c of node.children) {
            html.push(recursiveGetTenderNodeHtml(c, node.children, node.sort_id));
        }
    }
    return html.join('');
}
// 根据TenderTree数据获取Html代码
function getTenderTreeHtml () {
    if (tenderTree.length > 0) {
        const html = [];
        html.push('<table class="table table-hover table-bordered">');
        html.push('<thead>', '<tr>');
        html.push('<th>', '名称', '</th>');
        html.push('<th width="120">', '计量期数', '</th>');
        html.push('<th>', '总价 <i class="fa fa-question-circle text-primary"  data-placement="bottom" data-toggle="tooltip" data-original-title="0号台账+截止本期数量变更"></i>', '</th>');
        html.push('<th>', '截止上期完成/本期完成/未完成', '</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('');
    }
}
function bindTenderUrl() {
    $('a', '.c-body').bind('click', function () {
        const tenderId = parseInt($(this).attr('id'));
        const tender = _.find(tenders, function (t) {
            return t.id === tenderId;
        });
        if (tender.measure_type) {
            window.location.href = '/tender/' + tenderId;
        } else {
            for (const a of $('a', '#jlms')) {
                a.href = '/tender/' + tenderId + '/type?type=' + $(a).attr('mst');
            }
            $('#jlms').modal('show');
        }
    });
}

$(document).ready(() => {
    autoFlashHeight();
    sortCategory();
    // 初始化分类数据
    initCategoryLevelNode();
    $('.modal-body', '#add-bd').append(getCategoryHtml());
    // 初始化标段树结构
    initTenderTree();
    $('.c-body').html(getTenderTreeHtml());
    bindTenderUrl();
    // 分类
    $('#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('/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(),
            valuation: $('[name=valuation]:checked').val(),
            category: [],
        };
        if (!data.name || data.name === '') {
            // TODO 提示用户
            return;
        }
        for (const c of category) {
            if (parseInt($('select', '[cate-id=' + c.id + ']').val()) !== 0) {
                const cate = {cid: c.id};
                // if (c.type === categoryType.key.dropDown) {
                cate.value = parseInt($('select', '[cate-id=' + c.id + ']').val());
                // } else if (c.type === categoryType.key.radio) {
                //     cate.value = parseInt($('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());
            bindTenderUrl();
            $('#add-bd').modal('hide');
            $('[name=name]', '#add-bd').val('');
        });
    });

    // 展开和收起
    $('body').on('click', '.fold-switch', function () {
        if ($(this).children('i').hasClass('fa-minus-square-o')) {
            $(this).children('i').removeClass('fa-minus-square-o').addClass('fa-plus-square-o');
            $(this).attr('title', '展开');
            const cid = $(this).attr('cid');
            const node = findTenderTreeNode(parseInt(cid), tenderTree);
            doTrStatus(returnItem, 'hide');
        } else {
            $(this).children('i').removeClass('fa-plus-square-o').addClass('fa-minus-square-o');
            $(this).attr('title', '收起');
            const cid = $(this).attr('cid');
            const node = findTenderTreeNode(parseInt(cid), tenderTree);
            doTrStatus(returnItem, 'show');
        }
    })
});

function doTrStatus(node, status) {
    if (status === 'show') {
        $('.c-body').find('tr[pid="'+ node.sort_id +'"]').show();
        $('.c-body').find('tr[pid="'+ node.sort_id +'"] .fold-switch').attr('title', '收起');
        $('.c-body').find('tr[pid="'+ node.sort_id +'"] .fold-switch i').removeClass('fa-plus-square-o').removeClass('fa-minus-square-o').addClass('fa-minus-square-o');
    } else {
        $('.c-body').find('tr[pid="'+ node.sort_id +'"]').hide();
        $('.c-body').find('tr[pid="'+ node.sort_id +'"] .fold-switch').attr('title', '展开');
        $('.c-body').find('tr[pid="'+ node.sort_id +'"] .fold-switch i').removeClass('fa-minus-square-o').removeClass('fa-plus-square-o').addClass('fa-plus-square-o');

    }
    // 判断是否还有一层
    if (node.children) {
        for (const c of node.children) {
            doTrStatus(c, status);
        }
    }
}
let returnItem;
const findTenderTreeNode = function(sortId, tree) {
    tree.forEach((item) => {
        if (item.sort_id !== undefined && item.sort_id === sortId) {
            returnItem = item;
            return item;
        } else if (item.children && item.children.length > 0) {
            findTenderTreeNode(sortId, item.children);
        }
    });
}