vxeTable.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import XEUtils from "xe-utils";
  2. import VxeUI from "vxe-pc-ui";
  3. import VxeUITable from "vxe-table";
  4. import VxeUIPluginRenderElement from "@vxe-ui/plugin-render-element";
  5. import VxeUIPluginExportXLSX from "@vxe-ui/plugin-export-xlsx";
  6. import ExcelJS from "exceljs";
  7. import config from "@/config/select";
  8. import "vxe-pc-ui/lib/style.css";
  9. import "vxe-table/lib/style.css";
  10. import "@vxe-ui/plugin-render-element/dist/style.css";
  11. // 黑夜模式
  12. localStorage.getItem("APP_DARK") && VxeUITable.VxeUI.setTheme("dark");
  13. // 自定义renderer
  14. import tableSearch from "@/components/scTable/renderer/table-search";
  15. import formSelect from "@/components/scTable/renderer/form-select";
  16. import formRadio from "@/components/scTable/renderer/form-radio";
  17. import cellTag from "@/components/scTable/renderer/cell-tag";
  18. VxeUI.renderer.mixin({
  19. "$table-search": {
  20. renderToolbarButton(renderOpts, params) {
  21. return h(tableSearch, { renderOpts, params });
  22. }
  23. },
  24. "$form-select": {
  25. renderFormItemContent(renderOpts, params) {
  26. const field = XEUtils.get(params, "field")
  27. const defaultValue = XEUtils.get(params.data, field);
  28. const storageKey = XEUtils.get(renderOpts, "storageKey")
  29. const api = XEUtils.get(renderOpts, "api", {})
  30. const slot = XEUtils.get(renderOpts, "slot", {})
  31. const props = XEUtils.get(renderOpts, "props", {})
  32. const options = XEUtils.get(renderOpts, "options", [])
  33. const optionProps = XEUtils.get(renderOpts, "optionProps", config.props)
  34. const events = XEUtils.get(renderOpts, "events", {})
  35. return h(formSelect, { renderOpts: { defaultValue, storageKey, api, props, options, optionProps, slot, events }, params });
  36. }
  37. },
  38. "$form-radio": {
  39. renderFormItemContent(renderOpts, params) {
  40. return h(formRadio, { renderOpts, params });
  41. }
  42. },
  43. "$cell-tag": {
  44. renderTableCell(renderOpts, params) {
  45. const field = XEUtils.get(params, "column.field")
  46. const row = XEUtils.get(XEUtils.findTree(params.$grid.getData(), item => item.id == params.rowid), "item") || params.row
  47. const defaultValue = XEUtils.has(renderOpts, "formatter") && renderOpts.formatter(row) || params.$grid.getCellLabel(row, field)
  48. const props = XEUtils.get(renderOpts, "props", {})
  49. const options = XEUtils.get(renderOpts, "options", {})
  50. return h(cellTag, { renderOpts: { defaultValue, props, options }, params });
  51. }
  52. }
  53. })
  54. VxeUI.use(VxeUIPluginRenderElement).use(VxeUIPluginExportXLSX, { ExcelJS });
  55. export default {
  56. install(app) {
  57. app.use(VxeUI).use(VxeUITable);
  58. }
  59. }