hamlab/mobilizon-frontend
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Merge branch 'fixes' into 'main'

Browse Source 
Fixes

See merge request framasoft/mobilizon!1285
This commit is contained in:
Thomas Citharel
2022-10-11 12:35:05 +00:00
parent 3e8d5884a2 e94a537f30
commit 8eddb8b230
19 changed files with 536 additions and 450 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
js/src/assets/oruga-tailwindcss.css
View File

@@ -16,6 +16,15 @@ body {
.btn-outlined-primary {
@apply bg-transparent text-black dark:text-white font-semibold py-2 px-4 border border-mbz-bluegreen dark:border-violet-3;
}
.btn-outlined-success {
@apply border-mbz-success;
}
.btn-outlined-danger {
@apply border-mbz-danger;
}
.btn-outlined-warning {
@apply border-mbz-warning;
}
.btn-outlined-:hover,
.btn-outlined-primary:hover {
@apply font-bold py-2 px-4 bg-mbz-bluegreen dark:bg-violet-3 text-white rounded;
@@ -32,6 +41,9 @@ body {
.btn-success {
@apply bg-mbz-success;
}
.btn-warning {
@apply bg-mbz-warning text-black hover:bg-mbz-warning/90 hover:text-slate-800;
}
.btn-text {
@apply bg-transparent border-transparent text-black dark:text-white font-normal underline hover:bg-zinc-200 hover:text-black;
}
@@ -171,7 +183,7 @@ body {
/* Select */
.select {
@apply dark:bg-zinc-600 dark:placeholder:text-zinc-400 dark:text-zinc-50 rounded pl-2 pr-6 border-2 border-transparent h-10 shadow-none;
@apply dark:bg-zinc-600 dark:placeholder:text-zinc-400 dark:text-zinc-50 rounded pl-2 pr-6 border-2 border-transparent h-10 shadow-none border rounded;
}
/* Radio */
@@ -278,3 +290,35 @@ button.menubar__button {
.menubar__button {
@apply hover:bg-[rgba(0,0,0,.05)];
}
/** Datepicker */
.o-drop__menu--active {
@apply z-50;
}
.o-dpck__box {
@apply px-4 py-1;
}
.o-dpck__header {
@apply pb-2 mb-2;
border-bottom: 1px solid #dbdbdb;
}
.o-dpck__header__next,
.o-dpck__header__previous {
@apply justify-center text-center no-underline cursor-pointer items-center shadow-none inline-flex relative select-none leading-6 border rounded h-10 p-2 m-1;
min-width: 2.25em;
}
.o-dpck__header__list {
@apply order-2 items-center flex justify-center text-center list-none flex-wrap my-0 p-0 -mx-0.5;
}
.o-dpck__header__list > * {
@apply mx-0.5;
}
.o-dpck__month__cell,
.o-dpck__table__cell {
@apply rounded py-2 px-3;
}
.o-dpck__month__head-cell,
.o-dpck__table__head-cell {
@apply font-semibold;
}

14
js/src/components/Event/EventMetadataItem.vue
View File

@@ -53,7 +53,7 @@
:pattern="
modelValue.pattern ? modelValue.pattern.source : undefined
"
:validation-message="$t(`This URL doesn't seem to be valid`)"
:validation-message="t(`This URL doesn't seem to be valid`)"
required
v-model="metadataItemValue"
:placeholder="modelValue.placeholder"
@@ -78,10 +78,11 @@
</o-checkbox>
</o-field>
</div>
<o-button
icon-left="close"
@click="$emit('removeItem', modelValue.key)"
/>
<o-button icon-left="close" @click="$emit('removeItem', modelValue.key)">
<span class="sr-only">
{{ t("Remove") }}
</span>
</o-button>
</div>
</div>
</template>
@@ -89,6 +90,7 @@
import { EventMetadataKeyType, EventMetadataType } from "@/types/enums";
import { IEventMetadataDescription } from "@/types/event-metadata";
import { computed, ref } from "vue";
import { useI18n } from "vue-i18n";
const props = defineProps<{
modelValue: IEventMetadataDescription;
@@ -96,6 +98,8 @@ const props = defineProps<{
const emit = defineEmits(["update:modelValue", "removeItem"]);
const { t } = useI18n({ useScope: "global" });
const urlInput = ref<any>(null);
const metadataItemValue = computed({

1
js/src/components/Event/FullAddressAutoComplete.vue
View File

@@ -116,7 +116,6 @@ import {
IAddress,
addressFullName,
addressToPoiInfos,
IPoiInfo,
} from "../../types/address.model";
import AddressInfo from "../../components/Address/AddressInfo.vue";
import { computed, ref, watch, defineAsyncComponent } from "vue";

4
js/src/components/LeafletMap.vue
View File

@@ -141,10 +141,6 @@ const mountLocateControl = () => {
icon.setAttribute("aria-hidden", "true");
icon.setAttribute("role", "img");
icon.insertAdjacentHTML("beforeend", locationIconHTML.value);
console.log("icon for location", {
link,
icon,
});
return { link, icon };
},
...props.options,

1
js/src/components/Local/CloseEvents.vue
View File

@@ -94,7 +94,6 @@ const distance = computed<number>(() => (suggestGeoloc.value ? 150 : 25));
const now = computed(() => roundToNearestMinute(new Date()));
const searchEnabled = computed(() => geoHash.value != undefined);
const enabled = ref(false);
const {
result: eventsResult,

7
js/src/components/Search/EventMarkerMap.vue
View File

@@ -162,13 +162,6 @@ onMounted(async () => {
myBottomSheet.value.close();
}
});
// mapElement.value.on('load', function () {
// console.log('load event')
// setTimeout(() => {
// console.log('invalidate size')
// mapElement.value.invalidateSize()
// }, 1000)
// })
markers.value = new MarkerClusterGroup({ chunkedLoading: true });
mapElement.value.on("zoom", debounce(update, 1000));

2
js/src/components/core/CustomDialog.vue
View File

@@ -112,7 +112,7 @@ const iconByType = computed(() => {
* Call the onConfirm prop (function) and close the Dialog.
*/
const confirm = () => {
console.log("dialog confirmed", input.value.$el);
console.debug("dialog confirmed", input.value?.$el);
if (input.value !== undefined) {
const inputElement = input.value.$el.querySelector("input");
if (!inputElement.checkValidity()) {

19
js/src/components/core/MaterialIcon.vue
View File

@@ -1,5 +1,9 @@
<template>
<component :is="componentInstance" :size="realSize" />
<component
:is="componentInstance"
v-if="componentInstance"
:size="realSize"
/>
</template>
<script lang="ts" setup>
import { computed, defineAsyncComponent } from "vue";
@@ -234,6 +238,8 @@ const icons: Record<string, () => Promise<any>> = {
import(`../../../node_modules/vue-material-design-icons/CheckCircle.vue`),
ViewList: () =>
import(`../../../node_modules/vue-material-design-icons/ViewList.vue`),
SmokingOff: () =>
import(`../../../node_modules/vue-material-design-icons/SmokingOff.vue`),
};
const props = withDefaults(
@@ -247,9 +253,14 @@ const props = withDefaults(
const name = computed(() => toPascalCase(props.icon[1]));
const componentInstance = computed(() =>
defineAsyncComponent(icons[name.value])
);
const componentInstance = computed(() => {
if (Object.prototype.hasOwnProperty.call(icons, name.value)) {
return defineAsyncComponent(icons[name.value]);
} else {
console.error("Icon is undefined", name.value);
return undefined;
}
});
const realSize = computed(() => Number.parseInt(props.size ?? "18"));

132
js/src/views/Event/EditView.vue
View File

@@ -10,7 +10,6 @@
<form ref="form">
<h2>{{ t("General information") }}</h2>
<picture-upload
v-if="pictureFile"
v-model:modelValue="pictureFile"
:textFallback="t('Headline picture')"
:defaultImage="event.picture"
@@ -36,12 +35,13 @@
<o-field
v-if="eventCategories"
:label="t('Category')"
label-for="category"
label-for="categoryField"
class="w-full md:max-w-fit"
>
<o-select
:placeholder="t('Select a category')"
v-model="event.category"
id="categoryField"
expanded
>
<option
@@ -339,10 +339,15 @@
)
}}
</legend>
<o-field class="event__status__field">
<o-field class="radio-buttons">
<o-radio
v-model="event.status"
name="status"
class="mr-2 p-2 rounded border"
:class="{
'btn-warning': event.status === EventStatus.TENTATIVE,
'btn-outlined-warning': event.status !== EventStatus.TENTATIVE,
}"
variant="warning"
:native-value="EventStatus.TENTATIVE"
>
@@ -353,6 +358,11 @@
v-model="event.status"
name="status"
variant="success"
class="mr-2 p-2 rounded border"
:class="{
'btn-success': event.status === EventStatus.CONFIRMED,
'btn-outlined-success': event.status !== EventStatus.CONFIRMED,
}"
:native-value="EventStatus.CONFIRMED"
>
<o-icon icon="calendar-check" />
@@ -361,6 +371,11 @@
<o-radio
v-model="event.status"
name="status"
class="p-2 rounded border"
:class="{
'btn-danger': event.status === EventStatus.CANCELLED,
'btn-outlined-danger': event.status !== EventStatus.CANCELLED,
}"
variant="danger"
:native-value="EventStatus.CANCELLED"
>
@@ -490,105 +505,6 @@
</nav>
</template>
<style lang="scss" scoped>
// @use "@/styles/_mixins" as *;
// main section > .container {
// form {
// h2 {
// margin: 15px 0 7.5px;
// }
// legend {
// margin-bottom: 0.75rem;
// }
// }
// }
// .save__navbar {
// :deep(.navbar-menu),
// .navbar-end {
// flex-wrap: wrap;
// }
// }
// @media screen and (max-width: 768px) {
// .navbar.is-fixed-bottom {
// position: initial;
// }
// }
// h2.subtitle {
// margin: 10px 0;
// span {
// padding: 5px 7px;
// display: inline;
// }
// }
// .event__status__field {
// :deep(.field.has-addons) {
// display: flex;
// flex-wrap: wrap;
// justify-content: flex-start;
// }
// }
// .datepicker {
// :deep(.dropdown-menu) {
// z-index: 200;
// }
// }
// section {
// .begins-on-field {
// margin-top: 22px;
// }
// nav.navbar {
// min-height: 2rem !important;
// .container {
// min-height: 2rem;
// .navbar-menu,
// .navbar-end {
// display: flex !important;
// }
// .navbar-end {
// justify-content: flex-end;
// @include margin-left(auto);
// }
// }
// }
// }
// .address {
// :deep(.address-autocomplete) {
// margin-bottom: 0 !important;
// }
// .is-online {
// margin-bottom: 10px;
// }
// }
</style>
<style lang="scss">
// .dialog .modal-card {
// max-width: 500px;
// .modal-card-foot {
// justify-content: center;
// flex-wrap: wrap;
// & > button {
// margin-bottom: 5px;
// }
// }
// }
</style>
<script lang="ts" setup>
import { getTimezoneOffset } from "date-fns-tz";
import PictureUpload from "@/components/PictureUpload.vue";
@@ -1416,3 +1332,15 @@ watch(group, () => {
}
});
</script>
<style lang="scss">
.radio-buttons input[type="radio"] {
& {
display: none;
}
& + span.radio-label {
padding-left: 3px;
}
}
</style>

4
js/src/views/Event/EventView.vue
View File

@@ -837,7 +837,7 @@ const openDeleteEventModal = () => {
pattern: escapeRegExp(event.value?.title ?? ""),
},
onConfirm: (result: string) => {
console.log("calling delete event", result);
console.debug("calling delete event", result);
if (result.trim() === event.value?.title) {
event.value?.id ? deleteEvent({ eventId: event.value?.id }) : null;
}
@@ -1008,7 +1008,7 @@ const confirmLeave = (): void => {
hasIcon: true,
onConfirm: () => {
if (event.value && currentActor.value?.id) {
console.log("calling leave event");
console.debug("calling leave event");
leaveEvent(event.value, currentActor.value.id);
}
},

10
js/src/views/Settings/PreferencesView.vue
View File

@@ -112,11 +112,7 @@
</template>
<script lang="ts" setup>
import ngeohash from "ngeohash";
import {
USER_SETTINGS,
SET_USER_SETTINGS,
UPDATE_USER_LOCALE,
} from "../../graphql/user";
import { USER_SETTINGS, SET_USER_SETTINGS } from "../../graphql/user";
import langs from "../../i18n/langs.json";
import RouteName from "../../router/name";
import { AddressSearchType } from "@/types/enums";
@@ -136,7 +132,7 @@ const { timezones: serverTimezones, loading: loadingTimezones } =
useTimezones();
const { loggedUser, loading: loadingUserSettings } = useUserSettings();
const { t, locale } = useI18n({ useScope: "global" });
const { t } = useI18n({ useScope: "global" });
useHead({
title: computed(() => t("Preferences")),
@@ -162,8 +158,6 @@ const selectedTimezone = computed({
},
});
const { mutate: updateUserLocale } = useMutation(UPDATE_USER_LOCALE);
const sanitize = (timezone: string): string => {
return timezone
.split("_")