Ola
2020-03-19 : This is now part of the BANanoVueMaterial open source library.
This project is based on a functional BANanoVueMaterial library I am working on. An extension of the BANanoVue project I explored here.
Ever since I started working on the PDFDesign project for generating PDF documents I have been wanting to complete it with a more enhanced interface with drag and drop functionality. Something in the lines of what is depicted below.
I am working on a couple of projects with VueMaterial, a HTML5 framework that uses VueJS as the base framework. So when I have time on weekends besides attending to the bambinos, I explore some of my bucket list things some more. So the plan is to make the PDFDesign project intergrated into this for a one single point of call for BANano project helpers that include reporting.
As a newbie to VueJS, if anyone is skilled, please if you can shout as I need to iron out a few things here and need help.
So far the following components are drag and drop possible for Phase 1
Reproduction (if you'd like to check this out)
1. Create a MySQL database with the attached .sql file.
2. Update the .php file to connect to your MySQL db. These are my connection settings.
3. Run the project from your web server. The component definitions are saved on the MySQL db as JSON strings and regenerate the components from there.
Update: Using the render function now enables compilation of templates in realtime without page reloads.
Constructive criticism is welcome.
Ta!
Related Links
BANanoVue
VueJS
VueMaterial
2020-03-19 : This is now part of the BANanoVueMaterial open source library.
This project is based on a functional BANanoVueMaterial library I am working on. An extension of the BANanoVue project I explored here.
Ever since I started working on the PDFDesign project for generating PDF documents I have been wanting to complete it with a more enhanced interface with drag and drop functionality. Something in the lines of what is depicted below.
I am working on a couple of projects with VueMaterial, a HTML5 framework that uses VueJS as the base framework. So when I have time on weekends besides attending to the bambinos, I explore some of my bucket list things some more. So the plan is to make the PDFDesign project intergrated into this for a one single point of call for BANano project helpers that include reporting.
As a newbie to VueJS, if anyone is skilled, please if you can shout as I need to iron out a few things here and need help.
So far the following components are drag and drop possible for Phase 1
- Button
- IconButton
- SpeedDial
- Icon
- Input (email, tel, email, password)
- DatePicker
- Upload
- Radio
- Select
- Slider
- Switch
- Label (p, h1-h6)
Reproduction (if you'd like to check this out)
1. Create a MySQL database with the attached .sql file.
2. Update the .php file to connect to your MySQL db. These are my connection settings.
B4X:
<?php
const DB_HOST = 'localhost';
const DB_USER = 'root';
const DB_PASS = '';
const DB_NAME = 'vmdesigner';
?>3. Run the project from your web server. The component definitions are saved on the MySQL db as JSON strings and regenerate the components from there.
Update: Using the render function now enables compilation of templates in realtime without page reloads.
Constructive criticism is welcome.
Ta!
Related Links
BANanoVue
VueJS
VueMaterial
Last edited:
