dever-product
/
churen


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
							
<!DOCTYPE html>
<html lang="en" class="no-js">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>期权管理系统</title>
	<meta name="description" content="期权管理系统" />
	<meta name="keywords" content="期权管理系统" />

	<link rel="stylesheet" type="text/css" href="../script/lib/layui/css/layui.css" />
	<script src="../script/lib/jquery/jquery.min.js"></script>
	<script src="../script/lib/layui/layui.js"></script>
	<script src="../script/lib/echarts/echarts.common.min.js"></script>
	<script><{Dever::script()}></script>
	<script src="../script/dever/core.js"></script>

	<link rel="stylesheet" type="text/css" href="../css/main.css" />
	<link rel="stylesheet" type="text/css" href="../css/custom-bars.css" />
</head>

<body>
	<div class="container">
		<header class="codrops-header">
			<h1 style="font-size:30px">期权管理系统</h1>
		</header>
		
		<section class="content" style="margin:0 auto;width:800px;">
			
			<article class="flexy-grid">
				<h3 style="font-size: 50px;">点击开始进行期权导入</h3>
				
			</article>
			<div class="layui-progress layui-progress-big" lay-showPercent="true" lay-filter="main">
			  <div class="layui-progress-bar layui-bg-blue" lay-percent="0%"></div>
			</div>

		</section>
		<!-- Related demos -->

		<div style="margin:0 auto;width: 100px;">
			<div class="site-main-button" style="margin-top: 20px; margin-bottom: 0;">
			  <button class="layui-btn layui-btn-danger site-main-active" data-type="set" style="display:none;">设置</button>
			  <button class="layui-btn layui-btn-danger site-main-active" data-type="loading">开始</button>
			</div>
		</div>
		
	</div>
	<script>

	var data = <{$list}>;

	var total = '<{$total}>';

	var n = 0;

	var j;

	var DISABLED = 'layui-btn-disabled';

	
	layui.use(['element','layer'], function(){

	  var $ = layui.jquery

	  ,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

	  var layer = layui.layer;


	  function loop(i,othis)

		{

			if (data[i]) {

				$('h3').html(data[i]['name']);

				i = i+1;

				n = parseInt(parseFloat(i) * parseFloat(j));

				if (n >= 100) {

					n = 100;

					othis.removeClass(DISABLED);

				}

				element.progress('main', n+'%');

				
				setTimeout(function(){loop(i,othis)}, 1000);

			} else {

				$('h3').html('完成');

				othis.removeClass(DISABLED);

				element.progress('main', '100%');

			}

		}


		function showAlert(msg, func, title, index, t)

		{

			if (!title) {

				title = '温馨提示';

			}


			var type = 0;

			if (msg.indexOf('<') != -1) {

				type = 1;

			}

			if (t) {

				type = t;

			}


			var config = {

			  type: 0,

			  title: title,

			  shade: 0.1,

			  shadeClose : true,

			  content: msg

			};


			if (index) {

				config.zIndex = index;

			}


			config.scrollbar = false;


			if (type == 1) {

				config.type = 1;

				config.btn = ['保存', '关闭'];

				config.area = '500px';

				
			}

			config.cancel = config.btn2 = function(index)

			{

				layer.close(index);

			};


			if (func) {

				config.yes = function(index)

				{

					func(index);

				};

			} else {

				config.yes = config.cancel;

			}

			config.success = function() {

				//$('.layui-layer-content').css('padding', '10px');

			}


			config.end = function() {

				$('.layui-layer-content').css('overflow-x', 'auto');

				$('#update_button').show();

			}

			
			var index = layer.open(config);

		}


		function setIndex()

		{

			var value = $("#setIndex").val().split('-');

			var url = '<{$url}>';

	      var start = value[0];

	      var end = value[1];

	      $.getJSON(url, {start:start,end:end}, function(t) {

	   			total = t.data.total;

	   			data = t.data.list;

	   			layer.closeAll();

	      });

		}

	  //触发事件

	  var active = {

	    set: function(){

	      //element.progress('main', '50%')

	      showAlert('<form class="layui-form" style="margin:10px"><div class="layui-form-item"><label class="layui-form-label">索引</label><div class="layui-input-block"><input type="text" id="setIndex" name="" placeholder="请输入账户索引，间隔用-隔开" autocomplete="off" class="layui-input"></div></div></form>', function() {setIndex()});

	      
	    }

	    ,loading: function(othis) {

	    	if (total <= 0) {

	    		alert('请先设置');

	    		return;

	    	}

			
			if(othis.hasClass(DISABLED)) return;

			othis.addClass(DISABLED);


			j = 100/total;

			element.progress('main', '0%');

			loop(0, othis);

			return;

			if (n < 100) {

				n = 100;

				element.progress('main', n+'%');

				othis.removeClass(DISABLED);

			}

	    },

	  };

	  
	  $('.site-main-active').on('click', function(){

	    var othis = $(this), type = $(this).data('type');

	    active[type] ? active[type].call(this, othis) : '';

	  });

	});

	</script>
	
</body>
</html>