From 16213c0f85aa3ac8317797bf4a05fd12940e16d3 Mon Sep 17 00:00:00 2001 From: zhangwei <1504152376@qq.com> Date: 星期三, 05 三月 2025 17:29:42 +0800 Subject: [PATCH] - --- src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue | 123 ++++++++++++++++++++++++++++------------ 1 files changed, 86 insertions(+), 37 deletions(-) diff --git a/src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue b/src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue index 9f5d13d..28556cd 100644 --- a/src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue +++ b/src/uni_modules/uview-plus/components/u-datetime-picker/u-datetime-picker.vue @@ -1,34 +1,52 @@ <template> - <view v-if="hasInput" class="u-datetime-picker"> - <u-input - :placeholder="placeholder" - :readonly="!!showByClickInput" - border="surround" - v-model="inputValue" - @click="showByClickInput = !showByClickInput" - ></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="none" + v-model="inputValue" + :disabled="disabled" + :disabledColor="disabledColor" + ></up-input> + <div class="input-cover"> + </div> + </slot> + </view> + <u-picker + ref="picker" + :show="show || (hasInput && showByClickInput)" + :popupMode="popupMode" + :closeOnClickOverlay="closeOnClickOverlay" + :columns="columns" + :title="title" + :itemHeight="itemHeight" + :showToolbar="showToolbar" + :visibleItemCount="visibleItemCount" + :defaultIndex="innerDefaultIndex" + :cancelText="cancelText" + :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> - <u-picker - ref="picker" - :show="show || (hasInput && showByClickInput)" - :popupMode="popupMode" - :closeOnClickOverlay="closeOnClickOverlay" - :columns="columns" - :title="title" - :itemHeight="itemHeight" - :showToolbar="showToolbar" - :visibleItemCount="visibleItemCount" - :defaultIndex="innerDefaultIndex" - :cancelText="cancelText" - :confirmText="confirmText" - :cancelColor="cancelColor" - :confirmColor="confirmColor" - @close="close" - @cancel="cancel" - @confirm="confirm" - @change="change" - > - </u-picker> </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 { - width: 100%; + 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> -- Gitblit v1.9.1