@Hawkeye64 Changing default variables works well. But where to define .bg-my_color class to be accessible globally? If I define classes in my index.vue

<style lang="scss">
.text-brand {
  color: $brand;
}
.bg-brand {
  background: $brand;
}
</style>

it works

It was an Axios problem. Adding { responseType: 'blob' } fix it. Does anybody know how to get filename from response header?

this.$axios.post('/route/' , { data: data }, { responseType: 'blob' })
    .then((response) => {
      const status = exportFile('test.xlsx', response.data)
      if (status === true) {
        console.log('ok')
        // browser allowed it
      } else {
        // browser denied it
        console.log('Error: ' + status)
      }
    })

Hi! I’m trying to download xlsx file generated with my API, but the file is always corrupted.
I use an Export File Util but downloaded file is almost two times bigger then original one and can’t be opened. With Postman the API response gives me expected result (the file is ok).
So for experiment I’ve tried to download pdf file with Quasar and the result is the same (file was corrupted and two times bigger). But with .txt download is OK. I see that in axios response header “Content-Length” has a value that equals to original file size.
Anybody knows how to fix this?

Hi! Can’t integrate payment widget to site. I have two parts from bank.

script

<script
  id="alfa-payment-script"
  type="text/javascript"
  src="https://testpay.alfabank.ru/assets/alfa-payment.js">
</script>

div

<div id="alfa-payment-button"
     data-token='replace_this_to_merchant_token'
     data-client-info-selector='.clientInfo'
     data-amount-selector='.amount'
     data-version='1.0'
     data-order-number-selector='.orderNumber'
     data-language='ru'
     data-stages='1'
     data-return-url='http://store.ru/success_url.html'
     data-fail-url='http://store.ru/fail_url.html'
     data-amount-format='.amountFormat'
     data-description-selector='.order' 
></div>

In pure html it gives me a payment button, but in case of vue the div is empty.

I’ve tried:

1. to place <script> directly to head section of index.template.html (in this case I have an error in my console that the div is not found. So yes, it doesn’t exists, it appears in one dialog element later. )
2. to add <script> at mounted hook

mounted () {
    this.loadAlfa()
  },
  methods: {
    loadAlfa () {
      let promise = new Promise((resolve, reject) => {
        let script = document.createElement('script')
        script.charset = 'utf-8'
        script.id = 'alfa-payment-script'
        script.src = 'https://testpay.alfabank.ru/assets/alfa-payment.js'
        script.type = 'text/javascript'
        script.async = true
        script.onload = () => {
          resolve()
        }
        script.onerror = (err) => {
          reject(err)
        }
        document.head.appendChild(script)
      })
      return promise
    }
  }

(in this case no error, but also div is empty)

Please help!

Hi! Can’t copy robots.txt on quasar build with CopyWebpackPlugin. I’ve just copy-paste from there, but there is an error:

app:webpack Extending SPA Webpack config +493ms
(node:15489) UnhandledPromiseRejectionWarning:   ValidationError: Invalid options object. Copy Plugin has been initialized using an options object that does not match the API schema.
   - options[0] misses the property 'patterns'. Should be:
     [non-empty string | object { from, to?, context?, globOptions?, toType?, force?, flatten?, transform?, cacheTransform?, transformPath?, noErrorOnMissing? }, ...] (should not have fewer than 1 item)

What I’m doing wrong? Help pls!

Thanks to all! solved

@s-molinari Thanks, it works. But I have problem with reactivity, because data comes from API, so I need to add the “checked” column to rows… However, this time I did it on the server side, but it’s not right way. Can you advise me about right way to do it?

@s-molinari It’s correct. And I want to disable row checkbox by some condition

Hi! I’ve found this post, but it seems bit outdated. I can’t do it this way. I need to disable or hide “select all” checkbox, so user can select rows just one by one.

By the way, I also can’t understand how to do this with any of row? What is a body-cell-name for the selection column?
Help please!

@Mickey58 Hi! Just use style with % width

 <div class="row">

      <div class="col-md-2">
        <q-btn
          style="width: 100%;"
          label="Short label text"
        />
        <br />
        <br />
        <q-btn
          style="width: 100%;"
          label="Looooooong label text"
        />
      </div>
    </div>

But don’t forget div with row class wrapper outside. Also for mobile is better to use col-xs-12 instead col-md-2

Hi!

I’m trying to implement route guard that will store desired location for user that not yet logged in and redirect to it after login.

let storedURL = null
  router.beforeEach((to, from, next) => {
    const record = to.matched.find(record => record.meta.auth)
    if (record) {
      if (store.getters['auth/check']) {
        if (storedURL) {
          const redirectURL = storedURL
          storedURL = null
          next(redirectURL)
        } else {
          next()
        }
      } else {
        storedURL = to.path
        next('/')
      }
    } else {
      if (to.path === '/' && store.getters['auth/check']) {
        next('/dashboard')
      } else {
        next()
      }
    }
  })

It works, but on store location I have warning in my console:

Error: Script terminated by timeout at:
notify@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:730:36
reactiveSetter@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:1056:11
proxySetter@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:4625:5
__onControlFocusin@webpack-internal:///./node_modules/quasar/src/components/field/QField.js:345:9
invokeWithErrorHandling@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:1853:26
invoker@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:2178:14
add$1/original._wrapper@webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:6907:25

And on redirect I have an error:

uncaught exception: undefined

Can’t understand what is wrong