overhauled preorderlogistics
This commit is contained in:
Luca Haid
@@ -0,0 +1,9 @@
|
||||
.sent-checkbox-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.sent-checkbox-wrapper .fa-check {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
@@ -0,0 +1,223 @@
|
||||
Vue.component('preorder-logistics', {
|
||||
template: `
|
||||
<tt-card>
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h4 class="header-title mb-3">Filter</h4>
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<tt-select label="Kampagne" :options="campaigns" v-model="filters.preordercampaign_id" sm/>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<tt-select label="FCP" :options="fcps" v-model="filters.fcp" sm multiple searchable/>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<tt-select label="Versandstatus" :options="sentStatusOptions" v-model="filters.sent" sm/>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<tt-input label="Bestellcode" v-model="filters.ucode" sm/>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<tt-input label="OAID" v-model="filters.oaid" sm/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-2">
|
||||
<div class="col-md-6">
|
||||
<tt-input label="Anschlussadresse" v-model="filters.address" sm/>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<tt-input label="Kunde" v-model="filters.kunde" sm/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<div class="col">
|
||||
<tt-button text="Filter anwenden" @click="applyFilters" icon="fas fa-filter"
|
||||
additional-class="btn-primary"/>
|
||||
<tt-button text="Filter zurücksetzen" @click="resetFilters" icon="fas fa-undo"
|
||||
additional-class="btn-secondary"/>
|
||||
<tt-button text="Alle drucken" @click="printAll" icon="fas fa-print" additional-class="btn-success"
|
||||
:loading="isPrinting"/>
|
||||
<tt-button text="CSV Export" @click="exportCsv(false)" icon="fas fa-file-csv"
|
||||
additional-class="btn-success" :loading="isExporting"/>
|
||||
<tt-button text="CSV Export & als versendet markieren" @click="exportCsv(true)" icon="fas fa-file-csv"
|
||||
additional-class="btn-success" :loading="isExportingAndMarking"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<tt-table
|
||||
:fetch-url="window.TT_CONFIG.BASE_PATH + '/Preorderlogistics/getPreorders'"
|
||||
:config="tableConfig"
|
||||
ref="table"
|
||||
ssr
|
||||
>
|
||||
<template v-slot:actions="{ row }">
|
||||
<tt-button @click="printSlip(row)" sm additional-class="btn-success" icon="fas fa-print" text="Drucken"/>
|
||||
</template>
|
||||
|
||||
<template v-slot:sent="{ row }">
|
||||
<div class="sent-checkbox-wrapper">
|
||||
<tt-switch :value="row.sent" :key ="'switch-' + row.id" @input="saveSent(row.id, $event)"></tt-switch>
|
||||
<i v-if="row.sent" class="fas fa-check text-success ml-2"></i>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:shipping_address="{ row }">
|
||||
<div v-html="row.display_address"></div>
|
||||
</template>
|
||||
</tt-table>
|
||||
</tt-card>
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
window: window,
|
||||
loading: false,
|
||||
isPrinting: false,
|
||||
isExporting: false,
|
||||
isExportingAndMarking: false,
|
||||
campaigns: [{value: '', text: 'Alle'}],
|
||||
fcps: [],
|
||||
sentStatusOptions: [
|
||||
{value: 'no', text: 'Noch nicht versendet'},
|
||||
{value: 'yes', text: 'Versendet'},
|
||||
{value: 'all', text: 'Alle'}
|
||||
],
|
||||
filters: {
|
||||
preordercampaign_id: '',
|
||||
ucode: '',
|
||||
oaid: '',
|
||||
sent: 'no',
|
||||
address: '',
|
||||
kunde: '',
|
||||
fcp: []
|
||||
},
|
||||
tableConfig: {
|
||||
key: 'preorderlogistics',
|
||||
tableHeader: 'Bestellungen',
|
||||
headers: [
|
||||
{key: 'actions', text: '', sortable: false, filter: false},
|
||||
{key: 'sent', text: 'Versandt', sortable: false, filter: false},
|
||||
{key: 'status_code', text: 'Status', sortable: false, filter: false},
|
||||
{key: 'shipping_address', text: 'Versandadresse', sortable: false, filter: false},
|
||||
{key: 'oaid', text: 'OAID', sortable: false, filter: false},
|
||||
{key: 'ucode', text: 'Bestellcode', sortable: false, filter: false},
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.campaigns.push(...window.TT_CONFIG.CRUD_CONFIG.CAMPAIGNS);
|
||||
if (this.campaigns.length === 2) { // 'Alle' + one campaign
|
||||
this.filters.preordercampaign_id = this.campaigns[1].value;
|
||||
}
|
||||
await this.fetchFcps();
|
||||
},
|
||||
watch: {
|
||||
'filters.preordercampaign_id': 'fetchFcps'
|
||||
},
|
||||
methods: {
|
||||
async fetchFcps() {
|
||||
if (!this.filters.preordercampaign_id) {
|
||||
this.fcps = [];
|
||||
this.filters.fcp = [];
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const response = await axios.get(`${window.TT_CONFIG.BASE_PATH}/Preorderlogistics/getFCPsForCampaign`, {
|
||||
params: {campaign_id: this.filters.preordercampaign_id}
|
||||
});
|
||||
this.fcps = response.data;
|
||||
} catch (e) {
|
||||
console.error("Could not fetch FCPs", e);
|
||||
this.fcps = [];
|
||||
}
|
||||
},
|
||||
applyFilters() {
|
||||
this.$refs.table.filters = {...this.filters};
|
||||
this.$refs.table.refreshTable();
|
||||
},
|
||||
resetFilters() {
|
||||
this.filters = {
|
||||
preordercampaign_id: '', ucode: '', oaid: '', sent: 'no', address: '', kunde: '', fcp: []
|
||||
};
|
||||
this.applyFilters();
|
||||
},
|
||||
async saveSent(id, sent) {
|
||||
try {
|
||||
const response = await axios.post(`${window.TT_CONFIG.BASE_PATH}/Preorderlogistics/saveSentAction`, {
|
||||
id,
|
||||
sent
|
||||
});
|
||||
if (response.data.success) {
|
||||
window.notify('success', 'Status gespeichert.');
|
||||
this.$refs.table.refreshTable();
|
||||
} else {
|
||||
window.notify('error', 'Fehler beim Speichern.');
|
||||
}
|
||||
} catch (e) {
|
||||
console.error("Error saving sent status:", e);
|
||||
window.notify('error', 'Ein Fehler ist aufgetreten.');
|
||||
this.$refs.table.refreshTable();
|
||||
}
|
||||
},
|
||||
printSlip(row) {
|
||||
const w = window.open(`${window.TT_CONFIG.BASE_PATH}/Preorderlogistics/print?id=${row.id}`, "_blank", "popup=yes");
|
||||
w.addEventListener('load', () => w.print());
|
||||
},
|
||||
async printAll() {
|
||||
this.isPrinting = true;
|
||||
try {
|
||||
const response = await axios.post(`${window.TT_CONFIG.BASE_PATH}/Preorderlogistics/printAllAction`, {
|
||||
filters: this.filters
|
||||
}, {responseType: 'text'});
|
||||
|
||||
const printWindow = window.open("", "_blank");
|
||||
printWindow.document.write(response.data);
|
||||
printWindow.document.close();
|
||||
setTimeout(() => {
|
||||
printWindow.focus();
|
||||
printWindow.print();
|
||||
}, 500);
|
||||
|
||||
} catch (e) {
|
||||
console.error("Error printing all slips:", e);
|
||||
window.notify('error', 'Fehler beim Drucken.');
|
||||
} finally {
|
||||
this.isPrinting = false;
|
||||
}
|
||||
},
|
||||
async exportCsv(markAsSent) {
|
||||
const action = markAsSent ? 'csvExportAndMarkAsSentAction' : 'csvExportAction';
|
||||
if (markAsSent) this.isExportingAndMarking = true; else this.isExporting = true;
|
||||
|
||||
try {
|
||||
const response = await axios.post(`${window.TT_CONFIG.BASE_PATH}/Preorderlogistics/${action}`, {
|
||||
filters: this.filters
|
||||
}, {responseType: 'blob'});
|
||||
|
||||
const url = window.URL.createObjectURL(new Blob([response.data]));
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute('download', markAsSent ? 'export-versand-markiert.csv' : 'export-versand.csv');
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
window.URL.revokeObjectURL(url);
|
||||
|
||||
if (markAsSent) {
|
||||
window.notify('success', 'CSV exportiert und Einträge als versendet markiert.');
|
||||
this.$refs.table.refreshTable();
|
||||
} else {
|
||||
window.notify('success', 'CSV erfolgreich exportiert.');
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
console.error("Error exporting CSV:", e);
|
||||
window.notify('error', 'Fehler beim CSV-Export.');
|
||||
} finally {
|
||||
if (markAsSent) this.isExportingAndMarking = false; else this.isExporting = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user