Commit 73a34dfab5590ce73df021114bebeaf01b21273e

Authored by Sergio Crisostomo
1 parent 8c16b301

Fix year/month pre-selection

src/components/date-picker/panel/Date/date-range.vue
... ... @@ -13,15 +13,16 @@
13 13 :class="iconBtnCls('prev', '-double')"
14 14 @click="prevYear('left')"><Icon type="ios-arrow-left"></Icon></span>
15 15 <span
  16 + v-if="splitPanels || leftPickerTable === 'date-table'"
16 17 :class="iconBtnCls('prev')"
17 18 @click="prevMonth('left')"
18 19 v-show="currentView === 'date'"><Icon type="ios-arrow-left"></Icon></span>
19 20 <date-panel-label
20 21 :date-panel-label="leftDatePanelLabel"
21   - :current-view="currentView"
  22 + :current-view="leftDatePanelView"
22 23 :date-prefix-cls="datePrefixCls"></date-panel-label>
23 24 <span
24   - v-if="splitPanels"
  25 + v-if="splitPanels || leftPickerTable !== 'date-table'"
25 26 :class="iconBtnCls('next', '-double')"
26 27 @click="nextYear('left')"><Icon type="ios-arrow-right"></Icon></span>
27 28 <span
... ... @@ -48,7 +49,7 @@
48 49 <div :class="[prefixCls + '-content', prefixCls + '-content-right']" v-show="!isTime">
49 50 <div :class="[datePrefixCls + '-header']" v-show="currentView !== 'time'">
50 51 <span
51   - v-if="splitPanels"
  52 + v-if="splitPanels || rightPickerTable !== 'date-table'"
52 53 :class="iconBtnCls('prev', '-double')"
53 54 @click="prevYear('right')"><Icon type="ios-arrow-left"></Icon></span>
54 55 <span
... ... @@ -58,12 +59,13 @@
58 59 v-show="currentView === 'date'"><Icon type="ios-arrow-left"></Icon></span>
59 60 <date-panel-label
60 61 :date-panel-label="rightDatePanelLabel"
61   - :current-view="currentView"
  62 + :current-view="rightDatePanelView"
62 63 :date-prefix-cls="datePrefixCls"></date-panel-label>
63 64 <span
64 65 :class="iconBtnCls('next', '-double')"
65 66 @click="nextYear('right')"><Icon type="ios-arrow-right"></Icon></span>
66 67 <span
  68 + v-if="splitPanels || rightPickerTable === 'date-table'"
67 69 :class="iconBtnCls('next')"
68 70 @click="nextMonth('right')"
69 71 v-show="currentView === 'date'"><Icon type="ios-arrow-right"></Icon></span>
... ... @@ -169,6 +171,12 @@
169 171 rightDatePanelLabel(){
170 172 return this.panelLabelConfig('right');
171 173 },
  174 + leftDatePanelView(){
  175 + return this.leftPickerTable.split('-').shift();
  176 + },
  177 + rightDatePanelView(){
  178 + return this.rightPickerTable.split('-').shift();
  179 + },
172 180 timeDisabled(){
173 181 return !(this.dates[0] && this.dates[1]);
174 182 },
... ... @@ -287,7 +295,16 @@
287 295 },
288 296 handlePreSelection(panel, value){
289 297 this[`${panel}PanelDate`] = value;
290   - this[`${panel}PickerTable`] = `${this.currentView}-table`;
  298 + const currentViewType = this[`${panel}PickerTable`];
  299 + if (currentViewType === 'year-table') this[`${panel}PickerTable`] = 'month-table';
  300 + else this[`${panel}PickerTable`] = `${this.currentView}-table`;
  301 +
  302 + if (!this.splitPanels){
  303 + const otherPanel = panel === 'left' ? 'right' : 'left';
  304 + const type = currentViewType === 'year-table' ? 'FullYear' : 'Month';
  305 + this[`${otherPanel}PanelDate`] = value;
  306 + this.changePanelDate(otherPanel, type, 1);
  307 + }
291 308 },
292 309 handleRangePick (val) {
293 310 if (this.rangeState.selecting || this.currentView === 'time'){
... ...
src/components/date-picker/panel/Date/date.vue
... ... @@ -12,17 +12,19 @@
12 12 :class="iconBtnCls('prev', '-double')"
13 13 @click="changeYear(-1)"><Icon type="ios-arrow-left"></Icon></span>
14 14 <span
  15 + v-if="pickerTable === 'date-table'"
15 16 :class="iconBtnCls('prev')"
16 17 @click="changeMonth(-1)"
17 18 v-show="currentView === 'date'"><Icon type="ios-arrow-left"></Icon></span>
18 19 <date-panel-label
19 20 :date-panel-label="datePanelLabel"
20   - :current-view="currentView"
  21 + :current-view="pickerTable.split('-').shift()"
21 22 :date-prefix-cls="datePrefixCls"></date-panel-label>
22 23 <span
23 24 :class="iconBtnCls('next', '-double')"
24 25 @click="changeYear(+1)"><Icon type="ios-arrow-right"></Icon></span>
25 26 <span
  27 + v-if="pickerTable === 'date-table'"
26 28 :class="iconBtnCls('next')"
27 29 @click="changeMonth(+1)"
28 30 v-show="currentView === 'date'"><Icon type="ios-arrow-right"></Icon></span>
... ... @@ -155,7 +157,7 @@
155 157 this.pickerTable = this.getTableType(this.currentView);
156 158 },
157 159 changeYear(dir){
158   - if (this.selectionMode === 'year'){
  160 + if (this.selectionMode === 'year' || this.pickerTable === 'year-table'){
159 161 this.panelDate = new Date(this.panelDate.getFullYear() + dir * 10, 0, 1);
160 162 } else {
161 163 this.panelDate = siblingMonth(this.panelDate, dir * 12);
... ... @@ -169,7 +171,9 @@
169 171 },
170 172 handlePreSelection(value){
171 173 this.panelDate = value;
172   - this.pickerTable = this.getTableType(this.currentView);
  174 + if (this.pickerTable === 'year-table') this.pickerTable = 'month-table';
  175 + else this.pickerTable = this.getTableType(this.currentView);
  176 +
173 177 },
174 178 handlePick (value) {
175 179 const {selectionMode, panelDate} = this;
... ...