L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-66893 grade: update rubric template for grader

Browse Source
This commit is contained in:
Ryan Wyllie
2019-11-06 13:29:52 +08:00
parent bf7018b6bd
commit 4e53672929
3 changed files with 286 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
grade/grading/form/rubric/templates/grades/grader/gradingpanel.mustache
+61 -39
View File
@@ -57,49 +57,71 @@
<input type="hidden" name="instanceid" value="{{instanceid}}">
<div id="rubric-advancedgrading-{{uniqid}}" class="criterion">
{{#criteria}}
<div class="d-block mb-2">
<h5 class="d-inline px-0 font-weight-bold mb-0">{{{description}}}</h5>
<button class="d-inline btn p-0 font-weight-bold mb-0 pull-right collapse"
type="button"
data-toggle="collapse"
data-target="#criteria-{{id}}"
aria-expanded="true"
aria-controls="criteria-{{id}}">
</button>
</div>
<div class="collapse show" id="criteria-{{id}}">
{{#levels}}
<div class="form-check">
<input class="form-check-input level"
type="radio"
name="advancedgrading[criteria][{{criterionid}}][levelid]"
id="advancedgrading-criteria-{{criterionid}}-levels-{{id}}-definition"
value="{{id}}"
{{#checked}}
aria-checked="true"
tabindex="0"
checked
{{/checked}}
{{^checked}}
aria-checked="false"
tabindex="-1"
{{/checked}}
>
<label class="w-100" for="advancedgrading-criteria-{{criterionid}}-levels-{{id}}-definition">
<label class="font-weight-bold">
{{{definition}}}
<div class="mb-3">
<div class="d-flex align-items-center mb-2">
<h5 class="px-0 mb-0 description font-weight-bold">{{{description}}}</h5>
<button class="criterion-toggle btn btn-icon icon-no-margin text-reset p-0 font-weight-bold mb-0 ml-auto"
type="button"
data-toggle="collapse"
data-target="#criteria-{{id}}"
aria-expanded="true"
aria-controls="criteria-{{id}}">
<span class="collapsed-icon">
{{#pix}} t/collapsed, core {{/pix}}
<span class="sr-only">{{#str}} expandcriterion, core_grades {{/str}}</span>
</span>
<span class="expanded-icon">
{{#pix}} t/expanded, core {{/pix}}
<span class="sr-only">{{#str}} collapsecriterion, core_grades {{/str}}</span>
</span>
</button>
</div>
<div class="collapse show" id="criteria-{{id}}">
{{#levels}}
<div class="form-check">
<input class="form-check-input level"
type="radio"
name="advancedgrading[criteria][{{criterionid}}][levelid]"
id="advancedgrading-criteria-{{criterionid}}-levels-{{id}}-definition"
value="{{id}}"
{{#checked}}
aria-checked="true"
tabindex="0"
checked
{{/checked}}
{{^checked}}
aria-checked="false"
tabindex="-1"
{{/checked}}
>
<label class="w-100" for="advancedgrading-criteria-{{criterionid}}-levels-{{id}}-definition">
<span>
{{{definition}}}
</span>
<span class="pull-right">
{{#str}}pointsvalue, gradingform_rubric, {{score}}{{/str}}
</span>
</label>
<label class="pull-right font-weight-bold">
{{#str}}pointsvalue, gradingform_rubric, {{score}}{{/str}}
</label>
</label>
</div>
{{/levels}}
<div class="form-group">
<label class="text-muted" for="advancedgrading-criteria-{{id}}-remark">{{#str}} additionalfeedback, core_grades {{/str}}</label>
<textarea class="form-control"
name="advancedgrading[criteria][{{id}}][remark]"
id="advancedgrading-criteria-{{id}}-remark"
cols="10"
rows="1"
data-max-rows="5"
data-auto-rows="true"
>{{{remark}}}</textarea>
</div>
{{/levels}}
<div class="form-group">
<label for="advancedgrading-criteria-{{id}}-remark">Additional feedback</label>
<textarea class="form-control" name="advancedgrading[criteria][{{id}}][remark]" id="advancedgrading-criteria-{{id}}-remark" cols="10" rows="5">{{{remark}}}</textarea>
</div>
</div>
{{/criteria}}
</div>
</form>
{{#js}}
require(['core/auto_rows'], function(AutoRows) {
AutoRows.init(document.getElementById('gradingform_rubric-{{uniqid}}'));
});
{{/js}}
lang/en/grades.php
+1
View File
@@ -30,6 +30,7 @@ $string['addfeedback'] = 'Add feedback';
$string['addgradeletter'] = 'Add a grade letter';
$string['addidnumbers'] = 'Add ID numbers';
$string['additem'] = 'Add grade item';
$string['additionalfeedback'] = 'Additional feedback';
$string['addoutcome'] = 'Add an outcome';
$string['addoutcomeitem'] = 'Add outcome item';
$string['addscale'] = 'Add a scale';
mod/forum/templates/local/grades/local/grader/grade_placeholder.mustache
+224 -11
View File
@@ -30,14 +30,227 @@
{
}
}}
<div class="bg-pulse-grey w-25" style="height: 20px;"></div>
<div class="bg-pulse-grey w-50 mt-1" style="height: 25px;"></div>
<div class="bg-pulse-grey w-25 mt-3" style="height: 20px;"></div>
<div class="bg-pulse-grey w-50 mt-1" style="height: 25px;"></div>
<div class="bg-pulse-grey w-25 mt-3" style="height: 20px;"></div>
<div class="bg-pulse-grey w-100 mt-1" style="height: 25px;"></div>
<div class="bg-pulse-grey w-25 mt-3" style="height: 20px;"></div>
<div class="bg-pulse-grey w-100 mt-1" style="height: 25px;"></div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>
<div class="d-flex flex-column mb-3">
<div class="d-flex align-items-center mb-2" style="height: 36px">
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto mr-2" style="height: 16px; width: 16px"></div>
</div>
<div class="d-flex flex-column">
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div class="d-flex align-items-center mb-2" style="height: 22px">
<div class="bg-pulse-grey rounded-circle mr-1" style="height: 16px; width: 16px"></div>
<div class="bg-pulse-grey" style="height: 19px; width: 100px"></div>
<div class="bg-pulse-grey ml-auto" style="height: 19px; width: 50px"></div>
</div>
<div>
<div class="bg-pulse-grey mb-2" style="height: 22px; width: 150px"></div>
<div class="bg-pulse-grey" style="height: 36px; width: 100%"></div>
</div>
</div>
</div>