mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-09-30 02:25:00 +00:00
eslint fixes
This commit is contained in:
@@ -1,116 +1,113 @@
|
||||
<template>
|
||||
<div class="vue-component">
|
||||
<h2><a id="section-80" />{{ $t("referrer.title") }}</h2>
|
||||
<div class="vue-component">
|
||||
<h2><a id="section-80" />{{ $t("referrer.title") }}</h2>
|
||||
|
||||
<teleport to="body">
|
||||
<modal
|
||||
v-if="modal.showModal"
|
||||
:modal-dialog-class="modal.modalDialogClass"
|
||||
@close="cancelChange"
|
||||
>
|
||||
<template #header>
|
||||
<h3 class="modal-title">
|
||||
{{ $t("confirm.title") }}
|
||||
</h3>
|
||||
</template>
|
||||
<teleport to="body">
|
||||
<modal
|
||||
v-if="modal.showModal"
|
||||
:modal-dialog-class="modal.modalDialogClass"
|
||||
@close="cancelChange"
|
||||
>
|
||||
<template #header>
|
||||
<h3 class="modal-title">
|
||||
{{ $t("confirm.title") }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<template #body-head>
|
||||
<div class="modal-body">
|
||||
<p
|
||||
v-html="
|
||||
$t('confirm.sure_referrer', {
|
||||
referrer: this.value.text,
|
||||
})
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #footer>
|
||||
<button
|
||||
class="btn btn-save"
|
||||
@click.prevent="this.confirmReferrer"
|
||||
>
|
||||
{{ $t("confirm.ok_referrer") }}
|
||||
</button>
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
|
||||
<div>
|
||||
<label class="col-form-label" for="selectJob">
|
||||
{{ $t("job.label") }}
|
||||
</label>
|
||||
|
||||
<VueMultiselect
|
||||
name="selectJob"
|
||||
label="text"
|
||||
:custom-label="customJobLabel"
|
||||
track-by="id"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:placeholder="$t('job.placeholder')"
|
||||
v-model="valueJob"
|
||||
:options="jobs"
|
||||
:select-label="$t('multiselect.select_label')"
|
||||
:deselect-label="$t('multiselect.deselect_label')"
|
||||
:selected-label="$t('multiselect.selected_label')"
|
||||
<template #body-head>
|
||||
<div class="modal-body">
|
||||
<p
|
||||
v-html="
|
||||
$t('confirm.sure_referrer', {
|
||||
referrer: this.value.text,
|
||||
})
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<label class="col-form-label" for="selectReferrer">
|
||||
{{ $t("referrer.label") }}
|
||||
</label>
|
||||
<template #footer>
|
||||
<button class="btn btn-save" @click.prevent="this.confirmReferrer">
|
||||
{{ $t("confirm.ok_referrer") }}
|
||||
</button>
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
|
||||
<VueMultiselect
|
||||
name="selectReferrer"
|
||||
label="text"
|
||||
track-by="id"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:placeholder="$t('referrer.placeholder')"
|
||||
v-model="value"
|
||||
@select="updateReferrer"
|
||||
@remove="removeReferrer"
|
||||
:options="users"
|
||||
:select-label="$t('multiselect.select_label')"
|
||||
:deselect-label="$t('multiselect.deselect_label')"
|
||||
:selected-label="$t('multiselect.selected_label')"
|
||||
/>
|
||||
<div>
|
||||
<label class="col-form-label" for="selectJob">
|
||||
{{ $t("job.label") }}
|
||||
</label>
|
||||
|
||||
<template v-if="usersSuggestedFilteredByJob.length > 0">
|
||||
<ul class="list-suggest add-items inline">
|
||||
<li
|
||||
v-for="(u, i) in usersSuggestedFilteredByJob"
|
||||
@click="updateReferrer(u)"
|
||||
:key="`referrer-${i}`"
|
||||
>
|
||||
<span>
|
||||
<user-render-box-badge :user="u" />
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
</div>
|
||||
<VueMultiselect
|
||||
name="selectJob"
|
||||
label="text"
|
||||
:custom-label="customJobLabel"
|
||||
track-by="id"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:placeholder="$t('job.placeholder')"
|
||||
v-model="valueJob"
|
||||
:options="jobs"
|
||||
:select-label="$t('multiselect.select_label')"
|
||||
:deselect-label="$t('multiselect.deselect_label')"
|
||||
:selected-label="$t('multiselect.selected_label')"
|
||||
/>
|
||||
|
||||
<div>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button
|
||||
class="btn btn-create"
|
||||
type="button"
|
||||
name="button"
|
||||
@click="assignMe"
|
||||
>
|
||||
{{ $t("referrer.assign_me") }}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<label class="col-form-label" for="selectReferrer">
|
||||
{{ $t("referrer.label") }}
|
||||
</label>
|
||||
|
||||
<div v-if="!isJobValid" class="alert alert-warning to-confirm">
|
||||
{{ $t("job.not_valid") }}
|
||||
</div>
|
||||
<VueMultiselect
|
||||
name="selectReferrer"
|
||||
label="text"
|
||||
track-by="id"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:placeholder="$t('referrer.placeholder')"
|
||||
v-model="value"
|
||||
@select="updateReferrer"
|
||||
@remove="removeReferrer"
|
||||
:options="users"
|
||||
:select-label="$t('multiselect.select_label')"
|
||||
:deselect-label="$t('multiselect.deselect_label')"
|
||||
:selected-label="$t('multiselect.selected_label')"
|
||||
/>
|
||||
|
||||
<template v-if="usersSuggestedFilteredByJob.length > 0">
|
||||
<ul class="list-suggest add-items inline">
|
||||
<li
|
||||
v-for="(u, i) in usersSuggestedFilteredByJob"
|
||||
@click="updateReferrer(u)"
|
||||
:key="`referrer-${i}`"
|
||||
>
|
||||
<span>
|
||||
<user-render-box-badge :user="u" />
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button
|
||||
class="btn btn-create"
|
||||
type="button"
|
||||
name="button"
|
||||
@click="assignMe"
|
||||
>
|
||||
{{ $t("referrer.assign_me") }}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div v-if="!isJobValid" class="alert alert-warning to-confirm">
|
||||
{{ $t("job.not_valid") }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -121,134 +118,124 @@ import UserRenderBoxBadge from "ChillMainAssets/vuejs/_components/Entity/UserRen
|
||||
import Modal from "ChillMainAssets/vuejs/_components/Modal";
|
||||
|
||||
export default {
|
||||
name: "Referrer",
|
||||
components: {
|
||||
UserRenderBoxBadge,
|
||||
VueMultiselect,
|
||||
Modal,
|
||||
name: "Referrer",
|
||||
components: {
|
||||
UserRenderBoxBadge,
|
||||
VueMultiselect,
|
||||
Modal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
jobs: [],
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl",
|
||||
},
|
||||
value: this.$store.state.accompanyingCourse.user,
|
||||
confirmed: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
valueJob: (state) => state.accompanyingCourse.job,
|
||||
}),
|
||||
...mapGetters(["isJobValid", "usersSuggestedFilteredByJob"]),
|
||||
users: function () {
|
||||
let users = this.$store.getters.usersFilteredByJob;
|
||||
// ensure that the selected user is in the list. add it if necessary
|
||||
if (
|
||||
this.$store.state.accompanyingCourse.user !== null &&
|
||||
users.find(
|
||||
(u) => this.$store.state.accompanyingCourse.user.id === u.id,
|
||||
) === undefined
|
||||
) {
|
||||
users.push(this.$store.state.accompanyingCourse.user);
|
||||
}
|
||||
return users;
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
jobs: [],
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl",
|
||||
},
|
||||
value: this.$store.state.accompanyingCourse.user,
|
||||
confirmed: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
valueJob: (state) => state.accompanyingCourse.job,
|
||||
}),
|
||||
...mapGetters(["isJobValid", "usersSuggestedFilteredByJob"]),
|
||||
users: function () {
|
||||
let users = this.$store.getters.usersFilteredByJob;
|
||||
// ensure that the selected user is in the list. add it if necessary
|
||||
if (
|
||||
this.$store.state.accompanyingCourse.user !== null &&
|
||||
users.find(
|
||||
(u) =>
|
||||
this.$store.state.accompanyingCourse.user.id === u.id,
|
||||
) === undefined
|
||||
) {
|
||||
users.push(this.$store.state.accompanyingCourse.user);
|
||||
valueJob: {
|
||||
get() {
|
||||
return this.$store.state.accompanyingCourse.job;
|
||||
},
|
||||
set(value) {
|
||||
this.$store
|
||||
.dispatch("updateJob", value)
|
||||
.catch(({ name, violations }) => {
|
||||
if (name === "ValidationException" || name === "AccessException") {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
return users;
|
||||
},
|
||||
valueJob: {
|
||||
get() {
|
||||
return this.$store.state.accompanyingCourse.job;
|
||||
},
|
||||
set(value) {
|
||||
this.$store
|
||||
.dispatch("updateJob", value)
|
||||
.catch(({ name, violations }) => {
|
||||
if (
|
||||
name === "ValidationException" ||
|
||||
name === "AccessException"
|
||||
) {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getJobs();
|
||||
},
|
||||
mounted() {
|
||||
this.getJobs();
|
||||
},
|
||||
methods: {
|
||||
updateReferrer(value) {
|
||||
this.value = value;
|
||||
this.toggleModal();
|
||||
},
|
||||
methods: {
|
||||
updateReferrer(value) {
|
||||
this.value = value;
|
||||
this.toggleModal();
|
||||
},
|
||||
getJobs() {
|
||||
const url = "/api/1.0/main/user-job.json";
|
||||
makeFetch("GET", url)
|
||||
.then((response) => {
|
||||
this.jobs = response.results;
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$toast.open({ message: error.txt });
|
||||
});
|
||||
},
|
||||
customJobLabel(value) {
|
||||
return value.label.fr;
|
||||
},
|
||||
assignMe() {
|
||||
const url = `/api/1.0/main/whoami.json`;
|
||||
makeFetch("GET", url).then((user) => {
|
||||
// this.value = user
|
||||
this.updateReferrer(user);
|
||||
});
|
||||
},
|
||||
toggleModal() {
|
||||
this.modal.showModal = !this.modal.showModal;
|
||||
},
|
||||
confirmReferrer() {
|
||||
this.$store
|
||||
.dispatch("updateReferrer", this.value)
|
||||
.catch(({ name, violations }) => {
|
||||
if (
|
||||
name === "ValidationException" ||
|
||||
name === "AccessException"
|
||||
) {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
});
|
||||
this.toggleModal();
|
||||
},
|
||||
removeReferrer() {
|
||||
console.log("remove option");
|
||||
this.$store
|
||||
.dispatch("updateReferrer", null)
|
||||
.catch(({ name, violations }) => {
|
||||
if (
|
||||
name === "ValidationException" ||
|
||||
name === "AccessException"
|
||||
) {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
});
|
||||
},
|
||||
cancelChange() {
|
||||
this.value = this.$store.state.accompanyingCourse.user;
|
||||
this.toggleModal();
|
||||
},
|
||||
getJobs() {
|
||||
const url = "/api/1.0/main/user-job.json";
|
||||
makeFetch("GET", url)
|
||||
.then((response) => {
|
||||
this.jobs = response.results;
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$toast.open({ message: error.txt });
|
||||
});
|
||||
},
|
||||
customJobLabel(value) {
|
||||
return value.label.fr;
|
||||
},
|
||||
assignMe() {
|
||||
const url = `/api/1.0/main/whoami.json`;
|
||||
makeFetch("GET", url).then((user) => {
|
||||
// this.value = user
|
||||
this.updateReferrer(user);
|
||||
});
|
||||
},
|
||||
toggleModal() {
|
||||
this.modal.showModal = !this.modal.showModal;
|
||||
},
|
||||
confirmReferrer() {
|
||||
this.$store
|
||||
.dispatch("updateReferrer", this.value)
|
||||
.catch(({ name, violations }) => {
|
||||
if (name === "ValidationException" || name === "AccessException") {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
});
|
||||
this.toggleModal();
|
||||
},
|
||||
removeReferrer() {
|
||||
console.log("remove option");
|
||||
this.$store
|
||||
.dispatch("updateReferrer", null)
|
||||
.catch(({ name, violations }) => {
|
||||
if (name === "ValidationException" || name === "AccessException") {
|
||||
violations.forEach((violation) =>
|
||||
this.$toast.open({ message: violation }),
|
||||
);
|
||||
} else {
|
||||
this.$toast.open({ message: "An error occurred" });
|
||||
}
|
||||
});
|
||||
},
|
||||
cancelChange() {
|
||||
this.value = this.$store.state.accompanyingCourse.user;
|
||||
this.toggleModal();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user