@netang/quasar 0.0.21 → 0.0.22

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.
package/utils/$table.js CHANGED
@@ -1,5 +1,4 @@
1
- import { ref, computed, watch } from 'vue'
2
- import { useRoute } from 'vue-router'
1
+ import { ref, computed, provide, inject, watch } from 'vue'
3
2
  import { date, useQuasar } from 'quasar'
4
3
  import { parse } from 'qs'
5
4
 
@@ -11,40 +10,7 @@ import {
11
10
  setItemValue,
12
11
  } from './$search'
13
12
 
14
- /**
15
- * 获取 url 参数
16
- */
17
- function getUrlQuery(url) {
18
-
19
- const query = {}
20
-
21
- if (utils.indexOf(url, '?') > -1) {
22
-
23
- const arr = url.split('?')
24
-
25
- url = arr[0]
26
- const urlQuery = parse(arr[1])
27
- if (utils.isValidObject(urlQuery)) {
28
- utils.forIn(urlQuery, function (val, key) {
29
-
30
- key = utils.trimString(key)
31
- val = utils.trimString(val)
32
-
33
- if (key && val) {
34
- if (val.indexOf(',') > -1) {
35
- val = val.split(',')
36
- }
37
- query[key] = utils.numberDeep(val)
38
- }
39
- })
40
- }
41
- }
42
-
43
- return {
44
- url,
45
- query,
46
- }
47
- }
13
+ import { NPowerKey, NTableKey } from './symbols'
48
14
 
49
15
  /**
50
16
  * 对话框设置
@@ -83,12 +49,6 @@ function dialogSetting($dialog, o) {
83
49
  */
84
50
  function create(params) {
85
51
 
86
- // ==========【注入】=================================================================================================
87
-
88
- // 获取对话框注入
89
- const $dialog = utils.$dialog.inject()
90
- const inDialog = !! $dialog
91
-
92
52
  // ==========【数据】=================================================================================================
93
53
 
94
54
  // quasar 对象
@@ -100,9 +60,9 @@ function create(params) {
100
60
 
101
61
  // 获取参数
102
62
  const o = _.merge({
103
- // 请求地址
104
- url: '',
105
- // 参数
63
+ // 路由路径
64
+ path: '',
65
+ // 路由参数
106
66
  query: {},
107
67
  // 表格节点
108
68
  ref: null,
@@ -132,8 +92,6 @@ function create(params) {
132
92
  // 是否降序排列
133
93
  descending: true,
134
94
  },
135
- // 已选数据
136
- selected: [],
137
95
  // 每页显示行数选项
138
96
  rowsPerPageOptions,
139
97
  // 请求方法
@@ -148,8 +106,6 @@ function create(params) {
148
106
  search: true,
149
107
  // 是否开启合计
150
108
  summary: false,
151
- // 权限按钮列表
152
- roleBtnLists: null,
153
109
  // 从参数中获取搜索值
154
110
  searchFromQuery: true,
155
111
  // 显示宫格
@@ -158,32 +114,48 @@ function create(params) {
158
114
  showVisibleColumns: true,
159
115
  }, params)
160
116
 
117
+ // 获取权限注入
118
+ const $power = _.has(params, '$power') ? params.$power : inject(NPowerKey)
119
+ const hasPowr = !! $power
120
+
121
+ // 获取对话框注入
122
+ const $dialog = utils.$dialog.inject()
123
+ const inDialog = !! $dialog
124
+
125
+ // 获取权限路由
126
+ const $route = utils.isValidString(o.path) ?
127
+ // 如果为自定义路由
128
+ utils.router.resolve({
129
+ path: o.path,
130
+ query: o.query,
131
+ })
132
+ // 否则获取当前路由
133
+ : (hasPowr ? $power.getRoute() : utils.router.getRoute())
134
+
135
+ // 是否有权限按钮
136
+ const hasPowerBtns = hasPowr ? ! $power.powerBtns.value.length : false
137
+
138
+ // 表格已选数据
139
+ const tableSelected = hasPowr ? $power.tableSelected : ref([])
140
+
161
141
  // 如果是对话框注入
162
142
  if (inDialog) {
163
143
  // 对话框设置
164
144
  dialogSetting($dialog, o)
165
145
  }
166
146
 
167
- // 如果没有地址, 则使用当前路由地址
168
- if (! o.url) {
169
- // 当前路由
170
- o.url = useRoute().fullPath
171
- }
172
-
173
- // 是否显示权限按钮
174
- const showRoleBtn = o.roleBtnLists !== null
175
-
176
147
  // 宫格模式缓存名
177
- const gridCacheName = 'table_grid_' + o.url
148
+ const gridCacheName = 'table_grid_' + $route.fullPath
178
149
 
179
150
  // 可见列缓存名
180
- const visibleColumnsCacheName = 'table_visible_columns_' + o.url
151
+ const visibleColumnsCacheName = 'table_visible_columns_' + $route.fullPath
181
152
 
182
153
  // 表格列
183
154
  const tableColumns = []
184
155
 
185
- // 添加操作列
186
- if (showRoleBtn) {
156
+ // 如果有权限按钮
157
+ if (hasPowerBtns) {
158
+ // 添加操作列
187
159
  o.columns.push({
188
160
  label: '操作',
189
161
  name: 'settings',
@@ -230,9 +202,9 @@ function create(params) {
230
202
  }
231
203
 
232
204
  // 如果有路由
233
- if (_.get(item, 'router')) {
205
+ if (_.get(item, 'route')) {
234
206
  // 如果该值在当前路由路径中, 则显示
235
- if (utils.indexOf(o.url, item.router) > -1) {
207
+ if (utils.indexOf($route.fullPath, item.route) > -1) {
236
208
  tableColumns.push(item)
237
209
  }
238
210
 
@@ -262,9 +234,6 @@ function create(params) {
262
234
  // 表格翻页参数
263
235
  const tablePagination = ref(o.pagination)
264
236
 
265
- // 表格已选数据
266
- const tableSelected = ref(o.selected)
267
-
268
237
  // 表格宫格
269
238
  const tableGrid = ref(o.showGrid ? utils.storage.get(gridCacheName) === true : false)
270
239
 
@@ -280,10 +249,6 @@ function create(params) {
280
249
  // 表格合计
281
250
  const tableSummary = ref(null)
282
251
 
283
- // 获取 url 参数
284
- const resUrl = getUrlQuery(o.url)
285
- o.url = resUrl.url
286
-
287
252
  // 如果在表格内部
288
253
  if (inDialog) {
289
254
  // 提交表格已选数据给对话框
@@ -302,7 +267,7 @@ function create(params) {
302
267
  // 首次表格搜索值(如果表格搜索参数中带了初始值, 则设置初始值)
303
268
  firstTableSearchValue,
304
269
  // 表格搜索值(如果表格搜索参数中带了初始值, 则设置初始值)
305
- } = utils.$search.getRawData(tableColumns, Object.assign({}, o.query, resUrl.query), o.searchFromQuery)
270
+ } = utils.$search.getRawData(tableColumns, Object.assign({}, $route.query), o.searchFromQuery)
306
271
 
307
272
  // 表格搜索数据值
308
273
  const tableSearchValue = ref(firstTableSearchValue)
@@ -316,13 +281,16 @@ function create(params) {
316
281
 
317
282
  // ==========【计算属性】=============================================================================================
318
283
 
319
- // 固定在右边的权限按钮列表
320
- const tableFixedRoleBtnLists = showRoleBtn ? computed(function () {
284
+ /**
285
+ * 固定在表格右边的权限按钮列表
286
+ */
287
+ const tableFixedPowerBtns = ! hasPowerBtns ? ref([]) : computed(function () {
321
288
 
322
289
  const lists = []
323
290
 
324
291
  // 先格式化权限按钮列表
325
- utils.forEach(utils.$role.formatRoleBtnLists(o.roleBtnLists.value), function(item) {
292
+ utils.forEach(utils.$power.formatBtns($power.powerBtns.value), function(item) {
293
+
326
294
  // 如果是固定按钮
327
295
  if (item.fixed) {
328
296
  lists.push(item)
@@ -330,25 +298,25 @@ function create(params) {
330
298
  })
331
299
 
332
300
  return lists
333
- }) : []
301
+ })
334
302
 
335
303
  /**
336
- * 表格双击权限按钮
304
+ * 获取权限按钮中可双击的按钮
337
305
  */
338
- const tableDbClickRoleBtn = o.roleBtnLists ? computed(function () {
306
+ const tableDbClickPowerBtn = ! hasPowerBtns ? ref(null) : computed(function () {
339
307
  if (
340
308
  // 非手机模式
341
309
  ! $q.platform.is.mobile
342
310
  // 有权限列表
343
- && utils.isValidArray(o.roleBtnLists.value)
311
+ && utils.isValidArray($power.powerBtns.value)
344
312
  ) {
345
- for (const item of o.roleBtnLists.value) {
313
+ for (const item of $power.powerBtns.value) {
346
314
  if (_.has(item, 'data.dbclick') === true) {
347
315
  return item
348
316
  }
349
317
  }
350
318
  }
351
- }) : null
319
+ })
352
320
 
353
321
  /**
354
322
  * 是否显示固定在右边的权限按钮列表
@@ -388,8 +356,8 @@ function create(params) {
388
356
  /**
389
357
  * 监听固定在右边的权限按钮列表
390
358
  */
391
- if (showRoleBtn) {
392
- watch(tableFixedRoleBtnLists, function (lists) {
359
+ if (hasPowerBtns) {
360
+ watch(tableFixedPowerBtns, function (lists) {
393
361
 
394
362
  const index = utils.indexOf(tableVisibleColumns.value, 'settings')
395
363
 
@@ -586,7 +554,7 @@ function create(params) {
586
554
  } else {
587
555
  const opts = Object.assign({
588
556
  // 请求 - 登录
589
- url: o.url,
557
+ url: $route.fullPath,
590
558
  // 请求数据
591
559
  data,
592
560
  // ~~~~~~ 先开启防抖, 如果后期遇到表格加载不出来的情况, 再关闭防抖
@@ -709,8 +677,8 @@ function create(params) {
709
677
  }
710
678
 
711
679
  // 有双击的权限按钮
712
- if (tableDbClickRoleBtn && tableDbClickRoleBtn.value) {
713
- tableToolbarRef.value?.onClick(tableDbClickRoleBtn.value, [ row ])
680
+ if (tableDbClickPowerBtn && tableDbClickPowerBtn.value) {
681
+ tableToolbarRef.value?.onClick(tableDbClickPowerBtn.value, [ row ])
714
682
  }
715
683
  }
716
684
 
@@ -730,7 +698,7 @@ function create(params) {
730
698
 
731
699
  // ==========【返回】=================================================================================================
732
700
 
733
- return {
701
+ const resTable = {
734
702
  // 表格工具栏节点
735
703
  tableToolbarRef,
736
704
  // 表格节点
@@ -754,7 +722,7 @@ function create(params) {
754
722
  // 表格已选数据
755
723
  tableSelected,
756
724
  // 固定在右边的权限按钮列表
757
- tableFixedRoleBtnLists,
725
+ tableFixedPowerBtns,
758
726
  // 是否显示固定在右边的权限按钮列表
759
727
  showTableFixed,
760
728
  // 表格图片标识
@@ -786,6 +754,15 @@ function create(params) {
786
754
  // 设置表格搜索参数
787
755
  setTableSearchOptions,
788
756
  }
757
+
758
+ $power.update(function(data, _data) {
759
+ _data.$table = resTable
760
+ })
761
+
762
+ // 提供可以被后代组件注入的值
763
+ provide(NTableKey, resTable)
764
+
765
+ return resTable
789
766
  }
790
767
 
791
768
  /**
package/utils/$tree.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { isRef, watch } from 'vue'
2
- import { useRoute } from 'vue-router'
2
+ import { NPowerKey } from './symbols'
3
3
 
4
4
  /**
5
5
  * 获取节点
@@ -43,17 +43,19 @@ function getChildren(data, callback) {
43
43
  }
44
44
 
45
45
  /**
46
- * 树业务
46
+ * 创建树实例
47
47
  */
48
- utils.$tree = function(params) {
48
+ function create(params) {
49
49
 
50
50
  const {
51
+ // 路由路径
52
+ path,
53
+ // 路由参数
54
+ query,
51
55
  // 树节点列表
52
56
  nodes,
53
57
  // 树展开节点
54
58
  expanded,
55
- // 权限按钮列表
56
- roleBtnLists,
57
59
  // 原始表单数据
58
60
  rawFormData,
59
61
  // 表单数据
@@ -63,16 +65,30 @@ utils.$tree = function(params) {
63
65
  // 是否开启展开节点缓存
64
66
  cache,
65
67
  } = Object.assign({
68
+ // 路由路径
69
+ path: '',
70
+ // 路由参数
71
+ query: {},
66
72
  // 是否开启展开节点缓存
67
73
  cache: false,
68
74
  }, params)
69
75
 
70
- // 如果没有地址, 则使用当前路由地址
71
- let url = ''
72
- if (! _.get(params, 'url')) {
73
- // 当前路由
74
- url = useRoute().fullPath
75
- }
76
+ // 获取权限注入
77
+ const $power = _.has(params, '$power') ? params.$power : inject(NPowerKey)
78
+ const hasPowr = !! $power
79
+
80
+ // 获取权限路由
81
+ const $route = utils.isValidString(path) ?
82
+ // 如果为自定义路由
83
+ utils.router.resolve({
84
+ path,
85
+ query,
86
+ })
87
+ // 否则获取当前路由
88
+ : (hasPowr ? $power.getRoute() : utils.router.getRoute())
89
+
90
+ // 权限按钮
91
+ const powerBtns = hasPowr ? $power.powerBtns : ref([])
76
92
 
77
93
  // 是否有展开节点
78
94
  const hasExpanded = ! _.isNil(expanded) && isRef(expanded)
@@ -194,21 +210,21 @@ utils.$tree = function(params) {
194
210
  maps[o.deleteName] = 'delete'
195
211
  maps[o.statusName] = 'status'
196
212
 
197
- const allRoleBtn = {}
198
- for (const item of roleBtnLists.value) {
213
+ const allPowerBtn = {}
214
+ for (const item of powerBtns.value) {
199
215
  if (_.has(maps, _.get(item, 'name'))) {
200
- allRoleBtn[maps[item.name]] = item
216
+ allPowerBtn[maps[item.name]] = item
201
217
  }
202
218
  }
203
219
 
204
220
  return {
205
- all: utils.isValidObject(allRoleBtn),
206
- update: _.has(allRoleBtn, 'update'),
207
- move: _.has(allRoleBtn, 'move'),
208
- copy: _.has(allRoleBtn, 'copy'),
209
- delete: _.has(allRoleBtn, 'delete'),
210
- status: _.has(allRoleBtn, 'status'),
211
- allRoleBtn,
221
+ all: utils.isValidObject(allPowerBtn),
222
+ update: _.has(allPowerBtn, 'update'),
223
+ move: _.has(allPowerBtn, 'move'),
224
+ copy: _.has(allPowerBtn, 'copy'),
225
+ delete: _.has(allPowerBtn, 'delete'),
226
+ status: _.has(allPowerBtn, 'status'),
227
+ allPowerBtn,
212
228
  }
213
229
  }
214
230
 
@@ -255,7 +271,7 @@ utils.$tree = function(params) {
255
271
  // 移至节点下
256
272
  case 'moveDown':
257
273
 
258
- if (! _.get(o.menuStatus, 'value.allRoleBtn.move.url')) {
274
+ if (! _.get(o.menuStatus, 'value.allPowerBtn.move.url')) {
259
275
  console.error('没有找到复制地址')
260
276
  return
261
277
  }
@@ -388,7 +404,7 @@ utils.$tree = function(params) {
388
404
 
389
405
  // 请求 - 移动
390
406
  const { status } = await utils.http({
391
- url: o.menuStatus.value.allRoleBtn.move.url,
407
+ url: o.menuStatus.value.allPowerBtn.move.url,
392
408
  data: {
393
409
  data: moveLists,
394
410
  },
@@ -407,7 +423,7 @@ utils.$tree = function(params) {
407
423
  // 确认菜单
408
424
  confirmMenu(async function() {
409
425
 
410
- if (! _.get(o.menuStatus, 'value.allRoleBtn.copy.url')) {
426
+ if (! _.get(o.menuStatus, 'value.allPowerBtn.copy.url')) {
411
427
  console.error('没有找到复制地址')
412
428
  return
413
429
  }
@@ -432,7 +448,7 @@ utils.$tree = function(params) {
432
448
 
433
449
  // 请求 - 复制
434
450
  const { status, data: res } = await utils.http({
435
- url: o.menuStatus.value.allRoleBtn.copy.url,
451
+ url: o.menuStatus.value.allPowerBtn.copy.url,
436
452
  data: {
437
453
  data: copyLists,
438
454
  },
@@ -489,7 +505,7 @@ utils.$tree = function(params) {
489
505
  return
490
506
  }
491
507
 
492
- if (! _.get(o.menuStatus, 'value.allRoleBtn.delete.url')) {
508
+ if (! _.get(o.menuStatus, 'value.allPowerBtn.delete.url')) {
493
509
  console.error('没有找到删除地址')
494
510
  return
495
511
  }
@@ -499,7 +515,7 @@ utils.$tree = function(params) {
499
515
 
500
516
  // 请求 - 删除
501
517
  const { status } = await utils.http({
502
- url: o.menuStatus.value.allRoleBtn.delete.url,
518
+ url: o.menuStatus.value.allPowerBtn.delete.url,
503
519
  data: {
504
520
  id: o.node.id,
505
521
  },
@@ -524,7 +540,7 @@ utils.$tree = function(params) {
524
540
  // 全部正常
525
541
  case 'statusNormal':
526
542
 
527
- if (! _.get(o.menuStatus, 'value.allRoleBtn.status.url')) {
543
+ if (! _.get(o.menuStatus, 'value.allPowerBtn.status.url')) {
528
544
  console.error('没有找到状态地址')
529
545
  return
530
546
  }
@@ -550,7 +566,7 @@ utils.$tree = function(params) {
550
566
 
551
567
  // 请求 - 全部禁用/正常
552
568
  const { status } = await utils.http({
553
- url: o.menuStatus.value.allRoleBtn.status.url,
569
+ url: o.menuStatus.value.allPowerBtn.status.url,
554
570
  data: {
555
571
  // ids
556
572
  ids: statusIds,
@@ -587,7 +603,7 @@ utils.$tree = function(params) {
587
603
  */
588
604
  function getExpandedCache(defaultValue = []) {
589
605
  // 获取展开节点缓存
590
- const res = utils.storage.get('tree_expanded_' + url)
606
+ const res = utils.storage.get('tree_expanded_' + $route.fullPath)
591
607
  return utils.isValidArray(res) ? res : defaultValue
592
608
  }
593
609
 
@@ -596,12 +612,12 @@ utils.$tree = function(params) {
596
612
  */
597
613
  function setExpandedCache(expanded) {
598
614
  // 设置展开节点缓存(永久缓存)
599
- utils.storage.set('tree_expanded_' + url, expanded, 0)
615
+ utils.storage.set('tree_expanded_' + $route.fullPath, expanded, 0)
600
616
  }
601
617
 
602
618
  return {
603
619
  // 当前地址
604
- url,
620
+ fullPath: $route.fullPath,
605
621
  // 获取节点
606
622
  getNode,
607
623
  // 更新节点
@@ -618,3 +634,11 @@ utils.$tree = function(params) {
618
634
  setExpandedCache,
619
635
  }
620
636
  }
637
+
638
+ /**
639
+ * 树业务
640
+ */
641
+ utils.$tree = {
642
+ // 创建树实例
643
+ create,
644
+ }
package/utils/http.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { isRef } from 'vue'
2
2
  import axios from 'axios'
3
3
  import createHttp from '@netang/utils/http'
4
- import { stateRole } from '../store'
4
+ import { statePower } from '../store'
5
5
 
6
6
  /**
7
7
  * 初始化 http
@@ -102,9 +102,9 @@ utils.http = createHttp({
102
102
  options.headers.Authorization = token
103
103
 
104
104
  // 如果有权限
105
- if (stateRole.value.v) {
105
+ if (statePower.value.v) {
106
106
  // 头部添加权限版本号
107
- options.headers.Rv = stateRole.value.v
107
+ options.headers.Pv = statePower.value.v
108
108
  }
109
109
 
110
110
  // 否则未登录 && 如果开启强制登录, 则跳转登录页面
@@ -126,8 +126,8 @@ utils.http = createHttp({
126
126
 
127
127
  // 如果请求成功
128
128
  if (res.status && para.checkCode && para.token) {
129
- // 设置角色数据
130
- utils.$role.setData(_.get(res, 'response.data.role'))
129
+ // 设置权限数据
130
+ utils.$power.setData(_.get(res, 'response.data.power'))
131
131
  }
132
132
 
133
133
  return res
package/utils/symbols.js CHANGED
@@ -1,4 +1,7 @@
1
+ export const NPowerKey = '_n_power_'
1
2
  export const NLayoutKey = '_n_layout_'
3
+ export const NTableKey = '_n_table_'
4
+ export const NFormKey = '_n_form_'
2
5
  export const NDialogKey = '_n_dialog_'
3
6
  export const NFieldTableKey = '_n_field_table_'
4
7
  export const NUploaderKey = '_n_uploader_'
@@ -1,126 +0,0 @@
1
- <template>
2
- <q-layout
3
- v-bind="$attrs"
4
- >
5
- <!-- 错误提示 -->
6
- <q-page-container v-if="pageStatus === false">
7
- <q-page class="q-pa-lg flex flex-center">
8
- {{emptyDescription}}
9
- </q-page>
10
- </q-page-container>
11
-
12
- <!-- 插槽 -->
13
- <slot :data="data" v-else-if="pageStatus === true" />
14
- </q-layout>
15
-
16
- <!-- 加载 -->
17
- <q-inner-loading
18
- :showing="pageLoading"
19
- />
20
- </template>
21
-
22
- <script>
23
- import { provide, ref } from 'vue'
24
- import { NLayoutKey } from '../../utils/symbols'
25
-
26
- export default {
27
-
28
- /**
29
- * 标识
30
- */
31
- name: 'NLayout',
32
-
33
- /**
34
- * 声明属性
35
- */
36
- props: {
37
- // 页面加载
38
- pageLoading: Boolean,
39
- // 页面状态
40
- pageStatus: {
41
- type: Boolean,
42
- default: null,
43
- },
44
- // 空状态描述
45
- emptyDescription: {
46
- type: String,
47
- default: '发生未知错误',
48
- },
49
- },
50
-
51
- /**
52
- * 组合式
53
- */
54
- setup() {
55
-
56
- // ==========【注入】============================================================================================
57
-
58
- const leftModelValue = ref(null)
59
- const rightModelValue = ref(null)
60
-
61
- // 布局数据
62
- const data = {
63
- // 左边侧滑菜单数据
64
- left: {
65
- // 是否显示
66
- modelValue: leftModelValue,
67
- // 是否显示切换按钮
68
- showButton() {
69
- return leftModelValue.value !== null
70
- },
71
- // 切换
72
- toggle() {
73
- if (leftModelValue.value !== null) {
74
- leftModelValue.value = ! leftModelValue.value
75
- }
76
- },
77
- },
78
- // 右边侧滑菜单数据
79
- right: {
80
- // 是否显示
81
- modelValue: rightModelValue,
82
- // 是否显示切换按钮
83
- showButton() {
84
- return rightModelValue.value !== null
85
- },
86
- // 切换
87
- toggle() {
88
- if (rightModelValue.value !== null) {
89
- rightModelValue.value = ! rightModelValue.value
90
- }
91
- },
92
- },
93
- // 权限数据
94
- role: {},
95
- // 表格数据
96
- table: {},
97
- // 上传器
98
- uploader: [],
99
- }
100
-
101
- // 向后代注入数据
102
- provide(NLayoutKey, {
103
- // 注入数据
104
- data,
105
- // 更新注入数据
106
- update(cb) {
107
- cb(data)
108
- },
109
- // 检查是否上传中
110
- checkUploading() {
111
- for (const uploader of data.uploader) {
112
- if (uploader.checkUploading()) {
113
- return true
114
- }
115
- }
116
- return false
117
- },
118
- })
119
-
120
- return {
121
- // 布局数据
122
- data,
123
- }
124
- },
125
- }
126
- </script>