廣東省衛生健康專業高級職稱申報系統跨平臺移動APP技術研究與系統構建

中圖分類號：R311.1文獻標識碼：B

DOI：10.3969/j.issn.1006-1959.2025.09.009 文章編號：1006-1959（2025）09-0054-05

Abstract：Wideetatiosealldeialatiol field，theaaoalalilute systemscurrntlyprmarilyrelyoPplatfos，ndteuserexperienceonmobiledevicesdsimprovementTisstudytakestheGuangdong ProvinceHealthrofeioalnioitpcatoseapleouseaistigobillchyd technologyCapacifreoknQasarFokreeeedcalaslingtaeao mobileappassidndpletedsespeealicaproseessilfloutaiofoatio uploadrelevantduentsndievisultsiealti.eplicatiofobileapsacdtefcydoef theaplicatioprcssprovdgvauablesightsfohegitaliztoprocsinealtaretoutureimproventsldfoco optimizingperfoancestrengtingurityndexpadingoeoneietfuctioalodulestaceserexperceandtifctio

Keywords：Titleapplicationsystem;Cross-platform;MobileApp;Hybridtechnology;Capacitorframework; Quasarframework

隨著信息技術的飛速發展，計算機和互聯網等技術正在深刻地改變著各行各業的運作方式。在醫療領域，衛生健康專業高級職稱作為衡量醫療從業人員專業水平的重要指標之一，其管理和申報過程也逐步受到了信息化的影響。在國內，許多省市已經在衛生健康專業高級職稱評審領域引入計算機網絡技術，以實現自動化、網絡化的評審流程。例如，北京、上海、江蘇等經濟較為發達的地區，已經建立了在線申報系統，讓申報人可以通過電腦端填寫申報信息和上傳掃描件等。然而，這些系統主要以PC電腦端為主，缺乏針對移動設備的用戶界面。

廣東省作為醫療事業的重要省份，其申報與評審系統雖已實現全流程信息化，但申報過程也仍依賴PC端，存在設備限制和操作復雜等問題。移動APP具備便捷、靈活、高效等特點，有望優化申報流程并提升用戶體驗。然而，一直以來，移動終端零碎化等特點，使移動應用開發變得復雜而繁瑣，不僅要應對各種設備大小不一的問題，還要應對各種平臺的原生開發語言各不相同的問題4。在這一背景下，跨平臺移動應用開發技術應運而生。跨平臺開發技術允許開發者使用一套代碼同時構建適用于多個平臺的應用程序，從而達到降本增效的目的。本研究將基于Hybrid技術、Capacitor框架和QuasarFramework[8，探索跨平臺移動應用開發技術在廣東省衛生健康專業高級職稱申報系統中的應用。通過此舉，旨在實現更便捷高效的申報流程，減輕申報人員的操作負擔，提高整體評審系統的用戶滿意度。同時，探索出一種將現有信息系統向移動端拓展的有效方式，推進衛生健康領域的信息化進程，促進醫療衛生行業的現代化發展。

1系統架構與設計

1.1系統總體架構廣東省衛生健康專業高級職稱申報系統移動端APP（以下簡稱移動端APP），位于整個廣東省衛生健康專業高級職稱申報與評審系統三層結構中的表現層，與現有的PC端網頁版單頁應用程序（SPA）共同構成了用戶與系統的交互接口（圖1）。表現層分為前端和后端兩個部分。前端包括現有的PC端網頁應用程序以及本論文所研究的移動端APP。移動端APP采用了基于WebView的Hybrid混合開發技術[]，以實現跨平臺的移動應用。與現有PC端網頁版SPA一樣，移動端APP通過調用后端提供的接口來實現系統功能。后端使用Asp.NetWebAPI技術，為前端提供統一的RESTfulAPI接口。整個系統的整體架構見圖1。

移動端APP的主體代碼是由typescript + Vue.js編寫，采用組件化開發方法1和MVVM構架模式[12]。如圖2所示，分成視圖層（View）視圖模型層（ViewModel）以及模型層（Model）。

1.1.1視圖層視圖層是用戶與應用程序交互的界面，對于移動端應用來說尤為重要。在MVVM模式中，視圖層只負責展示數據，不包含業務邏輯。本研究通過將部分通用的視圖單元封裝成組件，如MySchemaForm、MyMediaContainer、MyPdfViewer等，再在各個頁面中組合使用，使得視圖層的代碼簡潔清晰，便于UI的定制和代碼復用[13]。

1.1.2視圖模型層視圖模型是MVVM模式中的核心部分，它負責將模型層的數據轉化為便于視圖層展示的格式，并處理用戶的交互操作。在本研究的移動端APP中，視圖模型可以處理用戶輸入的文本信息，包括申報人基本信息、教育與工作簡歷、業績成果代表作等；也可以處理用戶輸入的媒體文件，包括論文掃描件、病歷病案掃描件、手術視頻等。同時，視圖模型也負責向服務器端的模型層提交數據和請求數據。視圖模型位于MVVM架構的中間層，向上通過雙向數據綁定與視圖層交互[14，向下通過網絡請求與模型層溝通，從而實現用戶與數據的連接。1.1.3模型層模型層位于服務器端，負責接收前端的請求，并完成相應的業務邏輯處理。在整個大系統中，移動端APP與PC端網頁版應用程序共用同一個模型層，從而保證了數據的一致性。

1.2移動端APP功能模塊

1.2.1用戶賬號管理申報人可以通過APP完成賬號注冊、用戶登錄、重置密碼等操作。

1.2.2創建申報信息由于申報人的申報類別、申報級別、是否免試等情況不同，申報信息的創建過程也會存在差異，因此，APP通過向導的方式，引導用戶完成相應申報信息的創建。

1.2.3填寫基本信息基本信息模塊主要包括以下三個方面信息的填寫。第一，與申報相關的信息，主要包括姓名、身份證號碼、申報職稱名稱、申報專業、申報職稱級別等。第二，與個人相關的信息，主要包括性別、出生日期、出生地、民族、政治面貌、最高學歷、最高學位、現職稱名稱、現職稱專業、取得時間、取得方式等。第三，與現工作相關的信息，主要包括單位名稱、單位屬性、主管部門、參加工作時間、所在科室、現工作崗位、現聘任職稱、職稱受聘時間等。

1.2.4填寫教育與工作簡歷教育與工作簡歷模塊主要包括學歷（學位）教育情況、非學歷教育情況、主要工作簡歷、服務基層工作經歷、援派援外工作經歷、進修情況、指導下級專業技術人員情況等方面信息。用戶可以以列表的形式在APP里完成相關內容的增刪改等操作。

1.2.5填寫和上傳專業能力要求材料專業能力要求材料模塊主要包括專業技術工作總結、病案材料、病歷材料等。其中專業技術工作總結是每個申報人必須填寫的，主要對取得現職稱以來專業技術工作情況進行總結。而病案材料和病歷材料，只要求申報醫療類專業的申報人員提供。

1.2.6填寫和上傳業績成果代表作業績成果代表作模塊主要包括論文信息、著作/譯著、獲獎情況、科研項目、發明專利、專業技術報告、手術操作視頻、人才培養報告、科普作品、標準/規范、其他代表作等方面內容。其中每類代表作都包括基本信息和相關附件，而相關附件根據代表作類別和載體的不同，又可以分為圖片掃描件、PDF文檔、視頻文件等。如論文代表作需要上傳論文原文掃描件和相關佐證材料等，可以是圖片掃描件，也可以是PDF文檔；而手術操作視頻則需要上傳相關的視頻文件。

1.2.7填寫工作負面情況如果存在工作相關負面信息，可以在此模塊錄入，例如是否存在：論著一稿多投、抄襲他人論著、冒用他人項自或署名、利用單位負責人之便占用他人成果、因工作過失受到通報、杜撰實驗數據、工程質量事故、醫療事故、教學事故、嚴重醫患糾紛、前述事故出現傷亡等情況。

1.2.8上傳證件照、證書證明類掃描件申報人可以通過移動端APP上傳證件照，用于評審通過后制作職稱證書。申報人也可以通過APP上傳相關文件要求的各類證書、證明材料掃描件，確保個人申報資料的完整性。

1.2.9相關操作申報人可以通過APP對申報信息進行提交、撤消提交、重置等操作;也可以生成和下載相關表格等。

1.2.10查看相關信息通過移動端APP，申報人可以查看審核結果、答辯相關信息、評審結果、證書編號等信息。

1.3系統流程圖為了更好地展示系統的流程和數據交互，圖3展示了廣東省衛生健康專業高級職稱申報系統移動端APP的申報人申報流程。首先，申報人登錄移動端APP，系統判斷當前用戶是否已經成功創建申報信息，如果還沒創建，則通過向導的方式引導用戶完成申報信息創建；如果已經創建了申報信息，則進人下一步詳細信息填報流程。詳細信息填報流程涉及多個模塊內容，申報人可以分別選擇各個模塊，逐個完成相應模塊的信息填寫和附件上傳工作。當所有模塊的內容都完成填報后，申報人可以點擊“提交\"按鈕完成提交操作。至此，申報人的申報流程已經完成，進入單位審核環節。在等待單位審核過程中，如果申報人發現有疏漏的地方，可以自行“撤消提交”，并在申報時間截止之前完成修改和再次提交操作。值得注意的是，“撤消提交\"操作必須是在單位開始審核之前執行，否則，系統會拒絕撤消操作，以保證系統流程的確定性。

2技術選擇與實現

2.1移動端APP開發技術選擇目前移動端APP主要分為三類：原生應用（NativeAPP）網頁應用（WebAPP）和混合模式移動應用（HybridAPP）[5]。原生應用能提供最佳的性能和用戶體驗，可以充分利用設備的硬件和軟件功能。然而，原生應用需要針對不同平臺進行單獨開發，開發與維護成本最高。網頁應用開發與維護成本最低，然而，在功能、性能和用戶體驗方面卻不如其他兩類應用。混合模式移動應用結合了原生應用和網頁應用的優點，使用Web技術開發界面，同時具備跨平臺性和部分原生功能訪問能力[。

為了更好地實現廣東省衛生健康專業高級職稱申報系統的移動端APP，本研究團隊綜合考慮了跨平臺性、用戶體驗、開發效率和維護成本等因素，最終選擇了基于Hybrid技術的開發方案，基于這個方案，選擇了Capacitor和QuasarFramework作為主要的前端基礎框架。

2.2Capacitor框架Capacitor框架是一個用于構建跨平臺移動應用的開源工具。本研究選擇Capacitor框架作為移動端APP的基礎，因為它提供了與原生API交互的能力，允許APP在需要時訪問設備的硬件功能。例如，通過Capacitor提供的API，本研究移動端APP可以調用手機攝像頭實現申報材料的掃描上傳功能。此外，Capacitor還具有一套豐富的插件，使移動應用項目能夠輕松地集成第三方服務和功能。

2.3QuasarFramework移動端APP的前端部分采用了QuasarFramework，這是一個功能強大、易于使用的，基于Vue.js的跨平臺開發框架[8]。它具有豐富的UI組件、響應式設計、一體化開發工具、跨平臺支持和插件系統等特點，能夠幫助開發者快速構建高質量的跨平臺應用。通過借助QuasarFramework，本研究團隊只需要維護一套前端代碼，即可構建出橫跨多個平臺的應用，不僅簡化了開發流程，還保證了APP在不同設備上的一致性。

2.4后端服務接口移動端APP位于整個廣東省衛生健康專業高級職稱申報與評審系統的表現層，為了保持與現有系統行為的一致性，以及降低開發和維護成本，本研究繼續沿用現有的后端服務。同時，在必要時進行適當的移動端適配。現有的后端服務使用Asp.NetWebAPI技術開發，并遵循RESTful架構，定義了一系列的API端點以供前端調用。通過RESTful架構，前后端可以實現數據的傳輸和交互。在API設計過程中，本研究團隊充分考慮了數據的安全性和一致性，并引入了基于OpenIDcon-nect協議的單點登錄系統，以確保用戶數據得到充分的保護。

2.5數據庫與數據存儲移動端APP的數據存儲與廣東省衛生健康專業高級職稱申報系統的整體數據庫進行了集成。本研究采用了統一的數據庫模式，以確保數據的一致性和準確性。通過Asp.NetWebAPI提供的數據傳輸接口，移動端APP輸入的數據被安全地存儲到數據庫中，并通過數據庫管理工具確保數據的安全備份和可恢復性。

2.6安全性和性能優化在實現過程中，本研究團隊對移動端APP的安全性和性能進行了深人的考慮。在安全性方面，引入了基于OpenIDconnect協議的單點登錄（SSO）系統，以確保用戶的身份認證；并采用加密傳輸安全協議保證數據的傳輸安全[9。在具體實現上，本研究通過集成IdentityServer組件來實現SSO的功能；并且后端全部API服務接口只允許通過HTTPS協議調用，從而保證了用戶數據的安全。在性能方面，本研究團隊通過合理的代碼優化以及多級數據緩存技術2，減少了APP的加載時間和響應延遲，從而保證了良好的用戶體驗。

3應用效果

本研究成功開發了廣東省衛生健康專業高級職稱申報系統的移動端APP。目前已經在實際環境中進行了小范圍試用，并取得了一定的成效。

3.1功能實現移動端APP實現了廣東省衛生健康專業高級職稱申報系統的核心功能，包括申報信息創建、填寫各類信息、上傳相關材料、提交申報、撤消提交以及查看審核結果等。通過移動端APP，申報人可以方便地完成申報流程的各個環節操作，提高了申報效率和操作便捷性。

3.2用戶體驗移動端APP在用戶體驗方面表現出色，不僅界面美觀，而且頁面切換流暢。采用QuasarFramework作為前端基礎框架，保證了應用在不同設備上的一致性和美觀性。同時，通過Hybrid技術的應用，實現了跨平臺的移動應用，使用戶可以在iOS和Android平臺上無縫使用。用戶可以通過簡潔清晰的界面完成申報流程，提高了用戶的滿意度和體驗感。

3.3跨平臺技術的應用與分別針對每個平臺的原生開發不同，本研究實現了一套代碼，多平臺共用，有效地提高了開發效率，降低了開發和維護成本。跨平臺開發技術在本研究項目的成功應用，不僅解決了移動設備上的終端零碎化問題，而且還提高了代碼的可維護性和可測試性，使得系統更加穩定可靠。通過Hybrid技術，開發人員可以利用現有的Web技術來開發移動應用，從而降低了現有信息系統向移動端應用遷移的難度。本研究的移動APP的成功應用，為國內其他地區衛生健康專業職稱申報系統向移動端拓展提供了有價值的參考。

3.4未來優化方向盡管移動端APP取得了一定的成效，但在實際應用中仍然存在一些問題和改進空間。未來，將重點關注以下方面的優化：性能優化：與原生應用相比，基于WebView的HybridAPP在性能上會存在一定損失。通過進一步優化前端代碼，將這部分性能損失降到最低，提升用戶體驗。安全加固：進一步加強移動端APP的安全性，確保用戶數據的安全和隱私保護，防范各類安全風險和攻擊。功能擴展：根據用戶需求和實際情況，逐步擴展移動端APP的功能，提供更多便捷的服務和功能模塊，提高用戶的使用體驗和滿意度。

4總結

移動端APP作為廣東省衛生健康專業高級職稱申報系統的重要組成部分，為申報人提供了便捷高效的申報渠道，減輕了申報人員的操作負擔。混合移動應用跨平臺開發技術在本研究項目的成功應用，為國內其他地區衛生健康專業職稱申報系統向移動端拓展提供了有價值的參考，對衛生健康領域信息化進程具有一定的促進作用。

參考文獻：

[1]北京市衛生健康委員會.北京市衛生健康委員會關于2023年度衛生專業技術人員職稱工作的通知 [EB/OL].（2023-07-21）[2024-04-10].https：//wjw.beijing.gov.cn/zwgk_20040/rsxxzwgk/202307/t20230721_3204067.html.

[2]上海市人力資源和社會保障局.關于2023年度上海市衛生系列高級職稱申報工作的通知 [EB/OL].（2023-07-20）[2024-04-10].https：//rsj.sh.gov.cn/tgjjszwpstz_17412/20230725/t0035_1417274.html.

[3]江蘇省衛生健康委員會.關于開展2023年度全省衛生高級職稱申報評審工作的通知 [EB/OL].（2023-07-26）[2024-04-10].http：//wjw.jiangsu.gov.cn/art/2023/7/26/art_7343_10963450.html.

[4]舒紅梅，符清芳，張艷，等.Flutter框架在前端開發中的應用探析[J].軟件，2022，43（3）：55-58.

[5]周雪.現代跨平臺開發技術在移動終端層面的應用[].現代工業經濟和信息化，2019，9（1）：73-74.

[6]王世昌.一種移動應用跨平臺開發框架的改進與應用[D].北京：北京郵電大學，2021.

[7]Ionic Open Source.Capacitor：Cross-platform Native Run-time for Web Apps[EB/OL].（2024-04-06）[2024-04-10）].https：//capacitorjs.com/docs.

[8]PULSARDEV SRL，Razvan Stoenescu.QUASAR DOCS[EB/OL].（2024-04-06）[2024-04-10].https：//quasar.dev/docs.

[9]杜成龍.基于MVC模式的三層架構研究.軟件，2022，43（6）：100-102.

[10]許佩瑩，禹亮，陳超智.使用混合開發技術快速構建跨平臺移動應用系統[].電信工程技術與標準化，2018，31（3）：65-68.

[11]白富強.基于組件的軟件開發方法探討].信息技術與信息化，2020（10）：28-30.

[12]王存印.基于MVVM模式的多語言前端對照閱讀器的研究和設計[D].北京：北京郵電大學，2023.

[13]于炳虎.基于Android系統的移動應用整體架構分析與設計[].數字技術與應用，2017（1）：133-135.

[14]郭蕊，趙元蘇.Web 前端框架技術綜述[].北京工業職業技術學院學報，2021，20（3）：24-27.

[15]郄小明，閆江華.移動操作系統跨平臺應用開發技術[].電子技術與軟件工程，2020（9）：55-56.

[16]羅宏俊，馮瑞.基于Web技術進行移動應用開發和中間件的研究[].計算機系統應用，2017，26（11）：19-27.

[17]羅勇，趙曉霞.淺析混合移動應用開發模式.中國設備工程，2018（4）：173-174.

[18]王傳政，陳艷秋.智慧移動醫療App的設計與實現[].工業控制計算機，2024，37（2）：140-141，143.

[19]王暉.移動終端環境若干典型協議的安全分析技術研究[D].上海：上海交通大學，2022.

[20]李想，張玉軍，余瑾，等.移動App 性能優化[].電子測試，2021（10）：80-81，106.

收稿日期：2024-04-14;修回日期：2024-04-25

編輯/成森