fix liveeditor

src/views/liveeditor/LiveEditor.vue

@@ -135,7 +135,7 @@ export default {
                 extImport += `import FullCalendar from 'primevue/fullcalendar';`;
                 extElement += `app.component('FullCalendar', FullCalendar);`;
             }
-            if(name === 'BarChartDemo' || name === 'ComboChartDemo' || name === 'DoughnutChartDemo' || name === 'LineChartDemo' || name === 'PieChartDemo' || name === 'PolarAreaChartDemo' || name === 'RadarChartDemo') {
+            if(name.slice(-9) === 'ChartDemo') {
                 extDependencies['chart.js'] = "2.7.3";
                 extImport += `import Chart from 'primevue/chart';`;
                 extElement += `app.component('Chart', Chart);`;
@@ -148,6 +148,7 @@ export default {
                     serviceArr.push(el.split(','))
                 })
 
+                if(this.data) {
                     this.data.forEach(el => {
                         dataArr.push(el.split(','))
                     })
@@ -159,6 +160,7 @@ export default {
                             };
                         });
                     }
+                }
 
                 serviceArr.forEach(serv => {
                      _files[`src/service/${serv}.js`] = {
@@ -595,7 +597,7 @@ img.flag {
             }
 
             if(pages) {
-                const routes = [];
+                let routes = [], routeImports = '';
 
                 pages.forEach((page, i) => {
                     _files[`src/components/${page.tabName}.vue`] = {
@@ -604,16 +606,19 @@ img.flag {
 
                     let route = '';
 
+                    routeImports += `import ${page.tabName} from './components/${page.tabName}.vue';
+`;
+
                     if(i === 0) {
                         route += `{
     path: "/",
-                            component: () => import("./components/${page.tabName}.vue")
+    component: ${page.tabName}
 }`;
                     }
                     else {
                         route += `{
     path: "/${page.tabName.slice(0, -4).toLowerCase()}",
-                            component: () => import("./components/${page.tabName}.vue")
+    component: ${page.tabName}
 }`;
                     }
 
@@ -622,15 +627,11 @@ img.flag {
 
                 _files['src/router.js'] = {
                     'content': `import { createRouter, createWebHistory } from "vue-router";
-
+${routeImports}
 export const router = createRouter({
     history: createWebHistory(),
     routes: [
-        {
-            path: "/",
-            component: () => import("./${name}.vue"),
-            children: [${routes}]
-        }
+        ${routes}
     ]
 });
 `
@@ -665,12 +666,3 @@ export const router = createRouter({
     }
 }
 </script>
-
-<style lang="scss" scoped>
-.liveEditorSplitButton {
-    color: red;
-    a:hover {
-        text-decoration: none;
-    }
-}
-</style>

src/views/liveeditor/LiveEditorData.js

@@ -1,5 +1,6 @@
 const services = {
-    'CountryService': `import axios from 'axios'
+    'CountryService': `
+import axios from 'axios'
 
 export default class CountryService {
     
@@ -8,7 +9,8 @@ export default class CountryService {
     }
 }    
     `,
-    'CustomerService': `import axios from 'axios'
+    'CustomerService': `
+import axios from 'axios'
 
 export default class CustomerService {
     
@@ -33,7 +35,8 @@ export default class CustomerService {
     }
 }
     `,
-    'EventService': `import axios from 'axios';
+    'EventService': `
+import axios from 'axios';
 
 export default class EventService {
 
@@ -42,7 +45,8 @@ export default class EventService {
     }
 }
     `,
-    'NodeService': `import axios from 'axios';
+    'NodeService': `
+import axios from 'axios';
 
 export default class NodeService {
     
@@ -58,7 +62,8 @@ export default class NodeService {
     
 }
     `,
-    'PhotoService': `import axios from 'axios'
+    'PhotoService': `
+import axios from 'axios'
 
 export default class PhotoService {
 
@@ -68,7 +73,8 @@ export default class PhotoService {
     }
 }
 `,
-    'ProductService': `import axios from 'axios';
+    'ProductService': `
+import axios from 'axios';
 
 export default class ProductService {
 
@@ -404,7 +410,8 @@ const data = {
     ]
 }
     `,
-    'customers-large': `{
+    'customers-large': `
+{
         "data":[
            {
               "id":1000,
@@ -4912,7 +4919,8 @@ const data = {
            }
         ]
       }`,
-    'customers-small': `{
+    'customers-small': `
+{
         "data":[
            {
               "id":1000,