list.tsx 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. import Base from "./base.vue";
  2. import Stripe from "./stripe.vue";
  3. import Border from "./border.vue";
  4. import Status from "./status.vue";
  5. import FixHeader from "./fixHeader.vue";
  6. import FixColumn from "./fixColumn.vue";
  7. import FluidHeight from "./fluidHeight.vue";
  8. import GroupHeader from "./groupHeader.vue";
  9. import Radio from "./radio.vue";
  10. import MultipleChoice from "./multipleChoice.vue";
  11. import Sortable from "./sortable.vue";
  12. import Filters from "./filters.vue";
  13. import ColumnTemplate from "./column-template/index.vue";
  14. import HeaderRenderer from "./header-renderer/index.vue";
  15. import Expand from "./expand.vue";
  16. import TreeTable from "./tree.vue";
  17. import TotalRow from "./totalRow.vue";
  18. import Merge from "./merge.vue";
  19. import CustomIndex from "./customIndex.vue";
  20. import Layout from "./layout.vue";
  21. import NestProp from "./nestProp.vue";
  22. import ImgPreview from "./imgPreview.vue";
  23. const rendContent = (val: string) =>
  24. `代码位置:src/views/table/base/${val}.vue`;
  25. export const list = [
  26. {
  27. key: "base",
  28. content: rendContent("base"),
  29. title: "基础表格",
  30. component: Base
  31. },
  32. {
  33. key: "stripe",
  34. content: rendContent("stripe"),
  35. title: "带斑马纹表格",
  36. component: Stripe
  37. },
  38. {
  39. key: "border",
  40. content: rendContent("border"),
  41. title: "带边框表格",
  42. component: Border
  43. },
  44. {
  45. key: "status",
  46. content: rendContent("status"),
  47. title: "带状态表格",
  48. component: Status
  49. },
  50. {
  51. key: "fixHeader",
  52. content: rendContent("fixHeader"),
  53. title: "固定表头",
  54. component: FixHeader
  55. },
  56. {
  57. key: "fixColumn",
  58. content: rendContent("fixColumn"),
  59. title: "固定列",
  60. component: FixColumn
  61. },
  62. {
  63. key: "fixColumnHeader",
  64. content: rendContent("fixColumn"),
  65. title: "固定列和表头",
  66. component: () => <FixColumn height={"360"} />
  67. },
  68. {
  69. key: "groupHeader",
  70. content: rendContent("groupHeader"),
  71. title: "多级表头(表头分组)",
  72. component: GroupHeader
  73. },
  74. {
  75. key: "fluidHeight",
  76. content: rendContent("fluidHeight"),
  77. title: "流体高度",
  78. component: FluidHeight
  79. },
  80. {
  81. key: "radio",
  82. content: rendContent("radio"),
  83. title: "单选",
  84. component: Radio
  85. },
  86. {
  87. key: "multipleChoice",
  88. content: rendContent("multipleChoice"),
  89. title: "多选",
  90. component: MultipleChoice
  91. },
  92. {
  93. key: "sortable",
  94. content: rendContent("sortable"),
  95. title: "排序和格式化",
  96. component: Sortable
  97. },
  98. {
  99. key: "filters",
  100. content: rendContent("filters"),
  101. title: "筛选",
  102. component: Filters
  103. },
  104. {
  105. key: "column-template",
  106. content: rendContent("column-template/index"),
  107. title: "自定义列模板",
  108. component: ColumnTemplate
  109. },
  110. {
  111. key: "header-renderer",
  112. content: rendContent("header-renderer/index"),
  113. title: "自定义表头",
  114. component: HeaderRenderer
  115. },
  116. {
  117. key: "expand",
  118. content: rendContent("expand"),
  119. title: "展开行",
  120. component: Expand
  121. },
  122. {
  123. key: "tree",
  124. content: rendContent("tree"),
  125. title: "树形数据与懒加载",
  126. component: TreeTable
  127. },
  128. {
  129. key: "totalRow",
  130. content: rendContent("totalRow"),
  131. title: "表尾合计行",
  132. component: TotalRow
  133. },
  134. {
  135. key: "merge",
  136. content: rendContent("merge"),
  137. title: "合并行或列",
  138. component: Merge
  139. },
  140. {
  141. key: "customIndex",
  142. content: rendContent("customIndex"),
  143. title: "自定义索引",
  144. component: CustomIndex
  145. },
  146. {
  147. key: "layout",
  148. content: rendContent("layout"),
  149. title: "表格布局",
  150. component: Layout
  151. },
  152. {
  153. key: "nestProp",
  154. content: rendContent("nestProp"),
  155. title: "多种数据格式(深层结构)",
  156. component: NestProp
  157. },
  158. {
  159. key: "imgPreview",
  160. content: rendContent("imgPreview"),
  161. title: "图像预览",
  162. component: ImgPreview
  163. }
  164. ];