Calculation/app/public/js/change_information.js

'use strict';

/**
 * 变更令详细页js
 *
 * @author EllisRan.
 * @date 2018/11/22
 * @version
 */
const is_numeric = (value) => {
    if (typeof(value) === 'object') {
        return false;
    } else {
        return !Number.isNaN(Number(value)) && value.toString().trim() !== '';
    }
};
function sortByCode(a, b) {
    let code1 = a.code.split('-');
    let code2 = b.code.split('-');
    let code1length = code1.length;
    let code2length = code2.length;
    for (let i = 0; i < code1length; i ++) {
        if (i+1 <= code2length) {
            if (code1[i] != code2[i]) {
                if (/^\d+$/.test(code1[i]) && /^\d+$/.test(code2[i])) {
                    return parseInt(code1[i]) - parseInt(code2[i]);
                } else if (!/^\d+$/.test(code1[i]) && /^\d+$/.test(code2[i])) {
                    return 1;
                } else if (/^\d+$/.test(code1[i]) && !/^\d+$/.test(code2[i])) {
                    return -1;
                } else {
                    const str1length = code1[i].length;
                    const str2length = code2[i].length;
                    for (let j = 0; j < str1length; j++) {
                        if (j+1 <= str2length) {
                            if (code1[i].charAt(j) != code2[i].charAt(j)) {
                                return code1[i].charAt(j).charCodeAt() - code2[i].charAt(j).charCodeAt();
                            }  else if (j+1 == str1length && code1[i].charAt(j) == code2[i].charAt(j)) {
                                if (str1length == str2length) {
                                    return 0;
                                } else {
                                    return str1length - str2length;
                                }
                            }
                        } else {
                            if (j+1 >= str1length) {
                                return 1;
                            } else {
                                return -1;
                            }
                        }
                    }
                }
            } else if (i+1 == code1length && code1[i] == code2[i]) {
                if (code1length == code2length) {
                    return 0;
                } else {
                    return code1length - code2length;
                }
            }
        } else {
            if (i+1 >= code1length) {
                return 1;
            } else {
                return -1;
            }
        }
    }
}
$(document).ready(() => {
    //初始化所有附件列表
    getAllList();
    const cca = getLocalCache('change-checkbox-account-' + accountId);
    if (cca !== null && cca !== undefined) {
        $('#customCheck1').prop('checked', cca !== 'false');
    }
    changeSpreadSheet.setColumnVisible(5,$('#customCheck1').is(':checked'), GC.Spread.Sheets.SheetArea.viewport);
    // 变更详情展示和隐藏
    $('.change-detail-checkbox').on('click', function (e) {
        if($(e.target).is('label')){
            return;
        }
        // // 设置用户项目本地记录展示和隐藏情况
        setLocalCache('change-checkbox-account-'+ accountId, $(this).is(':checked'));
        changeSpreadSheet.setColumnVisible(5,$(this).is(':checked'), GC.Spread.Sheets.SheetArea.viewport);
    });

    // 计算最新的变更总额和change的total_price是否一致，不一致则更新
    if (changeStatus !== auditConst.status.checked) {
        calcChangePrice();
        // let new_tp = 0;
        // for (const c of changeList) {
        //     new_tp = ZhCalc.add(new_tp, ZhCalc.round(ZhCalc.mul(ZhCalc.round(c.spamount, findDecimal(c.unit)), ZhCalc.round(c.unit_price, unitPriceUnit)), totalPriceUnit));
        // }
        // console.log(changeTp, new_tp);
        // if (changeTp !== new_tp) {
        //     postData(window.location.pathname + '/save', { type:'update_tp', updateData: new_tp }, function (result) {
        //     });
        // }
    }

    //tab change
    $('a[data-toggle="tab"]').on('shown.bs.tab', function () {
        const tab = $(this).data('tab');
        if (tab === 'bgfujian') {
            $('#fujian_btn').show();
        } else {
            $('#fujian_btn').hide();
        }
    });

    $('#add-bj').on('click', 'input[type="checkbox"]', function () {
        const isCheck = $(this).prop('checked');
        if (isCheck) {
            $('#add-bj input[type="checkbox"]').each(function () {
                $(this).prop('checked', false)
            });
            $(this).prop('checked', true)
        }
    });
    $('#bg-copy').click(function() {
        const cid = $('#add-bj input:checked').data('id');
        postData(window.location.pathname + '/copy', cid, function () {
            window.location.reload();
        })
    });
    // 上传附件
    $('#upload-file-btn').click(function () {
        const files = $('#upload-file')[0].files;
        const formData = new FormData();
        formData.append('cid', $('#changeId').val());
        formData.append('tid', $('#tenderId').val());
        for (const file of files) {
            if (file === undefined) {
                toastr.error('未选择上传文件！');
                return false;
            }
            const filesize = file.size;
            if (filesize > 30 * 1024 * 1024) {
                toastr.error('文件大小过大！');
                return false;
            }
            const fileext = '.' + file.name.toLowerCase().split('.').splice(-1)[0];
            if (whiteList.indexOf(fileext) === -1) {
                toastr.error('只能上传指定格式的附件！');
                return false;
            }
            formData.append('size', filesize);
            formData.append('file[]', file);
        }
        if (auditList.findIndex(item => item.uid === parseInt(accountId)) === -1 && !touristPermission) {
            return toastr.error('暂无权限上传!');
        }
        postDataWithFile(window.location.pathname + '/file/upload', formData, function (data) {
            attData = data.concat(attData);
            // 重新生成List
            getAllList();
            $('#addfujian').modal('hide');
            // let html = '';
            // let index = $('#attList tr').length + 1;
            // for (const fileInfo of data) {
            //     html += '<tr> ' +
            //         `<td width="20"><input type="checkbox" class="check-file" file-id=${fileInfo.id}></td>` +
            //         '<td>' + index + '</td> ' +
            //         `<td><a href="javascript: void(0);" class="file-atn" f-id="${fileInfo.id}">${fileInfo.filename}${fileInfo.fileext}</a></td>`+
            //         '<td>' + fileInfo.in_time + '<br>' + fileInfo.filesize + '</td> ' +
            //         `<td><a href="/change/download/file/${fileInfo.id}" class="mr-2" title="下载"><span class="fa fa-download text-primary"></span></a>`+
            //         ( auditStatus === 4 ?
            //             fileInfo.extra_upload ? `<a class="mr-2 delete-file" data-attid="${fileInfo.id}"  title="删除附件"><span class="fa fa-trash text-danger"></span></a>` : ''
            //             : ` <a href="javascript:void(0);" class="mr-2 delete-file" data-attid="${fileInfo.id}"  title="删除附件"><span class="fa fa-trash text-danger"></span></a>`)+
            //         `</td>`+
            //         // '<td> <a class="btn btn-light btn-sm delete-file" data-attid="' + fileInfo.id + '"  title="删除附件"><span class="fa fa-trash text-danger"></span></a> </td> ' +
            //         '</tr>';
            //     ++index;
            // }
            // $('#attList').append(html);
        }, function () {
        });
        $('#upload-file').val('');

    });

    // 删除附件
    $('body').on('click', '.delete-file', function () {
        let attid = $(this).data('attid');
        let self = $(this);
        const data = {id: attid};
        postData(window.location.pathname + '/file/delete', data, function (result) {
            // self.parents('tr').remove();
            // // 重新排序
            // let newsort = 1;
            // $('#attList tr').each(function(){
            //     $(this).children('td').eq(1).text(newsort);
            //     newsort++;
            // });
            // 删除到attData中
            const att_index = attData.findIndex(function (item) {
                return item.id === parseInt(attid);
            });
            attData.splice(att_index, 1);
            // 重新生成List

            if ($('#attList tr').length === 1) {
                getAllList(parseInt($('#currentPage').text()) - 1);

            } else {
                getAllList(parseInt($('#currentPage').text()));
            }
        });
    });
    // /change/download/file/
    $('#attList').on('click', '.file-atn', function() {
        const id = $(this).attr('f-id');
        postData(`/change/download/file/${id}`, {}, (data) => {
            const { filepath } = data;
            $('#file-upload').attr('href', filepath);
            $('#file-upload')[0].click();
        })
    });

    $('#attList').on('click', '.check-file', function() {
        const checkedList = $('#attList').find('input:checked');
        const childs = $('#attList').children().length;
        const checkBox = $('#check-all-file');
        if (checkedList.length === childs) {
            checkBox.prop("checked", true);
        } else {
            checkBox.prop("checked", false);
        }
    });
    $('#check-all-file').click(function() {
        const isCheck = $(this).is(':checked');
        $('#attList').children().each(function() {
            $(this).find('input:checkbox').prop("checked", isCheck);
        })
    });

    $('#bach-download').click(function() {
        const fileIds = [];
        $( '#attList .check-file:checked').each(function() {
            const fileId = $(this).attr('file-id');
            fileId && fileIds.push(fileId);
        });

        if (fileIds.length) {
            // const tid = $('#tenderId').val();
            // const cid = $('#changeId').val();
            // $('#downloadZip').attr('href', `/tender/${tid}/change/${cid}/download/compresse-file?fileIds=${JSON.stringify(fileIds)}`);
            // $('#downloadZip')[0].click();
            if (fileIds.length > 20) {
              return toastr.warning(`最大允许20个文件(当前${fileIds.length}个)`);
            }
            const tid = $('#tenderId').val();
            const cid = $('#changeId').val();

            toastr.success('正在进行压缩文件...', '', { timeOut: 0, extendedTimeOut: 0});
            $(this).attr('disabled', "true");
            const btn = $(this);

            const fileArr = [];
            for (const id of fileIds) {
                const fileInfo = _.find(currPageFileData, { id: parseInt(id) });
                fileArr.push({
                    url: fileInfo.orginpath, //文件的oss存储路径 (必填)
                    name: fileInfo.filename, // 文件名 (可选, 不需要填扩展名)
                    foldPath: '' // (可选, 文件在压缩包中的存储路径)
                });
            }
            const packageName = `${tenderName}-工程变更-${changeName}-附件.zip`;
            try {
                zipOss.downloadFromAliOss(fileArr, packageName, btn);
            } catch (e) {
                btn.removeAttr('disabled');
                toastr.clear();
                toastr.error('批量下载失败');
            }
            // postCompressFile(`/tender/${tid}/change/${cid}/download/compresse-file`, {fileIds}, function(result) {
            //   toastr.clear();
            //   toastr.success('压缩文件成功');
            //   btn.removeAttr('disabled');
            //   const href = window.URL.createObjectURL(result);
            //   $('#zipDown').attr('href', href);
            //   $('#zipDown').attr('download', `${tenderName}-工程变更-${changeName}-附件.zip`);
            //   $("#zipDown")[0].click();
            // }, () => {
            //   btn.removeAttr('disabled');
            //   toastr.clear();
            //   toastr.error('批量下载失败');
            // });
        }
    });

    // 差值对比信息获取
    let czSpread = null;
    const czSpreadSetting = {
        cols: [
            {title: '清单编号', colSpan: '1', rowSpan: '2', field: 'code', hAlign: 0, width: 80},
            {title: '名称', colSpan: '1', rowSpan: '2', field: 'name', hAlign: 0, width: 120},
            {title: '单位', colSpan: '1', rowSpan: '2', field: 'unit', hAlign: 1, width: 60},
            {title: '单价', colSpan: '1', rowSpan: '2', field: 'unit_price', hAlign: 2, width: 60, type: 'Number', getValue: 'getValue.unit_price'},
            {title: '变更方案|数量', colSpan: '2|1', rowSpan: '1|1', field: 'pamount', hAlign: 2, width: 60, type: 'Number', getValue: 'getValue.pamount'},
            {title: '|金额', colSpan: '|1', rowSpan: '|1', field: 'pa_tp', hAlign: 2, width: 80, type: 'Number', getValue: 'getValue.pa_tp'},
            {title: '变更令|数量', colSpan: '2|1', rowSpan: '1|1', field: 'camount', hAlign: 2, width: 60, type: 'Number', getValue: 'getValue.camount'},
            {title: '|金额', colSpan: '|1', rowSpan: '|1', field: 'ca_tp', hAlign: 2, width: 80, type: 'Number', getValue: 'getValue.ca_tp'},
            {title: '差值对比|数量', colSpan: '2|1', rowSpan: '1|1', field: 'czamount', hAlign: 2, width: 60, type: 'Number', getValue: 'getValue.czamount'},
            {title: '|金额', colSpan: '|1', rowSpan: '|1', field: 'cz_tp', hAlign: 2, width: 80, type: 'Number', getValue: 'getValue.cz_tp'},
        ],
        emptyRows: 0,
        headRows: 2,
        headRowHeight: [25, 25],
        defaultRowHeight: 21,
        headerFont: '12px 微软雅黑',
        font: '12px 微软雅黑',
        readOnly: true,
        localCache: {
            key: 'changes-cz',
            colWidth: true,
        }
    };
    const czCol = {
        getValue: {
            unit_price: function(data) {
                return ZhCalc.round(data.unit_price, unitPriceUnit);
            },
            pa_tp: function (data) {
                return ZhCalc.round(ZhCalc.mul(ZhCalc.round(data.unit_price, unitPriceUnit), ZhCalc.round(data.pamount, findDecimal(data.unit))), totalPriceUnit);
            },
            ca_tp: function (data) {
                return ZhCalc.round(ZhCalc.mul(ZhCalc.round(data.unit_price, unitPriceUnit), ZhCalc.round(data.camount, findDecimal(data.unit))), totalPriceUnit);
            },
            pamount: function (data) {
                return ZhCalc.round(data.pamount, findDecimal(data.unit));
            },
            camount: function (data) {
                return ZhCalc.round(data.camount, findDecimal(data.unit));
            },
            czamount: function (data) {
                return ZhCalc.sub(ZhCalc.round(data.camount, findDecimal(data.unit)), ZhCalc.round(data.pamount, findDecimal(data.unit)));
            },
            cz_tp: function (data) {
                return ZhCalc.round(ZhCalc.mul(ZhCalc.round(data.unit_price, unitPriceUnit), ZhCalc.round(ZhCalc.sub(ZhCalc.round(data.camount, findDecimal(data.unit)), ZhCalc.round(data.pamount, findDecimal(data.unit))), findDecimal(data.unit))), totalPriceUnit);
            },
        }
    };
    const czSpreadObj = {
        makeBackColor: function () {
            const rowCount = czSpread.getActiveSheet().getRowCount();
            for (let i = 0; i < rowCount; i++) {
                if (czSpread.getActiveSheet().zh_data[i].color) czSpread.getActiveSheet().getRange(i, -1, 1, -1).backColor('#f5c6cb');
            }
        },
        makeSjsFooter: function () {
            // 增加汇总行并设为锁定禁止编辑状态
            czSpread.getActiveSheet().addRows(czSpread.getActiveSheet().getRowCount(), 1);
            czSpread.getActiveSheet().setValue(czSpread.getActiveSheet().getRowCount() - 1, 0, '合计');
            czSpread.getActiveSheet().setStyle(czSpread.getActiveSheet().getRowCount() - 1, -1, style1);
            czSpreadObj.countSum();
        },
        countSum: function () {
            const rowCount = czSpread.getActiveSheet().getRowCount();
            let pSum = 0,
                cSum = 0,
                czSum = 0;
            for (let i = 0; i < rowCount - 1; i++) {
                pSum = ZhCalc.add(pSum, czSpread.getActiveSheet().getValue(i, 5));
                cSum = ZhCalc.add(cSum, czSpread.getActiveSheet().getValue(i, 7));
                czSum = ZhCalc.add(czSum, czSpread.getActiveSheet().getValue(i, 9));
            }
            czSpread.getActiveSheet().setValue(czSpread.getActiveSheet().getRowCount() - 1, 5, pSum !== 0 ? pSum : null);
            czSpread.getActiveSheet().setValue(czSpread.getActiveSheet().getRowCount() - 1, 7, cSum !== 0 ? cSum : null);
            czSpread.getActiveSheet().setValue(czSpread.getActiveSheet().getRowCount() - 1, 9, czSum !== 0 ? czSum : null);
        },
    };

    $('#bgfadb').on('shown.bs.modal', function () {
        if (!czSpread) {
            czSpread = SpreadJsObj.createNewSpread($('#cz-spread')[0]);
            SpreadJsObj.initSpreadSettingEvents(czSpreadSetting, czCol);
            SpreadJsObj.initSheet(czSpread.getActiveSheet(), czSpreadSetting);
        }
        const cList = [];
        const newChangeList = _.cloneDeep(changeList);
        for (const cl of newChangeList) {
            const cIndex = _.findIndex(cList, { code: cl.code, name: cl.name, unit: cl.unit, unit_price: cl.unit_price});
            if (cIndex !== -1) {
                cList[cIndex].spamount = ZhCalc.add(cList[cIndex].spamount, cl.spamount);
            } else {
                cList.push(cl);
            }
        }
        // 生成差值对比数据列表
        const czList = [];
        const newPlanList = _.cloneDeep(planList);
        for (const c of cList) {
            const planInfo = _.find(newPlanList, { code: c.code, name: c.name, unit: c.unit, unit_price: c.unit_price });
            const pamount = planInfo ? planInfo.spamount : null;
            let color = true;
            if (planInfo) {
                _.remove(newPlanList, (item) => item === planInfo);
                if ((pamount ? pamount : 0) === (c.spamount ? c.spamount : 0)) {
                    color = false;
                }
            }
            czList.push({ code: c.code, name: c.name, unit: c.unit, unit_price: c.unit_price, camount: c.spamount, pamount, color });
        }
        if (newPlanList.length > 0) {
            for (const np of newPlanList) {
                czList.push({ code: np.code, name: np.name, unit: np.unit, unit_price: np.unit_price, camount: null, pamount: np.spamount, color: true });
            }
        }
        if (czList.length > 0) {
            // 按清单编号排序
            czList.sort(sortByCode);
        }
        console.log(czList);
        // sjs设置
        SpreadJsObj.loadSheetData(czSpread.getActiveSheet(), SpreadJsObj.DataType.Data, czList);
        czSpreadObj.makeBackColor();
        czSpreadObj.makeSjsFooter();
    });

    $.subMenu({
        menu: '#sub-menu', miniMenu: '#sub-mini-menu', miniMenuList: '#mini-menu-list',
        toMenu: '#to-menu', toMiniMenu: '#to-mini-menu',
        key: 'menu.1.0.0',
        miniHint: '#sub-mini-hint', hintKey: 'menu.hint.1.0.1',
        callback: function (info) {
            if (info.mini) {
                $('.panel-title').addClass('fluid');
                $('#sub-menu').removeClass('panel-sidebar');
            } else {
                $('.panel-title').removeClass('fluid');
                $('#sub-menu').addClass('panel-sidebar');
            }
            autoFlashHeight();
            changeSpread.refresh();
        }
    });

    // 切换页数
    $('.page-select').on('click', function () {
        const totalPageNum = parseInt($('#totalPage').text());
        const lastPageNum = parseInt($('#currentPage').text());
        const status = $(this).attr('content');
        if (status === 'pre' && lastPageNum > 1) {
            getAllList(lastPageNum-1);
            $('#showAttachment').hide();
            $('#syfujian .check-all-file').prop('checked', false)
        } else if (status === 'next' && lastPageNum < totalPageNum) {
            getAllList(lastPageNum+1);
            $('#showAttachment').hide();
            $('#syfujian .check-all-file').prop('checked', false)
        }
    });

    // 项目节信息获取
    const xmjSpreadSetting = {
        cols: [
            {title: '项目节编号', colSpan: '1', rowSpan: '2', field: 'xmj_code', hAlign: 0, width: 80},
            // {title: '名称', colSpan: '1', rowSpan: '2', field: 'name', hAlign: 0, width: 120},
            {title: '细目', colSpan: '1', rowSpan: '2', field: 'xmj_jldy', hAlign: 0, width: 100},
            {title: '单位工程', colSpan: '1', rowSpan: '2', field: 'xmj_dwgc', hAlign: 0, width: 100},
            {title: '分部工程', colSpan: '1', rowSpan: '2', field: 'xmj_fbgc', hAlign: 0, width: 100},
            {title: '分项工程', colSpan: '1', rowSpan: '2', field: 'xmj_fxgc', hAlign: 0, width: 100},
            {title: '计量单元', colSpan: '1', rowSpan: '2', field: 'bwmx', hAlign: 0, width: 100},
            {title: '数量', colSpan: '1', rowSpan: '2', field: 'oamount', hAlign: 2, width: 80},
        ],
        emptyRows: 0,
        headRows: 1,
        headRowHeight: [25, 25],
        defaultRowHeight: 21,
        headerFont: '12px 微软雅黑',
        font: '12px 微软雅黑',
        readOnly: true,
        localCache: {
            key: 'changes-xmj',
            colWidth: true,
        }
    };
    SpreadJsObj.initSheet(xmjSpread.getActiveSheet(), xmjSpreadSetting);

    $.divResizer({
        select: '#right-spr',
        callback: function () {
            changeSpread.refresh();
            xmjSpread.refresh();
            const width = (($('#right-view').width()/$('#right-view').parent('div').width())*100).toFixed();
            setLocalCache('change_information_width', width);
            $('#left-header').css('min-width', (100 - parseFloat(getLocalCache('change_information_width'))) + '%');
        }
    });

    // 根据浏览器记录展开收起
    if (getLocalCache('change_information_width')) {
        $('#left-view').css('width', (100 - parseFloat(getLocalCache('change_information_width'))) + '%');
        $('#right-view').css('width', getLocalCache('change_information_width') + '%');
        $('#left-header').css('min-width', (100 - parseFloat(getLocalCache('change_information_width'))) + '%');
        changeSpread.refresh();
        xmjSpread.refresh();
    } else {
        $('#left-header').css('min-width', '33.33%');
    }
});

function calcChangePrice() {
    let positive_tp = 0;
    let negative_tp = 0;
    let new_tp = 0;
    for (const c of changeList) {
        if (c.spamount) {
            const price = ZhCalc.round(ZhCalc.mul(ZhCalc.round(c.spamount, findDecimal(c.unit)), ZhCalc.round(c.unit_price, unitPriceUnit)), totalPriceUnit);
            new_tp = ZhCalc.add(new_tp, price);
            if (price >= 0) {
                positive_tp = ZhCalc.add(positive_tp, price);
            } else {
                negative_tp = ZhCalc.add(negative_tp, price);
            }
        }
    }
    const updateTpList = {};
    let updateFlag = false;
    if (changeTp !== new_tp) {
        updateTpList.total_price = new_tp;
        updateFlag = true;
    }
    if (positive_tp !== changePp) {
        updateTpList.positive_tp = positive_tp;
        updateFlag = true;
    }
    if (negative_tp !== changeNp) {
        updateTpList.negative_tp = negative_tp;
        updateFlag = true;
    }
    if (updateFlag) {
        console.log(updateTpList);
        postData(window.location.pathname + '/save', { type:'update_tp', updateData: updateTpList }, function () {
            changePp = positive_tp;
            changeNp = negative_tp;
            changeTp = new_tp;
        });
    }
}

function findDecimal(unit) {
    let value = precision.other.value;
    const changeUnits = precision;
    for (const d in changeUnits) {
        if (changeUnits[d].unit !== undefined && changeUnits[d].unit === unit) {
            value = changeUnits[d].value;
            break;
        }
    }
    return value;
}
// 生成附件列表
function getAllList(currPageNum = 1) {
    // 每页最多几个附件
    const pageCount = 20;
    // 附件总数
    const total = attData.length;
    // 总页数
    const pageNum = Math.ceil(total/pageCount);
    $('#totalPage').text(pageNum);
    $('#currentPage').text(total === 0 ? 0 : currPageNum);
    // 当前页附件内容
    const currPageAttData = attData.slice((currPageNum-1)*pageCount, currPageNum*pageCount);
    currPageFileData = currPageAttData;
    let html = '';
    // '/tender/' + tender.id + '/measure/stage/' + stage.order + '/download/file/' + att.id
    for(const [index,att] of currPageAttData.entries()) {
        html += `<tr>
        <td width="25"><input type="checkbox" class="check-file" file-id=${att.id}></td>
        <td>${((currPageNum-1)*pageCount)+index+1}</td>
        <td><a href="${att.filepath}" target="_blank" class="pl-0 col-11 att-file-name" file-id=${att.id}>${att.filename}${att.fileext}</a></td>
        <td>${moment(att.in_time * 1000).format('YYYY-MM-DD')}<br>${bytesToSize(att.filesize)}</td>
        <td>
            <a href="/change/download/file/${att.id}" class="mr-2" title="下载"><span class="fa fa-download text-primary"></span></a>`
        html += (att.uid === accountId && (auditStatus === 4 ? Boolean(att.extra_upload) : true)) ?
            `<a href="javascript:void(0)" class="mr-2 delete-file" data-attid="${att.id}" title="删除附件"><span class="fa fa-trash text-danger"></span></a>` : '';
        html += `</td>`;
    }
    $('#attList').html(html);
    $('#attList').on('click', 'tr', function() {
        $('#attList tr').removeClass('bg-light');
        $(this).addClass('bg-light');
    })
}

function bytesToSize(bytes) {
    if (parseInt(bytes) === 0) return '0 B';
    const k = 1024;
    const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
    const i = Math.floor(Math.log(bytes) / Math.log(k));
    // return (bytes / Math.pow(k, i)) + ' ' + sizes[i];
    return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
}