Проектирование пользовательского интерфейса
Пользовательский интерфейс разрабатывался при помощи PHPи программы Adobe dreamweaver CC.
Создаём главный файл main.html. Напишем следующий код
<HTML>
<HEAD>
<meta charset="utf-8">
<TITLE>
Салон красоты Гармония
</TITLE>
<linkrel="stylesheet" href="main.css">
</HEAD>
<BODY>
<H1><em>Салон красоты Гармония</em></H1>
<H2><em>Главная страница</em></H2>
В данном тег название страницы <Title>, кодировка документа utf8. Так же добавлен дизайн кнопок с помощью файла CSS (main.css).
В теле кода написаны ссылки к исходным файлам таблиц.
<body>
<TABLE border=0>
<TR>
<TD><button><a href="http://localhost/salon/Clients_table.php">Таблица клиентов</a></button></TD>
<TD><button>
<a href="http://localhost/salon/Clients_ADD.html">Добавить клиента</a></button></TD>
</TR>
<TR>
<TD><button><a href="http://localhost/salon/uslugi_table.php">Услуги</a></button></TD>
<TD><button>
<ahref="http://localhost/salon/Uslugi_ADD.html">Запись</a></button></TD>
</TR>
<TR>
<TD><button><a href="http://localhost/salon/Postavchik.php">Открыть таблицупоставщиков</a></button></TD>
<TD><button><a href="http://localhost/salon/Postavchik.html">Добавить поставщика</a></button></TD>
</TR>
<TR>
<TD><button><a href="http://localhost/salon/Material.php">Открыть таблицуматериалы</a></button></TD>
<TD><button><a href="http://localhost/salon/Material.html">Добавить материал</a></button></TD>
</TR>
<TR>
<TD><button><ahref="http://localhost/salon/master.php">Открыть таблицумастеров</a></button></TD>
</TR>
</body>
</html>
ПослепереходапоLocalhost/Salon/main.htmlвыдастследующие
Рисунок 8. – Главная страница веб интерфейса базы данных.
Что бы выводило информацию из таблицы «Клиенты» нужно написать PHPскрипт, который представлен ниже:
<html>
<head>
<meta charset="utf8">
<title>
Салон кросоты Гармония
</title>
<link rel="stylesheet" href="http://localhost/salon/main.css">
<style type="text/css">
table {
font-size: 14px;
border: 3px solid #000000;
cellspacing: 1;}
tr, td{
font-size: 14px;
border: 1px solid #000000;
cellspacing: 1;}
</style>
</head>
В данном коде описывается стиль таблицы в теге <style> и стили кнопок из документа main.css. В теле скрипта описаны подключение к БД, выборка данных и распределение их по столбцам и строкам таблицы:
<body>
<H1><em>СалонкрасотыГармония</em>.</H1>
<H2><em>Таблица Клиенты</em></H2>
<?php
mysql_connect("localhost","root","");
mysql_select_db("Salon3");
$res = mysql_query("SELECT * FROM `Client`") or die(mysql_error());
echo '<table border="1">';
while($row = mysql_fetch_assoc($res))
{
echo '<tr><td>'.$row['FIO_CL'].'</td><td>'.$row['Adress'].'</td><td>'.$row['Telephone'].'</tr>';
}
echo '</table>';
?>
<p>
<form action="http://localhost/salon/main.html">
<button type="submit">Назад</button>
</form>
</p>
</body>
</html>
Результатом данного скрипта является
Рисунок 9. – Таблица Клиенты.
Далее пишем код для добавления новых строк в таблицу Клиенты. Код представлен ниже:
<HTML>
<HEAD>
<metacharset="utf8">
<TITLE> Салон красоты - Добавление данных о клиенте
</TITLE>
</HEAD>
<BODY>
<H1>Салонкрасоты.</H1>
<H2> Добавление данных о клиенте.</H2>
<FORM method="POST" action="example_CL.php">
<INPUT type="hidden" name="posted" value="true">
<TABLE border=0><TR><TD>ФИОклиента:</TD>
<TD><INPUT name="FIO_CL" type="text"></TD>
</TR><TR><TD>Адресс:</td>
<TD><INPUT name="Adress" type="text"></TD>
</TR><TR><TD>Телефон </td>
<TD><INPUT name="Telephone" type="text"></TD>
<TR>
<TD colspan=2><INPUT type="submit" class="Cssbuton" value="Добавить"></TD></TR>
</TABLE>
</form>
<p>
<form action="http://localhost/salon/main.html">
<button type="submit">Назад</button>
</form>
</p>
</BODY>
</HTML>
Результат скрипта:
Рисунок 10. – Добавление данных.
Код файла обработчика для добавления информации о клиенте предоставлен ниже:
<HTML>
<HEAD>
<TITLE> Салон красоты - добавления клиента
<meta charset="utf8">
</TITLE>
</HEAD>
<BODY>
<H1> Салон красоты, Гармония.</H1>
<H2>Добавлениеклиента.</H2>
<?php
if (isset($_POST['posted']))
{ $FIO_CL = $_POST['FIO_CL'];
$Adress = $_POST['Adress'];
$Telephone = $_POST['Telephone'];
//передача данных из формы на сервер
if ($FIO_CL == "" or $Adress == "" or $Telephone == "")
{ echo "Необходимо ввести имя - нажмите кнопку Назад и заполните форму еще раз"; exit; }
$FIO_CL = addslashes($FIO_CL);
$Adress = addslashes($Adress);
$Telephone = addslashes($Telephone);
$db = @mysql_pconnect("localhost", "root");
if (!$db)
{ echo " Ошибка: Dont connect."; exit; }
mysql_SELECT_db("Salon3");
$query = "INSERT INTO Client (FIO_CL, Adress, Telephone) VALUES ('".$FIO_CL."','".$Adress."','".$Telephone."')";
$result = mysql_query($query);
if($result)
echo "<H3>Добавление клиента выполнено.</H3>";
}
?>
</BODY>
</HTML>
Результат кода обработчика предоставлен ниже:
Рисунок 11. Добавление клиента выполнено
По аналогии данных скриптов «Таблица клиентов», «Добавления клиентов» пишем для остальных таблиц.