@fishawack/lab-velocity 2.0.0-beta.34 → 2.0.0-beta.35

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.
@@ -57,7 +57,7 @@ export default [
57
57
  },
58
58
  },
59
59
  table: {
60
- structure: [
60
+ structure: () => [
61
61
  {
62
62
  key: "name",
63
63
  sortable: true,
@@ -83,7 +83,7 @@ export default [
83
83
  ],
84
84
  },
85
85
  description: {
86
- structure: [
86
+ structure: () => [
87
87
  {
88
88
  key: "domains",
89
89
  render: ({ model }) => h("span", model.domains.join(", ")),
@@ -164,8 +164,8 @@ export default [
164
164
  ),
165
165
  ...defaultResource.show.actions,
166
166
  ],
167
- layout: [
168
- ...defaultResource.show.layout,
167
+ tabs: [
168
+ ...defaultResource.show.tabs,
169
169
  ({ model }) => ({
170
170
  label: "Access control",
171
171
  component: h(VelFormRole, {
@@ -98,8 +98,8 @@ export default [
98
98
  ],
99
99
  },
100
100
  show: {
101
- layout: [
102
- ...defaultResource.show.layout,
101
+ tabs: [
102
+ ...defaultResource.show.tabs,
103
103
  ({ model }) => ({
104
104
  label: "Access control",
105
105
  component: h(VelFormRole, {
@@ -142,7 +142,7 @@ export default [
142
142
  },
143
143
  },
144
144
  table: {
145
- structure: [
145
+ structure: () => [
146
146
  {
147
147
  key: "name",
148
148
  sortable: true,
@@ -196,7 +196,7 @@ export default [
196
196
  ],
197
197
  },
198
198
  description: {
199
- structure: [
199
+ structure: () => [
200
200
  {
201
201
  key: "email",
202
202
  },
@@ -265,8 +265,8 @@ export default [
265
265
  ),
266
266
  ...defaultResource.show.actions,
267
267
  ],
268
- layout: [
269
- ...defaultResource.show.layout,
268
+ tabs: [
269
+ ...defaultResource.show.tabs,
270
270
  ({ model }) => ({
271
271
  label: "Access control",
272
272
  component: h(VelFormRole, {
@@ -1,9 +1,11 @@
1
1
  <!-- eslint-disable vue/no-mutating-props -->
2
2
  <template>
3
3
  <form @submit.prevent="submit">
4
- <template v-for="(item, index) in resource.form.structure" :key="index">
4
+ <template
5
+ v-for="(item, index) in resource.form.structure(this)"
6
+ :key="index"
7
+ >
5
8
  <component
6
- v-if="!item.condition || item.condition(this)"
7
9
  :is="item.render ? item.render(this) : 'VelBasic'"
8
10
  v-model="form[item.key]"
9
11
  :type="item.type || 'text'"
@@ -29,7 +29,7 @@
29
29
 
30
30
  <el-tabs v-model="active" type="card">
31
31
  <template
32
- v-for="(rendered, index) in renderedLayout"
32
+ v-for="(rendered, index) in renderedTabs"
33
33
  :key="index"
34
34
  >
35
35
  <el-tab-pane :name="index">
@@ -110,13 +110,17 @@ export default {
110
110
  },
111
111
 
112
112
  // Compute rendered layout once
113
- renderedLayout() {
114
- return this.resource.show.layout.map((render) => render(this));
113
+ renderedTabs() {
114
+ return this.resource.show.tabs
115
+ .map((render) => render(this))
116
+ .filter((d) => d);
115
117
  },
116
118
 
117
119
  // Compute rendered actions once
118
120
  renderedActions() {
119
- return this.resource.show.actions.map((render) => render(this));
121
+ return this.resource.show.actions
122
+ .map((render) => render(this))
123
+ .filter((d) => d);
120
124
  },
121
125
  },
122
126
 
@@ -52,6 +52,7 @@ export function meta(name = "default", properties = {}) {
52
52
  },
53
53
  form: {
54
54
  component: null,
55
+ submit: null,
55
56
  fields: () => ({}),
56
57
  preparation: ({ form }) => form.data(),
57
58
  structure: [],
@@ -180,32 +181,34 @@ export function meta(name = "default", properties = {}) {
180
181
  key: "PIndex",
181
182
  "json-data": {
182
183
  ...resource,
183
- tableStructure: resource.table.structure.concat(
184
- resource.table.actions.length
185
- ? [
186
- {
187
- key: "actions",
188
- render: ({ model }, props) =>
189
- h(
190
- "div",
191
- {
192
- class: "flex gap-2",
193
- },
194
- resource.table.actions.map(
195
- (d) =>
196
- d(
197
- {
198
- model,
199
- resource,
200
- },
201
- props,
202
- ),
184
+ tableStructure: resource.table
185
+ .structure(props)
186
+ .concat(
187
+ resource.table.actions.length
188
+ ? [
189
+ {
190
+ key: "actions",
191
+ render: ({ model }, props) =>
192
+ h(
193
+ "div",
194
+ {
195
+ class: "flex gap-2",
196
+ },
197
+ resource.table.actions.map(
198
+ (d) =>
199
+ d(
200
+ {
201
+ model,
202
+ resource,
203
+ },
204
+ props,
205
+ ),
206
+ ),
203
207
  ),
204
- ),
205
- },
206
- ]
207
- : [],
208
- ),
208
+ },
209
+ ]
210
+ : [],
211
+ ),
209
212
  api: resource.api.endpoint(props),
210
213
  },
211
214
  apiParams: resource.api.params.index(props),
@@ -331,51 +334,57 @@ export function meta(name = "default", properties = {}) {
331
334
  }
332
335
  },
333
336
  ],
334
- layout: [
337
+ tabs: [
335
338
  (props) => {
336
- const { resource, model } = props;
339
+ const { resource } = props;
337
340
 
338
341
  return {
339
342
  label: "Details",
340
343
  component: h(
341
- ElDescriptions,
342
- {
343
- border: true,
344
- column: 1,
345
- },
346
- () =>
347
- resource.description.structure.map(
348
- (item, index) =>
349
- (!item.condition ||
350
- item.condition(props)) &&
351
- h(
352
- ElDescriptionsItem,
353
- {
354
- key: index,
355
- labelWidth: "20%",
356
- },
357
- {
358
- label: () =>
359
- item.label ||
360
- item.key[0].toUpperCase() +
361
- item.key.slice(1),
362
- default: () =>
363
- item.render
364
- ? h(
365
- item.render(
366
- props,
367
- ),
368
- )
369
- : model?.[
370
- item.key
371
- ] || "",
372
- },
373
- ),
374
- ),
344
+ "div",
345
+ resource.show.layout
346
+ .map((render) => render(props))
347
+ .filter((d) => d),
375
348
  ),
376
349
  };
377
350
  },
378
351
  ],
352
+ layout: [
353
+ (props) => {
354
+ const { resource, model } = props;
355
+
356
+ return h(
357
+ ElDescriptions,
358
+ {
359
+ border: true,
360
+ column: 1,
361
+ },
362
+ () =>
363
+ resource.description
364
+ .structure(props)
365
+ .map((item, index) =>
366
+ h(
367
+ ElDescriptionsItem,
368
+ {
369
+ key: index,
370
+ labelWidth: "20%",
371
+ },
372
+ {
373
+ label: () =>
374
+ item.label ||
375
+ item.key[0].toUpperCase() +
376
+ item.key.slice(1),
377
+ default: () =>
378
+ item.render
379
+ ? h(item.render(props))
380
+ : model?.[item.key] ||
381
+ "",
382
+ },
383
+ ),
384
+ ),
385
+ );
386
+ },
387
+ ],
379
388
  },
380
389
  },
381
390
  properties,
@@ -385,25 +394,42 @@ export function meta(name = "default", properties = {}) {
385
394
  export function columns(columns = []) {
386
395
  return {
387
396
  table: {
388
- structure: columns
389
- .filter((column) => !column.filter?.table)
390
- .map((column) => ({
391
- ...column,
392
- render: column.render?.read || column.render?.table,
393
- })),
397
+ structure: (props) =>
398
+ columns
399
+ .filter(
400
+ (column) =>
401
+ resolveProperty(column.condition?.table, props) !==
402
+ false,
403
+ )
404
+ .map((column) => ({
405
+ ...column,
406
+ render: column.render?.read || column.render?.table,
407
+ })),
394
408
  },
395
409
  description: {
396
- structure: columns
397
- .filter((column) => !column.filter?.description)
398
- .map((column) => ({
399
- ...column,
400
- render: column.render?.read || column.render?.description,
401
- })),
410
+ structure: (props) =>
411
+ columns
412
+ .filter(
413
+ (column) =>
414
+ resolveProperty(
415
+ column.condition?.description,
416
+ props,
417
+ ) !== false,
418
+ )
419
+ .map((column) => ({
420
+ ...column,
421
+ render:
422
+ column.render?.read || column.render?.description,
423
+ })),
402
424
  },
403
425
  form: {
404
426
  fields: (props) =>
405
427
  columns
406
- .filter((column) => !column.filter?.form)
428
+ .filter(
429
+ (column) =>
430
+ resolveProperty(column.condition?.form, props) !==
431
+ false,
432
+ )
407
433
  .reduce((fields, column) => {
408
434
  fields[column.key] = column.initial
409
435
  ? column.initial(props)
@@ -412,19 +438,31 @@ export function columns(columns = []) {
412
438
  }, {}),
413
439
  preparation: (props) =>
414
440
  columns
415
- .filter((column) => !column.filter?.form)
441
+ .filter(
442
+ (column) =>
443
+ resolveProperty(column.condition?.form, props) !==
444
+ false,
445
+ )
416
446
  .reduce((fields, column) => {
417
447
  fields[column.key] = column.preparation
418
448
  ? column.preparation(props)
419
449
  : props.form[column.key];
420
450
  return fields;
421
451
  }, {}),
422
- structure: columns
423
- .filter((column) => !column.filter?.form)
424
- .map((column) => ({
425
- ...column,
426
- render: column.render?.write || column.render?.form,
427
- })),
452
+ structure: (props) =>
453
+ columns
454
+ .filter(
455
+ (column) =>
456
+ resolveProperty(
457
+ column.condition?.form?.write ??
458
+ column.condition?.form,
459
+ props,
460
+ ) !== false,
461
+ )
462
+ .map((column) => ({
463
+ ...column,
464
+ render: column.render?.write || column.render?.form,
465
+ })),
428
466
  },
429
467
  };
430
468
  }
@@ -495,6 +533,10 @@ export function routes(node, name, properties = {}, children = []) {
495
533
  ];
496
534
  }
497
535
 
536
+ export function resolveProperty(value, context) {
537
+ return typeof value === "function" ? value(context) : value;
538
+ }
539
+
498
540
  export default {
499
541
  routes,
500
542
  meta,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fishawack/lab-velocity",
3
- "version": "2.0.0-beta.34",
3
+ "version": "2.0.0-beta.35",
4
4
  "description": "Avalere Health branded style system",
5
5
  "scripts": {
6
6
  "setup": "npm ci || npm i && npm run content",