Navigation

    Quasar Framework

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. lleiva
    L
    • Profile
    • Following 0
    • Followers 0
    • Topics 0
    • Posts 1
    • Best 1
    • Groups 0

    lleiva

    @lleiva

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

    lleiva Follow

    Best posts made by lleiva

    • RE: await dialogs mixin

      Based on your mixin, i’ve done a service that I can import in my vue.

      _AppDialogService :

      import { Dialog } from "quasar";
      
      class _AppDialogService {
        async dialogtest() {
          // (un)comment one or move of the tests below
          this.alert("Test Alert", "All is good, no wait");
          console.log(
            "confirmation",
            await this.confirm("Test Confirm", "everything ok?", "really?")
          );
          await this.alert("Test Alert", "All is good,  wait for dismiss");
          console.log(
            "prompt",
            await this.prompt("Test Prompt", "What is your favorite color")
          );
        }
        async dialog(opts = {}) {
          return new Promise(resolve => {
            if (opts.prompt === true) opts.prompt = { model: "", type: "text" };
            Dialog.create({
              title: opts.title || "",
              message: opts.msg || "",
              cancel: opts.cancel == null ? false : opts.cancel,
              persistent: opts.persist == null ? false : opts.persist,
              prompt: opts.prompt,
              ok: {
                label: opts.ok || "ok"
              }
            })
              .onOk(res => resolve(opts.confirm ? true : res || ""))
              .onCancel(() => resolve(false));
          });
        }
      
        async confirm(title, msg, label) {
          return this.dialog({
            title: title,
            msg: msg,
            confirm: true,
            cancel: true,
            persist: true,
            ok: label
          });
        }
        async alert(title, msg) {
          return this.dialog({ title: title, msg: msg });
        }
        async prompt(title, msg, prompt) {
          return this.dialog({
            title: title,
            msg: msg,
            persist: true,
            prompt: prompt || true
          });
        }
      }
      
      export default new _AppDialogService();
      
      

      Usage in a vue file:

      <script>
      import _AppDialogService from "../services/_appDialogService";
      
      dummyFunction: async function() {
            try {
              ....
              if (await _AppDialogService.confirm("Title", "Ok/Nok", "Press ok")) {
                // Code when OK
              } else {
                // Code when NOK
              }
            } catch (error) {
              // Code when something Wrong
            }
          },
      
      ...
      ...
      </script>
      
      

      Cheers

      posted in Show & Tell
      L
      lleiva

    Latest posts made by lleiva

    • RE: await dialogs mixin

      Based on your mixin, i’ve done a service that I can import in my vue.

      _AppDialogService :

      import { Dialog } from "quasar";
      
      class _AppDialogService {
        async dialogtest() {
          // (un)comment one or move of the tests below
          this.alert("Test Alert", "All is good, no wait");
          console.log(
            "confirmation",
            await this.confirm("Test Confirm", "everything ok?", "really?")
          );
          await this.alert("Test Alert", "All is good,  wait for dismiss");
          console.log(
            "prompt",
            await this.prompt("Test Prompt", "What is your favorite color")
          );
        }
        async dialog(opts = {}) {
          return new Promise(resolve => {
            if (opts.prompt === true) opts.prompt = { model: "", type: "text" };
            Dialog.create({
              title: opts.title || "",
              message: opts.msg || "",
              cancel: opts.cancel == null ? false : opts.cancel,
              persistent: opts.persist == null ? false : opts.persist,
              prompt: opts.prompt,
              ok: {
                label: opts.ok || "ok"
              }
            })
              .onOk(res => resolve(opts.confirm ? true : res || ""))
              .onCancel(() => resolve(false));
          });
        }
      
        async confirm(title, msg, label) {
          return this.dialog({
            title: title,
            msg: msg,
            confirm: true,
            cancel: true,
            persist: true,
            ok: label
          });
        }
        async alert(title, msg) {
          return this.dialog({ title: title, msg: msg });
        }
        async prompt(title, msg, prompt) {
          return this.dialog({
            title: title,
            msg: msg,
            persist: true,
            prompt: prompt || true
          });
        }
      }
      
      export default new _AppDialogService();
      
      

      Usage in a vue file:

      <script>
      import _AppDialogService from "../services/_appDialogService";
      
      dummyFunction: async function() {
            try {
              ....
              if (await _AppDialogService.confirm("Title", "Ok/Nok", "Press ok")) {
                // Code when OK
              } else {
                // Code when NOK
              }
            } catch (error) {
              // Code when something Wrong
            }
          },
      
      ...
      ...
      </script>
      
      

      Cheers

      posted in Show & Tell
      L
      lleiva