Client - register globally some custom components
This commit is contained in:
parent
8d93024a5f
commit
d78470062d
@ -47,7 +47,6 @@
|
||||
onMounted,
|
||||
} from 'vue'
|
||||
|
||||
import Loader from '@/components/Common/Loader.vue'
|
||||
import Footer from '@/components/Footer.vue'
|
||||
import NavBar from '@/components/NavBar.vue'
|
||||
import NoConfig from '@/components/NoConfig.vue'
|
||||
@ -74,7 +73,6 @@
|
||||
name: 'App',
|
||||
components: {
|
||||
Footer,
|
||||
Loader,
|
||||
NavBar,
|
||||
NoConfig,
|
||||
},
|
||||
|
@ -18,7 +18,7 @@
|
||||
import { defineComponent, ref, watch } from 'vue'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CustomTextarea',
|
||||
name: 'CustomTextArea',
|
||||
props: {
|
||||
charLimit: {
|
||||
type: Number,
|
||||
|
@ -25,17 +25,11 @@
|
||||
<script lang="ts">
|
||||
import { ComputedRef, computed, defineComponent, onUnmounted } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import { ROOT_STORE } from '@/store/constants'
|
||||
import { useStore } from '@/use/useStore'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Modal',
|
||||
components: {
|
||||
Card,
|
||||
ErrorMessage,
|
||||
},
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
|
@ -19,7 +19,6 @@
|
||||
import { endOfMonth, startOfMonth } from 'date-fns'
|
||||
import { PropType, defineComponent } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import StatChart from '@/components/Common/StatsChart/index.vue'
|
||||
import { ISport } from '@/types/sports'
|
||||
import { IAuthUserProfile } from '@/types/user'
|
||||
@ -27,7 +26,6 @@
|
||||
export default defineComponent({
|
||||
name: 'UserMonthStats',
|
||||
components: {
|
||||
Card,
|
||||
StatChart,
|
||||
},
|
||||
props: {
|
||||
|
@ -30,14 +30,12 @@
|
||||
import { PropType, defineComponent } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import SportImage from '@/components/Common/Images/SportImage/index.vue'
|
||||
import { IRecord } from '@/types/workouts'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'RecordsCard',
|
||||
components: {
|
||||
Card,
|
||||
SportImage,
|
||||
},
|
||||
props: {
|
||||
|
@ -77,7 +77,6 @@
|
||||
import { ComputedRef, computed, defineComponent, ref } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import Dropdown from '@/components/Common/Dropdown.vue'
|
||||
import UserPicture from '@/components/User/UserPicture.vue'
|
||||
import { ROOT_STORE, USER_STORE } from '@/store/constants'
|
||||
import { IDropdownOption } from '@/types/forms'
|
||||
@ -88,7 +87,6 @@
|
||||
export default defineComponent({
|
||||
name: 'NavBar',
|
||||
components: {
|
||||
Dropdown,
|
||||
UserPicture,
|
||||
},
|
||||
emits: ['menuInteraction'],
|
||||
|
@ -12,13 +12,11 @@
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import UserAuthForm from '@/components/User/UserAuthForm.vue'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'PasswordResetForm',
|
||||
components: {
|
||||
Card,
|
||||
UserAuthForm,
|
||||
},
|
||||
props: {
|
||||
|
@ -106,20 +106,12 @@
|
||||
onMounted,
|
||||
} from 'vue'
|
||||
|
||||
import CustomTextArea from '@/components/Common/CustomTextArea.vue'
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import Modal from '@/components/Common/Modal.vue'
|
||||
import { ROOT_STORE, USER_STORE } from '@/store/constants'
|
||||
import { IAuthUserProfile, IUserPayload } from '@/types/user'
|
||||
import { useStore } from '@/use/useStore'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'UserInfosEdition',
|
||||
components: {
|
||||
CustomTextArea,
|
||||
ErrorMessage,
|
||||
Modal,
|
||||
},
|
||||
props: {
|
||||
user: {
|
||||
type: Object as PropType<IAuthUserProfile>,
|
||||
|
@ -37,7 +37,6 @@
|
||||
ref,
|
||||
} from 'vue'
|
||||
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import UserPicture from '@/components/User/UserPicture.vue'
|
||||
import { ROOT_STORE, USER_STORE } from '@/store/constants'
|
||||
import { IAppConfig } from '@/types/application'
|
||||
@ -48,7 +47,6 @@
|
||||
export default defineComponent({
|
||||
name: 'UserPictureEdition',
|
||||
components: {
|
||||
ErrorMessage,
|
||||
UserPicture,
|
||||
},
|
||||
props: {
|
||||
|
@ -59,16 +59,12 @@
|
||||
} from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import { ROOT_STORE, USER_STORE } from '@/store/constants'
|
||||
import { IAuthUserProfile, IUserPreferencesPayload } from '@/types/user'
|
||||
import { useStore } from '@/use/useStore'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'UserPreferencesEdition',
|
||||
components: {
|
||||
ErrorMessage,
|
||||
},
|
||||
props: {
|
||||
user: {
|
||||
type: Object as PropType<IAuthUserProfile>,
|
||||
|
@ -20,7 +20,6 @@
|
||||
<script lang="ts">
|
||||
import { PropType, computed, defineComponent, ref } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import UserInfosEdition from '@/components/User/ProfileEdition/UserInfosEdition.vue'
|
||||
import UserPictureEdition from '@/components/User/ProfileEdition/UserPictureEdition.vue'
|
||||
import UserPreferencesEdition from '@/components/User/ProfileEdition/UserPreferencesEdition.vue'
|
||||
@ -32,7 +31,6 @@
|
||||
export default defineComponent({
|
||||
name: 'ProfileEdition',
|
||||
components: {
|
||||
Card,
|
||||
UserInfosEdition,
|
||||
UserPictureEdition,
|
||||
UserPreferencesEdition,
|
||||
|
@ -80,8 +80,6 @@
|
||||
import { ComputedRef, computed, defineComponent, reactive, watch } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
import AlertMessage from '@/components/Common/AlertMessage.vue'
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import { ROOT_STORE, USER_STORE } from '@/store/constants'
|
||||
import { IAppConfig } from '@/types/application'
|
||||
import { ILoginRegisterFormData } from '@/types/user'
|
||||
@ -89,10 +87,6 @@
|
||||
|
||||
export default defineComponent({
|
||||
name: 'UserAuthForm',
|
||||
components: {
|
||||
AlertMessage,
|
||||
ErrorMessage,
|
||||
},
|
||||
props: {
|
||||
action: {
|
||||
type: String,
|
||||
|
@ -42,7 +42,6 @@
|
||||
import { LineChart, useLineChart } from 'vue-chart-3'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import { IAuthUserProfile } from '@/types/user'
|
||||
import {
|
||||
IWorkoutChartData,
|
||||
@ -54,7 +53,6 @@
|
||||
export default defineComponent({
|
||||
name: 'WorkoutChart',
|
||||
components: {
|
||||
Card,
|
||||
LineChart,
|
||||
},
|
||||
props: {
|
||||
|
@ -38,8 +38,6 @@
|
||||
} from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import Modal from '@/components/Common/Modal.vue'
|
||||
import WorkoutCardTitle from '@/components/Workout/WorkoutDetail/WorkoutCardTitle.vue'
|
||||
import WorkoutData from '@/components/Workout/WorkoutDetail/WorkoutData.vue'
|
||||
import WorkoutMap from '@/components/Workout/WorkoutDetail/WorkoutMap.vue'
|
||||
@ -59,8 +57,6 @@
|
||||
export default defineComponent({
|
||||
name: 'WorkoutDetail',
|
||||
components: {
|
||||
Card,
|
||||
Modal,
|
||||
WorkoutCardTitle,
|
||||
WorkoutData,
|
||||
WorkoutMap,
|
||||
|
@ -219,10 +219,6 @@
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import CustomTextArea from '@/components/Common/CustomTextArea.vue'
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import Loader from '@/components/Common/Loader.vue'
|
||||
import { ROOT_STORE, WORKOUTS_STORE } from '@/store/constants'
|
||||
import { IAppConfig } from '@/types/application'
|
||||
import { ISport } from '@/types/sports'
|
||||
@ -235,12 +231,6 @@
|
||||
|
||||
export default defineComponent({
|
||||
name: 'WorkoutEdition',
|
||||
components: {
|
||||
Card,
|
||||
CustomTextArea,
|
||||
ErrorMessage,
|
||||
Loader,
|
||||
},
|
||||
props: {
|
||||
authUser: {
|
||||
type: Object as PropType<IAuthUserProfile>,
|
||||
|
@ -12,13 +12,8 @@
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'WorkoutNotes',
|
||||
components: {
|
||||
Card,
|
||||
},
|
||||
props: {
|
||||
notes: {
|
||||
type: String,
|
||||
|
@ -27,14 +27,10 @@
|
||||
<script lang="ts">
|
||||
import { PropType, defineComponent } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import { IWorkoutSegment } from '@/types/workouts'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'WorkoutSegments',
|
||||
components: {
|
||||
Card,
|
||||
},
|
||||
props: {
|
||||
segments: {
|
||||
type: Object as PropType<IWorkoutSegment[]>,
|
||||
|
17
fittrackee_client/src/custom-components.ts
Normal file
17
fittrackee_client/src/custom-components.ts
Normal file
@ -0,0 +1,17 @@
|
||||
import AlertMessage from '@/components/Common/AlertMessage.vue'
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import CustomTextArea from '@/components/Common/CustomTextArea.vue'
|
||||
import Dropdown from '@/components/Common/Dropdown.vue'
|
||||
import ErrorMessage from '@/components/Common/ErrorMessage.vue'
|
||||
import Loader from '@/components/Common/Loader.vue'
|
||||
import Modal from '@/components/Common/Modal.vue'
|
||||
|
||||
export const customComponents = [
|
||||
AlertMessage,
|
||||
Card,
|
||||
CustomTextArea,
|
||||
Dropdown,
|
||||
ErrorMessage,
|
||||
Loader,
|
||||
Modal,
|
||||
]
|
@ -6,11 +6,17 @@ import i18n from './i18n'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
|
||||
import { customComponents } from '@/custom-components'
|
||||
import { clickOutsideDirective } from '@/directives'
|
||||
|
||||
createApp(App)
|
||||
const app = createApp(App)
|
||||
.use(i18n)
|
||||
.use(store)
|
||||
.use(router)
|
||||
.directive('click-outside', clickOutsideDirective)
|
||||
.mount('#app')
|
||||
|
||||
customComponents.forEach((component) => {
|
||||
app.component(component.name, component)
|
||||
})
|
||||
|
||||
app.mount('#app')
|
||||
|
@ -78,7 +78,6 @@
|
||||
onUnmounted,
|
||||
} from 'vue'
|
||||
|
||||
import Loader from '@/components/Common/Loader.vue'
|
||||
import Timeline from '@/components/Dashboard/Timeline.vue'
|
||||
import UserCalendar from '@/components/Dashboard/UserCalendar/index.vue'
|
||||
import UserMonthStats from '@/components/Dashboard/UserMonthStats.vue'
|
||||
@ -92,7 +91,6 @@
|
||||
export default defineComponent({
|
||||
name: 'Dashboard',
|
||||
components: {
|
||||
Loader,
|
||||
Timeline,
|
||||
UserCalendar,
|
||||
UserMonthStats,
|
||||
|
@ -19,7 +19,6 @@
|
||||
<script lang="ts">
|
||||
import { ComputedRef, computed, defineComponent } from 'vue'
|
||||
|
||||
import Card from '@/components/Common/Card.vue'
|
||||
import Statistics from '@/components/Statistics/index.vue'
|
||||
import NoWorkouts from '@/components/Workouts/NoWorkouts.vue'
|
||||
import { USER_STORE, SPORTS_STORE } from '@/store/constants'
|
||||
@ -30,7 +29,6 @@
|
||||
export default defineComponent({
|
||||
name: 'StatisticsView',
|
||||
components: {
|
||||
Card,
|
||||
NoWorkouts,
|
||||
Statistics,
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user