yf_zd
/
qxzSy


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433
							{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<link href="{% static '/lib/bootstrap-3.3.7/css/bootstrap.css' %}" rel="stylesheet">
	<link rel="stylesheet" href="{% static '/lib/font-awesome/4.5.0/css/font-awesome.css' %}">
	<link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
	<link rel="stylesheet" href="{% static '/lib/css/ace.min.css' %}" />
	<link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}" />
	<style type="text/css">
		body {
			overflow: hidden;
			background: #fff;
		}

		.layui-form-label {
			width: 150px;
		}

		.layui-select-title input[readonly] {
			background-color: #FFF !important;
		}

		.layui-form-item .layui-input-inline {
			width: 208px;
		}

		.addKind {
			cursor: pointer;
			color: #5393bf;
			font-weight: 700;
			font-size: 14px;
			display: inline-block;
		}

		.twoGroups,
		.insectkindDiv,
		.insectPestNameDiv,
		.currcrop,
		.wormRankDiv,
		#allmap {
			display: none;
		}

		.layui-form-radio>i:hover,
		.layui-form-radioed>i {
			color: #61c5ff;
		}

		.layui-block {
			margin-left: 150px;
		}

		.layui-block>ul {
			width: 700px;
			overflow: hidden;
		}

		.layui-block>ul>li {
			float: left;
			width: 50%;
			margin-bottom: 10px;
		}

		.rank>span {
			border: 1px solid #d5d5d5;
			display: inline-block;
			text-align: center;
			width: 100px;
			line-height: 30px;
			margin: 0 5px;
		}

		.rank>span>input {
			border: none;
			width: 100%;
			line-height: 30px;
			padding: 0;
			text-align: center;
		}

		.wormRank>span:first-child {
			border: none;
			text-align: left;
			width: 70px;
		}

		/* 删除菜单项 */
		#delmenu {
			padding: 20px;
			display: none;
		}

		#delmenu>ul {
			overflow: hidden;
		}

		#delmenu>ul>li {
			float: left;
			width: 33.33%;
		}

		#delmenu>ul>li div {
			display: inline-block;
			height: 40px;
			line-height: 40px;
			cursor: pointer;
			border: 1px solid #c9c9c9;
			margin: 3px 0;
			padding: 0 10px;
			position: relative;
			min-width: 100px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			max-width: 197px;
		}

		/* #delmenu >ul >li div:hover{
			border: 1px solid #07b8a2;			
		}
		#delmenu >ul >li div:hover::after{
			border: 10px solid #07b8a2;
			border-top: 10px solid transparent;
			border-left: 10px solid transparent;
		} */
		#delmenu>ul>li div::after {
			position: absolute;
			content: '';
			width: 0;
			height: 0;
			border: 10px solid #c9c9c9;
			right: 0;
			bottom: 0;
			border-top: 10px solid transparent;
			border-left: 10px solid transparent;
		}

		#delmenu>ul>li div.check {
			border: 1px solid #07b8a2;

		}

		#delmenu>ul>li div.check::after {
			border: 10px solid #07b8a2;
			border-top: 10px solid transparent;
			border-left: 10px solid transparent;
		}
	</style>

</head>

<body>
	<div class="content">
		<div class="page-header">
			<h1>
				<font style="vertical-align: inherit;">
					<font style="vertical-align: inherit;">
						分配子账号
					</font>
				</font>
			</h1>
		</div>

		<form class="layui-form" action="" id="formId">
			<div class="layui-form-item">
				<label class="layui-form-label">省市区：</label>
				<div class="layui-input-block">
					<div class="layui-inline">
						<select class="user_por" name="user_por" lay-verify="required" lay-filter="province"
							id="province">
							<option value="">请选择</option>
							{% for i in addr %}
							<option value="{{i.code}}">{{i.name}}</option>
							{% endfor %}
						</select>
					</div>
					<div class="layui-inline">
						<div class="layui-form" lay-filter="cityFilter">
							<select class="user_city" name="user_city" lay-verify="required" lay-filter="city"
								id="city">
								<option value="">请选择</option>
							</select>
						</div>

					</div>
					<div class="layui-inline">
						<div class="layui-form" lay-filter="districtFilter">
							<select class="user_area" name="user_area" lay-verify="required" lay-filter="district"
								id="district">
								<option value="">请选择</option>
							</select>
						</div>
					</div>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">乡：</label>
				<div class="layui-input-inline">
					<input type="text" name="user_country" placeholder="请输入乡地址" autocomplete="off" class="layui-input">
				</div>
				<div class="layui-form-mid layui-word-aux">(选填)</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">账号：</label>
				<div class="layui-input-inline">
					<!-- <input type="text" name="name" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> -->
					<input type="text" name="name" required placeholder="请输入账号" autocomplete="off" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">密码：</label>
				<div class="layui-input-inline">
					<!-- <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> -->
					<input type="text" name="password" required placeholder="请输入密码" autocomplete="off"
						class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">联系电话：</label>
				<div class="layui-input-inline">
					<input type="number" name="phone" required lay-verify="required" placeholder="请填写正确格式的手机号码" autocomplete="off"
						class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">子账号的激活码</label>
				<div class="layui-input-inline">
					<input id="code" type="text" name="activation" readonly="readonly" required lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-input-block">
					<input type="hidden" name="lat" id="lat">
					<input type="hidden" name="lng" id="lng">
					<button type="button" class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
					<a href="look_user" class="layui-btn layui-btn-primary">返回</a>
				</div>
			</div>
		</form>
		<div id="allmap"></div>
		<div id="delmenu">
			<ul>
				<li>
					<div class="check">红薯</div>
				</li>
				<li>
					<div>花生</div>
				</li>
				<li>
					<div>红薯红薯红薯</div>
				</li>
				<li>
					<div>花生花生花生花生花生</div>
				</li>
				<li>
					<div>花生花生</div>
				</li>
			</ul>
		</div>
	</div>
	<script src="{% static '/lib/js/jquery-2.1.4.min.js' %}"></script>
	<script src="{% static '/lib/bootstrap-3.3.7/js/bootstrap.js' %}"></script>
	<script src="{% static '/lib/layui/layui.all.js' %}"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=TcRPmrsiZUqdUBWoELrUArRkCRC36KMx"></script>
	<script src="{% static '/js/common.js' %}?versions=0.5.4"></script>

	<script type="text/javascript">
		$.ajaxSetup({
			data: { csrfmiddlewaretoken: '{{ csrf_token }}' },
		});
	</script>
	<script>
		// 百度地图API功能
		var map = new BMap.Map("allmap");
		var point = new BMap.Point(116.331398, 39.897445);
		map.centerAndZoom(point, 12);

		var geolocation = new BMap.Geolocation();
		geolocation.getCurrentPosition(function (r) {
			if (this.getStatus() == BMAP_STATUS_SUCCESS) {
				var mk = new BMap.Marker(r.point);
				map.addOverlay(mk);
				map.panTo(r.point);
				$('#lat').val(r.point.lat)
				$('#lng').val(r.point.lng)
			}
			else {
				alert('failed' + this.getStatus());
				console.log('定位失败');
			}
		}, { enableHighAccuracy: true })

		scrollBar();
		layui.use('form', function () {
			var form = layui.form;
			codeMa(); //激活码
			form.on('select(province)', function (data) {  //点击省请求
				// console.log(data.elem); //得到select原始DOM对象
				// console.log(data.value); //得到被选中的值
				// console.log(data); //得到被选中的值
				// console.log(data.othis); //得到美化后的DOM对象
				if (data.value) {
					getSiteList(data.value, 'province');
				} else {
					$('#city').html('<option value="">请选择</option>');
					$('#district').html('<option value="">请选择</option>');
					layui.use('form', function () {
						var form = layui.form;
						form.render('select', 'cityFilter');
						form.render('select', 'districtFilter');
					})
				}
			});
			form.on('select(city)', function (data) {  //点击省请求
				// console.log(data.elem); //得到select原始DOM对象
				// console.log(data.value); //得到被选中的值
				// console.log(data.othis); //得到美化后的DOM对象
				if (data.value) {
					getSiteList(data.value, 'city');
				} else {
					$('#district').html('<option value="">请选择</option>');
					layui.use('form', function () {
						var form = layui.form;
						form.render('select', 'districtFilter');
					})
				}
			});

			form.on('submit(formDemo)', function (data) {
				var groun = [];
				//判断用户联系电话填写是否正确
				if (!/^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(data.field.phone)) {
					console.log('不正确')
					layer.msg('手机号码格式填写不正确');
				} else {
					$.ajax({
						url: 'new_reporter',
						type: 'post',
						data: {
							user_por: data.field.user_por, //省
							user_city: data.field.user_city, //市
							user_area: data.field.user_area, //区
							addr: data.field.user_country, //乡
							username: data.field.name, //账号
							password: data.field.password, //密码
							phone: data.field.phone, //联系电话
							code: data.field.activation, //激活码
						},
						success: function (data) {
							console.log(data)
							if (data == 0) {
								layer.msg('测报员名称重复，请重试', { icon: 5 });

							} else if (data == 1) {
								layer.msg('账号创建成功！');
								$('#formId')[0].reset();
								codeMa()
							} else if (data == 2) {
								layer.msg('改所属用户下已经有了三个账号，不能再添加', {time: 5000, icon:5})
							}
						},
						error: function (error) {
							console.log(error)
						}
					})
				}
				return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
		})
		function getSiteList(dat, currSelect) {  //城市码，当前选择项
			$.ajax({
				url: 'cate_insect',
				type: 'post',
				data: {
					code: dat
				},
				dataType: 'json',
				success: function (data) {
					if (data.length) {
						html = '<option value="">请选择</option>';
						for (var i = 0; i < data.length; i++) {
							html += '<option value="' + data[i].code + '">' + data[i].name + '</option>';
							if (i == data.length - 1) {
								if (currSelect == 'province') {
									$('#city').html(html);
									$('#district').html('<option value="">请选择</option>');
									layui.use('form', function () {
										var form = layui.form;
										form.render('select', 'cityFilter');
										form.render('select', 'districtFilter');
									})
								} else if (currSelect == 'city') {
									$('#district').html(html);
									layui.use('form', function () {
										var form = layui.form;
										form.render('select', 'districtFilter');
									})
								}
							}

						}
					}
				}
			})
		}
		
		//请求子账号下的激活码
		function codeMa () {
			$.ajax({
				url: 'new_code',
				type: 'get',
				dataType: 'json',
				success: function (data) {
					console.log(data.dat)
					$('#code').val(data.dat)
				},

				error: function (error) {
					console.log(error)
				}
			})
		}
	
	</script>
</body>

</html>