diff --git a/packages/date-picker/src/css/picker-panel.css b/packages/date-picker/src/css/picker-panel.css
index a7c2c1fb6..bf44084af 100644
--- a/packages/date-picker/src/css/picker-panel.css
+++ b/packages/date-picker/src/css/picker-panel.css
@@ -11,6 +11,10 @@
     margin: 5px 0;
     min-width: 513px;
 
+    &.has-sidebar {
+      min-width: 620px;
+    }
+
     @e body, body-wrapper {
       &::after {
         content: "";
diff --git a/packages/date-picker/src/panel/date-range.vue b/packages/date-picker/src/panel/date-range.vue
index 9e6cad8e8..5eb2e528f 100644
--- a/packages/date-picker/src/panel/date-range.vue
+++ b/packages/date-picker/src/panel/date-range.vue
@@ -275,7 +275,7 @@
         disabledDate: '',
         leftTimePickerVisible: false,
         rightTimePickerVisible: false,
-        width: 0
+        width: ''
       };
     },
 
diff --git a/packages/date-picker/src/panel/date.vue b/packages/date-picker/src/panel/date.vue
index 902b816ab..3b37cad2b 100644
--- a/packages/date-picker/src/panel/date.vue
+++ b/packages/date-picker/src/panel/date.vue
@@ -345,7 +345,7 @@
         month: null,
         week: null,
         timePickerVisible: false,
-        width: 0
+        width: ''
       };
     },
 
diff --git a/packages/date-picker/src/panel/time-range.vue b/packages/date-picker/src/panel/time-range.vue
index c5cdd408d..bbc0bfdc8 100644
--- a/packages/date-picker/src/panel/time-range.vue
+++ b/packages/date-picker/src/panel/time-range.vue
@@ -93,7 +93,7 @@
         minSeconds: minTime.getSeconds(),
         format: 'HH:mm:ss',
         visible: false,
-        width: 0
+        width: ''
       };
     },
 
diff --git a/packages/date-picker/src/panel/time-select.vue b/packages/date-picker/src/panel/time-select.vue
index 402fd96dd..b85369afe 100644
--- a/packages/date-picker/src/panel/time-select.vue
+++ b/packages/date-picker/src/panel/time-select.vue
@@ -93,7 +93,7 @@
         value: '',
         visible: false,
         minTime: '',
-        width: 0
+        width: ''
       };
     },
 
diff --git a/packages/date-picker/src/panel/time.vue b/packages/date-picker/src/panel/time.vue
index 18027cfa1..d886b2055 100644
--- a/packages/date-picker/src/panel/time.vue
+++ b/packages/date-picker/src/panel/time.vue
@@ -83,7 +83,7 @@
         selectableRange: [],
         currentDate: this.$options.defaultValue || this.date,
         currentVisible: this.visible,
-        width: 0
+        width: ''
       };
     },
 
diff --git a/packages/select-dropdown/src/select-dropdown.vue b/packages/select-dropdown/src/select-dropdown.vue
index d774a8384..4323918ab 100644
--- a/packages/select-dropdown/src/select-dropdown.vue
+++ b/packages/select-dropdown/src/select-dropdown.vue
@@ -51,8 +51,8 @@
     mounted() {
       this.referenceElm = this.$parent.$refs.reference.$el;
       this.$parent.popperElm = this.popperElm = this.$el;
-      this.$on('updatePopper', _ => { this.showPopper = true; });
-      this.$on('destroyPopper', _ => { this.showPopper = false; });
+      this.$on('updatePopper', this.updatePopper);
+      this.$on('destroyPopper', this.destroyPopper);
     }
   };
 </script>
diff --git a/src/utils/vue-popper.js b/src/utils/vue-popper.js
index ba0d22ae0..88789d077 100644
--- a/src/utils/vue-popper.js
+++ b/src/utils/vue-popper.js
@@ -83,7 +83,10 @@ export default {
       options.placement = this.placement;
       options.offset = this.offset;
       this.popperJS = new PopperJS(reference, popper, options);
-      this.popperJS.onCreate(_ => this.$emit('created', this));
+      this.popperJS.onCreate(_ => {
+        this.$emit('created', this);
+        this.resetTransformOrigin();
+      });
       this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
     },
 
@@ -99,15 +102,15 @@ export default {
 
     destroyPopper() {
       if (this.popperJS) {
-        this.resetTransformOrigin(this.popperJS);
+        this.resetTransformOrigin();
       }
     },
 
-    resetTransformOrigin(popper) {
+    resetTransformOrigin() {
       let placementMap = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' };
-      let placement = popper._popper.getAttribute('x-placement').split('-')[0];
+      let placement = this.popperJS._popper.getAttribute('x-placement').split('-')[0];
       let origin = placementMap[placement];
-      popper._popper.style.transformOrigin = ['top', 'bottom'].indexOf(placement) > -1 ? `center ${ origin }` : `${ origin } center`;
+      this.popperJS._popper.style.transformOrigin = ['top', 'bottom'].indexOf(placement) > -1 ? `center ${ origin }` : `${ origin } center`;
     },
 
     appendArrow(element) {