@hostlink/nuxt-light 1.55.0 → 1.56.0

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 (218) hide show
  1. package/README.md +120 -120
  2. package/dist/module.json +1 -1
  3. package/dist/runtime/components/L/CustomField/Add.vue +40 -42
  4. package/dist/runtime/components/L/CustomField/List.vue +5 -5
  5. package/dist/runtime/components/L/Database/create-table-dialog.vue +33 -34
  6. package/dist/runtime/components/L/Fieldset.vue +8 -11
  7. package/dist/runtime/components/L/ForgetPasswordDialog.vue +26 -27
  8. package/dist/runtime/components/L/Revision.vue +89 -93
  9. package/dist/runtime/components/L/Storage.vue +7 -7
  10. package/dist/runtime/components/L/System/Setting/authentication.d.vue.ts +1 -5
  11. package/dist/runtime/components/L/System/Setting/authentication.vue +16 -16
  12. package/dist/runtime/components/L/System/Setting/authentication.vue.d.ts +1 -5
  13. package/dist/runtime/components/L/System/Setting/developer.vue +10 -11
  14. package/dist/runtime/components/L/System/Setting/forget-password.vue +9 -9
  15. package/dist/runtime/components/L/System/Setting/general.vue +9 -9
  16. package/dist/runtime/components/L/System/Setting/mail.d.vue.ts +1 -5
  17. package/dist/runtime/components/L/System/Setting/mail.vue +28 -32
  18. package/dist/runtime/components/L/System/Setting/mail.vue.d.ts +1 -5
  19. package/dist/runtime/components/L/System/Setting/modules.d.vue.ts +1 -5
  20. package/dist/runtime/components/L/System/Setting/modules.vue +6 -6
  21. package/dist/runtime/components/L/System/Setting/modules.vue.d.ts +1 -5
  22. package/dist/runtime/components/L/System/Setting/security.d.vue.ts +1 -5
  23. package/dist/runtime/components/L/System/Setting/security.vue +38 -41
  24. package/dist/runtime/components/L/System/Setting/security.vue.d.ts +1 -5
  25. package/dist/runtime/components/L/User/eventlog.vue +5 -5
  26. package/dist/runtime/components/L/User/overview.vue +19 -19
  27. package/dist/runtime/components/L/User/userlog.vue +1 -1
  28. package/dist/runtime/components/L/ValidationInput.vue +14 -14
  29. package/dist/runtime/components/MyTest.vue +3 -3
  30. package/dist/runtime/components/l-action-btn.vue +4 -4
  31. package/dist/runtime/components/l-add-btn.vue +3 -3
  32. package/dist/runtime/components/l-alert.vue +8 -8
  33. package/dist/runtime/components/l-app-main.d.vue.ts +1 -5
  34. package/dist/runtime/components/l-app-main.vue +170 -171
  35. package/dist/runtime/components/l-app-main.vue.d.ts +1 -5
  36. package/dist/runtime/components/l-app.vue +27 -27
  37. package/dist/runtime/components/l-audit-card.vue +8 -8
  38. package/dist/runtime/components/l-back-btn.vue +6 -6
  39. package/dist/runtime/components/l-banner.d.vue.ts +1 -1
  40. package/dist/runtime/components/l-banner.vue +10 -10
  41. package/dist/runtime/components/l-banner.vue.d.ts +1 -1
  42. package/dist/runtime/components/l-bar.vue +3 -3
  43. package/dist/runtime/components/l-btn.vue +4 -4
  44. package/dist/runtime/components/l-card.d.vue.ts +1 -9
  45. package/dist/runtime/components/l-card.vue +31 -31
  46. package/dist/runtime/components/l-card.vue.d.ts +1 -9
  47. package/dist/runtime/components/l-checkbox.vue +3 -3
  48. package/dist/runtime/components/l-col.vue +5 -5
  49. package/dist/runtime/components/l-customizer.d.vue.ts +2 -2
  50. package/dist/runtime/components/l-customizer.vue +95 -96
  51. package/dist/runtime/components/l-customizer.vue.d.ts +2 -2
  52. package/dist/runtime/components/l-date-picker.d.vue.ts +1 -1
  53. package/dist/runtime/components/l-date-picker.vue +17 -17
  54. package/dist/runtime/components/l-date-picker.vue.d.ts +1 -1
  55. package/dist/runtime/components/l-delete-btn.vue +1 -1
  56. package/dist/runtime/components/l-dialog-database-field-add.vue +25 -26
  57. package/dist/runtime/components/l-drag-drop-container.vue +5 -5
  58. package/dist/runtime/components/l-drag-drop-group.vue +1 -1
  59. package/dist/runtime/components/l-drag-drop.vue +6 -6
  60. package/dist/runtime/components/l-edit-btn.vue +2 -2
  61. package/dist/runtime/components/l-editor.d.vue.ts +1 -5
  62. package/dist/runtime/components/l-editor.vue +41 -41
  63. package/dist/runtime/components/l-editor.vue.d.ts +1 -5
  64. package/dist/runtime/components/l-facebook-button.vue +2 -2
  65. package/dist/runtime/components/l-fav-menu.vue +14 -14
  66. package/dist/runtime/components/l-field.vue +3 -3
  67. package/dist/runtime/components/l-file-manager-labels.vue +11 -11
  68. package/dist/runtime/components/l-file-manager-move.vue +67 -67
  69. package/dist/runtime/components/l-file-manager-preview.vue +22 -22
  70. package/dist/runtime/components/l-file-manager.vue +245 -250
  71. package/dist/runtime/components/l-file-upload.d.vue.ts +1 -1
  72. package/dist/runtime/components/l-file-upload.vue +25 -25
  73. package/dist/runtime/components/l-file-upload.vue.d.ts +1 -1
  74. package/dist/runtime/components/l-file.d.vue.ts +1 -5
  75. package/dist/runtime/components/l-file.vue +8 -8
  76. package/dist/runtime/components/l-file.vue.d.ts +1 -5
  77. package/dist/runtime/components/l-form-dialog.vue +27 -27
  78. package/dist/runtime/components/l-form.d.vue.ts +1 -33
  79. package/dist/runtime/components/l-form.vue +11 -11
  80. package/dist/runtime/components/l-form.vue.d.ts +1 -33
  81. package/dist/runtime/components/l-group-select.vue +22 -22
  82. package/dist/runtime/components/l-icon-picker.vue +35 -38
  83. package/dist/runtime/components/l-input-select.vue +4 -4
  84. package/dist/runtime/components/l-input-xlsx.vue +30 -31
  85. package/dist/runtime/components/l-input.d.vue.ts +1 -1
  86. package/dist/runtime/components/l-input.vue +23 -23
  87. package/dist/runtime/components/l-input.vue.d.ts +1 -1
  88. package/dist/runtime/components/l-item.vue +18 -18
  89. package/dist/runtime/components/l-link.vue +3 -3
  90. package/dist/runtime/components/l-list.vue +12 -12
  91. package/dist/runtime/components/l-login.d.vue.ts +1 -5
  92. package/dist/runtime/components/l-login.vue +57 -57
  93. package/dist/runtime/components/l-login.vue.d.ts +1 -5
  94. package/dist/runtime/components/l-menu.vue +33 -34
  95. package/dist/runtime/components/l-microsoft-button.d.vue.ts +1 -11
  96. package/dist/runtime/components/l-microsoft-button.vue +68 -68
  97. package/dist/runtime/components/l-microsoft-button.vue.d.ts +1 -11
  98. package/dist/runtime/components/l-page.vue +21 -21
  99. package/dist/runtime/components/l-repeater.d.vue.ts +3 -3
  100. package/dist/runtime/components/l-repeater.vue +35 -35
  101. package/dist/runtime/components/l-repeater.vue.d.ts +3 -3
  102. package/dist/runtime/components/l-row.vue +5 -5
  103. package/dist/runtime/components/l-save-btn.vue +2 -2
  104. package/dist/runtime/components/l-select.vue +1 -1
  105. package/dist/runtime/components/l-small-box.vue +9 -9
  106. package/dist/runtime/components/l-statistic.vue +9 -9
  107. package/dist/runtime/components/l-tab.vue +10 -10
  108. package/dist/runtime/components/l-table.d.vue.ts +1 -1
  109. package/dist/runtime/components/l-table.vue +176 -190
  110. package/dist/runtime/components/l-table.vue.d.ts +1 -1
  111. package/dist/runtime/components/l-tabs.vue +9 -9
  112. package/dist/runtime/components/l-test2.vue +3 -3
  113. package/dist/runtime/components/l-time-picker.d.vue.ts +1 -1
  114. package/dist/runtime/components/l-time-picker.vue +18 -18
  115. package/dist/runtime/components/l-time-picker.vue.d.ts +1 -1
  116. package/dist/runtime/components/l-view-btn.vue +2 -2
  117. package/dist/runtime/components/user-list.vue +3 -3
  118. package/dist/runtime/composables/mytest.js +2 -2
  119. package/dist/runtime/composables/tc2sc.js +85 -85
  120. package/dist/runtime/formkit/Checkbox.d.vue.ts +0 -1
  121. package/dist/runtime/formkit/Checkbox.vue +6 -6
  122. package/dist/runtime/formkit/Checkbox.vue.d.ts +0 -1
  123. package/dist/runtime/formkit/DatePicker.d.vue.ts +0 -1
  124. package/dist/runtime/formkit/DatePicker.vue +11 -11
  125. package/dist/runtime/formkit/DatePicker.vue.d.ts +0 -1
  126. package/dist/runtime/formkit/Editor.vue +7 -7
  127. package/dist/runtime/formkit/File.d.vue.ts +0 -1
  128. package/dist/runtime/formkit/File.vue +6 -6
  129. package/dist/runtime/formkit/File.vue.d.ts +0 -1
  130. package/dist/runtime/formkit/FilePicker.d.vue.ts +0 -1
  131. package/dist/runtime/formkit/FilePicker.vue +6 -6
  132. package/dist/runtime/formkit/FilePicker.vue.d.ts +0 -1
  133. package/dist/runtime/formkit/FileUpload.d.vue.ts +0 -1
  134. package/dist/runtime/formkit/FileUpload.vue +6 -6
  135. package/dist/runtime/formkit/FileUpload.vue.d.ts +0 -1
  136. package/dist/runtime/formkit/Form.d.vue.ts +1 -3
  137. package/dist/runtime/formkit/Form.vue +11 -11
  138. package/dist/runtime/formkit/Form.vue.d.ts +1 -3
  139. package/dist/runtime/formkit/GroupSelect.d.vue.ts +0 -1
  140. package/dist/runtime/formkit/GroupSelect.vue +7 -7
  141. package/dist/runtime/formkit/GroupSelect.vue.d.ts +0 -1
  142. package/dist/runtime/formkit/Input.d.vue.ts +1 -1
  143. package/dist/runtime/formkit/Input.vue +11 -11
  144. package/dist/runtime/formkit/Input.vue.d.ts +1 -1
  145. package/dist/runtime/formkit/InputSelect.d.vue.ts +1 -1
  146. package/dist/runtime/formkit/InputSelect.vue +7 -7
  147. package/dist/runtime/formkit/InputSelect.vue.d.ts +1 -1
  148. package/dist/runtime/formkit/InputXlsx.vue +4 -4
  149. package/dist/runtime/formkit/OptionGroup.vue +5 -5
  150. package/dist/runtime/formkit/Radio.vue +4 -4
  151. package/dist/runtime/formkit/Repeater.d.vue.ts +1 -1
  152. package/dist/runtime/formkit/Repeater.vue +37 -37
  153. package/dist/runtime/formkit/Repeater.vue.d.ts +1 -1
  154. package/dist/runtime/formkit/Select.d.vue.ts +0 -1
  155. package/dist/runtime/formkit/Select.vue +6 -6
  156. package/dist/runtime/formkit/Select.vue.d.ts +0 -1
  157. package/dist/runtime/formkit/Textarea.d.vue.ts +1 -1
  158. package/dist/runtime/formkit/Textarea.vue +11 -11
  159. package/dist/runtime/formkit/Textarea.vue.d.ts +1 -1
  160. package/dist/runtime/formkit/TimePicker.d.vue.ts +0 -1
  161. package/dist/runtime/formkit/TimePicker.vue +10 -10
  162. package/dist/runtime/formkit/TimePicker.vue.d.ts +0 -1
  163. package/dist/runtime/formkit/Toggle.vue +3 -3
  164. package/dist/runtime/index.d.ts +39 -39
  165. package/dist/runtime/locales/en.json +9 -9
  166. package/dist/runtime/locales/zh-hk.json +213 -213
  167. package/dist/runtime/pages/CustomField/[custom_field_id]/edit.vue +33 -38
  168. package/dist/runtime/pages/CustomField/index.vue +12 -14
  169. package/dist/runtime/pages/EventLog/_eventlog_id/view.vue +36 -36
  170. package/dist/runtime/pages/EventLog/index.vue +7 -7
  171. package/dist/runtime/pages/FileManager/index.vue +4 -4
  172. package/dist/runtime/pages/MailLog/index.vue +18 -18
  173. package/dist/runtime/pages/Permission/add.vue +13 -13
  174. package/dist/runtime/pages/Permission/all.vue +63 -63
  175. package/dist/runtime/pages/Permission/export.vue +9 -10
  176. package/dist/runtime/pages/Permission/index.vue +4 -4
  177. package/dist/runtime/pages/Role/_name/update-child.vue +4 -4
  178. package/dist/runtime/pages/Role/add.vue +7 -7
  179. package/dist/runtime/pages/Role/add2.vue +30 -30
  180. package/dist/runtime/pages/Role/index.vue +27 -27
  181. package/dist/runtime/pages/System/database/backup.vue +72 -72
  182. package/dist/runtime/pages/System/database/check.vue +72 -72
  183. package/dist/runtime/pages/System/database/event.vue +51 -51
  184. package/dist/runtime/pages/System/database/process.vue +21 -21
  185. package/dist/runtime/pages/System/database/restore.vue +110 -110
  186. package/dist/runtime/pages/System/database/table.vue +67 -69
  187. package/dist/runtime/pages/System/fs.vue +99 -99
  188. package/dist/runtime/pages/System/index.vue +16 -18
  189. package/dist/runtime/pages/System/mailtest.vue +12 -12
  190. package/dist/runtime/pages/System/menu/index.vue +142 -144
  191. package/dist/runtime/pages/System/package.vue +11 -11
  192. package/dist/runtime/pages/System/phpinfo.vue +3 -3
  193. package/dist/runtime/pages/System/setting.vue +28 -30
  194. package/dist/runtime/pages/System/test.vue +12 -12
  195. package/dist/runtime/pages/System/view_as.vue +21 -22
  196. package/dist/runtime/pages/SystemValue/_systemvalue_id/edit.vue +6 -6
  197. package/dist/runtime/pages/SystemValue/add.vue +7 -7
  198. package/dist/runtime/pages/SystemValue/index.vue +4 -4
  199. package/dist/runtime/pages/Translate/index.vue +38 -38
  200. package/dist/runtime/pages/User/_user_id/change-password.vue +17 -18
  201. package/dist/runtime/pages/User/_user_id/edit.vue +28 -28
  202. package/dist/runtime/pages/User/_user_id/update-role.vue +7 -8
  203. package/dist/runtime/pages/User/_user_id/view.vue +27 -30
  204. package/dist/runtime/pages/User/add.vue +35 -35
  205. package/dist/runtime/pages/User/index.vue +11 -11
  206. package/dist/runtime/pages/User/profile.vue +45 -46
  207. package/dist/runtime/pages/User/setting/bio-auth.vue +22 -22
  208. package/dist/runtime/pages/User/setting/favorite.vue +61 -62
  209. package/dist/runtime/pages/User/setting/index.vue +6 -6
  210. package/dist/runtime/pages/User/setting/information.vue +6 -6
  211. package/dist/runtime/pages/User/setting/menu.vue +165 -165
  212. package/dist/runtime/pages/User/setting/open_id.vue +161 -161
  213. package/dist/runtime/pages/User/setting/password.vue +19 -19
  214. package/dist/runtime/pages/User/setting/style.vue +104 -106
  215. package/dist/runtime/pages/User/setting/two-factor-auth.vue +176 -176
  216. package/dist/runtime/pages/User/setting.vue +32 -32
  217. package/dist/runtime/pages/UserLog/index.vue +4 -4
  218. package/package.json +63 -63
@@ -251,169 +251,169 @@ const resetMenus = () => {
251
251
  </script>
252
252
 
253
253
  <template>
254
- <div>
255
- <!-- Move to group dialog -->
256
- <q-dialog v-model="showMoveDialog">
257
- <l-card>
258
- <q-card-section>
259
- <div class="text-h6">Select Move Target</div>
260
- <q-tree :nodes="userMenus" default-expand-all v-model:selected="moveTarget" node-key="uuid" />
261
- </q-card-section>
262
- <q-card-actions align="right">
263
- <q-btn flat label="Cancel" color="primary" v-close-popup />
264
- <q-btn flat label="Move" color="primary" @click="confirmMove" />
265
- </q-card-actions>
266
- </l-card>
267
- </q-dialog>
268
-
269
- <l-card>
270
- <q-card-actions class="q-gutter-sm">
271
- <l-btn @click="saveCustomMenus" label="Save Custom Menu" icon="sym_o_save" />
272
- <l-btn @click="resetMenus" label="Reset Menu" icon="sym_o_refresh" />
273
- </q-card-actions>
274
-
275
- <q-splitter v-model="splitterModel" style="height:680px">
276
- <template #before>
277
- <div class="q-pa-md">
278
- <div class="text-h6 q-mb-md">Available Menu Items</div>
279
- <q-tree :nodes="availableMenus" default-expand-all node-key="uuid">
280
- <template v-slot:default-header="prop">
281
- <div class="row items-center full-width">
282
- <q-icon :name="prop.node.icon || 'sym_o_menu'" class="q-mr-sm" size="sm" />
283
- <span>{{ prop.node.label }}</span>
284
- <q-space />
285
- <small v-if="prop.node.to" class="text-grey-6 q-mr-sm">{{ prop.node.to }}</small>
286
- <q-btn flat round dense size="sm" icon="sym_o_add" color="positive"
287
- @click.stop="addMenuToCustom(prop.node)">
288
- <q-tooltip>Add to My Menu</q-tooltip>
289
- </q-btn>
290
- </div>
291
- </template>
292
- </q-tree>
293
- </div>
294
- </template>
295
-
296
- <template #after>
297
- <div class="q-pa-md">
298
- <div class="text-h6 q-mb-md">My Custom Menu</div>
299
-
300
- <!-- Action buttons -->
301
- <q-card-actions class="q-mb-md q-gutter-xs" v-if="currentNodeDetail">
302
- <template v-if="currentNodeDetail.type === 'root'">
303
- <q-btn-dropdown v-bind="$light.getButtonProps({ label: 'Add' })" icon="sym_o_add"
304
- size="sm" color="primary">
305
- <q-list>
306
- <q-item clickable v-close-popup @click="createNewFolder">
307
- <q-item-section avatar>
308
- <q-icon name="sym_o_folder" color="orange" />
309
- </q-item-section>
310
- <q-item-section>
311
- <q-item-label>Add Folder</q-item-label>
312
- </q-item-section>
313
- </q-item>
314
- <q-item clickable v-close-popup @click="createNewSubItem">
315
- <q-item-section avatar>
316
- <q-icon name="sym_o_menu" />
317
- </q-item-section>
318
- <q-item-section>
319
- <q-item-label>Add Sub Item</q-item-label>
320
- </q-item-section>
321
- </q-item>
322
- <q-item clickable v-close-popup @click="addSeparator">
323
- <q-item-section avatar>
324
- <q-icon name="sym_o_more_horiz" color="grey" />
325
- </q-item-section>
326
- <q-item-section>
327
- <q-item-label>Add Separator</q-item-label>
328
- </q-item-section>
329
- </q-item>
330
- </q-list>
331
- </q-btn-dropdown>
332
- </template>
333
- <template v-else>
334
- <q-btn-dropdown v-bind="$light.getButtonProps({ label: 'Add' })" icon="sym_o_add"
335
- size="sm" color="primary">
336
- <q-list>
337
- <q-item clickable v-close-popup @click="createNewFolder">
338
- <q-item-section avatar>
339
- <q-icon name="sym_o_folder" color="orange" />
340
- </q-item-section>
341
- <q-item-section>
342
- <q-item-label>Add Folder</q-item-label>
343
- </q-item-section>
344
- </q-item>
345
- <q-item clickable v-close-popup @click="createNewSubItem">
346
- <q-item-section avatar>
347
- <q-icon name="sym_o_menu" />
348
- </q-item-section>
349
- <q-item-section>
350
- <q-item-label>Add Sub Item</q-item-label>
351
- </q-item-section>
352
- </q-item>
353
- <q-item clickable v-close-popup @click="addSeparator">
354
- <q-item-section avatar>
355
- <q-icon name="sym_o_more_horiz" color="grey" />
356
- </q-item-section>
357
- <q-item-section>
358
- <q-item-label>Add Separator</q-item-label>
359
- </q-item-section>
360
- </q-item>
361
- </q-list>
362
- </q-btn-dropdown>
363
-
364
- <l-btn @click="removeMenuItem(currentNodeDetail)" label="Delete" icon="sym_o_delete"
365
- size="sm" color="negative" />
366
- <l-btn @click="moveUp(currentNodeDetail)" label="Move Up" icon="sym_o_arrow_upward"
367
- size="sm" />
368
- <l-btn @click="moveDown(currentNodeDetail)" label="Move Down"
369
- icon="sym_o_arrow_downward" size="sm" />
370
- <l-btn @click="moveToGroup" label="Move to..." icon="sym_o_drive_file_move" size="sm" />
371
- </template>
372
- </q-card-actions>
373
-
374
- <!-- Menu tree -->
375
- <q-tree :nodes="userMenus" default-expand-all v-model:selected="selectedNode" node-key="uuid"
376
- ref="userMenuTree">
377
- <template v-slot:default-header="prop">
378
- <div class="row items-center full-width">
379
- <q-icon :name="prop.node.type === 'separator' ? 'sym_o_more_horiz' :
380
- prop.node.type === 'root' ? 'sym_o_account_tree' :
381
- prop.node.icon || 'sym_o_menu'" class="q-mr-sm" size="sm" :color="prop.node.type === 'separator' ? 'grey' :
382
- prop.node.type === 'root' ? 'primary' : undefined" />
383
- <span :class="{
384
- 'text-grey-6': prop.node.type === 'separator',
385
- 'text-primary': prop.node.type === 'root'
386
- }">
387
- {{ prop.node.label }}
388
- </span>
389
- <q-space />
390
- <small v-if="prop.node.to" class="text-grey-6">{{ prop.node.to }}</small>
391
- </div>
392
- </template>
393
- </q-tree>
394
-
395
- <!-- Current selected node detail settings -->
396
- <div v-if="currentNodeDetail && currentNodeDetail.type !== 'root'" class="q-mt-lg">
397
- <q-separator class="q-mb-md" />
398
- <div class="text-subtitle1 q-mb-md">Menu Settings</div>
399
-
400
- <template v-if="currentNodeDetail.type === 'separator'">
401
- <div class="q-gutter-md">
402
- <l-checkbox label="Spaced Separator" v-model="currentNodeDetail.spaced" />
403
- </div>
404
- </template>
405
-
406
- <template v-else>
407
- <div class="q-gutter-md">
408
- <l-input label="Label" v-model="currentNodeDetail.label" />
409
- <l-input label="Route" v-model="currentNodeDetail.to" />
410
- <l-icon-picker label="Icon" v-model="currentNodeDetail.icon" />
411
- </div>
412
- </template>
413
- </div>
414
- </div>
415
- </template>
416
- </q-splitter>
417
- </l-card>
418
- </div>
254
+ <div>
255
+ <!-- Move to group dialog -->
256
+ <q-dialog v-model="showMoveDialog">
257
+ <l-card>
258
+ <q-card-section>
259
+ <div class="text-h6">Select Move Target</div>
260
+ <q-tree :nodes="userMenus" default-expand-all v-model:selected="moveTarget" node-key="uuid" />
261
+ </q-card-section>
262
+ <q-card-actions align="right">
263
+ <q-btn flat label="Cancel" color="primary" v-close-popup />
264
+ <q-btn flat label="Move" color="primary" @click="confirmMove" />
265
+ </q-card-actions>
266
+ </l-card>
267
+ </q-dialog>
268
+
269
+ <l-card>
270
+ <q-card-actions class="q-gutter-sm">
271
+ <l-btn @click="saveCustomMenus" label="Save Custom Menu" icon="sym_o_save" />
272
+ <l-btn @click="resetMenus" label="Reset Menu" icon="sym_o_refresh" />
273
+ </q-card-actions>
274
+
275
+ <q-splitter v-model="splitterModel" style="height:680px">
276
+ <template #before>
277
+ <div class="q-pa-md">
278
+ <div class="text-h6 q-mb-md">Available Menu Items</div>
279
+ <q-tree :nodes="availableMenus" default-expand-all node-key="uuid">
280
+ <template v-slot:default-header="prop">
281
+ <div class="row items-center full-width">
282
+ <q-icon :name="prop.node.icon || 'sym_o_menu'" class="q-mr-sm" size="sm" />
283
+ <span>{{ prop.node.label }}</span>
284
+ <q-space />
285
+ <small v-if="prop.node.to" class="text-grey-6 q-mr-sm">{{ prop.node.to }}</small>
286
+ <q-btn flat round dense size="sm" icon="sym_o_add" color="positive"
287
+ @click.stop="addMenuToCustom(prop.node)">
288
+ <q-tooltip>Add to My Menu</q-tooltip>
289
+ </q-btn>
290
+ </div>
291
+ </template>
292
+ </q-tree>
293
+ </div>
294
+ </template>
295
+
296
+ <template #after>
297
+ <div class="q-pa-md">
298
+ <div class="text-h6 q-mb-md">My Custom Menu</div>
299
+
300
+ <!-- Action buttons -->
301
+ <q-card-actions class="q-mb-md q-gutter-xs" v-if="currentNodeDetail">
302
+ <template v-if="currentNodeDetail.type === 'root'">
303
+ <q-btn-dropdown v-bind="$light.getButtonProps({ label: 'Add' })" icon="sym_o_add"
304
+ size="sm" color="primary">
305
+ <q-list>
306
+ <q-item clickable v-close-popup @click="createNewFolder">
307
+ <q-item-section avatar>
308
+ <q-icon name="sym_o_folder" color="orange" />
309
+ </q-item-section>
310
+ <q-item-section>
311
+ <q-item-label>Add Folder</q-item-label>
312
+ </q-item-section>
313
+ </q-item>
314
+ <q-item clickable v-close-popup @click="createNewSubItem">
315
+ <q-item-section avatar>
316
+ <q-icon name="sym_o_menu" />
317
+ </q-item-section>
318
+ <q-item-section>
319
+ <q-item-label>Add Sub Item</q-item-label>
320
+ </q-item-section>
321
+ </q-item>
322
+ <q-item clickable v-close-popup @click="addSeparator">
323
+ <q-item-section avatar>
324
+ <q-icon name="sym_o_more_horiz" color="grey" />
325
+ </q-item-section>
326
+ <q-item-section>
327
+ <q-item-label>Add Separator</q-item-label>
328
+ </q-item-section>
329
+ </q-item>
330
+ </q-list>
331
+ </q-btn-dropdown>
332
+ </template>
333
+ <template v-else>
334
+ <q-btn-dropdown v-bind="$light.getButtonProps({ label: 'Add' })" icon="sym_o_add"
335
+ size="sm" color="primary">
336
+ <q-list>
337
+ <q-item clickable v-close-popup @click="createNewFolder">
338
+ <q-item-section avatar>
339
+ <q-icon name="sym_o_folder" color="orange" />
340
+ </q-item-section>
341
+ <q-item-section>
342
+ <q-item-label>Add Folder</q-item-label>
343
+ </q-item-section>
344
+ </q-item>
345
+ <q-item clickable v-close-popup @click="createNewSubItem">
346
+ <q-item-section avatar>
347
+ <q-icon name="sym_o_menu" />
348
+ </q-item-section>
349
+ <q-item-section>
350
+ <q-item-label>Add Sub Item</q-item-label>
351
+ </q-item-section>
352
+ </q-item>
353
+ <q-item clickable v-close-popup @click="addSeparator">
354
+ <q-item-section avatar>
355
+ <q-icon name="sym_o_more_horiz" color="grey" />
356
+ </q-item-section>
357
+ <q-item-section>
358
+ <q-item-label>Add Separator</q-item-label>
359
+ </q-item-section>
360
+ </q-item>
361
+ </q-list>
362
+ </q-btn-dropdown>
363
+
364
+ <l-btn @click="removeMenuItem(currentNodeDetail)" label="Delete" icon="sym_o_delete"
365
+ size="sm" color="negative" />
366
+ <l-btn @click="moveUp(currentNodeDetail)" label="Move Up" icon="sym_o_arrow_upward"
367
+ size="sm" />
368
+ <l-btn @click="moveDown(currentNodeDetail)" label="Move Down"
369
+ icon="sym_o_arrow_downward" size="sm" />
370
+ <l-btn @click="moveToGroup" label="Move to..." icon="sym_o_drive_file_move" size="sm" />
371
+ </template>
372
+ </q-card-actions>
373
+
374
+ <!-- Menu tree -->
375
+ <q-tree :nodes="userMenus" default-expand-all v-model:selected="selectedNode" node-key="uuid"
376
+ ref="userMenuTree">
377
+ <template v-slot:default-header="prop">
378
+ <div class="row items-center full-width">
379
+ <q-icon :name="prop.node.type === 'separator' ? 'sym_o_more_horiz' :
380
+ prop.node.type === 'root' ? 'sym_o_account_tree' :
381
+ prop.node.icon || 'sym_o_menu'" class="q-mr-sm" size="sm" :color="prop.node.type === 'separator' ? 'grey' :
382
+ prop.node.type === 'root' ? 'primary' : undefined" />
383
+ <span :class="{
384
+ 'text-grey-6': prop.node.type === 'separator',
385
+ 'text-primary': prop.node.type === 'root'
386
+ }">
387
+ {{ prop.node.label }}
388
+ </span>
389
+ <q-space />
390
+ <small v-if="prop.node.to" class="text-grey-6">{{ prop.node.to }}</small>
391
+ </div>
392
+ </template>
393
+ </q-tree>
394
+
395
+ <!-- Current selected node detail settings -->
396
+ <div v-if="currentNodeDetail && currentNodeDetail.type !== 'root'" class="q-mt-lg">
397
+ <q-separator class="q-mb-md" />
398
+ <div class="text-subtitle1 q-mb-md">Menu Settings</div>
399
+
400
+ <template v-if="currentNodeDetail.type === 'separator'">
401
+ <div class="q-gutter-md">
402
+ <l-checkbox label="Spaced Separator" v-model="currentNodeDetail.spaced" />
403
+ </div>
404
+ </template>
405
+
406
+ <template v-else>
407
+ <div class="q-gutter-md">
408
+ <l-input label="Label" v-model="currentNodeDetail.label" />
409
+ <l-input label="Route" v-model="currentNodeDetail.to" />
410
+ <l-icon-picker label="Icon" v-model="currentNodeDetail.icon" />
411
+ </div>
412
+ </template>
413
+ </div>
414
+ </div>
415
+ </template>
416
+ </q-splitter>
417
+ </l-card>
418
+ </div>
419
419
  </template>