Client - register globally some custom components

This commit is contained in:
Sam 2021-10-23 15:29:39 +02:00
parent 8d93024a5f
commit d78470062d
21 changed files with 26 additions and 70 deletions

View File

@ -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,
},

View File

@ -18,7 +18,7 @@
import { defineComponent, ref, watch } from 'vue'
export default defineComponent({
name: 'CustomTextarea',
name: 'CustomTextArea',
props: {
charLimit: {
type: Number,

View File

@ -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,

View File

@ -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: {

View File

@ -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: {

View File

@ -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'],

View File

@ -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: {

View File

@ -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>,

View File

@ -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: {

View File

@ -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>,

View File

@ -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,

View File

@ -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,

View File

@ -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: {

View File

@ -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,

View File

@ -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>,

View File

@ -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,

View File

@ -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[]>,

View 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,
]

View File

@ -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')

View File

@ -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,

View File

@ -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,
},