-

zhangwei

2025-03-05 16213c0f85aa3ac8317797bf4a05fd12940e16d3

 src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue

@@ -1,12 +1,20 @@
<template>
    <view v-if="hasInput" class="u-datetime-picker">
        <u-input
    <view class="u-datetime-picker">
        <view v-if="hasInput" class="u-datetime-picker__has-input"
            @click="onShowByClickInput" 
        >
            <slot name="trigger" :value="inputValue">
            <up-input
            :placeholder="placeholder"
         :readonly="!!showByClickInput"
            border="surround"
               border="none"
            v-model="inputValue"
            @click="showByClickInput = !showByClickInput"
        ></u-input>
               :disabled="disabled"
               :disabledColor="disabledColor"
            ></up-input>
            <div class="input-cover">
            </div>
         </slot>
    </view>
   <u-picker
      ref="picker"
@@ -23,12 +31,22 @@
      :confirmText="confirmText"
      :cancelColor="cancelColor"
      :confirmColor="confirmColor"
            :toolbarRightSlot="toolbarRightSlot"
      @close="close"
      @cancel="cancel"
      @confirm="confirm"
      @change="change"
   >
            <template #toolbar-right>
                <slot name="toolbar-right">
                </slot>
            </template>
            <template #toolbar-bottom>
                <slot name="toolbar-bottom">
                </slot>
            </template>
   </u-picker>
    </view>
</template>

<script>
@@ -79,7 +97,7 @@
    * @example  <u-datetime-picker :show="show" :value="value1"  mode="datetime" ></u-datetime-picker>
    */
   export default {
      name: 'datetime-picker',
      name: 'up-datetime-picker',
      mixins: [mpMixin, mixin, props],
      data() {
         return {
@@ -323,11 +341,12 @@
                 if (this.filter) {
                     values = this.filter(type, values)
                  if (!values || (values && values.length == 0)) {
                     uni.showToast({
                        title: '日期filter结果不能为空',
                        icon: 'error',
                        mask: true
                     })
                     // uni.showToast({
                     //    title: '日期filter结果不能为空',
                     //    icon: 'error',
                     //    mask: true
                     // })
                     console.log('日期filter结果不能为空')
                  }
                 }
                 return { type, values }
@@ -341,7 +360,8 @@
         // 得出合法的时间
         correctValue(value) {
            const isDateMode = this.mode !== 'time'
            if (isDateMode && !test.date(value)) {
            // if (isDateMode && !test.date(value)) {
            if (isDateMode && !dayjs.unix(value).isValid()) {
               // 如果是日期类型，但是又没有设置合法的当前时间的话，使用最小时间为当前时间
               value = this.minDate
            } else if (!isDateMode && !value) {
@@ -443,6 +463,12 @@
                 [`${type}Hour`]: hour,
                 [`${type}Minute`]: minute
             }
         },
         onShowByClickInput(){
            if(!this.disabled){
               this.showByClickInput = !this.showByClickInput
            }
				
         }
      }
   }
@@ -451,6 +477,29 @@
<style lang="scss" scoped>
   @import '../../libs/css/components.scss';
   .u-datetime-picker {
      flex: 1;
        &__has-input {
         position: relative;
         display: flex;
         flex-direction: column;
         justify-content: center;
            /* #ifndef APP-NVUE */
      width: 100%;
            /* #endif */
         .input-cover {
            opacity: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left:0;
            right:0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            border-radius: 4px;
            border: 1px solid #eee;
            padding: 0 10px;
         }
        }
   }
</style>