|
|
|
|
|
<div
|
|
|
x-cloak
|
|
|
x-show="isLoading"
|
|
|
class="bg-white rounded-lg shadow-md p-8 text-center"
|
|
|
>
|
|
|
<div class="flex flex-col items-center">
|
|
|
<svg class="animate-spin h-12 w-12 mb-4 text-primary-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
|
|
|
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
|
|
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
|
|
|
</svg>
|
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">数据加载中</h3>
|
|
|
<p class="text-gray-500 max-w-md mx-auto">
|
|
|
请稍候，正在加载您的API密钥数据...
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div
|
|
|
x-cloak
|
|
|
x-show="!isLoading && searchTerm !== '' && apiKeys.filter(key => platformFilters[key.platform] && (currentView === 'valid' ? key.success === true : key.success === false) && matchesSearch(key.name, key.key)).length === 0"
|
|
|
class="bg-white rounded-lg shadow-md p-8 text-center"
|
|
|
>
|
|
|
<div class="flex flex-col items-center">
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-16 mb-4 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
|
|
|
</svg>
|
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">无搜索结果</h3>
|
|
|
<p class="text-gray-500 mb-6 max-w-md mx-auto">
|
|
|
没有找到与 "<span x-text="searchTerm" class="font-medium"></span>" 匹配的API密钥
|
|
|
</p>
|
|
|
<button
|
|
|
@click="searchTerm = ''"
|
|
|
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 transition-colors duration-200 space-x-2"
|
|
|
>
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
|
|
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
|
|
|
</svg>
|
|
|
<span>清除搜索</span>
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
x-cloak
|
|
|
x-show="!isLoading && totalKeyCount() === 0 && searchTerm === ''"
|
|
|
class="bg-white rounded-lg shadow-md p-8 text-center"
|
|
|
>
|
|
|
<div class="flex flex-col items-center">
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-16 mb-4 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
|
|
</svg>
|
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">暂无API密钥</h3>
|
|
|
<p class="text-gray-500 mb-6 max-w-md mx-auto">
|
|
|
添加您的第一个API密钥以开始管理。您可以添加来自不同平台的多个密钥，方便快捷地使用。
|
|
|
</p>
|
|
|
<button
|
|
|
@click="showAddModal = true"
|
|
|
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 transition-colors duration-200 space-x-2"
|
|
|
>
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
|
|
<path fill-rule="evenodd" d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z" clip-rule="evenodd" />
|
|
|
</svg>
|
|
|
<span>添加第一个API密钥</span>
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
