<script setup>
import AppLayout from '../../../../resources/js/layouts/AppLayout.vue'
import ShadowedBox from "../../../Views/Components/ShadowedBox.vue";
import MyInvoices from "./Partials/Widgets/MyInvoices.vue";

const props = defineProps({
    myInvoices: Object,
})


function newInvoice() {
    window.location.href = '/invoice/new';
}

</script>

<template>
    <AppLayout title='Dashboard'>
        <diV class="dashboard-widget-container">
            <shadowed-box class="dashboard-widget-box" style="width: 60%;">
                Meine Anmeldungen
            </shadowed-box>

            <shadowed-box  class="dashboard-widget-box">
                <MyInvoices />
                <input type="button" value="Neue Abrechnung" @click="newInvoice" style="margin-top: 20px;">


            </shadowed-box>
        </diV>
    </AppLayout>
</template>

<style>
.dashboard-widget-container {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    position: relative;


}

.dashboard-widget-box {
    flex-grow: 1; display: inline-block;
     margin: 0 10px;
}
</style>
