html/my/my_sugar.html

<!doctype html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" href="../../assets/css/weui.min.css">
    <link rel="stylesheet" href="../../assets/css/jeDate-test.css">
    <link rel="stylesheet" href="../../assets/css/jedate.css">
    <link rel="stylesheet" href="../../assets/css/base.css">
    <link rel="stylesheet" href="../../assets/css/style1.css">
    <link rel="stylesheet" href="../../assets/css/common1.css">
    <link rel="stylesheet" href="../../assets/icon/iconfont.css">

    <title></title>
    <style type="text/css">
        body {
            background-color: #f5f5f5;
            margin: 0;
        }

        .sugar_type {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            font-size: 16px;
            padding: 25px 0 20px 15px;
            background-color: #fff;
        }

        #background {
            box-sizing: border-box;
            background-color: #d8b25f;
            color: #FFF;
            border-radius: 50%;
            display: inline-block;
            padding: 10px 10px 6px 10px;
        }

        .sugar_type span {
            width: 30%;
            background-color: #e9e9e9;
            color: #424242;
            padding: 5px 0;
            text-align: center;
            border-radius: 5px;
            margin: 0 10px 10px 0;
        }

        .sugar_type .spanactive {
            color: #fff;
            background-color: #dbb25f;
        }

        .date_box {
            position:relative;
            width:7.5rem;

            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px 13px;
            margin: 20px 0 0 0;
            background-color: #fff;

            /*overflow: hidden;*/
        }

        .date_item {
            font-size: 14px;
            color: #999;
        }

        .date_box .iconfont {
            color: #c0c0c0;
            position:absolute;
            right:0.9rem;
            top:0.4rem;

        }

        .save_btn {
            text-align: center;
            font-size: 18px;
            color: #fff;
            padding: 0.15rem 0;
            width: 100%;
            position: fixed;
            bottom: 0;
            left: 0;
            z-index: 100;
            background-color: #dbb25f;
        }

        #loadStart {
            position: fixed;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            /*background: #bbb;*/
            z-index: 100000;
            transition: 1s;
            background: #fff url("../../assets/image/loading.gif") center center no-repeat;
            background-size: 12%;
        }
        #chosetime{
            outline:none;
            height:0.68rem;
            border:none;
        }
    </style>
</head>

<body class="jebody">
<div id="loadStart"></div>
<div class="perpart1 center">
    <div style="position: relative;color: #fff;top: 2.5rem;">mmol/L</div>
    <div id="background">
        <input type="number" step="0.1" name="test" class="knob" data-width="140" data-height='140' data-fgColor="#fff"
               data-skin="tron"
               data-thickness=".1" value="0" placeholder="">
    </div>
</div>
<div class="sugar_type" data-type="">
    <span data-id="1">空腹</span>
    <span data-id="2">早餐后</span>
    <span data-id="3">午餐前</span>
    <span data-id="4">午餐后</span>
    <span data-id="5">晚餐前</span>
    <span data-id="6">晚餐后</span>
    <span data-id="7">睡前</span>
    <span data-id="8">凌晨</span>
</div>
<!--<div class="date_box">-->
    <!--<div class="date_item">请选择测量时间</div>-->
    <!--<div class="iconfont icon-xiangyou"></div>-->
<!--</div>-->

    <div class="jeitem ">
        <div class="jelabel ">请选择测量时间</div>
         <div class="date_box">
             <!--<div class="jeinpbox" style="width:95%"><input type="text" class="jeinput" id="test04" placeholder="请选择测量时间" style="width:96%" readonly></div>-->
             <!--<div class="iconfont icon-xiangyou" ></div>-->
             <input type="datetime-local" id="chosetime" placeholder="请选择测量时间">
         </div>
    </div>


<div class="save_btn">保存</div>
</body>
</html>


<script type="text/javascript" src="../../assets/js/api.js"></script>
<script type="text/javascript" src="../../assets/js/public.js"></script>
<script type="text/javascript" src="../../assets/js/fastclick.js"></script>
<script>
    new FastClick(document.body);
</script>
<script src="../../assets/js/jquery.js" type="text/javascript"></script>
<script src="../../assets/js/jquery.knob.js" type="text/javascript"></script>
<script type="text/javascript" src="../../assets/js/axios.min.js"></script>
<script type="text/javascript" src="../../assets/icon/iconfont.js"></script>
<script type="text/javascript" src="../../assets/js/jedate.js"></script>
<!--<script type="text/javascript" src="../../assets/js/demo.js"></script>-->
<script type="text/javascript" src="../../assets/js/weui.min.js"></script>
<script type="text/javascript">
    $(function () {
        // apiready = function () {
            $(document).ready(function () {

                var type=1
                $(".knob").knob();
                loadEnd();
                var rid=localStorage.getItem("rid")

                function getSugar() {
                    var header = {
                        "XX-Device-Type": getDevice(),
                        'XX-Token': getToken()
                    };
                    var post = {
                        rid: rid,
                        type: 1
                    };
                    getRequest('post', 'user/index/getLastBoolData', post, header).then(function (res) {
                        // alert(JSON.stringify(res))
                        if (res.data.code == 1) {
                            $('.knob').val(res.data.data.data);
                            $('.date_item').text(res.data.data.time);
                            $('.sugar_type span').removeClass('spanactive').eq(res.data.data.time_type-1).addClass('spanactive');
                        } else {
                            toastMsg(res.data.msg)
                        }
                    })
                }

                getSugar();
                $('.sugar_type span').click(function () {
                    $(this).addClass('spanactive').siblings().removeClass('spanactive');
                    if ($(this).hasClass('spanactive')) {
                        $('.sugar_type').attr('data-type', $(this).attr('data-id'))
                    } else {
                        $('.sugar_type').removeAttribute('data-type')
                    }
                });
                $('.date_box').click(function () {

                    // if (api.systemType == 'ios') {
                    //     api.openPicker({
                    //         type: 'date_time',
                    //         date: new Date(),
                    //         maxDate: getTimeDetil(0),
                    //         title: '测量时间'
                    //     }, function (ret, err) {
                    //         console.log(ret)
                    //         if (ret) {
                    //             var year = ret.year;
                    //             var month = ret.month;
                    //             var day = ret.day;
                    //             var hour = ret.hour;
                    //             var minute = ret.minute;
                    //             var date_info = year + '-' + add0(month) + '-' + add0(day) + ' ' + add0(hour) + ':' + add0(minute);
                    //             if (checkDate(date_info, 2)) {
                    //                 $('.date_item').html(date_info)
                    //             } else {
                    //                 toastMsg('选择日期不能大于当前时间');
                    //                 $('.date_item').html('请选择测量时间')
                    //             }
                    //         } else {
                    //             console.log(err)
                    //         }
                    //     });
                    // }
                    // else {
                    //     api.openPicker({
                    //         type: 'date',
                    //         title: '服务日期',
                    //     }, function (ret, err) {
                    //         if (ret) {
                    //             var year = ret.year;
                    //             var month = ret.month;
                    //             var day = ret.day;
                    //             api.openPicker({
                    //                 type: 'time',
                    //                 title: '服务时间'
                    //             }, function (rets, errs) {
                    //                 if (rets) {
                    //                     var hour = rets.hour;
                    //                     var minute = rets.minute;
                    //                     var date_info = year + '-' + add0(month) + '-' + add0(day) + ' ' + add0(hour) + ':' + add0(minute);
                    //                     if (checkDate(date_info, 2)) {
                    //                         $('.date_item').html(date_info);
                    //                     } else {
                    //                         toastMsg('选择日期不能大于当前时间');
                    //                         $('.date_item').html('请选择测量时间')
                    //                     }
                    //                 } else {
                    //                     console.log(errs)
                    //                 }
                    //             });
                    //         } else {
                    //             console.log(err)
                    //         }
                    //     });
                    // }


               });

                $('.save_btn').click(function () {
                    var rid=localStorage.getItem("rid")
                    var value = $('.knob').val();

                    var date = $('#chosetime').val();

                     date=date.split("T");
                    date=date[0]+" " +date[1];


                     // type = $('.sugar_type').attr('data-type');
                    type = $('.spanactive').attr('data-id')
                    // console.log(type)
                    var post = {
                        rid: rid,
                        time_type: type,
                        time: date,
                        data: value,
                        type:1
                    };
                    var header = {
                        "XX-Device-Type": getDevice(),
                        'XX-Token': getToken()
                    };
                    if (value == '') {
                        toastMsg('请记录血糖值')
                    } else if (type == '') {
                        toastMsg('请选择具体测试时间')
                    }
                    else if (date == '') {
                        toastMsg('请选择测量时间')
                    } else {
                        getRequest('post', 'user/index/setBoolData', post, header).then(function (res) {
                            // alert(JSON.stringify(res))
                            if (res.data.code == 1) {
                                toastMsg('记录成功');
                                setTimeout(function () {
                                    api.sendEvent({
                                        name: 'sugar',
                                    });
                                    api.closeWin()
                                }, 1000)
                            } else {
                                toastMsg(res.data.msg)
                            }
                        })
                    }
                });


            })
        // }
    });
</script>