Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
c98ed6b5b3 | ||
|
|
0a3e142f47 | ||
|
|
ce41c1ece7 | ||
|
|
ef8b230ece | ||
|
|
27f67f239b | ||
|
|
0a43d694ab | ||
|
|
5e92f77db1 | ||
|
|
131df28d99 | ||
|
|
99d3053508 | ||
|
|
97a30ee6b3 | ||
|
|
5166cd8a64 | ||
|
|
b737725be4 | ||
|
|
84cf01c927 | ||
|
|
9345efbfdb | ||
|
|
fb36f13a43 | ||
|
|
c11cc99d17 | ||
|
|
29a29224dd | ||
|
|
3744da58cb | ||
|
|
7b6adf6f7a | ||
|
|
194b921727 | ||
|
|
24610cdedf | ||
|
|
a3c2c2a2bb | ||
|
|
176ad4eaba | ||
|
|
2c7d8873ed | ||
|
|
236276c15a | ||
|
|
30ec8943dc | ||
|
|
742592ab0d | ||
|
|
6fdb64bc9f | ||
|
|
a85521fd2a | ||
|
|
53cf63c23d | ||
|
|
48327cfc56 | ||
|
|
5776559690 | ||
|
|
2b23140a3e | ||
|
|
909d3eb862 | ||
|
|
1ea5397ca5 | ||
|
|
bd443b17fb | ||
|
|
0b17b602e0 | ||
|
|
c5b190db00 | ||
|
|
9430cfaab6 | ||
|
|
60a3ad7391 | ||
|
|
12ee164c19 | ||
|
|
c07ab6b750 | ||
|
|
0038b84fc2 | ||
|
|
60979fe6a2 | ||
|
|
05b30c9fd6 | ||
|
|
c2721c795a | ||
|
|
2991d71ea0 | ||
|
|
a3029d475d | ||
|
|
de2eab7ef8 | ||
|
|
f20360777b | ||
|
|
eee78aa3d2 | ||
|
|
24d47ac04e | ||
|
|
55a2cc71a7 | ||
|
|
b2aede5963 | ||
|
|
a4974098ee | ||
|
|
6119ba3dae | ||
|
|
80968954d1 | ||
|
|
8dbdf171cb | ||
|
|
2ced61fed0 | ||
|
|
20ec89f534 | ||
|
|
b19e2654a1 | ||
|
|
08d3c99996 | ||
|
|
c1f5b029b4 | ||
|
|
06f9742b34 | ||
|
|
f201632382 | ||
|
|
99835e9fb0 | ||
|
|
9800280af0 | ||
|
|
9da0f6e6e1 | ||
|
|
904e76a7a2 | ||
|
|
1422b98807 | ||
|
|
586a04fdad | ||
|
|
fb60664bce | ||
|
|
80584a5d2e | ||
|
|
e8b680059b | ||
|
|
924d97e833 | ||
|
|
701e83d867 | ||
|
|
9aad952eb0 | ||
|
|
f057b3285f | ||
|
|
94fac8fbee | ||
|
|
93682bad8b |
@@ -17,6 +17,11 @@ DB_DATABASE=ladill_merchant
|
||||
DB_USERNAME=ladill_merchant
|
||||
DB_PASSWORD=
|
||||
|
||||
REDIS_CLIENT=phpredis
|
||||
REDIS_HOST=127.0.0.1
|
||||
REDIS_PASSWORD=null
|
||||
REDIS_PORT=6379
|
||||
|
||||
# Read platform admin settings (Paystack keys live in ladilldb.platform_settings).
|
||||
PLATFORM_DB_HOST=127.0.0.1
|
||||
PLATFORM_DB_PORT=3306
|
||||
@@ -24,8 +29,9 @@ PLATFORM_DB_DATABASE=ladilldb
|
||||
PLATFORM_DB_USERNAME=ladill_merchant
|
||||
PLATFORM_DB_PASSWORD=
|
||||
|
||||
SESSION_DRIVER=database
|
||||
SESSION_LIFETIME=120
|
||||
SESSION_DRIVER=redis
|
||||
# Idle web session length in minutes (1440 = 24 hours of inactivity).
|
||||
SESSION_LIFETIME=1440
|
||||
SESSION_DOMAIN=.ladill.com
|
||||
|
||||
LADILL_SSO_CLIENT_ID=
|
||||
@@ -46,4 +52,6 @@ AFIA_PROVIDER=openai
|
||||
AFIA_MODEL=gpt-4o-mini
|
||||
AFIA_API_KEY=
|
||||
|
||||
LINK_PUBLIC_DOMAIN=ladl.link
|
||||
|
||||
VITE_APP_NAME="${APP_NAME}"
|
||||
|
||||
@@ -19,8 +19,9 @@ jobs:
|
||||
env:
|
||||
NODE_ROOT: /tmp/ladill-node-22-r1
|
||||
NODE_VERSION: "22.14.0"
|
||||
RELEASE_ARCHIVE: /tmp/ladill-merchant-release-${{ gitea.run_id }}-${{ gitea.run_attempt }}.tgz
|
||||
WORKSPACE: /tmp/${{ gitea.repository_owner }}-merchant-${{ gitea.run_id }}-${{ gitea.run_attempt }}
|
||||
# act_runner v0.2.x does not expose gitea.run_attempt — use run_id only.
|
||||
RELEASE_ARCHIVE: /tmp/ladill-merchant-release-${{ gitea.run_id }}.tgz
|
||||
WORKSPACE: /tmp/${{ gitea.repository_owner }}-merchant-${{ gitea.run_id }}
|
||||
LADILL_APP_ROOT: /var/www/ladill-merchant
|
||||
steps:
|
||||
- name: Checkout
|
||||
@@ -38,11 +39,17 @@ jobs:
|
||||
clone --depth 1 --single-branch --no-tags --branch "${{ gitea.ref_name }}" \
|
||||
"$REPO_URL" "$WORKSPACE"
|
||||
|
||||
- name: Setup Node.js
|
||||
- name: Build frontend assets
|
||||
shell: bash {0}
|
||||
run: |
|
||||
set -Eeuo pipefail
|
||||
if [ ! -x "$NODE_ROOT/bin/node" ]; then
|
||||
cd "$WORKSPACE"
|
||||
if command -v npm >/dev/null 2>&1 && npm -v >/dev/null 2>&1; then
|
||||
NPM_BIN="$(command -v npm)"
|
||||
elif [ -x "$NODE_ROOT/bin/npm" ]; then
|
||||
export PATH="$NODE_ROOT/bin:$PATH"
|
||||
NPM_BIN="$NODE_ROOT/bin/npm"
|
||||
else
|
||||
rm -rf "$NODE_ROOT"
|
||||
mkdir -p "$NODE_ROOT"
|
||||
case "$(uname -m)" in
|
||||
@@ -52,17 +59,12 @@ jobs:
|
||||
esac
|
||||
curl -fsSL "https://nodejs.org/download/release/v${NODE_VERSION}/node-v${NODE_VERSION}-linux-${NODE_ARCH}.tar.xz" \
|
||||
| tar -xJ --strip-components=1 -C "$NODE_ROOT"
|
||||
export PATH="$NODE_ROOT/bin:$PATH"
|
||||
NPM_BIN="$NODE_ROOT/bin/npm"
|
||||
fi
|
||||
"$NODE_ROOT/bin/node" -v
|
||||
"$NPM_BIN" ci --no-audit --no-fund
|
||||
"$NPM_BIN" run build
|
||||
|
||||
- name: Build frontend assets
|
||||
shell: bash {0}
|
||||
run: |
|
||||
set -Eeuo pipefail
|
||||
cd "$WORKSPACE"
|
||||
export PATH="$NODE_ROOT/bin:$PATH"
|
||||
npm ci --no-audit --no-fund
|
||||
npm run build
|
||||
|
||||
- name: Build release archive
|
||||
shell: bash {0}
|
||||
@@ -78,7 +80,7 @@ jobs:
|
||||
- name: Deploy release
|
||||
shell: bash {0}
|
||||
env:
|
||||
LADILL_RELEASE_ARCHIVE: /tmp/ladill-merchant-release-${{ gitea.run_id }}-${{ gitea.run_attempt }}.tgz
|
||||
LADILL_RELEASE_ARCHIVE: /tmp/ladill-merchant-release-${{ gitea.run_id }}.tgz
|
||||
run: |
|
||||
set -Eeuo pipefail
|
||||
: "${LADILL_APP_ROOT:?Set LADILL_APP_ROOT}"
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
Standalone app for **shop, menu & booking storefronts** at `merchant.ladill.com` — QR
|
||||
storefronts with catalog checkout. Sales settle into the one platform UserWallet
|
||||
(15% fee), then withdraw via `account.ladill.com`.
|
||||
(5.5% fee), then withdraw via `account.ladill.com`.
|
||||
|
||||
Public scans stay at `ladill.com/q/<code>` (blueprint decision — printed codes
|
||||
never migrate). The platform host forwards shop/menu/booking codes to this app (see
|
||||
@@ -23,7 +23,7 @@ main app DB user.
|
||||
|---|---|
|
||||
| `LADILL_SSO_CLIENT_ID` / `LADILL_SSO_CLIENT_SECRET` | `passport:client` on platform |
|
||||
| `BILLING_API_KEY_MERCHANT` | platform `.env` + this app |
|
||||
| `PAY_API_KEY_MERCHANT` | platform `.env` + this app — Ladill Pay checkout (15% sales tier) |
|
||||
| `PAY_API_KEY_MERCHANT` | platform `.env` + this app — Ladill Pay checkout (5.5% sales tier) |
|
||||
| `IDENTITY_API_KEY_MERCHANT` | platform `.env` + this app |
|
||||
| `PLATFORM_DB_*` | read `ladilldb.platform_settings` (Paystack keys from admin → Billing) |
|
||||
|
||||
@@ -83,7 +83,7 @@ php artisan config:cache route:cache view:cache
|
||||
|
||||
- SSO login at `merchant.ladill.com`
|
||||
- Create a shop, menu, or booking storefront, download QR PNG
|
||||
- Scan `/q/<code>`, place test order, confirm wallet credit (net of 15%)
|
||||
- Scan `/q/<code>`, place test order, confirm wallet credit (net of 5.5%)
|
||||
- Withdraw from `account.ladill.com/wallet`
|
||||
|
||||
## Product IA (blueprint)
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Api;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Services\CustomDomain\CustomDomainService;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
/**
|
||||
* Signed completion callback from Ladill Domains' SSL service. Flips a custom
|
||||
* domain to live (or failed) once the certificate is issued. Auth is the HMAC
|
||||
* signature over the raw body (shared SSL_CALLBACK_SECRET), not a session.
|
||||
*/
|
||||
class SslCallbackController extends Controller
|
||||
{
|
||||
public function __invoke(Request $request, CustomDomainService $service): JsonResponse
|
||||
{
|
||||
$secret = (string) config('customdomain.callback_secret');
|
||||
$body = $request->getContent();
|
||||
$signature = (string) $request->header('X-Ladill-Signature', '');
|
||||
|
||||
if ($secret === '' || ! hash_equals(hash_hmac('sha256', $body, $secret), $signature)) {
|
||||
return response()->json(['error' => 'Invalid signature.'], 401);
|
||||
}
|
||||
|
||||
$payload = json_decode($body, true);
|
||||
$data = (array) ($payload['data'] ?? []);
|
||||
$host = (string) ($data['host'] ?? '');
|
||||
if ($host === '') {
|
||||
return response()->json(['error' => 'Missing host.'], 422);
|
||||
}
|
||||
|
||||
$service->applyCallback(
|
||||
$host,
|
||||
(string) ($data['status'] ?? 'failed'),
|
||||
$data['expires_at'] ?? null,
|
||||
$data['last_error'] ?? null,
|
||||
);
|
||||
|
||||
return response()->json(['status' => 'ok']);
|
||||
}
|
||||
}
|
||||
@@ -88,10 +88,7 @@ class SsoLoginController extends Controller
|
||||
if ($request->filled('error')) {
|
||||
if (in_array($request->query('error'), ['login_required', 'interaction_required', 'consent_required'], true)
|
||||
&& ! $request->boolean('interactive')) {
|
||||
return redirect()->route('sso.connect', [
|
||||
'redirect' => $intended,
|
||||
'interactive' => 1,
|
||||
]);
|
||||
return redirect()->away((string) config('ladill.marketing_url'));
|
||||
}
|
||||
|
||||
return $this->finishCallback($request, $intended, (string) $request->query('error_description', $request->query('error')), $popup);
|
||||
@@ -141,6 +138,18 @@ class SsoLoginController extends Controller
|
||||
return redirect()->away($this->defaultSignedOutUrl());
|
||||
}
|
||||
|
||||
/** Platform session ended — clear this app and offer silent sign-in again. */
|
||||
public function platformSignedOut(Request $request): RedirectResponse
|
||||
{
|
||||
Auth::logout();
|
||||
$request->session()->invalidate();
|
||||
$request->session()->regenerateToken();
|
||||
|
||||
return redirect()->route('sso.connect', [
|
||||
'redirect' => (string) $request->query('redirect', ''),
|
||||
]);
|
||||
}
|
||||
|
||||
public function logoutBridge(Request $request): View
|
||||
{
|
||||
$return = $this->safeReturnUrl((string) $request->query('return', ''));
|
||||
|
||||
@@ -0,0 +1,68 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Merchant;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\CustomDomain;
|
||||
use App\Models\QrCode;
|
||||
use App\Services\CustomDomain\CustomDomainService;
|
||||
use App\Services\CustomDomain\DomainsSslClient;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class CustomDomainController extends Controller
|
||||
{
|
||||
public function __construct(
|
||||
private readonly CustomDomainService $service,
|
||||
private readonly DomainsSslClient $domains,
|
||||
) {}
|
||||
|
||||
public function store(Request $request, QrCode $storefront): RedirectResponse
|
||||
{
|
||||
abort_unless($storefront->user_id === $request->user()->id, 403);
|
||||
abort_unless($this->service->enabled(), 404);
|
||||
|
||||
$data = $request->validate([
|
||||
'host' => ['required', 'string', 'max:255', 'regex:/^(?!-)([a-z0-9-]+\.)+[a-z]{2,}$/i'],
|
||||
'include_www' => ['nullable', 'boolean'],
|
||||
]);
|
||||
|
||||
$host = strtolower(preg_replace('/^www\./', '', trim($data['host'])));
|
||||
|
||||
if (CustomDomain::where('host', $host)->exists()) {
|
||||
return back()->withErrors(['host' => 'That domain is already connected.']);
|
||||
}
|
||||
|
||||
$this->service->attach($storefront, $host, (bool) ($data['include_www'] ?? true));
|
||||
|
||||
// Surface this domain in Ladill Domains' "My Domains" (best-effort).
|
||||
$this->domains->registerConnected(
|
||||
$host,
|
||||
(string) $request->user()->public_id,
|
||||
'Storefront: '.$storefront->label,
|
||||
route('merchant.storefronts.show', $storefront),
|
||||
);
|
||||
|
||||
return back()->with('success', "Domain added. Point an A record for {$host} (and www) to ".config('customdomain.server_ip').', then click Verify.');
|
||||
}
|
||||
|
||||
public function verify(Request $request, CustomDomain $customDomain): RedirectResponse
|
||||
{
|
||||
abort_unless($customDomain->user_id === $request->user()->id, 403);
|
||||
|
||||
[$ok, $message] = $this->service->verifyAndProvision($customDomain);
|
||||
|
||||
return back()->with($ok ? 'success' : 'error', $message);
|
||||
}
|
||||
|
||||
public function destroy(Request $request, CustomDomain $customDomain): RedirectResponse
|
||||
{
|
||||
abort_unless($customDomain->user_id === $request->user()->id, 403);
|
||||
|
||||
$host = $customDomain->host;
|
||||
$customDomain->delete();
|
||||
$this->domains->removeConnected($host);
|
||||
|
||||
return back()->with('success', 'Custom domain removed.');
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,102 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Merchant;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Services\Crm\CrmClient;
|
||||
use App\Services\Qr\QrCodeManagerService;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\View\View;
|
||||
|
||||
/**
|
||||
* Products page — fully backed by the Ladill CRM products API. The merchant's
|
||||
* catalog lives in CRM (owner-scoped); this controller proxies CRUD to it.
|
||||
*/
|
||||
class ProductController extends Controller
|
||||
{
|
||||
public function __construct(private QrCodeManagerService $manager) {}
|
||||
|
||||
private function crm(): CrmClient
|
||||
{
|
||||
return CrmClient::for((string) ladill_account()->public_id);
|
||||
}
|
||||
|
||||
public function index(Request $request): View
|
||||
{
|
||||
$search = trim((string) $request->query('search', ''));
|
||||
|
||||
$response = $this->crm()->products([
|
||||
'type' => 'product',
|
||||
'per_page' => 100,
|
||||
'search' => $search !== '' ? $search : null,
|
||||
]);
|
||||
|
||||
$products = (array) ($response['data'] ?? []);
|
||||
$wallet = $this->manager->walletFor(ladill_account());
|
||||
|
||||
return view('merchant.products.index', [
|
||||
'products' => $products,
|
||||
'search' => $search,
|
||||
'wallet' => $wallet,
|
||||
'productCount' => count($products),
|
||||
'activeCount' => collect($products)->filter(fn ($p) => ($p['active'] ?? true))->count(),
|
||||
]);
|
||||
}
|
||||
|
||||
public function create(): View
|
||||
{
|
||||
return view('merchant.products.create');
|
||||
}
|
||||
|
||||
public function store(Request $request): RedirectResponse
|
||||
{
|
||||
$this->crm()->createProduct($this->payload($request));
|
||||
|
||||
return redirect()->route('merchant.products.index')->with('success', 'Product created.');
|
||||
}
|
||||
|
||||
public function edit(string $product): View
|
||||
{
|
||||
return view('merchant.products.edit', ['product' => $this->crm()->product($product)]);
|
||||
}
|
||||
|
||||
public function update(Request $request, string $product): RedirectResponse
|
||||
{
|
||||
$this->crm()->updateProduct($product, $this->payload($request));
|
||||
|
||||
return redirect()->route('merchant.products.index')->with('success', 'Product updated.');
|
||||
}
|
||||
|
||||
public function destroy(string $product): RedirectResponse
|
||||
{
|
||||
$this->crm()->deleteProduct($product);
|
||||
|
||||
return redirect()->route('merchant.products.index')->with('success', 'Product deleted.');
|
||||
}
|
||||
|
||||
/** @return array<string,mixed> */
|
||||
private function payload(Request $request): array
|
||||
{
|
||||
$data = $request->validate([
|
||||
'name' => ['required', 'string', 'max:255'],
|
||||
'sku' => ['nullable', 'string', 'max:80'],
|
||||
'description' => ['nullable', 'string', 'max:5000'],
|
||||
'unit_price' => ['nullable', 'numeric', 'min:0'],
|
||||
'currency' => ['nullable', 'string', 'size:3'],
|
||||
'tax_rate' => ['nullable', 'numeric', 'min:0', 'max:100'],
|
||||
'active' => ['nullable', 'boolean'],
|
||||
]);
|
||||
|
||||
return [
|
||||
'name' => $data['name'],
|
||||
'sku' => $data['sku'] ?? null,
|
||||
'type' => 'product',
|
||||
'description' => $data['description'] ?? null,
|
||||
'unit_price_minor' => (int) round(((float) ($data['unit_price'] ?? 0)) * 100),
|
||||
'currency' => strtoupper((string) ($data['currency'] ?? config('crm.default_currency', 'GHS'))),
|
||||
'tax_rate' => (float) ($data['tax_rate'] ?? 0),
|
||||
'active' => $request->boolean('active'),
|
||||
];
|
||||
}
|
||||
}
|
||||
@@ -4,10 +4,13 @@ namespace App\Http\Controllers\Merchant;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\QrCode;
|
||||
use App\Models\QrWallet;
|
||||
use App\Services\Crm\CrmClient;
|
||||
use App\Services\Qr\QrCodeManagerService;
|
||||
use App\Services\Qr\QrImageGeneratorService;
|
||||
use App\Services\Qr\QrPdfExporter;
|
||||
use App\Support\Qr\QrTypeCatalog;
|
||||
use App\Support\CrmPrefillCodec;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Storage;
|
||||
@@ -37,9 +40,15 @@ class StorefrontController extends Controller
|
||||
return [$qr->id => $this->imageGenerator->previewDataUri($qr)];
|
||||
});
|
||||
|
||||
$wallet = $this->manager->walletFor($account);
|
||||
|
||||
return view('merchant.storefronts.index', [
|
||||
'qrCodes' => $qrCodes,
|
||||
'previewDataUris' => $previewDataUris,
|
||||
'wallet' => $wallet,
|
||||
'activeCount' => $qrCodes->where('is_active', true)->count(),
|
||||
'pricePerQr' => QrWallet::pricePerQr(),
|
||||
'topupUrl' => 'https://'.config('app.account_domain').'/wallet',
|
||||
]);
|
||||
}
|
||||
|
||||
@@ -50,7 +59,44 @@ class StorefrontController extends Controller
|
||||
$requestedType = QrCode::TYPE_SHOP;
|
||||
}
|
||||
|
||||
return view('merchant.storefronts.create', ['requestedType' => $requestedType]);
|
||||
$prefill = CrmPrefillCodec::decode($request->query('prefill'));
|
||||
if (($prefill['kind'] ?? null) === 'merchant_storefront' && ! empty($prefill['type'])) {
|
||||
$requestedType = (string) $prefill['type'];
|
||||
}
|
||||
|
||||
return view('merchant.storefronts.create', [
|
||||
'requestedType' => $requestedType,
|
||||
'prefill' => ($prefill['kind'] ?? null) === 'merchant_storefront' ? $prefill : null,
|
||||
'catalog' => $this->catalogProducts(),
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Active products from the merchant's Ladill CRM catalog, shaped for the
|
||||
* storefront editor's "add from catalog" picker. Resilient: returns [] if
|
||||
* CRM is unreachable so the form still works.
|
||||
*
|
||||
* @return array<int,array{name:string,price:string,currency:string,description:string}>
|
||||
*/
|
||||
private function catalogProducts(): array
|
||||
{
|
||||
try {
|
||||
$response = CrmClient::for((string) ladill_account()->public_id)
|
||||
->products(['type' => 'product', 'active' => 1, 'per_page' => 200]);
|
||||
} catch (\Throwable) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return collect($response['data'] ?? [])
|
||||
->map(fn ($p) => [
|
||||
'name' => (string) ($p['name'] ?? ''),
|
||||
'price' => number_format(((int) ($p['unit_price_minor'] ?? 0)) / 100, 2, '.', ''),
|
||||
'currency' => strtoupper((string) ($p['currency'] ?? 'GHS')),
|
||||
'description' => (string) ($p['description'] ?? ''),
|
||||
])
|
||||
->filter(fn ($p) => $p['name'] !== '')
|
||||
->values()
|
||||
->all();
|
||||
}
|
||||
|
||||
public function store(Request $request): RedirectResponse
|
||||
@@ -89,6 +135,10 @@ class StorefrontController extends Controller
|
||||
return view('merchant.storefronts.show', [
|
||||
'qrCode' => $storefront->fresh(),
|
||||
'previewDataUri' => $this->imageGenerator->previewDataUri($storefront),
|
||||
'catalog' => $this->catalogProducts(),
|
||||
'customDomains' => \App\Models\CustomDomain::where('qr_code_id', $storefront->id)->get(),
|
||||
'customDomainsEnabled' => app(\App\Services\CustomDomain\CustomDomainService::class)->enabled(),
|
||||
'customDomainServerIp' => config('customdomain.server_ip'),
|
||||
]);
|
||||
}
|
||||
|
||||
|
||||
@@ -6,6 +6,7 @@ use App\Http\Controllers\Controller;
|
||||
use App\Models\QrCode;
|
||||
use App\Services\Merchant\BookingSlotService;
|
||||
use App\Services\Merchant\MerchantSaleService;
|
||||
use App\Support\LadillLink;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
@@ -42,8 +43,8 @@ class BookingController extends Controller
|
||||
|
||||
$validated = $request->validate([
|
||||
'customer_name' => ['required', 'string', 'max:120'],
|
||||
'customer_email' => ['required', 'email', 'max:200'],
|
||||
'customer_phone' => ['nullable', 'string', 'max:30'],
|
||||
'customer_email' => ['nullable', 'email', 'max:200'],
|
||||
'customer_phone' => ['required', 'string', 'max:30'],
|
||||
'service_index' => ['required', 'integer', 'min:0'],
|
||||
'starts_at' => ['required', 'date'],
|
||||
]);
|
||||
@@ -57,35 +58,38 @@ class BookingController extends Controller
|
||||
if ($result['checkout_url']) {
|
||||
return response()->json([
|
||||
'checkout_url' => $result['checkout_url'],
|
||||
'access_code' => $result['access_code'] ?? null,
|
||||
'public_key' => $result['public_key'] ?? null,
|
||||
'callback_url' => $result['callback_url'] ?? null,
|
||||
'callback_url' => $result['callback_url'],
|
||||
]);
|
||||
}
|
||||
|
||||
return response()->json([
|
||||
'confirmed' => true,
|
||||
'redirect_url' => route('qr.public.booking.confirmed', [
|
||||
'shortCode' => $shortCode,
|
||||
'booking' => $result['booking']->id,
|
||||
]),
|
||||
'redirect_url' => LadillLink::path($shortCode, 'booking/confirmed/'.$result['booking']->id),
|
||||
]);
|
||||
}
|
||||
|
||||
public function callback(Request $request, string $shortCode): RedirectResponse
|
||||
public function callback(Request $request, string $shortCode): View
|
||||
{
|
||||
$reference = trim((string) $request->query('reference', ''));
|
||||
if ($reference === '') {
|
||||
return redirect('/q/'.$shortCode)->with('error', 'Missing payment reference.');
|
||||
return view('public.payment-return', [
|
||||
'redirect' => LadillLink::url($shortCode),
|
||||
]);
|
||||
}
|
||||
|
||||
try {
|
||||
$booking = $this->sales->completeBooking($reference);
|
||||
} catch (\Throwable) {
|
||||
return redirect('/q/'.$shortCode)->with('order_error', 'Payment could not be verified. Reference: '.$reference);
|
||||
return view('public.payment-return', [
|
||||
'redirect' => LadillLink::url($shortCode),
|
||||
]);
|
||||
}
|
||||
|
||||
return redirect()->route('qr.public.booking.confirmed', [
|
||||
'shortCode' => $shortCode,
|
||||
'booking' => $booking->id,
|
||||
return view('public.payment-return', [
|
||||
'redirect' => LadillLink::path($shortCode, 'booking/confirmed/'.$booking->id),
|
||||
]);
|
||||
}
|
||||
|
||||
|
||||
@@ -36,7 +36,7 @@ class QrScanController extends Controller
|
||||
}
|
||||
|
||||
if ($qrCode->isDocumentType()) {
|
||||
return redirect()->route('qr.public.view', $shortCode);
|
||||
return redirect()->away($qrCode->publicPath('view'));
|
||||
}
|
||||
|
||||
if ($qrCode->isBookingType()) {
|
||||
@@ -66,7 +66,7 @@ class QrScanController extends Controller
|
||||
|
||||
return view('public.qr.document-viewer', [
|
||||
'qrCode' => $qrCode,
|
||||
'fileUrl' => route('qr.public.file', $shortCode),
|
||||
'fileUrl' => $qrCode->publicPath('file'),
|
||||
'allowDownload' => (bool) ($qrCode->content()['allow_download'] ?? true),
|
||||
]);
|
||||
}
|
||||
|
||||
@@ -4,10 +4,11 @@ namespace App\Http\Controllers\Public;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\QrCode;
|
||||
use App\Models\QrSaleOrder;
|
||||
use App\Services\Merchant\MerchantSaleService;
|
||||
use App\Support\LadillLink;
|
||||
use App\Support\Qr\QrTypeCatalog;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\View\View;
|
||||
use RuntimeException;
|
||||
@@ -34,7 +35,7 @@ class SaleOrderController extends Controller
|
||||
|
||||
$validated = $request->validate([
|
||||
'customer_name' => ['required', 'string', 'max:120'],
|
||||
'customer_email' => ['required', 'email', 'max:200'],
|
||||
'customer_email' => ['nullable', 'email', 'max:200'],
|
||||
'customer_phone' => ['required', 'string', 'max:30'],
|
||||
'shipping_fee' => ['nullable', 'numeric', 'min:0', 'max:10000'],
|
||||
'items' => ['required', 'array', 'min:1'],
|
||||
@@ -51,23 +52,47 @@ class SaleOrderController extends Controller
|
||||
|
||||
return response()->json([
|
||||
'checkout_url' => $result['checkout_url'],
|
||||
'access_code' => $result['access_code'] ?? null,
|
||||
'public_key' => $result['public_key'] ?? null,
|
||||
'callback_url' => $result['callback_url'] ?? null,
|
||||
'callback_url' => $result['callback_url'],
|
||||
]);
|
||||
}
|
||||
|
||||
public function callback(Request $request, string $shortCode): RedirectResponse|View
|
||||
public function callback(Request $request, string $shortCode): View
|
||||
{
|
||||
$reference = trim((string) $request->query('reference', ''));
|
||||
if ($reference === '') {
|
||||
return redirect('/q/'.$shortCode)->with('error', 'Missing payment reference.');
|
||||
return view('public.payment-return', [
|
||||
'redirect' => LadillLink::url($shortCode),
|
||||
]);
|
||||
}
|
||||
|
||||
try {
|
||||
$order = $this->sales->completeOrder($reference);
|
||||
} catch (\Throwable) {
|
||||
return redirect('/q/'.$shortCode)->with('order_error', 'Payment could not be verified. Contact the merchant with reference: '.$reference);
|
||||
return view('public.payment-return', [
|
||||
'redirect' => LadillLink::url($shortCode),
|
||||
]);
|
||||
}
|
||||
|
||||
return view('public.payment-return', [
|
||||
'redirect' => route('qr.public.order.confirmed', [
|
||||
'shortCode' => $shortCode,
|
||||
'reference' => $order->payment_reference,
|
||||
], absolute: true),
|
||||
]);
|
||||
}
|
||||
|
||||
public function confirmed(string $shortCode, string $reference): View
|
||||
{
|
||||
$order = QrSaleOrder::query()
|
||||
->with('qrCode')
|
||||
->where('payment_reference', $reference)
|
||||
->where('status', QrSaleOrder::STATUS_PAID)
|
||||
->whereHas('qrCode', fn ($q) => $q->where('short_code', $shortCode))
|
||||
->firstOrFail();
|
||||
|
||||
return view('public.qr.order-success', [
|
||||
'order' => $order,
|
||||
'qrCode' => $order->qrCode,
|
||||
|
||||
@@ -3,15 +3,23 @@
|
||||
namespace App\Http\Controllers\Qr;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\PaymentGatewaySetting;
|
||||
use App\Models\QrSetting;
|
||||
use App\Services\Billing\BillingClient;
|
||||
use App\Services\Billing\PlanEntitlementService;
|
||||
use App\Services\Payments\MerchantGatewayService;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Validation\Rule;
|
||||
use Illuminate\View\View;
|
||||
|
||||
class AccountController extends Controller
|
||||
{
|
||||
public function __construct(private BillingClient $billing) {}
|
||||
public function __construct(
|
||||
private BillingClient $billing,
|
||||
private PlanEntitlementService $entitlements,
|
||||
private MerchantGatewayService $gateway,
|
||||
) {}
|
||||
|
||||
private function topupUrl(): string
|
||||
{
|
||||
@@ -65,6 +73,8 @@ class AccountController extends Controller
|
||||
return view('merchant.settings', [
|
||||
'account' => $account,
|
||||
'settings' => $settings,
|
||||
'gateway' => $this->gateway->settingFor($account),
|
||||
'canUsePaymentGateway' => $this->entitlements->canUseCustomPaymentGateway($account),
|
||||
]);
|
||||
}
|
||||
|
||||
@@ -77,6 +87,10 @@ class AccountController extends Controller
|
||||
'product_updates' => ['nullable', 'boolean'],
|
||||
'notify_registrations' => ['nullable', 'boolean'],
|
||||
'notify_payouts' => ['nullable', 'boolean'],
|
||||
'gateway_provider' => ['nullable', Rule::in(['', PaymentGatewaySetting::PROVIDER_PAYSTACK])],
|
||||
'gateway_public_key' => ['nullable', 'string', 'max:2000'],
|
||||
'gateway_secret_key' => ['nullable', 'string', 'max:2000'],
|
||||
'gateway_is_active' => ['nullable', 'boolean'],
|
||||
]);
|
||||
|
||||
QrSetting::updateOrCreate(
|
||||
@@ -89,6 +103,25 @@ class AccountController extends Controller
|
||||
],
|
||||
);
|
||||
|
||||
if ($this->entitlements->canUseCustomPaymentGateway($account)) {
|
||||
$provider = trim((string) ($data['gateway_provider'] ?? ''));
|
||||
$setting = PaymentGatewaySetting::query()->where('owner_ref', $account->public_id)->first();
|
||||
if ($provider !== '' || $setting) {
|
||||
$setting ??= new PaymentGatewaySetting(['owner_ref' => $account->public_id]);
|
||||
if ($provider !== '') {
|
||||
$setting->provider = $provider;
|
||||
}
|
||||
if (filled($data['gateway_public_key'] ?? null)) {
|
||||
$setting->public_key = $data['gateway_public_key'];
|
||||
}
|
||||
if (filled($data['gateway_secret_key'] ?? null)) {
|
||||
$setting->secret_key = $data['gateway_secret_key'];
|
||||
}
|
||||
$setting->is_active = $provider !== '' && $request->boolean('gateway_is_active');
|
||||
$setting->save();
|
||||
}
|
||||
}
|
||||
|
||||
return redirect()->route('account.settings')->with('success', 'Settings saved.');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -312,7 +312,7 @@ class QrCodeController extends Controller
|
||||
}
|
||||
}
|
||||
|
||||
$png = $this->imageGenerator->renderPng(QrCode::publicBaseUrl() . '/q/' . $shortCode, $style);
|
||||
$png = $this->imageGenerator->renderPng(\App\Support\LadillLink::url($shortCode), $style);
|
||||
|
||||
if ($tempLogoPath) {
|
||||
Storage::disk('qr')->delete($tempLogoPath);
|
||||
|
||||
@@ -0,0 +1,40 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Services\Billing\BillingClient;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Cache;
|
||||
|
||||
/**
|
||||
* Lightweight wallet balance for the avatar dropdown widget.
|
||||
*/
|
||||
class WalletBalanceController extends Controller
|
||||
{
|
||||
public function balance(Request $request, BillingClient $billing): JsonResponse
|
||||
{
|
||||
$publicId = (string) $request->user()->public_id;
|
||||
|
||||
$minor = Cache::remember("wallet_balance:{$publicId}", now()->addSeconds(30), function () use ($billing, $publicId) {
|
||||
try {
|
||||
return $billing->balanceMinor($publicId);
|
||||
} catch (\Throwable) {
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
if ($minor === null) {
|
||||
return response()->json(['available' => false]);
|
||||
}
|
||||
|
||||
$currency = (string) config('billing.currency', 'GHS');
|
||||
|
||||
return response()->json([
|
||||
'available' => true,
|
||||
'balance_minor' => $minor,
|
||||
'currency' => $currency,
|
||||
'formatted' => $currency.' '.number_format($minor / 100, 2),
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Middleware;
|
||||
|
||||
use Closure;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Auth;
|
||||
use Illuminate\Support\Facades\Http;
|
||||
use Symfony\Component\HttpFoundation\Response;
|
||||
|
||||
/**
|
||||
* App sessions are subordinate to the platform (auth.ladill.com) session.
|
||||
* When the platform session ends, clear this app's local session too.
|
||||
*
|
||||
* Re-checks auth.ladill.com at most once per TTL — not on every request.
|
||||
* Client-side sso-keepalive still pings periodically between checks.
|
||||
*/
|
||||
class EnsurePlatformSession
|
||||
{
|
||||
private const VERIFY_TTL_SECONDS = 90;
|
||||
|
||||
public function handle(Request $request, Closure $next): Response
|
||||
{
|
||||
if (! Auth::check()) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
$authDomain = trim((string) config('app.auth_domain', ''));
|
||||
if ($authDomain === '') {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
$verifiedAt = (int) $request->session()->get('platform_session_verified_at', 0);
|
||||
if ($verifiedAt > 0 && (time() - $verifiedAt) < self::VERIFY_TTL_SECONDS) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
$cookieHeader = (string) $request->headers->get('Cookie', '');
|
||||
if ($cookieHeader === '') {
|
||||
return $this->clearAppSession($request);
|
||||
}
|
||||
|
||||
try {
|
||||
$response = Http::withHeaders(['Cookie' => $cookieHeader])
|
||||
->timeout(3)
|
||||
->connectTimeout(2)
|
||||
->get('https://'.$authDomain.'/sso/ping');
|
||||
} catch (\Throwable) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
if ($response->status() === 401) {
|
||||
return $this->clearAppSession($request);
|
||||
}
|
||||
|
||||
if ($response->successful()) {
|
||||
$request->session()->put('platform_session_verified_at', time());
|
||||
}
|
||||
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
private function clearAppSession(Request $request): Response
|
||||
{
|
||||
Auth::logout();
|
||||
$request->session()->invalidate();
|
||||
$request->session()->regenerateToken();
|
||||
|
||||
return redirect()->route('sso.connect', [
|
||||
'redirect' => $request->fullUrl(),
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Middleware;
|
||||
|
||||
use Closure;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Auth;
|
||||
use Illuminate\Support\Facades\View;
|
||||
use Symfony\Component\HttpFoundation\Response;
|
||||
|
||||
/**
|
||||
* Injects a branded boot splash (Ladill Mail style) into authenticated HTML
|
||||
* pages. The splash shows once per browser session while the app loads, then
|
||||
* fades out — masking the client-side boot so the app feels instant.
|
||||
*/
|
||||
class InjectBootSplash
|
||||
{
|
||||
public function handle(Request $request, Closure $next): Response
|
||||
{
|
||||
$response = $next($request);
|
||||
|
||||
if (! $request->isMethod('GET') || ! Auth::check()) {
|
||||
return $response;
|
||||
}
|
||||
|
||||
if (! str_contains((string) $response->headers->get('Content-Type', ''), 'text/html')) {
|
||||
return $response;
|
||||
}
|
||||
|
||||
$content = $response->getContent();
|
||||
if (! is_string($content)
|
||||
|| stripos($content, '<body') === false
|
||||
|| str_contains($content, 'id="ladill-boot"')) {
|
||||
return $response;
|
||||
}
|
||||
|
||||
$splash = View::make('partials.boot-splash')->render();
|
||||
$content = preg_replace_callback('/<body\b[^>]*>/i', fn ($m) => $m[0].$splash, $content, 1);
|
||||
|
||||
if (is_string($content)) {
|
||||
$response->setContent($content);
|
||||
}
|
||||
|
||||
return $response;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Middleware;
|
||||
|
||||
use App\Support\LadillLink;
|
||||
use Closure;
|
||||
use Illuminate\Http\Request;
|
||||
use Symfony\Component\HttpFoundation\Response;
|
||||
|
||||
class RedirectLegacyQrToLadillLink
|
||||
{
|
||||
public function handle(Request $request, Closure $next): Response
|
||||
{
|
||||
if (! preg_match('#^q/[a-z0-9]#i', ltrim($request->path(), '/'))) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
if (LadillLink::isInternalRequest($request)) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
// Same-origin AJAX from product-hosted pages must not 307 to ladl.link
|
||||
// (cross-origin fetch has no CORS → checkout sheet never opens).
|
||||
if ($request->ajax() || $request->expectsJson() || $request->wantsJson()) {
|
||||
return $next($request);
|
||||
}
|
||||
|
||||
return LadillLink::legacyRedirect($request);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
use Illuminate\Database\Eloquent\Relations\BelongsTo;
|
||||
|
||||
/**
|
||||
* A customer's own domain (e.g. brand.com) pointed at one storefront (QrCode).
|
||||
* Visiting the domain serves that storefront's public page. DNS is verified to
|
||||
* resolve to the app, then Ladill Domains issues + installs the TLS cert.
|
||||
*/
|
||||
class CustomDomain extends Model
|
||||
{
|
||||
public const STATUS_PENDING = 'pending';
|
||||
public const STATUS_ACTIVE = 'active';
|
||||
public const STATUS_FAILED = 'failed';
|
||||
|
||||
protected $fillable = [
|
||||
'qr_code_id', 'user_id', 'host', 'include_www', 'status', 'ssl_status',
|
||||
'dns_verified_at', 'ssl_issued_at', 'ssl_expires_at', 'last_error',
|
||||
];
|
||||
|
||||
protected function casts(): array
|
||||
{
|
||||
return [
|
||||
'include_www' => 'boolean',
|
||||
'dns_verified_at' => 'datetime',
|
||||
'ssl_issued_at' => 'datetime',
|
||||
'ssl_expires_at' => 'datetime',
|
||||
];
|
||||
}
|
||||
|
||||
public function qrCode(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(QrCode::class);
|
||||
}
|
||||
|
||||
public function user(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(User::class);
|
||||
}
|
||||
|
||||
public function isLive(): bool
|
||||
{
|
||||
return $this->status === self::STATUS_ACTIVE && $this->ssl_status === self::STATUS_ACTIVE;
|
||||
}
|
||||
|
||||
protected static function booted(): void
|
||||
{
|
||||
static::saving(function (CustomDomain $d) {
|
||||
$d->host = strtolower(trim((string) $d->host, " \t\n\r\0\x0B./"));
|
||||
$d->host = preg_replace('/^www\./', '', $d->host) ?: $d->host;
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
class PaymentGatewaySetting extends Model
|
||||
{
|
||||
public const PROVIDER_PAYSTACK = 'paystack';
|
||||
|
||||
protected $fillable = ['owner_ref', 'provider', 'public_key', 'secret_key', 'is_active', 'metadata'];
|
||||
|
||||
protected function casts(): array
|
||||
{
|
||||
return [
|
||||
'public_key' => 'encrypted',
|
||||
'secret_key' => 'encrypted',
|
||||
'is_active' => 'boolean',
|
||||
'metadata' => 'array',
|
||||
];
|
||||
}
|
||||
|
||||
public function isConfigured(): bool
|
||||
{
|
||||
return $this->is_active
|
||||
&& $this->provider === self::PROVIDER_PAYSTACK
|
||||
&& str_starts_with(trim((string) $this->public_key), 'pk_')
|
||||
&& str_starts_with(trim((string) $this->secret_key), 'sk_');
|
||||
}
|
||||
}
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use App\Support\LadillLink;
|
||||
use App\Support\Qr\QrStyleDefaults;
|
||||
use App\Support\Qr\QrTypeCatalog;
|
||||
use App\Support\Qr\QrWifiPayload;
|
||||
@@ -82,23 +83,19 @@ class QrCode extends Model
|
||||
|
||||
public function publicUrl(): string
|
||||
{
|
||||
return self::publicBaseUrl() . '/q/' . $this->short_code;
|
||||
return LadillLink::url($this->short_code);
|
||||
}
|
||||
|
||||
public function publicPath(string $suffix = ''): string
|
||||
{
|
||||
return $suffix === ''
|
||||
? $this->publicUrl()
|
||||
: LadillLink::path($this->short_code, $suffix);
|
||||
}
|
||||
|
||||
/**
|
||||
* Base URL for public QR links. Always the short platform domain
|
||||
* (ladill.com) — never the signed-in account/product host — so printed
|
||||
* codes and shared links stay short and host-independent of where the QR
|
||||
* was created.
|
||||
*/
|
||||
public static function publicBaseUrl(): string
|
||||
{
|
||||
$appUrl = (string) config('app.url');
|
||||
$scheme = parse_url($appUrl, PHP_URL_SCHEME) ?: 'https';
|
||||
$host = (string) config('app.platform_domain')
|
||||
?: (parse_url($appUrl, PHP_URL_HOST) ?: 'ladill.com');
|
||||
|
||||
return $scheme . '://' . $host;
|
||||
return LadillLink::baseUrl();
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -27,7 +27,7 @@ class QrSaleOrder extends Model
|
||||
self::FULFILLMENT_CANCELLED => 'Cancelled',
|
||||
];
|
||||
|
||||
public const PLATFORM_FEE_RATE = 0.15;
|
||||
public const PLATFORM_FEE_RATE = 0.035;
|
||||
|
||||
protected $fillable = [
|
||||
'pay_order_id',
|
||||
|
||||
@@ -45,6 +45,15 @@ class BillingClient
|
||||
return $this->get('/service-ledger', ['user' => $publicId, 'service' => $service]);
|
||||
}
|
||||
|
||||
/** @return array<string,mixed> */
|
||||
public function suiteEntitlement(string $publicId): array
|
||||
{
|
||||
return (array) ($this->get('/suite-entitlements', [
|
||||
'user' => $publicId,
|
||||
'app' => (string) config('billing.service', 'merchant'),
|
||||
])['data'] ?? []);
|
||||
}
|
||||
|
||||
/**
|
||||
* Debit the wallet. Returns true on success, false on insufficient balance
|
||||
* (HTTP 402). Idempotent by $reference.
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\Billing;
|
||||
|
||||
use App\Models\User;
|
||||
use Throwable;
|
||||
|
||||
class PlanEntitlementService
|
||||
{
|
||||
public const CUSTOM_PAYMENT_GATEWAY = 'custom_payment_gateway';
|
||||
|
||||
public function __construct(private readonly BillingClient $billing) {}
|
||||
|
||||
public function has(User $owner, string $feature): bool
|
||||
{
|
||||
try {
|
||||
return in_array($feature, (array) ($this->billing->suiteEntitlement((string) $owner->public_id)['features'] ?? []), true);
|
||||
} catch (Throwable) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
public function canUseCustomPaymentGateway(User $owner): bool
|
||||
{
|
||||
// Custom / owner payment gateways are retired. All checkouts use Ladill Pay
|
||||
// with platform fees (see config/pay.php fee_tiers on the platform).
|
||||
return false;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,85 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\Crm;
|
||||
|
||||
use Illuminate\Http\Client\ConnectionException;
|
||||
use Illuminate\Http\Client\PendingRequest;
|
||||
use Illuminate\Support\Facades\Http;
|
||||
use Illuminate\Validation\ValidationException;
|
||||
|
||||
/**
|
||||
* Thin client for the Ladill CRM internal API (crm.ladill.com/api). Authenticates
|
||||
* with the per-service key (CRM_API_KEY_MERCHANT) and scopes every call to one
|
||||
* platform account via the `owner` parameter (the user's public_id / OIDC sub).
|
||||
*/
|
||||
class CrmClient
|
||||
{
|
||||
public function __construct(private readonly string $owner) {}
|
||||
|
||||
public static function for(string $owner): self
|
||||
{
|
||||
return new self($owner);
|
||||
}
|
||||
|
||||
public function products(array $filters = []): array
|
||||
{
|
||||
return $this->get('products', $filters);
|
||||
}
|
||||
|
||||
public function product(int|string $id): array
|
||||
{
|
||||
return $this->get("products/{$id}");
|
||||
}
|
||||
|
||||
public function createProduct(array $data): array
|
||||
{
|
||||
return $this->send('post', 'products', $data);
|
||||
}
|
||||
|
||||
public function updateProduct(int|string $id, array $data): array
|
||||
{
|
||||
return $this->send('patch', "products/{$id}", $data);
|
||||
}
|
||||
|
||||
public function deleteProduct(int|string $id): array
|
||||
{
|
||||
return $this->send('delete', "products/{$id}", []);
|
||||
}
|
||||
|
||||
private function client(): PendingRequest
|
||||
{
|
||||
return Http::baseUrl((string) config('crm.url'))
|
||||
->withToken((string) config('crm.key'))
|
||||
->acceptJson()
|
||||
->asJson()
|
||||
->connectTimeout(10)
|
||||
->timeout(20);
|
||||
}
|
||||
|
||||
private function get(string $path, array $query = []): array
|
||||
{
|
||||
return $this->handle(fn () => $this->client()->get($path, [...array_filter($query, fn ($v) => $v !== null), 'owner' => $this->owner]));
|
||||
}
|
||||
|
||||
private function send(string $method, string $path, array $data): array
|
||||
{
|
||||
return $this->handle(fn () => $this->client()->{$method}($path, [...$data, 'owner' => $this->owner]));
|
||||
}
|
||||
|
||||
private function handle(callable $request): array
|
||||
{
|
||||
try {
|
||||
$response = $request();
|
||||
} catch (ConnectionException) {
|
||||
throw ValidationException::withMessages([
|
||||
'crm' => ['Could not reach the CRM service. Please try again in a moment.'],
|
||||
]);
|
||||
}
|
||||
|
||||
if ($response->failed()) {
|
||||
abort($response->status() === 404 ? 404 : 502, 'CRM service error.');
|
||||
}
|
||||
|
||||
return (array) $response->json();
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\CustomDomain;
|
||||
|
||||
use App\Models\CustomDomain;
|
||||
use App\Models\QrCode;
|
||||
use Illuminate\Support\Carbon;
|
||||
|
||||
class CustomDomainService
|
||||
{
|
||||
public function __construct(
|
||||
private readonly DnsResolver $dns,
|
||||
private readonly DomainsSslClient $ssl,
|
||||
) {}
|
||||
|
||||
public function enabled(): bool
|
||||
{
|
||||
return (bool) config('customdomain.enabled', true) && $this->ssl->configured();
|
||||
}
|
||||
|
||||
/** Attach a custom domain to a storefront (pending DNS). */
|
||||
public function attach(QrCode $storefront, string $host, bool $includeWww = true): CustomDomain
|
||||
{
|
||||
return CustomDomain::create([
|
||||
'qr_code_id' => $storefront->id,
|
||||
'user_id' => $storefront->user_id,
|
||||
'host' => $host,
|
||||
'include_www' => $includeWww,
|
||||
'status' => CustomDomain::STATUS_PENDING,
|
||||
'ssl_status' => CustomDomain::STATUS_PENDING,
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Verify the domain's A record resolves to our app server, then ask Domains
|
||||
* to issue the certificate. Returns [ok, message].
|
||||
*
|
||||
* @return array{0:bool,1:string}
|
||||
*/
|
||||
public function verifyAndProvision(CustomDomain $domain): array
|
||||
{
|
||||
$serverIp = (string) config('customdomain.server_ip');
|
||||
$ips = $this->dns->aRecords($domain->host);
|
||||
|
||||
if (! in_array($serverIp, $ips, true)) {
|
||||
$domain->forceFill([
|
||||
'last_error' => 'DNS not pointing to '.$serverIp.' yet (found: '.(implode(', ', $ips) ?: 'none').').',
|
||||
])->save();
|
||||
|
||||
return [false, 'DNS not verified yet. Add an A record for '.$domain->host.' pointing to '.$serverIp.', then try again.'];
|
||||
}
|
||||
|
||||
$domain->forceFill(['dns_verified_at' => Carbon::now(), 'last_error' => null])->save();
|
||||
|
||||
$requested = $this->ssl->requestCertificate(
|
||||
$domain->host,
|
||||
$domain->include_www,
|
||||
route('api.ssl-callback'),
|
||||
);
|
||||
|
||||
if (! $requested) {
|
||||
$domain->forceFill(['last_error' => 'Could not reach the SSL service. Please try again shortly.'])->save();
|
||||
|
||||
return [false, 'Domain verified, but issuing the certificate failed. Please retry in a moment.'];
|
||||
}
|
||||
|
||||
return [true, 'Domain verified. Issuing your SSL certificate — this usually takes under a minute.'];
|
||||
}
|
||||
|
||||
/** Apply a signed SSL completion callback from Ladill Domains. */
|
||||
public function applyCallback(string $host, string $status, ?string $expiresAt, ?string $error): void
|
||||
{
|
||||
$domain = CustomDomain::where('host', strtolower(trim($host)))->first();
|
||||
if (! $domain) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ($status === 'active') {
|
||||
$domain->forceFill([
|
||||
'ssl_status' => CustomDomain::STATUS_ACTIVE,
|
||||
'status' => CustomDomain::STATUS_ACTIVE,
|
||||
'ssl_issued_at' => Carbon::now(),
|
||||
'ssl_expires_at' => $expiresAt ? Carbon::parse($expiresAt) : null,
|
||||
'last_error' => null,
|
||||
])->save();
|
||||
} else {
|
||||
$domain->forceFill([
|
||||
'ssl_status' => CustomDomain::STATUS_FAILED,
|
||||
'status' => CustomDomain::STATUS_FAILED,
|
||||
'last_error' => $error ?: 'Certificate issuance failed.',
|
||||
])->save();
|
||||
}
|
||||
}
|
||||
|
||||
/** Resolve an incoming host to a live storefront, if any. */
|
||||
public function resolveStorefront(string $host): ?QrCode
|
||||
{
|
||||
$host = preg_replace('/^www\./', '', strtolower(trim($host)));
|
||||
$domain = CustomDomain::where('host', $host)->where('status', CustomDomain::STATUS_ACTIVE)->first();
|
||||
|
||||
return $domain?->qrCode;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\CustomDomain;
|
||||
|
||||
class DnsResolver
|
||||
{
|
||||
/** @return array<int,string> the A-record IPs for a host */
|
||||
public function aRecords(string $host): array
|
||||
{
|
||||
$records = @dns_get_record($host, DNS_A);
|
||||
if (! is_array($records)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return array_values(array_filter(array_map(fn ($r) => $r['ip'] ?? null, $records)));
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,85 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\CustomDomain;
|
||||
|
||||
use Illuminate\Support\Facades\Http;
|
||||
use Illuminate\Support\Facades\Log;
|
||||
|
||||
/**
|
||||
* Thin client for Ladill Domains' central SSL API. Requests/queries certificates
|
||||
* for a custom domain on the shared app server (target = app).
|
||||
*/
|
||||
class DomainsSslClient
|
||||
{
|
||||
public function configured(): bool
|
||||
{
|
||||
return (string) config('customdomain.ssl_api_key', '') !== '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Ask Domains to issue + install a certificate for $host, calling back when done.
|
||||
*/
|
||||
public function requestCertificate(string $host, bool $includeWww, string $callbackUrl): bool
|
||||
{
|
||||
if (! $this->configured()) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
$res = Http::withToken((string) config('customdomain.ssl_api_key'))
|
||||
->acceptJson()->timeout(20)
|
||||
->post(config('customdomain.ssl_api_url').'/ssl/certificates', [
|
||||
'host' => $host,
|
||||
'target' => 'app',
|
||||
'include_www' => $includeWww,
|
||||
'callback_url' => $callbackUrl,
|
||||
'metadata' => ['nginx_include' => config('customdomain.nginx_include')],
|
||||
]);
|
||||
|
||||
if ($res->failed()) {
|
||||
Log::warning('DomainsSslClient: request failed', ['host' => $host, 'status' => $res->status()]);
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
} catch (\Throwable $e) {
|
||||
Log::warning('DomainsSslClient: request error', ['host' => $host, 'error' => $e->getMessage()]);
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/** Register/update this domain in Ladill Domains' connected-domains registry (best-effort). */
|
||||
public function registerConnected(string $host, string $ownerPublicId, ?string $label = null, ?string $linkUrl = null): void
|
||||
{
|
||||
if (! $this->configured() || $ownerPublicId === '') {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
Http::withToken((string) config('customdomain.ssl_api_key'))->acceptJson()->timeout(10)
|
||||
->post(config('customdomain.ssl_api_url').'/connected-domains', array_filter([
|
||||
'host' => $host,
|
||||
'owner_public_id' => $ownerPublicId,
|
||||
'label' => $label,
|
||||
'link_url' => $linkUrl,
|
||||
]));
|
||||
} catch (\Throwable $e) {
|
||||
Log::info('DomainsSslClient: connected register skipped', ['host' => $host, 'error' => $e->getMessage()]);
|
||||
}
|
||||
}
|
||||
|
||||
/** Remove this domain from the connected-domains registry (best-effort). */
|
||||
public function removeConnected(string $host): void
|
||||
{
|
||||
if (! $this->configured()) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
Http::withToken((string) config('customdomain.ssl_api_key'))->acceptJson()->timeout(10)
|
||||
->delete(config('customdomain.ssl_api_url').'/connected-domains/'.urlencode($host));
|
||||
} catch (\Throwable $e) {
|
||||
Log::info('DomainsSslClient: connected remove skipped', ['host' => $host, 'error' => $e->getMessage()]);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -46,7 +46,7 @@ class MerchantSaleService
|
||||
$amountMinor = (int) round($amountGhs * 100);
|
||||
$reference = 'MCHT-'.strtoupper(Str::random(16));
|
||||
$orgName = $qrCode->content()['name'] ?? $qrCode->label ?? 'Storefront';
|
||||
$callbackUrl = route('qr.public.order.callback', ['shortCode' => $qrCode->short_code]);
|
||||
$callbackUrl = \App\Support\LadillLink::path($qrCode->short_code, 'order/callback');
|
||||
|
||||
$order = QrSaleOrder::create([
|
||||
'qr_code_id' => $qrCode->id,
|
||||
@@ -56,7 +56,7 @@ class MerchantSaleService
|
||||
'amount_minor' => $amountMinor,
|
||||
'currency' => $qrCode->content()['currency'] ?? 'GHS',
|
||||
'payer_name' => trim((string) ($data['customer_name'] ?? '')),
|
||||
'payer_email' => trim((string) ($data['customer_email'] ?? '')),
|
||||
'payer_email' => ($email = trim((string) ($data['customer_email'] ?? ''))) !== '' ? $email : null,
|
||||
'payer_phone' => trim((string) ($data['customer_phone'] ?? '')),
|
||||
'status' => QrSaleOrder::STATUS_PENDING,
|
||||
'payment_reference' => null,
|
||||
@@ -101,6 +101,8 @@ class MerchantSaleService
|
||||
return [
|
||||
'order' => $order->fresh(),
|
||||
'checkout_url' => $checkoutUrl,
|
||||
'access_code' => isset($payOrder['access_code']) ? (string) $payOrder['access_code'] : null,
|
||||
'public_key' => isset($payOrder['public_key']) ? (string) $payOrder['public_key'] : null,
|
||||
'callback_url' => $callbackUrl,
|
||||
];
|
||||
}
|
||||
|
||||
@@ -0,0 +1,59 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\Merchant;
|
||||
|
||||
use App\Models\QrCode;
|
||||
use App\Models\QrSaleOrder;
|
||||
use Illuminate\Support\Facades\Http;
|
||||
|
||||
/**
|
||||
* Pushes a paid menu (food) storefront order to the merchant's Ladill POS
|
||||
* Kitchen Display. Best-effort: failures are logged, never surfaced — they must
|
||||
* not break order completion. POS ignores orders for accounts not running a POS
|
||||
* kitchen, so this is safe to call for every menu order.
|
||||
*/
|
||||
class KitchenPusher
|
||||
{
|
||||
public function push(QrSaleOrder $order): void
|
||||
{
|
||||
$url = (string) config('kitchen.url');
|
||||
$key = (string) config('kitchen.key');
|
||||
if ($url === '' || $key === '') {
|
||||
return;
|
||||
}
|
||||
|
||||
$order->loadMissing('qrCode', 'merchant');
|
||||
|
||||
// Only food menus feed a kitchen.
|
||||
if (($order->qrCode?->type) !== QrCode::TYPE_MENU || ! $order->merchant) {
|
||||
return;
|
||||
}
|
||||
|
||||
$items = collect((array) $order->items)
|
||||
->filter(fn ($i) => strtolower(trim((string) ($i['name'] ?? ''))) !== 'shipping')
|
||||
->map(fn ($i) => [
|
||||
'name' => (string) ($i['name'] ?? ''),
|
||||
'quantity' => max(1, (int) ($i['qty'] ?? 1)),
|
||||
'unit_price_minor' => (int) round(((float) ($i['price_ghs'] ?? 0)) * 100),
|
||||
])
|
||||
->filter(fn ($i) => $i['name'] !== '')
|
||||
->values()
|
||||
->all();
|
||||
|
||||
if ($items === []) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
Http::withToken($key)->acceptJson()->asJson()->timeout(8)
|
||||
->post($url.'/kitchen/orders', [
|
||||
'owner' => (string) $order->merchant->public_id,
|
||||
'reference' => (string) ($order->payment_reference ?: ('QO-'.$order->id)),
|
||||
'customer_name' => $order->customer_name,
|
||||
'items' => $items,
|
||||
]);
|
||||
} catch (\Throwable $e) {
|
||||
report($e);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -10,6 +10,8 @@ use App\Services\Billing\BillingClient;
|
||||
use App\Services\Billing\PaystackService;
|
||||
use App\Services\Billing\SmsService;
|
||||
use App\Services\Pay\PayClient;
|
||||
use App\Services\Payments\MerchantGatewayService;
|
||||
use App\Support\LadillLink;
|
||||
use App\Support\Qr\QrTypeCatalog;
|
||||
use RuntimeException;
|
||||
|
||||
@@ -20,6 +22,8 @@ class MerchantSaleService
|
||||
private PaystackService $paystack,
|
||||
private BillingClient $billing,
|
||||
private SmsService $sms,
|
||||
private KitchenPusher $kitchen,
|
||||
private MerchantGatewayService $gateway,
|
||||
) {}
|
||||
|
||||
/**
|
||||
@@ -49,9 +53,25 @@ class MerchantSaleService
|
||||
|
||||
$qrCode->loadMissing('user');
|
||||
$customerEmail = trim((string) ($data['customer_email'] ?? ''));
|
||||
$callbackUrl = route('qr.public.order.callback', ['shortCode' => $qrCode->short_code]);
|
||||
$callbackUrl = LadillLink::path($qrCode->short_code, 'order/callback');
|
||||
|
||||
$payOrder = $this->pay->createCheckout([
|
||||
$usesOwnerGateway = $this->gateway->shouldUseOwnerGateway($qrCode->user);
|
||||
$payOrder = null;
|
||||
if ($usesOwnerGateway) {
|
||||
try {
|
||||
$payOrder = $this->gateway->initialize(
|
||||
$qrCode->user, (int) round($totalGhs * 100),
|
||||
(string) ($qrCode->content()['currency'] ?? 'GHS'),
|
||||
(string) config('pay.mini_checkout_email', 'pay@ladill.com'), $callbackUrl,
|
||||
'MGP-'.strtoupper(\Illuminate\Support\Str::random(16)),
|
||||
['qr_code_id' => $qrCode->id, 'short_code' => $qrCode->short_code, 'type' => 'order'],
|
||||
);
|
||||
} catch (\Throwable) {
|
||||
$usesOwnerGateway = false;
|
||||
}
|
||||
}
|
||||
if (! $usesOwnerGateway) {
|
||||
$payOrder = $this->pay->createCheckout([
|
||||
'merchant' => $qrCode->user->public_id,
|
||||
'fee_tier' => 'sales',
|
||||
'source_service' => 'merchant',
|
||||
@@ -69,17 +89,18 @@ class MerchantSaleService
|
||||
'qr_code_id' => $qrCode->id,
|
||||
'short_code' => $qrCode->short_code,
|
||||
],
|
||||
]);
|
||||
]);
|
||||
}
|
||||
|
||||
$order = QrSaleOrder::create([
|
||||
'pay_order_id' => $payOrder['id'] ?? null,
|
||||
'pay_order_id' => $usesOwnerGateway ? null : ($payOrder['id'] ?? null),
|
||||
'qr_code_id' => $qrCode->id,
|
||||
'user_id' => $qrCode->user_id,
|
||||
'customer_name' => trim((string) ($data['customer_name'] ?? '')),
|
||||
'customer_email' => $customerEmail ?: null,
|
||||
'customer_phone' => trim((string) ($data['customer_phone'] ?? '')) ?: null,
|
||||
'items' => $items,
|
||||
'amount_ghs' => round(($payOrder['amount_minor'] ?? 0) / 100, 2),
|
||||
'amount_ghs' => $usesOwnerGateway ? $totalGhs : round(($payOrder['amount_minor'] ?? 0) / 100, 2),
|
||||
'status' => QrSaleOrder::STATUS_PENDING,
|
||||
'payment_reference' => $payOrder['reference'],
|
||||
]);
|
||||
@@ -87,6 +108,8 @@ class MerchantSaleService
|
||||
return [
|
||||
'order' => $order,
|
||||
'checkout_url' => (string) ($payOrder['checkout_url'] ?? ''),
|
||||
'access_code' => isset($payOrder['access_code']) ? (string) $payOrder['access_code'] : null,
|
||||
'public_key' => isset($payOrder['public_key']) ? (string) $payOrder['public_key'] : null,
|
||||
'callback_url' => $callbackUrl,
|
||||
];
|
||||
}
|
||||
@@ -121,7 +144,7 @@ class MerchantSaleService
|
||||
|
||||
$qrCode->loadMissing('user');
|
||||
$customerEmail = trim((string) ($data['customer_email'] ?? ''));
|
||||
$callbackUrl = route('qr.public.booking.callback', ['shortCode' => $qrCode->short_code]);
|
||||
$callbackUrl = LadillLink::path($qrCode->short_code, 'booking/callback');
|
||||
|
||||
$booking = QrBooking::create([
|
||||
'qr_code_id' => $qrCode->id,
|
||||
@@ -150,7 +173,23 @@ class MerchantSaleService
|
||||
}
|
||||
|
||||
$lineLabel = sprintf('%s — %s', $serviceName, $startsAt->format('D j M, g:i A'));
|
||||
$payOrder = $this->pay->createCheckout([
|
||||
$usesOwnerGateway = $this->gateway->shouldUseOwnerGateway($qrCode->user);
|
||||
$payOrder = null;
|
||||
if ($usesOwnerGateway) {
|
||||
try {
|
||||
$payOrder = $this->gateway->initialize(
|
||||
$qrCode->user, (int) round($priceGhs * 100),
|
||||
(string) ($content['currency'] ?? 'GHS'),
|
||||
(string) config('pay.mini_checkout_email', 'pay@ladill.com'), $callbackUrl,
|
||||
'MGP-'.strtoupper(\Illuminate\Support\Str::random(16)),
|
||||
['qr_code_id' => $qrCode->id, 'qr_booking_id' => $booking->id, 'type' => 'booking'],
|
||||
);
|
||||
} catch (\Throwable) {
|
||||
$usesOwnerGateway = false;
|
||||
}
|
||||
}
|
||||
if (! $usesOwnerGateway) {
|
||||
$payOrder = $this->pay->createCheckout([
|
||||
'merchant' => $qrCode->user->public_id,
|
||||
'fee_tier' => 'sales',
|
||||
'source_service' => 'merchant',
|
||||
@@ -167,16 +206,19 @@ class MerchantSaleService
|
||||
'qr_booking_id' => $booking->id,
|
||||
'type' => 'booking',
|
||||
],
|
||||
]);
|
||||
]);
|
||||
}
|
||||
|
||||
$booking->update([
|
||||
'pay_order_id' => $payOrder['id'] ?? null,
|
||||
'pay_order_id' => $usesOwnerGateway ? null : ($payOrder['id'] ?? null),
|
||||
'payment_reference' => $payOrder['reference'],
|
||||
]);
|
||||
|
||||
return [
|
||||
'booking' => $booking,
|
||||
'checkout_url' => (string) ($payOrder['checkout_url'] ?? ''),
|
||||
'access_code' => isset($payOrder['access_code']) ? (string) $payOrder['access_code'] : null,
|
||||
'public_key' => isset($payOrder['public_key']) ? (string) $payOrder['public_key'] : null,
|
||||
'callback_url' => $callbackUrl,
|
||||
];
|
||||
}
|
||||
@@ -186,6 +228,9 @@ class MerchantSaleService
|
||||
if (str_starts_with($reference, 'LP-')) {
|
||||
return $this->completeLadillPayBooking($reference);
|
||||
}
|
||||
if (str_starts_with($reference, 'MGP-')) {
|
||||
return $this->completeOwnerGatewayBooking($reference);
|
||||
}
|
||||
|
||||
return $this->completeLegacyBooking($reference);
|
||||
}
|
||||
@@ -195,6 +240,9 @@ class MerchantSaleService
|
||||
if (str_starts_with($reference, 'LP-')) {
|
||||
return $this->completeLadillPay($reference);
|
||||
}
|
||||
if (str_starts_with($reference, 'MGP-')) {
|
||||
return $this->completeOwnerGateway($reference);
|
||||
}
|
||||
|
||||
return $this->completeLegacy($reference);
|
||||
}
|
||||
@@ -217,6 +265,7 @@ class MerchantSaleService
|
||||
]);
|
||||
|
||||
$this->notifyOrderPlaced($order->fresh(['qrCode', 'merchant']));
|
||||
$this->kitchen->push($order->fresh(['qrCode', 'merchant']));
|
||||
|
||||
return $order;
|
||||
}
|
||||
@@ -257,6 +306,33 @@ class MerchantSaleService
|
||||
);
|
||||
|
||||
$this->notifyOrderPlaced($order->fresh(['qrCode', 'merchant']));
|
||||
$this->kitchen->push($order->fresh(['qrCode', 'merchant']));
|
||||
|
||||
return $order;
|
||||
}
|
||||
|
||||
private function completeOwnerGateway(string $reference): QrSaleOrder
|
||||
{
|
||||
$order = QrSaleOrder::where('payment_reference', $reference)
|
||||
->where('status', QrSaleOrder::STATUS_PENDING)
|
||||
->with('merchant')
|
||||
->firstOrFail();
|
||||
$result = $this->gateway->verify($order->merchant, $reference);
|
||||
if (! $result['paid']) {
|
||||
$order->update(['status' => QrSaleOrder::STATUS_FAILED]);
|
||||
throw new RuntimeException('Payment was not successful.');
|
||||
}
|
||||
$paidMinor = (int) ($result['amount_minor'] ?: round($order->amount_ghs * 100));
|
||||
$order->update([
|
||||
'status' => QrSaleOrder::STATUS_PAID,
|
||||
'paid_at' => now(),
|
||||
'amount_ghs' => round($paidMinor / 100, 2),
|
||||
'platform_fee_ghs' => 0,
|
||||
'merchant_amount_ghs' => round($paidMinor / 100, 2),
|
||||
'metadata' => array_merge((array) $order->metadata, ['merchant_gateway' => $result]),
|
||||
]);
|
||||
$this->notifyOrderPlaced($order->fresh(['qrCode', 'merchant']));
|
||||
$this->kitchen->push($order->fresh(['qrCode', 'merchant']));
|
||||
|
||||
return $order;
|
||||
}
|
||||
@@ -297,7 +373,7 @@ class MerchantSaleService
|
||||
}
|
||||
|
||||
$paidAmount = round(($data['amount'] ?? 0) / 100, 2);
|
||||
$platformFee = round($paidAmount * 0.15, 2);
|
||||
$platformFee = round($paidAmount * QrSaleOrder::PLATFORM_FEE_RATE, 2);
|
||||
$merchantAmount = round($paidAmount - $platformFee, 2);
|
||||
|
||||
$booking->update([
|
||||
@@ -324,6 +400,32 @@ class MerchantSaleService
|
||||
return $booking;
|
||||
}
|
||||
|
||||
private function completeOwnerGatewayBooking(string $reference): QrBooking
|
||||
{
|
||||
$booking = QrBooking::where('payment_reference', $reference)
|
||||
->where('status', QrBooking::STATUS_PENDING)
|
||||
->with('merchant')
|
||||
->firstOrFail();
|
||||
$result = $this->gateway->verify($booking->merchant, $reference);
|
||||
if (! $result['paid']) {
|
||||
$booking->update(['status' => QrBooking::STATUS_FAILED]);
|
||||
throw new RuntimeException('Payment was not successful.');
|
||||
}
|
||||
$paidMinor = (int) ($result['amount_minor'] ?: round($booking->amount_ghs * 100));
|
||||
$booking->update([
|
||||
'status' => QrBooking::STATUS_CONFIRMED,
|
||||
'fulfillment_status' => QrBooking::FULFILLMENT_CONFIRMED,
|
||||
'paid_at' => now(),
|
||||
'amount_ghs' => round($paidMinor / 100, 2),
|
||||
'platform_fee_ghs' => 0,
|
||||
'merchant_amount_ghs' => round($paidMinor / 100, 2),
|
||||
'metadata' => array_merge((array) $booking->metadata, ['merchant_gateway' => $result]),
|
||||
]);
|
||||
$this->notifyBookingConfirmed($booking->fresh(['qrCode']));
|
||||
|
||||
return $booking;
|
||||
}
|
||||
|
||||
private function notifyBookingConfirmed(QrBooking $booking): void
|
||||
{
|
||||
if (! $booking->customer_phone) {
|
||||
|
||||
@@ -0,0 +1,88 @@
|
||||
<?php
|
||||
|
||||
namespace App\Services\Payments;
|
||||
|
||||
use App\Models\PaymentGatewaySetting;
|
||||
use App\Models\User;
|
||||
use App\Services\Billing\PlanEntitlementService;
|
||||
use Illuminate\Support\Facades\Http;
|
||||
use RuntimeException;
|
||||
|
||||
class MerchantGatewayService
|
||||
{
|
||||
public function __construct(private readonly PlanEntitlementService $entitlements) {}
|
||||
|
||||
public function settingFor(User|string $owner): ?PaymentGatewaySetting
|
||||
{
|
||||
$ownerRef = $owner instanceof User ? (string) $owner->public_id : (string) $owner;
|
||||
|
||||
return PaymentGatewaySetting::query()->where('owner_ref', $ownerRef)->first();
|
||||
}
|
||||
|
||||
public function shouldUseOwnerGateway(User $owner): bool
|
||||
{
|
||||
return $this->entitlements->canUseCustomPaymentGateway($owner)
|
||||
&& (bool) $this->settingFor($owner)?->isConfigured();
|
||||
}
|
||||
|
||||
/** @return array{checkout_url:string,reference:string,provider:string} */
|
||||
public function initialize(User $owner, int $amountMinor, string $currency, string $email, string $callbackUrl, string $reference, array $metadata = []): array
|
||||
{
|
||||
if (! $this->shouldUseOwnerGateway($owner)) {
|
||||
throw new RuntimeException('Owner gateway is not available.');
|
||||
}
|
||||
|
||||
$setting = $this->settingFor($owner);
|
||||
$response = Http::withToken((string) $setting->secret_key)->acceptJson()->timeout(20)
|
||||
->post('https://api.paystack.co/transaction/initialize', [
|
||||
'email' => $email !== '' ? $email : 'pay@ladill.com',
|
||||
'amount' => $amountMinor,
|
||||
'currency' => strtoupper($currency ?: 'GHS'),
|
||||
'reference' => $reference,
|
||||
'callback_url' => $callbackUrl,
|
||||
'metadata' => $metadata,
|
||||
]);
|
||||
|
||||
if (! $response->successful() || ! ($response->json('status') ?? false) || ! $response->json('data.authorization_url')) {
|
||||
throw new RuntimeException($response->json('message') ?: 'Paystack could not start checkout.');
|
||||
}
|
||||
|
||||
$accessCode = (string) ($response->json('data.access_code') ?? '');
|
||||
$checkoutUrl = (string) $response->json('data.authorization_url');
|
||||
if ($accessCode === '' && $checkoutUrl !== '') {
|
||||
$path = ltrim((string) (parse_url($checkoutUrl, PHP_URL_PATH) ?: ''), '/');
|
||||
$maybe = explode('/', $path)[0] ?? '';
|
||||
if (preg_match('/^[A-Za-z0-9_-]{6,}$/', $maybe) === 1) {
|
||||
$accessCode = $maybe;
|
||||
}
|
||||
}
|
||||
|
||||
return [
|
||||
'checkout_url' => $checkoutUrl,
|
||||
'access_code' => $accessCode !== '' ? $accessCode : null,
|
||||
'reference' => (string) ($response->json('data.reference') ?: $reference),
|
||||
'provider' => PaymentGatewaySetting::PROVIDER_PAYSTACK,
|
||||
];
|
||||
}
|
||||
|
||||
/** @return array<string,mixed> */
|
||||
public function verify(User|string $owner, string $reference): array
|
||||
{
|
||||
$setting = $this->settingFor($owner);
|
||||
if (! $setting?->isConfigured()) {
|
||||
throw new RuntimeException('The owner gateway used for this payment is no longer configured.');
|
||||
}
|
||||
|
||||
$response = Http::withToken((string) $setting->secret_key)->acceptJson()->timeout(20)
|
||||
->get('https://api.paystack.co/transaction/verify/'.rawurlencode($reference));
|
||||
$data = (array) ($response->json('data') ?? []);
|
||||
|
||||
return [
|
||||
'paid' => ($response->json('status') ?? false) && strtolower((string) ($data['status'] ?? '')) === 'success',
|
||||
'amount_minor' => (int) ($data['amount'] ?? 0),
|
||||
'reference' => (string) ($data['reference'] ?? $reference),
|
||||
'provider' => PaymentGatewaySetting::PROVIDER_PAYSTACK,
|
||||
'raw' => $data,
|
||||
];
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
<?php
|
||||
|
||||
namespace App\Support;
|
||||
|
||||
final class CrmPrefillCodec
|
||||
{
|
||||
/** @return array<string, mixed>|null */
|
||||
public static function decode(?string $token): ?array
|
||||
{
|
||||
if (! is_string($token) || $token === '') {
|
||||
return null;
|
||||
}
|
||||
|
||||
$padded = $token.str_repeat('=', (4 - strlen($token) % 4) % 4);
|
||||
$json = base64_decode(strtr($padded, '-_', '+/'), true);
|
||||
|
||||
if ($json === false) {
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
$data = json_decode($json, true, 512, JSON_THROW_ON_ERROR);
|
||||
} catch (\JsonException) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return is_array($data) ? $data : null;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
<?php
|
||||
|
||||
namespace App\Support;
|
||||
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
/**
|
||||
* Canonical short-link URLs for the Ladill platform (ladl.link).
|
||||
*/
|
||||
final class LadillLink
|
||||
{
|
||||
public const INTERNAL_HEADER = 'X-Ladill-Internal';
|
||||
|
||||
public static function baseUrl(): string
|
||||
{
|
||||
$domain = (string) config('link.public_domain', 'ladl.link');
|
||||
|
||||
return 'https://'.$domain;
|
||||
}
|
||||
|
||||
public static function url(string $slug): string
|
||||
{
|
||||
return rtrim(self::baseUrl(), '/').'/'.ltrim($slug, '/');
|
||||
}
|
||||
|
||||
public static function path(string $slug, string $suffix): string
|
||||
{
|
||||
return self::url($slug).'/'.ltrim($suffix, '/');
|
||||
}
|
||||
|
||||
public static function isInternalRequest(Request $request): bool
|
||||
{
|
||||
return $request->header(self::INTERNAL_HEADER) === '1';
|
||||
}
|
||||
|
||||
public static function legacyRedirect(Request $request): RedirectResponse
|
||||
{
|
||||
$shortCode = $request->route('shortCode');
|
||||
if (! is_string($shortCode) || $shortCode === '') {
|
||||
abort(404);
|
||||
}
|
||||
|
||||
$path = ltrim($request->path(), '/');
|
||||
$prefix = 'q/'.$shortCode;
|
||||
$suffix = '';
|
||||
if ($path !== $prefix && str_starts_with($path, $prefix.'/')) {
|
||||
$suffix = substr($path, strlen($prefix) + 1);
|
||||
}
|
||||
|
||||
$target = $suffix === '' ? self::url($shortCode) : self::path($shortCode, $suffix);
|
||||
if ($qs = $request->getQueryString()) {
|
||||
$target .= '?'.$qs;
|
||||
}
|
||||
|
||||
$status = in_array($request->method(), ['GET', 'HEAD'], true) ? 301 : 307;
|
||||
|
||||
return redirect()->away($target, $status);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,163 @@
|
||||
<?php
|
||||
|
||||
namespace App\Support;
|
||||
|
||||
use Illuminate\Contracts\Auth\Authenticatable;
|
||||
use Illuminate\Support\Facades\Route;
|
||||
|
||||
class UserProfileMenu
|
||||
{
|
||||
/**
|
||||
* Standard signed-in profile links for Ladill product apps.
|
||||
* Not used by Ladill Mail (mail.ladill.com) — that app keeps a mailbox-specific menu.
|
||||
*
|
||||
* @return list<array<string, mixed>>
|
||||
*/
|
||||
public static function items(?Authenticatable $user = null): array
|
||||
{
|
||||
$user ??= auth()->user();
|
||||
|
||||
if (! $user) {
|
||||
return [];
|
||||
}
|
||||
|
||||
$items = [];
|
||||
|
||||
foreach ([
|
||||
['label' => 'Home', 'path' => '', 'host' => 'home'],
|
||||
['label' => 'Profile', 'path' => 'profile'],
|
||||
['label' => 'Account Settings', 'path' => 'account-settings'],
|
||||
['label' => 'Dashboard', 'path' => 'dashboard'],
|
||||
['label' => 'Billing', 'path' => 'billing'],
|
||||
] as $link) {
|
||||
$href = self::platformUrl($link['host'] ?? 'account', $link['path']);
|
||||
|
||||
if (self::isCurrentMenuLink($link, $href)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
$items[] = [
|
||||
'type' => 'link',
|
||||
'label' => $link['label'],
|
||||
'href' => $href,
|
||||
];
|
||||
}
|
||||
|
||||
if (Route::has((string) config('billing.wallet_balance_route', 'wallet.balance'))) {
|
||||
$items[] = ['type' => 'wallet'];
|
||||
}
|
||||
|
||||
if (self::userIsAdmin($user)) {
|
||||
$adminHref = self::platformUrl('account', 'admin');
|
||||
|
||||
if (! self::isCurrentMenuLink(['path' => 'admin', 'host' => 'account'], $adminHref)) {
|
||||
$items[] = [
|
||||
'type' => 'link',
|
||||
'label' => 'Admin',
|
||||
'href' => $adminHref,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
if (Route::has('logout')) {
|
||||
$items[] = [
|
||||
'type' => 'logout',
|
||||
'label' => 'Logout',
|
||||
'action' => route('logout'),
|
||||
];
|
||||
}
|
||||
|
||||
return $items;
|
||||
}
|
||||
|
||||
private static function platformUrl(string $host, string $path = ''): string
|
||||
{
|
||||
if ($host === 'home') {
|
||||
if (function_exists('ladill_home_url')) {
|
||||
return ladill_home_url($path);
|
||||
}
|
||||
|
||||
$domain = config('app.home_domain');
|
||||
if (! $domain) {
|
||||
$platform = (string) config('app.platform_domain', parse_url((string) config('app.url', ''), PHP_URL_HOST) ?: '');
|
||||
$domain = $platform !== '' ? 'home.'.$platform : (string) config('app.account_domain');
|
||||
}
|
||||
|
||||
return self::absoluteUrl((string) $domain, $path);
|
||||
}
|
||||
|
||||
if (function_exists('ladill_account_url')) {
|
||||
return ladill_account_url($path);
|
||||
}
|
||||
|
||||
return self::absoluteUrl((string) config('app.account_domain'), $path);
|
||||
}
|
||||
|
||||
/**
|
||||
* Hide a menu link when the signed-in user is already on that destination.
|
||||
*
|
||||
* @param array{label?: string, path?: string, host?: string} $link
|
||||
*/
|
||||
private static function isCurrentMenuLink(array $link, string $href): bool
|
||||
{
|
||||
if (app()->runningInConsole() && ! app()->runningUnitTests()) {
|
||||
return false;
|
||||
}
|
||||
|
||||
$request = request();
|
||||
if (! $request) {
|
||||
return false;
|
||||
}
|
||||
|
||||
$linkHost = strtolower((string) parse_url($href, PHP_URL_HOST));
|
||||
$currentHost = strtolower($request->getHost());
|
||||
|
||||
if ($linkHost === '' || $linkHost !== $currentHost) {
|
||||
return false;
|
||||
}
|
||||
|
||||
$currentPath = trim($request->getPathInfo(), '/');
|
||||
$targetPath = trim((string) parse_url($href, PHP_URL_PATH), '/');
|
||||
|
||||
if (($link['host'] ?? 'account') === 'home') {
|
||||
return $currentPath === '';
|
||||
}
|
||||
|
||||
if (($link['path'] ?? '') === 'dashboard') {
|
||||
return in_array($currentPath, ['dashboard', 'account'], true)
|
||||
|| ($targetPath !== '' && self::pathMatchesSection($currentPath, $targetPath));
|
||||
}
|
||||
|
||||
return self::pathMatchesSection($currentPath, $targetPath);
|
||||
}
|
||||
|
||||
private static function pathMatchesSection(string $currentPath, string $targetPath): bool
|
||||
{
|
||||
if ($targetPath === '') {
|
||||
return $currentPath === '';
|
||||
}
|
||||
|
||||
return $currentPath === $targetPath
|
||||
|| str_starts_with($currentPath, $targetPath.'/');
|
||||
}
|
||||
|
||||
private static function absoluteUrl(string $domain, string $path = ''): string
|
||||
{
|
||||
$base = 'https://'.trim($domain, '/');
|
||||
|
||||
if ($path === '') {
|
||||
return $base;
|
||||
}
|
||||
|
||||
return $base.'/'.ltrim($path, '/');
|
||||
}
|
||||
|
||||
private static function userIsAdmin(Authenticatable $user): bool
|
||||
{
|
||||
if (method_exists($user, 'isAdmin')) {
|
||||
return $user->isAdmin();
|
||||
}
|
||||
|
||||
return (bool) ($user->is_admin ?? false);
|
||||
}
|
||||
}
|
||||
@@ -13,12 +13,24 @@ return Application::configure(basePath: dirname(__DIR__))
|
||||
health: '/up',
|
||||
)
|
||||
->withMiddleware(function (Middleware $middleware): void {
|
||||
// Storefront/booking POSTs are proxied ladl.link → platform → Merchant without
|
||||
// a browser session cookie that matches merchant CSRF tokens.
|
||||
$middleware->validateCsrfTokens(except: [
|
||||
'q/*/order',
|
||||
'q/*/booking',
|
||||
]);
|
||||
|
||||
$middleware->redirectGuestsTo(fn (Request $request) => route('sso.connect', [
|
||||
'redirect' => $request->fullUrl(),
|
||||
]));
|
||||
$middleware->web(append: [
|
||||
\App\Http\Middleware\InjectBootSplash::class,
|
||||
\App\Http\Middleware\SetActingAccount::class,
|
||||
]);
|
||||
$middleware->alias([
|
||||
'platform.session' => \App\Http\Middleware\EnsurePlatformSession::class,
|
||||
'redirect.legacy.qr' => \App\Http\Middleware\RedirectLegacyQrToLadillLink::class,
|
||||
]);
|
||||
})
|
||||
->withExceptions(function (Exceptions $exceptions): void {
|
||||
//
|
||||
|
||||
@@ -4,5 +4,7 @@ return [
|
||||
'api_url' => env('BILLING_API_URL', 'https://ladill.com/api/billing'),
|
||||
'api_key' => env('BILLING_API_KEY_MERCHANT'),
|
||||
'service' => 'merchant',
|
||||
'wallet_balance_route' => 'wallet.balance',
|
||||
'currency' => 'GHS',
|
||||
'platform_settings_connection' => env('BILLING_PLATFORM_SETTINGS_CONNECTION', 'platform'),
|
||||
];
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
'url' => rtrim((string) env('CRM_API_URL', 'https://crm.ladill.com/api'), '/'),
|
||||
'key' => env('CRM_API_KEY_MERCHANT'),
|
||||
'default_currency' => env('CRM_DEFAULT_CURRENCY', 'GHS'),
|
||||
];
|
||||
@@ -0,0 +1,27 @@
|
||||
<?php
|
||||
|
||||
$appHost = parse_url((string) env('APP_URL', 'https://merchant.ladill.com'), PHP_URL_HOST) ?: 'merchant.ladill.com';
|
||||
|
||||
return [
|
||||
// Custom domains are opt-in; the feature only surfaces/provisions when a
|
||||
// Domains SSL API key is configured.
|
||||
'enabled' => filter_var(env('CUSTOM_DOMAINS_ENABLED', true), FILTER_VALIDATE_BOOLEAN),
|
||||
|
||||
// This app's own host(s) — requests on any other host are treated as a
|
||||
// customer custom domain and resolved to the mapped storefront.
|
||||
'app_host' => $appHost,
|
||||
|
||||
// Where customers point their A records (apex + www).
|
||||
'server_ip' => env('LADILL_APP_SERVER_IP', '161.97.138.149'),
|
||||
|
||||
// Central SSL provisioning (Ladill Domains).
|
||||
'ssl_api_url' => rtrim(env('DOMAINS_SSL_API_URL', 'https://domains.ladill.com/api'), '/'),
|
||||
'ssl_api_key' => env('DOMAINS_API_KEY_MERCHANT', ''),
|
||||
|
||||
// certbot issues + installs an nginx server block that includes this snippet
|
||||
// (root + fastcgi for the Merchant app) so the custom domain serves this app.
|
||||
'nginx_include' => env('CUSTOM_DOMAINS_NGINX_INCLUDE', '/etc/nginx/snippets/ladill-merchant-app.conf'),
|
||||
|
||||
// Shared secret to verify the signed completion callback from Domains.
|
||||
'callback_secret' => env('SSL_CALLBACK_SECRET', ''),
|
||||
];
|
||||
@@ -0,0 +1,8 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
// Ladill POS kitchen ingest — paid food-storefront orders are pushed here so
|
||||
// they appear on the merchant's POS Kitchen Display. Empty = disabled.
|
||||
'url' => rtrim((string) env('KITCHEN_API_URL', ''), '/'),
|
||||
'key' => env('KITCHEN_API_KEY'),
|
||||
];
|
||||
@@ -0,0 +1,6 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
'product_slug' => 'merchant',
|
||||
'marketing_url' => env('LADILL_MARKETING_URL', 'https://ladill.com/products/merchant'),
|
||||
];
|
||||
@@ -2,39 +2,44 @@
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Ladill App Launcher — SHARED, IDENTICAL across every app/service repo
|
||||
| Ladill App Launcher — GENERATED, IDENTICAL across every app/service repo
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| Lists ONLY fully-extracted apps (each on its own subdomain). To replicate the
|
||||
| launcher in a new app, copy these three things verbatim into that repo:
|
||||
| - config/ladill_launcher.php (this file)
|
||||
| - resources/views/partials/launcher.blade.php
|
||||
| - public/images/launcher-icons/* (the icon set)
|
||||
| DO NOT EDIT BY HAND. This file is generated from the app registry in the
|
||||
| monolith (config/ladill_apps.php). To change the launcher, edit that
|
||||
| registry and run: php artisan ladill:launcher:sync --propagate
|
||||
|
|
||||
| When a service becomes FULLY extracted: add one row below AND drop its icon in
|
||||
| public/images/launcher-icons/ — in EVERY repo. That's the only edit needed.
|
||||
| Do NOT list a service here until it is fully extracted to its own subdomain.
|
||||
|
|
||||
| URLs are absolute (built from the platform root) so this file is byte-identical
|
||||
| in every app; the blade omits whichever row matches the app's APP_URL host.
|
||||
| Icons are served from /images/launcher-icons/<icon>.
|
||||
| URLs are absolute (built from the platform root) so this file is
|
||||
| byte-identical in every repo; the blade omits whichever row matches the
|
||||
| app's own host. Icons are served from /images/launcher-icons/<icon>.
|
||||
*/
|
||||
|
||||
$root = config('app.platform_domain', 'ladill.com');
|
||||
|
||||
return [
|
||||
'apps' => [
|
||||
['name' => 'Merchant', 'url' => 'https://merchant.'.$root.'/sso/connect?redirect='.urlencode('https://merchant.'.$root.'/dashboard'), 'icon' => 'merchant.svg'],
|
||||
['name' => 'POS', 'url' => 'https://pos.'.$root.'/sso/connect?redirect='.urlencode('https://pos.'.$root.'/dashboard'), 'icon' => 'pos.svg'],
|
||||
['name' => 'Mini', 'url' => 'https://mini.'.$root.'/sso/connect?redirect='.urlencode('https://mini.'.$root.'/dashboard'), 'icon' => 'mini.svg'],
|
||||
['name' => 'Give', 'url' => 'https://give.'.$root.'/sso/connect?redirect='.urlencode('https://give.'.$root.'/dashboard'), 'icon' => 'give.svg'],
|
||||
['name' => 'Woo Manager', 'url' => 'https://woo.'.$root.'/sso/connect?redirect='.urlencode('https://woo.'.$root.'/dashboard'), 'icon' => 'woomanager.svg'],
|
||||
['name' => 'Transfer', 'url' => 'https://transfer.'.$root.'/sso/connect?redirect='.urlencode('https://transfer.'.$root.'/dashboard'), 'icon' => 'transfer.svg'],
|
||||
['name' => 'Accounting', 'url' => 'https://accounting.'.$root.'/sso/connect?redirect='.urlencode('https://accounting.'.$root.'/dashboard'), 'icon' => 'accounting.svg'],
|
||||
['name' => 'Invoice', 'url' => 'https://invoice.'.$root.'/sso/connect?redirect='.urlencode('https://invoice.'.$root.'/dashboard'), 'icon' => 'invoice.svg'],
|
||||
['name' => 'CRM', 'url' => 'https://crm.'.$root.'/sso/connect?redirect='.urlencode('https://crm.'.$root.'/dashboard'), 'icon' => 'crm.svg'],
|
||||
['name' => 'Events', 'url' => 'https://events.'.$root.'/sso/connect?redirect='.urlencode('https://events.'.$root.'/dashboard'), 'icon' => 'events.svg'],
|
||||
['name' => 'QR Plus', 'url' => 'https://qrplus.'.$root.'/sso/connect?redirect='.urlencode('https://qrplus.'.$root.'/dashboard'), 'icon' => 'qrplus.svg'],
|
||||
['name' => 'Link', 'url' => 'https://link.'.$root.'/sso/connect?redirect='.urlencode('https://link.'.$root.'/dashboard'), 'icon' => 'link.svg'],
|
||||
['name' => 'Frontdesk', 'url' => 'https://frontdesk.'.$root.'/sso/connect?redirect='.urlencode('https://frontdesk.'.$root.'/dashboard'), 'icon' => 'frontdesk.svg'],
|
||||
['name' => 'Care', 'url' => 'https://care.'.$root.'/sso/connect?redirect='.urlencode('https://care.'.$root.'/dashboard'), 'icon' => 'care.svg'],
|
||||
['name' => 'Queue', 'url' => 'https://queue.'.$root.'/sso/connect?redirect='.urlencode('https://queue.'.$root.'/dashboard'), 'icon' => 'queue.svg'],
|
||||
['name' => 'SMS', 'url' => 'https://sms.'.$root, 'icon' => 'sms.svg'],
|
||||
['name' => 'Bird', 'url' => 'https://bird.'.$root, 'icon' => 'bird.svg'],
|
||||
['name' => 'Email', 'url' => 'https://email.'.$root, 'icon' => 'email.svg'],
|
||||
['name' => 'Mail', 'url' => 'https://mail.'.$root, 'icon' => 'mail.svg'],
|
||||
['name' => 'Meet', 'url' => 'https://meet.'.$root.'/sso/connect?redirect='.urlencode('https://meet.'.$root.'/dashboard'), 'icon' => 'meet.svg'],
|
||||
['name' => 'Email', 'url' => 'https://email.'.$root, 'icon' => 'email.svg'],
|
||||
['name' => 'Domains', 'url' => 'https://domains.'.$root, 'icon' => 'domains.svg'],
|
||||
['name' => 'Servers', 'url' => 'https://servers.'.$root, 'icon' => 'servers.svg'],
|
||||
['name' => 'Hosting', 'url' => 'https://hosting.'.$root, 'icon' => 'hosting.svg'],
|
||||
['name' => 'QR Plus', 'url' => 'https://qrplus.'.$root.'/sso/connect?redirect='.urlencode('https://qrplus.'.$root.'/dashboard'), 'icon' => 'qrplus.svg'],
|
||||
['name' => 'Events', 'url' => 'https://events.'.$root.'/sso/connect?redirect='.urlencode('https://events.'.$root.'/dashboard'), 'icon' => 'events.svg'],
|
||||
['name' => 'Mini', 'url' => 'https://mini.'.$root.'/sso/connect?redirect='.urlencode('https://mini.'.$root.'/dashboard'), 'icon' => 'mini.svg'],
|
||||
['name' => 'Give', 'url' => 'https://give.'.$root.'/sso/connect?redirect='.urlencode('https://give.'.$root.'/dashboard'), 'icon' => 'give.svg'],
|
||||
['name' => 'Merchant', 'url' => 'https://merchant.'.$root.'/sso/connect?redirect='.urlencode('https://merchant.'.$root.'/dashboard'), 'icon' => 'merchant.svg'],
|
||||
['name' => 'Transfer', 'url' => 'https://transfer.'.$root.'/sso/connect?redirect='.urlencode('https://transfer.'.$root.'/dashboard'), 'icon' => 'transfer.svg'],
|
||||
],
|
||||
];
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
'public_domain' => env('LINK_PUBLIC_DOMAIN', 'ladl.link'),
|
||||
];
|
||||
@@ -32,7 +32,7 @@ return [
|
||||
|
|
||||
*/
|
||||
|
||||
'lifetime' => (int) env('SESSION_LIFETIME', 120),
|
||||
'lifetime' => (int) env('SESSION_LIFETIME', 1440),
|
||||
|
||||
'expire_on_close' => env('SESSION_EXPIRE_ON_CLOSE', false),
|
||||
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
<?php
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
public function up(): void
|
||||
{
|
||||
Schema::create('custom_domains', function (Blueprint $table) {
|
||||
$table->id();
|
||||
$table->foreignId('qr_code_id')->constrained('qr_codes')->cascadeOnDelete(); // the storefront
|
||||
$table->foreignId('user_id')->constrained()->cascadeOnDelete();
|
||||
$table->string('host')->unique();
|
||||
$table->boolean('include_www')->default(true);
|
||||
$table->string('status', 16)->default('pending'); // pending | active | failed
|
||||
$table->string('ssl_status', 16)->default('pending'); // pending | active | failed
|
||||
$table->timestamp('dns_verified_at')->nullable();
|
||||
$table->timestamp('ssl_issued_at')->nullable();
|
||||
$table->timestamp('ssl_expires_at')->nullable();
|
||||
$table->text('last_error')->nullable();
|
||||
$table->timestamps();
|
||||
|
||||
$table->index('qr_code_id');
|
||||
});
|
||||
}
|
||||
|
||||
public function down(): void
|
||||
{
|
||||
Schema::dropIfExists('custom_domains');
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,27 @@
|
||||
<?php
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
public function up(): void
|
||||
{
|
||||
Schema::create('payment_gateway_settings', function (Blueprint $table) {
|
||||
$table->id();
|
||||
$table->string('owner_ref', 64)->unique();
|
||||
$table->string('provider', 32);
|
||||
$table->text('public_key')->nullable();
|
||||
$table->text('secret_key')->nullable();
|
||||
$table->boolean('is_active')->default(false);
|
||||
$table->json('metadata')->nullable();
|
||||
$table->timestamps();
|
||||
});
|
||||
}
|
||||
|
||||
public function down(): void
|
||||
{
|
||||
Schema::dropIfExists('payment_gateway_settings');
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #009e6b;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #db5443;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #00a3d7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-3" d="M1.7,170.6c0,9,.1,18.2,0,27.2-.1,8.8,4.3,15,13.8,19.3,17.3,7.5,34.4,15.2,51.7,22.8,69,30.6,138.2,61.1,207.1,92,16.9,7.6,37.1-.3,36.9-17.8v-54c0-17.9-4.5-15.2-14.4-19.4-47-20.7-94-41.6-141-62.4-39-17.3-78.2-34.2-117-51.9C19.9,117.7,0,128.1,1.3,144.4c.6,8.8.1,17.6.1,26.3h.3Z"/>
|
||||
<path class="cls-1" d="M194.6,25.4c9,0,18.2.1,27.2,0,8.8-.1,15,4.3,19.3,13.8,7.5,17.3,15.2,34.4,22.8,51.7,30.6,69.1,60.9,138.3,91.9,207.2,7.6,16.9-.3,37.1-17.8,36.9h-54c-17.9,0-15.2-4.5-19.4-14.4-20.7-47-41.6-94-62.4-141-17.3-39-34.2-78.2-51.9-117-8.7-18.8,1.8-38.7,18.1-37.4,8.8.6,17.6.1,26.3.1h0Z"/>
|
||||
<path class="cls-2" d="M194.9,25.3c-9,0-18.2.1-27.2,0-8.8-.1-15,4.3-19.3,13.8-7.5,17.3-15.2,34.4-22.8,51.7-30.6,69.1-60.9,138.3-91.9,207.2-7.6,16.9.3,37.1,17.8,36.9h54c17.9,0,15.2-4.5,19.4-14.4,20.7-47,41.6-94,62.4-141,17.3-39,34.2-78.2,51.9-117,8.7-18.8-1.8-38.7-18.1-37.4-8.8.6-17.6.1-26.3.1h0Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #5cc45b;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #96c;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #7b9594;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-1" d="M347.3,272.3c-50.4,84.4-159.2,112.7-244.6,63.8C17.4,286.6-12.4,177.8,35.6,92.4l311.7,179.8Z"/>
|
||||
<path class="cls-2" d="M347.3,87.6C297,3.2,188.1-25.1,102.7,24.3,17.4,73.2-12.4,182.1,35.6,267.5L347.3,87.6Z"/>
|
||||
<path class="cls-3" d="M35.6,92.4c-6,10.6-10.7,21.6-14.3,32.7,0,.3-.2.6-.3.9-.3.9-.6,1.8-.8,2.7-.3,1-.6,1.9-.8,2.9,0,.3-.1.5-.2.8-3.4,12.3-5.4,24.9-6.1,37.7,0,0,0,0,0,.1,0,1.3-.1,2.5-.2,3.8,0,.3,0,.7,0,1,0,1,0,1.9,0,2.9,0,.7,0,1.3,0,2,0,.7,0,1.3,0,2,0,1,0,1.9,0,2.9,0,.3,0,.7,0,1,0,1.2,0,2.5.2,3.7,0,0,0,.1,0,.2.6,9.9,1.9,19.8,4.1,29.4,0,.2,0,.3.1.5.2,1.1.5,2.2.8,3.3.2.6.3,1.3.5,1.9.2.6.3,1.2.5,1.8,3.8,14,9.3,27.7,16.7,40.9l151.7-87.5L35.6,92.4Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@@ -0,0 +1,35 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #d7d135;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3, .cls-4, .cls-5 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #8c67d5;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #3d85a4;
|
||||
}
|
||||
|
||||
.cls-4 {
|
||||
fill: #6576bd;
|
||||
}
|
||||
|
||||
.cls-5 {
|
||||
fill: #b29c85;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-2" d="M168.1,0C74,6.3-.4,84.6.2,179.8h0c0,95.1,74.4,173.4,167.9,179.8V0Z"/>
|
||||
<path class="cls-3" d="M.2,192.1c6.3,94.1,84.6,168.5,179.8,167.9h0c95.1,0,173.4-74.4,179.8-167.9H.2Z"/>
|
||||
<path class="cls-1" d="M.2,167.9C6.5,73.8,84.8-.6,180,0h0C275.1,0,353.4,74.4,359.7,167.9H.2Z"/>
|
||||
<path class="cls-5" d="M168.1,167.9V.4c-19.4,1.2-37.9,5.4-55.1,12.3-.2,0-.4.2-.7.3-2.1.8-4.1,1.7-6.2,2.7-.7.3-1.4.6-2.1.9-1.6.8-3.2,1.5-4.8,2.3-1,.5-2.1,1-3.1,1.6-1.3.7-2.6,1.4-3.8,2.1-1.2.7-2.5,1.4-3.7,2.1-1.1.6-2.1,1.3-3.2,1.9-1.4.8-2.7,1.7-4,2.5-.9.6-1.9,1.3-2.8,1.9-1.4.9-2.7,1.9-4.1,2.8-.9.7-1.8,1.3-2.7,2-1.3,1-2.6,2-3.9,3-.9.7-1.8,1.5-2.7,2.2-1.2,1-2.4,2-3.6,3.1-.9.8-1.9,1.7-2.8,2.5-1.1,1-2.2,2-3.3,3-1,.9-1.9,1.9-2.9,2.9-1,1-1.9,1.9-2.9,2.9-1,1.1-2,2.2-3,3.3-.8.9-1.7,1.8-2.5,2.8-1,1.2-2.1,2.4-3.1,3.6-.7.9-1.5,1.8-2.2,2.7-1,1.3-2,2.6-3,3.9-.7.9-1.3,1.8-2,2.7-1,1.3-1.9,2.7-2.8,4.1-.6.9-1.3,1.9-1.9,2.8-.9,1.3-1.7,2.7-2.5,4-.7,1.1-1.3,2.1-1.9,3.2-.7,1.2-1.4,2.5-2.1,3.7-.7,1.3-1.4,2.5-2.1,3.8-.5,1-1.1,2-1.6,3.1-.8,1.6-1.6,3.2-2.3,4.8-.3.7-.6,1.4-.9,2.1-.9,2-1.8,4.1-2.7,6.2,0,.2-.2.4-.3.7-6.9,17.2-11.1,35.8-12.3,55.1h167.6Z"/>
|
||||
<path class="cls-4" d="M168.1,359.5v-167.5H.7c6.1,89.5,78,161.4,167.5,167.5Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #ff79b7;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #7b50c4;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #0094c8;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-2" d="M14.1,74.6c3.7,8.2,7.5,16.9,11.1,25.1s9.9,12.2,20.5,12c19.1-.4,37.6,0,56.9-.1,76.1-.1,152.2-.2,228.2.2,18.9.1,34.1-15.1,26.8-31.6l-22.1-49.8c-7.3-16.5-10.3-12-21.1-12.2-51.9.2-103.5.1-155.4.3-43.1-.2-85.9.4-129.1-.1-20.7-.2-34.9,17.3-27.2,31.7,4.4,7.9,7.1,16.1,10.8,24.3h0l.5.2Z"/>
|
||||
<path class="cls-1" d="M63.1,188.9c3.7,8.2,7.5,16.9,11.1,25.1,3.7,8.2,9.9,12.2,20.5,12,19.1-.4,4.8-.1,24.1-.2,76.1-.1,86.6-.4,162.6,0,18.9.1,34.1-15.1,26.8-31.6l-22.1-49.8c-7.3-16.5-10.3-12-21.1-12.2-51.9.2-103.5.1-155.4.3-43.1-.2,12.5.6-30.7,0-20.7-.2-34.9,17.3-27.2,31.7,4.4,7.9,7.1,16.1,10.8,24.3h0l.5.2Z"/>
|
||||
<path class="cls-3" d="M116.1,305.2c3.7,8.2,7.5,16.9,11.1,25.1,3.7,8.2,9.9,12.2,20.5,12,19.1-.4,4.8-.1,24.1-.2,76.1-.1,16.9-.5,92.9-.1,18.9.1,34.1-15.1,26.8-31.6l-22.1-49.8c-7.3-16.5-10.3-12-21.1-12.2-51.9.2-33.7.3-85.7.4-43.1-.2,12.5.6-30.7,0-20.7-.2-34.9,17.3-27.2,31.7,4.4,7.9,7.1,16.1,10.8,24.3h0l.5.2Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@@ -3,18 +3,23 @@
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #f6398a;
|
||||
fill: #007e7d;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2 {
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #007e7d;
|
||||
fill: #7b5c84;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #f6398a;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-1" d="M267.9,17.5c-30.1-.2-56.9,15.4-73.6,39.6l58.6,68.2c4.7,5.5,4.1,13.7-1.4,18.4-2.5,2.1-5.5,3.1-8.5,3.1s-7.3-1.5-9.9-4.5c-17.5-20.3-34.9-40.6-52.4-61-9.6-11.2-19.3-22.4-28.9-33.6-7-8.1-13.3-17.2-23.1-22.1-11.2-5.6-24.3-8.1-36.7-8.1C32.8,17.9-10.8,83.4,2.3,144.7c6.5,30.6,28.4,55.4,45.8,79.4,22.2,30.7,65.6,74.1,96.5,103.8,20.2,19.4,50.6,19.4,70.7,0,30.9-29.7,74.3-73.2,96.5-103.8,17.4-24,39.3-48.8,45.8-79.4,13-61.3-30.6-126.9-89.8-127.2Z"/>
|
||||
<path class="cls-2" d="M267.9,17.5c-30.1-.2-56.9,15.4-73.6,39.6l58.6,68.2c4.7,5.5,4.1,13.7-1.4,18.4-2.5,2.1-5.5,3.1-8.5,3.1s-7.3-1.5-9.9-4.5l75.1,86.7c1.3-1.6,2.5-3.3,3.6-4.8,17.4-24,39.3-48.8,45.8-79.4,13-61.3-30.6-126.9-89.8-127.2Z"/>
|
||||
<path class="cls-1" d="M357,144.9c13.6-60.9-29.8-126.9-89-126.9s-56.6,15.3-73.7,39.6l127.6,152.5c14.8-19.8,30-40.8,35.1-65.2Z"/>
|
||||
<path class="cls-3" d="M180.7,81.5c-9.8-11.1-19.2-22.6-29-33.6-6.8-8.1-13.2-17-23-22.1-10.6-5.1-23.9-7.7-36.2-7.7-59.1-.1-102.6,65.9-89.8,126.8,6.4,30.7,28.5,55.4,45.6,79.2,22.1,30.7,65.6,74.1,96.3,103.5,20,19.2,50.7,19.2,70.7,0,28.7-27.5,67.6-66.7,90.8-96.3-44-52.6-112.7-135.1-125.3-149.8h-.1Z"/>
|
||||
<path class="cls-2" d="M234.3,143.1c-.4-.3-.8-.6-1.1-1-17.5-20.4-34.9-40.5-52.4-60.9-.2-.3-.4-.5-.7-.8-.4.4-.7.9-1.1,1.3-17.5,20.4-34.9,40.5-52.4,60.9-.3.4-.8.7-1.1,1l-73.5,85.1c23,30.3,63.5,70.8,92.6,98.6,20,19.2,50.7,19.2,70.7,0,29.6-28.3,69.8-69,92.8-98.9l-73.7-85.3h0Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.1 KiB |
@@ -31,10 +31,10 @@
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<rect class="cls-4" x="0" y="11.7" width="104.6" height="334.3" rx="52.3" ry="52.3"/>
|
||||
<rect class="cls-1" x="251.7" y="126.2" width="105.8" height="219.8" rx="52.9" ry="52.9"/>
|
||||
<path class="cls-6" d="M304.6,126.2H51.7C22.7,126.2,0,150.1,0,178.6s23.3,52.3,52.3,52.3h252.9c29.1,0,52.3-23.3,52.3-52.3s-23.3-52.3-52.3-52.3h-.6Z"/>
|
||||
<path class="cls-4" d="M52.3,11.7h0c28.9,0,52.3,23.4,52.3,52.3v229.7c0,28.9-23.4,52.3-52.3,52.3h0c-28.9,0-52.3-23.4-52.3-52.3V64C0,35.1,23.4,11.7,52.3,11.7Z"/>
|
||||
<path class="cls-1" d="M304.6,126.2h0c29.2,0,52.9,23.7,52.9,52.9v114c0,29.2-23.7,52.9-52.9,52.9h0c-29.2,0-52.9-23.7-52.9-52.9v-114c0-29.2,23.7-52.9,52.9-52.9Z"/>
|
||||
<path class="cls-6" d="M304.6,126.2H51.7c-29,0-51.7,23.9-51.7,52.4s23.3,52.3,52.3,52.3h252.9c29.1,0,52.3-23.3,52.3-52.3s-23.3-52.3-52.3-52.3h-.6,0Z"/>
|
||||
<circle class="cls-3" cx="304.1" cy="64" r="52.3"/>
|
||||
<path class="cls-2" d="M251.7,178.6v52.3h52.9c26.7,0,48.3-19.8,51.7-45.3v-7c0-29.1-23.3-52.3-52.3-52.3s-52.3,23.3-52.3,52.3Z"/>
|
||||
<path class="cls-5" d="M0,172.2v14c3.5,25.6,25,45.3,51.7,45.3h52.9v-104.6h-52.9C25,126.8,3.5,146.6,0,172.2Z"/>
|
||||
<path class="cls-2" d="M251.7,178.6v52.3h52.9c26.7,0,48.3-19.8,51.7-45.3v-7c0-29.1-23.3-52.3-52.3-52.3s-52.3,23.3-52.3,52.3h0Z"/>
|
||||
<path class="cls-5" d="M0,172.2v14c3.5,25.6,25,45.3,51.7,45.3h52.9v-104.6h-52.9c-26.7,0-48.2,19.7-51.7,45.3Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.3 KiB |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #c1c93d;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #3dc3a4;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #2a4372;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<circle class="cls-3" cx="259.2" cy="76.3" r="76.3"/>
|
||||
<path class="cls-1" d="M168.8,360v-189.2c-79.5,0-144.3,64.7-144.3,144.3v45h144.3Z"/>
|
||||
<path class="cls-2" d="M187.1,170.8v189.2c79.5,0,144.3-64.7,144.3-144.3v-45h-144.3Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 638 B |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #a8ca38;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #678e9c;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #2551ff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<rect class="cls-1" x="32" y="36.1" width="175.5" height="290.1" rx="87.7" ry="87.7" transform="translate(-74.5 84.1) rotate(-30)"/>
|
||||
<rect class="cls-3" x="152.6" y="36.1" width="175.5" height="290.1" rx="87.7" ry="87.7" transform="translate(-58.4 144.4) rotate(-30)"/>
|
||||
<path class="cls-2" d="M167.1,87.6c-4.4-7.5-9.7-14.2-15.7-19.9-28.9,27.3-36.4,71.7-15.7,107.6l57.3,99.2c4.4,7.5,9.7,14.2,15.7,19.9,28.9-27.3,36.4-71.7,15.7-107.6l-57.3-99.2Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 859 B |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #db54d9;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #c0d343;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #009e46;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-1" d="M126.3,60.6c-6.9,0-14,0-20.9,0-6.8,0-11.5,3.3-14.9,10.6-5.8,13.3-11.7,26.5-17.6,39.8C49.4,164.2,26.1,217.5,2.2,270.5c-5.9,13,.2,28.6,13.7,28.4h41.6c13.8,0,11.7-3.5,14.9-11.1,15.9-36.2,32-72.4,48-108.6,13.3-30,26.3-60.2,40-90.1,6.7-14.5-1.4-29.8-13.9-28.8-6.8.5-13.5,0-20.2,0h0Z"/>
|
||||
<path class="cls-2" d="M238.2,60.5c-6.9,0-14,0-20.9,0-6.8,0-11.5,3.3-14.9,10.6-5.8,13.3-11.7,26.5-17.6,39.8-23.6,53.2-46.9,106.5-70.8,159.5-5.9,13,.2,28.6,13.7,28.4h41.6c13.8,0,11.7-3.5,14.9-11.1,15.9-36.2,32-72.4,48-108.6,13.3-30,26.3-60.2,40-90.1,6.7-14.5-1.4-29.8-13.9-28.8-6.8.5-13.5,0-20.2,0h0Z"/>
|
||||
<circle class="cls-3" cx="300.2" cy="239.1" r="59.8"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #f48725;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #1797c8;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-2" d="M155.3,1.1C72.9,1.1,6,68,6,150.4s66.9,149.3,149.3,149.3h8.9V1.1h-8.9Z"/>
|
||||
<path class="cls-1" d="M205.7,61.8h-8.9v298.2h8.9c82.4,0,149.3-66.9,149.3-149.3S288.2,61.4,205.7,61.8Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 557 B |
@@ -0,0 +1,30 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #33669a;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3, .cls-4 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #ffd05a;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #f16667;
|
||||
}
|
||||
|
||||
.cls-4 {
|
||||
fill: #319966;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-4" d="M265.6,180v1.3h95.9C361.4,81.2,280.2,0,180.1,0v94.5c47.2,0,85.5,38.3,85.5,85.5Z"/>
|
||||
<path class="cls-3" d="M94.6,180v-1.3H-1.2c0,100.1,81.2,181.3,181.3,181.3v-94.5c-47.2,0-85.5-38.3-85.5-85.5Z"/>
|
||||
<path class="cls-1" d="M180.1,0C80,0-1.2,81.2-1.2,181.3h181.3V0Z"/>
|
||||
<path class="cls-2" d="M180.1,360c100.1,0,181.3-81.2,181.3-181.3h-181.3v181.3h0Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 839 B |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #5896fa;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #734dc6;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #c150a4;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-3" d="M123,.4h224.4c0,60.8-49.5,110.3-110.3,110.3H12.6C12.6,49.9,62.1.4,123,.4Z"/>
|
||||
<path class="cls-2" d="M347.4,249.3H123c-60.8,0-110.3,49.5-110.3,110.3h224.4c60.8,0,110.3-49.5,110.3-110.3h0Z"/>
|
||||
<path class="cls-1" d="M237,124.8H12.6c0,60.8,49.5,110.3,110.3,110.3h224.4c0-60.8-49.5-110.3-110.3-110.3Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 734 B |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #a277ff;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #b6362f;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #0091ac;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path class="cls-3" d="M131.4,56.7c-7.2,0-14.5.1-21.7,0-7-.1-12,3.4-15.4,11-6,13.8-12.1,27.4-18.2,41.2C51.7,163.9,27.4,219.1,2.7,274.1c-6.1,13.5.2,29.6,14.2,29.4,14.4,0,28.8,0,43.1,0s12.1-3.6,15.5-11.5c16.5-37.5,33.2-75,49.8-112.5,13.8-31.1,27.3-62.4,41.4-93.3,6.9-15-1.4-30.9-14.4-29.8-7,.5-14,.1-21,.1h0Z"/>
|
||||
<path class="cls-2" d="M228.6,56.7c7.2,0,14.5.1,21.7,0,7-.1,12,3.4,15.4,11,6,13.8,12.1,27.4,18.2,41.2,24.4,55.1,48.6,110.3,73.3,165.3,6.1,13.5-.2,29.6-14.2,29.4-14.4,0-28.8,0-43.1,0s-12.1-3.6-15.5-11.5c-16.5-37.5-33.2-75-49.8-112.5-13.8-31.1-27.3-62.4-41.4-93.3-6.9-15,1.4-30.9,14.4-29.8,7,.5,14,.1,21,.1h0Z"/>
|
||||
<path class="cls-1" d="M228.8,56.6c-7.2,0-14.5.1-21.7,0-7-.1-12,3.4-15.4,11-6,13.8-12.1,27.4-18.2,41.2-24.4,55.1-48.6,110.3-73.3,165.3-6.1,13.5.2,29.6,14.2,29.4,14.4,0,28.8,0,43.1,0s12.1-3.6,15.5-11.5c16.5-37.5,33.2-75,49.8-112.5,13.8-31.1,27.3-62.4,41.4-93.3,6.9-15-1.4-30.9-14.4-29.8-7,.5-14,.1-21,.1h0Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@@ -0,0 +1,31 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 360 360">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #33669a;
|
||||
}
|
||||
|
||||
.cls-1, .cls-2, .cls-3, .cls-4 {
|
||||
stroke-width: 0px;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #ffd05a;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
fill: #f16667;
|
||||
}
|
||||
|
||||
.cls-4 {
|
||||
fill: #319966;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<rect class="cls-3" x=".2" y="51.2" width="147.8" height="84.5" rx="42.1" ry="42.1"/>
|
||||
<path class="cls-2" d="M105.6,51.2h0c23.4,0,42.4,19.1,42.4,42.7v172.2c0,23.6-19,42.7-42.4,42.7h0c-23.4,0-42.4-19.1-42.4-42.7V93.9c0-23.6,19-42.7,42.4-42.7Z"/>
|
||||
<path class="cls-4" d="M232.7,56.9h0c20.3,11.7,27.2,37.7,15.5,57.9l-105.9,172.7c-11.7,20.3-37.7,27.2-57.9,15.5h0c-20.3-11.7-27.2-37.7-15.5-57.9l105.9-172.7c11.7-20.3,37.7-27.2,57.9-15.5h0Z"/>
|
||||
<path class="cls-1" d="M211.5,51.2h0c23.4,0,42.4,19.1,42.4,42.7v172.2c0,23.6-19,42.7-42.4,42.7h0c-23.4,0-42.4-19.1-42.4-42.7V93.9c0-23.6,19-42.7,42.4-42.7Z"/>
|
||||
<path class="cls-3" d="M338.6,56.9h0c20.3,11.7,27.2,37.7,15.5,57.9l-105.9,172.7c-11.7,20.3-37.7,27.2-57.9,15.5h0c-20.3-11.7-27.2-37.7-15.5-57.9l105.9-172.7c11.7-20.3,37.7-27.2,57.9-15.5Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -101,7 +101,10 @@ html.qr-mobile-page body {
|
||||
}
|
||||
|
||||
.mobile-stats-card {
|
||||
width: calc(66.666667% - 0.5rem);
|
||||
width: max-content;
|
||||
min-width: 9rem;
|
||||
max-width: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@layer components {
|
||||
@@ -161,6 +164,66 @@ html.qr-mobile-page body {
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.mobile-stats-card {
|
||||
width: auto;
|
||||
width: max-content;
|
||||
min-width: 9rem;
|
||||
max-width: none;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ladill app launcher — cap at 5 rows (15 apps), always-visible scroll indicator */
|
||||
.ladill-launcher-apps-wrap {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ladill-launcher-apps {
|
||||
max-height: calc(5 * 5.25rem + 4 * 0.25rem);
|
||||
overflow-y: scroll;
|
||||
overscroll-behavior: contain;
|
||||
scrollbar-gutter: stable;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: rgb(148 163 184) rgb(241 245 249);
|
||||
margin-right: -0.25rem;
|
||||
padding-right: 0.25rem;
|
||||
}
|
||||
|
||||
.ladill-launcher-apps::-webkit-scrollbar {
|
||||
-webkit-appearance: none;
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.ladill-launcher-apps::-webkit-scrollbar-track {
|
||||
background: rgb(241 245 249);
|
||||
border-radius: 9999px;
|
||||
}
|
||||
|
||||
.ladill-launcher-apps::-webkit-scrollbar-thumb {
|
||||
background-color: rgb(148 163 184);
|
||||
border-radius: 9999px;
|
||||
min-height: 2.5rem;
|
||||
border: 2px solid rgb(241 245 249);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
.ladill-launcher-apps::-webkit-scrollbar-thumb:hover {
|
||||
background-color: rgb(100 116 139);
|
||||
}
|
||||
|
||||
.ladill-launcher-scroll-more {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0.125rem;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
height: 1.25rem;
|
||||
width: 1.25rem;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 9999px;
|
||||
background: rgb(255 255 255);
|
||||
color: rgb(100 116 139);
|
||||
box-shadow: 0 1px 2px rgb(15 23 42 / 0.08);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@@ -1,11 +1,14 @@
|
||||
import './bootstrap';
|
||||
|
||||
import { registerLadillConfirmStore, registerLadillModalHelpers } from './ladill-modals';
|
||||
import { registerLadillSearchShortcut } from './ladill-search-shortcut';
|
||||
|
||||
registerLadillModalHelpers();
|
||||
registerLadillSearchShortcut();
|
||||
|
||||
|
||||
import Alpine from 'alpinejs';
|
||||
import { registerLadillClipboard } from './ladill-clipboard';
|
||||
import collapse from '@alpinejs/collapse';
|
||||
import QRCodeStyling from 'qr-code-styling';
|
||||
window.QRCodeStyling = QRCodeStyling;
|
||||
@@ -13,6 +16,7 @@ import qrcode from 'qrcode-generator';
|
||||
window.qrcode = qrcode;
|
||||
|
||||
Alpine.plugin(collapse);
|
||||
registerLadillClipboard(Alpine);
|
||||
|
||||
Alpine.data('notificationDropdown', (config = {}) => ({
|
||||
open: false,
|
||||
@@ -159,6 +163,9 @@ Alpine.data('miniPaymentLanding', (config = {}) => ({
|
||||
errorMsg: config.errorMsg ?? '',
|
||||
showSheet: false,
|
||||
checkoutUrl: '',
|
||||
accessCode: '',
|
||||
publicKey: '',
|
||||
returnUrl: '',
|
||||
paymentSheetStyle: '',
|
||||
sheetBleedStyle: '',
|
||||
|
||||
@@ -211,7 +218,7 @@ Alpine.data('miniPaymentLanding', (config = {}) => ({
|
||||
}
|
||||
|
||||
this.errorMsg = '';
|
||||
this.loading = true;
|
||||
this.loading = true; window.LadillPayCheckout?.prepare?.();
|
||||
|
||||
try {
|
||||
const res = await fetch(config.payUrl, {
|
||||
@@ -235,15 +242,13 @@ Alpine.data('miniPaymentLanding', (config = {}) => ({
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
if (window.innerWidth < 768) {
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.accessCode = data.access_code || '';
|
||||
this.publicKey = data.public_key || '';
|
||||
this.returnUrl = data.callback_url || '';
|
||||
this.showSheet = true;
|
||||
this.loading = false;
|
||||
} else {
|
||||
window.location.href = data.checkout_url;
|
||||
}
|
||||
} catch (e) {
|
||||
this.errorMsg = 'Network error. Please try again.';
|
||||
window.LadillPayCheckout?.cancel?.(); this.errorMsg = 'Network error. Please try again.';
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
@@ -300,6 +305,26 @@ Alpine.data('topbarSearch', (config = {}) => ({
|
||||
},
|
||||
}));
|
||||
|
||||
|
||||
// Wallet balance peek for the avatar dropdown.
|
||||
Alpine.data('walletWidget', (config = {}) => ({
|
||||
display: '…',
|
||||
async load() {
|
||||
if (! config.url) {
|
||||
this.display = 'View wallet';
|
||||
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const res = await fetch(config.url, { headers: { Accept: 'application/json', 'X-Requested-With': 'XMLHttpRequest' } });
|
||||
const data = await res.json();
|
||||
this.display = data.available ? data.formatted : 'View wallet';
|
||||
} catch (e) {
|
||||
this.display = 'View wallet';
|
||||
}
|
||||
},
|
||||
}));
|
||||
|
||||
window.Alpine = Alpine;
|
||||
registerLadillConfirmStore(Alpine);
|
||||
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
const COPY_FEEDBACK_MS = 2000;
|
||||
|
||||
export async function writeClipboardText(text) {
|
||||
const value = String(text ?? '');
|
||||
if (!value) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
if (navigator.clipboard?.writeText) {
|
||||
await navigator.clipboard.writeText(value);
|
||||
|
||||
return true;
|
||||
}
|
||||
} catch {
|
||||
// fall through to legacy copy
|
||||
}
|
||||
|
||||
try {
|
||||
const textarea = document.createElement('textarea');
|
||||
textarea.value = value;
|
||||
textarea.style.position = 'fixed';
|
||||
textarea.style.opacity = '0';
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
const ok = document.execCommand('copy');
|
||||
document.body.removeChild(textarea);
|
||||
|
||||
return ok;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
export function registerLadillClipboard(Alpine) {
|
||||
Alpine.data('copyButton', (text = '') => ({
|
||||
copied: false,
|
||||
text: text ?? '',
|
||||
resetTimer: null,
|
||||
async copy() {
|
||||
const ok = await writeClipboardText(this.text);
|
||||
if (!ok) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.copied = true;
|
||||
|
||||
if (this.resetTimer) {
|
||||
clearTimeout(this.resetTimer);
|
||||
}
|
||||
|
||||
this.resetTimer = setTimeout(() => {
|
||||
this.copied = false;
|
||||
}, COPY_FEEDBACK_MS);
|
||||
},
|
||||
}));
|
||||
}
|
||||
@@ -0,0 +1,97 @@
|
||||
function isEditableTarget(element) {
|
||||
if (!(element instanceof HTMLElement)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const tag = element.tagName;
|
||||
|
||||
if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') {
|
||||
return true;
|
||||
}
|
||||
|
||||
return element.isContentEditable;
|
||||
}
|
||||
|
||||
function isVisibleInput(input) {
|
||||
if (!(input instanceof HTMLElement)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const style = window.getComputedStyle(input);
|
||||
|
||||
return style.display !== 'none'
|
||||
&& style.visibility !== 'hidden'
|
||||
&& style.opacity !== '0';
|
||||
}
|
||||
|
||||
function findSearchInput() {
|
||||
const marked = [...document.querySelectorAll('[data-ladill-search-input]')];
|
||||
const visibleMarked = marked.find(isVisibleInput);
|
||||
|
||||
if (visibleMarked) {
|
||||
return visibleMarked;
|
||||
}
|
||||
|
||||
if (marked.length > 0) {
|
||||
return marked[0];
|
||||
}
|
||||
|
||||
return document.querySelector('[x-data*="topbarSearch"] input');
|
||||
}
|
||||
|
||||
function focusSearchInput() {
|
||||
const input = findSearchInput();
|
||||
|
||||
if (!input) {
|
||||
const fallbackUrl = document.body?.dataset?.ladillSearchUrl;
|
||||
|
||||
if (fallbackUrl) {
|
||||
window.location.href = fallbackUrl;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!isVisibleInput(input)) {
|
||||
const fallbackUrl = document.body?.dataset?.ladillSearchUrl;
|
||||
|
||||
if (fallbackUrl) {
|
||||
window.location.href = fallbackUrl;
|
||||
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
input.focus();
|
||||
|
||||
if (input instanceof HTMLInputElement && (input.type === 'text' || input.type === 'search')) {
|
||||
input.select();
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
export function registerLadillSearchShortcut() {
|
||||
if (window.__ladillSearchShortcutRegistered) {
|
||||
return;
|
||||
}
|
||||
|
||||
window.__ladillSearchShortcutRegistered = true;
|
||||
|
||||
document.addEventListener('keydown', (event) => {
|
||||
if (event.key !== '/' && event.code !== 'Slash') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.ctrlKey || event.metaKey || event.altKey) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (isEditableTarget(document.activeElement)) {
|
||||
return;
|
||||
}
|
||||
|
||||
event.preventDefault();
|
||||
focusSearchInput();
|
||||
});
|
||||
}
|
||||
@@ -1,17 +1,33 @@
|
||||
@props([
|
||||
'href' => null,
|
||||
'type' => 'button',
|
||||
'label' => null,
|
||||
])
|
||||
|
||||
@php
|
||||
$tag = $href ? 'a' : 'button';
|
||||
$ariaLabel = $label ?? trim(preg_replace('/\s+/', ' ', strip_tags((string) $slot)));
|
||||
@endphp
|
||||
|
||||
<{{ $tag }}
|
||||
@if ($href) href="{{ $href }}" @endif
|
||||
@if ($tag === 'button') type="{{ $type }}" @endif
|
||||
{{ $attributes->class(['btn-primary']) }}
|
||||
aria-label="{{ $ariaLabel }}"
|
||||
title="{{ $ariaLabel }}"
|
||||
{{ $attributes->class(['btn-fab h-10 w-10 lg:hidden']) }}
|
||||
>
|
||||
<svg class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
<svg class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/>
|
||||
</svg>
|
||||
</{{ $tag }}>
|
||||
|
||||
<{{ $tag }}
|
||||
@if ($href) href="{{ $href }}" @endif
|
||||
@if ($tag === 'button') type="{{ $type }}" @endif
|
||||
{{ $attributes->class(['btn-primary hidden lg:inline-flex']) }}
|
||||
>
|
||||
<svg class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/>
|
||||
</svg>
|
||||
{{ $slot }}
|
||||
</{{ $tag }}>
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
@props([
|
||||
'text' => '',
|
||||
'label' => 'Copy',
|
||||
'copiedLabel' => 'Copied!',
|
||||
'icon' => false,
|
||||
'copiedClass' => '',
|
||||
])
|
||||
|
||||
<button
|
||||
type="button"
|
||||
x-data="copyButton(@js($text))"
|
||||
@click="copy()"
|
||||
:title="copied ? @js($copiedLabel) : @js($icon ? 'Copy' : $label)"
|
||||
:class="copied ? @js($copiedClass) : ''"
|
||||
{{ $attributes->class($icon ? 'inline-flex shrink-0 items-center justify-center' : '') }}
|
||||
>
|
||||
@if ($icon)
|
||||
<svg x-show="!copied" class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"/>
|
||||
</svg>
|
||||
<svg x-show="copied" x-cloak class="h-4 w-4 text-emerald-600" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"/>
|
||||
</svg>
|
||||
@elseif ($slot->isNotEmpty())
|
||||
{{ $slot }}
|
||||
@else
|
||||
<span x-text="copied ? @js($copiedLabel) : @js($label)"></span>
|
||||
@endif
|
||||
</button>
|
||||
@@ -36,10 +36,10 @@
|
||||
loading: false,
|
||||
errorMsg: '',
|
||||
async submitTopup(event) {
|
||||
if (this.method !== 'paystack' || window.innerWidth >= 768) return;
|
||||
if (this.method !== 'paystack') return;
|
||||
|
||||
event.preventDefault();
|
||||
this.loading = true;
|
||||
this.loading = true; window.LadillPayCheckout?.prepare?.();
|
||||
this.errorMsg = '';
|
||||
|
||||
try {
|
||||
@@ -56,10 +56,12 @@
|
||||
}
|
||||
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.showSheet = true;
|
||||
this.loading = false;
|
||||
this.accessCode = data.access_code || '';
|
||||
this.publicKey = data.public_key || '';
|
||||
this.returnUrl = data.callback_url || '';
|
||||
this.showSheet = true; // loading cleared when payment UI opens (ladill-pay-opened)
|
||||
} catch (error) {
|
||||
this.errorMsg = 'Network error. Please try again.';
|
||||
window.LadillPayCheckout?.cancel?.(); this.errorMsg = 'Network error. Please try again.';
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
|
||||
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
||||
</head>
|
||||
<body class="h-full font-sans antialiased bg-slate-100" x-data="{ sidebarOpen: false }">
|
||||
<body class="h-full font-sans antialiased bg-slate-100" x-data="{ sidebarOpen: false }" data-ladill-search-url="{{ route('merchant.search') }}">
|
||||
<div class="min-h-screen max-lg:min-h-dvh">
|
||||
<div x-show="sidebarOpen" x-cloak class="fixed inset-0 z-30 bg-black/50 lg:hidden" @click="sidebarOpen = false"></div>
|
||||
<aside x-cloak class="fixed inset-y-0 left-0 z-40 w-64 transform transition-transform lg:translate-x-0"
|
||||
@@ -45,11 +45,7 @@
|
||||
'profileActive' => false,
|
||||
'profileName' => $navUser?->name ?? '',
|
||||
'profileSubtitle' => $navUser?->email ?? '',
|
||||
'profileMenuItems' => [
|
||||
['type' => 'link', 'label' => 'Profile', 'href' => $navAcct.'/profile'],
|
||||
['type' => 'link', 'label' => 'Account Settings', 'href' => $navAcct.'/account-settings'],
|
||||
['type' => 'logout', 'label' => 'Logout', 'action' => route('logout')],
|
||||
],
|
||||
'profileMenuItems' => \App\Support\UserProfileMenu::items($navUser),
|
||||
'avatarUrl' => $navUser?->avatar_url,
|
||||
'initials' => $navInitials !== '' ? $navInitials : 'U',
|
||||
])
|
||||
|
||||
@@ -73,12 +73,7 @@
|
||||
'profileActive' => request()->routeIs('account.settings'),
|
||||
'profileName' => $navUser?->name ?? '',
|
||||
'profileSubtitle' => $navUser?->email ?? '',
|
||||
'profileMenuItems' => [
|
||||
['type' => 'link', 'label' => 'Settings', 'href' => route('account.settings')],
|
||||
['type' => 'link', 'label' => 'Account Settings', 'href' => ladill_account_url('account-settings')],
|
||||
['type' => 'link', 'label' => 'Overview', 'href' => route('merchant.dashboard')],
|
||||
['type' => 'logout', 'label' => 'Logout', 'action' => route('logout')],
|
||||
],
|
||||
'profileMenuItems' => \App\Support\UserProfileMenu::items($navUser),
|
||||
'avatarUrl' => $navUser?->avatarUrl(),
|
||||
'initials' => $navInitials !== '' ? $navInitials : 'U',
|
||||
])
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<h1 class="text-xl font-semibold text-slate-900">Payouts</h1>
|
||||
<p class="mt-1 text-sm text-slate-500">Orders settle into your Ladill wallet (9% fee), then withdraw to bank or MoMo.</p>
|
||||
<p class="mt-1 text-sm text-slate-500">Orders settle into your Ladill wallet (5.5% fee), then withdraw to bank or MoMo.</p>
|
||||
</div>
|
||||
<div class="grid gap-4 sm:grid-cols-2">
|
||||
<div class="rounded-2xl border border-slate-200 bg-white p-5">
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
@php
|
||||
/** @var array<string,mixed> $product */
|
||||
$product = $product ?? [];
|
||||
$priceValue = old('unit_price', isset($product['unit_price_minor']) ? number_format(((int) $product['unit_price_minor']) / 100, 2, '.', '') : '');
|
||||
@endphp
|
||||
|
||||
@if($errors->any())
|
||||
<div class="rounded-xl border border-red-100 bg-red-50 px-4 py-3 text-sm text-red-700">
|
||||
<ul class="list-inside list-disc space-y-0.5">
|
||||
@foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="space-y-5 rounded-2xl border border-slate-200 bg-white p-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Product name</label>
|
||||
<input type="text" name="name" value="{{ old('name', $product['name'] ?? '') }}" required maxlength="255"
|
||||
placeholder="e.g. Cotton T-shirt"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">SKU <span class="font-normal text-slate-400">(optional)</span></label>
|
||||
<input type="text" name="sku" value="{{ old('sku', $product['sku'] ?? '') }}" maxlength="80"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Currency</label>
|
||||
<select name="currency" class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
@foreach(['GHS', 'USD', 'NGN', 'KES'] as $code)
|
||||
<option value="{{ $code }}" @selected(old('currency', $product['currency'] ?? config('crm.default_currency', 'GHS')) === $code)>{{ $code }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Unit price</label>
|
||||
<input type="number" name="unit_price" value="{{ $priceValue }}" min="0" step="0.01" placeholder="0.00"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Tax rate % <span class="font-normal text-slate-400">(optional)</span></label>
|
||||
<input type="number" name="tax_rate" value="{{ old('tax_rate', $product['tax_rate'] ?? '') }}" min="0" max="100" step="0.01" placeholder="0"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Description <span class="font-normal text-slate-400">(optional)</span></label>
|
||||
<textarea name="description" rows="3" maxlength="5000"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">{{ old('description', $product['description'] ?? '') }}</textarea>
|
||||
</div>
|
||||
|
||||
<label class="flex items-center gap-2 text-sm text-slate-600">
|
||||
<input type="hidden" name="active" value="0">
|
||||
<input type="checkbox" name="active" value="1" @checked(old('active', $product['active'] ?? true)) class="rounded border-slate-300 text-indigo-600">
|
||||
Active (available to add to storefronts)
|
||||
</label>
|
||||
</div>
|
||||
@@ -0,0 +1,19 @@
|
||||
<x-user-layout>
|
||||
<x-slot name="title">New product</x-slot>
|
||||
<div class="mx-auto max-w-2xl space-y-6">
|
||||
<div>
|
||||
<a href="{{ route('merchant.products.index') }}" class="inline-flex items-center gap-1 text-sm text-slate-500 hover:text-slate-700">
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5"/></svg>
|
||||
All products
|
||||
</a>
|
||||
<h1 class="mt-2 text-xl font-semibold text-slate-900">New product</h1>
|
||||
<p class="mt-1 text-sm text-slate-500">Added to your Ladill CRM catalog and available on every storefront.</p>
|
||||
</div>
|
||||
|
||||
<form method="post" action="{{ route('merchant.products.store') }}" class="space-y-5">
|
||||
@csrf
|
||||
@include('merchant.products._form', ['product' => []])
|
||||
<button type="submit" class="btn-primary w-full">Create product</button>
|
||||
</form>
|
||||
</div>
|
||||
</x-user-layout>
|
||||
@@ -0,0 +1,20 @@
|
||||
<x-user-layout>
|
||||
<x-slot name="title">Edit product</x-slot>
|
||||
<div class="mx-auto max-w-2xl space-y-6">
|
||||
<div>
|
||||
<a href="{{ route('merchant.products.index') }}" class="inline-flex items-center gap-1 text-sm text-slate-500 hover:text-slate-700">
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5"/></svg>
|
||||
All products
|
||||
</a>
|
||||
<h1 class="mt-2 text-xl font-semibold text-slate-900">Edit product</h1>
|
||||
<p class="mt-1 text-sm text-slate-500">Changes sync to your Ladill CRM catalog.</p>
|
||||
</div>
|
||||
|
||||
<form method="post" action="{{ route('merchant.products.update', $product['id']) }}" class="space-y-5">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
@include('merchant.products._form', ['product' => $product])
|
||||
<button type="submit" class="btn-primary w-full">Save changes</button>
|
||||
</form>
|
||||
</div>
|
||||
</x-user-layout>
|
||||
@@ -0,0 +1,114 @@
|
||||
<x-user-layout>
|
||||
<x-slot name="title">Products</x-slot>
|
||||
|
||||
<div class="space-y-6">
|
||||
@foreach(['success', 'error'] as $flash)
|
||||
@if(session($flash))
|
||||
<div class="rounded-lg border px-4 py-3 {{ $flash === 'success' ? 'border-emerald-200 bg-emerald-50 text-emerald-700' : 'border-red-200 bg-red-50 text-red-700' }}">
|
||||
<p class="text-sm">{{ session($flash) }}</p>
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
<div class="relative overflow-hidden rounded-2xl border border-slate-200 bg-white">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-violet-50/80 via-white to-indigo-50/60"></div>
|
||||
<div class="relative px-6 py-8 sm:px-10">
|
||||
<div class="flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div class="max-w-xl">
|
||||
<div class="inline-flex items-center gap-1.5 rounded-full bg-violet-100 px-3 py-1 text-xs font-semibold text-violet-700">
|
||||
Catalog · Pricing · Inventory-ready
|
||||
</div>
|
||||
<h1 class="mt-3 text-2xl font-bold tracking-tight text-slate-900 sm:text-3xl">Your products</h1>
|
||||
<p class="mt-2 text-sm leading-6 text-slate-600">
|
||||
Manage your product catalog in Ladill CRM and use items across any storefront.
|
||||
</p>
|
||||
<div class="mt-6">
|
||||
<a href="{{ route('merchant.products.create') }}" class="btn-primary">
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
New product
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="scrollbar-hide flex snap-x snap-mandatory gap-3 overflow-x-auto pb-2 sm:flex sm:flex-wrap sm:justify-end sm:overflow-visible sm:pb-0 lg:gap-4" style="-ms-overflow-style:none;scrollbar-width:none;">
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">GHS {{ number_format($wallet->spendableBalance(), 2) }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Account balance</p>
|
||||
</div>
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">{{ number_format($productCount) }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Products</p>
|
||||
</div>
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">{{ number_format($activeCount) }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Active</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-slate-200 bg-white overflow-hidden">
|
||||
<div class="flex flex-col gap-3 border-b border-slate-100 px-6 py-4 sm:flex-row sm:items-center sm:justify-between">
|
||||
<h2 class="text-sm font-semibold text-slate-900">Your products</h2>
|
||||
<form method="get" class="flex w-full max-w-sm items-center gap-2 sm:w-auto">
|
||||
<input type="search" name="search" value="{{ $search }}" placeholder="Search products…"
|
||||
class="w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<button class="shrink-0 rounded-xl border border-slate-200 px-3 py-2 text-sm font-medium text-slate-600 hover:bg-slate-50">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@if(empty($products))
|
||||
<p class="px-6 py-10 text-center text-sm text-slate-500">
|
||||
{{ $search !== '' ? 'No products match your search.' : 'No products yet. Add your first product to get started.' }}
|
||||
</p>
|
||||
@else
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full divide-y divide-slate-100 text-sm">
|
||||
<thead class="bg-slate-50 text-left text-xs font-semibold uppercase tracking-wide text-slate-500">
|
||||
<tr>
|
||||
<th class="px-4 py-3">Product</th>
|
||||
<th class="px-4 py-3">SKU</th>
|
||||
<th class="px-4 py-3 text-right">Price</th>
|
||||
<th class="px-4 py-3">Status</th>
|
||||
<th class="px-4 py-3"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-slate-100">
|
||||
@foreach($products as $p)
|
||||
<tr class="hover:bg-slate-50/60">
|
||||
<td class="px-4 py-3">
|
||||
<p class="font-medium text-slate-900">{{ $p['name'] ?? '—' }}</p>
|
||||
@if(!empty($p['description']))
|
||||
<p class="mt-0.5 truncate text-xs text-slate-400">{{ \Illuminate\Support\Str::limit($p['description'], 60) }}</p>
|
||||
@endif
|
||||
</td>
|
||||
<td class="px-4 py-3 text-slate-500">{{ $p['sku'] ?: '—' }}</td>
|
||||
<td class="px-4 py-3 text-right font-medium text-slate-900">
|
||||
{{ strtoupper($p['currency'] ?? 'GHS') }} {{ number_format(((int) ($p['unit_price_minor'] ?? 0)) / 100, 2) }}
|
||||
</td>
|
||||
<td class="px-4 py-3">
|
||||
<span class="inline-flex rounded-full px-2 py-0.5 text-xs font-medium {{ ($p['active'] ?? true) ? 'bg-emerald-50 text-emerald-700' : 'bg-slate-100 text-slate-500' }}">
|
||||
{{ ($p['active'] ?? true) ? 'Active' : 'Inactive' }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="px-4 py-3 text-right">
|
||||
<div class="flex items-center justify-end gap-3">
|
||||
<a href="{{ route('merchant.products.edit', $p['id']) }}" class="text-sm font-medium text-indigo-600 hover:text-indigo-800">Edit</a>
|
||||
<form method="post" action="{{ route('merchant.products.destroy', $p['id']) }}"
|
||||
onsubmit="return confirm('Delete this product?');">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button class="text-sm font-medium text-red-500 hover:text-red-700">Delete</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</x-user-layout>
|
||||
@@ -56,6 +56,14 @@
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-slate-200 bg-white p-5 space-y-4">
|
||||
<div>
|
||||
<h2 class="text-sm font-semibold text-slate-900">Customer payment engine</h2>
|
||||
<p class="mt-1 text-xs text-slate-500">All customer checkouts use Ladill Pay — zero-config, no owner API keys.</p>
|
||||
</div>
|
||||
<p class="rounded-lg bg-emerald-50 px-3 py-2 text-sm text-emerald-800">Ladill Pay is the only payment option. Standard platform fees apply on paid orders and settle to your Ladill wallet.</p>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn-primary">
|
||||
Save settings
|
||||
</button>
|
||||
|
||||
@@ -1,6 +1,17 @@
|
||||
<x-user-layout>
|
||||
<x-slot name="title">Create storefront</x-slot>
|
||||
@php $createType = old('type', $requestedType ?? \App\Models\QrCode::TYPE_SHOP); @endphp
|
||||
@php
|
||||
$prefill = $prefill ?? [];
|
||||
$createType = old('type', $prefill['type'] ?? $requestedType ?? \App\Models\QrCode::TYPE_SHOP);
|
||||
$prefillContent = [];
|
||||
if (!empty($prefill)) {
|
||||
$prefillContent = array_filter([
|
||||
'title' => $prefill['shop_title'] ?? null,
|
||||
'sections' => $prefill['sections'] ?? null,
|
||||
'accepts_payment' => $prefill['accepts_payment'] ?? true,
|
||||
], fn ($v) => $v !== null);
|
||||
}
|
||||
@endphp
|
||||
|
||||
<div class="mx-auto max-w-2xl space-y-6" x-data="{ type: @js($createType) }">
|
||||
<div>
|
||||
@@ -12,6 +23,12 @@
|
||||
<p class="mt-1 text-sm text-slate-500">Pick what you're selling, then add your products, menu, or bookable services.</p>
|
||||
</div>
|
||||
|
||||
@if(!empty($prefill))
|
||||
<div class="rounded-xl border border-indigo-200 bg-indigo-50 px-4 py-3 text-sm text-indigo-900">
|
||||
Prefilled from Ladill CRM. Review products and payment settings, then create your storefront.
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if(session('error'))
|
||||
<div class="rounded-xl border border-red-100 bg-red-50 px-4 py-3 text-sm text-red-700">{{ session('error') }}</div>
|
||||
@endif
|
||||
@@ -43,13 +60,13 @@
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Dashboard label</label>
|
||||
<input type="text" name="label" value="{{ old('label') }}" required maxlength="120"
|
||||
<input type="text" name="label" value="{{ old('label', $prefill['label'] ?? '') }}" required maxlength="120"
|
||||
placeholder="e.g. Main shop"
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<p class="mt-1 text-xs text-slate-400">Private name to find this storefront in your dashboard.</p>
|
||||
</div>
|
||||
|
||||
@include('merchant.storefronts.partials.editor-fields', ['content' => []])
|
||||
@include('merchant.storefronts.partials.editor-fields', ['content' => $prefillContent ?? [], 'catalog' => $catalog ?? []])
|
||||
|
||||
<button type="submit" class="btn-primary w-full">Create storefront</button>
|
||||
</form>
|
||||
|
||||
@@ -1,35 +1,89 @@
|
||||
<x-user-layout>
|
||||
<x-slot name="title">Storefronts</x-slot>
|
||||
<div class="space-y-6">
|
||||
<div class="flex flex-wrap items-center justify-between gap-3">
|
||||
<div>
|
||||
<h1 class="text-xl font-semibold text-slate-900">Storefronts</h1>
|
||||
<p class="mt-1 text-sm text-slate-500">Shop, menu & booking QR storefronts with online checkout.</p>
|
||||
</div>
|
||||
<x-btn.create :href="route('merchant.storefronts.create', ['type' => 'shop'])">New storefront</x-btn.create>
|
||||
</div>
|
||||
@if($qrCodes->isEmpty())
|
||||
<div class="rounded-2xl border border-dashed border-slate-200 bg-white px-6 py-12 text-center">
|
||||
<p class="text-sm text-slate-500">No storefronts yet.</p>
|
||||
<a href="{{ route('merchant.storefronts.create', ['type' => 'shop']) }}" class="mt-3 inline-block text-sm font-semibold text-indigo-600 hover:text-indigo-800">Create your first storefront</a>
|
||||
</div>
|
||||
@else
|
||||
<div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-3">
|
||||
@foreach($qrCodes as $qr)
|
||||
<a href="{{ route('merchant.storefronts.show', $qr) }}" class="rounded-2xl border border-slate-200 bg-white p-5 transition hover:border-indigo-200 hover:shadow-sm">
|
||||
<div class="flex items-start gap-4">
|
||||
@if(!empty($previewDataUris[$qr->id]))
|
||||
<img src="{{ $previewDataUris[$qr->id] }}" alt="" class="h-16 w-16 rounded-lg border border-slate-100 bg-white p-1">
|
||||
@endif
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="truncate font-semibold text-slate-900">{{ $qr->label }}</p>
|
||||
<p class="mt-0.5 truncate text-sm text-slate-500">{{ $qr->content()['name'] ?? 'Organisation' }}</p>
|
||||
<p class="mt-2 text-xs text-slate-400">{{ $qr->is_active ? 'Active' : 'Inactive' }} · /q/{{ $qr->short_code }}</p>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6"
|
||||
x-data="balanceGate({
|
||||
balance: @js((float) $wallet->spendableBalance()),
|
||||
price: @js((float) $pricePerQr),
|
||||
topupUrl: @js($topupUrl),
|
||||
href: @js(route('merchant.storefronts.create', ['type' => 'shop'])),
|
||||
})">
|
||||
@foreach(['success', 'error'] as $flash)
|
||||
@if(session($flash))
|
||||
<div class="rounded-lg border px-4 py-3 {{ $flash === 'success' ? 'border-emerald-200 bg-emerald-50 text-emerald-700' : 'border-red-200 bg-red-50 text-red-700' }}">
|
||||
<p class="text-sm">{{ session($flash) }}</p>
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
<div class="relative overflow-hidden rounded-2xl border border-slate-200 bg-white">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-violet-50/80 via-white to-indigo-50/60"></div>
|
||||
<div class="relative px-6 py-8 sm:px-10">
|
||||
<div class="flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div class="max-w-xl">
|
||||
<div class="inline-flex items-center gap-1.5 rounded-full bg-violet-100 px-3 py-1 text-xs font-semibold text-violet-700">
|
||||
Shop · Menu · Booking · Online checkout
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
<h1 class="mt-3 text-2xl font-bold tracking-tight text-slate-900 sm:text-3xl">Your storefronts</h1>
|
||||
<p class="mt-2 text-sm leading-6 text-slate-600">
|
||||
Create QR storefronts for shops, menus, and bookings. Share a Ladill Link and take orders online.
|
||||
</p>
|
||||
<div class="mt-6">
|
||||
<button type="button"
|
||||
@click="goOrTopup($event)"
|
||||
class="btn-primary">
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
New storefront
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="scrollbar-hide flex snap-x snap-mandatory gap-3 overflow-x-auto pb-2 sm:flex sm:flex-wrap sm:justify-end sm:overflow-visible sm:pb-0 lg:gap-4" style="-ms-overflow-style:none;scrollbar-width:none;">
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">GHS {{ number_format($wallet->spendableBalance(), 2) }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Account balance</p>
|
||||
</div>
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">{{ $qrCodes->count() }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Storefronts</p>
|
||||
</div>
|
||||
<div class="mobile-stats-card w-max min-w-[9rem] shrink-0 snap-start rounded-xl border border-slate-200 bg-white/90 px-4 py-3 text-center backdrop-blur-sm">
|
||||
<p class="whitespace-nowrap text-xl font-bold text-slate-900 sm:text-2xl">{{ number_format($activeCount) }}</p>
|
||||
<p class="mt-0.5 whitespace-nowrap text-[11px] font-medium text-slate-500">Active</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-slate-200 bg-white overflow-hidden">
|
||||
<div class="border-b border-slate-100 px-6 py-4">
|
||||
<h2 class="text-sm font-semibold text-slate-900">Your storefronts</h2>
|
||||
</div>
|
||||
@if($qrCodes->isEmpty())
|
||||
<p class="px-6 py-10 text-center text-sm text-slate-500">No storefronts yet. Create your first storefront to get started.</p>
|
||||
@else
|
||||
<div class="grid gap-4 p-6 sm:grid-cols-2 xl:grid-cols-3">
|
||||
@foreach($qrCodes as $qr)
|
||||
<a href="{{ route('merchant.storefronts.show', $qr) }}" class="rounded-2xl border border-slate-200 bg-white p-5 transition hover:border-indigo-200 hover:shadow-sm">
|
||||
<div class="flex items-start gap-4">
|
||||
@if(!empty($previewDataUris[$qr->id]))
|
||||
<img src="{{ $previewDataUris[$qr->id] }}" alt="" class="h-16 w-16 rounded-lg border border-slate-100 bg-white p-1">
|
||||
@else
|
||||
<div class="flex h-16 w-16 shrink-0 items-center justify-center rounded-lg {{ $qr->is_active ? 'bg-violet-100' : 'bg-slate-100 opacity-50' }}">
|
||||
<img src="{{ asset('images/ladill-icons/storefront.svg') }}?v={{ @filemtime(public_path('images/ladill-icons/storefront.svg')) ?: '1' }}" alt="" class="h-8 w-8 object-contain" width="32" height="32">
|
||||
</div>
|
||||
@endif
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="truncate font-semibold text-slate-900">{{ $qr->label }}</p>
|
||||
<p class="mt-0.5 truncate text-sm text-slate-500">{{ $qr->content()['name'] ?? 'Organisation' }}</p>
|
||||
<p class="mt-2 truncate text-xs text-slate-400">{{ $qr->is_active ? 'Active' : 'Inactive' }} · {{ $qr->publicUrl() }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</x-user-layout>
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
@php
|
||||
/** @var array<string,mixed> $content */
|
||||
$content = $content ?? [];
|
||||
/** @var array<int,array{name:string,price:string,currency:string,description:string}> $catalog */
|
||||
$catalog = $catalog ?? [];
|
||||
$defaultSections = [['name' => 'Products', 'items' => [['name' => '', 'description' => '', 'price' => '', 'image_path' => '']]]];
|
||||
$seedSections = old('sections', ! empty($content['sections']) ? $content['sections'] : $defaultSections);
|
||||
$seedServices = old('services', ! empty($content['services'])
|
||||
@@ -117,7 +119,9 @@
|
||||
<template x-if="type === 'menu'">
|
||||
<div x-data="{
|
||||
sections: @js($seedSections),
|
||||
catalog: @js($catalog),
|
||||
addItem(sIdx) { this.sections[sIdx].items.push({ name: '', description: '', price: '', image_path: '' }) },
|
||||
addFromCatalog(sIdx, p) { if (p) this.sections[sIdx].items.push({ name: p.name, description: p.description || '', price: p.price, image_path: '' }) },
|
||||
removeItem(sIdx, iIdx) { this.sections[sIdx].items.splice(iIdx, 1) },
|
||||
removeSection(sIdx) { this.sections.splice(sIdx, 1) },
|
||||
addSection() { this.sections.push({ name: 'New Section', items: [{ name: '', description: '', price: '', image_path: '' }] }) },
|
||||
@@ -182,10 +186,19 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<button type="button" @click="addItem(sIdx)" class="inline-flex items-center gap-1 text-xs font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
Add item
|
||||
</button>
|
||||
<div class="flex flex-wrap items-center gap-3">
|
||||
<button type="button" @click="addItem(sIdx)" class="inline-flex items-center gap-1 text-xs font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
Add item
|
||||
</button>
|
||||
<select x-show="catalog.length" @change="addFromCatalog(sIdx, catalog[$event.target.value]); $event.target.value = ''"
|
||||
class="rounded-lg border border-slate-200 bg-white px-2.5 py-1.5 text-xs font-medium text-slate-600 focus:border-indigo-400 focus:outline-none">
|
||||
<option value="">+ Add from products…</option>
|
||||
<template x-for="(p, pIdx) in catalog" :key="pIdx">
|
||||
<option :value="pIdx" x-text="p.name + ' — ' + p.currency + ' ' + p.price"></option>
|
||||
</template>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -200,7 +213,9 @@
|
||||
<template x-if="type === 'shop'">
|
||||
<div x-data="{
|
||||
sections: @js($seedSections),
|
||||
catalog: @js($catalog),
|
||||
addItem(sIdx) { this.sections[sIdx].items.push({ name: '', description: '', price: '', image_path: '' }) },
|
||||
addFromCatalog(sIdx, p) { if (p) this.sections[sIdx].items.push({ name: p.name, description: p.description || '', price: p.price, image_path: '' }) },
|
||||
removeItem(sIdx, iIdx) { this.sections[sIdx].items.splice(iIdx, 1) },
|
||||
removeSection(sIdx) { this.sections.splice(sIdx, 1) },
|
||||
addSection() { this.sections.push({ name: 'New Category', items: [{ name: '', description: '', price: '', image_path: '' }] }) },
|
||||
@@ -272,10 +287,19 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<button type="button" @click="addItem(sIdx)" class="inline-flex items-center gap-1 text-xs font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
Add product
|
||||
</button>
|
||||
<div class="flex flex-wrap items-center gap-3">
|
||||
<button type="button" @click="addItem(sIdx)" class="inline-flex items-center gap-1 text-xs font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/></svg>
|
||||
Add product
|
||||
</button>
|
||||
<select x-show="catalog.length" @change="addFromCatalog(sIdx, catalog[$event.target.value]); $event.target.value = ''"
|
||||
class="rounded-lg border border-slate-200 bg-white px-2.5 py-1.5 text-xs font-medium text-slate-600 focus:border-indigo-400 focus:outline-none">
|
||||
<option value="">+ Add from products…</option>
|
||||
<template x-for="(p, pIdx) in catalog" :key="pIdx">
|
||||
<option :value="pIdx" x-text="p.name + ' — ' + p.currency + ' ' + p.price"></option>
|
||||
</template>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<x-slot name="title">{{ $qrCode->label }}</x-slot>
|
||||
@php
|
||||
$content = $qrCode->content();
|
||||
$publicUrl = route('qr.public.resolve', ['shortCode' => $qrCode->short_code]);
|
||||
$publicUrl = \App\Support\LadillLink::url($qrCode->short_code);
|
||||
$typeLabel = \App\Support\Qr\QrTypeCatalog::label($qrCode->type);
|
||||
@endphp
|
||||
|
||||
@@ -94,6 +94,52 @@
|
||||
</script>
|
||||
@endonce
|
||||
|
||||
@if(!empty($customDomainsEnabled))
|
||||
<div class="rounded-2xl border border-slate-200 bg-white p-5">
|
||||
<h3 class="text-sm font-semibold text-slate-900">Custom domain</h3>
|
||||
<p class="mt-1 text-xs text-slate-500">Serve this storefront on your own domain with automatic SSL. Optional — your <span class="break-all">{{ $publicUrl }}</span> link always works.</p>
|
||||
|
||||
@forelse($customDomains as $cd)
|
||||
<div class="mt-3 rounded-xl border border-slate-200 p-3">
|
||||
<div class="flex items-center justify-between gap-2">
|
||||
<span class="break-all text-sm font-medium text-slate-900">{{ $cd->host }}</span>
|
||||
@php $live = $cd->status === 'active' && $cd->ssl_status === 'active'; @endphp
|
||||
<span class="shrink-0 rounded-full px-2 py-0.5 text-[11px] font-medium {{ $live ? 'bg-emerald-50 text-emerald-700' : ($cd->status === 'failed' ? 'bg-red-50 text-red-700' : 'bg-amber-50 text-amber-700') }}">
|
||||
{{ $live ? 'Live (SSL)' : ($cd->status === 'failed' ? 'Failed' : 'Pending') }}
|
||||
</span>
|
||||
</div>
|
||||
@unless($live)
|
||||
<p class="mt-2 text-xs text-slate-500">Point an <strong>A record</strong> for <strong>{{ $cd->host }}</strong>@if($cd->include_www) and <strong>www.{{ $cd->host }}</strong>@endif to <strong>{{ $customDomainServerIp }}</strong>, then verify.</p>
|
||||
@if($cd->last_error)<p class="mt-1 text-xs text-red-600">{{ $cd->last_error }}</p>@endif
|
||||
@endunless
|
||||
<div class="mt-2 flex items-center gap-3">
|
||||
@unless($live)
|
||||
<form method="post" action="{{ route('merchant.custom-domain.verify', $cd) }}">
|
||||
@csrf
|
||||
<button class="text-xs font-semibold text-indigo-600 hover:text-indigo-500">Verify & enable SSL</button>
|
||||
</form>
|
||||
@endunless
|
||||
<form method="post" action="{{ route('merchant.custom-domain.destroy', $cd) }}" onsubmit="return confirm('Remove this custom domain?');">
|
||||
@csrf @method('DELETE')
|
||||
<button class="text-xs font-medium text-slate-500 hover:text-red-600">Remove</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@empty
|
||||
<form method="post" action="{{ route('merchant.custom-domain.store', $qrCode) }}" class="mt-3 flex items-end gap-2">
|
||||
@csrf
|
||||
<div class="flex-1">
|
||||
<label class="block text-xs text-slate-500">Your domain</label>
|
||||
<input type="text" name="host" placeholder="brand.com" required
|
||||
class="mt-1 w-full rounded-xl border-slate-200 text-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
<button class="rounded-xl bg-slate-900 px-3.5 py-2 text-sm font-semibold text-white hover:bg-slate-800">Add</button>
|
||||
</form>
|
||||
@error('host')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
|
||||
@endforelse
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<form method="post" action="{{ route('merchant.storefronts.destroy', $qrCode) }}"
|
||||
onsubmit="return confirm('Delete this storefront? This cannot be undone.');">
|
||||
@csrf @method('DELETE')
|
||||
@@ -124,7 +170,7 @@
|
||||
</div>
|
||||
</label>
|
||||
|
||||
@include('merchant.storefronts.partials.editor-fields', ['content' => $content])
|
||||
@include('merchant.storefronts.partials.editor-fields', ['content' => $content, 'catalog' => $catalog ?? []])
|
||||
|
||||
<button type="submit" class="btn-primary w-full">Save changes</button>
|
||||
</form>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
@if ($handler === 'openAfia')
|
||||
@click="openAfia()"
|
||||
@else
|
||||
@click="$dispatch('afia-open')"
|
||||
@click="window.dispatchEvent(new CustomEvent('afia-open'))"
|
||||
@endif
|
||||
@class([
|
||||
'inline-flex shrink-0 items-center justify-center gap-2 rounded-xl bg-gradient-to-r from-indigo-700 via-blue-600 to-emerald-400 text-sm font-semibold text-white shadow-sm transition hover:opacity-95',
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
@php
|
||||
$afiaGreeting = "Hi, I'm Afia 👋 Ask me about storefronts — creating one, accepting orders, payouts, or the 9% platform fee…";
|
||||
$afiaGreeting = "Hi, I'm Afia 👋 Ask me about storefronts — creating one, accepting orders, payouts, or the 5.5% platform fee…";
|
||||
$afiaSuggestions = [
|
||||
'How do I create a storefront?',
|
||||
'How do supporters give online?',
|
||||
@@ -67,7 +67,7 @@
|
||||
<div class="flex" :class="m.role === 'user' ? 'justify-end' : 'justify-start'">
|
||||
<div class="max-w-[85%] whitespace-pre-line rounded-2xl px-3.5 py-2.5 text-[13px] leading-relaxed"
|
||||
:class="m.role === 'user' ? 'bg-indigo-600 text-white rounded-br-md' : 'bg-slate-100 text-slate-700 rounded-bl-md'"
|
||||
x-text="m.text"></div>
|
||||
x-html="m.text.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/\*\*([^*]+?)\*\*/g,'<strong>$1</strong>')"></div>
|
||||
</div>
|
||||
</template>
|
||||
<div x-show="loading" class="flex justify-start">
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
@php
|
||||
// Branded boot splash (Ladill Mail style). Self-icon from this app's subdomain.
|
||||
$sub = strtolower((string) ((explode('.', (string) (parse_url((string) config('app.url'), PHP_URL_HOST) ?: '')))[0] ?? ''));
|
||||
$icon = $sub !== '' && is_file(public_path("images/launcher-icons/{$sub}.svg")) ? "images/launcher-icons/{$sub}.svg" : null;
|
||||
$label = (string) config('app.name', 'Ladill');
|
||||
@endphp
|
||||
<div id="ladill-boot" role="status" aria-live="polite">
|
||||
<div class="lb-wrap">
|
||||
@if ($icon)
|
||||
<img class="lb-logo" src="{{ asset($icon) }}?v={{ @filemtime(public_path($icon)) ?: '1' }}" alt="">
|
||||
@endif
|
||||
<div class="lb-bar"><span></span></div>
|
||||
<div class="lb-title">Loading {{ $label }}…</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
#ladill-boot{position:fixed;inset:0;z-index:99999;background:#f8fafc;display:flex;align-items:center;justify-content:center;transition:opacity .35s ease;font-family:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
|
||||
#ladill-boot .lb-wrap{display:flex;flex-direction:column;align-items:center;gap:24px;width:260px}
|
||||
#ladill-boot .lb-logo{width:64px;height:64px;animation:lb-pulse 1.6s ease-in-out infinite}
|
||||
#ladill-boot .lb-bar{width:100%;height:4px;background:#e2e8f0;border-radius:999px;overflow:hidden}
|
||||
#ladill-boot .lb-bar>span{display:block;height:100%;width:8%;border-radius:999px;background:linear-gradient(90deg,#4f46e5,#7c3aed);animation:lb-fill 1.9s cubic-bezier(.4,0,.2,1) forwards}
|
||||
#ladill-boot .lb-title{font-size:14px;color:#64748b;font-weight:500}
|
||||
@keyframes lb-fill{0%{width:8%}55%{width:68%}100%{width:93%}}
|
||||
@keyframes lb-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.93);opacity:.82}}
|
||||
</style>
|
||||
<script>
|
||||
(function(){
|
||||
var el=document.getElementById('ladill-boot');
|
||||
if(!el)return;
|
||||
function remove(){if(el&&el.parentNode)el.parentNode.removeChild(el);}
|
||||
// Show when the user opens or reloads the app; suppress only on internal
|
||||
// link navigations and back/forward so we don't flash on every click.
|
||||
try{
|
||||
var navType='navigate';
|
||||
var nav=performance.getEntriesByType&&performance.getEntriesByType('navigation');
|
||||
if(nav&&nav.length){navType=nav[0].type;}
|
||||
else if(performance.navigation){navType=performance.navigation.type===1?'reload':(performance.navigation.type===2?'back_forward':'navigate');}
|
||||
var internal=false;
|
||||
if(navType!=='reload'&&document.referrer){
|
||||
try{internal=new URL(document.referrer).origin===location.origin;}catch(e){}
|
||||
}
|
||||
if(internal||navType==='back_forward'){remove();return;}
|
||||
}catch(e){}
|
||||
var start=Date.now(),MIN=550;
|
||||
function done(){
|
||||
var wait=Math.max(0,MIN-(Date.now()-start));
|
||||
setTimeout(function(){if(!el)return;el.style.opacity='0';setTimeout(remove,400);},wait);
|
||||
}
|
||||
if(document.readyState==='complete')done();else window.addEventListener('load',done);
|
||||
setTimeout(done,8000); // safety net
|
||||
})();
|
||||
</script>
|
||||
@@ -10,10 +10,27 @@
|
||||
config('ladill_launcher.apps', []),
|
||||
fn (array $app) => parse_url($app['url'], PHP_URL_HOST) !== $selfHost
|
||||
));
|
||||
$launcherOverflows = count($launcherApps) > 15;
|
||||
@endphp
|
||||
@if (! empty($launcherApps))
|
||||
<div class="relative" x-data="{ appsOpen: false }" @click.outside="appsOpen = false" @keydown.escape.window="appsOpen = false">
|
||||
<button type="button" @click="appsOpen = !appsOpen"
|
||||
<div class="relative" x-data="{
|
||||
appsOpen: false,
|
||||
showScrollMore: {{ $launcherOverflows ? 'true' : 'false' }},
|
||||
checkScrollEnd() {
|
||||
const el = this.$refs.appsScroller;
|
||||
if (! el) return;
|
||||
this.showScrollMore = el.scrollTop + el.clientHeight < el.scrollHeight - 4;
|
||||
},
|
||||
toggleApps() {
|
||||
this.appsOpen = ! this.appsOpen;
|
||||
if (this.appsOpen) {
|
||||
this.$nextTick(() => this.checkScrollEnd());
|
||||
} else {
|
||||
this.showScrollMore = {{ $launcherOverflows ? 'true' : 'false' }};
|
||||
}
|
||||
},
|
||||
}" @click.outside="appsOpen = false" @keydown.escape.window="appsOpen = false">
|
||||
<button type="button" @click="toggleApps()"
|
||||
@class([
|
||||
'inline-flex items-center justify-center rounded-xl border border-slate-200 text-slate-600 transition hover:bg-slate-50',
|
||||
'p-2' => ! $sidebar,
|
||||
@@ -37,16 +54,30 @@
|
||||
'bottom-full left-0 mb-2' => $sidebar,
|
||||
])>
|
||||
<p class="px-1 pb-2 text-[10px] font-bold uppercase tracking-widest text-slate-400">All apps</p>
|
||||
<div class="grid grid-cols-3 gap-1">
|
||||
@foreach ($launcherApps as $app)
|
||||
<a href="{{ $app['url'] }}"
|
||||
class="flex flex-col items-center gap-1.5 rounded-xl px-2 py-3 text-center transition hover:bg-indigo-50">
|
||||
<span class="flex h-9 w-9 items-center justify-center rounded-lg bg-slate-100">
|
||||
<img src="{{ asset('images/launcher-icons/'.$app['icon']) }}?v={{ @filemtime(public_path('images/launcher-icons/'.$app['icon'])) ?: '1' }}" alt="" class="h-5 w-5 object-contain" width="20" height="20">
|
||||
</span>
|
||||
<span class="text-[11px] font-medium leading-tight text-slate-700">{{ $app['name'] }}</span>
|
||||
</a>
|
||||
@endforeach
|
||||
<div @class(['ladill-launcher-apps-wrap' => $launcherOverflows])>
|
||||
<div
|
||||
class="ladill-launcher-apps"
|
||||
@if ($launcherOverflows) x-ref="appsScroller" @scroll="checkScrollEnd()" @endif
|
||||
>
|
||||
<div class="grid grid-cols-3 gap-1">
|
||||
@foreach ($launcherApps as $app)
|
||||
<a href="{{ $app['url'] }}"
|
||||
class="flex min-h-[5.25rem] flex-col items-center justify-center gap-1.5 rounded-xl px-2 py-3 text-center transition hover:bg-indigo-50">
|
||||
<span class="flex h-9 w-9 items-center justify-center rounded-lg bg-slate-100">
|
||||
<img src="{{ asset('images/launcher-icons/'.$app['icon']) }}?v={{ @filemtime(public_path('images/launcher-icons/'.$app['icon'])) ?: '1' }}" alt="" class="h-5 w-5 object-contain" width="20" height="20">
|
||||
</span>
|
||||
<span class="text-[11px] font-medium leading-tight text-slate-700">{{ $app['name'] }}</span>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@if ($launcherOverflows)
|
||||
<div class="ladill-launcher-scroll-more" x-show="showScrollMore" x-cloak aria-hidden="true">
|
||||
<svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,5 +1,9 @@
|
||||
@php
|
||||
$gridCols = !empty($centerCompose) ? 'grid-cols-5' : 'grid-cols-4';
|
||||
$showSearch = isset($searchUrl) && $searchUrl !== null && $searchUrl !== '#';
|
||||
$gridCols = match (true) {
|
||||
! empty($centerCompose) => $showSearch ? 'grid-cols-5' : 'grid-cols-4',
|
||||
default => $showSearch ? 'grid-cols-4' : 'grid-cols-3',
|
||||
};
|
||||
$avatarUrl = $avatarUrl ?? null;
|
||||
$initials = $initials ?? 'U';
|
||||
$notificationsUrl = $notificationsUrl ?? '#';
|
||||
@@ -11,7 +15,6 @@
|
||||
if ($profileMenuItems === [] && $profileUrl !== '#') {
|
||||
$profileMenuItems = [['type' => 'link', 'label' => 'Profile', 'href' => $profileUrl]];
|
||||
}
|
||||
$searchLabel = $searchLabel ?? 'Search';
|
||||
$navActive = fn (bool $active) => $active ? 'text-indigo-600' : 'text-slate-600';
|
||||
@endphp
|
||||
<div x-data="{ profileOpen: false }" class="lg:hidden">
|
||||
@@ -24,11 +27,13 @@
|
||||
<span class="text-[10px] font-medium">Home</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ $searchUrl }}"
|
||||
class="flex flex-col items-center justify-center gap-1 px-2 py-2 transition hover:text-slate-900 {{ $navActive($searchActive ?? false) }}">
|
||||
<svg class="h-6 w-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
<span class="text-[10px] font-medium">{{ $searchLabel }}</span>
|
||||
</a>
|
||||
@if ($showSearch)
|
||||
<a href="{{ $searchUrl }}"
|
||||
class="flex flex-col items-center justify-center gap-1 px-2 py-2 transition hover:text-slate-900 {{ $navActive($searchActive ?? false) }}">
|
||||
<svg class="h-6 w-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
<span class="text-[10px] font-medium">Search</span>
|
||||
</a>
|
||||
@endif
|
||||
|
||||
@if (!empty($centerCompose))
|
||||
<div class="flex items-center justify-center">
|
||||
@@ -52,12 +57,14 @@
|
||||
},
|
||||
}"
|
||||
@endif
|
||||
class="relative flex flex-col items-center justify-center gap-1 px-2 py-2 transition hover:text-slate-900 {{ $navActive($notificationsActive ?? false) }}">
|
||||
<svg class="h-6 w-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0"/></svg>
|
||||
@if ($unreadUrl)
|
||||
<span x-show="unread > 0" x-cloak x-text="unread > 9 ? '9+' : unread"
|
||||
class="absolute right-3 top-1.5 inline-flex min-w-4 items-center justify-center rounded-full bg-rose-500 px-1 py-0.5 text-[9px] font-semibold text-white"></span>
|
||||
@endif
|
||||
class="flex flex-col items-center justify-center gap-1 px-2 py-2 transition hover:text-slate-900 {{ $navActive($notificationsActive ?? false) }}">
|
||||
<span class="relative inline-flex shrink-0">
|
||||
<svg class="h-6 w-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0"/></svg>
|
||||
@if ($unreadUrl)
|
||||
<span x-show="unread > 0" x-cloak x-text="unread > 9 ? '9+' : unread"
|
||||
class="absolute -right-1 -top-1 inline-flex min-w-5 items-center justify-center rounded-full bg-rose-500 px-1.5 py-0.5 text-[10px] font-semibold text-white"></span>
|
||||
@endif
|
||||
</span>
|
||||
<span class="text-[10px] font-medium">Notifications</span>
|
||||
</a>
|
||||
|
||||
@@ -83,6 +90,7 @@
|
||||
class="absolute inset-0 bg-slate-900/40 backdrop-blur-[1px]"></div>
|
||||
|
||||
<div x-show="profileOpen"
|
||||
x-effect="profileOpen && window.dispatchEvent(new CustomEvent('wallet-balance-refresh'))"
|
||||
x-transition:enter="transition ease-out duration-300"
|
||||
x-transition:enter-start="translate-y-full"
|
||||
x-transition:enter-end="translate-y-0"
|
||||
@@ -114,25 +122,11 @@
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="space-y-1 p-2 pb-4">
|
||||
@foreach ($profileMenuItems as $item)
|
||||
@if (($item['type'] ?? 'link') === 'link')
|
||||
<a href="{{ $item['href'] }}"
|
||||
@click="profileOpen = false"
|
||||
class="block rounded-xl px-4 py-3 text-sm font-medium text-slate-700 transition hover:bg-slate-100">
|
||||
{{ $item['label'] }}
|
||||
</a>
|
||||
@elseif (($item['type'] ?? '') === 'logout')
|
||||
<form method="POST" action="{{ $item['action'] }}" class="border-t border-slate-100 pt-2">
|
||||
@csrf
|
||||
<button type="submit"
|
||||
class="w-full rounded-xl px-4 py-3 text-left text-sm font-medium text-rose-600 transition hover:bg-rose-50">
|
||||
{{ $item['label'] }}
|
||||
</button>
|
||||
</form>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@include('partials.user-profile-menu', [
|
||||
'items' => $profileMenuItems,
|
||||
'variant' => 'sheet',
|
||||
'onNavigate' => 'profileOpen = false',
|
||||
])
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,53 @@
|
||||
@php
|
||||
$variant = $variant ?? 'primary';
|
||||
$type = $type ?? 'submit';
|
||||
$tag = ! empty($href) ? 'a' : 'button';
|
||||
$ariaLabel = $ariaLabel ?? $label ?? '';
|
||||
$desktopLabel = $desktopLabel ?? $label ?? '';
|
||||
$showDesktopIcon = $showDesktopIcon ?? ($variant === 'primary');
|
||||
|
||||
$mobileClass = match ($variant) {
|
||||
'primary' => 'btn-fab h-10 w-10 lg:hidden',
|
||||
'outline' => 'inline-flex h-10 w-10 items-center justify-center rounded-full border border-slate-200 bg-white text-slate-700 shadow-sm transition hover:border-slate-300 hover:bg-slate-50 lg:hidden',
|
||||
'dark' => 'inline-flex h-10 w-10 items-center justify-center rounded-full bg-gray-900 text-white shadow-sm transition hover:bg-gray-800 lg:hidden',
|
||||
'indigo' => 'inline-flex h-10 w-10 items-center justify-center rounded-full bg-indigo-600 text-white shadow-sm transition hover:bg-indigo-700 lg:hidden',
|
||||
default => 'btn-fab h-10 w-10 lg:hidden',
|
||||
};
|
||||
|
||||
$desktopClass = match ($variant) {
|
||||
'primary' => 'btn-primary hidden items-center lg:inline-flex',
|
||||
'outline' => 'hidden items-center rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition hover:bg-gray-50 lg:inline-flex',
|
||||
'dark' => 'hidden items-center gap-1.5 rounded-lg bg-gray-900 px-3.5 py-2 text-sm font-medium text-white transition hover:bg-gray-800 lg:inline-flex',
|
||||
'indigo' => 'hidden items-center justify-center rounded-xl bg-indigo-600 px-4 py-2.5 text-sm font-semibold text-white transition hover:bg-indigo-700 lg:inline-flex',
|
||||
default => 'btn-primary hidden items-center lg:inline-flex',
|
||||
};
|
||||
|
||||
$extraClass = $class ?? '';
|
||||
@endphp
|
||||
|
||||
<{{ $tag }}
|
||||
@if ($tag === 'a') href="{{ $href }}" @endif
|
||||
@if ($tag === 'button') type="{{ $type }}" @endif
|
||||
aria-label="{{ $ariaLabel }}"
|
||||
title="{{ $ariaLabel }}"
|
||||
@if (! empty($attributes)) {!! $attributes !!} @endif
|
||||
class="{{ trim($mobileClass.' '.$extraClass) }}"
|
||||
>
|
||||
<svg class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/>
|
||||
</svg>
|
||||
</{{ $tag }}>
|
||||
|
||||
<{{ $tag }}
|
||||
@if ($tag === 'a') href="{{ $href }}" @endif
|
||||
@if ($tag === 'button') type="{{ $type }}" @endif
|
||||
@if (! empty($attributes)) {!! $attributes !!} @endif
|
||||
class="{{ trim($desktopClass.' '.$extraClass) }}"
|
||||
>
|
||||
@if ($showDesktopIcon)
|
||||
<svg class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/>
|
||||
</svg>
|
||||
@endif
|
||||
{{ $desktopLabel }}
|
||||
</{{ $tag }}>
|
||||
@@ -0,0 +1,33 @@
|
||||
@php
|
||||
$icon = $icon ?? 'arrow';
|
||||
$desktopClass = $desktopClass ?? 'text-xs font-medium text-indigo-600 hover:text-indigo-700';
|
||||
$label = $label ?? '';
|
||||
$extraAttributes = $attributes ?? '';
|
||||
@endphp
|
||||
|
||||
<a href="{{ $href }}"
|
||||
aria-label="{{ $label }}"
|
||||
title="{{ $label }}"
|
||||
@if ($extraAttributes !== '') {!! $extraAttributes !!} @endif
|
||||
class="inline-flex h-9 w-9 items-center justify-center rounded-full bg-indigo-50 text-indigo-600 ring-1 ring-indigo-100 transition hover:bg-indigo-100 lg:h-auto lg:w-auto lg:rounded-none lg:bg-transparent lg:ring-0 lg:hover:bg-transparent">
|
||||
<span class="lg:hidden">
|
||||
@if ($icon === 'plus')
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"/>
|
||||
</svg>
|
||||
@elseif ($icon === 'shield')
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75m-3-7.036A11.959 11.959 0 0 1 3.598 6 11.99 11.99 0 0 0 3 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285Z"/>
|
||||
</svg>
|
||||
@elseif ($icon === 'calendar')
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5"/>
|
||||
</svg>
|
||||
@else
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3"/>
|
||||
</svg>
|
||||
@endif
|
||||
</span>
|
||||
<span class="hidden lg:inline {{ $desktopClass }}">{{ $label }}</span>
|
||||
</a>
|
||||
@@ -1,44 +1,635 @@
|
||||
{{--
|
||||
Paystack mobile bottom-sheet iframe.
|
||||
Requires Alpine.js ancestor with: showSheet (bool), checkoutUrl (string).
|
||||
On mobile (< md) the sheet slides up; on desktop nothing renders.
|
||||
--}}
|
||||
<template x-teleport="body">
|
||||
<div x-show="showSheet"
|
||||
x-cloak
|
||||
class="fixed inset-0 z-[9999] flex flex-col justify-end md:hidden"
|
||||
role="dialog"
|
||||
aria-modal="true">
|
||||
Payment checkout shell.
|
||||
|
||||
Audiences:
|
||||
- buyer (default): public ticket buyers, donors, shoppers — self-serve checkout
|
||||
- operator: signed-in staff flows such as wallet top-up
|
||||
|
||||
Optional overrides: $sheetTitle, $sheetSubtitle, $sheetFooter, $sheetAria, $iframeTitle
|
||||
Requires Alpine ancestor with:
|
||||
- showSheet (bool)
|
||||
- checkoutUrl (string) — authorization / waiting URL
|
||||
- accessCode (string, optional) — Paystack initialize access_code for Inline
|
||||
- publicKey (string, optional)
|
||||
- returnUrl (string, optional) — where to go after Inline onSuccess (?reference=)
|
||||
|
||||
checkout.paystack.com cannot be iframed (X-Frame-Options: SAMEORIGIN).
|
||||
|
||||
Paystack Inline owns its secure payment popup. We do not place a Ladill
|
||||
loading sheet in front of it: that created a needless first screen before
|
||||
the checkout appeared. The Ladill bottomsheet/modal is reserved for
|
||||
same-origin waiting pages (such as MoMo) and recoverable errors.
|
||||
--}}
|
||||
@php
|
||||
$audience = $audience ?? 'buyer';
|
||||
$defaults = match ($audience) {
|
||||
'operator' => [
|
||||
'title' => 'Complete payment',
|
||||
'subtitle' => null,
|
||||
'aria' => 'Complete payment',
|
||||
'iframe' => 'Payment checkout',
|
||||
'footer' => null,
|
||||
],
|
||||
default => [
|
||||
'title' => 'Complete your payment',
|
||||
'subtitle' => 'Pay securely. You\'ll get a confirmation when it succeeds.',
|
||||
'aria' => 'Complete your payment',
|
||||
'iframe' => 'Secure payment checkout',
|
||||
'footer' => 'Your payment is processed securely. Do not close this window until finished.',
|
||||
],
|
||||
};
|
||||
$sheetTitle = $sheetTitle ?? $defaults['title'];
|
||||
$sheetSubtitle = $sheetSubtitle ?? $defaults['subtitle'];
|
||||
$sheetAria = $sheetAria ?? $defaults['aria'];
|
||||
$iframeTitle = $iframeTitle ?? $defaults['iframe'];
|
||||
$sheetFooter = $sheetFooter ?? $defaults['footer'];
|
||||
@endphp
|
||||
@once
|
||||
<script>
|
||||
(function () {
|
||||
if (window.__ladillPayCheckoutBootstrapped) return;
|
||||
window.__ladillPayCheckoutBootstrapped = true;
|
||||
|
||||
var INLINE_SRC = 'https://js.paystack.co/v2/inline.js';
|
||||
var inlineLoading = null;
|
||||
var activePopup = null;
|
||||
|
||||
function isFrameable(url) {
|
||||
if (!url) return false;
|
||||
try {
|
||||
return new URL(url, window.location.href).origin === window.location.origin;
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function isPaystackCheckoutUrl(url) {
|
||||
if (!url) return false;
|
||||
try {
|
||||
var host = new URL(url, window.location.href).hostname.toLowerCase();
|
||||
return host === 'checkout.paystack.com' || host.endsWith('.paystack.com');
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function accessCodeFromUrl(url) {
|
||||
if (!url || !isPaystackCheckoutUrl(url)) return '';
|
||||
try {
|
||||
var path = new URL(url, window.location.href).pathname.replace(/^\/+/, '');
|
||||
var code = path.split('/')[0] || '';
|
||||
return /^[A-Za-z0-9_-]{6,}$/.test(code) ? code : '';
|
||||
} catch (e) {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function resolveAccessCode(accessCode, checkoutUrl) {
|
||||
var code = (accessCode || '').toString().trim();
|
||||
if (code) return code;
|
||||
return accessCodeFromUrl(checkoutUrl);
|
||||
}
|
||||
|
||||
function loadInlineJs() {
|
||||
if (window.PaystackPop) {
|
||||
return Promise.resolve(window.PaystackPop);
|
||||
}
|
||||
if (inlineLoading) return inlineLoading;
|
||||
inlineLoading = new Promise(function (resolve, reject) {
|
||||
var existing = document.querySelector('script[data-ladill-paystack-inline]');
|
||||
if (existing) {
|
||||
if (window.PaystackPop) {
|
||||
resolve(window.PaystackPop);
|
||||
return;
|
||||
}
|
||||
existing.addEventListener('load', function () { resolve(window.PaystackPop); });
|
||||
existing.addEventListener('error', function () { reject(new Error('Paystack script failed')); });
|
||||
return;
|
||||
}
|
||||
var script = document.createElement('script');
|
||||
script.src = INLINE_SRC;
|
||||
script.async = true;
|
||||
script.dataset.ladillPaystackInline = '1';
|
||||
script.onload = function () { resolve(window.PaystackPop); };
|
||||
script.onerror = function () {
|
||||
inlineLoading = null;
|
||||
reject(new Error('Paystack script failed'));
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
});
|
||||
return inlineLoading;
|
||||
}
|
||||
|
||||
function buildReturnUrl(returnUrl, reference) {
|
||||
if (!returnUrl || !reference) return '';
|
||||
try {
|
||||
var u = new URL(returnUrl, window.location.href);
|
||||
u.searchParams.set('reference', reference);
|
||||
return u.toString();
|
||||
} catch (e) {
|
||||
var join = returnUrl.indexOf('?') >= 0 ? '&' : '?';
|
||||
return returnUrl + join + 'reference=' + encodeURIComponent(reference);
|
||||
}
|
||||
}
|
||||
|
||||
function cancelInline() {
|
||||
try {
|
||||
if (activePopup && typeof activePopup.cancelTransaction === 'function') {
|
||||
activePopup.cancelTransaction();
|
||||
}
|
||||
} catch (e) {}
|
||||
activePopup = null;
|
||||
}
|
||||
|
||||
// Fullscreen permission for Paystack's own iframes (do not reparent them).
|
||||
// Only write attributes when they actually change — writing always re-fires
|
||||
// MutationObservers and freezes the page (wallet include path).
|
||||
function applyIframePermissions(iframe) {
|
||||
if (!iframe || !iframe.setAttribute) return;
|
||||
try {
|
||||
var cur = (iframe.getAttribute('allow') || '').trim();
|
||||
var need = ['payment *', 'fullscreen *', 'clipboard-read *', 'clipboard-write *', 'publickey-credentials-get *'];
|
||||
var parts = cur ? cur.split(';').map(function (p) { return p.trim(); }).filter(Boolean) : [];
|
||||
var lower = parts.map(function (p) { return p.toLowerCase(); });
|
||||
need.forEach(function (perm) {
|
||||
var base = perm.split(' ')[0].toLowerCase();
|
||||
if (!lower.some(function (p) { return p === base || p.indexOf(base + ' ') === 0; })) {
|
||||
parts.push(perm);
|
||||
}
|
||||
});
|
||||
var next = parts.join('; ');
|
||||
if (cur !== next) {
|
||||
iframe.setAttribute('allow', next);
|
||||
}
|
||||
if (!iframe.hasAttribute('allowfullscreen')) {
|
||||
iframe.setAttribute('allowfullscreen', '');
|
||||
}
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function ensurePaystackIframePermissions(root) {
|
||||
try {
|
||||
var scope = root || document;
|
||||
var nodes = scope.querySelectorAll ? scope.querySelectorAll('iframe') : [];
|
||||
for (var i = 0; i < nodes.length; i++) {
|
||||
var iframe = nodes[i];
|
||||
var id = (iframe.id || '').toLowerCase();
|
||||
var src = '';
|
||||
try { src = (iframe.getAttribute('src') || '').toLowerCase(); } catch (e) {}
|
||||
if (id.indexOf('inline-') === 0 || id.indexOf('embed-') === 0 || src.indexOf('paystack') !== -1) {
|
||||
applyIframePermissions(iframe);
|
||||
}
|
||||
}
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function installIframeAllowHook() {
|
||||
if (window.__ladillIframeAllowHook) return;
|
||||
window.__ladillIframeAllowHook = true;
|
||||
try {
|
||||
var orig = Document.prototype.createElement;
|
||||
Document.prototype.createElement = function (tagName, options) {
|
||||
var el = options !== undefined ? orig.call(this, tagName, options) : orig.call(this, tagName);
|
||||
try {
|
||||
if (String(tagName).toLowerCase() === 'iframe') {
|
||||
applyIframePermissions(el);
|
||||
}
|
||||
} catch (e) {}
|
||||
return el;
|
||||
};
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
/**
|
||||
* Arm iframe permission helpers only while a payment is starting.
|
||||
* Do not install on every wallet/page load — observing style/class + always
|
||||
* rewriting allow caused an infinite MutationObserver loop (page unresponsive).
|
||||
*/
|
||||
function watchPaystackIframes() {
|
||||
if (window.__ladillPaystackIframeWatch) return;
|
||||
window.__ladillPaystackIframeWatch = true;
|
||||
installIframeAllowHook();
|
||||
ensurePaystackIframePermissions(document);
|
||||
try {
|
||||
var obs = new MutationObserver(function (mutations) {
|
||||
for (var i = 0; i < mutations.length; i++) {
|
||||
var m = mutations[i];
|
||||
// childList only — never re-enter on attribute writes.
|
||||
if (!m.addedNodes || !m.addedNodes.length) continue;
|
||||
for (var n = 0; n < m.addedNodes.length; n++) {
|
||||
var node = m.addedNodes[n];
|
||||
if (!node || node.nodeType !== 1) continue;
|
||||
if (node.tagName === 'IFRAME') {
|
||||
applyIframePermissions(node);
|
||||
} else if (node.querySelectorAll) {
|
||||
var nested = node.querySelectorAll('iframe');
|
||||
for (var k = 0; k < nested.length; k++) {
|
||||
applyIframePermissions(nested[k]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
obs.observe(document.documentElement || document.body, {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
});
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function emitPayEvent(name, detail) {
|
||||
try {
|
||||
window.dispatchEvent(new CustomEvent(name, { detail: detail || {} }));
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
function createStoreDefinition() {
|
||||
return {
|
||||
frameable: false,
|
||||
inline: false,
|
||||
ready: false,
|
||||
launching: false,
|
||||
error: '',
|
||||
_launchToken: 0,
|
||||
_activeCode: '',
|
||||
_openedEmitted: false,
|
||||
shellVisible() {
|
||||
return !!(this.frameable || this.error);
|
||||
},
|
||||
reset() {
|
||||
this.frameable = false;
|
||||
this.inline = false;
|
||||
this.ready = false;
|
||||
this.launching = false;
|
||||
this.error = '';
|
||||
this._activeCode = '';
|
||||
this._openedEmitted = false;
|
||||
cancelInline();
|
||||
},
|
||||
markOpened() {
|
||||
if (this._openedEmitted) return;
|
||||
this._openedEmitted = true;
|
||||
this.launching = false;
|
||||
emitPayEvent('ladill-pay-opened');
|
||||
},
|
||||
markFailed(message) {
|
||||
this.launching = false;
|
||||
this._activeCode = '';
|
||||
this._openedEmitted = false;
|
||||
this.error = message || 'Could not open secure payment.';
|
||||
emitPayEvent('ladill-pay-error', { message: this.error });
|
||||
},
|
||||
sync(show, url, accessCode, returnUrl) {
|
||||
url = (url || '').toString();
|
||||
accessCode = (accessCode || '').toString();
|
||||
returnUrl = (returnUrl || '').toString();
|
||||
|
||||
if (!show) {
|
||||
this._launchToken += 1;
|
||||
this.reset();
|
||||
return;
|
||||
}
|
||||
|
||||
this.ready = !!(url || accessCode);
|
||||
// Keep a previous recoverable error only until a new attempt supplies payload.
|
||||
if (url || accessCode) {
|
||||
this.error = '';
|
||||
}
|
||||
|
||||
if (!url && !accessCode) {
|
||||
// Waiting for parent to set access_code / checkout_url after fetch.
|
||||
this.frameable = false;
|
||||
this.inline = false;
|
||||
this.launching = true;
|
||||
this._activeCode = '';
|
||||
this._openedEmitted = false;
|
||||
return;
|
||||
}
|
||||
|
||||
if (isFrameable(url)) {
|
||||
this.frameable = true;
|
||||
this.inline = false;
|
||||
this.launching = false;
|
||||
this._activeCode = '';
|
||||
this._openedEmitted = false;
|
||||
cancelInline();
|
||||
// Same-origin waiting UI is our shell — it is "open" for busy-state release.
|
||||
emitPayEvent('ladill-pay-opened');
|
||||
return;
|
||||
}
|
||||
|
||||
var code = resolveAccessCode(accessCode, url);
|
||||
if (code) {
|
||||
this.frameable = false;
|
||||
this.inline = true;
|
||||
if (this._activeCode === code && (this.launching || activePopup)) {
|
||||
return;
|
||||
}
|
||||
this.launchInline(code, returnUrl);
|
||||
return;
|
||||
}
|
||||
|
||||
this.frameable = false;
|
||||
this.inline = false;
|
||||
this.markFailed(
|
||||
isPaystackCheckoutUrl(url)
|
||||
? 'Could not start in-app payment. Please try again.'
|
||||
: 'Secure checkout could not be opened in-page. Please try again.'
|
||||
);
|
||||
},
|
||||
launchInline(accessCode, returnUrl) {
|
||||
var store = this;
|
||||
var token = ++this._launchToken;
|
||||
this._activeCode = accessCode;
|
||||
this.launching = true;
|
||||
this.error = '';
|
||||
this.inline = true;
|
||||
this.frameable = false;
|
||||
this._openedEmitted = false;
|
||||
|
||||
watchPaystackIframes();
|
||||
|
||||
// Ensure Paystack script is fully ready before resumeTransaction so we
|
||||
// do not paint an empty popup shell for a beat (the pre-modal flash).
|
||||
loadInlineJs().then(function (PaystackPop) {
|
||||
if (token !== store._launchToken) return;
|
||||
if (!PaystackPop) throw new Error('Paystack unavailable');
|
||||
|
||||
cancelInline();
|
||||
|
||||
var popup = new PaystackPop();
|
||||
activePopup = popup;
|
||||
ensurePaystackIframePermissions(document);
|
||||
|
||||
popup.resumeTransaction(accessCode, {
|
||||
onLoad: function () {
|
||||
if (token !== store._launchToken) return;
|
||||
store.markOpened();
|
||||
ensurePaystackIframePermissions(document);
|
||||
},
|
||||
onSuccess: function (transaction) {
|
||||
if (token !== store._launchToken) return;
|
||||
store.launching = false;
|
||||
activePopup = null;
|
||||
var reference = (transaction && (transaction.reference || transaction.trxref)) || '';
|
||||
var dest = buildReturnUrl(returnUrl, reference);
|
||||
if (dest) {
|
||||
window.location.assign(dest);
|
||||
return;
|
||||
}
|
||||
window.location.reload();
|
||||
},
|
||||
onCancel: function () {
|
||||
if (token !== store._launchToken) return;
|
||||
store.launching = false;
|
||||
store._activeCode = '';
|
||||
store._openedEmitted = false;
|
||||
activePopup = null;
|
||||
emitPayEvent('ladill-pay-cancelled');
|
||||
},
|
||||
onError: function (err) {
|
||||
if (token !== store._launchToken) return;
|
||||
activePopup = null;
|
||||
store.markFailed((err && err.message) ? String(err.message) : 'Could not open secure payment.');
|
||||
},
|
||||
});
|
||||
|
||||
// Safety: if onLoad is slow, treat a live checkout iframe as open.
|
||||
var polls = 0;
|
||||
var pollId = setInterval(function () {
|
||||
if (token !== store._launchToken) {
|
||||
clearInterval(pollId);
|
||||
return;
|
||||
}
|
||||
ensurePaystackIframePermissions(document);
|
||||
var live = document.querySelector(
|
||||
'iframe[id^="inline-checkout"], iframe[id^="embed-checkout"]'
|
||||
);
|
||||
if (live) {
|
||||
store.markOpened();
|
||||
clearInterval(pollId);
|
||||
}
|
||||
polls += 1;
|
||||
if (polls >= 50) {
|
||||
clearInterval(pollId);
|
||||
if (store.launching && token === store._launchToken) {
|
||||
store.markFailed('Payment UI did not open. Please try again.');
|
||||
}
|
||||
}
|
||||
}, 100);
|
||||
}).catch(function (err) {
|
||||
if (token !== store._launchToken) return;
|
||||
store.markFailed((err && err.message) ? String(err.message) : 'Could not load payment script.');
|
||||
});
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function ensureStore() {
|
||||
if (!window.Alpine || typeof window.Alpine.store !== 'function') return null;
|
||||
try {
|
||||
var existing = window.Alpine.store('ladillPayCheckout');
|
||||
if (existing) return existing;
|
||||
} catch (e) {}
|
||||
window.Alpine.store('ladillPayCheckout', createStoreDefinition());
|
||||
return window.Alpine.store('ladillPayCheckout');
|
||||
}
|
||||
|
||||
document.addEventListener('alpine:init', function () {
|
||||
ensureStore();
|
||||
});
|
||||
if (window.Alpine && window.Alpine.version) {
|
||||
ensureStore();
|
||||
}
|
||||
|
||||
// Do not watch iframes or preload Paystack on every page that includes this
|
||||
// partial (e.g. wallet). That froze the tab. prepare()/launchInline arm it.
|
||||
|
||||
window.LadillPayCheckout = {
|
||||
isFrameable: isFrameable,
|
||||
isPaystackCheckoutUrl: isPaystackCheckoutUrl,
|
||||
accessCodeFromUrl: accessCodeFromUrl,
|
||||
resolveAccessCode: resolveAccessCode,
|
||||
prepare: function () {
|
||||
// Warm script + hooks only when user is about to pay.
|
||||
installIframeAllowHook();
|
||||
loadInlineJs().catch(function () {});
|
||||
return null;
|
||||
},
|
||||
cancel: function () {
|
||||
cancelInline();
|
||||
var store = ensureStore();
|
||||
if (store) store.reset();
|
||||
},
|
||||
open: function () { return null; },
|
||||
ensureStore: ensureStore,
|
||||
};
|
||||
})();
|
||||
</script>
|
||||
@endonce
|
||||
<template x-teleport="body">
|
||||
{{-- Inherit showSheet / checkoutUrl / accessCode / returnUrl from parent Alpine scope. --}}
|
||||
<div
|
||||
x-init="
|
||||
window.LadillPayCheckout && window.LadillPayCheckout.ensureStore();
|
||||
// Drop parent busy flags only when payment UI is actually up (or sheet closed).
|
||||
// Prevents the form/button from flashing back while Paystack is still booting.
|
||||
const releaseBusy = () => {
|
||||
try {
|
||||
if (typeof loading !== 'undefined' && loading) loading = false;
|
||||
if (typeof renewLoading !== 'undefined' && renewLoading) renewLoading = false;
|
||||
} catch (e) {}
|
||||
};
|
||||
const onPayOpened = () => releaseBusy();
|
||||
const onPayCancelled = () => { showSheet = false; releaseBusy(); };
|
||||
const onPayError = () => releaseBusy();
|
||||
window.addEventListener('ladill-pay-opened', onPayOpened);
|
||||
window.addEventListener('ladill-pay-cancelled', onPayCancelled);
|
||||
window.addEventListener('ladill-pay-error', onPayError);
|
||||
const runSync = () => {
|
||||
const store = $store.ladillPayCheckout;
|
||||
if (!store) return;
|
||||
store.sync(
|
||||
!!showSheet,
|
||||
(typeof checkoutUrl === 'undefined' || checkoutUrl === null) ? '' : String(checkoutUrl),
|
||||
(typeof accessCode === 'undefined' || accessCode === null) ? '' : String(accessCode),
|
||||
(typeof returnUrl === 'undefined' || returnUrl === null) ? '' : String(returnUrl)
|
||||
);
|
||||
};
|
||||
$watch('showSheet', (value) => {
|
||||
runSync();
|
||||
if (!value) releaseBusy();
|
||||
});
|
||||
$watch('checkoutUrl', () => runSync());
|
||||
$watch('accessCode', () => runSync());
|
||||
$watch('returnUrl', () => runSync());
|
||||
$nextTick(() => runSync());
|
||||
"
|
||||
x-show="showSheet && $store.ladillPayCheckout && ($store.ladillPayCheckout.frameable || $store.ladillPayCheckout.error)"
|
||||
x-cloak
|
||||
data-ladill-pay-sheet
|
||||
style="display: none"
|
||||
x-effect="
|
||||
// Only lock page scroll when OUR shell is visible — never during pure
|
||||
// Paystack Inline handoff (that scrollbar jump was the pre-modal flash).
|
||||
const lock = !!(showSheet && $store.ladillPayCheckout && ($store.ladillPayCheckout.frameable || $store.ladillPayCheckout.error));
|
||||
document.documentElement.style.overflow = lock ? 'hidden' : '';
|
||||
"
|
||||
@keydown.escape.window="
|
||||
if (!showSheet) return;
|
||||
// While Paystack Inline is the active UI, Escape is handled by Paystack.
|
||||
if ($store.ladillPayCheckout && $store.ladillPayCheckout.inline && !$store.ladillPayCheckout.launching && !$store.ladillPayCheckout.error) return;
|
||||
showSheet = false;
|
||||
window.LadillPayCheckout?.cancel?.();
|
||||
"
|
||||
@ladill-pay-cancelled.window="showSheet = false"
|
||||
class="fixed inset-0 z-[9999]"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
:aria-hidden="(!(showSheet && $store.ladillPayCheckout && ($store.ladillPayCheckout.frameable || $store.ladillPayCheckout.error))).toString()"
|
||||
aria-label="{{ $sheetAria }}">
|
||||
|
||||
{{--
|
||||
Ladill bottomsheet (mobile) / modal (desktop) — ONLY for:
|
||||
- same-origin waiting pages (MoMo etc.)
|
||||
- recoverable errors
|
||||
Paystack Inline opens its own secure payment popup; this shell stays
|
||||
hidden during launch so nothing flashes in front of it.
|
||||
--}}
|
||||
<div x-show="$store.ladillPayCheckout && ($store.ladillPayCheckout.frameable || $store.ladillPayCheckout.error)"
|
||||
x-cloak
|
||||
class="pointer-events-auto absolute inset-0 flex items-end justify-center md:items-center md:p-6"
|
||||
data-ladill-pay-shell>
|
||||
<div class="absolute inset-0 bg-black/60"
|
||||
x-show="showSheet"
|
||||
x-transition:enter="transition-opacity duration-300"
|
||||
x-transition:enter-start="opacity-0"
|
||||
x-transition:enter-end="opacity-100"
|
||||
x-transition:leave="transition-opacity duration-200"
|
||||
x-transition:leave-start="opacity-100"
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="showSheet = false">
|
||||
data-ladill-pay-backdrop
|
||||
@click="showSheet = false; window.LadillPayCheckout?.cancel?.()">
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col overflow-hidden rounded-t-2xl bg-white"
|
||||
style="height:90dvh; padding-bottom: env(safe-area-inset-bottom, 0px)"
|
||||
x-show="showSheet"
|
||||
x-transition:enter="transition-transform duration-300 ease-out"
|
||||
x-transition:enter-start="translate-y-full"
|
||||
x-transition:enter-end="translate-y-0"
|
||||
x-transition:leave="transition-transform duration-200 ease-in"
|
||||
x-transition:leave-start="translate-y-0"
|
||||
x-transition:leave-end="translate-y-full">
|
||||
<div data-ladill-pay-panel
|
||||
data-paystack-live="0"
|
||||
class="relative flex w-full flex-col overflow-hidden rounded-t-2xl bg-white shadow-2xl md:max-w-lg md:rounded-2xl"
|
||||
style="height: min(90dvh, 720px); max-height: 90dvh; padding-bottom: env(safe-area-inset-bottom, 0px)"
|
||||
x-transition:enter="transition duration-300 ease-out md:duration-200"
|
||||
x-transition:enter-start="translate-y-full opacity-0 md:translate-y-0 md:scale-95"
|
||||
x-transition:enter-end="translate-y-0 opacity-100 md:scale-100"
|
||||
x-transition:leave="transition duration-200 ease-in md:duration-150"
|
||||
x-transition:leave-start="translate-y-0 opacity-100 md:scale-100"
|
||||
x-transition:leave-end="translate-y-full opacity-0 md:translate-y-0 md:scale-95"
|
||||
@click.stop>
|
||||
|
||||
@include('partials.mini-paystack-frame-header')
|
||||
<div class="relative flex shrink-0 flex-col gap-0.5 border-b border-slate-100 px-4 pb-3 pt-5 md:px-5 md:pt-3"
|
||||
style="padding-top: max(1.25rem, env(safe-area-inset-top, 0px))"
|
||||
data-ladill-pay-header>
|
||||
<div class="absolute left-1/2 top-2 h-1 w-10 -translate-x-1/2 rounded-full bg-slate-200 md:hidden" data-ladill-pay-handle aria-hidden="true"></div>
|
||||
<div class="flex items-start justify-between gap-3">
|
||||
<div class="min-w-0">
|
||||
<p class="text-sm font-semibold text-slate-800">{{ $sheetTitle }}</p>
|
||||
@if (! empty($sheetSubtitle))
|
||||
<p class="mt-0.5 text-xs leading-snug text-slate-500">{{ $sheetSubtitle }}</p>
|
||||
@endif
|
||||
</div>
|
||||
<button type="button"
|
||||
x-ref="checkoutClose"
|
||||
x-init="
|
||||
$watch(
|
||||
() => !!(showSheet && $store.ladillPayCheckout && ($store.ladillPayCheckout.frameable || $store.ladillPayCheckout.error)),
|
||||
(open) => { if (open) $nextTick(() => $refs.checkoutClose?.focus()); }
|
||||
)
|
||||
"
|
||||
@click="showSheet = false; window.LadillPayCheckout?.cancel?.()"
|
||||
class="shrink-0 rounded-full p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
|
||||
aria-label="Close">
|
||||
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{{-- Markers kept for tests / callers that query live close chrome. --}}
|
||||
<div class="sr-only" data-ladill-pay-header-minimal data-ladill-pay-close-live aria-hidden="true"></div>
|
||||
<div class="sr-only" data-ladill-pay-mount data-ladill-pay-body aria-hidden="true"></div>
|
||||
|
||||
<iframe :src="showSheet ? checkoutUrl : ''"
|
||||
class="min-h-0 flex-1 w-full border-0"
|
||||
allow="payment"
|
||||
title="Paystack checkout"></iframe>
|
||||
<div class="min-h-0 flex-1 overflow-y-auto overscroll-contain">
|
||||
<iframe x-show="$store.ladillPayCheckout && $store.ladillPayCheckout.frameable"
|
||||
:src="showSheet && $store.ladillPayCheckout && $store.ladillPayCheckout.frameable ? checkoutUrl : ''"
|
||||
class="h-full min-h-[60dvh] w-full border-0 md:min-h-0"
|
||||
style="min-height: 28rem"
|
||||
allow="payment *; fullscreen *; clipboard-read *; clipboard-write *"
|
||||
title="{{ $iframeTitle }}"></iframe>
|
||||
|
||||
@include('partials.mini-paystack-frame-footer')
|
||||
<div x-show="$store.ladillPayCheckout && $store.ladillPayCheckout.error"
|
||||
class="flex min-h-[40dvh] flex-col items-center justify-center gap-4 px-6 py-10 text-center md:min-h-[20rem] md:px-8 md:py-12"
|
||||
data-ladill-pay-error>
|
||||
<div class="flex h-12 w-12 items-center justify-center rounded-full bg-red-50 text-red-500" aria-hidden="true">
|
||||
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.75" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="max-w-xs space-y-1 md:max-w-sm">
|
||||
<p class="text-sm font-semibold text-slate-800" data-ladill-pay-status-title>Checkout unavailable</p>
|
||||
<p class="text-xs leading-snug text-slate-500" x-text="$store.ladillPayCheckout.error"></p>
|
||||
</div>
|
||||
<button type="button"
|
||||
data-ladill-pay-retry
|
||||
@click="window.LadillPayCheckout?.ensureStore()?.sync(true, (typeof checkoutUrl==='undefined'||checkoutUrl===null)?'':String(checkoutUrl), (typeof accessCode==='undefined'||accessCode===null)?'':String(accessCode), (typeof returnUrl==='undefined'||returnUrl===null)?'':String(returnUrl))"
|
||||
class="inline-flex w-full max-w-xs items-center justify-center rounded-xl bg-indigo-600 px-4 py-3 text-sm font-semibold text-white hover:bg-indigo-700">
|
||||
Try again
|
||||
</button>
|
||||
<button type="button"
|
||||
@click="showSheet = false; window.LadillPayCheckout?.cancel?.()"
|
||||
class="text-xs font-medium text-slate-500 hover:text-slate-700">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (! empty($sheetFooter))
|
||||
<p class="shrink-0 border-t border-slate-100 bg-slate-50 px-4 py-2 text-center text-[11px] text-slate-500 md:px-5"
|
||||
data-ladill-pay-footer>
|
||||
{{ $sheetFooter }}
|
||||
</p>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<div class="px-4 pb-3">
|
||||
<div class="relative">
|
||||
<svg class="pointer-events-none absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
<input x-ref="input"
|
||||
<input data-ladill-search-input x-ref="input"
|
||||
type="text"
|
||||
x-model="query"
|
||||
@focus="onFocus()"
|
||||
@@ -34,7 +34,7 @@
|
||||
<h1 class="text-2xl font-semibold text-slate-900">{{ $heading }}</h1>
|
||||
<div class="relative mt-3">
|
||||
<svg class="pointer-events-none absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
<input x-ref="input"
|
||||
<input data-ladill-search-input x-ref="input"
|
||||
type="text"
|
||||
x-model="query"
|
||||
@focus="onFocus()"
|
||||
|
||||
@@ -9,7 +9,9 @@
|
||||
['name' => 'Overview', 'route' => route('merchant.dashboard'), 'active' => request()->routeIs('merchant.dashboard'),
|
||||
'icon' => '<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12 11.2 3.05c.44-.44 1.15-.44 1.59 0L21.75 12M4.5 9.75v10.5a.75.75 0 0 0 .75.75H9.75v-6a.75.75 0 0 1 .75-.75h3a.75.75 0 0 1 .75.75v6h4.5a.75.75 0 0 0 .75-.75V9.75" />'],
|
||||
['name' => 'Storefronts', 'route' => route('merchant.storefronts.index'), 'active' => request()->routeIs('merchant.storefronts.*'),
|
||||
'icon' => '<g transform="scale(1.7143)" stroke-linecap="round" stroke-linejoin="round" vector-effect="non-scaling-stroke"><path d="M1.5 8.5V13C1.5 13.1326 1.55268 13.2598 1.64645 13.3536C1.74021 13.4473 1.86739 13.5 2 13.5H12C12.1326 13.5 12.2598 13.4473 12.3536 13.3536C12.4473 13.2598 12.5 13.1326 12.5 13V8.5"/><path d="M8 8.5V13.5"/><path d="M1.5 10H8"/><path d="M0.5 4L2 0.5H12L13.5 4H0.5Z"/><path d="M4.75 4V5C4.75 5.53043 4.53929 6.03914 4.16421 6.41421C3.78914 6.78929 3.28043 7 2.75 7H2.47C1.93957 7 1.43086 6.78929 1.05579 6.41421C0.680714 6.03914 0.47 5.53043 0.47 5V4"/><path d="M9.25 4V5C9.25 5.53043 9.03929 6.03914 8.66421 6.41421C8.28914 6.78929 7.78043 7 7.25 7H6.75C6.21957 7 5.71086 6.78929 5.33579 6.41421C4.96071 6.03914 4.75 5.53043 4.75 5V4"/><path d="M13.5 4V5C13.5 5.53043 13.2893 6.03914 12.9142 6.41421C12.5391 6.78929 12.0304 7 11.5 7H11.25C10.7196 7 10.2109 6.78929 9.83579 6.41421C9.46071 6.03914 9.25 5.53043 9.25 5V4"/></g>'],
|
||||
'icon' => '<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 21v-7.5a.75.75 0 0 1 .75-.75h3a.75.75 0 0 1 .75.75V21m-4.5 0H2.36m11.14 0H18m0 0h3.64m-1.39 0V9.349M3.75 21V9.349m0 0a3.001 3.001 0 0 0 3.75-.615A2.993 2.993 0 0 0 9.75 9.75c.896 0 1.7-.393 2.25-1.016a2.993 2.993 0 0 0 2.25 1.016c.896 0 1.7-.393 2.25-1.015a3.001 3.001 0 0 0 3.75.614m-16.5 0a3.004 3.004 0 0 1-.621-4.72l1.189-1.19A1.5 1.5 0 0 1 5.378 3h13.243a1.5 1.5 0 0 1 1.06.44l1.19 1.189a3 3 0 0 1-.621 4.72M6.75 21v-2.25a.75.75 0 0 1 .75-.75h3a.75.75 0 0 1 .75.75V21" />'],
|
||||
['name' => 'Products', 'route' => route('merchant.products.index'), 'active' => request()->routeIs('merchant.products.*'),
|
||||
'icon' => '<path stroke-linecap="round" stroke-linejoin="round" d="m21 7.5-9-5.25L3 7.5m18 0-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9" />'],
|
||||
['name' => 'Orders', 'route' => route('merchant.orders.index'), 'active' => request()->routeIs('merchant.orders.*'),
|
||||
'icon' => '<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m-3-2.818.879.659c1.171.879 3.07.879 4.242 0 1.172-.879 1.172-2.303 0-3.182C13.536 12.219 12.768 12 12 12c-.725 0-1.45-.22-2.003-.659-1.106-.879-1.106-2.303 0-3.182s2.9-.879 4.006 0l.415.33M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />'],
|
||||
['name' => 'Payouts', 'route' => route('merchant.payouts'), 'active' => request()->routeIs('merchant.payouts'),
|
||||
@@ -23,8 +25,6 @@
|
||||
<span>{{ $item['name'] }}</span>
|
||||
</a>
|
||||
@endforeach
|
||||
<p class="px-3 pb-1 pt-5 text-[10px] font-bold uppercase tracking-widest text-slate-400">Account</p>
|
||||
@include('partials.sidebar-support')
|
||||
</nav>
|
||||
|
||||
<div class="shrink-0 border-t border-slate-100 px-3 py-3">
|
||||
|
||||
@@ -1,11 +1,19 @@
|
||||
@if (auth()->check())
|
||||
@php $authPing = 'https://'.config('app.auth_domain').'/sso/ping'; @endphp
|
||||
{{-- Same-site pings keep the shared auth.ladill.com session warm while using this app. --}}
|
||||
<iframe src="{{ $authPing }}" hidden width="0" height="0" title=""></iframe>
|
||||
@php
|
||||
$authPing = 'https://'.config('app.auth_domain').'/sso/ping';
|
||||
$platformSignedOutUrl = route('sso.platform-signed-out', ['redirect' => url()->current()]);
|
||||
@endphp
|
||||
<script>
|
||||
(function () {
|
||||
const pingUrl = @js($authPing);
|
||||
const ping = () => fetch(pingUrl, { credentials: 'include', mode: 'no-cors' }).catch(() => {});
|
||||
const signedOutUrl = @js($platformSignedOutUrl);
|
||||
const ping = () => fetch(pingUrl, { credentials: 'include' })
|
||||
.then((response) => {
|
||||
if (response.status === 401) {
|
||||
window.location.href = signedOutUrl;
|
||||
}
|
||||
})
|
||||
.catch(() => {});
|
||||
ping();
|
||||
setInterval(ping, 5 * 60 * 1000);
|
||||
})();
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
{{-- Account switcher (desktop) — only when the user belongs to more than one account. --}}
|
||||
@if (isset($accessibleAccounts) && $accessibleAccounts->count() > 1)
|
||||
<div x-data="{ accountSwitcherOpen: false }" @click.outside="accountSwitcherOpen = false" class="relative hidden lg:block">
|
||||
<button type="button" @click="accountSwitcherOpen = !accountSwitcherOpen"
|
||||
class="inline-flex items-center gap-1.5 rounded-full border border-slate-200 px-3 py-2 text-sm text-slate-700 transition hover:bg-slate-50">
|
||||
<span class="max-w-[140px] truncate">{{ $actingAccount->name ?? $actingAccount->email }}</span>
|
||||
<svg class="h-4 w-4 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m19 9-7 7-7-7"/></svg>
|
||||
</button>
|
||||
<div x-show="accountSwitcherOpen" x-cloak x-transition
|
||||
class="absolute right-0 z-30 mt-2 w-60 rounded-xl border border-slate-200 bg-white p-1 shadow-lg">
|
||||
<p class="px-3 py-1.5 text-[10px] font-bold uppercase tracking-widest text-slate-400">Switch account</p>
|
||||
@foreach ($accessibleAccounts as $acctOption)
|
||||
<form method="POST" action="{{ route('account.switch') }}">
|
||||
@csrf
|
||||
<input type="hidden" name="account" value="{{ $acctOption->id }}">
|
||||
<button type="submit" class="flex w-full items-center justify-between rounded-lg px-3 py-2 text-left text-sm hover:bg-slate-50 {{ $acctOption->id === $actingAccount->id ? 'font-semibold text-indigo-700' : 'text-slate-700' }}">
|
||||
<span class="truncate">{{ $acctOption->id === auth()->id() ? 'My account' : ($acctOption->name ?? $acctOption->email) }}</span>
|
||||
@if ($acctOption->id === $actingAccount->id)<span class="text-indigo-600">✓</span>@endif
|
||||
</button>
|
||||
</form>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@@ -0,0 +1,45 @@
|
||||
{{--
|
||||
Top-right header widgets:
|
||||
Mobile — Afia + launcher only (profile/notifications live in bottom nav).
|
||||
Desktop — Afia → notifications → launcher → divider → avatar dropdown.
|
||||
--}}
|
||||
@php
|
||||
$topbarUser = $user ?? auth()->user();
|
||||
$initials = collect(explode(' ', trim((string) $topbarUser?->name)))
|
||||
->filter()->take(2)->map(fn ($p) => strtoupper(substr($p, 0, 1)))->implode('');
|
||||
$avatarUrl = $topbarUser && method_exists($topbarUser, 'avatarUrl')
|
||||
? $topbarUser->avatarUrl()
|
||||
: ($topbarUser?->avatar_url ?? null);
|
||||
$showUserHeader = $showUser ?? true;
|
||||
@endphp
|
||||
|
||||
@includeIf('partials.afia-button', ['compact' => true])
|
||||
|
||||
@includeIf('partials.notification-dropdown')
|
||||
|
||||
@include('partials.launcher')
|
||||
|
||||
@includeIf('partials.topbar-widgets-mid')
|
||||
|
||||
<div class="hidden h-8 w-px bg-slate-200 lg:block"></div>
|
||||
|
||||
<div class="relative hidden lg:block" x-data="{ profileOpen: false }" @click.outside="profileOpen = false" @keydown.escape.window="profileOpen = false">
|
||||
<button type="button" @click="profileOpen = !profileOpen"
|
||||
class="inline-flex items-center gap-2 rounded-full border border-slate-200 px-2 py-1.5 text-slate-700 transition hover:bg-slate-50">
|
||||
@if ($avatarUrl)
|
||||
<img src="{{ $avatarUrl }}" alt="Avatar" class="h-8 w-8 rounded-full object-cover ring-1 ring-slate-200">
|
||||
@else
|
||||
<span class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-slate-900 text-xs font-semibold text-white">{{ $initials !== '' ? $initials : 'U' }}</span>
|
||||
@endif
|
||||
<svg class="h-4 w-4 text-slate-500" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m19 9-7 7-7-7"/></svg>
|
||||
</button>
|
||||
|
||||
<div x-show="profileOpen" x-cloak x-transition
|
||||
class="absolute right-0 z-50 mt-2 w-64 rounded-xl border border-slate-200 bg-white shadow-lg">
|
||||
@include('partials.user-profile-menu', [
|
||||
'items' => \App\Support\UserProfileMenu::items($topbarUser),
|
||||
'user' => $topbarUser,
|
||||
'showUser' => $showUserHeader,
|
||||
])
|
||||
</div>
|
||||
</div>
|
||||
@@ -15,128 +15,15 @@
|
||||
@include('partials.mobile-topbar-title')
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
@if (isset($accessibleAccounts) && $accessibleAccounts->count() > 1)
|
||||
<div x-data="{ open: false }" class="relative hidden lg:block">
|
||||
<button @click="open = !open" class="inline-flex items-center gap-1.5 rounded-full border border-slate-200 px-3 py-2 text-sm text-slate-700 hover:bg-slate-50">
|
||||
<span class="max-w-[120px] truncate">{{ $actingAccount->name ?? $actingAccount->email }}</span>
|
||||
<svg class="h-4 w-4 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m19 9-7 7-7-7"/></svg>
|
||||
</button>
|
||||
<div x-show="open" x-cloak @click.outside="open = false" class="absolute right-0 z-30 mt-2 w-60 rounded-xl border border-slate-200 bg-white p-1 shadow-lg">
|
||||
<p class="px-3 py-1.5 text-[10px] font-bold uppercase tracking-widest text-slate-400">Switch account</p>
|
||||
@foreach ($accessibleAccounts as $acctOption)
|
||||
<form method="POST" action="{{ route('account.switch') }}">
|
||||
@csrf
|
||||
<input type="hidden" name="account" value="{{ $acctOption->id }}">
|
||||
<button type="submit" class="flex w-full items-center justify-between rounded-lg px-3 py-2 text-left text-sm hover:bg-slate-50 {{ $acctOption->id === $actingAccount->id ? 'font-semibold text-indigo-700' : 'text-slate-700' }}">
|
||||
<span class="truncate">{{ $acctOption->id === auth()->id() ? 'My account' : ($acctOption->name ?? $acctOption->email) }}</span>
|
||||
@if ($acctOption->id === $actingAccount->id)<span class="text-indigo-600">✓</span>@endif
|
||||
</button>
|
||||
</form>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="relative hidden lg:block"
|
||||
x-data="notificationDropdown({
|
||||
unreadUrl: {{ \Illuminate\Support\Js::from(route('notifications.unread')) }},
|
||||
markReadUrl: {{ \Illuminate\Support\Js::from(route('notifications.mark-read', ['id' => '__ID__'])) }},
|
||||
markAllReadUrl: {{ \Illuminate\Support\Js::from(route('notifications.mark-all-read')) }},
|
||||
indexUrl: {{ \Illuminate\Support\Js::from(route('notifications.index')) }},
|
||||
csrfToken: {{ \Illuminate\Support\Js::from(csrf_token()) }},
|
||||
})"
|
||||
@click.outside="open = false">
|
||||
<button type="button"
|
||||
@click="toggle()"
|
||||
class="relative inline-flex items-center justify-center rounded-full border border-slate-200 p-2 text-slate-600 transition hover:bg-slate-50"
|
||||
aria-label="Notifications">
|
||||
<svg class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.8" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0" />
|
||||
</svg>
|
||||
<span x-show="unreadCount > 0"
|
||||
x-cloak
|
||||
x-text="unreadCount > 9 ? '9+' : unreadCount"
|
||||
class="absolute -right-1 -top-1 inline-flex min-w-5 items-center justify-center rounded-full bg-rose-500 px-1.5 py-0.5 text-[10px] font-semibold text-white"></span>
|
||||
</button>
|
||||
|
||||
<div x-show="open"
|
||||
x-cloak
|
||||
x-transition
|
||||
class="absolute right-0 z-50 mt-2 w-80 origin-top-right rounded-xl border border-slate-200 bg-white shadow-lg">
|
||||
<div class="flex items-center justify-between border-b border-slate-100 px-4 py-3">
|
||||
<h3 class="text-sm font-semibold text-slate-900">Notifications</h3>
|
||||
<button type="button"
|
||||
x-show="unreadCount > 0"
|
||||
@click="markAllRead()"
|
||||
class="text-xs font-medium text-indigo-600 hover:text-indigo-700">
|
||||
Mark all read
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="max-h-80 overflow-y-auto">
|
||||
<template x-if="loading">
|
||||
<div class="px-4 py-6 text-center text-xs text-slate-400">Loading…</div>
|
||||
</template>
|
||||
<template x-if="!loading && notifications.length === 0">
|
||||
<div class="px-4 py-8 text-center text-sm text-slate-500">No notifications yet</div>
|
||||
</template>
|
||||
<template x-if="!loading && notifications.length > 0">
|
||||
<div class="divide-y divide-slate-100">
|
||||
<template x-for="notification in notifications" :key="notification.id">
|
||||
<a :href="notification.url || '#'"
|
||||
@click="markRead(notification.id)"
|
||||
class="flex items-start gap-3 px-4 py-3 transition hover:bg-slate-50">
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="truncate text-sm font-medium text-slate-900" x-text="notification.title"></p>
|
||||
<p class="line-clamp-2 text-xs text-slate-500" x-text="notification.message"></p>
|
||||
<p class="mt-1 text-[11px] text-slate-400" x-text="notification.created_at"></p>
|
||||
</div>
|
||||
</a>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-slate-100 px-4 py-2.5">
|
||||
<a :href="indexUrl" class="block text-center text-xs font-medium text-slate-600 hover:text-slate-900">
|
||||
View all notifications
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative hidden lg:block" x-data="{ profileOpen: false }" @click.outside="profileOpen = false">
|
||||
<button type="button"
|
||||
@click="profileOpen = !profileOpen"
|
||||
class="inline-flex items-center gap-2 rounded-full border border-slate-200 px-2 py-1.5 text-slate-700 hover:bg-slate-50">
|
||||
@if ($user?->avatarUrl())
|
||||
<img src="{{ $user->avatarUrl() }}" alt="Avatar" class="h-8 w-8 rounded-full object-cover ring-1 ring-slate-200">
|
||||
@else
|
||||
<span class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-slate-900 text-xs font-semibold text-white">
|
||||
{{ $initials !== '' ? $initials : 'U' }}
|
||||
</span>
|
||||
@endif
|
||||
<svg class="h-4 w-4 text-slate-500" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m19 9-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div x-show="profileOpen" x-cloak x-transition @click.outside="profileOpen = false"
|
||||
class="absolute right-0 z-20 mt-2 w-48 rounded-xl border border-slate-200 bg-white p-1 shadow-lg">
|
||||
<a href="{{ route('account.settings') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Settings</a>
|
||||
<a href="{{ ladill_account_url('account-settings') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Account Settings</a>
|
||||
<a href="{{ route('merchant.dashboard') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Dashboard</a>
|
||||
<form method="POST" action="{{ route('logout') }}">
|
||||
@csrf
|
||||
<button type="submit" class="w-full rounded-lg px-3 py-2 text-left text-sm text-rose-600 hover:bg-rose-50">Logout</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
@auth
|
||||
@include('partials.afia-button', ['compact' => true])
|
||||
@includeIf('partials.topbar-account-switcher')
|
||||
@includeIf('partials.topbar-widgets-prepend')
|
||||
@include('partials.topbar-desktop-widgets', ['user' => $user ?? $u ?? auth()->user(), 'showUser' => true])
|
||||
@includeIf('partials.topbar-widgets-append')
|
||||
@else
|
||||
<a href="{{ route('login') }}" class="btn-primary">Sign in</a>
|
||||
@include('partials.launcher')
|
||||
@endauth
|
||||
|
||||
@include('partials.launcher')
|
||||
</div>
|
||||
</header>
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
{{-- Mobile cart icon (after avatar controls). --}}
|
||||
@if (! empty($cartRoute))
|
||||
@include('partials.mobile-header-cart', [
|
||||
'cartUrl' => $cartRoute,
|
||||
'cartCount' => $cartCount ?? 0,
|
||||
])
|
||||
@endif
|
||||
@@ -0,0 +1,10 @@
|
||||
{{-- Desktop cart pill (between launcher and avatar divider). --}}
|
||||
@if (! empty($cartRoute))
|
||||
<a href="{{ $cartRoute }}"
|
||||
class="hidden items-center gap-2 rounded-full border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 transition hover:bg-slate-50 lg:inline-flex">
|
||||
<span>Cart</span>
|
||||
@if (($cartCount ?? 0) > 0)
|
||||
<span class="inline-flex min-w-5 items-center justify-center rounded-full bg-slate-900 px-1.5 py-0.5 text-[11px] font-semibold text-white">{{ $cartCount }}</span>
|
||||
@endif
|
||||
</a>
|
||||
@endif
|
||||
@@ -36,491 +36,23 @@
|
||||
@endphp
|
||||
|
||||
<header class="flex items-center justify-between h-16 border-b border-slate-200 bg-white px-6"
|
||||
x-data="afiaChat({
|
||||
chatUrl: {{ \Illuminate\Support\Js::from(route('user.ai.chat')) }},
|
||||
csrfToken: {{ \Illuminate\Support\Js::from(csrf_token()) }},
|
||||
currentPage: {{ \Illuminate\Support\Js::from(request()->path()) }},
|
||||
})"
|
||||
@keydown.escape.window="handleEscape()">
|
||||
>
|
||||
<div class="flex items-center gap-3 flex-1 min-w-0">
|
||||
<button @click="sidebarOpen = !sidebarOpen" class="lg:hidden shrink-0 text-slate-500 hover:text-slate-700">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg>
|
||||
</button>
|
||||
|
||||
{{-- Search Bar --}}
|
||||
<div class="relative hidden w-full max-w-md lg:block" x-data="topbarSearch()" @click.outside="open = false" @keydown.escape.window="open = false">
|
||||
<div class="relative">
|
||||
<svg class="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
<input type="text"
|
||||
x-model="query"
|
||||
@focus="onFocus()"
|
||||
@input.debounce.200ms="search()"
|
||||
@keydown.arrow-down.prevent="moveDown()"
|
||||
@keydown.arrow-up.prevent="moveUp()"
|
||||
@keydown.enter.prevent="go()"
|
||||
placeholder="Search domains, hosting, email, SMTP…"
|
||||
class="w-full rounded-xl border border-slate-200 bg-slate-50 py-2 pl-9 pr-10 text-sm text-slate-700 placeholder-slate-400 transition focus:border-indigo-300 focus:bg-white focus:ring-2 focus:ring-indigo-100 focus:outline-none">
|
||||
<kbd class="pointer-events-none absolute right-3 top-1/2 hidden -translate-y-1/2 rounded-md border border-slate-200 bg-white px-1.5 py-0.5 text-[10px] font-medium text-slate-400 sm:inline-block">/</kbd>
|
||||
</div>
|
||||
|
||||
{{-- Results dropdown --}}
|
||||
<div x-show="open && (results.length > 0 || (query.length >= 2 && !loading))"
|
||||
x-cloak
|
||||
x-transition.opacity.duration.150ms
|
||||
class="absolute left-0 top-full z-30 mt-1.5 w-full overflow-hidden rounded-xl border border-slate-200 bg-white shadow-lg">
|
||||
<template x-if="loading">
|
||||
<div class="px-4 py-3 text-center text-xs text-slate-400">Searching…</div>
|
||||
</template>
|
||||
<template x-if="!loading && results.length === 0 && query.length >= 2">
|
||||
<div class="px-4 py-3 text-center text-xs text-slate-500">No results for "<span x-text="query" class="font-medium"></span>"</div>
|
||||
</template>
|
||||
<template x-if="!loading && results.length > 0">
|
||||
<ul class="max-h-72 overflow-y-auto py-1">
|
||||
<template x-for="(item, idx) in results" :key="item.url">
|
||||
<li>
|
||||
<a :href="item.url"
|
||||
:class="idx === active ? 'bg-indigo-50 text-indigo-700' : 'text-slate-700'"
|
||||
@mouseenter="active = idx"
|
||||
class="flex items-center gap-3 px-4 py-2.5 text-sm transition hover:bg-indigo-50">
|
||||
<span class="flex h-7 w-7 shrink-0 items-center justify-center rounded-lg"
|
||||
:class="{
|
||||
'bg-blue-100 text-blue-600': item.type === 'domain',
|
||||
'bg-teal-100 text-teal-600': item.type === 'hosting',
|
||||
'bg-sky-100 text-sky-600': item.type === 'email',
|
||||
'bg-violet-100 text-violet-600': item.type === 'smtp',
|
||||
'bg-amber-100 text-amber-600': item.type === 'ticket',
|
||||
'bg-orange-100 text-orange-600': item.type === 'order',
|
||||
'bg-slate-100 text-slate-600': !['domain','hosting','email','smtp','ticket','order'].includes(item.type),
|
||||
}">
|
||||
<template x-if="item.type === 'domain'">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244"/></svg>
|
||||
</template>
|
||||
<template x-if="item.type !== 'domain'">
|
||||
<svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/></svg>
|
||||
</template>
|
||||
</span>
|
||||
<span class="min-w-0 flex-1">
|
||||
<span class="block truncate font-medium leading-tight" x-text="item.title"></span>
|
||||
<span class="block truncate text-xs text-slate-400" x-text="item.subtitle"></span>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="relative hidden lg:block"
|
||||
x-data="notificationDropdown({
|
||||
unreadUrl: {{ \Illuminate\Support\Js::from(route('user.notifications.unread')) }},
|
||||
markReadUrl: {{ \Illuminate\Support\Js::from(route('user.notifications.mark-read', ['id' => '__ID__'])) }},
|
||||
markAllReadUrl: {{ \Illuminate\Support\Js::from(route('user.notifications.mark-all-read')) }},
|
||||
indexUrl: {{ \Illuminate\Support\Js::from(route('user.notifications.index')) }},
|
||||
csrfToken: {{ \Illuminate\Support\Js::from(csrf_token()) }},
|
||||
})"
|
||||
@click.outside="open = false">
|
||||
<button type="button"
|
||||
@click="toggle()"
|
||||
class="relative inline-flex items-center justify-center rounded-full border border-slate-200 p-2 text-slate-600 transition hover:bg-slate-50"
|
||||
aria-label="Notifications">
|
||||
<svg class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.8" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0" />
|
||||
</svg>
|
||||
<span x-show="unreadCount > 0"
|
||||
x-cloak
|
||||
x-text="unreadCount > 9 ? '9+' : unreadCount"
|
||||
class="absolute -right-1 -top-1 inline-flex min-w-5 items-center justify-center rounded-full bg-rose-500 px-1.5 py-0.5 text-[10px] font-semibold text-white"></span>
|
||||
</button>
|
||||
|
||||
{{-- Notification dropdown --}}
|
||||
<div x-show="open"
|
||||
x-cloak
|
||||
x-transition:enter="transition ease-out duration-150"
|
||||
x-transition:enter-start="opacity-0 scale-95"
|
||||
x-transition:enter-end="opacity-100 scale-100"
|
||||
x-transition:leave="transition ease-in duration-100"
|
||||
x-transition:leave-start="opacity-100 scale-100"
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
class="absolute right-0 z-50 mt-2 w-80 origin-top-right rounded-xl border border-slate-200 bg-white shadow-lg">
|
||||
<div class="flex items-center justify-between border-b border-slate-100 px-4 py-3">
|
||||
<h3 class="text-sm font-semibold text-slate-900">Notifications</h3>
|
||||
<button type="button"
|
||||
x-show="unreadCount > 0"
|
||||
@click="markAllRead()"
|
||||
class="text-xs font-medium text-indigo-600 hover:text-indigo-700">
|
||||
Mark all read
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="max-h-80 overflow-y-auto">
|
||||
<template x-if="loading">
|
||||
<div class="px-4 py-6 text-center">
|
||||
<svg class="mx-auto h-5 w-5 animate-spin text-slate-400" 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 12h4z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template x-if="!loading && notifications.length === 0">
|
||||
<div class="px-4 py-8 text-center">
|
||||
<svg class="mx-auto h-10 w-10 text-slate-300" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0" />
|
||||
</svg>
|
||||
<p class="mt-2 text-sm text-slate-500">No notifications yet</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template x-if="!loading && notifications.length > 0">
|
||||
<div class="divide-y divide-slate-100">
|
||||
<template x-for="notification in notifications" :key="notification.id">
|
||||
<a :href="notification.url || '#'"
|
||||
@click="markRead(notification.id)"
|
||||
class="flex items-start gap-3 px-4 py-3 transition hover:bg-slate-50">
|
||||
<span class="mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded-full"
|
||||
:class="getIconBg(notification.icon)">
|
||||
<template x-if="notification.icon === 'website'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M6.75 7.5l3 2.25-3 2.25m4.5 0h3M4.5 19.5h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15A2.25 2.25 0 0 0 2.25 6.75v10.5A2.25 2.25 0 0 0 4.5 19.5Z"/></svg>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'domain'">
|
||||
<span class="inline-flex" :class="getIconColor(notification.icon)">
|
||||
{!! \App\Support\DomainGlobeIcon::svg('h-4 w-4') !!}
|
||||
</span>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'hosting'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 14.25h13.5m-13.5 0a3 3 0 0 1-3-3m3 3a3 3 0 1 0 0 6h13.5a3 3 0 1 0 0-6m-16.5-3a3 3 0 0 1 3-3h13.5a3 3 0 0 1 3 3m-19.5 0a4.5 4.5 0 0 1 .9-2.7L5.737 5.1a3.375 3.375 0 0 1 2.7-1.35h7.126c1.062 0 2.062.5 2.7 1.35l2.587 3.45a4.5 4.5 0 0 1 .9 2.7m0 0a3 3 0 0 1-3 3m0 3h.008v.008h-.008v-.008Zm0-6h.008v.008h-.008v-.008Zm-3 6h.008v.008h-.008v-.008Zm0-6h.008v.008h-.008v-.008Z"/></svg>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'email'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"/></svg>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'billing'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M2.25 8.25h19.5M2.25 9h19.5m-16.5 5.25h6m-6 2.25h3m-3.75 3h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25v10.5A2.25 2.25 0 0 0 4.5 19.5Z"/></svg>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'lead'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0"/></svg>
|
||||
</template>
|
||||
<template x-if="notification.icon === 'success'">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/></svg>
|
||||
</template>
|
||||
<template x-if="!['website','domain','hosting','email','billing','lead','success'].includes(notification.icon)">
|
||||
<svg class="h-4 w-4" :class="getIconColor(notification.icon)" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9a6 6 0 1 0-12 0v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.08 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0"/></svg>
|
||||
</template>
|
||||
</span>
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="text-sm font-medium text-slate-900 truncate" x-text="notification.title"></p>
|
||||
<p class="text-xs text-slate-500 line-clamp-2" x-text="notification.message"></p>
|
||||
<p class="mt-1 text-[11px] text-slate-400" x-text="notification.created_at"></p>
|
||||
</div>
|
||||
</a>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-slate-100 px-4 py-2.5">
|
||||
<a :href="indexUrl" class="block text-center text-xs font-medium text-slate-600 hover:text-slate-900">
|
||||
View all notifications
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden h-8 w-px bg-slate-200 lg:block"></div>
|
||||
|
||||
<a href="{{ $cartRoute }}"
|
||||
class="hidden items-center gap-2 rounded-full border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 transition hover:bg-slate-50 lg:inline-flex">
|
||||
<span>Cart</span>
|
||||
@if ($cartCount > 0)
|
||||
<span class="inline-flex min-w-5 items-center justify-center rounded-full bg-slate-900 px-1.5 py-0.5 text-[11px] font-semibold text-white">{{ $cartCount }}</span>
|
||||
@endif
|
||||
</a>
|
||||
|
||||
<div class="relative hidden lg:block">
|
||||
<button type="button"
|
||||
@click="profileOpen = !profileOpen"
|
||||
class="inline-flex items-center gap-2 rounded-full border border-slate-200 px-2 py-1.5 text-slate-700 hover:bg-slate-50">
|
||||
@if ($user?->avatarUrl())
|
||||
<img src="{{ $user->avatarUrl() }}" alt="Avatar" class="h-8 w-8 rounded-full object-cover ring-1 ring-slate-200">
|
||||
@else
|
||||
<span class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-slate-900 text-xs font-semibold text-white">
|
||||
{{ $initials !== '' ? $initials : 'U' }}
|
||||
</span>
|
||||
@endif
|
||||
<svg class="h-4 w-4 text-slate-500" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m19 9-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div x-show="profileOpen" x-cloak x-transition @click.outside="profileOpen = false"
|
||||
class="absolute right-0 z-20 mt-2 w-48 rounded-xl border border-slate-200 bg-white p-1 shadow-lg">
|
||||
<a href="{{ route('profile.edit') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Profile</a>
|
||||
<a href="{{ route('account.settings') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Account Settings</a>
|
||||
<a href="{{ route('merchant.dashboard') }}" class="block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100">Dashboard</a>
|
||||
<form method="POST" action="{{ route('logout') }}">
|
||||
@csrf
|
||||
<button type="submit" class="w-full rounded-lg px-3 py-2 text-left text-sm text-rose-600 hover:bg-rose-50">Logout</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@include('partials.mobile-header-cart', [
|
||||
'cartUrl' => $cartRoute,
|
||||
'cartCount' => $cartCount,
|
||||
])
|
||||
|
||||
<button type="button"
|
||||
@click="openAfia()"
|
||||
class="inline-flex items-center gap-2 rounded-xl bg-gradient-to-r from-indigo-700 via-blue-600 to-emerald-400 px-4 py-2 text-sm font-semibold text-white shadow-sm transition hover:opacity-95">
|
||||
<svg class="h-4 w-4" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path d="M12 2.25c.414 0 .75.336.75.75a5.25 5.25 0 0 0 5.25 5.25.75.75 0 0 1 0 1.5A5.25 5.25 0 0 0 12.75 15a.75.75 0 0 1-1.5 0A5.25 5.25 0 0 0 6 9.75a.75.75 0 0 1 0-1.5A5.25 5.25 0 0 0 11.25 3a.75.75 0 0 1 .75-.75Zm6.75 11.25a.75.75 0 0 1 .75.75A2.25 2.25 0 0 0 21.75 16.5a.75.75 0 0 1 0 1.5A2.25 2.25 0 0 0 19.5 20.25a.75.75 0 0 1-1.5 0A2.25 2.25 0 0 0 15.75 18a.75.75 0 0 1 0-1.5A2.25 2.25 0 0 0 18 14.25a.75.75 0 0 1 .75-.75ZM5.25 14.25a.75.75 0 0 1 .75.75 3 3 0 0 0 3 3 .75.75 0 0 1 0 1.5 3 3 0 0 0-3 3 .75.75 0 0 1-1.5 0 3 3 0 0 0-3-3 .75.75 0 0 1 0-1.5 3 3 0 0 0 3-3 .75.75 0 0 1 .75-.75Z"/>
|
||||
</svg>
|
||||
<span>AI</span>
|
||||
</button>
|
||||
|
||||
{{-- All-apps launcher (shared, config-driven; see resources/views/partials/launcher) --}}
|
||||
@include('partials.launcher')
|
||||
<div class="flex items-center gap-3">
|
||||
@auth
|
||||
@includeIf('partials.topbar-account-switcher')
|
||||
@includeIf('partials.topbar-widgets-prepend')
|
||||
@include('partials.topbar-desktop-widgets', ['user' => $user ?? $u ?? auth()->user(), 'showUser' => true])
|
||||
@includeIf('partials.topbar-widgets-append')
|
||||
@else
|
||||
<a href="{{ route('login') }}" class="btn-primary">Sign in</a>
|
||||
@include('partials.launcher')
|
||||
@endauth
|
||||
</div>
|
||||
|
||||
{{-- Afia backdrop --}}
|
||||
<div x-show="afiaOpen"
|
||||
style="display: none;"
|
||||
x-transition.opacity.duration.200ms
|
||||
class="fixed inset-0 z-40 bg-black/20 backdrop-blur-[2px]"
|
||||
@click="closeAfia()"></div>
|
||||
|
||||
{{-- Afia slide-over panel --}}
|
||||
<section x-show="afiaOpen"
|
||||
style="display: none;"
|
||||
x-transition:enter="transition transform ease-out duration-250"
|
||||
x-transition:enter-start="translate-x-full"
|
||||
x-transition:enter-end="translate-x-0"
|
||||
x-transition:leave="transition transform ease-in duration-200"
|
||||
x-transition:leave-start="translate-x-0"
|
||||
x-transition:leave-end="translate-x-full"
|
||||
class="fixed inset-y-0 right-0 z-50 flex w-full max-w-md flex-col bg-white shadow-2xl sm:rounded-l-2xl">
|
||||
|
||||
{{-- Panel header --}}
|
||||
<div class="flex items-center justify-between px-5 py-3.5">
|
||||
<div class="flex items-center gap-2.5">
|
||||
<span class="relative flex h-8 w-8 shrink-0 items-center justify-center">
|
||||
<svg viewBox="0 0 36 36" class="h-8 w-8" aria-hidden="true">
|
||||
<defs>
|
||||
<radialGradient id="afia-orb-h" cx="40%" cy="35%" r="60%">
|
||||
<stop offset="0%" stop-color="#a5b4fc"/>
|
||||
<stop offset="50%" stop-color="#6366f1"/>
|
||||
<stop offset="100%" stop-color="#3730a3"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<circle cx="18" cy="18" r="14" fill="url(#afia-orb-h)">
|
||||
<animate attributeName="r" values="14;14.8;14" dur="3s" ease="ease-in-out" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="18" cy="18" r="11" fill="none" stroke="#c7d2fe" stroke-width=".6" opacity=".5">
|
||||
<animate attributeName="r" values="11;12.5;11" dur="4s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".5;.15;.5" dur="4s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="18" cy="18" r="4" fill="white" opacity=".25">
|
||||
<animate attributeName="r" values="4;5.5;4" dur="2.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".25;.1;.25" dur="2.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle r="1.2" fill="#c7d2fe" opacity=".8">
|
||||
<animateMotion dur="3s" repeatCount="indefinite" path="M18,8 A10,10 0 1,1 17.99,8" rotate="auto"/>
|
||||
</circle>
|
||||
<circle r=".8" fill="#e0e7ff" opacity=".6">
|
||||
<animateMotion dur="4.5s" repeatCount="indefinite" path="M18,6 A12,12 0 1,0 18.01,6" rotate="auto"/>
|
||||
</circle>
|
||||
</svg>
|
||||
<span class="absolute -bottom-0.5 -right-0.5 h-2.5 w-2.5 rounded-full border-2 border-white bg-emerald-400"></span>
|
||||
</span>
|
||||
<div class="leading-tight">
|
||||
<p class="text-sm font-semibold text-slate-900">Afia</p>
|
||||
<p class="text-[11px] text-slate-400">Online</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<a href="{{ route('user.ai.index') }}"
|
||||
class="rounded-lg px-2.5 py-1.5 text-[11px] font-semibold text-slate-500 transition hover:bg-slate-100 hover:text-slate-700">
|
||||
History
|
||||
</a>
|
||||
<button type="button"
|
||||
@click="closeAfia()"
|
||||
class="rounded-lg p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-600"
|
||||
aria-label="Close">
|
||||
<svg class="h-4.5 w-4.5" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-px bg-slate-100"></div>
|
||||
|
||||
{{-- Chat body --}}
|
||||
<div class="flex-1 overflow-y-auto" x-ref="afiaScroll">
|
||||
{{-- Welcome card (shown only before conversation starts) --}}
|
||||
<div x-show="afiaMessages.length <= 1" class="px-5 py-8">
|
||||
<div class="text-center">
|
||||
<span class="mx-auto flex h-20 w-20 items-center justify-center">
|
||||
<svg viewBox="0 0 80 80" class="h-20 w-20" aria-hidden="true">
|
||||
<defs>
|
||||
<radialGradient id="afia-orb-w" cx="38%" cy="35%" r="55%">
|
||||
<stop offset="0%" stop-color="#c7d2fe"/>
|
||||
<stop offset="40%" stop-color="#818cf8"/>
|
||||
<stop offset="100%" stop-color="#3730a3"/>
|
||||
</radialGradient>
|
||||
<filter id="afia-glow-w">
|
||||
<feGaussianBlur stdDeviation="3" result="b"/>
|
||||
<feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<circle cx="40" cy="40" r="28" fill="url(#afia-orb-w)" filter="url(#afia-glow-w)">
|
||||
<animate attributeName="r" values="28;30;28" dur="3s" ease="ease-in-out" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="40" cy="40" r="22" fill="none" stroke="#e0e7ff" stroke-width=".7" opacity=".4">
|
||||
<animate attributeName="r" values="22;25;22" dur="4s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".4;.1;.4" dur="4s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="40" cy="40" r="34" fill="none" stroke="#c7d2fe" stroke-width=".4" opacity=".25">
|
||||
<animate attributeName="r" values="34;37;34" dur="5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".25;.05;.25" dur="5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="40" cy="40" r="8" fill="white" opacity=".18">
|
||||
<animate attributeName="r" values="8;11;8" dur="2.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".18;.06;.18" dur="2.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle r="2" fill="#c7d2fe" opacity=".9">
|
||||
<animateMotion dur="3s" repeatCount="indefinite" path="M40,14 A26,26 0 1,1 39.99,14" rotate="auto"/>
|
||||
</circle>
|
||||
<circle r="1.5" fill="#e0e7ff" opacity=".7">
|
||||
<animateMotion dur="5s" repeatCount="indefinite" path="M40,10 A30,30 0 1,0 40.01,10" rotate="auto"/>
|
||||
</circle>
|
||||
<circle r="1" fill="#a5b4fc" opacity=".5">
|
||||
<animateMotion dur="7s" repeatCount="indefinite" path="M40,6 A34,34 0 1,1 39.99,6" rotate="auto"/>
|
||||
</circle>
|
||||
</svg>
|
||||
</span>
|
||||
<h3 class="mt-5 text-xl font-semibold text-slate-900">How can I help you?</h3>
|
||||
<p class="mt-1.5 text-sm text-slate-400">I can help with websites, domains, hosting, email, and more.</p>
|
||||
</div>
|
||||
|
||||
<div class="mt-6 space-y-2">
|
||||
<template x-for="suggestion in afiaSuggestions" :key="suggestion">
|
||||
<button type="button"
|
||||
@click="useSuggestion(suggestion)"
|
||||
:disabled="afiaLoading"
|
||||
class="group flex w-full items-center gap-3 rounded-xl border border-slate-150 bg-white px-4 py-3 text-left text-[13px] font-medium text-slate-700 shadow-sm transition hover:border-indigo-200 hover:shadow-md disabled:cursor-not-allowed disabled:opacity-50">
|
||||
<span class="flex h-7 w-7 shrink-0 items-center justify-center rounded-lg bg-indigo-50 text-indigo-500 transition group-hover:bg-indigo-100">
|
||||
<svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m5.25 4.5 7.5 7.5-7.5 7.5m6-15 7.5 7.5-7.5 7.5"/></svg>
|
||||
</span>
|
||||
<span x-text="suggestion"></span>
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Messages --}}
|
||||
<div x-show="afiaMessages.length > 1" class="space-y-1 px-4 py-4">
|
||||
<template x-for="(message, idx) in afiaMessages" :key="idx">
|
||||
<div class="flex gap-2.5 py-1.5" :class="message.role === 'user' ? 'flex-row-reverse' : ''">
|
||||
{{-- Avatar --}}
|
||||
<template x-if="message.role === 'assistant'">
|
||||
<span class="mt-0.5 flex h-6 w-6 shrink-0 items-center justify-center">
|
||||
<svg viewBox="0 0 24 24" class="h-6 w-6" aria-hidden="true">
|
||||
<defs>
|
||||
<radialGradient id="afia-orb-m" cx="40%" cy="35%" r="60%">
|
||||
<stop offset="0%" stop-color="#a5b4fc"/>
|
||||
<stop offset="50%" stop-color="#6366f1"/>
|
||||
<stop offset="100%" stop-color="#3730a3"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<circle cx="12" cy="12" r="10" fill="url(#afia-orb-m)">
|
||||
<animate attributeName="r" values="10;10.6;10" dur="3s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="12" cy="12" r="3" fill="white" opacity=".2">
|
||||
<animate attributeName="r" values="3;4;3" dur="2.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".2;.08;.2" dur="2.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle r=".8" fill="#c7d2fe" opacity=".8">
|
||||
<animateMotion dur="3s" repeatCount="indefinite" path="M12,4 A8,8 0 1,1 11.99,4"/>
|
||||
</circle>
|
||||
</svg>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
{{-- Bubble --}}
|
||||
<div class="max-w-[82%] rounded-2xl px-3.5 py-2.5 text-[13px] leading-relaxed"
|
||||
:class="message.role === 'user'
|
||||
? 'bg-slate-900 text-white rounded-br-md'
|
||||
: 'bg-slate-50 text-slate-700 rounded-bl-md'">
|
||||
<p class="whitespace-pre-line" x-text="message.text"></p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
{{-- Typing indicator --}}
|
||||
<div x-show="afiaLoading" class="flex gap-2.5 py-1.5">
|
||||
<span class="mt-0.5 flex h-6 w-6 shrink-0 items-center justify-center">
|
||||
<svg viewBox="0 0 24 24" class="h-6 w-6" aria-hidden="true">
|
||||
<defs>
|
||||
<radialGradient id="afia-orb-t" cx="40%" cy="35%" r="60%">
|
||||
<stop offset="0%" stop-color="#a5b4fc"/>
|
||||
<stop offset="50%" stop-color="#6366f1"/>
|
||||
<stop offset="100%" stop-color="#3730a3"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<circle cx="12" cy="12" r="10" fill="url(#afia-orb-t)">
|
||||
<animate attributeName="r" values="10;10.6;10" dur="3s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="12" cy="12" r="3" fill="white" opacity=".2">
|
||||
<animate attributeName="r" values="3;4;3" dur="2.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values=".2;.08;.2" dur="2.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle r=".8" fill="#c7d2fe" opacity=".8">
|
||||
<animateMotion dur="3s" repeatCount="indefinite" path="M12,4 A8,8 0 1,1 11.99,4"/>
|
||||
</circle>
|
||||
</svg>
|
||||
</span>
|
||||
<div class="rounded-2xl rounded-bl-md bg-slate-50 px-4 py-3">
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="h-1.5 w-1.5 animate-bounce rounded-full bg-slate-400" style="animation-delay: 0ms"></span>
|
||||
<span class="h-1.5 w-1.5 animate-bounce rounded-full bg-slate-400" style="animation-delay: 150ms"></span>
|
||||
<span class="h-1.5 w-1.5 animate-bounce rounded-full bg-slate-400" style="animation-delay: 300ms"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Error banner --}}
|
||||
<div x-show="afiaError" x-cloak class="mx-4 mb-2 rounded-lg bg-rose-50 px-3 py-2 text-xs text-rose-600" x-text="afiaError"></div>
|
||||
|
||||
{{-- Input area --}}
|
||||
<div class="border-t border-slate-100 bg-white px-4 pb-4 pt-3">
|
||||
<form @submit.prevent="sendMessage()" class="flex items-end gap-2">
|
||||
<div class="relative flex-1">
|
||||
<input type="text"
|
||||
x-ref="afiaInput"
|
||||
x-model="afiaInput"
|
||||
:disabled="afiaLoading"
|
||||
placeholder="Message Afia..."
|
||||
class="w-full rounded-xl border border-slate-200 bg-slate-50 px-4 py-2.5 pr-10 text-sm text-slate-700 placeholder-slate-400 transition focus:border-indigo-300 focus:bg-white focus:outline-none focus:ring-2 focus:ring-indigo-100/80">
|
||||
</div>
|
||||
<button type="submit"
|
||||
:disabled="afiaLoading || !afiaInput.trim()"
|
||||
class="flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-slate-900 text-white transition hover:bg-slate-800 disabled:cursor-not-allowed disabled:opacity-40"
|
||||
aria-label="Send">
|
||||
<svg x-show="!afiaLoading" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5 12 3m0 0 7.5 7.5M12 3v18" />
|
||||
</svg>
|
||||
<svg x-show="afiaLoading" class="h-4 w-4 animate-spin" 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 12h4z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</form>
|
||||
<p class="mt-2 text-center text-[10px] text-slate-400">Afia can make mistakes. Verify important info.</p>
|
||||
</div>
|
||||
</section>
|
||||
</header>
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
@props([
|
||||
'items' => [],
|
||||
'user' => null,
|
||||
'showUser' => false,
|
||||
'variant' => 'dropdown',
|
||||
'onNavigate' => null,
|
||||
])
|
||||
|
||||
@php
|
||||
$linkClass = match ($variant) {
|
||||
'dark' => 'block rounded-md px-3 py-2 text-sm text-slate-200 hover:bg-slate-800',
|
||||
'sheet' => 'block rounded-xl px-4 py-3 text-sm font-medium text-slate-700 transition hover:bg-slate-100',
|
||||
default => 'block rounded-lg px-3 py-2 text-sm text-slate-700 hover:bg-slate-100',
|
||||
};
|
||||
|
||||
$logoutClass = match ($variant) {
|
||||
'dark' => 'w-full rounded-md px-3 py-2 text-left text-sm text-rose-300 hover:bg-rose-950/40',
|
||||
'sheet' => 'w-full rounded-xl px-4 py-3 text-left text-sm font-medium text-rose-600 transition hover:bg-rose-50',
|
||||
default => 'w-full rounded-lg px-3 py-2 text-left text-sm text-rose-600 hover:bg-rose-50',
|
||||
};
|
||||
|
||||
$logoutWrapperClass = match ($variant) {
|
||||
'sheet' => 'border-t border-slate-100 pt-2',
|
||||
'dark' => '',
|
||||
default => '',
|
||||
};
|
||||
|
||||
$dividerClass = match ($variant) {
|
||||
'dark' => 'my-1 border-t border-slate-800',
|
||||
default => 'my-1 border-t border-slate-100',
|
||||
};
|
||||
|
||||
$containerClass = match ($variant) {
|
||||
'dark' => 'mt-2 rounded-lg border border-slate-800 bg-slate-900 p-1',
|
||||
'sheet' => 'space-y-1 p-2 pb-4',
|
||||
default => 'p-1',
|
||||
};
|
||||
@endphp
|
||||
|
||||
<div {{ $attributes->merge(['class' => $containerClass]) }}>
|
||||
@if ($showUser && $user)
|
||||
<div class="px-3 py-2">
|
||||
<p class="truncate text-sm font-semibold text-slate-900">{{ $user->name ?? 'Your account' }}</p>
|
||||
<p class="truncate text-xs text-slate-400">{{ $user->email }}</p>
|
||||
</div>
|
||||
<div class="{{ $dividerClass }}"></div>
|
||||
@endif
|
||||
|
||||
@foreach ($items as $item)
|
||||
@if (($item['type'] ?? 'link') === 'link')
|
||||
<a href="{{ $item['href'] }}"
|
||||
class="{{ $linkClass }}"
|
||||
@if ($onNavigate) @click="{{ $onNavigate }}" @endif>
|
||||
{{ $item['label'] }}
|
||||
</a>
|
||||
@elseif (($item['type'] ?? '') === 'wallet')
|
||||
@includeIf('partials.wallet-widget', [
|
||||
'onNavigate' => $onNavigate,
|
||||
'class' => $variant === 'sheet' ? 'mx-2' : 'mx-1',
|
||||
])
|
||||
@elseif (($item['type'] ?? '') === 'logout')
|
||||
@if ($variant !== 'sheet')
|
||||
<div class="{{ $dividerClass }}"></div>
|
||||
@endif
|
||||
<form method="POST" action="{{ $item['action'] }}" class="{{ $logoutWrapperClass }}">
|
||||
@csrf
|
||||
<button type="submit" class="{{ $logoutClass }}">
|
||||
{{ $item['label'] }}
|
||||
</button>
|
||||
</form>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@@ -0,0 +1,30 @@
|
||||
{{-- Wallet balance peek (links to the account wallet on account.ladill.com). --}}
|
||||
@php
|
||||
$onNavigate = $onNavigate ?? null;
|
||||
$class = trim((string) ($class ?? 'mx-1'));
|
||||
$balanceRoute = (string) config('billing.wallet_balance_route', 'wallet.balance');
|
||||
$balanceUrl = \Illuminate\Support\Facades\Route::has($balanceRoute) ? route($balanceRoute) : null;
|
||||
$walletUrl = \Illuminate\Support\Facades\Route::has('user.wallet.index')
|
||||
? route('user.wallet.index')
|
||||
: (function_exists('ladill_account_url') ? ladill_account_url('/wallet') : '#');
|
||||
@endphp
|
||||
@if ($balanceUrl)
|
||||
<a href="{{ $walletUrl }}"
|
||||
x-data="walletWidget({ url: {{ \Illuminate\Support\Js::from($balanceUrl) }} })" x-init="load()"
|
||||
@wallet-balance-refresh.window="load()"
|
||||
@if ($onNavigate) @click="{{ $onNavigate }}" @endif
|
||||
class="{{ $class }} flex items-center justify-between gap-3 rounded-xl border border-slate-100 bg-gradient-to-r from-indigo-50 to-slate-50 px-3 py-2.5 transition hover:border-indigo-200 hover:from-indigo-100/70">
|
||||
<span class="flex items-center gap-2.5 min-w-0">
|
||||
<span class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-indigo-100 text-indigo-600">
|
||||
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="1.6" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M21 12a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 1 3 7.5m18 4.5v3.75A2.25 2.25 0 0 1 18.75 18H5.25A2.25 2.25 0 0 1 3 15.75V7.5m18 4.5h-3.75a1.5 1.5 0 0 0 0 3H21M3 7.5A2.25 2.25 0 0 1 5.25 5.25h11.25A2.25 2.25 0 0 1 18.75 7.5"/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="min-w-0">
|
||||
<span class="block text-[11px] font-medium text-slate-500">Wallet balance</span>
|
||||
<span class="block truncate text-sm font-semibold text-slate-900" x-text="display"></span>
|
||||
</span>
|
||||
</span>
|
||||
<svg class="h-4 w-4 shrink-0 text-slate-400" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m9 5 7 7-7 7"/></svg>
|
||||
</a>
|
||||
@endif
|
||||
@@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Payment</title>
|
||||
<style>
|
||||
body { font-family: system-ui, sans-serif; background: #f8fafc; color: #0f172a; display: grid; place-items: center; min-height: 100vh; margin: 0; }
|
||||
p { font-size: 0.95rem; color: #475569; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Confirming your payment…</p>
|
||||
<script>
|
||||
(function () {
|
||||
var url = @json($redirect);
|
||||
try {
|
||||
if (window.opener && !window.opener.closed) {
|
||||
window.opener.location.replace(url);
|
||||
window.close();
|
||||
return;
|
||||
}
|
||||
} catch (e) {}
|
||||
try {
|
||||
if (window.top && window.top !== window.self) {
|
||||
window.top.location.replace(url);
|
||||
return;
|
||||
}
|
||||
} catch (e) {}
|
||||
window.location.replace(url);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -6,7 +6,7 @@
|
||||
$price = number_format((float) ($c['price_ghs'] ?? 0), 2);
|
||||
$fileType = strtoupper($c['file_type'] ?? 'PDF');
|
||||
$hasCover = !empty($c['cover_path']);
|
||||
$orderUrl = route('qr.public.book.checkout', $qrCode->short_code);
|
||||
$orderUrl = $qrCode->publicPath('book/order');
|
||||
$csrfToken = csrf_token();
|
||||
@endphp
|
||||
<!DOCTYPE html>
|
||||
@@ -28,6 +28,9 @@
|
||||
showModal: false,
|
||||
showSheet: false,
|
||||
checkoutUrl: '',
|
||||
accessCode: '',
|
||||
publicKey: '',
|
||||
returnUrl: '',
|
||||
loading: false,
|
||||
errorMsg: '',
|
||||
customerName: '',
|
||||
@@ -35,8 +38,8 @@
|
||||
customerPhone: '',
|
||||
async submitOrder() {
|
||||
if (!this.customerName.trim()) { this.errorMsg = 'Enter your full name.'; return; }
|
||||
if (!this.customerEmail.trim() || !this.customerEmail.includes('@')) { this.errorMsg = 'Enter a valid email address.'; return; }
|
||||
this.loading = true; this.errorMsg = '';
|
||||
if (!this.customerPhone.trim()) { this.errorMsg = 'Enter your phone number.'; return; }
|
||||
this.loading = true; window.LadillPayCheckout?.prepare?.(); this.errorMsg = '';
|
||||
try {
|
||||
const res = await fetch(@js($orderUrl), {
|
||||
method: 'POST',
|
||||
@@ -44,17 +47,15 @@
|
||||
body: JSON.stringify({ customer_name: this.customerName, customer_email: this.customerEmail, customer_phone: this.customerPhone }),
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.error) { this.errorMsg = data.error; this.loading = false; return; }
|
||||
if (window.innerWidth < 768) {
|
||||
this.showModal = false;
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.showSheet = true;
|
||||
this.loading = false;
|
||||
} else {
|
||||
window.location.href = data.checkout_url;
|
||||
}
|
||||
if (data.error) { window.LadillPayCheckout?.cancel?.(); this.errorMsg = data.error; this.loading = false; return; }
|
||||
this.showModal = false;
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.accessCode = data.access_code || '';
|
||||
this.publicKey = data.public_key || '';
|
||||
this.returnUrl = data.callback_url || '';
|
||||
this.showSheet = true; // loading cleared when payment UI opens (ladill-pay-opened)
|
||||
} catch(e) {
|
||||
this.errorMsg = 'Network error. Please try again.';
|
||||
window.LadillPayCheckout?.cancel?.(); this.errorMsg = 'Network error. Please try again.';
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
@@ -63,7 +64,7 @@
|
||||
{{-- Left column: cover panel (desktop only) --}}
|
||||
<div class="hidden lg:flex lg:flex-col lg:items-center lg:justify-center bg-white border-r border-slate-200 px-12 py-16">
|
||||
@if($hasCover)
|
||||
<img src="{{ route('qr.public.book.cover', $qrCode->short_code) }}"
|
||||
<img src="{{ $qrCode->publicPath('cover') }}"
|
||||
alt="{{ $title }} cover"
|
||||
class="w-56 rounded-2xl object-cover shadow-xl ring-1 ring-slate-200">
|
||||
@else
|
||||
@@ -85,7 +86,7 @@
|
||||
{{-- Mobile cover header --}}
|
||||
<div class="lg:hidden bg-white border-b border-slate-200 px-6 pt-10 pb-8 flex flex-col items-center text-center">
|
||||
@if($hasCover)
|
||||
<img src="{{ route('qr.public.book.cover', $qrCode->short_code) }}"
|
||||
<img src="{{ $qrCode->publicPath('cover') }}"
|
||||
alt="{{ $title }} cover"
|
||||
class="h-48 w-32 rounded-2xl object-cover shadow-xl ring-1 ring-slate-200">
|
||||
@else
|
||||
@@ -214,11 +215,8 @@
|
||||
<input type="text" x-model="customerName"
|
||||
autocomplete="name" placeholder="Full name *"
|
||||
class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm placeholder:text-slate-400 focus:border-amber-400 focus:outline-none focus:ring-1 focus:ring-amber-400/30">
|
||||
<input type="email" x-model="customerEmail"
|
||||
autocomplete="email" placeholder="Email address *"
|
||||
class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm placeholder:text-slate-400 focus:border-amber-400 focus:outline-none focus:ring-1 focus:ring-amber-400/30">
|
||||
<input type="tel" x-model="customerPhone"
|
||||
autocomplete="tel" placeholder="Phone (optional)"
|
||||
autocomplete="tel" placeholder="Phone number *"
|
||||
class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm placeholder:text-slate-400 focus:border-amber-400 focus:outline-none focus:ring-1 focus:ring-amber-400/30">
|
||||
</div>
|
||||
|
||||
|
||||
@@ -5,8 +5,8 @@
|
||||
$hasCover = ! empty($c['cover_path']);
|
||||
$hasLogo = ! empty($c['logo_path']);
|
||||
$brand = $c['brand_color'] ?? '#4f46e5';
|
||||
$slotsUrl = route('qr.public.booking.slots', $qrCode->short_code);
|
||||
$bookUrl = route('qr.public.booking.store', $qrCode->short_code);
|
||||
$slotsUrl = $qrCode->publicPath('booking/slots');
|
||||
$bookUrl = $qrCode->publicPath('booking');
|
||||
$csrfToken = csrf_token();
|
||||
@endphp
|
||||
<!DOCTYPE html>
|
||||
@@ -37,6 +37,9 @@
|
||||
customerPhone: '',
|
||||
showSheet: false,
|
||||
checkoutUrl: '',
|
||||
accessCode: '',
|
||||
publicKey: '',
|
||||
returnUrl: '',
|
||||
services: @js($services),
|
||||
async loadSlots() {
|
||||
if (!this.date) return;
|
||||
@@ -48,15 +51,15 @@
|
||||
const data = await res.json();
|
||||
this.slots = data.slots || [];
|
||||
} catch (e) {
|
||||
this.errorMsg = 'Could not load times. Try again.';
|
||||
window.LadillPayCheckout?.cancel?.(); this.errorMsg = 'Could not load times. Try again.';
|
||||
}
|
||||
this.loadingSlots = false;
|
||||
},
|
||||
async submitBooking() {
|
||||
if (!this.customerName.trim()) { this.errorMsg = 'Enter your full name.'; return; }
|
||||
if (!this.customerEmail.includes('@')) { this.errorMsg = 'Enter a valid email.'; return; }
|
||||
if (!this.customerPhone.trim()) { this.errorMsg = 'Enter your phone number.'; return; }
|
||||
if (!this.selectedSlot) { this.errorMsg = 'Pick a time slot.'; return; }
|
||||
this.loading = true; this.errorMsg = '';
|
||||
this.loading = true; window.LadillPayCheckout?.prepare?.(); this.errorMsg = '';
|
||||
try {
|
||||
const res = await fetch(@js($bookUrl), {
|
||||
method: 'POST',
|
||||
@@ -70,27 +73,25 @@
|
||||
}),
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.error) { this.errorMsg = data.error; this.loading = false; return; }
|
||||
if (data.error) { window.LadillPayCheckout?.cancel?.(); this.errorMsg = data.error; this.loading = false; return; }
|
||||
if (data.confirmed && data.redirect_url) {
|
||||
window.location.href = data.redirect_url;
|
||||
return;
|
||||
}
|
||||
if (window.innerWidth < 768) {
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.showSheet = true;
|
||||
this.loading = false;
|
||||
} else {
|
||||
window.location.href = data.checkout_url;
|
||||
}
|
||||
this.checkoutUrl = data.checkout_url;
|
||||
this.accessCode = data.access_code || '';
|
||||
this.publicKey = data.public_key || '';
|
||||
this.returnUrl = data.callback_url || '';
|
||||
this.showSheet = true; // loading cleared when payment UI opens (ladill-pay-opened)
|
||||
} catch (e) {
|
||||
this.errorMsg = 'Network error. Please try again.';
|
||||
window.LadillPayCheckout?.cancel?.(); this.errorMsg = 'Network error. Please try again.';
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
}" class="mx-auto max-w-lg min-h-screen bg-white shadow-sm">
|
||||
<div class="border-b border-slate-100 px-6 py-8 text-center" style="background: linear-gradient(135deg, {{ $brand }}15, #fff)">
|
||||
@if($hasLogo)
|
||||
<img src="{{ route('qr.public.menu.logo', $qrCode->short_code) }}" alt="" class="mx-auto h-14 w-14 rounded-2xl object-cover ring-2 ring-white shadow">
|
||||
<img src="{{ $qrCode->publicPath('menu-logo') }}" alt="" class="mx-auto h-14 w-14 rounded-2xl object-cover ring-2 ring-white shadow">
|
||||
@endif
|
||||
<h1 class="mt-4 text-2xl font-bold text-slate-900">{{ $title }}</h1>
|
||||
@if(!empty($c['description']))
|
||||
@@ -139,8 +140,7 @@
|
||||
<div x-show="selectedSlot" x-cloak class="space-y-3">
|
||||
<p class="text-xs font-semibold uppercase tracking-widest text-slate-400">4. Your details</p>
|
||||
<input type="text" x-model="customerName" placeholder="Full name *" class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm">
|
||||
<input type="email" x-model="customerEmail" placeholder="Email *" class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm">
|
||||
<input type="tel" x-model="customerPhone" placeholder="Phone (optional)" class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm">
|
||||
<input type="tel" x-model="customerPhone" placeholder="Phone number *" class="w-full rounded-xl border border-slate-200 px-4 py-3 text-sm">
|
||||
<div x-show="errorMsg" x-cloak class="rounded-xl bg-red-50 px-4 py-3 text-sm text-red-600" x-text="errorMsg"></div>
|
||||
<button type="button" @click="submitBooking()" :disabled="loading"
|
||||
class="w-full rounded-2xl py-4 text-base font-bold text-white transition disabled:opacity-60"
|
||||
|
||||