|
|
<!DOCTYPE html> |
|
|
<html lang="ko"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>OTT μΈκΈκ³μ°μ μ μ° μμ€ν
</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> |
|
|
.sidebar { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.dropdown-content { |
|
|
display: none; |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.dropdown:hover .dropdown-content { |
|
|
display: block; |
|
|
} |
|
|
.checkbox-custom { |
|
|
appearance: none; |
|
|
-webkit-appearance: none; |
|
|
-moz-appearance: none; |
|
|
width: 20px; |
|
|
height: 20px; |
|
|
border: 2px solid #3b82f6; |
|
|
border-radius: 4px; |
|
|
outline: none; |
|
|
cursor: pointer; |
|
|
position: relative; |
|
|
} |
|
|
.checkbox-custom:checked { |
|
|
background-color: #3b82f6; |
|
|
} |
|
|
.checkbox-custom:checked::after { |
|
|
content: "\2713"; |
|
|
font-size: 14px; |
|
|
color: white; |
|
|
position: absolute; |
|
|
top: 50%; |
|
|
left: 50%; |
|
|
transform: translate(-50%, -50%); |
|
|
} |
|
|
.service-tab { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.service-tab:hover { |
|
|
transform: translateY(-2px); |
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); |
|
|
} |
|
|
.mapping-highlight { |
|
|
animation: pulse 2s infinite; |
|
|
} |
|
|
@keyframes pulse { |
|
|
0% { background-color: #f0f9ff; } |
|
|
50% { background-color: #e0f2fe; } |
|
|
100% { background-color: #f0f9ff; } |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50"> |
|
|
|
|
|
<nav class="bg-blue-600 text-white shadow-lg"> |
|
|
<div class="container mx-auto px-4 py-3 flex justify-between items-center"> |
|
|
<div class="flex items-center space-x-4"> |
|
|
<i class="fas fa-video text-2xl"></i> |
|
|
<span class="text-xl font-bold">OTT μ μ° μμ€ν
</span> |
|
|
</div> |
|
|
<div class="flex items-center space-x-6"> |
|
|
<div class="dropdown relative"> |
|
|
<button class="flex items-center space-x-2 focus:outline-none"> |
|
|
<img src="https://ui-avatars.com/api/?name=κ΄λ¦¬μ" alt="User" class="w-8 h-8 rounded-full"> |
|
|
<span>κΉλ΄λΉμ</span> |
|
|
<i class="fas fa-chevron-down"></i> |
|
|
</button> |
|
|
<div class="dropdown-content absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 z-50 hidden"> |
|
|
<a href="#" class="block px-4 py-2 text-gray-800 hover:bg-blue-100">νλ‘ν μ€μ </a> |
|
|
<a href="#" class="block px-4 py-2 text-gray-800 hover:bg-blue-100">λ‘κ·Έμμ</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
<div class="flex"> |
|
|
|
|
|
<div class="sidebar bg-white w-64 min-h-screen shadow-md p-4 flex flex-col"> |
|
|
<div class="mb-8 mt-4"> |
|
|
<h2 class="text-lg font-semibold text-gray-700">Main Menu</h2> |
|
|
</div> |
|
|
<ul class="space-y-2"> |
|
|
<li> |
|
|
<a href="#" class="flex items-center p-2 text-gray-600 rounded-lg hover:bg-blue-50 hover:text-blue-600"> |
|
|
<i class="fas fa-home mr-3"></i> |
|
|
<span>λμ보λ</span> |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="#" class="flex items-center p-2 text-blue-600 bg-blue-50 rounded-lg"> |
|
|
<i class="fas fa-file-invoice-dollar mr-3"></i> |
|
|
<span>μΈκΈκ³μ°μ κ΄λ¦¬</span> |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="#" class="flex items-center p-2 text-gray-600 rounded-lg hover:bg-blue-50 hover:text-blue-600"> |
|
|
<i class="fas fa-calculator mr-3"></i> |
|
|
<span>μ μ° κ΄λ¦¬</span> |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="#" class="flex items-center p-2 text-gray-600 rounded-lg hover:bg-blue-50 hover:text-blue-600"> |
|
|
<i class="fas fa-file-alt mr-3"></i> |
|
|
<span>μ ν κ΄λ¦¬</span> |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="#" class="flex items-center p-2 text-gray-600 rounded-lg hover:bg-blue-50 hover:text-blue-600"> |
|
|
<i class="fas fa-chart-bar mr-3"></i> |
|
|
<span>λΆμ 리ν¬νΈ</span> |
|
|
</a> |
|
|
</li> |
|
|
</ul> |
|
|
<div class="mt-auto p-4 text-sm text-gray-500"> |
|
|
<p>Β© 2023 OTT μ μ°ν</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex-1 p-8"> |
|
|
<div class="mb-6"> |
|
|
<h1 class="text-2xl font-bold text-gray-800">μΈκΈκ³μ°μ κ΄λ¦¬</h1> |
|
|
<p class="text-gray-600">λ°νλ μΈκΈκ³μ°μλ₯Ό μ‘°ννκ³ μ μ° κ²°κ³Όμ 맀ννμ¬ μ νλ₯Ό λ°νν μ μμ΅λλ€.</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg shadow p-6 mb-6"> |
|
|
<div class="flex justify-between items-center mb-4"> |
|
|
<h2 class="text-lg font-semibold text-gray-800">μ‘°ν 쑰건 μ€μ </h2> |
|
|
</div> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4"> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">μ μ° κΈ°κ°</label> |
|
|
<select class="w-full border border-gray-300 rounded-md py-2 px-3 focus:outline-none focus:ring-2 focus:ring-blue-500"> |
|
|
<option>2023λ
10μ</option> |
|
|
<option>2023λ
9μ</option> |
|
|
<option>2023λ
8μ</option> |
|
|
<option>2023λ
7μ</option> |
|
|
</select> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">OTT μλΉμ€</label> |
|
|
<select class="w-full border border-gray-300 rounded-md py-2 px-3 focus:outline-none focus:ring-2 focus:ring-blue-500"> |
|
|
<option>μ 체 μλΉμ€</option> |
|
|
<option>OTT μλΉμ€ A</option> |
|
|
<option>OTT μλΉμ€ B</option> |
|
|
<option>OTT μλΉμ€ C</option> |
|
|
</select> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-700 mb-1">CP μ¬μ
μ</label> |
|
|
<select class="w-full border border-gray-300 rounded-md py-2 px-3 focus:outline-none focus:ring-2 focus:ring-blue-500"> |
|
|
<option>μ 체 CP</option> |
|
|
<option>ABC 컨ν
μΈ </option> |
|
|
<option>XYZ λ―Έλμ΄</option> |
|
|
<option>DEF μν°ν
μΈλ¨ΌνΈ</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="flex items-end"> |
|
|
<button class="w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-md transition duration-300"> |
|
|
μ‘°ννκΈ° |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex space-x-4 mb-6"> |
|
|
<div class="service-tab bg-white rounded-lg shadow p-4 cursor-pointer w-1/3 text-center border-b-4 border-blue-500"> |
|
|
<div class="text-sm font-medium text-gray-500">OTT μλΉμ€ A</div> |
|
|
<div class="text-2xl font-bold text-blue-600">15건</div> |
|
|
<div class="text-sm text-green-600">100% 맀ν μλ£</div> |
|
|
</div> |
|
|
<div class="service-tab bg-white rounded-lg shadow p-4 cursor-pointer w-1/3 text-center border-b-4 border-yellow-500"> |
|
|
<div class="text-sm font-medium text-gray-500">OTT μλΉμ€ B</div> |
|
|
<div class="text-2xl font-bold text-yellow-600">8건</div> |
|
|
<div class="text-sm text-red-600">50% 맀ν νμ</div> |
|
|
</div> |
|
|
<div class="service-tab bg-white rounded-lg shadow p-4 cursor-pointer w-1/3 text-center border-b-4 border-purple-500"> |
|
|
<div class="text-sm font-medium text-gray-500">OTT μλΉμ€ C</div> |
|
|
<div class="text-2xl font-bold text-purple-600">12건</div> |
|
|
<div class="text-sm text-green-600">100% 맀ν μλ£</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg shadow overflow-hidden mb-6"> |
|
|
<div class="px-6 py-4 border-b flex justify-between items-center"> |
|
|
<h2 class="text-lg font-semibold text-gray-800">μΈκΈκ³μ°μ λͺ©λ‘ (μ΄ 35건)</h2> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="bg-gray-100 hover:bg-gray-200 text-gray-700 py-1 px-3 rounded-md text-sm"> |
|
|
<i class="fas fa-download mr-1"></i> μμ
λ€μ΄λ‘λ |
|
|
</button> |
|
|
<button class="bg-blue-50 hover:bg-blue-100 text-blue-600 py-1 px-3 rounded-md text-sm"> |
|
|
<i class="fas fa-sync-alt mr-1"></i> μλ‘κ³ μΉ¨ |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="overflow-x-auto"> |
|
|
<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-left text-xs font-medium text-gray-500 uppercase tracking-wider">μ ν</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">λ°νμΌμ</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">μΈκΈκ³μ°μ λ²νΈ</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">CP μ¬μ
μ</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">κΈμ‘ (VAT ν¬ν¨)</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">λ°°μ μλΉμ€</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">μν</th> |
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">μ‘μ
</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody class="bg-white divide-y divide-gray-200"> |
|
|
<tr class="hover:bg-gray-50"> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<input type="checkbox" class="checkbox-custom"> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-10-15</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-blue-600">TAX-20231015-001</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">ABC 컨ν
μΈ </td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">12,550,000 μ</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<div class="flex space-x-1"> |
|
|
<span class="px-2 py-1 text-xs bg-blue-100 text-blue-800 rounded-full">μλΉμ€ A</span> |
|
|
<span class="px-2 py-1 text-xs bg-yellow-100 text-yellow-800 rounded-full">μλΉμ€ B</span> |
|
|
</div> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<span class="px-2 py-1 text-xs bg-green-100 text-green-800 rounded-full">맀ν μλ£</span> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> |
|
|
<button class="text-blue-600 hover:text-blue-800">μμΈλ³΄κΈ°</button> |
|
|
</td> |
|
|
</tr> |
|
|
<tr class="hover:bg-gray-50 mapping-highlight"> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<input type="checkbox" class="checkbox-custom"> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-10-14</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-blue-600">TAX-20231014-003</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">XYZ λ―Έλμ΄</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">8,750,000 μ</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<div class="flex space-x-1"> |
|
|
<span class="px-2 py-1 text-xs bg-blue-100 text-blue-800 rounded-full">μλΉμ€ A</span> |
|
|
<span class="px-2 py-1 text-xs bg-purple-100 text-purple-800 rounded-full">μλΉμ€ C</span> |
|
|
</div> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap"> |
|
|
<span class="px-2 py-1 text-xs bg-yellow-100 text-yellow-800 rounded-full">맀ν νμ</span> |
|
|
</td> |
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> |
|
|
<button class="text-blue-600 hover:text-blue-800">μμΈλ³΄κΈ°</button> |
|
|
</td> |
|
|
</tr> |
|
|
|
|
|
</tbody> |
|
|
</table> |
|
|
</div> |
|
|
<div class="px-6 py-4 border-t border-gray-200 flex items-center justify-between bg-gray-50"> |
|
|
<div class="text-sm text-gray-500"> |
|
|
<span>1-10 of 35 items</span> |
|
|
</div> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="px-3 py-1 border rounded-md text-sm bg-white text-gray-700 hover:bg-gray-50"> |
|
|
Previous |
|
|
</button> |
|
|
<button class="px-3 py-1 border rounded-md text-sm bg-blue-600 text-white"> |
|
|
1 |
|
|
</button> |
|
|
<button class="px-3 py-1 border rounded-md text-sm bg-white text-gray-700 hover:bg-gray-50"> |
|
|
2 |
|
|
</button> |
|
|
<button class="px-3 py-1 border rounded-md text-sm bg-white text-gray-700 hover:bg-gray-50"> |
|
|
Next |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex justify-end space-x-3 mb-6"> |
|
|
<button class="px-4 py-2 bg-gray-100 text-gray-700 rounded-md hover:bg-gray-200 text-sm"> |
|
|
<i class="fas fa-file-export mr-2"></i>μΌκ΄ λ΄λ³΄λ΄κΈ° |
|
|
</button> |
|
|
<button class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-sm"> |
|
|
<i class="fas fa-file-invoice mr-2"></i>SAP μ ν λ°ν |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="mappingModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden"> |
|
|
<div class="bg-white rounded-lg shadow-xl w-full max-w-4xl"> |
|
|
<div class="px-6 py-4 border-b flex justify-between items-center"> |
|
|
<h2 class="text-xl font-semibold text-gray-800">μΈκΈκ³μ°μ μμΈ λ° λ§€ν</h2> |
|
|
<button onclick="closeModal()" class="text-gray-500 hover:text-gray-700"> |
|
|
<i class="fas fa-times"></i> |
|
|
</button> |
|
|
</div> |
|
|
<div class="p-6"> |
|
|
<div class="grid grid-cols-2 gap-6 mb-8"> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">μΈκΈκ³μ°μ μ 보</h3> |
|
|
<div class="space-y-4"> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500">CP μ¬μ
μ</label> |
|
|
<p class="mt-1 text-sm text-gray-900">XYZ λ―Έλμ΄</p> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500">μΈκΈκ³μ°μ λ²νΈ</label> |
|
|
<p class="mt-1 text-sm text-gray-900">TAX-20231014-003</p> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500">λ°ν κΈμ‘ (VAT ν¬ν¨)</label> |
|
|
<p class="mt-1 text-sm text-gray-900">8,750,000 μ</p> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500">λ°ν μΌμ</label> |
|
|
<p class="mt-1 text-sm text-gray-900">2023-10-14</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium text-gray-900 mb-4">μ μ° μ 보 맀ν</h3> |
|
|
<div class="space-y-4"> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500 mb-1">μ μ° κΈ°κ°</label> |
|
|
<select class="w-full border border-gray-300 rounded-md py-2 px-3 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm"> |
|
|
<option>2023λ
10μ</option> |
|
|
<option>2023λ
9μ</option> |
|
|
</select> |
|
|
</div> |
|
|
<div> |
|
|
<label class="block text-sm font-medium text-gray-500">μ 체 μ μ° κΈμ‘</label> |
|
|
<p class="mt-1 text-sm font-bold text-gray-900">8,750,000 μ</p> |
|
|
</div> |
|
|
<div class="border-t pt-4"> |
|
|
<h4 class="text-sm font-medium text-gray-700 mb-3">μλΉμ€λ³ μ μ° κΈμ‘ 맀ν</h4> |
|
|
<div class="space-y-3"> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="serviceA" class="checkbox-custom mr-3"> |
|
|
<label for="serviceA" class="flex-1 text-sm text-gray-900">OTT μλΉμ€ A</label> |
|
|
<input type="number" class="w-32 border border-gray-300 rounded-md py-1 px-2 focus:outline-none focus:ring-1 focus:ring-blue-500 text-sm" placeholder="κΈμ‘ μ
λ ₯" value="5,250,000"> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="serviceB" class="checkbox-custom mr-3" checked> |
|
|
<label for="serviceB" class="flex-1 text-sm text-gray-900">OTT μλΉμ€ B</label> |
|
|
<input type="number" class="w-32 border border-gray-300 rounded-md py-1 px-2 focus:outline-none focus:ring-1 focus:ring-blue-500 text-sm" placeholder="κΈμ‘ μ
λ ₯" value="0"> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="serviceC" class="checkbox-custom mr-3" checked> |
|
|
<label for="serviceC" class="flex-1 text-sm text-gray-900">OTT μλΉμ€ C</label> |
|
|
<input type="number" class="w-32 border border-gray-300 rounded-md py-1 px-2 focus:outline-none focus:ring-1 focus:ring-blue-500 text-sm" placeholder="κΈμ‘ μ
λ ₯" value="3,500,000"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-blue-50 p-4 rounded-md mb-6"> |
|
|
<div class="flex items-start"> |
|
|
<div class="flex-shrink-0 pt-1"> |
|
|
<i class="fas fa-info-circle text-blue-500"></i> |
|
|
</div> |
|
|
<div class="ml-3"> |
|
|
<h3 class="text-sm font-medium text-blue-800">맀ν μλ΄</h3> |
|
|
<div class="mt-2 text-sm text-blue-700"> |
|
|
<p> |
|
|
ν΄λΉ μΈκΈκ³μ°μκ° μ΄λ€ OTT μλΉμ€μ ν΄λΉνλμ§ μ²΄ν¬λ°μ€λ₯Ό μ ννκ³ κΈμ‘μ μ
λ ₯ν΄μ£ΌμΈμ. |
|
|
μ¬λ¬ μλΉμ€μ κ±Έμ³ μλ κ²½μ° κ° μλΉμ€λ³ κΈμ‘μ λΆν νμ¬ μ
λ ₯ν μ μμ΅λλ€. |
|
|
μ μ° μμ€ν
μ μ 체 μ μ° κΈμ‘κ³Ό μΈκΈκ³μ°μ κΈμ‘μ΄ μΌμΉν΄μΌ μ ν λ°νμ΄ κ°λ₯ν©λλ€. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex justify-end space-x-3"> |
|
|
<button onclick="closeModal()" class="px-4 py-2 bg-gray-100 text-gray-700 rounded-md hover:bg-gray-200"> |
|
|
μ·¨μ |
|
|
</button> |
|
|
<button onclick="verifyAndSubmit()" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700"> |
|
|
κ²μ¦ λ° SAP μ ν λ°ν |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
|
|
|
function openModal() { |
|
|
document.getElementById('mappingModal').classList.remove('hidden'); |
|
|
} |
|
|
|
|
|
|
|
|
function closeModal() { |
|
|
document.getElementById('mappingModal').classList.add('hidden'); |
|
|
} |
|
|
|
|
|
|
|
|
function verifyAndSubmit() { |
|
|
|
|
|
alert('μ μ° κΈμ‘μ΄ μΌμΉνμ¬ SAP μμμ νκ° λ°νλμμ΅λλ€.'); |
|
|
closeModal(); |
|
|
} |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
document.querySelectorAll('tbody tr').forEach(row => { |
|
|
row.addEventListener('click', function(e) { |
|
|
if (!e.target.classList.contains('checkbox-custom')) { |
|
|
openModal(); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
}); |
|
|
</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=r2d209/ncss1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
