397 lines
14 KiB
TeX
397 lines
14 KiB
TeX
%!TEX TS-program = pdfLaTeX
|
|
%!TEX encoding = UTF-8
|
|
%!BIB program = Bibtex
|
|
|
|
% Dokument definition
|
|
%-------------------------------------------------------------------
|
|
\documentclass{ibz-document}
|
|
|
|
% Article Variables
|
|
%-------------------------------------------------------------------
|
|
\newcommand{\titlepre}{CaseStudy}
|
|
\newcommand{\titleseparator}{ }
|
|
\newcommand{\titlename}{BusinessStreamline}
|
|
\newcommand{\subtitlepre}{Semester 1}
|
|
\newcommand{\subtitleseparator}{ }
|
|
\newcommand{\subtitlename}{Webtechnologie}
|
|
\newcommand{\authorname}{Ivan Hörler, Harayanamoorthy Prashath, Ciullo Alessio}
|
|
\newcommand{\cotitlename}{B2B Platform}
|
|
|
|
%Header & Footer
|
|
\newcommand{\HeaderLeft}{\footnotesize\textsc{\leftmark}}
|
|
\newcommand{\HeaderCenter}{}
|
|
\newcommand{\HeaderRight}{\footnotesize\textsc{\titlepre\titleseparator\titlename}}
|
|
\newcommand{\FooterLeft}{}
|
|
\newcommand{\FooterCenter}{}
|
|
\newcommand{\FooterRight}{\footnotesize Seite \thepage\ von \pageref{LastPage}}
|
|
|
|
|
|
% Developement Helpers
|
|
%-------------------------------------------------------------------
|
|
\fboxrule=0pt %border thickness der fboxes zum bearbeiten auf 1 setzten
|
|
%\usepackage{showframe} %border der Bereiche anzeigen
|
|
\usepackage{blindtext} % Blindtext zum Testen von Textausgaben
|
|
%\usepackage{lipsum} % Lorem Ipsum Text generator
|
|
|
|
% 0 Seite - Dokumentbeginn
|
|
%--------------------------------------------------------------------------------------------------------------------------------------
|
|
\begin{document} % Dokumentstruktur beginnen
|
|
|
|
% 1 Seite - Titelblatt
|
|
%-------------------------------------------------------------------
|
|
\include{Titelblatt}
|
|
|
|
% 2 Seite - Inhaltsverzeichniss
|
|
%-------------------------------------------------------------------
|
|
\tableofcontents %aufrufen des Inhaltsverzeichnisses
|
|
\thispagestyle{empty} %ohne footer und Headerzeile
|
|
\clearpage % neue Seite beginnen
|
|
|
|
% 3 Seite - Hier beginnt die Arbeit
|
|
%-------------------------------------------------------------------
|
|
\setcounter{page}{1} %hier beginnt die Seitenzahl
|
|
|
|
\section{Vision}
|
|
Die Vision beschreibt den Vorgang von Anwendern auf der Website der Firma BusinessStreamline graphisch als Kundenbeziehung.
|
|
|
|
\begin{figure}[h]
|
|
\subsection{Kundenbeziehung}
|
|
\includegraphics[width=\textwidth]{bilder/vision/Kundenbeziehung.pdf}
|
|
\caption{Kundenbeziehung}
|
|
\label{fig:Kundenbeziehung}
|
|
\end{figure}
|
|
|
|
% \begin{figure}[h]
|
|
% \subsection{Meilensteine}
|
|
% \includegraphics[width=\textwidth]{bilder/vision/Millestones.pdf}
|
|
% \label{fig:Meilensteine}
|
|
% \caption{Meilensteine}
|
|
% \end{figure}
|
|
|
|
|
|
\section{User Stories}
|
|
Ausgangspunkt ist diese Syntax:
|
|
\begin{center}%
|
|
%\begin{Small}%
|
|
\textsc{Als } \textsc{\texttt{<Benutzerrolle> }}\textsc{will ich } \textsc{\texttt{<das Ziel>, }}\textsc{so dass } \textsc{\texttt{<Grund für das Ziel>.}}
|
|
%\end{Small}%
|
|
\end{center}%
|
|
\subsection{BusinessStreamline}
|
|
\begin{itemize}
|
|
\item Als Dienstleister firma will ich, dass der Kunde sich Anmelden muss, so dass kein unbefugter Zugang besteht.
|
|
\item Als Dienstleister firma will ich Kontrolle über die Kundenanmeldung haben, so dass kein Kunde zweimal registriert sein kann.
|
|
\item Als Dienstleister firma will ich die gesuchten Teile abfragen können, so dass jederzeit Gewissheit über die Anzahl Nachfragen besteht.
|
|
\item Als Dienstleister firma will ich die Angebote überprüfen können.
|
|
\item Als Dienstleister firma will ich, dass alle Nachfrager und Anbieter anonym verhandeln können.
|
|
\end{itemize}
|
|
\subsection{Nachfragerfirma}
|
|
\begin{itemize}
|
|
\item Als Nachfrager firma will ich eine Bezeichnung eines gesuchten Teils hinterlegen können so dass ein Anbieter das Teil spezifisch suchen kann.
|
|
\item Als Nachfrager firma will ich die Qualität eines gesuchten Teils hinterlegt haben, sodass ich mich an Qualitätsmerkmalen orientieren kann.
|
|
\item Als Nachfrager firma will ich einen Lieferzeitpunk hinterlegen können, sodass ein Anbieter über die Lieferfrist informiert ist.
|
|
\item Als Nachfrager firma will ich die benötigte Menge angeben können, sodass ich diese mit einer Bestellung bekomme.
|
|
\item Als Nachfrager firma will ich ein Angebot annehmen können, so dass dem Anbieter eine Bestellung zugesandt wird.
|
|
\item Als Nachfrager firma will ich das Teil innerhalb der Lieferzeit zugesandt bekommen.
|
|
\end{itemize}
|
|
\subsection{Anbieterfirma}
|
|
\begin{itemize}
|
|
\item Als Anbieter firma will ich abfragen welche Teile gesucht sind, so dass ein Angebot erstellt werden kann.
|
|
\item Als Anbieter firma will ich, dass alle Eckpunkte geklärt sind, so dass keine unvorhergesehenen Kosten entstehen.
|
|
\item Als Anbieter firma will ich ein Angebot abgeben können, so dass ein schriftlicher Vertrag entsteht.
|
|
\item Als Anbieter firma will ich anonym bleiben, so dass die Nachfragefirma nur anhand des Preises entscheidet wer sie berücksichtigt.
|
|
\item Als Anbieter firma will ich bei der Bestellung eine schriftliche Antwort erhalten, so dass der Vertrag gültig ist.
|
|
\end{itemize}
|
|
|
|
\section{Benutzerführung}
|
|
Damit der Kunde sieht wie seine Webseite funktioniert wurde eine Benutzerführung in form von Flowdiagrammen zu jedem Typ von Kunden erstellt.
|
|
\subsection{Nachfrage Firma}
|
|
|
|
\begin{figure}[H]
|
|
\begin{center}
|
|
\includegraphics[scale=0.5]{bilder/Benutzerfuehrung/Nachfrager.png}
|
|
\end{center}
|
|
\caption{Benutzerführung des Nachfragers}
|
|
\label{fig:BenutzerführungNachfrager}
|
|
\end{figure}
|
|
|
|
\subsection{Anbieter Firma}
|
|
|
|
\begin{figure}[H]
|
|
\begin{center}
|
|
\includegraphics[scale=0.6]{bilder/Benutzerfuehrung/Anbieter.png}
|
|
\end{center}
|
|
\caption{Benutzerführung des Anbieters}
|
|
\label{fig:BenutzerführungAnbieters}
|
|
\end{figure}
|
|
|
|
\section{Datenbank}
|
|
Die Gruppe hat sich entschieden das Projekt auf Basis einer MySQL Datenbank mit PHP zu erstellen.
|
|
|
|
Zur Visualisierung wurden RM und ERM mit Dia erstellt:
|
|
\subsection{ERM}
|
|
\begin{figure}[H]
|
|
\begin{center}
|
|
\includegraphics[scale=0.4]{bilder/DB/DB-ERM.png}
|
|
\end{center}
|
|
\caption{ERM zur Datenbank für BusinessStreamline}
|
|
\label{fig:ERM}
|
|
\end{figure}
|
|
\subsection{RM}
|
|
\begin{figure}[H]
|
|
\begin{center}
|
|
\includegraphics[scale=0.5]{bilder/DB/DB-RM.png}
|
|
\end{center}
|
|
\caption{RM zur Datenbank für BusinessStreamline}
|
|
\label{fig:RM}
|
|
\end{figure}
|
|
|
|
\newpage %-------------------------------------------------------------------
|
|
\section{Coding}
|
|
\subsection{erstes Login}
|
|
Nach dem wir einige Tutorials durchgearbeitet hatten, fanden wir mit codeingcage \cite{ref1} ein Tutorial dass die Abläufe
|
|
genügend einfach gestaltet hatte. So dass wir auch in der Lage waren es zu verstehen, verändern und unseren Bedürfnissen anzupassen.
|
|
Wir haben es zuerst nach dem vorgezeigten Schema erstellt und dann gemerkt dass wir die E-Mail Adresse als Login Feld eher als lästig empfinden.
|
|
Also machten wir uns an die Arbeit um den Login nach User-Namen umzukrempeln und entfernten alle E-Mail Felder und Variablen auch aus der Datenbank.
|
|
Als fun fügten wir noch ein Bild ein und entfernten alle bootstrap CSS Klassen und ersetzten sie mit unseren aus dem lokalen style.css
|
|
File um das ganze auch schön aussehen zu lassen. Zusätzlich wurde eine Automatische Login Routine implementiert so dass ein Login nach der
|
|
Anmeldung eines Users nicht noch mal eingegeben werden muss.
|
|
\subsection{Datenbankeinträge}
|
|
Um die Datenbankeinträge gemäss RM erstellen zu könne wurde als erstes das .sql file zur Erstellung der Datenbank erstellt.
|
|
Danach wurden von Hand drei Einträge gemacht um die Abfrage testen zu können. Da der Unterricht die SQL-Querrys noch nicht abgedeckt hatte schob der Dozent eine kurze Einführung samt Beispiel ein, was als Vorlage für die weitere Arbeit diente.
|
|
Zudem entnahm ich dem youtube Video \cite{ref2} wichtige Informationen zum vorgehen mit PDO.
|
|
Um die Darstellung zu gliedern wurde die Abfrage in HTML Tabellenform integriert. Das Eintragsdatum musste von YYYY-MM-DD-hh-mm gekürzt werden und wird nun als Datum ohne Zeitangabe dargestellt.
|
|
Die Eintrags Erfassung wird mit dem gleichen vorgehen gemacht und fängt Fehler wie leergelassene Felder oder zu kurze Beschreibungen ab.
|
|
|
|
|
|
\section{Projektplanung}
|
|
|
|
\begin{figure}[H]
|
|
\subsection{Zeitplan}
|
|
\includegraphics[width=\textwidth]{bilder/Zeitplan/Zeitplan.png}
|
|
\caption{Zeitplanung}
|
|
\label{fig:Zeitplanung}
|
|
\end{figure}
|
|
|
|
\begin{figure}[H]
|
|
\subsection{Zeitaufwand}
|
|
\begin{center}
|
|
\begin{spreadtab}{{tabular}{ | l | c | c | c | l | }} \hline
|
|
@ Arbeitspaket & @ geplant & @ geleistet & @ delta & @ Erklärung \\ \hline
|
|
@ Projekt Management & 1 & 1 & & \\
|
|
@ Dokumentation & 3 & 6 & 3 & @ \begin{scriptsize}LaTeX verstehen und einrichten\end{scriptsize}\\
|
|
@ Vision & 1 & 1 & & \\
|
|
@ UserStories & 3 & 3 & & \\
|
|
@ Benutzerführung & 2 & 3 & 1 & @ \begin{scriptsize}gezeichnet mit Libreoffice\end{scriptsize}\\
|
|
@ Datenbank & 1 & 1 & & \\
|
|
@ erstes login/out & 2 & 8 & 6 & \\
|
|
@ Datenbankeinträge & 6 & 11 & 5 & @ \begin{scriptsize}der Schulische hintergrund fehlte zu dem Zeitpunkt noch.\end{scriptsize}\\
|
|
\hline \hline
|
|
@ Total & sum(b2:b9) & sum(c2:c9) & sum(d2:d9) & @ h \\ \hline
|
|
\end{spreadtab}
|
|
\caption{Zeitaufwand}
|
|
\label{tab:Zeitaufwand}
|
|
\end{center}
|
|
\end{figure}
|
|
|
|
|
|
% Etwas Hilfe zu Latex:
|
|
%-------------------------------------------------------------------
|
|
|
|
%\section{Latex Hilfe}
|
|
%Ich kann einfach drauf los schreiben...\textbackslash \textbackslash erzeugt einen Zeilenumbruch.\\
|
|
%Für gewisse symbole wie \& muss ich \textbackslash \& schreiben damit es richtig dargestellt wird.\\
|
|
%
|
|
%einige Hilfe für Tesxtstyling:
|
|
%
|
|
%This will produce \textit{italizized} text
|
|
%
|
|
%This will produce \textbf{boldfaced} text
|
|
%
|
|
%This will produce \textsc{small caps} text
|
|
%
|
|
%This will produce \texttt{typewriter} text
|
|
%
|
|
%please visit Mrs. Krummels website at
|
|
%\texttt{http://mrskrummel.com/tutorials.html}.\\
|
|
%
|
|
%Please excuse
|
|
%\begin{tiny}%
|
|
% my dear aunt Sally
|
|
%\end{tiny}
|
|
%
|
|
%Please excuse
|
|
% \begin{scriptsize}%
|
|
% my dear aunt Sally
|
|
% \end{scriptsize}
|
|
%
|
|
%Please excuse
|
|
% \begin{footnotesize}%
|
|
% my dear aunt Sally
|
|
% \end{footnotesize}
|
|
%
|
|
%Please excuse
|
|
%\begin{small}%
|
|
% my dear aunt Sally
|
|
%\end{small}
|
|
%
|
|
%Please excuse my dear aunt Sally % Default Schriftgrösse
|
|
%
|
|
%Please excuse\begin{large}
|
|
%my dear aunt Sally \end{large}
|
|
%
|
|
%Please excuse\begin{Large}
|
|
%my dear aunt Sally \end{Large}
|
|
%
|
|
%Please excuse\begin{LARGE}
|
|
%my dear aunt Sally \end{LARGE}
|
|
%
|
|
%Please excuse \begin{huge}%
|
|
%my dear aunt Sally \end{huge}
|
|
%
|
|
%Please excuse \begin{Huge}%
|
|
%my dear aunt Sally \end{Huge}
|
|
%
|
|
%
|
|
%
|
|
%\begin{flushleft}
|
|
% this is flushleft = not indent
|
|
%\end{flushleft}
|
|
%\begin{center}This ist centered Text \end{center}
|
|
%\begin{flushright}
|
|
% This is flushright text
|
|
%\end{flushright}
|
|
%
|
|
%\begin{enumerate}
|
|
%\item pencil
|
|
%\item paper
|
|
%\item calculator
|
|
%\item ruler
|
|
%\item notebook
|
|
% \begin{enumerate}
|
|
% \item assessment
|
|
% \begin{enumerate}
|
|
% \item tests
|
|
% \item quizzes
|
|
% \end{enumerate}
|
|
% \item homework
|
|
% \item notes
|
|
% \end{enumerate}
|
|
%\item graph paper
|
|
%\end{enumerate}
|
|
%
|
|
%\begin{itemize}
|
|
%\item pencil
|
|
%\item paper
|
|
%\item calculator
|
|
%\item ruler
|
|
%\item notebook
|
|
% \begin{itemize}
|
|
% \item assessment
|
|
% \begin{itemize}
|
|
% \item tests
|
|
% \item quizzes
|
|
% \end{itemize}
|
|
% \item homework
|
|
% \item notes
|
|
% \end{itemize}
|
|
%\item graph paper
|
|
%\end{itemize}
|
|
%
|
|
%\begin{enumerate}
|
|
% \item[Commutative] $a+b=b+a$ % was in der eckigen klammer steht wird als bulletpoint oder nummerierungs-ersatz genommen...
|
|
% \item[Associative] $a+(b+c)=(a+b)+c$
|
|
% \item[Distrbutive] $ a(b+c)=ab+ac$
|
|
%\end{enumerate}
|
|
%
|
|
% \begin{center}
|
|
% Einfügen von Tabellen:\\
|
|
% \begin{tabular}{|c|c|c|c|} \hline
|
|
% $x$ & 0 & 1 & 2 \\ \hline
|
|
% $f(x)$ & 3 & 6 & 9 \\ \hline
|
|
% \end{tabular}
|
|
% \label{tab:data1} % verlinkung im Text ueber den namen tab:data1
|
|
% \end{center}
|
|
%
|
|
%Formeln einfügen:\\
|
|
%für Hilfe siehe: https://en.wikibooks.org/wiki/LaTeX/Mathematics
|
|
%\begin{equation}
|
|
%\frac{
|
|
% \begin{array}[b]{r}
|
|
% \left( x_1 x_2 \right)\\
|
|
% \times \left( x'_1 x'_2 \right)
|
|
% \end{array}
|
|
% }{
|
|
% \left( y_1y_2y_3y_4 \right)
|
|
% }
|
|
%\end{equation}
|
|
%
|
|
%\begin{equation}
|
|
% x = a_0 + \cfrac{1}{a_1
|
|
% + \cfrac{1}{a_2
|
|
% + \cfrac{1}{a_3 + \cfrac{1}{a_4} } } }
|
|
%\end{equation}
|
|
%
|
|
%\begin{equation}
|
|
%\sqrt{\frac{a}{b}}
|
|
%\end{equation}
|
|
%
|
|
%\begin{equation} \label{eq:solve} % <--- lable wird zur referenzierung weitergereicht
|
|
%x^2 - 5 x + 6 = 0
|
|
%\end{equation}
|
|
%\centering Formel: \ref{eq:solve}\\ % der Abschluss von \centering ist mit \\ was etwas ungewöhnlich ist.
|
|
%
|
|
%\begin{equation}
|
|
%x_1 = \frac{5 + \sqrt{25 - 4 \times 6}}{2} = 3
|
|
%\end{equation}
|
|
%
|
|
%\begin{equation}
|
|
%x_2 = \frac{5 - \sqrt{25 - 4 \times 6}}{2} = 2
|
|
%\end{equation}
|
|
%
|
|
%and so we have solved equation~\ref{eq:solve} % <--- die referenzierung holt das label
|
|
%kann ich nun hier shcreiben
|
|
%
|
|
%\begin{equation}
|
|
%\sqrt[n]{1+x+x^2+x^3+\dots+x^n}
|
|
%\end{equation}
|
|
%
|
|
%\begin{equation}
|
|
%\displaystyle\sum_{i=1}^{10} t_i
|
|
%\end{equation}
|
|
%
|
|
%Referenziere auf das Bild mit dem Label Meilensteine: \ref{fig:Meilensteine}
|
|
|
|
|
|
% Quellverzeichniss
|
|
%-------------------------------------------------------------------
|
|
\newpage
|
|
\thispagestyle{empty}
|
|
\section{Referenzen}
|
|
\nocite{*}
|
|
\bibliographystyle{plain}
|
|
\bibliography{quellverzeichniss}
|
|
|
|
|
|
% Index
|
|
%-------------------------------------------------------------------
|
|
%\newpage
|
|
%\printindex
|
|
%\thispagestyle{empty}
|
|
% abspann
|
|
%-------------------------------------------------------------------
|
|
\newpage
|
|
\thispagestyle{empty}
|
|
\begin{center}
|
|
\vspace*{\fill}
|
|
\line(1,0){400} \\ [4mm]
|
|
\Large{\textsc{this Document is Typset with}} \\ [3mm]
|
|
\textrm{\Huge\LaTeX{}} \\ [1mm]
|
|
\line(1,0){400}\\
|
|
\vspace*{\fill}
|
|
\end{center}
|
|
|
|
% Dokumentende
|
|
%--------------------------------------------------------------------------------------------------------------------------------------
|
|
|
|
\end{document}
|