mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-08-21 15:13:50 +00:00
Apply prettier rules
This commit is contained in:
@@ -1,32 +1,32 @@
|
||||
<template>
|
||||
<on-the-fly
|
||||
:type="context.type"
|
||||
:id="context.id"
|
||||
:action="context.action"
|
||||
:button-text="options.buttonText"
|
||||
:display-badge="options.displayBadge === 'true'"
|
||||
:is-dead="options.isDead"
|
||||
:parent="options.parent"
|
||||
@save-form-on-the-fly="saveFormOnTheFly"
|
||||
/>
|
||||
<on-the-fly
|
||||
:type="context.type"
|
||||
:id="context.id"
|
||||
:action="context.action"
|
||||
:button-text="options.buttonText"
|
||||
:display-badge="options.displayBadge === 'true'"
|
||||
:is-dead="options.isDead"
|
||||
:parent="options.parent"
|
||||
@save-form-on-the-fly="saveFormOnTheFly"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OnTheFly from './components/OnTheFly.vue';
|
||||
import OnTheFly from "./components/OnTheFly.vue";
|
||||
|
||||
export default {
|
||||
name: "App",
|
||||
components: {
|
||||
OnTheFly
|
||||
OnTheFly,
|
||||
},
|
||||
props: ['onTheFly'],
|
||||
props: ["onTheFly"],
|
||||
computed: {
|
||||
context() {
|
||||
return this.onTheFly.context;
|
||||
},
|
||||
options() {
|
||||
return this.onTheFly.options;
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
//console.log('OnTheFly mounted');
|
||||
@@ -35,9 +35,8 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
saveFormOnTheFly(payload) {
|
||||
console.log('saveFormOnTheFly', payload);
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log("saveFormOnTheFly", payload);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,121 +1,113 @@
|
||||
<template>
|
||||
<ul class="nav nav-tabs">
|
||||
<li
|
||||
v-if="allowedTypes.includes('person')"
|
||||
class="nav-item"
|
||||
>
|
||||
<a
|
||||
class="nav-link"
|
||||
:class="{ active: isActive('person') }"
|
||||
>
|
||||
<label for="person">
|
||||
<input
|
||||
type="radio"
|
||||
name="person"
|
||||
id="person"
|
||||
v-model="radioType"
|
||||
value="person"
|
||||
>
|
||||
{{ $t('onthefly.create.person') }}
|
||||
</label>
|
||||
</a>
|
||||
</li>
|
||||
<li
|
||||
v-if="allowedTypes.includes('thirdparty')"
|
||||
class="nav-item"
|
||||
>
|
||||
<a
|
||||
class="nav-link"
|
||||
:class="{ active: isActive('thirdparty') }"
|
||||
>
|
||||
<label for="thirdparty">
|
||||
<input
|
||||
type="radio"
|
||||
name="thirdparty"
|
||||
id="thirdparty"
|
||||
v-model="radioType"
|
||||
value="thirdparty"
|
||||
>
|
||||
{{ $t('onthefly.create.thirdparty') }}
|
||||
</label>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav nav-tabs">
|
||||
<li v-if="allowedTypes.includes('person')" class="nav-item">
|
||||
<a class="nav-link" :class="{ active: isActive('person') }">
|
||||
<label for="person">
|
||||
<input
|
||||
type="radio"
|
||||
name="person"
|
||||
id="person"
|
||||
v-model="radioType"
|
||||
value="person"
|
||||
/>
|
||||
{{ $t("onthefly.create.person") }}
|
||||
</label>
|
||||
</a>
|
||||
</li>
|
||||
<li v-if="allowedTypes.includes('thirdparty')" class="nav-item">
|
||||
<a class="nav-link" :class="{ active: isActive('thirdparty') }">
|
||||
<label for="thirdparty">
|
||||
<input
|
||||
type="radio"
|
||||
name="thirdparty"
|
||||
id="thirdparty"
|
||||
v-model="radioType"
|
||||
value="thirdparty"
|
||||
/>
|
||||
{{ $t("onthefly.create.thirdparty") }}
|
||||
</label>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="my-4">
|
||||
<on-the-fly-person
|
||||
v-if="type === 'person'"
|
||||
:action="action"
|
||||
:query="query"
|
||||
ref="castPerson"
|
||||
/>
|
||||
<div class="my-4">
|
||||
<on-the-fly-person
|
||||
v-if="type === 'person'"
|
||||
:action="action"
|
||||
:query="query"
|
||||
ref="castPerson"
|
||||
/>
|
||||
|
||||
<on-the-fly-thirdparty
|
||||
v-if="type === 'thirdparty'"
|
||||
:action="action"
|
||||
:query="query"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
</div>
|
||||
<on-the-fly-thirdparty
|
||||
v-if="type === 'thirdparty'"
|
||||
:action="action"
|
||||
:query="query"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OnTheFlyPerson from 'ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue';
|
||||
import OnTheFlyThirdparty from 'ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue';
|
||||
import OnTheFlyPerson from "ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue";
|
||||
import OnTheFlyThirdparty from "ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue";
|
||||
|
||||
export default {
|
||||
name: "OnTheFlyCreate",
|
||||
props: ['action', 'allowedTypes', 'query'],
|
||||
components: {
|
||||
OnTheFlyPerson,
|
||||
OnTheFlyThirdparty
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
radioType: {
|
||||
set(type) {
|
||||
this.type = type;
|
||||
console.log('## type:', type, ', action:', this.action);
|
||||
},
|
||||
get() {
|
||||
return this.type;
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.type = (this.allowedTypes.length === 1 && this.allowedTypes.includes('thirdparty')) ? 'thirdparty' : 'person'
|
||||
},
|
||||
methods: {
|
||||
isActive(tab) {
|
||||
return (this.type === tab) ? true : false;
|
||||
},
|
||||
castDataByType() {
|
||||
switch (this.radioType) {
|
||||
case 'person':
|
||||
return this.$refs.castPerson.$data.person;
|
||||
case 'thirdparty':
|
||||
let data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
if (data.address !== undefined && data.address !== null) {
|
||||
data.address = { id: data.address.address_id }
|
||||
} else {
|
||||
data.address = null;
|
||||
}
|
||||
name: "OnTheFlyCreate",
|
||||
props: ["action", "allowedTypes", "query"],
|
||||
components: {
|
||||
OnTheFlyPerson,
|
||||
OnTheFlyThirdparty,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: null,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
radioType: {
|
||||
set(type) {
|
||||
this.type = type;
|
||||
console.log("## type:", type, ", action:", this.action);
|
||||
},
|
||||
get() {
|
||||
return this.type;
|
||||
},
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.type =
|
||||
this.allowedTypes.length === 1 &&
|
||||
this.allowedTypes.includes("thirdparty")
|
||||
? "thirdparty"
|
||||
: "person";
|
||||
},
|
||||
methods: {
|
||||
isActive(tab) {
|
||||
return this.type === tab ? true : false;
|
||||
},
|
||||
castDataByType() {
|
||||
switch (this.radioType) {
|
||||
case "person":
|
||||
return this.$refs.castPerson.$data.person;
|
||||
case "thirdparty":
|
||||
let data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
if (data.address !== undefined && data.address !== null) {
|
||||
data.address = { id: data.address.address_id };
|
||||
} else {
|
||||
data.address = null;
|
||||
}
|
||||
|
||||
return data;
|
||||
default:
|
||||
throw Error('Invalid type of entity')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return data;
|
||||
default:
|
||||
throw Error("Invalid type of entity");
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="css" scoped>
|
||||
label {
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,314 +1,328 @@
|
||||
<template>
|
||||
<a
|
||||
v-if="isDisplayBadge"
|
||||
@click="openModal"
|
||||
>
|
||||
<span
|
||||
class="chill-entity"
|
||||
:class="badgeType"
|
||||
>
|
||||
{{ buttonText }}<span v-if="isDead"> (‡)</span>
|
||||
</span>
|
||||
</a>
|
||||
<a
|
||||
v-else
|
||||
class="btn btn-sm"
|
||||
target="_blank"
|
||||
:class="classAction"
|
||||
:title="$t(titleAction)"
|
||||
@click="openModal"
|
||||
>
|
||||
{{ buttonText }}<span v-if="isDead"> (‡)</span>
|
||||
</a>
|
||||
|
||||
<teleport to="body">
|
||||
<modal
|
||||
v-if="modal.showModal"
|
||||
:modal-dialog-class="modal.modalDialogClass"
|
||||
@close="modal.showModal = false"
|
||||
>
|
||||
<template #header>
|
||||
<h3
|
||||
v-if="parent"
|
||||
class="modal-title"
|
||||
>
|
||||
{{ $t(titleModal, {q: parent.text}) }}
|
||||
</h3>
|
||||
<h3
|
||||
v-else
|
||||
class="modal-title"
|
||||
>
|
||||
{{ $t(titleModal) }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<template
|
||||
#body
|
||||
v-if="type === 'person'"
|
||||
>
|
||||
<on-the-fly-person
|
||||
:id="id"
|
||||
:type="type"
|
||||
:action="action"
|
||||
ref="castPerson"
|
||||
/>
|
||||
<div v-if="hasResourceComment">
|
||||
<h3>{{ $t('onthefly.resource_comment_title') }}</h3>
|
||||
<blockquote class="chill-user-quote">
|
||||
{{ parent.comment }}
|
||||
</blockquote>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template
|
||||
#body
|
||||
v-else-if="type === 'thirdparty'"
|
||||
>
|
||||
<on-the-fly-thirdparty
|
||||
:id="id"
|
||||
:type="type"
|
||||
:action="action"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
<div v-if="hasResourceComment">
|
||||
<h3>{{ $t('onthefly.resource_comment_title') }}</h3>
|
||||
<blockquote class="chill-user-quote">
|
||||
{{ parent.comment }}
|
||||
</blockquote>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template
|
||||
#body
|
||||
v-else-if="parent"
|
||||
>
|
||||
<on-the-fly-thirdparty
|
||||
:parent="parent"
|
||||
:action="action"
|
||||
type="thirdparty"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template
|
||||
#body
|
||||
<a v-if="isDisplayBadge" @click="openModal">
|
||||
<span class="chill-entity" :class="badgeType">
|
||||
{{ buttonText }}<span v-if="isDead"> (‡)</span>
|
||||
</span>
|
||||
</a>
|
||||
<a
|
||||
v-else
|
||||
>
|
||||
<on-the-fly-create
|
||||
:action="action"
|
||||
:allowed-types="allowedTypes"
|
||||
:query="query"
|
||||
ref="castNew"
|
||||
/>
|
||||
</template>
|
||||
class="btn btn-sm"
|
||||
target="_blank"
|
||||
:class="classAction"
|
||||
:title="$t(titleAction)"
|
||||
@click="openModal"
|
||||
>
|
||||
{{ buttonText }}<span v-if="isDead"> (‡)</span>
|
||||
</a>
|
||||
|
||||
<template #footer>
|
||||
<a
|
||||
v-if="action === 'show'"
|
||||
:href="buildLocation(id, type)"
|
||||
:title="$t(titleMessage)"
|
||||
class="btn btn-show"
|
||||
>{{ $t(buttonMessage) }}
|
||||
</a>
|
||||
<a
|
||||
v-else
|
||||
class="btn btn-save"
|
||||
@click="saveAction"
|
||||
<teleport to="body">
|
||||
<modal
|
||||
v-if="modal.showModal"
|
||||
:modal-dialog-class="modal.modalDialogClass"
|
||||
@close="modal.showModal = false"
|
||||
>
|
||||
{{ $t('action.save') }}
|
||||
</a>
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
<template #header>
|
||||
<h3 v-if="parent" class="modal-title">
|
||||
{{ $t(titleModal, { q: parent.text }) }}
|
||||
</h3>
|
||||
<h3 v-else class="modal-title">
|
||||
{{ $t(titleModal) }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<template #body v-if="type === 'person'">
|
||||
<on-the-fly-person
|
||||
:id="id"
|
||||
:type="type"
|
||||
:action="action"
|
||||
ref="castPerson"
|
||||
/>
|
||||
<div v-if="hasResourceComment">
|
||||
<h3>{{ $t("onthefly.resource_comment_title") }}</h3>
|
||||
<blockquote class="chill-user-quote">
|
||||
{{ parent.comment }}
|
||||
</blockquote>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #body v-else-if="type === 'thirdparty'">
|
||||
<on-the-fly-thirdparty
|
||||
:id="id"
|
||||
:type="type"
|
||||
:action="action"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
<div v-if="hasResourceComment">
|
||||
<h3>{{ $t("onthefly.resource_comment_title") }}</h3>
|
||||
<blockquote class="chill-user-quote">
|
||||
{{ parent.comment }}
|
||||
</blockquote>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #body v-else-if="parent">
|
||||
<on-the-fly-thirdparty
|
||||
:parent="parent"
|
||||
:action="action"
|
||||
type="thirdparty"
|
||||
ref="castThirdparty"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #body v-else>
|
||||
<on-the-fly-create
|
||||
:action="action"
|
||||
:allowed-types="allowedTypes"
|
||||
:query="query"
|
||||
ref="castNew"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #footer>
|
||||
<a
|
||||
v-if="action === 'show'"
|
||||
:href="buildLocation(id, type)"
|
||||
:title="$t(titleMessage)"
|
||||
class="btn btn-show"
|
||||
>{{ $t(buttonMessage) }}
|
||||
</a>
|
||||
<a v-else class="btn btn-save" @click="saveAction">
|
||||
{{ $t("action.save") }}
|
||||
</a>
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Modal from 'ChillMainAssets/vuejs/_components/Modal.vue';
|
||||
import OnTheFlyCreate from './Create.vue';
|
||||
import OnTheFlyPerson from 'ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue';
|
||||
import OnTheFlyThirdparty from 'ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue';
|
||||
import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
|
||||
import OnTheFlyCreate from "./Create.vue";
|
||||
import OnTheFlyPerson from "ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue";
|
||||
import OnTheFlyThirdparty from "ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdParty.vue";
|
||||
|
||||
export default {
|
||||
name: 'OnTheFly',
|
||||
components: {
|
||||
Modal,
|
||||
OnTheFlyPerson,
|
||||
OnTheFlyThirdparty,
|
||||
OnTheFlyCreate
|
||||
},
|
||||
props: ['type', 'id', 'action', 'buttonText', 'displayBadge', 'isDead', 'parent', 'allowedTypes', 'query'],
|
||||
emits: ['saveFormOnTheFly'],
|
||||
data() {
|
||||
return {
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasResourceComment() {
|
||||
return (typeof this.parent !== 'undefined' && this.parent !== null)
|
||||
&& this.action === 'show'
|
||||
&& this.parent.type === 'accompanying_period_resource'
|
||||
&& (this.parent.comment !== null && this.parent.comment !== '')
|
||||
;
|
||||
},
|
||||
classAction() {
|
||||
switch (this.action) {
|
||||
case 'show':
|
||||
return 'btn-show';
|
||||
case 'edit':
|
||||
return 'btn-update';
|
||||
case 'create':
|
||||
return 'btn-create';
|
||||
case 'addContact':
|
||||
return 'btn-tpchild';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
titleAction() {
|
||||
switch (this.action) {
|
||||
case 'show':
|
||||
return 'action.show';
|
||||
case 'edit':
|
||||
return 'action.edit';
|
||||
case 'create':
|
||||
return 'action.create';
|
||||
case 'addContact':
|
||||
return 'action.addContact';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
titleCreate() {
|
||||
if (typeof this.allowedTypes === 'undefined') {
|
||||
return 'onthefly.create.title.default';
|
||||
}
|
||||
return this.allowedTypes.every(t => t === 'person')
|
||||
? 'onthefly.create.title.person'
|
||||
: this.allowedTypes.every(t => t === 'thirdparty')
|
||||
? 'onthefly.create.title.thirdparty'
|
||||
: 'onthefly.create.title.default'
|
||||
},
|
||||
titleModal() {
|
||||
switch (this.action) {
|
||||
case 'show':
|
||||
return 'onthefly.show.' + this.type;
|
||||
case 'edit':
|
||||
return 'onthefly.edit.' + this.type;
|
||||
case 'create':
|
||||
return this.titleCreate;
|
||||
case 'addContact':
|
||||
return 'onthefly.addContact.title';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
titleMessage() {
|
||||
switch (this.type){
|
||||
case 'person':
|
||||
return 'action.redirect.' + this.type;
|
||||
case 'thirdparty':
|
||||
return 'action.redirect.' + this.type;
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
buttonMessage() {
|
||||
switch (this.type){
|
||||
case 'person':
|
||||
return 'onthefly.show.file_' + this.type;
|
||||
case 'thirdparty':
|
||||
return 'onthefly.show.file_' + this.type;
|
||||
}
|
||||
},
|
||||
isDisplayBadge() {
|
||||
return (this.displayBadge === true && this.buttonText !== null);
|
||||
},
|
||||
badgeType() {
|
||||
return 'entity-' + this.type + ' badge-' + this.type;
|
||||
},
|
||||
getReturnPath() {
|
||||
return `?returnPath=${window.location.pathname}${window.location.search}${window.location.hash}`;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
closeModal() {
|
||||
this.modal.showModal = false;
|
||||
},
|
||||
openModal() {
|
||||
// console.log('## OPEN ON THE FLY MODAL');
|
||||
// console.log('## type:', this.type, ', action:', this.action);
|
||||
this.modal.showModal = true;
|
||||
this.$nextTick(function() {
|
||||
//this.$refs.search.focus();
|
||||
})
|
||||
},
|
||||
changeActionTo(action) {
|
||||
this.$data.action = action;
|
||||
},
|
||||
saveAction() {
|
||||
// console.log('saveAction button: create/edit action with', this.type);
|
||||
let
|
||||
type = this.type,
|
||||
data = {} ;
|
||||
switch (type) {
|
||||
case 'person':
|
||||
data = this.$refs.castPerson.$data.person;
|
||||
console.log('person data are', data);
|
||||
break;
|
||||
name: "OnTheFly",
|
||||
components: {
|
||||
Modal,
|
||||
OnTheFlyPerson,
|
||||
OnTheFlyThirdparty,
|
||||
OnTheFlyCreate,
|
||||
},
|
||||
props: [
|
||||
"type",
|
||||
"id",
|
||||
"action",
|
||||
"buttonText",
|
||||
"displayBadge",
|
||||
"isDead",
|
||||
"parent",
|
||||
"allowedTypes",
|
||||
"query",
|
||||
],
|
||||
emits: ["saveFormOnTheFly"],
|
||||
data() {
|
||||
return {
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl",
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
hasResourceComment() {
|
||||
return (
|
||||
typeof this.parent !== "undefined" &&
|
||||
this.parent !== null &&
|
||||
this.action === "show" &&
|
||||
this.parent.type === "accompanying_period_resource" &&
|
||||
this.parent.comment !== null &&
|
||||
this.parent.comment !== ""
|
||||
);
|
||||
},
|
||||
classAction() {
|
||||
switch (this.action) {
|
||||
case "show":
|
||||
return "btn-show";
|
||||
case "edit":
|
||||
return "btn-update";
|
||||
case "create":
|
||||
return "btn-create";
|
||||
case "addContact":
|
||||
return "btn-tpchild";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
titleAction() {
|
||||
switch (this.action) {
|
||||
case "show":
|
||||
return "action.show";
|
||||
case "edit":
|
||||
return "action.edit";
|
||||
case "create":
|
||||
return "action.create";
|
||||
case "addContact":
|
||||
return "action.addContact";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
titleCreate() {
|
||||
if (typeof this.allowedTypes === "undefined") {
|
||||
return "onthefly.create.title.default";
|
||||
}
|
||||
return this.allowedTypes.every((t) => t === "person")
|
||||
? "onthefly.create.title.person"
|
||||
: this.allowedTypes.every((t) => t === "thirdparty")
|
||||
? "onthefly.create.title.thirdparty"
|
||||
: "onthefly.create.title.default";
|
||||
},
|
||||
titleModal() {
|
||||
switch (this.action) {
|
||||
case "show":
|
||||
return "onthefly.show." + this.type;
|
||||
case "edit":
|
||||
return "onthefly.edit." + this.type;
|
||||
case "create":
|
||||
return this.titleCreate;
|
||||
case "addContact":
|
||||
return "onthefly.addContact.title";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
titleMessage() {
|
||||
switch (this.type) {
|
||||
case "person":
|
||||
return "action.redirect." + this.type;
|
||||
case "thirdparty":
|
||||
return "action.redirect." + this.type;
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
buttonMessage() {
|
||||
switch (this.type) {
|
||||
case "person":
|
||||
return "onthefly.show.file_" + this.type;
|
||||
case "thirdparty":
|
||||
return "onthefly.show.file_" + this.type;
|
||||
}
|
||||
},
|
||||
isDisplayBadge() {
|
||||
return this.displayBadge === true && this.buttonText !== null;
|
||||
},
|
||||
badgeType() {
|
||||
return "entity-" + this.type + " badge-" + this.type;
|
||||
},
|
||||
getReturnPath() {
|
||||
return `?returnPath=${window.location.pathname}${window.location.search}${window.location.hash}`;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
closeModal() {
|
||||
this.modal.showModal = false;
|
||||
},
|
||||
openModal() {
|
||||
// console.log('## OPEN ON THE FLY MODAL');
|
||||
// console.log('## type:', this.type, ', action:', this.action);
|
||||
this.modal.showModal = true;
|
||||
this.$nextTick(function () {
|
||||
//this.$refs.search.focus();
|
||||
});
|
||||
},
|
||||
changeActionTo(action) {
|
||||
this.$data.action = action;
|
||||
},
|
||||
saveAction() {
|
||||
// console.log('saveAction button: create/edit action with', this.type);
|
||||
let type = this.type,
|
||||
data = {};
|
||||
switch (type) {
|
||||
case "person":
|
||||
data = this.$refs.castPerson.$data.person;
|
||||
console.log("person data are", data);
|
||||
break;
|
||||
|
||||
case 'thirdparty':
|
||||
data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
/* never executed ? */
|
||||
break;
|
||||
case "thirdparty":
|
||||
data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
/* never executed ? */
|
||||
break;
|
||||
|
||||
default:
|
||||
if (typeof this.type === 'undefined') { // action=create or addContact
|
||||
// console.log('will rewrite data');
|
||||
if (this.action === 'addContact') {
|
||||
type = 'thirdparty'
|
||||
data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
// console.log('data original', data);
|
||||
data.parent = {type: "thirdparty", id: this.parent.id};
|
||||
data.civility = data.civility !== null ? {type: 'chill_main_civility', id: data.civility.id} : null;
|
||||
data.profession = data.profession !== '' ? data.profession : '';
|
||||
} else {
|
||||
type = this.$refs.castNew.radioType;
|
||||
data = this.$refs.castNew.castDataByType();
|
||||
// console.log('type', type);
|
||||
if (typeof data.civility !== 'undefined' && null !== data.civility) {
|
||||
data.civility = data.civility !== null ? {type: 'chill_main_civility', id: data.civility.id} : null;
|
||||
}
|
||||
if (typeof data.profession !== 'undefined' && '' !== data.profession) {
|
||||
data.profession = data.profession !== '' ? data.profession : '';
|
||||
}
|
||||
// console.log('onthefly data', data);
|
||||
}
|
||||
} else {
|
||||
throw 'error with object type';
|
||||
}
|
||||
}
|
||||
// pass datas to parent
|
||||
this.$emit('saveFormOnTheFly', { type: type, data: data });
|
||||
},
|
||||
buildLocation(id, type) {
|
||||
if (type === 'person') {
|
||||
// TODO i18n
|
||||
return encodeURI(`/fr/person/${id}/general${this.getReturnPath}`);
|
||||
} else if (type === 'thirdparty') {
|
||||
return encodeURI(`/fr/3party/3party/${id}/view${this.getReturnPath}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
default:
|
||||
if (typeof this.type === "undefined") {
|
||||
// action=create or addContact
|
||||
// console.log('will rewrite data');
|
||||
if (this.action === "addContact") {
|
||||
type = "thirdparty";
|
||||
data = this.$refs.castThirdparty.$data.thirdparty;
|
||||
// console.log('data original', data);
|
||||
data.parent = {
|
||||
type: "thirdparty",
|
||||
id: this.parent.id,
|
||||
};
|
||||
data.civility =
|
||||
data.civility !== null
|
||||
? {
|
||||
type: "chill_main_civility",
|
||||
id: data.civility.id,
|
||||
}
|
||||
: null;
|
||||
data.profession =
|
||||
data.profession !== "" ? data.profession : "";
|
||||
} else {
|
||||
type = this.$refs.castNew.radioType;
|
||||
data = this.$refs.castNew.castDataByType();
|
||||
// console.log('type', type);
|
||||
if (
|
||||
typeof data.civility !== "undefined" &&
|
||||
null !== data.civility
|
||||
) {
|
||||
data.civility =
|
||||
data.civility !== null
|
||||
? {
|
||||
type: "chill_main_civility",
|
||||
id: data.civility.id,
|
||||
}
|
||||
: null;
|
||||
}
|
||||
if (
|
||||
typeof data.profession !== "undefined" &&
|
||||
"" !== data.profession
|
||||
) {
|
||||
data.profession =
|
||||
data.profession !== ""
|
||||
? data.profession
|
||||
: "";
|
||||
}
|
||||
// console.log('onthefly data', data);
|
||||
}
|
||||
} else {
|
||||
throw "error with object type";
|
||||
}
|
||||
}
|
||||
// pass datas to parent
|
||||
this.$emit("saveFormOnTheFly", { type: type, data: data });
|
||||
},
|
||||
buildLocation(id, type) {
|
||||
if (type === "person") {
|
||||
// TODO i18n
|
||||
return encodeURI(
|
||||
`/fr/person/${id}/general${this.getReturnPath}`,
|
||||
);
|
||||
} else if (type === "thirdparty") {
|
||||
return encodeURI(
|
||||
`/fr/3party/3party/${id}/view${this.getReturnPath}`,
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="css" scoped>
|
||||
a {
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* .btn-add-contact {
|
||||
|
||||
@@ -1,35 +1,35 @@
|
||||
const ontheflyMessages = {
|
||||
fr: {
|
||||
onthefly: {
|
||||
show: {
|
||||
person: "Détails de l'usager",
|
||||
thirdparty: "Détails du tiers",
|
||||
file_person: "Ouvrir la fiche de l'usager",
|
||||
file_thirdparty: "Voir le Tiers",
|
||||
},
|
||||
edit: {
|
||||
person: "Modifier un usager",
|
||||
thirdparty: "Modifier un tiers",
|
||||
},
|
||||
create: {
|
||||
button: "Créer \"{q}\"",
|
||||
title: {
|
||||
default: "Création d'un nouvel usager ou d'un tiers professionnel",
|
||||
person: "Création d'un nouvel usager",
|
||||
thirdparty: "Création d'un nouveau tiers professionnel",
|
||||
},
|
||||
person: "un nouvel usager",
|
||||
thirdparty: "un nouveau tiers professionnel"
|
||||
},
|
||||
addContact: {
|
||||
title: "Créer un contact pour {q}"
|
||||
},
|
||||
resource_comment_title: "Un commentaire est associé à cet interlocuteur",
|
||||
addContact: {
|
||||
title: "Créer un contact pour {q}"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
fr: {
|
||||
onthefly: {
|
||||
show: {
|
||||
person: "Détails de l'usager",
|
||||
thirdparty: "Détails du tiers",
|
||||
file_person: "Ouvrir la fiche de l'usager",
|
||||
file_thirdparty: "Voir le Tiers",
|
||||
},
|
||||
edit: {
|
||||
person: "Modifier un usager",
|
||||
thirdparty: "Modifier un tiers",
|
||||
},
|
||||
create: {
|
||||
button: 'Créer "{q}"',
|
||||
title: {
|
||||
default: "Création d'un nouvel usager ou d'un tiers professionnel",
|
||||
person: "Création d'un nouvel usager",
|
||||
thirdparty: "Création d'un nouveau tiers professionnel",
|
||||
},
|
||||
person: "un nouvel usager",
|
||||
thirdparty: "un nouveau tiers professionnel",
|
||||
},
|
||||
addContact: {
|
||||
title: "Créer un contact pour {q}",
|
||||
},
|
||||
resource_comment_title: "Un commentaire est associé à cet interlocuteur",
|
||||
addContact: {
|
||||
title: "Créer un contact pour {q}",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export { ontheflyMessages };
|
||||
|
||||
@@ -1,38 +1,40 @@
|
||||
import { createApp } from "vue";
|
||||
import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n';
|
||||
import { ontheflyMessages } from './i18n.js';
|
||||
import { _createI18n } from "ChillMainAssets/vuejs/_js/i18n";
|
||||
import { ontheflyMessages } from "./i18n.js";
|
||||
import App from "./App.vue";
|
||||
|
||||
const i18n = _createI18n( ontheflyMessages );
|
||||
const i18n = _createI18n(ontheflyMessages);
|
||||
|
||||
let containers = document.querySelectorAll('.onthefly-container');
|
||||
let containers = document.querySelectorAll(".onthefly-container");
|
||||
|
||||
containers.forEach((container) => {
|
||||
/*exported app */
|
||||
const app = createApp({
|
||||
template: `<app :onTheFly="this.onTheFly" ></app>`,
|
||||
data() {
|
||||
return {
|
||||
onTheFly: {
|
||||
context: {
|
||||
action: container.dataset.action,
|
||||
type: container.dataset.targetName,
|
||||
id: parseInt(container.dataset.targetId),
|
||||
},
|
||||
options: {
|
||||
buttonText: container.dataset.buttonText || null,
|
||||
displayBadge: container.dataset.displayBadge || false,
|
||||
isDead: container.dataset.isDead || false,
|
||||
parent: container.dataset.parent ? JSON.parse(container.dataset.parent) : null,
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
/*exported app */
|
||||
const app = createApp({
|
||||
template: `<app :onTheFly="this.onTheFly" ></app>`,
|
||||
data() {
|
||||
return {
|
||||
onTheFly: {
|
||||
context: {
|
||||
action: container.dataset.action,
|
||||
type: container.dataset.targetName,
|
||||
id: parseInt(container.dataset.targetId),
|
||||
},
|
||||
options: {
|
||||
buttonText: container.dataset.buttonText || null,
|
||||
displayBadge: container.dataset.displayBadge || false,
|
||||
isDead: container.dataset.isDead || false,
|
||||
parent: container.dataset.parent
|
||||
? JSON.parse(container.dataset.parent)
|
||||
: null,
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
})
|
||||
.use(i18n)
|
||||
.component('app', App)
|
||||
.component("app", App)
|
||||
.mount(container);
|
||||
|
||||
//console.log('container dataset', container.dataset);
|
||||
//console.log('data-parent', container.dataset.parent);
|
||||
//console.log('container dataset', container.dataset);
|
||||
//console.log('data-parent', container.dataset.parent);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user