提交 cbeff864 编写于 作者: zhujiamin's avatar zhujiamin

debug 时间格式化

上级 26ad216c
<template> <template>
<div class="app-mobile-datetime-picker"> <div class="app-mobile-datetime-picker">
<ion-icon v-if="curValue" name="close-outline" @click="clear"></ion-icon> <ion-icon v-if="curValue" name="close-outline" @click="clear"></ion-icon>
<ion-datetime <ion-datetime
:max="max" :max="max"
:min="min" :min="min"
:display-format="displayFormat" :display-format="displayFormat"
:value="value" :value="value"
:placeholder="placeholder" :placeholder="placeholder"
:disabled="disabled" :disabled="disabled"
@ionChange="valueChange($event)" @ionChange="valueChange($event)"
:cancel-text="$t('cancel_text')" :cancel-text="$t('cancel_text')"
:done-text="$t('done_text')" :done-text="$t('done_text')"
></ion-datetime> ></ion-datetime>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { Vue, Component, Prop, Provide, Emit, Watch } from 'vue-property-decorator'; import {
const moment = require('moment'); Vue,
Component,
Prop,
Provide,
Emit,
Watch,
} from 'vue-property-decorator';
const moment = require('moment');
@Component({
@Component({
i18n: { i18n: {
messages: { messages: {
'ZH-CN': { 'ZH-CN': {
cancel_text: '取消', cancel_text: '取消',
done_text: '完成' done_text: '完成',
}, },
'EN-US': { 'EN-US': {
cancel_text: 'cancel', cancel_text: 'cancel',
done_text: 'submit' done_text: 'submit',
} },
} },
}, },
components: { components: {},
})
} export default class AppDateTimePicker extends Vue {
})
export default class AppDateTimePicker extends Vue {
/** /**
* 传入值 * 传入值
* *
* @type {string} * @type {string}
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
@Prop() public value?:string; @Prop() public value?: string;
/** /**
* 当前选中值 * 当前选中值
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
public curValue:any = this.value; public curValue: any = this.value;
/** /**
* 当前日期 * 当前日期
* @type {*} * @type {*}
* @memberof MOBILEENTITY3Canlen * @memberof MOBILEENTITY3Canlen
*/ */
protected currentDate:any = new Date().getFullYear(); protected currentDate: any = new Date().getFullYear();
/** /**
* 当前选中值 * 当前选中值
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
public min:any = this.currentDate - 100; public min: any = this.currentDate - 100;
public max:any = this.currentDate + 100; public max: any = this.currentDate + 100;
/** /**
* 是否禁用 * 是否禁用
...@@ -74,7 +75,7 @@ export default class AppDateTimePicker extends Vue { ...@@ -74,7 +75,7 @@ export default class AppDateTimePicker extends Vue {
* @type {boolean} * @type {boolean}
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
@Prop() public disabled?:boolean; @Prop() public disabled?: boolean;
/** /**
* placeholder * placeholder
...@@ -82,36 +83,35 @@ export default class AppDateTimePicker extends Vue { ...@@ -82,36 +83,35 @@ export default class AppDateTimePicker extends Vue {
* @type {boolean} * @type {boolean}
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
@Prop() public placeholder?:string; @Prop() public placeholder?: string;
/** /**
*时间选择改变 *时间选择改变
* *
* @param event{*} * @param event{*}
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
public valueChange(event:any){ public valueChange(event: any) {
this.curValue = event.detail.value; this.curValue = moment(event.detail.value).format('YYYY-MM-DD hh:mm:ss');
this.$emit('change',event.detail.value); this.$emit('change', this.curValue);
} }
/** /**
* 清空值 * 清空值
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
public clear(){ public clear() {
this.curValue = null; this.curValue = null;
this.$emit('change','') this.$emit('change', '');
} }
/** /**
* 时间精度 * 时间精度
* @memberof AppDateTimePicker * @memberof AppDateTimePicker
*/ */
@Prop({default:"YYYY-MM-DD hh:mm"}) public displayFormat?:string; @Prop({ default: 'YYYY-MM-DD hh:mm' }) public displayFormat?: string;
}
}
</script> </script>
<style lang="less"> <style lang="less">
@import './app-mob-datetime-picker.less'; @import './app-mob-datetime-picker.less';
</style> </style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册