ygtx
/
ygtx_oa_app


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
							<!DOCTYPE html>
<html>  
  
    <head>  
        <meta charset="utf-8">  
        <title>index页面</title>  
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
        <!--基于框架引入的css，一般不做修改 star-->  
        <link rel="stylesheet" href="../../css/mui.min.css" />  
        <link rel="stylesheet" type="text/css" href="../../css/common.css"/>
        <link href="../../css/OA-style.css" rel="stylesheet" />
  
        <!--基于框架引入的css，一般不做修改 end-->  
        <!--公共样式部分-->  
        <style type="text/css">  
            body{background: #fff;}  
            .locker-midd{text-align: center;margin: auto;position: absolute;top: 0;bottom: 0;left: 0;right: 0;width: 100%;height: 430px;}  
            .mui-locker-holder{margin: 0 auto;}  
            .locker-midd img{width: 170px;}  
            .bottom_btn{position:absolute;bottom: 30px;width: 100%;text-align: center;}  
            .bottom_btn a{color: #999;padding: 5px 10px;margin: 1rem;}  
            .bottom_btn a:active{color: #ccc;}  
            
            .mui-switch:before{
			    font-size: 13px;
			    position: absolute;
			    top: 3px;
			    right: 11px;
			    content: attr(data-off);
			    text-transform: uppercase;
			    color: #999;
			}
			.mui-switch.mui-active:before{
			    right: auto;
			    left: 15px;
			    content: attr(data-on);
			    color: #fff;
			}
			.mui-switch{
			    width: 68px;
				height: 30px;
			}
			.mui-switch .mui-switch-handle {
			    width: 28px;
			    height: 28px;
    		}
        </style>  
    </head>  
    <body>  
        <header class="mui-bar mui-bar-nav">  
            <a href="" class="mui-action-back back mui-pull-left"><img src="../../images/back.png"></a>  
            <h1 class="mui-title">设置手势密码</h1>  
        </header>  
        <div class="mui-content bg-white">  
        	<ul class="mui-table-view" style="margin-top: 0px;">
						<li class="mui-table-view-cell">
						<span>手势密码开关</span>
						<div class="mui-switch" id="lockState" data-off="关" data-on = "开">
						<div class="mui-switch-handle"></div>
						</div>
						</li> 
					</ul> 
	        <div class="locker-midd" id="locker">
	            <div id="holder" class="mui-locker" data-locker-options='{"ringColor":"#ddd","fillColor":"#fff","touchringColor":"#08b9a2","touchfillColor":"#fff","pointColor":"#08b9a2","lineColor":"#08b9a2","ringWidth":"2","lindeWidth":"2"}' data-locker-width='300' data-locker-height='300'></div>  
	            <p id="alert"></p>  
	        </div>  
	        <div class="bottom_btn">  
	            <!--<a id="modify">修改图案密码</a>  
	            <a id="forget">忘记图案密码</a>-->  
	        </div>  
        </div>  
        <!--基于框架引入的js-->  
        <script src="../../js/mui.min.js"></script>  
        <!--基于框架封装好的js-->  
        <!--<script src="libs/js/ns_app.js"></script>-->  
        <script src="../../js/mui.locker.js"></script> 
        <script src="../../js/app.js"></script>
        <script src="../../js/config.js"></script>
        <script src="../../js/common.js"></script>  
        <script src="../../js/jquery-1.11.2.min.js" type="text/javascript" charset="utf-8"></script>  
        <script type="text/javascript">
        	//(function($, doc) { 
        	 //锁屏设置
		(function($, doc) {
			//$.init();
			$.plusReady(function() {
				var settings = app.getSettings();
				var lockStateButton = doc.getElementById("lockState");
				var locker = doc.querySelector('.mui-locker');
				lockStateButton.classList[settings.gestures ? 'add' : 'remove']('mui-active')
				locker.style.display = settings.gestures ? 'block' : 'none';
				lockStateButton.addEventListener('toggle', function(event) {
					var isActive = event.detail.isActive;
					locker.style.display = isActive ? 'block' : 'none';
					if (!isActive) {
						//						alert(0);
						settings.gestures = '';
						app.setSettings(settings);
					}
				}, false);
				var record = [];
				locker.addEventListener('done', function(event) {
					var rs = event.detail;
					if (rs.points.length < 4) {
						plus.nativeUI.toast('设定的手势太简单了');
						record = [];
						rs.sender.clear();
						return;
					}
					record.push(rs.points.join(''));
					if (record.length >= 2) {
						if (record[0] == record[1]) {
							plus.nativeUI.toast('解锁手势设定成功，以后用户只需使用手势解锁而无需输入密码登录。');
							settings.gestures = record[0];
							settings.autoLogin = true;
							app.setSettings(settings);
							setTimeout(function() {
								$.back();
							}, 200);
						} else {
							plus.nativeUI.toast('两次手势不一致,请重新设定');
						}
						rs.sender.clear();
						record = [];
					} else {
						plus.nativeUI.toast('请确认手势设定');
						rs.sender.clear();
					}
				}, false);
			});
		}(mui, document)); 
			      
			
			
        </script>
    </body>  
  
</html>