您的位置:首页 > 产品设计 > UI/UE

MUI动态页面c页面之间传值mui

2017-01-18 00:00 204 查看
dcloud动态页面c页面之间传值mui

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<title>血压历史记录</title>

<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

<link href="../../css/mui.min.css" rel="stylesheet" />

<link rel="stylesheet" href="../../css/health.css" />

</head>

<body>

<header class="mui-bar mui-bar-nav">

<a class="mui-action-back">

<b class="mui-icon mui-icon-left-nav mui-pull-left c5"></b>

<h1 class="mui-title mui-text-left c5">血压历史记录</h1>

</a>

</header>

<div class="mui-content jays-content" id="down" style="margin-top: 0px;">

<div class="jays-top">

<div class="mui-row mui-text-center">

<div class=" mui-row mui-col-sm-7 mui-col-xs-7 jays-user">

<div class="mui-col-sm-12 mui-col-xs-12 mb6">

<h3 class="c1">未知</h3>

</div>

<div class="mui-col-sm-7 mui-col-xs-7 mb6">

<h4 class="c1"><span id="diastolic">--</span>/<span id="systolic">--</span></h4>

<span class="c2 f12"> mmHg</span>

</div>

<div class="mui-col-sm-5 mui-col-xs-5">

<h4 class="c1" id="pulse">83</h4>

<span class="c2 f12">bpm</span>

</div>

<div class="mui-col-sm-12 mui-col-xs-12 c1 f12" id="lastTime">2017-01-01 00:26</div>

</div>

<div class="mui-col-sm-5 mui-col-xs-5 mui-text-center">

<div class="jays-user-padded c1 f10">

<img src="../../images/user_logo.jpg" alt="" />

<p class="c1 f12">我</p>

健康的<br /> 美丽的

<br /> 快乐的

</div>

</div>

</div>

</div>

<div class="jays-advice">

<a href="#" class="c5 f12">血压医师咨询 <span class="mui-icon mui-icon-arrowright mui-pull-right"></span> </a>

</div>

<div class="jays-trend">

<div class="mui-text-center c3 f12" id="history">血压记录</div>

<div class="jays-chart" id="lineChart"></div>

</div>

</div>

<script src="../../js/mui.min.js"></script>

<script src="../../libs/echarts-all.js"></script>

<script type="text/javascript">

var getOption = function(chartType) {

var chartOption = chartType == 'pie' ? {

calculable: false,

series: [{

name: '访问来源',

type: 'pie',

radius: '65%',

center: ['50%', '50%'],

data: [{

value: 335,

name: '直接访问'

}, {

value: 310,

name: '邮件营销'

}, {

value: 234,

name: '联盟广告'

}, {

value: 135,

name: '视频广告'

}, {

value: 1548,

name: '搜索引擎'

}]

}]

} : {

//legend: {

// data: ['最近七次血压趋势图']

//},

grid: {

x: 35,

x2: 10,

y: 30,

y2: 25

},

toolbox: {

show: false,

feature: {

mark: {

show: true

},

dataView: {

show: true,

readOnly: false

},

magicType: {

show: true,

type: ['line', 'bar']

},

restore: {

show: true

},

saveAsImage: {

show: true

}

}

},

calculable: false,

xAxis: [{

type: 'category',

data: ['1', '2', '3', '4', '5', '6', '7']

}],

yAxis: [{

type: 'value',

min: '60',

max: '180',

splitArea: {

show: true

},

data: ['5', '10', '15']

}],

series: [{

name: '收缩压',

type: chartType,

data: systolicAry

}, {

name: '舒张压',

type: chartType,

data: diastolicAry

}],

backgroundColor: ['#fff'],

};

return chartOption;

};

var byId = function(id) {

return document.getElementById(id);

};

var lineChart = echarts.init(byId('lineChart'));

//lineChart.setOption(getOption('line'));

var diastolicAry = [];

var systolicAry = [];

mui.plusReady(function() {

var self = plus.webview.currentWebview();

var blood_pressure_id = self.idss.blood_pressure_id;

var diastolic = self.idss.diastolic;

var systolic = self.idss.systolic;

var pulse = self.idss.pulse;

var createdAt = self.idss.createdAt;

document.getElementById("diastolic").innerHTML = diastolic;

document.getElementById("systolic").innerHTML = systolic;

document.getElementById("pulse").innerHTML = pulse;

document.getElementById("lastTime").innerHTML = createdAt;

diastolicAry.push(diastolic);

systolicAry.push(systolic);

lineChart.setOption(getOption('line'));

});

var old_back = mui.back;

mui.back = function() {

mui.openWindow({

url: 'blood_pressure_main.html',

id: 'blood_pressure_main.html',

show: {

aniShow: 'slide-in-left',

duration: 200

},

waiting: {

autoShow: false

}

});

old_back();

}

function refresh() {

location.reload();

}

</script>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: