VYSOKÁ ŠKOLA POLYTECHNICKÁ JIHLAVA Katedra elektrotechniky a informatiky Obor Počítačové systémy

VYSOKÁ ŠKOLA POLYTECHNICKÁ JIHLAVA Katedra elektrotechniky a informatiky Obor Počítačové systémy Informační systém pro správu zakázek pro firmu Art21, s. r. o. bakalářská práce Autor: Tomáš Maštera Vedoucí práce: PaedDr. František Smrčka, Ph.D. Jihlava 2014

Abstrakt Tématem této bakalářské práce bylo vytvořit informační systém pro správu zakázek pro firmu Art 21, s. r. o., který by pomohl zpřehlednit správu a práci s daty. Systém je implementován jako webové stránky a umožňuje evidovat zakázky, klienty, firmy a uživatele. Hlavními vlastnostmi jsou kompletní správa dat, možnost exportu dat do formátu PDF (Portable Document Format) a odesílání novinek vybraným klientům. Jako výchozí programovací jazyky jsou použity PHP (Hypertext Preprocessor), HTML (HyperText Markup Language), CSS (Cascading Style Sheets), JavaScript a MySQL (Structured Query Language). Klíčová slova PHP, HTML, CSS, JavaScript, MySQL, informační systém Abstract The topic of this thesis was to develop a system to manage orders for a company Art 21, s. r. o., which would help streamline the administration and work with data. The system is implemented as web pages and allows you to record contracts, clients, companies and users. The main features are a complete data management, ability to export data to PDF (Portable Document Format) and sending newsletter to selected clients. As a default programming languages are used PHP (Hypertext Preprocessor), HTML (HyperText Markup Language), CSS (Cascading Style Sheets), JavaScript and MySQL (Structured Query Language). Key words PHP, HTML, CSS, JavaScript, MySQL, information system

Prohlašuji, že předložená bakalářská práce je původní a zpracoval/a jsem ji samostatně. Prohlašuji, že citace použitých pramenů je úplná, že jsem v práci neporušil/a autorská práva (ve smyslu zákona č. 121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů, v platném znění, dále též AZ ). Souhlasím s umístěním bakalářské práce v knihovně VŠPJ a s jejím užitím k výuce nebo k vlastní vnitřní potřebě VŠPJ. Byl/a jsem seznámen s tím, že na mou bakalářskou práci se plně vztahuje AZ, zejména 60 (školní dílo). Beru na vědomí, že VŠPJ má právo na uzavření licenční smlouvy o užití mé bakalářské práce a prohlašuji, že souhlasím s případným užitím mé bakalářské práce (prodej, zapůjčení apod.). Jsem si vědom/a toho, že užít své bakalářské práce či poskytnout licenci k jejímu využití mohu jen se souhlasem VŠPJ, která má právo ode mne požadovat přiměřený příspěvek na úhradu nákladů, vynaložených vysokou školou na vytvoření díla (až do jejich skutečné výše), z výdělku dosaženého v souvislosti s užitím díla či poskytnutí licence. V Jihlavě dne... Podpis

Poděkování Na tomto místě bych rád poděkoval svému vedoucímu práce PaedDr. Františku Smrčkovi, Ph.D. za poskytnutí tématu a možnost vytvářet ho pod jeho vedením.

Obsah 1 Úvod a cíle... 8 2 Analýza a specifikace... 9 2.1 Význam vzniku systému... 9 2.2 Porovnání s existujícím řešením... 9 2.3 Požadavky na informační systém... 9 2.4 Přístup do systému... 11 2.5 Databáze... 12 2.6 Princip evidence dat... 13 3 Použité technologie... 14 3.1 Programovací jazyky... 14 3.1.1 PHP... 14 3.1.2 HTML... 14 3.1.3 JavaScript... 15 3.1.4 CSS... 15 3.2 Databázový systém... 16 3.2.1 MySQL... 16 3.2.2 phpmyadmin... 17 3.3 Použité volně dostupné nástroje... 18 3.3.1 mpdf export dat do PDF... 18 3.3.2 PHPMailer posílání emailů... 18 3.3.3 Horizontální menu v CSS... 19 3.3.4 Kalendář v JavaScriptu... 20 3.4 Vývojová prostředí... 21 3.5 Instalace serveru pomocí XAMPP... 22 4 Realizace... 23 4.1 Návrh řešení... 23 4.2 Možnosti řešení... 23 4.3 Návrh GUI grafické uživatelské rozhraní... 23 4.4 Datový model... 25 4.4.1 Tabulka Firmy... 25 4.4.2 Tabulka Klienti... 26 4.4.3 Tabulka Zakázky... 27 4.4.4 Tabulka Uživatelé... 28 4.4.5 Tabulka Historie... 28

4.4.6 Vztahy mezi tabulkami... 29 4.5 Zabezpečení... 30 4.5.1 Zabezpečení stránek... 30 4.5.2 Funkce session v PHP... 30 4.5.3 Soubor prihlasovaci_formular.html... 31 4.5.4 Soubor prihlaseni.php... 31 4.5.5 Soubor kontrola.php... 32 4.5.6 Soubor odhlaseni.php... 33 4.5.7 Zabezpečení osobních údajů... 34 4.6 Export do PDF... 35 4.6.1 Postup převodu dat ze systému do PDF... 35 4.6.2 Programová ukázka převodu dat do PDF... 35 4.6.3 Celkový náhled výstupu PDF... 37 4.7 Odesílání novinek... 38 4.7.1 Postup pro posílání novinek:... 38 4.7.2 Programová ukázka odesílání emailu... 39 4.8 Grafické uživatelské rozhraní (GUI)... 40 4.8.1 Přihlašovací obrazovka... 40 4.8.2 Rozvržení hlavní stránky... 41 4.8.3 Ukázka vložení dat... 42 4.8.4 Ukázka exportu s konkrétními daty... 46 4.8.5 Odesílání novinek... 49 4.9 Struktura adresáře a statistika... 50 5 Testování... 51 6 Závěr... 52 6.1 Splnění cílů a požadavků... 52 6.2 Problémy a jejich řešení... 52 6.3 Možnosti rozšíření a další pokračování... 53 Seznam použité literatury... 54 Seznam obrázků... 55 Seznam použitých zkratek... 56 Přílohy... 57 1 Obsah přiloženého CD... 57

1 Úvod a cíle Již při vykonávání praxe jsem měl možnost spolupracovat s firmou Art21, s. r. o. Při výběru svého tématu k bakalářské práci jsem se na tuto firmu obrátil, zda by neměli vhodné téma, které bych mohl zpracovat. Firma mi vyšla vstříc a navrhla, že bych jako téma bakalářské práce mohl vytvořit informační systém pro správu zakázek. Hlavním důvodem bylo, že dosud ve firmě žádný informační systém implementován nebyl a veškerá administrativa probíhala čistě papírově, což bylo neefektivní a zdlouhavé. Navíc archivace těchto dat vyžadovala spoustu místa a jejich následné vyhledávání bylo časově náročné. Vytvořením elektronického informačního systému se tyto nevýhody do jisté míry eliminují. Cílem mé práce bylo vytvořit takový informační systém, který by pokryl všechny požadavky firmy. Systém musí být navíc přístupný ze všech počítačů ve firemní síti, nikdo jiný do systému nebude mít přístup. Mezi hlavní požadavky patří kompletní správa zakázek, klientů a firem, včetně třídění a filtrování dat. Dalšími požadavky jsou možnost exportovat data ze systému do formátu PDF a posílat novinky vybraným klientům na emaily. Jako výchozí prostředí jsem zvolil webové rozhraní, protože ho lze jednoduše sdílet v síti a navíc umožňuje vytvořit libovolné grafické prostředí. Využiji k tomu programovací jazyky jako je PHP, HTML a JavaScript, pro ukládání dat MySQL databázi. Samotný vzhled webových stránek bude vytvořen pomocí CSS (jazyk kaskádových stylů, který definuje vzhled webových stránek). Pro export dat do PDF využiji externí knihovny mpdf a pro posílání emailů nástroj PHPMailer. Celý systém poběží na lokálním počítači připojeném do firemní sítě. Pomocí nástroje XAMPP se z tohoto počítače vytvoří server. Nástroj XAMPP je balík programů a funkcí, které umožnují vytvořit z běžného počítače server, na kterém lze pak provozovat Apache, PHP, MySQL a spoustu dalších nástrojů. Vzhledem k tomu, že server bude připojen do firemní sítě, bude možné se ze všech ostatních počítačů ve stejné síti připojit do informačního systému. 8

2 Analýza a specifikace 2.1 Význam vzniku systému Hlavní důvod, proč vzniklo toto téma vytvoření informačního systému, byl ten, že ve firmě probíhala veškerá administrativa čistě papírově. Z toho plyne, že práce s daty byla neefektivní a časově náročná. Samotná evidence a následná archivace dat stojí dost času a navíc tyto dokumenty vyžadují spoustu místa. Pokud je potřeba případně nějaká data později vyhledat, stojí to opět čas a značné úsilí. Převod dat do elektronické podoby tyto nevýhody eliminuje. Taková data lze velmi rychle zadávat, měnit i archivovat. Také je lze tisknout a posílat, například emailem, navíc jsou přenositelné. Nezabírají žádné fyzické místo, takže není nutné mít vyhrazené prostory pro šanony apod. Ovšem i data v elektronické podobě mají své nevýhody. Je třeba pravidelně data zálohovat a zabezpečit je před zásahem cizí osoby nebo před odcizením, na toto je potřeba vždy pamatovat a věnovat této problematice zvýšenou pozornost. 2.2 Porovnání s existujícím řešením Vzhledem k tomu, že ve firmě nebyl doposud žádný informační systém, ani se žádným neměli zkušenosti, musel jsem začít od začátku. Jelikož je systém navržen přesně podle požadavků firmy, nedá se říci, že by takový systém již existoval. 2.3 Požadavky na informační systém U firmy jsem podstoupil několik konzultací k tématu, abych získal informace o tom, jak to ve firmě probíhá a abych měl představu, jaké jsou hlavní požadavky na tento systém. 9

Požadavky na systém: - přístupnost ze všech počítačů ve firemní síti - přístup do systému pouze pro registrované uživatele - jednoduché ovládání a uživatelsky přívětivé prostředí - přehledné zobrazování dat - kompletní správa dat, jako je vkládání, upravování, mazání a archivování - třídit a filtrovat data podle různých kritérií - možnost vyhledávat data podle určitých specifikací - možnost exportovat data do elektronické podoby (PDF) - možnost odesílat novinky klientům 10

2.4 Přístup do systému Aby do systému neměl přístup každý a data byla uchována v bezpečí, bylo nutné zvolit vhodné zabezpečení. Do systému se lze tedy přihlásit pouze pod uživatelským jménem a heslem, které lze získat od administrátora. Po bližší analýze přístupu do systému jsem došel k závěru, že budou stačit 2 úrovně oprávnění uživatelů. První úroveň je administrátor, druhá pak běžný uživatel. Rozdíl mezi nimi je následující. Administrátor: - kompletní správa systému - právo přidávat a odebírat uživatele, kteří budou mít přístup do systému - právo smazat historii přihlášení - zároveň má všechny vlastnosti běžného uživatele Běžný uživatel: - přístup do systému - práce s daty 11

2.5 Databáze Při analýze všech dat, která bude nutné uchovávat v databázi, jsem došel k závěru, že celý informační systém z pohledu databáze bude tvořit 5 základních tabulek: - tabulka Firmy uchovává data o firmách, které souvisí s klienty - tabulka Klienti uchovává data o klientech, kteří souvisí se zakázkou - tabulka Zakázky uchovává veškerá data o zakázkách včetně dat Firem a Klientů - tabulka Uživatelé uchovává data o uživatelích, kteří mají přístup do systému - tabulka Historie zde se uchovávají informace o přístupech do systému, které souvisí s Uživateli Tabulky jsou vzájemně propojené pomocí vztahů. Zjednodušené schéma propojení tabulek je následující: Obrázek 1 - Zjednodušené schéma propojení tabulek 12

2.6 Princip evidence dat Po upřesnění všech požadavků, jsem s vedením firmy konzultoval hlavní princip systému. Myšlenka byla taková, že budou 3 hlavní oblasti dat. Jsou to firmy, klienti a zakázky, z tohoto důvodu vznikly shodné tabulky. Nejprve se vytvoří firma s potřebnými údaji a uloží se do databáze. Dále se vytvoří klient s určitými parametry a přiřadí se mu již vytvořená firma, poté se také uloží do databáze. Pokud je takto vytvořen klient, může se již vytvořit zakázka. Při vytváření zakázky se k ní přiřadí pouze vytvořený klient, ostatní údaje o firmě jsou již obsaženy u klienta. Obrázek 2 - Princip vytváření dat 13

3 Použité technologie Ve své práci jsem použil několik programovacích jazyků a dostupných nástrojů. V této kapitole se o jednotlivých technologiích stručně zmíním. Jelikož se jedná o webovou aplikaci, souvisí všechny technologie s tímto odvětvím. 3.1 Programovací jazyky Zde jsou popsány použité programovací jazyky. 3.1.1 PHP PHP je jedním z nejvíce rozšířených programovacích jazyků používaných k vytváření webových aplikací. PHP se používá na straně serveru a slouží tedy ke generování HTML/XHTML kódu stránky, jenž pak server odesílá do prohlížeče (na rozdíl od klientského JavaScriptu, který funguje až při zobrazení stránky v prohlížeči). [1] Hlavním kladem PHP je jeho nezávislost na platformě (Windows, Linux, Unix apod.), mezi výhody PHP patří i široké možnosti použití. PHP například umí pracovat se soubory a s mnoha různými databázemi, lze generovat a upravovat grafiku, umí odesílat a přijímat emaily, vytvářet PDF, podporuje všechny důležité internetové protokoly. [1] Protože má PHP poměrně volnou syntaxi (způsob zápisu). Společně s webovým serverem Apache a databází MySQL tvoří PHP tzv. triádu, trojici programů nejčastěji používaných pro generování stránek. Z toho plyne i další výhoda PHP na internetu existuje obrovské množství fragmentů, uživatelsky definovaných funkcí a hotových řešení obvyklých problémů. [1] 3.1.2 HTML HTML je zkratka Hypertext Markup Language (hypertextový značkovací jazyk). HTML je v dnešní době stále nejoblíbenější jazyk pro vytváření jednoduchých www stránek. [2] HTML je značkovací jazyk, který používá definované značky (tagy) k vytváření a formátování dokumentů pro webové stránky. [2] 14

Jazyk HTML je nyní v aktuální verzi 4.01 a dále se již nevyvíjí. Normy a doporučení pro jazyk HTML schvaluje nezávislé mezinárodní konsorcium W3C. [2] 3.1.3 JavaScript JavaScript je programovací jazyk, který se používá v internetových stránkách. Zapisuje se přímo do HTML kódu mezi tagy <script> a </script> nebo ho lze importovat z externího souboru, což je velká výhoda. JavaScript je klientský skript. To znamená, že se program odesílá se stránkou na klienta (do prohlížeče) a teprve tam je vykonáván (protikladem klientských skriptů jsou skripty serverové, které jsou vykonávány na serveru a na klienta jdou už jen výsledky, což je zmíněné PHP). JavaScript je často zaměňován s Javou, avšak Java je samostatný programovací jazyk a má s JavaScriptem pouze podobnou syntaxi (způsob zápisu). [3] JavaScript se používá především pro vytváření interaktivních webových stránek. Příkladem použití mohou být nejrůznější kontroly správného vyplnění formulářů, obrázky měnící se po přejetí myší, rozbalovací menu, akce při kliknutí nebo najetí myší na objekt atd. JavaScript se také často používá k měření statistik návštěvnosti. [4] 3.1.4 CSS CSS styly jsou kaskádové styly, které se používají k vytvoření stylu webové stránky. S CSS styly je možné pomocí jednoho souboru ovlivňovat design celého webu. CSS je zkratka Cascading Style Sheets, poprvé byly implementovány společností Microsoft v roce 1996 do Internet Exploreru 3.0. Pomocí CSS stylů je možné definovat kromě barvy, písma a velikosti spoustu dalších věcí (rámeček, podtržení, tučnost, vlnitost, zobrazení, odrážky, okraje, viditelnost, pozici, průhlednost a spoustu dalších). [5] CSS styly se aplikují hlavně pomocí tříd a identifikátorů. Ty umožňují tvorbu CSS stylu jediným atributem a tím pádem se nemusí opakovat stejný kód několikrát. Kromě toho lze také definovat styl prvků (h1, p, table atd.) pomocí selektorů. Například každý prvek <input> může mít vždy červený text apod. [5] 15

3.2 Databázový systém Zde je popsán zvolený způsob pro ukládání dat. 3.2.1 MySQL Pro ukládání dat jsem využil MySQL databázi, hlavním důvodem byly jisté zkušenosti s tímto systémem. MySQL je švédský databázový server založený na jazyce SQL. Je k dispozici jako open source, tedy program šířený zdarma. K dalším výhodám MySQL patří podpora všech hlavních platforem, vysoký výkon i rychlost a vynikající kompatibilita s jinými systémy, zejména se serverovým programem Apache a skriptováním PHP (dohromady tvoří tzv. triádu, trojici programů nejčastěji instalovanou k vytváření databázových aplikací, jak již bylo řečeno). Díky těmto vlastnostem se MySQL prosadila jako univerzální řešení používané na většině internetových projektů a je automaticky dostupná téměř na všech typech webhostingu. [6] MySQL je relační databáze typu DBMS (database management system) a vychází z deklarativního programovacího jazyka SQL (Structured Query Language). [7] Mezi nevýhody MySQL paří, že nepodporuje složitější programátorské konstrukce (někdy je možné je obcházet skriptováním) a nemá dostatečný výkon v opravdu náročných (zatěžovaných) webových aplikacích. Tehdy se používají konkurenční databáze, například PostgreSQL nebo Oracle. Přesto je však třeba říci, že MySQL vyhoví ve většině případů. [7] Díky své licenci a rychlosti je v poslední době téměř nejoblíbenějším systémem. MySQL je malý, rychlý a jednoduchý databázový systém. [7] 16

3.2.2 phpmyadmin Pro práci s databází jsem využil volně dostupný nástroj phpmyadmin. Jedná se o programový systém napsaný v jazyce PHP, který umožňuje jednoduchou správu obsahu databáze MySQL prostřednictvím webového rozhraní. V současné době umožňuje vytvářet nebo rušit databáze, vytvářet, upravovat nebo rušit tabulky, provádět SQL příkazy a spravovat klíče. Jedná se o jeden z nejpopulárnějších nástrojů pro správu databáze. Navíc je k dispozici v 57 jazycích. [8] Obrázek 3 - Náhled nástroje phpmyadmin 17

3.3 Použité volně dostupné nástroje Ve své práci jsem použil několik volně dostupných nástrojů. Většina z nich mi umožnila rozšířit základní funkce programovacích jazyků a vyřešit problémy, které by při použití jiného způsobu byly složité a pracné. 3.3.1 mpdf export dat do PDF Aby bylo možné exportovat data ze systému do PDF, musel jsem využít externích knihoven, které tuto funkci podporují. Jako výchozí jsem zvolil knihovny mpdf, jedná se v podstatě o soubor PHP tříd a funkcí, které umožňují generovat PDF soubory z HTML kódu kódovaném v UTF-8. Knihovny mpdf jsou pod licencí GNU GPL, což je všeobecná veřejná licence. Tento nástroj je dostupný na oficiálních stránkách: http://www.mpdf1.com/mpdf/index.php [2014-05-15] 3.3.2 PHPMailer posílání emailů Pro posílání novinek klientům bylo nutné zajistit odesílání emailů ve formátu HTML, to znamená, aby se klientům zobrazil email jako internetová stránka. Jako výchozí nástroj jsem zvolil PHPMailer. Je to vlastně soubor PHP tříd a funkcí, které umožňují posílat emaily přes poštovní server SMTP. Nástroj PHPMailer je pod licencí GNU LGPL, což je licence svobodného softwaru. Tento nástroj je dostupný na oficiálních stránkách: http://phpmailer.worxware.com/ [2014-05-15] 18

3.3.3 Horizontální menu v CSS Při tvorbě stránek jsem využil online nástroje pro tvorbu CSS menu. Tento nástroj je dostupný na adrese: http://cssmenumaker.com/css-menus [2014-05-15] Pomocí tohoto nástroje lze přímo v internetovém prohlížeči vytvořit horizontální menu pomocí kaskádových stylů. Menu je pak možné zdarma stáhnout do počítače a následně použít pro webové stránky. Menu samozřejmě obsahuje i rozbalovací menu. Po drobných úpravách moje vytvořené menu vypadá následovně. Obrázek 4 - Horizontální menu v CSS 19

3.3.4 Kalendář v JavaScriptu V systému jsem použil JavaScriptový kalendář, který zjednodušuje práci s datem, uživatel nemusí pracně zadávat datum a hlídat správný formát. Tento kalendář je použit všude tam, kde se pracuje s datem. Jedná se o volně stažitelný JavaScriptový kalendář s licencí GNU GPL, což je všeobecná veřejná licence. Obrázek 5 - JavaScriptový kalendář Tento kalendář je dostupný na oficiálních stránkách: http://javascriptcalendar.org/ [2014-05-15] Kalendář je původně v anglickém jazyce, proto jsem ho pro použití musel přeložit do českého jazyka. Dále přes CSS jsem upravil jeho vzhled, aby zapadal do celkového vzhledu systému. 20

3.4 Vývojová prostředí Hlavními nástroji pro vývoj systému, tedy webových stránek, byly pro mě programy Adobe Dreamweaver, Adobe Illustrator a Adobe Photoshop. Jedná se o komerční programy, které jsou licencovány, jsou však dostupné jako trial verze na 30 dní. Adobe Dreamweaver je kompletní vývojové prostředí, pro vývoj webových aplikací, podporující HTML, XHTML, CSS, integraci pro Ajaxový framework Spry a framework PhoneGap, práci se Subversion a mnoho dalších funkcionalit. Jedná se v podstatě o textový editor, který má spoustu rozšířených funkcí, takže ho lze použít i pro psaní PHP a JavaScriptu. Dostupností pokrývá platformu MS Windows a Mac OSX. Dreamweaver byl do verze 8.0 vyvíjený společností Macromedia a následně převzatý společností Adobe Systems, která jej vyvíjí od verze 9.0 do aktuální verze CS6. [9] Toto vývojové prostředí jsem si velice oblíbil, protože dokáže velmi zjednodušit práci při vývoji stránek. V tomto programu lze zobrazit zároveň zdrojový kód a samotné stránky v reálném čase. To znamená, že při psaní kódu lze vidět ihned výsledné změny a celkový náhled stránek. Program nedokáže přímo zpracovávat PHP, ale při připojení PHP serveru to lze. Mezi další výhody patří odlišení kódu pomocí různě barevného textu, což je výborné pro přehlednost celého zdrojového kódu. Program umí napovídat, takže není nutné psát všechen zdrojový kód ručně, stačí například prvních pár písmenek tagu a program nabídne dokončení sám. Pro vytvoření všech grafických prvků jsem využil nástroje Adobe Illustrator a Adobe Photoshop. Tyto mocné nástroje jsou vhodné na vektorovou a bitmapovou grafiku. Pro mé účely bohatě vystačily. 21

3.5 Instalace serveru pomocí XAMPP Aby bylo možné na lokálním počítači provozovat PHP a MySQL, musel jsem využít nástroj, který by toto umožnil. K tomuto účelu jsem využil volně dostupný nástroj XAMPP s licencí GNU GPL (všeobecná veřejná licence). Jedná se o balíček obsahující instalace MySQL databáze, serveru Apache s PHP a spoustu dalších balíčků. Pro mé účely jsou důležité balíčky MySQL a Apache s PHP. Pomocí tohoto nástroje lze snadno a rychle zprovoznit lokální server, na kterém poběží PHP a MySQL. [10] S tímto nástrojem mám dlouhodobé pozitivní poznatky a zkušenosti. Je to výborný nástroj pro tyto účely. Celý informační systém jsem provozoval a testoval pomocí tohoto nástroje. Za celou dobu jsem se nesetkal se žádným problémem nebo nefunkčností. Je to opravdu mocný nástroj pro vytvoření serveru na lokálním počítači. Tento nástroj je možné najít na: https://www.apachefriends.org/index.html [2014-05-15] Při instalaci a nastavení jsem se řídil tímto návodem: http://www.webzpravodaj.cz/xampp-navod/ [2014-05-15] Obrázek 6 - Náhled programu XAMPP 22

4 Realizace 4.1 Návrh řešení Nejprve jsem vycházel z požadavků firmy. Jako nejvíce přijatelné pro tento konkrétní případ informačního systému mi přišlo, jak už bylo nejednou řečeno, webové rozhraní respektive webové stránky. Důvodů bylo hned několik. U webových stránek lze vytvořit libovolný grafický design neboli GUI (grafické uživatelské rozhraní). To je velká výhoda. Propojení s databází je také velmi jednoduché. Navíc lze snadno webové stránky sdílet v lokální síti. U webu není problém s autentifikací uživatele neboli s ověřením údajů, což napomáhá k zabezpečení. Všechny tyto výhody bez problému pokryjí všechny požadavky na systém, které firma požadovala. V neposlední řadě byly také důvodem dlouhodobé zkušenosti v tomto oboru. 4.2 Možnosti řešení Nemohu říci, že webové stránky jsou jediným možným způsobem, jak vytvořit informační systém. Dal by se implementovat například i pomocí formulářové aplikace běžící na platformě Windows. Určitě by se našlo i více způsobů, ale jak už bylo napsáno, dal jsem přednost vlastním dlouhodobým zkušenostem v tomto oboru. 4.3 Návrh GUI grafické uživatelské rozhraní Jelikož neexistoval žádný předchozí systém ani žádné rozhraní, musel jsem celé grafické rozhraní navrhnout od začátku. Postupoval jsem tak, že jsem vycházel z hlavních požadavků a funkcionality. Musel jsem navrhnout řešení, jakým způsobem jednotlivá data prezentovat a následně s nimi pracovat. Velký důraz jsem kladl hlavně na jednoduchost a přehlednost celého systému, uživatel vždy musí vědět, co a kde najít a jak správně postupovat. Ovládání musí být jednoduché a jasné, nesmí se stát, že uživatel v některém bodě nebude vědět jak pokračovat. Rozložení a grafický návrh stránek zabral spoustu času a bohužel se to neobešlo bez zpětného zásahu do celého designu. Ale mohu říci, že se mi celkový optimální návrh stránek nakonec povedl. Na následujícím obrázku je vidět celkový pohled na GUI informačního systému. Vycházel jsem z firemních barev. 23

Obrázek 7 - Náhled grafického uživatelského rozhraní 24

4.4 Datový model Celý systém tvoří 5 tabulek, jak již bylo řečeno. Hlavní tabulky jsou Firmy, Klienti a Zakázky. Tyto tabulky souvisí přímo s hlavní podstatou informačního systému. Tabulky Uživatelé a Historie přihlášení souvisí s přístupem do tohoto systému. Veškerá práce při tvorbě všech tabulek a jejich atributů probíhala pomocí nástroje phpmyadmin. Následuje popis jednotlivých tabulek a jejich atributů. 4.4.1 Tabulka Firmy Obrázek 8 - Tabulka Firmy Tabulka Firmy obsahuje informace o firmách. Primárním klíčem je zde id_firmy, který má navíc nastavenou hodnotu AUTO_INCREMENT pro automatické navyšování hodnoty typu celé číslo. Tabulka neobsahuje žádný cizí klíč. Ostatní atributy se týkají obecných informací o firmě a jsou zřejmé z názvu atributu. 25

4.4.2 Tabulka Klienti Obrázek 9 - Tabulka Klienti Tabulka Klienti obsahuje informace, které se týkají klientů. Klient je v podstatě zákazník, který si objednává služby a vytváří objednávky. Primárním klíčem je zde id_klienta, který má navíc nastavenou hodnotu AUTO_INCREMENT pro automatické navyšování hodnoty typu celé číslo. Navíc obsahuje cizí klíč id_firmy, kterým lze určit, v jaké firmě je klient zaměstnán. Z této struktury vyplývá, že jeden klient může být zaměstnán pouze u jedné firmy. V jedné konkrétní firmě však může být zaměstnáno více klientů. Ostatní atributy se týkají základních informací o klientovi a jsou zřejmé z názvu. Atribut novinky_klient určuje, zda se klientovi mohou odesílat novinky emailem či nikoliv. 26

4.4.3 Tabulka Zakázky Obrázek 10 - Tabulka Zakázky Tabulka Zakázky je ze všech tabulek nejrozsáhlejší. Obsahuje informace o klientovi a o jeho firmě, navíc obsahuje rozsáhlé informace o zakázce. Primárním klíčem je zde id_zakazky, který má navíc nastavenou hodnotu AUTO_INCREMENT pro automatické navyšování hodnoty typu celé číslo. Jsou zde obsaženy dva cizí klíče id_klienta_zakazky a id_firmy_zakazky, oba tyto klíče se přebírají z konkrétního klienta. Při vytváření zakázky se do této tabulky kopírují také některá podstatná data z tabulky firmy a klienti, je to z toho důvodu, že když dojde ke smazání firmy nebo klienta z databáze, tak zůstanou data u zakázky neporušena, v zakázce tedy i po smazání firmy nebo klienta, související s touto zakázkou, zůstanou některá důležitá původní data. Kdyby tomu tak nebylo, při smazání firmy nebo klienta by ztratila zakázka význam. Je ale zřejmé, že pokud k tomu dojde, cizí klíče pak ztratí svůj význam, dalo by se tedy říci, že jsou v tabulce cizí klíče nadbytečné, ale opak je pravdou. Programově se totiž na ně odkazuje, i když neexistují, vše je ošetřeno programem. 27

4.4.4 Tabulka Uživatelé Obrázek 11 - Tabulka Uživatelé Tabulka Uživatelé obsahuje informace o uživatelích, kteří mají přístup do systému. Primárním klíčem je zde id_uzivatele, který má navíc nastavenou hodnotu AUTO_INCREMENT pro automatické navyšování hodnoty typu celé číslo. V této tabulce není obsažen žádný cizí klíč. Z názvu atributů je zřejmé, jaké informace uchovávají. Atribut pravo určuje typ uživatele, tedy zda se jedná o administrátora nebo o běžného uživatele. Atribut heslo je samozřejmě v šifrované podobě z důvodu bezpečnosti, je popsáno později. 4.4.5 Tabulka Historie Obrázek 12 - Tabulka Historie Tabulka Historie je ze všech tabulek nejjednodušší, má informativní charakter. Má za úkol uchovávat data o přihlášených uživatelích, takže sleduje přístup do systému. Neobsahuje primární klíč, pouze cizí klíč id_uzivatele, který souvisí s tabulkou Uživatelé. Obsahuje jména uživatelů, kteří se do systému přihlásí, jejich právo, id, datum a čas. 28

4.4.6 Vztahy mezi tabulkami Vztahy mezi tabulkami znázorňuje následující obrázek. Význam je popsán níže. Obrázek 13 - Vztahy mezi tabulkami Vztah mezi Firmami a Klienty: - firma může mít 0 nebo více klientů - klient může mít pouze jednu firmu Vztah mezi Klienty a Zakázkami: - klient může mít 0 nebo více zakázek - zakázka může mít pouze jednoho klienta Vztah Uživatelé a Historie: - uživatel může mít více záznamů v historii - záznam historie přísluší jednomu uživateli 29

4.5 Zabezpečení Zabezpečení je jeden z nejdůležitějších úkonů obecně, ať už jde o ochranu dat nebo osobních informací. Ani tento systém se bez určitého zabezpečení neobejde. 4.5.1 Zabezpečení stránek Informace pro tuto kapitolu jsem čerpal z webových stránek. [11] Pro zabezpečení stránek respektive systému jsem zvolil metodu přihlašování uživatelů pomocí jména a hesla. Zabezpečit takto webové stránky lze několika způsoby, například pomocí cookies nebo session. Já jsem osobně zvolil session, protože s nimi mám již zkušenosti a v praxi se mi osvědčily. Session jsou proměnné v PHP, které se ukládají přímo do souboru na serveru. Přistupovat k nim lze přes pole proměnných $_SESSION, z toho vyplývá, že těchto proměnných může být více. Na rozdíl od cookies je tato metoda spolehlivější, protože spousta uživatelů cookies v prohlížečích zakazuje a tím zabraňují správné funkčnosti. Dále je popsán princip funkce session, z důvodu bezpečnosti zde neuvádím přímo zdrojové kódy ze systému, ale pouze náznak principu funkce, který je o něco málo jednodušší, avšak podstata je zachována. 4.5.2 Funkce session v PHP Pokud uživatel zadá správné přihlašovací údaje při vstupu do systému, zavolá se funkce session_start(), která umožní využívat proměnné session. Navíc je nutné nastavit vlastní správu cachování (vyrovnávací paměť) příkazem header("cache-control: private"). Pak už stačí vytvořit proměnnou session a nastavit jí hodnotu. Proměnných session může být více, jak bylo řečeno. V ukázce kódu je vytvořena jedna proměnná session s názvem uzivatel_prihlasen a následně nastavena na hodnotu 1 (jedna), tato hodnota může být libovolné číslo nebo řetězec. Poté se zavolá příslušná úvodní chráněná stránka. Následuje ukázka kódu v HTML a PHP. 30

4.5.3 Soubor prihlasovaci_formular.html Tento soubor obsahuje jednoduchý formulář s přihlašovacími políčky. Obrázek 14 - Ukázka jednoduchého přihlašovacího formuláře 4.5.4 Soubor prihlaseni.php V tomto souboru se kontrolují data předávaná z formuláře (předchozí soubor). Obrázek 15 - Náhled kontroly přihlašovacích dat z formuláře 31

4.5.5 Soubor kontrola.php Každá stránka, která má být chráněná pomocí session, musí obsahovat testování přihlášení uživatele, to lze provést importováním tohoto souboru pomocí PHP příkazu require( kontrola.php ). V následujícím kódu se testuje, zda je proměnná session s názvem uzivatel_prihlasen nastavena na hodnotu 1 (jedna), pokud není, zavolá se opět stránka s přihlašovacím formulářem (soubor prihlasovaci_formular.html). Obrázek 16 - Náhled kontroly přihlášení uživatele 32

4.5.6 Soubor odhlaseni.php Aby bylo možné odhlásit uživatele, je nutné zrušit vytvořené session, to umožňuje funkce session_destroy(). Následný kód zruší vytvořené session a ověří, zda došlo ke konkrétnímu ukončení session, pokud ano, přejde se na přihlašovací stránku, jinak se vypíše upozornění. Obrázek 17 - Náhled zrušení session = odhlášení uživatele 33

4.5.7 Zabezpečení osobních údajů Přístup do systému mají pouze registrovaní uživatelé se jménem a heslem, jak již bylo řečeno. Je zřejmé, že se tyto údaje musejí ukládat do databáze. Jelikož je heslo citlivý osobní údaj, je potřeba ho nějakým způsobem šifrovat, aby nebylo heslo v databázi přímo čitelné, například v případě nepovoleného vniknutí do databáze nebo odcizením dat. Pro šifrování hesla jsem použil následující PHP funkce respektive algoritmy: SHA1 (Secure Hash Algorithm) a MD5 (Message-Digest algorithm) jsou to rozšířené hašovací funkce, které vytváří ze vstupních dat zašifrovaný výstup fixní délky. Jejich hlavní vlastností je, že malá změna na vstupu vede k velké změně na výstupu, tedy k vytvoření zásadně odlišného výsledku. [12] Kombinací těchto dvou funkcí (algoritmů) a přidáním libovolného řetězce k heslu jsem vytvořil šifrované heslo. Při registraci uživatele (může pouze administrátor) se k zadanému heslu ve formuláři přidá libovolný předem nadefinovaný řetězec, který zvýší bezpečnost, následně se tento výstup předá funkci SHA1 a výsledek této funkce se ještě předá další funkci MD5. Celkovým výsledkem tohoto procesu je šifrované heslo, které už lze uložit do databáze. PHP kód zašifrování hesla vypadá následovně: Obrázek 18 - Postup šifrování hesla Při přihlášení uživatele je použit stejný postup, kde se výsledek šifrovaného hesla porovnává s heslem v databázi. 34

4.6 Export do PDF Jak už bylo řečeno, pro export dat do souboru ve formátu PDF jsem využil knihovny mpdf. Tyto knihovny umožňují převést HTML kód do formátu PDF. 4.6.1 Postup převodu dat ze systému do PDF - vyberou se data z databáze, která mají být ve výsledném souboru PDF - připraví se knihovna mpdf a nastaví se všechny potřebné parametry - naimportuje se pozadí šablony, což je vlastně objednávka v elektronickém formátu obrázku - poté se vytvoří HTML kód (stránka), do které se vloží data z databáze, je nutné je pomocí kaskádových stylů CSS umístit tak, aby odpovídala šabloně, protože šablona má formát tabulky a data musí být vložena a vyplněna v konkrétních kolonkách - nakonec dojde k vytvoření celého souboru ve formátu PDF 4.6.2 Programová ukázka převodu dat do PDF Při vytváření PDF souboru dochází k výběru mnoha dat z databáze. Využívá se dat z tabulky Zakázky, která obsahuje i data z tabulek Firmy a Klienti. Způsob celkové přípravy dat k exportu obsahuje zhruba 1000 řádků zdrojového kódu. V systému jsou implementovány 2 druhy exportu dat, které se liší výsledným vzhledem PDF a použitými doplňujícími informacemi. Na následujícím obrázku je způsob, jakým se převádí HTML kód do formátu PDF ve zdrojovém kódu. 35

Obrázek 19 - Programová ukázka převodu HTML do PDF 36

4.6.3 Celkový náhled výstupu PDF Zde je celkový náhled výsledného souboru PDF, ve kterém jsou obsažena veškerá důležitá data z databáze včetně informací, které se vyplňují do pomocných formulářů před exportováním dat do PDF. Tyto doplňující formuláře jsou přístupné v uživatelském rozhraní. Obrázek 20 - Celkový náhled výstupu PDF 37

4.7 Odesílání novinek Pro odesílání novinek jsem využil již zmíněný nástroj PHPMailer, který umožňuje odesílat emaily ve formátu HTML. Pro správnou funkci je nutné použít existující SMTP server, který se nastavuje v konfiguračním souboru. Firma svůj vlastní SMTP server má, takže stačilo nastavit příslušné parametry v konfiguračním souboru. V uživatelském rozhraní je pro odesílání novinek připraven formulář, ve kterém se zadávají potřebné údaje pro posílání emailů, jako je předmět, text a další, navíc se v tomto formuláři vybírá i soubor s novinkou. Hlavní myšlenka je taková, že si uživatel připraví grafický soubor s novinkou, například ve formátu JPEG, PNG, GIF, kterou pak s dalšími údaji odešle určeným klientům v databázi jako email. Takto odeslaný email se u klienta zobrazí jako internetová stránka, která obsahuje data z formuláře (předmět, textový obsah, atd.) a jako hlavní prvek již zmíněnou grafickou novinku. 4.7.1 Postup pro posílání novinek: - uživatel si předem připraví grafický soubor s novinkou ve formátu JPEG, PNG nebo GIF, je vhodné volit kompresní formáty a rozumné rozlišení, aby byla velikost souboru co nejmenší - pomocí formuláře vyplní potřebná data a vybere soubor s novinkou - poté může otestovat funkčnost odesláním zkušebního emailu na ním zadanou adresu nebo přímo odeslat novinky všem klientům, kteří mají povolené zasílání novinek 38

4.7.2 Programová ukázka odesílání emailu Zde je náhled principu odesílání emailu ve zdrojovém kódu. V komentářích jsou popsány jednotlivé významy použitých proměnných a funkcí. Obrázek 21 - Programová ukázka odesílání emailu 39

4.8 Grafické uživatelské rozhraní (GUI) Poznámka: Veškerá práce v grafickém uživatelském rozhraní je popsána v příručce, kterou přikládám v příloze. V této kapitole lehce naznačím základní práci se systémem, je zde i několik náhledů ve formě zachycených snímků obrazovky. Podrobný popis všech funkcí a ovládání webu je popsáno ve zmíněné příručce. 4.8.1 Přihlašovací obrazovka Přihlašovací stránka do systému obsahuje jednoduchý formulář, do kterého uživatel zadává jméno a heslo. Bez těchto údajů nelze pracovat v systému. Obrázek 22 - Náhled přihlašovací stránky 40

4.8.2 Rozvržení hlavní stránky Po úspěšném přihlášení do systému se zobrazí hlavní stránka, kterou lze rozdělit do 4 hlavních oddílů. Obrázek 23 - Náhled hlavní stránky Oddíl 1 Základní informace - V tomto oddílu se zobrazují základní informace o uživateli, konkrétně jeho přihlašovací jméno a typ práva (administrátor nebo běžný uživatel). Dále se zde nachází aktuální datum a čas, které mají pouze informativní charakter pro uživatele, v poslední řadě je zde i logo firmy. Celý tento oddíl je statický a nemění se. Oddíl 2 Hlavní menu - Tento oddíl obsahuje panel s hlavní nabídkou, pomocí kterého může uživatel ovládat a pracovat se systémem. Některé položky obsahují rozbalovací menu. Je také statický a nemění se. 41

Oddíl 3 Filtrování a vyhledávání dat - V této části se zobrazuje formulář pro třídění a vyhledávání dat. Ten umožňuje vyfiltrovat a vyhledávat data podle zadaných kritérií. Uživatel má tak možnost rychle zobrazit data, která momentálně potřebuje. Tento oddíl není statický. Formuláře jsou různé pro každou oblast dat, například pro firmy nebo klienty. Formulář třídění a vyhledávání zobrazený na předchozím obrázku se vztahuje k zakázkám. Oddíl 4 Zobrazení dat - V tomto oddílu se zobrazují příslušná data z databáze, která vyhovují kritériím z formulářů pro třídění. Jednotlivé položky se zobrazují v tabulce jako seznam. Každá oblast má svůj specifický výpis dat, takže se tento oddíl mění. Na předchozím obrázku jsou zakázky, které byly již vloženy do systému. 4.8.3 Ukázka vložení dat Zde je ukázán postup při vkládání dat respektive vytvoření úplné zakázky. Ostatní akce jako upravování, mazání atd. jsou popsány v příručce. Jedná se celkem o 3 kroky: - Vložení firmy - Vložení klienta - Vytvoření zakázky Následují ukázky obrazovek s konkrétními daty (data jsou smyšlená). 42

1. Nejprve vytvoříme firmu. (menu Nastavení / Správa firem / Vložit novou firmu) Obrázek 24 - Vložení firmy do databáze 43

2. Poté vytvoříme klienta a ze seznamu firem vybereme vytvořenou firmu z 1. kroku. (menu Nastavení / Správa klientů / Přidat klienta) Obrázek 25 - Vložení klienta do databáze 44

3. Nakonec vytvoříme zakázku, u které vybereme klienta z 2. kroku. (menu Nastavení / Správa zakázek / Přidat zakázku nebo na hlavní stránce Přidat novou zakázku) Obrázek 26 - Vložení zakázky do databáze 45

Námi vložená zakázka: Obrázek 27 - Podrobný přehled zakázky 4.8.4 Ukázka exportu s konkrétními daty Pro ukázku exportu dat do PDF využiji předchozí obrázek zakázky v podrobném přehledu. Na tomto obrázku se v pravé horní části zobrazuje nabídka zakázky, která obsahuje položky Průvodka, Upravit a Smazat. Export dat se skrývá právě pod položkou Průvodka. Kliknutím na tuto položku se zobrazí formulář, do kterého je možné vložit doplňující informace. Tyto informace pak budou součástí exportovaného souboru. Součástí formuláře jsou 2 tlačítka, jedno umožňuje zobrazit PDF přímo v internetovém prohlížeči, pokud tuto vlastnost má, druhé tlačítko dovoluje uložit PDF do počítače. Na následujícím obrázku je zobrazen doplňující formulář s příkladem vyplnění dat. 46

Obrázek 28 - Doplňující formulář pro export dat Následuje ukázka výsledného souboru PDF, ve kterém jsou data z doplňujícího formuláře a navíc z předešlé kapitoly. 47

Obrázek 29 - Náhled PDF s konkrétními daty 48

4.8.5 Odesílání novinek Pro odesílání novinek je v systému implementován jednoduchý formulář, který je dostupný přes menu Novinky. Formulář vypadá následovně. Tento formulář obsahuje několik políček, jejich význam je zřejmý z názvu. Obrázek 30 - Formulář pro odesílání novinek 49

4.9 Struktura adresáře a statistika - kořenový adresář obsahuje okolo 65 souborů s vlastním zdrojovým kódem, když nepočítám externí knihovny a nástroje - na web jsem použil celkem 72 obrázků vlastní tvorby - velikost celého systému včetně knihoven a nástrojů je okolo 37 MB - celkový počet souborů je 706 a 43 složek včetně knihoven a nástrojů - celkový vlastní zdrojový kód obsahuje okolo 9110 řádků Obrázek 31 - Struktura kořenového adresáře 50

5 Testování Systém byl testován již při jeho vývoji. Jelikož celý informační systém běží na lokálním serveru, který byl vytvořen pomocí zmíněného nástroje XAMPP, bylo jeho testování jednoduché a navíc možné v reálném čase. Každou novou komponentu, funkci nebo vlastnost jsem ihned testoval, zda správně funguje. Stejně tomu bylo při vývoji grafického návrhu stránek. Při testování databáze jsem využíval reálná data, takže jsem měl přehled, zda se data správně ukládají, zobrazují, editují a mažou. Samotný systém je navržen tak, aby bylo zamezeno vkládání nesprávných dat, jinak řečeno je blbuvzdorný. To znamená, že systém si sám hlídá, jaká data uživatel zapisuje do příslušných kolonek a zda jsou ve správném formátu. Pokud některá z dat nebudou korektní, systém vypíše chybu s upozorněním co je špatně. Systém hlavně testuje správný formát dat, jako je datum, email nebo telefonní kontakt, navíc testuje, zda jsou vyplněny povinné položky, které nesmí být prázdné. Není tedy možné například vložit firmu bez názvu, klienta bez jména a příjmení atd., také nelze do data zapsat jiný formát než je daný, to platí i pro email a telefonní kontakt. Většinu z těchto kontrol má na starost JavaScript, v některých případech je ošetření přímo v PHP. Jelikož jsem do firmy zavedl testovací verzi systému, měl jsem pro testování i zpětnou vazbu přímo od firmy, takže bylo možné ihned reagovat na chyby a nedostatky, které jsem mohl upravit přímo na míru. Systém byl odladěn v internetovém prohlížeči Mozilla Firefox ve verzi 26.0. Testován byl i na nejnovější verzi 29.0.1 [2014-05-09]. Avšak problém s funkčností by neměl být ani u jiných internetových prohlížečů s podporou JavaScriptu. 51

6 Závěr 6.1 Splnění cílů a požadavků Cílem mé práce bylo vytvořit informační systém pro správu zakázek podle zadaných požadavků firmy Art21, s. r. o. Všechny tyto požadavky firmy se mi podařilo úspěšně dodržet. Informační systém byl navržen jako webové stránky, přes které je možné celý systém ovládat. Celý informační systém vyžadoval kompletní návrh od začátku, vzhledem k tomu, že doposud ve firmě žádný informační systém nebyl implementován a ani firma neměla s žádným jiným informačním systémem zkušenosti. Bylo tedy nutné navrhnout jak grafické uživatelské rozhraní, tak databázový model a celkovou funkcionalitu podle požadavků firmy. Při vývoji systému jsem musel využít několik programovacích jazyků a volně dostupných nástrojů, které mi zjednodušily práci. Především programovací jazyky jako PHP, HTML, JavaScript a CSS a nástroje mpdf, PHPMailer, JavaScriptový kalendář a další. Pro uchovávání dat bylo nutné zvolit nějaký databázový systém, v mém případě MySQL. Mezi hlavní přednosti systému patří kompletní správa nad daty, jako je ukládání, zobrazování, upravování a mazání. Navíc je v systému implementována funkce pro exportování dat do formátu PDF a funkce pro odesílání emailů klientům ve formátu HTML. 6.2 Problémy a jejich řešení Prvním problémem, se kterým jsem se při vývoji setkal, bylo to, že jsem musel vytvořit celé uživatelské rozhraní tak, aby splňovalo veškeré požadavky a zároveň bylo uživatelsky přívětivé, jednoduché a s moderním designem. Dalším problémem bylo navrhnout databázový model tak, aby vztahy mezi tabulkami a jejich data byla jednoznačná a odpovídala realitě. S daty pak úzce souviselo jejich třídění a vyhledávání pomocí formulářů v systému. Celkově tyto problémy zahrnovaly spoustu testování a změn, což bylo na úkor času a úsilí. Nakonec však mohu říci, že jsem tyto problémy úspěšně vyřešil a povedlo se mi najít optimální řešení. 52

Další věcí, které bylo nutné vyřešit, byl přístup do systému. Musel jsem navrhnout takové řešení, aby se do systému nemohl dostat každý a data tak byla v bezpečí. To jsem vyřešil tak, že do systému se lze přihlásit pod uživatelským jménem a heslem, které do systému může zadat administrátor. A aby při přihlášení nedocházelo k nečekaným změnám v systému, zvolil jsem 2 druhy oprávnění uživatelů, konkrétně administrátor a běžný uživatel, které mají odlišné způsoby manipulace s daty a ovládání systému. Pro export dat do PDF jsem musel využít externích knihoven, protože samotné PHP touto funkcí nedisponuje. Tuto funkcionalitu mi umožnil nástroj mpdf. Po nastudování manuálu se mi s pomocí tohoto nástroje povedlo vytvořit funkci pro exportování dat z databáze do elektronické podoby. Další nástroj, který jsem do systému použil, byl PHPMailer, který mi umožnil vytvořit z HTML kódu šablonu pro emaily, které lze pak odesílat klientům. Samotné PHP má funkci pro odesílání emailů, avšak není tak propracovaná a neumožňuje tolik funkcí a možností. Díky těmto nástrojům lze v systému využívat zmíněné pokročilé funkce. Co se týče samotného psaní zdrojového kódu, dbal jsem na obecné zásady, jako je přehlednost kódu, psaní komentářů a vysvětlivek k jednotlivým funkcím. Snažil jsem se o co nejjednodušší kód, například při využívání určitého kódu několikrát v celém systému, jsem pro tento kód využil funkci, kterou je možné volat několikrát v různých částech a která je definována pouze jednou v jednom souboru. Jako příklad mohu uvést funkci pro převod data z databáze ve formátu RRRR-MM-DD do formátu DD.MM.RRRR (z 2014-05-17 do 17.05.2014), který se pak zobrazuje v uživatelském rozhraní. Podobných funkcí je v systému implementováno několik. Navíc jsem se snažil rozdělit zdrojový kód podle jeho využití do různých souborů, aby při případné změně nebo rozšíření tohoto kódu bylo možné co nejrychleji vyhledat konkrétní zdrojový kód nebo funkci. 6.3 Možnosti rozšíření a další pokračování I když je systém ve finální verzi, která je schopná plného provozu, nic nebrání dalšímu vývoji. Ve firmě je v této finální verzi systém již zaveden. Podle požadavků firmy lze ale tento systém bez problémů rozšířit o další funkce a vlastnosti. V současné době se však o jeho rozšíření zatím neuvažuje 53

Seznam použité literatury [1] PHP. ŠTRÁFELDA, Jan. ADAPTIC S.R.O. Adaptic [online]. [cit. 2014-05-15]. Dostupné z: http://www.adaptic.cz/znalosti/slovnicek/php/ [2] HTML. Artic Studio: tvorba internetových stránek [online]. 2011 [cit. 2014-05-15]. Dostupné z: http://www.artic-studio.net/slovnicek-pojmu/jazyk-html/ [3] JavaScript. Jak psát web [online]. 2014 [cit. 2014-05-15]. Dostupné z: http://www.jakpsatweb.cz/javascript/javascript-uvod.html [4] JavaScript. ŠTRÁFELDA, Jan. ADAPTIC S.R.O. Adaptic [online]. [cit. 2014-05-15]. Dostupné z: http://www.adaptic.cz/znalosti/slovnicek/javascript/ [5] CSS styly. Tvorba webu [online]. [cit. 2014-05-15]. Dostupné z: http://www.tvorbawebu.cz/css/ [6] MySQL. ŠTRÁFELDA, Jan. ADAPTIC S.R.O. Adaptic [online]. [cit. 2014-05-15]. Dostupné z: http://www.adaptic.cz/znalosti/slovnicek/mysql/ [7] MySQL. Artic Studio: tvorba internetových stránek [online]. 2011 [cit. 2014-05-15]. Dostupné z: http://www.artic-studio.net/slovnicek-pojmu/databaze-mysql/ [8] PhpMyAdmin. Wikipedie [online]. 2014 [cit. 2014-05-15]. Dostupné z: http://cs.wikipedia.org/wiki/phpmyadmin [9] Adobe Dreamweaver. Wikipedie [online]. 2014 [cit. 2014-05-15]. Dostupné z: http://cs.wikipedia.org/wiki/adobe_dreamweaver [10] Návod XAMPP. WebZpravodaj [online]. 2013 [cit. 2014-05-15]. Dostupné z: http://www.webzpravodaj.cz/234-xampp-navod-server-ve-vlastnim-pocitaci/ [11] Sessions v PHP. Jary.borec.cz [online]. [cit. 2014-05-15]. Dostupné z: http://jary.borec.cz/prog/sessions.php [12] MD5 a SHA1. Wikipedie [online]. 2014 [cit. 2014-05-15]. Dostupné z: http://cs.wikipedia.org/wiki/md5 54

Seznam obrázků Obrázek 1 - Zjednodušené schéma propojení tabulek... 12 Obrázek 2 - Princip vytváření dat... 13 Obrázek 3 - Náhled nástroje phpmyadmin... 17 Obrázek 4 - Horizontální menu v CSS... 19 Obrázek 5 - JavaScriptový kalendář... 20 Obrázek 6 - Náhled programu XAMPP... 22 Obrázek 7 - Náhled grafického uživatelského rozhraní... 24 Obrázek 8 - Tabulka Firmy... 25 Obrázek 9 - Tabulka Klienti... 26 Obrázek 10 - Tabulka Zakázky... 27 Obrázek 11 - Tabulka Uživatelé... 28 Obrázek 12 - Tabulka Historie... 28 Obrázek 13 - Vztahy mezi tabulkami... 29 Obrázek 14 - Ukázka jednoduchého přihlašovacího formuláře... 31 Obrázek 15 - Náhled kontroly přihlašovacích dat z formuláře... 31 Obrázek 16 - Náhled kontroly přihlášení uživatele... 32 Obrázek 17 - Náhled zrušení session = odhlášení uživatele... 33 Obrázek 18 - Postup šifrování hesla... 34 Obrázek 19 - Programová ukázka převodu HTML do PDF... 36 Obrázek 20 - Celkový náhled výstupu PDF... 37 Obrázek 21 - Programová ukázka odesílání emailu... 39 Obrázek 22 - Náhled přihlašovací stránky... 40 Obrázek 23 - Náhled hlavní stránky... 41 Obrázek 24 - Vložení firmy do databáze... 43 Obrázek 25 - Vložení klienta do databáze... 44 Obrázek 26 - Vložení zakázky do databáze... 45 Obrázek 27 - Podrobný přehled zakázky... 46 Obrázek 28 - Doplňující formulář pro export dat... 47 Obrázek 29 - Náhled PDF s konkrétními daty... 48 Obrázek 30 - Formulář pro odesílání novinek... 49 Obrázek 31 - Struktura kořenového adresáře... 50 55

Seznam použitých zkratek CSS Cascading Style Sheets GIF Graphics Interchange Format GNU GPL (GNU's Not Unix) General Public License GNU LGPL (GNU's Not Unix) Lesser General Public License GUI Graphic User Interface HTML HyperText Markup Language JPEG Joint Photographic Experts Group MD5 Message Digest 5 MySQL My Structured Query Language PDF Portable Document Format PHP Hypertext Preprocessor PNG Portable Network Graphics SHA1 Secure Hashing Algorithm 1 SMTP Simple Mail Transfer Protocol SMTP Simple Mail Transfer Protocol UTF-8 Unicode Transformation Format W3C World Wide Web Consortium XHTML extensible HyperText Markup Language 56

Přílohy 1 Obsah přiloženého CD Na přiloženém CD se v kořenovém adresáři nachází tato bakalářská práce ve formátu bakalarska_prace.pdf s jednoduchým návodem Příručka_IS_Art21.pdf pro obsluhu systému. 57