quasar/src/components/data-table/table-header.js at 1b20b4d90a16bea4c052d66739fd7e50c0d202fa · hipertracker/quasar · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
import { QProgress } from '../progress'
import { QCheckbox } from '../checkbox'
import { QIcon } from '../icon'

export default {
  methods: {
    getTableHeader (h) {
      if (this.noHeader) {
        return
      }

      const child = [ this.getTableHeaderRow(h) ]

      if (this.loader) {
        child.push(h('tr', { staticClass: 'q-datatable-progress animate-fade' }, [
          h('td', { attrs: {colspan: '100%'} }, [
            h(QProgress, {
              props: {
                color: this.color,
                indeterminate: true
              }
            })
          ])
        ]))
      }

      return h('thead', child)
    },
    getTableHeaderRow (h) {
      const
        header = this.$scopedSlots.header,
        headerCell = this.$scopedSlots['header-cell']

      if (header) {
        return header(this.addTableHeaderRowMeta({cols: this.computedColumns, sort: this.sort}))
      }

      let mapFn

      if (headerCell) {
        mapFn = col => headerCell({col, cols: this.computedColumns, sort: this.sort})
      }
      else {
        mapFn = col => h('th',
          {
            staticClass: col.__thClass,
            on: {click: () => { if (col.sortable) { this.sort(col) } }}
          }, [
            col.label,
            h(QIcon, {
              props: { name: 'arrow_upward' },
              staticClass: col.__iconClass
            })
          ]
        )
      }
      const child = this.computedColumns.map(mapFn)

      if (this.singleSelection) {
        child.unshift(h('th', [' ']))
      }
      else if (this.multipleSelection) {
        child.unshift(h('th', [
          h(QCheckbox, {
            props: {
              color: this.color,
              value: this.allRowsSelected,
              indeterminate: this.someRowsSelected
            },
            on: {
              input: val => {
                if (this.someRowsSelected) {
                  val = false
                }
                this.computedRows.forEach(row => {
                  this.$set(this.multipleSelected, row[this.rowKey], val)
                })
              }
            }
          })
        ]))
      }

      return h('tr', child)
    },
    addTableHeaderRowMeta (data) {
      if (this.multipleSelection) {
        Object.defineProperty(data, 'selected', {
          get: () => this.allRowsSelected,
          set: val => {
            if (this.someRowsSelected) {
              val = false
            }
            this.computedRows.forEach(row => {
              this.$set(this.multipleSelected, row[this.rowKey], val)
            })
          }
        })
        data.partialSelected = this.someRowsSelected
        data.multipleSelect = true
      }

      return data
    }
  }
}