ContextPath added to dynamic urls and services

This commit is contained in:
Bahadır Sofuoğlu
2022-11-29 13:46:18 +03:00
parent 93ec659282
commit bbcebb99c5
21 changed files with 115 additions and 226 deletions

View File

@@ -2,12 +2,11 @@
import { useLayout } from '@/layout/composables/layout';
import { computed } from 'vue';
const { layoutConfig } = useLayout();
const { layoutConfig, contextPath } = useLayout();
const logoUrl = computed(() => {
return `layout/images/${layoutConfig.darkTheme.value ? 'logo-white' : 'logo-dark'}.svg`;
return `${contextPath}layout/images/${layoutConfig.darkTheme.value ? 'logo-white' : 'logo-dark'}.svg`;
});
</script>
<template>

View File

@@ -3,7 +3,7 @@ import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
import { useLayout } from '@/layout/composables/layout';
import { useRouter } from 'vue-router';
const { layoutConfig, onMenuToggle } = useLayout();
const { layoutConfig, onMenuToggle, contextPath } = useLayout();
const outsideClickListener = ref(null);
const topbarMenuActive = ref(false);
@@ -18,7 +18,7 @@ onBeforeUnmount(() => {
});
const logoUrl = computed(() => {
return `layout/images/${layoutConfig.darkTheme.value ? 'logo-white' : 'logo-dark'}.svg`;
return `${contextPath}layout/images/${layoutConfig.darkTheme.value ? 'logo-white' : 'logo-dark'}.svg`;
});
const onTopBarMenuButton = () => {

View File

@@ -1,5 +1,7 @@
import { toRefs, reactive, computed } from 'vue';
const contextPath = import.meta.env.BASE_URL;
const layoutConfig = reactive({
ripple: false,
darkTheme: false,
@@ -19,17 +21,17 @@ const layoutState = reactive({
menuHoverActive: false
});
export function useLayout () {
export function useLayout() {
const changeThemeSettings = (theme, darkTheme) => {
layoutConfig.darkTheme = darkTheme;
layoutConfig.theme = theme;
};
const setScale = scale => {
const setScale = (scale) => {
layoutConfig.scale = scale;
};
const setActiveMenuItem = item => {
const setActiveMenuItem = (item) => {
layoutConfig.activeMenuItem = item.value || item;
};
@@ -49,5 +51,5 @@ export function useLayout () {
const isDarkTheme = computed(() => layoutConfig.darkTheme);
return { layoutConfig: toRefs(layoutConfig), layoutState: toRefs(layoutState), changeThemeSettings, setScale, onMenuToggle, isSidebarActive, isDarkTheme, setActiveMenuItem };
return { contextPath, layoutConfig: toRefs(layoutConfig), layoutState: toRefs(layoutState), changeThemeSettings, setScale, onMenuToggle, isSidebarActive, isDarkTheme, setActiveMenuItem };
}

View File

@@ -1,7 +1,8 @@
const contextPath = import.meta.env.BASE_URL;
export default class CountryService {
getCountries () {
return fetch('/demo/data/countries.json')
.then(res => res.json())
.then(d => d.data);
getCountries() {
return fetch(contextPath + 'demo/data/countries.json')
.then((res) => res.json())
.then((d) => d.data);
}
}

View File

@@ -1,32 +1,33 @@
const contextPath = import.meta.env.BASE_URL;
export default class CustomerService {
getCustomersSmall () {
return fetch('/demo/data/customers-small.json')
.then(res => res.json())
.then(d => d.data);
getCustomersSmall() {
return fetch(contextPath + 'demo/data/customers-small.json')
.then((res) => res.json())
.then((d) => d.data);
}
getCustomersMedium () {
return fetch('/demo/data/customers-medium.json')
.then(res => res.json())
.then(d => d.data);
getCustomersMedium() {
return fetch(contextPath + 'demo/data/customers-medium.json')
.then((res) => res.json())
.then((d) => d.data);
}
getCustomersLarge () {
return fetch('/demo/data/customers-large.json')
.then(res => res.json())
.then(d => d.data);
getCustomersLarge() {
return fetch(contextPath + 'demo/data/customers-large.json')
.then((res) => res.json())
.then((d) => d.data);
}
getCustomersXLarge () {
return fetch('/demo/data/customers-xlarge.json')
.then(res => res.json())
.then(d => d.data);
getCustomersXLarge() {
return fetch(contextPath + 'demo/data/customers-xlarge.json')
.then((res) => res.json())
.then((d) => d.data);
}
getCustomers (params) {
getCustomers(params) {
const queryParams = Object.keys(params)
.map(k => encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
.map((k) => encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
.join('&');
return fetch('https://www.primefaces.org//demo/data/customers?' + queryParams).then(res => res.json());
return fetch('https://www.primefaces.org//demo/data/customers?' + queryParams).then((res) => res.json());
}
}

View File

@@ -1,13 +1,14 @@
const contextPath = import.meta.env.BASE_URL;
export default class NodeService {
getTreeTableNodes () {
return fetch('/demo/data/treetablenodes.json')
.then(res => res.json())
.then(d => d.root);
getTreeTableNodes() {
return fetch(contextPath + 'demo/data/treetablenodes.json')
.then((res) => res.json())
.then((d) => d.root);
}
getTreeNodes () {
return fetch('/demo/data/treenodes.json')
.then(res => res.json())
.then(d => d.root);
getTreeNodes() {
return fetch(contextPath + 'demo/data/treenodes.json')
.then((res) => res.json())
.then((d) => d.root);
}
}

View File

@@ -1,7 +1,8 @@
const contextPath = import.meta.env.BASE_URL;
export default class PhotoService {
getImages () {
return fetch('/demo/data/photos.json')
.then(res => res.json())
.then(d => d.data);
getImages() {
return fetch(contextPath + 'demo/data/photos.json')
.then((res) => res.json())
.then((d) => d.data);
}
}

View File

@@ -1,19 +1,21 @@
const contextPath = import.meta.env.BASE_URL;
export default class ProductService {
getProductsSmall () {
return fetch('/demo/data/products-small.json')
.then(res => res.json())
.then(d => d.data);
getProductsSmall() {
return fetch(contextPath + 'demo/data/products-small.json')
.then((res) => res.json())
.then((d) => d.data);
}
getProducts () {
return fetch('/demo/data/products.json')
.then(res => res.json())
.then(d => d.data);
getProducts() {
return fetch(contextPath + 'demo/data/products.json')
.then((res) => res.json())
.then((d) => d.data);
}
getProductsWithOrdersSmall () {
return fetch('/demo/data/products-orders-small.json')
.then(res => res.json())
.then(d => d.data);
getProductsWithOrdersSmall() {
return fetch(contextPath + 'demo/data/products-orders-small.json')
.then((res) => res.json())
.then((d) => d.data);
}
}