adding sorting classes from #263 back due to messing up merged earlier

ratiw · Dec 23, 2017 · 43589b0 · 43589b0
1 parent b61e930
commit 43589b0
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 4 deletions.
diff --git a/docs/Vuetable-Properties.md b/docs/Vuetable-Properties.md
@@ -26,6 +26,7 @@
 - [reactive-api-url](#-reactive-api-url)
 - [render-icon](#-render-icon)
 - [row-class](#-row-class)
+- [show-sort-icons](#-show-sort-icons)
 - [sort-order](#-sort-order)
 - [table-height](#-table-height)
 - [track-by](#-track-by)

diff --git a/src/components/Vuetable.vue b/src/components/Vuetable.vue
@@ -16,13 +16,13 @@
               <th v-if="extractName(field.name) == '__component'"
                   @click="orderBy(field, $event)"
                     :style="{width: field.width}"
-                  :class="['vuetable-th-component-'+trackBy, field.titleClass, {'sortable': isSortable(field)}]"
+                  :class="['vuetable-th-component-'+trackBy, field.titleClass, sortClass(field), {'sortable': isSortable(field)}]"
                   v-html="renderTitle(field)"
               ></th>
               <th v-if="extractName(field.name) == '__slot'"
                   @click="orderBy(field, $event)"
                     :style="{width: field.width}"
-                  :class="['vuetable-th-slot-'+extractArgs(field.name), field.titleClass, {'sortable': isSortable(field)}]"
+                  :class="['vuetable-th-slot-'+extractArgs(field.name), field.titleClass, sortClass(field), {'sortable': isSortable(field)}]"
                   v-html="renderTitle(field)"
               ></th>
               <th v-if="extractName(field.name) == '__sequence'"
@@ -38,7 +38,7 @@
               <th @click="orderBy(field, $event)"
                 :id="'_' + field.name"
                   :style="{width: field.width}"
-                :class="['vuetable-th-'+field.name, field.titleClass,  {'sortable': isSortable(field)}]"
+                :class="['vuetable-th-'+field.name, field.titleClass, sortClass(field), {'sortable': isSortable(field)}]"
                 v-html="renderTitle(field)"
               ></th>
             </template>
@@ -627,7 +627,8 @@ export default {
 
       if (title.length > 0 && this.isInCurrentSortGroup(field) || this.hasSortableIcon(field)) {
         let style = `opacity:${this.sortIconOpacity(field)};position:relative;float:right`
-        return title + ' ' + this.renderIconTag(['sort-icon', this.sortIcon(field)], `style="${style}"`)
+        let iconTag = this.showSortIcons ? this.renderIconTag(['sort-icon', this.sortIcon(field)], `style="${style}"`) : ''
+        return title + ' ' + iconTag
       }
 
       return title
@@ -884,6 +885,16 @@ export default {
         direction: 'asc'
       });
     },
+    sortClass (field) {
+      let cls = ''
+      let i = this.currentSortOrderPosition(field)
+
+      if (i !== false) {
+        cls = (this.sortOrder[i].direction == 'asc') ? this.css.ascendingClass : this.css.descendingClass
+      }
+
+      return cls
+    },
     sortIcon (field) {
       let cls = this.css.sortableIcon
       let i = this.currentSortOrderPosition(field)