日期组件完善
This commit is contained in:
@@ -10,8 +10,7 @@
|
|||||||
:value="momVal"
|
:value="momVal"
|
||||||
:showTime="true"
|
:showTime="true"
|
||||||
:format="dateFormat"
|
:format="dateFormat"
|
||||||
:getCalendarContainer="getCalendarContainer"
|
:getCalendarContainer="getCalendarContainer"></a-date-picker>
|
||||||
/>
|
|
||||||
<!--YYYY-MM-DD-->
|
<!--YYYY-MM-DD-->
|
||||||
<a-date-picker
|
<a-date-picker
|
||||||
v-if="showType === 'day'"
|
v-if="showType === 'day'"
|
||||||
@@ -22,8 +21,7 @@
|
|||||||
:value="momVal"
|
:value="momVal"
|
||||||
:showTime="false"
|
:showTime="false"
|
||||||
:format="dateFormat"
|
:format="dateFormat"
|
||||||
:getCalendarContainer="getCalendarContainer"
|
:getCalendarContainer="getCalendarContainer"></a-date-picker>
|
||||||
/>
|
|
||||||
<!--YYYY-MM-->
|
<!--YYYY-MM-->
|
||||||
<a-month-picker
|
<a-month-picker
|
||||||
v-if="showType === 'month'"
|
v-if="showType === 'month'"
|
||||||
@@ -31,7 +29,7 @@
|
|||||||
:value="momVal"
|
:value="momVal"
|
||||||
:disabled="disabled || readOnly"
|
:disabled="disabled || readOnly"
|
||||||
:format="dateFormat"
|
:format="dateFormat"
|
||||||
@change="handleMonthChange"/>
|
@change="handleMonthChange"></a-month-picker>
|
||||||
<!--YYYY-->
|
<!--YYYY-->
|
||||||
<a-date-picker
|
<a-date-picker
|
||||||
v-if="showType === 'year'"
|
v-if="showType === 'year'"
|
||||||
@@ -39,9 +37,12 @@
|
|||||||
mode="year"
|
mode="year"
|
||||||
:format="dateFormat"
|
:format="dateFormat"
|
||||||
:value="year"
|
:value="year"
|
||||||
:open='yearShowOne'
|
@disabledDate="disabledDate"
|
||||||
|
:disabled="disabled || readOnly"
|
||||||
|
:open="yearShowOne"
|
||||||
|
:getCalendarContainer="getCalendarContainer"
|
||||||
@openChange="openChangeOne"
|
@openChange="openChangeOne"
|
||||||
@panelChange="panelChangeOne"/>
|
@panelChange="panelChangeOne"></a-date-picker>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -96,12 +97,9 @@
|
|||||||
yearShowOne:false, //控制年份模态框的显示与否
|
yearShowOne:false, //控制年份模态框的显示与否
|
||||||
year:'',
|
year:'',
|
||||||
decorator:"",
|
decorator:"",
|
||||||
momVal:!dateStr?null:moment(dateStr,this.dateFormat)
|
momVal:!dateStr?null:moment(dateStr,this.dateFormat),
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted(){
|
|
||||||
console.log(this.showTime)
|
|
||||||
},
|
|
||||||
watch: {
|
watch: {
|
||||||
value (val) {
|
value (val) {
|
||||||
if(!val){
|
if(!val){
|
||||||
@@ -112,6 +110,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
disabledDate(current){
|
||||||
|
return new Date(current._d).setFullYear((new Date(current._d).getFullYear())) < new Date(moment()._d).setFullYear((new Date(moment()._d).getFullYear() - 1))
|
||||||
|
},
|
||||||
moment,
|
moment,
|
||||||
handleDateChange(mom,dateStr){
|
handleDateChange(mom,dateStr){
|
||||||
this.$emit('change', dateStr);
|
this.$emit('change', dateStr);
|
||||||
@@ -122,17 +123,15 @@
|
|||||||
// 弹出日历和关闭日历的回调
|
// 弹出日历和关闭日历的回调
|
||||||
openChangeOne(status){
|
openChangeOne(status){
|
||||||
//status是打开或关闭的状态
|
//status是打开或关闭的状态
|
||||||
if(status){
|
this.yearShowOne = status
|
||||||
this.yearShowOne = true
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
// 得到年份选择器的值
|
// 得到年份选择器的值
|
||||||
panelChangeOne(value){
|
panelChangeOne(value){
|
||||||
|
this.yearShowOne = false
|
||||||
let year = moment(value,this.dateFormat).year().toString() // 处理成字符串
|
let year = moment(value,this.dateFormat).year().toString() // 处理成字符串
|
||||||
this.year = value //组件显示的
|
this.year = value //组件显示的
|
||||||
this.$emit('change',year)
|
this.$emit('change',year)
|
||||||
this.yearShowOne = false
|
}
|
||||||
},
|
|
||||||
},
|
},
|
||||||
//2.2新增 在组件内定义 指定父组件调用时候的传值属性和事件类型 这个牛逼
|
//2.2新增 在组件内定义 指定父组件调用时候的传值属性和事件类型 这个牛逼
|
||||||
model: {
|
model: {
|
||||||
|
|||||||
Reference in New Issue
Block a user