yf_zd
/
yfwlwCut


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672
							{% extends "base.html" %} {% block headcss %} {% load staticfiles %}

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<link href="{% static '/lib/magnific-popup.css' %}" rel="stylesheet" type="text/css" media="all" />
	<style>
		body {
			overflow: hidden;
		}

		.clearfix:before,
		.clearfix:after {
			display: table;
			line-height: 0;
			content: ""
		}

		.clearfix:after {
			clear: both
		}

		.fl {
			float: left;
		}

		.fr {
			float: right;
		}

		.mfp-bottom-bar {
			color: #fff;
		}

		a {
			text-decoration: none !important;
		}

		.popup-gallery>div {
			float: left;
			width: 400px;
			overflow: hidden;
			text-align: center;
			position: relative;
			padding-bottom: 15px;
		}

		.imgParent:hover span {
			display: block;
		}

		.imgParent .delBtn {
			display: none;
			position: absolute;
			top: 10px;
			right: 58px;
			cursor: pointer;
			background: url(../static/img/delIcon.png);
			width: 25px;
			height: 25px;
			background-size: cover;
		}

		.content-body {
			margin-top: 20px;
		}

		.popupA img {
			width: 300px;
			height: 300px;
		}

		.imgParent a,
		.popupA p {
			color: #08c;
			padding: 10px;
		}

		/* 配置 */

		#lookDescribe {
			max-width: 700px;
		}

		.white-popup {
			position: relative;
			background: #FFF;
			padding: 20px;
			width: auto;
			max-width: 500px;
			margin: 20px auto;
		}

		.white-popup h1 {
			font-size: 20px;
			/* margin: 10px 0; */
			color: #006dcc;
			line-height: 15px;
		}

		.pupopTitle {
			width: 140px;
			text-align: right;
			vertical-align: middle;
			/* margin-top: 7px; */
			line-height: 30px;
		}

		.pupopBody input,
		.pupopBody select {
			height: 20px;
			padding: 4px 6px;
			margin-bottom: 10px;
			font-size: 14px;
			line-height: 20px;
			color: #4a4a4a;
			background: #fff;
			border: 1px solid #ccc;
			vertical-align: middle;
			width: 200px;
		}

		.pupopBody select {
			height: 30px;
			width: 215px;
			line-height: 30px;
			cursor: pointer;
			border: 1px solid #ccc;
		}

		.btnParent {
			text-align: center;
		}

		.btnParent input {
			color: #fff;
			text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
			background-color: #006dcc;
			width: 80px;
			height: 30px;
			border-radius: 3px;
			border: none;
			cursor: pointer;
			margin: 5px 17px;
		}

		.btnParent input:hover {
			color: #fff;
			background-color: #04c;
		}

		.nullData {
			width: 100%;
			height: 500px;
			background: #ddd;
			text-align: center;
			line-height: 500px;
			font-size: 20px;
			border: 1px solid #ddd;
		}

		#wormDetails {
			width: 100%;
			text-align: center;
			line-height: 30px;
		}

		table tr {
			border-bottom: 1px solid #e6e6e6;
			line-height: 40px;
		}

		table .option,
		table .optionName {
			width: 150px;
		}

		table input {
			width: 80%;
			text-align: center;
		}

		.saveBtn {
			display: none;
		}

		#addwormType,
		#delwormType {
			display: none;
		}

		#delwormType .pupopBody {
			width: 340px;
			font-size: 0;
		}

		#addwormType h2,
		#delwormType h2 {
			font-size: 16px;
			text-indent: 30px;
			color: #006dcc;
		}

		.my_protocol {
			line-height: 30px;
			display: inline-block;
			width: 169px;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}

		.my_protocol .input_agreement_protocol {
			appearance: none;
			-webkit-appearance: none;
			outline: none;
			display: none;
		}

		/*未选中时*/

		.my_protocol .input_agreement_protocol+span {
			cursor: pointer;
			width: 16px;
			height: 16px;
			background-color: red;
			display: inline-block;
			background: url(../static/img/checkboxBj.png) no-repeat;
			background-position-x: 0px;
			background-position-y: 0px;
			position: relative;
			top: 3px;
			margin-right: 3px;
		}

		/*选中checkbox时,修改背景图片的位置*/

		.my_protocol .input_agreement_protocol:checked+span {
			background-position: -19px 0px
		}
		/* 图片列表批量删除复选框样式 */
		.imgcheckbox input[type='checkbox']+span{
			cursor: pointer;
			width: 18px;
			height: 18px;
			background-color: red;
			display: inline-block;
			background: url(/static/img/tick.png) no-repeat center;
			background-position: -19px 0px;
			position: relative;
			top: 3px;
			border: 1px solid #bbb;
		}
		.imgcheckbox input[type='checkbox']:checked+span {
			background-position-x: 3px;
			background-position-y: 3px;
		}
		.imgcheckbox input{
			display: none;
		}
		.imgcheckbox{
			display: none;
			position: absolute;
			right: 19px;
			top: 0px;
		}
		.searchCover {
			margin: 20px 0;
		}
		.delbox{
			text-align: right;
		}
		.canceldelimgBtn{
			display: none;
		}
	</style>
</head>


<body>

	<div class="content">
		<div id="content-header">
			<h1 class="tb-fpsb" style="display: inline-block;">
				报表管理
			</h1>
			<span id="">
				> 诱捕器
			</span>
			<span>
				>
				<span class="kindName">{{equip_name}}</span>
			</span>
			<!-- 操作 -->
			<div class="searchCover delbox" style="float: right;">
				<button type="button" onclick="reload()" class="btn btn-sm btn-success">刷新</button>
				<button type="button" onclick="delimgAll(this)" class="btn btn-sm btn-primary batchesBtn">批量删除</button>
				<button type="button" onclick="canceldelimg(this)" id="canceldel" class="btn btn-sm canceldelimgBtn">取消</button>
			</div>
		</div>
		
		<!-- 图片列表 -->
		<div class="content-body" id="imgList">

		</div>
		<div class="fenpei-bottom">
			<input type="hidden" id="imei" value="{{imei}}">
			<input type="hidden" id="totalPage" value={{ nums }}>
			<div id="page" style="text-align: center;"></div>
		</div>
		
		<!-- 添加详情 -->
		<div id="test-popup" class="white-popup mfp-hide">
			<h1>添加详情</h1>
			<hr/>
			<form action="" id="pupopForm">
				<input type="hidden" value="" id="imgPath">
				<div class="pupopBox clearfix">
					<div class="fl pupopTitle">害虫名称：</div>
					<div class="fl pupopBody">
						<!-- <input type="text" value="" name="wormName"> -->
						<select name="wormName" id=""></select>
						<img src="{% static '/img/addicon.png' %}" id="addNameBtn" alt="" onclick="addNameBox()" title="添加害虫种类" width="28" style="margin-bottom: 10px;cursor: pointer;">
						<img src="{% static '/img/subtract.png' %}" id="delNameBtn" alt="" onclick="delNameBox()" title="删除害虫种类" width="28" style="margin-bottom: 10px;cursor: pointer;">
					</div>
				</div>
				<div class="pupopBox clearfix">
					<div class="fl pupopTitle">数量：</div>
					<div class="fl pupopBody">
						<input type="number" value="0" min="0" name="wormNum">
					</div>
				</div>
				<div class="pupopBox clearfix">
					<div class="fl pupopTitle">作物种类：</div>
					<div class="fl pupopBody">
						<input type="text" value="" placeholder="选填项" name="wormKind">
					</div>
				</div>
				<!-- <div class="pupopBox clearfix">
						<div class="fl pupopTitle">雌雄：</div>
						<div class="fl pupopBody">
							<select name="wormSex" id="">
								<option value="0">雌</option>
								<option value="1">雄</option>
							</select>
						</div>
					</div> -->
				<div class="pupopBox clearfix">
					<div class="fl pupopTitle">虫害阶段：</div>
					<div class="fl pupopBody">
						<input type="text" value="" placeholder="选填项" name="wormTime">
					</div>
				</div>
				<div class="btnParent">
					<input type="button" id='saveBtn' onclick="savePopWin()" value="保存">
					<input type="button" id='cancelBtn' onclick="closePopWin($(this))" value="取消">
				</div>
			</form>
			<!-- 添加害虫种类 -->
			<div id="addwormType">
				<h2>添加害虫种类</h2>
				<form action="" class="">
					<div class="pupopBox clearfix">
						<div class="fl pupopTitle">害虫名称：</div>
						<div class="fl pupopBody">
							<input type="text" maxlength="20" value="" name="wormTypeSelect">
							<!-- <img src="{% static '/img/addicon.png' %}" alt="" onclick="goBackAddDetial()" title="返回添加" width="28"> -->
						</div>
					</div>
					<div class="btnParent">
						<input type="button" id='saveBtn' onclick="saveWormType()" value="保存">
						<input type="button" id='cancelBtn' onclick="goBackAddDetial()" value="取消">
					</div>
				</form>
			</div>
			<!-- 删除害虫种类 -->
			<div id="delwormType">
				<h2>删除害虫种类</h2>
				<form action="" class="">
					<div class="pupopBox clearfix">
						<div class="fl pupopTitle">害虫名称：</div>
						<div class="fl pupopBody"></div>
					</div>
					<div class="btnParent">
						<input type="button" id='saveBtn' onclick="saveDelWormType()" value="确定">
						<input type="button" id='cancelBtn' onclick="goBackAddDetial()" value="取消">
					</div>
				</form>
			</div>
		</div>
		<!-- 查看描述 -->
		<div id="lookDescribe" class="white-popup mfp-hide">
			<h1>虫害详情</h1>
			<hr>
			<form action="">
				<input type="hidden" value="" id="imgPath_dteial">
				<table id="wormDetails">
					<tr>
						<th>害虫名称</th>
						<th>数量</th>
						<th>作物种类</th>
						<th>虫害阶段</th>
						<th>操作</th>
					</tr>
					<!-- <tr>
						<td class="option">大蛾子</td>
						<td class="option">12</td>
						<td class="option">花生地</td>
						<td class="option">大</td>
						<td>
							<button type="button" class="btn editBtn btn-primary" onclick="edit($(this))">编辑</button>
							<button type="button" class="btn saveBtn btn-success" onclick="save($(this))">保存</button>
							<button type="button" class="btn delBtn btn-danger">删除</button>
						</td>
					</tr> -->
				</table>
			</form>

		</div>
		<!-- 添加病虫种类 -->
		<!-- <div id="addwormType" class="white-popup mfp-hide">
			<h1>害虫种类</h1>
			<form action="" class="">
				<div class="pupopBox clearfix">
					<div class="fl pupopTitle">病虫名称：</div>
					<div class="fl pupopBody">
						<input type="text" value="" name="wormTypeSelect">
					</div>
				</div>
				<div class="btnParent">
					<input type="button" id='saveBtn' onclick="saveWormType()" value="保存">
					<input type="button" id='cancelBtn' onclick="closePopWin($(this))" value="取消">
				</div>
			</form>
		</div> -->
	</div>


	<script src="{% static '/lib/js/jquery-2.1.4.min.js' %}"></script>
	<script src="{% static '/lib/layui/layui.all.js' %}"></script>
	<script type="text/javascript">
		$.ajaxSetup({
			data: { csrfmiddlewaretoken: '{{ csrf_token }}' },
		});
	</script>
	<script src="{% static '/js/reportmanage/ybq_image.js' %}?versions=0.5.0"></script>
	<script>
		//点击修改名称，跳出弹框并显示所选设备的设备名称；
		// function addwormType(obj) {
		// 	layui.use('layer', function () { //独立版的layer无需执行这一句
		// 		var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
		// 		layer.prompt({ title: '添加病虫种类', area: 400 }, function (val, index) {
		// 			layer.close(index);
		// 			// ChangeNameSub(deviceId, oldDevicename, val);
		// 		});
		// 	});
		// }


		// 查看详情  编辑
		var initial = [];
		function edit(obj) {
			if ($('#wormDetails .saveBtn.current').length == 1) {
				layer.msg('正在编辑中');
			} else {
				initial = [];
				obj.hide().next().show();
				var parent = obj.parents('tr');
				var option = parent.find('.option');
				option.each(function () {
					var txt = $(this).html();
					initial.push(txt);
					var html = '<input type="text" value="' + txt + '">';
					$(this).html(html);
				})
			}
			$('#wormDetails .saveBtn').removeClass('current');
			obj.next().addClass('current');
			console.log('旧的', initial)
		}
		//查看详情 保存
		function save(obj) {
			obj.hide().prev().show();
			var parent = obj.parents('tr');
			var option = parent.find('.option');
			var wormName = parent.find('.optionName').html();
			var dataarr = [];
			var addr = $('#imgPath').val();
			option.each(function () {
				var txt = $(this).find('input').val();
				// var html = txt;
				dataarr[$(this).index()] = txt
				// $(this).html(html);
			})
			var data = {
				'pest_name': wormName,
				'pest_num': dataarr[1],
				'crop_name': dataarr[2],
				'pest_case': dataarr[3]
			}

			$('#wormDetails .saveBtn').removeClass('current');
			console.log(data);
			var addr = $('#imgPath_dteial').val();
			$.ajax({
				url: 'cbd_describe_img',
				type: 'post',

				data: { req: 'change_save', addr: addr, describe: JSON.stringify(data) },
				success: function (data) {
					if (data == 0) {
						//成功
						option.each(function () {
							var txt = $(this).find('input').val();
							var html = txt;
							// dataarr[$(this).index()] = txt
							$(this).html(html);
						})
					} else {
						//失败
						option.each(function () {
							var txt = $(this).find('input').val();
							var html = txt;
							// dataarr[$(this).index()] = txt
							$(this).html(initial[$(this).index() - 1]);
						})
						layer.msg('编辑失败');
					}

				}
			})
		}
		//  删除
		function delItemDetial(obj) {
			var parent = obj.parents('tr');
			var wormName = parent.find('.optionName').html();
			var data = {'pest_name': wormName};
			var addr = $('#imgPath_dteial').val();
			$.ajax({
				url: 'cbd_describe_img',
				type: 'post',
				data: { req:'del_desc',addr:addr,describe: JSON.stringify(data) },
				success: function (data) {
					if (data == 0) {
						//成功
						parent.remove();
						if($('#wormDetails tr').length < 2){
							var html = '<tr><td class="nullData" colspan="5">暂无数据</td></tr>'
                            $("#wormDetails  tr:not(:first)").remove();
                            $('#wormDetails').append(html);
						}
					} else {
						//失败
						layer.msg('删除失败');
					}
				}
			})
		}

		function saveWormType() {
			var wormTypeSelect = $('#addwormType').find('input[name="wormTypeSelect"]').val();
			if (wormTypeSelect) {
				$.ajax({
					url: 'cbd_describe_img',
					type: 'get',
					data: { req: "add_pest", pest: wormTypeSelect },
					success: function (data) {
						if (data == 2) {
							layer.msg('创建名称失败');
						} else if (data == 1) {
							layer.msg('名称已存在');
						} else {
							layer.msg('创建名称成功');
							setTimeout(function () {
								//模拟数据
								var msg = $.parseJSON(data);
								// var da = [{ "pest_name": "\u641c\u7d22" }, { "pest_name": "\u5927\u86fe\u5b50" }, { "pest_name": "\u5927\u86fe\u5b50" }, { "pest_name": "\u5927\u86fe\u5b50" }, { "pest_name": "\u5927\u86fe\u5b50" }];
								$('#pupopForm select[name="wormName"]').empty();
								for (var i = 0; i < msg.length; i++) {
									var html = "<option value='" + msg[i].pest_name + "'>" + msg[i].pest_name + "</option>"
									$('#pupopForm select[name="wormName"]').append(html);
								}
								goBackAddDetial();

							}, 500)

						}

					}
				})
			} else {
				layer.msg('请填写害虫名称');
			}

		}

		function saveDelWormType() {
			var nameData = [];
			$("#delwormType input[type='checkbox']:checked").each(function () {
				nameData.push($(this).val());
			})
			if (nameData.length) {
				$.ajax({
					url: 'cbd_describe_img',
					type: 'get',
					data: { req: "del_pest", pest: JSON.stringify(nameData) },
					success: function (data) {
						var msg = $.parseJSON(data);
						$('#pupopForm select[name="wormName"]').empty();
						for (var i = 0; i < msg.length; i++) {
							var html = "<option value='" + msg[i].pest_name + "'>" + msg[i].pest_name + "</option>"
							$('#pupopForm select[name="wormName"]').append(html);
						};
						goBackAddDetial()
					}
				})
			} else {
				layer.msg('请至少选择一项');
			}

		}

		//添加名称显示框
		function addNameBox() {
			$('#addwormType').show();
			$('#addwormType').prev().hide();
			$('#addwormType').next().hide();
		}
		function delNameBox() {
			$('#addwormType').hide();
			$('#addwormType').prev().hide();
			$('#addwormType').next().show();
			var newPestName = [];
			$('#pupopForm option').each(function () {
				newPestName.push($(this).html());
			})
			$('#delwormType .pupopBody').empty();
			for (var i = 0; i < newPestName.length; i++) {
				var pestName = '<label class="my_protocol">' +
					'<input class="input_agreement_protocol" value="' + newPestName[i] + '" type="checkbox">' +
					'<span></span>' + newPestName[i] + '</label>';
				$('#delwormType .pupopBody').append(pestName);
			}

		}
		//返回添加详情
		function goBackAddDetial() {
			$('#addwormType').hide();
			$('#addwormType').next().hide();
			$('#addwormType').prev().show();
			$('#addwormType').find('form')[0].reset();
			$('#delwormType').find('form')[0].reset();
			if ($('#pupopForm option').length >= 8) {
				$('#addNameBtn').hide();
			} else {
				$('#addNameBtn').show();
			}
			if ($('#pupopForm option').length <= 0) {
				$('#delNameBtn').hide();
			} else {
				$('#delNameBtn').show();
			}
		}
	</script>
</body>

</html>
{% endblock headcss %}