Commit 3cdad467 by Ahsan Ulhaq

Merge pull request #8776 from edx/ahsan/ECOM-1578-Credit-Payment-Dashboard-States-update

Credit Payment - Dashboard States
parents e0b90f3f c94f043c
......@@ -880,6 +880,7 @@ def _credit_statuses(user, course_enrollments):
"purchased": course_key in credit_enrollments,
"provider_name": None,
"provider_status_url": None,
"provider_id": None,
"request_status": request_status_by_course.get(course_key),
"error": False,
}
......@@ -903,6 +904,7 @@ def _credit_statuses(user, course_enrollments):
provider_info = provider_info_by_id.get(provider_id, {})
status["provider_name"] = provider_info.get("display_name")
status["provider_status_url"] = provider_info.get("status_url")
status["provider_id"] = provider_id
statuses[course_key] = status
......
......@@ -2,6 +2,13 @@
'use strict';
$(document).ready(function() {
var errorContainer = $(".credit-error-msg"),
creditStatusError = errorContainer.data("credit-error");
if (creditStatusError == "True"){
errorContainer.toggleClass("is-hidden");
}
// Fire analytics events when the "purchase credit" button is clicked
$(".purchase-credit-btn").on("click", function(event) {
var courseKey = $(event.target).data("course-key");
......@@ -13,5 +20,47 @@
}
);
});
// This event invokes credit request endpoint. It will initiate
// a credit request for the credit course for the provided user.
$(".pending-credit-btn").on("click", function(event){
var courseKey = $(event.target).data("course-key"),
username = $(event.target).data("user"),
provider_id = $(event.target).data("provider"),
postData = {
'course_key': courseKey,
'username': username
};
$.ajax({
url: 'api/credit/v1/provider/' + provider_id + '/request/',
type: 'POST',
headers: {
'X-CSRFToken': $.cookie('csrftoken')
},
data: JSON.stringify(postData) ,
context: this,
success: function(requestData){
var form = $('#credit-pending-form');
$('input', form).remove();
form.attr( 'action', requestData.url );
form.attr( 'method', 'POST' );
_.each( requestData.parameters, function( value, key ) {
$('<input>').attr({
type: 'hidden',
name: key,
value: value
}).appendTo(form);
});
form.submit();
},
error: function(xhr){
$(".credit-request-pending-msg").hide("is-hidden");
$(".pending-credit-btn").hide();
errorContainer.toggleClass("is-hidden");
}
});
});
});
})(jQuery, window.analytics);
......@@ -540,8 +540,11 @@
@include float(right);
}
.purchase-credit-btn {
.credit-btn {
@extend %btn-pl-yellow-base;
background-image: none ;
text-shadow: none;
box-shadow: none;
}
.message {
......
......@@ -9,15 +9,14 @@
% if credit_status["eligible"]:
<div class="message message-status is-shown credit-message">
% if credit_status["error"]:
<p class="message-copy credit-error-msg">
<p class="message-copy is-hidden credit-error-msg" data-credit-error="${credit_status['error']}">
${_("An error occurred with this transaction. For help, contact {support_email}.").format(
support_email=u'<a href="mailto:{address}">{address}</a>'.format(
address=settings.DEFAULT_FEEDBACK_EMAIL
)
)}
</p>
% elif not credit_status["purchased"]:
% if not credit_status["purchased"] and not credit_status["error"] :
<p class="credit-eligibility-msg">
% if credit_status["deadline"] < datetime.datetime.now(pytz.UTC) + datetime.timedelta(days=30):
${_("The opportunity to purchase credit for this course expires on {deadline}. You've worked hard - don't miss out!").format(deadline=get_default_time_display(credit_status["deadline"]))}
......@@ -27,9 +26,10 @@
</p>
<div class="purchase_credit">
## TODO: set the URL for the link to the provider selection page on the E-Commerce service
<a class="btn purchase-credit-btn" href="#" target="_blank" data-course-key="${credit_status["course_key"]}">${_("Purchase Course Credit")}</a>
<a class="btn credit-btn purchase-credit-btn" href="#" target="_blank" data-course-key="${credit_status['course_key']}">${_("Purchase Course Credit")}</a>
</div>
% elif credit_status["request_status"] in [None, "pending"]:
% elif credit_status["request_status"] in [None, "pending"] and not credit_status["error"] :
% if credit_status["request_status"] == "pending":
<p class="message-copy credit-request-pending-msg">
${_("Thanks for your payment! We are currently processing your course credit. You'll see a message here when the transaction is complete. For more information, see {provider_link}.").format(
provider_link=u'<a href="{provider_url}">{provider_name}</a>'.format(
......@@ -39,7 +39,21 @@
)
}
</p>
% elif credit_status["request_status"] == "approved":
% elif credit_status["request_status"] is None:
<p class="message-copy credit-request-pending-msg">
${_("Thank you for your payment! To receive your course credit, go to the {provider_link} website. You may have to complete some additional steps depending on the institution").format(
provider_link=u'<a href="{provider_url}">{provider_name}</a>'.format(
provider_url=credit_status["provider_status_url"],
provider_name=credit_status["provider_name"],
)
)
}
</p>
% endif
<button class="btn credit-btn pending-credit-btn" data-course-key="${credit_status['course_key']}" data-user="${user.username}" data-provider="${credit_status['provider_id']}">${_("Complete Credit")}</button>
<form id="credit-pending-form"> </form>
% elif credit_status["request_status"] == "approved" and not credit_status["error"] :
<p class="message-copy credit-request-approved-msg">
${_("Congratulations - you have received credit for this course! For more information, see {provider_link}.").format(
provider_link=u'<a href="{provider_url}">{provider_name}</a>'.format(
......@@ -49,7 +63,8 @@
)
}
</p>
% elif credit_status["request_status"] == "rejected":
<a class="btn credit-btn" href="${credit_status['provider_status_url']}" target="_blank">${_("Access credit")}</a>
% elif credit_status["request_status"] == "rejected" and not credit_status["error"] :
<p class="message-copy credit-request-rejected-msg">
${_("{provider_name} has declined your request for course credit. For more information, contact {provider_link}.").format(
provider_name=credit_status["provider_name"],
......@@ -60,6 +75,14 @@
)
}
</p>
<a class="btn credit-btn" href="${credit_status['provider_status_url']}" target="_blank">
${_("Contact {provider_link}").format(provider_link=u'<a href="{provider_url}">{provider_name}</a>'.format(
provider_url=credit_status["provider_status_url"],
provider_name=credit_status["provider_name"],
)
)
}
</a>
% endif
</div>
% endif
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment