Fixed lint errors and code styles
parent
3e62c1b316
commit
83e789e1d5
|
@ -70,7 +70,7 @@
|
||||||
|
|
||||||
<div class="menu-category">Data</div>
|
<div class="menu-category">Data</div>
|
||||||
<div class="menu-items">
|
<div class="menu-items">
|
||||||
<router-link to="/datatable" v-slot="{ href, route, navigate, isActive }">
|
<router-link to="/datatable" v-slot="{isActive}">
|
||||||
<div>
|
<div>
|
||||||
<a tabindex="0" @click="toggleSubmenu($event, 'datatable')">DataTable</a>
|
<a tabindex="0" @click="toggleSubmenu($event, 'datatable')">DataTable</a>
|
||||||
<transition name="p-toggleable-content">
|
<transition name="p-toggleable-content">
|
||||||
|
@ -115,7 +115,7 @@
|
||||||
<router-link to="/organizationchart">OrganizationChart</router-link>
|
<router-link to="/organizationchart">OrganizationChart</router-link>
|
||||||
<router-link to="/paginator">Paginator</router-link>
|
<router-link to="/paginator">Paginator</router-link>
|
||||||
<router-link to="/picklist">PickList</router-link>
|
<router-link to="/picklist">PickList</router-link>
|
||||||
<router-link to="/tree" v-slot="{ href, route, navigate, isActive }">
|
<router-link to="/tree" v-slot="{isActive}">
|
||||||
<div>
|
<div>
|
||||||
<a tabindex="0" @click="toggleSubmenu($event, 'tree')">Tree</a>
|
<a tabindex="0" @click="toggleSubmenu($event, 'tree')">Tree</a>
|
||||||
<transition name="p-toggleable-content">
|
<transition name="p-toggleable-content">
|
||||||
|
@ -131,7 +131,7 @@
|
||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
</router-link>
|
</router-link>
|
||||||
<router-link to="/treetable" v-slot="{ href, route, navigate, isActive }">
|
<router-link to="/treetable" v-slot="{isActive}">
|
||||||
<div>
|
<div>
|
||||||
<a tabindex="0" @click="toggleSubmenu($event, 'treetable')">TreeTable</a>
|
<a tabindex="0" @click="toggleSubmenu($event, 'treetable')">TreeTable</a>
|
||||||
<transition name="p-toggleable-content">
|
<transition name="p-toggleable-content">
|
||||||
|
@ -215,7 +215,7 @@
|
||||||
<div class="menu-category">Media</div>
|
<div class="menu-category">Media</div>
|
||||||
<div class="menu-items">
|
<div class="menu-items">
|
||||||
<router-link to="/carousel">Carousel</router-link>
|
<router-link to="/carousel">Carousel</router-link>
|
||||||
<router-link to="/galleria" v-slot="{ href, route, navigate, isActive }">
|
<router-link to="/galleria" v-slot="{isActive}">
|
||||||
<div>
|
<div>
|
||||||
<a tabindex="0" @click="toggleSubmenu($event, 'galleria')">Galleria</a>
|
<a tabindex="0" @click="toggleSubmenu($event, 'galleria')">Galleria</a>
|
||||||
<transition name="p-toggleable-content">
|
<transition name="p-toggleable-content">
|
||||||
|
@ -270,8 +270,8 @@ export default {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
},
|
},
|
||||||
isSubmenuActive(name, routerIsActive) {
|
isSubmenuActive(name, routerIsActive) {
|
||||||
if (this.activeSubmenus.hasOwnProperty(name)) {
|
if (this.activeSubmenus[name]) {
|
||||||
return this.activeSubmenus[name];
|
return true;
|
||||||
}
|
}
|
||||||
else if (routerIsActive) {
|
else if (routerIsActive) {
|
||||||
this.activeSubmenus[name] = true;
|
this.activeSubmenus[name] = true;
|
||||||
|
|
|
@ -335,7 +335,8 @@ export default {
|
||||||
`;
|
`;
|
||||||
|
|
||||||
if (this.responsiveOptions) {
|
if (this.responsiveOptions) {
|
||||||
this.responsiveOptions.sort((data1, data2) => {
|
let _responsiveOptions = {...this.responsiveOptions};
|
||||||
|
_responsiveOptions.sort((data1, data2) => {
|
||||||
const value1 = data1.breakpoint;
|
const value1 = data1.breakpoint;
|
||||||
const value2 = data2.breakpoint;
|
const value2 = data2.breakpoint;
|
||||||
let result = null;
|
let result = null;
|
||||||
|
@ -354,8 +355,8 @@ export default {
|
||||||
return -1 * result;
|
return -1 * result;
|
||||||
});
|
});
|
||||||
|
|
||||||
for (let i = 0; i < this.responsiveOptions.length; i++) {
|
for (let i = 0; i < _responsiveOptions.length; i++) {
|
||||||
let res = this.responsiveOptions[i];
|
let res = _responsiveOptions[i];
|
||||||
|
|
||||||
innerHTML += `
|
innerHTML += `
|
||||||
@media screen and (max-width: ${res.breakpoint}) {
|
@media screen and (max-width: ${res.breakpoint}) {
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<div v-if="fullScreen && (maskVisible || visible)" ref="mask" :class="maskContentClass">
|
<div v-if="fullScreen && (maskVisible || visible)" ref="mask" :class="maskContentClass">
|
||||||
<transition name="p-galleria" @enter="onEnter" @before-leave="onBeforeLeave" @after-leave="onAfterLeave" @appear="onAppear">
|
<transition name="p-galleria" @enter="onEnter" @before-leave="onBeforeLeave" @after-leave="onAfterLeave" @appear="onAppear">
|
||||||
<GalleriaContent v-if="visible" v-bind="$props" @maskHide="maskHide" :templates="$scopedSlots" @activeItemChange="onActiveItemChange" />
|
<GalleriaContent v-if="visible" v-bind="$props" @mask-hide="maskHide" :templates="$scopedSlots" @activeitem-change="onActiveItemChange" />
|
||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<GalleriaContent v-else-if="!fullScreen" v-bind="$props" :templates="$scopedSlots" @activeItemChange="onActiveItemChange" />
|
<GalleriaContent v-else-if="!fullScreen" v-bind="$props" :templates="$scopedSlots" @activeitem-change="onActiveItemChange" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div :id="id" v-if="$attrs.value && $attrs.value.length > 0" :class="galleriaClass" :style="$attrs.containerStyle">
|
<div :id="id" v-if="$attrs.value && $attrs.value.length > 0" :class="galleriaClass" :style="$attrs.containerStyle">
|
||||||
<button v-if="$attrs.fullScreen" type="button" class="p-galleria-close p-link" @click="$emit('maskHide')" v-ripple>
|
<button v-if="$attrs.fullScreen" type="button" class="p-galleria-close p-link" @click="$emit('mask-hide')" v-ripple>
|
||||||
<span class="p-galleria-close-icon pi pi-times"></span>
|
<span class="p-galleria-close-icon pi pi-times"></span>
|
||||||
</button>
|
</button>
|
||||||
<div v-if="$attrs.templates && $attrs.templates['header']" class="p-galleria-header">
|
<div v-if="$attrs.templates && $attrs.templates['header']" class="p-galleria-header">
|
||||||
|
@ -10,12 +10,12 @@
|
||||||
<GalleriaItem :value="$attrs.value" :activeIndex.sync="activeIndex" :circular="$attrs.circular" :templates="$attrs.templates"
|
<GalleriaItem :value="$attrs.value" :activeIndex.sync="activeIndex" :circular="$attrs.circular" :templates="$attrs.templates"
|
||||||
:showIndicators="$attrs.showIndicators" :changeItemOnIndicatorHover="$attrs.changeItemOnIndicatorHover"
|
:showIndicators="$attrs.showIndicators" :changeItemOnIndicatorHover="$attrs.changeItemOnIndicatorHover"
|
||||||
:showItemNavigators="$attrs.showItemNavigators" :autoPlay="$attrs.autoPlay" :slideShowActive.sync="slideShowActive"
|
:showItemNavigators="$attrs.showItemNavigators" :autoPlay="$attrs.autoPlay" :slideShowActive.sync="slideShowActive"
|
||||||
@startSlideShow="startSlideShow" @stopSlideShow="stopSlideShow" />
|
@start-slideshow="startSlideShow" @stop-slideshow="stopSlideShow" />
|
||||||
|
|
||||||
<GalleriaThumbnails v-if="$attrs.showThumbnails" :containerId="id" :value="$attrs.value" :activeIndex.sync="activeIndex" :templates="$attrs.templates"
|
<GalleriaThumbnails v-if="$attrs.showThumbnails" :containerId="id" :value="$attrs.value" :activeIndex.sync="activeIndex" :templates="$attrs.templates"
|
||||||
:numVisible="$attrs.numVisible" :responsiveOptions="$attrs.responsiveOptions" :circular="$attrs.circular"
|
:numVisible="$attrs.numVisible" :responsiveOptions="$attrs.responsiveOptions" :circular="$attrs.circular"
|
||||||
:isVertical="isVertical()" :contentHeight="$attrs.verticalThumbnailViewPortHeight" :showThumbnailNavigators="$attrs.showThumbnailNavigators"
|
:isVertical="isVertical()" :contentHeight="$attrs.verticalThumbnailViewPortHeight" :showThumbnailNavigators="$attrs.showThumbnailNavigators"
|
||||||
:slideShowActive.sync="slideShowActive" @stopSlideShow="stopSlideShow" />
|
:slideShowActive.sync="slideShowActive" @stop-slideshow="stopSlideShow" />
|
||||||
</div>
|
</div>
|
||||||
<div v-if="$attrs.templates && $attrs.templates['footer']" class="p-galleria-footer">
|
<div v-if="$attrs.templates && $attrs.templates['footer']" class="p-galleria-footer">
|
||||||
<GalleriaItemSlot type="footer" :templates="$attrs.templates"/>
|
<GalleriaItemSlot type="footer" :templates="$attrs.templates"/>
|
||||||
|
@ -46,7 +46,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
updated() {
|
updated() {
|
||||||
this.$emit('activeItemChange', this.activeIndex);
|
this.$emit('activeitem-change', this.activeIndex);
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
if (this.slideShowActive) {
|
if (this.slideShowActive) {
|
||||||
|
|
|
@ -70,7 +70,7 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (this.autoPlay) {
|
if (this.autoPlay) {
|
||||||
this.$emit('startSlideShow');
|
this.$emit('start-slideshow');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
@ -92,7 +92,7 @@ export default {
|
||||||
},
|
},
|
||||||
stopSlideShow() {
|
stopSlideShow() {
|
||||||
if (this.slideShowActive && this.stopSlideShow) {
|
if (this.slideShowActive && this.stopSlideShow) {
|
||||||
this.$emit('stopSlideShow');
|
this.$emit('stop-slideshow');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
navBackward(e) {
|
navBackward(e) {
|
||||||
|
|
|
@ -179,7 +179,7 @@ export default {
|
||||||
},
|
},
|
||||||
stopSlideShow() {
|
stopSlideShow() {
|
||||||
if (this.slideShowActive && this.stopSlideShow) {
|
if (this.slideShowActive && this.stopSlideShow) {
|
||||||
this.$emit('stopSlideShow');
|
this.$emit('stop-slideshow');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getMedianItemIndex() {
|
getMedianItemIndex() {
|
||||||
|
|
Loading…
Reference in New Issue