资金select多选功能

app/public/js/financial_summary.js

@@ -11,8 +11,24 @@ $(document).ready(function() {
         summaryObj.changeHtmlAndCharts(result.tenders, result.transferList, result.transferTenderList, result.payList);
     });
 
+    $('#tender-select').on('changed.bs.select', function (e, clickedIndex, isSelected, previousValue) {
+        const vals = $(this).val();
+        if (vals.length === 0) {
+            $('#tender-select').selectpicker('val', '0');
+        } else if (clickedIndex !== 0 && vals.length > 1 && _.includes(vals, '0')) {
+            $('#tender-select').selectpicker('val', _.without(vals, '0'));
+        } else if (clickedIndex === 0 && isSelected) {
+            $('#tender-select').selectpicker('val', '0');
+        }
+    });
+
     $('#search-btn').click(function () {
-        const tenderSelect = parseInt($('#tender-select').val());
+        const tenderSelects = $('#tender-select').val().map(function (item, index) {
+            return parseInt(item);
+        });
+        // 判断是单还是多个标段
+        const is_single = tenderSelects.length === 1 && tenderSelects[0] !== 0;
+        const is_all = tenderSelects.length === 1 && tenderSelects[0] === 0;
         const startMonth = $('#start-month').val();
         const endMonth = $('#end-month').val();
         const condition = {};
@@ -43,22 +59,23 @@ $(document).ready(function() {
             toastr.warning('请选择开始和结束日期查询');
             return;
         }
-        newTransferTenderList = tenderSelect !== 0 ? _.filter(newTransferTenderList, { tid: tenderSelect }) : newTransferTenderList;
-        newPayList = tenderSelect !== 0 ? _.filter(newPayList, { tid: tenderSelect }) : newPayList;
-        const newTenders = tenderSelect !== 0 ? _.filter(tenders, { id: tenderSelect }) : tenders;
-        summaryObj.changeHtmlAndCharts(newTenders, newTransferList, newTransferTenderList, newPayList, tenderSelect);
+        newTransferTenderList = !is_all ? _.filter(newTransferTenderList, function (item) { return _.includes(tenderSelects, item.tid); }) : newTransferTenderList;
+        newPayList = !is_all ? _.filter(newPayList, function (item) { return _.includes(tenderSelects, item.tid); }) : newPayList;
+        const newTenders = !is_all ? _.filter(tenders, function (item) { return _.includes(tenderSelects, item.tid); }) : tenders;
+        summaryObj.changeHtmlAndCharts(newTenders, newTransferList, newTransferTenderList, newPayList, tenderSelects);
     });
 
     const summaryObj = {
         setTenderSelect: function (tenders) {
-            let tenderSelectHtml = '<option value="0">全部</option>';
+            let tenderSelectHtml = '<option value="0" selected>全部</option>';
             for (const tender of tenders) {
                 tenderSelectHtml += `<option value="${tender.id}">${tender.name}</option>`;
             }
             $('#tender-select').html(tenderSelectHtml);
+            $('#tender-select').selectpicker();
         },
-        changeHtmlAndCharts: function (tenders, transferList, transferTenderList, payList, tenderSelect = 0) {
-            const transfer_price = tenderSelect !== 0 ? _.map(transferTenderList, 'hb_tp') : _.map(transferList, 'total_price');
+        changeHtmlAndCharts: function (tenders, transferList, transferTenderList, payList, tenderSelects = [0]) {
+            const transfer_price = tenderSelects !== [0] ? _.map(transferTenderList, 'hb_tp') : _.map(transferList, 'total_price');
             const transfer_sum_price = ZhCalc.sum(transfer_price);
             const pay_price = _.map(payList, 'total_price');
             const pay_sum_price = ZhCalc.sum(pay_price);

app/view/financial/summary.ejs

@@ -1,13 +1,14 @@
+<link rel="stylesheet" href="/public/css/bootstrap/bootstrap-select.min.css">
 <% include ./sub_menu.ejs %>
 <div class="panel-content">
     <div class="panel-title">
         <div class="title-main  d-flex">
             <% include ./sub_mini_menu.ejs %>
-            <div class="col-8 pl-0">
-                <div class="d-inline-block mr-2 col-sm-3">
+            <div class="col-12 pl-0">
+                <div class="d-inline-block mr-2 col-sm-5">
                     <div class="input-group input-group-sm pr-1">
-                        <select class="form-control form-control-sm" id="tender-select">
-                            <option value="0">全部</option>
+                        <select class="form-control form-control-sm" multiple id="tender-select">
+                            <option value="0" selected>全部</option>
                         </select>
                     </div>
                 </div>
@@ -126,6 +127,7 @@
         </div>
     </div>
 </div>
+<script src="/public/js/bootstrap/bootstrap-select.min.js"></script>
 <script>
     const spid = '<%- ctx.subProject.id %>';
     const usedList = JSON.parse(unescape('<%- escape(JSON.stringify(usedList)) %>'));

app/view/financial/transfer_tender.ejs

@@ -1,3 +1,4 @@
+<link rel="stylesheet" href="/public/css/bootstrap/bootstrap-select.min.css">
 <% include ./sub_menu.ejs %>
 <div class="panel-content">
     <div class="panel-title">
@@ -63,6 +64,7 @@
         </div>
     </div>
 </div>
+<script src="/public/js/bootstrap/bootstrap-select.min.js"></script>
 <script>
     const user_id = <%- ctx.session.sessionUser.accountId %>;
     const spid = '<%- ctx.subProject.id %>';

app/view/financial/transfer_tender_modal.ejs

@@ -46,7 +46,7 @@
             </div>
             <div class="modal-body">
                 <table class="table table-bordered">
-                    <thead>
+                    <thead class="text-center">
                     <tr>
                         <th width="50px">选择</th>
                         <th width="">标段名称</th>
@@ -59,7 +59,7 @@
                         <td><input type="checkbox" value="<%- t.id %>"></td>
                         <td class="text-left"><%- t.name %></td>
                         <td>
-                            <select class="form-control form-control-sm" size="3" multiple>
+                            <select class="form-control form-control-sm selectpicker" title="选择期" multiple>
                                 <% for (const s of t.stages) { %>
                                 <option value="<%- s.order %>">第<%- s.order %>期</option>
                                 <% } %>