index_1.vue
2.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<template>
<view class="ncc-dateTime">
<u-input type="select" :select-open="selectShow" v-model="innerValue" :placeholder="placeholder"
@click="openSelect"></u-input>
<u-picker mode="time" :defaultTime="defaultTime" v-model="selectShow" :params="params" @confirm="selectConfirm">
</u-picker>
</view>
</template>
<script>
export default {
name: 'ncc-dateTime',
model: {
prop: 'value',
event: 'input'
},
props: {
value: {
type: [String, Number],
default: ''
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
},
type: {
type: String,
default: 'time'
}
},
data() {
return {
params: {
year: true,
month: true,
day: true,
hour: true,
minute: true,
second: true,
timestamp: true
},
defaultTime: '',
selectShow: false,
innerValue: '',
}
},
watch: {
value(val) {
this.setDefault()
}
},
created() {
this.setMode()
this.setDefault()
},
methods: {
setMode() {
if (this.type === 'time') {
this.params = {
...this.params,
year: false,
month: false,
day: false
}
}
if (this.type === 'date') {
this.params = {
...this.params,
hour: false,
minute: false,
second: false
}
}
},
setDefault() {
if (!this.value) return this.innerValue = ''
if (this.type === 'time') {
this.innerValue = this.value
} else {
const format = this.type === 'date' ? 'yyyy-mm-dd' : 'yyyy-mm-dd hh:MM:ss'
this.innerValue = this.$u.timeFormat(this.value, format)
}
this.defaultTime = this.innerValue
},
openSelect() {
if (this.disabled) return
this.selectShow = true
},
selectConfirm(e) {
this.innerValue = ''
if (this.params.year) this.innerValue += e.year
if (this.params.month) this.innerValue += '-' + e.month
if (this.params.day) this.innerValue += '-' + e.day
if (this.params.hour) this.innerValue += (this.type === 'time' ? '' : ' ') + e.hour
if (this.params.minute) this.innerValue += ':' + e.minute
if (this.params.second) this.innerValue += ':' + e.second
const value = this.type === 'time' ? this.innerValue : e.timestamp * 1000
this.defaultTime = this.innerValue
this.$emit('input', value)
}
}
}
</script>
<style lang="scss" scoped>
.ncc-dateTime {
width: 100%;
}
</style>