Дерево страниц

Сравнение версий

Ключ

  • Эта строка добавлена.
  • Эта строка удалена.
  • Изменено форматирование.

...

Макрос генерирует HTML разметку
<meta charset="utf-8">
<div class="header">
 <h1><font  face="roboto - medium">Описание интерфейса программы</font></h1>
 <h2>Описание интерфейса клиентского приложения White Label</h3>
</div> <table class="interface-content">     <tr>   
  
  <td style="width: 375px;">
            <img src="/download/attachments/14352482/375px-%D0%93%D0%BB%D0%B0%D0%B2%D0%BD%D0%BE%D0%B5_%D0%BC%D0%B5%D0%BD%D1%8E.png">
        </td>
        <td>
            <div class="menu-container">
                <ul class="accordion">
                    	<li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-01" hidden>
                        <label class="accordion_trigger" for="toggle-01">Строка состояния</label>
                        <i></i>
                        <div class="accordion_target">


                            <p>Строка состояния предоставляет информацию в виде значков (индикаторов) о включенных или выключенных функций </p>

                            <table>
                                <tr>
                                    <td><img 			<img class="main-picture" src="/download/attachments/14352482/%D0%BE%D1%87%D0%B5%D1%80%D0%B5%D0%B4%D1%8C%20%D0%B2%20%D1%81%D0%B5%D0%BA%D1%82%D0%BE%D1%80%D0%B5.png"
                                            </td>
                                        <td>Сведения о секторах</td>
                                </tr>
                                <tr>
                                    <td> <img src="/download/attachments/14352482/ic_new_message.png"></td>
                                    <td>Непрочитанные сообщения</td>
                                </tr>

                                <tr>
                                    <td> <img src="/download/attachments/14352482/ic_filter_green.png"></td>
                                    <td>Индикатор появляется, если включен фильтр или расширенный фильтр</td>
                                </tr>

                                <tr>
                                    <td> <img src="/download/attachments/14352482/ic_auto_take_green.png"></td>
                                    <td>Индикатор появляется, если работает автовзятие</td>
                                </tr>

                                <tr>
                                    <td> <img src="/download/attachments/14352482/gps_connected.png"></td>26968566/White_Label_icon.png?version=1&modificationDate=1516894347159&api=v2">
                                    <td>Индикатор работы GPS</td>
                                </tr>

                                <tr>
                                    <td> <img src="/download/attachments/14352482/ic_stat_conn_on.png"></td>
                                    <td>Отображение статуса водителя.</td>
                                </tr>

                            </table>
                    </li>
                    <li class="accordion_item">
                        <input type="checkbox<input name="interface-menu" type="radio" class="accordion_toggle" id="toggle-0201" hidden>
                        <label class="accordion_trigger" for="toggle-02">Элементы главного меню<01">Заказать</label>
                        <i></i>
                        			<div class="accordion_target">
                            
                                <p><strong>Встать в сектор</strong> — водитель выбирает: встать в выбранный сектор, сняться с сектора, посмотреть,
                                    сколько водителей уже есть в выбранном секторе, посмотреть полную информацию по секторам
                                    или уступить место в очереди сектора. <em> Если водитель находится в секторе, название сектора
                                    и очередь в нем отображаются в главном меню.</em></p>
                                <p><strong>Фильтр</strong> — применение фильтра для заказов по сектору или по тарифу.</p>
                           
                            <p><strong>Расширенный фильтр</strong> — в эфир будут поступать заказы, которые будут соответствовать условиям расширенного фильтра, а именно заданным условиям фильтрации по следующим блокам (сектор подачи, сектор назначения, тариф, тип заказа, тип расчета, шаблон адреса).</p>
                            <p><strong>Баланс</strong> — возможность проверить баланс счета водителя машины.</p>
                            <p><strong>Рейтинг</strong> — рейтинг водителя при заказах из перекидки.</p>
                            <p><strong>Статус</strong> — позволяет поменять статус занят/свободен.</p>
                           
                    </li>

                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-03" hidden>
                        <label class="accordion_trigger" for="toggle-03">Описание закладок</label>
                        <i></i>
                        <div class="accordion_target">

<p><strong>Главная</strong> — отображает главное меню МТ.  </p>
<p><strong>Эфир</strong> — закладка, в которой содержится информация о "горячих" заказах. </p>
<p><strong>Предв.</strong> — вкладка, в которой содержится информация о "предварительных" заказах. Эту вкладку можно отключить.  </p>
<p><strong>Заказ</strong> — закладка, в которой содержится информация о заказах, сообщения для водителя. Перелистывание заказов осуществляется стрелочками <strong><</strong> и <strong>></strong> на панели, которая находится под вкладками. Если нажать на панель между стрелочками, открывается папка <strong>"Мои заказы"</strong>, где заказы представлены списком. Переходить между вкладками можно как нажимая на их названия, так и с помощью движения пальцем по экрану в горизонтальном направлении. </p>

                        </div>
                    </li>


                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-04" hidden>
                        <label class="accordion_trigger" for="toggle-04">Отображение заказов в эфире</label>
                        <i></i>
                        <div class="accordion_target">

                            <p> Отображение заказов во вкладке <strong>Эфир</strong> зависит от класса машины, на которой работает водитель, и
                                от настроек фильтров в приложении. <strong>Отображение заказа в зависимости от дополнительных требований</strong>:
                                
<p> <font color="#ff0000"> <strong>БН</strong> </font>- заказ с безнальным расчетом;</p>
<p><font color="#ff0000"> <strong>П </strong></font> - предварительный заказ; </p>
<p><font color="#ffd700"><strong>(УНИВЕР)</strong></font> - нужна машина класса"универсал"; </p>
<p><font color="#da70d6"><strong>(ЭЛИТ)</strong></font>, <font color="#da70d6"><strong>(ПРЕМИУМ)</strong></font> - нужна машина класса "элит" или "премиум" соответственно;</p>
<p>(ЭКОНОМ), (МИКРОАВТ) - нужна машина класса "эконом" или "микроавтобус" соответственно.</p>
<p>Пользовательские классы машин, а также другие дополнительные требования особой подсветки не имеют, отображены большими буквами. </p>
<p><strong>Другие метки в заказах</strong>: </p>
<p><font color="#008000"> <strong>R</strong> </font> - заказ, влияющий на рейтинг;</p>
<p> <font color="#00ffff"> <strong>**</strong> </font> (или любая любая другая символьная метка) - заказ из обмена.</p>


                            </p>

                        </div>
                    </				<img class="picture-01" src="/download/attachments/26968173/%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D1%82%D1%8C%20%D0%B7%D0%B0%D0%BA%D0%B0%D0%B7.png">
				<div class="description_text">
					</br>
					<ul>
						<li><strong>Тип маршрута (1)</strong> - выбор маршрута <strong>"По адресу"</strong> (в маршруте есть конечная точка) или <strong>"По городу"</strong> (в маршруте есть только точка подачи).</li>
						<li><strong>Формирование маршрута (2)</strong> - задание адресов начала, конца маршрута и промежуточных точек. Для удобства выбора адреса, можно использовать избранные адреса.</li>
						<li><strong>Дополнительно (3)</strong> - дополнительные условия поездки, в том числе изменение <u>времени подачи</u> и контактного <u>телефона</u> пассажира.</li>
                </ul>        <li><strong>Изменение стоимости        заказа (4)</div>
                </td>
    </tr>
    <tr>
        <td>
            <img src="/download/attachments/14352482/375px-%D0%91%D0%BE%D0%BA%D0%BE%D0%B2%D0%BE%D0%B5_%D0%BC%D0%B5%D0%BD%D1%8E.png">
        </td>
        <td>
            <div class="menu-container">
                <ul class="accordion">
                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-05" hidden>
                        <label class="accordion_trigger" for="toggle-05">Главная</label>
                        <i></i>
                        <div class="accordion_target">


                            
                            <p>Вызывает главное меню приложения.  </p>
 <p><strong>Спрятать вкладки</strong> - позволяет спрятать вкладки приложения (<strong>Главная</strong>, <strong>Эфир</strong>, <strong>Заказ</strong>). </p>
 <p><strong>В начало списка</strong> (для вкладки <strong>Эфир</strong>) - позволяет отображать начало списка заказов в эфире. </p>


                        </div>
                    </li>


                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-06" hidden>
                        <label class="accordion_trigger" for="toggle-06">Мои заказы</label>
                        <i></i>
                        <div class="accordion_target">
                            <p> Информация о текущих и выполненных strong> - для округления суммы и/или ускорения поиска машины.</li>
						<li><strong>Тип машины (5)</strong> - выбор класса машины.</li>
						<li><strong>Заказ и сброс (6)</strong> - кнопка отправки заказа и сброс введенных данных. <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552945#id-Приемзаказа,сообщенияпозаказу-ПриемзаказаСведенияозаказах">заказах</a>.
                            </p>

                        26968173"><span>Подробнее о создании заказа...</span></a></li>
					</ul>
					</br>
				</div>
			</div>
                    </li>
                       <li class="accordion_item">
            <input            <input name="interface-menu" type="checkboxradio" class="accordion_toggle" id="toggle-0702" hidden>
                        <label class="accordion_trigger" for="toggle-0702">Сообщения<>Мои заказы</label>
                        <i></i>
                        <div class="accordion_target">

                            <p>
                                Входящие <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552945#id-Приемзаказа,сообщенияпозаказу-СообщенияСообщения">сообщения</a> для водителя.
                            </p>


                        </div>
                    </li>



                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-08" hidden>
                        <label class="accordion_trigger" for="toggle-08">GPS карта</label>
                        <i></i>
                        <div class="accordion_target">

                            <p><a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552890&src=contextnavpagetreemode">GPS карта</a> позволяет определить местонахождение водителя, контролировать автотранспорт и маршруты движения в режиме реального времени, а также получать информацию о пробках.
                            </p>
  				<img class="picture-02" src="/download/attachments/26968566/Мои_заказы_350.png?version=1&modificationDate=1516888646250&api=v2">
				<div class="description_text">
					</br>
					<ul>
						<li><strong>Выполняются</strong> - список выполняющихся заказов клиента.</li>
						<li><strong>История</strong> - список отправленных клиентом заказов.</li>
						<p>Полную информацию и маршрут по заказу можно посмотреть, нажав на текст заказа.</p>
					</ul>
					</br>
				</div>
                     	</div>
                    </li>

                    <li class="accordion_item">
            <input            <input name="interface-menu" type="checkboxradio" class="accordion_toggle" id="toggle-0903" hidden>
                        <label class="accordion_trigger" for="toggle-0903">Таксометр<>Профиль</label>
                        <i></i>
                        <div class="accordion_target">
				<img                            <p><a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552900&src=contextnavpagetreemode">Таксометр</a> применяется для расчета стоимости поездки на основании данных о тарифе, о пройденном расстоянии и о затраченном на поездку времени.
                            </p>

                        </div>
                    </li>

                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-10" hidden>
                        <label class="accordion_trigger" for="toggle-10">Доп. функции</label>
                        <i></i>
                        <div class="accordion_target">

                            <p><a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552909">Доп. функции</a> включают в себя информацию по связи с диспетчерской, о программе, статистике по GPS и информация о последнем заказе.
                            </p>

                        </div>
                    </li>



                    <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-11" hidden>
                        <label class="accordion_trigger" for="toggle-11">Байкал</label>
                        <i></i>
                        <div class="accordion_target">

                            <p><a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552909#id-Связьсдиспетчеромидополнительныефункции-Сигнал"Байкал"Сигнал"Байкал"">Экстренный вызов</a> диспетчера в случае непредвиденной ситуации
                            </p>class="picture-03" src="/download/attachments/26968177/%D0%BF%D1%80%D0%BE%D1%84%D0%B8%D0%BB%D1%8C.png">
				<div class="description_text">
					</br>
					<ul>
						<li><strong>Имя</strong> - имя клиента.</li>
						<li><strong>Номер</strong> - контактный телефон клиента.</li>
						<li><strong>Город</strong> - город, в котором клиент делает заказы. Если Ваша служба работает по нескольким городам, клиент может выбрать другой город из предоставленного списка.</li>
						<li><strong>Бонусы</strong> - бонусный счет клиента. Бонусы отображаются только если у Вашей службы настроена работа с бонусами.</li>
						<p>Кнопка <strong>"Выход"</strong> - выход из аккаунта клиента. При следующем входе необходимо будет авторизоваться.</p>
					</ul>
					</br>
				</div>
                          	</div>
                    </li>


                   <li class="accordion_item">
            <input            <input name="interface-menu" type="checkboxradio" class="accordion_toggle" id="toggle-1204" hidden>
                        <label class="accordion_trigger" for="toggle-1204">Настройки<>Инфо</label>
                        <i></i>
                        <div class="accordion_target">
				<img                            <p>Позволяют <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552923&src=contextnavpagetreemode">настроить</a>: эфир,звук, вибрацию, оформление, время подачи по-умолчанию, очистить память, обновление, передачу GPS.</p>class="picture-04" src="/download/attachments/26968177/%D0%B8%D0%BD%D1%84%D0%BE.png">
				<div class="description_text">
					</br>
					<ul>
						<li><strong>Версия</strong> - текущая версия приложения.</li>
							<li><strong>Связаться с нами</strong> - возможность обратиться в Вашу диспетчерскую и/или техподдержку в телефонном режиме или написать письмо в        Вашу диспетчерскую.</div>
                    </li>




   <li class="accordion_item">
                        <input type="checkbox" class="accordion_toggle" id="toggle-13" hidden>
                        <label class="accordion_trigger" for="toggle-13">Выход</label>
                        <i></i>li>
					</ul>
					</br>
				</div>
                        <div class="accordion_target">

                            <p><a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=12779624#id-Статус,рейтинг,баланс-Вход/ВыходизмодуляВход/Выходизмодуля">"Выход"</a> позволяет открыться, закрыться, выйти с закрытием, выйти без закрытия.</p>	</div>
        </li>

                         </div>ul>
                    </li>div>


			  
   </ul>            
</div><style>


	.main-picture {
		position: absolute;
		top:  </td>
 20px;
		left: -300px;
	}
  </tr> </table> <style>
    .menu-container * {
        list-style: none;
        margin: 0;
        padding: 0;
    }


   	.interfacemenu-contentcontainer {
        width		min-height: 100%650px;
    }

    .interface-content td 	.accordion {
        vertical-alignpadding: top;0 0 0 400px;
 	}


    .accordion_item {
        border-bottom: 1px solid #DFE1E6;
        position: relative;
    }

    .accordion_trigger:hover {
        background-color: #F4F5F7;
    }

    .accordion_item:last-of-type {
        border-bottom: none;
    }

    .accordion_trigger {
        display: block;
        font-weight: normal;
        cursor: pointer;
        padding: 1.2em;
        color: #253858;
        font-weight: bold;
    }

    .accordion_toggle {
        position: absolute;
        display: none;
    }
     .accordion_target {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        overflow: hidden;
        position: absolute;
        width: 1px;
    }

	.accordion_target img {
		position: absolute;
		left: -380px;
		border: 3px solid #195177;
		border-radius: 8px;
	}

	.picture-01, 
	.picture-02, 
	.picture-03, 
	.picture-04 {
		width:300px;
	}

	.picture-01 {
		top: 0px;
	}
	.picture-02 {
		top: -54px;
	}
	.picture-03 {
		top: -108px;
	}
	.picture-04 {
		top: -162px;
	}

	
    .accordion_target p {
        margin-bottom: 1em;
    }


	.description_text li {
		list-style: disc inside;
	}

    .accordion_toggle:checked~.accordion_target {
        position: static;
        overflow: visible;
        clip: auto;
        padding: 0.2em 1.2em 0.2em 1.2em;
        width: auto;
        height: auto;
    }

    .accordion_item i {
        width: 0.7em;
        height: 0.7em;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        margin: 1.4em;
        border-color: #253858;
        border-style: solid;
        border-top-width: 0.3em;
        border-right-width: 0.3em;
        border-left-width: 0;
        border-bottom-width: 0;
        transform: rotate(45deg);
    }

    .accordion_toggle:checked~i {
        border-top-width: 0;
        border-right-width: 0.3em;
        border-left-width: 0;
        border-bottom-width: 0.3em;
    }
</style>


<style>
    .header {
        background-image: url("/download/attachments/6817598/bg_3.png");
        text-align: center;
        padding: 20px;
    }

    .header h1,

    .header span {
        color: #583C00;
    }


    .header h2,
    .header span {
        color: #444444;
    }

    .header h1,
    .header h2 {
        margin: 20px;
    }

    .header h1 {
        font-size: 48px;
    }

    .header h2 {
        font-size: 18px;
    }

    .header a:link,
    .menu a:link {
        text-decoration: none;
    }

    .header a:visited,
    .menu a:visited {
        text-decoration: none;
    }

    .header span {
        margin: 10px 15px 10px 15px;
        font-weight: 600;
    }

    .header span:hover {
        background-color: #4DA0EA;
        border-radius: 0.5em;
        margin: 0px;
        padding: 10px 15px 10px 15px;
    }


    #title-heading {
        display: none;
    }

    .page-metadata {
        visibility: hidden;
    }
</style>


...