From 40be56a31b2cb2be601dc1b1da345fa6920aa187 Mon Sep 17 00:00:00 2001
From: "XIAJI-NEW\\qax" <rembme@163.com>
Date: Tue, 11 Nov 2025 13:12:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=9C=A8=E2=80=9C=E8=81=94?=
 =?UTF-8?q?=E7=B3=BB=E4=BA=BA=E4=BF=A1=E6=81=AF=E2=80=9D=E8=BF=99=E9=87=8C?=
 =?UTF-8?q?=EF=BC=8C=E5=8F=AF=E4=BB=A5=E5=A4=9A=E9=80=89=E7=9A=84js?=
 =?UTF-8?q?=E4=BB=A3=E7=A0=81=EF=BC=8C=E5=B9=B6=E5=A2=9E=E5=8A=A0=E4=B8=80?=
 =?UTF-8?q?=E4=B8=AA=E6=B8=85=E7=A9=BA=E5=A4=9A=E9=80=89=E7=9A=84=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../huodong/__pycache__/views.cpython-311.pyc | Bin 19829 -> 20309 bytes
 fzjgact/huodong/templates/contact_list.html   | 328 ++++++++++--------
 fzjgact/huodong/views.py                      |  13 +-
 3 files changed, 185 insertions(+), 156 deletions(-)

diff --git a/fzjgact/huodong/__pycache__/views.cpython-311.pyc b/fzjgact/huodong/__pycache__/views.cpython-311.pyc
index 98f91c705c59b981cb99cf5e6940f2307e6a5211..07310f25e03b26757e495b2a7077bb27d27fc087 100644
GIT binary patch
delta 846
zcmY*XT}TvB6ux(MXa8L{x7j7ih}3Mb1zqdG&~4XpqXi|<he&K(XC@n6SG_yE)JP&e
z_#pUmjfDs?0xJqig`Rziia^&klzoyOBf^J#5yZ~j%@q$b-^}^W{W#}-_wGK!KjyLf
zRY{2hK{%JowBO++_fiw?psP)**2{`{92uAnyZu&v5hL^#({j%#KX35FYnXMOsS086
z?<{n^(nsHfymSq|8=;dFR|#(2cDMwgKAt{qI7{cNJf0DY?mkxN69ZnWVjoAx1a{W%
zw#~2@R>NjsgELHu<GE$Tt_w$M11V0!zG#B^;4MTu5?yWNJ|yHNK+Yu(CiS?iOUd|v
zN<CqpXAI~x>O}_XY8=6^%MT_Wof1mv)sR3BO5Nu77ypxxh%?+|Q#&GcAQHJ8pVEmo
zl(T9nMeEgckt6M_iK$0Zs2r~E90spa4M2^eb)mcPEXbcL*2J&kmzr-io3XBqSXU+{
zWn&Ulr{%OZtIhP!^%qx@YEbXtOCrvd^pJQ`ejsUzBxy;yd+h}tqv>$en>&$G6RNDM
zid0ylrs&Ub$nPZ6ASUM-lmWoFLkUf%wUN3f4${IH_n|-<ij(+2-Xrph31(Q?QEZta
ze;J!Ma+m$x0!Xpza;_Mp3eqEo6B@X)50uJWxDGIiwuLiuooQ*-DJ|U12(?+EcC?Lt
zk6gLo+d*c&emif{>wBAl$VMQtT9FAvvw<j>krBGHLidDY%PH(2Y_H#Pd7ln1JX-e$
zGyY%}&=s7xNh_Ksx$>HorRD>U!<a6&{JCI;wuEP30mzx<K}994Fcje!nct5I(@)VL
z?*w9MWj{(xm27Il^87*P&mh0KJzL|zpz<)GhREp^8vDqVR^x^pRD=$Cr?vba-uLdX

delta 509
zcmcaQkMZj)M!w~|yj%=G@XCrIbB+B*zKynwLX!{J9$*!&VJTsqT<9t@`JM{L<kxn>
zjI5I{sEAG$u@_-v1F}RW7pdAv)v}iGfV4wE77L8EfPL~uA!T8<6!sQ|5;mA9149<a
zWLW{pQ1%+u8nznt8pax?8s-#^Ic&8YCBg_*H4G`7H5|*B85mXrF$4rNXma@#Spqpl
zi-E)~p5*+zlEmba_`Jm2)S@1s(Byi@g^cx+6`kBzi~2zPDknPuuA&JbElMCl2qbvk
z$<Uay$Q8tQ0}&v@ie7<;i6G(~h)4qw??HqokSOK^5|h21WtBby8L5mw5h)<i!0<po
zd<yq;{z?1`I4%lkUJ=l2@SNP`Y$`4Ifq{`#>jnq^RKppS7lbu03Ts{gk{p^H?30;Y
zdYGhDHcxc<&&2edVe%yRcWS>t7X1bhe}Kd-mgM}D)FNLH{|ATwJLV_D<YgX4tc*Z=
zdp6(oC}LItxupoiFERwN)Io$Qkod)6lbfGXnv-f*B)GZQXB!j03Zvx*1~}n2*}`8I
E0ENYUnE(I)

diff --git a/fzjgact/huodong/templates/contact_list.html b/fzjgact/huodong/templates/contact_list.html
index cb1d4a3..e882b53 100644
--- a/fzjgact/huodong/templates/contact_list.html
+++ b/fzjgact/huodong/templates/contact_list.html
@@ -7,9 +7,9 @@
     <!-- 新增筛选表单 -->
     <form method="GET" class="mb-4 p-4 bg-gray-100 rounded-lg" id="filterForm">
         <div class="flex flex-wrap gap-4">
-            <!-- 分支机构筛选（带搜索的下拉框） -->
-            <div class="flex flex-col w-full md:w-1/3">
-                <label class="text-sm font-medium">分支机构</label>
+            <!-- 分支机构筛选（带搜索的多选下拉框） -->
+            <div class="flex flex-col w-full md:w-1/2">
+                <label class="text-sm font-medium">分支机构（可多选）</label>
                 <div class="relative" id="branchSelectContainer">
                     <!-- 选择框主体 -->
                     <div class="relative">
@@ -17,15 +17,19 @@
                             type="text" 
                             id="branchSearchInput" 
                             class="w-full pl-4 pr-10 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-500 outline-none text-sm"
-                            placeholder="输入分支机构名称搜索..."
+                            placeholder="点击选择分支机构（可多选）..."
                             readonly
                             onclick="toggleBranchDropdown()"
                         >
                         <span class="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-400 transition-transform duration-200" id="branchArrowIcon">
                             <i class="fa fa-chevron-down"></i>
                         </span>
-                        <!-- 隐藏的分支机构ID输入框（用于表单提交） -->
-                        <input type="hidden" name="branch" id="selectedBranchId">
+                        <!-- 选中的机构显示 -->
+                        <div id="selectedBranches" class="absolute z-5 mt-1 w-full bg-white rounded-lg shadow-md hidden max-h-32 overflow-y-auto">
+                            <div class="p-2">
+                                <div class="flex flex-wrap gap-1" id="branchTags"></div>
+                            </div>
+                        </div>
                     </div>
                     
                     <!-- 下拉内容 -->
@@ -46,15 +50,29 @@
                         <div id="branchOptionsList" class="max-h-60 overflow-y-auto">
                             <ul>
                                 {% for branch in branches %}
-                                <li class="branch-option px-4 py-2.5 hover:bg-gray-100 cursor-pointer text-sm transition-colors" 
+                                <li class="branch-option px-4 py-2.5 hover:bg-gray-100 cursor-pointer text-sm transition-colors flex items-center" 
                                     data-id="{{ branch.id }}" 
                                     data-name="{{ branch.name }}">
+                                    <input type="checkbox" class="mr-2 branch-checkbox" value="{{ branch.id }}">
                                     {{ branch.name }}
                                 </li>
                                 {% endfor %}
                             </ul>
                         </div>
                         
+                        <!-- 操作按钮 -->
+                        <div class="p-2 border-t border-gray-100 flex gap-2">
+                            <button type="button" class="flex-1 px-3 py-1 text-xs bg-blue-500 text-white rounded hover:bg-blue-600" onclick="selectAllBranches()">全选</button>
+                            <button type="button" class="flex-1 px-3 py-1 text-xs bg-red-500 text-white rounded hover:bg-red-600" onclick="clearAllBranches()">清空</button>
+                        </div>
+                        
+                        <!-- 独立的清空全部选择按钮 -->
+                        <div class="p-2 border-t border-gray-100">
+                            <button type="button" class="w-full px-3 py-2 text-sm bg-orange-500 text-white rounded-lg hover:bg-orange-600 font-medium" onclick="clearAllBranches()" title="清空所有机构选择">
+                                <i class="fa fa-refresh mr-1"></i>清空全部选择
+                            </button>
+                        </div>
+                        
                         <!-- 无结果提示 -->
                         <div id="branchNoResult" class="px-4 py-4 text-center text-gray-500 text-sm hidden">
                             没有找到匹配的分支机构
@@ -63,54 +81,10 @@
                 </div>
             </div>
 
-            <!-- 联系人类别筛选（改为带搜索的下拉框） -->
+            <!-- 联系人类别筛选（保持原结构） -->
             <div class="flex flex-col w-full md:w-1/3">
                 <label class="text-sm font-medium">联系人类别</label>
-                <div class="relative" id="categorySelectContainer">
-                    <div class="relative">
-                        <input 
-                            type="text"
-                            id="categorySearchInput"
-                            class="w-full pl-4 pr-10 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-300 focus:border-blue-500 outline-none text-sm"
-                            placeholder="输入类别名称搜索..."
-                            readonly
-                            onclick="toggleCategoryDropdown()"
-                            value="{{ selected_category|default:'' }}"
-                        >
-                        <span class="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-400 transition-transform duration-200" id="categoryArrowIcon">
-                            <i class="fa fa-chevron-down"></i>
-                        </span>
-                        <input type="hidden" name="category" id="selectedCategory">
-                    </div>
-                    
-                    <div id="categoryDropdownContent" class="absolute z-10 mt-1 w-full bg-white rounded-lg shadow-md overflow-hidden hidden">
-                        <div class="p-2 border-b border-gray-100">
-                            <input 
-                                type="text"
-                                id="categoryFilterInput"
-                                class="w-full px-3 py-2 border border-gray-200 rounded-lg focus:ring-1 focus:ring-blue-300 focus:border-blue-500 outline-none text-sm"
-                                placeholder="搜索联系人类别..."
-                                oninput="filterCategoryOptions()"
-                                autofocus
-                            >
-                        </div>
-                        
-                        <div id="categoryOptionsList" class="max-h-60 overflow-y-auto">
-                            <ul>
-                                {% for cat in categories %}
-                                <li class="category-option px-4 py-2.5 hover:bg-gray-100 cursor-pointer text-sm transition-colors" 
-                                    data-value="{{ cat }}">
-                                    {{ cat }}
-                                </li>
-                                {% endfor %}
-                            </ul>
-                        </div>
-                        
-                        <div id="categoryNoResult" class="px-4 py-4 text-center text-gray-500 text-sm hidden">
-                            没有找到匹配的类别
-                        </div>
-                    </div>
-                </div>
+                <input type="text" name="category" class="mt-1 p-2 border rounded" placeholder="输入类别名称筛选" value="{{ selected_category|default:'' }}">
             </div>
 
             <!-- 联系人姓名筛选（保持原结构） -->
@@ -119,10 +93,16 @@
                 <input type="text" name="contact_name" class="mt-1 p-2 border rounded" placeholder="输入联系人姓名筛选" value="{{ selected_contact_name|default:'' }}">
             </div>
             
-            <div class="flex items-end">
+            <div class="flex items-end gap-2">
                 <button type="submit" class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">筛选</button>
+                <button type="button" class="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-600 transition-colors duration-200 font-medium" onclick="clearFilters()">
+                    <i class="fa fa-times mr-1"></i>清空筛选
+                </button>
             </div>
         </div>
+        
+        <!-- 隐藏的分支机构ID输入框（用于表单提交） -->
+        <input type="hidden" name="branches" id="selectedBranchesInput">
     </form>
 
     <table class="min-w-full border-collapse border border-gray-300">
@@ -154,6 +134,133 @@
 </div>
 
 <script>
+    // 选中的分支机构
+    let selectedBranches = new Set();
+    
+    // 初始化页面
+    document.addEventListener('DOMContentLoaded', function() {
+        // 初始化选中的机构
+        initializeSelectedBranches();
+        
+        // 绑定复选框事件
+        bindCheckboxEvents();
+    });
+    
+    // 初始化选中的机构（从表单参数中读取）
+    function initializeSelectedBranches() {
+        const urlParams = new URLSearchParams(window.location.search);
+        const branchesParam = urlParams.get('branches');
+        if (branchesParam) {
+            const branchIds = branchesParam.split(',');
+            branchIds.forEach(id => {
+                selectedBranches.add(id);
+                const checkbox = document.querySelector(`input[value="${id}"]`);
+                if (checkbox) {
+                    checkbox.checked = true;
+                }
+            });
+        }
+        updateBranchSelectionUI();
+    }
+    
+    // 绑定复选框事件
+    function bindCheckboxEvents() {
+        document.querySelectorAll('.branch-checkbox').forEach(checkbox => {
+            checkbox.addEventListener('change', function() {
+                const branchId = this.value;
+                const branchName = this.closest('.branch-option').dataset.name;
+                
+                if (this.checked) {
+                    selectedBranches.add(branchId);
+                } else {
+                    selectedBranches.delete(branchId);
+                }
+                
+                updateBranchSelectionUI();
+            });
+        });
+    }
+    
+    // 更新机构选择UI
+    function updateBranchSelectionUI() {
+        const selectedBranchesInput = document.getElementById('selectedBranchesInput');
+        const branchSearchInput = document.getElementById('branchSearchInput');
+        const selectedBranchesDiv = document.getElementById('selectedBranches');
+        const branchTags = document.getElementById('branchTags');
+        
+        // 更新隐藏输入框
+        if (selectedBranches.size > 0) {
+            selectedBranchesInput.value = Array.from(selectedBranches).join(',');
+            branchSearchInput.placeholder = `已选择 ${selectedBranches.size} 个机构`;
+        } else {
+            selectedBranchesInput.value = '';
+            branchSearchInput.placeholder = '点击选择分支机构（可多选）...';
+        }
+        
+        // 更新显示的标签
+        branchTags.innerHTML = '';
+        selectedBranches.forEach(branchId => {
+            const branchName = document.querySelector(`input[value="${branchId}"]`).closest('.branch-option').dataset.name;
+            const tag = document.createElement('span');
+            tag.className = 'inline-flex items-center px-2 py-1 rounded-full text-xs bg-blue-100 text-blue-800';
+            tag.innerHTML = `
+                ${branchName}
+                <button type="button" class="ml-1 text-blue-600 hover:text-blue-800" onclick="removeBranch('${branchId}')">
+                    <i class="fa fa-times"></i>
+                </button>
+            `;
+            branchTags.appendChild(tag);
+        });
+        
+        // 控制选中机构显示区域
+        if (selectedBranches.size > 0) {
+            selectedBranchesDiv.classList.remove('hidden');
+        } else {
+            selectedBranchesDiv.classList.add('hidden');
+        }
+    }
+    
+    // 移除机构
+    function removeBranch(branchId) {
+        selectedBranches.delete(branchId);
+        const checkbox = document.querySelector(`input[value="${branchId}"]`);
+        if (checkbox) {
+            checkbox.checked = false;
+        }
+        updateBranchSelectionUI();
+    }
+    
+    // 全选分支机构
+    function selectAllBranches() {
+        selectedBranches.clear();
+        document.querySelectorAll('.branch-checkbox').forEach(checkbox => {
+            checkbox.checked = true;
+            selectedBranches.add(checkbox.value);
+        });
+        updateBranchSelectionUI();
+    }
+    
+    // 清空所有分支机构选择
+    function clearAllBranches() {
+        selectedBranches.clear();
+        document.querySelectorAll('.branch-checkbox').forEach(checkbox => {
+            checkbox.checked = false;
+        });
+        updateBranchSelectionUI();
+    }
+    
+    // 清空所有筛选
+    function clearFilters() {
+        // 清空所有表单字段
+        document.getElementById('filterForm').reset();
+        
+        // 清空机构选择
+        clearAllBranches();
+        
+        // 提交清空后的表单
+        window.location.href = window.location.pathname;
+    }
+    
     // 控制分支机构下拉框显示/隐藏
     function toggleBranchDropdown() {
         const dropdown = document.getElementById('branchDropdownContent');
@@ -192,118 +299,37 @@
         const noResult = document.getElementById('branchNoResult');
         let hasMatch = false;
 
-        let firstMatch = null;
         options.forEach(option => {
             const name = option.dataset.name.toLowerCase();
             if (name.includes(searchText)) {
                 option.style.display = 'block';
                 hasMatch = true;
-                if (!firstMatch) firstMatch = option;
             } else {
                 option.style.display = 'none';
             }
         });
 
-        noResult.classList.toggle('hidden', hasMatch);
-        // 自动滚动到第一个匹配项
-        if (firstMatch) {
-            firstMatch.scrollIntoView({block: 'nearest'});
-            firstMatch.classList.add('bg-blue-50');
-            setTimeout(() => firstMatch.classList.remove('bg-blue-50'), 1000);
-        }
-    }
-
-    // 选择分支机构选项
-    document.querySelectorAll('.branch-option').forEach(option => {
-        option.addEventListener('click', function() {
-            const name = this.dataset.name;
-            const id = this.dataset.id;
-            document.getElementById('branchSearchInput').value = name;
-            document.getElementById('selectedBranchId').value = id;
-            closeBranchDropdown();
-        });
-    });
-
-    // 键盘导航（可选）
-    document.getElementById('branchFilterInput').addEventListener('keydown', function(e) {
-        const options = document.querySelectorAll('.branch-option:not([style*="display: "])');
-        const active = document.querySelector('.branch-option.bg-gray-100');
-        let index = -1;
-
-        if (active) index = Array.from(options).indexOf(active);
-
-        if (e.key === 'ArrowDown') {
-            e.preventDefault();
-            if (active) active.classList.remove('bg-gray-100');
-            const next = (index + 1) % options.length;
-            options[next]?.classList.add('bg-gray-100');
-            options[next]?.scrollIntoView({ block: 'nearest' });
-        } else if (e.key === 'ArrowUp') {
-            e.preventDefault();
-            if (active) active.classList.remove('bg-gray-100');
-            const prev = index > 0 ? index - 1 : options.length - 1;
-            options[prev]?.classList.add('bg-gray-100');
-            options[prev]?.scrollIntoView({ block: 'nearest' });
-        } else if (e.key === 'Enter') {
-            e.preventDefault();
-            active?.click();
-        }
-    });
-
-    // 新增联系人类别下拉框控制函数
-    function toggleCategoryDropdown() {
-        const dropdown = document.getElementById('categoryDropdownContent');
-        const arrow = document.getElementById('categoryArrowIcon');
-        if (dropdown.classList.contains('hidden')) {
-            dropdown.classList.remove('hidden');
-            arrow.classList.add('rotate-180');
-            document.getElementById('categoryFilterInput').focus();
-            document.addEventListener('click', handleCategoryOutsideClick);
+        // 显示或隐藏无结果提示
+        if (searchText && !hasMatch) {
+            noResult.classList.remove('hidden');
         } else {
-            closeCategoryDropdown();
+            noResult.classList.add('hidden');
         }
     }
 
-    function closeCategoryDropdown() {
-        const dropdown = document.getElementById('categoryDropdownContent');
-        const arrow = document.getElementById('categoryArrowIcon');
-        dropdown.classList.add('hidden');
-        arrow.classList.remove('rotate-180');
-        document.removeEventListener('click', handleCategoryOutsideClick);
-    }
-
-    function handleCategoryOutsideClick(event) {
-        const container = document.getElementById('categorySelectContainer');
-        if (!container.contains(event.target)) {
-            closeCategoryDropdown();
-        }
-    }
-
-    function filterCategoryOptions() {
-        const searchText = document.getElementById('categoryFilterInput').value.toLowerCase();
-        const options = document.querySelectorAll('.category-option');
-        const noResult = document.getElementById('categoryNoResult');
-        let hasMatch = false;
-
-        options.forEach(option => {
-            const value = option.dataset.value.toLowerCase();
-            if (value.includes(searchText)) {
-                option.style.display = 'block';
-                hasMatch = true;
-            } else {
-                option.style.display = '';
+    // 选择分支机构选项（保留原有功能以兼容单选操作）
+    document.querySelectorAll('.branch-option').forEach(option => {
+        option.addEventListener('click', function(e) {
+            // 如果点击的是复选框，不重复处理
+            if (e.target.type === 'checkbox') {
+                return;
             }
-        });
-
-        noResult.classList.toggle('hidden', hasMatch || !searchText);
-    }
-
-    document.querySelectorAll('.category-option').forEach(option => {
-        option.addEventListener('click', function() {
-            const value = this.dataset.value;
-            document.getElementById('categorySearchInput').value = value;
-            document.getElementById('selectedCategory').value = value;
-            closeCategoryDropdown();
+            
+            const checkbox = this.querySelector('.branch-checkbox');
+            checkbox.checked = !checkbox.checked;
+            
+            // 触发复选框的change事件
+            checkbox.dispatchEvent(new Event('change'));
         });
     });
 </script>
diff --git a/fzjgact/huodong/views.py b/fzjgact/huodong/views.py
index ba50a67..45ce71e 100644
--- a/fzjgact/huodong/views.py
+++ b/fzjgact/huodong/views.py
@@ -356,16 +356,19 @@ def equipment_images(request):
 
 def contact_list(request):
     # 获取筛选参数
-    branch_id = request.GET.get('branch')
+    branches_param = request.GET.get('branches')  # 支持多机构选择，使用逗号分隔的ID字符串
     category = request.GET.get('category')
     contact_name = request.GET.get('contact_name')
     
     # 构建查询条件
     filters = Q()
     
-    # 分支机构筛选
-    if branch_id:
-        filters &= Q(branch_id=branch_id)
+    # 分支机构筛选（支持多选）
+    if branches_param:
+        # 将逗号分隔的字符串转换为ID列表
+        branch_ids = [bid.strip() for bid in branches_param.split(',') if bid.strip().isdigit()]
+        if branch_ids:
+            filters &= Q(branch_id__in=branch_ids)
     
     # 联系人类别筛选
     if category:
@@ -386,7 +389,7 @@ def contact_list(request):
         'contacts': contacts,
         'branches': branches,
         'categories': categories,
-        'selected_branch': branch_id,
+        'selected_branches': branches_param,  # 传递选中的机构ID字符串
         'selected_category': category,
         'selected_contact_name': contact_name
     }