Hi,

Sorry for the inconvenience. Unfortunately, the Figma design file is not available for this project. Let us know if you have any other questions or concerns.

Thank you.

Hi there,

Thank you for bringing this issue to our attention. We apologize for the inconvenience this has caused you. We have released a new update that addresses this issue. Please update the following file `/src/base-components/Form`.

If you have any further questions or concerns, please don’t hesitate to reach out. We’re always here to help.

Thank you for your patience and understanding.

Best regards, Left4code Team

Very nice work, thanks for help.

Thank you for your kind words! I’m glad that I was able to assist you.

If you don’t mind, could you please take a moment to provide a review of my services? Your feedback would be greatly appreciated and it would help me to improve and provide better assistance to future users. Thank you!

Hello!

Thank you for getting in touch with us. I’m sorry for the delay in responding to your request. I see that you are interested in integrating Midone Vue into your Laravel project.

We would be happy to assist you with this! If you could kindly share your email address with us, we can send you an example project that should help you get started.

Thanks again for reaching out to us, and please let us know if you have any further questions or concerns. We’re here to help!

Hi guys, sorry for MY delay I don’t get any updates from TF. I’m a bit hesitant in sharing my email in an open discussion. I’ll send you an email with my question so you can send me the example, which should get me going

Sure, we can definitely send you the example project. Please email us at `leftforcode@gmail.com` and we’ll send the file over to you.

Let us know if you have any other questions or concerns. We’re always happy to help!

Best,

Hi there,

Thank you for reaching out to us. I’m sorry to inform you that our theme currently only supports Chart.js for charting functionality. At the moment, we do not support ApexCharts. If you would like to use apexcharts, you can integrate it into the theme by following the documentation provided by apexcharts or by using a third-party plugin.

Let us know if you have any further questions.

Best regards

Hi there,

I apologize for the late response.

For selecting a default value in Formselect after loading data from the API, you can simply set the value of the corresponding data property in your Vue component to the value that you want to select. This should cause the `FormSelect` component to update and display the selected value. Please check the following example.

<template>
  <div>
    <FormSelect v-model="selectedValue">
<option v-for="option in options" :value="option.value">{{ option.label }}</option>
</FormSelect>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      selectedValue: null,
      options: [],
    }
  },
  mounted() {
    axios.get('/api/options')
      .then(response => {
        this.options = response.data;

        // Set the default value after loading data
        this.selectedValue = this.options[0].value;
      })
      .catch(error => {
        console.log(error);
      });
  },
  methods: {
    handleChange(newValue) {
      console.log('Selected value:', newValue);
    },
  },
  watch: {
    selectedValue(newValue) {
      this.handleChange(newValue);
    },
  },
};
</script>

In this example, we first define a selectedValue and options variable in the component’s data object. We then make an API call using Axios in the mounted lifecycle hook, and set the options array to the response data. We also set the selectedValue to the first value in the options array, to set a default value.

The FormSelect component is then rendered in the template, with the v-model directive bound to selectedValue, and the options prop set to options.

We also define a handleChange method to handle the change event, which simply logs the new value to the console.

Finally, we define a watch on selectedValue, which calls the handleChange method whenever the selected value changes.

As for handling change events on Tomselect, you can use the v-model directive to bind the selected value to a data property in your Vue component. Then, you can add a @change event listener to the Tomselect component, which will call a method in your component to handle the change event. In this method, you can access the selected value from the data property that you bound to the v-model directive and perform any necessary actions.

I hope this helps! Let me know if you have any further questions or need additional assistance.

Best regards, Left4code Team

Hello,

I apologize for the delayed response. Could you please provide more information or a screenshot of the notification icon that you would like to add to the simple menu? This will help us better understand your request and provide you with more accurate information on how to achieve it.

Thank you for your patience, and I look forward to hearing back from you.

Best regards.

Hi! Thank you for your interest in our project. When you purchase, you will receive the full package including all source code files, documentation, and assets. You can modify and customize any part of the project to fit your needs. If you have any questions or need further assistance, please don’t hesitate to reach out to us.

Is there any sample project to check it out?

Hi,

I apologize for the delayed response. I’m glad to hear that you’ve made the purchase. To download the files, you can follow this link:

There, you will find instructions on how to download your items. Unfortunately, I do not have any sample projects to share at this time.

Let me know if you have any other questions.

Hello onalekitso,

Thank you for your interest in our Midone – Vuejs 3 Admin Dashboard Template + HTML Version. At the moment, our product does not support Nuxt 3 yet. However, our team is constantly working on improving and updating the template to meet our customer’s needs.

If you have any further questions, please don’t hesitate to ask.

Best regards.

Dear customer,

Hello! Thank you for your kind words about our work.

Regarding your requirements for the theme, I regret to inform you that our current templates are not API ready by default. This means that you will need to implement the API integration yourself. Our templates were built from scratch using HeadlessUI and Tailwind and TypeScript, so it is a standalone and not server-rendered. However, it should still be relatively easy for you to integrate with your existing backend API and change the API endpoints to meet your customization needs.

If you have any further questions or concerns, please do not hesitate to reach out. We would be more than happy to assist you in any way that we can.

Best regards, Left4code Team

Hi there!

Thank you for reaching out and purchasing our template. We are sorry to hear that you encountered some difficulty setting up.

To help you resolve the issue, we have identified several component files that may be causing the problem, especially on Windows. To fix the issue, please follow the steps below:

1. Rename the file ”/src/components/MobileMenu/DIvider.vue” to “Divider.vue”.

2. Open the file “src/base-components/Headless/Disclosure/Disclosure/Provider.vue” and replace the line.

// Original
import { computed } from "@vue/reactivity";
import { provide, ComputedRef } from "vue";

// Replace to
import { computed, provide, ComputedRef } from "vue";

3. Open the file “src/base-components/Headless/Tab/Tab/Provider.vue” and replace the line.

// Original
import { computed } from "@vue/reactivity";
import { provide, ComputedRef } from "vue";

// Replace to
import { computed, provide, ComputedRef } from "vue";

4. Open the file “src/base-components/Litepicker/Litepicker.vue” and replace the line.

// Original
import { ILPConfiguration } from "litepicker/dist/types/interfaces";

// Replace to
import { ILPConfiguration } from "litepicker/dist/types/interfaces.d";

We have uploaded an updated version of the template. This update may address the issue and we recommend downloading it to try out the latest version. If you have any further questions or concerns, please don’t hesitate to reach out. Thank you for your patience and we hope this helps.

Thanks!

No problem, happy to help! It’s great to hear that our assistance was useful. If there’s anything else you need, just let us know!

Hi there,

I apologize for the late reply. Sure, here’s an example of a form with input fields that can be submitted to send the data somewhere using Vue 3’s Composition API:

<template>
  <form @submit.prevent="submitForm">
    <label for="name">Name:</label>
    <input type="text" id="name" v-model="name" />
    <label for="email">Email:</label>
    <input type="email" id="email" v-model="email" />
    <button type="submit">Submit</button>
  </form>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  setup() {
    const name = ref('');
    const email = ref('');

    function submitForm() {
      // Here you can send the data to a server, for example, using axios
      axios.post('/api/submit-form', { name: name.value, email: email.value });
    }

    return { name, email, submitForm };
  },
};
</script>

In this example, we are using the v-model directive to bind the input fields to reactive data properties name and email. The form is submitted when the user clicks the submit button, which triggers the submitForm function. The function sends the data to a server (in this case, to the /api/submit-form endpoint) using the axios library.

I hope this helps! Let me know if you have any questions or need further assistance.

Seems like changing import { ILPConfiguration } from “litepicker/dist/types/interfaces”; to import { ILPConfiguration } from “litepicker/dist/types/interfaces.d”; wroked

Great to hear that changing the import statement worked for you! We appreciate you taking the time to inform us of this solution. We will definitely make sure to add this fix in our next update. Thanks for your help in improving the code!

Hi,

Thank you for bringing this issue to our attention. It’s possible that the decision to keep exports within the component file rather than in the index.ts file was made for simplicity and organization when the project was initially developed. However, I understand that this is causing issues with using webpack module federation.

I would like to inform you that our current focus is on Vite rather than webpack as the official Vue toolchain, Vue CLI, is currently on maintenance mode and we are forced to use Vite instead. Vite is a lightweight development server that is built on top of native ES modules, which allows for faster development and builds compared to webpack.

We understand the importance of compatibility with other tools and projects, and we apologize for any inconvenience this issue may have caused. However, due to our current schedule for new page design and new themes development for Midone, we will not be able to make updates to the code in the near future. We will look into possible solutions such as rewrite all components, or writing shims for every export to make it easier to work with TypeScript and maintain code structure. We will continue to work on finding a solution that works for you and your team and will make sure to keep you updated.

Hi ledsummer,

Sorry for the late reply,

Yes, the compiled build will be located in the ’/dist’ directory. You can deploy the result directly from there.

Let me know if you have further questions.

Hi there,

Thank you for reaching out to us,

Unfortunately, the design files are currently only available for Rubick (Adobe XD) and not all pages are available. Please check this link for more details.
https://i.imgur.com/M0jkFYO.png

Dear Fawadtariq,

Thank you for taking the time to rate and review our templates. We apologize for any inconvenience you may have experienced.

Migrating to TypeScript has been on our roadmap for the past year. This might be a big change for all Midone users, even for our team, but we believe migrating to typescript will provide a better experience and stability in the future.

As we know, vuejs version 3 has been rewritten using typescript, this makes it easier for us to write code more comfortably because the official type is available and we are sure that in the near future there will be more plugins that have typescript support.

We also wanted to make sure the major changes were finalized before we released Midone’s new theme, “Flux” in the early/middle of this year.

In the last version our team decided to no longer use global components, while it is convenient, using components globally will have a negative impact on the final bundle size even if the component is not used anywhere. Besides that, global components also cause confusion in the use of types that we have provided for several plugins. This is also documented in the vuejs documentation.

Even though the typescript version has been released we are still committed to continuing to provide support (fixing bugs/user guides) on the JS version. You can see the last changelog update at the end of the item description.

Thank you again for your feedback. We hope to hear from you soon.

Regards.

Thank you for a descriptive answer. I am sure you had your valid reason for these changes and I understand them. But my complain for not updating the documentation (within the download package) remains standing.

The changelog still doesn’t mention changes such as no more global components etc.

Further, to my curiosity, I want to ask is there a way to download a previous version after the new one is released?

Hi,

We will make sure to keep our documentation up-to-date with the latest version. If you’re looking to download the newest updates for the JS version, please don’t hesitate to reach out to us via email for more information.

Hi there,

Thank you for reaching out to us,

We’ve tried to reproduce this issue on multiple platforms but haven’t found the same issue, our team has also tried to deploy on Vercel, but found no similar issue.

Can you provide steps to reproduce this issue? Can you provide the version of node/npm you are using?

npm 8.19.2 node 18.11.0

I solved the problem like this:

interface Picker extends Litepicker { on: ( event: string, cb: ( startDate: { dateInstance: Date; }, endDate: { dateInstance: Date; } ) => void ) => this }

change on?—> on

return this instead {}

Maybe it’s wrong way, but it`s work

Hi,

Thank you for your reply,

This isn’t actually wrong, but it’s a bit odd that we didn’t encounter this type of incompatibility issue.

However, we will continue to identify the cause if we find reports from other users.