v1.1.20 : Fix issues with the position of picker when is open

chronotruck · Aug 13, 2018 · 8ea6cfa · 8ea6cfa
1 parent 8960432
commit 8ea6cfa
Show file tree

Hide file tree

Showing 23 changed files with 30 additions and 22 deletions.
diff --git a/demo/index.html b/demo/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>vue-ctk-date-time-picker</title><link rel=stylesheet href=./assets/main.css><link href=./static/css/app.08d726dffb5baecfe31edade6eb46d63.css rel=stylesheet></head><body><div id=app></div><script src=/build/build.js></script><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.88b4d2f1b6949b36de49.js></script><script type=text/javascript src=./static/js/app.bcc28b3136a0603355ca.js></script></body></html>
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>vue-ctk-date-time-picker</title><link rel=stylesheet href=./assets/main.css><link href=./static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css rel=stylesheet></head><body><div id=app></div><script src=/build/build.js></script><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.88b4d2f1b6949b36de49.js></script><script type=text/javascript src=./static/js/app.b92df41e8cac0b017c12.js></script></body></html>
diff --git a/demo/static/css/app.08d726dffb5baecfe31edade6eb46d63.css b/demo/static/css/app.08d726dffb5baecfe31edade6eb46d63.css
diff --git a/demo/static/css/app.08d726dffb5baecfe31edade6eb46d63.css.map b/demo/static/css/app.08d726dffb5baecfe31edade6eb46d63.css.map
diff --git a/demo/static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css b/demo/static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css
diff --git a/demo/static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css.map b/demo/static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css.map
diff --git a/demo/static/js/app.bcc28b3136a0603355ca.js → demo/static/js/app.b92df41e8cac0b017c12.js b/demo/static/js/app.bcc28b3136a0603355ca.js → demo/static/js/app.b92df41e8cac0b017c12.js
diff --git a/demo/static/js/app.b92df41e8cac0b017c12.js.map b/demo/static/js/app.b92df41e8cac0b017c12.js.map
diff --git a/demo/static/js/app.bcc28b3136a0603355ca.js.map b/demo/static/js/app.bcc28b3136a0603355ca.js.map
diff --git a/demo/static/js/manifest.3ad1d5771e9b13dbdad2.js.map b/demo/static/js/manifest.3ad1d5771e9b13dbdad2.js.map
diff --git a/dist/umd/vue-ctk-date-time-picker.min.css b/dist/umd/vue-ctk-date-time-picker.min.css
diff --git a/dist/umd/vue-ctk-date-time-picker.min.css.map b/dist/umd/vue-ctk-date-time-picker.min.css.map
diff --git a/dist/umd/vue-ctk-date-time-picker.min.js b/dist/umd/vue-ctk-date-time-picker.min.js
diff --git a/dist/umd/vue-ctk-date-time-picker.min.js.map b/dist/umd/vue-ctk-date-time-picker.min.js.map
diff --git a/dist/vue-ctk-date-time-picker.min.css b/dist/vue-ctk-date-time-picker.min.css
diff --git a/dist/vue-ctk-date-time-picker.min.css.map b/dist/vue-ctk-date-time-picker.min.css.map
diff --git a/dist/vue-ctk-date-time-picker.min.js b/dist/vue-ctk-date-time-picker.min.js
diff --git a/dist/vue-ctk-date-time-picker.min.js.map b/dist/vue-ctk-date-time-picker.min.js.map
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-ctk-date-time-picker",
-  "version": "1.1.19",
+  "version": "1.1.20",
   "description": "A vue component for select date & time (by Chronotruck)",
   "author": "Louis Mazel <[email protected]>",
   "main": "dist/vue-ctk-date-time-picker.min.js",

diff --git a/src/vue-ctk-date-time-picker/_subs/CtkDatePickerAgenda.vue b/src/vue-ctk-date-time-picker/_subs/CtkDatePickerAgenda.vue
@@ -228,6 +228,7 @@ export default {
     position: absolute;
     z-index: 5;
     border-radius: 4px;
+    overflow: hidden;
     background: #FFF;
     -webkit-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
     box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);

diff --git a/src/vue-ctk-date-time-picker/vue-ctk-date-time-picker.vue b/src/vue-ctk-date-time-picker/vue-ctk-date-time-picker.vue
@@ -176,7 +176,14 @@ export default {
       }
       const rect = this.$refs.parent.getBoundingClientRect()
       const windowHeight = window.innerHeight
-      const datePickerHeight = 300
+      let datePickerHeight = 428
+      if (!this.enableButtonValidate) {
+        datePickerHeight = datePickerHeight - 46
+      }
+      if (this.withoutHeader) {
+        datePickerHeight = datePickerHeight - 65
+      }
+      console.log('datePickerHeight', datePickerHeight)
       if (((windowHeight - (rect.top + rect.height)) > datePickerHeight) || ((windowHeight - rect.top) > windowHeight / 2 + rect.height)) {
         this.agendaPosition = 'top'
       } else {

diff --git a/styleguide/build/bundle.d32a826d.js → styleguide/build/bundle.bfb8cc49.js b/styleguide/build/bundle.d32a826d.js → styleguide/build/bundle.bfb8cc49.js
diff --git a/styleguide/index.html b/styleguide/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Vue Ctk Date Time Picker Style Guide</title></head><body><div id="rsg-root"></div><script src="build/bundle.d32a826d.js"></script></body></html>
+<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Vue Ctk Date Time Picker Style Guide</title></head><body><div id="rsg-root"></div><script src="build/bundle.bfb8cc49.js"></script></body></html>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>vue-ctk-date-time-picker</title><link rel=stylesheet href=./assets/main.css><link href=./static/css/app.08d726dffb5baecfe31edade6eb46d63.css rel=stylesheet></head><body><div id=app></div><script src=/build/build.js></script><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.88b4d2f1b6949b36de49.js></script><script type=text/javascript src=./static/js/app.bcc28b3136a0603355ca.js></script></body></html>
		<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>vue-ctk-date-time-picker</title><link rel=stylesheet href=./assets/main.css><link href=./static/css/app.e06b72e2fbf158d6e5510e7a529723e2.css rel=stylesheet></head><body><div id=app></div><script src=/build/build.js></script><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.88b4d2f1b6949b36de49.js></script><script type=text/javascript src=./static/js/app.b92df41e8cac0b017c12.js></script></body></html>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Vue Ctk Date Time Picker Style Guide</title></head><body><div id="rsg-root"></div><script src="build/bundle.d32a826d.js"></script></body></html>
		<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Vue Ctk Date Time Picker Style Guide</title></head><body><div id="rsg-root"></div><script src="build/bundle.bfb8cc49.js"></script></body></html>