Visual improvements

- mark text for translation - remove 'update bug tracker' dropdown - use 'template' instead of html in js - `btn-danger`, not `btn-default`
kiwitcms · Aug 19, 2020 · e71ce80 · e71ce80
1 parent 4f0fcf4
commit e71ce80
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 15 deletions.
diff --git a/tcms/testruns/static/testruns/js/get.js b/tcms/testruns/static/testruns/js/get.js
@@ -227,7 +227,7 @@ function addLinkToExecution(testExecution) {
         const url = $('.add-hyperlink-form #id_url').val()
         const name = $('.add-hyperlink-form #id_name').val()
         const isDefect = $('.add-hyperlink-form #defectCheckbox').is(':checked')
-        const updateTracker = $('.add-hyperlink-form #autoUpdateCheckbox').is(':checked')
+        const updateTracker = true
 
         jsonRPC('TestExecution.add_link', [{
             execution_id: testExecution.id,
@@ -256,6 +256,13 @@ function addLinkToExecution(testExecution) {
 }
 
 function renderLink(link) {
-    const icon = link.is_defect ? `<span class="fa fa-bug"></span>` : ''
-    return `<li>${icon} <a href="${link.url}">${link.name || link.url}</a></li>`
+    const linkEntryTemplate = $('#link-entry')[0].content
+    const template = $(linkEntryTemplate.cloneNode(true))
+    if (link.is_defect) {
+        template.find('.link-icon').addClass('fa fa-bug')
+    }
+
+    template.find('.link-url').html(link.name || link.url)
+
+    return template
 }
diff --git a/tcms/testruns/templates/testruns/get.html b/tcms/testruns/templates/testruns/get.html
@@ -188,6 +188,17 @@ <h5><span class="test-executions-count"></span> Results</h5>
                                         <div class="list-view-pf-checkbox" style="margin-top: 0; margin-bottom: 0">
                                             <input type="checkbox">
                                         </div>
+                                        <div class="list-view-pf-actions" style="margin-top: 0; margin-bottom: 0;">
+                                            <div class="dropdown pull-right dropdown-kebab-pf">
+                                                <button class="btn btn-link dropdown-toggle" type="button" id="dropdownKebabRight9"
+                                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                                                    <span class="fa fa-ellipsis-v"></span>
+                                                </button>
+                                                <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownKebabRight9">
+                                                    <li><a href="#" class="add-link-button" data-toggle="modal" data-target="#add-link-modal">{% trans 'Add hyperlink' %}</a></li>
+                                                </ul>
+                                            </div>
+                                        </div>
                                         <div class="list-view-pf-body">
                                             <div class="list-view-pf-description" style="flex: 1 0 30%;">
                                                 <div class="list-group-item-text">
@@ -241,9 +252,11 @@ <h5><span class="test-executions-count"></span> Results</h5>
                                                     <strong>{% trans 'Notes' %}:</strong>
                                                 </p>
                                                 <strong>{% trans "Bugs and hyperlinks" %}: </strong>
-                                                [<a href="#" class="add-link-button" data-toggle="modal" data-target="#add-link-modal"> Add </a>]
                                                 <div>
                                                     <ul class="test-execution-hyperlinks"></ul>
+                                                    <template id="link-entry">
+                                                        <li><span class="link-icon"></span><a class="link-url" href="${link.url}">${link.name || link.url}</a></li>
+                                                    </template>
                                                 </div>
                                             </div>
                                         </div>
@@ -271,34 +284,30 @@ <h5><span class="test-executions-count"></span> Results</h5>
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true" aria-label="Close">
           <span class="pficon pficon-close"></span>
         </button>
-        <h4 class="modal-title" id="add-hyperlink-modal-title">Add hyperlink</h4>
+        <h4 class="modal-title" id="add-hyperlink-modal-title">{% trans "Add hyperlink" %}</h4>
       </div>
       <form class="form-horizontal add-hyperlink-form">
         <div class="modal-body">
           <div class="form-group">
-            <label class="col-sm-3 control-label" for="{{ link_form.url.id_for_label }}">URL</label>
+            <label class="col-sm-3 control-label" for="{{ link_form.url.id_for_label }}">{% trans "URL" %}</label>
             <div class="col-sm-9">
                 <input type="url" name="{{ link_form.url.name }}" maxlength="{{ link_form.url.field.max_length }}" {% if link_form.url.field.required %}required{% endif %} id="{{ link_form.url.id_for_label }}" class="form-control">
             </div>
           </div>
           <div class="form-group">
-            <label class="col-sm-3 control-label" for="{{ link_form.name.id_for_label }}">Name</label>
+            <label class="col-sm-3 control-label" for="{{ link_form.name.id_for_label }}">{% trans "Name" %}</label>
             <div class="col-sm-9">
                 <input type="text" name="{{ link_form.name.name }}" maxlength="{{ link_form.name.field.max_length }}" {% if link_form.name.field.required %}required{% endif %} id="{{ link_form.name.id_for_label }}" class="form-control">
             </div>
           </div>
           <div class="form-group">
-            <label class="col-sm-3 control-label" for="defectCheckbox">Is a defect</label>
-            <input class="col-sm-9 bootstrap-switch" type="checkbox" id="defectCheckbox"/>
-          </div>
-          <div class="form-group">
-            <label class="col-sm-3 control-label" for="autoUpdateCheckbox">Auto-update issue tracker</label>
-            <input class="col-sm-9 bootstrap-switch" type="checkbox" id="autoUpdateCheckbox"/>
+            <label class="col-md-3 col-lg-3 col-sm-3 control-label" for="defectCheckbox">{% trans "Is a defect" %}</label>
+            <input class="col-md-9 col-lg-9 col-sm-9 bootstrap-switch" type="checkbox" id="defectCheckbox" data-on-text="{% trans 'Yes' %}" data-off-text="{% trans 'No' %}"/>
           </div>
         </div>
         <div class="modal-footer">
-            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
-            <button type="submit" class="btn btn-primary add-hyperlink-button">Save</button>
+            <button type="button" class="btn btn-danger" data-dismiss="modal">{% trans "Cancel" %}</button>
+            <button type="submit" class="btn btn-primary add-hyperlink-button">{% trans "Save" %}</button>
         </div>
       </form>
     </div>