<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="/WEB-INF/jspf/taglibs.jsp"%>

<c:set var="uiid" value="${u:uiid()}"/>
<c:set var="formUiid" value="${u:uiid()}"/>
<c:set var="tableUiid" value="${u:uiid()}"/>

<div id="${uiid}">
	<h3 class="mb1">${l.l('Загрузка остатков из файла')}</h3>

	<div id="step1-${uiid}">
		<p class="hint">
			CSV, ${l.l('заголовок обязателен')}: product_id,product_name,quantity
		</p>
		<p class="hint">
			<b>${l.l('Важно')}:</b> ${l.l('Количество — это ИТОГОВЫЙ остаток на складе по данным файла, а не добавка к тому, что уже есть в ERP. После проведения остаток в ERP будет ЗАМЕНЁН на число из файла (не сложен с текущим).')}
		</p>

		<form id="${formUiid}" method="POST" action="/admin/plugin/sync1c/instance.do" enctype="multipart/form-data">
			<input type="hidden" name="method" value="importFilePreview"/>
			<table class="data mb1">
				<c:choose>
					<c:when test="${frd.instanceList.size() == 1}">
						<input type="hidden" name="instanceId" value="${frd.instanceList[0].id}"/>
					</c:when>
					<c:otherwise>
						<tr>
							<td class="label">${l.l('Инстанция')} *</td>
							<td>
								<ui:combo-single name="instanceId" widthTextValue="20em" value="">
									<jsp:attribute name="valuesHtml">
										<li value=""></li>
										<c:forEach var="inst" items="${frd.instanceList}">
											<li value="${inst.id}">${inst.title}</li>
										</c:forEach>
									</jsp:attribute>
								</ui:combo-single>
							</td>
						</tr>
					</c:otherwise>
				</c:choose>
				<tr>
					<td class="label">${l.l('Склад')} *</td>
					<td>
						<ui:combo-single name="storeId" widthTextValue="20em" showFilter="true"
							value="${frd.storeId > 0 ? frd.storeId : ''}">
							<jsp:attribute name="valuesHtml">
								<li value=""></li>
								<c:forEach var="s" items="${frd.storeList}">
									<li value="${s.id}">${s.title}</li>
								</c:forEach>
							</jsp:attribute>
						</ui:combo-single>
					</td>
				</tr>
				<tr>
					<td class="label">${l.l('Файл')} *</td>
					<td><input type="file" name="file" accept=".csv,text/csv"/></td>
				</tr>
			</table>
		</form>

		<button type="button" class="btn-green" onclick="inv1cParse${uiid}()">${l.l('Разобрать файл')}</button>
	</div>

	<div id="step2-${uiid}" style="display:none;">
		<h4 class="mb1">${l.l('Предпросмотр')}</h4>
		<table class="data hl" id="${tableUiid}">
			<tr>
				<td>&#160;</td>
				<td>Product ID</td>
				<td width="100%">${l.l('Наименование')}</td>
				<td>${l.l('Количество')}</td>
			</tr>
		</table>
		<div class="mt1">
			<button type="button" class="btn-green" id="confirmBtn-${uiid}">${l.l('Подтвердить')}</button>
			<button type="button" class="btn-white ml1" onclick="
				document.getElementById('step2-${uiid}').style.display = 'none';
				document.getElementById('step1-${uiid}').style.display = '';
			">${l.l('Назад')}</button>
		</div>
	</div>
</div>

<script>
	var inv1cRows${uiid} = [];
	var inv1cUserTier${uiid} = ${frd.userTier ? 'true' : 'false'};

	function inv1cParse${uiid}() {
		var form = document.getElementById('${formUiid}');
		var instanceId = $(form).find('[name=instanceId]').val();
		var storeId = $(form).find('[name=storeId]').val();
		var file = form.querySelector('input[type=file]').files[0];
		if (!instanceId) { alert('${l.l('Выберите инстанцию')}'); return; }
		if (!storeId) { alert('${l.l('Выберите склад')}'); return; }
		if (!file) { alert('${l.l('Выберите файл')}'); return; }

		$$.ajax.fileSend(form, file).done(function (r) {
			if (r.data.error) { alert(r.data.error); return; }
			inv1cRows${uiid} = r.data.rows;
			inv1cRenderPreview${uiid}(instanceId, storeId);
		});
	}

	function inv1cRenderPreview${uiid}(instanceId, storeId) {
		var $table = $('#${tableUiid}');
		$table.find('tr.data-row').remove();

		inv1cRows${uiid}.forEach(function (row, i) {
			var title = row.existingItemTitle
				? $('<span/>').text(row.existingItemTitle).html()
				: '<i>${l.l('новая позиция')}: ' + $('<span/>').text(row.productName).html() + '</i>';
			var $tr = $(
				'<tr class="data-row">' +
					'<td><input type="checkbox" checked/></td>' +
					'<td>' + $('<span/>').text(row.productId).html() + '</td>' +
					'<td>' + title + '</td>' +
					'<td><input type="text" size="8" value="' + row.quantity + '"/></td>' +
				'</tr>'
			);
			$tr.data('idx', i);
			$table.append($tr);
		});

		document.getElementById('step1-${uiid}').style.display = 'none';
		document.getElementById('step2-${uiid}').style.display = '';

		$('#confirmBtn-${uiid}').off('click').on('click', function () {
			var $btn = $(this);
			var selected = [];
			var invalid = [];
			$table.find('tr.data-row').each(function () {
				var $tr = $(this);
				if (!$tr.find('input[type=checkbox]').prop('checked')) return;
				var row = inv1cRows${uiid}[$tr.data('idx')];
				var qtyStr = $.trim($tr.find('input[type=text]').val()).replace(',', '.');
				if (!/^\d+(\.\d+)?$/.test(qtyStr) || parseFloat(qtyStr) <= 0) {
					invalid.push(row.productName || row.productId);
					return;
				}
				selected.push({ product_id: row.productId, product_name: row.productName, stocks: parseFloat(qtyStr) });
			});
			if (invalid.length > 0) {
				alert('${l.l('Некорректное количество')}: ' + invalid.join(', '));
				return;
			}
			if (selected.length === 0) { alert('${l.l('Нет выбранных позиций')}'); return; }

			$btn.prop('disabled', true);
			var url = '/admin/plugin/sync1c/instance.do?method=importFileConfirm'
				+ '&instanceId=' + encodeURIComponent(instanceId)
				+ '&storeId=' + encodeURIComponent(storeId)
				+ '&rowsJson=' + encodeURIComponent(JSON.stringify(selected));
			$$.ajax.post(url).done(function (r) {
				if (r.data.error) { alert(r.data.error); $btn.prop('disabled', false); return; }
				$$.shell.message.show('${l.l('Готово')}',
					r.data.synced + ' ${l.l('Позиций синхронизировано')}. ${l.l('Переход к Ожидающим поступлениям')}...');
				if (inv1cUserTier${uiid})
					$$.ajax.loadContent('/user/plugin/inventory/import_pending.do');
				else
					$$.ajax.loadContent('/admin/plugin/sync1c/instance.do?method=importPending&instanceId=' + r.data.instanceId);
			});
		});
	}
</script>
