chenhaodong / mew-iview

Commit 9ffdd6daea2b199af1875a1fed347dfbcd5238b5

Authored by Sergio Crisostomo
1 parent ccb6a76d

Propagate type changes to panel

Showing 2 changed files with 55 additions and 1 deletions   Show diff stats
Inline Side-by-side
src/components/date-picker/picker/date-picker.js
  Show/Hide comments   View file @9ffdd6d
... ... @@ -23,6 +23,17 @@ export default {
23 23 },
24 24 value: {}
25 25 },
  26 + watch: {
  27 + type(value){
  28 + const typeMap = {
  29 + year: 'year',
  30 + month: 'month',
  31 + date: 'day'
  32 + };
  33 + const validType = oneOf(value, Object.keys(typeMap));
  34 + if (validType) this.Panel.selectionMode = typeMap[value];
  35 + }
  36 + },
26 37 created () {
27 38 if (!this.currentValue) {
28 39 if (this.type === 'daterange' || this.type === 'datetimerange') {
... ...
test/unit/specs/date-picker.spec.js
  Show/Hide comments   View file @9ffdd6d
1   -import { createVue, destroyVM, stringToDate } from '../util';
  1 +import { createVue, destroyVM, stringToDate, promissedTick } from '../util';
2 2  
3 3 describe('DatePicker.vue', () => {
4 4 let vm;
... ... @@ -76,6 +76,49 @@ describe('DatePicker.vue', () => {
76 76 });
77 77 });
78 78  
  79 + it('should change type progamatically', done => {
  80 + vm = createVue({
  81 + template: '<Date-picker :type="dateType"></Date-picker>',
  82 + data() {
  83 + return {
  84 + dateType: 'month'
  85 + };
  86 + }
  87 + });
  88 +
  89 + const picker = vm.$children[0];
  90 + picker.handleIconClick();
  91 + vm.$nextTick(() => {
  92 + const panel = vm.$el.querySelector('.ivu-picker-panel-content');
  93 + const dayPanel = panel.querySelector('[class="ivu-date-picker-cells"]');
  94 + const monthPanel = panel.querySelector('.ivu-date-picker-cells-month');
  95 + const yearPanel = panel.querySelector('.ivu-date-picker-cells-year');
  96 +
  97 + expect(dayPanel.style.display).to.equal('none');
  98 + expect(monthPanel.style.display).to.equal('');
  99 + expect(yearPanel.style.display).to.equal('none');
  100 +
  101 + expect(picker.type).to.equal('month');
  102 + expect(picker.selectionMode).to.equal('month');
  103 +
  104 + vm.dateType = 'year';
  105 + promissedTick(picker)
  106 + .then(() => {
  107 + expect(picker.type).to.equal('year');
  108 + expect(picker.selectionMode).to.equal('year');
  109 +
  110 + vm.dateType = 'date';
  111 + return promissedTick(picker);
  112 + })
  113 + .then(() => {
  114 + expect(picker.type).to.equal('date');
  115 + expect(picker.selectionMode).to.equal('day');
  116 +
  117 + done();
  118 + });
  119 + });
  120 + });
  121 +
79 122 it('should have same behavior after a reset as before the reset', done => {
80 123 vm = createVue(`
81 124 <Date-picker type="datetimerange"></Date-picker>
... ...