FIT5032-Assignment/FIT5032-Assignment/Views/Appointments/Review.cshtml

66 lines
1.9 KiB
Plaintext

@{
ViewBag.Title = "Review";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Rate the experience</h2>
@if (ViewBag.role == 1) {
<p>You are about to review the Doctor <b>@ViewBag.doctorUser.displayName</b></p>
<form method="post">
<div class="form-group">
<label for="score">How about your experience?</label>
<input type="hidden" id="score" name="score" required />
<button class="btn btn-light" id="btn-good" onClick="rate(1)" type="button">
<span class="material-symbols-outlined">
thumb_up
</span>
</button>
<button class="btn btn-light" id="btn-bad" onClick="rate(0)" type="button">
<span class="material-symbols-outlined">
thumb_down
</span>
</button>
</div>
<div class="form-group">
<label for="comment">Leave your comment</label>
<div class='input-group'>
<textarea id="comment" class="form-control" name="comment" ></textarea>
</div>
</div>
<button class="btn btn-primary" type="submit">Submit</button>
</form>
}
@section Scripts {
@Styles.Render("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200")
<style>
.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24
}
textarea {
width: 100%;
}
</style>
<script>
function rate(score) {
$("#score").val(score)
if (score == 1) {
$("#btn-good").removeClass("btn-light")
$("#btn-good").addClass("btn-success")
$("#btn-bad").removeClass("btn-danger")
$("#btn-bad").addClass("btn-light")
} else {
$("#btn-good").removeClass("btn-success")
$("#btn-good").addClass("btn-light")
$("#btn-bad").removeClass("btn-light")
$("#btn-bad").addClass("btn-danger")
}
}
if (@ViewBag.reviewAvailable === "True") {
alert("Review available")
}
</script>
}