DatePicker: fix editable and readonly in range pick

examples/docs/en-US/upload.md

@@ -247,7 +247,7 @@ Use `list-type` to change the fileList style.
   :on-remove="handleRemove">
   <i class="el-icon-plus"></i>
 </el-upload>
-<el-dialog v-model="dialogVisible" size="tiny">
+<el-dialog :visible.sync="dialogVisible" size="tiny">
   <img width="100%" :src="dialogImageUrl" alt="">
 </el-dialog>
 <script>

examples/docs/zh-CN/upload.md

@@ -247,7 +247,7 @@
   :on-remove="handleRemove">
   <i class="el-icon-plus"></i>
 </el-upload>
-<el-dialog v-model="dialogVisible" size="tiny">
+<el-dialog :visible.sync="dialogVisible" size="tiny">
   <img width="100%" :src="dialogImageUrl" alt="">
 </el-dialog>
 <script>

packages/date-picker/src/picker.vue

@@ -49,6 +49,7 @@
       :value="displayValue && displayValue[0]"
       :disabled="disabled"
       :id="id && id[0]"
+      :readonly="!editable || readonly"
       :name="name && name[0]"
       @input="handleStartInput"
       @change="handleStartChange"
@@ -60,6 +61,7 @@
       :value="displayValue && displayValue[1]"
       :disabled="disabled"
       :id="id && id[1]"
+      :readonly="!editable || readonly"
       :name="name && name[1]"
       @input="handleEndInput"
       @change="handleEndChange"

test/unit/specs/popover.spec.js

@@ -205,57 +205,46 @@ describe('Popover', () => {
     });
   });
 
-  describe('event', (done) => {
+  it('show/hide events', done => {
-    const createVM = (trigger) => {
+    vm = createVue({
-      return createVue({
+      template: `
-        template: `
+        <div>
-          <div>
+          <el-popover
-            <el-popover
+            ref="popover"
-              ref="popover"
+            trigger="click"
-              trigger="${trigger}"
+            @show="handleShow"
-              @show="handleShow"
+            @hide="handleHide"
-              @hide="handleHide"
+            content="content">
-              content="content">
+            <button slot="reference">trigger</button>
-              <button slot="reference">trigger ${trigger}</button>
+          </el-popover>
-            </el-popover>
+        </div>
-          </div>
+      `,
-        `,
 
-        methods: {
+      methods: {
-          handleShow() {
+        handleShow() {
-            this.trigger = true;
+          this.trigger = true;
-          },
-          handleHide() {
-            this.trigger = false;
-          }
         },
-
+        handleHide() {
-        data() {
+          this.trigger = false;
-          return {
-            trigger: false
-          };
         }
-      }, true);
+      },
-    };
 
-    it('show/hide', () => {
+      data() {
-      vm = createVM('click');
+        return {
-      const compo = vm.$refs.popover;
+          trigger: false
+        };
+      }
+    }, true);
 
-      vm.$el.querySelector('button').click();
+    vm.$el.querySelector('button').click();
-      expect(compo.showPopper).to.true;
+    setTimeout(_ => {
-      expect(vm.trigger).to.false;
+      expect(vm.trigger).to.true;
       document.body.click();
-      expect(compo.showPopper).to.false;
       setTimeout(_ => {
-        expect(vm.trigger).to.true;
+        expect(vm.trigger).to.false;
-        document.body.click();
-        setTimeout(_ => {
-          expect(vm.trigger).to.false;
-        }, 50);
         done();
       }, 50);
-    });
+    }, 50);
   });
 
   it('destroy event', () => {