@hostlink/nuxt-light 1.15.0 → 1.15.1

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/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "light",
3
3
  "configKey": "light",
4
- "version": "1.15.0",
4
+ "version": "1.15.1",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "0.8.3",
7
7
  "unbuild": "2.0.0"
@@ -19,14 +19,18 @@ const props = defineProps({
19
19
  </script>
20
20
 
21
21
  <style scoped>
22
- body.body--dark fieldset{border-color:hsla(0,0%,100%,.6)}fieldset{border:1px solid rgba(0,0,0,.24);border-radius:4px;margin:0}legend{padding-left:.5rem;padding-right:.5rem}
22
+ body.body--dark fieldset{border-color:hsla(0,0%,100%,.6)}fieldset{border:1px solid rgba(0,0,0,.24);border-radius:4px}legend{padding-left:.5rem;padding-right:.5rem}
23
23
  </style>
24
24
  <template>
25
- <fieldset :class="`q-gutter-${props.gutter}`">
25
+ <fieldset>
26
26
  <legend v-if="props.label">{{ i18n.t(props.label) }}</legend>
27
- <slot></slot>
28
27
 
29
- {{ props }}
28
+ <div :class="`q-gutter-${props.gutter}`">
29
+ <slot></slot>
30
+ </div>
31
+
32
+
33
+
30
34
 
31
35
  </fieldset>
32
36
  </template>
@@ -416,17 +416,21 @@ if (route.fullPath == "/" && my.default_page) {
416
416
 
417
417
  <q-page-container :class="containerClass" :style="containerStyle"> <!-- Error message -->
418
418
  <slot name="header"></slot>
419
- <q-banner dense inline-actions class="bg-grey-4 q-ma-md" v-for=" error in errors " rounded>
420
- {{ error }}
421
- <template v-slot:action>
422
- <q-btn flat label="Detail" @click="$q.dialog({
423
- title: 'Error Detail',
424
- message: error.stack,
425
- fullWidth: true,
426
- })"></q-btn>
427
- <q-btn flat icon="sym_o_close" round dense @click="light.removeError(error)" />
428
- </template>
429
- </q-banner>
419
+ <div class="q-gutter-sm q-pa-sm" v-if="errors.length > 0">
420
+ <q-banner dense inline-actions class="bg-grey-4" v-for=" error in errors " rounded>
421
+ {{ error }}
422
+ <template v-slot:action>
423
+ <q-btn flat label="Detail" @click="$q.dialog({
424
+ title: 'Error Detail',
425
+ message: error.stack,
426
+ fullWidth: true,
427
+ })"></q-btn>
428
+ <q-btn flat icon="sym_o_close" round dense @click="light.removeError(error)" />
429
+ </template>
430
+ </q-banner>
431
+
432
+ </div>
433
+
430
434
 
431
435
  <!-- router-view v-slot="{ Component }">
432
436
 
@@ -11,7 +11,7 @@ const props = defineProps({
11
11
  type: String,
12
12
  default: '500px'
13
13
  },
14
- ok: {
14
+ save: {
15
15
  type: Function,
16
16
  default: null
17
17
  },
@@ -37,14 +37,17 @@ const loading = ref(false)
37
37
 
38
38
  const emits = defineEmits(['submit'])
39
39
 
40
-
41
- const onOk = async (data, node) => {
40
+ const onSubmit = async (data, node) => {
42
41
  emits('submit', data)
43
42
 
44
- if (props.ok) {
43
+ if (props.save) {
45
44
  loading.value = true
46
45
  try {
47
- await props.ok(data)
46
+ await props.save(data)
47
+ $q.notify({
48
+ type: 'positive',
49
+ message: 'Data saved successfully'
50
+ })
48
51
  onDialogOK(data)
49
52
  } catch (error) {
50
53
 
@@ -52,6 +55,7 @@ const onOk = async (data, node) => {
52
55
  title: 'Error',
53
56
  message: error.message
54
57
  })
58
+
55
59
  } finally {
56
60
  loading.value = false
57
61
  }
@@ -82,14 +86,14 @@ const onCancel = async () => {
82
86
  <q-btn icon="sym_o_close" flat round dense v-close-popup />
83
87
  </q-toolbar>
84
88
 
85
- <form-kit type="form" :bordered="false" :actions="false" :value="value" #default="context" @submit="onOk">
89
+ <form-kit type="form" :bordered="false" :actions="false" :value="value" #default="context" @submit="onSubmit">
86
90
 
87
91
  <q-card-section>
88
92
  <slot name="default" v-bind="context"></slot>
89
93
  </q-card-section>
90
94
  <q-card-actions align="right">
91
- <q-btn label="Cancel" @click="onCancel" unelevated color="grey-4" text-color="grey-8" />
92
- <q-btn label="OK" type="submit" color="primary" unelevated :disabled="!context.state.valid" />
95
+ <q-btn icon="sym_o_close" :label="$t('Cancel')" @click="onCancel" unelevated color="grey-4" text-color="grey-8" />
96
+ <q-btn icon="sym_o_check" :label="$t('Save')" type="submit" color="primary" unelevated :disabled="!context.state.valid" />
93
97
  </q-card-actions>
94
98
  </form-kit>
95
99
 
@@ -561,7 +561,7 @@ const onAdd = () => {
561
561
  v-model:minimized="minimized" v-model:maximized="maximized">
562
562
 
563
563
  <q-toolbar v-if="addComponent">
564
- <q-btn icon="sym_o_add" label="Add" color="primary" @click="onAdd" v-if="addComponent" dense />
564
+ <q-btn icon="sym_o_add" label="Add" color="primary" @click="onAdd" v-if="addComponent" />
565
565
  </q-toolbar>
566
566
 
567
567
 
@@ -608,10 +608,10 @@ const onAdd = () => {
608
608
  <div :class="{ 'text-grey-8': !isDark }" v-if="primaryKey">
609
609
 
610
610
  <l-view-btn v-if="actionView && props.row.canView"
611
- :to="`/${modelName}/${props.row[primaryKey]}/view`" size="sm"/>
611
+ :to="`/${modelName}/${props.row[primaryKey]}/view`" size="sm" />
612
612
 
613
613
  <l-edit-btn v-if="activeEdit && props.row.canUpdate"
614
- :to="`/${modelName}/${props.row[primaryKey]}/edit`" size="sm"/>
614
+ :to="`/${modelName}/${props.row[primaryKey]}/edit`" size="sm" />
615
615
 
616
616
  <l-delete-btn v-if="actionDelete && props.row.canDelete"
617
617
  @submit="onDelete(props.row[primaryKey])" size="sm"></l-delete-btn>
@@ -1,12 +1,12 @@
1
1
  <script setup>
2
2
  import { ref } from 'vue'
3
3
  const form = ref(null)
4
- const ok = async (data, node) => {
4
+ const save = async (data, node) => {
5
5
  await new Promise(resolve => setTimeout(resolve, 1000))
6
6
  }
7
7
  </script>
8
8
  <template>
9
- <l-form-dialog title="Add User" :ok="ok">
9
+ <l-form-dialog title="Add User" :save="save">
10
10
  <form-kit type="l-input" name="name" label="Name" dense validation="required" />
11
11
  </l-form-dialog>
12
12
  </template>
@@ -1,18 +1,7 @@
1
1
  <script setup lang="ts">
2
- import { type FormKitInputs } from '@formkit/inputs';
3
2
  import { computed } from 'vue'
4
3
  import { getErrorMessage } from 'formkit-quasar';
5
4
 
6
- declare module '@formkit/inputs' {
7
- interface FormKitInputProps<Props extends FormKitInputs<Props>> {
8
- lInput: {
9
- type: 'l-input';
10
- name: string;
11
- label: string;
12
- number?: string;
13
- };
14
- }
15
- }
16
5
 
17
6
 
18
7
  const props = defineProps({
@@ -1,3 +1,4 @@
1
+ import { type FormKitInputs } from '@formkit/inputs';
1
2
  export interface User {
2
3
  user_id?: number;
3
4
  username: string;
@@ -54,6 +55,25 @@ declare module 'vue' {
54
55
  $light: typeof app;
55
56
  }
56
57
  }
58
+ declare module '@formkit/inputs' {
59
+ interface FormKitInputProps<Props extends FormKitInputs<Props>> {
60
+ lInput: {
61
+ type: 'l-input';
62
+ name: string;
63
+ label: string;
64
+ number?: string;
65
+ dense?: boolean;
66
+ };
67
+ }
68
+ interface FormKitInputProps<Props extends FormKitInputs<Props>> {
69
+ lDatePicker: {
70
+ type: 'l-date-picker';
71
+ name: string;
72
+ label: string;
73
+ dense?: boolean;
74
+ };
75
+ }
76
+ }
57
77
  export declare const useLight: (options?: {
58
78
  color?: string;
59
79
  }) => {
@@ -20,8 +20,9 @@ const columns = model("User").columns({
20
20
  const status = ref("0");
21
21
 
22
22
  //const testDialog = resolveComponent("l-test-dialog")
23
- //const testDialog = resolveComponent("l-test2")
24
- const testDialog = null
23
+
24
+ //const testDialog = null
25
+ const testDialog = resolveComponent("l-test2")
25
26
 
26
27
 
27
28
  </script>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hostlink/nuxt-light",
3
- "version": "1.15.0",
3
+ "version": "1.15.1",
4
4
  "description": "HostLink Nuxt Light Framework",
5
5
  "repository": {
6
6
  "type": "git",