{% extends '../_layouts/_main.twig' %}
{% set selectBrandStatus = [
	"0. Необработан. Новый необработанный бренд (default value in db); спрятан везде.",
	"1. Спрятать везде. Бренд обработан.",
	"2. По урлу. Не показывать в списке, но по урлу показать в каталоге выбор моделей к этому бренду.",
	"3. Под катом. Показывать бренд в списке под катом.",
	"4. Первичный. Показывать бренд в первичном списке.",
	"5. Шорт-лист. Показывать бренд в шорт-листе."
] %}
{% set selectBrandLogo = [
	"null",
	"letter",
	"real",
	"semireal"
] %}
{% block content %}
	<div class="panel panel-tabs">
		<div class="panel-body">

			<div class="cp-brands">
				<h1>Бренды в каталоге</h1>
				<div class="cp-brands__head">
					<form class="cp-brands__form" action="" method="get">
						<p>
							<strong>Необработано брендов: 50 <a href="#">показать</a></strong>
						</p>
						<div class="flex-row row-16 align-items-end">
							<div class="mb-8 flex-col-12 flex-col-sm">
								<div class="form-group">
									<div class="form-label">Тип техники</div>
									<div class="form-field">
										<select class="form-control selectpicker dropdown-min-w-250" name="type" title="Все" multiple data-container="body" data-selected-text-format="count > 2">
											<option value="1">Passenger car</option>
											<option value="2">Motorcycle</option>
											<option value="3">Truck</option>
											<option value="4">Special</option>
											<option value="5">Trailer</option>
											<option value="6">Bus</option>
										</select>
									</div>
								</div>
							</div>
							<div class="mb-8 flex-col-12 flex-col-sm">
								<div class="form-group">
									<div class="form-label">Статус</div>
									<div class="form-field">
										<select class="form-control selectpicker dropdown-min-w-250" name="status" title="Все" multiple data-container="body" data-selected-text-format="count > 2">
											<option value="0">0. Необработан</option>
											<option value="1">1. Спрятать везде</option>
											<option value="2">2. По урлу</option>
											<option value="3">3. Под катом</option>
											<option value="4">4. Первичный</option>
											<option value="5">5. Шорт-лист</option>
										</select>
									</div>
								</div>
							</div>
							<div class="mb-8 flex-col-auto ml-auto">
								<button class="btn btn-primary">Показать</button>
							</div>
						</div>
					</form>
					<div class="cp-brands__info">
						<ul class="info-list">
							<li><span>0.</span>Необработан. Новый необработанный бренд (default value in db); спрятан везде.</li>
							<li><span>1.</span>Спрятать везде. Бренд обработан.</li>
							<li><span>2.</span>По урлу. Не показывать в списке, но по урлу показать в каталоге выбор моделей к этому бренду</li>
						</ul>
						<ul class="info-list">
							<li><span>3.</span>Под катом. Показывать бренд в списке под катом.</li>
							<li><span>4.</span>Первичный. Показывать бренд в первичном списке</li>
							<li><span>5.</span>Шорт-лист. Показывать бренд в шорт-листе</li>
						</ul>
					</div>
				</div>
				<div class="cp-brands__table">
					{% set brandsTable = [
						{
							"id" : 43,
							"brand_name" : "Volkswagen",
							"is_passenger_car" : 1,
							"is_motorcycle" : 2,
							"is_truck" : 3,
							"is_special" : 0,
							"is_trailer" : 0,
							"is_bus" : 0,
							"passenger_car_models_cnt" : 300,
							"motorcycles_models_cnt" : 300,
							"truck_models_cnt" : 300,
							"special_models_cnt" : 300,
							"trailer_models_cnt" : 300,
							"bus_models_cnt" : 300,
							"logo" : "real",
							"logo_revision_date" : "12.01.2022",
							"brand_total_products" : 3092500,
							"car_active_products" : 3572836,
							"pop_views" : 1000,
							"pop_sold" : 1000
						},{
							"id" : 44,
							"brand_name" : "Toyota",
							"is_passenger_car" : 3,
							"is_motorcycle" : 1,
							"is_truck" : 1,
							"is_special" : 0,
							"is_trailer" : 0,
							"is_bus" : 0,
							"passenger_car_models_cnt" : 300,
							"motorcycles_models_cnt" : 300,
							"truck_models_cnt" : 300,
							"special_models_cnt" : 300,
							"trailer_models_cnt" : 300,
							"bus_models_cnt" : 300,
							"logo" : "real",
							"logo_revision_date" : "12.01.2022",
							"brand_total_products" : 3092500,
							"car_active_products" : 3572836,
							"pop_views" : 1000,
							"pop_sold" : 1000
						},{
							"id" : 45,
							"brand_name" : "Renault",
							"is_passenger_car" : 1,
							"is_motorcycle" : 0,
							"is_truck" : 1,
							"is_special" : 3,
							"is_trailer" : 0,
							"is_bus" : 0,
							"passenger_car_models_cnt" : 300,
							"motorcycles_models_cnt" : 300,
							"truck_models_cnt" : 300,
							"special_models_cnt" : 300,
							"trailer_models_cnt" : 300,
							"bus_models_cnt" : 300,
							"logo" : "semireal",
							"logo_revision_date" : "12.01.2022",
							"brand_total_products" : 3092500,
							"car_active_products" : 3572836,
							"pop_views" : 1000,
							"pop_sold" : 1000
						},{
							"id" : 46,
							"brand_name" : "Mercedes-Benz",
							"is_passenger_car" : 1,
							"is_motorcycle" : 0,
							"is_truck" : 2,
							"is_special" : 5,
							"is_trailer" : 0,
							"is_bus" : 0,
							"passenger_car_models_cnt" : 300,
							"motorcycles_models_cnt" : 300,
							"truck_models_cnt" : 300,
							"special_models_cnt" : 300,
							"trailer_models_cnt" : 300,
							"bus_models_cnt" : 300,
							"logo" : "real",
							"logo_revision_date" : "12.01.2022",
							"brand_total_products" : 3092500,
							"car_active_products" : 3572836,
							"pop_views" : 1000,
							"pop_sold" : 1000
						}
					] %}
					<div class="scroller-x">
						<div class="sticky-header fixed" data-offset="40">
							<div class="sticky-header__head">
								<table class="table table-no-highlight">
									<thead class="thead-dark">
									<tr>
										<th><span class="js-table-sort asc">id <i class="js-table-sort-arr"></i></span></th>
										<th><span class="js-table-sort">brand name <i class="js-table-sort-arr"></i></span></th>
										<th>Обработать</th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is passenger car <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is motorcycle <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is truck <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is special <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is trailer <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is bus <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">passenger car models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">motorcycles models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">truck models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">special models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">trailer models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">bus models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort"><span class="text-nowrap">logo <i class="fa fa-info-circle" data-toggle="tooltip" data-html="true" title="<strong>null</strong> — лого отсутствует<br /><strong>letter</strong> — буква вместо лого<br /><strong>real</strong> — реальный логотип<br /><strong>semireal</strong> — реальный, но изменён"></i></span> <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">logo revision date <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffcc80;"><span class="js-table-sort">brand total products <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">car active products <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">pop views <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">pop sold <i class="js-table-sort-arr"></i></span></th>
									</tr>
									</thead>
								</table>
							</div>
							<div class="sticky-header__body">
								<table class="table table-no-highlight sticky-header__sizer">
									<thead class="thead-dark">
									<tr>
										<th><span class="js-table-sort asc">id <i class="js-table-sort-arr"></i></span></th>
										<th><span class="js-table-sort">brand name <i class="js-table-sort-arr"></i></span></th>
										<th>Обработать</th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is passenger car <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is motorcycle <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is truck <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is special <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is trailer <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #f2e5f5;"><span class="js-table-sort">is bus <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">passenger car models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">motorcycles models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">truck models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">special models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">trailer models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffefc1;"><span class="js-table-sort">bus models cnt <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort"><span class="text-nowrap">logo <i class="fa fa-info-circle" data-toggle="tooltip" data-html="true" title="<strong>null</strong> — лого отсутствует<br /><strong>letter</strong> — буква вместо лого<br /><strong>real</strong> — реальный логотип<br /><strong>semireal</strong> — реальный, но изменён"></i></span> <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">logo revision date <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right" style="background: #ffcc80;"><span class="js-table-sort">brand total products <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">car active products <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">pop views <i class="js-table-sort-arr"></i></span></th>
										<th class="text-right"><span class="js-table-sort">pop sold <i class="js-table-sort-arr"></i></span></th>
									</tr>
									</thead>
									<tbody>
									{% for row in brandsTable %}
										<tr>
											<td data-sort="{{ row.id }}">{{ row.id }}<input class="form-control" type="hidden" name="id" value="{{ row.id }}"></td>
											<td data-sort="{{ row.brand_name }}">{{ row.brand_name }}</td>
											<td>
												<div class="td_data"><a href="#" class="--cp-brand-toggle">Обработать</a></div>
												<div class="td_form">
													<button class="btn btn-sm btn-danger --cp-brand-toggle"><i class="fa fa-times"></i></button>
													<button class="btn btn-sm btn-success --cp-brand-save">Сохранить</button>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_passenger_car }}" data-sort="{{ row.is_passenger_car }}">
												<div class="td_data">{{ row.is_passenger_car }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_passenger_car">
													{% for option in selectBrandStatus %}
														<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_passenger_car %} selected{% endif %}>{{ option }}</option>
													{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_motorcycle }}" data-sort="{{ row.is_motorcycle }}">
												<div class="td_data">{{ row.is_motorcycle }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_motorcycle">
													{% for option in selectBrandStatus %}
														<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_motorcycle %} selected{% endif %}>{{ option }}</option>
													{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_truck }}" data-sort="{{ row.is_truck }}">
												<div class="td_data">{{ row.is_truck }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_truck">
													{% for option in selectBrandStatus %}
														<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_truck %} selected{% endif %}>{{ option }}</option>
													{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_special }}" data-sort="{{ row.is_special }}">
												<div class="td_data">{{ row.is_special }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_special">
													{% for option in selectBrandStatus %}
														<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_special %} selected{% endif %}>{{ option }}</option>
													{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_trailer }}" data-sort="{{ row.is_trailer }}">
												<div class="td_data">{{ row.is_trailer }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_trailer">
														{% for option in selectBrandStatus %}
															<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_trailer %} selected{% endif %}>{{ option }}</option>
														{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right bg-success-{{ row.is_bus }}" data-sort="{{ row.is_bus }}">
												<div class="td_data">{{ row.is_bus }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="is_bus">
														{% for option in selectBrandStatus %}
															<option value="{{ loop.index0 }}"{% if loop.index0 == row.is_bus %} selected{% endif %}>{{ option }}</option>
														{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right" data-sort="{{ row.passenger_car_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.passenger_car_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.motorcycles_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.motorcycles_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.truck_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.truck_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.special_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.special_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.trailer_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.trailer_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.bus_models_cnt }}">
												<a href="/catalog/brand" target="_blank">{{ row.bus_models_cnt }}</a>
											</td>
											<td class="text-right" data-sort="{{ row.logo }}">
												<div class="td_data">{{ row.logo }}</div>
												<div class="td_form">
													<select class="form-control input-sm" name="logo">
														{% for option in selectBrandLogo %}
															<option value="{{ option }}"{% if loop.index0 == row.logo %} selected{% endif %}>{{ option }}</option>
														{% endfor %}
													</select>
												</div>
											</td>
											<td class="text-right" data-sort="{{ row.logo_revision_date }}">
												<div class="td_data">{{ row.logo_revision_date }}</div>
												<div class="td_form">
													<div class="form-group">
														<div class="form-field">
															<div class="form-field__icon js-datepicker-ico"><i class="fa fa-calendar fs-14 color-gray"></i></div>
															<input class="form-control input-sm datepicker" name="date" type="text" value="{{ request.dateFrom|date('d.m.Y') }}" data-datepicker-options="singleDatePicker: true; format: D.MM.Y; autoclose: true; autoApply: true;" />
														</div>
													</div>
												</div>
											</td>
											<td class="text-right" data-sort="{{ row.brand_total_products }}">{{ row.brand_total_products }}</td>
											<td class="text-right" data-sort="{{ row.car_active_products }}">{{ row.car_active_products }}</td>
											<td class="text-right" data-sort="{{ row.pop_views }}">{{ row.pop_views }}</td>
											<td class="text-right" data-sort="{{ row.pop_sold }}">{{ row.pop_sold }}</td>
										</tr>
									{% endfor %}
									</tbody>
								</table>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>
	</div>
{% endblock %}