基于web的家政服務網站

?

內容摘要

由于互聯網的使用,人們在管理、應用、服務等領域使用數據更加簡潔、方便,大大提高了工作效率。互聯網正逐漸融入我們的生活,影響和改變我們的生活。

家政服務管理系統是典型的信息管理系統(MIS)。其開發主要包括后臺數據庫的建立與維護和前端應用程序的開發兩個方面。前者要求數據庫具有較強的數據一致性、完整性和良好的數據安全性;后者要求應用程序功能齊全、使用方便。

建立家政服務管理系統,可以解決以往信息處理緩慢的問題,快速、直接地讓客戶發布自己的需求,也可以讓家政公司快速獲取信息做出響應,為客戶提供及時的服務。

通過使用家政服務系統,使得家政服務的管理工作系統化、規范化、自動化、簡易化、智能化、從而達到提高家政服務管理效率的目的。

關鍵詞:家政服務 數據庫 網站設計

Abstract

Because of the use of the Internet, people use data in the fields of management, application, service and so on more concise and convenient, which greatly improves the working efficiency. The Internet is gradually integrating into our lives, affecting and changing our lives.

The establishment of room service management system can solve the problem of slow information processing in the past, quickly and directly let customers release their own needs, but also let the room company quickly obtain information to respond, and provide timely service to customers.

Home service management system is a typical information management system (MIS). Its development mainly includes the establishment and maintenance of the maintenance and the front-end application development two aspects. The former requires the database to have strong data consistency, integrity and good data security; the latter requires the application to be fully functional and easy to use.

Through the use of domestic service system, the management of domestic service stores is systematized, standardized, automated, simple and intelligent, so as to improve the efficiency of domestic service management.

Keywords: Housekeeping Service Database Website design

第一章 緒論

1.1研究背景

伴隨21世紀互聯網快速的推廣和我國市場經濟的快速發展,人們的生活和工作節奏越來越快,工作任務越來越重,許多人們已經沒有時間去顧及家務。過去進行線下服務的家政公司,對于當前的家政需求而言,處理信息的效率太低,提供服務的速度太慢。如何利用互聯網的優勢,將家政服務管理信息化,加快人們發布需求和享受服務的速度,這是當前社會所需要解決的問題。因此,迫切需要開發一個利用互聯網來管理家政行業的信息系統[1]。

1.2研究意義

一個家政公司的客戶(雇主)和家政人員的信息管理是以一個極其重要而且相當繁瑣的環節,這項工作需要投入大量的人力物力去進行統計和管理。但如果一個家政服務網站管理系統的成功建立,就可以統一管理大量的數據,而且對信息能夠進行快速的增刪查改。對于減少管理人員的工作量與工作時間,提高處理信息的效率有著顯著的作用。

這樣一個安全,快捷,方便的家政服務網站管理系統可以人們帶來極大的方便,可以給家政公司的發展帶來巨大的效益[3]。

所以,在信息網絡化的大趨勢下,特提出一種基于Web的家政服務網站管理系統,并用MYSQL數據庫與JavaScript技術結合進行了該網站的開發。

1.3主要研究內容

基于web的家政服務網站才有了B/S結構,采用這樣的體系結構來實現對整個系統的架構管理,這樣就提高了管理的工作效率,它不受地域限制,不受時間限制,任何人在任何時候都可以通過使用這個系統來進行交流互動,這樣就節約了時間,提高了工作效率,降低了各種成本。

本系統設計的目標就是建立一個信息量豐富,界面美觀,信息真實可靠的家政服務網站。為了保證開發一個成熟穩定的家政服務網站,對本家政服務網站的基本功能模塊進行分析之后,我決定采用Eclipse集成開發平臺進行開發,數據庫采用MYSQL數據庫管理系統結合JavaScript技術進行開發,Eclipse開發平臺是一個集成開發環境,利用這個平臺它可以非常方便的開發客戶所需要系統,大大提高了開發的速度和效率。

整個系統分為兩個部分,第一部分是前臺界面和后臺界面的設計與功能實現。第二部分是數據庫設計,即設計所用的數據表。

第二章 可行性分析

2.1技術可行性

根據用戶需求的系統功能、性能,從技術的角度來研究系統的可行性。家政服務系統采用Eclipse作為開發平臺,使用JavaScript技術和MYSQL數據庫管理系統進行系統的設計與實現。

2.1.1 開發環境介紹

家政服務管理系統開發的軟件環境:

系統開發工具:Eclipse

開發語言:JavaScript

開發系統:Microsoft Windows 2003 Server/ Microsoft Windows XP

數據庫管理系統:MYSQL

制圖輔助網站:https://www.processon.com/

建模輔助網站:https://www.xiaopiu.com

2.1.2 Eclipse與JavaScript介紹

1.Eclipse介紹

Eclipse是一個集成開發環境(Integrated Development Environment),最初是IBM(其前身是Visual Age for Java)投資4000萬元開發出來的軟件產品。到2001年11月,IBM宣布將Eclipse捐獻給開放源碼組織Eclipse.org。Eclipse是的體系機構是可擴展的,可以集成不同軟件開發商開發出來的產品,將他們的工具和組件加入到Eclipse平臺中。

Eclipse的設計理念是一個可擴展的核心結構(一切皆為插件)。其自身的核心非常小,其它的功能通過插件的形式將選定的擴展開發工具集成到Eclipse平臺的核心中。所以這樣Eclipse就不會有工具不兼容帶來的麻煩,大大提高了工作效率,降低了開發成本[12]。

2.JavaScript介紹

JavaScript一種直譯式腳本語言,是一種動態類型、弱類型、基于原型的語言,內置支持類型。它的解釋器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用于客戶端的腳本語言,最早是在HTML(標準通用標記語言下的一個應用)網頁上使用,用來給HTML網頁增加動態功能[5]。

2.1.3 MYSQL介紹

本次開發的時候選擇的是MYSQL數據,MYSQL數據庫是一個不用花錢的數據庫,使用起來也非常快捷方便。它是一個關系型數據庫的系統,能夠將數據信息存儲在不同的表中,而不是把所有的數據庫都放在一起。MYSQL數據庫擁有體積小和高靈活性等優點,而且又是免費的軟件,所以大部分的中小網站的開發都將MYSQL作為第一選擇的數據庫。

MYSQL是屬于Oracle公司,它屬于多用戶和多線程的數據庫。它的體積小以及運行的速度特別快,能夠同時對上萬條數據信息進行處理,而且它能夠支持SQL通用的一些語句,并且擁有良好的數據可移植性,因此有很多的系統都選擇MYSQL數據庫,這樣可以降低其技術成本。

除了以上之外,MYSQL數據庫還擁有其他許多的功能,比如他們能夠支持很多大型的數據庫,可以更加方便的來管理這些數據,對于相關系統進行支持,因此也便于公司對其進行快速的管理[13]。

2.2經濟可行性

所謂經濟可行性是指系統進行成本效益分析,評估項目的開發成本,估算開發成本是否會超過項目預期的全部利潤。而家政服務網站的實現和使用在經濟上是效益比較高的。網站主要有軟件和硬件統一結合,硬件上使用現有電腦和網絡設備即可。軟件采用Eclipse和MYSQL即可實現。因此,本網站在經濟上是可行的。

2.3操作可行性

隨著網絡信息技術快速的發展和人們生活水平的提高,家政服務行業在我們生活中越來越普及,主要面向有需求的客戶、家政人員和管理員開發,前臺客戶可以通過網站發布自己的家政需求,家政人員可對前臺客戶發布的家政需求進行申請和應聘,后臺管理員可以通過網站對公司各方面的信息進行管理,以便于工作效率的提高。因此本網站在操作上是可以實現的。

第三章 需求分析

3.1系統需要解決的問題

作為一個獨立的家政服務網站,它必須能夠實現一些基本功能,主要包括:不同的角色登錄管理功能,不同的角色進入系統后會有不同的權限,這需要嚴格劃分。

  1. 用戶(雇主)權限:

注冊用戶會員

發布需求信息

瀏覽家政人員的詳細信息

與家政服務人員可進行郵件溝通

給家政服務人員的服務進行評價

用戶(雇主)個人空間:

維護個人信息

查看訂單以及合同記錄

投訴與建議

(2)家政服務人員權限:

可查看用戶(雇主)發布的家政需求信息并進行應聘申請

可查看用戶(雇主)的詳細信息(例如需求與地址等)

家政服務人員個人空間:

維護自己的信息

查看訂單以及合同記錄

投訴和建議

(3)管理員權限:

審核和維護用戶(雇主)和家政人員的個人信息

錄入合同信息

答復用戶(雇主)和家政人員的投訴和建議

黑名單管理(將信用不好的用戶(雇主)和家政人員拉入黑名單)

招聘信息管理

3.2系統需求分析

隨著市場經濟的發展,人們生活節奏的加快,家政服務行業已經成為了日常生活中不可或缺的一部分。隨著家政服務需求的不斷增加和家政服務種類的多樣化,能否提高家政服務體系的管理效率已成為大多數家政服務中介公司亟待解決的問題。

以往采用手工統計的方式來管理信息,已經無法滿足目前家政服務中介公司和眾多用戶的需求。此外,在傳統家政服務行業,無論是家政服務求職者還是有家政需求的客戶,獲取信息(電話聯系或者廣告)的方式也是相當耗時耗力低效率的。

利用計算機處理信息的能力,建立一個功能齊全,安全便捷的家政服務網站管理系統,對于求職人員是解決找工作上的渠道少的問題,對于客戶來說是解決了發布需求緩慢,選擇少的問題。

所以,建立一個功能齊全,安全便捷的家政服務網站管理系統,是一個在大趨勢下多贏的方案[2]。

第四章 系統總體設計

4.1系統設計方案

家庭服務網站管理系統是為廣大家政服務求職者和家政服務客戶所開發的系統。它完成了用戶在首頁的信息瀏覽、注冊操作和后臺管理員的信息匹配工作。系統的主要用戶角色有:后臺管理員、家政服務人員、用戶(雇主)。具體設計方案如下:

前臺的模塊包括:

首頁:主要包括導航欄、用戶(雇主)登錄入口、需求發布入口、家政人員分類查看鏈接以及相關的友情鏈接等幾個模塊。

家政人員個人空間:這是一個提供給家政人員的頁面,其主要內容是家政求職人員個人信息的維護(信息的錄入和注冊),寫入的數據直接與后臺數據庫連接,方便管理員管理。

用戶(雇主)個人空間:這是一個提供給客戶的頁面。所有類型的用戶(雇主)都可以直接訪問此頁。其主要內容是客戶個人信息的維護(信息錄入和登記)。所寫數據直接與后臺數據庫連接,方便管理員管理。

網站介紹:主要介紹本家政公司具體的聯系方式和網站地址信息。

后臺的設計主要是為了方便管理員的各種管理操作,將在后面的功能模塊管理員功能中詳細講解。

4.2系統功能模塊劃分

本家政服務網站管理系統主要涉及功能模塊如下:

1.用戶(雇主):瀏覽網站頁面信息,注冊成為會員,發布家政需求信息,瀏覽家政人員的個人信息,發送和接收郵件,評價家政人員服務,維護個人信息等。

2.家政人員:瀏覽用戶(雇主)的需求信息并可進行應聘申請,發送和接收郵件,維護個人信息等。

3.管理員:

(1) 管理員管理

超級管理員:名為tsoft的管理員。主要功能有:添加、刪除、修改普通管理員;擁有普通管理員的所有權限。

普通管理員:

主要功能:瀏覽用戶(雇主)和員工信息,修改自己的信息;添加、刪除和修改企業文化、生活常識和家政服務分類信息;添加、刪除和修改客用戶(雇主)和家政服務人員信息,實現家政服務人員和用戶(雇主)的匹配管理。

(2) 信息管理

用戶(雇主)的信息管理:對客戶信息的進行增刪查改。

家政人員的信息管理:對家政人員信息的進行增刪查改。

  1. 合同信息管理

錄入合同信息

(4) 其他管理

留言板管理:留言內容的瀏覽、回復留言、刪除留言。

黑名單管理:將信用不好的用戶(雇主)和家政人員拉入黑名單

投訴信箱管理:查看投訴以及回復和處理投訴

4.3系統基本設計和處理流程

本網站系統的角色分為用戶(雇主),家政服務人員和后臺管理人員,因此系統流程分為三個方面,分別如下:

添加圖片注釋,不超過 140 字(可選)

圖4-1 用戶(雇主)業務流程圖

添加圖片注釋,不超過 140 字(可選)

圖4-2 家政人員業務流程圖

添加圖片注釋,不超過 140 字(可選)

圖4-3 后臺管理人員業務流程圖

第五章 數據庫設計

5.1系統概念數據模型設計

根據以上章節對系統功能和系統流程所做的分析,對本網站系統使用的數據庫實體類的規劃如下:

1.用戶(雇主)實體

包括用戶(雇主)姓名,用戶(雇主)性別,用戶(雇主)地址,用戶(雇主)郵箱,用戶(雇主)手機號碼,是否為VIP(0表示不是,1表示是),登錄注冊ID

2.家政服務人員實體

包括家政服務人員姓名,家政服務人員性別,家政服務人員頭像,家政服務人員簡介信息,擅長的工作,外鍵(所屬家政公司),預約狀態,登錄注冊ID

3.后臺管理人員實體

包括管理人員姓名,管理人員密碼,管理人員手機號,登錄注冊ID

4.預約表實體

包括預約時間,預約地點,預約聯系方式,預約狀態(0表示結束了,1表示未結束),外鍵(與用戶(雇主)表連接),外鍵(與家政服務人員信息表連接)

5.評價表實體

包括評論內容,評價的等級(0表示差評,1表示中評,2表示好評),外鍵(與家政服務人員信息連接),評論時間

6.家政公司實體

包括家政公司名稱,家政公司電話,家政公司地址,家政服務人員ID

7.登錄表實體

包括登錄名稱,登錄密碼,登錄角色(0為雇主,1為家政服務人員,2為管理人員),登錄狀態(0為黑名單,1為正常)

8.VIP信息表實體

包括VIP姓名

9.郵件信息表實體

包括郵件標題,郵件具體內容,郵件狀態(0表示未讀,1表示已讀),雇主ID,家政服務人員ID

10.合同信息表實體

包括合同標題,雇主ID,家政服務人員ID,外鍵(與從事類型表連接),家政公司ID

11.從事類別信息表實體

包括從事類別

12.服務項目信息表實體

包括服務項目

13.黑名單信息表實體

包括家政服務人員ID,外鍵(用戶(雇主)ID)

5.2系統數據庫物理結構設計

根據數據庫概念結構和邏輯結構的設計,再轉換為物理結構,可以得到以下關鍵數據表:

表5-1 用戶(雇主)信息表(house_customer)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

cm_id

int

15

PK

自增ID

2

cm_name

varchar

20

雇主姓名

3

cm_sex

varchar

8

雇主性別

4

cm_email

varchar

50

雇主郵箱

5

cm_address

varchar

30

雇主地址

6

cm_phone

varchar

50

雇主手機號

7

cm_isvip

int

2

是否是VIP(0表示不是,1表示是)

8

login_id

Int

15

FK

登錄注冊ID

表5-2 家政人員信息表(house_housekeeper)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

hk_id

int

15

PK

自增ID

2

hk_name

varchar

20

保姆姓名

3

hk_id

varchar

2

保姆性別

4

hk_desc

varchar

255

保姆簡介

5

hk_headphoto

varchar

255

保姆頭像

6

hk_isvip

Int

2

是否是VIP

7

hk_work

Varchar

100

擅長的工作

8

cp_id

int

15

FK

外鍵(與家政公司信息表鏈接)

9

hk_status

int

2

預約狀態

10

login_id

Int

15

FK

登錄注冊ID

表5-3 管理員表(house_admin)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

ad_id

int

15

PK

自增ID

2

ad_name

Varchar

20

管理員姓名

3

ad_password

Varchar

30

管理員密碼

4

ad_phone

varchar

50

管理員手機號

5

login_id

Int

15

FK

登錄注冊ID

表5-4 預約表(house_appointment)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

ap_id

int

15

PK

自增ID

2

cm_id

int

15

FK

外鍵(雇主表鏈接)

2

ap_begintime

date

4

預約時間

3

ap_address

varchar

50

預約地點

4

ap_phone

varchar

50

預約聯系方式

5

ap_status

int

4

預約狀態,0表示結束了,1表示未結束

6

hk_id

int

15

FK

外鍵(與保姆信息表相鏈接)

表5-5 評價表(house_comment)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

comment_id

int

15

PK

自增ID

2

comment_content

varchar

200

評論內容

3

comment_star

int

8

評價的等級(0表示差評,1表示中評,2表示好評)

4

hk_id

int

15

FK

外鍵,與保姆表相連接

5

comment_time

datetime

評論時間

表5-6 家政公司表(house_company)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

cp_id

int

15

PK

自增ID

2

cp_name

varchar

20

家政公司名稱

3

cp_phone

varchar

50

家政公司電話

4

cp_address

varchar

50

家政公司地址

5

hk_id

Int

15

FK

保姆ID

表5-7 登錄表(house_login)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

login_ID

int

11

PK

自增ID

2

login_username

varchar

255

登錄名稱

3

login_password

varchar

255

登錄密碼

4

login_roletype

int

8

登錄角色(0為雇主,1為保姆,2管理員)

5

login_status

Int

11

登錄狀態(0表示黑名單,1表示正常)

表5-8 VIP信息表(house_vipComment) 結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

v_id

int

15

PK

自增ID

2

v_name

varchar

20

VIP姓名

表5-9 郵件信息表(house_email)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

me_id

int

15

PK

自增ID

2

me_title

varchar

30

郵件標題

3

me_content

varchar

255

郵件內容

4

me_status

int

8

郵件狀態(0表示未讀,1表示已讀)

5

cm_id

int

15

FK

雇主ID

6

hk_id

int

15

FK

保姆ID

表5-10 合同信息表(house_ordertab)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

order_id

int

15

PK

自增ID

2

order_title

Varchar

30

合同標題

3

cm_id

Int

15

FK

雇主ID

4

hk_id

Int

15

FK

保姆ID

5

type_id

int

15

FK

外鍵(與從事類型表鏈接)

6

cp_id

Int

15

FK

家政公司ID

表5-11 從事類別信息表(house_type)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

type_id

int

15

PK

自增ID

2

type_name

Varchar

30

從事類別

表5-12 服務項目信息表(house_typedetail)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

typed_id

int

15

PK

自增ID

2

typed_id

varchar

30

服務項目

3

type_id

Int

15

外鍵(與從事類別表鏈接)

表5-13 黑名單信息表(house_bedlist)結構表

序號

字段名

數據類型

長度

主外鍵

是否可空

描述

1

b_id

int

15

PK

自增ID

3

hk_id

Int

15

FK

保姆ID

4

cm_id

Int

15

FK

外鍵(用戶(雇主)ID)

第六章 系統的設計與實現

6.1系統首頁模塊的設計與實現

本網站系統首頁主要由導航欄模塊,家政服務分類模塊,預約模塊,家政人員查看模塊等幾個模塊組成。

導航欄模塊包括首頁按鈕,退出按鈕和個人中心按鈕。

家政服務分類模塊就是家政服務的分類查看,包括鐘點工、住家、做飯、做飯、照料、清潔等。

預約模塊就是雇主發布家政需求的界面,需要輸入的信息包括日期、服務類型、地點和聯系方式。輸入所需信息后點擊“立即發布”,如果發送成功就彈出“發布成功”的文本框提醒。

系統首頁界面,如圖6-1所示:

添加圖片注釋,不超過 140 字(可選)

圖6-1 首頁界面

6.2系統注冊模塊的設計與實現

如果用戶第一次進行系統,需要注冊一個屬于自己的賬號,依次輸入用戶名,密碼和重復輸入密碼,點擊注冊后程序會判斷輸入是否為空,不為空就將數據返回數據庫,判斷用戶名是否已經被注冊過,如果沒有被注冊過則將數據存進數據庫里,就算注冊成功了。這里特別注意的是,用戶在注冊的時候需要選擇自己的角色。當選擇的角色為普通用戶,數據庫中的登錄表的login_roletype為0,當選擇的角色為家政人員,數據庫的登錄表的login_roletype為1。

系統注冊界面,如圖6-2所示:

添加圖片注釋,不超過 140 字(可選)

圖6-2 系統注冊界面

6.3系統登錄模塊的設計與實現

用戶注冊成功之后會自動跳轉到用戶登錄界面,輸入已經注冊了的用戶名和密碼(系統會自動識別用戶(雇主)與家政人員身份,用的是user.getRole()方法來自動識別),若輸入的用戶和密碼錯誤或用戶未注冊,系統登錄失敗;若輸入的用戶名和密碼正確,則登錄成功并跳轉至系統首頁。

系統登錄界面,如圖6-3所示:

添加圖片注釋,不超過 140 字(可選)

圖 6-3 系統登錄界面

其實現代碼如下:

@RequestMapping(value="/login",method=RequestMethod.POST)

public String UserLogin(Model model,HttpSession session,User user, @RequestParam("vertifyCode") String vertifyCode) {

ResponseResult<Integer> response = new ResponseResult<>();

String frontVertifyCode = vertifyCode.toUpperCase();

String behindVertifyCode = session.getAttribute("vertifyCode").toString().toUpperCase();

if(!frontVertifyCode.equals(behindVertifyCode)) {

response.setState(502); //彈窗驗證碼錯誤,請重新輸入

return "redirect:login";

}

user = service.findByLogin(user.getUsername(), user.getPassword(), user.getRole());

if(user != null) {

session.setAttribute("user", user);

if(user.getRole() == 0) { //雇主界面

return "redirect:index";

}

else if(user.getRole() == 1) { //保姆界面

return "hkbase_index";

}

}

return "redirect:login";

6.4用戶(雇主)功能模塊的設計與實現

6.4.1用戶的個人中心

用戶登錄成功之后點擊首頁導航欄上“個人中心”按鈕進入個人中心界面,用戶進入個人中心界面之后可對個人資料、密碼管理、消息管理等幾個模塊進行操作。

用戶點擊個人資料按鈕進入個人資料界面可對自己的資料進行修改。可修改的資料包括頭像、用戶名、昵稱、郵箱。手機不可修改,因為手機就是登錄ID。修改完成后點擊提交按鈕,如果修改成功即會彈出“修改成功”的文本提醒。

用戶點擊密碼管理按鈕進入密碼管理界面,可進行修改個人的登錄密碼的操作,修改密碼需要輸入原始密碼,如果原始密碼錯誤,將修改失敗;需兩次填寫新密碼,填寫完成后,提交即可修改密碼,密碼修改成功后則系統退出到登錄界面進行重新登錄。

用戶點擊消息管理按鈕進入消息管理界面,可對家政人員的留言進行查看和回復。

用戶個人中心界面,如圖6-4和圖-5所示:

添加圖片注釋,不超過 140 字(可選)

圖6-4 用戶個人資料界面

添加圖片注釋,不超過 140 字(可選)

圖6-5 用戶修改密碼界面

6.4.2用戶發布家政需求(預約)

用戶發布預約是在登錄之后的首頁(如下圖的右側)界面進行的,用戶在輸入日期、需要的服務類型、地址和聯系方式之后點擊立即發布按鈕即可,如果發布成功就會彈出“發布成功”的文本提醒。發布之后家政人員就可以進行申請和應聘。雇主在查看家政的工作履歷以及評價之后,在雙方的溝通之后滿意的話,就可進行工作安排了。

用戶發布需求(預約)界面,如圖6-6所示:

添加圖片注釋,不超過 140 字(可選)

圖6-6 用戶發布家政需求(預約)界面

其實現代碼如下:

String appAddress = appAddressCity + "-" + appAddressArea + "-" + appAddressDetail;

Appointment appointment = new Appointment();

appointment.setAppAddress(appAddress);

appointment.setAppType(appType);

appointment.setAppPhone(appPhone);

appointment.setAppBeginTime(FormatDate.StrToDate(appTime));

System.out.println("預約地點:" + appAddress + "預約類型:" + appType + "預約電話:" + appPhone);

appService.insertAppointment(appointment, username);

return new ResponseResult<Void>();

6.4.3用戶的預約管理

用戶點擊導航欄上的“我的預約”按鈕跳轉到預約界面,可對自己發布過的預約進行查看和刪除,對還在進行的預約進行查看和取消。用戶點擊查看按鈕可查看預約的詳細信息,點擊刪除按鈕即把記錄刪除,點擊取消按鈕即取消當前的預約。

用戶的預約管理界面,如圖6-7和圖6-8所示:

添加圖片注釋,不超過 140 字(可選)

圖6-7 用戶預約界面

添加圖片注釋,不超過 140 字(可選)

圖6-8 用戶的預約詳情界面

其實現代碼如下:

@RequestMapping("/getAllApp")

@ResponseBody

public ResponseResult<List<Appointment>> getAllApp (

HttpSession session

) {

ResponseResult<List<Appointment>> result = new ResponseResult<>();

List<Appointment> list = appService.getAllApp(session);

result.setData(list);

return result;}

6.4.4用戶的訂單管理

用戶點擊導航欄上“我的訂單”按鈕跳轉到訂單界面,點擊評價按鈕可對已完成的訂單進行評價,即對家政人員的服務進行評價。點擊查看按鈕可對進行中的訂單可進行查看。

用戶訂單管理界面,如圖6-9所示:

添加圖片注釋,不超過 140 字(可選)

圖6-9用戶訂單管理界面

6.5家政人員功能模塊的設計與實現

6.5.1家政人員的個人中心

家政人員登錄成功之后點擊導航欄上的“個人中心”按鈕進入個人中心界面,可對個人信息、家政資料、消息、家政認證等幾個模塊進行管理。

點擊個人信息按鈕進入個人信息界面,可對個人信息進行修改,可修改的有頭像、昵稱、郵箱。用戶名無法修改,因為用戶名是家政人員的真實姓名,認證之后才能有權限對雇主的預約進行申請和應聘。手機是登錄ID,同樣無法修改。

點擊家政資料按鈕進入家政資料界面,可對個人的工作履歷和用戶評價進行查看但無法修改。

點擊消息按鈕進入消息界面,可對雇主的留言進行查看和回復。

點擊家政認證按鈕進入家政認證界面,可對個人的家政認證(后臺管理員對家政人員個人真實信息的認證)進行查看但無法修改。

家政人員個人中心界面,如圖6-10、圖6-11和圖6-12所示:

添加圖片注釋,不超過 140 字(可選)

圖6-10家政人員個人資料界面

添加圖片注釋,不超過 140 字(可選)

圖6-11 家政人員的消息界面

添加圖片注釋,不超過 140 字(可選)

圖 6-12 家政人員的家政認證界面

6.5.2家政人員的預約申請

家政人員點擊導航欄上的“我的預約”按鈕進入預約界面,可查看所有雇主發布過的預約。家政人員可對此可進行申請,點擊申請按鈕即可,如果成功的話就會彈出“申請成功”的文本提醒。

家政人員預約申請界面,如圖6-13所示:

添加圖片注釋,不超過 140 字(可選)

圖6-13 家政人員預約申請界面

6.5.3家政人員的留言

家政人員點擊留言按鈕進入留言界面,可以給雇主進行留言,與雇主進行溝通。在文本框中進行編輯,編輯完成后點擊發送。如果發送成功便會彈出“發送成功”的文本提醒。

家政人員留言界面,如圖6-14所示:

添加圖片注釋,不超過 140 字(可選)

圖6-14 家政人員留言界面

其實現代碼如下:

@RequestMapping("/insertMessageCM")

@ResponseBody

public ResponseResult<Void> insertMessageCustomer(HttpSession session,

@RequestParam("id")int toID,

@RequestParam("msgContent")String msgContent){

messageService.insertMessageBYCustomer(msgContent, session, toID);

return new ResponseResult<>();}

6.6后臺管理功能模塊的設計與實現

后臺管理員有兩個主要的模塊—賬號管理和認證管理。賬號管理包賬括量化查看、賬戶管理、修改密碼。認證管理有家政人員認證管理功能。

6.6.1賬戶管理

管理員在“后臺管理”中點擊賬戶管理按鈕進入賬戶管理界面進行添加、修改和刪除用戶。超級管理員還可進行對管理員的添加、修改和刪除。

管理員添加用戶首先要為用戶分配角色,需要輸入的資料有用戶名、真實姓名、性別、電話、郵箱、初始密碼、地址等。輸入完成后點擊添加用戶按鈕,如果成功就彈出“添加成功”的文本提醒。

管理員點擊修改按鈕可對用戶的密碼和權限進行修改。修改完之后點擊保存,如果保存成功即彈出“修改成功”的文本提醒。

管理員點擊刪除按鈕可刪除此用戶。

管理員賬戶管理界面,如圖6-15和圖6-16所示:

添加圖片注釋,不超過 140 字(可選)

圖6-15管理員添加用戶界面

添加圖片注釋,不超過 140 字(可選)

圖6-16管理員修改用戶界面

修改用戶實現代碼如下:

@RequestMapping("/insertCustomer")

@ResponseBody

public ResponseResult<Void> insertCustomer (

@RequestParam("nickname") String nickname,

@RequestParam("name") String name,

@RequestParam("gender") String gender,

@RequestParam("phone") String phone,

@RequestParam("email") String email,

@RequestParam("password") String password,

@RequestParam("address") String address

) {

ResponseResult<Void> response = new ResponseResult<>();

Customer customer = new Customer();

customer.setCmNickname(nickname);

customer.setCmName(name);

customer.setCmSex(gender);

customer.setCmPhone(phone);

customer.setCmEmail(email);

customer.setCmPassword(password);

customer.setCmAddress(address);

adminService.insertCustomer(customer);

return response;

}

6.6.2量化查看

管理員在“后臺管理”中點擊量化查看按鈕進入量化查看界面,可查看詳細的預約圖表,根據圖表對家政需求和市場進行分析。根據分析結果進行服務類型的變動。

量化查看界面,如圖6-17所示:

添加圖片注釋,不超過 140 字(可選)

圖6-17 量化查看界面

6.6.3管理人員修改密碼

管理員在“后臺管理”中點擊修改密碼按鈕進入修改密碼界面,修改密碼需要輸入原始密碼,如果原始密碼錯誤,將修改失敗;需兩次填寫新密碼,填寫完成后,提交即可修改密碼,密碼修改成功后則系統退出到登錄界面進行重新登錄。

管理員修改密碼界面,如圖6-18所示:

添加圖片注釋,不超過 140 字(可選)

圖6-18 管理員修改密碼界面

其實現代碼如下:

@RequestMapping("/updateUserInfo")

@ResponseBody

public ResponseResult<Void> updateUserInfo (

@RequestParam("id") String id,

@RequestParam("password") String password,

@RequestParam("role") String role,

@RequestParam("status") String status

) {

adminService.updateUserInfo(Integer.parseInt(id), password, Integer.parseInt(role), Integer.parseInt(status));

return new ResponseResult<>();}

6.6.4管理員進行家政人員認證

管理員在“后臺管理”中點擊家政人員認證按鈕進入家政人員認證界面。管理員可對家政人員的信息進行查看、確定驗證和取消驗證。

家政人員認證界面,如圖6-19所示:

添加圖片注釋,不超過 140 字(可選)

圖6-19 家政人員認證界面

第七章 系統測試

7.1系統測試

系統測試在系統的開發過程中一直都是很受大眾關注的一項,哪怕是在最傳統的系統工程項目中,也有一個獨立、明確的測試階段過程。隨著系統BUG的出現以及使用者隨著對系統本質的深刻理解,系統測試的地位也被提升到了前所未有的高度。系統測試不僅局限于系統開發的某一階段,而且已經開始貫穿整個系統開發過程[2]。

7.2系統測試的目的

一個系統的基本功能完成后,就進入系統測試與調試階段。

隨著計算機信息技術不斷發展,系統開發完成后,對于系統的質量要求也是逐漸增高,一個完整的程序設計完成后,最后一步的測試也是非常重要的。在網站投入運營前,對系統的需求分析、設計規范和編碼進行最終評審,是軟件質量的保證和關鍵步驟。系統測試的目的是發現系統運行中的錯誤或不足,只有在系統運行過程中才能進行測試或調試。在整個系統的設計和實現過程中,會出現很多錯誤。錯誤主要有兩種:程序邏輯錯誤和設計思維錯誤。第一種錯誤可以通過發送請求找到,也可以通過查看相應的代碼區域來解決。第二類誤差比較難解決。它需要對系統進行重新分析,并且需要進行很多更改。因此,在設計系統時,耗費了比較長的時間和精力進行系統設計思路的考慮和分析,以避免該類錯誤發生,甚至確保不發生這樣的問題。這樣就降低了后面的代碼實現難度,提高了代碼實現的效率。這同樣是本次畢業設計的難點[16]。

7.3系統測試的步驟

一個設計完整良好的網站在測試時,通常包括以下步驟:

(1)模塊測試:對編碼的檢查就是模塊的測試,也是對系統詳細設計部分所存在的不足和錯誤之處進行的一項測試。發現問題,找出問題。

(2)系統測試:是對整個網站的設計過程,所存在的不足和錯誤碼進行檢測,調試。當然,也會在這個過程中發現系統需求說明中也存在的問題或錯誤。

(3)驗收測試:在這個步驟中,主要是對系統需求說明中出現的不足或者是錯誤碼進行測試。系統是否符合客戶的應用需求,本步的驗收測試也是相當重要的。

(4)測試內容

① 測試首先要考慮其配置環境是否能夠完成測試內容。軟硬件配套設施是符合。

② 系統數據庫的能否正常連接,內容是否完整等。

③ 各個功能模塊頁面的是否能夠正常運行,各功能是否能夠實現并正常應用,數據調用是否正常。

7.4系統功能測試

為了保證系統的質量,在系統完成后對本系統用戶登錄信息管理模塊進行了功能性測試。主要的步驟如下:

表7-1 系統功能測試表

模塊

功能

輸入

輸出

正確輸出

錯誤輸出

系統登錄

用戶登錄

輸入用戶名稱和密碼

進入系統

返回登錄界面

用戶模塊

發布需求

發布家政需求

輸入日期、地點、服務類型、聯系方式等,點擊立即發布按鈕

提示發布成功

提示發布失敗

修改資料

修改個人資料

點擊修改按鈕修改相對應得資料,點擊保存按鈕

提示修改成功

提示修改失敗

修改密碼

修改個人密碼

輸入原密碼和兩次新密碼,點擊修改按鈕

提示修改成功

提示修改失敗

回復留言

回復家政人員的留言

編輯留言,點擊發送按鈕

提示發送成功

提示發送失敗

家政人員模塊

預約申請

對雇主的預約進行申請和應聘

在查看預約的界面點擊申請按鈕

提示申請成功

提示申請失敗

修改資料

修改個人資料

點擊修改按鈕修改相對應的資料,點擊保存按鈕

提示修改成功

提示修改失敗

修改密碼

修改個人密碼

輸入原密碼和兩次新密碼,點擊修改按鈕

提示修改成功

提示修改失敗

回復留言

回復雇主的留言

編輯留言,點擊發送按鈕

提示發送成功

提示發送失敗

管理員模塊

添加用戶

新增用戶

輸入用戶的信息,點擊添加按鈕

提示添加成功

提示添加失敗

刪除用戶

刪除用戶

點擊刪除按鈕

提示刪除成功

提示刪除失敗

修改用戶

修改用戶權限

選擇相對應的權限,點擊修改按鈕

提示修改成功

提示修改失敗

修改密碼

修改個人密碼

輸入原密碼和兩次新密碼,點擊修改按鈕

提示修改成功

提示修改失敗

家政認證

對家政人員的真實信息進行驗證

點擊確定驗證按鈕

提示驗證成功

返回空值

第八章 總結

在這個畢業設計中,我開發了家政服務公司的管理系統。從開始的開題報告到論文的撰寫,我發現了很多問題,解決了很多問題,收獲了非常多。

首先,認識到三層開發模型在系統開發中的重要性,系統開發需要做好需求分析、數據庫分析、工作流分析、過程控制分析。一個系統需求分析的好壞直接影響了系統的優劣,同時對系統的開發進度等有很大的影響。數據庫的設計則關系到系統各個功能的相關實現,在設計數據庫時,要充分明白各個字段的含義,有什么作用,其最合適的數據類型是什么,這對于下面的開發有很大的幫助。工作流和流程的控制分析則有助于更好地了解系統需要實現的功能,以及各個功能實現的先后秩序,在此基礎上才能清楚自己開發的目的和方向。在開發初期,由于對這個的認識不深,導致系統做了一半又停下來重新設計數據庫,既浪費了時間又做了許多的無用功,大大降低了工作的效率。

對于本系統也由于個人能力有限,只實現了部分增、刪、改、查等基本的功能,還不能完全實現一個家政服務管理系統的所有工作流程,例如后期如何進行工資的結算這部分的功能就沒有被體現出來,對于客戶是公司團體還是單個的家庭未作區分,對于JavaScript的一些技術也體現的不多。這些都需要進一步的學習與研究,這也是日后工作和學習努力的方向。另外,在整個開發的過程中,時間也比較倉促,對于系統運營中的細節問題沒有做好充分的調查研究,因此,該系統必然會存在一些缺陷和不足。作為畢業設計,此系統只是一個演示系統,離實用還有很大的距離。敬請大家提出寶貴的意見。

最后,通過此次系統的開發,我體驗到了獨立分析問題、解決問題的巨大魅力,也對JavaScript有了更深入的認識和發現,認識到自己以前在學習方面的不足,今后必將精益求精,充分了解和學習所接觸的知識。

參考文獻

[1]左小娟,白雪梅.發展高端家政服務策略研究[J].經濟研究期刊,2016(16):33-34.?

[2]李艷梅.我國家政服務業的現狀分析與規范建設[J].社會科學家.2008.7

[3]曾偉菁.家政服務與管理[M].北京.北京理工大學出版社,2010

[4]王紅芳.非正規就業—家政服務員權益問題研究[J].重慶大學學報(社會科學版).2008.2

[5]毛志龍.JavaScript與Java在Web開發中的應用及差異[J].科技經濟導刊,2016(26):6-8.?

[6]劉京華等, Java Web 整合開發, 清華大學出版社, 2010. 1

[7](美) Bruce Eckel, Java 編程思想. 陳昊鵬譯, 機械工業出版社, 2007

[8](美) Don Gosselin, 全面理解 JavaScript, 清華大學出版社, 2001. 9

[9][美]Herbert Schidt 著, Java 參考大全, 清華大學出版社, 2006

[10]蔡劍. 景楠, Java Web 應用開發: J2EE 和 Tomcat(第 2 版) , 清華大學出版

社, 2005. 3

[11]陳菁菁, Tomcat 原理與 JavaWeb 系統開發, 清華大學出版社 2009. 7

[12]劉杰.Eclipse下插件的設計方法[J].程序員,2011(5):57-59.?

[13]唐漢明,翟振興,關寶軍,王洪權,黃瀟,深入淺出MYSQL[M],北京:人民郵電出版社,2014:86-88.?

[14]王珊,薩師煊.數據庫系統概論[M].北京.高等教育出版社.第四版,2006

[15]任永功,王政軍.軟件技術與數據庫[J].計算機工程,2013(5):60-62,134.?

[16]張金環,田洪濤.淺析設備軟件測試與質量保證[J].電子工業專用設備,2016(1):39-42.?

致 謝

四年的時光轉瞬即逝,如今已到畢業季,畢業論文在我的大學生涯里是濃妝重彩的一筆。隨著畢業論文的完成,終于讓我在大學的學習和生活中畫下了一個完美的句號。

首先我要感謝我的指導老師趙皚老師,他用全面、具體的指導讓我對一個家政公司的具體流程有了整體的把握,讓我在以后的設計中少走了許多彎路。同時,趙老師淵博的學識、民主而嚴謹的作風,還有負責任的態度使我受益匪淺并終生難忘。并在這一次論文的書寫過程中對我的文檔進行了細致的審查和精確的點評,其認真的精神讓我感觸頗深。在此,我要向他表示衷心的感謝!

論文的順利完成,也要感謝計算機學院所有教過我、指點我的老師們。是你們給予了我良好的學習條件和機遇,教會了我很多專業課知識,身體力行教會了我許多做人的道理,這是我大學階段的寶貴的精神財富,讓我在這四年的大學里,學到了許多有價值的東西。再次,謝謝您們!

感謝培育我,給了我四年充實的大學生活的學校領導及后勤工作者,沒有你們的辛勤付出,就沒有我們安定充實的大學生活。

感謝給過我指點和啟發的著作的學者、那些我參考過文獻資料,而沒有在參考文獻中列出的作者們及各個網絡論壇的前輩們,沒有你們的指點與引導,也不會有論文的順利完成。謝謝你們將知識傳播開來,讓更多的人受益,在以后的學習中,必將學習你們的精神,讓知識在這個美麗的神州大地遍地開花!

最后再次向所有幫助和指導我的老師和同學表示誠摯的感謝!

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/74524.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/74524.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/74524.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

【leetcode hot 100 739】每日溫度

解法一&#xff1a;暴力解法 class Solution {public int[] dailyTemperatures(int[] temperatures) {int ntemperatures.length; // 指向要找下一個更高溫度的地方int[] result new int[n];for(int left0;left<n;left){int rightleft1; // 指向正在找最高溫度的地方wh…

藍橋杯C++基礎算法-0-1背包(優化為一維)

這段代碼實現了0-1 背包問題的動態規劃解法&#xff0c;并且使用了滾動數組來優化空間復雜度。以下是代碼的詳細思路解析&#xff1a; 1. 問題背景 給定 n 個物品&#xff0c;每個物品有其體積 v[i] 和價值 w[i]&#xff0c;以及一個容量為 m 的背包。目標是選擇物品使得總價值…

算法 | 麻雀搜索算法原理,公式,改進算法綜述,應用場景及matlab完整代碼

一、麻雀搜索算法(SSA)原理 1. 算法基礎 麻雀搜索算法(Sparrow Search Algorithm, SSA)是2020年提出的一種群體智能優化算法,靈感來源于麻雀群體的覓食與反捕食行為。算法將麻雀分為三類角色:發現者(Producer):適應度最高,負責探索全局最優區域;加入者(Follower)…

SQL 版本歷史

SQL&#xff08;Structured Query Language&#xff09;是一種用于管理和操作關系數據庫的標準語言。SQL標準由多個組織制定和維護&#xff0c;主要包括以下幾個版本&#xff1a; SQL-86 (SQL-87): 這是SQL的第一個官方標準&#xff0c;由ANSI&#xff08;美國國家標準協會&…

CAT1模塊 EC800M HTTP 使用后續記錄

記錄一下 CAT1 模塊EC800 HTTP 使用后續遇到的問題 by 矜辰所致目錄 前言一、一些功能的完善1.1 新的交互指令添加1.2 連不上網絡處理 二、問題出現三、分析及解決3.1 定位問題3.2 問題分析與解決3.2.1 查看變量在內存中的位置 3.3 數據類型說明3.3.1 常用格式化輸出符號…

單純形法之大M法

1. 問題背景與標準化 在求解某些線性規劃問題時&#xff0c;往往難以直接找到初始的基本可行解。特別是當約束中存在等式或 “≥” 類型的不等式時&#xff0c;我們需要引入人工變量來構造一個初始可行解。 考慮如下標準形式問題&#xff08;假設為最大化問題&#xff09;&am…

Springboot集成Debezium監聽postgresql變更

1.創建springboot項目引入pom <dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>io.debezium</groupI…

報錯 standard_init_linux.go:228: exec user process caused: exec format error

docker logs 容器名 報錯&#xff1a; standard_init_linux.go:228: exec user process caused: exec format error 或者 standard_init_linux.go:228: exec user process caused: input/output error 排查思路 1、檢查源鏡像的框架是否正確&#xff0c;是否amd64&#x…

Go 代理爬蟲

現在注冊&#xff0c;還送15美金注冊獎勵金 --- 亮數據-網絡IP代理及全網數據一站式服務商 使用代理服務器&#xff0c;通過 Colly、Goquery、Selenium 進行網絡爬蟲的基礎示例程序 本倉庫包含兩個分支&#xff1a; basic 分支包含供 Go Proxy Servers 這篇文章改動的基礎代碼…

STM32實現智能溫控系統(暖手寶):PID 算法 + DS18B20+OLED 顯示,[學習 PID 優質項目]

一、項目概述 本文基于 STM32F103C8T6 單片機&#xff0c;設計了一個高精度溫度控制系統。通過 DS18B20 采集溫度&#xff0c;采用位置型 PID 算法控制 PWM 輸出驅動 MOS 管加熱Pi膜&#xff0c;配合 OLED 實時顯示溫度數據。系統可穩定將 PI 膜加熱至 40℃&#xff0c;適用于…

neo4j知識圖譜常用命令

1. 查看所有節點和關系 如果你想查看圖數據庫中的所有節點和關系&#xff0c;可以使用以下查詢&#xff1a; Cypher 深色版本 MATCH (n)-[r]->(m) RETURN n, r, m n 和 m 表示節點。r 表示兩個節點之間的關系。這條命令會返回所有節點及其直接相連的關系。 2. 查看所有節…

從零開始:使用Luatools工具高效燒錄Air780EPM核心板項目的完整指南

本文將深入講解如何使用Luatools工具燒錄一個具體的項目到Air780EPM開發板中。如何使用官方推薦的Luatools工具&#xff08;一款跨平臺、命令行驅動的燒錄利器&#xff09;&#xff0c;通過“環境配置→硬件連接→參數設置→一鍵燒錄”四大步驟&#xff0c;幫助用戶實現Air780E…

2024年認證杯SPSSPRO杯數學建模C題(第二階段)云中的海鹽全過程文檔及程序

2024年認證杯SPSSPRO杯數學建模 C題 云中的海鹽 原題再現&#xff1a; 巴黎氣候協定提出的目標是&#xff1a;在2100年前&#xff0c;把全球平均氣溫相對于工業革命以前的氣溫升幅控制在不超過2攝氏度的水平&#xff0c;并為1.5攝氏度而努力。但事實上&#xff0c;許多之前的…

大疆上云api介紹

概述 目前對于 DJI 無人機接入第三方云平臺,主要是基于 MSDK 開發定制 App,然后自己定義私有上云通信協議連接到云平臺中。這樣對于核心業務是開發云平臺,無人機只是其中一個接入硬件設備的開發者來說,重新基于 MSDK 開發 App 工作量大、成本高,同時還需要花很多精力在無人…

云原生之開源遙測框架OpenTelemetry(在 Gin 框架中使用 OpenTelemetry 進行分布式追蹤和監控)

文章目錄 云原生之開源遙測框架OpenTelemetry背景什么是可觀測性&#xff1f; 什么是 OpenTelemetry&#xff1f;Opentelemetry的主要優勢有以下幾點&#xff1a;理解分布式鏈路日志Spans分布式鏈路 在 Gin 框架中使用 OpenTelemetry 進行分布式追蹤和監控0. 整體思路1. 初始化…

【藍橋杯速成】| 11.回溯 之 子集問題

題目一&#xff1a;子集 問題描述 78. 子集 - 力扣&#xff08;LeetCode&#xff09; 給你一個整數數組 nums &#xff0c;數組中的元素 互不相同 。返回該數組所有可能的子集&#xff08;冪集&#xff09;。 解集 不能 包含重復的子集。你可以按 任意順序 返回解集。 示例…

Nginx目錄結構

Nginx目錄結構 ? Nginx 的安裝目錄結構可能會因安裝方式&#xff08;如使用包管理器、源碼編譯等&#xff09;和操作系統的不同而有所差異。以下是通過在線安裝時&#xff0c;Nginx 默認的目錄結構&#xff0c;以及各目錄和文件的作用。 yum install nginx查詢nginx [rootRo…

2.(vue3.x+vite)使用vue-router

前端技術社區總目錄(訂閱之前請先查看該博客) 效果預覽 路由配置的“/”與“helloWorld”都可以訪問到以下內容 http://10.11.0.87:4000/#/ http://10.11.0.87:4000/#/helloWorld 1:安裝vue-router npm i vue-router 2:創建router文件 在src的目錄下創建router文件夾…

后端返回了 xlsx 文件流,前端怎么下載處理

當后端返回一個 .xlsx 文件流時&#xff0c;前端可以通過 JavaScript 處理這個文件流并觸發瀏覽器下載。 實現步驟 發送請求獲取文件流&#xff1a; 使用 fetch 或 axios 等工具向后端發送請求&#xff0c;確保響應類型設置為 blob&#xff08;二進制數據流&#xff09;。 創建…

HTML5拖拽功能教程

HTML5拖拽功能教程 簡介 HTML5引入了原生拖放(Drag and Drop)API&#xff0c;使開發者能夠輕松實現網頁中的拖拽功能&#xff0c;無需依賴第三方庫。拖拽功能可以大大提升用戶體驗&#xff0c;適用于文件上傳、列表排序、看板系統等多種交互場景。本教程將帶您全面了解HTML拖…