HEX

File: /mnt/data/doccure-wp/wp-content/plugins/doccure/debug-view-prescription.html
<!DOCTYPE html>
<html>
<head>
    <title>View Prescription Debug Test</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .test-button { 
            background: #28a745; 
            color: white; 
            padding: 10px 20px; 
            border: none; 
            border-radius: 5px; 
            cursor: pointer; 
            margin: 10px;
        }
        .debug-info { 
            background: #f8f9fa; 
            padding: 15px; 
            border-radius: 5px; 
            margin: 10px 0; 
        }
    </style>
</head>
<body>
    <h1>View Prescription Debug Test</h1>
    
    <div class="debug-info">
        <h3>Debug Information:</h3>
        <p><strong>Test Booking ID:</strong> <span id="test-booking-id">123</span></p>
        <p><strong>AJAX URL:</strong> <span id="ajax-url">Checking...</span></p>
        <p><strong>Nonce:</strong> <span id="nonce">Checking...</span></p>
        <p><strong>jQuery Loaded:</strong> <span id="jquery-status">Checking...</span></p>
        <p><strong>Bootstrap Modal:</strong> <span id="bootstrap-status">Checking...</span></p>
    </div>

    <button class="test-button" onclick="testViewPrescription()">Test View Prescription Button</button>
    <button class="test-button" onclick="testModal()">Test Modal Directly</button>
    <button class="test-button" onclick="testAJAX()">Test AJAX Call</button>

    <div id="results" style="margin-top: 20px;"></div>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        // Check if jQuery is loaded
        if (typeof jQuery !== 'undefined') {
            document.getElementById('jquery-status').textContent = '✅ Loaded';
        } else {
            document.getElementById('jquery-status').textContent = '❌ Not Loaded';
        }

        // Check if Bootstrap modal is available
        if (typeof jQuery !== 'undefined' && jQuery.fn.modal) {
            document.getElementById('bootstrap-status').textContent = '✅ Available';
        } else {
            document.getElementById('bootstrap-status').textContent = '❌ Not Available';
        }

        function testViewPrescription() {
            var results = document.getElementById('results');
            results.innerHTML = '<h3>Testing View Prescription Button...</h3>';
            
            // Create a test button
            var testBtn = document.createElement('button');
            testBtn.className = 'dc-btn add-new-btn dc-viewbtn view-prescription-btn';
            testBtn.setAttribute('data-booking-id', '123');
            testBtn.textContent = 'View Prescription';
            testBtn.onclick = function(e) {
                e.preventDefault();
                results.innerHTML += '<p>✅ Button click detected</p>';
                
                var bookingId = this.getAttribute('data-booking-id');
                results.innerHTML += '<p>Booking ID: ' + bookingId + '</p>';
                
                // Check if modal exists
                var modal = document.getElementById('view_prescription_modal');
                if (modal) {
                    results.innerHTML += '<p>✅ Modal found in DOM</p>';
                } else {
                    results.innerHTML += '<p>❌ Modal not found in DOM</p>';
                }
            };
            
            document.body.appendChild(testBtn);
            testBtn.click();
        }

        function testModal() {
            var results = document.getElementById('results');
            results.innerHTML = '<h3>Testing Modal Directly...</h3>';
            
            var modal = document.getElementById('view_prescription_modal');
            if (modal) {
                results.innerHTML += '<p>✅ Modal found</p>';
                if (typeof jQuery !== 'undefined' && jQuery.fn.modal) {
                    jQuery(modal).modal('show');
                    results.innerHTML += '<p>✅ Modal shown</p>';
                } else {
                    results.innerHTML += '<p>❌ Bootstrap modal not available</p>';
                }
            } else {
                results.innerHTML += '<p>❌ Modal not found</p>';
            }
        }

        function testAJAX() {
            var results = document.getElementById('results');
            results.innerHTML = '<h3>Testing AJAX Call...</h3>';
            
            if (typeof jQuery === 'undefined') {
                results.innerHTML += '<p>❌ jQuery not available</p>';
                return;
            }
            
            // Check if doccure_view_obj is available
            if (typeof doccure_view_obj === 'undefined') {
                results.innerHTML += '<p>❌ doccure_view_obj not defined</p>';
                return;
            }
            
            results.innerHTML += '<p>✅ doccure_view_obj found</p>';
            results.innerHTML += '<p>AJAX URL: ' + doccure_view_obj.ajax_url + '</p>';
            results.innerHTML += '<p>Nonce: ' + doccure_view_obj.ajax_nonce + '</p>';
            
            // Test AJAX call
            jQuery.ajax({
                url: doccure_view_obj.ajax_url,
                type: 'POST',
                data: {
                    action: 'doccure_get_view_prescription_content',
                    booking_id: '123',
                    security: doccure_view_obj.ajax_nonce
                },
                success: function(response) {
                    results.innerHTML += '<p>✅ AJAX Success</p>';
                    results.innerHTML += '<p>Response Type: ' + response.type + '</p>';
                    if (response.type === 'error') {
                        results.innerHTML += '<p>Error: ' + response.message + '</p>';
                    }
                },
                error: function(xhr, status, error) {
                    results.innerHTML += '<p>❌ AJAX Error</p>';
                    results.innerHTML += '<p>Status: ' + status + '</p>';
                    results.innerHTML += '<p>Error: ' + error + '</p>';
                }
            });
        }
    </script>
</body>
</html>