České vysoké učení technické v Praze Fakulta elektrotechnická
Bakalářská práce
Webové rozhraní aplikace Evidence majetku Mátl Petr
Vedoucí práce: Doc. RNDr. Josef Kolář, CSc. Studijní program: Elektronika a informatika strukturovaný bakalářský Obor: Informatika a výpočetní technika Srpen 2007
1
2
Poděkování Zde bych rád poděkoval svému vedoucímu práce Doc. RNDr. Josefu Koláři CSc. za čas, který strávil nad touto prací, aby svými radami přispěl k jejímu zlepšení. Dále bych chtěl poděkovat zejména externímu vedoucímu Ing. Peteru Čechovi za jeho cenné rady a připomínky, které mi velice pomohli a to zvláště v začátcích. V poslední řadě děkuji všem svým přátelům, bez kterých bych se tak daleko možná ani nedostal. 3
4
Prohlášení Prohlašuji, že jsem svou bakalářskou práci vypracoval samostatně a použil jsem pouze podklady uvedené v přiloženém seznamu. Nemám závažný důvod proti užití tohoto školního díla ve smyslu §60 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ů (autorský zákon). V Praze dne 15. 8. 007
Abstrakt Tato práce popisuje tvorbu internetové aplikace jakožto grafického rozhraní, které používá databázi MS SQL2005 již vytvořeného programu Evidence majetku, který zefektivňuje proces inventarizace veškerého majetku ve firmách a tato práce veškerý proces ještě zlepšuje. Aplikace byla vyvíjena pomocí technologie společnosti Microsoft .NET Framework 2.0 a jako skriptovací jazyk byl použit jazyk C#.
Abstract This bachelor’s thesis describes the development of an internet application as a graphical interface. This application uses MS SQL2005 database of an already created program “Evidence majetku”, which increases efficiency of stocktaking process of the entire property at companies. This thesis improves the process. The application was developed using Microsoft .NET Framework 2.0 technology, and C# was used as a scripting language.
7
8
Obsah 1 Úvod a cíl práce.........................................................................................................................11 1.1 Úvod do problematiky........................................................................................................ 11 1.2 Cíl práce.............................................................................................................................. 13 2 Analýza problému.....................................................................................................................15 2.1 Výběr programovacího jazyka............................................................................................ 17 2.1.1 Java applet.................................................................................................................. 17 2.1.2 PHP.............................................................................................................................18 2.1.3 ASP.NET.................................................................................................................... 18 2.1.4 Shrnutí........................................................................................................................ 20 2.2 Výběr vývojového prostředí................................................................................................21 2.2.1 Visual Studio 2005..................................................................................................... 21 2.2.2 Visual Web Developer 2005 Express Edition............................................................ 22 2.2.3 Web Matrix.................................................................................................................22 2.2.4 Shrnutí........................................................................................................................ 23 2.3 Závěr analýzy...................................................................................................................... 23 3 Implementace............................................................................................................................ 24 3.1 Základní rozvržení.............................................................................................................. 24 3.2 Vzhled aplikace...................................................................................................................25 3.3 Tabulky............................................................................................................................... 27 3.3.1 Společné znaky a vlastnosti.........................................................................................27 3.3.2 Tabulka “Střediska“.................................................................................................... 31 3.3.3 Tabulka “Místnosti“.................................................................................................... 32 3.3.4 Tabulka “Inventura“.................................................................................................... 32 3.3.5 Tabulka “Osoby“......................................................................................................... 32 3.3.6 Tabulka “Majetek“...................................................................................................... 34 3.3.7 Tabulka “Administrátor“ (User)..................................................................................35 3.4 Autentizace a přístupová práva........................................................................................... 35 3.4.1 Přihlašovací stránka a uložení hesla............................................................................ 35 3.4.2 Uživatelé – přístupová práva a jejich význam.............................................................36 4 Závěr.......................................................................................................................................... 38 5 Literatura.................................................................................................................................. 39 6 Přílohy........................................................................................................................................40 Příloha č. 1 – Uživatelská příručka...................................................................................... 40 Příloha č. 2 – Přiložené CD.................................................................................................. 43
9
Seznam obrázků Obrázek 2.1. Desktopová aplikace Evidence majetku...................................................................15 Obrázek 2.2. Neměnící se pozadí aplikace Evidence Majetku......................................................16 Obrázek 3.1. Rozvržení základních oblastí stránky.......................................................................24 Obrázek 3.2. Webové stránky společnosti KODYS (část úvodní stránky)................................... 26 Obrázek 3.3. Nové logo společnosti KODYS............................................................................... 27 Obrázek 3.4. Tělo stránky – pohled číslo jedna.............................................................................28 Obrázek 3.5. Tělo stránky – pohled číslo dvě................................................................................29 Obrázek 3.6. Tělo stránky – pohled číslo tři..................................................................................30 Obrázek 3.7. Navigační menu........................................................................................................31 Obrázek 3.8. Druhy informací zobrazované na informačním panelu...........................................32 Obrázek 3.9. Panel filtru s tlačítkem pro výběr............................................................................. 32 Obrázek 3.10. Osoby – formulář s cizím klíčem........................................................................... 33 Obrázek 3.11. Tělo stránky s tlačítkem “vyber“............................................................................34 Obrázek 3.12. Majetek – formulář s výběrem datumu.................................................................. 35 Obrázek 3.13. Přihlašovací stránka................................................................................................37
10
1
Úvod a cíl práce
1.1 Úvod do problematiky Aplikace EVIDENCE MAJETKU je program vytvořený firmou KODYS, která se zabývá podnikáním v oboru výpočetní techniky a to zejména technologií čárových kódů. Je to klasická aplikace pracující v prostředí operačního systému MICROSOFT WINDOWS. Pro lepší a přesnější představu o čem má být tato bakalářská práce, je nanejvýš vhodné popsat a pochopit výše zmíněnou aplikaci, která slouží jako jakási předloha pro svojí webovou verzi. Program EVIDENCE MAJETKU je vlastně nástroj, který se stará a pracuje s databází. Pomáhá firmám přehledně a bezpečně kontrolovat a spravovat svůj majetek. Tato databáze obsahuje informace o veškerém majetku firmy (firmou je myšlena jakákoliv organizace, která program EVIDENCE MAJETKU používá – ne jen společnost KODYS). Jednotlivé kusy majetku jsou označeny štítky s čárkovými kódy. Tyto jsou pak přečteny ruční čtečkou čárkových kódů, která se poté připojí k počítači s nainstalovaným programem. Program načte čárkové kódy a uloží do databáze, kterou je samozřejmě možné si prohlížet a v případě dostatečně velkých práv i upravovat. Typický scénář práce a využití programu EVIDENCE MAJETKU je takový, že databáze je naplněná daty. Pracovník firmy, který dělá inventuru majetku, přijde do místnosti s ruční čtečkou čárkových kódů a veškerý majetek uloží do paměti čtečky přiložením senzoru čtečky ke štítku s čárkovým kódem. Poté čtečku připojí k PC stanici. Dále již může jednoduše zkontrolovat, jestli nově načtený majetek souhlasí s majetkem v databázi. A když něco chybí, tak pomocí databáze zjistí, která osoba má danou místnost na starost a tudíž, kdo ponese zodpovědnost. Hlavní částí aplikace je tedy databáze s daty, se kterými program pracuje. Hlavní tabulka, se kterou se pracuje je tabulka MAJETEK, jenž obsahuje jednotlivé kusy majetku, který firma vlastní. Samozřejmě každý kus má své vlastnosti, které jsou také zaznamenávány. Jsou to kromě názvu např. sériové číslo, datum pořízení, pořizovací cena, číslo místnosti, ve které je majetek evidován atd. Další je tabulka INVENTURA, která obsahuje stejná data jako tabulka MAJETEK, s tím rozdílem, že obsahuje položky, které byly načtené z čtečky čárových kódů a poté přenesené do PC stanice. Dále se liší jedním sloupcem s názvem VÝSLEDEK. Ten obsahuje informaci o tom, jestli daný kus majetku je už v databázi obsažen a jestli ano, pak jestli se nějaké jeho atributy liší. Pro lepší pochopení zde uvedu jaké tento sloupec může obsahovat hodnoty – NEINVENTARIZOVÁNO, NALEZENO, PŘEMÍSTĚNO, PŘIDÁNO. Další důležitá tabulka je tabulka STŘEDISKA obsahující informace o střediscích firmy, 11
jestliže má firma více míst, ve kterých eviduje majetek. Tabulka OSOBY obsahuje informace o osobách firmy, které jsou zodpovědné za majetek v jednotlivých střediscích, či dokonce jednotlivých místnostech. Další tabulka má název MÍSTNOSTI, která obsahuje informace o místnostech, ve kterých je jednotlivý majetek evidován. Poslední tři zmiňované tabulky (STŘEDISKA, OSOBY a MÍSTNOSTI) jsou v programu známy jako číselníky. Databáze zahrnuje také tabulku USER, která obsahuje vstupní údaje pro přihlášení jednotlivých uživatelů. Mezi údaje zaznamenané v této tabulce patří název, heslo a informace o rozsahu bezpečnostních oprávnění. Databáze obsahuje ještě další tabulky jako např. ETIKETY, FILTER, ŠABLONY a některé další, které však nebude webová verze programu EVIDENCE MAJETKU v této bakalářské práci zpracovávat. Když se zmiňuji o „webové“ verzi, je vhodné vysvětlit, co to znamená a proč zrovna webová verze. A s tím vším souvisí pojem internet. Internet je celosvětová síť počítačů. Jeho začátky jsou dnes spjaty s rokem 1969, kdy vznikla experimentální síť zvaná ARPANET, jež je považována za jakýsi první krok vedoucí k pojmu internet tak, jak ho známe dnes. Začátek největšího nárůstu počtu počítačů v této mezinárodní síti se datuje v roce 1993, kdy byl do sítě připojen Bílý Dům. Počítače v síti jsou propojeny tak, že každý může komunikovat s každým. Internet je neuvěřitelně obrovským zdrojem informací, ke kterému jsou dnes připojeny stovky miliónů počítačů po celém světě. Všechny tyto počítače jsou si v této celosvětové síti rovny a to přesto, že se v podstatě rozdělují na dva druhy – servery, na kterých běží webové aplikace a klienty, kteří tyto aplikace spouští a využívají. Webová verze Evidence majetku by tedy měla běžet na webovém serveru a zpracovávat požadavky od klientů. Webová verze má oproti verzi klasické (klasickou verzí myslím desktopovou aplikaci běžící na počítači a nevyžadující připojení k internetu) spousty výhod, které podle mě převažují její nevýhody. Webová verze je dostupná v podstatě odkudkoliv na světě, kde je přístup k internetu. Nemusí být nainstalována na každém počítači, na kterém ji chce zákazník používat. Nainstaluje se na jeden počítač, který bude serverem a pak už s ní lze pracovat z jakéhokoliv počítače, kde je nainstalován internetový prohlížeč, který je dnes standardní součástí operačního systému. V případě potřeby přístupu i přes starší počítače je mnohem jednodušší nainstalovat webový prohlížeč než plnohodnotnou aplikaci. Kromě toho aplikace běží na serveru, který vykonává všechny výpočetní operace, proto počítače, ze kterých se bude aplikace používat, vlastně vůbec nemusí být nějak zvlášť výkonné. V případě, že společnost, která program EVIDENCE MAJETKU vytvořila, vydá novou verzi, 12
nemusí se tato verze instalovat na všech počítačích, ze kterých se uživatel připojuje. Jednoduše se nainstaluje na server a tím pádem všichni, kdo se k němu připojí používají novou verzi programu. Snad jedinou nevýhodou webové verze je, že všechny počítače, ze kterých se bude chtít používat musí mít připojení k internetu. Ale vzhledem k tomu, že dnes snad všechny větší firmy, pro které je tato aplikace určena, internet využívají, to není zas tak velká překážka.
1.2 Cíl práce Hlavním cílem práce je tedy vytvořit aplikaci běžící na nějakém webovém serveru, jejíž hlavní úkol bude podobný jako u výše zmíněné aplikace. Nejdůležitějším kritériem je funkčnost. Webová aplikace by měla kopírovat hlavní funkčnost aplikace desktopové. Vedlejší věcí vzhledem k funkčnosti, které se tato práce týkat nebude je práce s etiketami, šablonami. Tím se myslí jejich vytváření a tisk (nebude implementována práce s tiskárnou). Aplikace by měla umožňovat práci s hlavními tabulkami. Jsou to MAJETEK a číselníky STŘEDISKA, OSOBY, MÍSTNOSTI. Kromě vytváření nových prvků, mazání a jejich editaci by program měl umět také tyto tabulky umět filtrovat. Např. vypsat ty prvky, které odpovídají nějakému kritériu. Mezi další tabulky s kterými by se mělo dát pracovat patří tabulka USER, která je používána pro rozpoznávání uživatelů (a jejich přístupových práv), kteří budou chtít s danou databází firmy pracovat. Čímž jsem naznačil kritérium, které by nemělo ve webové verzi také chybět a to je návrh bezpečnostního modelu a jeho implementace. Tato práce by měla klást velký důraz na bezpečnost a to právě proto, že internet je obrovská a hlavně veřejná síť, kterou nepoužívají pouze lidé, kterým je určena tato aplikace. Program by měl mít také nějaké přehledné a příjemné grafické rozhraní. Důležité je, aby byla aplikace intuitivní a jednoduchá na ovládání. Je dost dobře možné, že ten kdo ji bude muset používat, nebude mít velké odborné znalosti. Takže je potřeba s tím počítat a aplikaci již od začátku vytvářet s tímto cílem. Nároky kladené na grafické rozhraní však nespočívají pouze v jednoduchém rozhraní, respektive jeho ovládání, ale i v jeho vzhledu. Aplikace bude také víceméně považována za vizitku firmy jež jí vypracovala, respektive vizitku člověka jež jí vytvářel. Proto by měla vytvářet profesionální dojem už jen svým vzhledem. Aplikace by měla být k užitku, co největšímu počtu lidí, kteří podobný druh aplikace využijí. To znamená, že jestliže se k aplikaci bude přistupovat přes webový prohlížeč, tak je nutné řešení optimalizovat pro nejvíce užívaný program tohoto druhu. A to je v současné době, 13
podle různých statistik, stále MICROSOFT INTERNET EXPLORER . Za ním je jako druhý nejpoužívanější MOZILLA FIREFOX a potom ostatní. Z tohoto důvodu by aplikace měla být optimalizována pro použití na prohlížečích MICROSOFT INTERNET EXPLORER 5.5 a vyšší, MOZILLA FIREFOX 1.5 a vyšší.
14
2
Analýza problému V analýze problému se musí zjistit nějaké optimální řešení. Jak se bude daný problém
řešit a pomocí čeho se bude řešit. Popřípadě se zde pokusím uvést různé alternativy jak řešení samotného, tak různých nástrojů k tomuto nápomocných. A jestliže je na řadě analýza, respektive rozbor problému je na čase si ukázat jak doopravdy vypadá ona zmiňovaná desktopová aplikace EVIDENCE MAJETKU . Její typické grafické rozhraní je zobrazeno na obrázku 2.1.
Obrázek 2.1. Desktopová aplikace Evidence majetku
Tabulky na obrázku představují jednotlivé databázové tabulky a jejich prvky. V oknech jednotlivých otevřených tabulek je možné si všimnout několika ikon na horní straně okna. Zejména bych zdůraznil ikony s názvy NOVÁ, ZMĚNA, ZRUŠIT, FILTR. Při stisknutí vyvolají příslušné události, které se musí implementovat ve webové verzi. Implementace akcí vyvolaných stiskem tlačítek ETIKETY a TISK se nepředpokládá. Proto o tyto tabulky nebudu nadále zajímat. Tlačítkem REFRESH se obnovují data jestliže se stejnou tabulkou pracuje více uživatelů najednou. 15
To ve webové verzi bude pravděpodobně zajišťovat internetový prohlížeč. Ještě bych se rád zmínil, že barevné provedení se dá změnit pomocí položky NASTAVENÍ BAREV v menu SERVIS jež se nachází nad ikonami v horní části hlavního okna programu. Akvamarínová barva pozadí s logem firmy KODYS se změnit nedá (obrázek 2.2).
Obrázek 2.2. Neměnící se pozadí aplikace Evidence Majetku
Někomu by se mohlo zdát zbytečné rozebírat barvy a vizuální vzhled aplikace, ale podle mě je to velice důležitá věc. V hodně věcech v životě rozhoduje nejvíce první dojem1 a u webových aplikací to platí o to víc. A vzhledem k tomu, že je to vlastně komerční program, u kterého je důležité přesvědčit zákazníka, aby nesáhl ke konkurenci, je první dojem důležitý. V několika odstavcích jsem tedy detailněji popsal jak vypadá program, který se má převést do webového rozhraní. A na základě toho, co bylo řečeno je nasnadě se poohlédnout jaké jsou možnosti z hlediska programovacích jazyků.
1 Popravdě řečeno první dojem z Evidence Majetku na mě valný dojem neudělal. Jasná akvamarínová barva a uprostřed jednoduché logo s bílým pozadím na mě působilo dost jednoduše.
16
2.1 Výběr programovacího jazyka Na úvod bych se chtěl zmínit o tom, že slovo programovací jazyk je zde trochu zavádějící. všechny internetové stránky jsou psané jedním stejným jazykem – jazykem HTML. V této sekci mám na mysli spíše výběr skriptovacího jazyka, který umožňuje větší dynamiku webových stránek. Ty jsou pak díky této dynamice označovány spíše termínem webové aplikace. V praxi to vypadá tak, že internetová stránka je směsicí kódu HTML a kódu skriptovacího jazyka. Server, který umí tento skriptovací jazyk interpretovat, převezme tento kód. Celý ho přeloží pouze do jazyka HTML a vyšle ke klientovy (internetovému prohlížeči), který teď již celou stránku v jazyce HTML, interpretuje uživateli. Výběr programovacího jazyka je vždy poměrně důležité. Některé problémy se v jiných jazycích řeší poměrně jednoduše zatímco v ostatních to tak být nemusí. Proto se zde pokusím popsat aspoň základní charakteristiky několika skriptovacích jazyků.
2.1.1
Java applet
Jednou z možností jak docílit dynamického chování webové stránky je použít Java appletů. Hned první zkoumaný způsob programování stránek je trochu netypický. Většina jazyků používaných na programování dynamických webových stránek fungují jak bylo uvedeno ve druhém odstavci v 2.1. Avšak tento způsob se poněkud liší. Java applet je vlastně program napsaný v jazyku JAVA, který je upravený tak, aby se dal spustit v klientově prohlížeči. Funguje to tak, že se napíše program v jazyce Java, zkompiluje se do podoby „nazev_programu.class“ a do části webové stránky, ve které se má tato dynamická část objevit, se vloží tag
