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

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

<c:set var="reloadCode" value="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>

<c:url var="editUrl" value="/user/plugin/getolt/manage.do">
	<c:param name="method" value="oltGet"/>
	<c:param name="returnUrl" value="${form.requestUrl}"/>
</c:url>

<%-- Determine which filters are visible --%>
<c:set var="showFilters" value="${frd.showFilters}"/>

<%-- Build valuesHtml for filter selector --%>
<c:set var="filterSelectorHtml">
	<li><input type="checkbox" name="showFilter" value="billing" ${showFilters.contains('billing') ? 'checked' : ''}/> <span>Биллинг</span></li>
	<li><input type="checkbox" name="showFilter" value="status" ${showFilters.contains('status') ? 'checked' : ''}/> <span>Статус</span></li>
	<li><input type="checkbox" name="showFilter" value="vendor" ${showFilters.contains('vendor') ? 'checked' : ''}/> <span>Vendor</span></li>
	<li><input type="checkbox" name="showFilter" value="search" ${showFilters.contains('search') ? 'checked' : ''}/> <span>Поиск</span></li>
</c:set>

<%-- Build valuesHtml for combo-check filters --%>
<c:set var="billingValuesHtml">
	<c:forEach var="b" items="${frd.allBillings}">
		<li><input type="checkbox" name="billing" value="${b}" ${frd.selectedBillings.contains(b) ? 'checked' : ''}/> <span>${b}</span></li>
	</c:forEach>
</c:set>
<c:set var="statusValuesHtml">
	<c:forEach var="s" items="${frd.allStatuses}">
		<li><input type="checkbox" name="status" value="${s}" ${frd.selectedStatuses.contains(s) ? 'checked' : ''}/> <span>${s}</span></li>
	</c:forEach>
</c:set>
<c:set var="vendorValuesHtml">
	<c:forEach var="v" items="${frd.allVendors}">
		<li><input type="checkbox" name="vendor" value="${v}" ${frd.selectedVendors.contains(v) ? 'checked' : ''}/> <span>${v}</span></li>
	</c:forEach>
</c:set>

<html:form action="/user/plugin/getolt/manage" styleId="${uiid}" styleClass="in-mr1 in-mb1" style="display: flex; align-items: center;">
	<input type="hidden" name="method" value="unspecified"/>

	<ui:button type="out" onclick="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>
	<ui:button type="add" onclick="$$.ajax.load('${editUrl}&id=-1', $('#${uiid}').parent())"/>
	<button type="button" class="btn-white ml1 getolt-poll-btn" title="Опросить OLT"
		data-eligible-count="${frd.eligibleCount}"
		onclick="$$.getolt.pollAll(this, '${uiid}')">&#8635; Обновить все</button>

	<ui:combo-check name="showFilter" valuesHtml="${filterSelectorHtml}"
		prefixText="Фильтры:" widthTextValue="12em"
		onChange="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>

	<c:if test="${showFilters.contains('billing')}">
		<ui:combo-check name="billing" valuesHtml="${billingValuesHtml}"
			prefixText="Биллинг:" widthTextValue="10em"
			onChange="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>
	</c:if>

	<c:if test="${showFilters.contains('status')}">
		<ui:combo-check name="status" valuesHtml="${statusValuesHtml}"
			prefixText="Статус:" widthTextValue="10em"
			onChange="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>
	</c:if>

	<c:if test="${showFilters.contains('vendor')}">
		<ui:combo-check name="vendor" valuesHtml="${vendorValuesHtml}"
			prefixText="Vendor:" widthTextValue="10em"
			onChange="$$.ajax.load($('#${uiid}'), $('#${uiid}').parent())"/>
	</c:if>

	<c:if test="${showFilters.contains('search')}">
		<input type="text" name="search" value="<c:out value="${frd.search}"/>" placeholder="MAC / договор / ФИО / адрес"
			style="width: 16em; margin-left: 0.5em;"
			oninput="clearTimeout(this._t); var inp=this, uid='${uiid}'; this._t=setTimeout(function(){ if(inp.value.length==0 || inp.value.length>=4) $$.ajax.load($('#'+uid), $('#'+uid).parent()); }, 400)"/>
	</c:if>

	<button type="button" class="btn-white ml1" title="Импорт списка OLT из биллинга"
		style="margin-left: auto;"
		onclick="$$.getolt.importFromApi(this, '${uiid}')">Импорт из биллинга</button>
</html:form>

<table class="data mt1">
	<tr>
		<td width="20"><input type="checkbox" class="getolt-check-all" title="Выбрать все"
			onchange="$$.getolt.toggleCheckAll(this, '${uiid}')"/></td>
		<td width="30">&#160;</td>
		<td width="30">ID</td>
		<td>IP</td>
		<td>Vendor</td>
		<td>Биллинг</td>
		<td>Порты</td>
		<td>ONU</td>
		<td>Статус</td>
		<td>Обновлено</td>
	</tr>
	<c:forEach var="item" items="${frd.olts}">
		<c:set var="counts" value="${frd.onuCounts[item.id]}"/>
		<tr>
			<td><input type="checkbox" class="getolt-check-olt" value="${item.id}"
				onchange="$$.getolt.updatePollBtn('${uiid}')"
				${item.status == 'UPDATING' ? 'disabled="disabled"' : ''}/></td>
			<td nowrap="nowrap">
				<c:set var="isUpdating" value="${item.status == 'UPDATING'}"/>
				<ui:button type="edit" styleClass="btn-small"
					onclick="$$.ajax.load('${editUrl}&id=${item.id}', $('#${uiid}').parent())"/>
				<c:url var="delUrl" value="/user/plugin/getolt/manage.do">
					<c:param name="method" value="oltDelete"/>
					<c:param name="id" value="${item.id}"/>
				</c:url>
				<ui:button type="del" styleClass="btn-small"
					onclick="$$.ajax.post('${delUrl}').done(() => { ${reloadCode} })"/>
				<button type="button" class="btn-white btn-small" title="${isUpdating ? 'Идёт опрос...' : 'Опросить'}"
					onclick="$$.getolt.pollOlt(${item.id}, this)"
					${isUpdating ? 'disabled="disabled"' : ''}>&#8635;</button>
				<button type="button" class="btn-white btn-small" title="Порты"
					onclick="$$.getolt.togglePorts(${item.id}, this)">&#9660;</button>
			</td>
			<td>${item.id}</td>
			<td>${item.ip}</td>
			<td>${item.vendor}</td>
			<td>${item.billing}</td>
			<td>${item.portCount}</td>
			<td>
				<c:if test="${not empty counts}">
					${counts[0]}/${counts[1]}
				</c:if>
				<c:if test="${empty counts}">-</c:if>
			</td>
			<td>
				<c:choose>
					<c:when test="${item.status == 'OK'}"><span class="getolt-status-ok">OK</span></c:when>
					<c:when test="${item.status == 'UPDATING'}"><span class="getolt-status-updating">UPDATING</span></c:when>
					<c:when test="${item.status == 'ERROR' || item.status == 'CONN_ERR' || item.status == 'AUTH_FAIL' || item.status == 'TIMEOUT'}"><span class="getolt-status-error">${item.status}</span></c:when>
					<c:when test="${item.status == 'NEW'}"><span class="getolt-status-new">NEW</span></c:when>
					<c:otherwise><c:out value="${item.status}"/></c:otherwise>
				</c:choose>
			</td>
			<td nowrap="nowrap">
				<c:if test="${not empty item.lastUpdate}">${tu.format(item.lastUpdate, 'ymdhm')}</c:if>
				<c:if test="${empty item.lastUpdate}">-</c:if>
			</td>
		</tr>
		<tr class="getolt-ports-row" id="getolt-ports-${item.id}" style="display:none">
			<td colspan="10" class="getolt-ports-container"></td>
		</tr>
	</c:forEach>
</table>

<shell:title text="Управление OLT — ${frd.totalOlt} OLT, ${frd.totalActiveOnu}/${frd.totalOnu} ONU"/>
