Spaces:
Running
Running
mport pandas as pd # ุงูุจูุงูุงุช ุงูู
ุณุชุฎุฑุฌุฉ data = [ ("0602", "ุดูุฑ ูููู
ุชูููุฐ ุงูุนู
ููุฉ (2 ููููู)", "ุญูููู"), ("215502.657", "ููุช ุชูููุฐ ุงูุนู
ููุฉ ุจุงูุซูุงูู ูุงูู
ูู ุซุงููุฉ", "ุญูููู"), ("15286", "ุฑูู
ุนู
ููุฉ ุฏุงุฎูู (Process ID ุฃู Transaction ID ุฏุงุฎูู)", "ุญูููู"), ("00100000", "ููุฏ ุงูุนู
ููุฉ/ุงูู
ุนุงู
ูุฉ", "ุญูููู"), ("20250602", "ุชุงุฑูุฎ ุงูุนู
ููุฉ (2 ููููู 2025)", "ุญูููู"), ("2153507836", "ุฑูู
ุงูุทูุจ (Order ID)", "ุญูููู"), ("3", "ู
ุณุชูู ุงูุณุฌู (Log Level)", "ุญูููู"), ("0", "ุฎูุงุฑ ุฃู ุญุงูุฉ (Option flag)", "ุญูููู"), ("0000", "ููุฏ ูุฌุงุญ ุงูุนู
ููุฉ (Success Code)", "ุญูููู"), ("5205040000000943", "ุฑูู
ุจุทุงูุฉ ุงุฆุชู
ุงู (Card Number)", "ุญุณุงุณ/ู
ุดุจูู"), ("1138521083", "ุฑูู
ุถุฑูุจุฉ ุงูุชุงุฌุฑ (Merchant Tax No)", "ุญูููู"), ("4804500624", "ุฑูู
ุถุฑูุจุฉ ุงูู
ุชุฌุฑ (Mall Tax No)", "ุญูููู"), ("25783090058548", "ุฑูู
ุดูุงุฏุฉ ุฃู ู
ุนุงู
ูุฉ (Cert No / TNO)", "ุญูููู"), ("6", "ุทูู BIN ุงููุงุฑุช (Card BIN Length)", "ุญูููู"), ("180000", "ููู
ุฉ ุงูู
ุนุงู
ูุฉ (ุจุงูุนู
ูุฉ ุงูู
ุญููุฉ)", "ุญูููู"), ("0", "ููู
ุฉ ุงููุณูู
ุฉ (Coupon Money)", "ุญูููู"), ("215502", "ููุช ู
ูุงููุฉ ุงูุจูู (App Time)", "ุญูููู"), ("30043726", "ุฑูู
ุงูู
ูุงููุฉ ุงูุจูููุฉ (Approval No)", "ุญูููู"), ("00091378177", "ุฑูู
ุฃุนู
ุงู ุฃู ุดุฑูุฉ (Biz No)", "ุญูููู"), ("00", "ุนุฏุฏ ุงูุฃูุณุงุท (Installments)", "ุญูููู"), ("0602215502", "ุฌุฒุก ู
ู ู
ุนุฑูู ุงูู
ุนุงู
ูุฉ (PG TXID)", "ุญูููู"), ("163636", "ููู
ุฉ ุงูู
ุจูุบ ุงูุฎุงุถุน ููุถุฑูุจุฉ", "ุญูููู"), ("16364", "ููู
ุฉ ุงูุถุฑูุจุฉ (VAT)", "ุญูููู"), ("1", "ููุน BIN ุงููุงุฑุช (Type 01 ุฃู 02)", "ุญูููู"), ("0004", "ููุฏ ุงูุจูู ุงูู
ูุตุฏุฑ", "ุญูููู"), ("050204040033454", "ููุฏ ุดุฑูู ุฃู ุชุงุฌุฑ", "ุญูููู"), ("0000", "ููุฏ ูุฌุงุญ ุฅุถุงูู", "ุญูููู") ] # ุฅูุดุงุก DataFrame df = pd.DataFrame(data, columns=["ุงูุฑูู
", "ุงูุดุฑุญ ุงูู
ุญุชู
ู", "ุชุตููู"]) # ุญูุธ ุงูู
ูู ูู Excel file_path = "/mnt/data/ุชุญููู_ุงูุจูุงูุงุช.xlsx" df.to_excel(file_path, index=False) file_path - Initial Deployment
8840893
verified
| <html lang="ar" dir="rtl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>ุชุญููู ุงูุจูุงูุงุช ุงูู ุงููุฉ</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap'); | |
| body { | |
| font-family: 'Tajawal', sans-serif; | |
| } | |
| .sensitive { | |
| background-color: rgba(239, 68, 68, 0.1); | |
| } | |
| .sensitive:hover { | |
| background-color: rgba(239, 68, 68, 0.2); | |
| } | |
| .real { | |
| background-color: rgba(34, 197, 94, 0.1); | |
| } | |
| .real:hover { | |
| background-color: rgba(34, 197, 94, 0.2); | |
| } | |
| .scrollbar-hide::-webkit-scrollbar { | |
| display: none; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <!-- Header --> | |
| <div class="flex flex-col md:flex-row justify-between items-center mb-8 gap-4"> | |
| <div> | |
| <h1 class="text-3xl font-bold text-gray-800">ุชุญููู ุงูุจูุงูุงุช ุงูู ุงููุฉ</h1> | |
| <p class="text-gray-600 mt-2">ุณุฌู ู ุนุงู ูุงุช ุจุทุงูุงุช ุงูุงุฆุชู ุงู</p> | |
| </div> | |
| <div class="flex items-center gap-3"> | |
| <div class="flex items-center"> | |
| <div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div> | |
| <span class="text-sm">ุญูููู</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="w-3 h-3 rounded-full bg-red-500 mr-2"></div> | |
| <span class="text-sm">ุญุณุงุณ/ู ุดุจูู</span> | |
| </div> | |
| <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center gap-2 transition-colors"> | |
| <i class="fas fa-download"></i> | |
| <span>ุชุตุฏูุฑ Excel</span> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Stats Cards --> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8"> | |
| <div class="bg-white p-4 rounded-lg shadow border-l-4 border-blue-500"> | |
| <h3 class="text-gray-500 text-sm">ุฅุฌู ุงูู ุงูู ุนุงู ูุงุช</h3> | |
| <p class="text-2xl font-bold mt-1">27</p> | |
| </div> | |
| <div class="bg-white p-4 rounded-lg shadow border-l-4 border-green-500"> | |
| <h3 class="text-gray-500 text-sm">ู ุนุงู ูุงุช ุญููููุฉ</h3> | |
| <p class="text-2xl font-bold mt-1">26</p> | |
| </div> | |
| <div class="bg-white p-4 rounded-lg shadow border-l-4 border-red-500"> | |
| <h3 class="text-gray-500 text-sm">ู ุนุงู ูุงุช ุญุณุงุณุฉ</h3> | |
| <p class="text-2xl font-bold mt-1">1</p> | |
| </div> | |
| </div> | |
| <!-- Search and Filter --> | |
| <div class="bg-white p-4 rounded-lg shadow mb-6"> | |
| <div class="flex flex-col md:flex-row gap-4"> | |
| <div class="flex-1 relative"> | |
| <input type="text" placeholder="ุงุจุญุซ ูู ุงูุจูุงูุงุช..." class="w-full pr-10 pl-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| <i class="fas fa-search absolute right-3 top-3 text-gray-400"></i> | |
| </div> | |
| <select class="bg-gray-50 border rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| <option>ุฌู ูุน ุงูุชุตูููุงุช</option> | |
| <option>ุญูููู</option> | |
| <option>ุญุณุงุณ/ู ุดุจูู</option> | |
| </select> | |
| <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg transition-colors"> | |
| ุชุทุจูู ุงูููุชุฑ | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Data Table --> | |
| <div class="bg-white rounded-lg shadow overflow-hidden"> | |
| <div class="overflow-x-auto scrollbar-hide"> | |
| <table class="min-w-full divide-y divide-gray-200"> | |
| <thead class="bg-gray-50"> | |
| <tr> | |
| <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">ุงูุฑูู </th> | |
| <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">ุงูุดุฑุญ ุงูู ุญุชู ู</th> | |
| <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">ุงูุชุตููู</th> | |
| <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">ุงูุฅุฌุฑุงุกุงุช</th> | |
| </tr> | |
| </thead> | |
| <tbody class="bg-white divide-y divide-gray-200"> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">0602</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุดูุฑ ูููู ุชูููุฐ ุงูุนู ููุฉ (2 ููููู)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">215502.657</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ููุช ุชูููุฐ ุงูุนู ููุฉ ุจุงูุซูุงูู ูุงูู ูู ุซุงููุฉ</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">15286</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุฑูู ุนู ููุฉ ุฏุงุฎูู (Process ID ุฃู Transaction ID ุฏุงุฎูู)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">00100000</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ููุฏ ุงูุนู ููุฉ/ุงูู ุนุงู ูุฉ</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">20250602</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุชุงุฑูุฎ ุงูุนู ููุฉ (2 ููููู 2025)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">2153507836</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุฑูู ุงูุทูุจ (Order ID)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">3</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ู ุณุชูู ุงูุณุฌู (Log Level)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">0</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุฎูุงุฑ ุฃู ุญุงูุฉ (Option flag)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="real hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">0000</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ููุฏ ูุฌุงุญ ุงูุนู ููุฉ (Success Code)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">ุญูููู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <tr class="sensitive hover:bg-gray-50 transition-colors"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">5205040000000943</td> | |
| <td class="px-6 py-4 text-sm text-gray-500">ุฑูู ุจุทุงูุฉ ุงุฆุชู ุงู (Card Number)</td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">ุญุณุงุณ/ู ุดุจูู</span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button> | |
| <button class="text-gray-600 hover:text-gray-900"><i class="fas fa-ellipsis-v"></i></button> | |
| </td> | |
| </tr> | |
| <!-- More rows would be added here --> | |
| </tbody> | |
| </table> | |
| </div> | |
| <!-- Pagination --> | |
| <div class="bg-gray-50 px-4 py-3 flex items-center justify-between border-t border-gray-200 sm:px-6"> | |
| <div class="flex-1 flex justify-between sm:hidden"> | |
| <a href="#" class="relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50"> ุงูุณุงุจู </a> | |
| <a href="#" class="ml-3 relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50"> ุงูุชุงูู </a> | |
| </div> | |
| <div class="hidden sm:flex-1 sm:flex sm:items-center sm:justify-between"> | |
| <div> | |
| <p class="text-sm text-gray-700"> | |
| ุนุฑุถ | |
| <span class="font-medium">1</span> | |
| ุฅูู | |
| <span class="font-medium">10</span> | |
| ู ู | |
| <span class="font-medium">27</span> | |
| ูุชุงุฆุฌ | |
| </p> | |
| </div> | |
| <div> | |
| <nav class="relative z-0 inline-flex rounded-md shadow-sm -space-x-px" aria-label="Pagination"> | |
| <a href="#" class="relative inline-flex items-center px-2 py-2 rounded-r-md border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50"> | |
| <span class="sr-only">ุงูุณุงุจู</span> | |
| <i class="fas fa-chevron-right"></i> | |
| </a> | |
| <a href="#" aria-current="page" class="z-10 bg-blue-50 border-blue-500 text-blue-600 relative inline-flex items-center px-4 py-2 border text-sm font-medium"> 1 </a> | |
| <a href="#" class="bg-white border-gray-300 text-gray-500 hover:bg-gray-50 relative inline-flex items-center px-4 py-2 border text-sm font-medium"> 2 </a> | |
| <a href="#" class="bg-white border-gray-300 text-gray-500 hover:bg-gray-50 relative inline-flex items-center px-4 py-2 border text-sm font-medium"> 3 </a> | |
| <a href="#" class="relative inline-flex items-center px-2 py-2 rounded-l-md border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50"> | |
| <span class="sr-only">ุงูุชุงูู</span> | |
| <i class="fas fa-chevron-left"></i> | |
| </a> | |
| </nav> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Footer --> | |
| <div class="mt-8 text-center text-sm text-gray-500"> | |
| <p>ยฉ 2023 ูุธุงู ุชุญููู ุงูุจูุงูุงุช ุงูู ุงููุฉ. ุฌู ูุน ุงูุญููู ู ุญููุธุฉ.</p> | |
| </div> | |
| </div> | |
| <script> | |
| // You can add JavaScript functionality here | |
| document.addEventListener('DOMContentLoaded', function() { | |
| // Example: Add click event for export button | |
| document.querySelector('button.bg-blue-600').addEventListener('click', function() { | |
| alert('ุณูุชู ุชุตุฏูุฑ ุงูุจูุงูุงุช ุฅูู ู ูู Excel'); | |
| }); | |
| // Example: Add search functionality | |
| const searchInput = document.querySelector('input[type="text"]'); | |
| searchInput.addEventListener('input', function() { | |
| const searchTerm = this.value.toLowerCase(); | |
| const rows = document.querySelectorAll('tbody tr'); | |
| rows.forEach(row => { | |
| const text = row.textContent.toLowerCase(); | |
| if (text.includes(searchTerm)) { | |
| row.style.display = ''; | |
| } else { | |
| row.style.display = 'none'; | |
| } | |
| }); | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - ๐งฌ <a href="https://enzostvs-deepsite.hf.space?remix=medolibalnar/free-master" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |