master
chen 2022-04-01 08:55:06 +08:00
parent f4f2042106
commit bbece21ba4
1 changed files with 270 additions and 258 deletions

View File

@ -1,11 +1,6 @@
<template>
<view class="datetime-picker">
<view
class="mask"
:class="{ show: open }"
@touchmove.stop.prevent
catchtouchmove="true"
></view>
<view class="mask" :class="{ show: open }" @touchmove.stop.prevent catchtouchmove="true"></view>
<view class="wrap" :class="{ show: open }">
<view class="picker-header" @touchmove.stop.prevent catchtouchmove="true">
<view class="btn-picker cancel" @click="open = false">取消</view>
@ -179,7 +174,14 @@ export default {
},
_onSubmit() {
const { year, month, day, hour, minute, formatNum } = this;
const {
year,
month,
day,
hour,
minute,
formatNum
} = this;
const result = {
year: formatNum(year),
month: formatNum(month),
@ -205,9 +207,11 @@ $primary: #488ee9;
.datetime-picker {
position: relative;
z-index: 999;
picker-view {
height: 100%;
}
.mask {
position: fixed;
z-index: 1000;
@ -219,11 +223,13 @@ $primary: #488ee9;
visibility: hidden;
opacity: 0;
transition: $transition;
&.show {
visibility: visible;
opacity: 1;
}
}
.wrap {
z-index: 1001;
position: fixed;
@ -232,10 +238,12 @@ $primary: #488ee9;
width: 100%;
transition: $transition;
transform: translateY(100%);
&.show {
transform: translateY(0);
}
}
.picker-header {
display: flex;
flex-direction: row;
@ -245,12 +253,14 @@ $primary: #488ee9;
background-color: darken(#fff, 2%);
background-color: #fff;
}
.picker-body {
width: 100%;
height: 420rpx;
overflow: hidden;
background-color: #fff;
}
.column-item {
text-overflow: ellipsis;
white-space: nowrap;
@ -258,6 +268,7 @@ $primary: #488ee9;
justify-content: center;
align-items: center;
}
.btn-picker {
position: relative;
display: inline-block;
@ -275,6 +286,7 @@ $primary: #488ee9;
color: #000;
cursor: pointer;
}
.btn-picker.submit {
background-color: $primary;
color: #fff;