Skip to content

Commit 0e8ce24

Browse files
FasttianFasttian
committed
fixed: ios date format bug, opti: add panel`s box-shadow
1 parent 4801d7b commit 0e8ce24

File tree

3 files changed

+75
-33
lines changed

3 files changed

+75
-33
lines changed

‎uni_modules/uni-datetime-picker/changelog.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
## 2.0.3（2021-05-10）
2+
- 修复 ios 下不识别 '-' 日期格式的 bug
3+
- 优化 pc 下弹出层添加边框和阴影
14
## 2.0.2（2021-05-08）
25
- 修复 在 admin 中获取弹出层定位错误的bug
36
## 2.0.1（2021-05-08）

‎uni_modules/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue‎

Lines changed: 71 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
</view>
2929

3030
<view v-show="popup" class="uni-date-mask" @click="close"></view>
31-
<view ref="datePicker" v-show="popup" class="uni-date-picker__container">
31+
<view ref="datePicker" v-show="popup" class="uni-date-picker__container">
3232
<view v-if="!isRange" class="uni-date-single--x" :style="popover">
3333
<view v-show="hasTime" class="uni-date-changed popup-x-header">
3434
<input class="uni-date__input uni-date-range__input" type="text" v-model="tempSingleDate"
@@ -44,16 +44,17 @@
4444
<view v-if="hasTime" class="popup-x-footer">
4545
<!-- <text class="">此刻</text> -->
4646
<text class="confirm" @click="confirmSingleChange">确定</text>
47-
</view>
47+
</view>
48+
<view class="uni-date-popper__arrow"></view>
4849
</view>
4950

5051
<view v-else class="uni-date-range--x" :style="popover">
5152
<view v-show="hasTime" class="popup-x-header uni-date-changed">
5253
<view class="popup-x-header--datetime">
5354
<input class="uni-date__input uni-date-range__input" type="text" v-model="tempRange.startDate"
5455
placeholder="开始日期" />
55-
<time-picker type="time" v-model="tempRange.startTime" :start="reactStartTime"
56-
:border="false" :disabled="!tempRange.startDate">
56+
<time-picker type="time" v-model="tempRange.startTime" :start="reactStartTime" :border="false"
57+
:disabled="!tempRange.startDate">
5758
<input class="uni-date__input uni-date-range__input" type="text"
5859
v-model="tempRange.startTime" placeholder="开始时间" :disabled="!tempRange.startDate" />
5960
</time-picker>
@@ -111,7 +112,7 @@
111112
112113
export default {
113114
components: {
114-
uniCalendar,
115+
uniCalendar,
115116
timePicker
116117
},
117118
data() {
@@ -357,9 +358,9 @@
357358
if (systemInfo.windowWidth <= 500) {
358359
this.$refs.mobile.open()
359360
return
360-
}
361-
this.popover = {
362-
top: '10px'
361+
}
362+
this.popover = {
363+
top: '10px'
363364
}
364365
// const dateEditor = uni.createSelectorQuery().in(this).select(".uni-date-editor--x")
365366
// dateEditor.boundingClientRect(rect => {
@@ -370,7 +371,7 @@
370371
// left = '15px'
371372
// }
372373
// this.popover = {
373-
// // top: rect.top + rect.height + 15 + 'px',
374+
// // top: rect.top + rect.height + 15 + 'px',
374375
// top: '40px',
375376
// left: 0,
376377
// }
@@ -389,33 +390,37 @@
389390
},
390391
setEmit(value) {
391392
if (this.returnType === "timestamp") {
392-
if (!Array.isArray(value)) {
393+
if (!Array.isArray(value)) {
393394
if (!this.hasTime) {
394395
value = value + ' ' + '00:00:00'
395396
}
396-
value = Date.parse(new Date(value))
397-
} else {
397+
value = this.createTimestamp(value)
398+
} else {
398399
if (!this.hasTime) {
399400
value[0] = value[0] + ' ' + '00:00:00'
400401
value[1] = value[1] + ' ' + '00:00:00'
401402
}
402-
value[0] = Date.parse(new Date(value[0]))
403-
value[1] = Date.parse(new Date(value[1]))
403+
value[0] = this.createTimestamp(value[0])
404+
value[1] = this.createTimestamp(value[1])
404405
}
405406
}
406407
this.$emit('change', value)
407408
this.$emit('input', value)
409+
},
410+
createTimestamp(date) {
411+
date = this.fixIosDateFormat(date)
412+
return Date.parse(new Date(date))
408413
},
409414
singleChange(e) {
410415
this.tempSingleDate = e.fulldate
411416
if (this.hasTime) return
412417
this.confirmSingleChange()
413418
},
414419
415-
confirmSingleChange() {
416-
if (!this.tempSingleDate) {
417-
this.popup = false
418-
return
420+
confirmSingleChange() {
421+
if (!this.tempSingleDate) {
422+
this.popup = false
423+
return
419424
}
420425
if (this.hasTime) {
421426
this.singleVal = this.tempSingleDate + ' ' + (this.time ? this.time : '00:00:00')
@@ -493,10 +498,10 @@
493498
this.confirmRangeChange()
494499
},
495500
496-
confirmRangeChange() {
497-
if (!this.tempRange.startDate && !this.tempRange.endDate) {
498-
this.popup = false
499-
return
501+
confirmRangeChange() {
502+
if (!this.tempRange.startDate && !this.tempRange.endDate) {
503+
this.popup = false
504+
return
500505
}
501506
let start, end
502507
if (!this.hasTime) {
@@ -549,7 +554,7 @@
549554
this.$emit('input', '')
550555
} else {
551556
this.range.startDate = ''
552-
this.range.endDate = ''
557+
this.range.endDate = ''
553558
this.tempRange = {}
554559
this.$refs.left.cale.multipleStatus.before = ''
555560
this.$refs.left.cale.multipleStatus.after = ''
@@ -568,7 +573,8 @@
568573
// if (this.popup) this.popup = false
569574
},
570575
571-
parseDate(date) {
576+
parseDate(date) {
577+
date = this.fixIosDateFormat(date)
572578
const defVal = new Date(date)
573579
const year = defVal.getFullYear()
574580
const month = defVal.getMonth() + 1
@@ -588,6 +594,13 @@
588594
return item < 10 ? '0' + item : item
589595
},
590596
597+
//兼容 iOS、safari 日期格式
598+
fixIosDateFormat(value) {
599+
if (typeof value === 'string') {
600+
value = value.replace(/-/g, '/')
601+
}
602+
return value
603+
},
591604
592605
leftMonthSwitch(e) {
593606
// console.log('leftMonthSwitch 返回:', e)
@@ -621,7 +634,7 @@
621634
position: relative;
622635
}
623636
624-
.uni-date-editor--x:hover .uni-date__icon-clear {
637+
.uni-date-editor--x:hover .uni-date__icon-clear {
625638
position: absolute;
626639
top: 5px;
627640
right: 0;
@@ -650,7 +663,7 @@
650663
text-align: center;
651664
}
652665
653-
.uni-date-picker__container {
666+
.uni-date-picker__container {
654667
position: relative;
655668
/* position: fixed;
656669
left: 0;
@@ -673,24 +686,28 @@
673686
z-index: 996;
674687
}
675688
676-
.uni-date-single--x {
689+
.uni-date-single--x {
690+
/* padding: 0 8px; */
677691
position: absolute;
678692
top: 0;
679693
left: 0;
680694
z-index: 999;
681695
/* width: 375px; */
682-
border: 1px solid #F1F1F1;
696+
border: 1px solid #e4e7ed;
697+
box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
683698
border-radius: 4px;
684699
}
685700
686-
.uni-date-range--x {
701+
.uni-date-range--x {
702+
padding: 0 8px;
687703
background-color: #fff;
688704
position: absolute;
689705
top: 0;
690706
left: 0;
691707
z-index: 999;
692708
/* width: 733px; */
693-
border: 1px solid #F1F1F1;
709+
border: 1px solid #e4e7ed;
710+
box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
694711
border-radius: 4px;
695712
}
696713
@@ -772,9 +789,31 @@
772789
.uni-date-changed--time-date {
773790
color: #333;
774791
opacity: 0.6;
775-
}
792+
}
793+
794+
/* .uni-date-popper__arrow {
795+
width: 10px;
796+
height: 10px;
797+
top: -6px;
798+
left: 35px;
799+
margin-right: 3px;
800+
border-top-width: 0;
801+
border-bottom-color: #ebeef5;
802+
border-width: 6px;
803+
filter: drop-shadow(0 2px 12px rgba(0,0,0,.03));
804+
}
805+
.uni-date-popper__arrow:after {
806+
content: " ";
807+
position: absolute;
808+
display: block;
809+
width: 0;
810+
height: 0;
811+
border-color: transparent;
812+
border-style: solid;
813+
} */
776814
777815
.mr-50 {
778816
margin-right: 50px;
779-
}
817+
}
818+
780819
</style>

‎uni_modules/uni-datetime-picker/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"id": "uni-datetime-picker",
33
"displayName": "uni-datetime-picker 日期选择器",
4-
"version": "2.0.2",
4+
"version": "2.0.3",
55
"description": "uni-datetime-picker 日期时间选择器，支持日历，支持范围选择",
66
"keywords": [
77
"uni-datetime-picker",

0 commit comments

Comments
 (0)