index.coffee 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. if globalThis.stylFns and globalThis.stylFns['app/components/Admin/DataTable/index.styl']
  2. styleElement = document.createElement('style')
  3. styleElement.type = 'text/css'
  4. styleElement.textContent = globalThis.stylFns['app/components/Admin/DataTable/index.styl']
  5. document.head.appendChild(styleElement)
  6. module.exports =
  7. name: 'data-table'
  8. props:
  9. data:
  10. type: Array
  11. default: -> []
  12. columns:
  13. type: Array
  14. default: -> []
  15. loading:
  16. type: Boolean
  17. default: false
  18. selectable:
  19. type: Boolean
  20. default: false
  21. data: ->
  22. {
  23. selectedItems: []
  24. sortField: ''
  25. sortDirection: 'asc'
  26. currentPage: 1
  27. pageSize: 20
  28. searchQuery: ''
  29. }
  30. computed:
  31. filteredData: ->
  32. if !@searchQuery
  33. return @data
  34. query = @searchQuery.toLowerCase()
  35. return @data.filter (item) =>
  36. @columns.some (col) =>
  37. value = item[col.key]
  38. return false unless value?
  39. String(value).toLowerCase().includes(query)
  40. sortedData: ->
  41. if !@sortField
  42. return @filteredData
  43. return @filteredData.sort (a, b) =>
  44. aVal = a[@sortField]
  45. bVal = b[@sortField]
  46. if aVal < bVal
  47. return @sortDirection == 'asc' ? -1 : 1
  48. if aVal > bVal
  49. return @sortDirection == 'asc' ? 1 : -1
  50. return 0
  51. paginatedData: ->
  52. startIndex = (@currentPage - 1) * @pageSize
  53. endIndex = startIndex + @pageSize
  54. return @sortedData.slice(startIndex, endIndex)
  55. totalPages: ->
  56. Math.ceil(@sortedData.length / @pageSize)
  57. methods:
  58. sort: (field) ->
  59. if @sortField == field
  60. @sortDirection = if @sortDirection == 'asc' then 'desc' else 'asc'
  61. else
  62. @sortField = field
  63. @sortDirection = 'asc'
  64. selectAll: (checked) ->
  65. if checked
  66. @selectedItems = [...@paginatedData]
  67. else
  68. @selectedItems = []
  69. selectItem: (item, checked) ->
  70. if checked
  71. @selectedItems.push(item)
  72. else
  73. @selectedItems = @selectedItems.filter (i) -> i != item
  74. isSelected: (item) ->
  75. @selectedItems.includes(item)
  76. editItem: (item) ->
  77. @$emit 'edit', item
  78. deleteItem: (item) ->
  79. if confirm('Вы уверены, что хотите удалить этот элемент?')
  80. @$emit 'delete', item
  81. render: (new Function '_ctx', '_cache', globalThis.renderFns['app/components/Admin/DataTable/index.pug'])()