MDL-74610 quiz: multiple grades - add grade item

mod/quiz/amd/build/edit_multiple_grades.min.js

@@ -1,10 +1,10 @@
-define("mod_quiz/edit_multiple_grades",["exports","core/ajax","core/loadingicon","core/notification","core/pending"],(function(_exports,_ajax,_loadingicon,_notification,_pending){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
+define("mod_quiz/edit_multiple_grades",["exports","core/ajax","core/loadingicon","core/notification","core/pending","core/str"],(function(_exports,_ajax,_loadingicon,_notification,_pending,_str){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
 /**
    * JavaScript for managing multiple grade items for a quiz.
    *
    * @module     mod_quiz/edit_multiple_grades
    * @copyright  2023 THe Open University
    * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
-   */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_notification=_interopRequireDefault(_notification),_pending=_interopRequireDefault(_pending);const handleGradeItemDelete=e=>{e.preventDefault();const pending=new _pending.default("delete-quiz-grade-item"),tableCell=e.target.closest("td");(0,_loadingicon.addIconToContainerRemoveOnCompletion)(tableCell,pending);const tableRow=tableCell.closest("tr");((quizId,gradeItemId)=>(0,_ajax.call)([{methodname:"mod_quiz_delete_grade_items",args:{quizid:quizId,quizgradeitems:[{id:gradeItemId}]}}])[0])(tableRow.closest("table").dataset.quizId,tableRow.dataset.quizGradeItemId).then((()=>pending.resolve())).then((()=>{window.location.reload()})).catch(_notification.default.exception)},handleGradeItemClick=e=>{const link=e.target.closest("a");link&&link.dataset.actionDelete&&handleGradeItemDelete(e)};_exports.init=()=>{(()=>{const gradeItemTable=document.getElementById("mod_quiz-grade-item-list");gradeItemTable&&gradeItemTable.addEventListener("click",handleGradeItemClick)})()}}));
+   */Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_notification=_interopRequireDefault(_notification),_pending=_interopRequireDefault(_pending);const handleGradeItemDelete=e=>{e.preventDefault();const pending=new _pending.default("delete-quiz-grade-item"),tableCell=e.target.closest("td");(0,_loadingicon.addIconToContainerRemoveOnCompletion)(tableCell,pending);const tableRow=tableCell.closest("tr");((quizId,gradeItemId)=>(0,_ajax.call)([{methodname:"mod_quiz_delete_grade_items",args:{quizid:quizId,quizgradeitems:[{id:gradeItemId}]}}])[0])(tableRow.closest("table").dataset.quizId,tableRow.dataset.quizGradeItemId).then((()=>pending.resolve())).then((()=>{window.location.reload()})).catch(_notification.default.exception)},handleGradeItemClick=e=>{const link=e.target.closest("a");link&&link.dataset.actionDelete&&handleGradeItemDelete(e)},handleAddGradeItemClick=e=>{e.preventDefault();const pending=new _pending.default("delete-quiz-grade-item");(0,_loadingicon.addIconToContainerRemoveOnCompletion)(e.target.parentNode,pending);const quizId=e.target.dataset.quizId;(0,_str.get_string)("gradeitemdefaultname","quiz").then((name=>((quizId,name)=>(0,_ajax.call)([{methodname:"mod_quiz_create_grade_items",args:{quizid:quizId,quizgradeitems:[{name:name}]}}])[0])(quizId,name))).then((()=>pending.resolve())).then((()=>{window.location.reload()})).catch(_notification.default.exception)};_exports.init=()=>{(()=>{const gradeItemTable=document.getElementById("mod_quiz-grade-item-list");gradeItemTable&&gradeItemTable.addEventListener("click",handleGradeItemClick),document.getElementById("mod_quiz-add_grade_item").addEventListener("click",handleAddGradeItemClick)})()}}));
 
 //# sourceMappingURL=edit_multiple_grades.min.js.map

mod/quiz/amd/src/edit_multiple_grades.js

@@ -25,6 +25,22 @@ import {call as fetchMany} from 'core/ajax';
 import {addIconToContainerRemoveOnCompletion} from 'core/loadingicon';
 import Notification from 'core/notification';
 import Pending from 'core/pending';
+import {get_string as getString} from 'core/str';
+
+/**
+ * Call the Ajax service to add a quiz grade item.
+ *
+ * @param {Number} quizId
+ * @param {String} name
+ * @return {Promise}
+ */
+const addGradeItem = (quizId, name) => fetchMany([{
+    methodname: 'mod_quiz_create_grade_items',
+    args: {
+        quizid: quizId,
+        quizgradeitems: [{name: name}],
+    }
+}])[0];
 
 /**
  * Call the Ajax service to delete a quiz grade item.
@@ -82,16 +98,37 @@ const handleGradeItemClick = (e) => {
     }
 };
 
+/**
+ * Handle clicks on the 'Add grade item' table.
+ *
+ * @param {Event} e click event.
+ */
+const handleAddGradeItemClick = (e) => {
+    e.preventDefault();
+    const pending = new Pending('delete-quiz-grade-item');
+    addIconToContainerRemoveOnCompletion(e.target.parentNode, pending);
+
+    const quizId = e.target.dataset.quizId;
+
+    getString('gradeitemdefaultname', 'quiz')
+        .then((name) => addGradeItem(quizId, name))
+        .then(() => pending.resolve())
+        .then(() => {
+            window.location.reload();
+        })
+        .catch(Notification.exception);
+};
+
 /**
  * Replace the container with a new version.
  */
 const registerEventListeners = () => {
     const gradeItemTable = document.getElementById('mod_quiz-grade-item-list');
-    if (!gradeItemTable) {
-        return;
+    if (gradeItemTable) {
+        gradeItemTable.addEventListener('click', handleGradeItemClick);
     }
 
-    gradeItemTable.addEventListener('click', handleGradeItemClick);
+    document.getElementById('mod_quiz-add_grade_item').addEventListener('click', handleAddGradeItemClick);
 };
 
 /**

mod/quiz/lang/en/quiz.php

@@ -440,6 +440,7 @@ $string['gradeaverage'] = 'Average grade';
 $string['gradeboundary'] = 'Grade boundary';
 $string['gradeessays'] = 'Grade essays';
 $string['gradehighest'] = 'Highest grade';
+$string['gradeitemdefaultname'] = 'New grade item';
 $string['gradeitemdelete'] = 'Delete grade item {$a}';
 $string['gradeitemnewname'] = 'New name for grade item {$a}';
 $string['gradeitems'] = 'Grade items';

mod/quiz/templates/edit_grading_page.mustache

@@ -92,7 +92,8 @@
 {{/hasgradeitems}}
 
 <div class="mb-5">
-    <button type="button" class="btn btn-secondary" id="mod_quiz-add_grade_item">{{#str}} additem, grades{{/str}}</button>
+    <button type="button" class="btn btn-secondary" id="mod_quiz-add_grade_item"
+            data-quiz-id="{{quizid}}">{{#str}} additem, grades{{/str}}</button>
 </div>
 
 <h3>Mark scheme</h3>

mod/quiz/tests/behat/editing_multiple_grades.feature

@@ -43,6 +43,16 @@ Feature: Setup multiple grades for a quiz
     And "Delete" "icon" should not exist in the "Intelligence" "table_row"
     And "Delete" "icon" should exist in the "Unused grade item" "table_row"
 
+  @javascript
+  Scenario: A grade item can be created
+    Given quiz "Quiz 1" contains the following questions:
+      | question   | page |
+      | Question A | 1    |
+    When I am on the "Quiz 1" "mod_quiz > multiple grades setup" page logged in as teacher
+    And I should see "This quiz does not yet have any grade items defined"
+    And I press "Add grade item"
+    Then "New grade item" "table_row" should exist
+
   @javascript
   Scenario: Unused grade items can be deleted
     Given the following "mod_quiz > grade items" exist: