调整标段权限设置表头

app/public/js/shares/tender_permission.js

@@ -15,20 +15,20 @@ const MemberPermission = function() {
     let oldSearchVal = null;
 
     const syncSelectedMarks = function() {
-        const selectedUids = new Set(); 
+        const selectedUids = new Set();
         $('#member-list tr[uid]').each(function() {
-            const uid = parseInt($(this).attr('uid'), 10); 
+            const uid = parseInt($(this).attr('uid'), 10);
             if (!isNaN(uid)) {
                 selectedUids.add(uid);
             }
         });
         $('.dropdown-menu .book-list dd[data-id]').each(function() {
-            const userId = parseInt($(this).data('id'), 10); 
-            const $mark = $(this).find('.selected-mark'); 
+            const userId = parseInt($(this).data('id'), 10);
+            const $mark = $(this).find('.selected-mark');
 
             if (!isNaN(userId) && $mark.length > 0) {
                 if (selectedUids.has(userId)) {
-                    $mark.show(); 
+                    $mark.show();
                 } else {
                     $mark.hide();
                 }
@@ -139,15 +139,26 @@ const MemberPermission = function() {
         data.parts = permissionBlock.map(x => { return x.key; });
         const result = await postDataAsync(setting.loadUrl, data );
         $('#member-list').html(getPermissionHtml(result));
+        $("#member-table").bootstrapTable('resetView');
         syncSelectedMarks();
     };
-
     const show = async function(info) {
         setting = info;
-        await loadMemberPermission();
         $('#member').modal('show');
+        await loadMemberPermission();
         syncSelectedMarks();
     };
+    let first = 1;
+    $('#member').on('shown.bs.modal', async function () {
+        if (first) {
+            const option = {
+                locale: 'zh-CN',
+                height: 400,
+            }
+            $("#member-table").bootstrapTable('destroy').bootstrapTable(option);
+            first = 0;
+        }
+    });
 
     $('#member').on('click', 'a[name="del-member"]', function () {
         $(this).parent().parent().remove();

app/view/shares/tender_permission_modal.ejs

@@ -1,3 +1,18 @@
+<link href="/public/css/bootstrap/bootstrap-table.min.css" rel="stylesheet">
+<link href="/public/css/bootstrap/bootstrap-table-fixed-columns.min.css" rel="stylesheet">
+<style>
+    /*.bootstrap-table .fixed-table-container.fixed-height:not(.has-footer) {*/
+    /*border-bottom: 0;*/
+    /*}*/
+    @-moz-document url-prefix() {
+        table {
+            table-layout: fixed;
+        }
+    }
+    .customize-header tr th .th-inner{
+        padding: 0.3rem!important;
+    }
+</style>
 <!--成员管理-->
 <div class="modal" id="member" data-backdrop="static">
     <div class="modal-dialog modal-lg" role="document">
@@ -5,55 +20,55 @@
             <div class="modal-header">
                 <h5 class="modal-title">成员管理</h5>
             </div>
-            <div class="modal-body" style="overflow-y: auto; height: 480px">
-                <div class="dropdown">
-                    <button class="btn btn-outline-primary btn-sm dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                        添加用户
-                    </button>
-                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="width:220px">
-                        <div class="mb-2 p-2"><input class="form-control form-control-sm" placeholder="姓名/手机 检索" id="member-search" autocomplete="off"></div>
-                        <dl class="list-unstyled book-list">
-                            <% accountGroup.forEach((group, idx) => { %>
-                            <dt><a href="javascript: void(0);" class="acc-btn" data-groupid="<%- idx %>" data-type="hide"><i class="fa fa-plus-square"></i></a> <%- group.groupName %></dt>
-                            <div class="dd-content" data-toggleid="<%- idx %>">
-                                <% group.groupList.forEach(item => { %>
-                                <dd class="border-bottom p-2 mb-0 " data-id="<%- item.id %>" >
-                                    <p class="mb-0 d-flex"><span class="text-primary"><%- item.name %></span><span
-                                                class="ml-auto"><%- item.mobile %></span>
-                                    <span class="selected-mark text-success ml-2" style="display:none;"><i class="fa fa-check"></i></span>
-                                    </p>
-                                    <span class="text-muted"><%- item.role %></span>
-                                </dd>
-                                <% });%>
-                            </div>
-                            <% }) %>
-                        </dl>
+            <div class="modal-body pt-0">
+                <div class="d-flex flex-row bg-graye">
+                    <div class="dropdown p-2">
+                        <button class="btn btn-outline-primary btn-sm dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                            添加用户
+                        </button>
+                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="width:220px">
+                            <div class="mb-2 p-2"><input class="form-control form-control-sm" placeholder="姓名/手机 检索" id="member-search" autocomplete="off"></div>
+                            <dl class="list-unstyled book-list">
+                                <% accountGroup.forEach((group, idx) => { %>
+                                <dt><a href="javascript: void(0);" class="acc-btn" data-groupid="<%- idx %>" data-type="hide"><i class="fa fa-plus-square"></i></a> <%- group.groupName %></dt>
+                                <div class="dd-content" data-toggleid="<%- idx %>">
+                                    <% group.groupList.forEach(item => { %>
+                                    <dd class="border-bottom p-2 mb-0 " data-id="<%- item.id %>" >
+                                        <p class="mb-0 d-flex"><span class="text-primary"><%- item.name %></span><span
+                                                    class="ml-auto"><%- item.mobile %></span>
+                                        <span class="selected-mark text-success ml-2" style="display:none;"><i class="fa fa-check"></i></span>
+                                        </p>
+                                        <span class="text-muted"><%- item.role %></span>
+                                    </dd>
+                                    <% });%>
+                                </div>
+                                <% }) %>
+                            </dl>
+                        </div>
                     </div>
                 </div>
-                <div class="mt-1">
-                    <table class="table table-bordered">
-                        <thead class="text-center">
-                        <tr>
-                            <th class="align-middle" rowspan="2">成员名称</th>
-                            <th class="align-middle" rowspan="2">角色/职位</th>
-                            <% for (const pb of permissionBlock) { %>
-                            <th colspan="<%- pb.permission.filter(x => { return !x.isDefault; }).length %>"><%- pb.name %></th>
+                <table class="table table-bordered" data-height="400" data-toggle="table" id="member-table">
+                    <thead class="text-center">
+                    <tr>
+                        <th class="align-middle" rowspan="2">成员名称</th>
+                        <th class="align-middle" rowspan="2">角色/职位</th>
+                        <% for (const pb of permissionBlock) { %>
+                        <th colspan="<%- pb.permission.filter(x => { return !x.isDefault; }).length %>"><%- pb.name %></th>
+                        <% } %>
+                        <th class="align-middle" rowspan="2">操作</th>
+                    </tr>
+                    <tr>
+                        <% for (const pb of permissionBlock) { %>
+                            <% for (const p of pb.permission) { %>
+                                <% if (p.isDefault) continue; %>
+                                <th><%- p.title %></th>
                             <% } %>
-                            <th class="align-middle" rowspan="2">操作</th>
-                        </tr>
-                        <tr>
-                            <% for (const pb of permissionBlock) { %>
-                                <% for (const p of pb.permission) { %>
-                                    <% if (p.isDefault) continue; %>
-                                    <th><%- p.title %></th>
-                                <% } %>
-                            <% } %>
-                        </tr>
-                        </thead>
-                        <tbody id="member-list">
-                        </tbody>
-                    </table>
-                </div>
+                        <% } %>
+                    </tr>
+                    </thead>
+                    <tbody id="member-list">
+                    </tbody>
+                </table>
             </div>
             <div class="modal-footer">
                 <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">取消</button>
@@ -62,6 +77,8 @@
         </div>
     </div>
 </div>
+<script src="/public/js/bootstrap/bootstrap-table.min.js"></script>
+<script src="/public/js/bootstrap/locales/bootstrap-table-zh-CN.min.js"></script>
 <script>
     const accountList = JSON.parse(unescape('<%- escape(JSON.stringify(accountList)) %>'));
     const accountGroup = JSON.parse(unescape('<%- escape(JSON.stringify(accountGroup)) %>'));