...
| Макрос генерирует HTML разметку |
|---|
<meta charset="utf-8"> <div class="header"> <h1><font <h1>MobileTaxi</h1> face="roboto - medium">Описание интерфейса программы</font></h1> <h2>Описание интерфейса программы</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 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> <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" class="accordion_toggle" id="toggle-02" hidden> <label class="accordion_trigger" for="toggle-02">Элементы главного меню</label> <i></i> <div class="accordion_target"> <p> Меню: <p>Встать в сектор — водитель выбирает: встать в выбранный сектор, сняться с сектора, посмотреть, сколько водителей уже есть в выбранном секторе, посмотреть полную информацию по секторам или уступить место в очереди сектора. Если водитель находится в секторе, название сектора и очередь в нем отображаются в главном меню.</p> <p>Фильтр — применение фильтра для заказов по сектору или по тарифу.</p> </p> <p>Расширенный фильтр — в эфир будут поступать заказы, которые будут соответствовать условиям расширенного фильтра, а именно заданным условиям фильтрации по следующим блокам (сектор подачи, сектор назначения, тариф, тип заказа, тип расчета, шаблон адреса).</p> <p>Баланс — возможность проверить баланс счета водителя машины.</p> <p>Рейтинг — рейтинг водителя при заказах из перекидки.</p> <p>Статус — позволяет поменять статус занят/свободен.</p> </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>Закладки: <p>Главная — отображает главное меню МТ. </p> <p>Эфир — закладка, в которой содержится информация о "горячих" заказах. </p> <p>Предв. - вкладка, в которой содержится информация о "предварительных" заказах. Эту вкладку можно отключить. </p> <p>Заказ — закладка, в которой содержится информация о заказах, сообщения для водителя. </p> <p>Перелистывание заказов осуществляется стрелочками < и> на панели, которая находится под вкладками. Если нажать на панель между стрелочками, открывается папка "Мои заказы", где заказы представлены списком. Переходить между вкладками можно как нажимая на их названия, так и с помощью движения пальцем по экрану в горизонтальном направлении. </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"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=6816466"><span>Мои заказы</span></a> <p> Отображение заказов во вкладке Эфир зависит от класса машины, на которой работает водитель, и от настроек фильтров в приложении. Отображение заказа в зависимости от дополнительных требований: <p> БН - заказ с безнальным расчетом;</p> <p> П - предварительный заказ; </p> <p>(УНИВЕР) - нужна машина класса"универсал"; </p> <p>(ЭЛИТ), (ПРЕМИУМ) - нужна машина класса "элит" или "премиум" соответственно;</p> <p> (ЭКОНОМ), (МИКРОАВТ) - нужна машина класса "эконом" или "микроавтобус" соответственно.</p> <p> Пользовательские классы машин, а также другие дополнительные требования особой подсветки не имеют, отображены большими буквами. </p> <p> Другие метки в заказах: R - заказ, влияющий на рейтинг;</p> <p> ** (или любая любая другая символьная метка) - заказ из обмена.</p> </p> </div> </li> </ul> </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>Спрятать вкладки - позволяет спрятать вкладки приложения("Главная", "Эфир", "Заказ"). </p> <p> В начало списка - для вкладки "Эфир" - позволяет отображать начало списка заказов в эфире. </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"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552945"><span>Мои заказы</span></a> <p> Мои заказы - информация о текущих и выполненных заказах. </p> </div> </li> <li class="accordion_item"> <input type="checkbox" class="accordion_toggle" id="toggle-07" hidden> <label class="accordion_trigger" for="toggle-07">Сообщения</label> <i></i> <div class="accordion_target"> <a href"=https://docs.tn.in.ua/pages/viewpage.action?pageId=8552945"><span>Сообщенияы</span></a> <p> Сообщения - входящие сообщения для водителя. </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"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552890"><span>GPS Карта</span></a> <p> GPS Карта - позволяет определить местонахождение водителя, контролировать автотранспорт и маршруты движения в режиме реального времени, а также получать информацию о пробках. </p> </div> </li> <li class="accordion_item"> <input type="checkbox" class="accordion_toggle" id="toggle-09" hidden> <label class="accordion_trigger" for="toggle-09">Таксометр</label> <i></i> <div class="accordion_target"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=8552900"><span>Таксометр </span></a> <p> Таксометр - применяется для расчета стоимости поездки на основании данных о тарифе, о пройденном расстоянии и о затраченном на поездку времени. </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"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=6816466"><span>Доп. функции</span></a> <p> Доп. функции - включает в себя информацию по связи с диспетчерской, о программе, статистике по 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"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=6816466"><span>Байкал</span></a> <p> Байкал - экстренный вызов диспетчера в случае непредвиденной ситуации </p> </div> </li> <li class="accordion_item"> <input type="checkbox" class="accordion_toggle" id="toggle-12" hidden> <label class="accordion_trigger" for="toggle-12">Настройки</label> <i></i> <div class="accordion_target"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=6816466"><span>Настройки</span></a> <p> Байкал - экстренный вызов диспетчера в случае непредвиденной ситуации </p> </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> <div class="accordion_target"> <a href="https://docs.tn.in.ua/pages/viewpage.action?pageId=6816466"><span>Выход</span></a> <p> Выход </p> </div> </li> </ul> </div> </td> </tr> </table> <style> .menu-container * { list-style: none; margin: 0; padding: 0; } .interface-content { width: 100%; } .interface-content td { vertical-align: top; } .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 p { margin-bottom: 1em; } .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/68160696817598/bg_23.png"); text-align: center; padding: 20px; } .header h1, .header span { color: #325F97#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> |
...