diff --git a/application/WarehouseOrderRequest/WarehouseOrderRequestController.php b/application/WarehouseOrderRequest/WarehouseOrderRequestController.php
index 691988aae..fc8882e6a 100644
--- a/application/WarehouseOrderRequest/WarehouseOrderRequestController.php
+++ b/application/WarehouseOrderRequest/WarehouseOrderRequestController.php
@@ -7,7 +7,6 @@ class WarehouseOrderRequestController extends TTCrud {
 
     protected array $columns = [
         ['key' => 'id', 'text' => 'ID', 'modal' => false, 'table' => false],
-        ['key' => 'anzahl', 'text' => 'Anzahl', 'required' => true, 'type' => 'number'],
         ['key' => 'ware',
          'text' => 'Ware',
          'required' => true,
@@ -17,6 +16,7 @@ class WarehouseOrderRequestController extends TTCrud {
              'apiUrl' => 'WarehouseArticle/autocomplete',
              'type' => 'autocomplete',
              'returnText' => true]],
+        ['key' => 'anzahl', 'text' => 'Anzahl', 'required' => true, 'type' => 'number'],
         ['key' => 'verwendungszweck', 'text' => 'Verwendungszweck', 'required' => true],
         ['key' => 'create', 'text' => 'Beauftragt am', 'required' => true, 'modal' => false, 'table' => ['filter' => 'datepicker']],
         ['key' => 'createBy',
@@ -88,6 +88,7 @@ class WarehouseOrderRequestController extends TTCrud {
             $this->columns[$orderColumn]['modal']['visible'] = false;
         }
 
+        $this->additionalJSVariables['user_id'] = $this->user->id;
     }
 
     protected function customAutoCompleteWare($value) {
@@ -102,6 +103,28 @@ class WarehouseOrderRequestController extends TTCrud {
         return true;
     }
 
+    protected function afterCreate($postData): void {
+        if ($_SERVER['HTTP_HOST'] == 'localhost') return;
+
+        $email = new Emailnotification();
+        $paddedId = str_pad($this->mod->id, 5, '0', STR_PAD_LEFT);
+        $email->setSubject("TheTool: Neue Interne Bestellung #$paddedId");
+
+        $body = "Hallo,\n\nes wurde eine neue interne Bestellung erstellt.\n\n";
+        $body .= "Bestellnummer: #$paddedId\n";
+        $body .= "Ware: " . $postData['ware'] . "\n";
+        $body .= "Anzahl: " . $postData['anzahl'] . "\n";
+        $body .= "Verwendungszweck: " . $postData['verwendungszweck'] . "\n";
+        $body .= "Beauftragt von: " . $this->user->name . "\n";
+        $body .= "Beauftragt am: " . date('d.m.Y H:i') . "\n";
+        $body .= "Notiz: " . $postData['note'] . "\n\n";
+
+        $email->setBody($body);
+        $email->setFrom(TT_OUTGOING_EMAIL_2FA, TT_OUTGOING_EMAIL_2FA);
+        $email->setTo("einkauf@xinon.at", "Einkauf");
+        $email->send();
+    }
+
     protected function getHistoryAction() {
         $this->prepareCrudConfig();
         self::returnJson((new WarehouseHistoryController)->getHistory($this->request->id, $this->mod, $this->columns));
diff --git a/public/js/pages/WarehouseOrderRequest/WarehouseOrderRequest.js b/public/js/pages/WarehouseOrderRequest/WarehouseOrderRequest.js
new file mode 100644
index 000000000..09c2fc1a5
--- /dev/null
+++ b/public/js/pages/WarehouseOrderRequest/WarehouseOrderRequest.js
@@ -0,0 +1,57 @@
+Vue.component('warehouse-order-request', {
+    //language=Vue
+    template: `
+                <tt-card>
+                  <tt-table-crud @openHistory="historyModal = true; historyModalId = $event.id" ref="crud">
+                    <template v-slot:create="{ row }">
+                      {{ row.create ? window.moment(row.create * 1000).format('DD.MM.YYYY') : '' }}
+                    </template>
+                    
+                    <template v-slot:order="{ row }">
+                      {{ row.order ? window.moment(row.order * 1000).format('DD.MM.YYYY') : '' }}
+                    </template>
+                    
+                    <template v-slot:takeover="{ row }">
+                      {{ row.takeover ? window.moment(row.takeover * 1000).format('DD.MM.YYYY') : '' }}
+                    </template>
+                    
+                    <template v-slot:note="{ row }">
+                        <span v-if="row.note.length > 45" :title="row.note">{{ row.note.substring(0, 45) }}...</span>
+                        <span v-else>{{ row.note }}</span>
+                    </template>
+                    
+                  </tt-table-crud>
+                  <warehouse-history-modal :show.sync="historyModal" :id="historyModalId"/>
+                </tt-card>
+              `, data() {
+        return {
+            window: window, historyModal: false, historyModalId: null,
+        }
+    },
+    async mounted() {
+        // set a watch to ref.crud crudModal and if crudModal and then log ref crudModalData
+        this.$refs.crud.$watch('crudModal', (value) => {
+            if (value) {
+                console.log(this.$refs.crud.crudModalData)
+                // if id is not 'create' then check if order is set and if not set it to current date
+                // if order is set then check if takeover is set and if not set it to current date
+                if (!this.$refs.crud.crudModalData.id) return
+
+                if (!this.$refs.crud.crudModalData.order) {
+                    this.$refs.crud.crudModalData.order = window.moment().unix()
+                    this.$refs.crud.crudModalData.orderBy = window.TT_CONFIG.user_id
+                    this.$refs.crud.$refs["order-modal-input"][0].setStartDate(window.moment().format('MM/DD/YYYY'))
+                    return
+                }
+
+                if (!this.$refs.crud.crudModalData.takeover) {
+                    this.$refs.crud.crudModalData.takeover = window.moment().unix
+                    this.$refs.crud.crudModalData.takeOverBy = window.TT_CONFIG.user_id
+                    this.$refs.crud.$refs["takeover-modal-input"][0].setStartDate(window.moment().format('MM/DD/YYYY'))
+                }
+
+
+            }
+        })
+    }
+})
diff --git a/public/plugins/vue/tt-components/tt-datepicker.js b/public/plugins/vue/tt-components/tt-datepicker.js
index 6ecddc879..17b2df590 100644
--- a/public/plugins/vue/tt-components/tt-datepicker.js
+++ b/public/plugins/vue/tt-components/tt-datepicker.js
@@ -5,7 +5,7 @@ Vue.component('tt-date-picker', {
         placeholder: String,
         required: Boolean,
         row: Boolean,
-        value: [Object, Number],
+        value: [Object, Number, String],
         hint: String,
         additionalProps: Object,
         sm: { type: Boolean, default: false },
@@ -115,6 +115,9 @@ Vue.component('tt-date-picker', {
             if (datepicker && !datepicker.contains(event.target) && event.target !== input) {
                 $(this.$refs.input).data('daterangepicker').hide();
             }
+        },
+        setStartDate(date) {
+            $(this.$refs.input).data('daterangepicker').setStartDate(date);
         }
     },
     watch: {
diff --git a/public/plugins/vue/tt-components/tt-table-crud.js b/public/plugins/vue/tt-components/tt-table-crud.js
index 6529d6aa7..122a867c7 100644
--- a/public/plugins/vue/tt-components/tt-table-crud.js
+++ b/public/plugins/vue/tt-components/tt-table-crud.js
@@ -65,7 +65,7 @@ Vue.component('tt-table-crud', {
                            <tt-textarea v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'textarea'" v-model="crudModalData[column.key]" :label="column.text" sm row/>
                            <tt-select v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'select'" v-model="crudModalData[column.key]" :label="column.text" :options="column.items" sm row/>
                            <tt-autocomplete v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'autocomplete'" v-model="crudModalData[column.key]" :label="column.text" :api-url="column.apiUrl" :items="column.items" sm row :return-text="column.returnText" />
-                           <tt-date-picker v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'datepicker'" v-model="crudModalData[column.key]" :label="column.text" sm row :date-range="false"/>
+                           <tt-date-picker v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'datepicker'" v-model="crudModalData[column.key]" :label="column.text" sm row :date-range="false" :ref="column.key.toLowerCase() + '-modal-input'"/>
                            <tt-icon-select v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'icon-select'" v-model="crudModalData[column.key]" :label="column.text" sm row/>
                            <tt-checkbox v-show="crudModalColumnVisibility[column.key]" v-else-if="column.type === 'checkbox'" v-model="crudModalData[column.key]" :label="column.text" sm row/>
                          </slot>