feat: 增加选中标记显示，优化用户选择体验

app/public/js/financial_pay_stage.js

@@ -40,6 +40,7 @@ const tenderListSpec = (function(){
 
 
 let auditUtils;
+let globalSelectedUserIds = new Set();
 $(function () {
     autoFlashHeight();
 
@@ -97,7 +98,7 @@ $(function () {
 
     let timer = null
     let oldSearchVal = null
-    $('#liucheng').on('input propertychange', '.gr-search', function(e) {
+    $('#liucheng').on('input propertychange', '.gr-search', function (e) {
         oldSearchVal = e.target.value;
         timer && clearTimeout(timer);
         timer = setTimeout(() => {
@@ -106,9 +107,15 @@ $(function () {
             let html = '';
             if (newVal && newVal === oldSearchVal) {
                 accountList.filter(item => item && (item.name.indexOf(newVal) !== -1 || (item.mobile && item.mobile.indexOf(newVal) !== -1))).forEach(item => {
+                    let isSelected = globalSelectedUserIds.has(item.id);
+                    let displayStyle = isSelected ? 'display: inline;' : 'display: none;';
+                    
                     html += `<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></p>
+                                class="ml-auto">${item.mobile || ''}</span>
+                                <span class="selected-mark text-success ml-2" style="${displayStyle}"><i class="fa fa-check"></i></span>
+
+                        </p>
                         <span class="text-muted">${item.role || ''}</span>
                     </dd>`
                 });
@@ -122,9 +129,14 @@ $(function () {
                         </a> ${group.groupName}</dt>
                         <div class="dd-content" data-toggleid="${idx}">`;
                         group.groupList.forEach(item => {
+                            let isSelected = globalSelectedUserIds.has(item.id);
+                            let displayStyle = isSelected ? 'display: inline;' : 'display: none;';
                             html += `<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></p>
+                                        class="ml-auto">${item.mobile || ''}</span>
+                                    <span class="selected-mark text-success ml-2" style="${displayStyle}"><i class="fa fa-check"></i></span>
+                                
+                                </p>
                                 <span class="text-muted">${item.role || ''}</span>
                             </dd>`;
                         });
@@ -169,9 +181,12 @@ $(function () {
     });
     auditUtils = {
         makeReportListHtml: function (flow) {
+            globalSelectedUserIds = new Set((flow.permissionList || []).map(pl => pl.uid));
             let addHtml = '';
+            $('#report_audit_dropdownMenu dd .selected-mark').hide();
             $('#select-all-ptAudits').prop('checked', false);
             for (const pl of flow.permissionList) {
+                $(`#report_audit_dropdownMenu dd[data-id="${pl.uid}"] .selected-mark`).show();
                 addHtml += `<tr>
                                 <td class="text-center"><input type="checkbox" class="select-ptAudit" data-id="${pl.id}"></td><td>${pl.name}</td><td>${pl.company}</td>
                                 <td class="text-center"><input type="checkbox" class="save-report" data-id="${pl.id}" ${pl.is_report ? 'checked' : ''}></td><td class="text-center"><a href="javascript:void(0);" class="text-danger remove-audit" data-id="${pl.id}">移除</a></td>
@@ -328,7 +343,9 @@ $(function () {
     };
 
     // 选中填报人
-    $('body').on('click', 'div[id="report_audit_dropdownMenu"] dl dd', function () {
+    $('body').on('click', 'div[id="report_audit_dropdownMenu"] dl dd', function (e) {
+        console.log('选中填报人');
+        e.stopPropagation();
         const tid = parseInt($('#shenpi-tender-list tr.bg-warning').data('tid'));
         const tender = tenders.find(t => t.id === tid);
         if (!tender) {
@@ -497,7 +514,7 @@ $(function () {
     });
 
     // 选中审批人
-    $('body').on('click', '#shenpi-list div[id$="_dropdownMenu"] dl dd', function () {
+    $('body').on('click', '#shenpi-list div[id$="_dropdownMenu"] dl dd', function (e) {
         const tid = parseInt($('#shenpi-tender-list tr.bg-warning').data('tid'));
         const tender = tenders.find(t => t.id === tid);
         if (!tender) {
@@ -528,6 +545,7 @@ $(function () {
             audit_type: parseInt($(this).parents('li').find('select[class*="audit-type-key"]')[0].value),
             audit_order: $(this).parents('li').index() + 1,
         };
+        
         const _self = $(this);
         postData(`/sp/${spid}/financial/pay/stage/save`, { type: 'add-shenpi-audit', shenpi: prop, tid }, function (result) {
             const data = result.shenpi;

app/view/financial/pay_stage_modal.ejs

@@ -121,7 +121,9 @@
                                                 <% 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></p>
+                                                                    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>
                                                 <% });%>