《基于web教務(wù)信息管理系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)》9100字（論文）

基于web教務(wù)信息管理系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)摘要隨著初等教育的改革不斷進(jìn)步，學(xué)生數(shù)量保持穩(wěn)定增加，現(xiàn)如今的小學(xué)學(xué)生教務(wù)信息管理體制，依舊主要依賴于文件記錄管理方式，或開放性程度不高、性能不太穩(wěn)定的網(wǎng)站，甚至手寫成長(zhǎng)記錄手冊(cè)等方式。顯然，原有的小學(xué)教務(wù)信息管理方式遠(yuǎn)落后于信息技術(shù)飛速發(fā)展的今天對(duì)社會(huì)發(fā)展的需求。建設(shè)相關(guān)的中小學(xué)教務(wù)信息管理系統(tǒng)，將會(huì)促進(jìn)初等教育的發(fā)展，故本篇文章主要設(shè)計(jì)方向?yàn)榛趙eb小學(xué)教務(wù)信息管理系統(tǒng)手機(jī)端，登錄方向?yàn)閷W(xué)生登錄，學(xué)生賬號(hào)家長(zhǎng)可使用。因此，本文對(duì)小學(xué)教務(wù)信息管理系統(tǒng)進(jìn)行了一個(gè)具體的分析，同時(shí)通過對(duì)其功能結(jié)構(gòu)及流程的設(shè)計(jì)，通過web相關(guān)工具，最后實(shí)現(xiàn)了這款基于web的教務(wù)信息管理系統(tǒng)。本系統(tǒng)從小學(xué)教務(wù)信息管理的實(shí)際需求出發(fā)，設(shè)計(jì)并實(shí)現(xiàn)了學(xué)生角色登錄相關(guān)的功能和結(jié)構(gòu)，增加了溝通平臺(tái)，用戶可在此進(jìn)行互動(dòng)分享等。這一系統(tǒng)的開發(fā)主要目的是使小學(xué)學(xué)校及學(xué)生家長(zhǎng)溝通等管理工作高效化、便捷化，從而有效利用這一系統(tǒng)提供的平臺(tái)，以便教師可以把更多的精力放在管理和監(jiān)督學(xué)生上，實(shí)現(xiàn)教務(wù)信息管理系統(tǒng)的應(yīng)用價(jià)值。關(guān)鍵詞：小學(xué)教務(wù)信息管理；信息管理系統(tǒng)；web目錄TOC\o"1-2"\h\u8232一、引言 頁）一、引言（一）目的和意義教務(wù)信息管理系統(tǒng)是高等學(xué)校教學(xué)及教務(wù)工作的核心。而中小學(xué)在此領(lǐng)域仍處于初級(jí)階段，由于初等教育是我國教育中的奠基石，因此，充分利用計(jì)算機(jī)網(wǎng)絡(luò)信息技術(shù)，構(gòu)建多功能、智能化、便捷化的小學(xué)教務(wù)信息管理系統(tǒng)尤為重要，既可以利用計(jì)算機(jī)網(wǎng)絡(luò)信息技術(shù)進(jìn)行對(duì)教務(wù)工作所涉及的數(shù)據(jù)進(jìn)行處理，廢棄傳統(tǒng)教務(wù)工作的處理事件的形式與方法，為小學(xué)教務(wù)工作管理提供更加詳準(zhǔn)確、規(guī)范、及時(shí)的信息，教務(wù)工作者不在需要拿著筆記本寫上超多本，尋找某些數(shù)據(jù)時(shí)，一本本一篇篇的查找REF_Ref15564\r\h[1]。也就是說，教務(wù)處工作者可以得到肢體解放，并將擁有更多精力和時(shí)間研究學(xué)生心理，并進(jìn)行有效的管理和監(jiān)督，從而使每位教師都可更好的發(fā)揮作用，學(xué)生得到更優(yōu)越的發(fā)展條件。但是，由于小學(xué)生年幼，自主控制力弱，存在諸多不可控因素，故由家長(zhǎng)進(jìn)行監(jiān)督使用，日常使用手機(jī)的頻率要遠(yuǎn)大于電腦的頻率，所以，我選擇設(shè)計(jì)了手機(jī)端，主要使用方式是家長(zhǎng)使用學(xué)生賬號(hào)登錄。同時(shí)，它可以提高小學(xué)現(xiàn)代化管理水平，促使教務(wù)信息管理體制逐步完善，使小學(xué)學(xué)校教務(wù)管理信息化飛速發(fā)展，使小學(xué)教育的教務(wù)模式、日?；顒?dòng)計(jì)劃和工作的關(guān)系等等發(fā)生系統(tǒng)化的變革。實(shí)現(xiàn)小學(xué)教務(wù)信息管理的信息化、系統(tǒng)化、規(guī)范化、無紙化辦公，為小學(xué)教育的長(zhǎng)遠(yuǎn)發(fā)展奠定了良好的基礎(chǔ)REF_Ref15877\r\h[2]。因此，結(jié)合小學(xué)學(xué)校日常工作，研究基于web的小學(xué)生教務(wù)信息管理系統(tǒng)可進(jìn)一步提上日程。（二）開發(fā)背景近年來，高校教務(wù)系統(tǒng)的建設(shè)已經(jīng)大量投入使用，不同部門之間大力配合，極大的提高了工作效率。國內(nèi)教務(wù)信息管理系統(tǒng)技術(shù)雖還存在很多問題，但已趨近成熟，而教務(wù)信息管理系統(tǒng)在此領(lǐng)域的地位也飛速提升REF_Ref15972\r\h[3]。目前的教務(wù)信息管理系統(tǒng)憑借計(jì)算機(jī)、筆記本電腦、ipad和在形式多樣的智能手機(jī)等飛速發(fā)展，逐步完善，滿足人們的需求的基礎(chǔ)上，不斷創(chuàng)新，探討學(xué)習(xí)方式及學(xué)習(xí)資源等活動(dòng)。（三）主要工作本文主要講述一個(gè)基于web的小學(xué)教務(wù)信息管理系統(tǒng)的代碼開發(fā)與各功能頁面的實(shí)現(xiàn)。包括系統(tǒng)開發(fā)時(shí)所涉及的使用哪些相關(guān)技術(shù)進(jìn)行開發(fā)、系統(tǒng)具備哪些功能及所需展示的頁面是怎樣設(shè)計(jì)的、如何使用編碼實(shí)現(xiàn)等幾個(gè)方面。本系統(tǒng)包括學(xué)生登錄用戶角色，根據(jù)其需要進(jìn)行獨(dú)特的功能結(jié)構(gòu)進(jìn)行設(shè)計(jì)，便于用戶進(jìn)行操作，使各部門工作更為方便、簡(jiǎn)潔、快捷。（四）國內(nèi)外現(xiàn)狀國內(nèi)外高校教務(wù)信息管理系統(tǒng)的研究現(xiàn)狀，推進(jìn)了各國政治經(jīng)濟(jì)、科技、生產(chǎn)力以及人們的生活方式。據(jù)了解，發(fā)達(dá)國家非常重視這些技術(shù)對(duì)教育的影響及其作用，對(duì)于這一系統(tǒng)的應(yīng)用，國外的高校早已經(jīng)研究妥善并投入使用，目前國外高校的系統(tǒng)運(yùn)行也處于一種比較完善和穩(wěn)定的階段REF_Ref16080\r\h[4]。雖然國外的高校教務(wù)信息管理系統(tǒng)已逐漸走向成熟并趨于穩(wěn)定，但由于相應(yīng)的教學(xué)模式和各國國情的不同，教學(xué)過程的手段、方法和側(cè)重點(diǎn)的差異，我們還不能完全采用他們所研究的系統(tǒng)模式，只能是在借鑒的基礎(chǔ)上開發(fā)出適合我國教育形式、管理模式的教務(wù)管理系統(tǒng)。近年來，我國也超級(jí)重視教育信息化，并且著重強(qiáng)調(diào)利用信息技術(shù)推進(jìn)教育改革，所以目前我國高校在此領(lǐng)域經(jīng)過了多年的研究，已經(jīng)大量投入使用。各高校的教務(wù)信息管理系統(tǒng)都有其獨(dú)特的特點(diǎn)及功能，需不斷更新順應(yīng)時(shí)代發(fā)展要求，從而實(shí)現(xiàn)符合當(dāng)前教育模式的系統(tǒng)。目前國內(nèi)的一些高校也在積極吸取精華，不斷做大做強(qiáng)，設(shè)計(jì)開發(fā)符合自己理想條件的教務(wù)管理系統(tǒng)。毋庸置疑，更多高校不具備這樣的能力，但總的來說，這一技術(shù)已趨于穩(wěn)定，但在中小學(xué)領(lǐng)域還未涉及。二、相關(guān)技術(shù)HTML、CSS等HTML是使用標(biāo)記標(biāo)簽來描述網(wǎng)頁的，簡(jiǎn)單理解就是構(gòu)成頁面的基本要素，有了HTML中的標(biāo)簽的作用，才有了頁面的基本結(jié)構(gòu)，HTML5是最新的HTML標(biāo)準(zhǔn)，簡(jiǎn)化了web應(yīng)用程序的搭建。CSS指的是層疊樣式表，描述了頁面上顯示的HTML元素以何種形態(tài)展現(xiàn)，如是長(zhǎng)方形、正方形、圓還是橢圓，什么顏色等等眾多樣式都可實(shí)現(xiàn)，通俗來講，就是將HTML進(jìn)行包裝、打扮，呈現(xiàn)出新穎特別的效果，將頁面美化，并且它可以同時(shí)控制多張網(wǎng)頁的布局，只需導(dǎo)入并應(yīng)用相同類名。CSS3是CSS技術(shù)的升級(jí)版本，增加了更多動(dòng)畫效果，使頁面更生動(dòng)活潑，炫酷的視覺化效果。但不同瀏覽器在不同時(shí)間支持不同特性，這也讓跨瀏覽器開發(fā)變得復(fù)雜REF_Ref16168\r\h[5]。JavaScript、jQuery及Element等組件庫JavaScript，也稱Java腳本，是一種具有安全性能的腳本語言，是賦予HTML行為的，如點(diǎn)擊顯示隱藏等，可以達(dá)到一個(gè)很好的交互效果，彌補(bǔ)了HTML的不足，相互取長(zhǎng)補(bǔ)短，可以優(yōu)化頁面效果。jQuery是基于javascript類庫的框架，它里面提供了許多javascript類庫，和一些CSS樣式表的封裝，使用起來比較方便，提倡寫更少的代碼，做更多的事。Element、ECharts等組件庫，設(shè)計(jì)簡(jiǎn)潔直觀的操作流程，語言清晰明確，所設(shè)計(jì)的樣式、結(jié)構(gòu)等與現(xiàn)實(shí)生活的流程、邏輯等基本一致，能夠極大的提高效率，并且減少代碼冗余。Vue、vue-router、AxiosVue是一款流行的JavaScript前端框架，通俗的來講，Vue就是一個(gè)已經(jīng)搭建好的架子，與單純使用jQuery這種庫比，可以更好地利用代碼，是代碼精簡(jiǎn)，減少冗余。實(shí)際上，Vue.js不是一個(gè)框架，是一個(gè)構(gòu)建數(shù)據(jù)驅(qū)動(dòng)的web界面的庫，通過簡(jiǎn)單的API提供高效的數(shù)據(jù)綁定和靈活的組件。在運(yùn)用中，可以使用vue-router實(shí)現(xiàn)頁面切換，而不僅僅是使用超鏈接跳轉(zhuǎn)的方式。實(shí)際兩者差別不大，但對(duì)服務(wù)器來說，這種方式更能提高性能。其中的數(shù)據(jù)，采用的是Axios，它具有攔截請(qǐng)求和響應(yīng)，轉(zhuǎn)換請(qǐng)求數(shù)據(jù)和響應(yīng)數(shù)據(jù)，取消請(qǐng)求，自動(dòng)轉(zhuǎn)換JSON數(shù)據(jù)等優(yōu)點(diǎn)。三、系統(tǒng)分析（一）需求分析系統(tǒng)整體結(jié)構(gòu)LOREM學(xué)生登錄學(xué)生登錄首頁資源共享討論園地我的教務(wù)信息管理系統(tǒng)手機(jī)端圖1系統(tǒng)整體結(jié)構(gòu)圖如圖1所示，本文主要介紹了該小學(xué)教務(wù)信息管理系統(tǒng)手機(jī)端學(xué)生登錄，其中主要有4大主要功能模塊，分別為首頁模塊、討論園地模塊、資源共享模塊和我的模塊，各模塊間相互流暢跳轉(zhuǎn)。由于本系統(tǒng)針對(duì)小學(xué)生而設(shè)計(jì)使用，對(duì)于低年級(jí)學(xué)生，我們采取家長(zhǎng)登錄學(xué)生賬戶模式，高年級(jí)學(xué)生也可以自行登錄，但是不建議學(xué)生自行登錄，最好由家長(zhǎng)陪同使用，會(huì)達(dá)到更好的使用效果。而賬戶是由學(xué)校教務(wù)管理者通過本系統(tǒng)統(tǒng)一構(gòu)建發(fā)布的，個(gè)人沒有注冊(cè)賬號(hào)的權(quán)限，若學(xué)生就讀學(xué)校未購買本系統(tǒng)，則無法使用。只有正確輸入用戶名、密碼，登錄成功后，才可進(jìn)入頁面進(jìn)行使用。目標(biāo)系統(tǒng)能夠提供優(yōu)質(zhì)的用戶界面，頁面跳轉(zhuǎn)流暢，根據(jù)用戶使用設(shè)備的屏幕大小，進(jìn)行自適應(yīng)調(diào)整。由于本系統(tǒng)是小學(xué)生教務(wù)管理系統(tǒng)，故頁面設(shè)計(jì)相關(guān)主題，主要適合小學(xué)生視覺效果，相比較現(xiàn)階段其他教務(wù)系統(tǒng)，頁面較為豐富，避免呆板、沉悶、嚴(yán)肅等形式，選擇了黃綠色作為主打顏色，目的是比較青春活潑，是描述小學(xué)生的顏色，作為手機(jī)頁面，黃綠色相對(duì)比較護(hù)眼。教務(wù)工作者通過本系統(tǒng)進(jìn)行發(fā)布學(xué)?；顒?dòng)、通知，發(fā)布教師評(píng)價(jià)，德育評(píng)價(jià)、考試成績(jī)、活動(dòng)表現(xiàn)等都可進(jìn)行統(tǒng)一發(fā)布、管理。便于家長(zhǎng)或?qū)W生及時(shí)查看，同時(shí)呈現(xiàn)方式更為簡(jiǎn)潔、直觀。本系統(tǒng)本著減少教務(wù)工作人員大量重復(fù)冗雜的工作內(nèi)容、方便家長(zhǎng)使用本系統(tǒng)了解孩子、使用過程操作簡(jiǎn)單的原則，同時(shí)，望欠發(fā)達(dá)地區(qū)能夠有一定經(jīng)濟(jì)條件購買REF_Ref16478\r\h[6]。使得更多孩子的教育跟上時(shí)代發(fā)展，促進(jìn)國家教育發(fā)展。本系統(tǒng)要實(shí)現(xiàn)討論功能。溝通是基礎(chǔ)，如何達(dá)到有效溝通才是關(guān)鍵，而如今，有些言語太過于真實(shí)，礙于面子，大家的溝通都在表象客套，反而影響事情發(fā)展，當(dāng)當(dāng)局者看清問題時(shí)，或許已經(jīng)錯(cuò)過了最佳時(shí)機(jī)，為達(dá)到大家彼此更為真實(shí)、坦誠的溝通，鼓勵(lì)大家說真話，講事實(shí)，采取全匿名討論方式，望更及時(shí)、更快速的達(dá)到和諧溝通的目的，避免彼此誤解引起沖突。本系統(tǒng)擁有資源共享功能，這是一個(gè)什么都可以共享的時(shí)代，用戶使用這個(gè)系統(tǒng)只有一個(gè)目的，全面了解自家的孩子，并使之更加優(yōu)秀。如何教育孩子，應(yīng)該用什么樣的方式、方法和孩子溝通，本質(zhì)都是技巧，我們可以在此系統(tǒng)進(jìn)行共享，匿名溝通交流體會(huì)。這樣就避免有些家長(zhǎng)可能干什么都特別優(yōu)秀，就是教育孩子不太在行，當(dāng)他去請(qǐng)教的時(shí)候，人家都覺得是他謙虛，覺得不可能，致使溝通無效，這樣可以有效解決問題。又或者不知道當(dāng)前應(yīng)該給孩子學(xué)點(diǎn)什么，有經(jīng)驗(yàn)的進(jìn)行分享，可恰當(dāng)采取，避免錯(cuò)過孩子學(xué)習(xí)的最佳時(shí)期。本系統(tǒng)具有較高的運(yùn)行效率、較穩(wěn)定的性能以及較安全的使用環(huán)境，達(dá)到提高工作效率的目的，同時(shí)使用戶使用起來心情舒暢、方便快捷，避免給用戶帶來煩躁、及其惡劣的使用感受。本系統(tǒng)針對(duì)小學(xué)生設(shè)計(jì)，由家長(zhǎng)主導(dǎo)使用，系統(tǒng)中的信息都是學(xué)生的隱私，為了保護(hù)孩子健康成長(zhǎng)，減少不必要的麻煩，加強(qiáng)信息保護(hù)是極為重要的。系統(tǒng)具有良好的可擴(kuò)充性，使其能夠結(jié)合其他應(yīng)用系統(tǒng)，從而使該系統(tǒng)內(nèi)容、結(jié)構(gòu)等更加豐富，使用共享功能不受限制，操作簡(jiǎn)單，跳轉(zhuǎn)更為方便、靈活，避免給用戶帶來枯燥、乏味、煩躁等使用感受。平臺(tái)的設(shè)計(jì)適應(yīng)時(shí)代發(fā)展要求，打破傳統(tǒng)教務(wù)系統(tǒng)的常規(guī)模式，使其使用頻率、活躍度更高，具有一定的超前性、靈活性、豐富性、人化性，常規(guī)、便捷的操作模式。（二）經(jīng)濟(jì)可行性本次開發(fā)所使用的相關(guān)技術(shù)Vue框架、HTML等等都是開源的，由本人一個(gè)人完成，不需要額外支出，購買產(chǎn)品技術(shù)等。代碼的書寫由VisualStudioCode即可完成也是開源的，不產(chǎn)生額外費(fèi)用。運(yùn)行效果由Google瀏覽器運(yùn)行，可以進(jìn)行簡(jiǎn)單調(diào)試，再去更改代碼，就可修復(fù)Bug，所以符合經(jīng)濟(jì)可行性。（三）技術(shù)可行性本系統(tǒng)使用了HTML、JavaScript、Jquery、Vue、vue-router等相關(guān)前端開發(fā)技術(shù)，而這些技術(shù)相對(duì)于前端其他技術(shù)來說，使用起來相對(duì)比較簡(jiǎn)潔、快速的達(dá)到效果，面對(duì)開發(fā)過程中所遇到的問題，也較為方便，邏輯等問題也相對(duì)比較容易處理，面對(duì)難題，方法多樣，可以進(jìn)行多種方式嘗試開放，使得本系統(tǒng)順利開發(fā)完成。所以本系統(tǒng)具有可靠的技術(shù)可行性。四、系統(tǒng)設(shè)計(jì)（一）系統(tǒng)功能的設(shè)計(jì)系統(tǒng)功能的設(shè)計(jì)是此次開發(fā)的一個(gè)重要環(huán)節(jié)，而學(xué)生端登錄是其基礎(chǔ)，可重新設(shè)置密碼，進(jìn)行信息德育評(píng)價(jià)查看、考試成績(jī)查看、活動(dòng)表現(xiàn)成績(jī)查看及修改個(gè)人信息等基本操作。除基本操作外，我還設(shè)計(jì)了討論園地和資源共享功能。討論園地主要就是發(fā)表言論的地方，現(xiàn)如今，家長(zhǎng)和老師的溝通大多數(shù)都是通過微信群聊，就會(huì)造成有些話家長(zhǎng)不好意思在群聊中討論，也不知道如何單獨(dú)和老師溝通，就會(huì)造成溝通不及時(shí)，彼此造成誤解，所以除基本功能外還設(shè)計(jì)了討論園地這個(gè)功能，望各位使用者能夠敞開心扉，及時(shí)溝通。資源共享主要就是分享及獲取共享學(xué)習(xí)資源，家長(zhǎng)會(huì)在一起討論什么書適合給什么階段的孩子看，應(yīng)該怎樣有效和孩子溝通等問題，也存在說了一遍記憶模糊，哪個(gè)網(wǎng)站，哪本書，作者是誰等問題，所以設(shè)計(jì)了一個(gè)專門模塊，用來承載這些鏈接，或是詳細(xì)資料，商品樣式等供大家參考。（二）界面設(shè)計(jì)登錄頁面設(shè)計(jì)圖2學(xué)生端登錄界面如圖2所示，頁面顯示學(xué)生和教師，默認(rèn)選中學(xué)生，因當(dāng)前系統(tǒng)為學(xué)生端，故教師為禁用選項(xiàng)，有記住密碼等功能，登錄成功就會(huì)自動(dòng)進(jìn)行頁面跳轉(zhuǎn)。核心代碼如下：首頁頁面設(shè)計(jì)圖3學(xué)生端登錄首頁界面如圖3所示，主要包括校園活動(dòng)展示、今日作業(yè)的查看、課程表的查看、教師評(píng)價(jià)、通知公告等展示，可點(diǎn)擊跳轉(zhuǎn)進(jìn)行詳細(xì)查看等功能。學(xué)?；顒?dòng)，以首頁輪播形式展現(xiàn)，圖片和標(biāo)題，這種視覺沖擊，更吸引眼球，了解較為直觀。點(diǎn)擊可跳轉(zhuǎn)詳情頁校園活動(dòng)頁面，查看詳細(xì)描述，包括活動(dòng)名稱、活動(dòng)類型、活動(dòng)主體、活動(dòng)日期、活動(dòng)內(nèi)容和注意事項(xiàng)等幾個(gè)方面。點(diǎn)擊頂部返回箭頭可跳轉(zhuǎn)回首頁。這種方式能夠很好的讓家長(zhǎng)和學(xué)生盡快的了解活動(dòng)，并能夠做好提前準(zhǔn)備，面對(duì)活動(dòng)，家長(zhǎng)也能夠及時(shí)給予意見或建議，使孩子能夠更積極、更健康、更陽光的成長(zhǎng)。由于輪播頁面篇幅有限，未能把所有活動(dòng)通知等都展現(xiàn)在輪播上，故部分通知會(huì)在本頁面通知公告中呈現(xiàn)。因首頁展示內(nèi)容過多，篇幅過長(zhǎng)，故設(shè)有返回頂部的按鈕，點(diǎn)擊即可回到頂部。輪播部分核心代碼如下：Json代碼如下：今日作業(yè)、課程表、教師評(píng)價(jià)及通知公告以列表形式展現(xiàn)，家庭作業(yè)是以列表形式，一條一條羅列清晰。課程表是以表格形式，與線下形式一樣，較為直觀。這一設(shè)計(jì)，主要是因?yàn)?，現(xiàn)在的學(xué)生都背一個(gè)超重的書包，把所有的書都裝進(jìn)書包里，有了課程表的隨時(shí)查看，就可以選擇性放進(jìn)書包，家長(zhǎng)也可及時(shí)準(zhǔn)確的了解孩子學(xué)習(xí)的課程，可對(duì)孩子的學(xué)習(xí)合理安排，可點(diǎn)擊更新進(jìn)行部分更新。更新部分核心編碼如下：據(jù)了解，學(xué)生幾乎都有一個(gè)專門的記作業(yè)的作業(yè)本，但是也經(jīng)常會(huì)出現(xiàn)一些同學(xué)記憶模糊，記作業(yè)丟三落四，自己也看不懂自己應(yīng)該完成什么作業(yè)。這時(shí)，家長(zhǎng)在進(jìn)行詢問其他家長(zhǎng)、老師等方式，以確保孩子順利完成作業(yè)。這一過程，會(huì)使家長(zhǎng)比較尷尬，還會(huì)比較生氣，有了這一功能，家長(zhǎng)便可對(duì)孩子的作業(yè)一目了然，便于檢查作業(yè)，也提高了孩子學(xué)習(xí)效率。教師評(píng)價(jià)并不是任何時(shí)候都開放，階段性評(píng)價(jià)，有起止時(shí)間，由于小學(xué)生對(duì)教師的評(píng)價(jià)不夠客觀，故家長(zhǎng)方可輔助完成。學(xué)校教務(wù)工作者為了解情況，會(huì)統(tǒng)一時(shí)間開放，便于統(tǒng)計(jì)和管理。討論園地頁面設(shè)計(jì)圖4學(xué)生端登錄討論園地界面如圖4所示，是指學(xué)生或家長(zhǎng)，主要是家長(zhǎng)，可以想說什么就說什么，包括對(duì)學(xué)校、班級(jí)和教師等提出意見或建議，全過程匿名形式，不顯示昵稱和頭像。這一過程優(yōu)勢(shì)就在于，不是實(shí)名制，面對(duì)微信等App中群聊實(shí)名制情況，這樣的溝通氛圍更為輕松，不拘謹(jǐn)，給大家?guī)硪粋€(gè)和諧的氛圍的同時(shí)，還能有效、快速達(dá)到溝通目的。直觀了解各方面問題所在。討論問題過多，篇幅較長(zhǎng)，故設(shè)計(jì)返回頂部按鈕，點(diǎn)擊即可快速返回頂部發(fā)表內(nèi)容等。也可針對(duì)某一話題進(jìn)行討論，如教師為了解某些情況等，發(fā)布話題討論，學(xué)生和家長(zhǎng)可自行進(jìn)行評(píng)論，也可不發(fā)表言論。討論功能的設(shè)計(jì)就是為了給大家提供一個(gè)說真話的平臺(tái)，及時(shí)溝通。對(duì)他人的評(píng)論可進(jìn)行評(píng)論、回復(fù)、刪除等功能。核心代碼如下：資源共享頁面設(shè)計(jì)圖5學(xué)生端登錄資源共享界面如圖5所示，包括課堂資源和共享資源的發(fā)布及查看等功能。課堂資源的查看，是指教師將課件或錄課通過共享網(wǎng)址的形式，將課件或錄課呈現(xiàn)到本系統(tǒng)，家長(zhǎng)通過網(wǎng)址便可查看其內(nèi)容，這一功能，便于學(xué)生在回家做作業(yè)時(shí)，對(duì)上課時(shí)未消化的知識(shí)點(diǎn)，反復(fù)觀看學(xué)習(xí)，同時(shí)可以及時(shí)鞏固。對(duì)于長(zhǎng)時(shí)間未接觸的知識(shí)點(diǎn)，會(huì)有部分遺忘，有了這一功能，便可隨時(shí)隨地進(jìn)行復(fù)盤。共享資源的發(fā)布、查看及刪除，是指各學(xué)生或家長(zhǎng)可在其課外活動(dòng)中，發(fā)現(xiàn)有意義的、有價(jià)值的鏈接、視頻或書籍等，發(fā)布在此系統(tǒng)，進(jìn)行資源共享，也可查看其他學(xué)生或家長(zhǎng)的分享，同時(shí)教師也可給予意見或建議，可回到討論園地進(jìn)行匿名討論。對(duì)于共享內(nèi)容可進(jìn)行點(diǎn)贊和刪除操作，有助于大家選擇性查看，是否有價(jià)值的一個(gè)互動(dòng)。核心編碼如下：我的頁面設(shè)計(jì)圖6學(xué)生端登錄我的界面如圖6所示，包括個(gè)人信息查看、綜合評(píng)價(jià)統(tǒng)計(jì)圖、德育評(píng)價(jià)查詢、考試成績(jī)查詢、活動(dòng)表現(xiàn)查詢、幫助和反饋、設(shè)置和退出當(dāng)前賬號(hào)，點(diǎn)擊主菜單跳轉(zhuǎn)相對(duì)應(yīng)子菜單頁。個(gè)人信息查看，是點(diǎn)擊我的頁面中姓名下方學(xué)號(hào)部分有下劃線箭頭指引，點(diǎn)擊即可進(jìn)入個(gè)人信息頁面，此頁面包括學(xué)生個(gè)人的基本信息展示，不可進(jìn)行擅自修改，若有疑問及時(shí)聯(lián)系教務(wù)人員，進(jìn)行確認(rèn)協(xié)商，點(diǎn)擊頂部返回箭頭將繼續(xù)跳轉(zhuǎn)到我的頁面。綜合評(píng)價(jià)統(tǒng)計(jì)圖，主要包括德育評(píng)價(jià)、考試成績(jī)、活動(dòng)表現(xiàn)這三個(gè)方面，由于小學(xué)生注重德智體美勞全面發(fā)展，不能單純以文化課考試成績(jī)進(jìn)行培養(yǎng)，故設(shè)計(jì)了多種方面進(jìn)行查看，選擇扇形統(tǒng)計(jì)圖的形式，是因?yàn)楦鞣矫嫠及俜直雀鼮橹庇^。樣式主要使用ECharts圖表組件實(shí)現(xiàn)。統(tǒng)計(jì)圖核心代碼如下：德育評(píng)價(jià)查詢，可查看學(xué)生本學(xué)期的德育記錄，可點(diǎn)擊查看更多德育評(píng)價(jià)，進(jìn)行加載更多德育記錄，以評(píng)價(jià)內(nèi)容、時(shí)間、評(píng)價(jià)人的形式為一條，一條一條的羅列，樣式簡(jiǎn)潔且直觀舒適。Json代碼如下：考試成績(jī)查詢，包括當(dāng)前小測(cè)試和期中期末的考試成績(jī)，可點(diǎn)擊查看更多考試成績(jī)，加載所有錄入本系統(tǒng)的成績(jī)，有助于對(duì)學(xué)習(xí)成績(jī)直觀分析，考試成績(jī)以表格的形式，科目、單科成績(jī)、單科名次、總分及總分名次都將在表格中展示，只可查看本人成績(jī)，不可查看全班成績(jī)。表格展示主要使用Element組件實(shí)現(xiàn)。表格核心代碼如下：Json代碼如下：活動(dòng)表現(xiàn)查詢，是針對(duì)于各活動(dòng)，教師對(duì)學(xué)生的客觀總結(jié)、評(píng)價(jià)及建議，有助于提高學(xué)生能動(dòng)性，活動(dòng)表現(xiàn)可分為優(yōu)良中差等，不能夠以具體分?jǐn)?shù)進(jìn)行評(píng)價(jià)。展示方式為活動(dòng)名稱、活動(dòng)表現(xiàn)、活動(dòng)評(píng)價(jià)、時(shí)間及評(píng)價(jià)人的方式，一條一條羅列出來，可點(diǎn)擊查看更多活動(dòng)表現(xiàn)加載更多活動(dòng)表現(xiàn)。幫助和反饋，是對(duì)該網(wǎng)站的一些基本操作的指引，使用戶在有所疑問時(shí)得到相應(yīng)解決辦法，并提出建議和反饋，使該網(wǎng)站發(fā)展更持久、更深遠(yuǎn)?？砂l(fā)布反饋，但不可查詢反饋內(nèi)容。設(shè)置，點(diǎn)擊我的頁面中設(shè)置可跳轉(zhuǎn)到設(shè)置頁面，點(diǎn)擊頂部返回箭頭即可返回到我的頁面中，設(shè)置頁面包括修改密碼、新消息提醒、勿擾模式、使用指南和關(guān)于我們五個(gè)子選項(xiàng)。修改密碼，需要輸入舊密碼進(jìn)行確認(rèn)，輸入完畢后會(huì)進(jìn)行判斷，提示舊密碼是否正確，輸入新密碼和確認(rèn)新密碼，輸入完畢后，判斷輸入的兩次密碼是否一致，一致則可修改成功。否則，修改失敗。新消息提醒和勿擾模式，樣式都是采用Element按鈕提醒修改。新消息提醒，主要是討論園地會(huì)有不斷的新消息發(fā)布，會(huì)致使用戶敏感，將新消息提醒按鈕點(diǎn)擊變亮，將不會(huì)收到提醒。其他推送就仍就會(huì)收到，不會(huì)錯(cuò)過學(xué)校通知等。勿擾模式，是指按鈕點(diǎn)亮后將不會(huì)收到任何消息。是為了家長(zhǎng)在使用時(shí)，有某些特殊情況避免打擾用戶。使用指南，是使用本系統(tǒng)的指引操作，可隨時(shí)查看。當(dāng)系統(tǒng)更新時(shí)，新的功能操作方法作用等都會(huì)在這里發(fā)布指引，給用戶帶來更佳體驗(yàn)。關(guān)于我們，是對(duì)我們的一個(gè)簡(jiǎn)短介紹，包括版本號(hào)，版本更新等。退出當(dāng)前賬號(hào)，實(shí)則是退出登錄，點(diǎn)擊后將會(huì)跳轉(zhuǎn)到登錄頁面，需進(jìn)行重新登錄。（三）體系結(jié)構(gòu)設(shè)計(jì)體系結(jié)構(gòu)設(shè)計(jì)原則：系統(tǒng)應(yīng)具有良好的適應(yīng)性，由于電子信息行業(yè)更新迭代迅速，用戶使用的電子產(chǎn)品也在不斷更新，故該系統(tǒng)針對(duì)不同屏幕尺寸大小，做出相應(yīng)調(diào)整，給用戶一個(gè)完美體驗(yàn)極為重要。系統(tǒng)應(yīng)具有較好的安全性，當(dāng)今社會(huì)，由于網(wǎng)絡(luò)的迅速發(fā)展，個(gè)人信息泄露時(shí)常發(fā)生，而本系統(tǒng)所針對(duì)的使用人群正是應(yīng)當(dāng)給予恰當(dāng)保護(hù)的學(xué)生群體，一旦信息泄露，不論是在心理上，還是生活上，都會(huì)給該使用人群及其相關(guān)家人造成無法想象的后果及困擾，故該系統(tǒng)應(yīng)對(duì)網(wǎng)絡(luò)安全加強(qiáng)維護(hù)。系統(tǒng)應(yīng)具有良好的可擴(kuò)展性，本系統(tǒng)有一個(gè)資源活動(dòng)管理功能，學(xué)生及家長(zhǎng)可分享學(xué)習(xí)資料等視頻或鏈接，就會(huì)涉及其他App或網(wǎng)頁鏈接的分享，為達(dá)到更好的分享效果，不影響閱讀使用，具有可良好的可擴(kuò)展性是有必要的。五、編碼與實(shí)現(xiàn)系統(tǒng)配置本系統(tǒng)采用vueinitwebpact-simple語法搭建了一個(gè)簡(jiǎn)易的Vue框架，配置vue-router，進(jìn)行路由跳轉(zhuǎn)，以便實(shí)現(xiàn)頁面與頁面之間的跳轉(zhuǎn)。在完善頁面時(shí)，為方便達(dá)到效果，采用了Element和ECharts圖表組件，因此安裝了Element-ui，并引用了ECharts文件，進(jìn)行選擇性使用及修改，為使頁效果最佳，需要有數(shù)據(jù)進(jìn)行支撐，因沒有后端支持，故采用Axios進(jìn)行數(shù)據(jù)模擬，模擬完成后在引入到頁面中，進(jìn)行數(shù)據(jù)渲染。增、刪功能方法的代碼實(shí)現(xiàn)增的功能主要有討論園地的發(fā)表，評(píng)論內(nèi)容的回復(fù)。資源共享中的共享發(fā)布。核心代碼如下：刪的功能主要是討論園地中話題的刪除和資源共享中共享內(nèi)容的刪除。核心代碼如下：六、系統(tǒng)測(cè)試（一）登錄驗(yàn)證測(cè)試登錄時(shí)，正確輸入用戶名和密碼即可登錄。若用戶名或密碼錯(cuò)誤則會(huì)相應(yīng)提示。登錄頁面除此之外無任何可進(jìn)入頁面的入口。在測(cè)試時(shí)未發(fā)現(xiàn)異常。修改密碼測(cè)試在修改密碼時(shí)，首先輸入舊密碼，輸入后會(huì)進(jìn)行判斷，若舊密碼錯(cuò)誤，輸入框會(huì)變紅并附有文字提示。若正確會(huì)有一個(gè)對(duì)勾，隨后是輸入新密碼以及確認(rèn)新密碼，若兩次輸入密碼不一致，輸入框