Thank you so much @patryckx, It works like a charm.

I hope it is useful for other Quasar Developers.

@dobbel

My goal is to have the ability to check if I must visualize an item menu depending on the user rigths.

For example, if in the EssentialLink array if I add those items how can conditionally hide the first item if the user rights do not allow you to perform the function “Customers” ?

  this.essentialLinks.push({
          title  : 'Customers',
          caption: 'Customers list',
          icon   : 'person',
          to     : '/customers',
          visible: true
   })
  this.essentialLinks.push({
          title  : 'New Order',
          caption: 'Inserrt a new order',
          icon   : 'description',
          to     : '/order'
   })

@dobbel

Sorry for the delay.

I meant the ability to pass the essentiallink item to the computed method “authenticated”. Is possible ?

@dobbel

Thanks for the answer and for your interesting solution.
Is possibile to pass the item processed to the computed method ?

In MyLayout.vue I use EssentialLink component to manage some menu items.

In the EssentialLink component I have create a new property “visible” to visualize or not the items.

<template>
  <q-item
    clickable
    :to="to"
    v-if="visible"
  >
   ......
    icon: {
      type: String,
      default: ''
    },
      visible: {
      type: Boolean,
      default: true
    }

In the login.vue page I should change the “visible” property of some of the Essentiallink elements when the user logs in, to disable or enable some features.

Is it possible to access the MainLayout.vue array where the elements used by Essentiallink are stored from the login.vue page or call a method present in the MainLayout.vue ?

Thank you very much.

Hi all,
I have created a simple function to show a dialog that I use into some methods.

The function that is before the “export default” section is this

async function ConfirmDialog(title, msg) {
   if (await new Promise(resolve => this.$q.dialog({
     title: title,
     message: msg,
     ok: {
           push: true,
           label: 'Yes',
           tabindex: 0
         },
     cancel: {
         push: true,
         label: 'No',
         tabindex: 1
       },
     persistent: true,
     focus: 'cancel'
   }).onOk(() => resolve(true)).onCancel(() => resolve(false)))) {
     return true
  } else {
    return false
  }
}

If I call this function inside a method, the fuction isn’t executed and the dialog isn’t show (with or without async await parameter).

methods: {

 async ValidateOrder () {
           this.descrerror = []

          if (!(cntrDate .getDay() % 6)) {
                          if  (await !ConfirmDialog('Confim', 'You have used a weekend day. Proceed ?')) {
                              this.descrerror.push('You have used a weekend day.')
                          }
    }

If I insert the code of the function inside the method all works fine

methods: {

 async ValidateOrder () {
           this.descrerror = []
         if (!(cntrDate .getDay() % 6)) {
               if (await new Promise(resolve => this.$q.dialog({
                            title: 'Confirm',
                             message: 'You have used a weekend day. Proceed ?'',
                             ok: {
                                   push: true,
                                   label: 'Yes',
                                   tabindex: 0
                                 },
                             cancel: {
                                 push: true,
                                 label: 'No',
                                 tabindex: 1
                               },
                             persistent: true,
                             focus: 'cancel'
                           }).onOk(() => resolve(true)).onCancel(() => resolve(false)))) {

                           } else {
                            this.descrerror.push('You have used a weekend day. ')
                           }
            }
    }

Does anyone have a suggestion to correctly display the message in the ConfirmDialog function?

Thanks

@Stanley Its a good idea. I’ll try to modify my process. Thank you for the suggestion.

@Stanley Thank you for the answer.
I use Golang for the back-end server and I only have to check the item code by making a call (with axios) to the back-end server; all other checks are carried out in Quasar.

Hi all,
I have a simple form with some qinput fields that I want to validate before post the data to the backend server when the user click a button.

My code is this

<template>
...
<q-btn dense class="q-mt-sm q-ma-xs" color="green" icon="check_circle_outline"  @click="UpdateRow"/>
...
</template>
...
<script>
....
methods: {

      async UpdateRow () {
                
            this.descrerror = []
            if (this.orderrow.item.length === 0) {
               this.descrerror.push('Item code is wrong')
            } else {
               await RestfulServices.getitemdesc(this.orderrow.item).then(response => {
                  if (response.statusText !== 'OK' || response.data.length === 0) {
                     this.descrerror.push('Item does not exists.')
                }
              })
            }

          if (this.descrerror.length > 0) {
              this.validateerror = true
             return
           }
}
...
</script>

To get the item description from the backend server I use Axios and I had to use async and await istructions to prevent that the instructions following the request to the server from being executed before the server replied.

I thought about not using Vuelidate because several controls require access to the back-end server, but maybe it’s not a bad idea.

Do you have any advice to improve this code ?

Thank you

I am a newbi of this beautiful framework and my first test app concerns a classic order entry system for the sales force.

Do you know where you can find some examples with order entry forms (master / detail) with different input fields (for example <q-input v-model = “search”> for articles, etc.)?

Thank you very much.

Thank you so much @patryckx, It works like a charm.

I hope it is useful for other Quasar Developers.