From 31faec4f73e0d78ad2b5e593e081ebe8e53e214d Mon Sep 17 00:00:00 2001 From: Qais Yousuf Date: Wed, 10 Apr 2024 19:26:03 +0200 Subject: [PATCH] response frontend completed --- .../Controllers/QuestionnaireController.cs | 8 +- .../QuestionnaireResponseController.cs | 44 +--- .../DisplayQuestionnaire.cshtml | 246 ++++++++++++------ Web/Views/QuestionnaireResponse/Error.cshtml | 148 ++++++++++- Web/wwwroot/css/site.css | 3 +- 5 files changed, 308 insertions(+), 141 deletions(-) diff --git a/Web/Areas/Admin/Controllers/QuestionnaireController.cs b/Web/Areas/Admin/Controllers/QuestionnaireController.cs index 0644cfc..1665029 100644 --- a/Web/Areas/Admin/Controllers/QuestionnaireController.cs +++ b/Web/Areas/Admin/Controllers/QuestionnaireController.cs @@ -513,9 +513,7 @@ namespace Web.Areas.Admin.Controllers body {{ font-family: Arial, sans-serif; }} - .text-danger {{ - color:red; - }} + .container {{ max-width: 600px; margin: 0 auto; @@ -543,13 +541,13 @@ namespace Web.Areas.Admin.Controllers
{subject}

Thank you for participating in our survey. Your feedback is valuable to us.

Please click the button below to start the survey:

-

The survey will be expire in Date:{expiryDateTime.ToLongDateString()} Time: {expiryDateTime.ToShortTimeString()}

+

The survey will be expire :{expiryDateTime.ToLongDateString()} Time: {expiryDateTime.ToShortTimeString()}

Start Survey

-

Søren Eggert Lundsteen Olsen +

Søren Eggert Lundsteen Olsen
Seosoft ApS

Hovedgaden 3 diff --git a/Web/Controllers/QuestionnaireResponseController.cs b/Web/Controllers/QuestionnaireResponseController.cs index e269b6f..3aac4d5 100644 --- a/Web/Controllers/QuestionnaireResponseController.cs +++ b/Web/Controllers/QuestionnaireResponseController.cs @@ -71,48 +71,6 @@ namespace Web.Controllers } - //public IActionResult DisplayQuestionnaire(int id, string token) - //{ - // // Check if the token is null or empty - // if (string.IsNullOrEmpty(token)) - // { - // ViewBag.ErrorMessage = "The URL is invalid. Please provide a valid token."; - // return View("Error"); - // } - - // // Split the token to extract the expiration date and time - // string[] tokenParts = token.Split('|'); - // if (tokenParts.Length != 2) - // { - // ViewBag.ErrorMessage = "The URL is invalid. Please provide a valid token."; - // return View("Error"); - // } - - // string expiryDateTimeString = tokenParts[1]; - - // // Parse the expiration datetime in UTC format - // if (!DateTime.TryParseExact(expiryDateTimeString, "yyyy-MM-ddTHH:mm:ssZ", CultureInfo.InvariantCulture, DateTimeStyles.AssumeUniversal, out DateTime expiryDateTimeUtc)) - // { - // ViewBag.ErrorMessage = "The URL is invalid. Please provide a valid token."; - // return View("Error"); - // } - - // // Convert the expiration datetime to local time - // DateTime expiryDateTimeLocal = expiryDateTimeUtc.ToLocalTime(); - - // // Check if the token is expired (accounting for time zone offset) - // if (expiryDateTimeLocal >= DateTime.Now.AddHours(1)) - // { - - // return RedirectToAction(nameof(Error)); - // } - - // // Retrieve the questionnaire using the numeric ID - // var questionnaire = _questionnaireRepository.GetQuestionnaireWithQuestionAndAnswer(id); - - // return View(questionnaire); - //} - - + } } diff --git a/Web/Views/QuestionnaireResponse/DisplayQuestionnaire.cshtml b/Web/Views/QuestionnaireResponse/DisplayQuestionnaire.cshtml index 1c04715..6ca85a0 100644 --- a/Web/Views/QuestionnaireResponse/DisplayQuestionnaire.cshtml +++ b/Web/Views/QuestionnaireResponse/DisplayQuestionnaire.cshtml @@ -4,16 +4,43 @@ Layout = "~/Views/Shared/_QuestionnaireResponse.cshtml"; }
-
-
+
-

@ViewBag.ErrorMessage

-

@Model.Title

@Html.Raw(Model.Description)

-
-
+ +
@@ -110,7 +155,75 @@ var question = Model.Questions[i];

@(i + 1). @question.Text

+
@switch (question.Type) + { + case QuestionType.Text: +
+ +
+ break; + case QuestionType.CheckBox: + case QuestionType.Multiple_choice: + case QuestionType.Likert: + case QuestionType.Matrix: + case QuestionType.Demographic: + case QuestionType.Ranking: +
+ @foreach (var answer in question.Answers) + { +
+ + +
+ } +
+ break; + case QuestionType.TrueFalse: +
+ + +
+
+ + +
+ break; + case QuestionType.Open_ended: + + break; + case QuestionType.Image: + + break; + case QuestionType.Slider: + + 50 + + break; + case QuestionType.Rating: +
+ @foreach (var answer in question.Answers) + { + @* @answer.Id *@ + + + } +
+ + break; + default: + + break; + } + @* @switch (question.Type) { case QuestionType.Text:
@@ -161,12 +274,16 @@ }); break; + default: break; - } + } *@ +
+ +
@if (i > 0) { @@ -186,9 +303,9 @@
-
+ -
+
@@ -273,64 +390,33 @@ } showStep(currentStep); - updateStepper(); - function toggleCheckbox(labelElement) { - var checkbox = labelElement.previousElementSibling; // Find the nearest preceding checkbox - checkbox.checked = !checkbox.checked; - checkbox.focus(); // Focus the checkbox after clicking on the label - } - }); + updateStepper(); + $('.rating i').on('click', function() { + var value = $(this).data('value'); + var questionIndex = $(this).closest('.rating').data('question'); + var selectedStars = $(this).closest('.rating').find('i.selected').length; + + // Unselect all stars + $(this).closest('.rating').find('i').removeClass('selected'); + + // Select the clicked star and all preceding stars + $(this).addClass('selected').prevAll().addClass('selected'); + + // Update the hidden input value if needed + $('input[name="question' + questionIndex + '_rating"]').val(value); + + // Update the label with the number of selected stars + $(this).closest('.rating').next('.selected-count').text(selectedStars); + }); + + // Prevent the default action for the anchor tags within the rating + $('.rating a').on('click', function(e) { + e.preventDefault(); + }); + }); + - @* *@ + } diff --git a/Web/Views/QuestionnaireResponse/Error.cshtml b/Web/Views/QuestionnaireResponse/Error.cshtml index 249ae41..e6d0f03 100644 --- a/Web/Views/QuestionnaireResponse/Error.cshtml +++ b/Web/Views/QuestionnaireResponse/Error.cshtml @@ -12,13 +12,18 @@ background: linear-gradient(119deg, rgba(47,82,131,1) 0%, rgba(29,33,59,1) 34%, rgba(27,54,61,1) 67%, rgba(58,82,116,1) 100%) !important } - .containerError { + #rowSectionError { + display: flex; + flex-wrap: nowrap; + justify-content: space-around; + align-items: center; + align-content: center; + width: 100%; - margin-top:150px; - height:600px; - + flex-direction: row; + } - .card{ + #Errocard{ position: relative; display: -webkit-box; display: -ms-flexbox; @@ -27,23 +32,142 @@ -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: row; - min-width: 0; + word-wrap: break-word; box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); -webkit-box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); -moz-box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); border-radius: 10px; background-color: transparent; - + height:400px; flex-wrap: nowrap; align-items: center; - height: 500px; - padding-left: 50px; - padding-right: 50px; + padding:0 50px 0 50px; + margin:150px 30px 0px 30px; + } + + + + + @@media (max-width: 792px) { + + + #Errocard { + display: flex; + flex-direction:column; + flex-wrap: wrap; + justify-content: center; + align-items: center; + align-content: center; + + height: 70vh; + padding: 0 20px 0 20px; + + } + + #boxError { + width: auto; + height: 30%; + margin: 5px; + } +} + + @@media (max-width: 800px) { + + + #Errocard { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: center; + align-items: center; + align-content: center; + height: 70vh; + padding: 0 20px 0 20px; + } + + #boxError { + width: auto; + height: 30%; + margin: 5px; + } + } + + + @@media (max-width: 1300px) { + + + #Errocard { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: row; + word-wrap: break-word; + box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); + -webkit-box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); + -moz-box-shadow: 0px 0px 36px -12px rgba(20,101,230,1); + border-radius: 10px; + background-color: transparent; + height: 400px; + flex-wrap: nowrap; + align-items: center; + padding: 0 50px 0 50px; + margin: 50px 30px 0px 30px; + } + + #boxError { + width: auto; + + margin: 5px; + } + + + #boxBanner { + display: block; + width: auto; + margin: 5px; + + } -
+ +
+ + +
+
+ + +
+
+
@ViewBag.ErrorMessage
+ + + @*

@Html.Raw(Model.Content) SeoSoft

*@ + + Contact + +
+
+ + +
+
+ + +
+
+ +
+ + + +@*
@@ -64,7 +188,7 @@
-
+
*@ diff --git a/Web/wwwroot/css/site.css b/Web/wwwroot/css/site.css index ea42079..0826caf 100644 --- a/Web/wwwroot/css/site.css +++ b/Web/wwwroot/css/site.css @@ -52,6 +52,7 @@ background-position: bottom; background-repeat: no-repeat; width: 100%; + } @@ -183,7 +184,7 @@ .hero { background-color: #141c27; - /* background-image: linear-gradient(119deg, rgba(14,12,56,1) 0%, rgba(20,26,35,1) 35%, rgba(24,35,51,1) 66%, rgba(34,49,70,1) 100%);*/ + }