lizandrogd/soft_usite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update cloudflare.html

Browse Source
This commit is contained in:
Lizandro Guarnizo
2026-05-12 10:54:37 -05:00
parent 40131e7266
commit 4f5147ab51
1 changed files with 55 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/cloudflare.html
+55 -12
View File
@@ -262,10 +262,13 @@
</div>
<!-- Info del token -->
<div class="grid grid-cols-2 gap-2 text-xs text-gray-600">
<div><span class="font-medium">Token ID:</span> <span class="font-mono" x-text="diagnosData.token_id || '—'"></span></div>
<div><span class="font-medium">Tipo auth:</span> <span x-text="diagnosData.auth_type || diagnosData.token?.auth_type || '—'"></span></div>
<div><span class="font-medium">Estado:</span> <span x-text="diagnosData.token_status || '—'"></span></div>
<div><span class="font-medium">Longitud:</span> <span x-text="diagnosData.token_len + ' chars'"></span></div>
<div><span class="font-medium">Tenía chars sucios:</span> <span x-text="diagnosData.was_dirty ? 'SÍ (saneado)' : 'No'"></span></div>
<div><span class="font-medium">Token ID:</span> <span class="font-mono" x-text="diagnosData.token_id || '—'"></span></div>
<div><span class="font-medium">Longitud:</span> <span x-text="(diagnosData.token_len || diagnosData.token?.length || '—') + ' chars'"></span></div>
<div x-show="diagnosData.user_email"><span class="font-medium">Email:</span> <span x-text="diagnosData.user_email"></span></div>
<div><span class="font-medium">Tenía chars sucios:</span> <span x-text="diagnosData.was_dirty || diagnosData.token?.was_sanitized ? 'SÍ (saneado)' : 'No'"></span></div>
<div x-show="diagnosData.token?.hint_format" class="col-span-2 text-amber-700 font-medium" x-text="diagnosData.token?.hint_format"></div>
</div>
<!-- Políticas raw -->
<div x-show="diagnosData.policies">
@@ -305,12 +308,43 @@
</button>
</div>
<form @submit.prevent="saveConfig()" class="p-5 space-y-4">
<!-- Tipo de autenticación -->
<div>
<label class="text-xs font-medium text-gray-600">API Token *</label>
<label class="text-xs font-medium text-gray-600">Tipo de credencial *</label>
<div class="mt-2 flex gap-4">
<label class="flex items-center gap-2 text-sm cursor-pointer">
<input type="radio" x-model="cfgForm.auth_type" value="token" class="accent-[#8eb02f]" />
<span>API Token <span class="text-xs text-gray-400">(recomendado, 40 chars)</span></span>
</label>
<label class="flex items-center gap-2 text-sm cursor-pointer">
<input type="radio" x-model="cfgForm.auth_type" value="global_key" class="accent-[#8eb02f]" />
<span>Global API Key <span class="text-xs text-gray-400">(API de cuenta, 37 chars)</span></span>
</label>
</div>
</div>
<!-- Email (solo Global API Key) -->
<div x-show="cfgForm.auth_type === 'global_key'">
<label class="text-xs font-medium text-gray-600">Email de la cuenta *</label>
<input x-model="cfgForm.email" type="email"
:required="cfgForm.auth_type === 'global_key'"
placeholder="tucuenta@ejemplo.com"
class="mt-1 w-full border rounded px-3 py-2 text-sm" />
<p class="mt-1 text-xs text-gray-400">El email con el que accedes a dash.cloudflare.com</p>
</div>
<!-- API Token / Global API Key -->
<div>
<label class="text-xs font-medium text-gray-600">
<span x-text="cfgForm.auth_type === 'global_key' ? 'Global API Key *' : 'API Token *'"></span>
</label>
<input x-model="cfgForm.api_token" type="password" required
placeholder="Token de API de Cloudflare (Bearer)"
:placeholder="cfgForm.auth_type === 'global_key' ? 'Global API Key (37 chars hexadecimales)' : 'API Token (40 chars)'"
class="mt-1 w-full border rounded px-3 py-2 text-sm font-mono" />
<p class="mt-1 text-xs text-gray-400">dash.cloudflare.com → Mi perfil → API Tokens → Crear token</p>
<p x-show="cfgForm.auth_type === 'token'" class="mt-1 text-xs text-gray-400">
dash.cloudflare.com → Mi perfil → API Tokens → Crear token
</p>
<p x-show="cfgForm.auth_type === 'global_key'" class="mt-1 text-xs text-gray-400">
dash.cloudflare.com → Mi perfil → API Tokens → Global API Key → View
</p>
</div>
<div>
<label class="text-xs font-medium text-gray-600">Account ID (opcional)</label>
@@ -361,23 +395,32 @@ document.addEventListener('alpine:init', () => {
diagnosLoading: false,
diagnosData: null,
diagnosError: '',
cfgForm: { id: 0, api_token: '', account_id: '', nota: '' },
cfgForm: {
id: {{ if .Config }}{{ .Config.ID }}{{ else }}0{{ end }},
auth_type: '{{ if .Config }}{{ .Config.AuthType }}{{ else }}token{{ end }}',
api_token: '',
email: '{{ if .Config }}{{ .Config.Email }}{{ else }}{{ end }}',
account_id: '{{ if .Config }}{{ .Config.AccountID }}{{ else }}{{ end }}',
nota: '{{ if .Config }}{{ .Config.Nota }}{{ else }}{{ end }}',
},
toast: { show: false, msg: '', type: 'ok' },
async init() {
try {
const [uRes, zRes] = await Promise.all([
axios.get('/app/cloudflare/user'),
axios.get('/app/cloudflare/zones'),
]);
this.user = uRes.data.data || {};
const zRes = await axios.get('/app/cloudflare/zones');
this.zones = zRes.data.data || [];
this.hasConfig = true;
this.lastFetch = new Date().toLocaleTimeString();
} catch (e) {
if (e.response?.status === 503) this.hasConfig = false;
else this.hasConfig = true;
return;
}
// /user puede fallar para tokens de zona → no bloquea la carga
try {
const uRes = await axios.get('/app/cloudflare/user');
this.user = uRes.data.data || {};
} catch (_) {}
},
setTab(tab) {