Merge branch 'feature/tt-table-header-class' into 'master'

added headerClass property to tt-table

See merge request fronk/thetool!501

public/plugins/vue/tt-components/tt-table.js

@@ -15,6 +15,7 @@
  *   For 'iconSelect', an additional 'icon' property (CSS class for the icon) is required.
  * @property {boolean} [sortable=true] - (Optional) Indicates whether the column is sortable. Default is true.
  * @property {string} [class] - (Optional) Additional CSS classes to apply to the column.
+ * @property {string} [headerClass] - (Optional) Additional CSS classes to apply to the column header.
  * @property {string} [suffix] - (Optional) Additional CSS classes to apply to the column.
  * @property {string} [prefix] - (Optional) Additional CSS classes to apply to the column.
  * */
@@ -144,13 +145,13 @@ Vue.component('tt-table', {
                     <tr>
                       <th scope="col" v-for="column in columns"
                           :ref="'table_header_'+column.key"
+                          :class="column.headerClass ? column.headerClass : 'tt-table-header'"
                           v-if="!hiddenColumns.includes(column.key)"
-                          :style="'vertical-align: top; text-align: center;' + 
+                          :style="(column.filter === 'dateRange' ? 'min-width: 260px;' : '') + 
-                  (column.filter === 'dateRange' ? 'min-width: 260px;' : '') + 
                   (originalColumnWidths[column.key] ? 'width: ' + originalColumnWidths[column.key] + 'px;' : '')"
                       >
                         <div 
-                             style="text-align:center; white-space: nowrap;word-break: keep-all;user-select: none;"
+                             style="white-space: nowrap;word-break: keep-all;user-select: none;"
                              :style="{ 'cursor': column.sortable ? 'pointer' : 'default' }"
                              @click="column.sortable && !disableFiltering ? setOrder(column.key) : undefined">
                           {{ column.text }}
@@ -596,6 +597,7 @@ Vue.component('tt-table', {
                     filterOptions: column.filterOptions || undefined,
                     sortable:      column.sortable !== undefined ? column.sortable : true,
                     class:         column.class !== undefined ? column.class : '',
+                    headerClass:   column.headerClass || false,
                     prefix:        column.prefix || '',
                     suffix:        column.suffix || '',
                     priority:      column.priority + 100 || i--