phase 1
This commit is contained in:
Stefanescu Mihai
@@ -0,0 +1,37 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
||||
{{ __('Add Website') }}
|
||||
</h2>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-2xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<form method="POST" action="{{ route('websites.store') }}">
|
||||
@csrf
|
||||
|
||||
<div class="mb-6">
|
||||
<x-input-label for="name" :value="__('Website Name')" />
|
||||
<x-text-input id="name" name="name" type="text" class="mt-1 block w-full" :value="old('name')" required autofocus placeholder="My Website" />
|
||||
<x-input-error class="mt-2" :messages="$errors->get('name')" />
|
||||
</div>
|
||||
|
||||
<div class="mb-6">
|
||||
<x-input-label for="domain" :value="__('Domain')" />
|
||||
<x-text-input id="domain" name="domain" type="text" class="mt-1 block w-full" :value="old('domain')" required placeholder="example.com" />
|
||||
<p class="mt-1 text-sm text-gray-500">{{ __('Enter the domain without http:// or https://') }}</p>
|
||||
<x-input-error class="mt-2" :messages="$errors->get('domain')" />
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-4">
|
||||
<x-primary-button>{{ __('Add Website') }}</x-primary-button>
|
||||
<a href="{{ route('websites.index') }}" class="text-sm text-gray-600 hover:text-gray-900">{{ __('Cancel') }}</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
@@ -0,0 +1,57 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
||||
{{ __('Edit Website') }}: {{ $website->name }}
|
||||
</h2>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-2xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<form method="POST" action="{{ route('websites.update', $website) }}">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
|
||||
<div class="mb-6">
|
||||
<x-input-label for="name" :value="__('Website Name')" />
|
||||
<x-text-input id="name" name="name" type="text" class="mt-1 block w-full" :value="old('name', $website->name)" required autofocus />
|
||||
<x-input-error class="mt-2" :messages="$errors->get('name')" />
|
||||
</div>
|
||||
|
||||
<div class="mb-6">
|
||||
<x-input-label for="domain" :value="__('Domain')" />
|
||||
<x-text-input id="domain" name="domain" type="text" class="mt-1 block w-full" :value="old('domain', $website->domain)" required />
|
||||
<p class="mt-1 text-sm text-gray-500">{{ __('Enter the domain without http:// or https://') }}</p>
|
||||
<x-input-error class="mt-2" :messages="$errors->get('domain')" />
|
||||
</div>
|
||||
|
||||
<div class="mb-6">
|
||||
<label for="is_active" class="inline-flex items-center">
|
||||
<input id="is_active" type="checkbox" name="is_active" value="1" class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500" {{ old('is_active', $website->is_active) ? 'checked' : '' }}>
|
||||
<span class="ms-2 text-sm text-gray-600">{{ __('Active') }}</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-4">
|
||||
<x-primary-button>{{ __('Save Changes') }}</x-primary-button>
|
||||
<a href="{{ route('websites.show', $website) }}" class="text-sm text-gray-600 hover:text-gray-900">{{ __('Cancel') }}</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-6 bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<h3 class="text-lg font-medium text-red-600 mb-4">{{ __('Danger Zone') }}</h3>
|
||||
<p class="text-sm text-gray-600 mb-4">{{ __('Deleting a website will permanently remove all its analytics data. This action cannot be undone.') }}</p>
|
||||
<form method="POST" action="{{ route('websites.destroy', $website) }}" onsubmit="return confirm('Are you sure you want to delete this website and all its data?');">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<x-danger-button>{{ __('Delete Website') }}</x-danger-button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
@@ -0,0 +1,67 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
||||
{{ __('Websites') }}
|
||||
</h2>
|
||||
<a href="{{ route('websites.create') }}" class="inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 focus:bg-gray-700 active:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150">
|
||||
{{ __('Add Website') }}
|
||||
</a>
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
@if (session('success'))
|
||||
<div class="mb-4 rounded-md bg-green-50 p-4">
|
||||
<p class="text-sm font-medium text-green-800">{{ session('success') }}</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if ($websites->isEmpty())
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-12 text-center">
|
||||
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418" />
|
||||
</svg>
|
||||
<h3 class="mt-2 text-sm font-semibold text-gray-900">{{ __('No websites') }}</h3>
|
||||
<p class="mt-1 text-sm text-gray-500">{{ __('Get started by adding your first website.') }}</p>
|
||||
<div class="mt-6">
|
||||
<a href="{{ route('websites.create') }}" class="inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700">
|
||||
{{ __('Add Website') }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||||
@foreach ($websites as $website)
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h3 class="text-lg font-semibold text-gray-900 truncate">
|
||||
<a href="{{ route('websites.show', $website) }}" class="hover:text-indigo-600">
|
||||
{{ $website->name }}
|
||||
</a>
|
||||
</h3>
|
||||
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium {{ $website->is_active ? 'bg-green-100 text-green-700' : 'bg-gray-100 text-gray-600' }}">
|
||||
{{ $website->is_active ? 'Active' : 'Inactive' }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="text-sm text-gray-500 mb-1">{{ $website->domain }}</p>
|
||||
<p class="text-xs text-gray-400 font-mono">{{ $website->tracking_id }}</p>
|
||||
|
||||
<div class="mt-4 flex items-center gap-3 text-sm">
|
||||
<a href="{{ route('websites.show', $website) }}" class="text-indigo-600 hover:text-indigo-800">View</a>
|
||||
<a href="{{ route('websites.snippet', $website) }}" class="text-indigo-600 hover:text-indigo-800">Snippet</a>
|
||||
<a href="{{ route('websites.edit', $website) }}" class="text-gray-600 hover:text-gray-800">Edit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
@@ -0,0 +1,63 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
||||
{{ $website->name }}
|
||||
</h2>
|
||||
<div class="flex items-center gap-3">
|
||||
<a href="{{ route('websites.snippet', $website) }}" class="inline-flex items-center px-4 py-2 bg-indigo-600 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150">
|
||||
{{ __('Get Snippet') }}
|
||||
</a>
|
||||
<a href="{{ route('websites.edit', $website) }}" class="inline-flex items-center px-4 py-2 bg-white border border-gray-300 rounded-md font-semibold text-xs text-gray-700 uppercase tracking-widest hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150">
|
||||
{{ __('Settings') }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
@if (session('success'))
|
||||
<div class="mb-4 rounded-md bg-green-50 p-4">
|
||||
<p class="text-sm font-medium text-green-800">{{ session('success') }}</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="grid gap-6 md:grid-cols-2 lg:grid-cols-4 mb-8">
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
|
||||
<dt class="text-sm font-medium text-gray-500 truncate">{{ __('Domain') }}</dt>
|
||||
<dd class="mt-1 text-lg font-semibold text-gray-900">{{ $website->domain }}</dd>
|
||||
</div>
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
|
||||
<dt class="text-sm font-medium text-gray-500 truncate">{{ __('Tracking ID') }}</dt>
|
||||
<dd class="mt-1 text-lg font-semibold text-gray-900 font-mono">{{ $website->tracking_id }}</dd>
|
||||
</div>
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
|
||||
<dt class="text-sm font-medium text-gray-500 truncate">{{ __('Status') }}</dt>
|
||||
<dd class="mt-1">
|
||||
<span class="inline-flex items-center rounded-full px-2.5 py-0.5 text-sm font-medium {{ $website->is_active ? 'bg-green-100 text-green-800' : 'bg-gray-100 text-gray-800' }}">
|
||||
{{ $website->is_active ? 'Active' : 'Inactive' }}
|
||||
</span>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
|
||||
<dt class="text-sm font-medium text-gray-500 truncate">{{ __('Created') }}</dt>
|
||||
<dd class="mt-1 text-lg font-semibold text-gray-900">{{ $website->created_at->format('M j, Y') }}</dd>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6 text-center text-gray-500">
|
||||
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z" />
|
||||
</svg>
|
||||
<p class="mt-2">{{ __('Analytics dashboard will be available here once data is collected.') }}</p>
|
||||
<p class="mt-1 text-sm">{{ __('Make sure you have added the tracking snippet to your website.') }}</p>
|
||||
<a href="{{ route('websites.snippet', $website) }}" class="mt-4 inline-flex items-center text-sm text-indigo-600 hover:text-indigo-800">
|
||||
{{ __('View tracking snippet') }} →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
@@ -0,0 +1,93 @@
|
||||
<x-app-layout>
|
||||
<x-slot name="header">
|
||||
<div class="flex items-center justify-between">
|
||||
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
||||
{{ __('Tracking Snippet') }}: {{ $website->name }}
|
||||
</h2>
|
||||
<a href="{{ route('websites.show', $website) }}" class="text-sm text-gray-600 hover:text-gray-900">
|
||||
← {{ __('Back to website') }}
|
||||
</a>
|
||||
</div>
|
||||
</x-slot>
|
||||
|
||||
<div class="py-12">
|
||||
<div class="max-w-3xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-2">{{ __('Install the tracking code') }}</h3>
|
||||
<p class="text-sm text-gray-600 mb-6">
|
||||
{{ __('Copy and paste the following code snippet into the') }}
|
||||
<code class="text-sm bg-gray-100 px-1.5 py-0.5 rounded"><head></code>
|
||||
{{ __('section of every page on') }}
|
||||
<strong>{{ $website->domain }}</strong>.
|
||||
</p>
|
||||
|
||||
<div class="relative" x-data="{ copied: false }">
|
||||
<pre class="bg-gray-900 text-gray-100 rounded-lg p-4 text-sm overflow-x-auto"><code id="snippet-code">{{ $website->embedSnippet() }}</code></pre>
|
||||
|
||||
<button
|
||||
@click="
|
||||
navigator.clipboard.writeText(document.getElementById('snippet-code').textContent);
|
||||
copied = true;
|
||||
setTimeout(() => copied = false, 2000);
|
||||
"
|
||||
class="absolute top-3 right-3 inline-flex items-center gap-1 rounded-md bg-gray-700 px-2.5 py-1.5 text-xs font-medium text-gray-200 hover:bg-gray-600 transition"
|
||||
>
|
||||
<span x-show="!copied">{{ __('Copy') }}</span>
|
||||
<span x-show="copied" x-cloak>{{ __('Copied!') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-6 bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-2">{{ __('Track custom events') }}</h3>
|
||||
<p class="text-sm text-gray-600 mb-4">
|
||||
{{ __('After the tracking script is loaded, you can send custom events from anywhere in your JavaScript:') }}
|
||||
</p>
|
||||
|
||||
<pre class="bg-gray-900 text-gray-100 rounded-lg p-4 text-sm overflow-x-auto"><code>// Basic event
|
||||
ta('event', 'signup');
|
||||
|
||||
// Event with details
|
||||
ta('event', 'purchase', {
|
||||
category: 'ecommerce',
|
||||
action: 'checkout',
|
||||
label: 'premium_plan',
|
||||
value: 29.99,
|
||||
properties: {
|
||||
plan: 'premium',
|
||||
period: 'monthly'
|
||||
}
|
||||
});</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-6 bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
||||
<div class="p-6">
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-4">{{ __('Details') }}</h3>
|
||||
|
||||
<dl class="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<div>
|
||||
<dt class="text-sm font-medium text-gray-500">{{ __('Tracking ID') }}</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 font-mono">{{ $website->tracking_id }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-sm font-medium text-gray-500">{{ __('Domain') }}</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900">{{ $website->domain }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-sm font-medium text-gray-500">{{ __('Script URL') }}</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 font-mono break-all">{{ route('tracking.script', $website->tracking_id) }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-sm font-medium text-gray-500">{{ __('Collection Endpoint') }}</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 font-mono break-all">{{ route('collect.store') }}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</x-app-layout>
|
||||
Reference in New Issue
Block a user