diff --git a/assets/images/my/baby.png b/assets/images/my/baby.png
index a8a0a30..259ac17 100644
Binary files a/assets/images/my/baby.png and b/assets/images/my/baby.png differ
diff --git a/pages/home/index.js b/pages/home/index.js
index a12520a..40ece98 100644
--- a/pages/home/index.js
+++ b/pages/home/index.js
@@ -1,19 +1,18 @@
import * as echarts from '../../ec-canvas/echarts.min';
import request from '~/api/request';
const app = getApp();
-let height = []
-let weight = []
+
function initChart(canvas, width, height, dpr) {
const chart = echarts.init(canvas, null, {
width: width,
height: height,
- devicePixelRatio: dpr // new
+ devicePixelRatio: dpr
});
canvas.setChart(chart);
var option = {
title: {
- text: '身高（cm）',
+ text: '',
left: 'left',
fontSize: 6
},
@@ -25,8 +24,8 @@ function initChart(canvas, width, height, dpr) {
},
grid: {
containLabel: true,
- top: '12%',
- left: '5%',
+ top: '5%',
+ left: '1%',
right: '5%',
bottom: '10%'
},
@@ -37,8 +36,7 @@ function initChart(canvas, width, height, dpr) {
xAxis: {
type: 'category',
boundaryGap: false,
- data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
- // show: false
+ data: ['出生', '1月', '2月', '3月', '4月', '5月'],
},
yAxis: {
x: 'center',
@@ -48,13 +46,12 @@ function initChart(canvas, width, height, dpr) {
type: 'dashed'
}
}
- // show: false
},
series: [{
name: '实际身高',
type: 'line',
smooth: true,
- data: height
+ data: []
}, {
name: '标准范围',
type: 'line',
@@ -71,13 +68,13 @@ function initChart2(canvas, width, height, dpr) {
const chart = echarts.init(canvas, null, {
width: width,
height: height,
- devicePixelRatio: dpr // new
+ devicePixelRatio: dpr
});
canvas.setChart(chart);
var option = {
title: {
- text: '体重（kg）',
+ text: '',
left: 'left',
fontSize: 12
},
@@ -89,8 +86,8 @@ function initChart2(canvas, width, height, dpr) {
},
grid: {
containLabel: true,
- top: '12%',
- left: '5%',
+ top: '5%',
+ left: '1%',
right: '5%',
bottom: '10%'
},
@@ -101,8 +98,7 @@ function initChart2(canvas, width, height, dpr) {
xAxis: {
type: 'category',
boundaryGap: false,
- data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
- // show: false
+ data: ['出生', '1月', '2月', '3月', '4月', '5月'],
},
yAxis: {
x: 'center',
@@ -112,13 +108,12 @@ function initChart2(canvas, width, height, dpr) {
type: 'dashed'
}
}
- // show: false
},
series: [{
name: '实际体重',
type: 'line',
smooth: true,
- data: weight
+ data: []
}, {
name: '标准范围',
type: 'line',
@@ -142,16 +137,20 @@ Page({
},
data: {
ec: {
- onInit: ''
+ lazyLoad: true
},
ec2: {
- onInit: ''
+ lazyLoad: true
},
activeIndex: 0,
sfData:{},
sfListLength: 0,
articles:[],
- articlesLength: 0
+ articlesLength: 0,
+ heightData: [],
+ weightData: [],
+ heightChart: null,
+ weightChart: null
},
// Helper function to strip HTML tags and convert to plain text
@@ -198,35 +197,205 @@ Page({
async getChartData(){
const res = await request('patient/chat/0', 'get')
+ const heightData = []
+ const weightData = []
+
if(res.list.length > 0){
res.list.forEach(item => {
- height.push(item.height)
- weight.push(item.weight)
+ heightData.push(item.height)
+ weightData.push(item.weight)
})
}
+
this.setData({
- ec: {
- onInit: initChart
- },
- ec2: {
- onInit: initChart2
- },
- })
+ heightData,
+ weightData
+ }, () => {
+ this.initCharts();
+ });
},
+
+ initCharts() {
+ // 初始化身高图表
+ if (!this.heightChart) {
+ const chart1 = this.selectComponent('#mychart-dom-height');
+ if (chart1) {
+ chart1.init((canvas, width, height, dpr) => {
+ const chart = echarts.init(canvas, null, {
+ width: width,
+ height: height,
+ devicePixelRatio: dpr
+ });
+ canvas.setChart(chart);
+
+ const option = {
+ title: {
+ text: '',
+ left: 'left',
+ fontSize: 6
+ },
+ legend: {
+ data: ['实际身高', '标准范围'],
+ bottom: 0,
+ left: 'center',
+ z: 100
+ },
+ grid: {
+ containLabel: true,
+ top: '5%',
+ left: '1%',
+ right: '5%',
+ bottom: '10%'
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: ['出生', '1月', '2月', '3月', '4月', '5月'],
+ },
+ yAxis: {
+ x: 'center',
+ type: 'value',
+ splitLine: {
+ lineStyle: {
+ type: 'dashed'
+ }
+ }
+ },
+ series: [{
+ name: '实际身高',
+ type: 'line',
+ smooth: true,
+ data: this.data.heightData
+ }, {
+ name: '标准范围',
+ type: 'line',
+ smooth: true,
+ data: [120, 130, 140, 150, 160, 170]
+ }]
+ };
+
+ chart.setOption(option);
+ this.heightChart = chart;
+ return chart;
+ });
+ }
+ }
+
+ // 初始化体重图表
+ if (!this.weightChart) {
+ const chart2 = this.selectComponent('#mychart-dom-weight');
+ if (chart2) {
+ chart2.init((canvas, width, height, dpr) => {
+ const chart = echarts.init(canvas, null, {
+ width: width,
+ height: height,
+ devicePixelRatio: dpr
+ });
+ canvas.setChart(chart);
+
+ const option = {
+ title: {
+ text: '',
+ left: 'left',
+ fontSize: 12
+ },
+ legend: {
+ data: ['实际体重', '标准范围'],
+ bottom: 0,
+ left: 'center',
+ z: 100
+ },
+ grid: {
+ containLabel: true,
+ top: '5%',
+ left: '1%',
+ right: '5%',
+ bottom: '10%'
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: ['出生', '1月', '2月', '3月', '4月', '5月'],
+ },
+ yAxis: {
+ x: 'center',
+ type: 'value',
+ splitLine: {
+ lineStyle: {
+ type: 'dashed'
+ }
+ }
+ },
+ series: [{
+ name: '实际体重',
+ type: 'line',
+ smooth: true,
+ data: this.data.weightData
+ }, {
+ name: '标准范围',
+ type: 'line',
+ smooth: true,
+ data: [120, 130, 140, 150, 160, 170]
+ }]
+ };
+
+ chart.setOption(option);
+ this.weightChart = chart;
+ return chart;
+ });
+ }
+ }
+ },
+
onLoad(){
- this.getChartData()
this.getSfList()
+ setTimeout(() => {
+ this.getChartData().then(() => {
+ if (this.data.activeIndex === 0) {
+ this.initHeightChart();
+ } else {
+ this.initWeightChart();
+ }
+ });
+ }, 500);
+ },
+
+ onReady() {
+ // setTimeout(() => {
+ // this.getChartData().then(() => {
+ // if (this.data.activeIndex === 0) {
+ // this.initHeightChart();
+ // } else {
+ // this.initWeightChart();
+ // }
+ // });
+ // }, 500);
},
changeChart(e) {
const index = e.currentTarget.dataset.index;
- console.log(index);
+ if(index == this.data.activeIndex){
+ return
+ }
this.setData({
activeIndex: index
- })
- },
-
- onReady() {
+ }, () => {
+ setTimeout(() => {
+ if (index == 0) {
+ this.initHeightChart();
+ } else {
+ this.initWeightChart();
+ }
+ }, 100);
+ });
},
toClockIn(){
@@ -251,4 +420,64 @@ Page({
url: '/pages/article/index',
})
},
+
+ onUnload() {
+ // 页面卸载时销毁图表实例
+ if (this.heightChart) {
+ this.heightChart.dispose();
+ this.heightChart = null;
+ }
+ if (this.weightChart) {
+ this.weightChart.dispose();
+ this.weightChart = null;
+ }
+ },
+
+ // 初始化身高图表
+ initHeightChart() {
+ const chartComp = this.selectComponent('#mychart-dom-height');
+ if (chartComp) {
+ chartComp.init((canvas, width, height, dpr) => {
+ const chart = echarts.init(canvas, null, { width, height, devicePixelRatio: dpr });
+ canvas.setChart(chart);
+ chart.setOption({
+ title: { text: '', left: 'left', fontSize: 6 },
+ legend: { data: ['实际身高', '标准范围'], bottom: 0, left: 'center', z: 100 },
+ grid: { containLabel: true, top: '5%', left: '1%', right: '5%', bottom: '10%' },
+ tooltip: { show: true, trigger: 'axis' },
+ xAxis: { type: 'category', boundaryGap: false, data: ['出生', '1月', '2月', '3月', '4月', '5月'] },
+ yAxis: { x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } } },
+ series: [
+ { name: '实际身高', type: 'line', smooth: true, data: this.data.heightData },
+ { name: '标准范围', type: 'line', smooth: true, data: [120, 130, 140, 150, 160, 170] }
+ ]
+ });
+ return chart;
+ });
+ }
+ },
+
+ // 初始化体重图表
+ initWeightChart() {
+ const chartComp = this.selectComponent('#mychart-dom-weight');
+ if (chartComp) {
+ chartComp.init((canvas, width, height, dpr) => {
+ const chart = echarts.init(canvas, null, { width, height, devicePixelRatio: dpr });
+ canvas.setChart(chart);
+ chart.setOption({
+ title: { text: '', left: 'left', fontSize: 12 },
+ legend: { data: ['实际体重', '标准范围'], bottom: 0, left: 'center', z: 100 },
+ grid: { containLabel: true, top: '5%', left: '1%', right: '5%', bottom: '10%' },
+ tooltip: { show: true, trigger: 'axis' },
+ xAxis: { type: 'category', boundaryGap: false, data: ['出生', '1月', '2月', '3月', '4月', '5月'] },
+ yAxis: { x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } } },
+ series: [
+ { name: '实际体重', type: 'line', smooth: true, data: this.data.weightData },
+ { name: '标准范围', type: 'line', smooth: true, data: [120, 130, 140, 150, 160, 170] }
+ ]
+ });
+ return chart;
+ });
+ }
+ },
});
\ No newline at end of file
diff --git a/pages/home/index.less b/pages/home/index.less
index 4b669b9..577c736 100644
--- a/pages/home/index.less
+++ b/pages/home/index.less
@@ -17,7 +17,8 @@
.home-content {
// height: calc(100% - @nav-bar-height);
- padding: 30rpx;
+ padding: 28rpx;
+ padding-bottom: 0;
position: relative;
z-index: 1;
.item-title-img{
@@ -28,7 +29,7 @@
height: 96rpx;
position: relative;
left: -24rpx;
- margin-top: -28rpx;
+ // margin-top: -28rpx;
}
.item-title {
font-family: Alibaba-PuHuiTi, Alibaba-PuHuiTi;
@@ -54,8 +55,8 @@
.item-content {
background-color: #fff;
border-radius: 24rpx;
- padding: 30rpx;
- margin-bottom: 30rpx;
+ padding: 28rpx;
+ margin-bottom: 28rpx;
@@ -90,7 +91,7 @@
vertical-align: middle;
width: 36rpx;
height: 36rpx;
- margin-right: 10rpx;
+ margin-right: 20rpx;
}
.item-title-right-text {
position: absolute;
@@ -186,6 +187,21 @@
.item-title-icon{
margin-right: 18rpx;
}
+
+ }
+ .item-content-2{
+ background: linear-gradient( 180deg, #E7F2F2 0%, #F7FCFC 100%);
+ box-shadow: 0rpx 2rpx 20rpx 0rpx #E9F4F3;
+ border-radius: 24rpx;
+ border: 2rpx solid #FFFFFF;
+ position: relative;
+ padding-top:0 ;
+ .item-title{
+ margin-bottom: 0;
+ }
+ .item-box{
+ margin-top: 0;
+ }
}
}
.item-content-1{
@@ -195,13 +211,7 @@
border: 2rpx solid #FFFFFF;
position: relative;
}
- .item-content-2{
- background: linear-gradient( 180deg, #E7F2F2 0%, #F7FCFC 100%);
- box-shadow: 0rpx 2rpx 20rpx 0rpx #E9F4F3;
- border-radius: 24rpx;
- border: 2rpx solid #FFFFFF;
- position: relative;
- }
+
}
@@ -220,4 +230,150 @@
align-items: center;
justify-content: center;
box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+}
+
+.box_3 {
+ background-color: rgba(245,245,245,1.000000);
+ border-radius: 28rpx;
+ width: 250rpx;
+ flex-direction: row;
+ display: flex;
+ justify-content: space-between;
+ padding: 4rpx 28rpx 4rpx 4rpx;
+ white-space: nowrap;
+ margin-bottom: 16rpx;
+ margin-left:-4rpx;
+}
+.text-wrapper_1 {
+ border-radius: 28rpx;
+ display: flex;
+ flex-direction: column;
+ padding: 12rpx 24rpx 12rpx 24rpx;
+}
+.text-act{
+ background-color: rgba(255,255,255,1.000000);
+
+}
+.text_2 {
+ overflow-wrap: break-word;
+ color: rgba(34,34,34,1);
+ font-size: 24rpx;
+ font-family: Alibaba-PuHuiTi-M;
+ font-weight: normal;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 24rpx;
+}
+.echarts-title{
+ font-size: 24rpx;
+ color: #909399;
+ line-height: 34rpx;
+}
+.image-text_3 {
+ width: 110rpx;
+ flex-direction: row;
+ display: flex;
+ justify-content: space-between;
+ margin: 32rpx 0rpx 18rpx 0;
+}
+.box_6 {
+ border-radius: 100%;
+ width: 16rpx;
+ height: 16rpx;
+ border: 2px solid rgba(0,91,162,1);
+ display: flex;
+ flex-direction: column;
+ margin: 6rpx 0 6rpx 0;
+ box-sizing: border-box;
+}
+.text-group_3 {
+ overflow-wrap: break-word;
+ color: rgba(34,34,34,1);
+ font-size: 28rpx;
+ font-family: Alibaba-PuHuiTi-M;
+ font-weight: normal;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 28rpx;
+}
+.box_9 {
+ background-color: rgba(255,255,255,1.000000);
+ border-radius: 16rpx;
+ position: relative;
+ z-index: 1;
+ flex-direction: row;
+ display: flex;
+ justify-content: flex-center;
+ padding: 24rpx 24rpx 24rpx 24rpx;
+ margin-left: 30rpx;
+}
+.image-text_5 {
+ width: 298rpx;
+ flex-direction: row;
+ display: flex;
+ justify-content: space-between;
+}
+.box_10 {
+ border-radius: 16rpx;
+ background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/c46fcd8a7c644cbbb347a75b175350c6_mergeImage.png);
+ width: 100rpx;
+ height: 100rpx;
+ border: 1px solid rgba(0,91,162,0.1);
+ display: flex;
+ flex-direction: column;
+ box-sizing: border-box;
+ margin-right:16rpx ;
+}
+.text-group_5 {
+ display: flex;
+ flex-direction: column;
+ margin: 12rpx 0 12rpx 0;
+}
+.text_21 {
+ overflow-wrap: break-word;
+ color: rgba(34,34,34,1);
+ font-size: 32rpx;
+ font-family: Alibaba-PuHuiTi-M;
+ font-weight: normal;
+ text-align: right;
+ white-space: nowrap;
+ line-height: 32rpx;
+ margin-right: 86rpx;
+}
+.text_22 {
+ overflow-wrap: break-word;
+ color: rgba(144,147,153,1);
+ font-size: 28rpx;
+ font-family: Alibaba-PuHuiTi-R;
+ font-weight: normal;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 28rpx;
+ margin-top: 16rpx;
+}
+.box_11 {
+ background-color: rgba(237,243,248,1.000000);
+ width: 2rpx;
+ height: 62rpx;
+ display: flex;
+ flex-direction: column;
+ margin: 20rpx 0 18rpx 100rpx;
+}
+.text-wrapper_6 {
+ background-color: rgba(0,91,162,1.000000);
+ border-radius: 32rpx;
+ display: flex;
+ flex-direction: column;
+ margin: 22rpx 0 22rpx 24rpx;
+ padding: 12rpx 40rpx 12rpx 40rpx;
+}
+.text_23 {
+ overflow-wrap: break-word;
+ color: rgba(255,255,255,1);
+ font-size: 28rpx;
+ font-family: Alibaba-PuHuiTi-M;
+ font-weight: normal;
+ text-align: right;
+ white-space: nowrap;
+ line-height: 32rpx;
}
\ No newline at end of file
diff --git a/pages/home/index.wxml b/pages/home/index.wxml
index 656d07c..f286733 100644
--- a/pages/home/index.wxml
+++ b/pages/home/index.wxml
@@ -6,17 +6,19 @@
宝宝成长曲线
-
-
- 身高曲线
+
+
+
+ 身高曲线
-
- 体重曲线
+
+ 体重曲线
+ {{activeIndex == 0 ? '身高（cm）':'体重（g）'}}
-
-
+
+
@@ -27,8 +29,8 @@
更多
-
-
+
+
布洛芬
-
1片 饭后复用
- 打卡
-
+ 打卡 -->
+
+
+ 08:00
+
+
+
+
+
+ 优思弗
+ 1片，饭后服用
+
+
+
+
+ 打卡
+
+
+
diff --git a/pages/my/index.less b/pages/my/index.less
index 08ce0df..8c1cad3 100644
--- a/pages/my/index.less
+++ b/pages/my/index.less
@@ -169,9 +169,9 @@
height: 120rpx;
margin-bottom: 48rpx;
background-color: rgba(255,255,255,0.5);
- padding: 20rpx;
+ // padding: 20rpx;
border-radius: 120rpx;
- border: 4rpx solid rgba(255,255,255,1);
+ // border: 4rpx solid rgba(255,255,255,1);
image{
width: 100%;
height: 100%;