就餐设置时间 调接口

 

<template>
<view class="content">
<!-- 导航栏 -->
<mynavGeneral mTitle="设置时间" :immersionShow="immersionShow"></mynavGeneral>

<view :style="{'margin-top':contentMarginTop+'px'}">
<!-- -->
<view class="input">
<label>早餐时间</label>
<view :class="{noValue:!breakfast_time}">
<picker mode="time" :value="breakfast_time" @change="breakfastTimeChged">
<view>{{breakfast_time?breakfast_time:"请选择时间"}}<label class="iconfont iconbutton_icon_more"></label></view>
</picker>
</view>
</view>


<!-- -->
<view class="input">
<label>午餐时间</label>
<view :class="{noValue:!lunch_time}">
<picker mode="time" :value="lunch_time" @change="lunchTimeChged">
<view>{{lunch_time?lunch_time:"请选择时间"}}<label class="iconfont iconbutton_icon_more"></label></view>
</picker>
</view>
</view>

<!-- -->
<view class="input">
<label>晚餐时间</label>
<view :class="{noValue:!dinner_time}">
<picker mode="time" :value="dinner_time" @change="dinnerTimeChged">
<view>{{dinner_time?dinner_time:"请选择时间"}}<label class="iconfont iconbutton_icon_more"></label></view>
</picker>
</view>
</view>

<!-- -->
<view style="height: 5px;background-color: #F5F5F5;width: 100%;"></view>
<!-- -->
<div class="input grpTitle">
<label>提醒开关</label>
<view>
<switch :checked="is_remind" @change="switch1Change" color="#5677FC" />
</view>
</div>


<view class="input" v-if="is_remind">
<label>提醒时间</label>
<view :class="{noValue:!lead_time}">
<picker :range="leadArr" @change="leadTimeChged">
<view>{{_leadArr}}<label class="iconfont iconbutton_icon_more"></label></view>
</picker>
</view>
</view>


<view class="submit-btn zk_pressed1" @click="submit()">提交申请</view>
</view>
</view>
</template>

<script lang="ts">
import Vue from 'vue';
import mynavGeneral from '@/components/mynav-general/mynav-general.vue'
import { HealthService } from '@/services/HealthService'

export default Vue.extend({
components: {
mynavGeneral
},
data() {
return {
// 是否展示 导航栏 阴影
immersionShow: false,
contentMarginTop: 0,
timeAry: [
[1, 2, 3],
['a', 'b', 'c']
],
alertTimeAry:["10分钟","20分钟","30分钟"],
cTime: [1, 'a'],
is_remind:0,
breakfast_time:null,
lunch_time:null,
dinner_time:null,
lead_time:null,
leadArr: ['10分钟', '20分钟', '30分钟']
}
},
onLoad() {
var that: any = getApp();
this.contentMarginTop = that.globalData.immersionAppBarHeight

this.getRemind();
},
computed: {

_leadArr: function() {
var that: any = this

if (!that.lead_time)
return "请选择您的提醒时间"

return that.lead_time
}

},
methods: {
showTimePicker() {
// uni.show
},

//获取设置
getRemind(){
var that:any = this

new HealthService().getRemindSett()
.then((data:any)=>{
if(data.code==1){

that.is_remind = data.data.is_remind;
that.breakfast_time = data.data.breakfast_time;
that.lunch_time = data.data.lunch_time;
that.dinner_time = data.data.dinner_time;
that.lead_time = data.data.lead_time+"分钟";

return;
}

that.alert(data.msg);
})
.catch((error:any)=>{
that.alert(error.msg)
})
},

breakfastTimeChged(e:any){
this.breakfast_time = e.detail.value
},
lunchTimeChged(e:any){
this.lunch_time = e.detail.value
},
dinnerTimeChged(e:any){
this.dinner_time = e.detail.value
},

leadTimeChged(e: any) {
var that: any = this
that.lead_time = that.leadArr[e.detail.value]
},

switch1Change(e:any) {
this.is_remind = e.target.value

// console.log('switch1 发生 change 事件，携带值为', e.target.value)
},
submit() {

if(!this.formCheck()) return;


var that: any = this

uni.showLoading({
title: "正在保存，请稍后..."
})

new HealthService().setRemindSett({
is_remind: that.is_remind,
breakfast_time:that.breakfast_time,
lunch_time:that.lunch_time,
dinner_time:that.dinner_time,
lead_time:that.lead_time.substr(0,2)
})
.then((d: any) => {
uni.hideLoading()

if (d.code == 0) {
that.alert(d.msg)
return
}

that.toast({
title: "保存成功",
icon: 'success',
callback: function() {
that.$Router.back()
}
})
})
.catch((e: any) => {
uni.hideLoading()

that.alert(e.msg)
})
},
formCheck(): boolean {
var that: any = this

if (!that.breakfast_time) {
that.alert("请选择你的早餐时间")
return false
}

if (!that.lunch_time) {
that.alert("请选择你的午餐时间")
return false
}

if (!that.dinner_time) {
that.alert("请选择你的晚餐时间")
return false
}

if (!that.lead_time && that.is_remind) {
that.alert("请选择你的提醒时间")
return false
}

return true
},

},
onPageScroll(e: any) {
this.immersionShow = e.scrollTop >= 10
}
})
</script>

<style>
.input-item {
font-size: 15px;
height: 48px;
display: flex;
align-items: center;
padding: 0 10px;
border-bottom: #E6E6E6 0.5px solid;
}

.input-item:nth-last-child(1) {
border-bottom: transparent 0px solid;
}

.input-item>text:nth-child(1) {
min-width: 80px;
}

.input-item>view:nth-last-child(1) {
flex: 1;
text-align: right;
display: flex;
width: 100%;
align-items: center;
}

.input-item>view:nth-last-child(1)>label {
color: #CCCCCC;
margin-left: 15.5px;
font-size: 15px;
}

/* */
.grpTitle {
display: flex;
align-items: center;
padding: 0 10px;
}

.grpTitle>text:nth-child(1) {
font-size: 18px;
font-weight: bold;
margin-top: 20px;
margin-bottom: 4.5px;
}

.grpTitle view:nth-last-child(1) {
flex: 1;
text-align: right;
}

.grpTitle .picker {
display: inline-block;
width: 100%;
}
.submit-btn{
display: block;
width: 150px;
height: 35px;
color: #fff;
font-size: 17px;
margin: 50px auto;
border-radius: 17.5px;
background-color: #97CC53;
text-align: center;
line-height: 35px;

}
</style>