mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-08-20 14:43:49 +00:00
Setup alias for use in standalone chill-bundles project and replace relative paths
This commit is contained in:
@@ -70,7 +70,8 @@ const clickOnAddButton = () => {
|
||||
<style scoped lang="scss">
|
||||
.item-bloc {
|
||||
&.isPicked {
|
||||
background: linear-gradient(
|
||||
background:
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(25, 135, 84, 1) 0px,
|
||||
rgba(25, 135, 84, 0) 9px
|
||||
|
||||
@@ -1,61 +1,65 @@
|
||||
<template>
|
||||
<span v-if="entity.type === 'person'" class="badge rounded-pill bg-person">
|
||||
{{ $t("person") }}
|
||||
<span
|
||||
v-if="props.entity.type === 'person'"
|
||||
class="badge rounded-pill bg-person"
|
||||
>
|
||||
{{ trans(PERSON) }}
|
||||
</span>
|
||||
|
||||
<span
|
||||
v-if="entity.type === 'thirdparty'"
|
||||
v-if="props.entity.type === 'thirdparty'"
|
||||
class="badge rounded-pill bg-thirdparty"
|
||||
>
|
||||
<template v-if="options.displayLong !== true">
|
||||
{{ $t("thirdparty.thirdparty") }}
|
||||
<template v-if="props.options.displayLong !== true">
|
||||
{{ trans(THIRDPARTY) }}
|
||||
</template>
|
||||
|
||||
<i class="fa fa-fw fa-user" v-if="entity.kind === 'child'" />
|
||||
<i class="fa fa-fw fa-user" v-if="props.entity.kind === 'child'" />
|
||||
<i
|
||||
class="fa fa-fw fa-hospital-o"
|
||||
v-else-if="entity.kind === 'company'"
|
||||
v-else-if="props.entity.kind === 'company'"
|
||||
/>
|
||||
<i class="fa fa-fw fa-user-md" v-else />
|
||||
|
||||
<template v-if="options.displayLong === true">
|
||||
<span v-if="entity.kind === 'child'">{{
|
||||
$t("thirdparty.child")
|
||||
<template v-if="props.options.displayLong === true">
|
||||
<span v-if="props.entity.kind === 'child'">{{
|
||||
trans(THIRDPARTY_CONTACT_OF)
|
||||
}}</span>
|
||||
<span v-else-if="entity.kind === 'company'">{{
|
||||
$t("thirdparty.company")
|
||||
<span v-else-if="props.entity.kind === 'company'">{{
|
||||
trans(THIRDPARTY_A_CONTACT)
|
||||
}}</span>
|
||||
<span v-else>{{ $t("thirdparty.contact") }}</span>
|
||||
</template>
|
||||
</span>
|
||||
|
||||
<span v-if="entity.type === 'user'" class="badge rounded-pill bg-user">
|
||||
{{ $t("user") }}
|
||||
<span
|
||||
v-if="props.entity.type === 'user'"
|
||||
class="badge rounded-pill bg-user"
|
||||
>
|
||||
{{ trans(ACCEPTED_USERS) }}
|
||||
</span>
|
||||
|
||||
<span v-if="entity.type === 'household'" class="badge rounded-pill bg-user">
|
||||
{{ $t("household") }}
|
||||
<span
|
||||
v-if="props.entity.type === 'household'"
|
||||
class="badge rounded-pill bg-user"
|
||||
>
|
||||
{{ trans(HOUSEHOLD) }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "BadgeEntity",
|
||||
props: ["options", "entity"],
|
||||
i18n: {
|
||||
messages: {
|
||||
fr: {
|
||||
person: "Usager",
|
||||
thirdparty: {
|
||||
thirdparty: "Tiers",
|
||||
child: "Personne de contact",
|
||||
company: "Personne morale",
|
||||
contact: "Personne physique",
|
||||
},
|
||||
user: "TMS",
|
||||
household: "Ménage",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
<script setup>
|
||||
import {
|
||||
trans,
|
||||
HOUSEHOLD,
|
||||
ACCEPTED_USERS,
|
||||
THIRDPARTY_A_CONTACT,
|
||||
THIRDPARTY_CONTACT_OF,
|
||||
PERSON,
|
||||
THIRDPARTY,
|
||||
} from "translator";
|
||||
|
||||
const props = defineProps({
|
||||
options: Object,
|
||||
entity: Object,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -66,13 +66,13 @@
|
||||
<div v-if="useDatePane === true" class="address-more">
|
||||
<div v-if="address.validFrom">
|
||||
<span class="validFrom">
|
||||
<b>{{ $t("validFrom") }}</b
|
||||
<b>{{ trans(ADDRESS_VALID_FROM) }}</b
|
||||
>: {{ $d(address.validFrom.date) }}
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="address.validTo">
|
||||
<span class="validTo">
|
||||
<b>{{ $t("validTo") }}</b
|
||||
<b>{{ trans(ADDRESS_VALID_TO) }}</b
|
||||
>: {{ $d(address.validTo.date) }}
|
||||
</span>
|
||||
</div>
|
||||
@@ -83,6 +83,7 @@
|
||||
<script>
|
||||
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 "translator";
|
||||
|
||||
export default {
|
||||
name: "AddressRenderBox",
|
||||
@@ -107,6 +108,9 @@ export default {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
setup() {
|
||||
return { trans, ADDRESS_VALID_FROM, ADDRESS_VALID_TO };
|
||||
},
|
||||
computed: {
|
||||
component() {
|
||||
return this.isMultiline === true ? "div" : "span";
|
||||
|
||||
@@ -6,8 +6,8 @@
|
||||
v-if="!subscriberFinal"
|
||||
@click="subscribeTo('subscribe', 'final')"
|
||||
>
|
||||
<i class="fa fa-check fa-fw" />
|
||||
{{ $t("subscribe_final") }}
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
{{ trans(WORKFLOW_SUBSCRIBE_FINAL) }}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-misc"
|
||||
@@ -15,8 +15,8 @@
|
||||
v-if="subscriberFinal"
|
||||
@click="subscribeTo('unsubscribe', 'final')"
|
||||
>
|
||||
<i class="fa fa-times fa-fw" />
|
||||
{{ $t("unsubscribe_final") }}
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
{{ trans(WORKFLOW_UNSUBSCRIBE_FINAL) }}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-misc"
|
||||
@@ -24,8 +24,8 @@
|
||||
v-if="!subscriberStep"
|
||||
@click="subscribeTo('subscribe', 'step')"
|
||||
>
|
||||
<i class="fa fa-check fa-fw" />
|
||||
{{ $t("subscribe_all_steps") }}
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
{{ trans(WORKFLOW_SUBSCRIBE_ALL_STEPS) }}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-misc"
|
||||
@@ -33,94 +33,55 @@
|
||||
v-if="subscriberStep"
|
||||
@click="subscribeTo('unsubscribe', 'step')"
|
||||
>
|
||||
<i class="fa fa-times fa-fw" />
|
||||
{{ $t("unsubscribe_all_steps") }}
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
{{ trans(WORKFLOW_UNSUBSCRIBE_ALL_STEPS) }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<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 "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
|
||||
const props = defineProps({
|
||||
entityWorkflowId: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
props: {
|
||||
entityWorkflowId: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
subscriberStep: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
subscriberFinal: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
subscriberStep: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
emits: ["subscriptionUpdated"],
|
||||
methods: {
|
||||
subscribeTo(step, to) {
|
||||
let params = new URLSearchParams();
|
||||
params.set("subscribe", to);
|
||||
subscriberFinal: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
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);
|
||||
});
|
||||
},
|
||||
},
|
||||
const url =
|
||||
`/api/1.0/main/workflow/${props.entityWorkflowId}/${step}?` +
|
||||
params.toString();
|
||||
|
||||
makeFetch("POST", url).then((response) => {
|
||||
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>
|
||||
|
||||
<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>
|
||||
|
||||
<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>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="flex-table workflow" id="workflow-list">
|
||||
<div
|
||||
v-for="(w, i) in workflows"
|
||||
v-for="(w, i) in props.workflows"
|
||||
:key="`workflow-${i}`"
|
||||
class="item-bloc"
|
||||
>
|
||||
@@ -48,7 +48,7 @@
|
||||
<span
|
||||
v-if="w.isOnHoldAtCurrentStep"
|
||||
class="badge bg-success rounded-pill"
|
||||
>{{ $t("on_hold") }}</span
|
||||
>{{ trans(WORKFLOW_ON_HOLD) }}</span
|
||||
>
|
||||
</div>
|
||||
|
||||
@@ -56,11 +56,11 @@
|
||||
<div class="item-col flex-grow-1">
|
||||
<p v-if="isUserSubscribedToStep(w)">
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
{{ $t("you_subscribed_to_all_steps") }}
|
||||
{{ trans(WORKFLOW_YOU_SUBSCRIBED_TO_ALL_STEPS) }}
|
||||
</p>
|
||||
<p v-if="isUserSubscribedToFinal(w)">
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
{{ $t("you_subscribed_to_final_step") }}
|
||||
{{ trans(WORKFLOW_YOU_SUBSCRIBED_TO_FINAL_STEP) }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="item-col">
|
||||
@@ -69,7 +69,7 @@
|
||||
<a
|
||||
:href="goToUrl(w)"
|
||||
class="btn btn-sm btn-show"
|
||||
:title="$t('action.show')"
|
||||
:title="trans(SEE)"
|
||||
></a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -79,85 +79,65 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup>
|
||||
import Popover from "bootstrap/js/src/popover";
|
||||
import { onMounted } from "vue";
|
||||
import {
|
||||
trans,
|
||||
BY_USER,
|
||||
SEE,
|
||||
WORKFLOW_YOU_SUBSCRIBED_TO_ALL_STEPS,
|
||||
WORKFLOW_YOU_SUBSCRIBED_TO_FINAL_STEP,
|
||||
WORKFLOW_ON_HOLD,
|
||||
WORKFLOW_AT,
|
||||
} from "translator";
|
||||
|
||||
const i18n = {
|
||||
messages: {
|
||||
fr: {
|
||||
you_subscribed_to_all_steps:
|
||||
"Vous recevrez une notification à chaque étape",
|
||||
you_subscribed_to_final_step:
|
||||
"Vous recevrez une notification à l'étape finale",
|
||||
by: "Par",
|
||||
at: "Le",
|
||||
on_hold: "En attente",
|
||||
},
|
||||
// props
|
||||
const props = defineProps({
|
||||
workflows: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
// methods
|
||||
const goToUrl = (w) => `/fr/main/workflow/${w.id}/show`;
|
||||
const getPopTitle = (step) => {
|
||||
if (step.transitionPrevious != null) {
|
||||
//console.log(step.transitionPrevious.text);
|
||||
let freezed = step.isFreezed
|
||||
? `<i class="fa fa-snowflake-o fa-sm me-1"></i>`
|
||||
: ``;
|
||||
return `${freezed}${step.transitionPrevious.text}`;
|
||||
}
|
||||
};
|
||||
const getPopContent = (step) => {
|
||||
if (step.transitionPrevious != null) {
|
||||
if (step.transitionPreviousBy !== null) {
|
||||
return `<ul class="small_in_title">
|
||||
<li><span class="item-key">${trans(BY_USER)} : </span><b>${step.transitionPreviousBy.text}</b></li>
|
||||
<li><span class="item-key">${trans(WORKFLOW_AT)} : </span><b>${formatDate(step.transitionPreviousAt.datetime)}</b></li>
|
||||
</ul>`;
|
||||
} else {
|
||||
return `<ul class="small_in_title">
|
||||
<li><span class="item-key">${trans(WORKFLOW_AT)} : </span><b>${formatDate(step.transitionPreviousAt.datetime)}</b></li>
|
||||
</ul>`;
|
||||
}
|
||||
}
|
||||
};
|
||||
const formatDate = (datetime) =>
|
||||
datetime.split("T")[0] + " " + datetime.split("T")[1].substring(0, 5);
|
||||
const isUserSubscribedToStep = () => false;
|
||||
const isUserSubscribedToFinal = () => false;
|
||||
|
||||
export default {
|
||||
name: "ListWorkflow",
|
||||
i18n: i18n,
|
||||
props: {
|
||||
workflows: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
goToUrl(w) {
|
||||
return `/fr/main/workflow/${w.id}/show`;
|
||||
},
|
||||
getPopTitle(step) {
|
||||
if (step.transitionPrevious != null) {
|
||||
//console.log(step.transitionPrevious.text);
|
||||
let freezed = step.isFreezed
|
||||
? `<i class="fa fa-snowflake-o fa-sm me-1"></i>`
|
||||
: ``;
|
||||
return `${freezed}${step.transitionPrevious.text}`;
|
||||
}
|
||||
},
|
||||
getPopContent(step) {
|
||||
if (step.transitionPrevious != null) {
|
||||
if (step.transitionPreviousBy !== null) {
|
||||
return `<ul class="small_in_title">
|
||||
<li><span class="item-key">${i18n.messages.fr.by} : </span><b>${step.transitionPreviousBy.text}</b></li>
|
||||
<li><span class="item-key">${i18n.messages.fr.at} : </span><b>${this.formatDate(step.transitionPreviousAt.datetime)}</b></li>
|
||||
</ul>`;
|
||||
} else {
|
||||
return `<ul class="small_in_title">
|
||||
<li><span class="item-key">${i18n.messages.fr.at} : </span><b>${this.formatDate(step.transitionPreviousAt.datetime)}</b></li>
|
||||
</ul>`;
|
||||
}
|
||||
}
|
||||
},
|
||||
formatDate(datetime) {
|
||||
return (
|
||||
datetime.split("T")[0] +
|
||||
" " +
|
||||
datetime.split("T")[1].substring(0, 5)
|
||||
);
|
||||
},
|
||||
isUserSubscribedToStep(w) {
|
||||
// todo
|
||||
return false;
|
||||
},
|
||||
isUserSubscribedToFinal(w) {
|
||||
// todo
|
||||
return false;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
const triggerList = [].slice.call(
|
||||
document.querySelectorAll('[data-bs-toggle="popover"]'),
|
||||
);
|
||||
const popoverList = triggerList.map(function (el) {
|
||||
//console.log('popover', el)
|
||||
return new Popover(el, {
|
||||
html: true,
|
||||
});
|
||||
onMounted(() => {
|
||||
const triggerList = [].slice.call(
|
||||
document.querySelectorAll('[data-bs-toggle="popover"]'),
|
||||
);
|
||||
triggerList.map(function (el) {
|
||||
return new Popover(el, {
|
||||
html: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,23 +1,24 @@
|
||||
<template>
|
||||
<pick-workflow
|
||||
:relatedEntityClass="this.relatedEntityClass"
|
||||
:relatedEntityId="this.relatedEntityId"
|
||||
:workflowsAvailables="workflowsAvailables"
|
||||
:preventDefaultMoveToGenerate="this.$props.preventDefaultMoveToGenerate"
|
||||
:goToGenerateWorkflowPayload="this.goToGenerateWorkflowPayload"
|
||||
<Pick-workflow
|
||||
:relatedEntityClass="props.relatedEntityClass"
|
||||
:relatedEntityId="props.relatedEntityId"
|
||||
:workflowsAvailables="props.workflowsAvailables"
|
||||
:preventDefaultMoveToGenerate="props.preventDefaultMoveToGenerate"
|
||||
:goToGenerateWorkflowPayload="props.goToGenerateWorkflowPayload"
|
||||
:countExistingWorkflows="countWorkflows"
|
||||
:embedded-within-list-modal="false"
|
||||
@go-to-generate-workflow="goToGenerateWorkflow"
|
||||
@click-open-list="openModal"
|
||||
></pick-workflow>
|
||||
></Pick-workflow>
|
||||
|
||||
<teleport to="body">
|
||||
<modal
|
||||
<Modal
|
||||
v-if="modal.showModal"
|
||||
:modalDialogClass="modal.modalDialogClass"
|
||||
@close="modal.showModal = false"
|
||||
>
|
||||
<template v-slot:header>
|
||||
<h2 class="modal-title">{{ $t("workflow_list") }}</h2>
|
||||
<h2 class="modal-title">{{ trans(WORKFLOW_LIST) }}</h2>
|
||||
</template>
|
||||
|
||||
<template v-slot:body>
|
||||
@@ -27,103 +28,80 @@
|
||||
<template v-slot:footer>
|
||||
<pick-workflow
|
||||
v-if="allowCreate"
|
||||
:relatedEntityClass="this.relatedEntityClass"
|
||||
:relatedEntityId="this.relatedEntityId"
|
||||
:workflowsAvailables="workflowsAvailables"
|
||||
:relatedEntityClass="props.relatedEntityClass"
|
||||
:relatedEntityId="props.relatedEntityId"
|
||||
:workflowsAvailables="props.workflowsAvailables"
|
||||
:preventDefaultMoveToGenerate="
|
||||
this.$props.preventDefaultMoveToGenerate
|
||||
props.preventDefaultMoveToGenerate
|
||||
"
|
||||
:goToGenerateWorkflowPayload="
|
||||
this.goToGenerateWorkflowPayload
|
||||
props.goToGenerateWorkflowPayload
|
||||
"
|
||||
:countExistingWorkflows="countWorkflows"
|
||||
:embedded-within-list-modal="true"
|
||||
@go-to-generate-workflow="this.goToGenerateWorkflow"
|
||||
@go-to-generate-workflow="goToGenerateWorkflow"
|
||||
></pick-workflow>
|
||||
</template>
|
||||
</modal>
|
||||
</Modal>
|
||||
</teleport>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, computed, defineProps, defineEmits } from "vue";
|
||||
import Modal from "ChillMainAssets/vuejs/_components/Modal";
|
||||
import PickWorkflow from "ChillMainAssets/vuejs/_components/EntityWorkflow/PickWorkflow.vue";
|
||||
import ListWorkflowVue from "ChillMainAssets/vuejs/_components/EntityWorkflow/ListWorkflow.vue";
|
||||
import { trans, WORKFLOW_LIST } from "translator";
|
||||
|
||||
export default {
|
||||
name: "ListWorkflowModal",
|
||||
components: {
|
||||
Modal,
|
||||
PickWorkflow,
|
||||
ListWorkflowVue,
|
||||
// Define props
|
||||
const props = defineProps({
|
||||
workflows: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
emits: ["goToGenerateWorkflow"],
|
||||
props: {
|
||||
workflows: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
allowCreate: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
relatedEntityClass: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
relatedEntityId: {
|
||||
type: Number,
|
||||
required: false,
|
||||
},
|
||||
workflowsAvailables: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
preventDefaultMoveToGenerate: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
goToGenerateWorkflowPayload: {
|
||||
required: false,
|
||||
default: {},
|
||||
},
|
||||
allowCreate: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl",
|
||||
},
|
||||
};
|
||||
relatedEntityClass: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
computed: {
|
||||
countWorkflows() {
|
||||
return this.workflows.length;
|
||||
},
|
||||
hasWorkflow() {
|
||||
return this.countWorkflows > 0;
|
||||
},
|
||||
relatedEntityId: {
|
||||
type: Number,
|
||||
required: false,
|
||||
},
|
||||
methods: {
|
||||
openModal() {
|
||||
this.modal.showModal = true;
|
||||
},
|
||||
goToGenerateWorkflow(data) {
|
||||
console.log("go to generate workflow intercepted", data);
|
||||
this.$emit("goToGenerateWorkflow", data);
|
||||
},
|
||||
workflowsAvailables: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
i18n: {
|
||||
messages: {
|
||||
fr: {
|
||||
workflow_list: "Liste des workflows associés",
|
||||
workflow: " workflow associé",
|
||||
workflows: " workflows associés",
|
||||
},
|
||||
},
|
||||
preventDefaultMoveToGenerate: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
};
|
||||
goToGenerateWorkflowPayload: {
|
||||
required: false,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
|
||||
// Define emits
|
||||
const emit = defineEmits(["goToGenerateWorkflow"]);
|
||||
|
||||
// Reactive data
|
||||
const modal = ref({
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-xl",
|
||||
});
|
||||
|
||||
// Computed properties
|
||||
const countWorkflows = computed(() => props.workflows.length);
|
||||
|
||||
// Methods
|
||||
const openModal = () => (modal.value.showModal = true);
|
||||
|
||||
const goToGenerateWorkflow = (data) => emit("goToGenerateWorkflow", data);
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@@ -8,28 +8,28 @@
|
||||
aria-modal="true"
|
||||
role="dialog"
|
||||
>
|
||||
<div class="modal-dialog" :class="modalDialogClass">
|
||||
<div class="modal-dialog" :class="props.modalDialogClass || {}">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<slot name="header" />
|
||||
<button class="close btn" @click="$emit('close')">
|
||||
<i class="fa fa-times" aria-hidden="true" />
|
||||
<slot name="header"></slot>
|
||||
<button class="close btn" @click="emits('close')">
|
||||
<i class="fa fa-times" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="body-head">
|
||||
<slot name="body-head" />
|
||||
<slot name="body-head"></slot>
|
||||
</div>
|
||||
<slot name="body" />
|
||||
<slot name="body"></slot>
|
||||
</div>
|
||||
<div class="modal-footer" v-if="!hideFooter">
|
||||
<button
|
||||
class="btn btn-cancel"
|
||||
@click="$emit('close')"
|
||||
@click="emits('close')"
|
||||
>
|
||||
{{ $t("action.close") }}
|
||||
{{ trans(MODAL_ACTION_CLOSE) }}
|
||||
</button>
|
||||
<slot name="footer" />
|
||||
<slot name="footer"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -39,8 +39,7 @@
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
<script lang="ts" 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
|
||||
@@ -50,22 +49,23 @@ import { defineComponent } from "vue";
|
||||
* [+] using bootstrap css classes, the modal have a responsive behaviour,
|
||||
* [+] modal design can be configured using css classes (size, scroll)
|
||||
*/
|
||||
export default defineComponent({
|
||||
name: "Modal",
|
||||
props: {
|
||||
modalDialogClass: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: {},
|
||||
},
|
||||
hideFooter: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
emits: ["close"],
|
||||
import { trans, MODAL_ACTION_CLOSE } from "translator";
|
||||
import { defineProps } from "vue";
|
||||
|
||||
export interface ModalProps {
|
||||
modalDialogClass: object | null;
|
||||
hideFooter: boolean;
|
||||
}
|
||||
|
||||
// Define the props
|
||||
const props = withDefaults(defineProps<ModalProps>(), {
|
||||
hideFooter: false,
|
||||
modalDialogClass: null,
|
||||
});
|
||||
|
||||
const emits = defineEmits<{
|
||||
close: [];
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@@ -9,12 +9,12 @@
|
||||
class="btn"
|
||||
:class="overrideClass"
|
||||
type="button"
|
||||
:title="$t('markAsUnread')"
|
||||
:title="trans(NOTIFICATION_MARK_AS_UNREAD)"
|
||||
@click="markAsUnread"
|
||||
>
|
||||
<i class="fa fa-sm fa-envelope-o" />
|
||||
<span v-if="!buttonNoText" class="ps-2">
|
||||
{{ $t("markAsUnread") }}
|
||||
<i class="fa fa-sm fa-envelope-o"></i>
|
||||
<span v-if="!props.buttonNoText" class="ps-2">
|
||||
{{ trans(NOTIFICATION_MARK_AS_UNREAD) }}
|
||||
</span>
|
||||
</button>
|
||||
|
||||
@@ -23,12 +23,12 @@
|
||||
class="btn"
|
||||
:class="overrideClass"
|
||||
type="button"
|
||||
:title="$t('markAsRead')"
|
||||
:title="trans(NOTIFICATION_MARK_AS_READ)"
|
||||
@click="markAsRead"
|
||||
>
|
||||
<i class="fa fa-sm fa-envelope-open-o" />
|
||||
<i class="fa fa-sm fa-envelope-open-o"></i>
|
||||
<span v-if="!buttonNoText" class="ps-2">
|
||||
{{ $t("markAsRead") }}
|
||||
{{ trans(NOTIFICATION_MARK_AS_READ) }}
|
||||
</span>
|
||||
</button>
|
||||
|
||||
@@ -37,9 +37,9 @@
|
||||
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 class="fa fa-sm fa-comment-o"></i>
|
||||
</a>
|
||||
|
||||
<!-- "Mark All Read" button -->
|
||||
@@ -51,7 +51,7 @@
|
||||
:title="$t('markAllRead')"
|
||||
@click="markAllRead"
|
||||
>
|
||||
<i class="fa fa-sm fa-envelope-o" />
|
||||
<i class="fa fa-sm fa-envelope-o"></i>
|
||||
<span v-if="!buttonNoText" class="ps-2">
|
||||
{{ $t("markAllRead") }}
|
||||
</span>
|
||||
@@ -59,89 +59,66 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup>
|
||||
import { computed } from "vue";
|
||||
import { makeFetch } from "ChillMainAssets/lib/api/apiMethods.ts";
|
||||
import {
|
||||
trans,
|
||||
NOTIFICATION_MARK_AS_READ,
|
||||
NOTIFICATION_MARK_AS_UNREAD,
|
||||
SEE,
|
||||
} from "translator";
|
||||
|
||||
export default {
|
||||
name: "NotificationReadToggle",
|
||||
props: {
|
||||
isRead: {
|
||||
required: true,
|
||||
type: Boolean,
|
||||
},
|
||||
notificationId: {
|
||||
required: true,
|
||||
type: Number,
|
||||
},
|
||||
// Optional
|
||||
buttonClass: {
|
||||
required: false,
|
||||
type: String,
|
||||
},
|
||||
buttonNoText: {
|
||||
required: false,
|
||||
type: Boolean,
|
||||
},
|
||||
showUrl: {
|
||||
required: false,
|
||||
type: String,
|
||||
},
|
||||
// Props
|
||||
const props = defineProps({
|
||||
isRead: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
emits: ["markRead", "markUnread"],
|
||||
computed: {
|
||||
/// [Option] override default button appearance (btn-misc)
|
||||
overrideClass() {
|
||||
return this.buttonClass ? this.buttonClass : "btn-misc";
|
||||
},
|
||||
/// [Option] don't display text on button
|
||||
buttonHideText() {
|
||||
return this.buttonNoText;
|
||||
},
|
||||
/// [Option] showUrl is href for show page second button.
|
||||
// When passed, the component return a button-group with 2 buttons.
|
||||
isButtonGroup() {
|
||||
return this.showUrl;
|
||||
},
|
||||
notificationId: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
methods: {
|
||||
markAsUnread() {
|
||||
makeFetch(
|
||||
"POST",
|
||||
`/api/1.0/main/notification/${this.notificationId}/mark/unread`,
|
||||
[],
|
||||
).then(() => {
|
||||
this.$emit("markRead", { notificationId: this.notificationId });
|
||||
});
|
||||
},
|
||||
markAsRead() {
|
||||
makeFetch(
|
||||
"POST",
|
||||
`/api/1.0/main/notification/${this.notificationId}/mark/read`,
|
||||
[],
|
||||
).then(() => {
|
||||
this.$emit("markUnread", {
|
||||
notificationId: this.notificationId,
|
||||
});
|
||||
});
|
||||
},
|
||||
markAllRead() {
|
||||
makeFetch(
|
||||
"POST",
|
||||
`/api/1.0/main/notification/markallread`,
|
||||
[],
|
||||
).then(() => {
|
||||
this.$emit("markAllRead");
|
||||
});
|
||||
},
|
||||
buttonClass: {
|
||||
type: String,
|
||||
required: false,
|
||||
},
|
||||
i18n: {
|
||||
messages: {
|
||||
fr: {
|
||||
markAsUnread: "Marquer comme non-lu",
|
||||
markAsRead: "Marquer comme lu",
|
||||
},
|
||||
},
|
||||
buttonNoText: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
},
|
||||
showUrl: {
|
||||
type: String,
|
||||
required: false,
|
||||
},
|
||||
});
|
||||
|
||||
// Emits
|
||||
const emit = defineEmits(["markRead", "markUnread"]);
|
||||
|
||||
// Computed
|
||||
const overrideClass = computed(() => props.buttonClass || "btn-misc");
|
||||
const isButtonGroup = computed(() => props.showUrl);
|
||||
|
||||
// Methods
|
||||
const markAsUnread = () => {
|
||||
makeFetch(
|
||||
"POST",
|
||||
`/api/1.0/main/notification/${props.notificationId}/mark/unread`,
|
||||
[],
|
||||
).then(() => {
|
||||
emit("markRead", { notificationId: props.notificationId });
|
||||
});
|
||||
};
|
||||
|
||||
const markAsRead = () => {
|
||||
makeFetch(
|
||||
"POST",
|
||||
`/api/1.0/main/notification/${props.notificationId}/mark/read`,
|
||||
[],
|
||||
).then(() => {
|
||||
emit("markUnread", { notificationId: props.notificationId });
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -8,10 +8,10 @@
|
||||
]"
|
||||
@click="openModal"
|
||||
>
|
||||
<i v-if="isChangeIcon" class="fa me-2" :class="options.changeIcon" />
|
||||
<i v-if="isChangeIcon" class="fa me-2" :class="options.changeIcon"></i>
|
||||
|
||||
<span v-if="!noText">
|
||||
{{ $t("online_edit_document") }}
|
||||
{{ trans(WOPI_ONLINE_EDIT_DOCUMENT) }}
|
||||
</span>
|
||||
</a>
|
||||
|
||||
@@ -19,8 +19,8 @@
|
||||
<div class="wopi-frame" v-if="isOpenDocument">
|
||||
<modal
|
||||
v-if="modal.showModal"
|
||||
:modal-dialog-class="modal.modalDialogClass"
|
||||
:hide-footer="true"
|
||||
:modalDialogClass="modal.modalDialogClass"
|
||||
:hideFooter="true"
|
||||
@close="modal.showModal = false"
|
||||
>
|
||||
<template #header>
|
||||
@@ -28,203 +28,164 @@
|
||||
<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 #body>
|
||||
<div v-if="loading" class="loading">
|
||||
<i
|
||||
class="fa fa-circle-o-notch fa-spin fa-3x"
|
||||
:title="$t('loading')"
|
||||
/>
|
||||
:title="trans(WOPI_LOADING)"
|
||||
></i>
|
||||
</div>
|
||||
<iframe :src="this.wopiUrl" @load="loaded" />
|
||||
<iframe :src="this.wopiUrl" @load="loaded"></iframe>
|
||||
</template>
|
||||
</modal>
|
||||
</div>
|
||||
<div v-else>
|
||||
<modal
|
||||
<Modal
|
||||
v-if="modal.showModal"
|
||||
modal-dialog-class="modal-sm"
|
||||
modalDialogClass="modal-sm"
|
||||
@close="modal.showModal = false"
|
||||
>
|
||||
<template #header>
|
||||
<h3>{{ $t("invalid_title") }}</h3>
|
||||
<template v-slot:header>
|
||||
<h3>{{ trans(WOPI_INVALID_TITLE) }}</h3>
|
||||
</template>
|
||||
<template #body>
|
||||
<template v-slot:body>
|
||||
<div class="alert alert-warning">
|
||||
{{ $t("invalid_message") }}
|
||||
{{ trans(WOPI_ONLINE_EDIT_DOCUMENT) }}
|
||||
</div>
|
||||
</template>
|
||||
</modal>
|
||||
</Modal>
|
||||
</div>
|
||||
</teleport>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, computed } from "vue";
|
||||
import {
|
||||
trans,
|
||||
WOPI_ONLINE_EDIT_DOCUMENT,
|
||||
WOPI_INVALID_TITLE,
|
||||
WOPI_LOADING,
|
||||
} from "translator";
|
||||
import Modal from "ChillMainAssets/vuejs/_components/Modal";
|
||||
import logo from "ChillMainAssets/chill/img/logo-chill-sans-slogan_white.png";
|
||||
|
||||
export default {
|
||||
name: "OpenWopiLink",
|
||||
components: {
|
||||
Modal,
|
||||
// Props
|
||||
const props = defineProps({
|
||||
wopiUrl: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
props: {
|
||||
wopiUrl: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
options: {
|
||||
type: Object,
|
||||
required: false,
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-fullscreen", //modal-dialog-scrollable
|
||||
},
|
||||
logo: logo,
|
||||
loading: false,
|
||||
mime: [
|
||||
// TODO temporary hardcoded. to be replaced by twig extension or a collabora server query
|
||||
"application/clarisworks",
|
||||
"application/coreldraw",
|
||||
"application/macwriteii",
|
||||
"application/msword",
|
||||
"application/pdf",
|
||||
"application/vnd.lotus-1-2-3",
|
||||
"application/vnd.ms-excel",
|
||||
"application/vnd.ms-excel.sheet.binary.macroEnabled.12",
|
||||
"application/vnd.ms-excel.sheet.macroEnabled.12",
|
||||
"application/vnd.ms-excel.template.macroEnabled.12",
|
||||
"application/vnd.ms-powerpoint",
|
||||
"application/vnd.ms-powerpoint.presentation.macroEnabled.12",
|
||||
"application/vnd.ms-powerpoint.template.macroEnabled.12",
|
||||
"application/vnd.ms-visio.drawing",
|
||||
"application/vnd.ms-word.document.macroEnabled.12",
|
||||
"application/vnd.ms-word.template.macroEnabled.12",
|
||||
"application/vnd.ms-works",
|
||||
"application/vnd.oasis.opendocument.chart",
|
||||
"application/vnd.oasis.opendocument.formula",
|
||||
"application/vnd.oasis.opendocument.graphics",
|
||||
"application/vnd.oasis.opendocument.graphics-flat-xml",
|
||||
"application/vnd.oasis.opendocument.graphics-template",
|
||||
"application/vnd.oasis.opendocument.presentation",
|
||||
"application/vnd.oasis.opendocument.presentation-flat-xml",
|
||||
"application/vnd.oasis.opendocument.presentation-template",
|
||||
"application/vnd.oasis.opendocument.spreadsheet",
|
||||
"application/vnd.oasis.opendocument.spreadsheet-flat-xml",
|
||||
"application/vnd.oasis.opendocument.spreadsheet-template",
|
||||
"application/vnd.oasis.opendocument.text",
|
||||
"application/vnd.oasis.opendocument.text-flat-xml",
|
||||
"application/vnd.oasis.opendocument.text-master",
|
||||
"application/vnd.oasis.opendocument.text-master-template",
|
||||
"application/vnd.oasis.opendocument.text-template",
|
||||
"application/vnd.oasis.opendocument.text-web",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.presentation",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.slideshow",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.template",
|
||||
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
||||
"application/vnd.openxmlformats-officedocument.spreadsheetml.template",
|
||||
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
||||
"application/vnd.openxmlformats-officedocument.wordprocessingml.template",
|
||||
"application/vnd.sun.xml.calc",
|
||||
"application/vnd.sun.xml.calc.template",
|
||||
"application/vnd.sun.xml.chart",
|
||||
"application/vnd.sun.xml.draw",
|
||||
"application/vnd.sun.xml.draw.template",
|
||||
"application/vnd.sun.xml.impress",
|
||||
"application/vnd.sun.xml.impress.template",
|
||||
"application/vnd.sun.xml.math",
|
||||
"application/vnd.sun.xml.writer",
|
||||
"application/vnd.sun.xml.writer.global",
|
||||
"application/vnd.sun.xml.writer.template",
|
||||
"application/vnd.visio",
|
||||
"application/vnd.visio2013",
|
||||
"application/vnd.wordperfect",
|
||||
"application/x-abiword",
|
||||
"application/x-aportisdoc",
|
||||
"application/x-dbase",
|
||||
"application/x-dif-document",
|
||||
"application/x-fictionbook+xml",
|
||||
"application/x-gnumeric",
|
||||
"application/x-hwp",
|
||||
"application/x-iwork-keynote-sffkey",
|
||||
"application/x-iwork-numbers-sffnumbers",
|
||||
"application/x-iwork-pages-sffpages",
|
||||
"application/x-mspublisher",
|
||||
"application/x-mswrite",
|
||||
"application/x-pagemaker",
|
||||
"application/x-sony-bbeb",
|
||||
"application/x-t602",
|
||||
],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isOpenDocument() {
|
||||
if (this.mime.indexOf(this.type) !== -1) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
noText() {
|
||||
if (typeof this.options.noText !== "undefined") {
|
||||
return this.options.noText === true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
isChangeIcon() {
|
||||
if (typeof this.options.changeIcon !== "undefined") {
|
||||
return !(
|
||||
this.options.changeIcon === null ||
|
||||
this.options.changeIcon === ""
|
||||
);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
isChangeClass() {
|
||||
if (typeof this.options.changeClass !== "undefined") {
|
||||
return !(
|
||||
this.options.changeClass === null ||
|
||||
this.options.changeClass === ""
|
||||
);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
openModal() {
|
||||
this.loading = true;
|
||||
this.modal.showModal = true;
|
||||
},
|
||||
loaded() {
|
||||
this.loading = false;
|
||||
},
|
||||
},
|
||||
i18n: {
|
||||
messages: {
|
||||
fr: {
|
||||
online_edit_document: "Éditer en ligne",
|
||||
save_and_quit: "Enregistrer et quitter",
|
||||
loading: "Chargement de l'éditeur en ligne",
|
||||
invalid_title: "Format incompatible",
|
||||
invalid_message:
|
||||
"Désolé, ce format de document n'est pas éditable en ligne.",
|
||||
},
|
||||
},
|
||||
options: {
|
||||
type: Object,
|
||||
required: false,
|
||||
},
|
||||
});
|
||||
|
||||
// data
|
||||
const modal = ref({
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-fullscreen",
|
||||
});
|
||||
const loading = ref(false);
|
||||
|
||||
// MIME types
|
||||
const mime = [
|
||||
// TODO temporary hardcoded. to be replaced by twig extension or a collabora server query
|
||||
"application/clarisworks",
|
||||
"application/coreldraw",
|
||||
"application/macwriteii",
|
||||
"application/msword",
|
||||
"application/pdf",
|
||||
"application/vnd.lotus-1-2-3",
|
||||
"application/vnd.ms-excel",
|
||||
"application/vnd.ms-excel.sheet.binary.macroEnabled.12",
|
||||
"application/vnd.ms-excel.sheet.macroEnabled.12",
|
||||
"application/vnd.ms-excel.template.macroEnabled.12",
|
||||
"application/vnd.ms-powerpoint",
|
||||
"application/vnd.ms-powerpoint.presentation.macroEnabled.12",
|
||||
"application/vnd.ms-powerpoint.template.macroEnabled.12",
|
||||
"application/vnd.ms-visio.drawing",
|
||||
"application/vnd.ms-word.document.macroEnabled.12",
|
||||
"application/vnd.ms-word.template.macroEnabled.12",
|
||||
"application/vnd.ms-works",
|
||||
"application/vnd.oasis.opendocument.chart",
|
||||
"application/vnd.oasis.opendocument.formula",
|
||||
"application/vnd.oasis.opendocument.graphics",
|
||||
"application/vnd.oasis.opendocument.graphics-flat-xml",
|
||||
"application/vnd.oasis.opendocument.graphics-template",
|
||||
"application/vnd.oasis.opendocument.presentation",
|
||||
"application/vnd.oasis.opendocument.presentation-flat-xml",
|
||||
"application/vnd.oasis.opendocument.presentation-template",
|
||||
"application/vnd.oasis.opendocument.spreadsheet",
|
||||
"application/vnd.oasis.opendocument.spreadsheet-flat-xml",
|
||||
"application/vnd.oasis.opendocument.spreadsheet-template",
|
||||
"application/vnd.oasis.opendocument.text",
|
||||
"application/vnd.oasis.opendocument.text-flat-xml",
|
||||
"application/vnd.oasis.opendocument.text-master",
|
||||
"application/vnd.oasis.opendocument.text-master-template",
|
||||
"application/vnd.oasis.opendocument.text-template",
|
||||
"application/vnd.oasis.opendocument.text-web",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.presentation",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.slideshow",
|
||||
"application/vnd.openxmlformats-officedocument.presentationml.template",
|
||||
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
||||
"application/vnd.openxmlformats-officedocument.spreadsheetml.template",
|
||||
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
||||
"application/vnd.openxmlformats-officedocument.wordprocessingml.template",
|
||||
"application/vnd.sun.xml.calc",
|
||||
"application/vnd.sun.xml.calc.template",
|
||||
"application/vnd.sun.xml.chart",
|
||||
"application/vnd.sun.xml.draw",
|
||||
"application/vnd.sun.xml.draw.template",
|
||||
"application/vnd.sun.xml.impress",
|
||||
"application/vnd.sun.xml.impress.template",
|
||||
"application/vnd.sun.xml.math",
|
||||
"application/vnd.sun.xml.writer",
|
||||
"application/vnd.sun.xml.writer.global",
|
||||
"application/vnd.sun.xml.writer.template",
|
||||
"application/vnd.visio",
|
||||
"application/vnd.visio2013",
|
||||
"application/vnd.wordperfect",
|
||||
"application/x-abiword",
|
||||
"application/x-aportisdoc",
|
||||
"application/x-dbase",
|
||||
"application/x-dif-document",
|
||||
"application/x-fictionbook+xml",
|
||||
"application/x-gnumeric",
|
||||
"application/x-hwp",
|
||||
"application/x-iwork-keynote-sffkey",
|
||||
"application/x-iwork-numbers-sffnumbers",
|
||||
"application/x-iwork-pages-sffpages",
|
||||
"application/x-mspublisher",
|
||||
"application/x-mswrite",
|
||||
"application/x-pagemaker",
|
||||
"application/x-sony-bbeb",
|
||||
"application/x-t602",
|
||||
];
|
||||
|
||||
// Computed
|
||||
const isOpenDocument = computed(() => mime.includes(props.type));
|
||||
|
||||
const noText = computed(() => props.options?.noText === true);
|
||||
|
||||
const isChangeIcon = computed(() => !!props.options?.changeIcon);
|
||||
|
||||
const isChangeClass = computed(() => !!props.options?.changeClass);
|
||||
|
||||
// Methods
|
||||
const openModal = () => {
|
||||
loading.value = true;
|
||||
modal.value.showModal = true;
|
||||
};
|
||||
|
||||
const loaded = () => {
|
||||
loading.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user