基于WEB的H機械公司財務(wù)管理系統(tǒng)設(shè)計目錄TOC\o"1-3"\h\u260301緒論 2197371.2研究目的和意義 3290291.2技術(shù)和開發(fā)工具簡介 3201691.2.1JSP動態(tài)頁面開發(fā)技術(shù) 325511.2.4Tomcat服務(wù)器 419942可行性研究 5173852.1經(jīng)濟可行性 5255232.2技術(shù)可行性 6268982.3社會可行性 6182252.4系統(tǒng)可行性 6196673系統(tǒng)需求分析 6235193.1用戶分析 738583.2功能分析 7214703.3性能分析 8112623.4系統(tǒng)質(zhì)量分析 8110164系統(tǒng)總體設(shè)計 9263314.1系統(tǒng)概述設(shè)計 9232944.1.1系統(tǒng)模塊設(shè)計 9205974.1.2系統(tǒng)流程分析 9246694.1.3員工、管理員功能設(shè)計 10281404.1.4系統(tǒng)架構(gòu)設(shè)計 1289244.2系統(tǒng)數(shù)據(jù)庫設(shè)計 13273664.2.1系統(tǒng)數(shù)據(jù)庫概念設(shè)計 1379755系統(tǒng)詳細設(shè)計 14231635.1前端設(shè)計 14267925.1.1登錄頁面設(shè)計 14256835.2數(shù)據(jù)訪問對象(DAO)設(shè)計 3627315.3數(shù)據(jù)庫設(shè)計 38265676系統(tǒng)測評 40193206.1程序系統(tǒng)測試 40115316.1.1測試的必要性以及目的 40105786.2系統(tǒng)優(yōu)點 42155306.3系統(tǒng)的不足 43267647結(jié)論 43306817.1本課題的重難點 437757.2展望 43摘要： 全球的信息化發(fā)展在近幾十年有著突飛猛進的發(fā)展，信息化早已不再是一個讓人陌生的詞匯，它已經(jīng)走進了我們生活中的方方面面。從計算機的發(fā)展到移動設(shè)備的普及，再到智能家居逐漸走進我們的生活。將財務(wù)管理與計算機結(jié)合的財務(wù)管理的信息化已然成為了一種主流和必然。本文設(shè)計了基于計算機網(wǎng)絡(luò)技術(shù)的財務(wù)管理系統(tǒng)，擺脫了傳統(tǒng)的繁雜的人工財務(wù)管理，能夠有效地滿足實際公司財務(wù)工作的基本需求，極大地降低了公司的人力成本，提高了公司的財務(wù)管理效率。本系統(tǒng)采用的是B/S體系結(jié)構(gòu)，利用Eclipse開發(fā)工具使用Java語言進行Web的前端界面設(shè)計，通過Tomcat服務(wù)器處理遠程客戶端請求，并使用SQLServer完成系統(tǒng)后臺數(shù)據(jù)信息的存儲。關(guān)鍵詞：財務(wù)管理、數(shù)據(jù)庫、Java、web、數(shù)據(jù)庫緒論1.1研究背景隨著的科學(xué)技術(shù)的不斷發(fā)展，社會生產(chǎn)力的不斷提高，人們往往需要的是更簡單，更快捷，更高速的生活方式。信息化時代正是迎合了人們的需求而誕生，為我們帶來了更快的生活節(jié)奏的同時提高了我們的生活質(zhì)量，豐富了我們的物質(zhì)精神生活。計算機作為信息化時代的標(biāo)志性產(chǎn)物，它強大，高效的功能頁確實在我們生活中的許多方面發(fā)揮著極其重要的作用。計算機一步一步深入到我們的日常生活和學(xué)習(xí)中，變成了了我們?nèi)粘Ｉ钪胁豢苫蛉钡闹匾ぞ?。它強大的功能也運用到了我們生活的方方面面，比如數(shù)值計算，數(shù)據(jù)處理，自動控制，輔助教學(xué)，人工智能，娛樂游戲等等。同時，計算機除了擁有著強大又全面的功能以外，他的簡單易學(xué)性也使得計算機可以被各種年齡段，文化程度，工作職業(yè)的人們學(xué)習(xí)和使用。這些種種也使得計算機得以被各種各樣的行業(yè)使用，用以提高從業(yè)者的工作效率。本次設(shè)計的財務(wù)管理系統(tǒng)屬于標(biāo)準(zhǔn)的的信息管理系統(tǒng)(ISMInformationSystemManagement)，而信息系統(tǒng)的開發(fā)主要包括后臺數(shù)據(jù)庫的建立維護和前端應(yīng)用的開發(fā)兩個方面。對于前者數(shù)據(jù)庫建立，我們希望建立起一個具有用戶接口簡單，運行可靠穩(wěn)定，數(shù)據(jù)安全的數(shù)據(jù)庫。而對于后者前端應(yīng)用的開發(fā)，我們希望能夠完成一個功能全面，頁面風(fēng)格簡單易操作的應(yīng)用。1.2研究目的和意義信息化的來臨，經(jīng)濟全球化的加深都以為著時代的快速變遷。我們只有與時俱進，才能不會落后，不會被淘汰。財務(wù)管理系統(tǒng)是用計算機來管理企業(yè)和單位的財務(wù)運轉(zhuǎn)以及為員工提供個人財務(wù)查詢的一種信息化管理系統(tǒng)。在信息化來臨前的早期財務(wù)管理事務(wù)基本都是由財務(wù)，人事和管理等多個部門的較多工作人員協(xié)同合作下，經(jīng)過較長的周期和很大的工作量下才能完成的。信息時代的來臨，計算機的普及則為現(xiàn)今的企業(yè)和單位提供了進行信息化財務(wù)管理的基本條件。應(yīng)用計算機作為協(xié)助管理員進行企業(yè)智能化，系統(tǒng)化的財務(wù)管的工具，可以極大的提高工作人員的工作效率。因此本次課題我想設(shè)計一個基于web的企業(yè)財務(wù)管理系統(tǒng)，將財務(wù)管理與信息化相結(jié)合，擺脫傳統(tǒng)的人工財務(wù)管理，大大提高企業(yè)的管理效率，降低財務(wù)管理成本和時間周期，使企業(yè)在日益激烈的商業(yè)競爭下更具優(yōu)勢。1.2技術(shù)和開發(fā)工具簡介1.2.1JSP動態(tài)頁面開發(fā)技術(shù)JSP技術(shù)是由SunMicrosystems公司主導(dǎo)，還聯(lián)合了一些其他互聯(lián)網(wǎng)公司共同推出的一種軟件使用者可以響應(yīng)客戶端請求、動態(tài)形成XML、HTML或其他格式文檔的動態(tài)界面技術(shù)標(biāo)準(zhǔn)。JSP技術(shù)用Java語言為基礎(chǔ)語言的，它將特定的提前定義好的動作和Java程序員提前編寫好的代碼嵌入到靜態(tài)頁面HTML中形成動態(tài)的網(wǎng)頁界面。使用JSP開發(fā)的一個極大便利是JSP開發(fā)出來的的動態(tài)網(wǎng)頁是可以過跨平臺使用的，通常可以在大眾常用的windows系統(tǒng)中運行，也能夠在不常用的Unix或者其他的操作系統(tǒng)中運行。JSP技術(shù)使用Java編程語言編寫類XML的JSP標(biāo)記和JAVA程序腳本來處理封裝形成動態(tài)網(wǎng)頁的邏輯思維能力。使用JSP技術(shù)的優(yōu)點在于可以更迅速更易于開發(fā)出WEB應(yīng)用程序，JSP的功能開發(fā)與設(shè)計分開完成，系統(tǒng)的設(shè)計可以基于組件的功能。JSP技術(shù)基于Java語句做為腳本語句，在整個服務(wù)器端預(yù)先設(shè)置好了一個接口來響應(yīng)HTTP的應(yīng)用程序的Java單元庫為JSP頁面，這個功能就是我們創(chuàng)建一個基于WEB的網(wǎng)上訂餐網(wǎng)站所需要的。在添加Java程序片段并在傳統(tǒng)web技術(shù)的HTML文件中設(shè)置JSP標(biāo)記之后，將形成JSP頁面。在請求Web服務(wù)器訪問JSP頁面時，首先執(zhí)行程序片段，然后將執(zhí)行結(jié)果返回給HTML格式的客戶端。程序片段可以通過連接本地數(shù)據(jù)庫，重新提交瀏覽網(wǎng)頁的請求，用戶不需要安裝額外的插件，不使用ActiveX，無Java程序，即使沒有框架也可以實現(xiàn)對用戶瀏覽器的最低限度。1.2.2SQLServer2017數(shù)據(jù)庫本系統(tǒng)使用的數(shù)據(jù)庫SQLServer2017作為新一代的數(shù)據(jù)平臺產(chǎn)品，其不但延續(xù)了現(xiàn)有數(shù)據(jù)平臺的強大能力，而且全面支持云技術(shù)。作為一款由微軟公司開發(fā)的專業(yè)的數(shù)據(jù)庫管理軟件，SQLServer2017新版本增加了新的數(shù)據(jù)服務(wù)和分析功能，支持強大的AI功能，對R和Python可以執(zhí)行高級查詢、簡單或高級算法，還可直接看到分析結(jié)果，不過新版本僅支持64位系統(tǒng)。SQLServer2017跨出了重要的一步，力求通過將SQLServer的強大功能引入Linux、基于Linux的Docker容器和Windows使用戶可以在SQLServer平臺上選擇開發(fā)語言、數(shù)據(jù)類型、本地開發(fā)或云端開發(fā)以及操作系統(tǒng)。其強大的功能完全可以為本次課題提供支持。1.2.3MyEclipse開發(fā)工具本系統(tǒng)使用的開發(fā)工具是MyEclipse10，而MyEclipse對于java程序的開發(fā)上來講是一個很卓越的開發(fā)工具。使用MyEclipse可以幫助我們在數(shù)據(jù)庫和JSP網(wǎng)頁開發(fā)提供很多的幫助，可以廣泛的支持各種開源的產(chǎn)品，MyEclipse擴展了EclipseIDE的很多功能，它集成了JavaEE6的開發(fā)環(huán)境，兼容了包括HTML，Struts，JSP等，使得我們在使用其進行編程、運行、調(diào)試時更加的簡便易操作。并且相較于老版本的MyEclipse，該版本還支持64位的Windows系統(tǒng)。1.2.4Tomcat服務(wù)器Tomcat服務(wù)器是由Apache提供的一個免費開源的Web應(yīng)用服務(wù)器，一臺電腦上只允許安裝一個它的服務(wù)器，它被廣泛應(yīng)用在并發(fā)訪問用戶不是很多的場景。由于Tomcat的技術(shù)領(lǐng)先于其他同類產(chǎn)品，服務(wù)器性能好，不收費，因此受到了眾多程序開發(fā)者的喜愛（如Java軟件開發(fā)者）和一些軟件研發(fā)公司的認可，使得它成為比IIS更為時尚的Web應(yīng)用服務(wù)器，是開發(fā)和調(diào)試JSP程序首選的服務(wù)器。Tomcat服務(wù)器在運行的時候只需要使用很少的內(nèi)存和CPU資源，Tomcat服務(wù)器在網(wǎng)頁的開發(fā)中是現(xiàn)在主流的小型的輕量級應(yīng)用服務(wù)器。經(jīng)過數(shù)個版本的不斷更新，最新版本的Tomcat服務(wù)器已經(jīng)達到了9.0，其功能不斷完善，使用越來越方便，足以應(yīng)付并發(fā)訪問量不是很大的場合，非常適合作為本次課題的服務(wù)器。1.3本文的主要內(nèi)容本次的課題設(shè)計由兩大模塊組成：前端應(yīng)用軟件和后臺數(shù)據(jù)庫。前端應(yīng)用軟件主要為公司財務(wù)管理系統(tǒng)管理員提供系統(tǒng)用戶管理、員工管理、賬戶管理、支出管理、收入管理和系統(tǒng)管理的功能支持以及為公司普通員工提供個人資料管理、支出管理、收入管理等功能。而我們的后臺數(shù)據(jù)庫擁有著存儲、錄入、備份公司財務(wù)管理系統(tǒng)所需數(shù)據(jù)的功能?；趙eb的H機械財務(wù)管理系統(tǒng)作為典型的信息管理系統(tǒng)，我們希望它能充分擔(dān)當(dāng)現(xiàn)代化管理的任務(wù)，讓我們的管理系統(tǒng)為公司的發(fā)展發(fā)展提供助力，為公司帶來更大的效績。論文主要內(nèi)容介紹如下：第一部分是說明財務(wù)管理系統(tǒng)的背景、目的以及意義，并且對本次項目開發(fā)時所用到的技術(shù)工具進行了簡單的介紹，最后簡述了本文的大致內(nèi)容。第二部分是對財務(wù)管理系統(tǒng)的可行性研究，本文從經(jīng)濟、技術(shù)、社會和系統(tǒng)四個方面闡述了本財務(wù)管理系統(tǒng)的可行性。第三部分是對用戶、功能、性能進行需求分析，確保能盡量全面的分析出本系統(tǒng)所應(yīng)具有的功能。第四部分是關(guān)于本系統(tǒng)的整體設(shè)計部分，詳細介紹了本系統(tǒng)關(guān)于功能模塊的設(shè)計、系統(tǒng)流程的分析、系統(tǒng)架構(gòu)的設(shè)計、數(shù)據(jù)流圖和用例以及數(shù)據(jù)庫的設(shè)計方案。第五部分是有關(guān)系統(tǒng)詳細設(shè)計的內(nèi)容，主要是對前臺和后臺相關(guān)模塊的詳細設(shè)計過程。第六章系統(tǒng)測試和評價，簡單介紹了關(guān)于軟件測試的知識以及軟件測試的必要性，最后對本系統(tǒng)的優(yōu)點與缺點做出客觀的自我評價。最后一部分是對系統(tǒng)開發(fā)過程的總結(jié)以及在本次系統(tǒng)開發(fā)過程中所得到的一些心得感悟。并對給予我?guī)椭睦蠋?、同學(xué)、學(xué)校表達最真摯的感謝。。可行性研究 可行性研究是軟件開發(fā)前非常有必要的的程序，不對項目進行充分的可行性研究的話，一旦在項目開發(fā)過程中遇到一些不易解決的困難時，就很有可能導(dǎo)致項目的終止失敗，之前所付出的努力也會付諸東流，因此本次課題中我從經(jīng)濟、技術(shù)、社會和系統(tǒng)四大方面對項目進行了較為全面的可行性研究。經(jīng)濟可行性對于產(chǎn)品的調(diào)研不需要太多資金投入，并且本次軟件開發(fā)所使用到的工具是網(wǎng)絡(luò)上已有的開源軟件，無需再有更多的資金投入用于購買軟件，因此我們的開發(fā)成本是較低的；我們的項目在后期維護方面也非常簡捷容易，只需簡單培訓(xùn)后企業(yè)員工就可以熟練的完成后期的維護工作。綜上所述，較小的經(jīng)濟投入降低了本課題開發(fā)的難度。技術(shù)可行性因為所給定的時間范圍有限，并且想要能夠?qū)崿F(xiàn)出課題基本功能需求，因此進行調(diào)研，提前預(yù)測是否會遇到難以克服的技術(shù)難關(guān)就顯得尤為關(guān)鍵。幸而如今發(fā)展已經(jīng)非常成熟的JSP開發(fā)技術(shù)為我本次完成財務(wù)管理系統(tǒng)地設(shè)計的開發(fā)有著很大的幫助。不僅如此，簡明、易操作的后臺界面也為我們后期維護的投入上也提供了極大的方便，僅僅只需要對企業(yè)管理人員進行簡單的培訓(xùn)后就可以完成對我們財務(wù)管理系統(tǒng)的使用和維護，也就不需要再額外的投入更多的人力和資金來保證系統(tǒng)的后期維護。社會可行性經(jīng)濟全球化所帶來的不僅僅是機遇，更是一場全球性的優(yōu)勝略汰，只有緊跟時代的發(fā)展，充分利用計算機帶來的好處，才能讓我們更好的生存下來。財務(wù)管理系統(tǒng)無疑會極大的提高公司的財務(wù)管理效率，并在一定程度上可以降低公司的人力財務(wù)支出。這些都將為公司在激烈的商業(yè)競爭中多添了幾分競爭力。系統(tǒng)可行性由Myeclipse和SQLSever結(jié)合，并采用圖形界面所開發(fā)出的財務(wù)管理系統(tǒng)，我們不僅會將系統(tǒng)的功能做的齊全、簡單，也會將圖形界面和操作界面做得簡潔易用。讓管理員和員工都能在輕松方便的使用我們的系統(tǒng)，有一個良好的操作體驗。除此之外，我們還將管理員與員工的登錄和功能進行區(qū)分，讓他們能夠更加直接，簡單的使用各自真正所需要使用的功能。這樣也能更好的保護數(shù)據(jù)的安全和隱私。系統(tǒng)需求分析系統(tǒng)預(yù)期整體功能模塊框架如下圖3.1所示，根據(jù)預(yù)期需要完成的成果，現(xiàn)對系統(tǒng)需求進行分析，看是否能滿足客戶的需求。圖3.1系統(tǒng)預(yù)期模塊圖用戶分析本次系統(tǒng)設(shè)計中包括兩種用戶：員工和管理員。員工：可以使用個人資料管理、支出管理、收入管理功能。個人資料管理：員工可以修改自己的個人資料。支出管理：員工可以對自己的賬戶進行支出添加和支出查詢。收入管理：員工可以對自己的賬戶進行收入添加和收入查詢。管理員：可以使用系統(tǒng)用戶管理、員工管理、賬戶管理、支出管理、收入管理和系統(tǒng)管理功能。系統(tǒng)用戶管理：管理員用戶的查看，進行密碼修改。員工管理：管理員可以進行員工添加和員工查詢。賬戶管理：管理員可以進行賬戶添加和賬戶查詢。支出管理：管理員可以對全公司員工的支出進行查詢。收入管理：管理員可以對全公司員工的收入進行查詢。系統(tǒng)管理：管理員可以對公司數(shù)據(jù)進行備份。功能分析財務(wù)管理系統(tǒng)由員工權(quán)限和管理員權(quán)限兩大部分組成。員工權(quán)限：服務(wù)于公司員工，其中的個人資料管理功能讓員工可以隨時查看、修改自己的個人信息，支出和收入管理功能則為員工提供了對自己資產(chǎn)收入、支出情況查詢服務(wù)。管理員權(quán)限：服務(wù)于公司的系統(tǒng)管理員，在管理員中我又將其細分為超級管理員和普通管理員，作為超級管理員除了擁有普通管理員的各項權(quán)限外，還可以對管理員賬戶進行查看和刪除。其中系統(tǒng)用戶管理功能，可以讓管理員對自己和公司員工的賬戶進行查看和密碼修改。員工管理功能讓管理員可以對員工賬戶進行添加和查詢。賬戶管理功能為管理員提供賬戶添加和賬戶查詢功能。支出管理功能讓管理員可以對全公司員工的支出進行查詢。收入管理功能則讓管理員可以對全公司員工的收入進行查詢。最后的系統(tǒng)管理功能，為管理員提供了數(shù)據(jù)備份功能。性能分析本系統(tǒng)期望在性能上能夠達到如下要求：擁有方便簡單的操作，美觀簡潔的界面，讓用戶使用起來更加舒適；系統(tǒng)工作時流暢不卡頓，功能完善；數(shù)據(jù)庫能夠鏈接響應(yīng)快速、穩(wěn)定，并能保證數(shù)據(jù)的安全性；系統(tǒng)在現(xiàn)有功能完善的前提上，能夠具有很好的好的功能可擴展性，以便于未來對系統(tǒng)進行功能擴添。后期維護簡單易操作，為管理員日后對系統(tǒng)的維護帶來便利。系統(tǒng)質(zhì)量分析表3.1質(zhì)量分析表質(zhì)量屬性標(biāo)準(zhǔn)可用性系統(tǒng)各項功能使用正常穩(wěn)定性系統(tǒng)保持較低的出現(xiàn)卡頓和故障現(xiàn)象的概率。健壯性具有較高的的數(shù)據(jù)恢復(fù)性和數(shù)據(jù)容災(zāi)性。安全性保證數(shù)據(jù)庫中數(shù)據(jù)的安全性和用戶隱私。易操作性保證系統(tǒng)功能簡單易操作，界面簡潔?？蓴U展性對系統(tǒng)進行新功能的添加和對原有功能的升級優(yōu)化是方便。兼容性可兼容于計算機中的其他軟件，和較多的常見系統(tǒng)?？梢浦残砸浦驳狡渌O(shè)備或者系統(tǒng)環(huán)境時仍能正常運行。4系統(tǒng)總體設(shè)計系統(tǒng)總體設(shè)計主要包括：系統(tǒng)概述設(shè)計和系統(tǒng)數(shù)據(jù)庫設(shè)計。4.1系統(tǒng)概述設(shè)計系統(tǒng)概述設(shè)計主要包括：功能模塊設(shè)計、系統(tǒng)流程分析、系統(tǒng)架構(gòu)設(shè)計、數(shù)據(jù)流圖和用例分析。4.1.1系統(tǒng)模塊設(shè)計課題計劃建立一個基于Web的H機械財務(wù)管理系統(tǒng)，要求實現(xiàn)員工用戶（個人資料管理、支出管理、收入管理），管理員用戶（系統(tǒng)用戶管理、員工管理、賬戶管理、收入管理、支出管理、系統(tǒng)管理）等功能。圖4.1系統(tǒng)模塊設(shè)計圖4.1.2系統(tǒng)流程分析用戶首先進入登錄界面，輸入用戶名、密碼、驗證碼后，進行登錄身份選擇。如果用戶是公司員工，則選擇員工身份進行登錄。登錄后進入了員工功能界面，員工可以對自己的賬戶進行信息修改，并查看自己的收入、支出情況。如果用戶是公司的管理員，則選擇管理員身份進行登錄。登錄后進入管理員功能界面，管理員除了可以對員工的所有功能進行操作外，還可以對自己的賬戶信息修改、員工管理和系統(tǒng)管理。圖4.2整體功能流程圖4.1.3員工、管理員功能設(shè)計圖4.3員工功能設(shè)計圖圖4.4管理員功能設(shè)計圖4.1.4系統(tǒng)架構(gòu)設(shè)計本財務(wù)管理系統(tǒng)采用的是三層架構(gòu)模式：WEB瀏覽器—開發(fā)工具—數(shù)據(jù)庫服務(wù)器來實財務(wù)管理系統(tǒng)的運行。三層架構(gòu)將用戶界面、產(chǎn)品功能和數(shù)據(jù)訪問三者合理分開，使結(jié)構(gòu)明確的模塊化。應(yīng)用邏輯層上則通過MyEclipse10開發(fā)工具和SQLServer數(shù)據(jù)庫服務(wù)器進行數(shù)據(jù)連接。如圖4.5所示：圖4.5三層架構(gòu)圖4.2系統(tǒng)數(shù)據(jù)庫設(shè)計 4.2.1系統(tǒng)數(shù)據(jù)庫概念設(shè)計數(shù)據(jù)庫的設(shè)計主要是建立數(shù)據(jù)庫和數(shù)據(jù)庫表，本系統(tǒng)中需要存儲的數(shù)據(jù)都是由數(shù)據(jù)庫來實現(xiàn)，數(shù)據(jù)庫在本課題網(wǎng)上訂餐系統(tǒng)中占有相當(dāng)分量的地位。數(shù)據(jù)庫搭建的質(zhì)量將對公司財務(wù)信息和員工信息的管理起到?jīng)Q定性的作用，數(shù)據(jù)庫結(jié)構(gòu)設(shè)計的優(yōu)劣對系統(tǒng)的運行效率、數(shù)據(jù)存儲效率以及系統(tǒng)功能的復(fù)雜性有很大的影響，因此正確地設(shè)計出數(shù)據(jù)庫結(jié)構(gòu)設(shè)計可以很好的提升系統(tǒng)的能力。從多方面因素綜合考慮，決定列出員工、管理員、財務(wù)管理、財務(wù)管理系統(tǒng)等幾個實體。其中一個管理員可以對多個員工進行管理，一個員工也可以被多個管理員管理；一個財務(wù)管理系統(tǒng)可以擁有多個管理員，一個管理員只能管理一個財務(wù)管理系統(tǒng)。系統(tǒng)實體E-R圖如下所示：圖4.9系統(tǒng)實體E-R圖5系統(tǒng)詳細設(shè)計5.1前端設(shè)計5.1.1登錄頁面設(shè)計\t"C:/Users/Administrator/AppData/Local/Temp/Rar$EXa9656.12895/PaperPass-%E6%97%97%E8%88%B0%E7%89%88-%E6%A3%80%E6%B5%8B%E6%8A%A5%E5%91%8A/htmls/detail_report/right"一個符合客戶需求財務(wù)管理系統(tǒng)，首先我們就要保證我們所設(shè)計網(wǎng)站的主頁就能為用戶留下較好的體驗，畢竟有一個更好的第一印象,會讓用戶在潛移默化之間提升對我們產(chǎn)品的認可度。所以我盡量是我的登陸界面更加的簡潔，為了提高登錄時的安全性，還增添了驗證碼登錄功能。系統(tǒng)登錄頁面在用戶進行登錄時，可根據(jù)用戶身份的不同，選擇員工登錄或者管理員登陸。管理員登陸界面：員工登陸界面：部分主要功能代碼：Stringerror=(String)request.getAttribute("error");if(error!=null){%>alert("用戶名或密碼錯誤");<%}%><%Stringrandom=(String)request.getAttribute("random");if(random!=null){%>alert("驗證碼錯誤");<%}%>popheight=39;functioncheck(){ if(document.form1.username.value==""||document.form1.pwd.value==""||document.form1.rand.value=="") { alert('請輸入完整'); returnfalse; }}functionloadimage(){document.getElementById("randImage").src="image.jsp?"+Math.random();}</script><bodyclass="login-bg"><divclass="loginlayui-animlayui-anim-up"><divclass="message">管理登錄</div><divid="darkbannerwrap"></div><formname="form1"method="post"action="jspmyjjxcwglxthsg0954CB?ac=adminlogin&a=a"class="layui-form"><inputname="username"id="username"placeholder="用戶名"type="text"lay-verify="required"class="layui-input"><hrclass="hr15"><inputname="pwd"id="pwd"lay-verify="required"placeholder="密碼"type="password"class="layui-input"><hrclass="hr15"> <selectname="cx"id="cx"> <optionvalue="管理員">管理員</option><optionvalue="員工">員工</option></select><hrclass="hr15"> <table><tr> <td><inputname="pagerandom"id="pagerandom"placeholder="驗證碼"type="text"lay-verify="required"class="layui-input"style="width:150px;"></td><td>  <ahref="javascript:loadimage();"><imgalt="看不清請點我！"name="randImage"id="randImage"src="image.jsp"class="code"style="cursor:pointer;width:100px;"></a></td> </tr></table> <hrclass="hr15"><inputvalue="登錄"lay-submitlay-filter="login"style="width:100%;"type="submit"onClick="returncheck();"><hrclass="hr20"></form></div><script>$(function(){layui.use('form',function(){varform=layui.form;//layer.msg('玩命賣萌中',function(){////關(guān)閉后的操作//});//監(jiān)聽提交form.on('submit(login)',function(data){//alert(888)document.form1.submit();returnfalse;});});})5.1.2員工賬戶添加設(shè)計用于管理員對公司新來員工進行賬戶注冊添加功能，其中工號、密碼、姓名、身份證號、電話等重要信息，我將其設(shè)置為必填內(nèi)容。而性別、照片、備注等信息則可進行選填。部分主要功能代碼：functionup(tt) { varpop=newPopup({contentType:1,isReloadOnClose:false,width:320,height:50});pop.setContent("contentUrl","upload.jsp?Result="+tt);pop.setContent("title","文件上傳");pop.build();pop.show(); } </script><linkrel="stylesheet"href="images/hsgcommon/common.css"type="text/css"><linkrel="stylesheet"href="images/hsgcommon/div.css"type="text/css"></head><scriptlanguage="javascript">functioncheck(){ if(document.form1.yonghuming.value==""){alert("請輸入用戶名");document.form1.yonghuming.focus();returnfalse;}if(document.form1.mima.value==""){alert("請輸入密碼");document.form1.mima.focus();returnfalse;}if(document.form1.xingming.value==""){alert("請輸入姓名");document.form1.xingming.focus();returnfalse;}}</script><body><%Stringid=request.getParameter("id");HashMapext=newHashMap();newCommDAO().update(request,response,"yonghuzhuce",ext,true,false,"");HashMapmmm=newCommDAO().getmaps("yonghuming",(String)request.getSession().getAttribute("username"),"yonghuzhuce");%><formaction="yonghuzhuce_updt2.jsp?f=f&id=<%=mmm.get("id")%>"method="post"name="f1"onsubmit="returncheckform();"><br>修改用戶注冊:<br><br><tablewidth="100%"border="1"align="center"cellpadding="3"cellspacing="1"bordercolor="#cccccc"style="border-collapse:collapse"><tr><td>用戶名：</td><td><inputname='yonghuming'type='text'id='yonghuming'value=''readonly="readonly"class="form-control"/><divstyle="margin-top:16px;">*此項不得修改</div></td></tr><tr><td>密碼：</td><td><inputname='mima'type='text'id='mima'value=''class="form-control"/></td></tr> <tr><td>姓名：</td><td><inputname='xingming'type='text'id='xingming'value=''class="form-control"/></td></tr> <tr><td>性別：</td><td><selectname='xingbie'id='xingbie'class="form-control"><optionvalue="男">男</option><optionvalue="女">女</option></select></td></tr> <tr><td>出生年月：</td><td><inputname='chushengnianyue'type='text'id='chushengnianyue'value=''onClick="WdatePicker({'dateFmt':'yyyy-MM-dd'})"readonly='readonly'class="form-control"/></td></tr> <tr><td>QQ：</td><td><inputname='QQ'type='text'id='QQ'value=''class="form-control"/></td></tr> <tr><td>郵箱：</td><td><inputname='youxiang'type='text'id='youxiang'value=''class="form-control"/></td></tr> <tr><td>電話：</td><td><inputname='dianhua'type='text'id='dianhua'value=''class="form-control"/></td></tr> <tr><td>身份證：</td><td><inputname='shenfenzheng'type='text'id='shenfenzheng'value=''class="form-control"/></td></tr> <tr><td>頭像：</td><td><inputname='touxiang'type='text'id='touxiang'size='50'value=''class="form-control"/><divstyle="margin-top:12px;"> <inputtype='button'value='上傳'onClick="up('touxiang')"/></div></td></tr> <tr><td>地址：</td><td><inputname='dizhi'type='text'id='dizhi'size='50'value=''class="form-control"/></td></tr> <tr><td>備注：</td><td><textareaname='beizhu'cols='50'rows='5'id='beizhu'class="form-control"style="width:600px;height:80px;"></textarea></td></tr><tr><td> </td><td><inputtype="submit"name="Submit"value="提交"onClick="returncheck();"class="btnbtn-infobtn-small"/><inputtype="reset"name="Submit2"value="重置"class="btnbtn-infobtn-small"/></td></tr></table></form>5.1.3收入信息設(shè)計公司收入有關(guān)的功能，比如管理員可以對公司全體員工的收入情況進行查詢，員工也可對自身收入信息進行添加和查詢。管理員收入查詢：員工收入添加：員工收入查詢：部分主要功能代碼：Stringid="";id=request.getParameter("id");%><scriptlanguage="javascript">functiongow(){ document.location.href="shouruxinxi_add.jsp?id=<%=id%>&zhanghubianhao="+document.form1.zhanghubianhao.value;}functionhsgxia2shxurxu(nstr,nwbk){ if(eval("form1."+nwbk).value.indexOf(nstr)>=0) { eval("form1."+nwbk).value=eval("form1."+nwbk).value.replace(nstr+"；",""); } else { eval("form1."+nwbk).value=eval("form1."+nwbk).value+nstr+"；"; }}</script><%HashMapext=newHashMap();if(request.getParameter("f")!=null){newCommDAO().commOper("updatezhanghuxinxisetyue=yue+"+request.getParameter("jine")+"wherezhanghubianhao='"+request.getParameter("zhanghubianhao")+"'");newCommDAO().insert(request,response,"shouruxinxi",ext,true,false,"");}%>Stringid=request.getParameter("id"); HashMapm=newCommDAO().getmap(id,"shouruxinxi");%>收入信息詳細:<br><br><tablewidth="100%"border="1"align="center"cellpadding="3"cellspacing="1"bordercolor="#cccccc"><tr><tdwidth='11%'>收入編號：</td><tdwidth='39%'><%=m.get("shourubianhao")%></td><tdwidth='11%'>賬戶編號：</td><tdwidth='39%'><%=m.get("zhanghubianhao")%></td></tr><tr><tdwidth='11%'>賬戶類型：</td><tdwidth='39%'><%=m.get("zhanghuleixing")%></td><tdwidth='11%'>銀行卡號：</td><tdwidth='39%'><%=m.get("yinxingkahao")%></td></tr><tr><tdwidth='11%'>余額：</td><tdwidth='39%'><%=m.get("yue")%></td><tdwidth='11%'>項目：</td><tdwidth='39%'><%=m.get("xiangmu")%></td></tr><tr><tdwidth='11%'>金額：</td><tdwidth='39%'><%=m.get("jine")%></td><tdwidth='11%'>摘要：</td><tdwidth='39%'><%=m.get("zhaiyao")%></td></tr><tr><tdwidth='11%'>收入日期：</td><tdwidth='39%'><%=m.get("shoururiqi")%></td><tdwidth='11%'>記賬人：</td><tdwidth='39%'><%=m.get("jizhangren")%></td></tr><tr><tdcolspan=4align=center><inputtype=buttonname=Submit5value=返回onClick="javascript:history.back()"/> <inputtype=buttonname=Submit5value=打印onClick="javascript:window.print()"/></td></tr></table>5.1.3支出信息設(shè)計公司支出有關(guān)的功能，比如管理員可以對公司全體員工的支出情況進行查詢，員工也可對自身支出信息進行添加和查詢。管理員支出查詢：員工支出添加：員工支出查詢：部分主要功能代碼：<li><a><iclass="iconfontleft-nav-li"></i><cite>系統(tǒng)用戶管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='yhzhgl.jsp'target='hsgmain'><iclass='iconfont'></i><cite>管理員用戶</cite></a></li><li><ahref='mod.jsp'target='hsgmain'><iclass='iconfont'></i><cite>修改密碼</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>員工管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='yuangongxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>員工添加</cite></a></li><li><ahref='yuangongxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>員工查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>賬戶管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='zhanghuxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>賬戶添加</cite></a></li><li><ahref='zhanghuxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>賬戶查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>支出管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='zhichuxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>支出查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>收入管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='shouruxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>收入查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>系統(tǒng)管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='databack.jsp'target='hsgmain'><iclass='iconfont'></i><cite>數(shù)據(jù)備份</cite></a></li></ul></li><% Stringid=request.getParameter("id"); HashMapm=newCommDAO().getmap(id,"zhichuxinxi");%>支出信息詳細:<br><br><tablewidth="100%"border="1"align="center"cellpadding="3"cellspacing="1"bordercolor="#cccccc"><tr><tdwidth='11%'>支出編號：</td><tdwidth='39%'><%=m.get("zhichubianhao")%></td><tdwidth='11%'>賬戶編號：</td><tdwidth='39%'><%=m.get("zhanghubianhao")%></td></tr><tr><tdwidth='11%'>賬戶類型：</td><tdwidth='39%'><%=m.get("zhanghuleixing")%></td><tdwidth='11%'>銀行卡號：</td><tdwidth='39%'><%=m.get("yinxingkahao")%></td></tr><tr><tdwidth='11%'>余額：</td><tdwidth='39%'><%=m.get("yue")%></td><tdwidth='11%'>項目：</td><tdwidth='39%'><%=m.get("xiangmu")%></td></tr><tr><tdwidth='11%'>金額：</td><tdwidth='39%'><%=m.get("jine")%></td><tdwidth='11%'>摘要：</td><tdwidth='39%'><%=m.get("zhaiyao")%></td></tr><tr><tdwidth='11%'>支出日期：</td><tdwidth='39%'><%=m.get("zhichuriqi")%></td><tdwidth='11%'>記賬人：</td><tdwidth='39%'><%=m.get("jizhangren")%></td></tr><tr><tdcolspan=4align=center><inputtype=buttonname=Submit5value=返回onClick="javascript:history.back()"/> <inputtype=buttonname=Submit5value=打印onClick="javascript:window.print()"/></td></tr></table>5.1.3功能界面設(shè)計用于員工以及管理員進行登陸操作后的功能使用界面。員工功能界面：部分主要功能代碼： <li><a><iclass="iconfontleft-nav-li"></i><cite>個人資料管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='yuangongxinxi_updt2.jsp'target='hsgmain'><iclass='iconfont'></i><cite>修改個人資料</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>支出管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='zhichuxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>支出添加</cite></a></li><li><ahref='zhichuxinxi_list2.jsp'target='hsgmain'><iclass='iconfont'></i><cite>支出查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>收入管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='shouruxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>收入添加</cite></a></li><li><ahref='shouruxinxi_list2.jsp'target='hsgmain'><iclass='iconfont'></i><cite>收入查詢</cite></a></li></ul></li>管理員功能界面：部分主要功能代碼：<li><a><iclass="iconfontleft-nav-li"></i><cite>系統(tǒng)用戶管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='yhzhgl.jsp'target='hsgmain'><iclass='iconfont'></i><cite>管理員用戶</cite></a></li><li><ahref='mod.jsp'target='hsgmain'><iclass='iconfont'></i><cite>修改密碼</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>員工管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='yuangongxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>員工添加</cite></a></li><li><ahref='yuangongxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>員工查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>賬戶管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='zhanghuxinxi_add.jsp'target='hsgmain'><iclass='iconfont'></i><cite>賬戶添加</cite></a></li><li><ahref='zhanghuxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>賬戶查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>支出管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='zhichuxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>支出查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>收入管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='shouruxinxi_list.jsp'target='hsgmain'><iclass='iconfont'></i><cite>收入查詢</cite></a></li></ul></li> <li><a><iclass="iconfontleft-nav-li"></i><cite>系統(tǒng)管理</cite><iclass="iconfontnav_right"></i></a><ulclass="sub-menu"> <li><ahref='databack.jsp'target='hsgmain'><iclass='iconfont'></i><cite>數(shù)據(jù)備份</cite></a></li></ul></li>5.1.4員工、賬戶信息界面設(shè)計用于員工對自己個人信息的查看修改，管理員對賬戶進行添加和查詢操作。員工修改個人信息：賬戶添加：賬戶查詢：部分主要功能代碼：<p>已有員工信息列表：</p><formname="form1"id="form1"method="post"action="">搜索:工號：<inputname="gonghao"type="text"id="gonghao"class="form-control2"/>姓名：<inputname="xingming"type="text"id="xingming"class="form-control2"/>性別：<selectname='xingbie'id='xingbie'class="form-control2"><optionvalue="">所有</option><optionvalue="男">男</option><optionvalue="女">女</option></select>身份證：<inputname="shenfenzheng"type="text"id="shenfenzheng"class="form-control2"/>電話：<inputname="dianhua"type="text"id="dianhua"class="form-control2"/><inputtype="submit"name="Submit"value="查找"class="btnbtn-infobtn-small"/><inputtype="button"name="Submit2"value="導(dǎo)出EXCEL"class="btnbtn-infobtn-small"onClick="javascript:location.href='yuangongxinxi_listxls.jsp';"/></form><tablewidth="100%"border="1"align="center"cellpadding="3"cellspacing="1"bordercolor="#F3F3F3"><tr><tdwidth="30"height="50"align="center"bgcolor="#E6E6E6">序號</td><tdbgcolor='#cccccc'>工號</td><tdbgcolor='#cccccc'>密碼</td><tdbgcolor='#cccccc'>姓名</td><tdbgcolor='#E6E6E6'width='40'align='center'>性別</td><tdbgcolor='#cccccc'>身份證</td><tdbgcolor='#cccccc'>電話</td><tdbgcolor='#E6E6E6'width='90'align='center'>照片</td> <tdwidth="138"height="50"align="center"bgcolor="#E6E6E6">添加時間</td><tdwidth="60"height="50"align="center"bgcolor="#E6E6E6">操作</td></tr><% newCommDAO().delete(request,"yuangongxinxi");Stringurl="yuangongxinxi_list.jsp?1=1";Stringsql="select*fromyuangongxinxiwhere1=1"; if(request.getParameter("gonghao")==""||request.getParameter("gonghao")==null){}else{sql=sql+"andgonghaolike'%"+request.getParameter("gonghao")+"%'";}if(request.getParameter("xingming")==""||request.getParameter("xingming")==null){}else{sql=sql+"andxingminglike'%"+request.getParameter("xingming")+"%'";}if(request.getParameter("xingbie")==""||request.getParameter("xingbie")==null){}else{sql=sql+"andxingbielike'%"+request.getParameter("xingbie")+"%'";}if(request.getParameter("shenfenzheng")==""||request.getParameter("shenfenzheng")==null){}else{sql=sql+"andshenfenzhenglike'%"+request.getParameter("shenfenzheng")+"%'";}if(request.getParameter("dianhua")==""||request.getParameter("dianhua")==null){}else{sql=sql+"anddianhualike'%"+request.getParameter("dianhua")+"%'";}sql+="orderbyiddesc"; ArrayList<HashMap>list=PageManager.getPages(url,15,sql,request); inti=0; for(HashMapmap:list){ i++; %><tr<% if((i%2)==0) { out.print("bgcolor='#F0F0F0'"); } else { out.print("bgcolor='#FFFFFF'"); } if((i%2)==0) { %>onmouseover="this.style.backgroundColor='#F9DFEB'"onmouseout="this.style.backgroundColor='#F0F0F0'"<% } else { %>onmouseover="this.style.backgroundColor='#F9DFEB'"onmouseout="this.style.backgroundColor='#FFFFFF'"<% } %>><tdwidth="30"height="50"align="center"><%=i%></td><td><%=map.get("gonghao")%></td><td><%=map.get("mima")%></td><td><%=map.get("xingming")%></td><tdalign='center'><%=map.get("xingbie")%></td><td><%=map.get("shenfenzheng")%></td><td><%=map.get("dianhua")%></td><tdwidth='90'align='center'><aclass="btnbtn-infobtn-small"href='<%=map.get("zhaopian")%>'target='_blank'><imgsrc='<%=map.get("zhaopian")%>'width=88height=99border=0/></a></td> <tdwidth="138"height="50"align="center"><%=map.get("addtime")%></td><tdwidth="60"height="50"align="center"><!--lianjie1--><aclass="btnbtn-infobtn-small"href="yuangongxinxi_detail.jsp?id=<%=map.get("id")%>">詳細</a></td></tr> <%}%><inputtype="submit"name="Submit"value="查找"class="btnbtn-infobtn-small"/><inputtype="button"name="Submit2"value="導(dǎo)出EXCEL"class="btnbtn-infobtn-small"onClick="javascript:location.href='yuangongxinxi_listxls.jsp';"/></form><tablewidth="100%"border="1"align="center"cellpadding="3"cellspacing="1"bordercolor="#F3F3F3"><tr><tdwidth="35"height="50"align="center"bgcolor="#E6E6E6">序號</td><tdbgcolor='#E6E6E6'>工號</td><tdbgcolor='#E6E6E6'>密碼</td><tdbgcolor='#E6E6E6'>姓名</td><tdbgcolor='#E6E6E6'width='40'align='center'>性別</td><tdbgcolor='#E6E6E6'>身份證</td><tdbgcolor='#E6E6E6'>電話</td><tdbgcolor='#E6E6E6'width='90'align='center'>照片</td> <tdwidth="138"height="50"align="center"bgcolor="#E6E6E6">添加時間</td><