Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

wip: use script setup and new translator within vue components main bundle

Browse Source
This commit is contained in:
Julie Lenaerts 2024-09-25 10:13:04 +02:00
parent 077163a774
commit 7edd644963
9 changed files with 68 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/BadgeEntity.vue
View File

@ -31,7 +31,7 @@
</template>
<script setup lang="ts">
<script setup>
import {
trans,
HOUSEHOLD,

2
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Confidential.vue
View File

@ -9,7 +9,7 @@
</div>
</template>
<script setup lang="ts">
<script setup>
import { ref } from 'vue';
const isBlurred = ref(true);

73
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Entity/AddressRenderBox.vue
View File

@ -51,12 +51,12 @@
<div v-if="useDatePane === true" class="address-more">
<div v-if="address.validFrom">
<span class="validFrom">
<b>{{ $t('validFrom') }}</b>: {{ $d(address.validFrom.date) }}
<b>{{ trans(ADDRESS_VALID_FROM) }}</b>: {{ $d(address.validFrom.date) }}
</span>
</div>
<div v-if="address.validTo">
<span class="validTo">
<b>{{ $t('validTo') }}</b>: {{ $d(address.validTo.date) }}
<b>{{ trans(ADDRESS_VALID_TO) }}</b>: {{ $d(address.validTo.date) }}
</span>
</div>
</div>
@ -64,48 +64,47 @@
</component>
</template>
<script>
<script setup>
import { computed } from 'vue';
import Confidential from 'ChillMainAssets/vuejs/_components/Confidential.vue';
import AddressDetailsButton from "ChillMainAssets/vuejs/_components/AddressDetails/AddressDetailsButton.vue";
import { trans, ADDRESS_VALID_FROM, ADDRESS_VALID_TO } from '../../../../../../../../../../../assets/translator'
export default {
name: 'AddressRenderBox',
components: {
Confidential,
AddressDetailsButton,
},
props: {
address: {
type: Object
},
isMultiline: {
default: true,
type: Boolean
},
useDatePane: {
default: false,
type: Boolean
},
showButtonDetails: {
// Props
const props = defineProps({
address: {
type: Object,
},
isMultiline: {
default: true,
type: Boolean
}
},
computed: {
component() {
return this.isMultiline === true ? "div" : "span";
},
multiline() {
return this.isMultiline === true ? "multiline" : "";
},
isConfidential() {
return this.address.confidential;
}
}
type: Boolean,
},
useDatePane: {
default: false,
type: Boolean,
},
showButtonDetails: {
default: true,
type: Boolean,
},
});
// Components
const components = {
Confidential,
AddressDetailsButton,
};
// Computed
const component = computed(() => (props.isMultiline ? 'div' : 'span'));
const multiline = computed(() => (props.isMultiline ? 'multiline' : ''));
const isConfidential = computed(() => props.address?.confidential);
</script>
<style lang="scss" scoped>
p {
&:after {

7
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Entity/UserRenderBoxBadge.vue
View File

@ -5,9 +5,6 @@
</span>
</template>
<script>
export default {
name: "UserRenderBoxBadge",
props: ['user'],
}
<script setup>
const props = defineProps(['user'])
</script>

86
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue
View File

@ -2,39 +2,30 @@
<div class="d-grid gap-2 my-3">
<button class="btn btn-misc" type="button" v-if="!subscriberFinal" @click="subscribeTo('subscribe', 'final')">
<i class="fa fa-check fa-fw"></i>
{{ $t('subscribe_final') }}
{{ trans(WORKFLOW_SUBSCRIBE_FINAL) }}
</button>
<button class="btn btn-misc" type="button" v-if="subscriberFinal" @click="subscribeTo('unsubscribe', 'final')">
<i class="fa fa-times fa-fw"></i>
{{ $t('unsubscribe_final') }}
{{ trans(WORKFLOW_UNSUBSCRIBE_FINAL) }}
</button>
<button class="btn btn-misc" type="button" v-if="!subscriberStep" @click="subscribeTo('subscribe', 'step')">
<i class="fa fa-check fa-fw"></i>
{{ $t('subscribe_all_steps') }}
{{ trans(WORKFLOW_SUBSCRIBE_ALL_STEPS) }}
</button>
<button class="btn btn-misc" type="button" v-if="subscriberStep" @click="subscribeTo('unsubscribe', 'step')">
<i class="fa fa-times fa-fw"></i>
{{ $t('unsubscribe_all_steps') }}
{{ trans(WORKFLOW_UNSUBSCRIBE_ALL_STEPS) }}
</button>
</div>
</template>
<script>
import {makeFetch} from 'ChillMainAssets/lib/api/apiMethods.ts';
<script setup>
import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods.ts';
import { defineProps, defineEmits } from 'vue';
import { trans, WORKFLOW_SUBSCRIBE_FINAL, WORKFLOW_UNSUBSCRIBE_FINAL, WORKFLOW_SUBSCRIBE_ALL_STEPS, WORKFLOW_UNSUBSCRIBE_ALL_STEPS } from '../../../../../../../../../../../assets/translator'
export default {
name: "EntityWorkflowVueSubscriber",
i18n: {
messages: {
fr: {
subscribe_final: "Recevoir une notification à l'étape finale",
unsubscribe_final: "Ne plus recevoir de notification à l'étape finale",
subscribe_all_steps: "Recevoir une notification à chaque étape du suivi",
unsubscribe_all_steps: "Ne plus recevoir de notification à chaque étape du suivi",
}
}
},
props: {
// props
const props = defineProps({
entityWorkflowId: {
type: Number,
required: true,
@ -47,55 +38,22 @@ export default {
type: Boolean,
required: true,
},
},
emits: ['subscriptionUpdated'],
methods: {
subscribeTo(step, to) {
let params = new URLSearchParams();
params.set('subscribe', to);
})
const url = `/api/1.0/main/workflow/${this.entityWorkflowId}/${step}?` + params.toString();
//methods
const subscribeTo = (step, to) => {
let params = new URLSearchParams();
params.set('subscribe', to);
makeFetch('POST', url).then(response => {
this.$emit('subscriptionUpdated', response);
});
}
},
}
/*
* ALTERNATIVES
*
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="laststep">
<label class="form-check-label" for="laststep">{{ $t('subscribe_final') }}</label>
</div>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="allsteps">
<label class="form-check-label" for="allsteps">{{ $t('subscribe_all_steps') }}</label>
</div>
const url = `/api/1.0/main/workflow/${props.entityWorkflowId}/${step}?` + params.toString();
<div class="list-group my-3">
<label class="list-group-item">
<input class="form-check-input me-1" type="checkbox" value="">
{{ $t('subscribe_final') }}
</label>
<label class="list-group-item">
<input class="form-check-input me-1" type="checkbox" value="">
{{ $t('subscribe_all_steps') }}
</label>
</div>
makeFetch('POST', url).then(response => {
emit('subscriptionUpdated', response);
});
}
<div class="btn-group-vertical my-3" role="group">
<button type="button" class="btn btn-outline-primary">
<i class="fa fa-check fa-fw"></i>
{{ $t('subscribe_final') }}
</button>
<button type="button" class="btn btn-outline-primary">
<i class="fa fa-check fa-fw"></i>
{{ $t('subscribe_all_steps') }}
</button>
</div>
*/
// emit
const emit = defineEmits(['subscriptionUpdated'])
</script>
<style scoped></style>

2
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/ListWorkflow.vue
View File

@ -64,7 +64,7 @@
</div>
</template>
<script setup lang="ts">
<script setup>
import Popover from 'bootstrap/js/src/popover';
import { onMounted } from 'vue';
import { trans, SEE, BY_USER, WORKFLOW_AT, WORKFLOW_YOU_SUBSCRIBED_TO_ALL_STEPS, WORKFLOW_YOU_SUBSCRIBED_TO_FINAL_STEP } from '../../../../../../../../../../../assets/translator'

2
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue
View File

@ -28,7 +28,7 @@
</transition>
</template>
<script setup lang="ts">
<script setup>
/*
* This Modal component is a mix between Vue3 modal implementation
* [+] with 'v-if:showModal' directive:parameter, html scope is added/removed not just shown/hidden

6
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue
View File

@ -32,7 +32,7 @@
type="button"
class="btn btn-outline-primary"
:href="showUrl"
:title="$t('action.show')"
:title="trans(SEE)"
>
<i class="fa fa-sm fa-comment-o"></i>
</a>
@ -40,10 +40,10 @@
</div>
</template>
<script setup lang="ts">
<script setup>
import { ref, computed } from 'vue';
import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods.ts';
import { trans, NOTIFICATION_MARK_AS_READ, NOTIFICATION_MARK_AS_UNREAD } from '../../../../../../../../../../../assets/translator'
import { trans, NOTIFICATION_MARK_AS_READ, NOTIFICATION_MARK_AS_UNREAD, SEE } from '../../../../../../../../../../../assets/translator'
// Props
const props = defineProps({

8
src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/OpenWopiLink.vue
View File

@ -24,12 +24,6 @@
<span class="ms-auto me-3">
<span v-if="options.title">{{ options.title }}</span>
</span>
<!--
<a class="btn btn-outline-light">
<i class="fa fa-save fa-fw"></i>
{{ $t('save_and_quit') }}
</a>
-->
</template>
<template v-slot:body>
@ -61,7 +55,7 @@
</teleport>
</template>
<script setup lang="ts">
<script setup>
import { ref, computed } from 'vue';
import Modal from 'ChillMainAssets/vuejs/_components/Modal';
import logo from 'ChillMainAssets/chill/img/logo-chill-sans-slogan_white.png';