update DatePicker

update DatePicker

update DatePicker
梁灏
1 parent 13be4434
Showing 4 changed files with 76 additions and 7 deletions Show diff stats
src/components/date-picker/panel/date.vue
src/components/table/table.vue
src/styles/components/date-picker.less
test/routers/date.vue
 <template>
-    <div :class="[prefixCls + '-body-wrapper']">
+    <div :class="classes">
         <div :class="[prefixCls + '-sidebar']" v-if="shortcuts">
             <div
                 :class="[prefixCls + '-shortcut']"
@@ -91,6 +91,14 @@
             }
         },
         computed: {
+            classes () {
+                return [
+                    `${prefixCls}-body-wrapper`,
+                    {
+                        [`${prefixCls}-with-sidebar`]: this.shortcuts.length
+                    }
+                ]
+            },
             yearLabel () {
                 const year = this.year;
                 if (!year) return '';
@@ -122,7 +130,8 @@
                 this.$emit('on-pick', '');
             },
             handleShortcutClick (shortcut) {
-
+                if (shortcut.value) this.$emit('on-pick', shortcut.value());
+                if (shortcut.onClick) shortcut.onClick(this);
             },
             iconBtnCls (direction, type = '') {
                 return [
@@ -454,14 +454,17 @@
                 let data = this.makeData();
                 let sortType = 'normal';
                 let sortIndex = -1;
+                let isCustom = false;
+
                 for (let i = 0; i < this.cloneColumns.length; i++) {
                     if (this.cloneColumns[i]._sortType !== 'normal') {
                         sortType = this.cloneColumns[i]._sortType;
                         sortIndex = i;
+                        isCustom = this.cloneColumns[i].sortable === 'custom';
                         break;
                     }
                 }
-                if (sortType !== 'normal') data =  this.sortData(data, sortType, sortIndex);
+                if (sortType !== 'normal' && !isCustom) data =  this.sortData(data, sortType, sortIndex);
                 return data;
             },
             makeDataWithFilter () {
@@ -172,5 +172,25 @@
                 font-size: 14px;
             }
         }
+
+        &-body-wrapper&-with-sidebar{
+            padding-left: 92px;
+        }
+        &-sidebar{
+            width: 92px;
+            float: left;
+            margin-left: -92px;
+            position: absolute;
+            top: 0;
+            bottom: 0;
+            background: @border-color-split;
+            border-radius: @border-radius-small 0 0 @border-radius-small;
+        }
+        &-shortcut{
+
+        }
+        &-body{
+            float: left;
+        }
     }
 }
 \ No newline at end of file
@@ -3,6 +3,7 @@
         <br>
         <row>
             <i-col span="4">
+                <!--<i-button @click="setDate">set date</i-button>-->
                 <date-picker
                         style="width:200px"
                         placeholder="请选择日期"
@@ -25,17 +26,50 @@
     export default {
         data () {
             return {
-                value: new Date(),
-//                value: '',
+//                value: new Date(),
+                value: '',
                 options: {
                     disabledDate(time) {
 //                        console.log(time)
 //                        return time.getFullYear() < 2016;
                         return time.getTime() < Date.now() - 8.64e7;
 //                        return time && time.valueOf() < Date.now();
-                    }
+                    },
+                    shortcuts: [
+                        {
+                            text: '今天',
+                            value () {
+                                return new Date();
+                            },
+                            onClick () {
+                                console.log('点击了今天');
+                            }
+                        },
+                        {
+                            text: '昨天',
+                            value () {
+                                const date = new Date();
+                                date.setTime(date.getTime() - 3600 * 1000 * 24);
+                                return date;
+                            },
+                            onClick () {
+                                console.log('点击了昨天');
+                            }
+                        },
+                        {
+                            text: '一周前',
+                            value () {
+                                const date = new Date();
+                                date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
+                                return date;
+                            },
+//                            onClick () {
+//                                console.log('点击了一周前');
+//                            }
+                        }
+                    ]
                 },
-                format: 'yyyy年MM月dd日'
+                format: 'yyyy-MM-dd'
             }
         },
         computed: {},
@@ -45,6 +79,9 @@
             },
             change2 (s) {
 //                console.log(s)
+            },
+            setDate () {
+                this.value = '2016-12-24'
             }
         }
     }