admin/FrontOffice
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ع

Browse Source
This commit is contained in:
MeysamMoghaddam
2025-09-28 10:55:21 +03:30
parent bba9ba38e5
commit 8c03d00a4b
4 changed files with 217 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
src/FrontOffice.Main/Pages/Index.razor
View File

@@ -1,102 +1,142 @@
@attribute [Route(RouteConstants.Main.MainPage)] @attribute [Route(RouteConstants.Main.MainPage)]
@inject NavigationManager Navigation @inject NavigationManager Navigation
<PageTitle>FrontOffice Platform</PageTitle> <PageTitle>صفحه اصلی</PageTitle>
<MudContainer Class="pa-6" MaxWidth="MaxWidth.Large"> <!-- Hero -->
<MudGrid GutterSize="GutterSize.Medium"> <section id="hero" class="hero-section">
<MudContainer MaxWidth="MaxWidth.Large" Class="py-16">
<MudGrid Justify="Justify.Center" AlignItems="AlignItems.Center" Spacing="3">
<MudItem xs="12" md="6"> <MudItem xs="12" md="6">
<MudText Typo="Typo.h3" Class="mb-2">Grow your capital with curated investment packages</MudText> <MudChip T="string" Color="Color.Primary" Variant="Variant.Filled" Class="mb-3">جدید</MudChip>
<MudText Typo="Typo.body1" Class="mb-4"> <MudText Typo="Typo.h2" Class="fw-700 lh-tight mb-2">
FrontOffice combines product ownership with network-based commissions. Explore verified packages, track your earnings, and manage your team in a single dashboard. ساخت شبکه‌های هوشمند با فورسات
</MudText> </MudText>
<MudStack Direction="Row" Spacing="2"> <MudText Typo="Typo.subtitle1" Class="muted mb-6">
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="@(()=>NavigateToAuth(true))" StartIcon="@Icons.Material.Filled.PlayArrow"> پلن‌های باینری، شجره‌نامه و گزارش کارمزد ماهانه — همه در یک اپ بلazor.
Get Started </MudText>
</MudButton>
<MudButton Variant="Variant.Outlined" Color="Color.Primary" OnClick="@(()=>NavigateToAuth(false))"> <MudStack Row="true" Spacing="2" Class="mb-2">
Sign In <MudTextField @bind-Value="_email" For="@(() => _email)" Placeholder="ایمیل کاری شما" Variant="Variant.Outlined" Class="max-w-56" />
</MudButton> <MudButton Color="Color.Primary" OnClick="@JoinWaitlist">عضویت در لیست انتظار</MudButton>
</MudStack> </MudStack>
<MudText Typo="Typo.caption" Class="muted">بدون اسپم؛ هر زمان بخواهید لغو کنید.</MudText>
</MudItem> </MudItem>
<MudItem xs="12" md="6"> <MudItem xs="12" md="6">
<MudPaper Elevation="1" Class="pa-4 d-flex flex-column gap-3"> <MudPaper Elevation="6" Class="p-4 rounded-2xl preview-card">
<MudStack Spacing="2"> <MudStack Spacing="2">
<MudText Typo="Typo.subtitle1" Color="Color.Primary">Why FrontOffice?</MudText> <MudText Typo="Typo.h6">نمای لحظه‌ای</MudText>
<MudStack Direction="Row" AlignItems="AlignItems.Center" Spacing="1"> <MudDivider />
<MudIcon Icon="@Icons.Material.Filled.TrendingUp" Color="Color.Primary" /> <MudStack Row="true" Spacing="1" AlignItems="AlignItems.Center">
<MudText Typo="Typo.body2">Hybrid investment + product ownership ensures tangible value.</MudText> <MudAvatar Color="Color.Secondary" Icon="@Icons.Material.Filled.Groups" />
<MudText Typo="Typo.subtitle2">اعضای فعال</MudText>
<MudSpacer />
<MudText Typo="Typo.subtitle2" Class="fw-700">1,284</MudText>
</MudStack> </MudStack>
<MudStack Direction="Row" AlignItems="AlignItems.Center" Spacing="1"> <MudProgressLinear Value="72" Color="Color.Primary" Class="my-1" />
<MudIcon Icon="@Icons.Material.Filled.Groups" Color="Color.Primary" /> <MudStack Row="true" Spacing="1" AlignItems="AlignItems.Center">
<MudText Typo="Typo.body2">Binary network model with transparent genealogy tracking.</MudText> <MudAvatar Color="Color.Tertiary" Icon="@Icons.Material.Filled.Timeline" />
</MudStack> <MudText Typo="Typo.subtitle2">پرداختی ماهانه</MudText>
<MudStack Direction="Row" AlignItems="AlignItems.Center" Spacing="1"> <MudSpacer />
<MudIcon Icon="@Icons.Material.Filled.Payments" Color="Color.Primary" /> <MudText Typo="Typo.subtitle2" Class="fw-700">$48,970</MudText>
<MudText Typo="Typo.body2">Instant commission reports and monthly payouts.</MudText>
</MudStack> </MudStack>
<MudProgressLinear Value="54" Color="Color.Secondary" Class="my-1" />
</MudStack> </MudStack>
</MudPaper> </MudPaper>
</MudItem> </MudItem>
</MudGrid> </MudGrid>
</MudContainer>
</section>
<MudDivider Class="my-6" /> <!-- Features -->
<section id="features" class="py-14">
<MudContainer MaxWidth="MaxWidth.Large">
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 fw-700">هرچه نیاز دارید</MudText>
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="muted mb-8">سریع، آماده تولید و زیبا از ابتدا.</MudText>
<MudStack Spacing="1" Class="mb-4" AlignItems="AlignItems.Center"> <MudGrid Spacing="3" Justify="Justify.Center" Class="stretch-grid">
<MudText Typo="Typo.h4">Featured Packages</MudText> @foreach (var f in _features)
<MudText Typo="Typo.body2" Align="Align.Center" Style="max-width:600px;">
Discover curated bundles that combine digital ownership, physical products, and network rewards. Choose the plan that matches your investment horizon.
</MudText>
</MudStack>
<MudGrid GutterSize="GutterSize.Medium">
@foreach (var package in Packages)
{ {
<MudItem xs="12" sm="6" lg="4"> <MudItem xs="12" md="4" Class="d-flex">
<MudCard Class="h-100 d-flex flex-column"> <MudPaper Elevation="2" Class="p-5 rounded-2xl d-flex flex-column flex-grow-1">
<MudCardMedia Image="@package.ImageUrl" Height="180" /> <MudStack Spacing="1">
<MudCardContent Class="d-flex flex-column gap-2"> <MudAvatar Color="@f.Color" Icon="@f.Icon" />
<MudText Typo="Typo.h6">@package.Title</MudText> <MudText Typo="Typo.h6">@f.Title</MudText>
<MudText Typo="Typo.subtitle2" Color="Color.Primary">@package.Price</MudText> <MudText Typo="Typo.body2" Class="muted">@f.Body</MudText>
<MudText Typo="Typo.body2" Class="mud-truncate">@package.Summary</MudText> </MudStack>
</MudPaper>
</MudItem>
}
</MudGrid>
</MudContainer>
</section>
<!-- Pricing -->
<section id="pricing" class="py-14">
<MudContainer MaxWidth="MaxWidth.Large">
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 fw-700">قیمت‌گذاری ساده</MudText>
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="muted mb-8">رایگان شروع کنید و در صورت نیاز ارتقا دهید.</MudText>
<MudGrid Spacing="3" Justify="Justify.Center">
@foreach (var p in _plans)
{
<MudItem xs="12" md="4" Class="d-flex">
<MudCard Class="rounded-2xl d-flex flex-column flex-grow-1">
<MudCardContent Class="p-6">
<MudText Typo="Typo.overline" Class="muted">@p.Name</MudText>
<MudText Typo="Typo.h4" Class="fw-700 mb-2">@p.Price</MudText>
<MudList T="string" Dense="true">
@foreach (var item in p.Features)
{
<MudListItem>
<MudIcon Icon="@Icons.Material.Filled.CheckCircle" Size="Size.Small" Class="ml-2" />
@item
</MudListItem>
}
</MudList>
</MudCardContent> </MudCardContent>
<MudCardActions Class="mt-auto d-flex justify-space-between pa-4"> <MudCardActions Class="p-6 pt-0">
<MudButton Variant="Variant.Filled" <MudButton Color="Color.Primary" Variant="@(p.Highlight ? Variant.Filled : Variant.Outlined)" Class="w-100">انتخاب پلن</MudButton>
Color="Color.Primary"
StartIcon="@Icons.Material.Filled.ShoppingCart"
OnClick="@(()=>HandlePurchase(package))">
Buy
</MudButton>
<MudButton Variant="Variant.Outlined"
Color="Color.Primary"
OnClick="@(()=>HandleDetails(package))">
Details
</MudButton>
</MudCardActions> </MudCardActions>
</MudCard> </MudCard>
</MudItem> </MudItem>
} }
</MudGrid> </MudGrid>
</MudContainer>
</section>
<MudDivider Class="my-6" /> <!-- FAQ -->
<section id="faq" class="py-14">
<MudContainer MaxWidth="MaxWidth.Large">
<MudText Typo="Typo.h4" Align="Align.Center" Class="mb-1 fw-700">سوالات متداول</MudText>
<MudText Typo="Typo.subtitle1" Align="Align.Center" Class="muted mb-8">پاسخ به سوالات رایج راه‌اندازی و صورتحساب.</MudText>
<MudPaper Elevation="1" Class="pa-6 d-flex flex-column flex-md-row align-center justify-space-between gap-4"> <MudGrid>
<MudStack Spacing="1"> <MudItem xs="12" md="8" mdOffset="2">
<MudText Typo="Typo.h5">Ready to build your FrontOffice?</MudText> <MudExpansionPanels Elevation="1" Square="false" Class="rounded-2xl">
<MudText Typo="Typo.body2"> @foreach (var q in _faqs)
Start with a starter package, invite your partners, and monitor your income in real time. Our support team is here to help you onboard smoothly. {
</MudText> <MudExpansionPanel Text="@q.Q">
</MudStack> <MudText Typo="Typo.body2">@q.A</MudText>
<MudStack Direction="Row" Spacing="2"> </MudExpansionPanel>
<MudButton Variant="Variant.Filled" Color="Color.Secondary" OnClick="@(()=>NavigateToAuth(true))"> }
Create Account </MudExpansionPanels>
</MudButton> </MudItem>
<MudButton Variant="Variant.Outlined" Color="Color.Secondary" OnClick="ScrollToPackages"> </MudGrid>
View Packages </MudContainer>
</MudButton> </section>
<!-- CTA -->
<section id="contact" class="py-14">
<MudContainer MaxWidth="MaxWidth.Medium" Class="text-center">
<MudPaper Elevation="2" Class="p-8 rounded-2xl">
<MudText Typo="Typo.h5" Class="fw-700 mb-2">آماده‌ی راه‌اندازی هستید؟</MudText>
<MudText Typo="Typo.body1" Class="muted mb-4">ایمیل‌تان را بگذارید تا دسترسی زودهنگام بگیرید.</MudText>
<MudStack Row="true" Spacing="2" Justify="Justify.Center">
<MudTextField @bind-Value="_email" For="@(() => _email)" Placeholder="you@company.com" Variant="Variant.Outlined" Class="max-w-56" />
<MudButton Color="Color.Primary" OnClick="@JoinWaitlist">درخواست دسترسی</MudButton>
</MudStack> </MudStack>
</MudPaper> </MudPaper>
</MudContainer> </MudContainer>
</section>

63
src/FrontOffice.Main/Pages/Index.razor.cs
View File

@@ -1,38 +1,49 @@
using FrontOffice.Main.Utilities; using FrontOffice.Main.Utilities;
using MudBlazor;
namespace FrontOffice.Main.Pages; namespace FrontOffice.Main.Pages;
public partial class Index public partial class Index
{ {
private readonly IReadOnlyList<PackageCard> Packages = new List<PackageCard> private string? _email;
private void JoinWaitlist()
{ {
new("Starter Combo", "$150", "Entry-level mix of digital services and physical product vouchers.", "https://images.unsplash.com/photo-1581291518857-4e27b48ff24e?auto=format&fit=crop&w=800&q=80"), if (string.IsNullOrWhiteSpace(_email))
new("Growth Portfolio", "$420", "Balanced bundle for network builders with weekly webinars and mentor access.", "https://images.unsplash.com/photo-1503387762-592deb58ef4e?auto=format&fit=crop&w=800&q=80"), {
new("Elite Master Pack", "$980", "Premium assets, lifetime dashboard analytics, and higher binary commissions.", "https://images.unsplash.com/photo-1545239351-1141bd82e8a6?auto=format&fit=crop&w=800&q=80"), Snackbar.Add("Please enter a valid email.", Severity.Warning);
new("Product Booster", "$260", "Merchandise-focused kit with recurring inventory top-ups and customer rewards.", "https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=800&q=80"), return;
new("Network Accelerator", "$560", "Designed for team leaders<72>includes onboarding funnels and marketing credits.", "https://images.unsplash.com/photo-1521737604893-d14cc237f11d?auto=format&fit=crop&w=800&q=80"), }
new("Legacy Plan", "$1,250", "Long-term portfolio with quarterly dividends, event invitations, and VIP support.", "https://images.unsplash.com/photo-1454165205744-3b78555e5572?auto=format&fit=crop&w=800&q=80"), Snackbar.Add("You're on the list. We'll be in touch!", Severity.Success);
_email = string.Empty;
}
// Data models
private record Feature(string Title, string Body, string Icon, Color Color);
private record Plan(string Name, string Price, bool Highlight, IEnumerable<string> Features);
private record QA(string Q, string A);
// Sample data
private readonly List<Feature> _features = new()
{
new("Binary Plan Engine", "Accurate volume pairing and capping with weekly cycles.", Icons.Material.Filled.AccountTree, Color.Primary),
new("Genealogy Viewer", "See left/right legs, depth, and spillover at a glance.", Icons.Material.Filled.DeviceHub, Color.Secondary),
new("Commission Reports", "Month-by-month breakdowns with exportable statements.", Icons.Material.Filled.Assessment, Color.Tertiary),
new("KYC & Security", "Role-based access, audit logs, and 2FA-ready flows.", Icons.Material.Filled.VerifiedUser, Color.Success),
new("Payments", "Wallets, withdrawals, and reconciliation dashboards.", Icons.Material.Filled.AccountBalanceWallet, Color.Info),
new("API & Webhooks", "Integrate with CRMs, bots, and third-party services.", Icons.Material.Filled.IntegrationInstructions, Color.Dark)
}; };
private void NavigateToAuth(bool createAccount) private readonly List<Plan> _plans = new()
{ {
var target = createAccount ? RouteConstants.Auth.Phone : RouteConstants.Auth.Verify; new("Starter", "$0", false, new []{ "Up to 200 members", "Basic genealogy", "Email support" }),
Navigation.NavigateTo(target); new("Growth", "$39/mo", true, new []{ "Up to 5,000 members", "Advanced genealogy", "Commission engine", "Priority support" }),
} new("Scale", "Contact us", false, new []{ "Unlimited members", "Custom rules", "SLA & onboarding", "Dedicated success manager" }),
};
private void HandlePurchase(PackageCard package) private readonly List<QA> _faqs = new()
{ {
Navigation.NavigateTo($"{RouteConstants.Auth.Phone}?redirect=/packages/{Uri.EscapeDataString(package.Title)}"); new("Can I use my own domain?", "Yes, you can deploy behind your custom domain and SSL certificates."),
} new("Does it work with self-hosted databases?", "Absolutely. We support SQL Server, PostgreSQL, and MySQL."),
new("What payment gateways are supported?", "You can integrate Stripe, PayPal, or your own gateway via webhooks."),
private void HandleDetails(PackageCard package) new("Can I export my data?", "Yes. Export to CSV/Excel at any time from your admin dashboard."),
{ };
Navigation.NavigateTo($"/packages/{Uri.EscapeDataString(package.Title)}");
}
private void ScrollToPackages()
{
Navigation.NavigateTo("#packages", forceLoad: false);
}
private sealed record PackageCard(string Title, string Price, string Summary, string ImageUrl);
} }

40
src/FrontOffice.Main/Shared/MainLayout.razor
View File

@@ -3,11 +3,49 @@
<PageTitle>فرصت</PageTitle> <PageTitle>فرصت</PageTitle>
<MudRTLProvider RightToLeft="true"> <MudRTLProvider RightToLeft="true">
<MudThemeProvider @ref="_mudThemeProvider" Theme="CustomMudTheme.CustomMudBlazorTheme" /> <MudThemeProvider @ref="_mudThemeProvider" Theme="CustomMudTheme.CustomMudBlazorTheme" @bind-IsDarkMode="_isDark" />
<MudPopoverProvider/> <MudPopoverProvider/>
<MudDialogProvider/> <MudDialogProvider/>
<MudSnackbarProvider/> <MudSnackbarProvider/>
<MudLayout> <MudLayout>
<!-- AppBar -->
<MudAppBar Elevation="0" Color="Color.Transparent" Dense="true" Class="appbar">
<MudContainer MaxWidth="MaxWidth.Large" Class="d-flex align-center justify-space-between w-100">
<div class="d-flex align-center gap-2">
<MudAvatar Size="Size.Medium" Color="Color.Primary" Variant="Variant.Filled" Icon="@Icons.Material.Filled.AutoAwesome" Class="rounded-xl" />
<MudText Typo="Typo.h6" Class="fw-600">فورسات</MudText>
</div>
<div class="d-none d-md-flex align-center gap-4">
<MudLink Href="#features" Class="mud-link">امکانات</MudLink>
<MudLink Href="#pricing" Class="mud-link">قیمت‌ها</MudLink>
<MudLink Href="#faq" class="mud-link">سوالات متداول</MudLink>
<MudLink Href="#contact" class="mud-link">ارتباط</MudLink>
</div>
<div class="d-flex align-center gap-2">
<MudButton Variant="Variant.Outlined" Color="Color.Inherit">ورود</MudButton>
<MudButton Color="Color.Primary">شروع کنید</MudButton>
<MudIconButton Title="تغییر پوسته" OnClick="@ToggleTheme" Edge="Edge.End"
Icon="@(_isDark ? Icons.Material.Filled.DarkMode : Icons.Material.Filled.LightMode)" />
<MudIconButton Class="d-inline d-md-none" Title="فهرست" Icon="@Icons.Material.Filled.Menu" OnClick="@ToggleDrawer" />
</div>
</MudContainer>
</MudAppBar>
<!-- Mobile Drawer -->
<MudDrawer @bind-Open="_drawerOpen" Anchor="Anchor.Left" Elevation="1" Variant="DrawerVariant.Temporary" Class="p-4">
<MudStack Spacing="2">
<MudLink Href="#features" OnClick="() => _drawerOpen=false">امکانات</MudLink>
<MudLink Href="#pricing" OnClick="() => _drawerOpen=false">قیمت‌ها</MudLink>
<MudLink Href="#faq" OnClick="() => _drawerOpen=false">سوالات متداول</MudLink>
<MudLink Href="#contact" OnClick="() => _drawerOpen=false">ارتباط</MudLink>
<MudDivider Class="my-2" />
<MudButton Variant="Variant.Outlined" Color="Color.Inherit">ورود</MudButton>
<MudButton Color="Color.Primary">شروع کنید</MudButton>
</MudStack>
</MudDrawer>
<MudMainContent> <MudMainContent>
@Body @Body
</MudMainContent> </MudMainContent>

6
src/FrontOffice.Main/Shared/MainLayout.razor.cs
View File

@@ -5,6 +5,12 @@ namespace FrontOffice.Main.Shared;
public partial class MainLayout public partial class MainLayout
{ {
private MudThemeProvider _mudThemeProvider; private MudThemeProvider _mudThemeProvider;
private bool _isDark;
private bool _drawerOpen;
private string? _email;
private void ToggleTheme() => _isDark = !_isDark;
private void ToggleDrawer() => _drawerOpen = !_drawerOpen;
private async void Back() private async void Back()
{ {
await JSRuntime.InvokeVoidAsync("history.back"); await JSRuntime.InvokeVoidAsync("history.back");