chatMe-mui
/
me_setting.html

<!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" />
	</head>

	<body>
		<div class="mui-content">
		    <ul class="mui-table-view">
			    <li class="mui-table-view-cell mui-media">
			        <a id="link_myface" href="javascript:;">
			        		<span class="mui-pull-right mui-icon mui-icon-arrowright" style="line-height: 42px;color: lightgray;margin-left: 5px;">
			        		</span>
			            <img id="img_user_face" class="mui-media-object mui-pull-right" src="css/registLogin/headimg.jpg">
			            <div class="mui-media-body" style="line-height: 42px;">
			                头像
			            </div>
			        </a>
			    </li>
			    <li class="mui-table-view-cell mui-media" id="li_nick_name">
			        <a href="javascript:;">
			        		<span class="mui-pull-right mui-icon mui-icon-arrowright" style="color: lightgray;margin-left: 5px;"></span>
			            <span id="span_nick_name" class="mui-pull-right" style="color: grey;font-size: 14px;"></span>
			            <div class="mui-media-body">
			                昵称
			            </div>
			        </a>
			    </li>
			    <li class="mui-table-view-cell mui-media">
			        <a href="javascript:;">
			            <span id="span_chat_id" class="mui-pull-right" style="color: grey;font-size: 14px;margin-right: 30px;"></span>
			            <div class="mui-media-body">
			                WeChatID
			            </div>
			        </a>
			    </li>
			    <li class="mui-table-view-cell mui-media">
			        <a href="javascript:;" id="my_qrcode">
			        	<span class="mui-pull-right mui-icon mui-icon-arrowright" style="color: lightgray;margin-left: 5px;"></span>
			            <img id="img_qr_code" class="mui-media-object mui-pull-right" src="image/qrcode.png" style="max-width: 22px;max-height: 22px; ">
			            <div class="mui-media-body">
			                二维码
			            </div>
			        </a>
			    </li>
			    <li class="mui-table-view-cell mui-media">
			        <a href="javascript:;" id="my_gitee">
			        		<span class="mui-pull-right mui-icon mui-icon-arrowright" style="color: lightgray;margin-left: 5px;"></span>
			            <img id="img_qr_code" class="mui-media-object mui-pull-right" src="image/github.png" style="max-width: 22px;max-height: 22px;">
			            <div class="mui-media-body">
			                开源地址
			            </div>
			        </a>
			    </li>
			</ul>

			<ul class="mui-table-view" style="margin-top: 24px;">
    				<li class="mui-table-view-cell mui-media" style="text-align: center;">
			        <a href="javascript:;" id="_logout">
			            <div class="mui-media-body">
			                注销登陆
			            </div>
			        </a>
			    </li>
    			</ul>
		</div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/app.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				//  获取当前的webview
				var meWebview = plus.webview.currentWebview();
				meWebview.addEventListener("show",function(){
					refreshUserInfo();
				});
				// 跳转到我的头像页面
				var link_myface = document.getElementById("link_myface");
				link_myface.addEventListener("tap",function(){
					// 页面跳转
					mui.openWindow("my_face.html", "my_face.html");
				});

				var li_nick_name = document.getElementById("li_nick_name");
				li_nick_name.addEventListener("tap",function(){
					mui.openWindow("nickname.html", "nickname.html");
				});
				// 我的二维码页面
				var my_qrcode = document.getElementById("my_qrcode");
				my_qrcode.addEventListener("tap",function(){
					mui.openWindow({
			    			url: "my/qrcode.html",
					  	id: "qrcode.html",
					  	show:{
					      	autoShow:true,//页面loaded事件发生后自动显示，默认为true
					      	aniShow: "slide-in-right",//页面显示动画，默认为”slide-in-right“；
					    },
					});

				});
				// github
				var my_gitee = document.getElementById("my_gitee");
				my_gitee.addEventListener("tap",function(){
					mui.openWindow({
					  url: "https://gitee.com/crism/chatMe-mui",
					  id: "gitee.html",
					  styles: {                             // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
					    titleNView: {                       // 窗口的标题栏控件
					      titleText:"https://gitee.com/crism/chatMe-mui",                // 标题栏文字,当不设置此属性时，默认加载当前页面的标题，并自动更新页面的标题
					      titleColor:"#fff",             // 字体颜色,颜色值格式为"#RRGGBB",默认值为"#000000"
					      titleSize:"14px",                 // 字体大小,默认17px
					      backgroundColor:"#303030",        // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"
					    }
					  }
					});
				});
				// 退出登陆
				var _logout = document.getElementById("_logout");
				_logout.addEventListener("tap",function(){
					let user = app.getUserInfo();
					app.userLogout(user.userId);
					plus.webview.close("index.html");
					mui.openWindow("login.html", "login.html");
				});
				// 添加自定义事件 刷新头像
				window.addEventListener("refresh",function(){
					refreshUserInfo();
				});
			})

			function refreshUserInfo(){
				var fr_user_info = app.getUserInfo();
			    if(fr_user_info != null){
			    	    var userName = fr_user_info.userName;
				    var faceImg = fr_user_info.faceImg;
				    var nickName = fr_user_info.nickName;
//				    var qrCode = fr_user_info.qrCode;
				    var span_nick_name = document.getElementById("span_nick_name");
				    var span_chat_id = document.getElementById("span_chat_id");
				    var img_qr_code = document.getElementById("img_qr_code");

				    span_nick_name.innerHTML = nickName;
				    span_chat_id.innerHTML = userName;
				    if(app.isNotNull(faceImg)){
				    	 	var img_user_face= document.getElementById("img_user_face");
				    	 	img_user_face.src = faceImg;
				    }
			    }
			}
		</script>
	</body>

</html>