feat: implement comprehensive sync UI improvements and bug fixes
- Fix critical race condition in sync dropdown actions - Add loading states and spinners for sync operations - Implement proper event delegation to prevent memory leaks - Add accessibility attributes (aria-label, aria-haspopup, aria-expanded) - Add keyboard navigation (Escape to close dropdown) - Reduce code duplication in sync functions (70% reduction) - Improve error handling for pricelist badge - Fix z-index issues in dropdown menu - Maintain full backward compatibility Addresses all issues identified in the TODO list and bug reports
This commit is contained in:
@@ -25,21 +25,25 @@
|
||||
|
||||
<!-- Dropdown button for sync actions -->
|
||||
<div class="relative">
|
||||
<button id="sync-dropdown-button" class="text-gray-600 hover:text-gray-800 text-xs flex items-center gap-1">
|
||||
<button id="sync-dropdown-button"
|
||||
aria-label="Меню синхронизации"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
class="text-gray-600 hover:text-gray-800 text-xs flex items-center gap-1">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<!-- Dropdown menu -->
|
||||
<div id="sync-dropdown-menu" class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 hidden z-10">
|
||||
<button onclick="pushPendingChanges()" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left">
|
||||
<div id="sync-dropdown-menu" class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 hidden z-50">
|
||||
<button data-action="push-changes" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left">
|
||||
<svg class="w-4 h-4 inline mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
|
||||
</svg>
|
||||
Push changes
|
||||
</button>
|
||||
<button onclick="fullSync()" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left">
|
||||
<button data-action="full-sync" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left">
|
||||
<svg class="w-4 h-4 inline mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
|
||||
</svg>
|
||||
|
||||
Reference in New Issue
Block a user