No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. donsherman
    • Profile
    • Following 0
    • Followers 0
    • Topics 8
    • Posts 22
    • Best 1
    • Groups 0

    donsherman

    @donsherman

    1
    Reputation
    2
    Profile views
    22
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    donsherman Follow

    Best posts made by donsherman

    • Notify Plugin onDismiss

      I there anyhow a possibility to get always the last mesage posted by this.$q.notify by the ‘onDismiss’ handler?

      <template>
        <div id="q-app">
          <router-view />
        </div>
      </template>
      <script>
      export default {
        name: 'App',
        created () {
          this.$q.notify.setDefaults({
            onDismiss: () => this.callNotify()
          })
        },
        methods: {
          callNotify () {
            // post here always the last notify message/caption
          }
        }
      }
      </script>
      

      a look into the sources depicts that unfortunately onDismiss doesn’t have a param.

        remove (notif) {
            clearTimeout(notif.meta.timer)
      
            const index = this.notifs[notif.position].indexOf(notif)
            if (index !== -1) {
              if (notif.group !== void 0) {
                delete groups[notif.meta.group]
              }
      
              const el = this.$refs[`notif_${notif.meta.uid}`]
      
              if (el) {
                const { width, height } = getComputedStyle(el)
      
                el.style.left = `${el.offsetLeft}px`
                el.style.width = width
                el.style.height = height
              }
      
              this.notifs[notif.position].splice(index, 1)
      
              this.$forceUpdate()
      
              if (typeof notif.onDismiss === 'function') {
                notif.onDismiss()
              }
            }
          }
        },
      
      

      any chance to extend it? (because it is a plugin, not a compoment)

      posted in Framework
      donsherman
      donsherman

    Latest posts made by donsherman

    • RE: Q-select mark disabled option with text-decoration: line-through

      @beets Thanks! Didn’t thought it was that easy. 😉

      posted in Framework
      donsherman
      donsherman
    • Q-select mark disabled option with text-decoration: line-through

      It’s easy to disable an option but how can I put then a css class like text-decoration: line-through ?

      Q-select has an options-selected-class property but imo it should have also an options-disabled-class prop for that purpose?!

      Is there a chance to overwrite the CSS selector in the .vue file?
      And if so, could someone give an example or hint?
      (this below should be the class)

      102107019-8b84fc00-3e31-11eb-88af-dbad4fa4661f.png

      posted in Framework
      donsherman
      donsherman
    • RE: Notify Plugin onDismiss

      @beets thx again for your hints 😉
      Here’s my final release:

      import Vue from "vue";
      import { date, Notify, SessionStorage } from "quasar";
      
      export default ({ Vue }) => {
        let lastMessage = "",
          lastCaption = "",
          keyInc = 0;
        SessionStorage.clear();
      
        const logNotify = (c, m) => {
          let stamp = `[${date.formatDate(Date.now(),"DD-MMM-YYYY HH:mm:ss" )}] ${c} : ${m}`;
          SessionStorage.set(`notifyKey${keyInc++}`, stamp);
          //console.log(SessionStorage.getAll());
        };
      
        Vue.prototype.$logNotify = params => {
          if (typeof params === "string") {
            params = { message: params }; // support basic string usage
          }
          lastCaption = params.caption ? params.caption : "";
          lastMessage = params.message;
      
          Notify.create({
            ...params,
            onDismiss: () => {
              logNotify(lastCaption, lastMessage);
            }
          });
        };
      };
      
      posted in Framework
      donsherman
      donsherman
    • RE: Notify Plugin onDismiss

      @beets got it now somehow.
      This boot file works for me :

      import { SessionStorage } from "quasar";
      import Vue from "vue";
      import { date, Notify } from "quasar";
      
      export default ({ Vue }) => {
        let lastMessage = "",
          lastCaption = "",
          keyInc = 0;
        SessionStorage.clear();
        
        const logNotify = (c, m) => {
          let stamp =
            "[" + date.formatDate(Date.now(), "HH:mm:ss") + "] " + c + ":" + m;
          SessionStorage.set("notifyKey" + keyInc++, stamp);
          console.log(SessionStorage.getAll());
        };
      
        Vue.prototype.$logNotify = params => {
          if (typeof params === "string") {
            params = { message: params }; // support basic string usage
          }
          lastCaption = params.caption ? params.caption : "";
          lastMessage = params.message;
          const oldOnDismiss = logNotify;
      
          Notify.create({
            ...params,
            onDismiss: () => {
              if (typeof oldOnDismiss == "function") {
                oldOnDismiss(lastCaption, lastMessage);
              }
            }
          });
        };
      };
      

      Thanks a lot

      posted in Framework
      donsherman
      donsherman
    • RE: Notify Plugin onDismiss

      @beets Thanks again.
      My goal is to log all notify messages in a Sessionstorage and to list them all when user clicks a certain button on the main page.
      I want to wrap them with an additional timestamp and maybe also the caption (if there was one set)

      So with your apporach, it doesn’t seem to be somehow necessary to put stuff into App.vue.
      Your Notify boot file will be sufficient for that (as far as I may understood it)

      I will try your suggestions within the next days. One little imperfection is, to refactor all my $q.notifes in the sources with $myNotify
      But Ok, that’s nothing bad 😉

      Btw and OT: How Can I format here code tokens in that red/filled style?

      posted in Framework
      donsherman
      donsherman
    • RE: Notify Plugin onDismiss

      Thanks, but I must confess, that I don’t understand your example at all, so that I’ll be not able to tweak it right.
      How does “myNotify” inhertis all the things of Notify i.e.?

      posted in Framework
      donsherman
      donsherman
    • Notify Plugin onDismiss

      I there anyhow a possibility to get always the last mesage posted by this.$q.notify by the ‘onDismiss’ handler?

      <template>
        <div id="q-app">
          <router-view />
        </div>
      </template>
      <script>
      export default {
        name: 'App',
        created () {
          this.$q.notify.setDefaults({
            onDismiss: () => this.callNotify()
          })
        },
        methods: {
          callNotify () {
            // post here always the last notify message/caption
          }
        }
      }
      </script>
      

      a look into the sources depicts that unfortunately onDismiss doesn’t have a param.

        remove (notif) {
            clearTimeout(notif.meta.timer)
      
            const index = this.notifs[notif.position].indexOf(notif)
            if (index !== -1) {
              if (notif.group !== void 0) {
                delete groups[notif.meta.group]
              }
      
              const el = this.$refs[`notif_${notif.meta.uid}`]
      
              if (el) {
                const { width, height } = getComputedStyle(el)
      
                el.style.left = `${el.offsetLeft}px`
                el.style.width = width
                el.style.height = height
              }
      
              this.notifs[notif.position].splice(index, 1)
      
              this.$forceUpdate()
      
              if (typeof notif.onDismiss === 'function') {
                notif.onDismiss()
              }
            }
          }
        },
      
      

      any chance to extend it? (because it is a plugin, not a compoment)

      posted in Framework
      donsherman
      donsherman
    • RE: Q-tab-panels, post form input values when tab is not visible

      I found the pitfall in my case: forgot to put ‘keep-alive’ into q-tab-panels prop.
      Sorry for that.
      But nevertheless : it would be rather helpful to understand better what this promises really do.

      Edit: to me it seems to be that, promiseChain is only a string - and not a function.
      How could this be “then()'able” then?

      posted in Help
      donsherman
      donsherman
    • RE: Q-tab-panels, post form input values when tab is not visible

      @metalsadman I have the same approach as JJ and I was first glad, to find this post here.
      But indeed: it doesn’t work to me, because the unvisible tabs are all undefined then (this.$refs.age == undefined i.e. submitting on name-tab ).
      Why is your codepen however working?
      Could you pls. explain a bit more in detailed how your travers method is working? (And why this doesn’t seemed to be enough to get ALL other q-input refs defined?)

       discoverTabs() {
            // traverse the tabs to discover its content
            let traversal = this.tabNames.reduce((promiseChain, item) => {
              return promiseChain.then(() => new Promise(resolve => {
                    console.log("done with", item)
                    resolve()
                    this.$refs.tabs.goTo(item)
                  })
              )
            }, Promise.resolve())
            
            traversal.then(() => {
              console.log("done")
              this.$refs.tabs.goTo('name')
            })
          }
      

      So is there a chance to check all validations of the q-form in onSubmit?
      Or do I really should use q-tab w/o q-tab-panels and define them all with a v-show?

      Edit: as remark: I have more than one q-input component per each tab-panel. Is that maybe a cause? And your example of the travers method doesn’t cope this?

      posted in Help
      donsherman
      donsherman
    • Same value for attributes

      I got a q-form with some q-tabs inside and inside the q-tab some q-inputs

      My question is: is it somehow avoidable to write 3 times i.e. the same attribute name?
      ( v-model = name = ref = “attributename” )

      so only to write it once per q-input (for v-model i.e.) and all other attributes (ref, name,…) got the same val

                   <q-input
                      v-model="domain"
                      name="domain"
                      ref="domain"
                      autofocus
                      :label="$t('domain.Label')"
                      :hint="$t('domain.hint')"
                      maxlength="50"
                      :rules="[val => !!val || $t('txtRequired')]"
                    />
                    <q-input
                      v-model="db_server"
                      name="db_server"
                      ref="db_server"
                      :label="$t('db_server.Label')"
                      :hint="$t('db_server.hint')"
                      maxlength="100"
                      :rules="[val => !!val || $t('txtRequired')]"
                    />
      
      
      posted in Help
      donsherman
      donsherman