|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- <template>
- <view class="cu-form-group">
- <view class="title">
- <text v-if="required" class="lr-required">*</text>
- {{ title }}
- </view>
- <picker
- @change="change"
- :fields="fields"
- :disabled="disabled"
- :value="value"
- :start="start"
- :end="end"
- :class="[disabled ? '' : 'picker-arrow']"
- mode="date"
- >
- <view class="picker">
- <slot>{{ value || displayPlaceholder }}</slot>
- </view>
- </picker>
- </view>
- </template>
-
- <script>
- export default {
- name: 'l-date-picker',
-
- props: {
- title: {},
- start: { default: '1900-01-01' },
- end: { default: '2100-01-01' },
- fields: { default: 'day' },
- disabled: {},
- placeholder: {},
- required: {},
- value: {}
- },
-
- methods: {
- change(e) {
- this.$emit('input', e.detail.value)
- this.$emit('change', e.detail.value)
- }
- },
-
- computed: {
- displayPlaceholder() {
- if (this.disabled) {
- return ''
- }
-
- if (this.placeholder) {
- return this.placeholder
- }
-
- return this.title ? `请选择${this.title}` : '请选择日期…'
- }
- }
- }
- </script>
|