Quellcode durchsuchen

commit 更改人员选择器的分页样式

Hai Lin vor 2 Wochen
Ursprung
Commit
147653546f
1 geänderte Dateien mit 10 neuen und 9 gelöschten Zeilen
  1. 10 9
      templates/add_member.html

+ 10 - 9
templates/add_member.html

@@ -431,16 +431,16 @@
     <!-- 成员选择弹窗 -->
     <div class="modal fade" id="memberSelectModal" tabindex="-1" aria-hidden="true">
         <div class="modal-dialog modal-lg">
-            <div class="modal-content">
-                <div class="modal-header">
+            <div class="modal-content border-0 shadow-lg">
+                <div class="modal-header bg-primary text-white">
                     <h5 class="modal-title"><i class="bi bi-people me-2"></i>选择关联成员</h5>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
                 <div class="modal-body">
                     <div class="mb-4">
                         <div class="input-group">
                             <input type="text" id="member-search" class="form-control" placeholder="搜索成员姓名(支持繁体和简体)">
-                            <button type="button" class="btn btn-outline-primary" onclick="searchMembers()">
+                            <button type="button" class="btn btn-primary" onclick="searchMembers()">
                                 <i class="bi bi-search"></i> 搜索
                             </button>
                         </div>
@@ -451,15 +451,15 @@
                     <div class="d-flex justify-content-between align-items-center">
                         <div class="text-muted small">共 <span id="total-members">0</span> 个成员</div>
                         <nav>
-                            <ul class="pagination pagination-sm">
+                            <ul class="pagination pagination-sm" style="max-width: 300px; overflow-x: auto; padding: 5px;">
                                 <li class="page-item disabled">
-                                    <a class="page-link" href="#" onclick="changePage(0)">上一页</a>
+                                    <a class="page-link" href="#" onclick="changePage(0)">&laquo;</a>
                                 </li>
                                 <li class="page-item active">
                                     <a class="page-link" href="#" onclick="changePage(1)">1</a>
                                 </li>
                                 <li class="page-item">
-                                    <a class="page-link" href="#" onclick="changePage(2)">下一页</a>
+                                    <a class="page-link" href="#" onclick="changePage(2)">&raquo;</a>
                                 </li>
                             </ul>
                         </nav>
@@ -2249,7 +2249,8 @@
         
         membersData.forEach(function(member) {
             const item = document.createElement('div');
-            item.className = 'list-group-item list-group-item-action';
+            item.className = 'list-group-item list-group-item-action shadow-sm hover:bg-light';
+            item.style.transition = 'all 0.2s ease';
             item.onclick = function() {
                 selectMemberById(member.id);
             };
@@ -2259,7 +2260,7 @@
                         <h6 class="mb-0">${member.name}</h6>
                         <small class="text-muted">ID: ${member.id} | ${member.sex === 1 ? '男' : '女'}</small>
                     </div>
-                    <button type="button" class="btn btn-sm btn-outline-primary" onclick="event.stopPropagation(); selectMemberById(${member.id});">
+                    <button type="button" class="btn btn-sm btn-primary" onclick="event.stopPropagation(); selectMemberById(${member.id});">
                         选择
                     </button>
                 </div>