Merge branch 'main' of github.com:fancy-crud/core into beta

demo-element-plus/src/plugins/fancy-crud.ts

@@ -1,15 +1,15 @@
 import { defineConfig } from '@fancy-crud/vue'
 import axios from 'axios'
 
-import components, { styles } from '@fancy-crud/wrapper-element-plus'
+import { components, styles, toast } from '@fancy-crud/wrapper-element-plus'
 import { valibotSafeParser as parser } from '@fancy-crud/plugin-rule-parsers'
-import { vueToastifyPlugin } from '@fancy-crud/plugin-vue3-toastify'
-
-// import TheMagic from './TheMagic.vue'
 
 axios.defaults.baseURL = 'http://localhost:9000/api/'
 
 export default defineConfig({
+  components,
+  styles,
+  toast: toast(),
   http: {
     request: axios as any,
     hooks: {
@@ -21,14 +21,8 @@ export default defineConfig({
       },
     },
   },
-  components: {
-    ...components,
-    // tableFooter: TheMagic,
-  },
-  styles,
   rules: {
     parser,
   },
-  toast: vueToastifyPlugin({ autoClose: 5000 }),
 })
 

demo-element-plus/src/viewer/FCheckboxViewer.vue

@@ -4,7 +4,7 @@
   </div>
 
   <div class="p-10 mt-10 border">
-    {{ form.fields.checkbox.modelValue }}
+    {{ form.fields.terms.modelValue }}
   </div>
 
   <button @click="resetFields" class="px-8 py-4 bg-primary-500 text-white font-bold">
@@ -35,7 +35,7 @@ const form = useForm({
       label: 'By clicking this checkbox, you agree to our terms and conditions',
       type: 'checkbox',
       inRow: true,
-      modelValue: false,
+      // modelValue: false,
     },
     checkbox: {
       label: 'Checkbox',

demo-element-plus/src/viewer/FInputViewer.vue

@@ -1,12 +1,16 @@
 <template>
   <div class="bg-white rounded-xl p-4">
-    <f-form @success="printing" @error="printing" v-bind="form" class="el-form--label-top" />
+    <f-form v-bind="form">
+      <template #form-footer="bind">
+        <f-form-footer v-bind="bind" />
+      </template>
+    </f-form>
   </div>
   <input v-model="title">
 </template>
 
 <script lang='ts' setup>
-import { FieldType, useForm } from '@fancy-crud/vue'
+import { FieldType, useForm, FFormFooter } from '@fancy-crud/vue'
 import { Bus, ResetFieldsByFormIdCommand } from '@fancy-crud/core'
 
 const bus = new Bus()
@@ -49,20 +53,5 @@ const form = useForm({
     },
   }),
 })
-
-// function loadData(e: any) {
-//   bus.execute(
-//     new LoadRemoteRecordCommand(form.id, '9', {
-//       onInit() {
-//         form.buttons.main.loading = true
-//       },
-//       onFinally() {
-//         form.buttons.main.loading = false
-//       },
-//     }),
-//   )
-// }
-
-function printing(response: any) { console.log(response) }
 </script>
 

demo-element-plus/src/viewer/FTableViewer.vue

@@ -36,7 +36,7 @@ const form = useForm({
       wrapper: {
         class: 'col-span-12',
       },
-      exclude: true,
+      modelValue: 'John',
     },
     gender: {
       type: FieldType.select,
@@ -47,7 +47,7 @@ const form = useForm({
         { label: 'Male', value: 'm' },
         { label: 'Female', value: 'f' },
       ],
-      hidden: true,
+      modelValue: 'm',
     },
     tu: {
       type: FieldType.text,
@@ -104,7 +104,6 @@ const table = useTable({
   },
   pagination: {
     rowsPerPage: 10,
-    // hidden: true,
   },
   filterParams: {
     gender: '',

demo-oruga/src/plugins/fancy-crud-oruga.ts

@@ -1,7 +1,7 @@
 import { defineConfig } from '@fancy-crud/vue'
 import axios from 'axios'
 
-import components, { styles } from '@fancy-crud/wrapper-oruga-ui'
+import { components, styles } from '@fancy-crud/wrapper-oruga-ui'
 import { valibotSafeParser as parser } from '@fancy-crud/plugin-rule-parsers'
 import { vueToastifyPlugin } from '@fancy-crud/plugin-vue3-toastify'
 
@@ -16,5 +16,5 @@ export default defineConfig({
   rules: {
     parser,
   },
-  toast: vueToastifyPlugin({ autoClose: 5000 }),
+  toast: vueToastifyPlugin(),
 })

demo-oruga/src/viewer/FInputViewer.vue

@@ -1,12 +1,16 @@
 <template>
   <div class="bg-white rounded-xl p-4">
-    <f-form v-bind="form" />
+    <f-form v-bind="form">
+      <template #form-footer="bind">
+        <f-form-footer v-bind="bind" />
+      </template>
+    </f-form>
   </div>
 </template>
 
 <script lang='ts' setup>
 // import { email, string } from 'valibot'
-import { FieldType, useForm } from '@fancy-crud/vue'
+import { FFormFooter, FieldType, useForm } from '@fancy-crud/vue'
 import { Bus, FORM_MODE, ResetFieldsByFormIdCommand } from '@fancy-crud/core'
 
 const bus = new Bus()

demo-quasar/src/main.ts

@@ -8,7 +8,7 @@ import { createApp } from 'vue'
 
 import { FancyCrud } from '@fancy-crud/vue'
 
-import { Quasar } from 'quasar'
+import { Notify, Quasar } from 'quasar'
 // import quasarIconSet from 'quasar/icon-set/material-icons'
 import fancyConfig from './plugins/fancy-crud'
 
@@ -17,7 +17,9 @@ import App from './App.vue'
 const app = createApp(App)
 
 app.use(Quasar, {
-  plugins: {},
+  plugins: {
+    Notify,
+  },
   // iconSet: quasarIconSet,
 })
 

demo-quasar/src/plugins/fancy-crud.ts

@@ -1,9 +1,8 @@
 import { defineConfig } from '@fancy-crud/vue'
 import axios from 'axios'
 
-import components, { styles } from '@fancy-crud/wrapper-quasar'
-import { valibotSafeParser as parser } from '@fancy-crud/plugin-rule-parsers'
-import { vueToastifyPlugin } from '@fancy-crud/plugin-vue3-toastify'
+import { components, styles, toast } from '@fancy-crud/wrapper-quasar'
+import { zodSafeParser as parser } from '@fancy-crud/plugin-rule-parsers'
 
 axios.defaults.baseURL = 'http://localhost:9000/api/'
 
@@ -17,5 +16,5 @@ export default defineConfig({
   rules: {
     parser,
   },
-  toast: vueToastifyPlugin({ autoClose: 5000 }),
+  toast: toast(),
 })

demo-quasar/src/viewer/FCheckboxViewer.vue

@@ -41,6 +41,7 @@ const form = useForm({
       label: 'Checkbox',
       type: 'checkbox',
       inRow: true,
+      modelValue: false,
       options: [true],
     },
     artists: {

demo-quasar/src/viewer/FInputViewer.vue

@@ -7,7 +7,7 @@
 <script lang='ts' setup>
 import { email, string } from 'valibot'
 import { FieldType, useForm } from '@fancy-crud/vue'
-import { Bus, FORM_MODE, ResetFieldsByFormIdCommand } from '@fancy-crud/core'
+import { Bus, FORM_MODE, INotificationStore, ResetFieldsByFormIdCommand, injecting } from '@fancy-crud/core'
 
 const bus = new Bus()
 const settings = {
@@ -36,6 +36,11 @@ const form = useForm({
       },
     },
 
+    gender: {
+      type: FieldType.text,
+      modelValue: 'm',
+    },
+
     email: {
       type: FieldType.text,
       label: 'Email',
@@ -49,8 +54,11 @@ const form = useForm({
   buttons: {
     main: {
       label: '{{ Lanzar | Modificar }}',
+      hidden: true,
     },
     aux: {
+      // hidden: true,
+      class: 'ml-0',
       onClick: () => {
         bus.execute(
           new ResetFieldsByFormIdCommand(form.id),
@@ -59,5 +67,10 @@ const form = useForm({
     },
   },
 })
+
+onMounted(() => {
+  const notify: INotificationStore = injecting(INotificationStore)
+  notify.push({ notification: { message: 'Hola mundo', type: 'success' } })
+})
 </script>
 

demo-quasar/src/viewer/FTableViewer.vue

@@ -10,6 +10,7 @@
 
 <script lang='ts' setup>
 import { FieldType, useForm, useTable, FORM_MODE } from '@fancy-crud/vue'
+import { z } from 'zod'
 
 const form = useForm({
   id: 'formulario',
@@ -21,17 +22,28 @@ const form = useForm({
       wrapper: {
         class: 'col-span-12',
       },
-      parseModelValue: Number,
+
     },
     gender: {
-      type: FieldType.text,
+      type: FieldType.select,
       label: 'Gender',
+      rules: (value: any) => ({ value, rule: z.string().nonempty() }),
+      multiple: true,
+      exclude: true,
       wrapper: {
-        class: 'col-span-12',
+        class: 'col-span-6',
+      },
+    },
+    image2: {
+      type: FieldType.file,
+      label: 'Imagen',
+      preview: true,
+      wrapper: {
+        class: 'col-span-6',
       },
     },
     created_at: {
-      type: FieldType.text,
+      type: FieldType.datepicker,
       label: 'Created at',
       updateOnly: true,
       readonly: true,
@@ -40,6 +52,14 @@ const form = useForm({
         class: 'col-span-12',
       },
     },
+    is_active: {
+      type: FieldType.checkbox,
+      label: 'Is active',
+      modelValue: false,
+      wrapper: {
+        class: 'col-span-12',
+      },
+    },
   },
   settings: (f) => {
     return {
@@ -53,9 +73,18 @@ const form = useForm({
 const table = useTable({
   form,
   columns: {
+    name: {
+    },
     gender: {
       format: (value: unknown) => value === 'm' ? 'Male' : 'Female',
     },
+    image2: {
+      label: 'Image',
+      input: {
+        isEnable: true,
+        type: FieldType.image,
+      },
+    },
     created_at: {
       format: (value: unknown) => 'Lo que sea',
     },

demo-vuetify/src/viewer/FTableViewer.vue

@@ -31,6 +31,13 @@ const form = useForm({
         class: 'col-span-12',
       },
     },
+    image2: {
+      type: FieldType.image,
+      label: 'Imagen',
+      wrapper: {
+        class: 'col-span-6',
+      },
+    },
     created_at: {
       type: FieldType.text,
       label: 'Created at',
@@ -46,14 +53,6 @@ const form = useForm({
     url: 'artists/',
     title: '{{ Crear artista | Actualizar artista }}',
   },
-  buttons: {
-    main: {
-      onClick(a: number, b: number) {
-
-      },
-      chubaca: '',
-    },
-  },
 })
 
 const table = useTable({
@@ -65,6 +64,11 @@ const table = useTable({
     created_at: {
       format: (value: unknown) => 'Lo que sea',
     },
+    image2: {
+      input: {
+        isEnable: true,
+      },
+    },
     actions: { value: 'actions', label: '' },
   },
   settings: {

packages/core/src/common/http/axioma/common.ts

@@ -6,8 +6,11 @@ export function onSuccess(response: any, options?: RequestDefaultOptions) {
 }
 
 export function onFailed(error: any, options?: RequestDefaultOptions) {
-  if (typeof options?.onFailed === 'function')
+  if (typeof options?.onFailed === 'function') {
     options?.onFailed(error)
+    return
+  }
+  console.error(error)
 }
 
 export function onFinally(options?: RequestDefaultOptions) {

packages/core/src/common/response-interceptor/integration/response-interceptor-store-service.ts

@@ -29,12 +29,8 @@ export class ResponseInterceptorStoreService implements IResponseInterceptorStor
 
     const interceptor = state[code]
 
-    if (!interceptor) {
-      console.error(
-        `Unable to intercept response. Response interceptor of code ${code} does not exist`,
-      )
+    if (!interceptor)
       return
-    }
 
     interceptor(formId, payload)
   }

packages/core/src/forms/axioma/commands/validate-form.ts

@@ -2,7 +2,7 @@ import type { BaseCommand, BaseHandler } from '@fancy-crud/bus'
 import type { BaseObjectWithNormalizedFields, NormalizedField, RuleConfig } from '@packages/core/forms/axioma'
 import { meta } from '@fancy-crud/bus'
 
-type MinimumNormalizedField = Pick<NormalizedField, 'rules' | 'errors' | 'modelValue' | 'modelKey'>
+type MinimumNormalizedField = Pick<NormalizedField, 'rules' | 'errors' | 'modelValue' | 'modelKey' | 'hidden' | 'exclude'>
 
 export class ValidateFormCommand implements BaseCommand {
   public readonly meta = meta(IValidateFormHandler)