{% extends '../_layouts/_main.twig' %}
{% block content %}
	<div class="panel panel-tabs">
		<div class="panel-body">

			<div class="cp-serviceQuality">
				<h1>Качество обслуживания</h1>

				<div class="cp-serviceQuality-link">
					<a href="#" class="btn btn-primary"><i class="fa fa-link"></i> Сгенерировать ссылку Клиенту</a>
					<div class="result">
						<i class="closer size_16"></i>
						<ul class="result__lang">
							<li><a href="#lang-ee" class="lang__link" data-toggle="tab">EE</a></li>
							<li class="active"><a href="#lang-ru" class="lang__link" data-toggle="tab">RU</a></li>
							<li><a href="#lang-fi" class="lang__link" data-toggle="tab">FI</a></li>
							<li><a href="#lang-en" class="lang__link" data-toggle="tab">EN</a></li>
						</ul>
						<div class="tab-content">
							<div class="tab-pane" id="lang-ee">
								Тут будет эстонский
							</div>
							<div class="tab-pane active in" id="lang-ru">
								<div class="result__link">
									<div class="icobox icobox_right size_20">
										<a href="#" class="ico copyDataToClipboard" data-copy="Пожалуйста, оцените обслуживание: https://alvadi.ee/Wd89jdQs" data-notify="Text was copied to clipboard!">
											<img class="center" src="/images/icons/i-copy.png" alt="" />
										</a>
										Пожалуйста, оцените обслуживание:<br />
										<a href="https://alvadi.ee/Wd89jdQs">https://alvadi.ee/Wd89jdQs</a>
									</div>
								</div>
							</div>
							<div class="tab-pane" id="lang-fi">
								Тут будет финский
							</div>
							<div class="tab-pane" id="lang-en">
								Тут будет английский
							</div>
						</div>
					</div>
				</div>

				<div class="flex-row align-items-end">
					<div class="flex-col-auto">
						<form method="get" action="">
							<div class="flex-row row-16 align-items-end">
								<div class="flex-col-auto mb-8">
									<div class="form-group w-275">
										<div class="form-label"><strong>Период оценки:</strong></div>
										<div class="form-field-line">
											<div class="form-field">
												<div class="form-field__icon"><i class="fa fa-calendar fs-16 color-gray"></i></div>
												<input class="form-control datepicker" type="text" value="" data-datepicker-options="singleDatePicker: true; format: D.MM.Y;" />
											</div>
											<div class="form-field-separate">&mdash;</div>
											<div class="form-field">
												<div class="form-field__icon"><i class="fa fa-calendar fs-16 color-gray"></i></div>
												<input class="form-control datepicker" type="text" value="" data-datepicker-options="singleDatePicker: true; format: D.MM.Y;" />
											</div>
										</div>
									</div>
								</div>
								<div class="flex-col-auto mb-8">
									<div class="form-group">
										<div class="form-label"><strong>Оценка:</strong></div>
										<div class="form-field">
											<select class="form-control min-w-100">
												<option value="">Все</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="flex-col-auto mb-8">
									<div class="form-group">
										<div class="form-label"><strong>Админ:</strong></div>
										<div class="form-field">
											<select class="form-control">
												<option value="">Все</option>
												<option value="">Не все</option>
												<option value="">Только лишь все</option>
											</select>
										</div>
									</div>
								</div>
								<div class="flex-col-auto mb-8">
									<button class="btn btn-primary">Показать</button>
								</div>
							</div>
						</form>
					</div>
					<div class="flex-col-auto">
						<div class="cp-serviceQuality-stats">
							<div class="stats-heading">Всего:</div>
							<table>
								<tr>
									<td>Отвечено:</td>
									<td>389</td>
								</tr>
								<tr>
									<td>Средняя оценка:</td>
									<td>4.3</td>
								</tr>
							</table>
						</div>
					</div>
				</div>

				<div class="mb-24"></div>

				Найдено: 435
				<div class="scroller-x">
					<table class="table table-sm table-bordered">
						<thead class="thead-gray">
						<tr>
							<th>Дата оценки</th>
							<th>Оценка</th>
							<th>Комментарий</th>
							<th>Админ</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td class="text-nowrap">06.05.2023 17:15</td>
							<td class="text-nowrap">
								<strong class="mr-8 color-danger">1</strong>
								<span class="text-nowrap">
									<i class="fa fa-star color-danger"></i>
								</span>
							</td>
							<td>
								<p>Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.</p>
								<a href="https://translate.google.com/?sl=auto&tl=ru&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Русский</a>
								| <a href="https://translate.google.com/?sl=auto&tl=et&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Eesti</a>
								| <a href="https://translate.google.com/?sl=auto&tl=en&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">English</a>
							</td>
							<td>
								<div class="icobox size_16 text-nowrap">
									<img class="ico" src="https://loremflickr.com/40/40/people?random=98" alt="" />
									Artjom Ivanov
								</div>
							</td>
						</tr>
						<tr>
							<td class="text-nowrap">06.05.2023 17:15</td>
							<td class="text-nowrap">
								<strong class="mr-8">3</strong>
								<span class="text-nowrap">
									<i class="fa fa-star color-gray"></i>
									<i class="fa fa-star color-gray"></i>
									<i class="fa fa-star color-gray"></i>
								</span>
							</td>
							<td>
								<p>Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.</p>
								<a href="https://translate.google.com/?sl=auto&tl=ru&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Русский</a>
								| <a href="https://translate.google.com/?sl=auto&tl=et&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Eesti</a>
								| <a href="https://translate.google.com/?sl=auto&tl=en&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">English</a>
							</td>
							<td>
								<div class="icobox size_16 text-nowrap">
									<img class="ico" src="https://loremflickr.com/40/40/people?random=99" alt="" />
									Artjom Ivanov
								</div>
							</td>
						</tr>
						{% for item in 0..18 %}
							<tr>
								<td class="text-nowrap">06.05.2023 17:15</td>
								<td class="text-nowrap">
									<strong class="mr-8 color-success">5</strong>
									<span class="text-nowrap">
										<i class="fa fa-star color-success"></i>
										<i class="fa fa-star color-success"></i>
										<i class="fa fa-star color-success"></i>
										<i class="fa fa-star color-success"></i>
										<i class="fa fa-star color-success"></i>
									</span>
								</td>
								<td>
									<p>Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.</p>
									<a href="https://translate.google.com/?sl=auto&tl=ru&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Русский</a>
									| <a href="https://translate.google.com/?sl=auto&tl=et&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">Eesti</a>
									| <a href="https://translate.google.com/?sl=auto&tl=en&text={{ 'Хочу выразить большую благодарность консультанту! Мне нужно было купить свечи, так я ему на пальцах объяснила какие мне нужны, он сразу понял. Машина не стандартная. Также помог подобрать воздушный фильтр и дал рекомендации по маслам. Авто ни разу меня не подводило. Рекомендую.' }}" target="_blank">English</a>
								</td>
								<td>
									<div class="icobox size_16 text-nowrap">
										<img class="ico" src="https://loremflickr.com/40/40/people?random={{ loop.index }}" alt="" />
										Artjom Ivanov
									</div>
								</td>
							</tr>
						{% endfor %}
						</tbody>
					</table>
				</div>
			</div>

		</div>
	</div>
{% endblock %}