Navigation

    Quasar Framework

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. jhon
    J
    • Profile
    • Following 0
    • Followers 0
    • Topics 10
    • Posts 18
    • Best 0
    • Groups 0

    jhon

    @jhon

    0
    Reputation
    12
    Profile views
    18
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    jhon Follow

    Latest posts made by jhon

    • RE: Best way for implement Vuex with Typescript

      Any example?

      posted in Framework
      J
      jhon
    • Best way for implement Vuex with Typescript

      Hi friends

      Hi, friends… I’m try to implement Vuex with Typescript and Class Components

      I have a module named main

      index.ts

      import { Module } from 'vuex'
      import { StateInterface } from '../index'
      import state, { MainStateInterface } from './state'
      import actions from './actions'
      import getters from './getters'
      import mutations from './mutations'
      
      const main: Module<MainStateInterface, StateInterface> = {
        namespaced: true,
        actions,
        getters,
        mutations,
        state
      }
      
      export default main
      

      state.ts

      export interface MainStateInterface {
        id: number
        name: string
      }
      
      function state (): MainStateInterface {
        return {
          id: 1
          name: 'My Name'
        }
      }
      
      export default state
      

      Now, my question. What is the best way to use vuex in componets with Class componets.

      <template>
        <div>My component</div>
      </template>
      
      <script lang="ts">
      import { Vue, Component } from 'vue-property-decorator'
      @Component
      export default class ComponentName extends Vue {
      }
      </script>
      

      Thank in advance

      posted in Framework
      J
      jhon
    • RE: Change layout width

      @dobbel said in Change layout width:

      What do you mean excactly? You want the toolbar also have a max-width?

      Yes.

      posted in Framework
      J
      jhon
    • RE: Change layout width

      @dobbel Thanks for your help

      but, how I can apply this style to Toolbar

      7f327ca4-c3b2-427a-8cd2-08244a56a2ae-image.png

      Thanks again

      posted in Framework
      J
      jhon
    • Change layout width

      Hi

      Is posible to change the layout width, for exmple:

      width: 1200px
      align: center

      Thnaks

      posted in Framework
      J
      jhon
    • Who to register log error 500 in log file

      Hello

      I have a website in ssr mode but when it generates an error 500 we don’t know how to enter the error.

      const express = require('express')
      const compression = require('compression')
      
      const ssr = require('quasar-ssr')
      const extension = require('./extension')
      const app = express()
      const port = process.env.PORT || 3000
      const host = 'localhost'
      const backlog = 511
      
      const serve = (path, cache) => express.static(ssr.resolveWWW(path), {
        maxAge: cache ? 1000 * 60 * 60 * 24 * 30 : 0
      })
      
      // gzip
      app.use(compression({ threshold: 0 }))
      
      // serve this with no cache, if built with PWA:
      if (ssr.settings.pwa) {
        app.use(ssr.resolveUrl('/service-worker.js'), serve('service-worker.js'))
      }
      
      // serve "www" folder
      app.use(ssr.resolveUrl('/'), serve('.', true))
      
      // we extend the custom common dev & prod parts here
      extension.extendApp({ app, ssr })
      
      // this should be last get(), rendering with SSR
      app.get(ssr.resolveUrl('*'), (req, res) => {
        res.setHeader('Content-Type', 'text/html')
      
      ssr.renderToString({ req, res }, (err, html) => {
          if (err) {
            if (err.url) {
              res.redirect(err.url)
            }
            else if (err.code === 404) {
              // Should reach here only if no "catch-all" route
              // is defined in /src/routes
              res.status(404).send('404 | Page Not Found')
            }
            else {
              // Render Error Page or
              // create a route (/src/routes) for an error page and redirect to it
              res.status(500).send('500 | Internal Server Error')
              if (ssr.settings.debug) {
                console.error(500 on ${req.url})
                console.error(err)
                console.error(err.stack)
              }
            }
          }
          else {
            res.send(html)
          }
        })
      })
      
      app.listen(port, host, backlog, () => {
        console.log(Server listening at port ${port})
      })
      

      How could I improve this configuration to record the logs on the server.

      Thanks

      posted in Framework
      J
      jhon
    • Vuex Persisten State duplicate key

      Hi Friends

      I am using vuex-persistenstate to persist data across cokkies with a boot.

      import { Cookies } from 'quasar'
      import createPersistedState from 'vuex-persistedstate'
      
      export default function ({ store, ssrContext }) {
        const cookies = process.env.SERVER
          ? Cookies.parseSSR(ssrContext)
          : Cookies
      
        createPersistedState({
          key: '_mtdc',
          paths: ['auth.token', 'auth.profileUser'],
          storage: {
            getItem (key) {
              return JSON.stringify(cookies.get(key))
            },
            setItem (key, value) {
              console.log(key, value)
              cookies.set(key, value, {
                expires: 30,
                path: '/'
              })
            },
            removeItem (key) {
              cookies.remove(key)
            }
          }
        })(store)
      }
      

      But cookies are repeating in the browser

      Set-Cookie: _mtdc=%7B%22auth%22%3A%7B%22token%…
      67251359-a1f5-4242-aa8e-9ce5ae2cfa2b-imagen.png

      Any suggestions on how I could avoid this behavior
      Thanks

      posted in Framework
      J
      jhon
    • RE: Redirect to Page 404

      @beets Excelent…
      Muchas gracias…

      posted in Framework
      J
      jhon
    • Redirect to Page 404

      Hi.
      I need to redirect the user to page 404.vue after a query in ssr mode.

      preFetch ({ store, currentRoute, redirect }) {
          const p1 = store.dispatch('main/fetchCategoria', currentRoute.params.slugCategoria)
          p1.then((response) => {
            // Empleos por categoria
            const params = `categoria__slug=${currentRoute.params.slugCategoria}`
            return store.dispatch('main/fetchEmpleosCategoria', params)
          }).catch((e) => {
            if (e.response.status === 404) {
              redirect({ path: '404/' }) // this does not redirect
            }
            if (e.response.status === 500) {
              redirect({ name: 'error500' })
            }
          })
        },
      

      any suggestion?
      Thanks

      posted in Framework
      J
      jhon
    • RE: Problem con boot and acls

      Yep

      boot: [
      ‘axios’,
      ‘router’,
      ‘i18n’,
      ‘acls’ <------
      ],

      posted in Help
      J
      jhon