vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Update LiveEditor

pull/880/head
Tuğçe Küçükoğlu 2021-01-19 11:30:01 +03:00
parent 00fc9a26ab
commit 8286d6d3f2
2 changed files with 51 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/views/liveeditor/LiveEditor.vue
View File

@ -75,9 +75,9 @@ export default {
...extDependencies,
'vue': dependencies['vue'],
'axios': dependencies['axios'],
'primevue': '^3.1.1',
'primevue': 'latest',
'primeflex': dependencies['primeflex'],
'primeicons': dependencies['primeicons'],
'primeicons': 'latest',
'@babel/cli': dependencies['@babel/cli'],
'@vue/cli-plugin-babel': dependencies['@vue/cli-plugin-babel'],
'@vue/cli-service': dependencies['@vue/cli-service'],
@ -121,7 +121,7 @@ export default {
let content = this.sources.template.content;
let style = this.sources.template.style || '';
let scriptText = 'script';
let _files = {}, element = '', components = '', imports = '', directives = '';
let _files = {}, importElement = '', element = '', components = '', imports = '', directives = '';
_files[`src/components/${name}${extension}`] = {
content: `${content}
@ -130,8 +130,13 @@ export default {
${style}`
}
if(name !== 'FloatLabelDemo') {
element += `import ${name.slice(0, -4)} from "primevue/${name.slice(0, -4).toLowerCase()}";
`;
}
if(name === 'ToastDemo'){
imports += `import ToastService from 'primevue/toastservice';
imports += `import ToastService from "primevue/toastservice";
`;
directives += `app.use(ToastService);
`;
@ -141,9 +146,9 @@ ${style}`
directiveEl.forEach(dir => {
if(name === dir) {
imports += `import Tooltip from 'primevue/tooltip';
imports += `import Tooltip from "primevue/tooltip";
`;
directives += `app.directive('tooltip', Tooltip);
directives += `app.directive("tooltip", Tooltip);
`;
}
})
@ -157,12 +162,19 @@ ${style}`
})
}
if(name !== 'TooltipDemo') {
if(name !== 'TooltipDemo' && name !== 'RippleDemo' && name !== 'FloatLabelDemo') {
element += `app.component("${name.slice(0, -4)}", ${name.slice(0, -4)});`;
}
if(name === 'TooltipDemo' || name === 'BadgeDemo'){
directives += `app.directive('${name.slice(0, -4).toLowerCase()}', ${name.slice(0, -4)});
if(name === 'TooltipDemo' || name === 'RippleDemo'){
directives += `app.directive("${name.slice(0, -4).toLowerCase()}", ${name.slice(0, -4)});
`;
}
if(name === 'BadgeDemo' || name === 'AvatarDemo'){
imports += `import BadgeDirective from "primevue/badgedirective";
`;
directives += `app.directive("badge", BadgeDirective);
`;
}
@ -174,7 +186,7 @@ import "primevue/resources/primevue.min.css";
import "primeicons/primeicons.css";
import App from "./App.vue";
import PrimeVue from "primevue/config";
import ${name.slice(0, -4)} from "primevue/${name.slice(0, -4).toLowerCase()}";
${importElement}
${imports}
const app = createApp(App);
app.use(PrimeVue, { ripple: true });
@ -215,7 +227,7 @@ export default {
}
</${scriptText}>
<style lang="scss">
@import './App.scss';
@import "./App.scss";
</style>`
}
@ -454,21 +466,26 @@ img.flag {
`,
}
if (this.service) {
_files[`src/service/${this.service}.js`] = {
content: services[this.service]
}
extDependencies['axios'] = "^0.19.0";
}
if (this.data) {
if (this.service && this.data) {
const dataArr = this.data.split(',');
dataArr.forEach(el => {
_files[`public/data/${el}.json`] = {
content: data[el]
}
};
_files[`src/service/${this.service}.js`] = {
// content: services[this.service]
content: `import axios from 'axios';
import data from '../../public/data/${el}.json';
${services[this.service]}
`
};
});
extDependencies['axios'] = "^0.19.0";
}
if(name === 'EditorDemo') {
@ -484,7 +501,7 @@ img.flag {
extDependencies['chart.js'] = "2.7.3";
}
let mittComponents = ['ToastDemo', 'OrganizationChartDemo', 'ConfirmDialogDemo', 'ConfirmPopupDemo'];
let mittComponents = ['ToastDemo', 'OrganizationChartDemo', 'ConfirmDialogDemo', 'ConfirmPopupDemo', 'TerminalDemo'];
mittComponents.forEach(cmp => {
if(name === cmp) {

48
src/views/liveeditor/LiveEditorData.js
View File

@ -1,98 +1,74 @@
const services = {
'CountryService': `
import axios from 'axios';
import countriesData from '../../public/data/countries.json';
export default class CountryService {
getCountries() {
return axios.get(countriesData).then((res) => res.config.url.data);
return axios.get(data).then((res) => res.config.url.data);
}
}
`,
'CustomerService': `
import axios from 'axios';
import customersSmallData from '../../public/data/customers-large.json';
import customersMediumData from '../../public/data/customers-large.json';
import customersLargeData from '../../public/data/customers-large.json';
import customersXLargeData from '../../public/data/customers-large.json';
export default class CustomerService {
getCustomersSmall() {
return axios.get(customersSmallData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
getCustomersMedium() {
return axios.get(customersMediumData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
getCustomersLarge() {
return axios.get(customersLargeData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
getCustomersXLarge() {
return axios.get(customersXLargeData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
}
`,
'EventService': `
import axios from 'axios';
import eventData from '../../public/data/events.json';
export default class EventService {
getEvents() {
return axios.get(eventData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
}
`,
'NodeService': `
import axios from 'axios';
import treeTableNodeData from '../../public/data/treetablenodes.json';
import treeNodeData from '../../public/data/treenodes.json';
export default class NodeService {
getTreeTableNodes() {
return axios.get(treeTableNodeData).then(res => res.config.url.root);
return axios.get(data).then(res => res.config.url.root);
}
getTreeNodes() {
return axios.get(treeNodeData).then(res => res.config.url.root);
return axios.get(data).then(res => res.config.url.root);
}
}
`,
'PhotoService': `
import axios from 'axios';
import photoData from '../../public/data/photos.json';
export default class PhotoService {
getImages() {
return axios.get(photoData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
}
`,
'ProductService': `
import axios from 'axios';
import productsSmallData from '../../public/data/products-small.json';
import productsData from '../../public/data/products.json';
import productsWithOrdersSmallData from '../../public/data/products-orders-small.json';
export default class ProductService {
getProductsSmall() {
return axios.get(productsSmallData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
getProducts() {
return axios.get(productsData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
getProductsWithOrdersSmall() {
return axios.get(productsWithOrdersSmallData).then(res => res.config.url.data);
return axios.get(data).then(res => res.config.url.data);
}
}
`