DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-mpui/learun-ui-mp/time-picker.vue

<template>
  <view class="cu-form-group">
    <view class="title">
      <text v-if="required" class="lr-required">*</text>
      {{ title }}
    </view>
    <picker
      @change="change"
      :value="value"
      :start="start"
      :end="end"
      :disabled="disabled"
      :class="[disabled ? '' : 'picker-arrow']"
      mode="time"
    >
      <view class="picker">
        <slot>{{ value || displayPlaceholder }}</slot>
      </view>
    </picker>
  </view>
</template>

<script>
export default {
  name: 'l-time-picker',

  props: {
    title: {},
    start: { default: '00:00' },
    end: { default: '23:59' },
    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>