sajjad
3 years ago
parent
20ba746f93
commit
a9f3257155
|
After Width: | Height: | Size: 36 KiB |
@ -0,0 +1,87 @@
|
|||||||
|
<template>
|
||||||
|
<div :class="{'isLoading':loading}">
|
||||||
|
<template v-if="loading">
|
||||||
|
<slot name="loading">
|
||||||
|
<we-loading />
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<template v-if="!loading">
|
||||||
|
<slot></slot>
|
||||||
|
</template>
|
||||||
|
<template v-if="!loading && items.length">
|
||||||
|
<slot
|
||||||
|
name="items"
|
||||||
|
:item="item"
|
||||||
|
v-for="(item, i) in items"
|
||||||
|
:index="i"
|
||||||
|
:itemNumber="pagination ? pagination.pageStart + i : i + 1"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-if="!items.length">
|
||||||
|
<slot name="items-container"> </slot>
|
||||||
|
</template>
|
||||||
|
<template v-if="!loading && !isFiltered && !items.length">
|
||||||
|
<slot name="no-items">
|
||||||
|
<no-items
|
||||||
|
src="/images/Global/Animated/Product.gif"
|
||||||
|
title=""
|
||||||
|
themeColor="product"
|
||||||
|
:hasBtn="false"
|
||||||
|
/>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<template v-if="!loading && isFiltered && !items.length">
|
||||||
|
<slot name="no-results">
|
||||||
|
<no-items
|
||||||
|
src="/images/Global/Animated/NoResult.gif"
|
||||||
|
textFa=" no items found! "
|
||||||
|
textEn=" Sorry, No Items Found! "
|
||||||
|
themeColor="product"
|
||||||
|
:hasBtn="false"
|
||||||
|
/>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<pagination
|
||||||
|
v-if="items.length && !loading && pagination"
|
||||||
|
:pagination="pagination"
|
||||||
|
@pagination="$emit('pagination', $event)"
|
||||||
|
></pagination>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Pagination from "@/components/Global/Pagination/Pagination.vue";
|
||||||
|
export default {
|
||||||
|
name: "data-iterator",
|
||||||
|
components: {
|
||||||
|
Pagination,
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
pagination: {
|
||||||
|
type: Object,
|
||||||
|
default: null,
|
||||||
|
},
|
||||||
|
items: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
loading: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
isFiltered: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.isLoading {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height : 100vh;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,45 @@
|
|||||||
|
<template>
|
||||||
|
<div class="loading-container">
|
||||||
|
<div class="loading">
|
||||||
|
<img :src="src" alt="loading" />
|
||||||
|
</div>
|
||||||
|
<div class="loading__title">{{ title }}</div>
|
||||||
|
<div class="loading__message">{{ message }}</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Idefault from '@/assets/Misterious_mist.gif'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
src: {
|
||||||
|
default: Idefault,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
default: " LOADING... ",
|
||||||
|
},
|
||||||
|
message: {
|
||||||
|
default: " thank you for your patience ",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.loading-container {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.loading__title,
|
||||||
|
.loading__message {
|
||||||
|
font-family: "Barlow-EL", sans-serif;
|
||||||
|
}
|
||||||
|
.loading__title {
|
||||||
|
letter-spacing: 2px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: 30px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.loading__message {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,62 @@
|
|||||||
|
<template>
|
||||||
|
<div class="we-no-result">
|
||||||
|
<!-- <img class="Thumbnail" :src="$_getPath(src, true)" />
|
||||||
|
<div class="Fa">{{ textFa }}</div>
|
||||||
|
<div class="En">{{ textEn }}</div>
|
||||||
|
<router-link v-if="hasBtn" :to="{ name: routeName }" class="flex lg6 xs12">
|
||||||
|
<v-btn
|
||||||
|
class="ma-2"
|
||||||
|
outlined
|
||||||
|
@click.native="emitClickEvent"
|
||||||
|
:color="$_color(themeColor)"
|
||||||
|
>
|
||||||
|
<v-icon left>WMi-{{ btnIcon }}</v-icon> {{ btnText }}
|
||||||
|
</v-btn>
|
||||||
|
</router-link> -->
|
||||||
|
<div class="text-center">There are no items to display</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
src: { default: "/images/Global/Animated/no-result-purple.gif" },
|
||||||
|
textFa: { default: " آیتمی برای نمایش وجود ندارد " },
|
||||||
|
textEn: { default: " NO ITEMS AVAILABLE " },
|
||||||
|
themeColor: { default: "black" },
|
||||||
|
btnText: { default: "ثبت اولین آیتم" },
|
||||||
|
btnIcon: { default: "cancel" },
|
||||||
|
modal: { default: null },
|
||||||
|
routeName: { default: null },
|
||||||
|
hasBtn: { default: true },
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
emitClickEvent(e) {
|
||||||
|
this.modal ? this.$_openModal(this.modal) : null;
|
||||||
|
this.$emit("button-clicked", e);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.we-no-result {
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.we-no-result img {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border-radius: 150px;
|
||||||
|
}
|
||||||
|
.we-no-result .Fa {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.we-no-result .En {
|
||||||
|
direction: ltr;
|
||||||
|
font-size: 12px;
|
||||||
|
letter-spacing: 5px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,3 +1,4 @@
|
|||||||
export default {
|
export default {
|
||||||
getProfile: state => state.profile
|
getProfile: state => state.profile,
|
||||||
|
getProfileLoading: state => state.loading,
|
||||||
}
|
}
|
||||||
@ -1,9 +1,15 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
export default {
|
export default {
|
||||||
|
// SET
|
||||||
SET_PROFILE(state, payload) {
|
SET_PROFILE(state, payload) {
|
||||||
Vue.set(state, 'profile', payload)
|
Vue.set(state, 'profile', payload)
|
||||||
},
|
},
|
||||||
|
// UPDATE
|
||||||
UPDATE_PROFILE(state, payload) {
|
UPDATE_PROFILE(state, payload) {
|
||||||
Vue.set(state, 'profile', payload)
|
Vue.set(state, 'profile', payload)
|
||||||
|
},
|
||||||
|
// LOADING
|
||||||
|
SET_LOADING_PROFILE(state, status) {
|
||||||
|
Vue.set(state, 'loading', status);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -1,3 +1,4 @@
|
|||||||
export default {
|
export default {
|
||||||
profile: {}
|
profile: {},
|
||||||
|
loading: false,
|
||||||
}
|
}
|
||||||
@ -1,4 +1,6 @@
|
|||||||
export default {
|
export default {
|
||||||
getProgramSeries: state => state.programSeries,
|
getProgramSeries: state => state.programSeries,
|
||||||
getCurrentSeriesId: state => state.currentSeriesId
|
getCurrentSeriesId: state => state.currentSeriesId,
|
||||||
|
isFilteredProgramSeries: state => state.isFiltered,
|
||||||
|
getProgramSeriesLoading: state => state.loading,
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,5 +1,7 @@
|
|||||||
export default {
|
export default {
|
||||||
programSeries: [],
|
programSeries: [],
|
||||||
// programSeries: {},
|
// programSeries: {},
|
||||||
currentSeriesId: null,
|
currentSeriesId: null,
|
||||||
|
isFiltered: false,
|
||||||
|
loading: false,
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
export default {
|
export default {
|
||||||
getWorkoutsToSeries: state => state.workoutsToSeries,
|
getWorkoutsToSeries: state => state.workoutsToSeries,
|
||||||
getWorkoutToSeries: state => state.workoutToSeries,
|
getWorkoutToSeries: state => state.workoutToSeries,
|
||||||
getWorkouts: state => state.workouts
|
getWorkouts: state => state.workouts,
|
||||||
|
getProgramSeriesWorkoutsLoading: state => state.loading,
|
||||||
}
|
}
|
||||||
Loading…
Reference in new issue