diff --git a/src/components/controls/Date.vue b/src/components/controls/Date.vue
new file mode 100644
index 00000000..6a4054ca
--- /dev/null
+++ b/src/components/controls/Date.vue
@@ -0,0 +1,30 @@
+<template>
+  <div class="form-group">
+    <label>{{ docfield.label }}</label>
+    <flat-pickr
+      :value="value"
+      class="form-control"
+      @on-change="emitChange"
+    >
+    </flat-pickr>
+  </div>
+</template>
+<script>
+import flatPickr from 'vue-flatpickr-component';
+import Data from './Data';
+
+export default {
+  extends: Data,
+  components: {
+    flatPickr
+  },
+  methods: {
+    emitChange(dates, dateString) {
+      this.$emit('change', dateString);
+    }
+  }
+};
+</script>
+<style lang="scss">
+@import "flatpickr/dist/flatpickr.css";
+</style>
diff --git a/src/components/controls/FrappeControl.vue b/src/components/controls/FrappeControl.vue
index 65ad49e9..fafbcfaa 100644
--- a/src/components/controls/FrappeControl.vue
+++ b/src/components/controls/FrappeControl.vue
@@ -7,6 +7,7 @@ import Check from './Check';
 import Code from './Code';
 import Currency from './Currency';
 import Data from './Data';
+import Date from './Date';
 import Float from './Float';
 import Link from './Link';
 import Select from './Select';
@@ -22,6 +23,7 @@ export default {
                 Code,
                 Currency,
                 Data,
+                Date,
                 Float,
                 Link,
                 Select,