diff --git a/src/.vscode/settings.json b/src/.vscode/settings.json new file mode 100644 index 0000000..9e26dfe --- /dev/null +++ b/src/.vscode/settings.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/src/FrontOffice.Main/FrontOffice.Main.csproj b/src/FrontOffice.Main/FrontOffice.Main.csproj index 7242af3..cdf34b0 100644 --- a/src/FrontOffice.Main/FrontOffice.Main.csproj +++ b/src/FrontOffice.Main/FrontOffice.Main.csproj @@ -1,9 +1,10 @@ - + - net7.0 + net8.0 enable enable + 6dab807c-c6d8-4711-bf64-11c69e8d39f4 diff --git a/src/FrontOffice.Main/Pages/Index.razor b/src/FrontOffice.Main/Pages/Index.razor index e3d7f25..7560fbe 100644 --- a/src/FrontOffice.Main/Pages/Index.razor +++ b/src/FrontOffice.Main/Pages/Index.razor @@ -17,17 +17,18 @@ ثبت‌نام آسان، تجربهٔ سریع و شفاف. همین امروز حساب بساز و با دعوت دوستانت، امتیاز و پاداش دریافت کن. - - مشاهده قیمت‌ها - شروع کن - + + مشاهده قیمت‌ها + شروع کن + - \ No newline at end of file + diff --git a/src/FrontOffice.Main/Pages/Index.razor.cs b/src/FrontOffice.Main/Pages/Index.razor.cs index b2d38c1..d8344e3 100644 --- a/src/FrontOffice.Main/Pages/Index.razor.cs +++ b/src/FrontOffice.Main/Pages/Index.razor.cs @@ -76,6 +76,10 @@ public partial class Index { Navigation.NavigateTo($"{RouteConstants.Package.Detail}{packageId}"); } + private void NavigateToRegistrationWizard() + { + Navigation.NavigateTo(RouteConstants.Registration.Wizard); + } private record Pack(long Id, string Title, string Body, string Image, long Price); private record Plan(string Name, string Price, bool Highlight, IEnumerable Features); diff --git a/src/FrontOffice.Main/Pages/RegisterWizard.razor b/src/FrontOffice.Main/Pages/RegisterWizard.razor new file mode 100644 index 0000000..acd5974 --- /dev/null +++ b/src/FrontOffice.Main/Pages/RegisterWizard.razor @@ -0,0 +1,185 @@ +@attribute [Route(RouteConstants.Registration.Wizard)] + +ثبت‌نام سریع + +
+ + + + + ثبت‌نام سه مرحله‌ای + + فقط در چند دقیقه حساب خود را فعال کنید + + + اطلاعات اولیه را وارد کنید، مشخصات هویتی را تکمیل کنید و بعد از مطالعه قوانین و دانلود قرارداد، درخواست خود را ارسال کنید. + + + + + + + + مزایای ثبت‌نام آنلاین + + + • تایید سریع و آنلاین شماره موبایل
+ • تکمیل اطلاعات هویتی بدون مراجعه حضوری
+ • دریافت نسخه‌ی دیجیتال قرارداد برای بررسی دقیق +
+
+
+
+ + + + @if (_completed) + { + + + درخواست شما ثبت شد + + تیم ما پس از بررسی اطلاعات با شما تماس خواهد گرفت. می‌توانید از طریق داشبورد وضعیت ثبت‌نام را دنبال کنید. + + + بازگشت به صفحه اصلی + مشاهده پروفایل + + + } + else + { + + + ویزارد ثبت‌نام + ۳ مرحله + + + @if (_isSubmitting) + { + + } + + + + + + + + + @_captchaCode + + تازه‌سازی کد + + + + + + + + + + + + + + + + + + لطفاً قوانین و شرایط همکاری را با دقت مطالعه کنید و در صورت موافقت، تیک تایید را فعال نمایید. همچنین می‌توانید نسخه‌ی قرارداد را دانلود و ذخیره کنید. + + + بخشی از قوانین: + + استفاده از اطلاعات کاربری صرفاً برای ثبت نام و احراز هویت مجاز است. + تمامی فعالیت‌ها مطابق قوانین جمهوری اسلامی ایران انجام می‌شود. + مسئولیت صحت اطلاعات وارد شده بر عهده متقاضی است. + + + + + + دانلود قرارداد نمونه + + فرمت: فایل متنی + + + + + + + + + + + مرحله قبل + + + @_nextButtonText + + + + } + + +
+
+
diff --git a/src/FrontOffice.Main/Pages/RegisterWizard.razor.cs b/src/FrontOffice.Main/Pages/RegisterWizard.razor.cs new file mode 100644 index 0000000..fc77069 --- /dev/null +++ b/src/FrontOffice.Main/Pages/RegisterWizard.razor.cs @@ -0,0 +1,129 @@ +using System.ComponentModel.DataAnnotations; +using Microsoft.AspNetCore.Components; +using MudBlazor; + +namespace FrontOffice.Main.Pages; + +public partial class RegisterWizard +{ + private readonly RegistrationModel _model = new(); + private MudForm? _stepOneForm; + private MudForm? _stepTwoForm; + private MudForm? _stepThreeForm; + private int _activeStep; + private bool _isSubmitting; + private bool _completed; + private string _captchaCode = string.Empty; + + private string _nextButtonText => _activeStep switch + { + 0 => "ادامه", + 1 => "ادامه", + _ => _isSubmitting ? "در حال ارسال..." : "ثبت نهایی" + }; + + protected override void OnInitialized() + { + base.OnInitialized(); + GenerateCaptcha(); + } + + private void GenerateCaptcha() + { + var random = Guid.NewGuid().ToString("N")[..6].ToUpperInvariant(); + _captchaCode = random; + _model.CaptchaInput = string.Empty; + } + + private void GoBack() + { + if (_activeStep == 0 || _isSubmitting) + return; + + _activeStep--; + } + + private async Task GoNextAsync() + { + if (_isSubmitting) + return; + + switch (_activeStep) + { + case 0: + if (!await ValidateStepAsync(_stepOneForm)) + return; + if (!string.Equals(_model.CaptchaInput?.Trim(), _captchaCode, StringComparison.OrdinalIgnoreCase)) + { + Snackbar.Add("کد کپچا صحیح نیست.", Severity.Warning); + return; + } + _activeStep = 1; + break; + case 1: + if (!await ValidateStepAsync(_stepTwoForm)) + return; + _activeStep = 2; + break; + case 2: + if (!await ValidateStepAsync(_stepThreeForm)) + return; + await SubmitAsync(); + break; + } + } + + private async Task ValidateStepAsync(MudForm? form) + { + if (form is null) + return true; + + await form.Validate(); + return form.IsValid; + } + + private async Task SubmitAsync() + { + _isSubmitting = true; + try + { + await Task.Delay(800); + _completed = true; + Snackbar.Add("ثبت‌نام اولیه با موفقیت انجام شد.", Severity.Success); + } + finally + { + _isSubmitting = false; + } + } + + private void DownloadContract() + { + Navigation.NavigateTo("docs/sample-contract.txt", true); + } + + private sealed class RegistrationModel + { + [Required(ErrorMessage = "شماره موبایل الزامی است.")] + [RegularExpression(@"^09\d{9}$", ErrorMessage = "شماره موبایل معتبر نیست.")] + public string? MobileNumber { get; set; } + + [Required(ErrorMessage = "کد کپچا را وارد کنید.")] + public string? CaptchaInput { get; set; } + + [Required(ErrorMessage = "نام الزامی است.")] + [StringLength(50, ErrorMessage = "حداکثر ۵۰ کاراکتر")] + public string? FirstName { get; set; } + + [Required(ErrorMessage = "نام خانوادگی الزامی است.")] + [StringLength(70, ErrorMessage = "حداکثر ۷۰ کاراکتر")] + public string? LastName { get; set; } + + [Required(ErrorMessage = "کد ملی الزامی است.")] + [RegularExpression(@"^\d{10}$", ErrorMessage = "کدملی باید ۱۰ رقم باشد.")] + public string? NationalCode { get; set; } + + [Range(typeof(bool), "true", "true", ErrorMessage = "برای ادامه باید قوانین را تایید کنید.")] + public bool AcceptTerms { get; set; } + } +} diff --git a/src/FrontOffice.Main/Utilities/RouteConstants.cs b/src/FrontOffice.Main/Utilities/RouteConstants.cs index 96f17c4..1b50150 100644 --- a/src/FrontOffice.Main/Utilities/RouteConstants.cs +++ b/src/FrontOffice.Main/Utilities/RouteConstants.cs @@ -7,6 +7,11 @@ public static class RouteConstants public const string MainPage = "/"; } + public static class Registration + { + public const string Wizard = "/register"; + } + public static class Profile { public const string Index = "/profile"; diff --git a/src/FrontOffice.Main/wwwroot/css/site.css b/src/FrontOffice.Main/wwwroot/css/site.css index c22189e..b6c893c 100644 --- a/src/FrontOffice.Main/wwwroot/css/site.css +++ b/src/FrontOffice.Main/wwwroot/css/site.css @@ -195,4 +195,42 @@ html, body { background: linear-gradient(135deg, var(--mud-palette-dark-surface) 0%, var(--mud-palette-dark-surface-variant) 100%); } /*#endregion*/ +/*#region Registration Wizard*/ +.wizard-section { + background: linear-gradient(180deg, #f9f7ff 0%, #ffffff 40%, #f0f8ff 100%); +} + +.wizard-card { + border-radius: 18px; + border: 1px solid var(--mud-palette-divider); +} + +.gradient-border { + border-radius: 16px; + border: 1px solid transparent; + background: linear-gradient(var(--mud-palette-surface), var(--mud-palette-surface)) padding-box, + linear-gradient(135deg, rgba(123, 97, 255, 0.4), rgba(255, 140, 189, 0.4)) border-box; +} + +.captcha-box { + min-width: 120px; + min-height: 56px; + border-radius: 12px; + letter-spacing: 4px; + font-weight: 600; + background: linear-gradient(135deg, rgba(123, 97, 255, 0.12), rgba(255, 140, 189, 0.12)); +} + +.terms-box { + border-radius: 12px; + border: 1px dashed var(--mud-palette-divider); + background: rgba(255, 255, 255, 0.7); +} + +@media (max-width: 768px) { + .wizard-card { + padding: 1.5rem !important; + } +} +/*#endregion*/ /*#endregion*/ diff --git a/src/FrontOffice.Main/wwwroot/docs/sample-contract.txt b/src/FrontOffice.Main/wwwroot/docs/sample-contract.txt new file mode 100644 index 0000000..9c73ae5 --- /dev/null +++ b/src/FrontOffice.Main/wwwroot/docs/sample-contract.txt @@ -0,0 +1,12 @@ +نمونه قرارداد همکاری +--------------------- + +این فایل صرفاً نمونه‌ای برای نمایش قابلیت دانلود قرارداد در ویزارد ثبت‌نام است. + +بند ۱- اطلاعات شخص حقیقی: شامل نام، نام خانوادگی، کد ملی و شماره تماس متقاضی است. +بند ۲- تعهدات طرفین: متقاضی متعهد می‌شود قوانین حاکم بر پلتفرم را رعایت نموده و اطلاعات صحیح ارائه نماید. +بند ۳- محرمانگی: تبادل هرگونه داده تجاری یا شخصی مشمول اصول محرمانگی خواهد بود. +بند ۴- فسخ همکاری: پلتفرم در صورت نقض قوانین می‌تواند همکاری را یک‌طرفه فسخ نماید. + +تاریخ: .............. +امضا متقاضی: ..............