@netang/quasar 0.2.32 → 0.2.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (289) hide show
  1. package/.editorconfig +12 -12
  2. package/_docs/docs/components/field-table.md +58 -58
  3. package/_docs/docs/components/field-tree.md +21 -21
  4. package/_docs/docs/components/table.md +24 -24
  5. package/_docs/docs/utils/table.md +196 -196
  6. package/components/column-title/index.vue +38 -38
  7. package/components/data/index.vue +20 -20
  8. package/components/dialog/img-viewer/index.vue +697 -697
  9. package/components/dialog/index.vue +387 -387
  10. package/components/dragger/index.vue +203 -203
  11. package/components/drawer/index.vue +303 -303
  12. package/components/editor-code/index.vue +328 -328
  13. package/components/empty/index.vue +82 -82
  14. package/components/field-date/index.vue +860 -860
  15. package/components/field-date/methods.js +100 -100
  16. package/components/field-table/index.vue +1483 -1483
  17. package/components/field-text/index.vue +166 -166
  18. package/components/field-tree/index.vue +755 -755
  19. package/components/img/index.vue +279 -279
  20. package/components/input-number/index.vue +560 -560
  21. package/components/list-menu/index.vue +149 -149
  22. package/components/list-menu-item/index.vue +79 -79
  23. package/components/mixed-table/index.vue +532 -532
  24. package/components/mixed-table-splitter/index.vue +377 -377
  25. package/components/power-page/index.vue +96 -96
  26. package/components/price/index.vue +188 -188
  27. package/components/private/components/index.js +11 -11
  28. package/components/private/components/move-to-tree/index.vue +154 -154
  29. package/components/private/edit-power-data/index.vue +846 -846
  30. package/components/private/table-visible-columns-button/index.vue +114 -114
  31. package/components/render/index.vue +123 -123
  32. package/components/search/index.vue +231 -231
  33. package/components/search-item/index.vue +210 -210
  34. package/components/select/index.vue +177 -177
  35. package/components/splitter/index.vue +422 -422
  36. package/components/table/index.vue +513 -513
  37. package/components/table-column-fixed/index.vue +110 -110
  38. package/components/table-pagination/index.vue +192 -192
  39. package/components/table-summary/index.vue +107 -107
  40. package/components/thumbnail/index.vue +72 -72
  41. package/components/toolbar/index.vue +150 -150
  42. package/components/tree/index.vue +1728 -1728
  43. package/components/tree/virtual-scroll.vue +41 -41
  44. package/components/uploader/index.vue +196 -196
  45. package/components/uploader-query/index.vue +945 -945
  46. package/components/value-format/index.vue +274 -274
  47. package/components/virtual-scroll/index.vue +136 -136
  48. package/configs/area3.js +1 -1
  49. package/docs/404.html +33 -33
  50. package/docs/assets/404.html-60b35caa.js +1 -1
  51. package/docs/assets/404.html-d1e63d77.js +1 -1
  52. package/docs/assets/alert.html-b2a2a72f.js +5 -5
  53. package/docs/assets/alert.html-ba46d137.js +1 -1
  54. package/docs/assets/app-9f30aa4b.js +6 -6
  55. package/docs/assets/area.html-01b9b58d.js +42 -42
  56. package/docs/assets/area.html-9a4fce6a.js +1 -1
  57. package/docs/assets/arr.html-145d27e7.js +1 -1
  58. package/docs/assets/arr.html-674e65ab.js +11 -11
  59. package/docs/assets/auth.html-579fa830.js +1 -1
  60. package/docs/assets/auth.html-8544ed95.js +8 -8
  61. package/docs/assets/bus.html-c71254aa.js +1 -1
  62. package/docs/assets/bus.html-dc7d3d19.js +6 -6
  63. package/docs/assets/column-title.html-c735cb5a.js +3 -3
  64. package/docs/assets/column-title.html-e9316762.js +1 -1
  65. package/docs/assets/confirm.html-ddfdc27f.js +10 -10
  66. package/docs/assets/confirm.html-ef3e2bef.js +1 -1
  67. package/docs/assets/copy.html-d20345b6.js +1 -1
  68. package/docs/assets/copy.html-ef8c8571.js +13 -13
  69. package/docs/assets/data.html-6432175d.js +30 -30
  70. package/docs/assets/data.html-a3b05d5b.js +1 -1
  71. package/docs/assets/dialog.html-1f698e5a.js +1 -1
  72. package/docs/assets/dialog.html-62902b83.js +68 -68
  73. package/docs/assets/dialog.html-baea77c9.js +1 -1
  74. package/docs/assets/dialog.html-bb082fc4.js +1 -1
  75. package/docs/assets/dict.html-1311da3d.js +23 -23
  76. package/docs/assets/dict.html-b96fbf0c.js +1 -1
  77. package/docs/assets/dictOptions.html-7c4f40a5.js +1 -1
  78. package/docs/assets/dictOptions.html-fb99d175.js +5 -5
  79. package/docs/assets/dragger.html-668d3efa.js +1 -1
  80. package/docs/assets/dragger.html-749d585a.js +1 -1
  81. package/docs/assets/editor-code.html-6ab26ea9.js +1 -1
  82. package/docs/assets/editor-code.html-d196205d.js +1 -1
  83. package/docs/assets/empty.html-1c139131.js +1 -1
  84. package/docs/assets/empty.html-1e9c441d.js +1 -1
  85. package/docs/assets/field-date.html-069fdb13.js +1 -1
  86. package/docs/assets/field-date.html-ad204aa9.js +1 -1
  87. package/docs/assets/field-table.html-ce480f03.js +1 -1
  88. package/docs/assets/field-table.html-d9236160.js +1 -1
  89. package/docs/assets/field-text.html-7277c62f.js +1 -1
  90. package/docs/assets/field-text.html-ccb4cecf.js +1 -1
  91. package/docs/assets/field-tree.html-519bfb45.js +1 -1
  92. package/docs/assets/field-tree.html-fdc748d6.js +1 -1
  93. package/docs/assets/form.html-2b562c37.js +2 -2
  94. package/docs/assets/form.html-75104cd5.js +1 -1
  95. package/docs/assets/framework-204010b2.js +5 -5
  96. package/docs/assets/getData.html-990e3787.js +1 -1
  97. package/docs/assets/getData.html-bb72025f.js +34 -34
  98. package/docs/assets/getFile.html-42368004.js +1 -1
  99. package/docs/assets/getFile.html-99abd054.js +3 -3
  100. package/docs/assets/getImage.html-3429c5a1.js +1 -1
  101. package/docs/assets/getImage.html-4d886d83.js +3 -3
  102. package/docs/assets/getTime.html-7435f922.js +1 -1
  103. package/docs/assets/getTime.html-b37f49eb.js +20 -20
  104. package/docs/assets/img.html-7d1da657.js +1 -1
  105. package/docs/assets/img.html-fbea1105.js +1 -1
  106. package/docs/assets/index.html-1695dd7c.js +1 -1
  107. package/docs/assets/index.html-65a4aa67.js +1 -1
  108. package/docs/assets/index.html-7b98d5bd.js +1 -1
  109. package/docs/assets/index.html-c01f2648.js +1 -1
  110. package/docs/assets/input-number.html-0b250d2a.js +1 -1
  111. package/docs/assets/input-number.html-a8eb0378.js +1 -1
  112. package/docs/assets/list-menu-item.html-7f1b4611.js +1 -1
  113. package/docs/assets/list-menu-item.html-84ed5ab8.js +1 -1
  114. package/docs/assets/list-menu.html-28b4163f.js +1 -1
  115. package/docs/assets/list-menu.html-cb6ba95b.js +1 -1
  116. package/docs/assets/loading.html-dae9e39d.js +6 -6
  117. package/docs/assets/loading.html-dc74c9e6.js +1 -1
  118. package/docs/assets/notify.html-e6c4c514.js +1 -1
  119. package/docs/assets/notify.html-f2c4d914.js +8 -8
  120. package/docs/assets/power-page.html-32e02f82.js +1 -1
  121. package/docs/assets/power-page.html-485e77da.js +1 -1
  122. package/docs/assets/power.html-d258cc19.js +93 -93
  123. package/docs/assets/power.html-e490bd32.js +1 -1
  124. package/docs/assets/previewImage.html-6a6b4245.js +1 -1
  125. package/docs/assets/previewImage.html-c5b7e945.js +2 -2
  126. package/docs/assets/price.html-1882c548.js +19 -19
  127. package/docs/assets/price.html-94d3f5be.js +1 -1
  128. package/docs/assets/price.html-d213df0f.js +1 -1
  129. package/docs/assets/price.html-deaf880f.js +1 -1
  130. package/docs/assets/render.html-8efcbdd4.js +1 -1
  131. package/docs/assets/render.html-df228e38.js +1 -1
  132. package/docs/assets/rule.html-2cd57fc2.js +13 -13
  133. package/docs/assets/rule.html-61662001.js +1 -1
  134. package/docs/assets/ruleValid.html-04fe2552.js +1 -1
  135. package/docs/assets/ruleValid.html-e0a776af.js +14 -14
  136. package/docs/assets/search-0782d0d1.svg +1 -1
  137. package/docs/assets/search-item.html-3f75394c.js +1 -1
  138. package/docs/assets/search-item.html-4e942ecd.js +1 -1
  139. package/docs/assets/search.html-2807043e.js +1 -1
  140. package/docs/assets/search.html-c24f8806.js +1 -1
  141. package/docs/assets/select.html-00d0607c.js +1 -1
  142. package/docs/assets/select.html-de7731f5.js +1 -1
  143. package/docs/assets/splitter.html-56f51a70.js +1 -1
  144. package/docs/assets/splitter.html-f5c836d7.js +1 -1
  145. package/docs/assets/style-161e43ab.css +1 -1
  146. package/docs/assets/symbols.html-a6aea4bf.js +1 -1
  147. package/docs/assets/symbols.html-b1f65bad.js +21 -21
  148. package/docs/assets/table-column-fixed.html-3a69e7b2.js +1 -1
  149. package/docs/assets/table-column-fixed.html-e763c38b.js +1 -1
  150. package/docs/assets/table-pagination.html-236934d3.js +1 -1
  151. package/docs/assets/table-pagination.html-c37ee2ac.js +1 -1
  152. package/docs/assets/table-splitter.html-07eab15c.js +1 -1
  153. package/docs/assets/table-splitter.html-7670ee65.js +1 -1
  154. package/docs/assets/table-summary.html-04db434f.js +1 -1
  155. package/docs/assets/table-summary.html-943c65a0.js +1 -1
  156. package/docs/assets/table.html-36253ad7.js +1 -1
  157. package/docs/assets/table.html-7f9c5d1b.js +38 -38
  158. package/docs/assets/table.html-93d53dc8.js +1 -1
  159. package/docs/assets/table.html-ac99b9cb.js +1 -1
  160. package/docs/assets/thumbnail.html-bab1976b.js +1 -1
  161. package/docs/assets/thumbnail.html-eb64e5e8.js +1 -1
  162. package/docs/assets/timestamp.html-4e54f79b.js +13 -13
  163. package/docs/assets/timestamp.html-d0e1b88a.js +1 -1
  164. package/docs/assets/toast.html-58ecbe21.js +1 -1
  165. package/docs/assets/toast.html-c9b9d36b.js +6 -6
  166. package/docs/assets/toolbar.html-83d9f97c.js +1 -1
  167. package/docs/assets/toolbar.html-ff7b8c92.js +1 -1
  168. package/docs/assets/tree.html-d07cbe79.js +23 -23
  169. package/docs/assets/tree.html-ea04193e.js +1 -1
  170. package/docs/assets/uploader-query.html-05590718.js +1 -1
  171. package/docs/assets/uploader-query.html-3175bac5.js +1 -1
  172. package/docs/assets/uploader.html-36da4394.js +2 -2
  173. package/docs/assets/uploader.html-6b5f3079.js +1 -1
  174. package/docs/assets/uploader.html-b9340b57.js +1 -1
  175. package/docs/assets/uploader.html-bc1c22e3.js +1 -1
  176. package/docs/assets/value-format.html-8ae3d47d.js +1 -1
  177. package/docs/assets/value-format.html-afa99b3d.js +1 -1
  178. package/docs/components/column-title.html +35 -35
  179. package/docs/components/data.html +62 -62
  180. package/docs/components/dialog.html +33 -33
  181. package/docs/components/dragger.html +33 -33
  182. package/docs/components/editor-code.html +33 -33
  183. package/docs/components/empty.html +33 -33
  184. package/docs/components/field-date.html +33 -33
  185. package/docs/components/field-table.html +33 -33
  186. package/docs/components/field-text.html +33 -33
  187. package/docs/components/field-tree.html +33 -33
  188. package/docs/components/img.html +33 -33
  189. package/docs/components/input-number.html +33 -33
  190. package/docs/components/list-menu-item.html +33 -33
  191. package/docs/components/list-menu.html +33 -33
  192. package/docs/components/power-page.html +33 -33
  193. package/docs/components/price.html +33 -33
  194. package/docs/components/render.html +33 -33
  195. package/docs/components/search-item.html +33 -33
  196. package/docs/components/search.html +33 -33
  197. package/docs/components/select.html +33 -33
  198. package/docs/components/splitter.html +33 -33
  199. package/docs/components/table-column-fixed.html +33 -33
  200. package/docs/components/table-pagination.html +33 -33
  201. package/docs/components/table-splitter.html +33 -33
  202. package/docs/components/table-summary.html +33 -33
  203. package/docs/components/table.html +33 -33
  204. package/docs/components/thumbnail.html +33 -33
  205. package/docs/components/toolbar.html +33 -33
  206. package/docs/components/uploader-query.html +33 -33
  207. package/docs/components/uploader.html +33 -33
  208. package/docs/components/value-format.html +33 -33
  209. package/docs/css/index.css +3 -3
  210. package/docs/index.html +33 -33
  211. package/docs/utils/alert.html +37 -37
  212. package/docs/utils/area.html +74 -74
  213. package/docs/utils/arr.html +43 -43
  214. package/docs/utils/auth.html +40 -40
  215. package/docs/utils/bus.html +38 -38
  216. package/docs/utils/confirm.html +42 -42
  217. package/docs/utils/copy.html +45 -45
  218. package/docs/utils/dialog.html +100 -100
  219. package/docs/utils/dict.html +55 -55
  220. package/docs/utils/dictOptions.html +37 -37
  221. package/docs/utils/form.html +34 -34
  222. package/docs/utils/getData.html +66 -66
  223. package/docs/utils/getFile.html +35 -35
  224. package/docs/utils/getImage.html +35 -35
  225. package/docs/utils/getTime.html +52 -52
  226. package/docs/utils/index.html +33 -33
  227. package/docs/utils/loading.html +38 -38
  228. package/docs/utils/notify.html +40 -40
  229. package/docs/utils/power.html +125 -125
  230. package/docs/utils/previewImage.html +34 -34
  231. package/docs/utils/price.html +51 -51
  232. package/docs/utils/rule.html +45 -45
  233. package/docs/utils/ruleValid.html +46 -46
  234. package/docs/utils/symbols.html +53 -53
  235. package/docs/utils/table.html +70 -70
  236. package/docs/utils/timestamp.html +45 -45
  237. package/docs/utils/toast.html +38 -38
  238. package/docs/utils/tree.html +55 -55
  239. package/docs/utils/uploader.html +34 -34
  240. package/package.json +25 -25
  241. package/sass/common.scss +184 -184
  242. package/sass/index.scss +12 -12
  243. package/sass/line.scss +39 -39
  244. package/sass/quasar/btn.scss +46 -46
  245. package/sass/quasar/common.scss +3 -3
  246. package/sass/quasar/drawer.scss +6 -6
  247. package/sass/quasar/field.scss +259 -259
  248. package/sass/quasar/loading.scss +6 -6
  249. package/sass/quasar/table.scss +168 -168
  250. package/sass/quasar/toolbar.scss +22 -22
  251. package/sass/variables.scss +140 -140
  252. package/store/index.js +29 -29
  253. package/utils/$auth.js +128 -128
  254. package/utils/$form.js +72 -72
  255. package/utils/$power.js +1494 -1494
  256. package/utils/$render.js +75 -75
  257. package/utils/$rule.js +13 -13
  258. package/utils/$ruleValid.js +10 -10
  259. package/utils/$search.js +416 -416
  260. package/utils/$table.js +1349 -1348
  261. package/utils/$tree.js +682 -682
  262. package/utils/alert.js +12 -12
  263. package/utils/area.js +400 -400
  264. package/utils/arr.js +51 -51
  265. package/utils/bus.js +6 -6
  266. package/utils/config.js +66 -66
  267. package/utils/confirm.js +11 -11
  268. package/utils/copy.js +30 -30
  269. package/utils/dialog.js +36 -36
  270. package/utils/dict.js +21 -21
  271. package/utils/dictOptions.js +28 -28
  272. package/utils/getData.js +88 -88
  273. package/utils/getFile.js +67 -67
  274. package/utils/getImage.js +276 -276
  275. package/utils/getTime.js +113 -113
  276. package/utils/index.js +67 -67
  277. package/utils/loading.js +15 -15
  278. package/utils/notify.js +13 -13
  279. package/utils/play.js +40 -40
  280. package/utils/previewImage.js +14 -14
  281. package/utils/price.js +18 -18
  282. package/utils/symbols.js +18 -18
  283. package/utils/timestamp.js +18 -18
  284. package/utils/toast.js +13 -13
  285. package/utils/uploader.js +2114 -2114
  286. package/utils/useAuth.js +30 -30
  287. package/utils/useFileUrl.js +26 -26
  288. package/utils/useRouter.js +47 -47
  289. package/utils/useSearch.js +584 -562
@@ -1,196 +1,196 @@
1
- # $table 表格
2
-
3
- ::: tip
4
- `@netang/quasar/utils/$table.js` [Github](https://github.com/netangsoft/netang-quasar/blob/main/utils/%24table.js) [Gitee](https://gitee.com/jinmarcus/netang-quasar/blob/main/utils/%24table.js)
5
-
6
- 表格工具
7
- :::
8
-
9
- ## $table.create
10
-
11
- 创建表格实例
12
-
13
- - 类型
14
-
15
- ```javascript
16
- $table.create(options: Object): Object
17
- ```
18
-
19
- ### options 参数
20
-
21
- | 参数名 | 说明 | 类型 | 可选值 | 默认值 | 示例 |
22
- |----------------------|----------------|------------|---------------------------------------------|-------------------------------------|-----|
23
- | path | 路由路径 | `String` | - | - | - |
24
- | url | 请求地址(默认为 path) | `String` | - | - | - |
25
- | query | 路由参数 | `Object` | - | { } | - |
26
- | data | 附加请求数据 | `Object` | - | { } | - |
27
- | rowKey | 表格行唯一键值 | `String` | - | id | - |
28
- | selection | 选择类型 | `String` | `none` / `single` / `multiple` | single | - |
29
- | separator | 分隔栏 | `String` | `horizontal` / `vertical` / `cell` / `none` | cell | - |
30
- | selected | 初始已选数据 | `Array` | - | [ ] | - |
31
- | loading | 初始表格加载状态 | `Boolean` | - | false | - |
32
- | columns | 表格列数据(对象数组) | `Array` | - | [ ] | - |
33
- | visibleColumns | 初始可见列 | `Array` | - | [ ] | - |
34
- | rows | 表格行数据 | `Array` | - | [ ] | - |
35
- | pagination | 表格翻页参数 | `Object` | - | - | - |
36
- | rowsPerPageOptions | 每页显示行数选项 | `Array` | - | [ 30, 40, 50, 100, 200, 500, 1000 ] | - |
37
- | request | 自定义请求方法 | `Function` | - | - | - |
38
- | formatRow | 格式化单条数据 | `Function` | - | - | - |
39
- | httpSettings | http 设置 | `Object` | - | - | - |
40
- | search | 是否开启初始搜素 | `Boolean` | - | true | - |
41
- | summary | 是否开启合计 | `Boolean` | - | false | - |
42
- | searchFromQuery | 从参数中获取搜索值 | `Boolean` | - | true | - |
43
- | showGrid | 是否显示宫格 | `Boolean` | - | true | - |
44
- | showVisibleColumns | 是否显示可见列 | `Boolean` | - | true | - |
45
- | cache | 是否开启缓存 | `Boolean` | - | true | - |
46
- | refreshResetSelected | 是否刷新后清空已选数据 | `Boolean` | - | true | - |
47
- | rowClick | 单击表格行事件 | `Function` | - | - | - |
48
- | rowDblClick | 双击表格行事件 | `Function` | - | - | - |
49
-
50
- #### pagination
51
-
52
- 表格翻页参数
53
-
54
- | 参数名 | 说明 | 类型 | 默认值 |
55
- |-------------|-------------|-----------|------|
56
- | page | 页码 | `Number` | 1 |
57
- | rowsPerPage | 每页的数据条数 | `Number` | 30 |
58
- | rowsNumber | 数据总数(服务器返回) | `Number` | 1 |
59
- | sortBy | 排序字段 | `String` | null |
60
- | descending | 是否降序排列 | `Boolean` | true |
61
-
62
- #### request
63
-
64
- 格式化表格按钮
65
-
66
- ```javascript
67
- import http from '@netang/utils/http'
68
-
69
- // 创建表格实例
70
- const $table = $n.$table.create({
71
-
72
- // 自定义请求方法
73
- async request({ httpOptions, props, rows, selected }) {
74
- return await http(httpOptions)
75
- },
76
- })
77
- ```
78
-
79
- | 参数名 | 说明 | 类型 | 示例 |
80
- |-------------|-----------|----------|-----|
81
- | httpOptions | http 请求参数 | `Object` | - |
82
- | props | 表格声明属性 | `Array` | - |
83
- | rows | 表格行数据 | `Array` | - |
84
- | selected | 表格已选数据 | `Array` | - |
85
-
86
- #### formatRow
87
-
88
- 格式化单条数据
89
-
90
- ```javascript
91
- // 创建表格实例
92
- const $table = $n.$table.create({
93
-
94
- // 格式化单条数据
95
- formatRow({ row, rows, selected }) {
96
- row.title = '[测试]' + row.title
97
- },
98
- })
99
- ```
100
-
101
- | 参数名 | 说明 | 类型 | 示例 |
102
- |----------|--------|----------|-----|
103
- | row | 当前单条数据 | `Object` | - |
104
- | rows | 表格行数据 | `Array` | - |
105
- | selected | 表格已选数据 | `Array` | - |
106
-
107
- #### rowClick
108
-
109
- 单击表格行事件
110
-
111
- ```javascript
112
- // 创建表格实例
113
- const $table = $n.$table.create({
114
-
115
- // 单击表格行事件
116
- rowClick(evt, row, index) {
117
-
118
- },
119
- })
120
- ```
121
-
122
- #### rowDblClick
123
-
124
- 双击表格行事件
125
-
126
- ```javascript
127
- // 创建表格实例
128
- const $table = $n.$table.create({
129
-
130
- // 双击表格行事件
131
- rowDblClick(evt, row, index) {
132
-
133
- },
134
- })
135
- ```
136
-
137
- ### 返回数据
138
-
139
- 返回的数据可提供给 `<q-table>` 使用
140
-
141
- | 参数名 | 说明 | 类型 | 可在 `<q-table>` 组件中使用 |
142
- |-------------------------|------------------|----------------|--------------------------------------------------|
143
- | routeFullPath | 当前路由全路径 | `String` | - |
144
- | routePath | 当前路由路径 | `String` | - |
145
- | routeQuery | 当前路由参数 | `Object` | - |
146
- | getRoute | 获取当前路由 | `Function` | - |
147
- | tableLoading | 表格加载状态 | `ref(Boolean)` | :loading="tableLoading" |
148
- | tableRowKey | 表格行唯一键值 | `String` | :row-key="tableRowKey" |
149
- | tableSelection | 表格选择类型 | `ref(String)` | :selection="tableSelection" |
150
- | tableSeparator | 表格分隔栏 | `ref(String)` | :separator="tableSeparator" |
151
- | tableRowsPerPageOptions | 表格每页显示行数选项 | `Array` | :rows-per-page-options="tableRowsPerPageOptions" |
152
- | tableColumns | 表格列数据(对象数组) | `Array` | :columns="tableColumns" |
153
- | tableVisibleColumns | 表格可见列 | `ref(Array)` | :visible-columns="tableVisibleColumns" |
154
- | tableRows | 表格行数据 | `ref(Array)` | :rows="tableRows" |
155
- | tablePagination | 表格翻页参数 | `ref(Object)` | v-model:pagination="tablePagination" |
156
- | tableSelected | 表格已选数据 | `ref(Array)` | v-model:selected="tableSelected" |
157
- | tableFixedPowerBtns | 固定在右边的权限按钮列表 | `computed` | - |
158
- | showTableFixed | 是否显示固定在右边的权限按钮列表 | `computed` | - |
159
- | tableImgs | 表格图片 | `ref(Object)` | 可在插槽中使用 |
160
- | tableGrid | 表格宫格 | `ref(Boolean)` | :grid="tableGrid" |
161
- | tableSummary | 表格合计 | `ref(Object)` | 可在插槽中使用 |
162
- | tableSearchValue | 表格搜索数据 | `ref(Array)` | - |
163
- | tableSearchOptions | 表格搜索参数 | `ref(Array)` | - |
164
- | setQuery | 设置表格传参 | `Function` | - |
165
- | isTableLoaded | 表格是否已加载 | `Function` | - |
166
- | tableLoad | 表格加载(只加载一次) | `Function` | - |
167
- | tableReload | 表格重新加载 | `Function` | - |
168
- | tableRefresh | 表格刷新 | `Function` | - |
169
- | tableSearchReset | 表格搜索重置 | `Function` | - |
170
- | getTableRequestData | 获取表格请求数据 | `Function` | - |
171
- | tableRequest | 表格请求数据 | `Function` | @request="tableRequest" |
172
- | tableRowClick | 表格单击表格行 | `Function` | @row-click="tableRowClick" |
173
- | tableRowDblclick | 表格双击表格行 | `Function` | @row-dblclick="currentTableRowDblclick" |
174
- | setTableSearchOptions | 设置表格搜索参数 | `Function` | - |
175
- | reCreate | 重新创建表格 | `Function` | - |
176
-
177
-
178
- ## $table.config
179
-
180
- 获取表格配置
181
-
182
- 从 `src/tables` 文件夹中获取路由路径对应的表格配置
183
-
184
- - 示例
185
-
186
- ```javascript
187
- $table.config(routePath, path, defaultValue)
188
- ```
189
-
190
- ### options 参数
191
-
192
- | 参数名 | 说明 | 类型 | 示例 |
193
- |--------------|-----------------|----------|-------------------|
194
- | routePath | 路由路径 | `String` | goods/goods/index |
195
- | path | 配置字段 | `String` | columns |
196
- | defaultValue | 默认值(没有获取到配置时显示) | `Any` | [ ] |
1
+ # $table 表格
2
+
3
+ ::: tip
4
+ `@netang/quasar/utils/$table.js` [Github](https://github.com/netangsoft/netang-quasar/blob/main/utils/%24table.js) [Gitee](https://gitee.com/jinmarcus/netang-quasar/blob/main/utils/%24table.js)
5
+
6
+ 表格工具
7
+ :::
8
+
9
+ ## $table.create
10
+
11
+ 创建表格实例
12
+
13
+ - 类型
14
+
15
+ ```javascript
16
+ $table.create(options: Object): Object
17
+ ```
18
+
19
+ ### options 参数
20
+
21
+ | 参数名 | 说明 | 类型 | 可选值 | 默认值 | 示例 |
22
+ |----------------------|----------------|------------|---------------------------------------------|-------------------------------------|-----|
23
+ | path | 路由路径 | `String` | - | - | - |
24
+ | url | 请求地址(默认为 path) | `String` | - | - | - |
25
+ | query | 路由参数 | `Object` | - | { } | - |
26
+ | data | 附加请求数据 | `Object` | - | { } | - |
27
+ | rowKey | 表格行唯一键值 | `String` | - | id | - |
28
+ | selection | 选择类型 | `String` | `none` / `single` / `multiple` | single | - |
29
+ | separator | 分隔栏 | `String` | `horizontal` / `vertical` / `cell` / `none` | cell | - |
30
+ | selected | 初始已选数据 | `Array` | - | [ ] | - |
31
+ | loading | 初始表格加载状态 | `Boolean` | - | false | - |
32
+ | columns | 表格列数据(对象数组) | `Array` | - | [ ] | - |
33
+ | visibleColumns | 初始可见列 | `Array` | - | [ ] | - |
34
+ | rows | 表格行数据 | `Array` | - | [ ] | - |
35
+ | pagination | 表格翻页参数 | `Object` | - | - | - |
36
+ | rowsPerPageOptions | 每页显示行数选项 | `Array` | - | [ 30, 40, 50, 100, 200, 500, 1000 ] | - |
37
+ | request | 自定义请求方法 | `Function` | - | - | - |
38
+ | formatRow | 格式化单条数据 | `Function` | - | - | - |
39
+ | httpSettings | http 设置 | `Object` | - | - | - |
40
+ | search | 是否开启初始搜素 | `Boolean` | - | true | - |
41
+ | summary | 是否开启合计 | `Boolean` | - | false | - |
42
+ | searchFromQuery | 从参数中获取搜索值 | `Boolean` | - | true | - |
43
+ | showGrid | 是否显示宫格 | `Boolean` | - | true | - |
44
+ | showVisibleColumns | 是否显示可见列 | `Boolean` | - | true | - |
45
+ | cache | 是否开启缓存 | `Boolean` | - | true | - |
46
+ | refreshResetSelected | 是否刷新后清空已选数据 | `Boolean` | - | true | - |
47
+ | rowClick | 单击表格行事件 | `Function` | - | - | - |
48
+ | rowDblClick | 双击表格行事件 | `Function` | - | - | - |
49
+
50
+ #### pagination
51
+
52
+ 表格翻页参数
53
+
54
+ | 参数名 | 说明 | 类型 | 默认值 |
55
+ |-------------|-------------|-----------|------|
56
+ | page | 页码 | `Number` | 1 |
57
+ | rowsPerPage | 每页的数据条数 | `Number` | 30 |
58
+ | rowsNumber | 数据总数(服务器返回) | `Number` | 1 |
59
+ | sortBy | 排序字段 | `String` | null |
60
+ | descending | 是否降序排列 | `Boolean` | true |
61
+
62
+ #### request
63
+
64
+ 格式化表格按钮
65
+
66
+ ```javascript
67
+ import http from '@netang/utils/http'
68
+
69
+ // 创建表格实例
70
+ const $table = $n.$table.create({
71
+
72
+ // 自定义请求方法
73
+ async request({ httpOptions, props, rows, selected }) {
74
+ return await http(httpOptions)
75
+ },
76
+ })
77
+ ```
78
+
79
+ | 参数名 | 说明 | 类型 | 示例 |
80
+ |-------------|-----------|----------|-----|
81
+ | httpOptions | http 请求参数 | `Object` | - |
82
+ | props | 表格声明属性 | `Array` | - |
83
+ | rows | 表格行数据 | `Array` | - |
84
+ | selected | 表格已选数据 | `Array` | - |
85
+
86
+ #### formatRow
87
+
88
+ 格式化单条数据
89
+
90
+ ```javascript
91
+ // 创建表格实例
92
+ const $table = $n.$table.create({
93
+
94
+ // 格式化单条数据
95
+ formatRow({ row, rows, selected }) {
96
+ row.title = '[测试]' + row.title
97
+ },
98
+ })
99
+ ```
100
+
101
+ | 参数名 | 说明 | 类型 | 示例 |
102
+ |----------|--------|----------|-----|
103
+ | row | 当前单条数据 | `Object` | - |
104
+ | rows | 表格行数据 | `Array` | - |
105
+ | selected | 表格已选数据 | `Array` | - |
106
+
107
+ #### rowClick
108
+
109
+ 单击表格行事件
110
+
111
+ ```javascript
112
+ // 创建表格实例
113
+ const $table = $n.$table.create({
114
+
115
+ // 单击表格行事件
116
+ rowClick(evt, row, index) {
117
+
118
+ },
119
+ })
120
+ ```
121
+
122
+ #### rowDblClick
123
+
124
+ 双击表格行事件
125
+
126
+ ```javascript
127
+ // 创建表格实例
128
+ const $table = $n.$table.create({
129
+
130
+ // 双击表格行事件
131
+ rowDblClick(evt, row, index) {
132
+
133
+ },
134
+ })
135
+ ```
136
+
137
+ ### 返回数据
138
+
139
+ 返回的数据可提供给 `<q-table>` 使用
140
+
141
+ | 参数名 | 说明 | 类型 | 可在 `<q-table>` 组件中使用 |
142
+ |-------------------------|------------------|----------------|--------------------------------------------------|
143
+ | routeFullPath | 当前路由全路径 | `String` | - |
144
+ | routePath | 当前路由路径 | `String` | - |
145
+ | routeQuery | 当前路由参数 | `Object` | - |
146
+ | getRoute | 获取当前路由 | `Function` | - |
147
+ | tableLoading | 表格加载状态 | `ref(Boolean)` | :loading="tableLoading" |
148
+ | tableRowKey | 表格行唯一键值 | `String` | :row-key="tableRowKey" |
149
+ | tableSelection | 表格选择类型 | `ref(String)` | :selection="tableSelection" |
150
+ | tableSeparator | 表格分隔栏 | `ref(String)` | :separator="tableSeparator" |
151
+ | tableRowsPerPageOptions | 表格每页显示行数选项 | `Array` | :rows-per-page-options="tableRowsPerPageOptions" |
152
+ | tableColumns | 表格列数据(对象数组) | `Array` | :columns="tableColumns" |
153
+ | tableVisibleColumns | 表格可见列 | `ref(Array)` | :visible-columns="tableVisibleColumns" |
154
+ | tableRows | 表格行数据 | `ref(Array)` | :rows="tableRows" |
155
+ | tablePagination | 表格翻页参数 | `ref(Object)` | v-model:pagination="tablePagination" |
156
+ | tableSelected | 表格已选数据 | `ref(Array)` | v-model:selected="tableSelected" |
157
+ | tableFixedPowerBtns | 固定在右边的权限按钮列表 | `computed` | - |
158
+ | showTableFixed | 是否显示固定在右边的权限按钮列表 | `computed` | - |
159
+ | tableImgs | 表格图片 | `ref(Object)` | 可在插槽中使用 |
160
+ | tableGrid | 表格宫格 | `ref(Boolean)` | :grid="tableGrid" |
161
+ | tableSummary | 表格合计 | `ref(Object)` | 可在插槽中使用 |
162
+ | tableSearchValue | 表格搜索数据 | `ref(Array)` | - |
163
+ | tableSearchOptions | 表格搜索参数 | `ref(Array)` | - |
164
+ | setQuery | 设置表格传参 | `Function` | - |
165
+ | isTableLoaded | 表格是否已加载 | `Function` | - |
166
+ | tableLoad | 表格加载(只加载一次) | `Function` | - |
167
+ | tableReload | 表格重新加载 | `Function` | - |
168
+ | tableRefresh | 表格刷新 | `Function` | - |
169
+ | tableSearchReset | 表格搜索重置 | `Function` | - |
170
+ | getTableRequestData | 获取表格请求数据 | `Function` | - |
171
+ | tableRequest | 表格请求数据 | `Function` | @request="tableRequest" |
172
+ | tableRowClick | 表格单击表格行 | `Function` | @row-click="tableRowClick" |
173
+ | tableRowDblclick | 表格双击表格行 | `Function` | @row-dblclick="currentTableRowDblclick" |
174
+ | setTableSearchOptions | 设置表格搜索参数 | `Function` | - |
175
+ | reCreate | 重新创建表格 | `Function` | - |
176
+
177
+
178
+ ## $table.config
179
+
180
+ 获取表格配置
181
+
182
+ 从 `src/tables` 文件夹中获取路由路径对应的表格配置
183
+
184
+ - 示例
185
+
186
+ ```javascript
187
+ $table.config(routePath, path, defaultValue)
188
+ ```
189
+
190
+ ### options 参数
191
+
192
+ | 参数名 | 说明 | 类型 | 示例 |
193
+ |--------------|-----------------|----------|-------------------|
194
+ | routePath | 路由路径 | `String` | goods/goods/index |
195
+ | path | 配置字段 | `String` | columns |
196
+ | defaultValue | 默认值(没有获取到配置时显示) | `Any` | [ ] |
@@ -1,38 +1,38 @@
1
- <template>
2
- <div class="full-width">
3
-
4
- <q-chip
5
- class="q-ma-none"
6
- square
7
- :label="label"
8
- :clickable="false"
9
- :ripple="false"
10
- >
11
- <!-- 提示信息 -->
12
- <q-tooltip anchor="center right" self="center left" v-if="tooltip">{{tooltip}}</q-tooltip>
13
- </q-chip>
14
-
15
- <!-- 插槽 -->
16
- <slot />
17
- </div>
18
- </template>
19
-
20
- <script>
21
- export default {
22
-
23
- /**
24
- * 标识
25
- */
26
- name: 'NColumnTitle',
27
-
28
- /**
29
- * 声明属性
30
- */
31
- props: {
32
- // 标签
33
- label: [ String, Number ],
34
- // 提示信息
35
- tooltip: [ String, Number ],
36
- },
37
- }
38
- </script>
1
+ <template>
2
+ <div class="full-width">
3
+
4
+ <q-chip
5
+ class="q-ma-none"
6
+ square
7
+ :label="label"
8
+ :clickable="false"
9
+ :ripple="false"
10
+ >
11
+ <!-- 提示信息 -->
12
+ <q-tooltip anchor="center right" self="center left" v-if="tooltip">{{tooltip}}</q-tooltip>
13
+ </q-chip>
14
+
15
+ <!-- 插槽 -->
16
+ <slot />
17
+ </div>
18
+ </template>
19
+
20
+ <script>
21
+ export default {
22
+
23
+ /**
24
+ * 标识
25
+ */
26
+ name: 'NColumnTitle',
27
+
28
+ /**
29
+ * 声明属性
30
+ */
31
+ props: {
32
+ // 标签
33
+ label: [ String, Number ],
34
+ // 提示信息
35
+ tooltip: [ String, Number ],
36
+ },
37
+ }
38
+ </script>
@@ -1,20 +1,20 @@
1
- <template>
2
- <slot :data="data" />
3
- </template>
4
-
5
- <script>
6
- export default {
7
- /**
8
- * 标识
9
- */
10
- name: 'NData',
11
-
12
- /**
13
- * 传参
14
- */
15
- props: {
16
- // 数据
17
- data: {},
18
- },
19
- }
20
- </script>
1
+ <template>
2
+ <slot :data="data" />
3
+ </template>
4
+
5
+ <script>
6
+ export default {
7
+ /**
8
+ * 标识
9
+ */
10
+ name: 'NData',
11
+
12
+ /**
13
+ * 传参
14
+ */
15
+ props: {
16
+ // 数据
17
+ data: {},
18
+ },
19
+ }
20
+ </script>