百度智能小程序 社保查詢模板

page-social-security 社保查詢模板

解釋: 針對社保查詢場景的政務(wù)服務(wù)模板，包含賬戶基礎(chǔ)信息、各險種賬戶信息及繳存支出明細等功能，模板支持二次開發(fā)，可根據(jù)實際業(yè)務(wù)需求使用。

示例

前提條件

• 已完成小程序創(chuàng)建。
• 已下載并安裝百度小程序開發(fā)者工具（簡稱 IDE）。

使用說明

• 本示例為小程序前端代碼，可直接在模擬器和真機預(yù)覽。
• 模板中使用的是測試數(shù)據(jù)，開發(fā)者需要從接口中獲取真實的數(shù)據(jù)。
• 頁面模板功能從開發(fā)者工具 v2.25.1-rc 版本開始支持。
• 該模板使用了 es6 語法，需要開啟開發(fā)者工具的增強編譯，操作步驟參看開啟說明；同時也需開啟上傳代碼時樣式自動補全。

使用方式

方式一 【 NPM 】

1. 在小程序根目錄執(zhí)行下方命令，下載頁面模板的 npm 包：

   npm i @smt-ui-template/page-social-security
   

2. 將 /node_modules/@smt-ui-template/page-social-security 下的 @smt-ui-template-page-social-security 文件夾拷貝到當前小程序合適的目錄下 （如pages）:

   .
   ├── project.swan.json
   ├── app.json
   ├── app.js
   ├── pages
       └── @smt-ui-template-page-social-security    // 模板文件
   

3. 在小程序根目錄的 app.json 中配置模板頁面的 path 路徑，查看效果，如：

   {
       "pages": [
           ...
           "pages/@smt-ui-template-page-social-security/pages/index/index",
           "pages/@smt-ui-template-page-social-security/pages/info/info",
           "pages/@smt-ui-template-page-social-security/pages/insurance/insurance",
           "pages/@smt-ui-template-page-social-security/pages/hospital/hospital"
           ...
       ]
   }
   

4. 為了方便在開發(fā)者工具中查看模板頁的效果，可以設(shè)置模板頁為小程序預(yù)覽的首頁。詳情請見自定義編譯文檔。
   

方式二 【 開發(fā)者工具-頁面模板 】

1. 打開開發(fā)者工具，點擊 ”頁面模板“，在下方找到 ”社保查詢模板“，選中該模板后點擊右下角 ”立即使用”，填寫相關(guān)信息點擊右下角 ”完成“ 按鈕。
2. 使用開發(fā)者工具的編輯器或者選擇自己熟悉的編輯器對模板進行二次開發(fā)。

頁面內(nèi)容

模板包含3個頁面：首頁、險種繳存明細頁、個人信息頁。

首頁

頁面路徑：index/index

展示用戶的基礎(chǔ)信息、最近1次繳存情況，包含繳存基數(shù)、個人繳納、單位繳納等，此外首頁還包含各險種繳存明細及個人信息入口。

繳存明細頁

頁面路徑：insurance/insurance

展示用戶某一險種的具體信息，包含賬戶基礎(chǔ)信息、全部歷史繳存記錄、全部歷史支出記錄等。

個人信息頁

頁面路徑：info/info

展示用戶的基礎(chǔ)信息和社保相關(guān)信息，如社保卡號、參保地、參保單位等。

NPM 依賴