|
@@ -72,7 +72,7 @@
|
|
|
<view class="flex-col items-center text-data-sum">
|
|
|
<view class="title-data-sum">睡眠总时长</view>
|
|
|
<view class="flex-row justify-evenly items-baseline group_5">
|
|
|
- <text class="font_5">{{ formateSeconds(sleepReportFrom.total_duration) }}</text>
|
|
|
+ <text class="font_5">{{ formateSeconds(sleepReportFrom.total_duration, 0) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -110,7 +110,7 @@
|
|
|
<text class="font_3">深睡时长</text>
|
|
|
</view>
|
|
|
<view class="flex-row items-baseline group_6 space-x-6">
|
|
|
- <text class="font_4">{{ formateSeconds(sleepReportFrom.deep_duration) }}</text>
|
|
|
+ <text class="font_4">{{ formateSeconds(sleepReportFrom.deep_duration, 0) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="flex-col section_6 view space-y-12">
|
|
@@ -142,7 +142,7 @@
|
|
|
<text class="font_3">在床时间</text>
|
|
|
</view>
|
|
|
<view class="flex-row items-baseline group_5">
|
|
|
- <text class="font_4">{{ formateSeconds(sleepReportFrom.inbed_duration) }}</text>
|
|
|
+ <text class="font_4">{{ formateSeconds(sleepReportFrom.inbed_duration, 0) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
@@ -224,22 +224,21 @@
|
|
|
<view class="flex-row items-center group_11 space-x-10 pos_33">
|
|
|
<image class="image_8" src="../../static/report/reportIconBreath.png"/>
|
|
|
<text class="font_3">安稳度</text>
|
|
|
- <text @click="handleClickBreath(1)" class="margin-left myFont">详情>></text>
|
|
|
+ <text @click="handleClickBreath(2)" class="margin-left myFont">详情>></text>
|
|
|
<!-- <image @click="handleClickBreath(1)" class="image_11" src="../../static/report/reportIconWhy.png" />-->
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="flex-col pos_34">
|
|
|
-<!-- <view class="flex-col group_15">-->
|
|
|
-<!-- <view class="flex-row justify-between group_2">-->
|
|
|
-<!-- <text class="font_3 text_12">安稳度</text>-->
|
|
|
-<!-- <view class="flex-row items-center space-x-30">-->
|
|
|
-<!-- <text class="font_10">入睡时长</text>-->
|
|
|
-<!-- <view class="flex-row items-baseline shrink-0 space-x-6">-->
|
|
|
-<!-- <text class="font_5">{{ formateSeconds(sleepReportFrom.rs_duration) }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <view class="flex-col group_15">
|
|
|
+ <view class="flex-row justify-between group_2">
|
|
|
+ <text class="font_3 text_12">入睡时长</text>
|
|
|
+ <view class="flex-row items-center space-x-30">
|
|
|
+ <view class="flex-row items-baseline shrink-0 space-x-6">
|
|
|
+ <text class="font_5">{{ formateSeconds(sleepReportFrom.rs_duration, 0) }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="list-divider"></view>
|
|
|
|
|
|
<view class="flex-col group_15">
|
|
@@ -291,7 +290,7 @@
|
|
|
<view class="flex-row items-center group_11 space-x-10 pos_33">
|
|
|
<image class="image_8" src="../../static/report/reportIconBeat.png" />
|
|
|
<text class="font_3">心脏系统</text>
|
|
|
- <text @click="handleClickBreath(2)" class="margin-left myFont">详情>></text>
|
|
|
+ <text @click="handleClickBreath(3)" class="margin-left myFont">详情>></text>
|
|
|
<!-- <image @click="handleClickBreath(2)" class="image_11" src="../../static/report/reportIconWhy.png" />-->
|
|
|
</view>
|
|
|
</view>
|
|
@@ -320,7 +319,7 @@
|
|
|
<view class="flex-row justify-center items-center group_11 space-x-10 pos_33">
|
|
|
<image class="image_8" src="../../static/report/reportIconBreath.png" />
|
|
|
<text class="font_3">呼吸系统</text>
|
|
|
- <text @click="handleClickBreath(3)" class="margin-left myFont">详情>></text>
|
|
|
+ <text @click="handleClickBreath(4)" class="margin-left myFont">详情>></text>
|
|
|
<!-- <image @click="handleClickBreath(3)" class="image_11" src="../../static/report/reportIconWhy.png" />-->
|
|
|
</view>
|
|
|
</view>
|
|
@@ -342,7 +341,6 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="list-divider"></view>
|
|
|
-
|
|
|
<view class="flex-col group_15">
|
|
|
<view class="flex-row justify-between group_2">
|
|
|
<text class="font_3 text_12">打鼾</text>
|
|
@@ -361,7 +359,6 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="list-divider"></view>
|
|
|
-
|
|
|
<view class="flex-col group_15">
|
|
|
<view class="flex-row justify-between group_2">
|
|
|
<text class="font_3 text_12">呼吸暂停</text>
|
|
@@ -382,24 +379,55 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
-<!-- <view class="flex-col justify-start relative report_heart">-->
|
|
|
-<!-- <view class="section_25"></view>-->
|
|
|
+ <view class="flex-col justify-start report_breath">
|
|
|
+ <view class="flex-col justify-start">
|
|
|
+ <view class="flex-row items-center group_11 space-x-10 pos_33">
|
|
|
+ <image class="image_8" src="../../static/report/reportIconMoon.png" />
|
|
|
+ <text class="font_3">深浅睡眠</text>
|
|
|
+ <text @click="handleClickBreath(1)" class="margin-left myFont">详情>></text>
|
|
|
+ <!-- <image @click="handleClickBreath(2)" class="image_11" src="../../static/report/reportIconWhy.png" />-->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="flex-col pos_34 report_heart">
|
|
|
+ <view class="flex-col group_15">
|
|
|
+ <view class="flex-row justify-between report-sleep items-center">
|
|
|
+ <view class="flex-col item-sleep">
|
|
|
+ <text class="item-sleep-title">清醒</text>
|
|
|
+ <text class="item-sleep-desc">{{ formateSeconds(sleepReportFrom.awake_duration, 1) }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="flex-col item-sleep">
|
|
|
+ <text class="item-sleep-title">浅睡</text>
|
|
|
+ <text class="item-sleep-desc">{{ formateSeconds(sleepReportFrom.light_duration, 1) }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="flex-col item-sleep">
|
|
|
+ <text class="item-sleep-title">中睡</text>
|
|
|
+ <text class="item-sleep-desc">{{ formateSeconds(sleepReportFrom.in_duration, 1) }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="flex-col item-sleep">
|
|
|
+ <text class="item-sleep-title">深睡</text>
|
|
|
+ <text class="item-sleep-desc">{{ formateSeconds(sleepReportFrom.deep_duration, 1) }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="report_breath_chart">
|
|
|
+ <view class="echarts-wrap">
|
|
|
+ <mpvue-echarts class="ec-canvas" canvasId="canvasChart-7" ref="refChart-7" @onInit="onInit1"></mpvue-echarts>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+<!-- <view class="flex-col justify-start relative report_breath">-->
|
|
|
+<!--<!– <view class="section_25"></view>–>-->
|
|
|
<!-- <view class="flex-row justify-center items-center group_11 space-x-9 pos_21">-->
|
|
|
-<!-- <image-->
|
|
|
-<!-- class="image_8"-->
|
|
|
-<!-- src="../../static/report/reportIconMoon.png"-->
|
|
|
-<!-- />-->
|
|
|
+<!-- <image class="image_8" src="../../static/report/reportIconMoon.png"/>-->
|
|
|
<!-- <text class="font_3">深浅睡眠</text>-->
|
|
|
-<!-- <image-->
|
|
|
-<!-- class="image_11"-->
|
|
|
-<!-- src="../../static/report/reportIconWhy.png"-->
|
|
|
-<!-- />-->
|
|
|
+<!-- <image class="image_11" src="../../static/report/reportIconWhy.png" />-->
|
|
|
<!-- </view>-->
|
|
|
-<!-- -->
|
|
|
+
|
|
|
<!-- <view class="flex-row justify-between report-sleep items-center">-->
|
|
|
-<!-- <view class="flex-col item-sleep">-->
|
|
|
-<!-- <text class="item-sleep-title">清醒</text>-->
|
|
|
-<!-- <text class="item-sleep-desc">2小时14分钟</text>-->
|
|
|
+<!-- <view class="flex-col item-sleep">-->
|
|
|
+<!-- <text class="item-sleep-title">清醒</text>-->
|
|
|
+<!-- <text class="item-sleep-desc">2小时14分钟</text>-->
|
|
|
<!-- </view>-->
|
|
|
<!-- <view class="flex-col item-sleep">-->
|
|
|
<!-- <text class="item-sleep-title">浅睡</text>-->
|
|
@@ -409,6 +437,11 @@
|
|
|
<!-- <text class="item-sleep-title">深睡</text>-->
|
|
|
<!-- <text class="item-sleep-desc">2小时14分钟</text>-->
|
|
|
<!-- </view>-->
|
|
|
+<!-- <view class="report_breath_chart">-->
|
|
|
+<!-- <view class="echarts-wrap">-->
|
|
|
+<!-- <mpvue-echarts class="ec-canvas" canvasId="canvasChart-6" ref="refChart-6" @onInit="onInit1"></mpvue-echarts>-->
|
|
|
+<!-- </view>-->
|
|
|
+<!-- </view>-->
|
|
|
<!-- </view>-->
|
|
|
<!-- </view>-->
|
|
|
|
|
@@ -454,6 +487,9 @@
|
|
|
</view>
|
|
|
<view class="cu-bar bg-white justify-end">
|
|
|
<view class="action">
|
|
|
+ <button class="cu-btn bg-cyan" @tap="goBuy">去购买</button>
|
|
|
+ </view>
|
|
|
+ <view class="action">
|
|
|
<button class="cu-btn bg-green margin-left" @tap="bindDevice">确定</button>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -678,18 +714,27 @@
|
|
|
_this.nowChart("refChart-4", 4, data.report_content.dt_arr, data.report_content.hx_arr)
|
|
|
_this.nowChart("refChart-5", 0, data.report_content.dt_arr, data.report_content.snoring_arr)
|
|
|
_this.nowChart("refChart-6", 6, data.report_content.dt_arr, data.report_content.hxstop_arr)
|
|
|
+ _this.nowChart("refChart-7", -1, data.report_content.dt_arr, data.report_content.sleep_arr)
|
|
|
}, 800)
|
|
|
},
|
|
|
// 将分转化为时分
|
|
|
- formateSeconds(endTime) {
|
|
|
+ formateSeconds(endTime, type) {
|
|
|
let secondTime = endTime//将传入的秒的值转化为Number
|
|
|
+ let hourStr, minuteStr
|
|
|
+ if (type === 0) {
|
|
|
+ hourStr = '小时'
|
|
|
+ minuteStr = '分钟'
|
|
|
+ } else {
|
|
|
+ hourStr = '时'
|
|
|
+ minuteStr = '分'
|
|
|
+ }
|
|
|
let h = 0// 初始化小时
|
|
|
if (secondTime > 60) {//如果秒数大于60,将秒数转换成整数
|
|
|
h = parseInt(secondTime / 60)//获取小时,获取分钟除以60,得到整数小时
|
|
|
secondTime = parseInt(secondTime % 60) //获取小时后取佘的分,获取分钟除以60取佘的分
|
|
|
- return h + '小时' + secondTime + '分钟'
|
|
|
+ return h + hourStr + secondTime + minuteStr
|
|
|
} else {
|
|
|
- return secondTime + '分钟'
|
|
|
+ return secondTime + minuteStr
|
|
|
}
|
|
|
},
|
|
|
onInit1(e) {
|
|
@@ -710,6 +755,9 @@
|
|
|
} else {
|
|
|
options.yAxis = this.getOptionsY2()
|
|
|
}
|
|
|
+ if (type === -1) {
|
|
|
+ options.series[0].areaStyle = {}
|
|
|
+ }
|
|
|
myChart.setOption(options)
|
|
|
},
|
|
|
getOptions(xData, yData) {
|
|
@@ -769,11 +817,17 @@
|
|
|
}
|
|
|
},
|
|
|
getOptionsY1(type) {
|
|
|
+ let min = 0, max = 1
|
|
|
+ if (type === -1) {
|
|
|
+ min = 0
|
|
|
+ max = 'dataMax'
|
|
|
+ }
|
|
|
return {
|
|
|
type: 'value',
|
|
|
// boundaryGap: [0, '100%'],
|
|
|
- min: 0,
|
|
|
- max: 1, // dataMax取数据在该轴上的最大值作为最大刻度
|
|
|
+ min: min,
|
|
|
+ max: max, // dataMax取数据在该轴上的最大值作为最大刻度
|
|
|
+ splitNumber: 4,
|
|
|
minInterval: 1,
|
|
|
splitLine: {
|
|
|
show: false, // 是否显示分隔线
|
|
@@ -791,6 +845,26 @@
|
|
|
axisLabel: {
|
|
|
formatter: function (value, index) {
|
|
|
switch (type) {
|
|
|
+ case -1:
|
|
|
+ let str = ''
|
|
|
+ console.log('value===', value)
|
|
|
+ switch (value) {
|
|
|
+ case 0:
|
|
|
+ str = '清醒'
|
|
|
+ break
|
|
|
+ case 10:
|
|
|
+ str = '浅睡'
|
|
|
+ break
|
|
|
+ case 20:
|
|
|
+ str = '中睡'
|
|
|
+ break
|
|
|
+ case 30:
|
|
|
+ str = '深睡'
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ break
|
|
|
+ }
|
|
|
+ return str
|
|
|
case 0:
|
|
|
return value === 0 ? '睡眠' : '打鼾'
|
|
|
case 1:
|
|
@@ -1174,7 +1248,7 @@
|
|
|
bottom: 0
|
|
|
}
|
|
|
.report-sleep {
|
|
|
- position: absolute;
|
|
|
+ //position: absolute;
|
|
|
top: 3rem;
|
|
|
width: 100%;
|
|
|
padding: 0.3rem;
|
|
@@ -1293,38 +1367,6 @@
|
|
|
padding: 0rem 0 0.25rem;
|
|
|
.group_8 {
|
|
|
padding: 0 1.25rem;
|
|
|
- .report_leave_bed {
|
|
|
- .section_10 {
|
|
|
- opacity: 0.8;
|
|
|
- background: linear-gradient(90deg, rgba(86, 17, 247, 0.5) 0%, #4d9efa 100%);
|
|
|
- border-radius: 0.5rem;
|
|
|
- height: 9.91rem;
|
|
|
- }
|
|
|
- .pos_2 {
|
|
|
- position: absolute;
|
|
|
- left: 0.63rem;
|
|
|
- right: 0.53rem;
|
|
|
- top: 0.63rem;
|
|
|
- .space-x-12 {
|
|
|
- & > view:not(:first-child),
|
|
|
- & > text:not(:first-child),
|
|
|
- & > image:not(:first-child) {
|
|
|
- margin-left: 0.75rem;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .pos_3 {
|
|
|
- position: absolute;
|
|
|
- left: 0.66rem;
|
|
|
- right: 0.63rem;
|
|
|
- top: 3.56rem;
|
|
|
- }
|
|
|
- .pos_10 {
|
|
|
- position: absolute;
|
|
|
- right: 0.66rem;
|
|
|
- top: 6.69rem;
|
|
|
- }
|
|
|
- }
|
|
|
.space-x-6 {
|
|
|
& > view:not(:first-child),
|
|
|
& > text:not(:first-child),
|