mirror of
				https://gitcode.com/gitea/gitea.git
				synced 2025-10-31 08:28:38 +08:00 
			
		
		
		
	 d32af84a10
			
		
	
	d32af84a10
	
	
	
		
			
			Close #22847 This PR: * introduce Gitea's own `showElem` and related functions * remove jQuery show/hide * remove .hide class * remove inline style=display:none From now on: do not use: * "[hidden]" attribute: it's too weak, can not be applied to an element with "display: flex" * ".hidden" class: it has been polluted by Fomantic UI in many cases * inline style="display: none": it's difficult to tweak * jQuery's show/hide/toggle: it can not show/hide elements with "display: xxx !important" only use: * this ".gt-hidden" class * showElem/hideElem/toggleElem functions in "utils/dom.js" cc: @silverwind , this is the all-in-one PR
		
			
				
	
	
		
			73 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			73 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| import $ from 'jquery';
 | |
| import {updateIssuesMeta} from './repo-issue.js';
 | |
| import {toggleElem} from '../utils/dom.js';
 | |
| 
 | |
| export function initCommonIssue() {
 | |
|   const $issueSelectAllWrapper = $('.issue-checkbox-all');
 | |
|   const $issueSelectAll = $('.issue-checkbox-all input');
 | |
|   const $issueCheckboxes = $('.issue-checkbox input');
 | |
| 
 | |
|   const syncIssueSelectionState = () => {
 | |
|     const $checked = $issueCheckboxes.filter(':checked');
 | |
|     const anyChecked = $checked.length !== 0;
 | |
|     const allChecked = anyChecked && $checked.length === $issueCheckboxes.length;
 | |
| 
 | |
|     if (allChecked) {
 | |
|       $issueSelectAll.prop({'checked': true, 'indeterminate': false});
 | |
|     } else if (anyChecked) {
 | |
|       $issueSelectAll.prop({'checked': false, 'indeterminate': true});
 | |
|     } else {
 | |
|       $issueSelectAll.prop({'checked': false, 'indeterminate': false});
 | |
|     }
 | |
|     // if any issue is selected, show the action panel, otherwise show the filter panel
 | |
|     toggleElem($('#issue-filters'), !anyChecked);
 | |
|     toggleElem($('#issue-actions'), anyChecked);
 | |
|     // there are two panels but only one select-all checkbox, so move the checkbox to the visible panel
 | |
|     $('#issue-filters, #issue-actions').filter(':visible').find('.column:first').prepend($issueSelectAllWrapper);
 | |
|   };
 | |
| 
 | |
|   $issueCheckboxes.on('change', syncIssueSelectionState);
 | |
| 
 | |
|   $issueSelectAll.on('change', () => {
 | |
|     $issueCheckboxes.prop('checked', $issueSelectAll.is(':checked'));
 | |
|     syncIssueSelectionState();
 | |
|   });
 | |
| 
 | |
|   $('.issue-action').on('click', async function (e) {
 | |
|     let action = this.getAttribute('data-action');
 | |
|     let elementId = this.getAttribute('data-element-id');
 | |
|     const url = this.getAttribute('data-url');
 | |
|     const issueIDs = $('.issue-checkbox').children('input:checked').map((_, el) => {
 | |
|       return el.getAttribute('data-issue-id');
 | |
|     }).get().join(',');
 | |
|     if (elementId === '0' && url.slice(-9) === '/assignee') {
 | |
|       elementId = '';
 | |
|       action = 'clear';
 | |
|     }
 | |
|     if (action === 'toggle' && e.altKey) {
 | |
|       action = 'toggle-alt';
 | |
|     }
 | |
|     updateIssuesMeta(
 | |
|       url,
 | |
|       action,
 | |
|       issueIDs,
 | |
|       elementId
 | |
|     ).then(() => {
 | |
|       // NOTICE: This reset of checkbox state targets Firefox caching behaviour, as the
 | |
|       // checkboxes stay checked after reload
 | |
|       if (action === 'close' || action === 'open') {
 | |
|         // uncheck all checkboxes
 | |
|         $('.issue-checkbox input[type="checkbox"]').each((_, e) => { e.checked = false });
 | |
|       }
 | |
|       window.location.reload();
 | |
|     });
 | |
|   });
 | |
| 
 | |
|   // NOTICE: This event trigger targets Firefox caching behaviour, as the checkboxes stay
 | |
|   // checked after reload trigger checked event, if checkboxes are checked on load
 | |
|   $('.issue-checkbox input[type="checkbox"]:checked').first().each((_, e) => {
 | |
|     e.checked = false;
 | |
|     $(e).trigger('click');
 | |
|   });
 | |
| }
 |