Files
thetool/public/js/pages/PreorderCustom300/PreorderCustom300.js
2025-07-09 15:35:59 +02:00

95 lines
4.0 KiB
JavaScript

Vue.component('PreorderCustom300', {
template: `
<tt-card>
<tt-table :data="window['TT_CONFIG']['PREORDERS_DATA']" :config="preorderTableConfig" excel-export>
<template v-slot:preorder_id="{ row }">
<strong>{{ row.preorder_id }}</strong>
</template>
<template v-slot:ucode="{ row }">
{{ row.ucode }}
</template>
<template v-slot:preorder_email="{ row }">
<a :href="'mailto:' + row.preorder_email">{{ row.preorder_email }}</a>
</template>
<template v-slot:campaign_name="{ row }">
{{ row.campaign_name }}
</template>
<template v-slot:current_status_name="{ row }">
<span :class="getStatusClass(row.current_status_code)">{{ row.current_status_name }}</span>
</template>
<template v-slot:notification_logged_email="{ row }">
{{ row.notification_logged_email }}
</template>
<template v-slot:notification_type_logged="{ row }">
{{ row.notification_type_logged }}
</template>
<template v-slot:notification_log_timestamp="{ row }">
<span>{{ window.moment(row.notification_log_timestamp).format('DD.MM.YYYY HH:mm:ss') }}</span>
</template>
<template v-slot:actions="{ row }">
<a :href="'/Preorder?filter[ucode]=' + row.ucode" target="_blank" class="btn btn-primary btn-sm">
<i class="fas fa-eye"></i> Details
</a>
</template>
</tt-table>
</tt-card>
`,
data() {
return {
window: window,
preorderTableConfig: {
key: 'PreorderCustom300Table',
tableHeader: 'Kundenspezifische Vorbestellungen (Typ 300)',
defaultPageSize: 10,
headers: [
{text: 'Bestellcode', key: 'ucode', sortable: true, class: 'text-nowrap', filter: 'search'},
{text: 'Preorder E-Mail', key: 'preorder_email', sortable: true, class: 'text-nowrap', filter: 'search'},
{text: 'Kampagnenname', key: 'campaign_name', sortable: true, class: 'text-nowrap', filter: 'search'},
{
text: 'Aktueller Status',
key: 'current_status_name',
sortable: true,
class: 'text-center',
filter: 'select',
// Assuming current_status_code values correspond to different statuses
filterOptions: [
{value: 'Waiting for Service', text: 'Warten auf Service'},
{value: 'Ready for Service', text: 'Bereit für Service'},
{value: 'Finished', text: 'Abgeschlossen'},
]
},
{text: 'Log E-Mail', key: 'notification_logged_email', sortable: true, class: 'text-nowrap', filter: 'search'},
{text: 'Log Typ', key: 'notification_type_logged', sortable: true, class: 'text-nowrap', filter: 'search'},
{text: 'Log Zeitstempel', key: 'notification_log_timestamp', sortable: true, class: 'text-center', filter: 'date'},
{text: 'Aktionen', key: 'actions', class: 'text-center', sortable: false, filter: false},
],
},
};
},
methods: {
// You might need to adjust this based on actual 'current_status_code' values
getStatusClass(statusCode) {
switch (statusCode) {
case 'new':
return 'badge badge-primary';
case 'pending':
return 'badge badge-warning';
case 'completed':
return 'badge badge-success';
case 'cancelled':
return 'badge badge-danger';
default:
return 'badge badge-secondary';
}
}
}
});