Commit 9a117d37 by fengzhaoyu

11

parents c65fe18c 22008a04
@import "./font/iconfont.acss"; @import "./assests/font/iconfont.acss";
page { page {
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
background: #F6F6F6; background: #F6F6F6;
......
...@@ -18,8 +18,7 @@ ...@@ -18,8 +18,7 @@
<------------------js------------------> <------------------js------------------>
Page({ Page({
data: { data: {
show:false, show:false
startTime: new Date()
}, },
showPop(){ showPop(){
this.setData({ this.setData({
......
...@@ -22,8 +22,7 @@ picker-view .column { ...@@ -22,8 +22,7 @@ picker-view .column {
.tab { .tab {
margin-top: 72rpx; margin-top: 72rpx;
display: flex; display: flex;
border-bottom: 2rpx solid rgba(25, 31, 37, 0.12); padding-left: 24rpx;
border-top: 2rpx solid rgba(25, 31, 37, 0.12);
} }
.tab>view { .tab>view {
...@@ -31,30 +30,34 @@ picker-view .column { ...@@ -31,30 +30,34 @@ picker-view .column {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 16rpx 34rpx; padding: 16rpx 34rpx;
background: rgba(10,10,10,0.06);
border-radius: 8rpx;
margin-right:24rpx;
} }
.tab>view>text { .tab>view>text {
color: rgba(27, 38, 61, 0.49); color: rgba(10,10,10,0.4);
font-size: 28rpx; font-size: 28rpx;
} }
.tab>view>text:nth-of-type(2) { .tab>view>text:nth-of-type(2) {
color: #1B263D; color: rgba(10,10,10,0.56);
font-size: 34rpx; font-size: 34rpx;
font-weight: bold; font-weight: bold;
line-height: 48rpx; line-height: 48rpx;
} }
.tab .active { .tab .active {
background: #3296FA; background: #fff;
border: 2rpx solid rgb(10,10,10);
} }
.tab .active>text { .tab .active>text {
color: rgba(255, 255, 255, 0.8); color: rgba(10,10,10,0.8);
} }
.tab>.active>text:nth-of-type(2) { .tab>.active>text:nth-of-type(2) {
color: #fff; color: rgb(10, 10, 10);
} }
.coustom-end { .coustom-end {
...@@ -64,7 +67,7 @@ picker-view .column { ...@@ -64,7 +67,7 @@ picker-view .column {
} }
.coustom-end>text { .coustom-end>text {
color: #3070F2; color: rgb(10,10,10);
position: absolute; position: absolute;
font-size: 24rpx; font-size: 24rpx;
right: 32rpx; right: 32rpx;
...@@ -79,7 +82,7 @@ picker-view .column { ...@@ -79,7 +82,7 @@ picker-view .column {
.picker-complete { .picker-complete {
position: absolute; position: absolute;
color: #3070F2; color: rgb(10,10,10);
font-size: 32rpx; font-size: 32rpx;
right: 32rpx; right: 32rpx;
top: 32rpx; top: 32rpx;
......
var currentDate = new Date(); const currentDate = new Date();
const weekList = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']; const weekList = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
const durationList = [{ value: 60, label: '1小时' }, { value: 120, label: '2小时' }, { value: 30, label: '30分钟' }]; const durationList = [{ value: 60, label: '1小时' }, { value: 120, label: '2小时' }, { value: 30, label: '30分钟' }];
const timeData = generateDate(365); const timeData = generateDate(365);
const timeHour = generateTime(24); const timeHour = generateHour(24);
const timeMin = generateTime(60); const timeMin = generateMin(60);
function padZero(val) { function padZero(val) {
return ("00" + val).slice(-2); return ("00" + val).slice(-2);
} }
// 生成小时和分钟 // 生成分钟 每隔五分钟
function generateTime(max) { function generateMin(max) {
const time = [];
for (let i = 0; i < max; i+=5) {
time.push(padZero(i))
}
return time;
}
// 生成小时
function generateHour(max) {
const time = []; const time = [];
for (let i = 0; i < max; i++) { for (let i = 0; i < max; i++) {
time.push(padZero(i)) time.push(padZero(i))
...@@ -28,7 +36,7 @@ function generateDate(max) { ...@@ -28,7 +36,7 @@ function generateDate(max) {
return timeData return timeData
} }
function GetDateStr(AddDayCount) { function GetDateStr(AddDayCount) {
var time = new Date(); let time = new Date();
time.setDate(time.getDate() + AddDayCount); time.setDate(time.getDate() + AddDayCount);
const res = getYMDWHMIN(time); const res = getYMDWHMIN(time);
return res.y + '年' + res.m + "月" + res.d + "日 " + res.w; return res.y + '年' + res.m + "月" + res.d + "日 " + res.w;
...@@ -51,6 +59,11 @@ function getShowTime(date) { ...@@ -51,6 +59,11 @@ function getShowTime(date) {
const res = getYMDWHMIN(date); const res = getYMDWHMIN(date);
return res.m + "月" + res.d + "日 " + res.h + ':' + res.min; return res.m + "月" + res.d + "日 " + res.h + ':' + res.min;
} }
// 时间格式转化为2019/2/2 16:00
function getPostTimeByDate(date) {
const res = getYMDWHMIN(date);
return res.y + '/' + res.m + "/" + res.d + " " + res.h + ':' + res.min;
}
function getPickerValue(date) { function getPickerValue(date) {
const res = getYMDWHMIN(date); const res = getYMDWHMIN(date);
return [timeData.indexOf(res.y + "年" + res.m + "月" + res.d + "日 " + res.w), timeHour.indexOf(res.h), timeMin.indexOf(res.min)]; return [timeData.indexOf(res.y + "年" + res.m + "月" + res.d + "日 " + res.w), timeHour.indexOf(res.h), timeMin.indexOf(res.min)];
...@@ -80,7 +93,7 @@ function getWeekDay(date) { ...@@ -80,7 +93,7 @@ function getWeekDay(date) {
// 根据开始时间和持续时间计算结束时间 2019/2/2 16:00 // 根据开始时间和持续时间计算结束时间 2019/2/2 16:00
function getEndTimeByDuration(startDate, duration) { function getEndTimeByDuration(startDate, duration) {
const newDate = new Date(startDate); //新创建一个时间对象,以免改变startDate const newDate = new Date(startDate); //新创建一个时间对象,以免改变startDate
var min = newDate.getMinutes(); const min = newDate.getMinutes();
newDate.setMinutes(min + duration); newDate.setMinutes(min + duration);
const res = getYMDWHMIN(newDate); const res = getYMDWHMIN(newDate);
return res.y + '/' + res.m + '/' + res.d + ' ' + res.h + ':' + res.min; return res.y + '/' + res.m + '/' + res.d + ' ' + res.h + ':' + res.min;
...@@ -99,12 +112,6 @@ function getDateByPickValue(pickValue) { ...@@ -99,12 +112,6 @@ function getDateByPickValue(pickValue) {
return new Date(newD) return new Date(newD)
} }
// 时间格式转化为2019/2/2 16:00
function getPostTimeByDate(date) {
const res = getYMDWHMIN(date);
return res.y + '/' + res.m + "/" + res.d + " " + res.h + ':' + res.min;
}
// 获取持续时间 {value,lable,index} // 获取持续时间 {value,lable,index}
function getDuration(startDate, endDate) { function getDuration(startDate, endDate) {
const time = endDate.getTime() - startDate.getTime(); const time = endDate.getTime() - startDate.getTime();
...@@ -151,9 +158,9 @@ Component({ ...@@ -151,9 +158,9 @@ Component({
showTime: '', showTime: '',
}, },
duration: { duration: {
pickValue: [1], pickValue: [2],
showTime: '', showTime: '',
label: '2小时', label: '30分钟',
}, },
startPostTime: '', startPostTime: '',
endPostTime: '', endPostTime: '',
...@@ -171,10 +178,10 @@ Component({ ...@@ -171,10 +178,10 @@ Component({
//设置初始值 //设置初始值
setInitialValue() { setInitialValue() {
let startDate = new Date(); let startDate = new Date();
//结束日期默认+2小时 //结束日期默认+小时
let endDate = new Date(); let endDate = new Date();
var hour = endDate.getHours(); const min = endDate.getMinutes();
endDate.setHours(hour + 2); endDate.setMinutes(min + 30);
// 赋值 // 赋值
if (this.props.startTime) { if (this.props.startTime) {
startDate = new Data(this.props.startTime); startDate = new Data(this.props.startTime);
...@@ -190,7 +197,6 @@ Component({ ...@@ -190,7 +197,6 @@ Component({
}); });
// 如果持续时间不在范围内,需要改变默认显示结束时间的方式 // 如果持续时间不在范围内,需要改变默认显示结束时间的方式
const durationData = getDuration(startDate, endDate); const durationData = getDuration(startDate, endDate);
// 在范围内
if (durationData) { if (durationData) {
this.changeDuration(startDate, durationData); this.changeDuration(startDate, durationData);
} else { } else {
...@@ -231,7 +237,7 @@ Component({ ...@@ -231,7 +237,7 @@ Component({
}, },
onChange(e) { onChange(e) {
const pickValue = e.detail.value; const pickValue = e.detail.value;
console.log(pickValue)
if (this.data.currentTab === 'start') { if (this.data.currentTab === 'start') {
const startDate = getDateByPickValue(pickValue); const startDate = getDateByPickValue(pickValue);
this.changeStart(startDate, pickValue); this.changeStart(startDate, pickValue);
...@@ -244,6 +250,7 @@ Component({ ...@@ -244,6 +250,7 @@ Component({
endDurationPostTime: getEndTimeByDuration(startDate, durationValue) endDurationPostTime: getEndTimeByDuration(startDate, durationValue)
}) })
} else { } else {
// 实时校验
this.checkValue(startDate, this.data.endPostTime); this.checkValue(startDate, this.data.endPostTime);
} }
} }
...@@ -271,10 +278,11 @@ Component({ ...@@ -271,10 +278,11 @@ Component({
return this.setData({ return this.setData({
pickValue: this.data.duration.pickValue pickValue: this.data.duration.pickValue
}); });
} } else {
this.setData({ this.setData({
pickValue: this.data[`${currentTab}`].pickValue pickValue: this.data[`${currentTab}`].pickValue
}); });
}
}, },
changeWay() { changeWay() {
this.setData({ this.setData({
......
...@@ -66,7 +66,6 @@ ...@@ -66,7 +66,6 @@
} }
.close-icon { .close-icon {
font-size: 64rpx;
text-align: center; text-align: center;
} }
...@@ -76,7 +75,6 @@ ...@@ -76,7 +75,6 @@
} }
.popup-title { .popup-title {
font-family: PingFangSC-Regular;
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;
color: rgba(144, 161, 179, 0.56); color: rgba(144, 161, 179, 0.56);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment