Calculation/app/view/sp_setting/datacollect.ejs

<link href="/public/css/bootstrap/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="/public/css/bootstrap/select2-bootstrap4.min.css">
<script src="/public/js/bootstrap/select2.min.js"></script>
<style>
    .select2-container {
        /*display: inline-block!important;*/
        /*height: 27px;*/
        width: 100% !important;
    }
    .select2-container--bootstrap4 .select2-selection--single {
        height: calc(1.1em + .75rem + 2px) !important;
    }
    /*.select2-container--bootstrap4 .select2-selection {*/
    /*    background-color: #f8f9fa;*/
    /*    !*border-color: #f8f9fa;*!*/
    /*    border: 1px solid #f8f9fa;*/
    /*}*/
    /*.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered:focus{*/
    /*    box-shadow: 0 0 0 0.2rem rgba(216,217,219,.5);*/
    /*}*/
    /*.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered:hover {*/
    /*    background-color: #e2e6ea;*/
    /*    border-color: #dae0e5;*/
    /*}*/
    .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
        line-height: calc(1.1em + .75rem);
        /*color: #007bff!important;*/
        border-radius: 0.2rem;
        /*background-color: #f8f9fa;*/
        /*border-color: #f8f9fa;*/
    }
    .select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
        border-color: #007bff transparent transparent transparent;
        border-width: 4px 3.7px 0;
    }
    .select2-search--dropdown .select2-search__field {
        padding: 0.175rem 0.5rem;
    }
</style>
<% include ./sub_menu.ejs %>
<div class="panel-content">
    <div class="panel-title">
        <div class="title-main">
            <h2>决策大屏
                <a href="#power" data-toggle="modal" data-target="#power" class="btn btn-primary btn-sm pull-right">权限管理</a>
                <a href="javascript:void(0);" id="tenderBtn" class="btn btn-primary btn-sm pull-right mr-1">标段管理</a>
            </h2>
        </div>
    </div>
    <div class="content-wrap">
        <div class="c-body">
            <div class="sjs-height-0">
                <nav class="nav nav-tabs m-3" id="tablist" role="tablist">
                    <% for (let i = 1; i <= 2; i++) { %>
                        <a class="nav-item nav-link<% if ((ctx.subProject.data_collect === 0 && i === 1) || ctx.subProject.data_collect === i) { %> active<% } %>" data-datacollect="<%- i %>" data-toggle="tab" href="#shujudaping-<%- i %>" role="tab">
                            决策大屏<%- ctx.helper.transFormToChinese(i) %><% if (ctx.helper._.indexOf(ctx.subProject.data_collect_pages, i.toString()) !== -1) { %>(已开启<% if (i === ctx.subProject.data_collect) { %>、默认<% } %>)<% } %></a>
                    <% } %>
                    <% if (is_dz1) { %>
                        <a class="nav-item nav-link<% if (ctx.subProject.data_collect === is_dz1) { %> active<% } %>" data-datacollect="<%- is_dz1 %>" data-toggle="tab" href="#shujudaping-<%- is_dz1 %>" role="tab">
                            决策大屏<%- ctx.helper.transFormToChinese(is_dz1) %><% if (ctx.helper._.indexOf(ctx.subProject.data_collect_pages, is_dz1.toString()) !== -1) { %>(已开启<% if (ctx.subProject.data_collect === is_dz1) { %>、默认<% } %>)<% } %></a>
                    <% } %>
                    <% if (is_dz2) { %>
                        <a class="nav-item nav-link<% if (ctx.subProject.data_collect === is_dz2) { %> active<% } %>" data-datacollect="<%- is_dz2 %>" data-toggle="tab" href="#shujudaping-<%- is_dz2 %>" role="tab">
                            决策大屏<%- ctx.helper.transFormToChinese(is_dz2) %><% if (ctx.helper._.indexOf(ctx.subProject.data_collect_pages, is_dz2.toString()) !== -1) { %>(已开启<% if (ctx.subProject.data_collect === is_dz2) { %>、默认<% } %>)<% } %></a>
                    <% } %>
                    <% if (is_dzcb) { %>
                        <a class="nav-item nav-link<% if (ctx.subProject.data_collect === is_dzcb) { %> active<% } %>" data-datacollect="<%- is_dzcb %>" data-toggle="tab" href="#shujudaping-<%- is_dzcb %>" role="tab">
                            成本管理<% if (ctx.helper._.indexOf(ctx.subProject.data_collect_pages, is_dzcb.toString()) !== -1) { %>(已开启<% if (ctx.subProject.data_collect === is_dzcb) { %>、默认<% } %>)<% } %></a>
                    <% } %>
                    <a class="nav-item nav-link<% if (ctx.subProject.data_collect === is_dztz) { %> active<% } %>" data-datacollect="<%- is_dztz %>" data-toggle="tab" href="#shujudaping-<%- is_dztz %>" role="tab">
                        投资总控<% if (ctx.helper._.indexOf(ctx.subProject.data_collect_pages, is_dztz.toString()) !== -1) { %>(已开启<% if (ctx.subProject.data_collect === is_dztz) { %>、默认<% } %>)<% } %></a>
                    <div class="ml-auto">
                        <!--<div class="form-check form-check-inline">-->
                            <!--<input class="form-check-input" type="checkbox" id="show-datacollect" value="option1" <% if (ctx.subProject.data_collect) { %>checked<% } %>>-->
                            <!--<label class="form-check-label" for="show-datacollect">数据大屏显示</label>-->
                        <!--</div>-->
                        <div class="d-inline-block form-group form-check mt-2">
                            <div class="custom-control custom-switch">
                                <input type="checkbox" class="custom-control-input" id="show_datacollect" <% if (ctx.subProject.data_collect !== 0) { %>checked<% } %>>
                                <label class="custom-control-label" for="show_datacollect">开启<i class="fa fa-question-circle text-primary" data-placement="bottom" data-toggle="tooltip" data-original-title="开启后，在决策大屏模块显示"></i></label>
                            </div>
                        </div>
                        <div class="d-inline-block form-group form-check mt-2">
                            <div class="custom-control custom-switch">
                                <input type="checkbox" class="custom-control-input" id="default_datacollect" <% if (ctx.subProject.data_collect !== 0) { %>checked<% } %>>
                                <label class="custom-control-label" for="default_datacollect">默认<i class="fa fa-question-circle text-primary" data-placement="bottom" data-toggle="tooltip" data-original-title="决策大屏第一个显示"></i></label>
                            </div>
                        </div>
                    </div>
                </nav>
                <div class="tab-content m-3">
                    <% for (let i = 1; i <= 2; i++) { %>
                        <div id="shujudaping-<%- i %>" class="tab-pane<% if ((ctx.subProject.data_collect === 0 && i === 1) || ctx.subProject.data_collect === i) { %> active<% } %>"><img src="/public/images/juecedaping0<%- i %>.png" width="100%"></div>
                    <% } %>
                    <% if (is_dz1) { %>
                        <div id="shujudaping-<%- is_dz1 %>" class="tab-pane<% if (ctx.subProject.data_collect === is_dz1) { %> active<% } %>">
                            山东济邹项目定制(MI22U)<img src="/public/images/juecedaping0<%- is_dz1 %>.png" width="100%">
                        </div>
                    <% } %>
                    <% if (is_dz2) { %>
                        <div id="shujudaping-<%- is_dz2 %>" class="tab-pane<% if (ctx.subProject.data_collect === is_dz2) { %> active<% } %>">
                            <span>四川广元路桥集团计量内控管理云平台定制(GY18Y)</span><a class="nav-link" style="display: inline-block;" data-toggle="modal" href="#dpsix-set" data-target="#dpsix-set" title="决策大屏六设置"><i class="fa fa-cog"></i></a><img src="/public/images/juecedaping0<%- is_dz2 %>.png" width="100%">
                        </div>
                    <% } %>
                    <div id="shujudaping-<%- is_dzcb %>" class="tab-pane<% if (ctx.subProject.data_collect === is_dzcb) { %> active<% } %>">
                        <span>成本管理决策大屏定制(Y3T2Q)</span><img src="/public/images/juecedaping0<%- is_dzcb %>.png" width="100%">
                    </div>
                    <% if (is_dztz) { %>
                    <div id="shujudaping-<%- is_dztz %>" class="tab-pane<% if (ctx.subProject.data_collect === is_dztz) { %> active<% } %>">
                        <span>投资总控决策大屏定制(Y3T2Q)</span><a class="nav-link" style="display: inline-block;" data-toggle="modal" href="#dpeight-set" data-target="#dpeight-set" title="决策大屏八设置"><i class="fa fa-cog"></i></a><img src="/public/images/juecedaping0<%- is_dztz %>.png" width="100%">
                    </div>
                    <% } %>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/public/js/setting_datacollect_tender.js"></script>
<script src="/public/js/PinYinOrder.bundle.js"></script>
<script src="/public/js/shares/show_level.js"></script>
<script src="/public/js/tender_showhide.js"></script>
<script src="/public/js/shares/tender_list_order.js"></script>

<script>
    let dataCollectPages = JSON.parse(unescape('<%- escape(JSON.stringify(ctx.subProject.data_collect_pages)) %>'));
    let dataCollect = parseInt('<%- ctx.subProject.data_collect %>');
    const category = JSON.parse(unescape('<%- escape(JSON.stringify(categoryData)) %>'));
    const selfCategoryLevel = '<%- (selfCategoryLevel || '') %>';
    console.log(category);
    const tenders = JSON.parse(unescape('<%- escape(JSON.stringify(tenders)) %>'));
    let dcTenders = JSON.parse(unescape('<%- escape(JSON.stringify(dcTenders)) %>'));
    let addDataCollect = JSON.parse(unescape('<%- escape(JSON.stringify(ctx.subProject.page_show.addDataCollect)) %>'));
    let is_dz1 = <% if (is_dz1) { %>parseInt('<%- is_dz1 %>');<% } else { %>false;<% } %>
    let is_dz2 = <% if (is_dz2) { %>parseInt('<%- is_dz2 %>');<% } else { %>false;<% } %>
    let is_dzcb = <% if (is_dzcb) { %>parseInt('<%- is_dzcb %>');<% } else { %>false;<% } %>
    let is_dztz = <% if (is_dztz) { %>parseInt('<%- is_dztz %>');<% } else { %>false;<% } %>
    $(function () {
        autoFlashHeight();
        // 开启及关闭展示
        $('#show_datacollect').change(function () {
            const activePage = $('#tablist').find('.active').data('datacollect').toString();
            if ($(this).is(':checked')) {
                dataCollectPages.push(activePage);
                dataCollectPages.sort();
                if (dataCollect === 0) {
                    dataCollect = parseInt(activePage);
                    $('#default_datacollect').prop('checked', true);
                }
            } else {
                dataCollectPages.map((val, i) => {
                    if (val === activePage) {
                        dataCollectPages.splice(i, 1);
                    }
                });
                if (dataCollectPages.length === 0) {
                    dataCollect = 0;
                } else if (dataCollectPages.length !== 0 && dataCollect === parseInt(activePage)){
                    dataCollect = parseInt(dataCollectPages[0]);
                }
                $('#default_datacollect').prop('checked', false);
            }
            postData('/sp/' + spid + '/setting/datacollect/save', { type: 'show', data_collect_pages: dataCollectPages, data_collect: dataCollect }, function (result) {
                updateTab();
            })
        });

        $('#default_datacollect').change(function () {
            const activePage = $('#tablist').find('.active').data('datacollect').toString();
            if ($(this).is(':checked')) {
                dataCollect = parseInt(activePage);
                $('#show_datacollect').prop('checked', true);
                if (_.indexOf(dataCollectPages, activePage) === -1) {
                    dataCollectPages.push(activePage);
                    dataCollectPages.sort();
                }
            } else {
                if (dataCollectPages.length === 1) {
                    dataCollect = 0;
                    dataCollectPages = [];
                    $('#show_datacollect').prop('checked', false);
                } else {
                    dataCollect = parseInt(dataCollectPages[0]) === dataCollect ? parseInt(dataCollectPages[1]) : parseInt(dataCollectPages[0]);
                }
            }
            updateTab();
            postData('/sp/' + spid + '/setting/datacollect/save', { type: 'show', data_collect_pages: dataCollectPages, data_collect: dataCollect }, function (result) {
                updateTab();
            })
        })

        function updateTab() {
            for (let i = 1; i <= 2; i++) {
                let msg = '';
                if (_.indexOf(dataCollectPages, i.toString()) !== -1) {
                    msg = '(已开启' + (i=== dataCollect ? '、默认' : '') + ')' ;
                }
                $('#tablist a').eq(i-1).text('决策大屏' + transFormToChinese(i) + msg);
            }
            if (is_dz1) {
                let msg = '';
                if (_.indexOf(dataCollectPages, is_dz1.toString()) !== -1) {
                    msg = '(已开启' + (is_dz1=== dataCollect ? '、默认' : '') + ')' ;
                }
                $('#tablist a').eq(is_dz1-3).text('决策大屏' + transFormToChinese(is_dz1) + msg);
            }
            if (is_dz2) {
                let msg = '';
                if (_.indexOf(dataCollectPages, is_dz2.toString()) !== -1) {
                    msg = '(已开启' + (is_dz2=== dataCollect ? '、默认' : '') + ')' ;
                }
                $('#tablist a').eq(is_dz2-3).text('决策大屏' + transFormToChinese(is_dz2) + msg);
            }
            if (is_dzcb) {
                let msg = '';
                if (_.indexOf(dataCollectPages, is_dzcb.toString()) !== -1) {
                    msg = '(已开启' + (is_dzcb === dataCollect ? '、默认' : '') + ')' ;
                }
                $('#tablist a').eq(is_dzcb-3).text('成本管理' + msg);
            }
            if (is_dztz) {
                let msg = '';
                if (_.indexOf(dataCollectPages, is_dztz.toString()) !== -1) {
                    msg = '(已开启' + (is_dztz=== dataCollect ? '、默认' : '') + ')' ;
                }
                $('#tablist a').eq(is_dztz-3).text('投资总控' + msg);
            }
        }
        $('#tablist a').click(function () {
            const page = parseInt($(this).data('datacollect'));
            if (_.indexOf(dataCollectPages, page.toString()) !== -1) {
                $('#show_datacollect').prop('checked', true);
            } else {
                $('#show_datacollect').prop('checked', false);
            }
            if (page === dataCollect) {
                $('#default_datacollect').prop('checked', true);
            } else {
                $('#default_datacollect').prop('checked', false);
            }
        });
    })
</script>