## 主題配置 - 進入系統點擊右上角可實時修改主題預覽效果   - 該功能主要用于預覽布局效果，建議在生產環境僅為用戶開放部分功能或關閉該功能 - 默認主題及配置修改文件`src/store/modules/theme.js` ```javascript // 以實際代碼為準 theme: { mainTheme: "", // primary light darkmode menuTheme: "darkblue", // 側邊菜單主題 darkblue light dark black navTheme: "light", // 導航欄主題 light darkblue primary black menuWidth: 220, // 側邊菜單寬度 navType: "1", // 導航菜單展示方式 1菜單模式 2單個下拉菜單 3圖標 navShowType: "app", // 下拉菜單展示方式 app圖標 list列表（navType 1、3） showNavMenuIcon: true, // 是否顯示圖標（navType 1） fixNav: false, // 是否固定頂部導航 showFold: true, // 顯示折疊菜單圖標 showLogo: true, // 是否顯示Logo showTags: true, // 是否顯示多標簽 showSearch: true, // 是否顯示搜索菜單 showFooter: true, // 是否顯示頁腳 weakMode: false, // 色弱模式 } ``` ## Logo素材配置替換 - 需準備三種Logo圖片適配各主題配置，替換文件位于`src/assets`下 - `logo-black.png`，黑色文字長方形png格式圖片，亮色主題使用，建議大小比例：204*44px - `logo-white.png`，白色文字長方形png格式圖片，暗色主題使用，建議大小比例：204*44px - `logo-min.png`，純Logo正方形png格式圖片，縮進側邊欄菜單使用，建議大小比例：44*44px  ## 配置首頁（首頁跟隨頂部菜單切換） - 參考修改`src/views/home/home.vue`文件中的代碼，根據當前currNav的值（系統菜單中配置的英文名name）來顯示不同的頁面組件 ``` javascript <div v-show="currNav=='doc'||currNav=='xboot-show'||currNav=='xpay'||currNav=='xmall'"> <h1>我是這些頁面的首頁</h1> </div> <div v-show="currNav=='app'"> <h1>我是XBoot Flutter App的首頁，點擊左側菜單查看詳情</h1> </div> ``` ## 修改Header、Footer頁腳 - Header文件修改位置`src/views/main-components/header.vue` - Footer頁腳文件修改位置`src/views/main-components/footer.vue`