mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
vue requestor component, flex-table design
This commit is contained in:
parent
2f27674e05
commit
caeb75ce13
@ -151,7 +151,7 @@ div.flex-table {
|
|||||||
padding: 1em;
|
padding: 1em;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
& > h5 {
|
& > h4, & > h5 {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0.3em;
|
margin-bottom: 0.3em;
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
|
@ -3,45 +3,47 @@
|
|||||||
|
|
||||||
<h2><a name="section-20"></a>{{ $t('requestor.title') }}</h2>
|
<h2><a name="section-20"></a>{{ $t('requestor.title') }}</h2>
|
||||||
|
|
||||||
<div v-if="accompanyingCourse.requestor">
|
<div v-if="accompanyingCourse.requestor" class="flex-table">
|
||||||
|
|
||||||
<label>
|
<label>
|
||||||
<input type="checkbox" v-model="isAnonymous" :value="value" />
|
<input type="checkbox" v-model="isAnonymous" :value="value" />
|
||||||
{{ $t('requestor.is_anonymous') }}
|
{{ $t('requestor.is_anonymous') }}
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<dt>{{ $t('requestor.type') }}</dt>
|
<div class="item-bloc">
|
||||||
<dd>{{ accompanyingCourse.requestor.type }}</dd>
|
<h4>
|
||||||
<dt>{{ $t('requestor.text') }}</dt>
|
<span class="badge badge-pill badge-secondary">{{ accompanyingCourse.requestor.type }}</span>
|
||||||
<dd>{{ accompanyingCourse.requestor.text }}</dd>
|
{{ accompanyingCourse.requestor.text }}
|
||||||
<dt>{{ $t('requestor.is_anonymous') }}</dt>
|
</h4>
|
||||||
<dd>{{ accompanyingCourse.requestorAnonymous }}</dd>
|
|
||||||
|
|
||||||
<div v-if="accompanyingCourse.requestor.type === 'person'">
|
<dl class="content-bloc" v-if="accompanyingCourse.requestor.type === 'person'">
|
||||||
<dt>{{ $t('requestor.person_id') }}</dt>
|
|
||||||
<dd>{{ accompanyingCourse.requestor.person_id }}</dd>
|
<dt>{{ $t('requestor.birthdate') }}</dt>
|
||||||
<dt>{{ $t('requestor.birthdate') }}</dt>
|
<dd>{{ $d(accompanyingCourse.requestor.birthdate.datetime, 'short') }}</dd>
|
||||||
<dd>{{ $d(accompanyingCourse.requestor.birthdate.datetime, 'short') }}</dd>
|
|
||||||
<dt>{{ $t('requestor.center') }}</dt>
|
<dt>{{ $t('requestor.center') }}</dt>
|
||||||
<dd>{{ accompanyingCourse.requestor.center.name }}</dd>
|
<dd>{{ accompanyingCourse.requestor.center.name }}</dd>
|
||||||
<dt>{{ $t('requestor.firstName') }}</dt>
|
|
||||||
<dd>{{ accompanyingCourse.requestor.firstName }}</dd>
|
<dt>{{ $t('requestor.phonenumber') }}</dt>
|
||||||
<dt>{{ $t('requestor.lastName') }}</dt>
|
<dd>{{ accompanyingCourse.requestor.phonenumber }}</dd>
|
||||||
<dd>{{ accompanyingCourse.requestor.lastName }}</dd>
|
<dt>{{ $t('requestor.mobilenumber') }}</dt>
|
||||||
<dt>{{ $t('requestor.phonenumber') }}</dt>
|
<dd>{{ accompanyingCourse.requestor.mobilenumber }}</dd>
|
||||||
<dd>{{ accompanyingCourse.requestor.phonenumber }}</dd>
|
</dl>
|
||||||
<dt>{{ $t('requestor.mobilenumber') }}</dt>
|
|
||||||
<dd>{{ accompanyingCourse.requestor.mobilenumber }}</dd>
|
<dl class="content-bloc" v-if="accompanyingCourse.requestor.type === 'thirdparty'">
|
||||||
<dt>{{ $t('requestor.altNames') }}</dt>
|
|
||||||
<dd>{{ accompanyingCourse.requestor.altNames }}</dd>
|
<dt>{{ $t('requestor.address') }}</dt>
|
||||||
</div>
|
<dd>{{ accompanyingCourse.requestor.address.text }}</dd>
|
||||||
|
|
||||||
<div v-if="accompanyingCourse.requestor.type === 'thirdparty'">
|
<dt>{{ $t('requestor.location') }}</dt>
|
||||||
<dt>{{ $t('requestor.person_id') }}</dt>
|
<dd>{{ accompanyingCourse.requestor.address.postcode.name }}</dd>
|
||||||
<dd>{{ accompanyingCourse.requestor.thirdparty_id }}</dd>
|
</dl>
|
||||||
<dt>{{ $t('requestor.address') }}</dt>
|
|
||||||
<dd>{{ accompanyingCourse.requestor.address.text }}</dd>
|
<ul class="record_actions">
|
||||||
<dt>{{ $t('requestor.location') }}</dt>
|
<li>
|
||||||
<dd>{{ accompanyingCourse.requestor.address.postcode.name }}</dd>
|
<a class="sc-button bt-show" :title="$t('action.show')" target="_blank" :href="url.show"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ul class="record_actions">
|
<ul class="record_actions">
|
||||||
@ -53,6 +55,7 @@
|
|||||||
</button>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<label>{{ $t('requestor.counter') }}</label>
|
<label>{{ $t('requestor.counter') }}</label>
|
||||||
@ -104,6 +107,13 @@ export default {
|
|||||||
get() {
|
get() {
|
||||||
return this.$store.state.accompanyingCourse.requestorAnonymous;
|
return this.$store.state.accompanyingCourse.requestorAnonymous;
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
url() {
|
||||||
|
return (this.accompanyingCourse.requestor.type === 'person') ? {
|
||||||
|
show: `/fr/person/${this.accompanyingCourse.requestor.id}/general`,
|
||||||
|
} : {
|
||||||
|
show: `/fr/thirdparty/thirdparty/${this.accompanyingCourse.requestor.id}/show`,
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@ -120,3 +130,28 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
div.flex-table {
|
||||||
|
margin: 1em 0 0 !important;
|
||||||
|
& > label,
|
||||||
|
& > ul.record_actions {
|
||||||
|
margin: 1em 3em 0 !important;
|
||||||
|
}
|
||||||
|
div.item-bloc {
|
||||||
|
background-color: white !important;
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding: 1em;
|
||||||
|
margin-top: 1em;
|
||||||
|
.content-bloc {
|
||||||
|
font-size: 100%;
|
||||||
|
}
|
||||||
|
ul.record_actions {
|
||||||
|
margin-right: 2em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
@ -184,7 +184,7 @@ div#navmap {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media only screen and (max-width: 768px) {
|
@media only screen and (max-width: 768px) {
|
||||||
div.sticky-section {
|
div#navmap {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user