You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

339 lines
8.7 KiB

  1. /**
  2. * @author zhixin wen <wenzhixin2010@gmail.com>
  3. * extensions: https://github.com/hhurz/tableExport.jquery.plugin
  4. */
  5. const Utils = $.fn.bootstrapTable.utils
  6. const TYPE_NAME = {
  7. json: 'JSON',
  8. xml: 'XML',
  9. png: 'PNG',
  10. csv: 'CSV',
  11. txt: 'TXT',
  12. sql: 'SQL',
  13. doc: 'MS-Word',
  14. excel: 'MS-Excel',
  15. xlsx: 'MS-Excel (OpenXML)',
  16. powerpoint: 'MS-Powerpoint',
  17. pdf: 'PDF'
  18. }
  19. $.extend($.fn.bootstrapTable.defaults, {
  20. showExport: false,
  21. exportDataType: 'basic', // basic, all, selected
  22. exportTypes: ['json', 'xml', 'csv', 'txt', 'sql', 'excel'],
  23. exportOptions: {
  24. onCellHtmlData (cell, rowIndex, colIndex, htmlData) {
  25. if (cell.is('th')) {
  26. return cell.find('.th-inner').text()
  27. }
  28. return htmlData
  29. }
  30. },
  31. exportFooter: false
  32. })
  33. $.extend($.fn.bootstrapTable.columnDefaults, {
  34. forceExport: false,
  35. forceHide: false
  36. })
  37. $.extend($.fn.bootstrapTable.defaults.icons, {
  38. export: {
  39. bootstrap3: 'glyphicon-export icon-share',
  40. materialize: 'file_download',
  41. 'bootstrap-table': 'icon-download'
  42. }[$.fn.bootstrapTable.theme] || 'fa-download'
  43. })
  44. $.extend($.fn.bootstrapTable.locales, {
  45. formatExport () {
  46. return 'Export data'
  47. }
  48. })
  49. $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales)
  50. $.fn.bootstrapTable.methods.push('exportTable')
  51. $.extend($.fn.bootstrapTable.defaults, {
  52. // eslint-disable-next-line no-unused-vars
  53. onExportSaved (exportedRows) {
  54. return false
  55. }
  56. })
  57. $.extend($.fn.bootstrapTable.Constructor.EVENTS, {
  58. 'export-saved.bs.table': 'onExportSaved'
  59. })
  60. $.BootstrapTable = class extends $.BootstrapTable {
  61. initToolbar (...args) {
  62. const o = this.options
  63. let exportTypes = o.exportTypes
  64. this.showToolbar = this.showToolbar || o.showExport
  65. if (this.options.showExport) {
  66. if (typeof exportTypes === 'string') {
  67. const types = exportTypes.slice(1, -1).replace(/ /g, '').split(',')
  68. exportTypes = types.map(t => t.slice(1, -1))
  69. }
  70. this.$export = this.$toolbar.find('>.columns div.export')
  71. if (this.$export.length) {
  72. this.updateExportButton()
  73. return
  74. }
  75. this.buttons = Object.assign(this.buttons, {
  76. export: {
  77. html: exportTypes.length === 1 ? `
  78. <div class="export ${this.constants.classes.buttonsDropdown}"
  79. data-type="${exportTypes[0]}">
  80. <button class="${this.constants.buttonsClass}"
  81. aria-label="Export"
  82. type="button"
  83. title="${o.formatExport()}">
  84. ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.export) : ''}
  85. ${o.showButtonText ? o.formatExport() : ''}
  86. </button>
  87. </div>
  88. ` : `
  89. <div class="export ${this.constants.classes.buttonsDropdown}">
  90. <button class="${this.constants.buttonsClass} dropdown-toggle"
  91. aria-label="Export"
  92. data-toggle="dropdown"
  93. type="button"
  94. title="${o.formatExport()}">
  95. ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.export) : ''}
  96. ${o.showButtonText ? o.formatExport() : ''}
  97. ${this.constants.html.dropdownCaret}
  98. </button>
  99. </div>
  100. `
  101. }
  102. })
  103. }
  104. super.initToolbar(...args)
  105. this.$export = this.$toolbar.find('>.columns div.export')
  106. if (!this.options.showExport) {
  107. //return true;
  108. }
  109. let $menu = $(this.constants.html.toolbarDropdown.join(''))
  110. let $items = this.$export
  111. //判断是否需要根据自定义的下载来设置参数
  112. if(this.options.exportButton){
  113. $items = this.options.exportButton;
  114. }else{
  115. if (exportTypes.length > 1) {
  116. this.$export.append($menu)
  117. // themes support
  118. if ($menu.children().length) {
  119. $menu = $menu.children().eq(0)
  120. }
  121. for (const type of exportTypes) {
  122. if (TYPE_NAME.hasOwnProperty(type)) {
  123. const $item = $(Utils.sprintf(this.constants.html.pageDropdownItem,
  124. '', TYPE_NAME[type]))
  125. $item.attr('data-type', type)
  126. $menu.append($item)
  127. }
  128. }
  129. $items = $menu.children()
  130. }
  131. }
  132. this.updateExportButton()
  133. $items.click(e => {
  134. e.preventDefault()
  135. const type = $(e.currentTarget).data('type')
  136. const exportOptions = {
  137. type,
  138. escape: false
  139. }
  140. this.exportTable(exportOptions)
  141. })
  142. this.handleToolbar()
  143. }
  144. handleToolbar () {
  145. if (!this.$export) {
  146. return
  147. }
  148. if ($.fn.bootstrapTable.theme === 'foundation') {
  149. this.$export.find('.dropdown-pane').attr('id', 'toolbar-export-id')
  150. } else if ($.fn.bootstrapTable.theme === 'materialize') {
  151. this.$export.find('.dropdown-content').attr('id', 'toolbar-export-id')
  152. }
  153. if (super.handleToolbar) {
  154. super.handleToolbar()
  155. }
  156. }
  157. exportTable (options) {
  158. const o = this.options
  159. const stateField = this.header.stateField
  160. const isCardView = o.cardView
  161. const doExport = callback => {
  162. if (stateField) {
  163. this.hideColumn(stateField)
  164. }
  165. if (isCardView) {
  166. this.toggleView()
  167. }
  168. this.columns.forEach(row => {
  169. if (row.forceHide) {
  170. this.hideColumn(row.field)
  171. }
  172. })
  173. const data = this.getData()
  174. if (o.exportFooter) {
  175. const $footerRow = this.$tableFooter.find('tr').first()
  176. const footerData = {}
  177. const footerHtml = []
  178. $.each($footerRow.children(), (index, footerCell) => {
  179. const footerCellHtml = $(footerCell).children('.th-inner').first().html()
  180. footerData[this.columns[index].field] = footerCellHtml === '&nbsp;' ? null : footerCellHtml
  181. // grab footer cell text into cell index-based array
  182. footerHtml.push(footerCellHtml)
  183. })
  184. this.$body.append(this.$body.children().last()[0].outerHTML)
  185. const $lastTableRow = this.$body.children().last()
  186. $.each($lastTableRow.children(), (index, lastTableRowCell) => {
  187. $(lastTableRowCell).html(footerHtml[index])
  188. })
  189. }
  190. const hiddenColumns = this.getHiddenColumns()
  191. hiddenColumns.forEach(row => {
  192. if (row.forceExport) {
  193. this.showColumn(row.field)
  194. }
  195. })
  196. if (typeof o.exportOptions.fileName === 'function') {
  197. options.fileName = o.exportOptions.fileName()
  198. }
  199. this.$el.tableExport($.extend({
  200. onAfterSaveToFile: () => {
  201. if (o.exportFooter) {
  202. this.load(data)
  203. }
  204. if (stateField) {
  205. this.showColumn(stateField)
  206. }
  207. if (isCardView) {
  208. this.toggleView()
  209. }
  210. hiddenColumns.forEach(row => {
  211. if (row.forceExport) {
  212. this.hideColumn(row.field)
  213. }
  214. })
  215. this.columns.forEach(row => {
  216. if (row.forceHide) {
  217. this.showColumn(row.field)
  218. }
  219. })
  220. if (callback) callback()
  221. }
  222. }, o.exportOptions, options))
  223. }
  224. if (o.exportDataType === 'all' && o.pagination) {
  225. const eventName = o.sidePagination === 'server' ?
  226. 'post-body.bs.table' : 'page-change.bs.table'
  227. const virtualScroll = this.options.virtualScroll
  228. this.$el.one(eventName, () => {
  229. setTimeout(() => {
  230. doExport(() => {
  231. this.options.virtualScroll = virtualScroll
  232. this.togglePagination()
  233. })
  234. }, 0)
  235. })
  236. this.options.virtualScroll = false
  237. this.togglePagination()
  238. this.trigger('export-saved', this.getData())
  239. } else if (o.exportDataType === 'selected') {
  240. let data = this.getData()
  241. let selectedData = this.getSelections()
  242. const pagination = o.pagination
  243. if (!selectedData.length) {
  244. return
  245. }
  246. if (o.sidePagination === 'server') {
  247. data = {
  248. total: o.totalRows,
  249. [this.options.dataField]: data
  250. }
  251. selectedData = {
  252. total: selectedData.length,
  253. [this.options.dataField]: selectedData
  254. }
  255. }
  256. this.load(selectedData)
  257. if (pagination) {
  258. this.togglePagination()
  259. }
  260. doExport(() => {
  261. if (pagination) {
  262. this.togglePagination()
  263. }
  264. this.load(data)
  265. })
  266. this.trigger('export-saved', selectedData)
  267. } else {
  268. doExport()
  269. this.trigger('export-saved', this.getData(true))
  270. }
  271. }
  272. updateSelected () {
  273. super.updateSelected()
  274. this.updateExportButton()
  275. }
  276. updateExportButton () {
  277. if (this.options.exportDataType === 'selected') {
  278. this.$export.find('> button')
  279. .prop('disabled', !this.getSelections().length)
  280. }
  281. }
  282. }