Jeppe Bundgaard
3e8a7ee3db
- **CSS Enhancements:** Added `.pos-registration-control` class, improved styling for registration fields, and enhanced responsiveness for `.pos-order-items--order-detail`. - **Vue Refactor:** Standardized imports, object keys, and quotes in `ActionSettingsWheelButton.vue` to align with consistent formatting and readability.
1072 lines
38 KiB
Vue
1072 lines
38 KiB
Vue
<script setup>
|
|
import { defineProps, defineEmits, onMounted, onBeforeUnmount, computed, watch } from "vue";
|
|
import { useSlots } from "vue";
|
|
import { SessionUser } from "@/components/session/token/SessionUser.vue";
|
|
import ActionSettingsWheelItem from "@/components/displays/buttons/ActionSettingsWheelItem.vue";
|
|
import Swal from "sweetalert2";
|
|
import { ref } from "vue";
|
|
import CustomerModal from "@/components/displays/modals/CustomerModal.vue";
|
|
import ActionSettingsWheelItemLabel from "@/components/displays/buttons/ActionSettingsWheelItemLabel.vue";
|
|
import { useI18n } from "vue-i18n";
|
|
|
|
const { t } = useI18n();
|
|
const emit = defineEmits(["deleted"]);
|
|
const emitDeleted = () => {
|
|
emit("deleted");
|
|
};
|
|
const props = defineProps({
|
|
icon: {
|
|
type: String,
|
|
default: "fas fa-cog",
|
|
},
|
|
label: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
user_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
order_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
invoice_collection_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
reg_1: {
|
|
type: String,
|
|
default: null,
|
|
},
|
|
reg_2: {
|
|
type: String,
|
|
default: null,
|
|
},
|
|
order_booking_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
customer_number: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
refreshFunction: {
|
|
type: Function,
|
|
default: () => {
|
|
console.warn("Refresh function is not defined");
|
|
},
|
|
},
|
|
department_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
attachments: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
displayActionsDirectly: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
department_lane_id: {
|
|
type: Number,
|
|
default: null,
|
|
},
|
|
subuserGrant: {
|
|
type: Object,
|
|
default: null,
|
|
},
|
|
});
|
|
|
|
const customerModalVisible = ref(false);
|
|
const userIdFromCustomerNumber = ref(null);
|
|
const userLookupRequestId = ref(0);
|
|
const dropdownRoot = ref(null);
|
|
const isDropdownOpen = ref(false);
|
|
|
|
const closeDropdown = () => {
|
|
isDropdownOpen.value = false;
|
|
};
|
|
|
|
const toggleDropdown = () => {
|
|
isDropdownOpen.value = !isDropdownOpen.value;
|
|
};
|
|
|
|
const onActionSelected = () => {
|
|
closeDropdown();
|
|
};
|
|
|
|
const onDocumentClick = (event) => {
|
|
if (!isDropdownOpen.value) {
|
|
return;
|
|
}
|
|
|
|
if (dropdownRoot.value && !dropdownRoot.value.contains(event.target)) {
|
|
closeDropdown();
|
|
}
|
|
};
|
|
|
|
const onDocumentKeydown = (event) => {
|
|
if (event.key === "Escape") {
|
|
closeDropdown();
|
|
}
|
|
};
|
|
|
|
const resolveUserId = async () => {
|
|
if (props.user_id) {
|
|
userIdFromCustomerNumber.value = props.user_id;
|
|
return;
|
|
}
|
|
|
|
if (!props.customer_number) {
|
|
userIdFromCustomerNumber.value = null;
|
|
return;
|
|
}
|
|
|
|
const currentLookupId = userLookupRequestId.value + 1;
|
|
userLookupRequestId.value = currentLookupId;
|
|
|
|
try {
|
|
const response = await SessionUser.adminUser.customers.fromCustomerNumber.getUserId(props.customer_number);
|
|
if (currentLookupId !== userLookupRequestId.value) {
|
|
return;
|
|
}
|
|
|
|
userIdFromCustomerNumber.value = response?.data?.data?.user_id ?? null;
|
|
} catch (error) {
|
|
if (currentLookupId !== userLookupRequestId.value) {
|
|
return;
|
|
}
|
|
|
|
userIdFromCustomerNumber.value = null;
|
|
console.error(error);
|
|
}
|
|
};
|
|
|
|
watch(
|
|
() => [props.user_id, props.customer_number],
|
|
() => {
|
|
void resolveUserId();
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
|
|
const showSetCustomerPassword = (userId) => {
|
|
Swal.fire({
|
|
title: t("admin.pos.settings_wheel.change_password"),
|
|
html: `<input id="swal-input1" class="swal2-input" placeholder="${t("admin.pos.settings_wheel.enter_password")}">`,
|
|
focusConfirm: false,
|
|
preConfirm: () => {
|
|
const password = document.getElementById("swal-input1").value;
|
|
if (password === "") {
|
|
Swal.showValidationMessage(t("admin.pos.settings_wheel.please_enter_password"));
|
|
}
|
|
return password;
|
|
},
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
const password = result.value;
|
|
// Call the API to set the password
|
|
SessionUser.request("/superuser/user/password", "POST", {
|
|
user_id: userId,
|
|
password: password,
|
|
})
|
|
.then(() => {
|
|
Swal.fire({
|
|
title: t("admin.pos.settings_wheel.password_changed"),
|
|
text: t("admin.pos.settings_wheel.password_changed_text"),
|
|
icon: "success",
|
|
});
|
|
})
|
|
.catch((error) => {
|
|
Swal.fire({
|
|
title: t("admin.pos.settings_wheel.error"),
|
|
text: t("admin.pos.settings_wheel.error_changing_password"),
|
|
icon: "error",
|
|
});
|
|
});
|
|
}
|
|
});
|
|
};
|
|
|
|
const redirectSuperUserInvoiceCollectionPage = (invoiceCollectionId) => {
|
|
// Send the user to the invoice collection page (In a new tab)
|
|
window.open(`/superuser/invoices/${invoiceCollectionId}`, "_blank");
|
|
};
|
|
|
|
const redirectDepartmentOrderPage = async (orderId, newTab = false) => {
|
|
// Send the user to the order page (In a new tab)
|
|
// Get the department id from the order
|
|
await SessionUser.objects.orders.functions
|
|
.get_department_id(props.order_id)
|
|
.then((response) => {
|
|
console.warn(response);
|
|
// Get the department id from the response
|
|
SessionUser.functions.redirectTo.department(response, "modules/pos/orders/" + orderId, !!newTab);
|
|
})
|
|
.catch((error) => {
|
|
console.error(error);
|
|
});
|
|
};
|
|
|
|
const hasUser = computed(() => Boolean(props.user_id || props.customer_number || userIdFromCustomerNumber.value));
|
|
|
|
const attachmentsFromOrder = ref([]);
|
|
const attachmentsFromOrderError = ref(null);
|
|
onMounted(() => {
|
|
document.addEventListener("click", onDocumentClick);
|
|
document.addEventListener("keydown", onDocumentKeydown);
|
|
|
|
if (props.order_id) {
|
|
SessionUser.objects.orders.functions
|
|
.fetchAttachments(props.order_id)
|
|
.then((response) => {
|
|
/**
|
|
* [
|
|
* {
|
|
* "id": 4396,
|
|
* "object_type": "`orders`",
|
|
* "object_id": 30242,
|
|
* "content": {
|
|
* "image": null,
|
|
* "document": "pdf_6912ea1886f15.pdf",
|
|
* "relation": null,
|
|
* "other": "wash_certificate"
|
|
* },
|
|
* "created_at": "2025-11-11 08:47:36",
|
|
* "updated_at": null,
|
|
* "deleted_at": null
|
|
* }
|
|
* ]
|
|
*/
|
|
// Validate the response is an array
|
|
if (!Array.isArray(response)) {
|
|
response = [];
|
|
}
|
|
attachmentsFromOrder.value = response;
|
|
})
|
|
.catch((error) => {
|
|
const parsedErrorMessage = SessionUser.functions.parseErrorMessage(error);
|
|
console.warn("Error fetching attachments from order:", error, parsedErrorMessage);
|
|
// Check if there's an error message in the response
|
|
attachmentsFromOrderError.value = `ERROR: ${parsedErrorMessage || "Failed to fetch attachments"}`;
|
|
});
|
|
}
|
|
});
|
|
|
|
onBeforeUnmount(() => {
|
|
document.removeEventListener("click", onDocumentClick);
|
|
document.removeEventListener("keydown", onDocumentKeydown);
|
|
});
|
|
|
|
const onShowImpersonationQRCode = (src, directLink) => {
|
|
Swal.fire({
|
|
title: t("admin.pos.settings_wheel.scan_qr_to_login"),
|
|
html: `<img src="${src}" alt="QR-kode" />`,
|
|
showCloseButton: true,
|
|
showConfirmButton: !!directLink,
|
|
showCancelButton: true,
|
|
focusConfirm: false,
|
|
confirmButtonText: t("admin.pos.settings_wheel.copy_link"),
|
|
cancelButtonText: t("admin.pos.settings_wheel.close"),
|
|
preConfirm: () => {
|
|
navigator.clipboard.writeText(directLink);
|
|
Swal.showValidationMessage(t("admin.pos.settings_wheel.link_copied"));
|
|
},
|
|
});
|
|
};
|
|
|
|
const onClickShowImpersonationQRCode = async (userId) => {
|
|
// Get the session token
|
|
const newToken = await SessionUser.superUser.intimidate.getImpersonationToken(userId);
|
|
// Create the impersonation link
|
|
const link = `${window.location.protocol}//${window.location.host}/login/qr?token=${newToken}`;
|
|
// Generate a QR code for the impersonation link
|
|
const response = await SessionUser.superUser.intimidate.showImpersonationQRCode(link);
|
|
// Show the QR code in a modal
|
|
onShowImpersonationQRCode(response.value, link);
|
|
};
|
|
|
|
const defaultActions = computed(() => {
|
|
return [
|
|
/**
|
|
* Example action
|
|
{
|
|
icon: 'fas fa-eye',
|
|
label: 'View Order',
|
|
clickAction: () => {
|
|
console.warn('View Order clicked');
|
|
},
|
|
showFunction: () => {
|
|
return true; // Logic to determine if action should be shown
|
|
},
|
|
disabled: false,
|
|
template: 'success' // Optional: Set the template to 'success' or 'danger'
|
|
isLabel: false // Optional: Set to true to render the label as a button
|
|
}
|
|
*/
|
|
/** Bookings actions */
|
|
{
|
|
label: t("admin.pos.settings_wheel.booking"),
|
|
isLabel: true,
|
|
showFunction: () => {
|
|
return !!props.order_booking_id;
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-check-circle",
|
|
label: t("admin.pos.settings_wheel.mark_as_completed"),
|
|
template: "success",
|
|
clickAction: () => {
|
|
return SessionUser.objects.order_bookings.functions.showCompleteConfirmationModal(
|
|
props.order_booking_id,
|
|
() => {
|
|
props.refreshFunction();
|
|
}
|
|
);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_booking_id && SessionUser.canAccessAdmin() && !props.order_id;
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-external-link-alt",
|
|
label: t("admin.pos.settings_wheel.view_booking_new_tab"),
|
|
clickAction: () => {
|
|
return SessionUser.functions.redirectTo.department(
|
|
props.department_id,
|
|
"modules/bookings/order/" + props.order_booking_id,
|
|
true
|
|
);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_booking_id;
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-edit",
|
|
label: t("admin.pos.settings_wheel.change_association"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.order_bookings.showEditObjectFieldForm(
|
|
props.order_booking_id,
|
|
"order_id",
|
|
props.order_id,
|
|
() => {
|
|
props.refreshFunction();
|
|
},
|
|
{
|
|
filters: {
|
|
...(props.customer_number ? { customer_id: props.customer_number } : {}),
|
|
...(props.department_id ? { department_id: props.department_id } : {}),
|
|
},
|
|
pagination: {
|
|
page: 1,
|
|
limit: 100,
|
|
},
|
|
}
|
|
);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_booking_id && SessionUser.canAccessAdmin();
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-trash-alt",
|
|
label: t("admin.pos.settings_wheel.delete_booking"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.order_bookings.functions.showDeleteConfirmationModal(props.order_booking_id, () => {
|
|
props.refreshFunction();
|
|
});
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_booking_id && SessionUser.canAccessAdmin() && !props.order_id;
|
|
},
|
|
disabled: false,
|
|
template: "danger",
|
|
},
|
|
/** Department lane actions */
|
|
{
|
|
label: SessionUser.objects.department_lanes.meta.labels.single,
|
|
isLabel: true,
|
|
showFunction: () => {
|
|
return !!props.department_lane_id;
|
|
},
|
|
},
|
|
{
|
|
icon: `fas fa-external-link-alt`,
|
|
label: t("admin.pos.settings_wheel.view_lane_new_tab"),
|
|
clickAction: () => {
|
|
return SessionUser.functions.redirectTo.superUser(
|
|
"/department/lanes/" + props.department_lane_id,
|
|
!SessionUser.functions.device.isMobile()
|
|
);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.department_lane_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-play",
|
|
label: t("superuser.department_lane.force_enable_machine"),
|
|
template: "success",
|
|
clickAction: () => {
|
|
return SessionUser.objects.department_lanes.functions.forceEnableMachine(props.department_lane_id);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.department_lane_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-stop",
|
|
label: t("superuser.department_lane.force_disable_machine"),
|
|
template: "danger",
|
|
clickAction: () => {
|
|
return SessionUser.objects.department_lanes.functions.forceDisableMachine(props.department_lane_id);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.department_lane_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
/** Orders actions */
|
|
{
|
|
label: SessionUser.functions.ucFirst(SessionUser.objects.orders.meta.labels.single),
|
|
isLabel: true,
|
|
showFunction: () => {
|
|
return !!props.order_id;
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-external-link-alt",
|
|
label: t("admin.pos.settings_wheel.view_order_new_tab"),
|
|
clickAction: async () => {
|
|
return redirectDepartmentOrderPage(props.order_id, true);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_id && (SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser());
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-paperclip",
|
|
label: t("admin.pos.settings_wheel.attach_wash_certificate"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.orders.functions.showAttachWashCertificateForm(props.order_id, () => {
|
|
props.refreshFunction();
|
|
});
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_id && (SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser());
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-user-edit",
|
|
label: t("admin.pos.settings_wheel.change_customer"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.orders.functions.showChangeCustomerForm(props.order_id);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-file-invoice-dollar",
|
|
label: t("admin.pos.settings_wheel.change_invoice_collection"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.orders.functions.showChangeInvoiceCollectionForm(
|
|
props.order_id,
|
|
props.refreshFunction
|
|
);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-download",
|
|
label: t("admin.pos.settings_wheel.download_invoice"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.collectedOrderInvoices.functions.download(props.invoice_collection_id);
|
|
},
|
|
showFunction: () => {
|
|
return true;
|
|
},
|
|
disabled: false,
|
|
},
|
|
{
|
|
icon: "fas fa-trash-alt",
|
|
label: t("admin.pos.settings_wheel.delete_order"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.orders.functions.showDeleteConfirmationModal(props.order_id, () => {
|
|
emitDeleted();
|
|
});
|
|
},
|
|
showFunction: () => {
|
|
return !!props.order_id && (SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser());
|
|
},
|
|
disabled: false,
|
|
template: "danger",
|
|
},
|
|
{
|
|
icon: "fas fa-file-invoice-dollar",
|
|
label: t("admin.pos.settings_wheel.view_invoice_collection_new_tab"),
|
|
clickAction: () => {
|
|
return redirectSuperUserInvoiceCollectionPage(props.invoice_collection_id);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.invoice_collection_id && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
/** Vehicle actions */
|
|
{
|
|
label:
|
|
props.reg_1 && props.reg_2
|
|
? `${SessionUser.objects.vehicles.meta.labels.multiple}`
|
|
: `${SessionUser.objects.vehicles.meta.labels.single}`,
|
|
isLabel: true,
|
|
showFunction: () => {
|
|
return (!!props.reg_1 || !!props.reg_2) && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-car",
|
|
label: t("admin.pos.settings_wheel.view_vehicle_new_tab", { reg: props.reg_1 ? props.reg_1 : "-" }),
|
|
clickAction: () => {
|
|
return SessionUser.functions.redirectTo.superUser("/vehicles/" + props.reg_1, true);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.reg_1 && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-car",
|
|
label: t("admin.pos.settings_wheel.view_vehicle_new_tab", { reg: props.reg_2 ? props.reg_2 : "-" }),
|
|
clickAction: () => {
|
|
return SessionUser.functions.redirectTo.superUser("/vehicles/" + props.reg_2, true);
|
|
},
|
|
showFunction: () => {
|
|
return !!props.reg_2 && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
/** User actions */
|
|
{
|
|
label: SessionUser.objects.global.language.customer,
|
|
isLabel: true,
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-user-edit",
|
|
label: t("admin.pos.settings_wheel.view_customer_new_tab"),
|
|
clickAction: () => {
|
|
return SessionUser.functions.redirectTo.superUser("/users/" + userIdFromCustomerNumber.value, true);
|
|
},
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser() && userIdFromCustomerNumber.value;
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-user-shield",
|
|
label: t("admin.pos.settings_wheel.login_as_customer"),
|
|
clickAction: () => {
|
|
return SessionUser.superUser.intimidate.intimidateUser(userIdFromCustomerNumber.value);
|
|
},
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-qrcode",
|
|
label: t("admin.pos.settings_wheel.show_qr_code"),
|
|
clickAction: () => {
|
|
return onClickShowImpersonationQRCode(userIdFromCustomerNumber.value);
|
|
},
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-key",
|
|
label: t("admin.pos.settings_wheel.change_password"),
|
|
clickAction: () => {
|
|
return showSetCustomerPassword(userIdFromCustomerNumber.value);
|
|
},
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
{
|
|
icon: "fas fa-user",
|
|
label: t("admin.pos.settings_wheel.show_customer"),
|
|
clickAction: () => {
|
|
customerModalVisible.value = true;
|
|
},
|
|
showFunction: () => {
|
|
return hasUser.value && SessionUser.canAccessSuperUser();
|
|
},
|
|
},
|
|
/** Subuser grant actions */
|
|
{
|
|
icon: "fas fa-edit",
|
|
label: t("admin.pos.settings_wheel.edit_permissions"),
|
|
clickAction: () => {
|
|
return SessionUser.objects.subuser_grants.functions.showPermissionEditForm(props.subuserGrant, () => {
|
|
props.refreshFunction();
|
|
});
|
|
},
|
|
showFunction: () => {
|
|
return !!props.subuserGrant && SessionUser.canAccessUser();
|
|
},
|
|
},
|
|
];
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<template v-if="displayActionsDirectly">
|
|
<!-- Error -->
|
|
<template v-if="attachmentsFromOrderError">
|
|
<div class="message is-danger">
|
|
<div class="message-body">
|
|
{{ attachmentsFromOrderError }}
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<template v-for="(action, index) in [...defaultActions, ...(useSlots().actions ? [] : [])]" :key="index">
|
|
<ActionSettingsWheelItem
|
|
v-if="(!action.showFunction || action.showFunction()) && (!action.isLabel || action.isLabel === false)"
|
|
:icon="action.icon"
|
|
:label="action.label"
|
|
:template="action.template"
|
|
:click-action="action.clickAction"
|
|
:show-function="action.showFunction"
|
|
:disabled="action.disabled"
|
|
/>
|
|
<ActionSettingsWheelItemLabel
|
|
v-else-if="action.isLabel && action.isLabel === true && (!action.showFunction || action.showFunction())"
|
|
:label="action.label"
|
|
/>
|
|
</template>
|
|
<slot name="actions"></slot>
|
|
<!-- If there are attachments, show the attachments -->
|
|
<template v-if="attachmentsFromOrder.length > 0">
|
|
<ActionSettingsWheelItemLabel :label="t('admin.pos.settings_wheel.attached_files')" />
|
|
<ActionSettingsWheelItem
|
|
v-for="attachment in attachmentsFromOrder"
|
|
:key="attachment.id"
|
|
:icon="'fas fa-paperclip'"
|
|
:label="t('admin.pos.settings_wheel.open_attached_file', { id: attachment.id })"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.orders.functions
|
|
.downloadAttachment(props.order_id, attachment.id, true)
|
|
.catch((error) => {
|
|
Swal.fire({
|
|
title: t('admin.pos.settings_wheel.error'),
|
|
text: t('admin.pos.settings_wheel.error_downloading_attachment'),
|
|
icon: 'error',
|
|
});
|
|
})
|
|
"
|
|
/>
|
|
</template>
|
|
</template>
|
|
<div class="dropdown is-right" :class="{ 'is-active': isDropdownOpen }" v-else ref="dropdownRoot">
|
|
<div class="dropdown-trigger">
|
|
<button
|
|
type="button"
|
|
class="button is-small is-dark"
|
|
aria-haspopup="true"
|
|
aria-controls="dropdown-menu"
|
|
:aria-expanded="isDropdownOpen ? 'true' : 'false'"
|
|
@click.stop="toggleDropdown"
|
|
>
|
|
<span class="icon">
|
|
<i :class="props.icon"></i>
|
|
</span>
|
|
<span v-if="props.label.length > 0" class="ml-2">{{ props.label }}</span>
|
|
</button>
|
|
</div>
|
|
<div class="dropdown-menu" id="dropdown-menu" role="menu">
|
|
<div class="dropdown-content" @dropdown-action-selected="onActionSelected">
|
|
<!-- Actions (If defined) -->
|
|
<template v-if="useSlots().actions">
|
|
<slot name="actions"></slot>
|
|
<!-- If there is an order_booking_id, show the order booking actions -->
|
|
<template v-if="props.order_booking_id">
|
|
<ActionSettingsWheelItemLabel :label="t('admin.pos.settings_wheel.booking')" />
|
|
<ActionSettingsWheelItem
|
|
v-if="(SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()) && !props.order_id"
|
|
:icon="'fas fa-check-circle'"
|
|
:label="t('admin.pos.settings_wheel.mark_as_completed')"
|
|
template="success"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.order_bookings.functions.showCompleteConfirmationModal(
|
|
props.order_booking_id,
|
|
() => {
|
|
props.refreshFunction();
|
|
}
|
|
)
|
|
"
|
|
/>
|
|
<ActionSettingsWheelItem
|
|
:icon="'fas fa-external-link-alt'"
|
|
:label="t('admin.pos.settings_wheel.view_booking_new_tab')"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.functions.redirectTo.department(
|
|
props.department_id,
|
|
'modules/bookings/order/' + props.order_booking_id,
|
|
true
|
|
)
|
|
"
|
|
/>
|
|
<ActionSettingsWheelItem
|
|
v-if="SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()"
|
|
:icon="'fas fa-edit'"
|
|
:label="
|
|
!props.order_id
|
|
? t('admin.pos.settings_wheel.associate_order', {
|
|
order: SessionUser.objects.orders.meta.labels.single.toLowerCase(),
|
|
})
|
|
: t('admin.pos.settings_wheel.change_order', {
|
|
order: SessionUser.objects.orders.meta.labels.single.toLowerCase(),
|
|
})
|
|
"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.order_bookings.showEditObjectFieldForm(
|
|
props.order_booking_id,
|
|
'order_id',
|
|
props.order_id,
|
|
() => {
|
|
props.refreshFunction();
|
|
},
|
|
{
|
|
filters: {
|
|
...(customer_number ? { customer_id: props.customer_number } : {}),
|
|
...(props.department_id ? { department_id: props.department_id } : {}),
|
|
},
|
|
pagination: {
|
|
page: 1,
|
|
limit: 100,
|
|
},
|
|
}
|
|
)
|
|
"
|
|
/>
|
|
<ActionSettingsWheelItem
|
|
:icon="'fas fa-trash-alt'"
|
|
:label="t('admin.pos.settings_wheel.delete_booking')"
|
|
template="danger"
|
|
v-show="!props.order_id"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.order_bookings.functions.showDeleteConfirmationModal(
|
|
props.order_booking_id,
|
|
() => {
|
|
props.refreshFunction();
|
|
}
|
|
)
|
|
"
|
|
/>
|
|
</template>
|
|
<!-- If there's an order_id, show the order actions -->
|
|
<template v-if="props.order_id">
|
|
<!-- Label -->
|
|
<action-settings-wheel-item-label
|
|
:label="SessionUser.functions.ucFirst(SessionUser.objects.orders.meta.labels.single)"
|
|
/>
|
|
<!-- Go to the order page, in a new tab -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.view_order_new_tab')"
|
|
icon="fas fa-external-link-alt"
|
|
:click-action="async () => redirectDepartmentOrderPage(props.order_id, true)"
|
|
:disabled="false"
|
|
/>
|
|
<!-- Go to the user/order/:order_id page, in a new tab -->
|
|
<action-settings-wheel-item
|
|
v-if="!SessionUser.canAccessAdmin() && !SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.view_order_new_tab')"
|
|
icon="fas fa-external-link-alt"
|
|
:click-action="() => SessionUser.functions.redirectTo.user('/orders/' + props.order_id, true)"
|
|
:disabled="false"
|
|
/>
|
|
<!-- Attach wash certificate -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.attach_wash_certificate')"
|
|
icon="fas fa-paperclip"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.orders.functions.showAttachWashCertificateForm(props.order_id, () => {
|
|
props.refreshFunction();
|
|
})
|
|
"
|
|
:disabled="false"
|
|
/>
|
|
<!-- Change the customer (of the order) -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.change_customer')"
|
|
icon="fas fa-user-edit"
|
|
:click-action="() => SessionUser.objects.orders.functions.showChangeCustomerForm(props.order_id)"
|
|
:disabled="false"
|
|
/>
|
|
<!-- Change the invoice collection (of the order) -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.change_invoice_collection')"
|
|
icon="fas fa-file-invoice-dollar"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.orders.functions.showChangeInvoiceCollectionForm(
|
|
props.order_id,
|
|
props.refreshFunction
|
|
)
|
|
"
|
|
:disabled="false"
|
|
/>
|
|
<!-- Delete the order -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.delete_order')"
|
|
template="danger"
|
|
icon="fas fa-trash-alt"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.orders.functions.showDeleteConfirmationModal(props.order_id, () => {
|
|
emitDeleted();
|
|
})
|
|
"
|
|
:disabled="false"
|
|
/>
|
|
</template>
|
|
<!-- If there is an invoice collection id, show the invoice actions -->
|
|
<template v-if="props.invoice_collection_id">
|
|
<!-- Label -->
|
|
<action-settings-wheel-item-label
|
|
:label="SessionUser.objects.collectedOrderInvoices.meta.title"
|
|
v-show="SessionUser.canAccessSuperUser()"
|
|
/>
|
|
<!-- Show the invoice collection, in a new tab -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.view_invoice_collection_new_tab')"
|
|
icon="fas fa-file-invoice-dollar"
|
|
:click-action="() => redirectSuperUserInvoiceCollectionPage(props.invoice_collection_id)"
|
|
/>
|
|
</template>
|
|
<!-- if there is a department_lane_id, show the department lane actions -->
|
|
<template v-if="props.department_lane_id">
|
|
<!-- Label -->
|
|
<action-settings-wheel-item-label
|
|
:label="SessionUser.objects.department_lanes.meta.labels.single"
|
|
v-show="SessionUser.canAccessSuperUser() || SessionUser.canAccessAdmin()"
|
|
/>
|
|
<!-- Show the department lane (Admin), in a new tab -->
|
|
<action-settings-wheel-item
|
|
v-if="(SessionUser.canAccessAdmin() || SessionUser.canAccessSuperUser()) && props.department_id"
|
|
:label="t('admin.pos.settings_wheel.view_lane_new_tab')"
|
|
icon="fas fa-external-link-alt"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.functions.redirectTo.department(
|
|
props.department_id,
|
|
'modules/wash-lanes/' + props.department_lane_id,
|
|
!SessionUser.functions.device.isMobile()
|
|
)
|
|
"
|
|
/>
|
|
<!-- Show the department lane (SuperUser), in a new tab -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('admin.pos.settings_wheel.view_lane_setup_new_tab')"
|
|
icon="fas fa-external-link-alt"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.functions.redirectTo.superUser('/department/lanes/' + props.department_lane_id, true)
|
|
"
|
|
/>
|
|
<!-- Force enable machine -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('superuser.department_lane.force_enable_machine')"
|
|
icon="fas fa-play"
|
|
template="success"
|
|
:click-action="
|
|
() => SessionUser.objects.department_lanes.functions.forceEnableMachine(props.department_lane_id)
|
|
"
|
|
/>
|
|
<!-- Force disable machine -->
|
|
<action-settings-wheel-item
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
:label="t('superuser.department_lane.force_disable_machine')"
|
|
icon="fas fa-stop"
|
|
template="danger"
|
|
:click-action="
|
|
() => SessionUser.objects.department_lanes.functions.forceDisableMachine(props.department_lane_id)
|
|
"
|
|
/>
|
|
</template>
|
|
<!-- If there's a user_id, show the user actions -->
|
|
<template v-if="hasUser">
|
|
<!-- Label -->
|
|
<ActionSettingsWheelItemLabel
|
|
:label="SessionUser.objects.global.language.customer"
|
|
v-show="SessionUser.canAccessSuperUser()"
|
|
/>
|
|
<!-- Se bruger -->
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.view_customer_new_tab')"
|
|
icon="fas fa-user-edit"
|
|
:click-action="
|
|
() => SessionUser.functions.redirectTo.superUser('/users/' + userIdFromCustomerNumber, true)
|
|
"
|
|
v-if="SessionUser.canAccessSuperUser() && userIdFromCustomerNumber"
|
|
/>
|
|
<!-- Log ind som kunde -->
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.login_as_user')"
|
|
icon="fas fa-user-shield"
|
|
:click-action="() => SessionUser.superUser.intimidate.intimidateUser(userIdFromCustomerNumber)"
|
|
v-if="SessionUser.canAccessSuperUser() && userIdFromCustomerNumber"
|
|
/>
|
|
<!-- Log ind som kunde (QR) -->
|
|
<ActionSettingsWheelItem
|
|
@click="onClickShowImpersonationQRCode(userIdFromCustomerNumber)"
|
|
icon="fas fa-user-shield"
|
|
:label="t('admin.pos.settings_wheel.login_as_user_qr')"
|
|
v-if="SessionUser.canAccessSuperUser() && userIdFromCustomerNumber"
|
|
/>
|
|
|
|
<!-- Set password -->
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.change_password')"
|
|
icon="fas fa-key"
|
|
:click-action="() => showSetCustomerPassword(userIdFromCustomerNumber)"
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
/>
|
|
<!-- Show customer modal -->
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.show_customer')"
|
|
icon="fas fa-user"
|
|
:click-action="() => (customerModalVisible = true)"
|
|
v-if="SessionUser.canAccessSuperUser()"
|
|
/>
|
|
</template>
|
|
<!-- If there is a reg_1, show the reg_1 actions -->
|
|
<template v-if="props.reg_1 || props.reg_2">
|
|
<!-- Label -->
|
|
<action-settings-wheel-item-label
|
|
:label="
|
|
props.reg_1 && props.reg_2
|
|
? `${SessionUser.objects.vehicles.meta.labels.multiple}`
|
|
: `${SessionUser.objects.vehicles.meta.labels.single}`
|
|
"
|
|
v-show="SessionUser.canAccessSuperUser()"
|
|
/>
|
|
<!-- Show the vehicle, in a new tab -->
|
|
<action-settings-wheel-item
|
|
:label="t('admin.pos.settings_wheel.view_vehicle_new_tab', { reg: props.reg_1 })"
|
|
icon="fas fa-car"
|
|
v-if="props.reg_1 && SessionUser.canAccessSuperUser()"
|
|
:click-action="() => SessionUser.functions.redirectTo.superUser('/vehicles/' + props.reg_1, true)"
|
|
/>
|
|
<action-settings-wheel-item
|
|
:label="t('admin.pos.settings_wheel.view_vehicle_new_tab', { reg: props.reg_2 })"
|
|
icon="fas fa-car"
|
|
v-if="props.reg_2 && SessionUser.canAccessSuperUser()"
|
|
:click-action="() => SessionUser.functions.redirectTo.superUser('/vehicles/' + props.reg_2, true)"
|
|
/>
|
|
<!-- If there are any attachments, show the attachments actions -->
|
|
<template v-if="attachmentsFromOrder.length > 0">
|
|
<action-settings-wheel-item-label :label="t('admin.pos.settings_wheel.attached_files')" />
|
|
<template v-for="(attachment, index) in attachmentsFromOrder" :key="index">
|
|
<action-settings-wheel-item
|
|
:label="`${attachment.content?.document || attachment.content?.other}`"
|
|
icon="fas fa-paperclip"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.orders.functions
|
|
.downloadAttachment(props.order_id, attachment.id, true)
|
|
.catch((error) => {
|
|
Swal.fire({
|
|
title: t('admin.pos.settings_wheel.error'),
|
|
text: t('admin.pos.settings_wheel.error_downloading_attachment'),
|
|
icon: 'error',
|
|
});
|
|
})
|
|
"
|
|
/>
|
|
</template>
|
|
</template>
|
|
</template>
|
|
<!-- Collected order invoice actions -->
|
|
<template v-if="props.invoice_collection_id">
|
|
<ActionSettingsWheelItemLabel
|
|
:label="SessionUser.objects.collectedOrderInvoices.meta.title"
|
|
v-show="props.invoice_collection_id"
|
|
/>
|
|
<!-- Download invoice -->
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.download_invoice')"
|
|
icon="fas fa-download"
|
|
:click-action="
|
|
() => SessionUser.objects.collectedOrderInvoices.functions.download(props.invoice_collection_id)
|
|
"
|
|
/>
|
|
</template>
|
|
<!-- Subuser grant actions -->
|
|
<template v-if="props.subuserGrant">
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.edit_permissions')"
|
|
icon="fas fa-edit"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.subuser_grants.functions.showPermissionEditForm(props.subuserGrant, () => {
|
|
props.refreshFunction();
|
|
})
|
|
"
|
|
v-if="SessionUser.canAccessUser()"
|
|
/>
|
|
<ActionSettingsWheelItem
|
|
:label="t('admin.pos.settings_wheel.delete_user')"
|
|
icon="fas fa-trash"
|
|
:click-action="
|
|
() =>
|
|
SessionUser.objects.subuser_grants.delete(props.subuserGrant.id, () => {
|
|
props.refreshFunction();
|
|
})
|
|
"
|
|
v-if="SessionUser.canAccessUser()"
|
|
/>
|
|
</template>
|
|
</template>
|
|
<!-- If no actions are defined, then show that no actions are defined -->
|
|
<template v-else>
|
|
<div class="dropdown-item">
|
|
<p class="has-text-centered">{{ t("admin.pos.settings_wheel.no_actions_defined") }}</p>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<CustomerModal
|
|
v-if="customerModalVisible"
|
|
:user_id="userIdFromCustomerNumber"
|
|
@closeModal="customerModalVisible = false"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|